{
  "name": "pin-input",
  "type": "registry:ui",
  "dependencies": [
    "@vueuse/core",
    "reka-ui"
  ],
  "registryDependencies": [],
  "files": [
    {
      "path": "ui/pin-input/PinInput.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\" generic=\"Type extends 'text' | 'number' = 'text'\">\nimport type { PinInputRootEmits, PinInputRootProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { PinInputRoot, useForwardPropsEmits } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = withDefaults(defineProps<PinInputRootProps<Type> & { class?: HTMLAttributes[\"class\"] }>(), {\n  otp: true,\n})\nconst emits = defineEmits<PinInputRootEmits<Type>>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwarded = useForwardPropsEmits(delegatedProps, emits)\n</script>\n\n<template>\n  <PinInputRoot\n    :otp=\"props.otp\"\n    data-slot=\"pin-input\"\n    v-bind=\"forwarded\" :class=\"cn('flex items-center gap-2 has-disabled:opacity-50 disabled:cursor-not-allowed', props.class)\"\n  >\n    <slot />\n  </PinInputRoot>\n</template>\n"
    },
    {
      "path": "ui/pin-input/PinInputGroup.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { PrimitiveProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { Primitive, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<PrimitiveProps & { class?: HTMLAttributes[\"class\"] }>()\nconst delegatedProps = reactiveOmit(props, \"class\")\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <Primitive\n    data-slot=\"pin-input-group\"\n    v-bind=\"forwardedProps\"\n    :class=\"cn('flex items-center', props.class)\"\n  >\n    <slot />\n  </Primitive>\n</template>\n"
    },
    {
      "path": "ui/pin-input/PinInputSeparator.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { PrimitiveProps } from \"reka-ui\"\nimport { Primitive, useForwardProps } from \"reka-ui\"\nimport { IconPlaceholder } from \"@/components/docs/icon-placeholder\"\n\nconst props = defineProps<PrimitiveProps>()\nconst forwardedProps = useForwardProps(props)\n</script>\n\n<template>\n  <Primitive\n    data-slot=\"pin-input-separator\"\n    v-bind=\"forwardedProps\"\n  >\n    <slot>\n      <IconPlaceholder lucide=\"MinusIcon\" tabler=\"IconMinus\" hugeicons=\"Minus01Icon\" phosphor=\"MinusIcon\" remixicon=\"RiSubtractLine\" />\n    </slot>\n  </Primitive>\n</template>\n"
    },
    {
      "path": "ui/pin-input/PinInputSlot.vue",
      "type": "registry:ui",
      "content": "<script setup lang=\"ts\">\nimport type { PinInputInputProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { PinInputInput, useForwardProps } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\nconst props = defineProps<PinInputInputProps & { class?: HTMLAttributes[\"class\"] }>()\n\nconst delegatedProps = reactiveOmit(props, \"class\")\n\nconst forwardedProps = useForwardProps(delegatedProps)\n</script>\n\n<template>\n  <PinInputInput\n    data-slot=\"pin-input-slot\"\n    v-bind=\"forwardedProps\"\n    :class=\"cn('border-input focus:border-ring focus:ring-ring/50 focus:aria-invalid:ring-destructive/20 dark:bg-input/30 dark:focus:aria-invalid:ring-destructive/40 aria-invalid:border-destructive focus:aria-invalid:border-destructive relative flex h-9 w-9 items-center justify-center border-y border-r text-sm shadow-xs transition-all outline-none text-center first:rounded-l-md first:border-l last:rounded-r-md focus:z-10 focus:ring-3', props.class)\"\n  />\n</template>\n"
    },
    {
      "path": "ui/pin-input/index.ts",
      "type": "registry:ui",
      "content": "export { default as PinInput } from \"./PinInput.vue\"\nexport { default as PinInputGroup } from \"./PinInputGroup.vue\"\nexport { default as PinInputSeparator } from \"./PinInputSeparator.vue\"\nexport { default as PinInputSlot } from \"./PinInputSlot.vue\"\n"
    }
  ]
}