{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "input",
  "type": "registry:ui",
  "title": "Input",
  "description": "An accessible React text input with three sizes and clear invalid, disabled and file states, built on a native input.",
  "author": "FewTone <https://fewtone.com>",
  "dependencies": [
    "class-variance-authority@^0.7.1"
  ],
  "registryDependencies": [
    "https://ui.fewtone.com/r/tokens.json"
  ],
  "files": [
    {
      "path": "registry/fewtone/ui/input.tsx",
      "type": "registry:ui",
      "content": "import { cn } from \"@/lib/utils\";\nimport { cva, type VariantProps } from \"class-variance-authority\";\nimport type { ComponentProps } from \"react\";\n\nconst inputVariants = cva(\n  [\n    \"flex w-full min-w-0 rounded-lg border border-input bg-transparent px-3 text-sm text-foreground shadow-xs\",\n    \"transition duration-(--duration-fast) ease-out\",\n    \"placeholder:text-muted-foreground\",\n    \"outline-ring focus-visible:border-ring focus-visible:outline-(length:--focus-ring-width) focus-visible:outline-offset-(--focus-ring-offset)\",\n    \"aria-invalid:border-destructive aria-invalid:outline-destructive\",\n    \"disabled:cursor-not-allowed disabled:opacity-(--opacity-disabled)\",\n    \"file:me-3 file:h-full file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground\",\n  ],\n  {\n    variants: {\n      size: {\n        sm: \"h-(--size-control-sm) rounded-md px-2.5\",\n        md: \"h-(--size-control-md)\",\n        lg: \"h-(--size-control-lg)\",\n      },\n    },\n    defaultVariants: { size: \"md\" },\n  },\n);\n\n/** `size` is the height variant here, so the native numeric `size` attribute is left out */\nexport type InputProps = Omit<ComponentProps<\"input\">, \"size\"> & VariantProps<typeof inputVariants>;\n\n/**\n * A text field. Pair it with a visible label (`<label htmlFor>`), and set `aria-invalid` with an\n * error message linked through `aria-describedby` when the value is wrong.\n */\nfunction Input({ className, size, type = \"text\", ...props }: InputProps) {\n  return (\n    <input\n      data-slot=\"input\"\n      data-size={size ?? \"md\"}\n      type={type}\n      className={cn(inputVariants({ size }), className)}\n      {...props}\n    />\n  );\n}\n\nexport { Input, inputVariants };\n"
    }
  ],
  "categories": [
    "forms"
  ],
  "docs": "Usage and examples: https://ui.fewtone.com/components/input"
}
