{
  "name": "button-group",
  "type": "registry:ui",
  "dependencies": [
    "reka-ui",
    "@vueuse/core"
  ],
  "registryDependencies": [
    "separator"
  ],
  "files": [
    {
      "path": "ui/button-group/ButtonGroup.vue",
      "content": "<script setup lang=\"ts\">\nimport type { HTMLAttributes } from \"vue\"\nimport type { ButtonGroupVariants } from \".\"\nimport { cn } from \"@/lib/utils\"\nimport { buttonGroupVariants } from \".\"\n\nconst props = defineProps<{\n  class?: HTMLAttributes[\"class\"]\n  orientation?: ButtonGroupVariants[\"orientation\"]\n}>()\n</script>\n\n<template>\n  <div\n    role=\"group\"\n    data-slot=\"button-group\"\n    :data-orientation=\"props.orientation\"\n    :class=\"cn(buttonGroupVariants({ orientation: props.orientation }), props.class)\"\n  >\n    <slot />\n  </div>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/button-group/ButtonGroupSeparator.vue",
      "content": "<script setup lang=\"ts\">\nimport type { SeparatorProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport { reactiveOmit } from \"@vueuse/core\"\nimport { cn } from \"@/lib/utils\"\nimport { Separator } from \"@/registry/new-york/ui/separator\"\n\nconst props = withDefaults(defineProps<SeparatorProps & { class?: HTMLAttributes[\"class\"] }>(), {\n  orientation: \"vertical\",\n})\nconst delegatedProps = reactiveOmit(props, \"class\")\n</script>\n\n<template>\n  <Separator\n    data-slot=\"button-group-separator\"\n    v-bind=\"delegatedProps\"\n    :orientation=\"props.orientation\"\n    :class=\"cn(\n      'bg-input relative !m-0 self-stretch data-[orientation=vertical]:h-auto',\n      props.class,\n    )\"\n  />\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/button-group/ButtonGroupText.vue",
      "content": "<script setup lang=\"ts\">\nimport type { PrimitiveProps } from \"reka-ui\"\nimport type { HTMLAttributes } from \"vue\"\nimport type { ButtonGroupVariants } from \".\"\nimport { Primitive } from \"reka-ui\"\nimport { cn } from \"@/lib/utils\"\n\ninterface Props extends PrimitiveProps {\n  class?: HTMLAttributes[\"class\"]\n  orientation?: ButtonGroupVariants[\"orientation\"]\n}\n\nconst props = withDefaults(defineProps<Props>(), {\n  as: \"div\",\n})\n</script>\n\n<template>\n  <Primitive\n    role=\"group\"\n    data-slot=\"button-group\"\n    :data-orientation=\"props.orientation\"\n    :as=\"as\"\n    :as-child=\"asChild\"\n    :class=\"cn('bg-muted flex items-center gap-2 rounded-md border px-4 text-sm font-medium shadow-xs [&_svg]:pointer-events-none [&_svg:not([class*=\\'size-\\'])]:size-4', props.class)\"\n  >\n    <slot />\n  </Primitive>\n</template>\n",
      "type": "registry:ui",
      "target": ""
    },
    {
      "path": "ui/button-group/index.ts",
      "content": "import type { VariantProps } from \"class-variance-authority\"\nimport { cva } from \"class-variance-authority\"\n\nexport { default as ButtonGroup } from \"./ButtonGroup.vue\"\nexport { default as ButtonGroupSeparator } from \"./ButtonGroupSeparator.vue\"\nexport { default as ButtonGroupText } from \"./ButtonGroupText.vue\"\n\nexport const buttonGroupVariants = cva(\n  \"flex w-fit items-stretch [&>*:focus-visible]:z-10 [&>*:focus-visible]:relative [&>[data-slot=select-trigger]:not([class*='w-'])]:w-fit [&>input]:flex-1 has-[select[aria-hidden=true]:last-child]:[&>[data-slot=select-trigger]:last-of-type]:rounded-r-md has-[>[data-slot=button-group]]:gap-2\",\n  {\n    variants: {\n      orientation: {\n        horizontal:\n          \"[&>*:not(:first-child)]:rounded-l-none [&>*:not(:first-child)]:border-l-0 [&>*:not(:last-child)]:rounded-r-none\",\n        vertical:\n          \"flex-col [&>*:not(:first-child)]:rounded-t-none [&>*:not(:first-child)]:border-t-0 [&>*:not(:last-child)]:rounded-b-none\",\n      },\n    },\n    defaultVariants: {\n      orientation: \"horizontal\",\n    },\n  },\n)\n\nexport type ButtonGroupVariants = VariantProps<typeof buttonGroupVariants>\n",
      "type": "registry:ui",
      "target": ""
    }
  ]
}