SpinnerInputGroup() — ui Function Reference

Architecture documentation for the SpinnerInputGroup() function in spinner-input-group.tsx from the ui codebase.

Function tsx DocumentationAtlas SearchAPI

Entity Profile

DocumentationAtlas→ SearchAPI→ SpinnerInputGroup() — ui Function Reference

Dependency Diagram

graph TD
  ce2dd661_101d_2208_8070_cdcc425c8c7b["SpinnerInputGroup()"]
  23713d66_e9a3_36ad_f6ea_a800268fe9fe["spinner-input-group.tsx"]
  ce2dd661_101d_2208_8070_cdcc425c8c7b -->|defined in| 23713d66_e9a3_36ad_f6ea_a800268fe9fe
  style ce2dd661_101d_2208_8070_cdcc425c8c7b fill:#6366f1,stroke:#818cf8,color:#fff

Relationship Graph

Source Code

apps/v4/examples/radix/spinner-input-group.tsx lines 11–32

export function SpinnerInputGroup() {
  return (
    <div className="flex w-full max-w-md flex-col gap-4">
      <InputGroup>
        <InputGroupInput placeholder="Send a message..." disabled />
        <InputGroupAddon align="inline-end">
          <Spinner />
        </InputGroupAddon>
      </InputGroup>
      <InputGroup>
        <InputGroupTextarea placeholder="Send a message..." disabled />
        <InputGroupAddon align="block-end">
          <Spinner /> Validating...
          <InputGroupButton className="ml-auto" variant="default">
            <ArrowUpIcon />
            <span className="sr-only">Send</span>
          </InputGroupButton>
        </InputGroupAddon>
      </InputGroup>
    </div>
  )
}