ui-thing 0.1.21 → 0.1.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (5) hide show
  1. package/CHANGELOG.md +29 -0
  2. package/dist/index.js +449 -427
  3. package/dist/index.js.map +1 -1
  4. package/package.json +10 -10
  5. package/src/comps.ts +169 -118
package/src/comps.ts CHANGED
@@ -14,25 +14,25 @@ export default [
14
14
  fileName: "Accordion/Content.vue",
15
15
  dirPath: "components/UI",
16
16
  fileContent:
17
- '<template>\n <AccordionContent\n v-bind="reactiveOmit(props, \'content\', \'class\')"\n :class="styles({ class: props.class })"\n >\n <div class="pb-4 pt-0">\n <slot>{{ content }}</slot>\n </div>\n </AccordionContent>\n</template>\n\n<script lang="ts" setup>\n import { AccordionContent } from "radix-vue";\n import type { AccordionContentProps } from "radix-vue";\n\n const props = defineProps<\n AccordionContentProps & {\n class?: any;\n content?: any;\n }\n >();\n\n const styles = tv({\n base: "overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",\n });\n</script>\n',
17
+ '<template>\n <AccordionContent v-bind="forwarded" :class="styles({ class: props.class })">\n <div class="pb-4 pt-0">\n <slot>{{ content }}</slot>\n </div>\n </AccordionContent>\n</template>\n\n<script lang="ts" setup>\n import { AccordionContent } from "radix-vue";\n import type { AccordionContentProps } from "radix-vue";\n\n const props = defineProps<\n AccordionContentProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** The content of the accordion */\n content?: any;\n }\n >();\n\n const forwarded = reactiveOmit(props, "class", "content");\n\n const styles = tv({\n base: "overflow-hidden text-sm transition-all data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down",\n });\n</script>\n',
18
18
  },
19
19
  {
20
20
  fileName: "Accordion/Header.vue",
21
21
  dirPath: "components/UI",
22
22
  fileContent:
23
- '<template>\n <AccordionHeader v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\n <slot />\n </AccordionHeader>\n</template>\n\n<script lang="ts" setup>\n import { AccordionHeader } from "radix-vue";\n import type { AccordionHeaderProps } from "radix-vue";\n\n const props = defineProps<\n AccordionHeaderProps & {\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "flex",\n });\n</script>\n',
23
+ '<template>\n <AccordionHeader v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n </AccordionHeader>\n</template>\n\n<script lang="ts" setup>\n import { AccordionHeader } from "radix-vue";\n import type { AccordionHeaderProps } from "radix-vue";\n\n const props = defineProps<\n AccordionHeaderProps & {\n class?: any;\n }\n >();\n\n const forwarded = reactiveOmit(props, "class");\n\n const styles = tv({\n base: "flex",\n });\n</script>\n',
24
24
  },
25
25
  {
26
26
  fileName: "Accordion/Item.vue",
27
27
  dirPath: "components/UI",
28
28
  fileContent:
29
- '<template>\n <AccordionItem\n v-slot="slotProps"\n v-bind="reactiveOmit(props, \'class\')"\n :class="styles({ class: props.class })"\n >\n <slot v-bind="slotProps" />\n </AccordionItem>\n</template>\n\n<script setup lang="ts">\n import { AccordionItem } from "radix-vue";\n import type { AccordionItemProps } from "radix-vue";\n\n const props = defineProps<\n AccordionItemProps & {\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "border-b",\n });\n</script>\n',
29
+ '<template>\n <AccordionItem v-slot="slotProps" v-bind="forwarded" :class="styles({ class: props.class })">\n <slot v-bind="slotProps" />\n </AccordionItem>\n</template>\n\n<script setup lang="ts">\n import { AccordionItem } from "radix-vue";\n import type { AccordionItemProps } from "radix-vue";\n\n const props = defineProps<\n AccordionItemProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const forwarded = reactiveOmit(props, "class");\n\n const styles = tv({\n base: "border-b",\n });\n</script>\n',
30
30
  },
31
31
  {
32
32
  fileName: "Accordion/Trigger.vue",
33
33
  dirPath: "components/UI",
34
34
  fileContent:
35
- '<template>\n <AccordionTrigger\n v-bind="reactiveOmit(props, \'class\', \'icon\', \'title\')"\n :class="styles({ class: props.class })"\n >\n <slot :props="props">\n {{ title }}\n </slot>\n <slot name="icon" :props="props">\n <Icon v-if="icon" :name="icon" class="h-4 w-4 shrink-0 transition-transform duration-200" />\n </slot>\n </AccordionTrigger>\n</template>\n\n<script lang="ts" setup>\n import { AccordionTrigger } from "radix-vue";\n import type { AccordionTriggerProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n AccordionTriggerProps & {\n class?: any;\n title?: string;\n icon?: string;\n }\n >(),\n {\n class: undefined,\n title: "",\n icon: "lucide:chevron-down",\n }\n );\n\n const styles = tv({\n base: "flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline focus-visible:rounded-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background [&[data-state=open]>svg]:rotate-180",\n });\n</script>\n',
35
+ '<template>\n <AccordionTrigger v-bind="forwarded" :class="styles({ class: props.class })">\n <slot :props="props">\n {{ title }}\n </slot>\n <slot name="icon" :props="props">\n <Icon v-if="icon" :name="icon" class="h-4 w-4 shrink-0 transition-transform duration-200" />\n </slot>\n </AccordionTrigger>\n</template>\n\n<script lang="ts" setup>\n import { AccordionTrigger } from "radix-vue";\n import type { AccordionTriggerProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n AccordionTriggerProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** The title of the accordion trigger */\n title?: string;\n /** The icon to show next to the title */\n icon?: string;\n }\n >(),\n {\n class: undefined,\n title: "",\n icon: "lucide:chevron-down",\n }\n );\n\n const forwarded = reactiveOmit(props, "class", "icon", "title");\n\n const styles = tv({\n base: "flex flex-1 items-center justify-between py-4 font-medium transition-all hover:underline focus-visible:rounded-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background [&[data-state=open]>svg]:rotate-180",\n });\n</script>\n',
36
36
  },
37
37
  ],
38
38
  utils: [],
@@ -54,13 +54,13 @@ export default [
54
54
  fileName: "Alert/Description.vue",
55
55
  dirPath: "components/UI",
56
56
  fileContent:
57
- '<template>\n <Primitive\n v-bind="reactiveOmit(props, \'description\', \'class\')"\n :class="styles({ class: props.class })"\n >\n <slot>{{ description }}</slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class to add to the parent */\n class?: any;\n /** The description text that should be displayed */\n description?: string;\n }\n >(),\n { as: "div", class: undefined, description: undefined }\n );\n\n const styles = tv({\n base: "text-sm [&_p]:leading-relaxed",\n });\n</script>\n',
57
+ '<template>\n <Primitive v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>{{ description }}</slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class to add to the parent */\n class?: any;\n /** The description text that should be displayed */\n description?: string;\n }\n >(),\n { as: "div", class: undefined, description: undefined }\n );\n\n const forwarded = reactiveOmit(props, "class", "description");\n\n const styles = tv({\n base: "text-sm [&_p]:leading-relaxed",\n });\n</script>\n',
58
58
  },
59
59
  {
60
60
  fileName: "Alert/Title.vue",
61
61
  dirPath: "components/UI",
62
62
  fileContent:
63
- '<template>\n <Primitive v-bind="reactiveOmit(props, \'class\', \'title\')" :class="styles({ class: props.class })">\n <slot>{{ title }}</slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class to add to the parent */\n class?: any;\n /** The title text that should be displayed */\n title?: string;\n }\n >(),\n { as: "h5", class: undefined, title: undefined }\n );\n\n const styles = tv({\n base: "mb-1 font-medium leading-none tracking-tight",\n });\n</script>\n',
63
+ '<template>\n <Primitive v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>{{ title }}</slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class to add to the parent */\n class?: any;\n /** The title text that should be displayed */\n title?: string;\n }\n >(),\n { as: "h5", class: undefined, title: undefined }\n );\n\n const forwarded = reactiveOmit(props, "class", "title");\n\n const styles = tv({\n base: "mb-1 font-medium leading-none tracking-tight",\n });\n</script>\n',
64
64
  },
65
65
  ],
66
66
  utils: [],
@@ -84,7 +84,7 @@ export default [
84
84
  fileName: "AlertDialog/Action.vue",
85
85
  dirPath: "components/UI",
86
86
  fileContent:
87
- '<template>\n <AlertDialogAction\n v-bind="reactiveOmit(props, \'class\', \'text\', \'variant\', \'size\')"\n :class="buttonStyles({ variant, size, disabled, class: props.class })"\n >\n <slot>{{ text }} </slot>\n </AlertDialogAction>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogAction } from "radix-vue";\n import type { AlertDialogActionProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n AlertDialogActionProps & {\n /** Action to perform when the button is clicked */\n onClick?: () => void;\n /** Text to display in the button */\n text?: string;\n /** Custom class(es) to add to the button */\n class?: any;\n /** Whether the button is disabled */\n disabled?: boolean;\n /** The button\'s visual variant */\n variant?: VariantProps<typeof buttonStyles>["variant"];\n /** The button\'s visual size */\n size?: VariantProps<typeof buttonStyles>["size"];\n }\n >(),\n {\n text: "Continue",\n variant: "default",\n size: "default",\n class: undefined,\n onClick: undefined,\n }\n );\n</script>\n',
87
+ '<template>\n <AlertDialogAction\n v-bind="forwarded"\n :class="buttonStyles({ variant, size, disabled, class: props.class })"\n >\n <slot>{{ text }} </slot>\n </AlertDialogAction>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogAction } from "radix-vue";\n import type { AlertDialogActionProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n AlertDialogActionProps & {\n /** Action to perform when the button is clicked */\n onClick?: () => void;\n /** Text to display in the button */\n text?: string;\n /** Custom class(es) to add to the button */\n class?: any;\n /** Whether the button is disabled */\n disabled?: boolean;\n /** The button\'s visual variant */\n variant?: VariantProps<typeof buttonStyles>["variant"];\n /** The button\'s visual size */\n size?: VariantProps<typeof buttonStyles>["size"];\n }\n >(),\n {\n text: "Continue",\n variant: "default",\n size: "default",\n class: undefined,\n onClick: undefined,\n }\n );\n\n const forwarded = reactiveOmit(props, "class", "text", "variant", "size");\n</script>\n',
88
88
  },
89
89
  {
90
90
  fileName: "AlertDialog/AlertDialog.vue",
@@ -96,7 +96,7 @@ export default [
96
96
  fileName: "AlertDialog/Cancel.vue",
97
97
  dirPath: "components/UI",
98
98
  fileContent:
99
- '<template>\n <AlertDialogCancel\n v-bind="reactiveOmit(props, \'class\', \'text\', \'variant\', \'size\')"\n :class="buttonStyles({ variant, size, disabled, class: props.class })"\n >\n <slot>{{ text }}</slot>\n </AlertDialogCancel>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogCancel } from "radix-vue";\n import type { AlertDialogCancelProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n AlertDialogCancelProps & {\n /** Action to perform when the button is clicked */\n onClick?: () => void;\n /** Text to display in the button */\n text?: string;\n /** Custom class(es) to add to the button */\n class?: any;\n /** Whether the button is disabled */\n disabled?: boolean;\n /** The button\'s visual variant */\n variant?: VariantProps<typeof buttonStyles>["variant"];\n /** The button\'s visual size */\n size?: VariantProps<typeof buttonStyles>["size"];\n }\n >(),\n {\n text: "Cancel",\n variant: "outline",\n size: "default",\n class: undefined,\n onClick: undefined,\n }\n );\n</script>\n',
99
+ '<template>\n <AlertDialogCancel\n v-bind="forwarded"\n :class="buttonStyles({ variant, size, disabled, class: props.class })"\n >\n <slot>{{ text }}</slot>\n </AlertDialogCancel>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogCancel } from "radix-vue";\n import type { AlertDialogCancelProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n AlertDialogCancelProps & {\n /** Action to perform when the button is clicked */\n onClick?: () => void;\n /** Text to display in the button */\n text?: string;\n /** Custom class(es) to add to the button */\n class?: any;\n /** Whether the button is disabled */\n disabled?: boolean;\n /** The button\'s visual variant */\n variant?: VariantProps<typeof buttonStyles>["variant"];\n /** The button\'s visual size */\n size?: VariantProps<typeof buttonStyles>["size"];\n }\n >(),\n {\n text: "Cancel",\n variant: "outline",\n size: "default",\n class: undefined,\n onClick: undefined,\n }\n );\n\n const forwarded = reactiveOmit(props, "class", "text", "variant", "size");\n</script>\n',
100
100
  },
101
101
  {
102
102
  fileName: "AlertDialog/Content.vue",
@@ -108,25 +108,25 @@ export default [
108
108
  fileName: "AlertDialog/Description.vue",
109
109
  dirPath: "components/UI",
110
110
  fileContent:
111
- '<template>\n <AlertDialogDescription\n v-bind="reactiveOmit(props, \'class\', \'description\')"\n :class="styles({ class: props.class })"\n >\n <slot>{{ description }}</slot>\n </AlertDialogDescription>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogDescription } from "radix-vue";\n import type { AlertDialogDescriptionProps } from "radix-vue";\n\n const props = defineProps<\n AlertDialogDescriptionProps & {\n /** Text to display in the description */\n description?: string;\n /** Custom class(es) to add to the description */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
111
+ '<template>\n <AlertDialogDescription v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>{{ description }}</slot>\n </AlertDialogDescription>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogDescription } from "radix-vue";\n import type { AlertDialogDescriptionProps } from "radix-vue";\n\n const props = defineProps<\n AlertDialogDescriptionProps & {\n /** Text to display in the description */\n description?: string;\n /** Custom class(es) to add to the description */\n class?: any;\n }\n >();\n\n const forwarded = reactiveOmit(props, "class", "description");\n\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
112
112
  },
113
113
  {
114
114
  fileName: "AlertDialog/Footer.vue",
115
115
  dirPath: "components/UI",
116
116
  fileContent:
117
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the element */\n class?: any;\n }\n >(),\n {\n as: "div",\n class: undefined,\n }\n );\n const styles = tv({\n base: "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",\n });\n</script>\n',
117
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the element */\n class?: any;\n }\n >(),\n {\n as: "div",\n class: undefined,\n }\n );\n\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex flex-col-reverse gap-2 sm:flex-row sm:justify-end",\n });\n</script>\n',
118
118
  },
119
119
  {
120
120
  fileName: "AlertDialog/Header.vue",
121
121
  dirPath: "components/UI",
122
122
  fileContent:
123
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the element */\n class?: any;\n }\n >(),\n {\n as: "div",\n class: undefined,\n }\n );\n\n const styles = tv({\n base: "flex flex-col gap-2 text-center sm:text-left",\n });\n</script>\n',
123
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the element */\n class?: any;\n }\n >(),\n {\n as: "div",\n class: undefined,\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex flex-col gap-2 text-center sm:text-left",\n });\n</script>\n',
124
124
  },
125
125
  {
126
126
  fileName: "AlertDialog/Overlay.vue",
127
127
  dirPath: "components/UI",
128
128
  fileContent:
129
- '<template>\n <AlertDialogOverlay\n v-bind="reactiveOmit(props, \'class\')"\n :class="styles({ class: props.class })"\n />\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogOverlay } from "radix-vue";\n import type { AlertDialogOverlayProps } from "radix-vue";\n\n const props = defineProps<\n AlertDialogOverlayProps & {\n /** Custom class(es) to add to the overlay */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=closed]:animate-fadeOut data-[state=open]:animate-fadeIn",\n });\n</script>\n',
129
+ '<template>\n <AlertDialogOverlay v-bind="forwarded" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogOverlay } from "radix-vue";\n import type { AlertDialogOverlayProps } from "radix-vue";\n\n const props = defineProps<\n AlertDialogOverlayProps & {\n /** Custom class(es) to add to the overlay */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=closed]:animate-fadeOut data-[state=open]:animate-fadeIn",\n });\n</script>\n',
130
130
  },
