{
  "$schema": "https://ui.shadcn.com/schema/registry-item.json",
  "name": "number-field",
  "type": "registry:ui",
  "title": "Number Field",
  "description": "A number field component",
  "dependencies": [
    "solid-js",
    "@kobalte/core"
  ],
  "files": [
    {
      "path": "src/registry/ui/number-field.tsx",
      "content": "import type { Component, ComponentProps, JSX, ValidComponent } from \"solid-js\"\nimport { Show, splitProps } from \"solid-js\"\n\nimport * as NumberFieldPrimitive from \"@kobalte/core/number-field\"\nimport type { PolymorphicProps } from \"@kobalte/core/polymorphic\"\n\nimport { cn } from \"~/lib/utils\"\n\nconst NumberField = NumberFieldPrimitive.Root\n\nconst NumberFieldGroup: Component<ComponentProps<\"div\">> = (props) => {\n  const [local, others] = splitProps(props, [\"class\"])\n  return (\n    <div\n      class={cn(\n        \"relative rounded-md focus-within:ring-2 focus-within:ring-ring focus-within:ring-offset-2\",\n        local.class\n      )}\n      {...others}\n    />\n  )\n}\n\ntype NumberFieldLabelProps<T extends ValidComponent = \"label\"> =\n  NumberFieldPrimitive.NumberFieldLabelProps<T> & {\n    class?: string | undefined\n  }\n\nconst NumberFieldLabel = <T extends ValidComponent = \"label\">(\n  props: PolymorphicProps<T, NumberFieldLabelProps<T>>\n) => {\n  const [local, others] = splitProps(props as NumberFieldLabelProps, [\"class\"])\n  return (\n    <NumberFieldPrimitive.Label\n      class={cn(\n        \"text-sm font-medium leading-none peer-disabled:cursor-not-allowed peer-disabled:opacity-70\",\n        local.class\n      )}\n      {...others}\n    />\n  )\n}\n\ntype NumberFieldInputProps<T extends ValidComponent = \"input\"> =\n  NumberFieldPrimitive.NumberFieldInputProps<T> & {\n    class?: string | undefined\n  }\n\nconst NumberFieldInput = <T extends ValidComponent = \"input\">(\n  props: PolymorphicProps<T, NumberFieldInputProps<T>>\n) => {\n  const [local, others] = splitProps(props as NumberFieldInputProps, [\"class\"])\n  return (\n    <NumberFieldPrimitive.Input\n      class={cn(\n        \"flex h-10 w-full rounded-md border border-input bg-transparent px-3 py-2 text-sm ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium placeholder:text-muted-foreground focus-visible:outline-none disabled:cursor-not-allowed disabled:opacity-50 data-[invalid]:border-error-foreground data-[invalid]:text-error-foreground\",\n        local.class\n      )}\n      {...others}\n    />\n  )\n}\n\ntype NumberFieldIncrementTriggerProps<T extends ValidComponent = \"button\"> =\n  NumberFieldPrimitive.NumberFieldIncrementTriggerProps<T> & {\n    class?: string | undefined\n    children?: JSX.Element\n  }\n\nconst NumberFieldIncrementTrigger = <T extends ValidComponent = \"button\">(\n  props: PolymorphicProps<T, NumberFieldIncrementTriggerProps<T>>\n) => {\n  const [local, others] = splitProps(props as NumberFieldIncrementTriggerProps, [\n    \"class\",\n    \"children\"\n  ])\n  return (\n    <NumberFieldPrimitive.IncrementTrigger\n      class={cn(\n        \"absolute right-1 top-1 inline-flex size-4 items-center justify-center\",\n        local.class\n      )}\n      {...others}\n    >\n      <Show\n        when={local.children}\n        fallback={\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            class=\"size-4\"\n          >\n            <path d=\"M6 15l6 -6l6 6\" />\n          </svg>\n        }\n      >\n        {(children) => children()}\n      </Show>\n    </NumberFieldPrimitive.IncrementTrigger>\n  )\n}\n\ntype NumberFieldDecrementTriggerProps<T extends ValidComponent = \"button\"> =\n  NumberFieldPrimitive.NumberFieldDecrementTriggerProps<T> & {\n    class?: string | undefined\n    children?: JSX.Element\n  }\n\nconst NumberFieldDecrementTrigger = <T extends ValidComponent = \"button\">(\n  props: PolymorphicProps<T, NumberFieldDecrementTriggerProps<T>>\n) => {\n  const [local, others] = splitProps(props as NumberFieldDecrementTriggerProps, [\n    \"class\",\n    \"children\"\n  ])\n  return (\n    <NumberFieldPrimitive.DecrementTrigger\n      class={cn(\n        \"absolute bottom-1 right-1 inline-flex size-4 items-center justify-center\",\n        local.class\n      )}\n      {...others}\n    >\n      <Show\n        when={local.children}\n        fallback={\n          <svg\n            xmlns=\"http://www.w3.org/2000/svg\"\n            viewBox=\"0 0 24 24\"\n            fill=\"none\"\n            stroke=\"currentColor\"\n            stroke-width=\"2\"\n            stroke-linecap=\"round\"\n            stroke-linejoin=\"round\"\n            class=\"size-4\"\n          >\n            <path d=\"M6 9l6 6l6 -6\" />\n          </svg>\n        }\n      >\n        {(children) => children()}\n      </Show>\n    </NumberFieldPrimitive.DecrementTrigger>\n  )\n}\n\ntype NumberFieldDescriptionProps<T extends ValidComponent = \"div\"> =\n  NumberFieldPrimitive.NumberFieldDescriptionProps<T> & {\n    class?: string | undefined\n  }\n\nconst NumberFieldDescription = <T extends ValidComponent = \"div\">(\n  props: PolymorphicProps<T, NumberFieldDescriptionProps<T>>\n) => {\n  const [local, others] = splitProps(props as NumberFieldDescriptionProps, [\"class\"])\n  return (\n    <NumberFieldPrimitive.Description\n      class={cn(\"text-sm text-muted-foreground\", local.class)}\n      {...others}\n    />\n  )\n}\n\ntype NumberFieldErrorMessageProps<T extends ValidComponent = \"div\"> =\n  NumberFieldPrimitive.NumberFieldErrorMessageProps<T> & {\n    class?: string | undefined\n  }\n\nconst NumberFieldErrorMessage = <T extends ValidComponent = \"div\">(\n  props: PolymorphicProps<T, NumberFieldErrorMessageProps<T>>\n) => {\n  const [local, others] = splitProps(props as NumberFieldErrorMessageProps, [\"class\"])\n  return (\n    <NumberFieldPrimitive.ErrorMessage\n      class={cn(\"text-sm text-error-foreground\", local.class)}\n      {...others}\n    />\n  )\n}\n\nexport {\n  NumberField,\n  NumberFieldGroup,\n  NumberFieldLabel,\n  NumberFieldInput,\n  NumberFieldIncrementTrigger,\n  NumberFieldDecrementTrigger,\n  NumberFieldDescription,\n  NumberFieldErrorMessage\n}\n",
      "type": "registry:ui"
    }
  ]
}