{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "number-field",
  "title": "Number Field",
  "description": "A neumorphic number input with increment and decrement buttons.",
  "dependencies": ["@base-ui/react", "@phosphor-icons/react"],
  "registryDependencies": ["utils"],
  "files": [
    {
      "path": "src/components/ui/number-field.tsx",
      "content": "\"use client\";\n\nimport * as React from \"react\";\nimport { NumberField as BaseNumberField } from \"@base-ui/react/number-field\";\nimport { Minus, Plus } from \"@phosphor-icons/react/dist/ssr\";\nimport { cn } from \"@/lib/utils\";\n\nconst NumberField = React.forwardRef<\n  React.ElementRef<typeof BaseNumberField.Root>,\n  React.ComponentPropsWithoutRef<typeof BaseNumberField.Root>\n>(({ className, ...props }, ref) => (\n  <BaseNumberField.Root\n    ref={ref}\n    className={cn(\"flex flex-col gap-1.5\", className)}\n    {...props}\n  />\n));\nNumberField.displayName = \"NumberField\";\n\nconst NumberFieldGroup = React.forwardRef<\n  React.ElementRef<typeof BaseNumberField.Group>,\n  React.ComponentPropsWithoutRef<typeof BaseNumberField.Group>\n>(({ className, ...props }, ref) => (\n  <BaseNumberField.Group\n    ref={ref}\n    className={cn(\n      \"flex items-center gap-2 bg-surface shadow-neu-inset rounded-lg p-1\",\n      className,\n    )}\n    {...props}\n  />\n));\nNumberFieldGroup.displayName = \"NumberFieldGroup\";\n\nconst NumberFieldInput = React.forwardRef<\n  React.ElementRef<typeof BaseNumberField.Input>,\n  React.ComponentPropsWithoutRef<typeof BaseNumberField.Input>\n>(({ className, ...props }, ref) => (\n  <BaseNumberField.Input\n    ref={ref}\n    className={cn(\n      \"flex-1 bg-transparent text-foreground placeholder:text-foreground/50 border-none outline-none text-center h-10 w-full min-w-0 text-base font-medium\",\n      \"focus:outline-none focus:ring-0\",\n      \"[appearance:textfield] [&::-webkit-outer-spin-button]:appearance-none [&::-webkit-inner-spin-button]:appearance-none\",\n      \"data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed\",\n      className,\n    )}\n    {...props}\n  />\n));\nNumberFieldInput.displayName = \"NumberFieldInput\";\n\nconst NumberFieldIncrement = React.forwardRef<\n  React.ElementRef<typeof BaseNumberField.Increment>,\n  React.ComponentPropsWithoutRef<typeof BaseNumberField.Increment>\n>(({ className, children, ...props }, ref) => (\n  <BaseNumberField.Increment\n    ref={ref}\n    className={cn(\n      \"flex items-center justify-center h-10 w-10 shrink-0 select-none rounded-md bg-surface text-foreground shadow-neu-sm outline-none transition-all duration-200\",\n      \"hover:brightness-105 active:shadow-neu-pressed\",\n      \"focus-visible:outline-2 focus-visible:outline-primary focus-visible:outline-offset-2\",\n      \"data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed data-[disabled]:active:shadow-neu-sm\",\n      className,\n    )}\n    {...props}\n  >\n    {children ?? <Plus className=\"h-4 w-4\" weight=\"bold\" />}\n  </BaseNumberField.Increment>\n));\nNumberFieldIncrement.displayName = \"NumberFieldIncrement\";\n\nconst NumberFieldDecrement = React.forwardRef<\n  React.ElementRef<typeof BaseNumberField.Decrement>,\n  React.ComponentPropsWithoutRef<typeof BaseNumberField.Decrement>\n>(({ className, children, ...props }, ref) => (\n  <BaseNumberField.Decrement\n    ref={ref}\n    className={cn(\n      \"flex items-center justify-center h-10 w-10 shrink-0 select-none rounded-md bg-surface text-foreground shadow-neu-sm outline-none transition-all duration-200\",\n      \"hover:brightness-105 active:shadow-neu-pressed\",\n      \"focus-visible:outline-2 focus-visible:outline-primary focus-visible:outline-offset-2\",\n      \"data-[disabled]:opacity-50 data-[disabled]:cursor-not-allowed data-[disabled]:active:shadow-neu-sm\",\n      className,\n    )}\n    {...props}\n  >\n    {children ?? <Minus className=\"h-4 w-4\" weight=\"bold\" />}\n  </BaseNumberField.Decrement>\n));\nNumberFieldDecrement.displayName = \"NumberFieldDecrement\";\n\nexport {\n  NumberField,\n  NumberFieldGroup,\n  NumberFieldInput,\n  NumberFieldIncrement,\n  NumberFieldDecrement,\n};\n",
      "type": "registry:ui"
    }
  ],
  "type": "registry:ui"
}