131
131
  {
132
132
  fileName: "AlertDialog/Portal.vue",
@@ -138,7 +138,7 @@ export default [
138
138
  fileName: "AlertDialog/Title.vue",
139
139
  dirPath: "components/UI",
140
140
  fileContent:
141
- '<template>\n <AlertDialogTitle v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\n <slot>{{ title }}</slot>\n </AlertDialogTitle>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogTitle } from "radix-vue";\n import type { AlertDialogTitleProps } from "radix-vue";\n\n const props = defineProps<\n AlertDialogTitleProps & {\n /** Text to display in the title */\n title?: string;\n /** Custom class(es) to add to the title */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "text-lg font-semibold",\n });\n</script>\n',
141
+ '<template>\n <AlertDialogTitle v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>{{ title }}</slot>\n </AlertDialogTitle>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogTitle } from "radix-vue";\n import type { AlertDialogTitleProps } from "radix-vue";\n\n const props = defineProps<\n AlertDialogTitleProps & {\n /** Text to display in the title */\n title?: string;\n /** Custom class(es) to add to the title */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "title");\n const styles = tv({\n base: "text-lg font-semibold",\n });\n</script>\n',
142
142
  },
143
143
  {
144
144
  fileName: "AlertDialog/Trigger.vue",
@@ -252,7 +252,7 @@ export default [
252
252
  fileName: "Autocomplete/Trigger.vue",
253
253
  dirPath: "components/UI",
254
254
  fileContent:
255
- '<template>\n <ComboboxTrigger v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\n <slot />\n </ComboboxTrigger>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxTrigger } from "radix-vue";\n import type { ComboboxTriggerProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxTriggerProps & {\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "inline-flex shrink-0 cursor-pointer items-center justify-center",\n });\n</script>\n',
255
+ '<template>\n <ComboboxTrigger v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n </ComboboxTrigger>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxTrigger } from "radix-vue";\n import type { ComboboxTriggerProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxTriggerProps & {\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "inline-flex shrink-0 cursor-pointer items-center justify-center",\n });\n</script>\n',
256
256
  },
257
257
  {
258
258
  fileName: "Autocomplete/Viewport.vue",
@@ -279,7 +279,7 @@ export default [
279
279
  fileName: "Avatar/Fallback.vue",
280
280
  dirPath: "components/UI",
281
281
  fileContent:
282
- '<template>\n <AvatarFallback\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'fallback\')"\n >\n <slot>\n {{ fallback }}\n </slot>\n </AvatarFallback>\n</template>\n\n<script lang="ts" setup>\n import { AvatarFallback } from "radix-vue";\n import type { AvatarFallbackProps } from "radix-vue";\n\n const props = defineProps<\n AvatarFallbackProps & {\n /** The text to display inside th eavatar */\n fallback?: string;\n /** Custom class(es) to add to the element */\n class?: any;\n }\n >();\n const styles = tv({\n base: "flex h-full w-full items-center justify-center rounded-full bg-muted font-medium",\n });\n</script>\n',
282
+ '<template>\n <AvatarFallback :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>\n {{ fallback }}\n </slot>\n </AvatarFallback>\n</template>\n\n<script lang="ts" setup>\n import { AvatarFallback } from "radix-vue";\n import type { AvatarFallbackProps } from "radix-vue";\n\n const props = defineProps<\n AvatarFallbackProps & {\n /** The text to display inside th eavatar */\n fallback?: string;\n /** Custom class(es) to add to the element */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "fallback");\n const styles = tv({\n base: "flex h-full w-full items-center justify-center rounded-full bg-muted font-medium",\n });\n</script>\n',
283
283
  },
284
284
  {
285
285
  fileName: "Avatar/Image.vue",
@@ -315,7 +315,7 @@ export default [
315
315
  fileName: "Breadcrumbs.vue",
316
316
  dirPath: "components/UI",
317
317
  fileContent:
318
- '<template>\n <div :class="styles({ class: props.class })">\n <template v-for="(item, i) in items" :key="i">\n <div class="flex items-center gap-3">\n <div class="flex cursor-pointer items-center gap-2">\n <slot name="crumbIcon" :item="item" :index="i">\n <Icon\n v-if="item.icon"\n :name="item.icon"\n :class="[!isNotLastItem(i) && \'text-primary\']"\n />\n </slot>\n <slot :item="item" :is-not-last-item="isNotLastItem" :index="i" name="link">\n <NuxtLink\n v-if="item.label"\n :to="!item?.disabled ? item.link : \'\'"\n :class="[\n isNotLastItem(i)\n ? \'text-muted-foreground hover:underline\'\n : \'font-semibold text-primary\',\n ]"\n class="text-sm text-foreground"\n @click="item?.click?.()"\n >{{ item.label }}</NuxtLink\n >\n </slot>\n </div>\n <slot name="separator" :item="item" :index="i">\n <Icon v-if="isNotLastItem(i)" :name="separator" class="h-3 w-3 text-muted-foreground" />\n </slot>\n </div>\n </template>\n </div>\n</template>\n\n<script setup lang="ts">\n export interface Crumbs {\n label: string;\n icon?: string;\n link?: string;\n disabled?: boolean;\n // eslint-disable-next-line @typescript-eslint/ban-types\n click?: Function;\n }\n const props = withDefaults(\n defineProps<{\n /**\n * The items to display in the breadcrumbs.\n */\n items?: Crumbs[];\n /**\n * The separator to use between each breadcrumb.\n */\n separator?: string;\n class?: any;\n }>(),\n {\n separator: "heroicons:chevron-right",\n items: () => [],\n class: undefined,\n }\n );\n\n const isNotLastItem = (index: number) => {\n return index !== props?.items?.length - 1;\n };\n\n const styles = tv({\n base: "flex w-full items-center gap-4",\n });\n</script>\n',
318
+ '<template>\n <div :class="styles({ class: props.class })">\n <template v-for="(item, i) in items" :key="i">\n <div class="flex items-center gap-3">\n <div class="flex cursor-pointer items-center gap-2">\n <slot name="crumbIcon" :item="item" :index="i">\n <Icon\n v-if="item.icon"\n :name="item.icon"\n :class="[!isNotLastItem(i) && \'text-primary\']"\n />\n </slot>\n <slot :item="item" :is-not-last-item="isNotLastItem" :index="i" name="link">\n <NuxtLink\n v-if="item.label"\n :to="!item?.disabled ? item.link : \'\'"\n :class="[\n isNotLastItem(i)\n ? \'text-muted-foreground hover:underline\'\n : \'font-semibold text-primary\',\n ]"\n class="text-sm text-foreground"\n @click="item?.click?.()"\n >{{ item.label }}</NuxtLink\n >\n </slot>\n </div>\n <slot name="separator" :item="item" :index="i">\n <Icon v-if="isNotLastItem(i)" :name="separator" class="h-3 w-3 text-muted-foreground" />\n </slot>\n </div>\n </template>\n </div>\n</template>\n\n<script setup lang="ts">\n export interface Crumbs {\n label: string;\n icon?: string;\n link?: string;\n disabled?: boolean;\n // eslint-disable-next-line @typescript-eslint/no-unsafe-function-type\n click?: Function;\n }\n const props = withDefaults(\n defineProps<{\n /**\n * The items to display in the breadcrumbs.\n */\n items?: Crumbs[];\n /**\n * The separator to use between each breadcrumb.\n */\n separator?: string;\n class?: any;\n }>(),\n {\n separator: "heroicons:chevron-right",\n items: () => [],\n class: undefined,\n }\n );\n\n const isNotLastItem = (index: number) => {\n return index !== props?.items?.length - 1;\n };\n\n const styles = tv({\n base: "flex w-full items-center gap-4",\n });\n</script>\n',
319
319
  },
320
320
  ],
321
321
  utils: [],
@@ -421,7 +421,7 @@ export default [
421
421
  fileName: "Checkbox/Indicator.vue",
422
422
  dirPath: "components/UI",
423
423
  fileContent:
424
- '<template>\n <CheckboxIndicator\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'icon\')"\n >\n <slot>\n <Icon :name="checked == \'indeterminate\' ? \'lucide:minus\' : icon" class="h-4 w-4" />\n </slot>\n </CheckboxIndicator>\n</template>\n\n<script lang="ts" setup>\n import { CheckboxIndicator } from "radix-vue";\n import type { CheckboxIndicatorProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n CheckboxIndicatorProps & {\n /** The state of the checkbox */\n checked?: boolean | "indeterminate";\n /** Custom class(es) to add to the element */\n class?: any;\n /**\n * Icon to display when the checkbox is checked\n * @default lucide:check\n */\n icon?: string;\n }\n >(),\n {\n icon: "lucide:check",\n }\n );\n\n const styles = tv({\n base: "flex items-center justify-center text-current",\n });\n</script>\n',
424
+ '<template>\n <CheckboxIndicator :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>\n <Icon :name="checked == \'indeterminate\' ? \'lucide:minus\' : icon" class="h-4 w-4" />\n </slot>\n </CheckboxIndicator>\n</template>\n\n<script lang="ts" setup>\n import { CheckboxIndicator } from "radix-vue";\n import type { CheckboxIndicatorProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n CheckboxIndicatorProps & {\n /** The state of the checkbox */\n checked?: boolean | "indeterminate";\n /** Custom class(es) to add to the element */\n class?: any;\n /**\n * Icon to display when the checkbox is checked\n * @default lucide:check\n */\n icon?: string;\n }\n >(),\n {\n icon: "lucide:check",\n }\n );\n const forwarded = reactiveOmit(props, "class", "icon");\n const styles = tv({\n base: "flex items-center justify-center text-current",\n });\n</script>\n',
425
425
  },
426
426
  ],
427
427
  utils: [],
@@ -457,7 +457,7 @@ export default [
457
457
  fileName: "Collapsible/Content.vue",
458
458
  dirPath: "components/UI",
459
459
  fileContent:
460
- '<template>\n <CollapsibleContent :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </CollapsibleContent>\n</template>\n\n<script lang="ts" setup>\n import { CollapsibleContent } from "radix-vue";\n import type { CollapsibleContentProps } from "radix-vue";\n\n const props = defineProps<\n CollapsibleContentProps & {\n /** Customer class(es) to add to the element */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "overflow-hidden transition will-change-auto data-[state=closed]:animate-collapse-up data-[state=open]:animate-collapse-down",\n });\n</script>\n',
460
+ '<template>\n <CollapsibleContent :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </CollapsibleContent>\n</template>\n\n<script lang="ts" setup>\n import { CollapsibleContent } from "radix-vue";\n import type { CollapsibleContentProps } from "radix-vue";\n\n const props = defineProps<\n CollapsibleContentProps & {\n /** Customer class(es) to add to the element */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "overflow-hidden transition will-change-auto data-[state=closed]:animate-collapse-up data-[state=open]:animate-collapse-down",\n });\n</script>\n',
461
461
  },
462
462
  {
463
463
  fileName: "Collapsible/Trigger.vue",
@@ -478,7 +478,7 @@ export default [
478
478
  fileName: "Command/Cancel.vue",
479
479
  dirPath: "components/UI",
480
480
  fileContent:
481
- '<template>\n <ComboboxCancel v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\n <slot>\n <Icon name="lucide:x" class="h-4 w-4 text-muted-foreground/70" />\n </slot>\n </ComboboxCancel>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxCancel } from "radix-vue";\n import type { ComboboxCancelProps } from "radix-vue";\n\n const props = defineProps<ComboboxCancelProps & { class?: any }>();\n\n const styles = tv({\n base: "flex items-center justify-center",\n });\n</script>\n',
481
+ '<template>\n <ComboboxCancel v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <Icon name="lucide:x" class="h-4 w-4 text-muted-foreground/70" />\n </slot>\n </ComboboxCancel>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxCancel } from "radix-vue";\n import type { ComboboxCancelProps } from "radix-vue";\n\n const props = defineProps<ComboboxCancelProps & { class?: any }>();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex items-center justify-center",\n });\n</script>\n',
482
482
  },
483
483
  {
484
484
  fileName: "Command/Command.vue",
@@ -496,19 +496,19 @@ export default [
496
496
  fileName: "Command/Empty.vue",
497
497
  dirPath: "components/UI",
498
498
  fileContent:
499
- '<template>\n <ComboboxEmpty :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </ComboboxEmpty>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxEmpty } from "radix-vue";\n import type { ComboboxEmptyProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxEmptyProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "py-6 text-center text-sm",\n });\n</script>\n',
499
+ '<template>\n <ComboboxEmpty :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </ComboboxEmpty>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxEmpty } from "radix-vue";\n import type { ComboboxEmptyProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxEmptyProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "py-6 text-center text-sm",\n });\n</script>\n',
500
500
  },
501
501
  {
502
502
  fileName: "Command/Group.vue",
503
503
  dirPath: "components/UI",
504
504
  fileContent:
505
- '<template>\n <ComboboxGroup\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'heading\')"\n >\n <slot name="heading">\n <UiCommandLabel v-if="heading" :label="heading" />\n </slot>\n <slot />\n </ComboboxGroup>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxGroup } from "radix-vue";\n import type { ComboboxGroupProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxGroupProps & {\n /**The heading for the group */\n heading?: any;\n /**Custom class(es) to add to the element */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "overflow-hidden p-1 text-foreground",\n });\n</script>\n',
505
+ '<template>\n <ComboboxGroup :class="styles({ class: props.class })" v-bind="forwarded">\n <slot name="heading">\n <UiCommandLabel v-if="heading" :label="heading" />\n </slot>\n <slot />\n </ComboboxGroup>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxGroup } from "radix-vue";\n import type { ComboboxGroupProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxGroupProps & {\n /**The heading for the group */\n heading?: any;\n /**Custom class(es) to add to the element */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "heading");\n const styles = tv({\n base: "overflow-hidden p-1 text-foreground",\n });\n</script>\n',
506
506
  },
507
507
  {
508
508
  fileName: "Command/Input.vue",
509
509
  dirPath: "components/UI",
510
510
  fileContent:
511
- '<template>\n <div class="flex items-center border-b px-3" cmdk-input-wrapper="">\n <Icon :name="icon || \'lucide:search\'" class="mr-2 h-4 w-4 shrink-0 opacity-50" />\n <ComboboxInput\n v-bind="$attrs"\n :type="type ?? \'text\'"\n :disabled="disabled"\n auto-focus\n :class="styles({ class: props.class })"\n />\n <UiCommandCancel v-if="showCancel" />\n </div>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxInput } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = defineProps<{\n /**Custom class(es) to add to the input element*/\n class?: any;\n /**The icon to render*/\n icon?: string;\n /**The input type*/\n type?: string;\n /**Whether the input is disabled*/\n disabled?: boolean;\n /**Whether to show the cancel button*/\n showCancel?: boolean;\n }>();\n\n const styles = tv({\n base: "flex h-11 w-full rounded-md bg-transparent py-3 outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 sm:text-sm",\n });\n</script>\n',
511
+ '<template>\n <div class="flex items-center border-b px-3">\n <Icon :name="icon || \'lucide:search\'" class="mr-2 h-4 w-4 shrink-0 opacity-50" />\n <ComboboxInput\n v-bind="$attrs"\n :type="type ?? \'text\'"\n :disabled="disabled"\n auto-focus\n :class="styles({ class: props.class })"\n />\n <UiCommandCancel v-if="showCancel" />\n </div>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxInput } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = defineProps<{\n /**Custom class(es) to add to the input element*/\n class?: any;\n /**The icon to render*/\n icon?: string;\n /**The input type*/\n type?: string;\n /**Whether the input is disabled*/\n disabled?: boolean;\n /**Whether to show the cancel button*/\n showCancel?: boolean;\n }>();\n\n const styles = tv({\n base: "flex h-11 w-full rounded-md bg-transparent py-3 outline-none placeholder:text-muted-foreground disabled:cursor-not-allowed disabled:opacity-50 sm:text-sm",\n });\n</script>\n',
512
512
  },
513
513
  {
514
514
  fileName: "Command/Item.vue",
@@ -520,7 +520,7 @@ export default [
520
520
  fileName: "Command/Label.vue",
521
521
  dirPath: "components/UI",
522
522
  fileContent:
523
- '<template>\n <ComboboxLabel\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'label\')"\n >\n <slot>{{ label }}</slot>\n </ComboboxLabel>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxLabel } from "radix-vue";\n import type { ComboboxLabelProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxLabelProps & {\n /**\n * Class(es) to pass to the ComboboxLabel component.\n */\n class?: any;\n /**\n * The label to display.\n */\n label?: any;\n }\n >();\n\n const styles = tv({\n base: "px-2 py-1.5 text-xs font-medium text-muted-foreground",\n });\n</script>\n',
523
+ '<template>\n <ComboboxLabel :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>{{ label }}</slot>\n </ComboboxLabel>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxLabel } from "radix-vue";\n import type { ComboboxLabelProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxLabelProps & {\n /**\n * Class(es) to pass to the ComboboxLabel component.\n */\n class?: any;\n /**\n * The label to display.\n */\n label?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "label");\n const styles = tv({\n base: "px-2 py-1.5 text-xs font-medium text-muted-foreground",\n });\n</script>\n',
524
524
  },
525
525
  {
526
526
  fileName: "Command/List.vue",
@@ -553,7 +553,7 @@ export default [
553
553
  fileName: "Container.vue",
554
554
  dirPath: "components/UI",
555
555
  fileContent:
556
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n\n const styles = tv({\n base: "container mx-auto",\n });\n</script>\n',
556
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n\n const forwarded = reactiveOmit(props, "class");\n\n const styles = tv({\n base: "container mx-auto",\n });\n</script>\n',
557
557
  },
558
558
  ],
559
559
  utils: [],
@@ -568,13 +568,13 @@ export default [
568
568
  fileName: "ContextMenu/Arrow.vue",
569
569
  dirPath: "components/UI",
570
570
  fileContent:
571
- '<template>\n <ContextMenuArrow v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuArrow } from "radix-vue";\n import type { ContextMenuArrowProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuArrowProps & {\n /** Custom class(es) to add to teh arrow */\n class?: any;\n }\n >();\n const styles = tv({\n base: "border bg-muted",\n });\n</script>\n',
571
+ '<template>\n <ContextMenuArrow v-bind="forwarded" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuArrow } from "radix-vue";\n import type { ContextMenuArrowProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuArrowProps & {\n /** Custom class(es) to add to teh arrow */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "border bg-muted",\n });\n</script>\n',
572
572
  },
573
573
  {
574
574
  fileName: "ContextMenu/CheckboxItem.vue",
575
575
  dirPath: "components/UI",
576
576
  fileContent:
577
- '<template>\n <ContextMenuCheckboxItem\n v-bind="{ ...reactiveOmit(props, \'class\', \'shortcut\', \'title\'), ...useEmitAsProps(emits) }"\n :class="styles({ class: props.class })"\n >\n <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-primary">\n <UiContextMenuItemIndicator icon="lucide:check" />\n </span>\n <slot>\n <span v-if="title">{{ title }}</span>\n </slot>\n <slot name="shortcut">\n <UiContextMenuShortcut v-if="shortcut">{{ shortcut }}</UiContextMenuShortcut>\n </slot>\n </ContextMenuCheckboxItem>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuCheckboxItem, useEmitAsProps } from "radix-vue";\n import type { ContextMenuCheckboxItemEmits, ContextMenuCheckboxItemProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuCheckboxItemProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n /**The shortcut for the item */\n shortcut?: string;\n /**The title for the item */\n title?: string;\n }\n >();\n\n const emits = defineEmits<ContextMenuCheckboxItemEmits>();\n\n const styles = tv({\n base: "relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:cursor-not-allowed data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n });\n</script>\n',
577
+ '<template>\n <ContextMenuCheckboxItem v-bind="forwarded" :class="styles({ class: props.class })">\n <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-primary">\n <UiContextMenuItemIndicator icon="lucide:check" />\n </span>\n <slot>\n <span v-if="title">{{ title }}</span>\n </slot>\n <slot name="shortcut">\n <UiContextMenuShortcut v-if="shortcut">{{ shortcut }}</UiContextMenuShortcut>\n </slot>\n </ContextMenuCheckboxItem>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuCheckboxItem, useForwardPropsEmits } from "radix-vue";\n import type { ContextMenuCheckboxItemEmits, ContextMenuCheckboxItemProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuCheckboxItemProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n /**The shortcut for the item */\n shortcut?: string;\n /**The title for the item */\n title?: string;\n }\n >();\n\n const emits = defineEmits<ContextMenuCheckboxItemEmits>();\n const forwarded = useForwardPropsEmits(reactiveOmit(props, "class", "shortcut", "title"), emits);\n const styles = tv({\n base: "relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:cursor-not-allowed data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n });\n</script>\n',
578
578
  },
579
579
  {
580
580
  fileName: "ContextMenu/Content.vue",
@@ -598,19 +598,19 @@ export default [
598
598
  fileName: "ContextMenu/Item.vue",
599
599
  dirPath: "components/UI",
600
600
  fileContent:
601
- '<template>\n <ContextMenuItem\n v-bind="{\n ...reactiveOmit(props, \'class\', \'inset\', \'shortcut\', \'title\'),\n ...useEmitAsProps(emits),\n }"\n :class="styles({ inset, class: props.class })"\n >\n <slot>\n <span v-if="title">{{ title }}</span>\n </slot>\n <slot name="shortcut">\n <UiContextMenuShortcut v-if="shortcut">{{ shortcut }}</UiContextMenuShortcut>\n </slot>\n </ContextMenuItem>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuItem, useEmitAsProps } from "radix-vue";\n import type { ContextMenuItemEmits, ContextMenuItemProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuItemProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n /** Wether an indentation should be added to the item or not */\n inset?: boolean;\n /** The shortcut for the item */\n shortcut?: string;\n /** The title for the item */\n title?: string;\n }\n >();\n\n const emits = defineEmits<ContextMenuItemEmits>();\n\n const styles = tv({\n base: "relative flex cursor-pointer select-none items-center gap-2.5 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:cursor-not-allowed data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n variants: {\n inset: {\n true: "pl-8",\n },\n },\n });\n</script>\n',
601
+ '<template>\n <ContextMenuItem v-bind="forwarded" :class="styles({ inset, class: props.class })">\n <slot>\n <span v-if="title">{{ title }}</span>\n </slot>\n <slot name="shortcut">\n <UiContextMenuShortcut v-if="shortcut">{{ shortcut }}</UiContextMenuShortcut>\n </slot>\n </ContextMenuItem>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuItem, useForwardPropsEmits } from "radix-vue";\n import type { ContextMenuItemEmits, ContextMenuItemProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuItemProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n /** Wether an indentation should be added to the item or not */\n inset?: boolean;\n /** The shortcut for the item */\n shortcut?: string;\n /** The title for the item */\n title?: string;\n }\n >();\n\n const emits = defineEmits<ContextMenuItemEmits>();\n const forwarded = useForwardPropsEmits(\n reactiveOmit(props, "class", "inset", "shortcut", "title"),\n emits\n );\n\n const styles = tv({\n base: "relative flex cursor-pointer select-none items-center gap-2.5 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:cursor-not-allowed data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n variants: {\n inset: {\n true: "pl-8",\n },\n },\n });\n</script>\n',
602
602
  },
603
603
  {
604
604
  fileName: "ContextMenu/ItemIndicator.vue",
605
605
  dirPath: "components/UI",
606
606
  fileContent:
607
- '<template>\n <ContextMenuItemIndicator v-bind="reactiveOmit(props, \'icon\')">\n <slot>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n </slot>\n </ContextMenuItemIndicator>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuItemIndicator } from "radix-vue";\n import type { ContextMenuItemIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuItemIndicatorProps & {\n /** The icon to display */\n icon?: string;\n }\n >();\n</script>\n',
607
+ '<template>\n <ContextMenuItemIndicator v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n </slot>\n </ContextMenuItemIndicator>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuItemIndicator } from "radix-vue";\n import type { ContextMenuItemIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuItemIndicatorProps & {\n /** The icon to display */\n icon?: string;\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "icon");\n\n const styles = tv({\n base: "flex items-center justify-center",\n });\n</script>\n',
608
608
  },
609
609
  {
610
610
  fileName: "ContextMenu/Label.vue",
611
611
  dirPath: "components/UI",
612
612
  fileContent:
613
- '<template>\n <ContextMenuLabel\n :class="styles({ inset, class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'inset\', \'label\')"\n >\n <slot>{{ label }}</slot>\n </ContextMenuLabel>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuLabel } from "radix-vue";\n import type { ContextMenuLabelProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuLabelProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n /** Wether an indentation should be added to the item or not */\n inset?: boolean;\n /** The label for the item */\n label?: string;\n }\n >();\n\n const styles = tv({\n base: "inline-block w-full px-2 py-1.5 text-sm font-semibold text-foreground",\n variants: {\n inset: { true: "pl-8" },\n },\n });\n</script>\n',
613
+ '<template>\n <ContextMenuLabel :class="styles({ inset, class: props.class })" v-bind="forwarded">\n <slot>{{ label }}</slot>\n </ContextMenuLabel>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuLabel } from "radix-vue";\n import type { ContextMenuLabelProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuLabelProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n /** Wether an indentation should be added to the item or not */\n inset?: boolean;\n /** The label for the item */\n label?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "inset", "label");\n const styles = tv({\n base: "inline-block w-full px-2 py-1.5 text-sm font-semibold text-foreground",\n variants: {\n inset: { true: "pl-8" },\n },\n });\n</script>\n',
614
614
  },
615
615
  {
616
616
  fileName: "ContextMenu/Portal.vue",
@@ -658,7 +658,7 @@ export default [
658
658
  fileName: "ContextMenu/SubTrigger.vue",
659
659
  dirPath: "components/UI",
660
660
  fileContent:
661
- '<template>\n <ContextMenuSubTrigger\n v-bind="reactiveOmit(props, \'class\', \'inset\', \'icon\', \'title\')"\n :class="styles({ inset, class: props.class })"\n >\n <slot>\n <span v-if="title">{{ title }}</span>\n </slot>\n <Icon class="ml-auto h-4 w-4" :name="icon || \'lucide:chevron-right\'" />\n </ContextMenuSubTrigger>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuSubTrigger } from "radix-vue";\n import type { ContextMenuSubTriggerProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuSubTriggerProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n /** Wether an indentation should be added to the item or not */\n inset?: boolean;\n /** The icon to display */\n icon?: string;\n /** The title for the item */\n title?: string;\n }\n >();\n\n const styles = tv({\n base: "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[highlighted]:bg-accent data-[state=open]:bg-accent data-[highlighted]:text-accent-foreground data-[state=open]:text-accent-foreground",\n variants: {\n inset: {\n true: "pl-8",\n },\n },\n });\n</script>\n',
661
+ '<template>\n <ContextMenuSubTrigger v-bind="forwarded" :class="styles({ inset, class: props.class })">\n <slot>\n <span v-if="title">{{ title }}</span>\n </slot>\n <Icon class="ml-auto h-4 w-4" :name="icon || \'lucide:chevron-right\'" />\n </ContextMenuSubTrigger>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuSubTrigger } from "radix-vue";\n import type { ContextMenuSubTriggerProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuSubTriggerProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n /** Wether an indentation should be added to the item or not */\n inset?: boolean;\n /** The icon to display */\n icon?: string;\n /** The title for the item */\n title?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "inset", "icon", "title");\n const styles = tv({\n base: "flex cursor-default select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[highlighted]:bg-accent data-[state=open]:bg-accent data-[highlighted]:text-accent-foreground data-[state=open]:text-accent-foreground",\n variants: {\n inset: {\n true: "pl-8",\n },\n },\n });\n</script>\n',
662
662
  },
663
663
  {
664
664
  fileName: "ContextMenu/Trigger.vue",
@@ -680,7 +680,7 @@ export default [
680
680
  fileName: "CurrencyInput.vue",
681
681
  dirPath: "components/UI",
682
682
  fileContent:
683
- '<template>\n <input ref="inputRef" type="text" :class="styles({ class: props.class })" v-bind="props" >\n</template>\n\n<script lang="ts" setup>\n import { defu } from "defu";\n import { useCurrencyInput } from "vue-currency-input";\n import type { CurrencyInputOptions } from "vue-currency-input";\n\n const props = defineProps<{\n class?: any;\n id?: string;\n name?: string;\n placeholder?: string;\n disabled?: boolean;\n required?: boolean;\n modelValue?: any;\n options?: CurrencyInputOptions;\n }>();\n\n const { inputRef } = useCurrencyInput(\n defu({}, props.options, {\n currency: "USD",\n locale: "en-US",\n hideCurrencySymbolOnFocus: false,\n hideGroupingSeparatorOnFocus: false,\n })\n );\n\n const styles = tv({\n base: "h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-[16px] ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground file:hover:cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 sm:text-sm",\n });\n</script>\n',
683
+ '<template>\n <!-- eslint-disable-next-line vue/html-self-closing -->\n <input ref="inputRef" type="text" :class="styles({ class: props.class })" v-bind="props" />\n</template>\n\n<script lang="ts" setup>\n import { defu } from "defu";\n import { useCurrencyInput } from "vue-currency-input";\n import type { CurrencyInputOptions } from "vue-currency-input";\n\n const props = defineProps<{\n class?: any;\n id?: string;\n name?: string;\n placeholder?: string;\n disabled?: boolean;\n required?: boolean;\n modelValue?: any;\n options?: CurrencyInputOptions;\n }>();\n\n const { inputRef } = useCurrencyInput(\n defu({}, props.options, {\n currency: "USD",\n locale: "en-US",\n hideCurrencySymbolOnFocus: false,\n hideGroupingSeparatorOnFocus: false,\n })\n );\n\n const styles = tv({\n base: "h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-[16px] ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground file:hover:cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 sm:text-sm",\n });\n</script>\n',
684
684
  },
685
685
  ],
686
686
  utils: [],
@@ -726,7 +726,7 @@ export default [
726
726
  fileName: "DateField.vue",
727
727
  dirPath: "components/UI",
728
728
  fileContent:
729
- '<template>\n <DateFieldRoot\n v-slot="{ segments }"\n v-bind="props"\n v-model="localModel"\n :class="styles({ class: props.class })"\n >\n <template v-for="item in segments" :key="item.part">\n <DateFieldInput\n v-if="item.part === \'literal\'"\n :part="item.part"\n class="inline-flex items-center justify-center text-muted-foreground"\n >\n <Icon v-if="separatorIcon" :name="separatorIcon" class="text-muted-foreground" />\n <span v-else-if="separator" class="mx-1 text-muted-foreground">{{ separator }}</span>\n </DateFieldInput>\n <DateFieldInput\n v-else\n :part="item.part"\n class="inline-flex cursor-text items-center rounded px-1 transition focus:outline-none focus:ring-1 focus:ring-ring aria-[valuetext=Empty]:text-muted-foreground"\n >\n {{ item.value }}\n </DateFieldInput>\n </template>\n </DateFieldRoot>\n</template>\n\n<script lang="ts" setup>\n import { type DateValue } from "@internationalized/date";\n import { DateFieldInput, DateFieldRoot } from "radix-vue";\n import type { DateFieldRootProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n DateFieldRootProps & {\n class?: any;\n separator?: string;\n separatorIcon?: string;\n }\n >(),\n {\n separator: "/",\n }\n );\n const localModel = defineModel<DateValue>();\n\n const styles = tv({\n base: "h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-[16px] ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground file:hover:cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 data-[disabled]:cursor-not-allowed data-[invalid]:border-destructive data-[disabled]:opacity-50 sm:text-sm",\n });\n</script>\n',
729
+ '<template>\n <DateFieldRoot\n v-slot="{ segments }"\n v-bind="props"\n v-model="localModel"\n :class="styles({ class: props.class })"\n >\n <template v-for="item in segments" :key="item.part">\n <DateFieldInput\n v-if="item.part === \'literal\'"\n :part="item.part"\n class="inline-flex items-center justify-center text-muted-foreground"\n >\n <Icon v-if="separatorIcon" :name="separatorIcon" class="text-muted-foreground" />\n <span v-else-if="separator" class="mx-1 text-muted-foreground">{{ separator }}</span>\n </DateFieldInput>\n <DateFieldInput\n v-else\n :part="item.part"\n class="inline-flex cursor-text items-center rounded px-1 transition focus:outline-none focus:ring-1 focus:ring-ring aria-[valuetext=Empty]:text-muted-foreground"\n >\n {{ item.value }}\n </DateFieldInput>\n </template>\n </DateFieldRoot>\n</template>\n\n<script lang="ts" setup>\n import { DateFieldInput, DateFieldRoot } from "radix-vue";\n import type { DateValue } from "@internationalized/date";\n import type { DateFieldRootProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n DateFieldRootProps & {\n class?: any;\n separator?: string;\n separatorIcon?: string;\n }\n >(),\n {\n separator: "/",\n }\n );\n const localModel = defineModel<DateValue>();\n\n const styles = tv({\n base: "h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-[16px] ring-offset-background file:border-0 file:bg-transparent file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground file:hover:cursor-pointer focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 data-[disabled]:cursor-not-allowed data-[invalid]:border-destructive data-[disabled]:opacity-50 sm:text-sm",\n });\n</script>\n',
730
730
  },
731
731
  ],
732
732
  utils: [],
@@ -773,7 +773,7 @@ export default [
773
773
  fileName: "Dialog/Description.vue",
774
774
  dirPath: "components/UI",
775
775
  fileContent:
776
- '<template>\n <DialogDescription\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'description\')"\n >\n <slot>{{ description }}</slot>\n </DialogDescription>\n</template>\n\n<script lang="ts" setup>\n import { DialogDescription } from "radix-vue";\n import type { DialogDescriptionProps } from "radix-vue";\n\n const props = defineProps<\n DialogDescriptionProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** The description text */\n description?: string;\n }\n >();\n\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
776
+ '<template>\n <DialogDescription :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>{{ description }}</slot>\n </DialogDescription>\n</template>\n\n<script lang="ts" setup>\n import { DialogDescription } from "radix-vue";\n import type { DialogDescriptionProps } from "radix-vue";\n\n const props = defineProps<\n DialogDescriptionProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** The description text */\n description?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "description");\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
777
777
  },
778
778
  {
779
779
  fileName: "Dialog/Dialog.vue",
@@ -785,19 +785,19 @@ export default [
785
785
  fileName: "Dialog/Footer.vue",
786
786
  dirPath: "components/UI",
787
787
  fileContent:
788
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n\n const styles = tv({\n base: "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",\n });\n</script>\n',
788
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",\n });\n</script>\n',
789
789
  },
790
790
  {
791
791
  fileName: "Dialog/Header.vue",
792
792
  dirPath: "components/UI",
793
793
  fileContent:
794
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n\n const styles = tv({\n base: "flex flex-col space-y-1.5 text-center sm:text-left",\n });\n</script>\n',
794
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex flex-col space-y-1.5 text-center sm:text-left",\n });\n</script>\n',
795
795
  },
796
796
  {
797
797
  fileName: "Dialog/Overlay.vue",
798
798
  dirPath: "components/UI",
799
799
  fileContent:
800
- '<template>\n <DialogOverlay :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')" />\n</template>\n\n<script lang="ts" setup>\n import { DialogOverlay } from "radix-vue";\n import type { DialogOverlayProps } from "radix-vue";\n\n const props = defineProps<\n DialogOverlayProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const styles = tv({\n base: "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=closed]:animate-fadeOut data-[state=open]:animate-fadeIn",\n });\n</script>\n',
800
+ '<template>\n <DialogOverlay :class="styles({ class: props.class })" v-bind="forwarded" />\n</template>\n\n<script lang="ts" setup>\n import { DialogOverlay } from "radix-vue";\n import type { DialogOverlayProps } from "radix-vue";\n\n const props = defineProps<\n DialogOverlayProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=closed]:animate-fadeOut data-[state=open]:animate-fadeIn",\n });\n</script>\n',
801
801
  },
802
802
  {
803
803
  fileName: "Dialog/Portal.vue",
@@ -809,7 +809,7 @@ export default [
809
809
  fileName: "Dialog/Title.vue",
810
810
  dirPath: "components/UI",
811
811
  fileContent:
812
- '<template>\n <DialogTitle\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'title\', \'class\')"\n >\n <slot>{{ title }}</slot>\n </DialogTitle>\n</template>\n\n<script lang="ts" setup>\n import { DialogTitle } from "radix-vue";\n import type { DialogTitleProps } from "radix-vue";\n\n const props = defineProps<\n DialogTitleProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** The title text */\n title?: string;\n }\n >();\n\n const styles = tv({\n base: "text-lg font-semibold leading-none tracking-tight",\n });\n</script>\n',
812
+ '<template>\n <DialogTitle :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>{{ title }}</slot>\n </DialogTitle>\n</template>\n\n<script lang="ts" setup>\n import { DialogTitle } from "radix-vue";\n import type { DialogTitleProps } from "radix-vue";\n\n const props = defineProps<\n DialogTitleProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** The title text */\n title?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "title");\n const styles = tv({\n base: "text-lg font-semibold leading-none tracking-tight",\n });\n</script>\n',
813
813
  },
814
814
  {
815
815
  fileName: "Dialog/Trigger.vue",
@@ -904,7 +904,7 @@ export default [
904
904
  fileName: "DropdownMenu/Arrow.vue",
905
905
  dirPath: "components/UI",
906
906
  fileContent:
907
- '<template>\n <DropdownMenuArrow\n v-bind="reactiveOmit(props, \'class\')"\n :class="styles({ class: props.class })"\n />\n</template>\n\n<script lang="ts" setup>\n import { DropdownMenuArrow } from "radix-vue";\n import type { DropdownMenuArrowProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n DropdownMenuArrowProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n asChild: false,\n width: 10,\n height: 5,\n }\n );\n\n const styles = tv({\n base: "rotate-45 border bg-muted",\n });\n</script>\n',
907
+ '<template>\n <DropdownMenuArrow v-bind="forwarded" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { DropdownMenuArrow } from "radix-vue";\n import type { DropdownMenuArrowProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n DropdownMenuArrowProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n asChild: false,\n width: 10,\n height: 5,\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "rotate-45 border bg-muted",\n });\n</script>\n',
908
908
  },
909
909
  {
910
910
  fileName: "DropdownMenu/CheckboxItem.vue",
@@ -940,13 +940,13 @@ export default [
940
940
  fileName: "DropdownMenu/ItemIndicator.vue",
941
941
  dirPath: "components/UI",
942
942
  fileContent:
943
- '<template>\n <DropdownMenuItemIndicator v-bind="reactiveOmit(props, \'icon\')">\n <slot>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n </slot>\n </DropdownMenuItemIndicator>\n</template>\n\n<script lang="ts" setup>\n import { DropdownMenuItemIndicator } from "radix-vue";\n import type { DropdownMenuItemIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n DropdownMenuItemIndicatorProps & {\n icon?: string;\n }\n >();\n</script>\n',
943
+ '<template>\n <DropdownMenuItemIndicator v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n </slot>\n </DropdownMenuItemIndicator>\n</template>\n\n<script lang="ts" setup>\n import { DropdownMenuItemIndicator } from "radix-vue";\n import type { DropdownMenuItemIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n DropdownMenuItemIndicatorProps & {\n /** The icon to display */\n icon?: string;\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "icon");\n\n const styles = tv({\n base: "flex items-center justify-center",\n });\n</script>\n',
944
944
  },
945
945
  {
946
946
  fileName: "DropdownMenu/Label.vue",
947
947
  dirPath: "components/UI",
948
948
  fileContent:
949
- '<template>\n <DropdownMenuLabel\n :class="styles({ inset, class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'inset\', \'label\')"\n >\n <slot>{{ label }}</slot>\n </DropdownMenuLabel>\n</template>\n\n<script lang="ts" setup>\n import { DropdownMenuLabel } from "radix-vue";\n import type { DropdownMenuLabelProps } from "radix-vue";\n\n const props = defineProps<\n DropdownMenuLabelProps & {\n class?: any;\n inset?: boolean;\n label?: string;\n }\n >();\n\n const styles = tv({\n base: "inline-block w-full px-2 py-1.5 text-sm font-semibold text-foreground",\n variants: {\n inset: { true: "pl-8" },\n },\n });\n</script>\n',
949
+ '<template>\n <DropdownMenuLabel :class="styles({ inset, class: props.class })" v-bind="forwarded">\n <slot>{{ label }}</slot>\n </DropdownMenuLabel>\n</template>\n\n<script lang="ts" setup>\n import { DropdownMenuLabel } from "radix-vue";\n import type { DropdownMenuLabelProps } from "radix-vue";\n\n const props = defineProps<\n DropdownMenuLabelProps & {\n class?: any;\n inset?: boolean;\n label?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "inset", "label");\n const styles = tv({\n base: "inline-block w-full px-2 py-1.5 text-sm font-semibold text-foreground",\n variants: {\n inset: { true: "pl-8" },\n },\n });\n</script>\n',
950
950
  },
951
951
  {
952
952
  fileName: "DropdownMenu/Portal.vue",
@@ -970,13 +970,13 @@ export default [
970
970
  fileName: "DropdownMenu/Separator.vue",
971
971
  dirPath: "components/UI",
972
972
  fileContent:
973
- '<template>\n <DropdownMenuSeparator\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\')"\n />\n</template>\n\n<script lang="ts" setup>\n import { DropdownMenuSeparator } from "radix-vue";\n import type { DropdownMenuSeparatorProps } from "radix-vue";\n\n const props = defineProps<\n DropdownMenuSeparatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "-mx-1 my-1 h-px bg-border",\n });\n</script>\n',
973
+ '<template>\n <DropdownMenuSeparator :class="styles({ class: props.class })" v-bind="forwarded" />\n</template>\n\n<script lang="ts" setup>\n import { DropdownMenuSeparator } from "radix-vue";\n import type { DropdownMenuSeparatorProps } from "radix-vue";\n\n const props = defineProps<\n DropdownMenuSeparatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "-mx-1 my-1 h-px bg-border",\n });\n</script>\n',
974
974
  },
975
975
  {
976
976
  fileName: "DropdownMenu/Shortcut.vue",
977
977
  dirPath: "components/UI",
978
978
  fileContent:
979
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "span",\n }\n );\n\n const styles = tv({\n base: "ml-auto text-xs tracking-widest opacity-60",\n });\n</script>\n',
979
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "span",\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "ml-auto text-xs tracking-widest opacity-60",\n });\n</script>\n',
980
980
  },
981
981
  {
982
982
  fileName: "DropdownMenu/Sub.vue",
@@ -994,7 +994,7 @@ export default [
994
994
  fileName: "DropdownMenu/SubTrigger.vue",
995
995
  dirPath: "components/UI",
996
996
  fileContent:
997
- '<template>\n <DropdownMenuSubTrigger\n v-bind="reactiveOmit(props, \'class\', \'inset\', \'icon\', \'title\', \'trailingIcon\')"\n :class="styles({ inset, class: props.class })"\n >\n <slot>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n <span v-if="title">{{ title }}</span>\n </slot>\n <Icon\n class="ml-auto h-4 w-4 text-muted-foreground"\n :name="trailingIcon || \'lucide:chevron-right\'"\n />\n </DropdownMenuSubTrigger>\n</template>\n\n<script lang="ts" setup>\n import { DropdownMenuSubTrigger } from "radix-vue";\n import type { DropdownMenuSubTriggerProps } from "radix-vue";\n\n const props = defineProps<\n DropdownMenuSubTriggerProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n /** Wether an indentation should be added to the item or not */\n inset?: boolean;\n /** The icon to display */\n icon?: string;\n /** The title for the item */\n title?: string;\n /** The trailing icon to display */\n trailingIcon?: string;\n }\n >();\n\n const styles = tv({\n base: "flex cursor-default select-none items-center gap-3 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",\n variants: {\n inset: {\n true: "pl-8",\n },\n },\n });\n</script>\n',
997
+ '<template>\n <DropdownMenuSubTrigger v-bind="forwarded" :class="styles({ inset, class: props.class })">\n <slot>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n <span v-if="title">{{ title }}</span>\n </slot>\n <Icon\n class="ml-auto h-4 w-4 text-muted-foreground"\n :name="trailingIcon || \'lucide:chevron-right\'"\n />\n </DropdownMenuSubTrigger>\n</template>\n\n<script lang="ts" setup>\n import { DropdownMenuSubTrigger } from "radix-vue";\n import type { DropdownMenuSubTriggerProps } from "radix-vue";\n\n const props = defineProps<\n DropdownMenuSubTriggerProps & {\n /**Custom class(es) to add to the element */\n class?: any;\n /** Wether an indentation should be added to the item or not */\n inset?: boolean;\n /** The icon to display */\n icon?: string;\n /** The title for the item */\n title?: string;\n /** The trailing icon to display */\n trailingIcon?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "inset", "icon", "title", "trailingIcon");\n const styles = tv({\n base: "flex cursor-default select-none items-center gap-3 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent data-[state=open]:bg-accent",\n variants: {\n inset: {\n true: "pl-8",\n },\n },\n });\n</script>\n',
998
998
  },
999
999
  {
1000
1000
  fileName: "DropdownMenu/Trigger.vue",
@@ -1015,7 +1015,58 @@ export default [
1015
1015
  fileName: "Dropfile.vue",
1016
1016
  dirPath: "components/UI",
1017
1017
  fileContent:
1018
- '<template>\n <div ref="dropZoneRef" :class="styles({ isOverDropZone, class: props.class })" @click="open()">\n <slot name="message">\n <div class="py-10 text-center">\n <slot name="icon">\n <div\n v-if="icon"\n class="inline-flex items-center justify-center rounded-md border p-2 transition"\n :class="[isOverDropZone && \'animate-bounce border-primary\']"\n >\n <Icon\n :name="icon"\n class="h-7 w-7 opacity-70"\n :class="[isOverDropZone && \'text-primary\']"\n />\n </div>\n </slot>\n <slot name="title">\n <p class="mt-5 text-sm font-medium" v-html="title" />\n </slot>\n <slot name="subtext">\n <p class="mt-1 text-sm text-muted-foreground/60" v-html="subtext" />\n </slot>\n </div>\n </slot>\n </div>\n</template>\n\n<script setup lang="ts">\n const props = withDefaults(\n defineProps<{\n /**\n * The text to display as the title of the dropzone.\n */\n title?: string;\n /**\n * The text to display as the subtext of the dropzone.\n */\n subtext?: string;\n /**\n * The icon to display in the dropzone.\n */\n icon?: string;\n /**\n * The function to call when files are dropped.\n */\n // eslint-disable-next-line @typescript-eslint/ban-types\n onDrop?: Function;\n /**\n * Whether or not to allow multiple files to be picked. Does not affect drag and drop.\n */\n multiple?: boolean;\n /**\n * The file types to accept. Does not affect drag and drop.\n */\n accept?: string;\n class?: any;\n }>(),\n {\n title: "Click to upload or drag & drop files.",\n subtext: "All file types accepted",\n icon: "heroicons:cloud-arrow-up",\n multiple: true,\n accept: "*",\n }\n );\n\n const { open, reset, onChange } = useFileDialog({\n multiple: props.multiple,\n accept: props.accept,\n });\n\n onChange((files: FileList | null) => {\n if (files?.length) {\n handleDrop(Array.from(files || []));\n reset();\n }\n });\n\n const dropZoneRef = ref<HTMLDivElement>();\n const emits = defineEmits<{\n dropped: [any];\n }>();\n\n const handleDrop = (files: File[] | null) => {\n if (!files) return;\n if (props.onDrop) props.onDrop(files);\n emits("dropped", files);\n };\n\n const { isOverDropZone } = useDropZone(dropZoneRef, handleDrop);\n\n const styles = tv({\n base: "flex w-full cursor-pointer items-center justify-center rounded-md border border-dashed transition hover:border-primary",\n variants: {\n isOverDropZone: { true: "border-primary bg-primary/10" },\n },\n });\n</script>\n',
1018
+ '<template>\n <div ref="dropZoneRef" :class="styles({ isOverDropZone, class: props.class })" @click="open()">\n <slot name="message">\n <div class="py-10 text-center">\n <slot name="icon">\n <div\n v-if="icon"\n class="inline-flex items-center justify-center rounded-md border p-2 transition"\n :class="[isOverDropZone && \'animate-bounce border-primary\']"\n >\n <Icon\n :name="icon"\n class="h-7 w-7 opacity-70"\n :class="[isOverDropZone && \'text-primary\']"\n />\n </div>\n </slot>\n <slot name="title">\n <p class="mt-5 text-sm font-medium" v-html="title" />\n </slot>\n <slot name="subtext">\n <p class="mt-1 text-sm text-muted-foreground/60" v-html="subtext" />\n </slot>\n </div>\n </slot>\n </div>\n</template>\n\n<script setup lang="ts">\n const props = withDefaults(\n defineProps<{\n /**\n * The text to display as the title of the dropzone.\n */\n title?: string;\n /**\n * The text to display as the subtext of the dropzone.\n */\n subtext?: string;\n /**\n * The icon to display in the dropzone.\n */\n icon?: string;\n /**\n * The function to call when files are dropped.\n */\n // eslint-disable-next-line @typescript-eslint/no-unsafe-function-type\n onDrop?: Function;\n /**\n * Whether or not to allow multiple files to be picked. Does not affect drag and drop.\n */\n multiple?: boolean;\n /**\n * The file types to accept. Does not affect drag and drop.\n */\n accept?: string;\n class?: any;\n }>(),\n {\n title: "Click to upload or drag & drop files.",\n subtext: "All file types accepted",\n icon: "heroicons:cloud-arrow-up",\n multiple: true,\n accept: "*",\n }\n );\n\n const { open, reset, onChange } = useFileDialog({\n multiple: props.multiple,\n accept: props.accept,\n });\n\n onChange((files: FileList | null) => {\n if (files?.length) {\n handleDrop(Array.from(files || []));\n reset();\n }\n });\n\n const dropZoneRef = ref<HTMLDivElement>();\n const emits = defineEmits<{\n dropped: [any];\n }>();\n\n const handleDrop = (files: File[] | null) => {\n if (!files) return;\n if (props.onDrop) props.onDrop(files);\n emits("dropped", files);\n };\n\n const { isOverDropZone } = useDropZone(dropZoneRef, handleDrop);\n\n const styles = tv({\n base: "flex w-full cursor-pointer items-center justify-center rounded-md border border-dashed transition hover:border-primary",\n variants: {\n isOverDropZone: { true: "border-primary bg-primary/10" },\n },\n });\n</script>\n',
1019
+ },
1020
+ ],
1021
+ utils: [],
1022
+ composables: [],
1023
+ plugins: [],
1024
+ },
1025
+ {
1026
+ name: "Editable",
1027
+ value: "editable",
1028
+ files: [
1029
+ {
1030
+ fileName: "Editable/Area.vue",
1031
+ dirPath: "components/UI",
1032
+ fileContent:
1033
+ '<template>\n <EditableArea v-bind="props">\n <slot />\n </EditableArea>\n</template>\n\n<script lang="ts" setup>\n import { EditableArea } from "radix-vue";\n import type { EditableAreaProps } from "radix-vue";\n\n const props = defineProps<EditableAreaProps>();\n</script>\n',
1034
+ },
1035
+ {
1036
+ fileName: "Editable/Cancel.vue",
1037
+ dirPath: "components/UI",
1038
+ fileContent:
1039
+ '<template>\n <EditableCancelTrigger v-bind="props">\n <slot />\n </EditableCancelTrigger>\n</template>\n\n<script lang="ts" setup>\n import { EditableCancelTrigger } from "radix-vue";\n import type { EditableCancelTriggerProps } from "radix-vue";\n\n const props = defineProps<EditableCancelTriggerProps>();\n</script>\n',
1040
+ },
1041
+ {
1042
+ fileName: "Editable/Edit.vue",
1043
+ dirPath: "components/UI",
1044
+ fileContent:
1045
+ '<template>\n <EditableEditTrigger v-bind="props">\n <slot />\n </EditableEditTrigger>\n</template>\n\n<script lang="ts" setup>\n import { EditableEditTrigger } from "radix-vue";\n import type { EditableEditTriggerProps } from "radix-vue";\n\n const props = defineProps<EditableEditTriggerProps>();\n</script>\n',
1046
+ },
1047
+ {
1048
+ fileName: "Editable/Editable.vue",
1049
+ dirPath: "components/UI",
1050
+ fileContent:
1051
+ '<template>\n <EditableRoot :ref="forwardRef" v-slot="slotProps" v-bind="forwarded">\n <slot v-bind="slotProps" />\n </EditableRoot>\n</template>\n\n<script lang="ts" setup>\n import { EditableRoot, useForwardExpose, useForwardPropsEmits } from "radix-vue";\n import type { EditableRootEmits, EditableRootProps } from "radix-vue";\n\n const { currentRef, forwardRef } = useForwardExpose();\n const props = defineProps<EditableRootProps>();\n const emit = defineEmits<EditableRootEmits & { ready: [v?: any] }>();\n const forwarded = useForwardPropsEmits(props, emit);\n\n onMounted(() => {\n // Emit the ready event with the current ref value\n emit("ready", currentRef);\n });\n</script>\n',
1052
+ },
1053
+ {
1054
+ fileName: "Editable/Input.vue",
1055
+ dirPath: "components/UI",
1056
+ fileContent:
1057
+ '<template>\n <EditableInput v-bind="props">\n <slot />\n </EditableInput>\n</template>\n\n<script lang="ts" setup>\n import { EditableInput } from "radix-vue";\n import type { EditableInputProps } from "radix-vue";\n\n const props = defineProps<EditableInputProps>();\n</script>\n',
1058
+ },
1059
+ {
1060
+ fileName: "Editable/Preview.vue",
1061
+ dirPath: "components/UI",
1062
+ fileContent:
1063
+ '<template>\n <EditablePreview v-bind="props">\n <slot />\n </EditablePreview>\n</template>\n\n<script lang="ts" setup>\n import { EditablePreview } from "radix-vue";\n import type { EditablePreviewProps } from "radix-vue";\n\n const props = defineProps<EditablePreviewProps>();\n</script>\n',
1064
+ },
1065
+ {
1066
+ fileName: "Editable/Submit.vue",
1067
+ dirPath: "components/UI",
1068
+ fileContent:
1069
+ '<template>\n <EditableSubmitTrigger v-bind="props">\n <slot />\n </EditableSubmitTrigger>\n</template>\n\n<script lang="ts" setup>\n import { EditableSubmitTrigger } from "radix-vue";\n import type { EditableSubmitTriggerProps } from "radix-vue";\n\n const props = defineProps<EditableSubmitTriggerProps>();\n</script>\n',
1019
1070
  },
1020
1071
  ],
1021
1072
  utils: [],
@@ -1067,7 +1118,7 @@ export default [
1067
1118
  fileName: "Form/Item.vue",
1068
1119
  dirPath: "components/UI",
1069
1120
  fileContent:
1070
- '<template>\n <div :class="styles({ class: props.class })" v-bind="$attrs">\n <slot name="label">\n <UiFormLabel v-if="label || hint" :label="label" :hint="hint" />\n </slot>\n <UiFormControl>\n <slot />\n </UiFormControl>\n <slot name="description">\n <UiFormDescription v-if="description" :description="description" />\n </slot>\n <slot name="errorMessage">\n <TransitionSlide tag="p">\n <UiFormMessage v-if="!hideMessage" />\n </TransitionSlide>\n </slot>\n </div>\n</template>\n\n<script lang="ts">\n import { type InjectionKey } from "vue";\n\n export const FORM_ITEM_INJECTION_KEY = Symbol() as InjectionKey<string>;\n</script>\n\n<script lang="ts" setup>\n defineOptions({ inheritAttrs: false });\n\n const id = useId();\n provide(FORM_ITEM_INJECTION_KEY, id);\n\n const props = defineProps<{\n class?: any;\n label?: string;\n description?: string;\n hint?: string;\n hideMessage?: boolean;\n }>();\n\n const styles = tv({ base: "space-y-1.5" });\n</script>\n',
1121
+ '<template>\n <div :class="styles({ class: props.class })" v-bind="$attrs">\n <slot name="label">\n <UiFormLabel v-if="label || hint" :label="label" :hint="hint" />\n </slot>\n <UiFormControl>\n <slot />\n </UiFormControl>\n <slot name="description">\n <UiFormDescription v-if="description" :description="description" />\n </slot>\n <slot name="errorMessage">\n <TransitionSlide tag="p">\n <UiFormMessage v-if="!hideMessage" />\n </TransitionSlide>\n </slot>\n </div>\n</template>\n\n<script lang="ts">\n import type { InjectionKey } from "vue";\n\n export const FORM_ITEM_INJECTION_KEY = Symbol() as InjectionKey<string>;\n</script>\n\n<script lang="ts" setup>\n defineOptions({ inheritAttrs: false });\n\n const id = useId();\n provide(FORM_ITEM_INJECTION_KEY, id);\n\n const props = defineProps<{\n class?: any;\n label?: string;\n description?: string;\n hint?: string;\n hideMessage?: boolean;\n }>();\n\n const styles = tv({ base: "space-y-1.5" });\n</script>\n',
1071
1122
  },
1072
1123
  {
1073
1124
  fileName: "Form/Label.vue",
@@ -1093,7 +1144,7 @@ export default [
1093
1144
  fileName: "GradientDivider.vue",
1094
1145
  dirPath: "components/UI",
1095
1146
  fileContent:
1096
- '<template>\n <Separator v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { Separator } from "radix-vue";\n import type { SeparatorProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n SeparatorProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >(),\n {\n as: "hr",\n }\n );\n\n const styles = tv({\n base: \'h-px w-full border-t-0 bg-[linear-gradient(90deg,theme("colors.input/10%"),_theme("colors.input"),_theme("colors.input/10%"))]\',\n });\n</script>\n',
1147
+ '<template>\n <Separator v-bind="forwarded" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { Separator } from "radix-vue";\n import type { SeparatorProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n SeparatorProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >(),\n {\n as: "hr",\n }\n );\n\n const forwarded = reactiveOmit(props, "class");\n\n const styles = tv({\n base: \'h-px w-full border-t-0 bg-[linear-gradient(90deg,theme("colors.input/10%"),_theme("colors.input"),_theme("colors.input/10%"))]\',\n });\n</script>\n',
1097
1148
  },
1098
1149
  ],
1099
1150
  utils: [],
@@ -1108,13 +1159,13 @@ export default [
1108
1159
  fileName: "HoverCard/Arrow.vue",
1109
1160
  dirPath: "components/UI",
1110
1161
  fileContent:
1111
- '<template>\n <HoverCardArrow :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')" />\n</template>\n\n<script lang="ts" setup>\n import { HoverCardArrow } from "radix-vue";\n import type { HoverCardArrowProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n HoverCardArrowProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n height: 5,\n width: 10,\n }\n );\n\n const styles = tv({\n base: "fill-popover",\n });\n</script>\n',
1162
+ '<template>\n <HoverCardArrow :class="styles({ class: props.class })" v-bind="forwarded" />\n</template>\n\n<script lang="ts" setup>\n import { HoverCardArrow } from "radix-vue";\n import type { HoverCardArrowProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n HoverCardArrowProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n height: 5,\n width: 10,\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "fill-popover",\n });\n</script>\n',
1112
1163
  },
1113
1164
  {
1114
1165
  fileName: "HoverCard/Content.vue",
1115
1166
  dirPath: "components/UI",
1116
1167
  fileContent:
1117
- '<template>\n <UiHoverCardPortal :to="to">\n <HoverCardContent\n v-bind="{ ...reactiveOmit(props, \'class\', \'to\'), ...$attrs }"\n :class="styles({ class: props.class })"\n >\n <slot />\n </HoverCardContent>\n </UiHoverCardPortal>\n</template>\n\n<script lang="ts" setup>\n import { HoverCardContent } from "radix-vue";\n import type { HoverCardContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = withDefaults(\n defineProps<\n HoverCardContentProps & {\n /** Custom class(es) to add to the content */\n class?: any;\n /** The element or selector the content should be positioned relative to */\n to?: string | HTMLElement;\n }\n >(),\n {\n side: "bottom",\n sideOffset: 5,\n align: "center",\n avoidCollisions: true,\n sticky: "partial",\n }\n );\n\n const styles = tv({\n base: "z-50 w-64 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",\n });\n</script>\n',
1168
+ '<template>\n <UiHoverCardPortal :to="to">\n <HoverCardContent v-bind="{ ...forwarded, ...$attrs }" :class="styles({ class: props.class })">\n <slot />\n </HoverCardContent>\n </UiHoverCardPortal>\n</template>\n\n<script lang="ts" setup>\n import { HoverCardContent } from "radix-vue";\n import type { HoverCardContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = withDefaults(\n defineProps<\n HoverCardContentProps & {\n /** Custom class(es) to add to the content */\n class?: any;\n /** The element or selector the content should be positioned relative to */\n to?: string | HTMLElement;\n }\n >(),\n {\n side: "bottom",\n sideOffset: 5,\n align: "center",\n avoidCollisions: true,\n sticky: "partial",\n }\n );\n const forwarded = reactiveOmit(props, "class", "to");\n const styles = tv({\n base: "z-50 w-64 rounded-md border bg-popover p-4 text-popover-foreground shadow-md outline-none data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-95 data-[side=bottom]:slide-in-from-top-2 data-[side=left]:slide-in-from-right-2 data-[side=right]:slide-in-from-left-2 data-[side=top]:slide-in-from-bottom-2",\n });\n</script>\n',
1118
1169
  },
1119
1170
  {
1120
1171
  fileName: "HoverCard/HoverCard.vue",
@@ -1148,7 +1199,7 @@ export default [
1148
1199
  fileName: "Input.vue",
1149
1200
  dirPath: "components/UI",
1150
1201
  fileContent:
1151
- '<template>\n <input v-bind="props" v-model="localModel" :class="styles({ class: props.class })" >\n</template>\n\n<script lang="ts" setup>\n const props = withDefaults(\n defineProps<{\n class?: any;\n id?: string;\n name?: string;\n placeholder?: string;\n disabled?: boolean;\n required?: boolean;\n type?: string;\n modelValue?: any;\n }>(),\n { type: "text" }\n );\n const emits = defineEmits<{\n "update:modelValue": [value: any];\n }>();\n const localModel = useVModel(props, "modelValue", emits);\n\n const styles = tv({\n base: "form-input h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:px-1 file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground file:hover:cursor-pointer focus:border-input focus:ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 sm:text-sm",\n });\n</script>\n',
1202
+ '<template>\n <!-- eslint-disable-next-line vue/html-self-closing -->\n <input v-bind="props" v-model="localModel" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n const props = withDefaults(\n defineProps<{\n class?: any;\n id?: string;\n name?: string;\n placeholder?: string;\n disabled?: boolean;\n required?: boolean;\n type?: string;\n modelValue?: any;\n }>(),\n { type: "text" }\n );\n const emits = defineEmits<{\n "update:modelValue": [value: any];\n }>();\n const localModel = useVModel(props, "modelValue", emits);\n\n const styles = tv({\n base: "form-input h-10 w-full rounded-md border border-input bg-background px-3 py-2 text-base ring-offset-background file:border-0 file:bg-transparent file:px-1 file:text-sm file:font-medium file:text-foreground placeholder:text-muted-foreground file:hover:cursor-pointer focus:border-input focus:ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 sm:text-sm",\n });\n</script>\n',
1152
1203
  },
1153
1204
  ],
1154
1205
  utils: [],
@@ -1163,7 +1214,7 @@ export default [
1163
1214
  fileName: "Kbd.vue",
1164
1215
  dirPath: "components/UI",
1165
1216
  fileContent:
1166
- '<template>\n <Primitive\n :class="styles({ size, class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'size\')"\n >\n <slot />\n </Primitive>\n</template>\n<script setup lang="ts">\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** The size of the component */\n size?: VariantProps<typeof styles>["size"];\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "kbd",\n size: "sm",\n }\n );\n\n const styles = tv({\n base: "pointer-events-none inline-flex h-5 select-none items-center gap-1 rounded-md border border-border bg-muted font-sans font-medium",\n variants: {\n size: {\n xs: "h-5 min-h-[16px] px-1 text-[10px]",\n sm: "h-6 min-h-[20px] px-1.5 text-[11px]",\n md: "h-7 min-h-[24px] px-2 text-[12px]",\n },\n },\n defaultVariants: {\n size: "sm",\n },\n });\n</script>\n',
1217
+ '<template>\n <Primitive :class="styles({ size, class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n<script setup lang="ts">\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** The size of the component */\n size?: VariantProps<typeof styles>["size"];\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "kbd",\n size: "sm",\n }\n );\n\n const forwarded = reactiveOmit(props, "class", "size");\n\n const styles = tv({\n base: "pointer-events-none inline-flex h-5 select-none items-center gap-1 rounded-md border border-border bg-muted font-sans font-medium",\n variants: {\n size: {\n xs: "h-5 min-h-[16px] px-1 text-[10px]",\n sm: "h-6 min-h-[20px] px-1.5 text-[11px]",\n md: "h-7 min-h-[24px] px-2 text-[12px]",\n },\n },\n defaultVariants: {\n size: "sm",\n },\n });\n</script>\n',
1167
1218
  },
1168
1219
  ],
1169
1220
  utils: [],
@@ -1178,7 +1229,7 @@ export default [
1178
1229
  fileName: "Label.vue",
1179
1230
  dirPath: "components/UI",
1180
1231
  fileContent:
1181
- '<template>\n <Label :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n <slot name="hint">\n <span v-if="hint">\n {{ hint }}\n </span>\n </slot>\n </Label>\n</template>\n\n<script lang="ts" setup>\n import { Label } from "radix-vue";\n import type { LabelProps } from "radix-vue";\n\n const props = defineProps<\n LabelProps & {\n /** Custom class(es) to add to the label */\n class?: any;\n hint?: string;\n }\n >();\n\n const styles = tv({\n base: "flex items-center justify-between text-[15px] font-medium leading-none hover:cursor-pointer peer-disabled:cursor-not-allowed peer-disabled:opacity-70 sm:text-sm",\n });\n</script>\n',
1232
+ '<template>\n <Label :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n <slot name="hint">\n <span v-if="hint">\n {{ hint }}\n </span>\n </slot>\n </Label>\n</template>\n\n<script lang="ts" setup>\n import { Label } from "radix-vue";\n import type { LabelProps } from "radix-vue";\n\n const props = defineProps<\n LabelProps & {\n /** Custom class(es) to add to the label */\n class?: any;\n hint?: string;\n }\n >();\n\n const forwarded = reactiveOmit(props, "class", "hint");\n\n const styles = tv({\n base: "flex items-center justify-between text-[15px] font-medium leading-none hover:cursor-pointer peer-disabled:cursor-not-allowed peer-disabled:opacity-70 sm:text-sm",\n });\n</script>\n',
1182
1233
  },
1183
1234
  ],
1184
1235
  utils: [],
@@ -1193,7 +1244,7 @@ export default [
1193
1244
  fileName: "List/Content.vue",
1194
1245
  dirPath: "components/UI",
1195
1246
  fileContent:
1196
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n\n const styles = tv({\n base: "flex flex-col gap-1 leading-none",\n });\n</script>\n',
1247
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex flex-col gap-1 leading-none",\n });\n</script>\n',
1197
1248
  },
1198
1249
  {
1199
1250
  fileName: "List/Item.vue",
@@ -1205,19 +1256,19 @@ export default [
1205
1256
  fileName: "List/List.vue",
1206
1257
  dirPath: "components/UI",
1207
1258
  fileContent:
1208
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "ul",\n }\n );\n\n const styles = tv({\n base: "w-full py-2",\n });\n</script>\n',
1259
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n as: "ul",\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "w-full py-2",\n });\n</script>\n',
1209
1260
  },
