{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "input-affix",
  "type": "registry:ui",
  "title": "Input affix",
  "description": "A text input with leading and trailing slots for icons, units or buttons, sharing one focus ring and invalid state across the field. Tailwind styled.",
  "dependencies": [],
  "registryDependencies": [
    "https://ui.minidev.pro/r/input.json",
    "utils"
  ],
  "files": [
    {
      "path": "registry/ui/input-affix.tsx",
      "type": "registry:ui",
      "target": "components/ui/input-affix.tsx",
      "content": "\"use client\"\n\nimport * as React from \"react\"\nimport { cn } from \"@/lib/utils\"\nimport { Input, type InputProps } from \"@/components/ui/input\"\n\ntype InputAffixProps = InputProps & {\n  leading?: React.ReactNode\n  trailing?: React.ReactNode\n  containerClassName?: string\n}\n\nfunction InputAffix({\n  className,\n  containerClassName,\n  leading,\n  trailing,\n  size = \"default\",\n  disabled,\n  ...props\n}: InputAffixProps) {\n  return (\n    <div\n      data-slot=\"input-affix\"\n      className={cn(\n        \"flex w-full items-center rounded-lg border border-border bg-surface shadow-highlight\",\n        \"transition-[border-color,box-shadow] duration-[70ms]\",\n        \"focus-within:border-accent focus-within:ring-2 focus-within:ring-accent focus-within:ring-offset-2 focus-within:ring-offset-bg\",\n        \"has-[[aria-invalid=true]]:border-danger\",\n        disabled && \"opacity-50\",\n        size === \"sm\" && \"h-8\",\n        size === \"default\" && \"h-9\",\n        size === \"lg\" && \"h-11\",\n        containerClassName\n      )}\n    >\n      {leading ? (\n        <span className=\"flex shrink-0 items-center pl-3 text-fg-muted [&_svg]:size-4\">\n          {leading}\n        </span>\n      ) : null}\n      <Input\n        disabled={disabled}\n        size={size}\n        className={cn(\n          \"h-full border-0 shadow-none focus-visible:ring-0 focus-visible:ring-offset-0\",\n          leading && \"pl-2\",\n          trailing && \"pr-2\",\n          className\n        )}\n        {...props}\n      />\n      {trailing ? (\n        <span className=\"flex shrink-0 items-center pr-3 text-fg-muted [&_svg]:size-4\">\n          {trailing}\n        </span>\n      ) : null}\n    </div>\n  )\n}\n\nexport { InputAffix }\n"
    }
  ]
}