{
  "name": "input",
  "type": "registry:ui",
  "title": "Input",
  "description": "Input is the standard control for short free-text values, search fields, and compact form data.",
  "registryDependencies": [
    "@siteplane/base"
  ],
  "dependencies": [
    "@base-ui/react@1.5.0"
  ],
  "files": [
    {
      "path": "src/components/ui/input.tsx",
      "type": "registry:ui",
      "content": "\"use client\";\n\nimport { Input as InputPrimitive } from \"@base-ui/react/input\";\nimport type * as React from \"react\";\nimport { cn } from \"@/lib/utils\";\nimport { useResolvedControlSize } from \"@/components/ui/siteplane-provider\";\nimport { surfaceClassNames } from \"@/components/ui/surface\";\n\nexport type InputProps = Omit<\n  InputPrimitive.Props & React.RefAttributes<HTMLInputElement>,\n  \"size\"\n> & {\n  size?: \"sm\" | \"default\" | \"lg\" | \"xl\" | number;\n  variant?: \"default\" | \"soft\";\n  unstyled?: boolean;\n  nativeInput?: boolean;\n};\n\nexport function Input({\n  className,\n  size,\n  variant = \"default\",\n  unstyled = false,\n  nativeInput = false,\n  style,\n  ...props\n}: InputProps): React.ReactElement {\n  const visualSize = typeof size === \"number\" ? undefined : size;\n  const nativeSize = typeof size === \"number\" ? size : undefined;\n  const resolvedSize = useResolvedControlSize(visualSize);\n  const inputClassName = cn(\n    \"h-8.5 w-full min-w-0 rounded-[inherit] px-[calc(--spacing(3)-1px)] leading-8.5 outline-none [transition:background-color_5000000s_ease-in-out_0s] placeholder:text-muted-foreground/72 disabled:cursor-not-allowed sm:h-7.5 sm:leading-7.5\",\n    resolvedSize === \"sm\" &&\n      \"h-7.5 px-[calc(--spacing(2.5)-1px)] leading-7.5 sm:h-6.5 sm:leading-6.5\",\n    resolvedSize === \"lg\" && \"h-9.5 leading-9.5 sm:h-8.5 sm:leading-8.5\",\n    resolvedSize === \"xl\" &&\n      \"h-13.5 px-[calc(--spacing(4)-1px)] leading-6 sm:h-13.5 sm:leading-6\",\n    props.type === \"search\" &&\n      \"[&::-webkit-search-cancel-button]:appearance-none [&::-webkit-search-decoration]:appearance-none [&::-webkit-search-results-button]:appearance-none [&::-webkit-search-results-decoration]:appearance-none\",\n    props.type === \"file\" &&\n      \"text-muted-foreground file:me-3 file:bg-transparent file:font-medium file:text-foreground file:text-sm\",\n  );\n  const nativeInputProps = props as React.ComponentProps<\"input\">;\n  const nativeInputStyle =\n    typeof style !== \"function\" && style !== undefined ? { style } : {};\n\n  // Ein hidden-Input traegt nur Formulardaten und darf keine sichtbare\n  // Huelle erzeugen - der span-Wrapper wuerde sonst als leere Flaeche rendern.\n  if (props.type === \"hidden\") {\n    return <input {...nativeInputProps} type=\"hidden\" {...nativeInputStyle} />;\n  }\n\n  return (\n    <span\n      className={\n        cn(\n          !unstyled &&\n            (variant === \"soft\"\n              ? surfaceClassNames.formControlSoft\n              : surfaceClassNames.formControl),\n          !unstyled &&\n            \"has-autofill:bg-foreground/4 dark:has-autofill:bg-foreground/8\",\n          !unstyled && resolvedSize === \"xl\" && \"text-base sm:text-base\",\n          className,\n        ) || undefined\n      }\n      data-size={resolvedSize}\n      data-slot=\"input-control\"\n      data-variant={variant}\n    >\n      {nativeInput ? (\n        <input\n          {...nativeInputProps}\n          className={inputClassName}\n          data-slot=\"input\"\n          size={nativeSize}\n          {...nativeInputStyle}\n        />\n      ) : (\n        <InputPrimitive\n          className={inputClassName}\n          data-slot=\"input\"\n          size={nativeSize}\n          style={style}\n          {...props}\n        />\n      )}\n    </span>\n  );\n}\n\nexport { InputPrimitive };\n"
    }
  ],
  "categories": [
    "form-controls"
  ],
  "docs": "# Input\n\n> Siteplane UI release `0.1.1`.\n\n## Public Purpose\n\nInput is the standard control for short free-text values, search fields, and\ncompact form data.\n\n## Import\n\n`import { Input } from \"@/components/ui/input\";`\n\n## Public API\n\n- Use native input props for value, type, autocomplete, required, disabled, and\n  form participation.\n- `variant=\"soft\"` provides the borderless search and filter surface.\n- Visual `size` accepts Siteplane control sizes and otherwise inherits\n  `SiteplaneUIProvider controlSize`; the numeric native HTML `size`\n  attribute remains a width hint.\n- `size=\"xl\"` uses the customer-facing single-line field format: 56px outer\n  height, 16px/24px input text and 16px horizontal inset including the border.\n  Pair it with a surrounding `SiteplaneUIProvider radius=\"sm\"` for the global\n  8px main corner; size itself never overrides radius.\n- Use Input Group for tightly connected icons, units, shortcuts, or actions.\n\n## Public Motion\n\n- Input does not translate or scale.\n- Focus remains visible through the native border, surface, ring, and shadow\n  contract.\n- Disabled and invalid state do not change dimensions.\n\n## Public Accessibility\n\n- Use a visible label in product forms; placeholder text is supporting context,\n  not a label.\n- Connect invalid state to the Input and render a visible FieldError.\n- Keep browser autocomplete and input type appropriate to the value.\n- File inputs remain the Input primitive with the native file input behavior.\n\n## Public Agent Guidance\n\n- Use Input for free text and Select for a closed option set.\n- Do not use placeholder-only labels.\n- Preserve native focus, disabled, invalid, and form semantics.\n\n## Public Links\n\n- [Documentation and preview](https://ui.siteplane.io/docs/components/form-controls/input)\n\n- [Registry source](https://ui.siteplane.io/r/input.json)\n",
  "meta": {
    "siteplane:agentContractVersion": 1,
    "siteplane:docs": "https://ui.siteplane.io/docs/components/form-controls/input",
    "siteplane:releaseVersion": "0.1.1",
    "siteplane:sourceOwned": true
  },
  "devDependencies": []
}