1210
1261
  {
1211
1262
  fileName: "List/Subtitle.vue",
1212
1263
  dirPath: "components/UI",
1213
1264
  fileContent:
1214
- '<template>\n <Primitive\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'subtitle\')"\n >\n <slot>{{ subtitle }}</slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** The subtitle of the component */\n subtitle?: string;\n }\n >(),\n {\n as: "p",\n }\n );\n\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
1265
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>{{ subtitle }}</slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** The subtitle of the component */\n subtitle?: string;\n }\n >(),\n {\n as: "p",\n }\n );\n const forwarded = reactiveOmit(props, "class", "subtitle");\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
1215
1266
  },
1216
1267
  {
1217
1268
  fileName: "List/Title.vue",
1218
1269
  dirPath: "components/UI",
1219
1270
  fileContent:
1220
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\', \'title\')">\n <slot>{{ title }}</slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** The title of the component */\n title?: string;\n }\n >(),\n {\n as: "p",\n }\n );\n\n const styles = tv({\n base: "font-semibold",\n });\n</script>\n',
1271
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>{{ title }}</slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** The title of the component */\n title?: string;\n }\n >(),\n {\n as: "p",\n }\n );\n const forwarded = reactiveOmit(props, "class", "title");\n const styles = tv({\n base: "font-semibold",\n });\n</script>\n',
1221
1272
  },
1222
1273
  ],
1223
1274
  utils: [],
@@ -1319,13 +1370,13 @@ export default [
1319
1370
  fileName: "Menubar/ItemIndicator.vue",
1320
1371
  dirPath: "components/UI",
1321
1372
  fileContent:
1322
- '<template>\n <MenubarItemIndicator v-bind="reactiveOmit(props, \'icon\')">\n <slot>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n </slot>\n </MenubarItemIndicator>\n</template>\n\n<script lang="ts" setup>\n import { MenubarItemIndicator } from "radix-vue";\n import type { MenubarItemIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n MenubarItemIndicatorProps & {\n icon?: string;\n }\n >();\n</script>\n',
1373
+ '<template>\n <MenubarItemIndicator v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n </slot>\n </MenubarItemIndicator>\n</template>\n\n<script lang="ts" setup>\n import { MenubarItemIndicator } from "radix-vue";\n import type { MenubarItemIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n MenubarItemIndicatorProps & {\n /** The icon to display */\n icon?: string;\n /** The class(es) to apply to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "icon");\n const styles = tv({\n base: "flex shrink-0 items-center justify-center",\n });\n</script>\n',
1323
1374
  },
1324
1375
  {
1325
1376
  fileName: "Menubar/Label.vue",
1326
1377
  dirPath: "components/UI",
1327
1378
  fileContent:
1328
- '<template>\n <MenubarLabel\n :class="styles({ inset, class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'inset\')"\n >\n <slot />\n </MenubarLabel>\n</template>\n\n<script lang="ts" setup>\n import { MenubarLabel } from "radix-vue";\n import type { MenubarLabelProps } from "radix-vue";\n\n const props = defineProps<\n MenubarLabelProps & {\n class?: any;\n inset?: boolean;\n }\n >();\n\n const styles = tv({\n base: "px-2 py-1.5 text-sm font-semibold",\n variants: {\n inset: {\n true: "pl-8",\n },\n },\n });\n</script>\n',
1379
+ '<template>\n <MenubarLabel :class="styles({ inset, class: props.class })" v-bind="forwarded">\n <slot />\n </MenubarLabel>\n</template>\n\n<script lang="ts" setup>\n import { MenubarLabel } from "radix-vue";\n import type { MenubarLabelProps } from "radix-vue";\n\n const props = defineProps<\n MenubarLabelProps & {\n class?: any;\n inset?: boolean;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "inset");\n const styles = tv({\n base: "px-2 py-1.5 text-sm font-semibold",\n variants: {\n inset: {\n true: "pl-8",\n },\n },\n });\n</script>\n',
1329
1380
  },
1330
1381
  {
1331
1382
  fileName: "Menubar/Menu.vue",
@@ -1343,7 +1394,7 @@ export default [
1343
1394
  fileName: "Menubar/Portal.vue",
1344
1395
  dirPath: "components/UI",
1345
1396
  fileContent:
1346
- '<template>\n <MenubarPortal v-bind="props">\n <slot />\n </MenubarPortal>\n</template>\n\n<script lang="ts" setup>\n import { type MenubarPortalProps } from "radix-vue";\n\n const props = defineProps<MenubarPortalProps>();\n</script>\n',
1397
+ '<template>\n <MenubarPortal v-bind="props">\n <slot />\n </MenubarPortal>\n</template>\n\n<script lang="ts" setup>\n import type { MenubarPortalProps } from "radix-vue";\n\n const props = defineProps<MenubarPortalProps>();\n</script>\n',
1347
1398
  },
1348
1399
  {
1349
1400
  fileName: "Menubar/RadioGroup.vue",
@@ -1361,13 +1412,13 @@ export default [
1361
1412
  fileName: "Menubar/Separator.vue",
1362
1413
  dirPath: "components/UI",
1363
1414
  fileContent:
1364
- '<template>\n <MenubarSeparator :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')" />\n</template>\n\n<script lang="ts" setup>\n import { MenubarSeparator } from "radix-vue";\n import type { MenubarSeparatorProps } from "radix-vue";\n\n const props = defineProps<\n MenubarSeparatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "-mx-1 my-1 h-px bg-border",\n });\n</script>\n',
1415
+ '<template>\n <MenubarSeparator :class="styles({ class: props.class })" v-bind="forwarded" />\n</template>\n\n<script lang="ts" setup>\n import { MenubarSeparator } from "radix-vue";\n import type { MenubarSeparatorProps } from "radix-vue";\n\n const props = defineProps<\n MenubarSeparatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "-mx-1 my-1 h-px bg-border",\n });\n</script>\n',
1365
1416
  },
1366
1417
  {
1367
1418
  fileName: "Menubar/Shortcut.vue",
1368
1419
  dirPath: "components/UI",
1369
1420
  fileContent:
1370
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n { as: "span" }\n );\n\n const styles = tv({\n base: "ml-auto text-xs tracking-widest opacity-60",\n });\n</script>\n',
1421
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n { as: "span" }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "ml-auto text-xs tracking-widest opacity-60",\n });\n</script>\n',
1371
1422
  },
1372
1423
  {
1373
1424
  fileName: "Menubar/Sub.vue",
@@ -1385,13 +1436,13 @@ export default [
1385
1436
  fileName: "Menubar/SubTrigger.vue",
1386
1437
  dirPath: "components/UI",
1387
1438
  fileContent:
1388
- '<template>\n <MenubarSubTrigger\n v-bind="reactiveOmit(props, \'class\', \'inset\', \'icon\', \'title\', \'trailingIcon\')"\n :class="styles({ inset, class: props.class })"\n >\n <slot>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n <span v-if="title">{{ title }}</span>\n </slot>\n <Icon\n class="ml-auto h-4 w-4 text-muted-foreground"\n :name="trailingIcon || \'lucide:chevron-right\'"\n />\n </MenubarSubTrigger>\n</template>\n\n<script lang="ts" setup>\n import { MenubarSubTrigger } from "radix-vue";\n import type { MenubarSubTriggerProps } from "radix-vue";\n\n const props = defineProps<\n MenubarSubTriggerProps & {\n class?: any;\n inset?: boolean;\n icon?: string;\n title?: string;\n trailingIcon?: string;\n }\n >();\n\n const styles = tv({\n base: "flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-accent-foreground",\n variants: {\n inset: {\n true: "pl-8",\n },\n },\n });\n</script>\n',
1439
+ '<template>\n <MenubarSubTrigger v-bind="forwarded" :class="styles({ inset, class: props.class })">\n <slot>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n <span v-if="title">{{ title }}</span>\n </slot>\n <Icon\n class="ml-auto h-4 w-4 text-muted-foreground"\n :name="trailingIcon || \'lucide:chevron-right\'"\n />\n </MenubarSubTrigger>\n</template>\n\n<script lang="ts" setup>\n import { MenubarSubTrigger } from "radix-vue";\n import type { MenubarSubTriggerProps } from "radix-vue";\n\n const props = defineProps<\n MenubarSubTriggerProps & {\n class?: any;\n inset?: boolean;\n icon?: string;\n title?: string;\n trailingIcon?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "inset", "icon", "title", "trailingIcon");\n const styles = tv({\n base: "flex cursor-pointer select-none items-center rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-accent-foreground",\n variants: {\n inset: {\n true: "pl-8",\n },\n },\n });\n</script>\n',
1389
1440
  },
1390
1441
  {
1391
1442
  fileName: "Menubar/Trigger.vue",
1392
1443
  dirPath: "components/UI",
1393
1444
  fileContent:
1394
- '<template>\n <MenubarTrigger :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </MenubarTrigger>\n</template>\n\n<script lang="ts" setup>\n import { MenubarTrigger } from "radix-vue";\n import type { MenubarTriggerProps } from "radix-vue";\n\n const props = defineProps<\n MenubarTriggerProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "flex cursor-pointer select-none items-center rounded-sm px-3 py-1.5 text-sm font-medium outline-none hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground data-[highlighted]:bg-accent data-[state=open]:bg-accent data-[highlighted]:text-accent-foreground data-[state=open]:text-accent-foreground",\n });\n</script>\n',
1445
+ '<template>\n <MenubarTrigger :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </MenubarTrigger>\n</template>\n\n<script lang="ts" setup>\n import { MenubarTrigger } from "radix-vue";\n import type { MenubarTriggerProps } from "radix-vue";\n\n const props = defineProps<\n MenubarTriggerProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex cursor-pointer select-none items-center rounded-sm px-3 py-1.5 text-sm font-medium outline-none hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground data-[highlighted]:bg-accent data-[state=open]:bg-accent data-[highlighted]:text-accent-foreground data-[state=open]:text-accent-foreground",\n });\n</script>\n',
1395
1446
  },
1396
1447
  ],
1397
1448
  utils: [],
@@ -1422,7 +1473,7 @@ export default [
1422
1473
  fileName: "Navbar.vue",
1423
1474
  dirPath: "components/UI",
1424
1475
  fileContent:
1425
- '<template>\n <Primitive :class="styles({ sticky, class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n class?: any;\n sticky?: boolean;\n }\n >(),\n {\n as: "header",\n }\n );\n\n const styles = tv({\n base: "z-20 border-b bg-background/90 backdrop-blur",\n variants: {\n sticky: {\n true: "sticky top-0",\n },\n },\n });\n</script>\n',
1476
+ '<template>\n <Primitive :class="styles({ sticky, class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** Whether the navbar should be sticky */\n sticky?: boolean;\n }\n >(),\n {\n as: "header",\n }\n );\n\n const forwarded = reactiveOmit(props, "class", "sticky");\n\n const styles = tv({\n base: "z-20 border-b bg-background/90 backdrop-blur",\n variants: {\n sticky: {\n true: "sticky top-0",\n },\n },\n });\n</script>\n',
1426
1477
  },
1427
1478
  ],
1428
1479
  utils: [],
@@ -1443,7 +1494,7 @@ export default [
1443
1494
  fileName: "NavigationMenu/Indicator.vue",
1444
1495
  dirPath: "components/UI",
1445
1496
  fileContent:
1446
- '<template>\n <NavigationMenuIndicator\n v-bind="reactiveOmit(props, \'class\')"\n :class="styles({ class: props.class })"\n >\n <slot />\n <div class="relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" />\n </NavigationMenuIndicator>\n</template>\n\n<script lang="ts" setup>\n import { NavigationMenuIndicator } from "radix-vue";\n import type { NavigationMenuIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n NavigationMenuIndicatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in",\n });\n</script>\n',
1497
+ '<template>\n <NavigationMenuIndicator v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n <div class="relative top-[60%] h-2 w-2 rotate-45 rounded-tl-sm bg-border shadow-md" />\n </NavigationMenuIndicator>\n</template>\n\n<script lang="ts" setup>\n import { NavigationMenuIndicator } from "radix-vue";\n import type { NavigationMenuIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n NavigationMenuIndicatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "top-full z-[1] flex h-1.5 items-end justify-center overflow-hidden data-[state=visible]:animate-in data-[state=hidden]:animate-out data-[state=hidden]:fade-out data-[state=visible]:fade-in",\n });\n</script>\n',
1447
1498
  },
1448
1499
  {
1449
1500
  fileName: "NavigationMenu/Item.vue",
@@ -1461,7 +1512,7 @@ export default [
1461
1512
  fileName: "NavigationMenu/List.vue",
1462
1513
  dirPath: "components/UI",
1463
1514
  fileContent:
1464
- '<template>\n <NavigationMenuList v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\n <slot />\n </NavigationMenuList>\n</template>\n\n<script lang="ts" setup>\n import { NavigationMenuList } from "radix-vue";\n import type { NavigationMenuListProps } from "radix-vue";\n\n const props = defineProps<\n NavigationMenuListProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "group flex flex-1 list-none items-center justify-center space-x-1",\n });\n</script>\n',
1515
+ '<template>\n <NavigationMenuList v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n </NavigationMenuList>\n</template>\n\n<script lang="ts" setup>\n import { NavigationMenuList } from "radix-vue";\n import type { NavigationMenuListProps } from "radix-vue";\n\n const props = defineProps<\n NavigationMenuListProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "group flex flex-1 list-none items-center justify-center space-x-1",\n });\n</script>\n',
1465
1516
  },
1466
1517
  {
1467
1518
  fileName: "NavigationMenu/NavigationMenu.vue",
@@ -1479,13 +1530,13 @@ export default [
1479
1530
  fileName: "NavigationMenu/Trigger.vue",
1480
1531
  dirPath: "components/UI",
1481
1532
  fileContent:
1482
- '<template>\n <NavigationMenuTrigger\n v-bind="reactiveOmit(props, \'class\', \'icon\', \'title\')"\n :class="styles({ class: props.class })"\n >\n <slot>{{ title }}</slot>\n <slot name="icon">\n <Icon\n :name="icon || \'lucide:chevron-down\'"\n class="relative top-[1px] ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180"\n aria-hidden="true"\n />\n </slot>\n </NavigationMenuTrigger>\n</template>\n\n<script lang="ts" setup>\n import { NavigationMenuTrigger } from "radix-vue";\n import type { NavigationMenuTriggerProps } from "radix-vue";\n\n const props = defineProps<\n NavigationMenuTriggerProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** Icon to show */\n icon?: string;\n /** Title to show */\n title?: string;\n }\n >();\n\n const styles = tv({\n base: "group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-accent/50 data-[state=open]:bg-accent/50",\n });\n</script>\n',
1533
+ '<template>\n <NavigationMenuTrigger v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>{{ title }}</slot>\n <slot name="icon">\n <Icon\n :name="icon || \'lucide:chevron-down\'"\n class="relative top-[1px] ml-1 h-3 w-3 transition duration-200 group-data-[state=open]:rotate-180"\n aria-hidden="true"\n />\n </slot>\n </NavigationMenuTrigger>\n</template>\n\n<script lang="ts" setup>\n import { NavigationMenuTrigger } from "radix-vue";\n import type { NavigationMenuTriggerProps } from "radix-vue";\n\n const props = defineProps<\n NavigationMenuTriggerProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** Icon to show */\n icon?: string;\n /** Title to show */\n title?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "icon", "title");\n const styles = tv({\n base: "group inline-flex h-10 w-max items-center justify-center rounded-md bg-background px-4 py-2 text-sm font-medium transition-colors hover:bg-accent hover:text-accent-foreground focus:bg-accent focus:text-accent-foreground focus:outline-none disabled:pointer-events-none disabled:opacity-50 data-[active]:bg-accent/50 data-[state=open]:bg-accent/50",\n });\n</script>\n',
1483
1534
  },
1484
1535
  {
1485
1536
  fileName: "NavigationMenu/Viewport.vue",
1486
1537
  dirPath: "components/UI",
1487
1538
  fileContent:
1488
- '<template>\n <div class="absolute left-0 top-full flex justify-center">\n <NavigationMenuViewport\n v-bind="{ ...reactiveOmit(props, \'class\'), ...$attrs }"\n :class="styles({ class: props.class })"\n />\n </div>\n</template>\n\n<script lang="ts" setup>\n import { NavigationMenuViewport } from "radix-vue";\n import type { NavigationMenuViewportProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n const props = defineProps<\n NavigationMenuViewportProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const styles = tv({\n base: "origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]",\n });\n</script>\n',
1539
+ '<template>\n <div class="absolute left-0 top-full flex justify-center">\n <NavigationMenuViewport\n v-bind="{ ...forwarded, ...$attrs }"\n :class="styles({ class: props.class })"\n />\n </div>\n</template>\n\n<script lang="ts" setup>\n import { NavigationMenuViewport } from "radix-vue";\n import type { NavigationMenuViewportProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n const props = defineProps<\n NavigationMenuViewportProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "origin-top-center relative mt-1.5 h-[var(--radix-navigation-menu-viewport-height)] w-full overflow-hidden rounded-md border bg-popover text-popover-foreground shadow-lg data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:zoom-out-95 data-[state=open]:zoom-in-90 md:w-[var(--radix-navigation-menu-viewport-width)]",\n });\n</script>\n',
1489
1540
  },
1490
1541
  ],
1491
1542
  utils: [],
@@ -1534,13 +1585,13 @@ export default [
1534
1585
  fileName: "Pagination/Ellipsis.vue",
1535
1586
  dirPath: "components/UI",
1536
1587
  fileContent:
1537
- '<template>\n <PaginationEllipsis v-bind="reactiveOmit(props, \'icon\')">\n <slot>\n <div v-if="icon" class="inline-flex h-9 w-9 items-center justify-center hover:bg-transparent">\n <Icon :name="icon" />\n </div>\n </slot>\n </PaginationEllipsis>\n</template>\n\n<script lang="ts" setup>\n import { PaginationEllipsis } from "radix-vue";\n import type { PaginationEllipsisProps } from "radix-vue";\n\n const props = defineProps<\n PaginationEllipsisProps & {\n /** Icon to show */\n icon?: string;\n }\n >();\n</script>\n',
1588
+ '<template>\n <PaginationEllipsis v-bind="forwarded">\n <slot>\n <div v-if="icon" class="inline-flex h-9 w-9 items-center justify-center hover:bg-transparent">\n <Icon :name="icon" />\n </div>\n </slot>\n </PaginationEllipsis>\n</template>\n\n<script lang="ts" setup>\n import { PaginationEllipsis } from "radix-vue";\n import type { PaginationEllipsisProps } from "radix-vue";\n\n const props = defineProps<\n PaginationEllipsisProps & {\n /** Icon to show */\n icon?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "icon");\n</script>\n',
1538
1589
  },
1539
1590
  {
1540
1591
  fileName: "Pagination/First.vue",
1541
1592
  dirPath: "components/UI",
1542
1593
  fileContent:
1543
- '<template>\n <PaginationFirst v-bind="reactiveOmit(props, \'icon\')">\n <slot>\n <UiButton v-if="icon" variant="ghost" size="icon-sm">\n <Icon :name="icon" />\n </UiButton>\n </slot>\n </PaginationFirst>\n</template>\n\n<script lang="ts" setup>\n import { PaginationFirst } from "radix-vue";\n import type { PaginationFirstProps } from "radix-vue";\n\n const props = defineProps<\n PaginationFirstProps & {\n /** Icon to show */\n icon?: string;\n }\n >();\n</script>\n',
1594
+ '<template>\n <PaginationFirst v-bind="forwarded">\n <slot>\n <UiButton v-if="icon" variant="ghost" size="icon-sm">\n <Icon :name="icon" />\n </UiButton>\n </slot>\n </PaginationFirst>\n</template>\n\n<script lang="ts" setup>\n import { PaginationFirst } from "radix-vue";\n import type { PaginationFirstProps } from "radix-vue";\n\n const props = defineProps<\n PaginationFirstProps & {\n /** Icon to show */\n icon?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "icon");\n</script>\n',
1544
1595
  },
1545
1596
  {
1546
1597
  fileName: "Pagination/Item.vue",
@@ -1552,13 +1603,13 @@ export default [
1552
1603
  fileName: "Pagination/Last.vue",
1553
1604
  dirPath: "components/UI",
1554
1605
  fileContent:
1555
- '<template>\n <PaginationLast v-bind="reactiveOmit(props, \'icon\')">\n <slot>\n <UiButton v-if="icon" variant="ghost" size="icon-sm">\n <Icon :name="icon" />\n </UiButton>\n </slot>\n </PaginationLast>\n</template>\n\n<script lang="ts" setup>\n import { PaginationLast } from "radix-vue";\n import type { PaginationLastProps } from "radix-vue";\n\n const props = defineProps<\n PaginationLastProps & {\n /** Icon to show */\n icon?: string;\n }\n >();\n</script>\n',
1606
+ '<template>\n <PaginationLast v-bind="forwarded">\n <slot>\n <UiButton v-if="icon" variant="ghost" size="icon-sm">\n <Icon :name="icon" />\n </UiButton>\n </slot>\n </PaginationLast>\n</template>\n\n<script lang="ts" setup>\n import { PaginationLast } from "radix-vue";\n import type { PaginationLastProps } from "radix-vue";\n\n const props = defineProps<\n PaginationLastProps & {\n /** Icon to show */\n icon?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "icon");\n</script>\n',
1556
1607
  },
1557
1608
  {
1558
1609
  fileName: "Pagination/List.vue",
1559
1610
  dirPath: "components/UI",
1560
1611
  fileContent:
1561
- '<template>\n <PaginationList\n v-slot="{ items }"\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\')"\n >\n <slot :items="items" />\n </PaginationList>\n</template>\n\n<script lang="ts" setup>\n import { PaginationList } from "radix-vue";\n import type { PaginationListProps } from "radix-vue";\n\n const props = defineProps<\n PaginationListProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "flex items-center gap-1",\n });\n</script>\n',
1612
+ '<template>\n <PaginationList v-slot="{ items }" :class="styles({ class: props.class })" v-bind="forwarded">\n <slot :items="items" />\n </PaginationList>\n</template>\n\n<script lang="ts" setup>\n import { PaginationList } from "radix-vue";\n import type { PaginationListProps } from "radix-vue";\n\n const props = defineProps<\n PaginationListProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex items-center gap-1",\n });\n</script>\n',
1562
1613
  },
1563
1614
  {
1564
1615
  fileName: "Pagination/Next.vue",
@@ -1576,7 +1627,7 @@ export default [
1576
1627
  fileName: "Pagination/Prev.vue",
1577
1628
  dirPath: "components/UI",
1578
1629
  fileContent:
1579
- '<template>\n <PaginationPrev v-bind="reactiveOmit(props, \'icon\')">\n <slot>\n <UiButton v-if="icon" variant="ghost" size="icon-sm">\n <Icon :name="icon" />\n </UiButton>\n </slot>\n </PaginationPrev>\n</template>\n\n<script lang="ts" setup>\n import { PaginationPrev } from "radix-vue";\n import type { PaginationPrevProps } from "radix-vue";\n\n const props = defineProps<\n PaginationPrevProps & {\n /** Icon to show */\n icon?: string;\n }\n >();\n</script>\n',
1630
+ '<template>\n <PaginationPrev v-bind="forwarded">\n <slot>\n <UiButton v-if="icon" variant="ghost" size="icon-sm">\n <Icon :name="icon" />\n </UiButton>\n </slot>\n </PaginationPrev>\n</template>\n\n<script lang="ts" setup>\n import { PaginationPrev } from "radix-vue";\n import type { PaginationPrevProps } from "radix-vue";\n\n const props = defineProps<\n PaginationPrevProps & {\n /** Icon to show */\n icon?: string;\n }\n >();\n\n const forwarded = reactiveOmit(props, "icon");\n</script>\n',
1580
1631
  },
1581
1632
  ],
1582
1633
  utils: [],
@@ -1597,7 +1648,7 @@ export default [
1597
1648
  fileName: "PinInput/PinInputInput.vue",
1598
1649
  dirPath: "components/UI",
1599
1650
  fileContent:
1600
- '<template>\n <PinInputInput v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { PinInputInput } from "radix-vue";\n import type { PinInputInputProps } from "radix-vue";\n\n const props = defineProps<\n PinInputInputProps & {\n class?: any;\n }\n >();\n const styles = tv({\n base: "h-10 w-10 rounded-md border border-input bg-background p-1 text-center text-base font-medium placeholder:text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 sm:text-sm",\n });\n</script>\n',
1651
+ '<template>\n <PinInputInput v-bind="forwarded" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { PinInputInput } from "radix-vue";\n import type { PinInputInputProps } from "radix-vue";\n\n const props = defineProps<\n PinInputInputProps & {\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "h-10 w-10 rounded-md border border-input bg-background p-1 text-center text-base font-medium placeholder:text-sm focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background disabled:cursor-not-allowed disabled:opacity-50 sm:text-sm",\n });\n</script>\n',
1601
1652
  },
1602
1653
  ],
1603
1654
  utils: [],
@@ -1618,7 +1669,7 @@ export default [
1618
1669
  fileName: "Popover/Arrow.vue",
1619
1670
  dirPath: "components/UI",
1620
1671
  fileContent:
1621
- '<template>\n <PopoverArrow v-bind="forwarded" />\n</template>\n\n<script lang="ts" setup>\n import { PopoverArrow, useForwardProps } from "radix-vue";\n import type { PopoverArrowProps } from "radix-vue/dist/Popover/PopoverArrow";\n\n const props = withDefaults(defineProps<PopoverArrowProps>(), {\n width: 10,\n height: 5,\n });\n\n const forwarded = useForwardProps(props);\n</script>\n',
1672
+ '<template>\n <PopoverArrow v-bind="forwarded" />\n</template>\n\n<script lang="ts" setup>\n import { PopoverArrow, useForwardProps } from "radix-vue";\n import type { PopoverArrowProps } from "radix-vue";\n\n const props = withDefaults(defineProps<PopoverArrowProps>(), {\n width: 10,\n height: 5,\n });\n\n const forwarded = useForwardProps(props);\n</script>\n',
1622
1673
  },
1623
1674
  {
1624
1675
  fileName: "Popover/Close.vue",
@@ -1669,7 +1720,7 @@ export default [
1669
1720
  fileName: "Progress/Indicator.vue",
1670
1721
  dirPath: "components/UI",
1671
1722
  fileContent:
1672
- '<template>\n <ProgressIndicator v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\n <slot />\n </ProgressIndicator>\n</template>\n\n<script lang="ts" setup>\n import { ProgressIndicator } from "radix-vue";\n import type { ProgressIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n ProgressIndicatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "h-full w-full flex-1 rounded-full bg-primary transition-all",\n });\n</script>\n',
1723
+ '<template>\n <ProgressIndicator v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n </ProgressIndicator>\n</template>\n\n<script lang="ts" setup>\n import { ProgressIndicator } from "radix-vue";\n import type { ProgressIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n ProgressIndicatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "h-full w-full flex-1 rounded-full bg-primary transition-all",\n });\n</script>\n',
1673
1724
  },
1674
1725
  {
1675
1726
  fileName: "Progress/Progress.vue",
@@ -1690,13 +1741,13 @@ export default [
1690
1741
  fileName: "RadioGroup/Indicator.vue",
1691
1742
  dirPath: "components/UI",
1692
1743
  fileContent:
1693
- '<template>\n <RadioGroupIndicator\n v-bind="reactiveOmit(props, \'class\', \'icon\')"\n :class="styles({ class: props.class })"\n >\n <slot>\n <Icon :name="icon || \'ph:circle-fill\'" class="h-2.5 w-2.5 fill-current text-current" />\n </slot>\n </RadioGroupIndicator>\n</template>\n\n<script lang="ts" setup>\n import { RadioGroupIndicator } from "radix-vue";\n import type { RadioGroupIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n RadioGroupIndicatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** Icon to show */\n icon?: string;\n }\n >();\n\n const styles = tv({\n base: "flex items-center justify-center",\n });\n</script>\n',
1744
+ '<template>\n <RadioGroupIndicator v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <Icon :name="icon || \'ph:circle-fill\'" class="h-2.5 w-2.5 fill-current text-current" />\n </slot>\n </RadioGroupIndicator>\n</template>\n\n<script lang="ts" setup>\n import { RadioGroupIndicator } from "radix-vue";\n import type { RadioGroupIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n RadioGroupIndicatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** Icon to show */\n icon?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "icon");\n const styles = tv({\n base: "flex items-center justify-center",\n });\n</script>\n',
1694
1745
  },
1695
1746
  {
1696
1747
  fileName: "RadioGroup/Item.vue",
1697
1748
  dirPath: "components/UI",
1698
1749
  fileContent:
1699
- '<template>\n <RadioGroupItem\n v-bind="reactiveOmit(props, \'class\', \'icon\')"\n :class="styles({ class: props.class })"\n >\n <slot>\n <UiRadioGroupIndicator :icon="props.icon" />\n </slot>\n </RadioGroupItem>\n</template>\n\n<script lang="ts" setup>\n import { RadioGroupItem } from "radix-vue";\n import type { RadioGroupItemProps } from "radix-vue";\n\n const props = defineProps<\n RadioGroupItemProps & {\n /** Class to apply to the item */\n class?: any;\n /** Icon to show */\n icon?: string;\n }\n >();\n\n const styles = tv({\n base: "aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",\n });\n</script>\n',
1750
+ '<template>\n <RadioGroupItem v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <UiRadioGroupIndicator :icon="props.icon" />\n </slot>\n </RadioGroupItem>\n</template>\n\n<script lang="ts" setup>\n import { RadioGroupItem } from "radix-vue";\n import type { RadioGroupItemProps } from "radix-vue";\n\n const props = defineProps<\n RadioGroupItemProps & {\n /** Class to apply to the item */\n class?: any;\n /** Icon to show */\n icon?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "icon");\n const styles = tv({\n base: "aspect-square h-4 w-4 rounded-full border border-primary text-primary ring-offset-background focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50",\n });\n</script>\n',
1700
1751
  },
1701
1752
  {
1702
1753
  fileName: "RadioGroup/RadioGroup.vue",
@@ -1723,25 +1774,25 @@ export default [
1723
1774
  fileName: "ScrollArea/ScrollArea.vue",
1724
1775
  dirPath: "components/UI",
1725
1776
  fileContent:
1726
- '<template>\n <ScrollAreaRoot v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\n <UiScrollAreaViewport>\n <slot />\n </UiScrollAreaViewport>\n <UiScrollAreaScrollbar :orientation="orientation" />\n <UiScrollAreaCorner />\n </ScrollAreaRoot>\n</template>\n\n<script lang="ts" setup>\n import { ScrollAreaRoot } from "radix-vue";\n import type { ScrollAreaRootProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n ScrollAreaRootProps & {\n /** Orientation for scrolling */\n orientation?: "vertical" | "horizontal";\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n orientation: "vertical",\n }\n );\n\n const styles = tv({\n base: "relative overflow-hidden",\n });\n</script>\n',
1777
+ '<template>\n <ScrollAreaRoot v-bind="forwarded" :class="styles({ class: props.class })">\n <UiScrollAreaViewport>\n <slot />\n </UiScrollAreaViewport>\n <UiScrollAreaScrollbar :orientation="orientation" />\n <UiScrollAreaCorner />\n </ScrollAreaRoot>\n</template>\n\n<script lang="ts" setup>\n import { ScrollAreaRoot } from "radix-vue";\n import type { ScrollAreaRootProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n ScrollAreaRootProps & {\n /** Orientation for scrolling */\n orientation?: "vertical" | "horizontal";\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >(),\n {\n orientation: "vertical",\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "relative overflow-hidden",\n });\n</script>\n',
1727
1778
  },
1728
1779
  {
1729
1780
  fileName: "ScrollArea/Scrollbar.vue",
1730
1781
  dirPath: "components/UI",
1731
1782
  fileContent:
1732
- '<template>\n <ScrollAreaScrollbar\n v-bind="reactiveOmit(props, \'class\')"\n :class="styles({ orientation, class: props.class })"\n >\n <slot />\n <UiScrollAreaThumb />\n </ScrollAreaScrollbar>\n</template>\n\n<script lang="ts" setup>\n import { ScrollAreaScrollbar } from "radix-vue";\n import type { ScrollAreaScrollbarProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n ScrollAreaScrollbarProps & {\n /** Class to apply to the scrollbar */\n class?: any;\n }\n >(),\n {\n orientation: "vertical",\n }\n );\n\n const styles = tv({\n base: "flex touch-none select-none transition-colors",\n variants: {\n orientation: {\n vertical: "h-full w-2.5 border-l border-l-transparent p-[1px]",\n horizontal: "h-2.5 border-t border-t-transparent p-[1px]",\n },\n },\n });\n</script>\n',
1783
+ '<template>\n <ScrollAreaScrollbar v-bind="forwarded" :class="styles({ orientation, class: props.class })">\n <slot />\n <UiScrollAreaThumb />\n </ScrollAreaScrollbar>\n</template>\n\n<script lang="ts" setup>\n import { ScrollAreaScrollbar } from "radix-vue";\n import type { ScrollAreaScrollbarProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n ScrollAreaScrollbarProps & {\n /** Class to apply to the scrollbar */\n class?: any;\n }\n >(),\n {\n orientation: "vertical",\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex touch-none select-none transition-colors",\n variants: {\n orientation: {\n vertical: "h-full w-2.5 border-l border-l-transparent p-[1px]",\n horizontal: "h-2.5 border-t border-t-transparent p-[1px]",\n },\n },\n });\n</script>\n',
1733
1784
  },
1734
1785
  {
1735
1786
  fileName: "ScrollArea/Thumb.vue",
1736
1787
  dirPath: "components/UI",
1737
1788
  fileContent:
1738
- '<template>\n <ScrollAreaThumb\n v-bind="reactiveOmit(props, \'class\')"\n :class="styles({ orientation, class: props.class })"\n >\n <slot />\n </ScrollAreaThumb>\n</template>\n\n<script lang="ts" setup>\n import { ScrollAreaThumb } from "radix-vue";\n import type { ScrollAreaThumbProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n ScrollAreaThumbProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n orientation?: "vertical" | "horizontal";\n }\n >(),\n {\n orientation: "vertical",\n }\n );\n\n const styles = tv({\n base: "relative flex-1 rounded-full bg-border",\n variants: {\n orientation: {\n vertical: "flex-1",\n horizontal: "",\n },\n },\n });\n</script>\n',
1789
+ '<template>\n <ScrollAreaThumb v-bind="forwarded" :class="styles({ orientation, class: props.class })">\n <slot />\n </ScrollAreaThumb>\n</template>\n\n<script lang="ts" setup>\n import { ScrollAreaThumb } from "radix-vue";\n import type { ScrollAreaThumbProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n ScrollAreaThumbProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n orientation?: "vertical" | "horizontal";\n }\n >(),\n {\n orientation: "vertical",\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "relative flex-1 rounded-full bg-border",\n variants: {\n orientation: {\n vertical: "flex-1",\n horizontal: "",\n },\n },\n });\n</script>\n',
1739
1790
  },
1740
1791
  {
1741
1792
  fileName: "ScrollArea/Viewport.vue",
1742
1793
  dirPath: "components/UI",
1743
1794
  fileContent:
1744
- '<template>\n <ScrollAreaViewport v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\n <slot />\n </ScrollAreaViewport>\n</template>\n\n<script lang="ts" setup>\n import { ScrollAreaViewport } from "radix-vue";\n import type { ScrollAreaViewportProps } from "radix-vue";\n\n const props = defineProps<\n ScrollAreaViewportProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "h-full w-full rounded-[inherit]",\n });\n</script>\n',
1795
+ '<template>\n <ScrollAreaViewport v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n </ScrollAreaViewport>\n</template>\n\n<script lang="ts" setup>\n import { ScrollAreaViewport } from "radix-vue";\n import type { ScrollAreaViewportProps } from "radix-vue";\n\n const props = defineProps<\n ScrollAreaViewportProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "h-full w-full rounded-[inherit]",\n });\n</script>\n',
1745
1796
  },
1746
1797
  ],
1747
1798
  utils: [],
@@ -1774,19 +1825,19 @@ export default [
1774
1825
  fileName: "Select/Icon.vue",
1775
1826
  dirPath: "components/UI",
1776
1827
  fileContent:
1777
- '<template>\n <SelectIcon v-bind="forwarded">\n <slot>\n <Icon :class="styles({ class: props.class })" :name="icon || \'lucide:chevrons-up-down\'" />\n </slot>\n </SelectIcon>\n</template>\n\n<script lang="ts" setup>\n import { SelectIcon, useForwardProps } from "radix-vue";\n import type { SelectIconProps } from "radix-vue";\n\n const props = defineProps<\n SelectIconProps & {\n /** Icon to render */\n icon?: string;\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = useForwardProps(reactiveOmit(props, "class"));\n\n const styles = tv({\n base: "h-4 w-4 shrink-0 text-muted-foreground opacity-70",\n });\n</script>\n',
1828
+ '<template>\n <SelectIcon v-bind="forwarded" class="flex items-center justify-center">\n <slot>\n <Icon :class="styles({ class: props.class })" :name="icon || \'lucide:chevrons-up-down\'" />\n </slot>\n </SelectIcon>\n</template>\n\n<script lang="ts" setup>\n import { SelectIcon, useForwardProps } from "radix-vue";\n import type { SelectIconProps } from "radix-vue";\n\n const props = defineProps<\n SelectIconProps & {\n /** Icon to render */\n icon?: string;\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = useForwardProps(reactiveOmit(props, "class"));\n\n const styles = tv({\n base: "h-4 w-4 shrink-0 text-muted-foreground opacity-70",\n });\n</script>\n',
1778
1829
  },
1779
1830
  {
1780
1831
  fileName: "Select/Item.vue",
1781
1832
  dirPath: "components/UI",
1782
1833
  fileContent:
1783
- '<template>\n <SelectItem\n v-bind="reactiveOmit(props, \'class\', \'icon\', \'text\')"\n :class="styles({ class: props.class })"\n >\n <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">\n <UiSelectItemIndicator :icon="icon" />\n </span>\n <UiSelectItemText>\n <slot>{{ text }}</slot>\n </UiSelectItemText>\n </SelectItem>\n</template>\n\n<script lang="ts" setup>\n import { SelectItem } from "radix-vue";\n import type { SelectItemProps } from "radix-vue";\n\n const props = defineProps<\n SelectItemProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** Icon to show */\n icon?: string;\n /** Text to show */\n text?: string;\n }\n >();\n\n const styles = tv({\n base: "relative flex w-full cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",\n });\n</script>\n',
1834
+ '<template>\n <SelectItem v-bind="forwarded" :class="styles({ class: props.class })">\n <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center">\n <UiSelectItemIndicator :icon="icon" />\n </span>\n <UiSelectItemText>\n <slot>{{ text }}</slot>\n </UiSelectItemText>\n </SelectItem>\n</template>\n\n<script lang="ts" setup>\n import { SelectItem } from "radix-vue";\n import type { SelectItemProps } from "radix-vue";\n\n const props = defineProps<\n SelectItemProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** Icon to show */\n icon?: string;\n /** Text to show */\n text?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "icon", "text");\n const styles = tv({\n base: "relative flex w-full cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",\n });\n</script>\n',
1784
1835
  },
1785
1836
  {
1786
1837
  fileName: "Select/ItemIndicator.vue",
1787
1838
  dirPath: "components/UI",
1788
1839
  fileContent:
1789
- '<template>\n <SelectItemIndicator v-bind="reactiveOmit(props, \'class\', \'icon\')">\n <slot>\n <Icon :class="styles({ class: props.class })" :name="icon || \'lucide:check\'" />\n </slot>\n </SelectItemIndicator>\n</template>\n\n<script lang="ts" setup>\n import { SelectItemIndicator } from "radix-vue";\n import type { SelectItemIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n SelectItemIndicatorProps & {\n /** Icon to render */\n icon?: string;\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "h-4 w-4",\n });\n</script>\n',
1840
+ '<template>\n <SelectItemIndicator v-bind="forwarded" class="flex items-center justify-center">\n <slot>\n <Icon :class="styles({ class: props.class })" :name="icon || \'lucide:check\'" />\n </slot>\n </SelectItemIndicator>\n</template>\n\n<script lang="ts" setup>\n import { SelectItemIndicator } from "radix-vue";\n import type { SelectItemIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n SelectItemIndicatorProps & {\n /** Icon to render */\n icon?: string;\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "icon");\n const styles = tv({\n base: "h-4 w-4",\n });\n</script>\n',
1790
1841
  },
1791
1842
  {
1792
1843
  fileName: "Select/ItemText.vue",
@@ -1798,7 +1849,7 @@ export default [
1798
1849
  fileName: "Select/Label.vue",
1799
1850
  dirPath: "components/UI",
1800
1851
  fileContent:
1801
- '<template>\n <SelectLabel :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </SelectLabel>\n</template>\n\n<script lang="ts" setup>\n import { SelectLabel } from "radix-vue";\n import type { SelectLabelProps } from "radix-vue";\n\n const props = defineProps<\n SelectLabelProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "py-1.5 pl-8 pr-2 text-sm font-semibold",\n });\n</script>\n',
1852
+ '<template>\n <SelectLabel :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </SelectLabel>\n</template>\n\n<script lang="ts" setup>\n import { SelectLabel } from "radix-vue";\n import type { SelectLabelProps } from "radix-vue";\n\n const props = defineProps<\n SelectLabelProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "py-1.5 pl-8 pr-2 text-sm font-semibold",\n });\n</script>\n',
1802
1853
  },
1803
1854
  {
1804
1855
  fileName: "Select/Portal.vue",
@@ -1810,13 +1861,13 @@ export default [
1810
1861
  fileName: "Select/ScrollDownButton.vue",
1811
1862
  dirPath: "components/UI",
1812
1863
  fileContent:
1813
- '<template>\n <SelectScrollDownButton v-bind="reactiveOmit(props, \'icon\')">\n <slot> <Icon :name="icon || \'lucide:chevron-down\'" class="h-5 w-5" /></slot>\n </SelectScrollDownButton>\n</template>\n\n<script lang="ts" setup>\n import { SelectScrollDownButton } from "radix-vue";\n import type { SelectScrollDownButtonProps } from "radix-vue";\n\n const props = defineProps<\n SelectScrollDownButtonProps & {\n /** Icon to render */\n icon?: string;\n }\n >();\n</script>\n',
1864
+ '<template>\n <SelectScrollDownButton v-bind="forwarded">\n <slot> <Icon :name="icon || \'lucide:chevron-down\'" class="h-5 w-5" /></slot>\n </SelectScrollDownButton>\n</template>\n\n<script lang="ts" setup>\n import { SelectScrollDownButton } from "radix-vue";\n import type { SelectScrollDownButtonProps } from "radix-vue";\n\n const props = defineProps<\n SelectScrollDownButtonProps & {\n /** Icon to render */\n icon?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "icon");\n</script>\n',
1814
1865
  },
1815
1866
  {
1816
1867
  fileName: "Select/ScrollUpButton.vue",
1817
1868
  dirPath: "components/UI",
1818
1869
  fileContent:
1819
- '<template>\n <SelectScrollUpButton v-bind="reactiveOmit(props, \'icon\')">\n <slot>\n <Icon :name="icon || \'lucide:chevron-up\'" class="h-5 w-5" />\n </slot>\n </SelectScrollUpButton>\n</template>\n\n<script lang="ts" setup>\n import { SelectScrollUpButton } from "radix-vue";\n import type { SelectScrollUpButtonProps } from "radix-vue";\n\n const props = defineProps<\n SelectScrollUpButtonProps & {\n /** Icon to render */\n icon?: string;\n }\n >();\n</script>\n',
1870
+ '<template>\n <SelectScrollUpButton v-bind="forwarded">\n <slot>\n <Icon :name="icon || \'lucide:chevron-up\'" class="h-5 w-5" />\n </slot>\n </SelectScrollUpButton>\n</template>\n\n<script lang="ts" setup>\n import { SelectScrollUpButton } from "radix-vue";\n import type { SelectScrollUpButtonProps } from "radix-vue";\n\n const props = defineProps<\n SelectScrollUpButtonProps & {\n /** Icon to render */\n icon?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "icon");\n</script>\n',
1820
1871
  },
1821
1872
  {
1822
1873
  fileName: "Select/Select.vue",
@@ -1828,13 +1879,13 @@ export default [
1828
1879
  fileName: "Select/Separator.vue",
1829
1880
  dirPath: "components/UI",
1830
1881
  fileContent:
1831
- '<template>\n <SelectSeparator :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')" />\n</template>\n\n<script lang="ts" setup>\n import { SelectSeparator } from "radix-vue";\n import type { SelectSeparatorProps } from "radix-vue";\n\n const props = defineProps<\n SelectSeparatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "-mx-1 my-1 h-px bg-muted",\n });\n</script>\n',
1882
+ '<template>\n <SelectSeparator :class="styles({ class: props.class })" v-bind="forwarded" />\n</template>\n\n<script lang="ts" setup>\n import { SelectSeparator } from "radix-vue";\n import type { SelectSeparatorProps } from "radix-vue";\n\n const props = defineProps<\n SelectSeparatorProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "-mx-1 my-1 h-px bg-muted",\n });\n</script>\n',
1832
1883
  },
1833
1884
  {
1834
1885
  fileName: "Select/Trigger.vue",
1835
1886
  dirPath: "components/UI",
1836
1887
  fileContent:
1837
- '<template>\n <SelectTrigger\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'icon\', \'placeholder\')"\n >\n <slot>\n <UiSelectValue :placeholder="placeholder" />\n </slot>\n <UiSelectIcon :icon="icon" />\n </SelectTrigger>\n</template>\n\n<script lang="ts" setup>\n import { SelectTrigger } from "radix-vue";\n import type { SelectTriggerProps } from "radix-vue";\n\n const props = defineProps<\n SelectTriggerProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** Icon to render */\n icon?: string;\n /** Placeholder text */\n placeholder?: string;\n }\n >();\n\n const styles = tv({\n base: "line-clamp-1 flex h-10 w-full items-center justify-between truncate rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[placeholder]:text-muted-foreground",\n });\n</script>\n',
1888
+ '<template>\n <SelectTrigger :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>\n <UiSelectValue :placeholder="placeholder" />\n </slot>\n <UiSelectIcon :icon="icon" />\n </SelectTrigger>\n</template>\n\n<script lang="ts" setup>\n import { SelectTrigger } from "radix-vue";\n import type { SelectTriggerProps } from "radix-vue";\n\n const props = defineProps<\n SelectTriggerProps & {\n /** Custom class(es) to add to the parent */\n class?: any;\n /** Icon to render */\n icon?: string;\n /** Placeholder text */\n placeholder?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "icon", "placeholder");\n const styles = tv({\n base: "line-clamp-1 flex h-10 w-full items-center justify-between truncate rounded-md border border-input bg-background px-3 py-2 text-sm ring-offset-background placeholder:text-muted-foreground focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:cursor-not-allowed disabled:opacity-50 data-[placeholder]:text-muted-foreground",\n });\n</script>\n',
1838
1889
  },
1839
1890
  {
1840
1891
  fileName: "Select/Value.vue",
@@ -1846,7 +1897,7 @@ export default [
1846
1897
  fileName: "Select/Viewport.vue",
1847
1898
  dirPath: "components/UI",
1848
1899
  fileContent:
1849
- '<template>\n <SelectViewport\n :class="styles({ position, class: props.class })"\n v-bind="reactiveOmit(props, \'class\')"\n >\n <slot />\n </SelectViewport>\n</template>\n\n<script lang="ts" setup>\n import { SelectViewport } from "radix-vue";\n import type { SelectViewportProps } from "radix-vue";\n\n const props = defineProps<\n SelectViewportProps & {\n position?: "item-aligned" | "popper";\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "p-1",\n variants: {\n position: {\n popper:\n "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]",\n "item-aligned": "",\n },\n },\n });\n</script>\n',
1900
+ '<template>\n <SelectViewport :class="styles({ position, class: props.class })" v-bind="forwarded">\n <slot />\n </SelectViewport>\n</template>\n\n<script lang="ts" setup>\n import { SelectViewport } from "radix-vue";\n import type { SelectViewportProps } from "radix-vue";\n\n const props = defineProps<\n SelectViewportProps & {\n position?: "item-aligned" | "popper";\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "p-1",\n variants: {\n position: {\n popper:\n "h-[var(--radix-select-trigger-height)] w-full min-w-[var(--radix-select-trigger-width)]",\n "item-aligned": "",\n },\n },\n });\n</script>\n',
1850
1901
  },
1851
1902
  ],
1852
1903
  utils: [],
@@ -1861,7 +1912,7 @@ export default [
1861
1912
  fileName: "Separator.vue",
1862
1913
  dirPath: "components/UI",
1863
1914
  fileContent:
1864
- '<template>\n <Separator\n v-bind="useForwardProps(reactiveOmit(props, \'class\'))"\n :class="styles({ orientation, class: props.class })"\n />\n</template>\n\n<script lang="ts" setup>\n import { Separator, useForwardProps } from "radix-vue";\n import type { SeparatorProps } from "radix-vue";\n\n const props = withDefaults(defineProps<SeparatorProps & { class?: any }>(), {\n orientation: "horizontal",\n });\n\n const styles = tv({\n base: "shrink-0 bg-border",\n variants: {\n orientation: {\n horizontal: "h-[1px] w-full",\n vertical: "h-full w-[1px]",\n },\n },\n });\n</script>\n',
1915
+ '<template>\n <Separator v-bind="forwarded" :class="styles({ orientation, class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { Separator, useForwardProps } from "radix-vue";\n import type { SeparatorProps } from "radix-vue";\n\n const props = withDefaults(defineProps<SeparatorProps & { class?: any }>(), {\n orientation: "horizontal",\n });\n\n const forwarded = useForwardProps(reactiveOmit(props, "class"));\n\n const styles = tv({\n base: "shrink-0 bg-border",\n variants: {\n orientation: {\n horizontal: "h-[1px] w-full",\n vertical: "h-full w-[1px]",\n },\n },\n });\n</script>\n',
1865
1916
  },
1866
1917
  ],
1867
1918
  utils: [],
@@ -1888,25 +1939,25 @@ export default [
1888
1939
  fileName: "Sheet/Description.vue",
1889
1940
  dirPath: "components/UI",
1890
1941
  fileContent:
1891
- '<template>\n <DialogDescription\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'description\')"\n >\n <slot>{{ description }}</slot>\n </DialogDescription>\n</template>\n\n<script lang="ts" setup>\n import { DialogDescription } from "radix-vue";\n import type { DialogDescriptionProps } from "radix-vue";\n\n const props = defineProps<\n DialogDescriptionProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n /** Description text */\n description?: string;\n }\n >();\n\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
1942
+ '<template>\n <DialogDescription :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>{{ description }}</slot>\n </DialogDescription>\n</template>\n\n<script lang="ts" setup>\n import { DialogDescription } from "radix-vue";\n import type { DialogDescriptionProps } from "radix-vue";\n\n const props = defineProps<\n DialogDescriptionProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n /** Description text */\n description?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "description");\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
1892
1943
  },
1893
1944
  {
1894
1945
  fileName: "Sheet/Footer.vue",
1895
1946
  dirPath: "components/UI",
1896
1947
  fileContent:
1897
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n\n const styles = tv({\n base: "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",\n });\n</script>\n',
1948
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",\n });\n</script>\n',
1898
1949
  },
1899
1950
  {
1900
1951
  fileName: "Sheet/Header.vue",
1901
1952
  dirPath: "components/UI",
1902
1953
  fileContent:
1903
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n\n const styles = tv({\n base: "flex flex-col space-y-2 text-center sm:text-left",\n });\n</script>\n',
1954
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex flex-col space-y-2 text-center sm:text-left",\n });\n</script>\n',
1904
1955
  },
1905
1956
  {
1906
1957
  fileName: "Sheet/Overlay.vue",
1907
1958
  dirPath: "components/UI",
1908
1959
  fileContent:
1909
- '<template>\n <DialogOverlay :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')" />\n</template>\n\n<script lang="ts" setup>\n import { DialogOverlay } from "radix-vue";\n import type { DialogOverlayProps } from "radix-vue";\n\n const props = defineProps<\n DialogOverlayProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=closed]:animate-fadeOut data-[state=open]:animate-fadeIn",\n });\n</script>\n',
1960
+ '<template>\n <DialogOverlay :class="styles({ class: props.class })" v-bind="forwarded" />\n</template>\n\n<script lang="ts" setup>\n import { DialogOverlay } from "radix-vue";\n import type { DialogOverlayProps } from "radix-vue";\n\n const props = defineProps<\n DialogOverlayProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "fixed inset-0 z-50 bg-background/80 backdrop-blur-sm data-[state=closed]:animate-fadeOut data-[state=open]:animate-fadeIn",\n });\n</script>\n',
1910
1961
  },
1911
1962
  {
1912
1963
  fileName: "Sheet/Portal.vue",
@@ -1924,7 +1975,7 @@ export default [
1924
1975
  fileName: "Sheet/Title.vue",
1925
1976
  dirPath: "components/UI",
1926
1977
  fileContent:
1927
- '<template>\n <DialogTitle\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'title\')"\n >\n <slot>{{ title }}</slot>\n </DialogTitle>\n</template>\n\n<script lang="ts" setup>\n import { DialogTitle } from "radix-vue";\n import type { DialogTitleProps } from "radix-vue";\n\n const props = defineProps<\n DialogTitleProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n /** Title text */\n title?: string;\n }\n >();\n\n const styles = tv({\n base: "text-lg font-semibold text-foreground",\n });\n</script>\n',
1978
+ '<template>\n <DialogTitle :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>{{ title }}</slot>\n </DialogTitle>\n</template>\n\n<script lang="ts" setup>\n import { DialogTitle } from "radix-vue";\n import type { DialogTitleProps } from "radix-vue";\n\n const props = defineProps<\n DialogTitleProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n /** Title text */\n title?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "title");\n const styles = tv({\n base: "text-lg font-semibold text-foreground",\n });\n</script>\n',
1928
1979
  },
1929
1980
  {
1930
1981
  fileName: "Sheet/Trigger.vue",
@@ -1936,7 +1987,7 @@ export default [
1936
1987
  fileName: "Sheet/X.vue",
1937
1988
  dirPath: "components/UI",
1938
1989
  fileContent:
1939
- '<template>\n <DialogClose\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'srText\', \'class\', \'icon\')"\n >\n <slot>\n <Icon :name="icon" class="h-4 w-4" />\n <span class="sr-only">{{ srText }}</span>\n </slot>\n </DialogClose>\n</template>\n\n<script lang="ts" setup>\n import { DialogClose } from "radix-vue";\n import type { DialogCloseProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n DialogCloseProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n /** Icon to display */\n icon?: string;\n /** Screen reader text */\n srText?: string;\n }\n >(),\n {\n icon: "heroicons:x-mark",\n srText: "Close",\n }\n );\n\n const styles = tv({\n base: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground",\n });\n</script>\n',
1990
+ '<template>\n <DialogClose :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>\n <Icon :name="icon" class="h-4 w-4" />\n <span class="sr-only">{{ srText }}</span>\n </slot>\n </DialogClose>\n</template>\n\n<script lang="ts" setup>\n import { DialogClose } from "radix-vue";\n import type { DialogCloseProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n DialogCloseProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n /** Icon to display */\n icon?: string;\n /** Screen reader text */\n srText?: string;\n }\n >(),\n {\n icon: "heroicons:x-mark",\n srText: "Close",\n }\n );\n const forwarded = reactiveOmit(props, "class", "icon", "srText");\n const styles = tv({\n base: "absolute right-4 top-4 rounded-sm opacity-70 ring-offset-background transition-opacity hover:opacity-100 focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none data-[state=open]:bg-accent data-[state=open]:text-muted-foreground",\n });\n</script>\n',
1940
1991
  },
1941
1992
  ],
1942
1993
  utils: [],
@@ -1951,7 +2002,7 @@ export default [
1951
2002
  fileName: "Skeleton.vue",
1952
2003
  dirPath: "components/UI",
1953
2004
  fileContent:
1954
- '<template>\n <Primitive\n :class="styles({ loading, class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'loading\')"\n >\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const styles = tv({\n base: "animate-pulse rounded-md bg-muted",\n variants: {\n loading: { true: "cursor-wait", false: "cursor-default" },\n },\n });\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n /** Whether the skeleton is loading */\n loading?: boolean;\n }\n >(),\n {\n as: "div",\n }\n );\n</script>\n',
2005
+ '<template>\n <Primitive :class="styles({ loading, class: props.class })" v-bind="forwarded">\n <slot />\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue";\n\n const styles = tv({\n base: "animate-pulse rounded-md bg-muted",\n variants: {\n loading: { true: "cursor-wait", false: "cursor-default" },\n },\n });\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n /** Whether the skeleton is loading */\n loading?: boolean;\n }\n >(),\n {\n as: "div",\n }\n );\n\n const forwarded = reactiveOmit(props, "class", "loading");\n</script>\n',
1955
2006
  },
1956
2007
  ],
1957
2008
  utils: [],
@@ -1966,7 +2017,7 @@ export default [
1966
2017
  fileName: "Slider/Range.vue",
1967
2018
  dirPath: "components/UI",
1968
2019
  fileContent:
1969
- '<template>\n <SliderRange :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </SliderRange>\n</template>\n\n<script lang="ts" setup>\n import { SliderRange } from "radix-vue";\n import type { SliderRangeProps } from "radix-vue";\n\n const props = defineProps<\n SliderRangeProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n const styles = tv({\n base: "absolute h-full bg-primary",\n });\n</script>\n',
2020
+ '<template>\n <SliderRange :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </SliderRange>\n</template>\n\n<script lang="ts" setup>\n import { SliderRange } from "radix-vue";\n import type { SliderRangeProps } from "radix-vue";\n\n const props = defineProps<\n SliderRangeProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "absolute h-full bg-primary",\n });\n</script>\n',
1970
2021
  },
1971
2022
  {
1972
2023
  fileName: "Slider/Slider.vue",
@@ -1978,13 +2029,13 @@ export default [
1978
2029
  fileName: "Slider/Thumb.vue",
1979
2030
  dirPath: "components/UI",
1980
2031
  fileContent:
1981
- '<template>\n <SliderThumb :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </SliderThumb>\n</template>\n\n<script lang="ts" setup>\n import { SliderThumb } from "radix-vue";\n import type { SliderThumbProps } from "radix-vue";\n\n const props = defineProps<\n SliderThumbProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "block h-5 w-5 rounded-full border-2 border-primary bg-background ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",\n });\n</script>\n',
2032
+ '<template>\n <SliderThumb :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </SliderThumb>\n</template>\n\n<script lang="ts" setup>\n import { SliderThumb } from "radix-vue";\n import type { SliderThumbProps } from "radix-vue";\n\n const props = defineProps<\n SliderThumbProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "block h-5 w-5 rounded-full border-2 border-primary bg-background ring-offset-background transition-colors focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",\n });\n</script>\n',
1982
2033
  },
1983
2034
  {
1984
2035
  fileName: "Slider/Track.vue",
1985
2036
  dirPath: "components/UI",
1986
2037
  fileContent:
1987
- '<template>\n <SliderTrack :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </SliderTrack>\n</template>\n\n<script lang="ts" setup>\n import { SliderTrack } from "radix-vue";\n import type { SliderTrackProps } from "radix-vue";\n\n const props = defineProps<\n SliderTrackProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "relative h-2 w-full grow overflow-hidden rounded-full bg-secondary",\n });\n</script>\n',
2038
+ '<template>\n <SliderTrack :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </SliderTrack>\n</template>\n\n<script lang="ts" setup>\n import { SliderTrack } from "radix-vue";\n import type { SliderTrackProps } from "radix-vue";\n\n const props = defineProps<\n SliderTrackProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "relative h-2 w-full grow overflow-hidden rounded-full bg-secondary",\n });\n</script>\n',
1988
2039
  },
1989
2040
  ],
1990
2041
  utils: [],
@@ -2083,7 +2134,7 @@ export default [
2083
2134
  fileName: "Switch/Thumb.vue",
2084
2135
  dirPath: "components/UI",
2085
2136
  fileContent:
2086
- '<template>\n <SwitchThumb :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </SwitchThumb>\n</template>\n\n<script lang="ts" setup>\n import { SwitchThumb } from "radix-vue";\n import type { SwitchThumbProps } from "radix-vue";\n\n const props = defineProps<\n SwitchThumbProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0",\n });\n</script>\n',
2137
+ '<template>\n <SwitchThumb :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </SwitchThumb>\n</template>\n\n<script lang="ts" setup>\n import { SwitchThumb } from "radix-vue";\n import type { SwitchThumbProps } from "radix-vue";\n\n const props = defineProps<\n SwitchThumbProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "pointer-events-none block h-5 w-5 rounded-full bg-background shadow-lg ring-0 transition-transform data-[state=checked]:translate-x-5 data-[state=unchecked]:translate-x-0",\n });\n</script>\n',
2087
2138
  },
2088
2139
  ],
2089
2140
  utils: [],
@@ -2161,19 +2212,19 @@ export default [
2161
2212
  fileName: "Tabs/Content.vue",
2162
2213
  dirPath: "components/UI",
2163
2214
  fileContent:
2164
- '<template>\n <TabsContent v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\n <slot />\n </TabsContent>\n</template>\n\n<script lang="ts" setup>\n import { TabsContent } from "radix-vue";\n import type { TabsContentProps } from "radix-vue";\n\n const props = defineProps<\n TabsContentProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",\n });\n</script>\n',
2215
+ '<template>\n <TabsContent v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n </TabsContent>\n</template>\n\n<script lang="ts" setup>\n import { TabsContent } from "radix-vue";\n import type { TabsContentProps } from "radix-vue";\n\n const props = defineProps<\n TabsContentProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "mt-2 ring-offset-background focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2",\n });\n</script>\n',
2165
2216
  },
2166
2217
  {
2167
2218
  fileName: "Tabs/Indicator.vue",
2168
2219
  dirPath: "components/UI",
2169
2220
  fileContent:
2170
- '<template>\n <ClientOnly>\n <TabsIndicator\n v-bind="{ ...reactiveOmit(props, \'class\'), ...$attrs }"\n :class="styles({ class: props.class })"\n >\n <slot>\n <div class="h-full w-full rounded-md bg-primary" />\n </slot>\n </TabsIndicator>\n </ClientOnly>\n</template>\n\n<script lang="ts" setup>\n import { TabsIndicator } from "radix-vue";\n import type { TabsIndicatorProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = defineProps<\n TabsIndicatorProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "absolute bottom-0 left-0 h-[3px] w-[--radix-tabs-indicator-size] translate-x-[--radix-tabs-indicator-position] rounded-full px-1 transition-[width,transform] duration-300",\n });\n</script>\n',
2221
+ '<template>\n <ClientOnly>\n <TabsIndicator v-bind="{ ...forwarded, ...$attrs }" :class="styles({ class: props.class })">\n <slot>\n <div class="h-full w-full rounded-md bg-primary" />\n </slot>\n </TabsIndicator>\n </ClientOnly>\n</template>\n\n<script lang="ts" setup>\n import { TabsIndicator } from "radix-vue";\n import type { TabsIndicatorProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = defineProps<\n TabsIndicatorProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "absolute bottom-0 left-0 h-[3px] w-[--radix-tabs-indicator-size] translate-x-[--radix-tabs-indicator-position] rounded-full px-1 transition-[width,transform] duration-300",\n });\n</script>\n',
2171
2222
  },
2172
2223
  {
2173
2224
  fileName: "Tabs/List.vue",
2174
2225
  dirPath: "components/UI",
2175
2226
  fileContent:
2176
- '<template>\n <TabsList :class="styles({ pill, class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </TabsList>\n</template>\n\n<script lang="ts" setup>\n import { TabsList } from "radix-vue";\n import type { TabsListProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n TabsListProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n pill?: boolean;\n }\n >(),\n { pill: true }\n );\n\n const styles = tv({\n base: "inline-flex h-10 items-center justify-center rounded-md p-1 text-muted-foreground",\n variants: {\n pill: {\n true: "bg-muted",\n false: "",\n },\n },\n });\n</script>\n',
2227
+ '<template>\n <TabsList :class="styles({ pill, class: props.class })" v-bind="forwarded">\n <slot />\n </TabsList>\n</template>\n\n<script lang="ts" setup>\n import { TabsList } from "radix-vue";\n import type { TabsListProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n TabsListProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n pill?: boolean;\n }\n >(),\n { pill: true }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "inline-flex h-10 items-center justify-center rounded-md p-1 text-muted-foreground",\n variants: {\n pill: {\n true: "bg-muted",\n false: "",\n },\n },\n });\n</script>\n',
2177
2228
  },
2178
2229
  {
2179
2230
  fileName: "Tabs/Tabs.vue",
@@ -2185,7 +2236,7 @@ export default [
2185
2236
  fileName: "Tabs/Trigger.vue",
2186
2237
  dirPath: "components/UI",
2187
2238
  fileContent:
2188
- '<template>\n <TabsTrigger v-bind="reactiveOmit(props, \'class\')" :class="styles({ pill, class: props.class })">\n <slot />\n </TabsTrigger>\n</template>\n\n<script lang="ts" setup>\n import { TabsTrigger } from "radix-vue";\n import type { TabsTriggerProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n TabsTriggerProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n /** Whether the trigger should be pill-shaped */\n pill?: boolean;\n }\n >(),\n {\n pill: true,\n }\n );\n\n const styles = tv({\n base: "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",\n variants: {\n pill: {\n true: "data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",\n false:\n "data-[state=active]:bg-transparent data-[state=active]:text-foreground data-[state=active]:shadow-none",\n },\n },\n });\n</script>\n',
2239
+ '<template>\n <TabsTrigger v-bind="forwarded" :class="styles({ pill, class: props.class })">\n <slot />\n </TabsTrigger>\n</template>\n\n<script lang="ts" setup>\n import { TabsTrigger } from "radix-vue";\n import type { TabsTriggerProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n TabsTriggerProps & {\n /** Custom class(es) to add to parent element */\n class?: any;\n /** Whether the trigger should be pill-shaped */\n pill?: boolean;\n }\n >(),\n {\n pill: true,\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "inline-flex items-center justify-center whitespace-nowrap rounded-sm px-3 py-1.5 text-sm font-medium ring-offset-background transition-all focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 disabled:pointer-events-none disabled:opacity-50",\n variants: {\n pill: {\n true: "data-[state=active]:bg-background data-[state=active]:text-foreground data-[state=active]:shadow-sm",\n false:\n "data-[state=active]:bg-transparent data-[state=active]:text-foreground data-[state=active]:shadow-none",\n },\n },\n });\n</script>\n',
2189
2240
  },
2190
2241
  ],
2191
2242
  utils: [],
@@ -2206,25 +2257,25 @@ export default [
2206
2257
  fileName: "TagsInput/Field.vue",
2207
2258
  dirPath: "components/UI",
2208
2259
  fileContent:
2209
- '<template>\n <TagsInputInput v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\n <slot />\n </TagsInputInput>\n</template>\n\n<script lang="ts" setup>\n import { TagsInputInput } from "radix-vue";\n import type { TagsInputInputProps } from "radix-vue";\n\n const props = defineProps<TagsInputInputProps & { class?: any }>();\n\n const styles = tv({\n base: "flex-1 bg-transparent focus:outline-none sm:text-sm",\n });\n</script>\n',
2260
+ '<template>\n <TagsInputInput v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n </TagsInputInput>\n</template>\n\n<script lang="ts" setup>\n import { TagsInputInput } from "radix-vue";\n import type { TagsInputInputProps } from "radix-vue";\n\n const props = defineProps<TagsInputInputProps & { class?: any }>();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "flex-1 bg-transparent focus:outline-none sm:text-sm",\n });\n</script>\n',
2210
2261
  },
2211
2262
  {
2212
2263
  fileName: "TagsInput/Item.vue",
2213
2264
  dirPath: "components/UI",
2214
2265
  fileContent:
2215
- '<template>\n <TagsInputItem\n v-bind="reactiveOmit(props, \'class\', \'icon\')"\n :class="styles({ class: props.class })"\n >\n <slot>\n <slot name="text">\n <UiTagsInputItemText />\n </slot>\n <slot name="delete">\n <UiTagsInputItemDelete :icon="icon" />\n </slot>\n </slot>\n </TagsInputItem>\n</template>\n\n<script lang="ts" setup>\n import { TagsInputItem } from "radix-vue";\n import type { TagsInputItemProps } from "radix-vue";\n\n const props = defineProps<TagsInputItemProps & { class?: any; icon?: string }>();\n const styles = tv({\n base: "inline-flex h-6 shrink-0 items-center gap-1.5 rounded bg-primary pl-2 pr-1 leading-none text-primary-foreground sm:text-sm",\n });\n</script>\n',
2266
+ '<template>\n <TagsInputItem v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <slot name="text">\n <UiTagsInputItemText />\n </slot>\n <slot name="delete">\n <UiTagsInputItemDelete :icon="icon" />\n </slot>\n </slot>\n </TagsInputItem>\n</template>\n\n<script lang="ts" setup>\n import { TagsInputItem } from "radix-vue";\n import type { TagsInputItemProps } from "radix-vue";\n\n const props = defineProps<TagsInputItemProps & { class?: any; icon?: string }>();\n const forwarded = reactiveOmit(props, "class", "icon");\n const styles = tv({\n base: "inline-flex h-6 shrink-0 items-center gap-1.5 rounded bg-primary pl-2 pr-1 leading-none text-primary-foreground sm:text-sm",\n });\n</script>\n',
2216
2267
  },
2217
2268
  {
2218
2269
  fileName: "TagsInput/ItemDelete.vue",
2219
2270
  dirPath: "components/UI",
2220
2271
  fileContent:
2221
- '<template>\n <TagsInputItemDelete\n v-bind="reactiveOmit(props, \'icon\', \'class\')"\n :class="styles({ class: props.class })"\n >\n <slot>\n <Icon v-if="icon" :name="icon" class="h-3.5 w-3.5" />\n </slot>\n </TagsInputItemDelete>\n</template>\n\n<script lang="ts" setup>\n import { TagsInputItemDelete } from "radix-vue";\n import type { TagsInputItemDeleteProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<TagsInputItemDeleteProps & { icon?: string; class?: any }>(),\n {\n icon: "lucide:x",\n }\n );\n\n const styles = tv({\n base: "flex items-center justify-center rounded bg-transparent opacity-40 transition hover:bg-muted-foreground hover:opacity-100 focus:opacity-100 focus-visible:outline-none",\n });\n</script>\n',
2272
+ '<template>\n <TagsInputItemDelete v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <Icon v-if="icon" :name="icon" class="h-3.5 w-3.5" />\n </slot>\n </TagsInputItemDelete>\n</template>\n\n<script lang="ts" setup>\n import { TagsInputItemDelete } from "radix-vue";\n import type { TagsInputItemDeleteProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<TagsInputItemDeleteProps & { icon?: string; class?: any }>(),\n {\n icon: "lucide:x",\n }\n );\n const forwarded = reactiveOmit(props, "class", "icon");\n const styles = tv({\n base: "flex items-center justify-center rounded bg-transparent opacity-40 transition hover:bg-muted-foreground hover:opacity-100 focus:opacity-100 focus-visible:outline-none",\n });\n</script>\n',
2222
2273
  },
2223
2274
  {
2224
2275
  fileName: "TagsInput/ItemText.vue",
2225
2276
  dirPath: "components/UI",
2226
2277
  fileContent:
2227
- '<template>\n <TagsInputItemText v-bind="reactiveOmit(props, \'class\')" :class="styles({ class: props.class })">\n <slot />\n </TagsInputItemText>\n</template>\n\n<script lang="ts" setup>\n import { TagsInputItemText } from "radix-vue";\n import type { TagsInputItemTextProps } from "radix-vue";\n\n const props = defineProps<TagsInputItemTextProps & { class?: any }>();\n\n const styles = tv({\n base: "leading-none sm:text-sm",\n });\n</script>\n',
2278
+ '<template>\n <TagsInputItemText v-bind="forwarded" :class="styles({ class: props.class })">\n <slot />\n </TagsInputItemText>\n</template>\n\n<script lang="ts" setup>\n import { TagsInputItemText } from "radix-vue";\n import type { TagsInputItemTextProps } from "radix-vue";\n\n const props = defineProps<TagsInputItemTextProps & { class?: any }>();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "leading-none sm:text-sm",\n });\n</script>\n',
2228
2279
  },
2229
2280
  {
2230
2281
  fileName: "TagsInput/TagsInput.vue",
@@ -2287,19 +2338,19 @@ export default [
2287
2338
  fileName: "Toast/Action.vue",
2288
2339
  dirPath: "components/UI",
2289
2340
  fileContent:
2290
- '<template>\n <ToastAction :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </ToastAction>\n</template>\n\n<script lang="ts" setup>\n import { ToastAction } from "radix-vue";\n import type { ToastActionProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n ToastActionProps & {\n /**\n * Custom class names to add to the button.\n */\n class?: any;\n }\n >(),\n {\n altText: "Action button",\n }\n );\n\n const styles = tv({\n base: "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-xs font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",\n });\n</script>\n',
2341
+ '<template>\n <ToastAction :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </ToastAction>\n</template>\n\n<script lang="ts" setup>\n import { ToastAction } from "radix-vue";\n import type { ToastActionProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n ToastActionProps & {\n /**\n * Custom class names to add to the button.\n */\n class?: any;\n }\n >(),\n {\n altText: "Action button",\n }\n );\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "inline-flex h-8 shrink-0 items-center justify-center rounded-md border bg-transparent px-3 text-xs font-medium ring-offset-background transition-colors hover:bg-secondary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 disabled:pointer-events-none disabled:opacity-50 group-[.destructive]:border-muted/40 group-[.destructive]:hover:border-destructive/30 group-[.destructive]:hover:bg-destructive group-[.destructive]:hover:text-destructive-foreground group-[.destructive]:focus:ring-destructive",\n });\n</script>\n',
2291
2342
  },
2292
2343
  {
2293
2344
  fileName: "Toast/Close.vue",
2294
2345
  dirPath: "components/UI",
2295
2346
  fileContent:
2296
- '<template>\n <ToastClose :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\', \'icon\')">\n <slot>\n <Icon :name="icon || \'lucide:x\'" class="h-4 w-4" />\n </slot>\n </ToastClose>\n</template>\n\n<script lang="ts" setup>\n import { ToastClose } from "radix-vue";\n import type { ToastCloseProps } from "radix-vue";\n\n const props = defineProps<\n ToastCloseProps & {\n /**\n * Custom class names to add to the button.\n */\n class?: any;\n /**\n * The icon to render.\n */\n icon?: string;\n }\n >();\n\n const styles = tv({\n base: "absolute right-2 top-2 inline-flex items-center justify-center rounded-md p-1 text-foreground/50 opacity-50 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 focus-visible:ring-ring group-hover:opacity-100",\n });\n</script>\n',
2347
+ '<template>\n <ToastClose :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>\n <Icon :name="icon || \'lucide:x\'" class="h-4 w-4" />\n </slot>\n </ToastClose>\n</template>\n\n<script lang="ts" setup>\n import { ToastClose } from "radix-vue";\n import type { ToastCloseProps } from "radix-vue";\n\n const props = defineProps<\n ToastCloseProps & {\n /**\n * Custom class names to add to the button.\n */\n class?: any;\n /**\n * The icon to render.\n */\n icon?: string;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "icon");\n const styles = tv({\n base: "absolute right-2 top-2 inline-flex items-center justify-center rounded-md p-1 text-foreground/50 opacity-50 transition-opacity hover:text-foreground focus:opacity-100 focus:outline-none focus:ring-2 focus-visible:ring-ring group-hover:opacity-100",\n });\n</script>\n',
2297
2348
  },
2298
2349
  {
2299
2350
  fileName: "Toast/Description.vue",
2300
2351
  dirPath: "components/UI",
2301
2352
  fileContent:
2302
- '<template>\n <ToastDescription\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'description\')"\n >\n <slot>{{ description }}</slot>\n </ToastDescription>\n</template>\n\n<script lang="ts" setup>\n import { ToastDescription } from "radix-vue";\n import type { ToastDescriptionProps } from "radix-vue";\n\n const props = defineProps<\n ToastDescriptionProps & {\n /** The description text to render */\n description?: string;\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "text-sm opacity-90",\n });\n</script>\n',
2353
+ '<template>\n <ToastDescription :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>{{ description }}</slot>\n </ToastDescription>\n</template>\n\n<script lang="ts" setup>\n import { ToastDescription } from "radix-vue";\n import type { ToastDescriptionProps } from "radix-vue";\n\n const props = defineProps<\n ToastDescriptionProps & {\n /** The description text to render */\n description?: string;\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "description");\n const styles = tv({\n base: "text-sm opacity-90",\n });\n</script>\n',
2303
2354
  },
2304
2355
  {
2305
2356
  fileName: "Toast/Provider.vue",
@@ -2311,7 +2362,7 @@ export default [
2311
2362
  fileName: "Toast/Title.vue",
2312
2363
  dirPath: "components/UI",
2313
2364
  fileContent:
2314
- '<template>\n <ToastTitle\n :class="styles({ class: props.class })"\n v-bind="reactiveOmit(props, \'class\', \'title\')"\n >\n <slot>{{ title }}</slot>\n </ToastTitle>\n</template>\n\n<script lang="ts" setup>\n import { ToastTitle } from "radix-vue";\n import type { ToastTitleProps } from "radix-vue";\n\n const props = defineProps<\n ToastTitleProps & {\n /** The title text to render */\n title?: string;\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "text-sm font-semibold",\n });\n</script>\n',
2365
+ '<template>\n <ToastTitle :class="styles({ class: props.class })" v-bind="forwarded">\n <slot>{{ title }}</slot>\n </ToastTitle>\n</template>\n\n<script lang="ts" setup>\n import { ToastTitle } from "radix-vue";\n import type { ToastTitleProps } from "radix-vue";\n\n const props = defineProps<\n ToastTitleProps & {\n /** The title text to render */\n title?: string;\n /** Custom class(es) to add to the parent */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class", "title");\n const styles = tv({\n base: "text-sm font-semibold",\n });\n</script>\n',
2315
2366
  },
2316
2367
  {
2317
2368
  fileName: "Toast/Toast.vue",
@@ -2329,7 +2380,7 @@ export default [
2329
2380
  fileName: "Toast/Viewport.vue",
2330
2381
  dirPath: "components/UI",
2331
2382
  fileContent:
2332
- '<template>\n <ToastViewport :class="styles({ class: props.class })" v-bind="reactiveOmit(props, \'class\')">\n <slot />\n </ToastViewport>\n</template>\n\n<script lang="ts" setup>\n import { ToastViewport } from "radix-vue";\n import type { ToastViewportProps } from "radix-vue";\n\n const props = defineProps<\n ToastViewportProps & {\n /**\n * Custom class names to add to the button.\n */\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse gap-2 p-4 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring sm:bottom-auto sm:right-0 sm:flex-col md:max-w-[420px]",\n });\n</script>\n\n<style>\n [aria-label~="Notifications"] {\n display: grid;\n }\n</style>\n',
2383
+ '<template>\n <ToastViewport :class="styles({ class: props.class })" v-bind="forwarded">\n <slot />\n </ToastViewport>\n</template>\n\n<script lang="ts" setup>\n import { ToastViewport } from "radix-vue";\n import type { ToastViewportProps } from "radix-vue";\n\n const props = defineProps<\n ToastViewportProps & {\n /**\n * Custom class names to add to the button.\n */\n class?: any;\n }\n >();\n const forwarded = reactiveOmit(props, "class");\n const styles = tv({\n base: "fixed top-0 z-[100] flex max-h-screen w-full flex-col-reverse gap-2 p-4 focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring sm:bottom-auto sm:right-0 sm:flex-col md:max-w-[420px]",\n });\n</script>\n\n<style>\n [aria-label~="Notifications"] {\n display: grid;\n }\n</style>\n',
2333
2384
  },
2334
2385
  ],
2335
2386
  utils: [],
@@ -2424,7 +2475,7 @@ export default [
2424
2475
  fileName: "Tree/Item.vue",
2425
2476
  dirPath: "components/UI",
2426
2477
  fileContent:
2427
- '<template>\n <TreeItem v-slot="slotProps" v-bind="forwarded">\n <slot v-bind="slotProps" />\n </TreeItem>\n</template>\n\n<script lang="ts" setup generic="T extends Record<string, any>">\n import { TreeItem, useForwardPropsEmits } from "radix-vue";\n import type { TreeItemProps } from "radix-vue";\n\n // Remove this when the type is properly exported from radix-vue\n type TreeItemEmits = {\n /**\n * Event handler called when the selecting item.\n *\n * It can be prevented by calling `event.preventDefault`.\n */\n select: [event: any];\n /**\n * Event handler called when the selecting item.\n *\n * It can be prevented by calling `event.preventDefault`.\n */\n toggle: [event: any];\n };\n\n const props = defineProps<TreeItemProps<T>>();\n\n const emit = defineEmits<TreeItemEmits>();\n\n const forwarded = useForwardPropsEmits(props, emit);\n</script>\n',
2478
+ '<template>\n <TreeItem v-slot="slotProps" v-bind="forwarded">\n <slot v-bind="slotProps" />\n </TreeItem>\n</template>\n\n<script lang="ts" setup generic="T extends Record<string, any>">\n import { TreeItem, useForwardPropsEmits } from "radix-vue";\n import type { TreeItemEmits, TreeItemProps } from "radix-vue";\n\n const props = defineProps<TreeItemProps<T>>();\n const emit = defineEmits<TreeItemEmits<T>>();\n\n const forwarded = useForwardPropsEmits(props, emit);\n</script>\n',
2428
2479
  },
2429
2480
  {
2430
2481
  fileName: "Tree/Tree.vue",
@@ -2436,7 +2487,7 @@ export default [
2436
2487
  fileName: "Tree/Virtualizer.vue",
2437
2488
  dirPath: "components/UI",
2438
2489
  fileContent:
2439
- '<template>\n <TreeVirtualizer v-slot="slotProps" v-bind="forwarded">\n <slot v-bind="slotProps" />\n </TreeVirtualizer>\n</template>\n\n<script lang="ts" setup>\n import { TreeVirtualizer, useForwardPropsEmits } from "radix-vue";\n import type { TreeVirtualizerProps } from "radix-vue";\n\n const props = defineProps<TreeVirtualizerProps>();\n\n const forwarded = useForwardPropsEmits(props);\n</script>\n',
2490
+ '<template>\n <TreeVirtualizer v-slot="slotProps" v-bind="forwarded">\n <slot v-bind="slotProps" />\n </TreeVirtualizer>\n</template>\n\n<script lang="ts" setup>\n import { TreeVirtualizer, useForwardPropsEmits } from "radix-vue";\n import type { TreeVirtualizerProps } from "radix-vue";\n\n const props = defineProps<TreeVirtualizerProps>();\n const forwarded = useForwardPropsEmits(props);\n</script>\n',
2440
2491
  },
2441
2492
  ],
2442
2493
  utils: [],
@@ -2607,7 +2658,7 @@ export default [
2607
2658
  fileName: "Vee/PinInput.vue",
2608
2659
  dirPath: "components/UI",
2609
2660
  fileContent:
2610
- '<template>\n <div class="w-full">\n <UiLabel\n v-if="label"\n :for="inputId"\n :class="[disabled && \'text-muted-foreground\', errorMessage && \'text-destructive\', \'mb-2\']"\n ><span>{{ label }} <span v-if="required" class="text-destructive">*</span></span></UiLabel\n >\n <div class="relative">\n <UiPinInput\n :id="inputId"\n v-bind="{\n ...$attrs,\n ...reactiveOmit(props, \'label\', \'hint\', \'id\', \'rules\', \'validateOnMount\', \'modelValue\'),\n }"\n v-model="value"\n @complete="emits(\'complete\', $event)"\n />\n </div>\n <TransitionSlide group tag="div">\n <p v-if="hint && !errorMessage" key="hint" class="mt-1.5 text-sm text-muted-foreground">\n {{ hint }}\n </p>\n\n <p v-if="errorMessage" key="errorMessage" class="mt-1.5 text-sm text-destructive">\n {{ errorMessage }}\n </p>\n </TransitionSlide>\n </div>\n</template>\n\n<script lang="ts" setup>\n import type { PinInputRootProps } from "radix-vue";\n\n const props = defineProps<\n Omit<PinInputRootProps, "as" | "asChild"> & {\n label?: string;\n hint?: string;\n id?: string;\n rules?: any;\n validateOnMount?: boolean;\n separator?: string;\n inputCount?: number;\n }\n >();\n\n const emits = defineEmits<{\n complete: [value: string[]];\n }>();\n\n const inputId = props.id || useId();\n\n const { errorMessage, value } = useField(() => props.name || inputId, props.rules, {\n initialValue: props.modelValue || [],\n label: props.label,\n validateOnMount: props.validateOnMount,\n syncVModel: true,\n });\n</script>\n',
2661
+ '<template>\n <div class="w-full">\n <UiLabel\n v-if="label"\n :for="inputId"\n :class="[disabled && \'text-muted-foreground\', errorMessage && \'text-destructive\', \'mb-2\']"\n ><span>{{ label }} <span v-if="required" class="text-destructive">*</span></span></UiLabel\n >\n <div class="relative">\n <UiPinInput\n :id="inputId"\n v-bind="{ ...$attrs, ...forwarded }"\n v-model="value"\n @complete="emits(\'complete\', $event)"\n />\n </div>\n <TransitionSlide group tag="div">\n <p v-if="hint && !errorMessage" key="hint" class="mt-1.5 text-sm text-muted-foreground">\n {{ hint }}\n </p>\n <p v-if="errorMessage" key="errorMessage" class="mt-1.5 text-sm text-destructive">\n {{ errorMessage }}\n </p>\n </TransitionSlide>\n </div>\n</template>\n\n<script lang="ts" setup>\n import type { PinInputRootProps } from "radix-vue";\n\n const props = defineProps<\n Omit<PinInputRootProps, "as" | "asChild"> & {\n label?: string;\n hint?: string;\n id?: string;\n rules?: any;\n validateOnMount?: boolean;\n separator?: string;\n inputCount?: number;\n }\n >();\n\n const emits = defineEmits<{\n complete: [value: string[]];\n }>();\n\n const forwarded = reactiveOmit(\n props,\n "label",\n "hint",\n "id",\n "rules",\n "validateOnMount",\n "modelValue"\n );\n const inputId = props.id || useId();\n\n const { errorMessage, value } = useField(() => props.name || inputId, props.rules, {\n initialValue: props.modelValue || [],\n label: props.label,\n validateOnMount: props.validateOnMount,\n syncVModel: true,\n });\n</script>\n',
2611
2662
  },
2612
2663
  ],
2613
2664
  utils: [],