ui-thing 0.0.8 → 0.0.10

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 (12) hide show
  1. package/CHANGELOG.md +36 -0
  2. package/README.md +8 -0
  3. package/dist/index.js +523 -380
  4. package/dist/index.js.map +1 -1
  5. package/package.json +5 -3
  6. package/src/commands/init.ts +1 -1
  7. package/src/commands/shortcuts.ts +42 -0
  8. package/src/comp.ts +145 -139
  9. package/src/index.ts +2 -0
  10. package/src/templates/shortcuts.ts +217 -0
  11. package/src/utils/addShortcutFiles.ts +12 -0
  12. package/src/utils/constants.ts +0 -2
package/src/comp.ts CHANGED
@@ -3,39 +3,39 @@ export default [
3
3
  name: "Accordion",
4
4
  value: "accordion",
5
5
  deps: ["radix-vue", "tailwind-variants"],
6
- devDeps: ["tailwindcss-animate", "nuxt-icon", "nuxt-lodash"],
7
- nuxtModules: ["nuxt-icon", "nuxt-lodash"],
6
+ devDeps: ["tailwindcss-animate", "nuxt-icon"],
7
+ nuxtModules: ["nuxt-icon"],
8
8
  instructions: ["Remember to add the accordion animations to your tailwind.config.js"],
9
9
  files: [
10
10
  {
11
11
  fileName: "Accordion/Accordion.vue",
12
12
  dirPath: "components/UI",
13
13
  fileContent:
14
- '<template>\n <AccordionRoot v-bind="forwarded">\n <slot>\n <template v-for="(item, i) in items" :key="i">\n <UIAccordionItem :disabled="item.disabled" :value="item.value">\n <slot name="header">\n <UIAccordionHeader>\n <slot name="trigger">\n <UIAccordionTrigger :title="item.title" :icon="item.icon" />\n </slot>\n </UIAccordionHeader>\n </slot>\n <slot name="content">\n <UIAccordionContent :content="item.content"></UIAccordionContent>\n </slot>\n </UIAccordionItem>\n </template>\n </slot>\n </AccordionRoot>\n</template>\n\n<script setup lang="ts">\n import { AccordionRoot, useForwardPropsEmits } from "radix-vue";\n import type { AccordionRootEmits, AccordionRootProps } from "radix-vue";\n\n export interface AccordionItem {\n title?: string;\n content?: string;\n value: string;\n disabled?: boolean;\n icon?: string;\n }\n\n const props = withDefaults(\n defineProps<\n AccordionRootProps & {\n items?: AccordionItem[];\n }\n >(),\n { type: "single", collapsible: true }\n );\n\n const emits = defineEmits<AccordionRootEmits>();\n const forwarded = useForwardPropsEmits(useOmit(props, ["items"]), emits);\n</script>\n',
14
+ '<template>\r\n <AccordionRoot v-bind="forwarded">\r\n <slot>\r\n <template v-for="(item, i) in items" :key="i">\r\n <UIAccordionItem :disabled="item.disabled" :value="item.value">\r\n <slot name="header">\r\n <UIAccordionHeader>\r\n <slot name="trigger">\r\n <UIAccordionTrigger :title="item.title" :icon="item.icon" />\r\n </slot>\r\n </UIAccordionHeader>\r\n </slot>\r\n <slot name="content">\r\n <UIAccordionContent :content="item.content"></UIAccordionContent>\r\n </slot>\r\n </UIAccordionItem>\r\n </template>\r\n </slot>\r\n </AccordionRoot>\r\n</template>\r\n\r\n<script setup lang="ts">\r\n import { AccordionRoot, useForwardPropsEmits } from "radix-vue";\r\n import type { AccordionRootEmits, AccordionRootProps } from "radix-vue";\r\n\r\n export interface AccordionItem {\r\n title?: string;\r\n content?: string;\r\n value: string;\r\n disabled?: boolean;\r\n icon?: string;\r\n }\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n AccordionRootProps & {\r\n items?: AccordionItem[];\r\n }\r\n >(),\r\n { type: "single", collapsible: true }\r\n );\r\n\r\n const emits = defineEmits<AccordionRootEmits>();\r\n const forwarded = useForwardPropsEmits(props, emits);\r\n</script>\r\n',
15
15
  },
16
16
  {
17
17
  fileName: "Accordion/Content.vue",
18
18
  dirPath: "components/UI",
19
19
  fileContent:
20
- '<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, useForwardProps } 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 const forwarded = useForwardProps(useOmit(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',
20
+ '<template>\n <AccordionContent v-bind="props" :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 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',
21
21
  },
22
22
  {
23
23
  fileName: "Accordion/Header.vue",
24
24
  dirPath: "components/UI",
25
25
  fileContent:
26
- '<template>\n <AccordionHeader v-bind="forwarded" :class="styles({ class: props.class })">\n <slot></slot>\n </AccordionHeader>\n</template>\n\n<script lang="ts" setup>\n import { AccordionHeader, useForwardProps } from "radix-vue";\n import type { AccordionHeaderProps } from "radix-vue";\n\n const props = defineProps<\n AccordionHeaderProps & {\n class?: any;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["class"]));\n\n const styles = tv({\n base: "flex",\n });\n</script>\n',
26
+ '<template>\n <AccordionHeader v-bind="props" :class="styles({ class: props.class })">\n <slot></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',
27
27
  },
28
28
  {
29
29
  fileName: "Accordion/Item.vue",
30
30
  dirPath: "components/UI",
31
31
  fileContent:
32
- '<template>\n <AccordionItem v-bind="forwarded" :class="styles({ class: props.class })">\n <slot></slot>\n </AccordionItem>\n</template>\n\n<script setup lang="ts">\n import { AccordionItem, useForwardProps } from "radix-vue";\n import type { AccordionItemProps } from "radix-vue";\n\n const props = defineProps<\n AccordionItemProps & {\n class?: any;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["class"]));\n\n const styles = tv({\n base: "border-b",\n });\n</script>\n',
32
+ '<template>\n <AccordionItem v-bind="props" :class="styles({ class: props.class })">\n <slot></slot>\n </AccordionItem>\n</template>\n\n<script setup lang="ts">\n import { AccordionItem, useForwardProps } 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',
33
33
  },
34
34
  {
35
35
  fileName: "Accordion/Trigger.vue",
36
36
  dirPath: "components/UI",
37
37
  fileContent:
38
- '<template>\n <AccordionTrigger v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n {{ title }}\n </slot>\n <slot name="icon">\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, useForwardProps } 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 icon: "lucide:chevron-down",\n }\n );\n const forwarded = useForwardProps(useOmit(props, ["class", "title", "icon"]));\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 [&[data-state=open]>svg]:rotate-180",\n });\n</script>\n',
38
+ '<template>\n <AccordionTrigger v-bind="props" :class="styles({ class: props.class })">\n <slot>\n {{ title }}\n </slot>\n <slot name="icon">\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 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 [&[data-state=open]>svg]:rotate-180",\n });\n</script>\n',
39
39
  },
40
40
  ],
41
41
  utils: [],
@@ -46,8 +46,8 @@ export default [
46
46
  name: "Alert",
47
47
  value: "alert",
48
48
  deps: ["radix-vue", "tailwind-variants"],
49
- devDeps: ["nuxt-icon", "nuxt-lodash", "@vueuse/core", "@vueuse/nuxt"],
50
- nuxtModules: ["nuxt-icon", "nuxt-lodash", "@vueuse/nuxt"],
49
+ devDeps: ["nuxt-icon", "@vueuse/core", "@vueuse/nuxt"],
50
+ nuxtModules: ["nuxt-icon", "@vueuse/nuxt"],
51
51
  files: [
52
52
  {
53
53
  fileName: "Alert/Alert.vue",
@@ -59,13 +59,13 @@ export default [
59
59
  fileName: "Alert/Description.vue",
60
60
  dirPath: "components/UI",
61
61
  fileContent:
62
- '<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, useForwardProps } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n class?: any;\n description?: string;\n }\n >(),\n { as: "div" }\n );\n const forwarded = useForwardProps(useOmit(props, ["class", "description"]));\n\n const styles = tv({\n base: "text-sm [&_p]:leading-relaxed",\n });\n</script>\n',
62
+ '<template>\n <Primitive v-bind="props" :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 class?: any;\n description?: string;\n }\n >(),\n { as: "div" }\n );\n\n const styles = tv({\n base: "text-sm [&_p]:leading-relaxed",\n });\n</script>\n',
63
63
  },
64
64
  {
65
65
  fileName: "Alert/Title.vue",
66
66
  dirPath: "components/UI",
67
67
  fileContent:
68
- '<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, useForwardProps } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n class?: any;\n title?: string;\n }\n >(),\n { as: "h5" }\n );\n const forwarded = useForwardProps(useOmit(props, ["class", "title"]));\n\n const styles = tv({\n base: "mb-1 font-medium leading-none tracking-tight",\n });\n</script>\n',
68
+ '<template>\n <Primitive v-bind="props" :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 class?: any;\n title?: string;\n }\n >(),\n { as: "h5" }\n );\n\n const styles = tv({\n base: "mb-1 font-medium leading-none tracking-tight",\n });\n</script>\n',
69
69
  },
70
70
  ],
71
71
  utils: [],
@@ -76,8 +76,8 @@ export default [
76
76
  name: "Alert Dialog",
77
77
  value: "alert-dialog",
78
78
  deps: ["radix-vue", "tailwind-variants"],
79
- devDeps: ["tailwindcss-animate", "nuxt-icon", "nuxt-lodash", "@vueuse/core", "@vueuse/nuxt"],
80
- nuxtModules: ["nuxt-icon", "nuxt-lodash", "@vueuse/nuxt"],
79
+ devDeps: ["tailwindcss-animate", "nuxt-icon", "@vueuse/core", "@vueuse/nuxt"],
80
+ nuxtModules: ["nuxt-icon", "@vueuse/nuxt"],
81
81
  utils: [
82
82
  {
83
83
  fileName: "shared.styles.ts",
@@ -91,67 +91,67 @@ export default [
91
91
  fileName: "AlertDialog/Action.vue",
92
92
  dirPath: "components/UI",
93
93
  fileContent:
94
- '<template>\r\n <AlertDialogAction\r\n v-bind="forwarded"\r\n :class="buttonStyles({ variant, size, disabled, class: props.class })"\r\n >\r\n <slot>{{ text }} </slot>\r\n </AlertDialogAction>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { AlertDialogAction, useForwardProps } from "radix-vue";\r\n import type { AlertDialogActionProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n AlertDialogActionProps & {\r\n onClick?: () => void;\r\n text?: string;\r\n class?: any;\r\n disabled?: boolean;\r\n variant?: VariantProps<typeof buttonStyles>["variant"];\r\n size?: VariantProps<typeof buttonStyles>["size"];\r\n }\r\n >(),\r\n {\r\n text: "Continue",\r\n variant: "default",\r\n }\r\n );\r\n\r\n const forwarded = useForwardProps(useOmit(props, ["text", "class", "variant", "size"]));\r\n</script>\r\n',
94
+ '<template>\r\n <AlertDialogAction\r\n v-bind="props"\r\n :class="buttonStyles({ variant, size, disabled, class: props.class })"\r\n >\r\n <slot>{{ text }} </slot>\r\n </AlertDialogAction>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { AlertDialogAction } from "radix-vue";\r\n import type { AlertDialogActionProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n AlertDialogActionProps & {\r\n onClick?: () => void;\r\n text?: string;\r\n class?: any;\r\n disabled?: boolean;\r\n variant?: VariantProps<typeof buttonStyles>["variant"];\r\n size?: VariantProps<typeof buttonStyles>["size"];\r\n }\r\n >(),\r\n {\r\n text: "Continue",\r\n variant: "default",\r\n }\r\n );\r\n</script>\r\n',
95
95
  },
96
96
  {
97
97
  fileName: "AlertDialog/AlertDialog.vue",
98
98
  dirPath: "components/UI",
99
99
  fileContent:
100
- '<template>\n <AlertDialogRoot v-bind="forwarded">\n <slot>\n <slot name="trigger">\n <UIAlertDialogTrigger v-if="triggerText" as-child>\n <UIButton variant="outline">{{ triggerText }}</UIButton>\n </UIAlertDialogTrigger>\n </slot>\n <slot name="content">\n <UIAlertDialogContent>\n <slot name="header">\n <UIAlertDialogHeader>\n <slot name="title">\n <UIAlertDialogTitle v-if="title" :title="title" />\n </slot>\n <slot name="description">\n <UIAlertDialogDescription v-if="description" :description="description" />\n </slot>\n </UIAlertDialogHeader>\n </slot>\n <slot name="footer">\n <UIAlertDialogFooter>\n <slot name="cancel">\n <UIAlertDialogCancel />\n </slot>\n <slot name="action">\n <UIAlertDialogAction />\n </slot>\n </UIAlertDialogFooter>\n </slot>\n </UIAlertDialogContent>\n </slot>\n </slot>\n </AlertDialogRoot>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogRoot, useForwardPropsEmits } from "radix-vue";\n import type { AlertDialogEmits, AlertDialogProps } from "radix-vue";\n\n const props = defineProps<\n AlertDialogProps & {\n triggerText?: string;\n title?: string;\n description?: string;\n }\n >();\n\n const emits = defineEmits<AlertDialogEmits>();\n\n const forwarded = useForwardPropsEmits(\n useOmit(props, ["description", "title", "triggerText"]),\n emits\n );\n</script>\n',
100
+ '<template>\n <AlertDialogRoot v-bind="forwarded">\n <slot>\n <slot name="trigger">\n <UIAlertDialogTrigger v-if="triggerText" as-child>\n <UIButton variant="outline">{{ triggerText }}</UIButton>\n </UIAlertDialogTrigger>\n </slot>\n <slot name="content">\n <UIAlertDialogContent>\n <slot name="header">\n <UIAlertDialogHeader>\n <slot name="title">\n <UIAlertDialogTitle v-if="title" :title="title" />\n </slot>\n <slot name="description">\n <UIAlertDialogDescription v-if="description" :description="description" />\n </slot>\n </UIAlertDialogHeader>\n </slot>\n <slot name="footer">\n <UIAlertDialogFooter>\n <slot name="cancel">\n <UIAlertDialogCancel />\n </slot>\n <slot name="action">\n <UIAlertDialogAction />\n </slot>\n </UIAlertDialogFooter>\n </slot>\n </UIAlertDialogContent>\n </slot>\n </slot>\n </AlertDialogRoot>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogRoot, useForwardPropsEmits } from "radix-vue";\n import type { AlertDialogEmits, AlertDialogProps } from "radix-vue";\n\n const props = defineProps<\n AlertDialogProps & {\n triggerText?: string;\n title?: string;\n description?: string;\n }\n >();\n\n const emits = defineEmits<AlertDialogEmits>();\n\n const forwarded = useForwardPropsEmits(props, emits);\n</script>\n',
101
101
  },
102
102
  {
103
103
  fileName: "AlertDialog/Cancel.vue",
104
104
  dirPath: "components/UI",
105
105
  fileContent:
106
- '<template>\r\n <AlertDialogCancel\r\n v-bind="forwarded"\r\n :class="buttonStyles({ variant, size, disabled, class: props.class })"\r\n >\r\n <slot>{{ text }}</slot>\r\n </AlertDialogCancel>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { AlertDialogCancel, useForwardProps } from "radix-vue";\r\n import type { AlertDialogCancelProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n AlertDialogCancelProps & {\r\n onClick?: () => void;\r\n text?: string;\r\n class?: any;\r\n disabled?: boolean;\r\n variant?: VariantProps<typeof buttonStyles>["variant"];\r\n size?: VariantProps<typeof buttonStyles>["size"];\r\n }\r\n >(),\r\n {\r\n text: "Cancel",\r\n variant: "outline",\r\n }\r\n );\r\n const forwarded = useForwardProps(useOmit(props, ["text", "class", "variant", "size"]));\r\n</script>\r\n',
106
+ '<template>\r\n <AlertDialogCancel\r\n v-bind="props"\r\n :class="buttonStyles({ variant, size, disabled, class: props.class })"\r\n >\r\n <slot>{{ text }}</slot>\r\n </AlertDialogCancel>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { AlertDialogCancel } from "radix-vue";\r\n import type { AlertDialogCancelProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n AlertDialogCancelProps & {\r\n onClick?: () => void;\r\n text?: string;\r\n class?: any;\r\n disabled?: boolean;\r\n variant?: VariantProps<typeof buttonStyles>["variant"];\r\n size?: VariantProps<typeof buttonStyles>["size"];\r\n }\r\n >(),\r\n {\r\n text: "Cancel",\r\n variant: "outline",\r\n }\r\n );\r\n</script>\r\n',
107
107
  },
108
108
  {
109
109
  fileName: "AlertDialog/Content.vue",
110
110
  dirPath: "components/UI",
111
111
  fileContent:
112
- '<template>\n <UIAlertDialogPortal :to="to">\n <slot name="overlay">\n <UIAlertDialogOverlay />\n </slot>\n <AlertDialogContent\n :class="styles({ class: props.class })"\n v-bind="{ ...forwarded, ...$attrs }"\n >\n <slot></slot>\n </AlertDialogContent>\n </UIAlertDialogPortal>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogContent, useForwardPropsEmits } from "radix-vue";\n import type { AlertDialogContentEmits, AlertDialogContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = defineProps<\n AlertDialogContentProps & {\n class?: any;\n to?: string | HTMLElement;\n }\n >();\n const emit = defineEmits<AlertDialogContentEmits>();\n const forwarded = useForwardPropsEmits(useOmit(props, ["class", "to"]), emit);\n\n const styles = tv({\n base: "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg md:w-full",\n });\n</script>\n',
112
+ '<template>\n <UIAlertDialogPortal :to="to">\n <slot name="overlay">\n <UIAlertDialogOverlay />\n </slot>\n <AlertDialogContent\n :class="styles({ class: props.class })"\n v-bind="{ ...forwarded, ...$attrs }"\n >\n <slot></slot>\n </AlertDialogContent>\n </UIAlertDialogPortal>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogContent, useForwardPropsEmits } from "radix-vue";\n import type { AlertDialogContentEmits, AlertDialogContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = defineProps<\n AlertDialogContentProps & {\n class?: any;\n to?: string | HTMLElement;\n }\n >();\n const emit = defineEmits<AlertDialogContentEmits>();\n const forwarded = useForwardPropsEmits(props, emit);\n\n const styles = tv({\n base: "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg md:w-full",\n });\n</script>\n',
113
113
  },
114
114
  {
115
115
  fileName: "AlertDialog/Description.vue",
116
116
  dirPath: "components/UI",
117
117
  fileContent:
118
- '<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, useForwardProps } from "radix-vue";\n import type { AlertDialogDescriptionProps } from "radix-vue";\n\n const props = defineProps<\n AlertDialogDescriptionProps & {\n description?: string;\n class?: any;\n }\n >();\n\n const forwarded = useForwardProps(useOmit(props, ["description", "class"]));\n\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
118
+ '<template>\n <AlertDialogDescription v-bind="props" :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 description?: string;\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
119
119
  },
120
120
  {
121
121
  fileName: "AlertDialog/Footer.vue",
122
122
  dirPath: "components/UI",
123
123
  fileContent:
124
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot></slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive, useForwardProps } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n\n const forwarded = useForwardProps(useOmit(props, ["class"]));\n\n const styles = tv({\n base: "flex flex-col-reverse sm:flex-row sm:justify-end sm:gap-2",\n });\n</script>\n',
124
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\n <slot></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 const styles = tv({\n base: "flex flex-col-reverse sm:flex-row sm:justify-end sm:gap-2",\n });\n</script>\n',
125
125
  },
126
126
  {
127
127
  fileName: "AlertDialog/Header.vue",
128
128
  dirPath: "components/UI",
129
129
  fileContent:
130
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot></slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive, useForwardProps } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n const forwarded = useForwardProps(useOmit(props, ["class"]));\n\n const styles = tv({\n base: "flex flex-col gap-2 text-center sm:text-left",\n });\n</script>\n',
130
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\n <slot></slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive, useForwardProps } 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: "flex flex-col gap-2 text-center sm:text-left",\n });\n</script>\n',
131
131
  },
132
132
  {
133
133
  fileName: "AlertDialog/Overlay.vue",
134
134
  dirPath: "components/UI",
135
135
  fileContent:
136
- '<template>\n <AlertDialogOverlay v-bind="forwarded" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogOverlay, useForwardProps } from "radix-vue";\n import type { AlertDialogOverlayProps } from "radix-vue";\n\n const props = defineProps<\n AlertDialogOverlayProps & {\n class?: any;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["class"]));\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',
136
+ '<template>\n <AlertDialogOverlay v-bind="props" :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 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',
137
137
  },
138
138
  {
139
139
  fileName: "AlertDialog/Portal.vue",
140
140
  dirPath: "components/UI",
141
141
  fileContent:
142
- '<template>\n <AlertDialogPortal v-bind="forwarded">\n <slot></slot>\n </AlertDialogPortal>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogPortal, useForwardProps } from "radix-vue";\n import type { AlertDialogPortalProps } from "radix-vue";\n\n const props = defineProps<AlertDialogPortalProps>();\n const forwarded = useForwardProps(props);\n</script>\n',
142
+ '<template>\n <AlertDialogPortal v-bind="props">\n <slot></slot>\n </AlertDialogPortal>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogPortal } from "radix-vue";\n import type { AlertDialogPortalProps } from "radix-vue";\n\n const props = defineProps<AlertDialogPortalProps>();\n</script>\n',
143
143
  },
144
144
  {
145
145
  fileName: "AlertDialog/Title.vue",
146
146
  dirPath: "components/UI",
147
147
  fileContent:
148
- '<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, useForwardProps } from "radix-vue";\n import type { AlertDialogTitleProps } from "radix-vue";\n\n const props = defineProps<\n AlertDialogTitleProps & {\n title?: string;\n class?: any;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["title", "class"]));\n\n const styles = tv({\n base: "text-lg font-semibold",\n });\n</script>\n',
148
+ '<template>\n <AlertDialogTitle v-bind="props" :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 title?: string;\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "text-lg font-semibold",\n });\n</script>\n',
149
149
  },
150
150
  {
151
151
  fileName: "AlertDialog/Trigger.vue",
152
152
  dirPath: "components/UI",
153
153
  fileContent:
154
- '<template>\n <AlertDialogTrigger v-bind="forwarded">\n <slot></slot>\n </AlertDialogTrigger>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogTrigger, useForwardProps } from "radix-vue";\n import type { AlertDialogTriggerProps } from "radix-vue";\n\n const props = defineProps<AlertDialogTriggerProps>();\n const forwarded = useForwardProps(props);\n</script>\n',
154
+ '<template>\n <AlertDialogTrigger v-bind="props">\n <slot></slot>\n </AlertDialogTrigger>\n</template>\n\n<script lang="ts" setup>\n import { AlertDialogTrigger, useForwardProps } from "radix-vue";\n import type { AlertDialogTriggerProps } from "radix-vue";\n\n const props = defineProps<AlertDialogTriggerProps>();\n</script>\n',
155
155
  },
156
156
  ],
157
157
  composables: [],
@@ -168,7 +168,7 @@ export default [
168
168
  fileName: "AspectRatio.vue",
169
169
  dirPath: "components/UI",
170
170
  fileContent:
171
- '<template>\r\n <AspectRatio v-bind="forwarded">\r\n <slot />\r\n </AspectRatio>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { AspectRatio, useForwardProps } from "radix-vue";\r\n import type { AspectRatioProps } from "radix-vue";\r\n\r\n const props = defineProps<AspectRatioProps>();\r\n const forwarded = useForwardProps(props);\r\n</script>\r\n',
171
+ '<template>\r\n <AspectRatio v-bind="props">\r\n <slot />\r\n </AspectRatio>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { AspectRatio } from "radix-vue";\r\n import type { AspectRatioProps } from "radix-vue";\r\n\r\n const props = defineProps<AspectRatioProps>();\r\n</script>\r\n',
172
172
  },
173
173
  ],
174
174
  utils: [],
@@ -179,8 +179,8 @@ export default [
179
179
  name: "Autocomplete",
180
180
  value: "autocomplete",
181
181
  deps: ["radix-vue", "tailwind-variants"],
182
- devDeps: ["tailwindcss-animate", "nuxt-icon", "nuxt-lodash", "@vueuse/core", "@vueuse/nuxt"],
183
- nuxtModules: ["nuxt-icon", "nuxt-lodash", "@vueuse/nuxt"],
182
+ devDeps: ["tailwindcss-animate", "nuxt-icon", "@vueuse/core", "@vueuse/nuxt"],
183
+ nuxtModules: ["nuxt-icon", "@vueuse/nuxt"],
184
184
  files: [
185
185
  {
186
186
  fileName: "Autocomplete/Anchor.vue",
@@ -281,8 +281,8 @@ export default [
281
281
  name: "Avatar",
282
282
  value: "avatar",
283
283
  deps: ["radix-vue", "tailwind-variants"],
284
- devDeps: ["nuxt-lodash"],
285
- nuxtModules: ["nuxt-lodash"],
284
+ devDeps: [],
285
+ nuxtModules: [],
286
286
  files: [
287
287
  {
288
288
  fileName: "Avatar/Avatar.vue",
@@ -294,13 +294,13 @@ export default [
294
294
  fileName: "Avatar/Fallback.vue",
295
295
  dirPath: "components/UI",
296
296
  fileContent:
297
- '<template>\r\n <AvatarFallback :class="styles({ class: props.class })" v-bind="forwarded">\r\n <slot>\r\n {{ fallback }}\r\n </slot>\r\n </AvatarFallback>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { AvatarFallback, useForwardProps } from "radix-vue";\r\n import type { AvatarFallbackProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n AvatarFallbackProps & {\r\n fallback?: string;\r\n class?: any;\r\n }\r\n >();\r\n const forwarded = useForwardProps(useOmit(props, ["fallback", "class"]));\r\n\r\n const styles = tv({\r\n base: "flex h-full w-full items-center justify-center rounded-full bg-muted font-medium",\r\n });\r\n</script>\r\n',
297
+ '<template>\r\n <AvatarFallback :class="styles({ class: props.class })" v-bind="props">\r\n <slot>\r\n {{ fallback }}\r\n </slot>\r\n </AvatarFallback>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { AvatarFallback } from "radix-vue";\r\n import type { AvatarFallbackProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n AvatarFallbackProps & {\r\n fallback?: string;\r\n class?: any;\r\n }\r\n >();\r\n const styles = tv({\r\n base: "flex h-full w-full items-center justify-center rounded-full bg-muted font-medium",\r\n });\r\n</script>\r\n',
298
298
  },
299
299
  {
300
300
  fileName: "Avatar/Image.vue",
301
301
  dirPath: "components/UI",
302
302
  fileContent:
303
- '<template>\r\n <AvatarImage v-bind="forwarded" :class="styles({ class: props.class })" :alt="alt" />\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { AvatarImage, useForwardPropsEmits } from "radix-vue";\r\n import type { AvatarImageEmits, AvatarImageProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n AvatarImageProps & {\r\n alt?: string;\r\n class?: any;\r\n }\r\n >();\r\n const emits = defineEmits<AvatarImageEmits>();\r\n const forwarded = useForwardPropsEmits(useOmit(props, ["alt", "class"]));\r\n\r\n const styles = tv({\r\n base: "aspect-square h-full w-full object-cover",\r\n });\r\n</script>\r\n',
303
+ '<template>\r\n <AvatarImage v-bind="props" :class="styles({ class: props.class })" :alt="alt" />\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { AvatarImage } from "radix-vue";\r\n import type { AvatarImageEmits, AvatarImageProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n AvatarImageProps & {\r\n alt?: string;\r\n class?: any;\r\n }\r\n >();\r\n const emits = defineEmits<AvatarImageEmits>();\r\n\r\n const styles = tv({\r\n base: "aspect-square h-full w-full object-cover",\r\n });\r\n</script>\r\n',
304
304
  },
305
305
  ],
306
306
  utils: [],
@@ -391,44 +391,44 @@ export default [
391
391
  name: "Card",
392
392
  value: "card",
393
393
  deps: ["radix-vue", "tailwind-variants"],
394
- devDeps: ["nuxt-lodash"],
395
- nuxtModules: ["nuxt-lodash"],
394
+ devDeps: [],
395
+ nuxtModules: [],
396
396
  files: [
397
397
  {
398
398
  fileName: "Card/Card.vue",
399
399
  dirPath: "components/UI",
400
400
  fileContent:
401
- '<template>\r\n <Primitive :as="as" :as-child="asChild" :class="styles({ class: props.class })">\r\n <slot>\r\n <slot name="header">\r\n <UICardHeader>\r\n <slot name="title">\r\n <UICardTitle v-if="title || $slots.title" :title="title" />\r\n </slot>\r\n <slot name="description">\r\n <UICardDescription\r\n v-if="description || $slots.description"\r\n :description="description"\r\n />\r\n </slot>\r\n </UICardHeader>\r\n </slot>\r\n <slot name="content" v-if="content || $slots.content">\r\n <UICardContent>\r\n <div v-html="content"></div>\r\n </UICardContent>\r\n </slot>\r\n <slot name="footer"></slot>\r\n </slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n title?: string;\r\n description?: string;\r\n content?: string;\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "div",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "rounded-lg border bg-card text-card-foreground shadow-sm",\r\n });\r\n</script>\r\n',
401
+ '<template>\r\n <Primitive :as="as" :as-child="asChild" :class="styles({ class: props.class })">\r\n <slot>\r\n <slot name="header">\r\n <UICardHeader>\r\n <slot name="title">\r\n <UICardTitle v-if="title || $slots.title" :title="title" />\r\n </slot>\r\n <slot name="description">\r\n <UICardDescription\r\n v-if="description || $slots.description"\r\n :description="description"\r\n />\r\n </slot>\r\n </UICardHeader>\r\n </slot>\r\n <slot name="content" v-if="content || $slots.content">\r\n <UICardContent>\r\n <div v-html="content"></div>\r\n </UICardContent>\r\n </slot>\r\n <slot name="footer"></slot>\r\n </slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n title?: string;\r\n description?: string;\r\n content?: string;\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "div",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "rounded-lg border bg-card text-card-foreground shadow-sm",\r\n });\r\n</script>\r\n',
402
402
  },
403
403
  {
404
404
  fileName: "Card/Content.vue",
405
405
  dirPath: "components/UI",
406
406
  fileContent:
407
- '<template>\r\n <Primitive :as="as" :as-child="asChild" :class="styles({ class: props.class })">\r\n <slot>\r\n {{ content }}\r\n </slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n content?: string;\r\n class?: any;\r\n }\r\n >(),\r\n { as: "div" }\r\n );\r\n const styles = tv({\r\n base: "p-6 pt-0",\r\n });\r\n</script>\r\n',
407
+ '<template>\r\n <Primitive :as="as" :as-child="asChild" :class="styles({ class: props.class })">\r\n <slot>\r\n {{ content }}\r\n </slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n content?: string;\r\n class?: any;\r\n }\r\n >(),\r\n { as: "div" }\r\n );\r\n const styles = tv({\r\n base: "p-6 pt-0",\r\n });\r\n</script>\r\n',
408
408
  },
409
409
  {
410
410
  fileName: "Card/Description.vue",
411
411
  dirPath: "components/UI",
412
412
  fileContent:
413
- '<template>\r\n <Primitive :class="styles({ class: props.class })" :as="as" :as-child="asChild">\r\n <slot>\r\n {{ description }}\r\n </slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n description?: string;\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "div",\r\n }\r\n );\r\n const styles = tv({\r\n base: "text-sm text-muted-foreground",\r\n });\r\n</script>\r\n',
413
+ '<template>\r\n <Primitive :class="styles({ class: props.class })" :as="as" :as-child="asChild">\r\n <slot>\r\n {{ description }}\r\n </slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n description?: string;\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "div",\r\n }\r\n );\r\n const styles = tv({\r\n base: "text-sm text-muted-foreground",\r\n });\r\n</script>\r\n',
414
414
  },
415
415
  {
416
416
  fileName: "Card/Footer.vue",
417
417
  dirPath: "components/UI",
418
418
  fileContent:
419
- '<template>\r\n <Primitive :class="styles({ class: props.class })" :as="as" :as-child="asChild">\r\n <slot> </slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n }\r\n >(),\r\n { as: "div" }\r\n );\r\n\r\n const styles = tv({\r\n base: "flex items-center p-6 pt-0",\r\n });\r\n</script>\r\n',
419
+ '<template>\r\n <Primitive :class="styles({ class: props.class })" :as="as" :as-child="asChild">\r\n <slot> </slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n }\r\n >(),\r\n { as: "div" }\r\n );\r\n\r\n const styles = tv({\r\n base: "flex items-center p-6 pt-0",\r\n });\r\n</script>\r\n',
420
420
  },
421
421
  {
422
422
  fileName: "Card/Header.vue",
423
423
  dirPath: "components/UI",
424
424
  fileContent:
425
- '<template>\r\n <Primitive :class="styles({ class: props.class })" :as="as" :as-child="asChild">\r\n <slot></slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n }\r\n >(),\r\n { as: "div" }\r\n );\r\n\r\n const styles = tv({\r\n base: "flex flex-col space-y-1.5 p-6",\r\n });\r\n</script>\r\n',
425
+ '<template>\r\n <Primitive :class="styles({ class: props.class })" :as="as" :as-child="asChild">\r\n <slot></slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n }\r\n >(),\r\n { as: "div" }\r\n );\r\n\r\n const styles = tv({\r\n base: "flex flex-col space-y-1.5 p-6",\r\n });\r\n</script>\r\n',
426
426
  },
427
427
  {
428
428
  fileName: "Card/Title.vue",
429
429
  dirPath: "components/UI",
430
430
  fileContent:
431
- '<template>\r\n <Primitive :class="styles({ class: props.class })" :as="as" :as-child="asChild">\r\n <slot>\r\n {{ title }}\r\n </slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n title?: string;\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "h3",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "text-xl font-semibold leading-none tracking-tight",\r\n });\r\n</script>\r\n',
431
+ '<template>\r\n <Primitive :class="styles({ class: props.class })" :as="as" :as-child="asChild">\r\n <slot>\r\n {{ title }}\r\n </slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n title?: string;\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "h3",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "text-xl font-semibold leading-none tracking-tight",\r\n });\r\n</script>\r\n',
432
432
  },
433
433
  ],
434
434
  utils: [],
@@ -439,8 +439,8 @@ export default [
439
439
  name: "Checkbox",
440
440
  value: "checkbox",
441
441
  deps: ["radix-vue", "tailwind-variants"],
442
- devDeps: ["nuxt-lodash", "nuxt-icon"],
443
- nuxtModules: ["nuxt-lodash", "nuxt-icon"],
442
+ devDeps: ["nuxt-icon"],
443
+ nuxtModules: ["nuxt-icon"],
444
444
  files: [
445
445
  {
446
446
  fileName: "Checkbox/Checkbox.vue",
@@ -452,7 +452,7 @@ export default [
452
452
  fileName: "Checkbox/Indicator.vue",
453
453
  dirPath: "components/UI",
454
454
  fileContent:
455
- '<template>\r\n <CheckboxIndicator :class="styles({ class: props.class })" v-bind="forwarded">\r\n <slot>\r\n <Icon :name="icon" class="h-4 w-4" />\r\n </slot>\r\n </CheckboxIndicator>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { CheckboxIndicator, useForwardProps } from "radix-vue";\r\n import type { CheckboxIndicatorProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n CheckboxIndicatorProps & {\r\n class?: any;\r\n icon?: string;\r\n }\r\n >(),\r\n {\r\n icon: "lucide:check",\r\n }\r\n );\r\n const forwarded = useForwardProps(useOmit(props, ["icon", "class"]));\r\n\r\n const styles = tv({\r\n base: "flex items-center justify-center text-current",\r\n });\r\n</script>\r\n',
455
+ '<template>\r\n <CheckboxIndicator :class="styles({ class: props.class })" v-bind="props">\r\n <slot>\r\n <Icon :name="icon" class="h-4 w-4" />\r\n </slot>\r\n </CheckboxIndicator>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { CheckboxIndicator } from "radix-vue";\r\n import type { CheckboxIndicatorProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n CheckboxIndicatorProps & {\r\n class?: any;\r\n icon?: string;\r\n }\r\n >(),\r\n {\r\n icon: "lucide:check",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "flex items-center justify-center text-current",\r\n });\r\n</script>\r\n',
456
456
  },
457
457
  ],
458
458
  utils: [],
@@ -463,8 +463,8 @@ export default [
463
463
  name: "Collapsible",
464
464
  value: "collapsible",
465
465
  deps: ["radix-vue", "tailwind-variants"],
466
- devDeps: ["tailwindcss-animate", "nuxt-lodash", "nuxt-icon"],
467
- nuxtModules: ["nuxt-lodash", "nuxt-icon"],
466
+ devDeps: ["tailwindcss-animate", "nuxt-icon"],
467
+ nuxtModules: ["nuxt-icon"],
468
468
  instructions: ["Remember to add the collapsile animations to your tailwind.config.js"],
469
469
  files: [
470
470
  {
@@ -477,7 +477,7 @@ export default [
477
477
  fileName: "Collapsible/Content.vue",
478
478
  dirPath: "components/UI",
479
479
  fileContent:
480
- '<template>\n <CollapsibleContent :class="styles({ class: props.class })" v-bind="forwarded">\n <slot></slot>\n </CollapsibleContent>\n</template>\n\n<script lang="ts" setup>\n import { CollapsibleContent, useForwardProps } from "radix-vue";\n import type { CollapsibleContentProps } from "radix-vue";\n\n const props = defineProps<\n CollapsibleContentProps & {\n class?: any;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["class"]));\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',
480
+ '<template>\n <CollapsibleContent :class="styles({ class: props.class })" v-bind="props">\n <slot></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 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',
481
481
  },
482
482
  {
483
483
  fileName: "Collapsible/Trigger.vue",
@@ -494,14 +494,14 @@ export default [
494
494
  name: "Command",
495
495
  value: "command",
496
496
  deps: ["radix-vue", "tailwind-variants"],
497
- devDeps: ["tailwindcss-animate", "nuxt-lodash", "nuxt-icon"],
498
- nuxtModules: ["nuxt-lodash", "nuxt-icon"],
497
+ devDeps: ["tailwindcss-animate", "nuxt-icon"],
498
+ nuxtModules: ["nuxt-icon"],
499
499
  files: [
500
500
  {
501
501
  fileName: "Command/Cancel.vue",
502
502
  dirPath: "components/UI",
503
503
  fileContent:
504
- '<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, useForwardProps } from "radix-vue";\n import type { ComboboxCancelProps } from "radix-vue";\n\n const props = defineProps<ComboboxCancelProps & { class?: any }>();\n const forwarded = useForwardProps(props);\n\n const styles = tv({\n base: "flex items-center justify-center",\n });\n</script>\n',
504
+ '<template>\n <ComboboxCancel v-bind="props" :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',
505
505
  },
506
506
  {
507
507
  fileName: "Command/Command.vue",
@@ -519,13 +519,13 @@ export default [
519
519
  fileName: "Command/Empty.vue",
520
520
  dirPath: "components/UI",
521
521
  fileContent:
522
- '<template>\n <ComboboxEmpty :class="styles({ class: props.class })" v-bind="forwarded">\n <slot></slot>\n </ComboboxEmpty>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxEmpty, useForwardProps } from "radix-vue";\n import type { ComboboxEmptyProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxEmptyProps & {\n class?: any;\n }\n >();\n\n const forwarded = useForwardProps(props);\n\n const styles = tv({\n base: "py-6 text-center text-sm",\n });\n</script>\n',
522
+ '<template>\n <ComboboxEmpty :class="styles({ class: props.class })" v-bind="props">\n <slot></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 class?: any;\n }\n >();\n\n const styles = tv({\n base: "py-6 text-center text-sm",\n });\n</script>\n',
523
523
  },
524
524
  {
525
525
  fileName: "Command/Group.vue",
526
526
  dirPath: "components/UI",
527
527
  fileContent:
528
- '<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> </slot>\n </ComboboxGroup>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxGroup, useForwardProps } from "radix-vue";\n import type { ComboboxGroupProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxGroupProps & {\n heading?: any;\n class?: any;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["heading", "class"]));\n\n const styles = tv({\n base: "overflow-hidden p-1 text-foreground",\n });\n</script>\n',
528
+ '<template>\n <ComboboxGroup :class="styles({ class: props.class })" v-bind="props">\n <slot name="heading">\n <UICommandLabel v-if="heading" :label="heading" />\n </slot>\n <slot> </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 heading?: any;\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "overflow-hidden p-1 text-foreground",\n });\n</script>\n',
529
529
  },
530
530
  {
531
531
  fileName: "Command/Input.vue",
@@ -537,19 +537,19 @@ export default [
537
537
  fileName: "Command/Item.vue",
538
538
  dirPath: "components/UI",
539
539
  fileContent:
540
- '<template>\n <ComboboxItem v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <slot name="icon">\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n </slot>\n {{ text }}\n <slot name="shortcut">\n <UICommandShortcut v-if="shortcut" :shortcut="shortcut" />\n </slot>\n </slot>\n </ComboboxItem>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxItem, useForwardPropsEmits } from "radix-vue";\n import type { ComboboxItemEmits, ComboboxItemProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxItemProps & {\n class?: any;\n icon?: string;\n text?: string;\n shortcut?: string;\n }\n >();\n const emit = defineEmits<ComboboxItemEmits>();\n const forwarded = useForwardPropsEmits(\n useOmit(props, ["class", "icon", "text", "shortcut"]),\n emit\n );\n\n const styles = tv({\n base: "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled]:pointer-events-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n });\n</script>\n',
540
+ '<template>\n <ComboboxItem v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <slot name="icon">\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n </slot>\n {{ text }}\n <slot name="shortcut">\n <UICommandShortcut v-if="shortcut" :shortcut="shortcut" />\n </slot>\n </slot>\n </ComboboxItem>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxItem, useForwardPropsEmits } from "radix-vue";\n import type { ComboboxItemEmits, ComboboxItemProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxItemProps & {\n class?: any;\n icon?: string;\n text?: string;\n shortcut?: string;\n }\n >();\n const emit = defineEmits<ComboboxItemEmits>();\n const forwarded = useForwardPropsEmits(props, emit);\n\n const styles = tv({\n base: "relative flex cursor-pointer select-none items-center gap-2 rounded-sm px-2 py-1.5 text-sm outline-none data-[disabled]:pointer-events-none data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n });\n</script>\n',
541
541
  },
542
542
  {
543
543
  fileName: "Command/Label.vue",
544
544
  dirPath: "components/UI",
545
545
  fileContent:
546
- '<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, useForwardProps } from "radix-vue";\n import type { ComboboxLabelProps } from "radix-vue";\n\n const props = defineProps<\n ComboboxLabelProps & {\n class?: any;\n label?: any;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["label", "class"]));\n\n const styles = tv({\n base: "px-2 py-1.5 text-xs font-medium text-muted-foreground",\n });\n</script>\n',
546
+ '<template>\n <ComboboxLabel :class="styles({ class: props.class })" v-bind="props">\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 class?: any;\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',
547
547
  },
548
548
  {
549
549
  fileName: "Command/List.vue",
550
550
  dirPath: "components/UI",
551
551
  fileContent:
552
- '<template>\n <ComboboxContent v-bind="forwarded" :class="styles({ class: props.class })">\n <slot></slot>\n </ComboboxContent>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxContent, useForwardPropsEmits } from "radix-vue";\n import type { ComboboxContentEmits, ComboboxContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = defineProps<\n ComboboxContentProps & {\n class?: any;\n }\n >();\n\n const emits = defineEmits<ComboboxContentEmits>();\n const forwarded = useForwardPropsEmits(useOmit(props, ["class"]), emits);\n\n const styles = tv({\n base: "max-h-[300px] overflow-y-auto overflow-x-hidden",\n });\n</script>\n',
552
+ '<template>\n <ComboboxContent v-bind="forwarded" :class="styles({ class: props.class })">\n <slot></slot>\n </ComboboxContent>\n</template>\n\n<script lang="ts" setup>\n import { ComboboxContent, useForwardPropsEmits } from "radix-vue";\n import type { ComboboxContentEmits, ComboboxContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = defineProps<\n ComboboxContentProps & {\n class?: any;\n }\n >();\n\n const emits = defineEmits<ComboboxContentEmits>();\n const forwarded = useForwardPropsEmits(props, emits);\n\n const styles = tv({\n base: "max-h-[300px] overflow-y-auto overflow-x-hidden",\n });\n</script>\n',
553
553
  },
554
554
  {
555
555
  fileName: "Command/Separator.vue",
@@ -561,7 +561,7 @@ export default [
561
561
  fileName: "Command/Shortcut.vue",
562
562
  dirPath: "components/UI",
563
563
  fileContent:
564
- '<template>\n <Primitive :as="as || \'span\'" :as-child="asChild" :class="styles({ class: props.class })">\n <slot>{{ shortcut }}</slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\n\n const props = defineProps<\n PrimitiveProps & {\n class?: any;\n shortcut?: any;\n }\n >();\n const styles = tv({\n base: "ml-auto text-xs tracking-widest text-muted-foreground",\n });\n</script>\n',
564
+ '<template>\n <Primitive :as="as || \'span\'" :as-child="asChild" :class="styles({ class: props.class })">\n <slot>{{ shortcut }}</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 = defineProps<\n PrimitiveProps & {\n class?: any;\n shortcut?: any;\n }\n >();\n const styles = tv({\n base: "ml-auto text-xs tracking-widest text-muted-foreground",\n });\n</script>\n',
565
565
  },
566
566
  ],
567
567
  utils: [],
@@ -572,26 +572,26 @@ export default [
572
572
  name: "Context Menu",
573
573
  value: "context-menu",
574
574
  deps: ["radix-vue", "tailwind-variants"],
575
- devDeps: ["tailwindcss-animate", "nuxt-lodash", "nuxt-icon"],
576
- nuxtModules: ["nuxt-lodash", "nuxt-icon"],
575
+ devDeps: ["tailwindcss-animate", "nuxt-icon"],
576
+ nuxtModules: ["nuxt-icon"],
577
577
  files: [
578
578
  {
579
579
  fileName: "ContextMenu/Arrow.vue",
580
580
  dirPath: "components/UI",
581
581
  fileContent:
582
- '<template>\n <ContextMenuArrow v-bind="forwarded" :class="styles({ class: props.class })" />\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuArrow, useForwardProps } from "radix-vue";\n import type { ContextMenuArrowProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuArrowProps & {\n class?: any;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["class"]));\n\n const styles = tv({\n base: "border bg-muted",\n });\n</script>\n',
582
+ '<template>\n <ContextMenuArrow v-bind="props" :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 class?: any;\n }\n >();\n const styles = tv({\n base: "border bg-muted",\n });\n</script>\n',
583
583
  },
584
584
  {
585
585
  fileName: "ContextMenu/CheckboxItem.vue",
586
586
  dirPath: "components/UI",
587
587
  fileContent:
588
- '<template>\n <ContextMenuCheckboxItem\n v-bind="{ ...props, ...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 class?: any;\n shortcut?: string;\n title?: string;\n }\n >();\n\n const emits = defineEmits<ContextMenuCheckboxItemEmits>();\n\n const styles = tv({\n base: "relative flex cursor-default 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]:cursor-not-allowed data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n });\n</script>\n',
588
+ '<template>\n <ContextMenuCheckboxItem\n v-bind="{ ...props, ...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 class?: any;\n shortcut?: string;\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',
589
589
  },
590
590
  {
591
591
  fileName: "ContextMenu/Content.vue",
592
592
  dirPath: "components/UI",
593
593
  fileContent:
594
- '<template>\n <UIContextMenuPortal>\n <ContextMenuContent\n v-bind="{ ...forwarded, ...$attrs }"\n :class="styles({ class: props.class })"\n >\n <slot></slot>\n </ContextMenuContent>\n </UIContextMenuPortal>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuContent, useForwardPropsEmits } from "radix-vue";\n import type { ContextMenuContentEmits, ContextMenuContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n const props = withDefaults(\n defineProps<\n ContextMenuContentProps & {\n class?: any;\n }\n >(),\n {\n loop: true,\n avoidCollisions: true,\n collisionPadding: 5,\n sticky: "partial",\n }\n );\n\n const emits = defineEmits<ContextMenuContentEmits>();\n const forwarded = useForwardPropsEmits(useOmit(props, ["class"]), emits);\n\n const styles = tv({\n base: "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in fade-in-80 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',
594
+ '<template>\n <UIContextMenuPortal>\n <ContextMenuContent\n v-bind="{ ...forwarded, ...$attrs }"\n :class="styles({ class: props.class })"\n >\n <slot></slot>\n </ContextMenuContent>\n </UIContextMenuPortal>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuContent, useForwardPropsEmits } from "radix-vue";\n import type { ContextMenuContentEmits, ContextMenuContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n const props = withDefaults(\n defineProps<\n ContextMenuContentProps & {\n class?: any;\n }\n >(),\n {\n loop: true,\n avoidCollisions: true,\n collisionPadding: 5,\n sticky: "partial",\n }\n );\n\n const emits = defineEmits<ContextMenuContentEmits>();\n const forwarded = useForwardPropsEmits(props, emits);\n\n const styles = tv({\n base: "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in fade-in-80 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',
595
595
  },
596
596
  {
597
597
  fileName: "ContextMenu/ContextMenu.vue",
@@ -603,25 +603,25 @@ export default [
603
603
  fileName: "ContextMenu/Group.vue",
604
604
  dirPath: "components/UI",
605
605
  fileContent:
606
- '<template>\n <ContextMenuGroup v-bind="forwarded">\n <slot></slot>\n </ContextMenuGroup>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuGroup, useForwardProps } from "radix-vue";\n import type { ContextMenuGroupProps } from "radix-vue";\n\n const props = defineProps<ContextMenuGroupProps>();\n const forwarded = useForwardProps(props);\n</script>\n',
606
+ '<template>\n <ContextMenuGroup v-bind="props">\n <slot></slot>\n </ContextMenuGroup>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuGroup } from "radix-vue";\n import type { ContextMenuGroupProps } from "radix-vue";\n\n const props = defineProps<ContextMenuGroupProps>();\n</script>\n',
607
607
  },
608
608
  {
609
609
  fileName: "ContextMenu/Item.vue",
610
610
  dirPath: "components/UI",
611
611
  fileContent:
612
- '<template>\n <ContextMenuItem\n v-bind="{ ...forwarded, ...useEmitAsProps(emits) }"\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 class?: any;\n inset?: boolean;\n shortcut?: string;\n title?: string;\n }\n >();\n\n const forwarded = useOmit(props, ["class", "inset", "shortcut", "title"]);\n\n const emits = defineEmits<ContextMenuItemEmits>();\n\n const styles = tv({\n base: "relative flex cursor-default 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]: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',
612
+ '<template>\n <ContextMenuItem\n v-bind="{ ...props, ...useEmitAsProps(emits) }"\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 class?: any;\n inset?: boolean;\n shortcut?: string;\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',
613
613
  },
614
614
  {
615
615
  fileName: "ContextMenu/ItemIndicator.vue",
616
616
  dirPath: "components/UI",
617
617
  fileContent:
618
- '<template>\n <ContextMenuItemIndicator v-bind="forwarded">\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, useForwardProps } from "radix-vue";\n import type { ContextMenuItemIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuItemIndicatorProps & {\n icon?: string;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["icon"]));\n</script>\n',
618
+ '<template>\n <ContextMenuItemIndicator v-bind="props">\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 icon?: string;\n }\n >();\n</script>\n',
619
619
  },
620
620
  {
621
621
  fileName: "ContextMenu/Label.vue",
622
622
  dirPath: "components/UI",
623
623
  fileContent:
624
- '<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, useForwardProps } from "radix-vue";\n import type { ContextMenuLabelProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuLabelProps & {\n class?: any;\n inset?: boolean;\n label?: string;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["class", "inset", "label"]));\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',
624
+ '<template>\n <ContextMenuLabel :class="styles({ inset, class: props.class })" v-bind="props">\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 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',
625
625
  },
626
626
  {
627
627
  fileName: "ContextMenu/Portal.vue",
@@ -639,19 +639,19 @@ export default [
639
639
  fileName: "ContextMenu/RadioItem.vue",
640
640
  dirPath: "components/UI",
641
641
  fileContent:
642
- '<template>\n <ContextMenuRadioItem 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 text-primary">\n <UIContextMenuItemIndicator>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n <Icon v-else name="ph:circle-fill" class="h-2 w-2" />\n </UIContextMenuItemIndicator>\n </span>\n <slot>{{ title }}</slot>\n </ContextMenuRadioItem>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuRadioItem, useForwardPropsEmits } from "radix-vue";\n import type { ContextMenuRadioItemEmits, ContextMenuRadioItemProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuRadioItemProps & {\n class?: any;\n icon?: string;\n title?: string;\n }\n >();\n\n const emits = defineEmits<ContextMenuRadioItemEmits>();\n const forwarded = useForwardPropsEmits(useOmit(props, ["icon", "title", "class"]), emits);\n\n const styles = tv({\n base: "relative flex cursor-default 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]:cursor-not-allowed data-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n });\n</script>\n',
642
+ '<template>\n <ContextMenuRadioItem 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 text-primary">\n <UIContextMenuItemIndicator>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n <Icon v-else name="ph:circle-fill" class="h-2 w-2" />\n </UIContextMenuItemIndicator>\n </span>\n <slot>{{ title }}</slot>\n </ContextMenuRadioItem>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuRadioItem, useForwardPropsEmits } from "radix-vue";\n import type { ContextMenuRadioItemEmits, ContextMenuRadioItemProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuRadioItemProps & {\n class?: any;\n icon?: string;\n title?: string;\n }\n >();\n\n const emits = defineEmits<ContextMenuRadioItemEmits>();\n const forwarded = useForwardPropsEmits(props, emits);\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',
643
643
  },
644
644
  {
645
645
  fileName: "ContextMenu/Separator.vue",
646
646
  dirPath: "components/UI",
647
647
  fileContent:
648
- '<template>\n <ContextMenuSeparator :class="styles({ class: props.class })" v-bind="forwarded" />\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuSeparator, useForwardProps } from "radix-vue";\n import type { ContextMenuSeparatorProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuSeparatorProps & {\n class?: any;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["class"]));\n\n const styles = tv({\n base: "-mx-1 my-1 h-px bg-border",\n });\n</script>\n',
648
+ '<template>\n <ContextMenuSeparator :class="styles({ class: props.class })" v-bind="props" />\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuSeparator } from "radix-vue";\n import type { ContextMenuSeparatorProps } from "radix-vue";\n\n const props = defineProps<\n ContextMenuSeparatorProps & {\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "-mx-1 my-1 h-px bg-border",\n });\n</script>\n',
649
649
  },
650
650
  {
651
651
  fileName: "ContextMenu/Shortcut.vue",
652
652
  dirPath: "components/UI",
653
653
  fileContent:
654
- '<template>\n <Primitive :as="as || \'span\'" :as-child="asChild" :class="styles({ class: 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/dist/Primitive/Primitive";\n\n const props = defineProps<\n PrimitiveProps & {\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "ml-auto text-xs tracking-widest text-muted-foreground",\n });\n</script>\n',
654
+ '<template>\n <Primitive :as="as || \'span\'" :as-child="asChild" :class="styles({ class: 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 = defineProps<\n PrimitiveProps & {\n class?: any;\n }\n >();\n\n const styles = tv({\n base: "ml-auto text-xs tracking-widest text-muted-foreground",\n });\n</script>\n',
655
655
  },
656
656
  {
657
657
  fileName: "ContextMenu/Sub.vue",
@@ -663,7 +663,7 @@ export default [
663
663
  fileName: "ContextMenu/SubContent.vue",
664
664
  dirPath: "components/UI",
665
665
  fileContent:
666
- '<template>\n <UIContextMenuPortal>\n <ContextMenuSubContent\n v-bind="{ ...forwarded, ...$attrs }"\n :class="styles({ class: props.class })"\n >\n <slot></slot>\n </ContextMenuSubContent>\n </UIContextMenuPortal>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuSubContent, useForwardPropsEmits } from "radix-vue";\n import type { ContextMenuSubContentEmits, ContextMenuSubContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = withDefaults(\n defineProps<\n ContextMenuSubContentProps & {\n class?: any;\n }\n >(),\n {\n loop: true,\n avoidCollisions: true,\n collisionPadding: 8,\n sticky: "partial",\n }\n );\n\n const emits = defineEmits<ContextMenuSubContentEmits>();\n\n const styles = tv({\n base: "z-50 min-w-[100px] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in fade-in-80 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\n const forwarded = useForwardPropsEmits(useOmit(props, ["class"]), emits);\n</script>\n',
666
+ '<template>\n <UIContextMenuPortal>\n <ContextMenuSubContent\n v-bind="{ ...forwarded, ...$attrs }"\n :class="styles({ class: props.class })"\n >\n <slot></slot>\n </ContextMenuSubContent>\n </UIContextMenuPortal>\n</template>\n\n<script lang="ts" setup>\n import { ContextMenuSubContent, useForwardPropsEmits } from "radix-vue";\n import type { ContextMenuSubContentEmits, ContextMenuSubContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = withDefaults(\n defineProps<\n ContextMenuSubContentProps & {\n class?: any;\n }\n >(),\n {\n loop: true,\n avoidCollisions: true,\n collisionPadding: 8,\n sticky: "partial",\n }\n );\n\n const emits = defineEmits<ContextMenuSubContentEmits>();\n\n const styles = tv({\n base: "z-50 min-w-[100px] overflow-hidden rounded-md border bg-popover p-1 text-popover-foreground shadow-md animate-in fade-in-80 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\n const forwarded = useForwardPropsEmits(props, emits);\n</script>\n',
667
667
  },
668
668
  {
669
669
  fileName: "ContextMenu/SubTrigger.vue",
@@ -708,7 +708,7 @@ export default [
708
708
  fileName: "Datatable.client.vue",
709
709
  dirPath: "components/UI",
710
710
  fileContent:
711
- "<template>\r\n <DataTable ref=\"table\" :data=\"data\" :class=\"props.class\" :options=\"options\">\r\n <slot></slot>\r\n </DataTable>\r\n</template>\r\n\r\n<script lang=\"ts\" setup generic=\"T\">\r\n import type DataTableRef from \"datatables.net\";\r\n import type { Config } from \"datatables.net/types/types\";\r\n\r\n const table = shallowRef<{ dt: InstanceType<typeof DataTableRef<T[]>> } | null>(null);\r\n\r\n const props = withDefaults(\r\n defineProps<{\r\n data?: Config[\"data\"];\r\n class?: any;\r\n options?: Config;\r\n }>(),\r\n {\r\n data: () => [],\r\n class: \"nowrap hover order-column row-border stripe display\",\r\n options: () => ({}),\r\n }\r\n );\r\n\r\n const emits = defineEmits<{\r\n ready: [any];\r\n }>();\r\n\r\n onMounted(() => {\r\n nextTick(() => {\r\n emits(\"ready\", table.value?.dt);\r\n });\r\n });\r\n</script>\r\n\r\n<style>\r\n :root {\r\n --dt-row-selected: 262.1, 83.3%, 57.8%;\r\n --dt-row-selected-text: 210, 20%, 98%;\r\n --dt-row-selected-link: 262.1, 83.3%, 57.8%;\r\n --dt-row-stripe: 0, 0%, 100%;\r\n --dt-row-hover: 0, 0%, 100%;\r\n --dt-column-ordering: 0, 0%, 100%;\r\n --dt-border: 220, 13%, 91%;\r\n --dt-foreground: 224, 71.4%, 4.1%;\r\n }\r\n\r\n .dark {\r\n --dt-row-selected: 263.4, 70%, 50.4%;\r\n --dt-row-selected-text: 210, 20%, 98%;\r\n --dt-row-selected-link: 263.4, 70%, 50.4%;\r\n --dt-row-stripe: 224, 71.4%, 4.1%;\r\n --dt-row-hover: 224, 71.4%, 4.1%;\r\n --dt-column-ordering: 224, 71.4%, 4.1%;\r\n --dt-border: 215, 27.9%, 16.9%;\r\n --dt-foreground: 224, 71.4%, 4.1%;\r\n }\r\n\r\n table.dataTable td.dt-control {\r\n text-align: center;\r\n cursor: pointer;\r\n }\r\n table.dataTable td.dt-control:before {\r\n display: inline-block;\r\n color: hsla(var(--dt-foreground), 0.5);\r\n content: \"►\";\r\n }\r\n table.dataTable tr.dt-hasChild td.dt-control:before {\r\n content: \"▼\";\r\n }\r\n\r\n table.dataTable thead > tr > th.sorting,\r\n table.dataTable thead > tr > th.sorting_asc,\r\n table.dataTable thead > tr > th.sorting_desc,\r\n table.dataTable thead > tr > th.sorting_asc_disabled,\r\n table.dataTable thead > tr > th.sorting_desc_disabled,\r\n table.dataTable thead > tr > td.sorting,\r\n table.dataTable thead > tr > td.sorting_asc,\r\n table.dataTable thead > tr > td.sorting_desc,\r\n table.dataTable thead > tr > td.sorting_asc_disabled,\r\n table.dataTable thead > tr > td.sorting_desc_disabled {\r\n @apply relative cursor-pointer pr-7;\r\n }\r\n table.dataTable thead > tr > th.sorting:before,\r\n table.dataTable thead > tr > th.sorting:after,\r\n table.dataTable thead > tr > th.sorting_asc:before,\r\n table.dataTable thead > tr > th.sorting_asc:after,\r\n table.dataTable thead > tr > th.sorting_desc:before,\r\n table.dataTable thead > tr > th.sorting_desc:after,\r\n table.dataTable thead > tr > th.sorting_asc_disabled:before,\r\n table.dataTable thead > tr > th.sorting_asc_disabled:after,\r\n table.dataTable thead > tr > th.sorting_desc_disabled:before,\r\n table.dataTable thead > tr > th.sorting_desc_disabled:after,\r\n table.dataTable thead > tr > td.sorting:before,\r\n table.dataTable thead > tr > td.sorting:after,\r\n table.dataTable thead > tr > td.sorting_asc:before,\r\n table.dataTable thead > tr > td.sorting_asc:after,\r\n table.dataTable thead > tr > td.sorting_desc:before,\r\n table.dataTable thead > tr > td.sorting_desc:after,\r\n table.dataTable thead > tr > td.sorting_asc_disabled:before,\r\n table.dataTable thead > tr > td.sorting_asc_disabled:after,\r\n table.dataTable thead > tr > td.sorting_desc_disabled:before,\r\n table.dataTable thead > tr > td.sorting_desc_disabled:after {\r\n @apply absolute right-2.5 block text-xs leading-3 opacity-25;\r\n }\r\n table.dataTable thead > tr > th.sorting:before,\r\n table.dataTable thead > tr > th.sorting_asc:before,\r\n table.dataTable thead > tr > th.sorting_desc:before,\r\n table.dataTable thead > tr > th.sorting_asc_disabled:before,\r\n table.dataTable thead > tr > th.sorting_desc_disabled:before,\r\n table.dataTable thead > tr > td.sorting:before,\r\n table.dataTable thead > tr > td.sorting_asc:before,\r\n table.dataTable thead > tr > td.sorting_desc:before,\r\n table.dataTable thead > tr > td.sorting_asc_disabled:before,\r\n table.dataTable thead > tr > td.sorting_desc_disabled:before {\r\n @apply bottom-[43%] h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-up.svg')] bg-contain bg-center bg-no-repeat content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-up.svg?color=white')];\r\n }\r\n table.dataTable thead > tr > th.sorting:after,\r\n table.dataTable thead > tr > th.sorting_asc:after,\r\n table.dataTable thead > tr > th.sorting_desc:after,\r\n table.dataTable thead > tr > th.sorting_asc_disabled:after,\r\n table.dataTable thead > tr > th.sorting_desc_disabled:after,\r\n table.dataTable thead > tr > td.sorting:after,\r\n table.dataTable thead > tr > td.sorting_asc:after,\r\n table.dataTable thead > tr > td.sorting_desc:after,\r\n table.dataTable thead > tr > td.sorting_asc_disabled:after,\r\n table.dataTable thead > tr > td.sorting_desc_disabled:after {\r\n @apply top-[43%] h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-down.svg')] bg-contain bg-center bg-no-repeat content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-down.svg?color=white')];\r\n }\r\n table.dataTable thead > tr > th.sorting_asc:before,\r\n table.dataTable thead > tr > th.sorting_desc:after,\r\n table.dataTable thead > tr > td.sorting_asc:before,\r\n table.dataTable thead > tr > td.sorting_desc:after {\r\n @apply opacity-80;\r\n }\r\n table.dataTable thead > tr > th.sorting_desc_disabled:after,\r\n table.dataTable thead > tr > th.sorting_asc_disabled:before,\r\n table.dataTable thead > tr > td.sorting_desc_disabled:after,\r\n table.dataTable thead > tr > td.sorting_asc_disabled:before {\r\n @apply hidden;\r\n }\r\n table.dataTable thead > tr > th:active,\r\n table.dataTable thead > tr > td:active {\r\n @apply outline-none;\r\n }\r\n\r\n div.dataTables_scrollBody > table.dataTable > thead > tr > th:before,\r\n div.dataTables_scrollBody > table.dataTable > thead > tr > th:after,\r\n div.dataTables_scrollBody > table.dataTable > thead > tr > td:before,\r\n div.dataTables_scrollBody > table.dataTable > thead > tr > td:after {\r\n @apply hidden;\r\n }\r\n\r\n div.dataTables_processing {\r\n @apply absolute left-[50%] top-[50%] ml-[-100px] mt-[-26px] w-[200px] p-0.5 text-center;\r\n }\r\n div.dataTables_processing > div:last-child {\r\n @apply relative mx-auto my-4 h-4 w-20;\r\n }\r\n div.dataTables_processing > div:last-child > div {\r\n @apply absolute top-0 h-3.5 w-3.5 rounded-full;\r\n background: hsl(var(--dt-row-selected));\r\n animation-timing-function: cubic-bezier(0, 1, 1, 0);\r\n }\r\n div.dataTables_processing > div:last-child > div:nth-child(1) {\r\n left: 8px;\r\n animation: datatables-loader-1 0.6s infinite;\r\n }\r\n div.dataTables_processing > div:last-child > div:nth-child(2) {\r\n left: 8px;\r\n animation: datatables-loader-2 0.6s infinite;\r\n }\r\n div.dataTables_processing > div:last-child > div:nth-child(3) {\r\n left: 32px;\r\n animation: datatables-loader-2 0.6s infinite;\r\n }\r\n div.dataTables_processing > div:last-child > div:nth-child(4) {\r\n left: 56px;\r\n animation: datatables-loader-3 0.6s infinite;\r\n }\r\n\r\n @keyframes datatables-loader-1 {\r\n 0% {\r\n transform: scale(0);\r\n }\r\n 100% {\r\n transform: scale(1);\r\n }\r\n }\r\n @keyframes datatables-loader-3 {\r\n 0% {\r\n transform: scale(1);\r\n }\r\n 100% {\r\n transform: scale(0);\r\n }\r\n }\r\n @keyframes datatables-loader-2 {\r\n 0% {\r\n transform: translate(0, 0);\r\n }\r\n 100% {\r\n transform: translate(24px, 0);\r\n }\r\n }\r\n table.dataTable.nowrap th,\r\n table.dataTable.nowrap td {\r\n white-space: nowrap;\r\n }\r\n table.dataTable th.dt-left,\r\n table.dataTable td.dt-left {\r\n text-align: left;\r\n }\r\n table.dataTable th.dt-center,\r\n table.dataTable td.dt-center,\r\n table.dataTable td.dataTables_empty {\r\n text-align: center;\r\n }\r\n table.dataTable th.dt-right,\r\n table.dataTable td.dt-right {\r\n text-align: right;\r\n }\r\n table.dataTable th.dt-justify,\r\n table.dataTable td.dt-justify {\r\n text-align: justify;\r\n }\r\n table.dataTable th.dt-nowrap,\r\n table.dataTable td.dt-nowrap {\r\n white-space: nowrap;\r\n }\r\n table.dataTable thead th,\r\n table.dataTable thead td,\r\n table.dataTable tfoot th,\r\n table.dataTable tfoot td {\r\n text-align: left;\r\n }\r\n table.dataTable thead th.dt-head-left,\r\n table.dataTable thead td.dt-head-left,\r\n table.dataTable tfoot th.dt-head-left,\r\n table.dataTable tfoot td.dt-head-left {\r\n text-align: left;\r\n }\r\n table.dataTable thead th.dt-head-center,\r\n table.dataTable thead td.dt-head-center,\r\n table.dataTable tfoot th.dt-head-center,\r\n table.dataTable tfoot td.dt-head-center {\r\n text-align: center;\r\n }\r\n table.dataTable thead th.dt-head-right,\r\n table.dataTable thead td.dt-head-right,\r\n table.dataTable tfoot th.dt-head-right,\r\n table.dataTable tfoot td.dt-head-right {\r\n text-align: right;\r\n }\r\n table.dataTable thead th.dt-head-justify,\r\n table.dataTable thead td.dt-head-justify,\r\n table.dataTable tfoot th.dt-head-justify,\r\n table.dataTable tfoot td.dt-head-justify {\r\n text-align: justify;\r\n }\r\n table.dataTable thead th.dt-head-nowrap,\r\n table.dataTable thead td.dt-head-nowrap,\r\n table.dataTable tfoot th.dt-head-nowrap,\r\n table.dataTable tfoot td.dt-head-nowrap {\r\n white-space: nowrap;\r\n }\r\n table.dataTable tbody th.dt-body-left,\r\n table.dataTable tbody td.dt-body-left {\r\n text-align: left;\r\n }\r\n table.dataTable tbody th.dt-body-center,\r\n table.dataTable tbody td.dt-body-center {\r\n text-align: center;\r\n }\r\n table.dataTable tbody th.dt-body-right,\r\n table.dataTable tbody td.dt-body-right {\r\n text-align: right;\r\n }\r\n table.dataTable tbody th.dt-body-justify,\r\n table.dataTable tbody td.dt-body-justify {\r\n text-align: justify;\r\n }\r\n table.dataTable tbody th.dt-body-nowrap,\r\n table.dataTable tbody td.dt-body-nowrap {\r\n white-space: nowrap;\r\n }\r\n\r\n /* Table Styles */\r\n\r\n table.dataTable {\r\n @apply w-full table-auto border-collapse;\r\n }\r\n\r\n /* Table header styles */\r\n table.dataTable thead th,\r\n table.dataTable tfoot th {\r\n @apply text-left text-xs font-normal text-muted-foreground;\r\n }\r\n\r\n table.dataTable > thead > tr > th {\r\n @apply border-b border-t-0 px-6 py-3;\r\n }\r\n table.dataTable > thead > tr > td {\r\n @apply border-b px-6 py-3 text-sm;\r\n }\r\n table.dataTable > thead > tr > th:active,\r\n table.dataTable > thead > tr > td:active {\r\n @apply outline-none;\r\n }\r\n table.dataTable > tfoot > tr > th,\r\n table.dataTable > tfoot > tr > td {\r\n @apply border-t px-6 py-3;\r\n }\r\n table.dataTable tbody tr {\r\n @apply bg-transparent;\r\n }\r\n table.dataTable tbody tr.selected > * {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable tbody tr.selected a {\r\n @apply text-primary;\r\n }\r\n table.dataTable tbody th,\r\n table.dataTable tbody td {\r\n @apply px-6 py-3 text-sm;\r\n }\r\n table.dataTable.row-border > tbody > tr > th,\r\n table.dataTable.row-border > tbody > tr > td,\r\n table.dataTable.display > tbody > tr > th,\r\n table.dataTable.display > tbody > tr > td {\r\n @apply border-t;\r\n }\r\n table.dataTable.row-border > tbody > tr:first-child > th,\r\n table.dataTable.row-border > tbody > tr:first-child > td,\r\n table.dataTable.display > tbody > tr:first-child > th,\r\n table.dataTable.display > tbody > tr:first-child > td {\r\n @apply border-t-0;\r\n }\r\n table.dataTable.row-border > tbody > tr.selected + tr.selected > td,\r\n table.dataTable.display > tbody > tr.selected + tr.selected > td {\r\n @apply border-t-primary/30;\r\n }\r\n table.dataTable.cell-border > tbody > tr > th,\r\n table.dataTable.cell-border > tbody > tr > td {\r\n @apply border-r border-t;\r\n }\r\n table.dataTable.cell-border > tbody > tr > th:first-child,\r\n table.dataTable.cell-border > tbody > tr > td:first-child {\r\n @apply border-l;\r\n }\r\n table.dataTable.cell-border > tbody > tr:first-child > th,\r\n table.dataTable.cell-border > tbody > tr:first-child > td {\r\n @apply border-t-0;\r\n }\r\n table.dataTable.stripe > tbody > tr.odd > *,\r\n table.dataTable.display > tbody > tr.odd > * {\r\n @apply bg-muted/50;\r\n }\r\n table.dataTable.stripe > tbody > tr.odd.selected > *,\r\n table.dataTable.display > tbody > tr.odd.selected > * {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.hover > tbody > tr:hover > *,\r\n table.dataTable.display > tbody > tr:hover > * {\r\n @apply bg-muted;\r\n }\r\n table.dataTable.hover > tbody > tr.selected:hover > *,\r\n table.dataTable.display > tbody > tr.selected:hover > * {\r\n @apply !bg-primary/10;\r\n }\r\n table.dataTable.order-column > tbody tr > .sorting_1,\r\n table.dataTable.order-column > tbody tr > .sorting_2,\r\n table.dataTable.order-column > tbody tr > .sorting_3,\r\n table.dataTable.display > tbody tr > .sorting_1,\r\n table.dataTable.display > tbody tr > .sorting_2,\r\n table.dataTable.display > tbody tr > .sorting_3 {\r\n @apply bg-muted;\r\n }\r\n table.dataTable.order-column > tbody tr.selected > .sorting_1,\r\n table.dataTable.order-column > tbody tr.selected > .sorting_2,\r\n table.dataTable.order-column > tbody tr.selected > .sorting_3,\r\n table.dataTable.display > tbody tr.selected > .sorting_1,\r\n table.dataTable.display > tbody tr.selected > .sorting_2,\r\n table.dataTable.display > tbody tr.selected > .sorting_3 {\r\n @apply !bg-primary/10;\r\n }\r\n table.dataTable.display > tbody > tr.odd > .sorting_1,\r\n table.dataTable.order-column.stripe > tbody > tr.odd > .sorting_1 {\r\n @apply bg-muted/50;\r\n }\r\n table.dataTable.display > tbody > tr.odd > .sorting_2,\r\n table.dataTable.order-column.stripe > tbody > tr.odd > .sorting_2 {\r\n @apply bg-muted/30;\r\n }\r\n table.dataTable.display > tbody > tr.odd > .sorting_3,\r\n table.dataTable.order-column.stripe > tbody > tr.odd > .sorting_3 {\r\n @apply bg-muted/10;\r\n }\r\n table.dataTable.display > tbody > tr.odd.selected > .sorting_1,\r\n table.dataTable.order-column.stripe > tbody > tr.odd.selected > .sorting_1 {\r\n @apply bg-muted/50;\r\n }\r\n table.dataTable.display > tbody > tr.odd.selected > .sorting_2,\r\n table.dataTable.order-column.stripe > tbody > tr.odd.selected > .sorting_2 {\r\n @apply bg-muted/30;\r\n }\r\n table.dataTable.display > tbody > tr.odd.selected > .sorting_3,\r\n table.dataTable.order-column.stripe > tbody > tr.odd.selected > .sorting_3 {\r\n @apply bg-muted/10;\r\n }\r\n table.dataTable.display > tbody > tr.even > .sorting_1,\r\n table.dataTable.order-column.stripe > tbody > tr.even > .sorting_1 {\r\n @apply bg-muted/50;\r\n }\r\n table.dataTable.display > tbody > tr.even > .sorting_2,\r\n table.dataTable.order-column.stripe > tbody > tr.even > .sorting_2 {\r\n @apply bg-muted/30;\r\n }\r\n table.dataTable.display > tbody > tr.even > .sorting_3,\r\n table.dataTable.order-column.stripe > tbody > tr.even > .sorting_3 {\r\n @apply bg-muted/10;\r\n }\r\n table.dataTable.display > tbody > tr.even.selected > .sorting_1,\r\n table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_1 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.display > tbody > tr.even.selected > .sorting_2,\r\n table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_2 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.display > tbody > tr.even.selected > .sorting_3,\r\n table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_3 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.display tbody tr:hover > .sorting_1,\r\n table.dataTable.order-column.hover tbody tr:hover > .sorting_1 {\r\n @apply bg-muted;\r\n }\r\n table.dataTable.display tbody tr:hover > .sorting_2,\r\n table.dataTable.order-column.hover tbody tr:hover > .sorting_2 {\r\n @apply bg-muted;\r\n }\r\n table.dataTable.display tbody tr:hover > .sorting_3,\r\n table.dataTable.order-column.hover tbody tr:hover > .sorting_3 {\r\n @apply bg-muted;\r\n }\r\n table.dataTable.display tbody tr:hover.selected > .sorting_1,\r\n table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.display tbody tr:hover.selected > .sorting_2,\r\n table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.display tbody tr:hover.selected > .sorting_3,\r\n table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.no-footer {\r\n @apply border-b;\r\n }\r\n table.dataTable.compact thead th,\r\n table.dataTable.compact thead td,\r\n table.dataTable.compact tfoot th,\r\n table.dataTable.compact tfoot td,\r\n table.dataTable.compact tbody th,\r\n table.dataTable.compact tbody td {\r\n @apply px-4 py-2;\r\n }\r\n\r\n table.dataTable th,\r\n table.dataTable td {\r\n @apply box-content border-y;\r\n }\r\n\r\n /* Control feature layout */\r\n .dataTables_wrapper {\r\n @apply w-full overflow-x-auto;\r\n }\r\n\r\n /* Export button styles */\r\n .dataTables_wrapper .dt-buttons {\r\n @apply inline-flex items-center gap-2;\r\n button {\r\n @apply inline-flex h-8 items-center gap-2 rounded-md border bg-background px-2 text-sm text-muted-foreground hover:bg-muted focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background;\r\n }\r\n }\r\n\r\n /* Copy modal */\r\n .dt-button-info {\r\n @apply fixed inset-0 z-50 flex flex-col items-center justify-center bg-background/50 backdrop-blur;\r\n }\r\n\r\n .dataTables_wrapper .dataTables_length {\r\n label {\r\n @apply inline-flex items-center gap-2 text-sm font-normal text-muted-foreground;\r\n select {\r\n @apply h-8 w-[70px] cursor-pointer rounded-md border border-border bg-background px-2 py-1 transition focus:border-primary focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background sm:text-sm;\r\n }\r\n }\r\n }\r\n .dataTables_wrapper .dataTables_filter {\r\n label {\r\n @apply inline-flex w-full cursor-pointer items-center gap-2 text-sm font-normal text-muted-foreground;\r\n input {\r\n @apply h-8 w-full rounded-md border border-border bg-background px-2 py-1 transition focus:border-primary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-background sm:text-sm;\r\n }\r\n }\r\n }\r\n .dataTables_wrapper .dataTables_info {\r\n @apply flex items-center gap-3 text-sm !text-muted-foreground;\r\n }\r\n .dataTables_wrapper .dataTables_paginate {\r\n .paginate_button {\r\n @apply ml-1 box-border inline-flex h-8 min-w-[32px] cursor-pointer items-center justify-center rounded bg-transparent px-3 py-2 text-center text-sm;\r\n }\r\n }\r\n .dataTables_wrapper .dataTables_paginate .paginate_button.current,\r\n .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {\r\n @apply bg-muted;\r\n }\r\n .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,\r\n .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,\r\n .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {\r\n @apply pointer-events-none opacity-50;\r\n }\r\n .dataTables_wrapper .dataTables_paginate .paginate_button:hover {\r\n @apply bg-muted;\r\n }\r\n .dataTables_wrapper .dataTables_paginate .paginate_button:active {\r\n @apply bg-muted;\r\n }\r\n .dataTables_wrapper .dataTables_paginate .ellipsis {\r\n @apply inline-flex h-8 min-w-[32px] items-start justify-center text-sm;\r\n }\r\n .dataTables_wrapper .dataTables_scroll {\r\n clear: both;\r\n }\r\n .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {\r\n -webkit-overflow-scrolling: touch;\r\n }\r\n .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th,\r\n .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td,\r\n .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th,\r\n .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td {\r\n vertical-align: middle;\r\n }\r\n .dataTables_wrapper\r\n .dataTables_scroll\r\n div.dataTables_scrollBody\r\n > table\r\n > thead\r\n > tr\r\n > th\r\n > div.dataTables_sizing,\r\n .dataTables_wrapper\r\n .dataTables_scroll\r\n div.dataTables_scrollBody\r\n > table\r\n > thead\r\n > tr\r\n > td\r\n > div.dataTables_sizing,\r\n .dataTables_wrapper\r\n .dataTables_scroll\r\n div.dataTables_scrollBody\r\n > table\r\n > tbody\r\n > tr\r\n > th\r\n > div.dataTables_sizing,\r\n .dataTables_wrapper\r\n .dataTables_scroll\r\n div.dataTables_scrollBody\r\n > table\r\n > tbody\r\n > tr\r\n > td\r\n > div.dataTables_sizing {\r\n height: 0;\r\n overflow: hidden;\r\n margin: 0 !important;\r\n padding: 0 !important;\r\n }\r\n .dataTables_wrapper.no-footer .dataTables_scrollBody {\r\n @apply border-b;\r\n }\r\n .dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable,\r\n .dataTables_wrapper.no-footer div.dataTables_scrollBody > table {\r\n border-bottom: none;\r\n }\r\n .dataTables_wrapper:after {\r\n visibility: hidden;\r\n display: block;\r\n content: \"\";\r\n clear: both;\r\n height: 0;\r\n }\r\n\r\n /* \r\n responsive styles\r\n */\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.child,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > th.child,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.dataTables_empty {\r\n cursor: default !important;\r\n }\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.child:before,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > th.child:before,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.dataTables_empty:before {\r\n display: none !important;\r\n }\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control {\r\n cursor: pointer;\r\n }\r\n\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before {\r\n @apply mr-2 inline-flex h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-right.svg')] bg-contain bg-center bg-no-repeat pb-[3px] content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-right.svg?color=white')];\r\n }\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control.arrow-right::before,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control.arrow-right::before {\r\n content: \"◄\";\r\n }\r\n table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td.dtr-control:before,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th.dtr-control:before {\r\n @apply mr-2 inline-block h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-down.svg')] bg-contain bg-center bg-no-repeat content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-down.svg?color=white')];\r\n }\r\n table.dataTable.dtr-inline.collapsed.compact > tbody > tr > td.dtr-control,\r\n table.dataTable.dtr-inline.collapsed.compact > tbody > tr > th.dtr-control {\r\n padding-left: 0.333em;\r\n }\r\n table.dataTable.dtr-column > tbody > tr > td.dtr-control,\r\n table.dataTable.dtr-column > tbody > tr > th.dtr-control,\r\n table.dataTable.dtr-column > tbody > tr > td.control,\r\n table.dataTable.dtr-column > tbody > tr > th.control {\r\n cursor: pointer;\r\n }\r\n table.dataTable.dtr-column > tbody > tr > td.dtr-control:before,\r\n table.dataTable.dtr-column > tbody > tr > th.dtr-control:before,\r\n table.dataTable.dtr-column > tbody > tr > td.control:before,\r\n table.dataTable.dtr-column > tbody > tr > th.control:before {\r\n @apply mr-2 inline-flex h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-right.svg')] bg-contain bg-center bg-no-repeat pb-[3px] content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-right.svg?color=white')];\r\n }\r\n table.dataTable.dtr-column > tbody > tr > td.dtr-control.arrow-right::before,\r\n table.dataTable.dtr-column > tbody > tr > th.dtr-control.arrow-right::before,\r\n table.dataTable.dtr-column > tbody > tr > td.control.arrow-right::before,\r\n table.dataTable.dtr-column > tbody > tr > th.control.arrow-right::before {\r\n content: \"◄\";\r\n }\r\n table.dataTable.dtr-column > tbody > tr.parent td.dtr-control:before,\r\n table.dataTable.dtr-column > tbody > tr.parent th.dtr-control:before,\r\n table.dataTable.dtr-column > tbody > tr.parent td.control:before,\r\n table.dataTable.dtr-column > tbody > tr.parent th.control:before {\r\n @apply mr-2 inline-block h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-down.svg')] bg-contain bg-center bg-no-repeat content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-down.svg?color=white')];\r\n }\r\n\r\n table.dataTable > tbody td.child {\r\n @apply p-0;\r\n }\r\n table.dataTable > tbody > tr.child:hover,\r\n table.dataTable > tbody > tr.child:hover > td.child {\r\n background: transparent !important;\r\n }\r\n table.dataTable > tbody > tr.child ul.dtr-details {\r\n @apply m-0 block w-full list-none p-0;\r\n }\r\n table.dataTable > tbody > tr.child ul.dtr-details > li {\r\n @apply border-b p-3 px-7 hover:bg-muted;\r\n }\r\n\r\n table.dataTable > tbody > tr.child ul.dtr-details > li:last-child {\r\n @apply border-b-0;\r\n }\r\n table.dataTable > tbody > tr.child span.dtr-title {\r\n @apply inline-block min-w-[80px] font-bold;\r\n }\r\n div.dtr-modal {\r\n position: fixed;\r\n box-sizing: border-box;\r\n top: 0;\r\n left: 0;\r\n height: 100%;\r\n width: 100%;\r\n z-index: 100;\r\n padding: 10em 1em;\r\n }\r\n div.dtr-modal div.dtr-modal-display {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n bottom: 0;\r\n right: 0;\r\n width: 50%;\r\n height: fit-content;\r\n max-height: 75%;\r\n overflow: auto;\r\n margin: auto;\r\n z-index: 102;\r\n overflow: auto;\r\n background-color: #f5f5f7;\r\n border: 1px solid black;\r\n border-radius: 0.5em;\r\n box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6);\r\n }\r\n div.dtr-modal div.dtr-modal-content {\r\n position: relative;\r\n padding: 2.5em;\r\n }\r\n div.dtr-modal div.dtr-modal-content h2 {\r\n margin-top: 0;\r\n }\r\n div.dtr-modal div.dtr-modal-close {\r\n position: absolute;\r\n top: 6px;\r\n right: 6px;\r\n width: 22px;\r\n height: 22px;\r\n text-align: center;\r\n border-radius: 3px;\r\n cursor: pointer;\r\n z-index: 12;\r\n }\r\n div.dtr-modal div.dtr-modal-background {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 101;\r\n background: rgba(0, 0, 0, 0.6);\r\n }\r\n\r\n /* Search Builder Styles */\r\n div.dt-button-collection {\r\n overflow: visible !important;\r\n z-index: 2002 !important;\r\n }\r\n div.dt-button-collection div.dtsb-searchBuilder {\r\n padding-left: 1em !important;\r\n padding-right: 1em !important;\r\n }\r\n div.dt-button-collection.dtb-collection-closeable div.dtsb-titleRow {\r\n padding-right: 40px;\r\n }\r\n .dtsb-greyscale {\r\n @apply !border;\r\n }\r\n div.dtsb-logicContainer .dtsb-greyscale {\r\n border: none !important;\r\n }\r\n div.dtsb-searchBuilder {\r\n @apply mb-4 cursor-default justify-evenly text-left;\r\n }\r\n div.dtsb-searchBuilder button.dtsb-button,\r\n div.dtsb-searchBuilder select {\r\n @apply text-sm;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-titleRow {\r\n @apply mb-3 flex items-center justify-between;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-titleRow div.dtsb-title {\r\n @apply inline-block text-sm font-normal;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-titleRow div.dtsb-title:empty {\r\n display: inline;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-vertical .dtsb-value,\r\n div.dtsb-searchBuilder div.dtsb-vertical .dtsb-data,\r\n div.dtsb-searchBuilder div.dtsb-vertical .dtsb-condition {\r\n display: block;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group {\r\n @apply relative clear-both mb-4;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group button.dtsb-search {\r\n float: right;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group button.dtsb-clearGroup {\r\n margin: 2px;\r\n text-align: center;\r\n padding: 0;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-logicContainer {\r\n -webkit-transform: rotate(90deg);\r\n -moz-transform: rotate(90deg);\r\n -o-transform: rotate(90deg);\r\n -ms-transform: rotate(90deg);\r\n transform: rotate(90deg);\r\n position: absolute;\r\n margin-top: 0.8em;\r\n margin-right: 0.8em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria {\r\n margin-bottom: 0.8em;\r\n display: flex;\r\n justify-content: flex-start;\r\n flex-flow: row wrap;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-dropDown,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input {\r\n padding: 0.4em;\r\n margin-right: 0.8em;\r\n min-width: 5em;\r\n max-width: 20em;\r\n color: inherit;\r\n }\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n select.dtsb-dropDown\r\n option.dtsb-notItalic,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input option.dtsb-notItalic {\r\n font-style: normal;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-italic {\r\n font-style: italic;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont {\r\n flex: 1;\r\n white-space: nowrap;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont span.dtsp-joiner {\r\n margin-right: 0.8em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont input.dtsb-value {\r\n width: 33%;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont select,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont input {\r\n height: 100%;\r\n box-sizing: border-box;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-buttonContainer {\r\n margin-left: auto;\r\n display: inline-block;\r\n }\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-delete,\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-right,\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-left {\r\n margin-right: 0.8em;\r\n }\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-delete:last-child,\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-right:last-child,\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-left:last-child {\r\n margin-right: 0;\r\n }\r\n @media screen and (max-width: 550px) {\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria {\r\n display: flex;\r\n flex-flow: none;\r\n flex-direction: column;\r\n justify-content: flex-start;\r\n padding-right: calc(35px + 0.8em);\r\n margin-bottom: 0px;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:not(:first-child),\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:not(:nth-child(2)),\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:not(:last-child) {\r\n padding-top: 0.8em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:first-child,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:nth-child(2),\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:last-child {\r\n padding-top: 0em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-dropDown,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input {\r\n max-width: none;\r\n width: 100%;\r\n margin-bottom: 0.8em;\r\n margin-right: 0.8em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont {\r\n margin-right: 0.8em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-buttonContainer {\r\n position: absolute;\r\n width: 35px;\r\n display: flex;\r\n flex-wrap: wrap-reverse;\r\n right: 0;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-buttonContainer button {\r\n margin-right: 0px !important;\r\n }\r\n }\r\n div.dtsb-searchBuilder button,\r\n div.dtsb-searchBuilder select.dtsb-dropDown,\r\n div.dtsb-searchBuilder input {\r\n @apply bg-background;\r\n }\r\n div.dtsb-searchBuilder button.dtsb-button {\r\n @apply relative box-border inline-flex cursor-pointer select-none items-center justify-center overflow-hidden text-ellipsis whitespace-nowrap rounded-md border bg-background px-3 py-2 text-xs focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background;\r\n }\r\n div.dtsb-searchBuilder button.dtsb-button:hover {\r\n @apply cursor-pointer bg-muted;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-logicContainer {\r\n @apply overflow-hidden rounded-none border;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-logicContainer button {\r\n @apply rounded-md border-transparent bg-transparent;\r\n }\r\n div.dtsb-searchBuilder button.dtsb-clearGroup {\r\n min-width: 2em;\r\n padding: 0;\r\n }\r\n div.dtsb-searchBuilder button.dtsb-iptbtn {\r\n min-width: 100px;\r\n text-align: left;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-logicContainer {\r\n @apply flex flex-row content-start items-start justify-start rounded-md;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-logicContainer button.dtsb-logic {\r\n @apply m-0 shrink-0 grow rounded-none border-0;\r\n flex-basis: 3em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-logicContainer button.dtsb-clearGroup {\r\n border: none;\r\n border-radius: 0px;\r\n width: 2em;\r\n margin: 0px;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-dropDown,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input {\r\n @apply rounded-md border;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-condition,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-data,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-value {\r\n @apply rounded-md border border-input bg-background text-xs transition focus:border-primary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-background;\r\n }\r\n\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-value {\r\n @apply rounded-md border border-input bg-background text-xs transition focus:border-primary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-background;\r\n }\r\n</style>\r\n",
711
+ "<template>\r\n <DataTable ref=\"table\" :data=\"data\" :class=\"props.class\" :options=\"options\">\r\n <slot></slot>\r\n </DataTable>\r\n</template>\r\n\r\n<script lang=\"ts\" setup generic=\"T\">\r\n import type DataTableRef from \"datatables.net\";\r\n import type { Config } from \"datatables.net/types/types\";\r\n\r\n const table = shallowRef<{ dt: InstanceType<typeof DataTableRef<T[]>> } | null>(null);\r\n\r\n const props = withDefaults(\r\n defineProps<{\r\n data?: Config[\"data\"];\r\n class?: any;\r\n options?: Config;\r\n }>(),\r\n {\r\n data: () => [],\r\n class: \"nowrap hover order-column row-border stripe display\",\r\n options: () => ({}),\r\n }\r\n );\r\n\r\n const emits = defineEmits<{\r\n ready: [any];\r\n }>();\r\n\r\n onMounted(() => {\r\n nextTick(() => {\r\n emits(\"ready\", table.value?.dt);\r\n });\r\n });\r\n</script>\r\n\r\n<style>\r\n :root {\r\n --dt-row-selected: 262.1, 83.3%, 57.8%;\r\n --dt-row-selected-text: 210, 20%, 98%;\r\n --dt-row-selected-link: 262.1, 83.3%, 57.8%;\r\n --dt-row-stripe: 0, 0%, 100%;\r\n --dt-row-hover: 0, 0%, 100%;\r\n --dt-column-ordering: 0, 0%, 100%;\r\n --dt-border: 220, 13%, 91%;\r\n --dt-foreground: 224, 71.4%, 4.1%;\r\n }\r\n\r\n .dark {\r\n --dt-row-selected: 263.4, 70%, 50.4%;\r\n --dt-row-selected-text: 210, 20%, 98%;\r\n --dt-row-selected-link: 263.4, 70%, 50.4%;\r\n --dt-row-stripe: 224, 71.4%, 4.1%;\r\n --dt-row-hover: 224, 71.4%, 4.1%;\r\n --dt-column-ordering: 224, 71.4%, 4.1%;\r\n --dt-border: 215, 27.9%, 16.9%;\r\n --dt-foreground: 224, 71.4%, 4.1%;\r\n }\r\n\r\n table.dataTable td.dt-control {\r\n text-align: center;\r\n cursor: pointer;\r\n }\r\n table.dataTable td.dt-control:before {\r\n display: inline-block;\r\n color: hsla(var(--dt-foreground), 0.5);\r\n content: \"►\";\r\n }\r\n table.dataTable tr.dt-hasChild td.dt-control:before {\r\n content: \"▼\";\r\n }\r\n\r\n table.dataTable thead > tr > th.sorting,\r\n table.dataTable thead > tr > th.sorting_asc,\r\n table.dataTable thead > tr > th.sorting_desc,\r\n table.dataTable thead > tr > th.sorting_asc_disabled,\r\n table.dataTable thead > tr > th.sorting_desc_disabled,\r\n table.dataTable thead > tr > td.sorting,\r\n table.dataTable thead > tr > td.sorting_asc,\r\n table.dataTable thead > tr > td.sorting_desc,\r\n table.dataTable thead > tr > td.sorting_asc_disabled,\r\n table.dataTable thead > tr > td.sorting_desc_disabled {\r\n @apply relative cursor-pointer pr-7;\r\n }\r\n table.dataTable thead > tr > th.sorting:before,\r\n table.dataTable thead > tr > th.sorting:after,\r\n table.dataTable thead > tr > th.sorting_asc:before,\r\n table.dataTable thead > tr > th.sorting_asc:after,\r\n table.dataTable thead > tr > th.sorting_desc:before,\r\n table.dataTable thead > tr > th.sorting_desc:after,\r\n table.dataTable thead > tr > th.sorting_asc_disabled:before,\r\n table.dataTable thead > tr > th.sorting_asc_disabled:after,\r\n table.dataTable thead > tr > th.sorting_desc_disabled:before,\r\n table.dataTable thead > tr > th.sorting_desc_disabled:after,\r\n table.dataTable thead > tr > td.sorting:before,\r\n table.dataTable thead > tr > td.sorting:after,\r\n table.dataTable thead > tr > td.sorting_asc:before,\r\n table.dataTable thead > tr > td.sorting_asc:after,\r\n table.dataTable thead > tr > td.sorting_desc:before,\r\n table.dataTable thead > tr > td.sorting_desc:after,\r\n table.dataTable thead > tr > td.sorting_asc_disabled:before,\r\n table.dataTable thead > tr > td.sorting_asc_disabled:after,\r\n table.dataTable thead > tr > td.sorting_desc_disabled:before,\r\n table.dataTable thead > tr > td.sorting_desc_disabled:after {\r\n @apply absolute right-2.5 block text-xs leading-3 opacity-25;\r\n }\r\n table.dataTable thead > tr > th.sorting:before,\r\n table.dataTable thead > tr > th.sorting_asc:before,\r\n table.dataTable thead > tr > th.sorting_desc:before,\r\n table.dataTable thead > tr > th.sorting_asc_disabled:before,\r\n table.dataTable thead > tr > th.sorting_desc_disabled:before,\r\n table.dataTable thead > tr > td.sorting:before,\r\n table.dataTable thead > tr > td.sorting_asc:before,\r\n table.dataTable thead > tr > td.sorting_desc:before,\r\n table.dataTable thead > tr > td.sorting_asc_disabled:before,\r\n table.dataTable thead > tr > td.sorting_desc_disabled:before {\r\n @apply bottom-[43%] h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-up.svg')] bg-contain bg-center bg-no-repeat content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-up.svg?color=white')];\r\n }\r\n table.dataTable thead > tr > th.sorting:after,\r\n table.dataTable thead > tr > th.sorting_asc:after,\r\n table.dataTable thead > tr > th.sorting_desc:after,\r\n table.dataTable thead > tr > th.sorting_asc_disabled:after,\r\n table.dataTable thead > tr > th.sorting_desc_disabled:after,\r\n table.dataTable thead > tr > td.sorting:after,\r\n table.dataTable thead > tr > td.sorting_asc:after,\r\n table.dataTable thead > tr > td.sorting_desc:after,\r\n table.dataTable thead > tr > td.sorting_asc_disabled:after,\r\n table.dataTable thead > tr > td.sorting_desc_disabled:after {\r\n @apply top-[43%] h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-down.svg')] bg-contain bg-center bg-no-repeat content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-down.svg?color=white')];\r\n }\r\n table.dataTable thead > tr > th.sorting_asc:before,\r\n table.dataTable thead > tr > th.sorting_desc:after,\r\n table.dataTable thead > tr > td.sorting_asc:before,\r\n table.dataTable thead > tr > td.sorting_desc:after {\r\n @apply opacity-80;\r\n }\r\n table.dataTable thead > tr > th.sorting_desc_disabled:after,\r\n table.dataTable thead > tr > th.sorting_asc_disabled:before,\r\n table.dataTable thead > tr > td.sorting_desc_disabled:after,\r\n table.dataTable thead > tr > td.sorting_asc_disabled:before {\r\n @apply hidden;\r\n }\r\n table.dataTable thead > tr > th:active,\r\n table.dataTable thead > tr > td:active {\r\n @apply outline-none;\r\n }\r\n\r\n div.dataTables_scrollBody > table.dataTable > thead > tr > th:before,\r\n div.dataTables_scrollBody > table.dataTable > thead > tr > th:after,\r\n div.dataTables_scrollBody > table.dataTable > thead > tr > td:before,\r\n div.dataTables_scrollBody > table.dataTable > thead > tr > td:after {\r\n @apply hidden;\r\n }\r\n\r\n div.dataTables_processing {\r\n @apply absolute left-[50%] top-[50%] ml-[-100px] mt-[-26px] w-[200px] p-0.5 text-center;\r\n }\r\n div.dataTables_processing > div:last-child {\r\n @apply relative mx-auto my-4 h-4 w-20;\r\n }\r\n div.dataTables_processing > div:last-child > div {\r\n @apply absolute top-0 h-3.5 w-3.5 rounded-full;\r\n background: hsl(var(--dt-row-selected));\r\n animation-timing-function: cubic-bezier(0, 1, 1, 0);\r\n }\r\n div.dataTables_processing > div:last-child > div:nth-child(1) {\r\n left: 8px;\r\n animation: datatables-loader-1 0.6s infinite;\r\n }\r\n div.dataTables_processing > div:last-child > div:nth-child(2) {\r\n left: 8px;\r\n animation: datatables-loader-2 0.6s infinite;\r\n }\r\n div.dataTables_processing > div:last-child > div:nth-child(3) {\r\n left: 32px;\r\n animation: datatables-loader-2 0.6s infinite;\r\n }\r\n div.dataTables_processing > div:last-child > div:nth-child(4) {\r\n left: 56px;\r\n animation: datatables-loader-3 0.6s infinite;\r\n }\r\n\r\n @keyframes datatables-loader-1 {\r\n 0% {\r\n transform: scale(0);\r\n }\r\n 100% {\r\n transform: scale(1);\r\n }\r\n }\r\n @keyframes datatables-loader-3 {\r\n 0% {\r\n transform: scale(1);\r\n }\r\n 100% {\r\n transform: scale(0);\r\n }\r\n }\r\n @keyframes datatables-loader-2 {\r\n 0% {\r\n transform: translate(0, 0);\r\n }\r\n 100% {\r\n transform: translate(24px, 0);\r\n }\r\n }\r\n table.dataTable.nowrap th,\r\n table.dataTable.nowrap td {\r\n white-space: nowrap;\r\n }\r\n table.dataTable th.dt-left,\r\n table.dataTable td.dt-left {\r\n text-align: left;\r\n }\r\n table.dataTable th.dt-center,\r\n table.dataTable td.dt-center,\r\n table.dataTable td.dataTables_empty {\r\n text-align: center;\r\n }\r\n table.dataTable th.dt-right,\r\n table.dataTable td.dt-right {\r\n text-align: right;\r\n }\r\n table.dataTable th.dt-justify,\r\n table.dataTable td.dt-justify {\r\n text-align: justify;\r\n }\r\n table.dataTable th.dt-nowrap,\r\n table.dataTable td.dt-nowrap {\r\n white-space: nowrap;\r\n }\r\n table.dataTable thead th,\r\n table.dataTable thead td,\r\n table.dataTable tfoot th,\r\n table.dataTable tfoot td {\r\n text-align: left;\r\n }\r\n table.dataTable thead th.dt-head-left,\r\n table.dataTable thead td.dt-head-left,\r\n table.dataTable tfoot th.dt-head-left,\r\n table.dataTable tfoot td.dt-head-left {\r\n text-align: left;\r\n }\r\n table.dataTable thead th.dt-head-center,\r\n table.dataTable thead td.dt-head-center,\r\n table.dataTable tfoot th.dt-head-center,\r\n table.dataTable tfoot td.dt-head-center {\r\n text-align: center;\r\n }\r\n table.dataTable thead th.dt-head-right,\r\n table.dataTable thead td.dt-head-right,\r\n table.dataTable tfoot th.dt-head-right,\r\n table.dataTable tfoot td.dt-head-right {\r\n text-align: right;\r\n }\r\n table.dataTable thead th.dt-head-justify,\r\n table.dataTable thead td.dt-head-justify,\r\n table.dataTable tfoot th.dt-head-justify,\r\n table.dataTable tfoot td.dt-head-justify {\r\n text-align: justify;\r\n }\r\n table.dataTable thead th.dt-head-nowrap,\r\n table.dataTable thead td.dt-head-nowrap,\r\n table.dataTable tfoot th.dt-head-nowrap,\r\n table.dataTable tfoot td.dt-head-nowrap {\r\n white-space: nowrap;\r\n }\r\n table.dataTable tbody th.dt-body-left,\r\n table.dataTable tbody td.dt-body-left {\r\n text-align: left;\r\n }\r\n table.dataTable tbody th.dt-body-center,\r\n table.dataTable tbody td.dt-body-center {\r\n text-align: center;\r\n }\r\n table.dataTable tbody th.dt-body-right,\r\n table.dataTable tbody td.dt-body-right {\r\n text-align: right;\r\n }\r\n table.dataTable tbody th.dt-body-justify,\r\n table.dataTable tbody td.dt-body-justify {\r\n text-align: justify;\r\n }\r\n table.dataTable tbody th.dt-body-nowrap,\r\n table.dataTable tbody td.dt-body-nowrap {\r\n white-space: nowrap;\r\n }\r\n\r\n /* Table Styles */\r\n\r\n table.dataTable {\r\n @apply w-full table-auto border-collapse;\r\n }\r\n\r\n /* Table header styles */\r\n table.dataTable thead th,\r\n table.dataTable tfoot th {\r\n @apply text-left text-xs font-normal text-muted-foreground;\r\n }\r\n\r\n table.dataTable > thead > tr > th {\r\n @apply border-b border-t-0 px-6 py-3;\r\n }\r\n table.dataTable > thead > tr > td {\r\n @apply border-b px-6 py-3 text-sm;\r\n }\r\n table.dataTable > thead > tr > th:active,\r\n table.dataTable > thead > tr > td:active {\r\n @apply outline-none;\r\n }\r\n table.dataTable > tfoot > tr > th,\r\n table.dataTable > tfoot > tr > td {\r\n @apply border-t px-6 py-3;\r\n }\r\n table.dataTable tbody tr {\r\n @apply bg-transparent;\r\n }\r\n table.dataTable tbody tr.selected > * {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable tbody tr.selected a {\r\n @apply text-primary;\r\n }\r\n table.dataTable tbody th,\r\n table.dataTable tbody td {\r\n @apply px-6 py-3 text-sm;\r\n }\r\n table.dataTable.row-border > tbody > tr > th,\r\n table.dataTable.row-border > tbody > tr > td,\r\n table.dataTable.display > tbody > tr > th,\r\n table.dataTable.display > tbody > tr > td {\r\n @apply border-t;\r\n }\r\n table.dataTable.row-border > tbody > tr:first-child > th,\r\n table.dataTable.row-border > tbody > tr:first-child > td,\r\n table.dataTable.display > tbody > tr:first-child > th,\r\n table.dataTable.display > tbody > tr:first-child > td {\r\n @apply border-t-0;\r\n }\r\n table.dataTable.row-border > tbody > tr.selected + tr.selected > td,\r\n table.dataTable.display > tbody > tr.selected + tr.selected > td {\r\n @apply border-t-primary/30;\r\n }\r\n table.dataTable.cell-border > tbody > tr > th,\r\n table.dataTable.cell-border > tbody > tr > td {\r\n @apply border-r border-t;\r\n }\r\n table.dataTable.cell-border > tbody > tr > th:first-child,\r\n table.dataTable.cell-border > tbody > tr > td:first-child {\r\n @apply border-l;\r\n }\r\n table.dataTable.cell-border > tbody > tr:first-child > th,\r\n table.dataTable.cell-border > tbody > tr:first-child > td {\r\n @apply border-t-0;\r\n }\r\n table.dataTable.stripe > tbody > tr.odd > *,\r\n table.dataTable.display > tbody > tr.odd > * {\r\n @apply bg-muted/50;\r\n }\r\n table.dataTable.stripe > tbody > tr.odd.selected > *,\r\n table.dataTable.display > tbody > tr.odd.selected > * {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.hover > tbody > tr:hover > *,\r\n table.dataTable.display > tbody > tr:hover > * {\r\n @apply bg-muted;\r\n }\r\n table.dataTable.hover > tbody > tr.selected:hover > *,\r\n table.dataTable.display > tbody > tr.selected:hover > * {\r\n @apply !bg-primary/10;\r\n }\r\n table.dataTable.order-column > tbody tr > .sorting_1,\r\n table.dataTable.order-column > tbody tr > .sorting_2,\r\n table.dataTable.order-column > tbody tr > .sorting_3,\r\n table.dataTable.display > tbody tr > .sorting_1,\r\n table.dataTable.display > tbody tr > .sorting_2,\r\n table.dataTable.display > tbody tr > .sorting_3 {\r\n @apply bg-muted;\r\n }\r\n table.dataTable.order-column > tbody tr.selected > .sorting_1,\r\n table.dataTable.order-column > tbody tr.selected > .sorting_2,\r\n table.dataTable.order-column > tbody tr.selected > .sorting_3,\r\n table.dataTable.display > tbody tr.selected > .sorting_1,\r\n table.dataTable.display > tbody tr.selected > .sorting_2,\r\n table.dataTable.display > tbody tr.selected > .sorting_3 {\r\n @apply !bg-primary/10;\r\n }\r\n table.dataTable.display > tbody > tr.odd > .sorting_1,\r\n table.dataTable.order-column.stripe > tbody > tr.odd > .sorting_1 {\r\n @apply bg-muted/50;\r\n }\r\n table.dataTable.display > tbody > tr.odd > .sorting_2,\r\n table.dataTable.order-column.stripe > tbody > tr.odd > .sorting_2 {\r\n @apply bg-muted/30;\r\n }\r\n table.dataTable.display > tbody > tr.odd > .sorting_3,\r\n table.dataTable.order-column.stripe > tbody > tr.odd > .sorting_3 {\r\n @apply bg-muted/10;\r\n }\r\n table.dataTable.display > tbody > tr.odd.selected > .sorting_1,\r\n table.dataTable.order-column.stripe > tbody > tr.odd.selected > .sorting_1 {\r\n @apply bg-muted/50;\r\n }\r\n table.dataTable.display > tbody > tr.odd.selected > .sorting_2,\r\n table.dataTable.order-column.stripe > tbody > tr.odd.selected > .sorting_2 {\r\n @apply bg-muted/30;\r\n }\r\n table.dataTable.display > tbody > tr.odd.selected > .sorting_3,\r\n table.dataTable.order-column.stripe > tbody > tr.odd.selected > .sorting_3 {\r\n @apply bg-muted/10;\r\n }\r\n table.dataTable.display > tbody > tr.even > .sorting_1,\r\n table.dataTable.order-column.stripe > tbody > tr.even > .sorting_1 {\r\n @apply bg-muted/50;\r\n }\r\n table.dataTable.display > tbody > tr.even > .sorting_2,\r\n table.dataTable.order-column.stripe > tbody > tr.even > .sorting_2 {\r\n @apply bg-muted/30;\r\n }\r\n table.dataTable.display > tbody > tr.even > .sorting_3,\r\n table.dataTable.order-column.stripe > tbody > tr.even > .sorting_3 {\r\n @apply bg-muted/10;\r\n }\r\n table.dataTable.display > tbody > tr.even.selected > .sorting_1,\r\n table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_1 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.display > tbody > tr.even.selected > .sorting_2,\r\n table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_2 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.display > tbody > tr.even.selected > .sorting_3,\r\n table.dataTable.order-column.stripe > tbody > tr.even.selected > .sorting_3 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.display tbody tr:hover > .sorting_1,\r\n table.dataTable.order-column.hover tbody tr:hover > .sorting_1 {\r\n @apply bg-muted;\r\n }\r\n table.dataTable.display tbody tr:hover > .sorting_2,\r\n table.dataTable.order-column.hover tbody tr:hover > .sorting_2 {\r\n @apply bg-muted;\r\n }\r\n table.dataTable.display tbody tr:hover > .sorting_3,\r\n table.dataTable.order-column.hover tbody tr:hover > .sorting_3 {\r\n @apply bg-muted;\r\n }\r\n table.dataTable.display tbody tr:hover.selected > .sorting_1,\r\n table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_1 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.display tbody tr:hover.selected > .sorting_2,\r\n table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_2 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.display tbody tr:hover.selected > .sorting_3,\r\n table.dataTable.order-column.hover tbody tr:hover.selected > .sorting_3 {\r\n @apply bg-primary/10;\r\n }\r\n table.dataTable.no-footer {\r\n @apply border-b-0;\r\n }\r\n table.dataTable.compact thead th,\r\n table.dataTable.compact thead td,\r\n table.dataTable.compact tfoot th,\r\n table.dataTable.compact tfoot td,\r\n table.dataTable.compact tbody th,\r\n table.dataTable.compact tbody td {\r\n @apply px-4 py-2;\r\n }\r\n\r\n table.dataTable th,\r\n table.dataTable td {\r\n @apply box-content border-y;\r\n }\r\n\r\n table.dataTable tr:last-child td {\r\n @apply !border-b-0;\r\n }\r\n\r\n /* Control feature layout */\r\n .dataTables_wrapper {\r\n @apply w-full overflow-x-auto;\r\n }\r\n\r\n /* Export button styles */\r\n .dataTables_wrapper .dt-buttons {\r\n @apply inline-flex items-center gap-2;\r\n button {\r\n @apply inline-flex h-8 items-center gap-2 rounded-md border bg-background px-2 text-sm text-muted-foreground hover:bg-muted focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background;\r\n }\r\n }\r\n\r\n /* Copy modal */\r\n .dt-button-info {\r\n @apply fixed inset-0 z-50 flex flex-col items-center justify-center bg-background/50 backdrop-blur;\r\n }\r\n\r\n .dataTables_wrapper .dataTables_length {\r\n label {\r\n @apply inline-flex items-center gap-2 text-sm font-normal text-muted-foreground;\r\n select {\r\n @apply h-8 w-[70px] cursor-pointer rounded-md border border-border bg-background px-2 py-1 transition focus:border-primary focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background sm:text-sm;\r\n }\r\n }\r\n }\r\n .dataTables_wrapper .dataTables_filter {\r\n label {\r\n @apply inline-flex w-full cursor-pointer items-center gap-2 text-sm font-normal text-muted-foreground;\r\n input {\r\n @apply h-8 w-full rounded-md border border-border bg-background px-2 py-1 transition focus:border-primary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-background sm:text-sm;\r\n }\r\n }\r\n }\r\n .dataTables_wrapper .dataTables_info {\r\n @apply flex items-center gap-3 text-sm !text-muted-foreground;\r\n }\r\n .dataTables_wrapper .dataTables_paginate {\r\n .paginate_button {\r\n @apply ml-1 box-border inline-flex h-8 min-w-[32px] cursor-pointer items-center justify-center rounded bg-transparent px-3 py-2 text-center text-sm;\r\n }\r\n }\r\n .dataTables_wrapper .dataTables_paginate .paginate_button.current,\r\n .dataTables_wrapper .dataTables_paginate .paginate_button.current:hover {\r\n @apply bg-muted;\r\n }\r\n .dataTables_wrapper .dataTables_paginate .paginate_button.disabled,\r\n .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:hover,\r\n .dataTables_wrapper .dataTables_paginate .paginate_button.disabled:active {\r\n @apply pointer-events-none opacity-50;\r\n }\r\n .dataTables_wrapper .dataTables_paginate .paginate_button:hover {\r\n @apply bg-muted;\r\n }\r\n .dataTables_wrapper .dataTables_paginate .paginate_button:active {\r\n @apply bg-muted;\r\n }\r\n .dataTables_wrapper .dataTables_paginate .ellipsis {\r\n @apply inline-flex h-8 min-w-[32px] items-start justify-center text-sm;\r\n }\r\n .dataTables_wrapper .dataTables_scroll {\r\n clear: both;\r\n }\r\n .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody {\r\n -webkit-overflow-scrolling: touch;\r\n }\r\n .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > th,\r\n .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > thead > tr > td,\r\n .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > th,\r\n .dataTables_wrapper .dataTables_scroll div.dataTables_scrollBody > table > tbody > tr > td {\r\n vertical-align: middle;\r\n }\r\n .dataTables_wrapper\r\n .dataTables_scroll\r\n div.dataTables_scrollBody\r\n > table\r\n > thead\r\n > tr\r\n > th\r\n > div.dataTables_sizing,\r\n .dataTables_wrapper\r\n .dataTables_scroll\r\n div.dataTables_scrollBody\r\n > table\r\n > thead\r\n > tr\r\n > td\r\n > div.dataTables_sizing,\r\n .dataTables_wrapper\r\n .dataTables_scroll\r\n div.dataTables_scrollBody\r\n > table\r\n > tbody\r\n > tr\r\n > th\r\n > div.dataTables_sizing,\r\n .dataTables_wrapper\r\n .dataTables_scroll\r\n div.dataTables_scrollBody\r\n > table\r\n > tbody\r\n > tr\r\n > td\r\n > div.dataTables_sizing {\r\n height: 0;\r\n overflow: hidden;\r\n margin: 0 !important;\r\n padding: 0 !important;\r\n }\r\n .dataTables_wrapper.no-footer .dataTables_scrollBody {\r\n @apply border-b;\r\n }\r\n .dataTables_wrapper.no-footer div.dataTables_scrollHead table.dataTable,\r\n .dataTables_wrapper.no-footer div.dataTables_scrollBody > table {\r\n border-bottom: none;\r\n }\r\n .dataTables_wrapper:after {\r\n visibility: hidden;\r\n display: block;\r\n content: \"\";\r\n clear: both;\r\n height: 0;\r\n }\r\n\r\n /* \r\n responsive styles\r\n */\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.child,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > th.child,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.dataTables_empty {\r\n cursor: default !important;\r\n }\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.child:before,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > th.child:before,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.dataTables_empty:before {\r\n display: none !important;\r\n }\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control {\r\n cursor: pointer;\r\n }\r\n\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control:before,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control:before {\r\n @apply mr-2 inline-flex h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-right.svg')] bg-contain bg-center bg-no-repeat pb-[3px] content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-right.svg?color=white')];\r\n }\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > td.dtr-control.arrow-right::before,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr > th.dtr-control.arrow-right::before {\r\n content: \"◄\";\r\n }\r\n table.dataTable.dtr-inline.collapsed > tbody > tr.parent > td.dtr-control:before,\r\n table.dataTable.dtr-inline.collapsed > tbody > tr.parent > th.dtr-control:before {\r\n @apply mr-2 inline-block h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-down.svg')] bg-contain bg-center bg-no-repeat content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-down.svg?color=white')];\r\n }\r\n table.dataTable.dtr-inline.collapsed.compact > tbody > tr > td.dtr-control,\r\n table.dataTable.dtr-inline.collapsed.compact > tbody > tr > th.dtr-control {\r\n padding-left: 0.333em;\r\n }\r\n table.dataTable.dtr-column > tbody > tr > td.dtr-control,\r\n table.dataTable.dtr-column > tbody > tr > th.dtr-control,\r\n table.dataTable.dtr-column > tbody > tr > td.control,\r\n table.dataTable.dtr-column > tbody > tr > th.control {\r\n cursor: pointer;\r\n }\r\n table.dataTable.dtr-column > tbody > tr > td.dtr-control:before,\r\n table.dataTable.dtr-column > tbody > tr > th.dtr-control:before,\r\n table.dataTable.dtr-column > tbody > tr > td.control:before,\r\n table.dataTable.dtr-column > tbody > tr > th.control:before {\r\n @apply mr-2 inline-flex h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-right.svg')] bg-contain bg-center bg-no-repeat pb-[3px] content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-right.svg?color=white')];\r\n }\r\n table.dataTable.dtr-column > tbody > tr > td.dtr-control.arrow-right::before,\r\n table.dataTable.dtr-column > tbody > tr > th.dtr-control.arrow-right::before,\r\n table.dataTable.dtr-column > tbody > tr > td.control.arrow-right::before,\r\n table.dataTable.dtr-column > tbody > tr > th.control.arrow-right::before {\r\n content: \"◄\";\r\n }\r\n table.dataTable.dtr-column > tbody > tr.parent td.dtr-control:before,\r\n table.dataTable.dtr-column > tbody > tr.parent th.dtr-control:before,\r\n table.dataTable.dtr-column > tbody > tr.parent td.control:before,\r\n table.dataTable.dtr-column > tbody > tr.parent th.control:before {\r\n @apply mr-2 inline-block h-4 w-4 bg-[url('https://api.iconify.design/lucide:chevron-down.svg')] bg-contain bg-center bg-no-repeat content-[''] dark:bg-[url('https://api.iconify.design/lucide:chevron-down.svg?color=white')];\r\n }\r\n\r\n table.dataTable > tbody td.child {\r\n @apply p-0;\r\n }\r\n table.dataTable > tbody > tr.child:hover,\r\n table.dataTable > tbody > tr.child:hover > td.child {\r\n background: transparent !important;\r\n }\r\n table.dataTable > tbody > tr.child ul.dtr-details {\r\n @apply m-0 block w-full list-none p-0;\r\n }\r\n table.dataTable > tbody > tr.child ul.dtr-details > li {\r\n @apply border-b p-3 px-7 hover:bg-muted;\r\n }\r\n\r\n table.dataTable > tbody > tr.child ul.dtr-details > li:last-child {\r\n @apply border-b-0;\r\n }\r\n table.dataTable > tbody > tr.child span.dtr-title {\r\n @apply inline-block min-w-[80px] font-bold;\r\n }\r\n div.dtr-modal {\r\n position: fixed;\r\n box-sizing: border-box;\r\n top: 0;\r\n left: 0;\r\n height: 100%;\r\n width: 100%;\r\n z-index: 100;\r\n padding: 10em 1em;\r\n }\r\n div.dtr-modal div.dtr-modal-display {\r\n position: absolute;\r\n top: 0;\r\n left: 0;\r\n bottom: 0;\r\n right: 0;\r\n width: 50%;\r\n height: fit-content;\r\n max-height: 75%;\r\n overflow: auto;\r\n margin: auto;\r\n z-index: 102;\r\n overflow: auto;\r\n background-color: #f5f5f7;\r\n border: 1px solid black;\r\n border-radius: 0.5em;\r\n box-shadow: 0 12px 30px rgba(0, 0, 0, 0.6);\r\n }\r\n div.dtr-modal div.dtr-modal-content {\r\n position: relative;\r\n padding: 2.5em;\r\n }\r\n div.dtr-modal div.dtr-modal-content h2 {\r\n margin-top: 0;\r\n }\r\n div.dtr-modal div.dtr-modal-close {\r\n position: absolute;\r\n top: 6px;\r\n right: 6px;\r\n width: 22px;\r\n height: 22px;\r\n text-align: center;\r\n border-radius: 3px;\r\n cursor: pointer;\r\n z-index: 12;\r\n }\r\n div.dtr-modal div.dtr-modal-background {\r\n position: fixed;\r\n top: 0;\r\n left: 0;\r\n right: 0;\r\n bottom: 0;\r\n z-index: 101;\r\n background: rgba(0, 0, 0, 0.6);\r\n }\r\n\r\n /* Search Builder Styles */\r\n div.dt-button-collection {\r\n overflow: visible !important;\r\n z-index: 2002 !important;\r\n }\r\n div.dt-button-collection div.dtsb-searchBuilder {\r\n padding-left: 1em !important;\r\n padding-right: 1em !important;\r\n }\r\n div.dt-button-collection.dtb-collection-closeable div.dtsb-titleRow {\r\n padding-right: 40px;\r\n }\r\n .dtsb-greyscale {\r\n @apply !border;\r\n }\r\n div.dtsb-logicContainer .dtsb-greyscale {\r\n border: none !important;\r\n }\r\n div.dtsb-searchBuilder {\r\n @apply mb-4 cursor-default justify-evenly text-left;\r\n }\r\n div.dtsb-searchBuilder button.dtsb-button,\r\n div.dtsb-searchBuilder select {\r\n @apply text-sm;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-titleRow {\r\n @apply mb-3 flex items-center justify-between;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-titleRow div.dtsb-title {\r\n @apply inline-block text-sm font-normal;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-titleRow div.dtsb-title:empty {\r\n display: inline;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-vertical .dtsb-value,\r\n div.dtsb-searchBuilder div.dtsb-vertical .dtsb-data,\r\n div.dtsb-searchBuilder div.dtsb-vertical .dtsb-condition {\r\n display: block;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group {\r\n @apply relative clear-both mb-4;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group button.dtsb-search {\r\n float: right;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group button.dtsb-clearGroup {\r\n margin: 2px;\r\n text-align: center;\r\n padding: 0;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-logicContainer {\r\n -webkit-transform: rotate(90deg);\r\n -moz-transform: rotate(90deg);\r\n -o-transform: rotate(90deg);\r\n -ms-transform: rotate(90deg);\r\n transform: rotate(90deg);\r\n position: absolute;\r\n margin-top: 0.8em;\r\n margin-right: 0.8em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria {\r\n margin-bottom: 0.8em;\r\n display: flex;\r\n justify-content: flex-start;\r\n flex-flow: row wrap;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-dropDown,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input {\r\n padding: 0.4em;\r\n margin-right: 0.8em;\r\n min-width: 5em;\r\n max-width: 20em;\r\n color: inherit;\r\n }\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n select.dtsb-dropDown\r\n option.dtsb-notItalic,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input option.dtsb-notItalic {\r\n font-style: normal;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-italic {\r\n font-style: italic;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont {\r\n flex: 1;\r\n white-space: nowrap;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont span.dtsp-joiner {\r\n margin-right: 0.8em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont input.dtsb-value {\r\n width: 33%;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont select,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont input {\r\n height: 100%;\r\n box-sizing: border-box;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-buttonContainer {\r\n margin-left: auto;\r\n display: inline-block;\r\n }\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-delete,\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-right,\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-left {\r\n margin-right: 0.8em;\r\n }\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-delete:last-child,\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-right:last-child,\r\n div.dtsb-searchBuilder\r\n div.dtsb-group\r\n div.dtsb-criteria\r\n div.dtsb-buttonContainer\r\n button.dtsb-left:last-child {\r\n margin-right: 0;\r\n }\r\n @media screen and (max-width: 550px) {\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria {\r\n display: flex;\r\n flex-flow: none;\r\n flex-direction: column;\r\n justify-content: flex-start;\r\n padding-right: calc(35px + 0.8em);\r\n margin-bottom: 0px;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:not(:first-child),\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:not(:nth-child(2)),\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:not(:last-child) {\r\n padding-top: 0.8em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:first-child,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:nth-child(2),\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria:last-child {\r\n padding-top: 0em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-dropDown,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input {\r\n max-width: none;\r\n width: 100%;\r\n margin-bottom: 0.8em;\r\n margin-right: 0.8em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-inputCont {\r\n margin-right: 0.8em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-buttonContainer {\r\n position: absolute;\r\n width: 35px;\r\n display: flex;\r\n flex-wrap: wrap-reverse;\r\n right: 0;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria div.dtsb-buttonContainer button {\r\n margin-right: 0px !important;\r\n }\r\n }\r\n div.dtsb-searchBuilder button,\r\n div.dtsb-searchBuilder select.dtsb-dropDown,\r\n div.dtsb-searchBuilder input {\r\n @apply bg-background;\r\n }\r\n div.dtsb-searchBuilder button.dtsb-button {\r\n @apply relative box-border inline-flex cursor-pointer select-none items-center justify-center overflow-hidden text-ellipsis whitespace-nowrap rounded-md border bg-background px-3 py-2 text-xs focus:outline-none focus-visible:ring-2 focus-visible:ring-ring focus-visible:ring-offset-2 focus-visible:ring-offset-background;\r\n }\r\n div.dtsb-searchBuilder button.dtsb-button:hover {\r\n @apply cursor-pointer bg-muted;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-logicContainer {\r\n @apply overflow-hidden rounded-none border;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-logicContainer button {\r\n @apply rounded-md border-transparent bg-transparent;\r\n }\r\n div.dtsb-searchBuilder button.dtsb-clearGroup {\r\n min-width: 2em;\r\n padding: 0;\r\n }\r\n div.dtsb-searchBuilder button.dtsb-iptbtn {\r\n min-width: 100px;\r\n text-align: left;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-logicContainer {\r\n @apply flex flex-row content-start items-start justify-start rounded-md;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-logicContainer button.dtsb-logic {\r\n @apply m-0 shrink-0 grow rounded-none border-0;\r\n flex-basis: 3em;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-logicContainer button.dtsb-clearGroup {\r\n border: none;\r\n border-radius: 0px;\r\n width: 2em;\r\n margin: 0px;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-dropDown,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-input {\r\n @apply rounded-md border;\r\n }\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-condition,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-data,\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria select.dtsb-value {\r\n @apply rounded-md border border-input bg-background text-xs transition focus:border-primary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-background;\r\n }\r\n\r\n div.dtsb-searchBuilder div.dtsb-group div.dtsb-criteria input.dtsb-value {\r\n @apply rounded-md border border-input bg-background text-xs transition focus:border-primary focus:outline-none focus:ring-2 focus:ring-ring focus:ring-offset-2 focus:ring-offset-background;\r\n }\r\n</style>\r\n",
712
712
  },
713
713
  ],
714
714
  utils: [],
@@ -739,8 +739,8 @@ export default [
739
739
  name: "Dialog",
740
740
  value: "dialog",
741
741
  deps: ["radix-vue", "tailwind-variants"],
742
- devDeps: ["tailwindcss-animate", "nuxt-lodash", "nuxt-icon"],
743
- nuxtModules: ["nuxt-lodash", "nuxt-icon"],
742
+ devDeps: ["tailwindcss-animate", "nuxt-icon"],
743
+ nuxtModules: ["nuxt-icon"],
744
744
  files: [
745
745
  {
746
746
  fileName: "Dialog/Close.vue",
@@ -752,13 +752,13 @@ export default [
752
752
  fileName: "Dialog/Content.vue",
753
753
  dirPath: "components/UI",
754
754
  fileContent:
755
- '<template>\n <UIDialogPortal>\n <UIDialogOverlay />\n <DialogContent :class="styles({ class: props.class })" v-bind="{ ...forwarded, ...$attrs }">\n <slot>\n <slot name="header">\n <UIDialogHeader>\n <slot name="title">\n <UIDialogTitle v-if="title" :title="title" />\n </slot>\n <slot name="description">\n <UIDialogDescription v-if="description" :description="description" />\n </slot>\n </UIDialogHeader>\n </slot>\n <slot name="content"></slot>\n <slot name="footer"></slot>\n </slot>\n <slot name="close">\n <UIDialogClose :icon="icon" />\n </slot>\n <UIDialogClose\n v-if="!hideClose"\n class="absolute right-4 top-2 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 <Icon name="lucide:x" class="h-4 w-4" />\n <span class="sr-only">Close</span>\n </UIDialogClose>\n </DialogContent>\n </UIDialogPortal>\n</template>\n\n<script lang="ts" setup>\n import { DialogContent, useForwardPropsEmits } from "radix-vue";\n import type { DialogContentEmits, DialogContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n const props = defineProps<\n DialogContentProps & {\n icon?: string;\n title?: string;\n description?: string;\n class?: any;\n hideClose?: boolean;\n }\n >();\n const emits = defineEmits<DialogContentEmits>();\n const forwarded = useForwardPropsEmits(\n useOmit(props, ["icon", "title", "description", "class", "hideClose"]),\n emits\n );\n\n const styles = tv({\n base: "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg md:w-full",\n });\n</script>\n',
755
+ '<template>\n <UIDialogPortal>\n <UIDialogOverlay />\n <DialogContent :class="styles({ class: props.class })" v-bind="{ ...forwarded, ...$attrs }">\n <slot>\n <slot name="header">\n <UIDialogHeader>\n <slot name="title">\n <UIDialogTitle v-if="title" :title="title" />\n </slot>\n <slot name="description">\n <UIDialogDescription v-if="description" :description="description" />\n </slot>\n </UIDialogHeader>\n </slot>\n <slot name="content"></slot>\n <slot name="footer"></slot>\n </slot>\n <slot name="close">\n <UIDialogClose :icon="icon" />\n </slot>\n <UIDialogClose\n v-if="!hideClose"\n class="absolute right-4 top-2 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 <Icon name="lucide:x" class="h-4 w-4" />\n <span class="sr-only">Close</span>\n </UIDialogClose>\n </DialogContent>\n </UIDialogPortal>\n</template>\n\n<script lang="ts" setup>\n import { DialogContent, useForwardPropsEmits } from "radix-vue";\n import type { DialogContentEmits, DialogContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n const props = defineProps<\n DialogContentProps & {\n icon?: string;\n title?: string;\n description?: string;\n class?: any;\n hideClose?: boolean;\n }\n >();\n const emits = defineEmits<DialogContentEmits>();\n const forwarded = useForwardPropsEmits(props, emits);\n\n const styles = tv({\n base: "fixed left-[50%] top-[50%] z-50 grid w-full max-w-lg translate-x-[-50%] translate-y-[-50%] gap-4 border bg-background p-6 shadow-lg duration-200 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-[state=closed]:slide-out-to-left-1/2 data-[state=closed]:slide-out-to-top-[48%] data-[state=open]:slide-in-from-left-1/2 data-[state=open]:slide-in-from-top-[48%] sm:rounded-lg md:w-full",\n });\n</script>\n',
756
756
  },
757
757
  {
758
758
  fileName: "Dialog/Description.vue",
759
759
  dirPath: "components/UI",
760
760
  fileContent:
761
- '<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, useForwardProps } from "radix-vue";\n import type { DialogDescriptionProps } from "radix-vue";\n\n const props = defineProps<\n DialogDescriptionProps & {\n class?: any;\n description?: string;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["description", "class"]));\n\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
761
+ '<template>\n <DialogDescription :class="styles({ class: props.class })" v-bind="props">\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 class?: any;\n description?: string;\n }\n >();\n\n const styles = tv({\n base: "text-sm text-muted-foreground",\n });\n</script>\n',
762
762
  },
763
763
  {
764
764
  fileName: "Dialog/Dialog.vue",
@@ -770,19 +770,19 @@ export default [
770
770
  fileName: "Dialog/Footer.vue",
771
771
  dirPath: "components/UI",
772
772
  fileContent:
773
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot></slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive, useForwardProps } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n const forwarded = useForwardProps(useOmit(props, ["class"]));\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',
773
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\n <slot></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: "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",\n });\n</script>\n',
774
774
  },
775
775
  {
776
776
  fileName: "Dialog/Header.vue",
777
777
  dirPath: "components/UI",
778
778
  fileContent:
779
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\n <slot></slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive, useForwardProps } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n const forwarded = useForwardProps(useOmit(props, ["class"]));\n\n const styles = tv({\n base: "flex flex-col space-y-1.5 text-center sm:text-left",\n });\n</script>\n',
779
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\n <slot></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: "flex flex-col space-y-1.5 text-center sm:text-left",\n });\n</script>\n',
780
780
  },
781
781
  {
782
782
  fileName: "Dialog/Overlay.vue",
783
783
  dirPath: "components/UI",
784
784
  fileContent:
785
- '<template>\n <DialogOverlay :class="styles({ class: props.class })" v-bind="forwarded" />\n</template>\n\n<script lang="ts" setup>\n import { DialogOverlay, useForwardProps } from "radix-vue";\n import type { DialogOverlayProps } from "radix-vue";\n\n const props = defineProps<\n DialogOverlayProps & {\n class?: any;\n }\n >();\n const forwarded = useForwardProps(useOmit(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',
785
+ '<template>\n <DialogOverlay :class="styles({ class: props.class })" v-bind="props" />\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 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',
786
786
  },
787
787
  {
788
788
  fileName: "Dialog/Portal.vue",
@@ -794,7 +794,7 @@ export default [
794
794
  fileName: "Dialog/Title.vue",
795
795
  dirPath: "components/UI",
796
796
  fileContent:
797
- '<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, useForwardProps } from "radix-vue";\n import type { DialogTitleProps } from "radix-vue";\n\n const props = defineProps<\n DialogTitleProps & {\n class?: any;\n title?: string;\n }\n >();\n const forwarded = useForwardProps(useOmit(props, ["title", "class"]));\n\n const styles = tv({\n base: "text-lg font-semibold leading-none tracking-tight",\n });\n</script>\n',
797
+ '<template>\n <DialogTitle :class="styles({ class: props.class })" v-bind="props">\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 class?: any;\n title?: string;\n }\n >();\n\n const styles = tv({\n base: "text-lg font-semibold leading-none tracking-tight",\n });\n</script>\n',
798
798
  },
799
799
  {
800
800
  fileName: "Dialog/Trigger.vue",
@@ -811,26 +811,26 @@ export default [
811
811
  name: "Dropdown Menu",
812
812
  value: "dropdown-menu",
813
813
  deps: ["radix-vue", "tailwind-variants"],
814
- devDeps: ["tailwindcss-animate", "nuxt-lodash", "nuxt-icon"],
815
- nuxtModules: ["nuxt-lodash", "nuxt-icon"],
814
+ devDeps: ["tailwindcss-animate", "nuxt-icon"],
815
+ nuxtModules: ["nuxt-icon"],
816
816
  files: [
817
817
  {
818
818
  fileName: "DropdownMenu/Arrow.vue",
819
819
  dirPath: "components/UI",
820
820
  fileContent:
821
- '<template>\r\n <DropdownMenuArrow v-bind="forwarded" :class="styles({ class: props.class })" />\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuArrow, useForwardProps } from "radix-vue";\r\n import type { DropdownMenuArrowProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n DropdownMenuArrowProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n asChild: false,\r\n width: 10,\r\n height: 5,\r\n }\r\n );\r\n const forwarded = useForwardProps(useOmit(props, ["class"]));\r\n\r\n const styles = tv({\r\n base: "rotate-45 border bg-muted",\r\n });\r\n</script>\r\n',
821
+ '<template>\r\n <DropdownMenuArrow v-bind="props" :class="styles({ class: props.class })" />\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuArrow } from "radix-vue";\r\n import type { DropdownMenuArrowProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n DropdownMenuArrowProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n asChild: false,\r\n width: 10,\r\n height: 5,\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "rotate-45 border bg-muted",\r\n });\r\n</script>\r\n',
822
822
  },
823
823
  {
824
824
  fileName: "DropdownMenu/CheckboxItem.vue",
825
825
  dirPath: "components/UI",
826
826
  fileContent:
827
- '<template>\r\n <DropdownMenuCheckboxItem v-bind="forwarded" :class="styles({ class: props.class })">\r\n <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-primary">\r\n <UIDropdownMenuItemIndicator icon="lucide:check" />\r\n </span>\r\n <slot>\r\n <span v-if="title">{{ title }}</span>\r\n </slot>\r\n <slot name="shortcut">\r\n <UIDropdownMenuShortcut v-if="shortcut">{{ shortcut }}</UIDropdownMenuShortcut>\r\n </slot>\r\n </DropdownMenuCheckboxItem>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuCheckboxItem, useForwardPropsEmits } from "radix-vue";\r\n import type { DropdownMenuCheckboxItemEmits, DropdownMenuCheckboxItemProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuCheckboxItemProps & {\r\n class?: any;\r\n shortcut?: string;\r\n title?: string;\r\n }\r\n >();\r\n const emits = defineEmits<DropdownMenuCheckboxItemEmits>();\r\n const forwarded = useForwardPropsEmits(props, emits);\r\n\r\n const styles = tv({\r\n base: "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",\r\n });\r\n</script>\r\n',
827
+ '<template>\r\n <DropdownMenuCheckboxItem v-bind="forwarded" :class="styles({ class: props.class })">\r\n <span className="absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-primary">\r\n <UIDropdownMenuItemIndicator icon="lucide:check" />\r\n </span>\r\n <slot>\r\n <span v-if="title">{{ title }}</span>\r\n </slot>\r\n <slot name="shortcut">\r\n <UIDropdownMenuShortcut v-if="shortcut">{{ shortcut }}</UIDropdownMenuShortcut>\r\n </slot>\r\n </DropdownMenuCheckboxItem>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuCheckboxItem, useForwardPropsEmits } from "radix-vue";\r\n import type { DropdownMenuCheckboxItemEmits, DropdownMenuCheckboxItemProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuCheckboxItemProps & {\r\n class?: any;\r\n shortcut?: string;\r\n title?: string;\r\n }\r\n >();\r\n const emits = defineEmits<DropdownMenuCheckboxItemEmits>();\r\n const forwarded = useForwardPropsEmits(props, emits);\r\n\r\n const styles = tv({\r\n base: "relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",\r\n });\r\n</script>\r\n',
828
828
  },
829
829
  {
830
830
  fileName: "DropdownMenu/Content.vue",
831
831
  dirPath: "components/UI",
832
832
  fileContent:
833
- '<template>\r\n <UIDropdownMenuPortal>\r\n <DropdownMenuContent\r\n v-bind="{ ...forwarded, ...$attrs }"\r\n :class="styles({ class: props.class })"\r\n >\r\n <slot></slot>\r\n </DropdownMenuContent>\r\n </UIDropdownMenuPortal>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuContent, useForwardPropsEmits } from "radix-vue";\r\n import type { DropdownMenuContentEmits, DropdownMenuContentProps } from "radix-vue";\r\n\r\n defineOptions({ inheritAttrs: false });\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n DropdownMenuContentProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n loop: true,\r\n align: "center",\r\n sideOffset: 5,\r\n side: "bottom",\r\n avoidCollisions: true,\r\n sticky: "partial",\r\n }\r\n );\r\n\r\n const emits = defineEmits<DropdownMenuContentEmits>();\r\n\r\n const styles = tv({\r\n base: "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-accent-foreground shadow-md 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",\r\n });\r\n\r\n const forwarded = useForwardPropsEmits(useOmit(props, ["class"]), emits);\r\n</script>\r\n',
833
+ '<template>\r\n <UIDropdownMenuPortal>\r\n <DropdownMenuContent\r\n v-bind="{ ...forwarded, ...$attrs }"\r\n :class="styles({ class: props.class })"\r\n >\r\n <slot></slot>\r\n </DropdownMenuContent>\r\n </UIDropdownMenuPortal>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuContent, useForwardPropsEmits } from "radix-vue";\r\n import type { DropdownMenuContentEmits, DropdownMenuContentProps } from "radix-vue";\r\n\r\n defineOptions({ inheritAttrs: false });\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n DropdownMenuContentProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n loop: true,\r\n align: "center",\r\n sideOffset: 5,\r\n side: "bottom",\r\n avoidCollisions: true,\r\n sticky: "partial",\r\n }\r\n );\r\n\r\n const emits = defineEmits<DropdownMenuContentEmits>();\r\n\r\n const styles = tv({\r\n base: "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-accent-foreground shadow-md 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",\r\n });\r\n\r\n const forwarded = useForwardPropsEmits(props, emits);\r\n</script>\r\n',
834
834
  },
835
835
  {
836
836
  fileName: "DropdownMenu/DropdownMenu.vue",
@@ -842,31 +842,31 @@ export default [
842
842
  fileName: "DropdownMenu/Group.vue",
843
843
  dirPath: "components/UI",
844
844
  fileContent:
845
- '<template>\r\n <DropdownMenuGroup v-bind="forwarded">\r\n <slot></slot>\r\n </DropdownMenuGroup>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuGroup, useForwardProps } from "radix-vue";\r\n import type { DropdownMenuGroupProps } from "radix-vue";\r\n\r\n const props = defineProps<DropdownMenuGroupProps>();\r\n const forwarded = useForwardProps(props);\r\n</script>\r\n',
845
+ '<template>\r\n <DropdownMenuGroup v-bind="props">\r\n <slot></slot>\r\n </DropdownMenuGroup>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuGroup } from "radix-vue";\r\n import type { DropdownMenuGroupProps } from "radix-vue";\r\n\r\n const props = defineProps<DropdownMenuGroupProps>();\r\n</script>\r\n',
846
846
  },
847
847
  {
848
848
  fileName: "DropdownMenu/Item.vue",
849
849
  dirPath: "components/UI",
850
850
  fileContent:
851
- '<template>\r\n <DropdownMenuItem v-bind="forwarded" :class="styles({ inset, class: props.class })">\r\n <slot>\r\n <slot name="icon">\r\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\r\n </slot>\r\n <slot name="title">\r\n <span v-if="title">{{ title }}</span>\r\n </slot>\r\n </slot>\r\n <slot name="shortcut">\r\n <UIDropdownMenuShortcut v-if="shortcut">{{ shortcut }}</UIDropdownMenuShortcut>\r\n </slot>\r\n </DropdownMenuItem>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuItem, useForwardPropsEmits } from "radix-vue";\r\n import type { DropdownMenuItemEmits, DropdownMenuItemProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuItemProps & {\r\n class?: any;\r\n inset?: boolean;\r\n shortcut?: string;\r\n title?: string;\r\n icon?: string;\r\n }\r\n >();\r\n\r\n const emits = defineEmits<DropdownMenuItemEmits>();\r\n const forwarded = useForwardPropsEmits(\r\n useOmit(props, ["class", "inset", "shortcut", "icon"]),\r\n emits\r\n );\r\n\r\n const styles = tv({\r\n base: "relative flex cursor-default select-none items-center gap-3 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",\r\n variants: {\r\n inset: {\r\n true: "pl-8",\r\n },\r\n },\r\n });\r\n</script>\r\n',
851
+ '<template>\r\n <DropdownMenuItem v-bind="forwarded" :class="styles({ inset, class: props.class })">\r\n <slot>\r\n <slot name="icon">\r\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\r\n </slot>\r\n <slot name="title">\r\n <span v-if="title">{{ title }}</span>\r\n </slot>\r\n </slot>\r\n <slot name="shortcut">\r\n <UIDropdownMenuShortcut v-if="shortcut">{{ shortcut }}</UIDropdownMenuShortcut>\r\n </slot>\r\n </DropdownMenuItem>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuItem, useForwardPropsEmits } from "radix-vue";\r\n import type { DropdownMenuItemEmits, DropdownMenuItemProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuItemProps & {\r\n class?: any;\r\n inset?: boolean;\r\n shortcut?: string;\r\n title?: string;\r\n icon?: string;\r\n }\r\n >();\r\n\r\n const emits = defineEmits<DropdownMenuItemEmits>();\r\n const forwarded = useForwardPropsEmits(props, emits);\r\n\r\n const styles = tv({\r\n base: "relative flex cursor-default select-none items-center gap-3 rounded-sm px-2 py-1.5 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",\r\n variants: {\r\n inset: {\r\n true: "pl-8",\r\n },\r\n },\r\n });\r\n</script>\r\n',
852
852
  },
853
853
  {
854
854
  fileName: "DropdownMenu/ItemIndicator.vue",
855
855
  dirPath: "components/UI",
856
856
  fileContent:
857
- '<template>\r\n <DropdownMenuItemIndicator v-bind="forwarded">\r\n <slot>\r\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\r\n </slot>\r\n </DropdownMenuItemIndicator>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuItemIndicator, useForwardProps } from "radix-vue";\r\n import type { DropdownMenuItemIndicatorProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuItemIndicatorProps & {\r\n icon?: string;\r\n }\r\n >();\r\n const forwarded = useForwardProps(useOmit(props, ["icon"]));\r\n</script>\r\n',
857
+ '<template>\r\n <DropdownMenuItemIndicator v-bind="props">\r\n <slot>\r\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\r\n </slot>\r\n </DropdownMenuItemIndicator>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuItemIndicator } from "radix-vue";\r\n import type { DropdownMenuItemIndicatorProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuItemIndicatorProps & {\r\n icon?: string;\r\n }\r\n >();\r\n</script>\r\n',
858
858
  },
859
859
  {
860
860
  fileName: "DropdownMenu/Label.vue",
861
861
  dirPath: "components/UI",
862
862
  fileContent:
863
- '<template>\r\n <DropdownMenuLabel :class="styles({ inset, class: props.class })" v-bind="forwarded">\r\n <slot>{{ label }}</slot>\r\n </DropdownMenuLabel>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuLabel, useForwardProps } from "radix-vue";\r\n import type { DropdownMenuLabelProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuLabelProps & {\r\n class?: any;\r\n inset?: boolean;\r\n label?: string;\r\n }\r\n >();\r\n const forwarded = useForwardProps(useOmit(props, ["class", "inset", "label"]));\r\n\r\n const styles = tv({\r\n base: "inline-block w-full px-2 py-1.5 text-sm font-semibold text-foreground",\r\n variants: {\r\n inset: { true: "pl-8" },\r\n },\r\n });\r\n</script>\r\n',
863
+ '<template>\r\n <DropdownMenuLabel :class="styles({ inset, class: props.class })" v-bind="props">\r\n <slot>{{ label }}</slot>\r\n </DropdownMenuLabel>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuLabel } from "radix-vue";\r\n import type { DropdownMenuLabelProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuLabelProps & {\r\n class?: any;\r\n inset?: boolean;\r\n label?: string;\r\n }\r\n >();\r\n\r\n const styles = tv({\r\n base: "inline-block w-full px-2 py-1.5 text-sm font-semibold text-foreground",\r\n variants: {\r\n inset: { true: "pl-8" },\r\n },\r\n });\r\n</script>\r\n',
864
864
  },
865
865
  {
866
866
  fileName: "DropdownMenu/Portal.vue",
867
867
  dirPath: "components/UI",
868
868
  fileContent:
869
- '<template>\r\n <DropdownMenuPortal v-bind="forwarded">\r\n <slot></slot>\r\n </DropdownMenuPortal>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuPortal, useForwardProps } from "radix-vue";\r\n import type { DropdownMenuPortalProps } from "radix-vue";\r\n\r\n const props = defineProps<DropdownMenuPortalProps>();\r\n const forwarded = useForwardProps(props);\r\n</script>\r\n',
869
+ '<template>\r\n <DropdownMenuPortal v-bind="props">\r\n <slot></slot>\r\n </DropdownMenuPortal>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuPortal } from "radix-vue";\r\n import type { DropdownMenuPortalProps } from "radix-vue";\r\n\r\n const props = defineProps<DropdownMenuPortalProps>();\r\n</script>\r\n',
870
870
  },
871
871
  {
872
872
  fileName: "DropdownMenu/RadioGroup.vue",
@@ -878,19 +878,19 @@ export default [
878
878
  fileName: "DropdownMenu/RadioItem.vue",
879
879
  dirPath: "components/UI",
880
880
  fileContent:
881
- '<template>\r\n <DropdownMenuRadioItem v-bind="forwarded" :class="styles({ class: props.class })">\r\n <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-primary">\r\n <UIDropdownMenuItemIndicator>\r\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\r\n <Icon v-else name="ph:circle-fill" class="h-2 w-2" />\r\n </UIDropdownMenuItemIndicator>\r\n </span>\r\n <slot>{{ title }}</slot>\r\n </DropdownMenuRadioItem>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuRadioItem, useForwardPropsEmits } from "radix-vue";\r\n import type { DropdownMenuRadioItemEmits, DropdownMenuRadioItemProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuRadioItemProps & {\r\n class?: any;\r\n icon?: string;\r\n title?: string;\r\n }\r\n >();\r\n\r\n const emits = defineEmits<DropdownMenuRadioItemEmits>();\r\n const forwarded = useForwardPropsEmits(useOmit(props, ["class", "icon"]), emits);\r\n\r\n const styles = tv({\r\n base: "relative flex cursor-default select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",\r\n });\r\n</script>\r\n',
881
+ '<template>\r\n <DropdownMenuRadioItem v-bind="forwarded" :class="styles({ class: props.class })">\r\n <span class="absolute left-2 flex h-3.5 w-3.5 items-center justify-center text-primary">\r\n <UIDropdownMenuItemIndicator>\r\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\r\n <Icon v-else name="ph:circle-fill" class="h-2 w-2" />\r\n </UIDropdownMenuItemIndicator>\r\n </span>\r\n <slot>{{ title }}</slot>\r\n </DropdownMenuRadioItem>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuRadioItem, useForwardPropsEmits } from "radix-vue";\r\n import type { DropdownMenuRadioItemEmits, DropdownMenuRadioItemProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuRadioItemProps & {\r\n class?: any;\r\n icon?: string;\r\n title?: string;\r\n }\r\n >();\r\n\r\n const emits = defineEmits<DropdownMenuRadioItemEmits>();\r\n const forwarded = useForwardPropsEmits(props, emits);\r\n\r\n const styles = tv({\r\n base: "relative flex cursor-pointer select-none items-center rounded-sm py-1.5 pl-8 pr-2 text-sm outline-none transition-colors focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none data-[disabled]:opacity-50",\r\n });\r\n</script>\r\n',
882
882
  },
883
883
  {
884
884
  fileName: "DropdownMenu/Separator.vue",
885
885
  dirPath: "components/UI",
886
886
  fileContent:
887
- '<template>\r\n <DropdownMenuSeparator :class="styles({ class: props.class })" v-bind="forwarded" />\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuSeparator, useForwardProps } from "radix-vue";\r\n import type { DropdownMenuSeparatorProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuSeparatorProps & {\r\n class?: any;\r\n }\r\n >();\r\n const forwarded = useForwardProps(useOmit(props, ["class"]));\r\n\r\n const styles = tv({\r\n base: "-mx-1 my-1 h-px bg-border",\r\n });\r\n</script>\r\n',
887
+ '<template>\r\n <DropdownMenuSeparator :class="styles({ class: props.class })" v-bind="props" />\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuSeparator } from "radix-vue";\r\n import type { DropdownMenuSeparatorProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuSeparatorProps & {\r\n class?: any;\r\n }\r\n >();\r\n\r\n const styles = tv({\r\n base: "-mx-1 my-1 h-px bg-border",\r\n });\r\n</script>\r\n',
888
888
  },
889
889
  {
890
890
  fileName: "DropdownMenu/Shortcut.vue",
891
891
  dirPath: "components/UI",
892
892
  fileContent:
893
- '<template>\r\n <Primitive :class="styles({ class: props.class })" v-bind="forwarded">\r\n <slot />\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive, useForwardProps } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "span",\r\n }\r\n );\r\n const forwarded = useForwardProps(useOmit(props, ["class"]));\r\n\r\n const styles = tv({\r\n base: "ml-auto text-xs tracking-widest opacity-60",\r\n });\r\n</script>\r\n',
893
+ '<template>\r\n <Primitive :class="styles({ class: props.class })" v-bind="props">\r\n <slot />\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "span",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "ml-auto text-xs tracking-widest opacity-60",\r\n });\r\n</script>\r\n',
894
894
  },
895
895
  {
896
896
  fileName: "DropdownMenu/Sub.vue",
@@ -902,19 +902,19 @@ export default [
902
902
  fileName: "DropdownMenu/SubContent.vue",
903
903
  dirPath: "components/UI",
904
904
  fileContent:
905
- '<template>\r\n <DropdownMenuPortal>\r\n <DropdownMenuSubContent\r\n v-bind="{ ...forwarded, ...$attrs }"\r\n :class="styles({ class: props.class })"\r\n >\r\n <slot></slot>\r\n </DropdownMenuSubContent>\r\n </DropdownMenuPortal>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuSubContent, useForwardPropsEmits } from "radix-vue";\r\n import type { DropdownMenuSubContentEmits, DropdownMenuSubContentProps } from "radix-vue";\r\n\r\n defineOptions({ inheritAttrs: false });\r\n const props = withDefaults(\r\n defineProps<\r\n DropdownMenuSubContentProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n loop: true,\r\n sideOffset: 8,\r\n avoidCollisions: true,\r\n collisionPadding: 5,\r\n sticky: "partial",\r\n }\r\n );\r\n\r\n const emits = defineEmits<DropdownMenuSubContentEmits>();\r\n const forwarded = useForwardPropsEmits(useOmit(props, ["class"]), emits);\r\n\r\n const styles = tv({\r\n base: "z-50 min-w-[180px] overflow-hidden rounded-md border bg-popover p-1 text-accent-foreground shadow-lg 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",\r\n });\r\n</script>\r\n',
905
+ '<template>\r\n <DropdownMenuPortal>\r\n <DropdownMenuSubContent\r\n v-bind="{ ...forwarded, ...$attrs }"\r\n :class="styles({ class: props.class })"\r\n >\r\n <slot></slot>\r\n </DropdownMenuSubContent>\r\n </DropdownMenuPortal>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuSubContent, useForwardPropsEmits } from "radix-vue";\r\n import type { DropdownMenuSubContentEmits, DropdownMenuSubContentProps } from "radix-vue";\r\n\r\n defineOptions({ inheritAttrs: false });\r\n const props = withDefaults(\r\n defineProps<\r\n DropdownMenuSubContentProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n loop: true,\r\n sideOffset: 8,\r\n avoidCollisions: true,\r\n collisionPadding: 5,\r\n sticky: "partial",\r\n }\r\n );\r\n\r\n const emits = defineEmits<DropdownMenuSubContentEmits>();\r\n const forwarded = useForwardPropsEmits(props, emits);\r\n\r\n const styles = tv({\r\n base: "z-50 min-w-[180px] overflow-hidden rounded-md border bg-popover p-1 text-accent-foreground shadow-lg 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",\r\n });\r\n</script>\r\n',
906
906
  },
907
907
  {
908
908
  fileName: "DropdownMenu/SubTrigger.vue",
909
909
  dirPath: "components/UI",
910
910
  fileContent:
911
- '<template>\r\n <DropdownMenuSubTrigger v-bind="forwarded" :class="styles({ inset, class: props.class })">\r\n <slot>\r\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\r\n <span v-if="title">{{ title }}</span>\r\n </slot>\r\n <Icon\r\n class="ml-auto h-4 w-4 text-muted-foreground"\r\n :name="trailingIcon || \'lucide:chevron-right\'"\r\n />\r\n </DropdownMenuSubTrigger>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuSubTrigger, useForwardProps } from "radix-vue";\r\n import type { DropdownMenuSubTriggerProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuSubTriggerProps & {\r\n class?: any;\r\n inset?: boolean;\r\n asChild?: boolean;\r\n icon?: string;\r\n title?: string;\r\n trailingIcon?: string;\r\n }\r\n >();\r\n const forwarded = useForwardProps(\r\n useOmit(props, ["class", "inset", "asChild", "icon", "trailingIcon"])\r\n );\r\n\r\n const styles = tv({\r\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",\r\n variants: {\r\n inset: {\r\n true: "pl-8",\r\n },\r\n },\r\n });\r\n</script>\r\n',
911
+ '<template>\r\n <DropdownMenuSubTrigger v-bind="props" :class="styles({ inset, class: props.class })">\r\n <slot>\r\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\r\n <span v-if="title">{{ title }}</span>\r\n </slot>\r\n <Icon\r\n class="ml-auto h-4 w-4 text-muted-foreground"\r\n :name="trailingIcon || \'lucide:chevron-right\'"\r\n />\r\n </DropdownMenuSubTrigger>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuSubTrigger, useForwardProps } from "radix-vue";\r\n import type { DropdownMenuSubTriggerProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n DropdownMenuSubTriggerProps & {\r\n class?: any;\r\n inset?: boolean;\r\n asChild?: boolean;\r\n icon?: string;\r\n title?: string;\r\n trailingIcon?: string;\r\n }\r\n >();\r\n\r\n const styles = tv({\r\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",\r\n variants: {\r\n inset: {\r\n true: "pl-8",\r\n },\r\n },\r\n });\r\n</script>\r\n',
912
912
  },
913
913
  {
914
914
  fileName: "DropdownMenu/Trigger.vue",
915
915
  dirPath: "components/UI",
916
916
  fileContent:
917
- '<template>\r\n <DropdownMenuTrigger v-bind="forwarded">\r\n <slot></slot>\r\n </DropdownMenuTrigger>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuTrigger, useForwardProps } from "radix-vue";\r\n import type { DropdownMenuTriggerProps } from "radix-vue";\r\n\r\n const props = defineProps<DropdownMenuTriggerProps>();\r\n const forwarded = useForwardProps(props);\r\n</script>\r\n',
917
+ '<template>\r\n <DropdownMenuTrigger v-bind="props">\r\n <slot></slot>\r\n </DropdownMenuTrigger>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { DropdownMenuTrigger } from "radix-vue";\r\n import type { DropdownMenuTriggerProps } from "radix-vue";\r\n\r\n const props = defineProps<DropdownMenuTriggerProps>();\r\n</script>\r\n',
918
918
  },
919
919
  ],
920
920
  utils: [],
@@ -932,7 +932,7 @@ export default [
932
932
  fileName: "Dropfile.vue",
933
933
  dirPath: "components/UI",
934
934
  fileContent:
935
- '<template>\n <div @click="open()" ref="dropZoneRef" :class="styles({ isOverDropZone, class: props.class })">\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"></p>\n </slot>\n <slot name="subtext">\n <p class="mt-1 text-sm text-muted-foreground/60" v-html="subtext"></p>\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 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) => {\n handleDrop(Array.from(files || []));\n reset();\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',
935
+ '<template>\n <div @click="open()" ref="dropZoneRef" :class="styles({ isOverDropZone, class: props.class })">\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"></p>\n </slot>\n <slot name="subtext">\n <p class="mt-1 text-sm text-muted-foreground/60" v-html="subtext"></p>\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 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) => {\n handleDrop(Array.from(files || []));\n reset();\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',
936
936
  },
937
937
  ],
938
938
  utils: [],
@@ -1005,7 +1005,7 @@ export default [
1005
1005
  fileName: "HoverCard/Content.vue",
1006
1006
  dirPath: "components/UI",
1007
1007
  fileContent:
1008
- '<template>\n <UIHoverCardPortal>\n <HoverCardContent v-bind="{ ...forwarded, ...$attrs }" :class="styles({ class: props.class })">\n <slot></slot>\n </HoverCardContent>\n </UIHoverCardPortal>\n</template>\n\n<script lang="ts" setup>\n import { HoverCardContent, useForwardProps } from "radix-vue";\n import type { HoverCardContentProps } from "radix-vue";\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\n defineOptions({ inheritAttrs: false });\n\n const props = withDefaults(\n defineProps<\n HoverCardContentProps & {\n class?: any;\n }\n >(),\n {\n side: "bottom",\n sideOffset: 5,\n align: "center",\n avoidCollisions: true,\n sticky: "partial",\n }\n );\n\n const forwarded = useForwardProps(props);\n</script>\n',
1008
+ '<template>\n <UIHoverCardPortal>\n <HoverCardContent v-bind="{ ...props, ...$attrs }" :class="styles({ class: props.class })">\n <slot></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 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\n defineOptions({ inheritAttrs: false });\n\n const props = withDefaults(\n defineProps<\n HoverCardContentProps & {\n class?: any;\n }\n >(),\n {\n side: "bottom",\n sideOffset: 5,\n align: "center",\n avoidCollisions: true,\n sticky: "partial",\n }\n );\n</script>\n',
1009
1009
  },
1010
1010
  {
1011
1011
  fileName: "HoverCard/HoverCard.vue",
@@ -1034,14 +1034,14 @@ export default [
1034
1034
  name: "Input",
1035
1035
  value: "input",
1036
1036
  deps: ["radix-vue", "tailwind-variants"],
1037
- devDeps: ["nuxt-lodash", "@vueuse/core", "@vueuse/nuxt"],
1038
- nuxtModules: ["nuxt-lodash", "@vueuse/nuxt"],
1037
+ devDeps: ["@vueuse/core", "@vueuse/nuxt"],
1038
+ nuxtModules: ["@vueuse/nuxt"],
1039
1039
  files: [
1040
1040
  {
1041
1041
  fileName: "Input.vue",
1042
1042
  dirPath: "components/UI",
1043
1043
  fileContent:
1044
- '<template>\r\n <input :class="styles({ class: props.class })" v-bind="forwarded" v-model="localModel" />\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { useForwardPropsEmits } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<{\r\n class?: any;\r\n id?: string;\r\n name?: string;\r\n placeholder?: string;\r\n disabled?: boolean;\r\n required?: boolean;\r\n type?: string;\r\n modelValue?: any;\r\n }>(),\r\n { type: "text" }\r\n );\r\n const emits = defineEmits<{\r\n "update:modelValue": [value: any];\r\n }>();\r\n const forwarded = useForwardPropsEmits(useOmit(props, ["class"]), emits);\r\n\r\n const localModel = useVModel(props, "modelValue", emits);\r\n\r\n const styles = tv({\r\n base: "flex 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",\r\n });\r\n</script>\r\n',
1044
+ '<template>\r\n <input :class="styles({ class: props.class })" v-bind="props" v-model="localModel" />\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n const props = withDefaults(\r\n defineProps<{\r\n class?: any;\r\n id?: string;\r\n name?: string;\r\n placeholder?: string;\r\n disabled?: boolean;\r\n required?: boolean;\r\n type?: string;\r\n modelValue?: any;\r\n }>(),\r\n { type: "text" }\r\n );\r\n const emits = defineEmits<{\r\n "update:modelValue": [value: any];\r\n }>();\r\n const localModel = useVModel(props, "modelValue", emits);\r\n\r\n const styles = tv({\r\n base: "flex 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",\r\n });\r\n</script>\r\n',
1045
1045
  },
1046
1046
  ],
1047
1047
  utils: [],
@@ -1059,7 +1059,7 @@ export default [
1059
1059
  fileName: "Kbd.vue",
1060
1060
  dirPath: "components/UI",
1061
1061
  fileContent:
1062
- '<template>\n <Primitive :class="styles({ size, class: props.class })" v-bind="props">\n <slot />\n </Primitive>\n</template>\n<script setup lang="ts">\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n size?: VariantProps<typeof styles>["size"];\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',
1062
+ '<template>\n <Primitive :class="styles({ size, class: props.class })" v-bind="props">\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 size?: VariantProps<typeof styles>["size"];\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',
1063
1063
  },
1064
1064
  ],
1065
1065
  utils: [],
@@ -1070,14 +1070,14 @@ export default [
1070
1070
  name: "Label",
1071
1071
  value: "label",
1072
1072
  deps: ["radix-vue", "tailwind-variants"],
1073
- devDeps: ["nuxt-lodash"],
1074
- nuxtModules: ["nuxt-lodash"],
1073
+ devDeps: [],
1074
+ nuxtModules: [],
1075
1075
  files: [
1076
1076
  {
1077
1077
  fileName: "Label.vue",
1078
1078
  dirPath: "components/UI",
1079
1079
  fileContent:
1080
- '<template>\r\n <Label :class="styles({ class: props.class })" v-bind="forwarded">\r\n <slot />\r\n </Label>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Label, useForwardProps } from "radix-vue";\r\n import type { LabelProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n LabelProps & {\r\n class?: any;\r\n }\r\n >();\r\n const forwarded = useForwardProps(useOmit(props, ["class"]));\r\n\r\n const styles = tv({\r\n base: "inline-block text-base font-medium leading-none hover:cursor-pointer peer-disabled:cursor-not-allowed peer-disabled:opacity-70 sm:text-sm",\r\n });\r\n</script>\r\n',
1080
+ '<template>\r\n <Label :class="styles({ class: props.class })" v-bind="props">\r\n <slot />\r\n </Label>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Label } from "radix-vue";\r\n import type { LabelProps } from "radix-vue";\r\n\r\n const props = defineProps<\r\n LabelProps & {\r\n class?: any;\r\n }\r\n >();\r\n\r\n const styles = tv({\r\n base: "inline-block text-base font-medium leading-none hover:cursor-pointer peer-disabled:cursor-not-allowed peer-disabled:opacity-70 sm:text-sm",\r\n });\r\n</script>\r\n',
1081
1081
  },
1082
1082
  ],
1083
1083
  utils: [],
@@ -1095,7 +1095,7 @@ export default [
1095
1095
  fileName: "List/Content.vue",
1096
1096
  dirPath: "components/UI",
1097
1097
  fileContent:
1098
- '<template>\r\n <Primitive :class="styles({ class: props.class })" v-bind="props">\r\n <slot></slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "div",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "flex flex-col gap-1 leading-none",\r\n });\r\n</script>\r\n',
1098
+ '<template>\r\n <Primitive :class="styles({ class: props.class })" v-bind="props">\r\n <slot></slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "div",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "flex flex-col gap-1 leading-none",\r\n });\r\n</script>\r\n',
1099
1099
  },
1100
1100
  {
1101
1101
  fileName: "List/Item.vue",
@@ -1107,19 +1107,19 @@ export default [
1107
1107
  fileName: "List/List.vue",
1108
1108
  dirPath: "components/UI",
1109
1109
  fileContent:
1110
- '<template>\r\n <Primitive :class="styles({ class: props.class })" v-bind="props">\r\n <slot></slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "ul",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "w-full py-2",\r\n });\r\n</script>\r\n',
1110
+ '<template>\r\n <Primitive :class="styles({ class: props.class })" v-bind="props">\r\n <slot></slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n }\r\n >(),\r\n {\r\n as: "ul",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "w-full py-2",\r\n });\r\n</script>\r\n',
1111
1111
  },
1112
1112
  {
1113
1113
  fileName: "List/Subtitle.vue",
1114
1114
  dirPath: "components/UI",
1115
1115
  fileContent:
1116
- '<template>\r\n <Primitive :class="styles({ class: props.class })" v-bind="props">\r\n <slot>{{ subtitle }}</slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n subtitle?: string;\r\n }\r\n >(),\r\n {\r\n as: "p",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "text-sm text-muted-foreground",\r\n });\r\n</script>\r\n',
1116
+ '<template>\r\n <Primitive :class="styles({ class: props.class })" v-bind="props">\r\n <slot>{{ subtitle }}</slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n subtitle?: string;\r\n }\r\n >(),\r\n {\r\n as: "p",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "text-sm text-muted-foreground",\r\n });\r\n</script>\r\n',
1117
1117
  },
1118
1118
  {
1119
1119
  fileName: "List/Title.vue",
1120
1120
  dirPath: "components/UI",
1121
1121
  fileContent:
1122
- '<template>\r\n <Primitive :class="styles({ class: props.class })" v-bind="props">\r\n <slot>{{ title }}</slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n title?: string;\r\n }\r\n >(),\r\n {\r\n as: "p",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "font-semibold",\r\n });\r\n</script>\r\n',
1122
+ '<template>\r\n <Primitive :class="styles({ class: props.class })" v-bind="props">\r\n <slot>{{ title }}</slot>\r\n </Primitive>\r\n</template>\r\n\r\n<script lang="ts" setup>\r\n import { Primitive } from "radix-vue";\r\n import type { PrimitiveProps } from "radix-vue";\r\n\r\n const props = withDefaults(\r\n defineProps<\r\n PrimitiveProps & {\r\n class?: any;\r\n title?: string;\r\n }\r\n >(),\r\n {\r\n as: "p",\r\n }\r\n );\r\n\r\n const styles = tv({\r\n base: "font-semibold",\r\n });\r\n</script>\r\n',
1123
1123
  },
1124
1124
  ],
1125
1125
  utils: [],
@@ -1130,8 +1130,8 @@ export default [
1130
1130
  name: "Menubar",
1131
1131
  value: "menubar",
1132
1132
  deps: ["radix-vue", "tailwind-variants"],
1133
- devDeps: ["tailwindcss-animate", "nuxt-lodash", "nuxt-icon"],
1134
- nuxtModules: ["nuxt-lodash", "nuxt-icon"],
1133
+ devDeps: ["tailwindcss-animate", "nuxt-icon"],
1134
+ nuxtModules: ["nuxt-icon"],
1135
1135
  files: [
1136
1136
  {
1137
1137
  fileName: "Menubar/Arrow.vue",
@@ -1143,13 +1143,13 @@ export default [
1143
1143
  fileName: "Menubar/CheckboxItem.vue",
1144
1144
  dirPath: "components/UI",
1145
1145
  fileContent:
1146
- '<template>\n <MenubarCheckboxItem 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 text-primary">\n <UIMenubarItemIndicator>\n <Icon :name="icon || \'lucide:check\'" class="h-4 w-4" />\n </UIMenubarItemIndicator>\n </span>\n <slot>{{ title }}</slot>\n <slot name="shortcut">\n <UIMenubarShortcut v-if="shortcut">{{ shortcut }}</UIMenubarShortcut>\n </slot>\n </MenubarCheckboxItem>\n</template>\n\n<script lang="ts" setup>\n import { MenubarCheckboxItem, useForwardPropsEmits } from "radix-vue";\n import type { MenubarCheckboxItemEmits, MenubarCheckboxItemProps } from "radix-vue";\n\n const props = defineProps<\n MenubarCheckboxItemProps & {\n icon?: string;\n class?: any;\n title?: string;\n shortcut?: string;\n }\n >();\n const emits = defineEmits<MenubarCheckboxItemEmits>();\n\n const forwarded = useForwardPropsEmits(props, emits);\n\n const styles = tv({\n base: "relative flex cursor-default 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-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n });\n</script>\n',
1146
+ '<template>\n <MenubarCheckboxItem 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 text-primary">\n <UIMenubarItemIndicator>\n <Icon :name="icon || \'lucide:check\'" class="h-4 w-4" />\n </UIMenubarItemIndicator>\n </span>\n <slot>{{ title }}</slot>\n <slot name="shortcut">\n <UIMenubarShortcut v-if="shortcut">{{ shortcut }}</UIMenubarShortcut>\n </slot>\n </MenubarCheckboxItem>\n</template>\n\n<script lang="ts" setup>\n import { MenubarCheckboxItem, useForwardPropsEmits } from "radix-vue";\n import type { MenubarCheckboxItemEmits, MenubarCheckboxItemProps } from "radix-vue";\n\n const props = defineProps<\n MenubarCheckboxItemProps & {\n icon?: string;\n class?: any;\n title?: string;\n shortcut?: string;\n }\n >();\n const emits = defineEmits<MenubarCheckboxItemEmits>();\n\n const forwarded = useForwardPropsEmits(props, emits);\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-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n });\n</script>\n',
1147
1147
  },
1148
1148
  {
1149
1149
  fileName: "Menubar/Content.vue",
1150
1150
  dirPath: "components/UI",
1151
1151
  fileContent:
1152
- '<template>\n <UIMenubarPortal :to="to">\n <MenubarContent v-bind="{ ...forwarded, ...$attrs }" :class="styles({ class: props.class })">\n <slot></slot>\n </MenubarContent>\n </UIMenubarPortal>\n</template>\n\n<script lang="ts" setup>\n import { MenubarContent, useForwardPropsEmits } from "radix-vue";\n import type { MenubarContentProps, MenubarSubContentEmits } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = withDefaults(\n defineProps<\n MenubarContentProps & {\n to?: string | HTMLElement;\n class?: any;\n }\n >(),\n {\n loop: true,\n side: "bottom",\n sideOffset: 8,\n align: "start",\n alignOffset: -4,\n avoidCollisions: true,\n sticky: "partial",\n }\n );\n\n const emits = defineEmits<MenubarSubContentEmits>();\n\n const forwarded = useForwardPropsEmits(useOmit(props, ["class", "to"]), emits);\n\n const styles = tv({\n base: "z-50 min-w-[220px] overflow-hidden rounded-md border bg-popover p-1 text-accent-foreground shadow-md data-[state=open]:animate-in 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',
1152
+ '<template>\n <UIMenubarPortal :to="to">\n <MenubarContent v-bind="{ ...forwarded, ...$attrs }" :class="styles({ class: props.class })">\n <slot></slot>\n </MenubarContent>\n </UIMenubarPortal>\n</template>\n\n<script lang="ts" setup>\n import { MenubarContent, useForwardPropsEmits } from "radix-vue";\n import type { MenubarContentProps, MenubarSubContentEmits } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = withDefaults(\n defineProps<\n MenubarContentProps & {\n to?: string | HTMLElement;\n class?: any;\n }\n >(),\n {\n loop: true,\n side: "bottom",\n sideOffset: 8,\n align: "start",\n alignOffset: -4,\n avoidCollisions: true,\n sticky: "partial",\n }\n );\n\n const emits = defineEmits<MenubarSubContentEmits>();\n\n const forwarded = useForwardPropsEmits(props, emits);\n\n const styles = tv({\n base: "z-50 min-w-[220px] overflow-hidden rounded-md border bg-popover p-1 text-accent-foreground shadow-md data-[state=open]:animate-in 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',
1153
1153
  },
1154
1154
  {
1155
1155
  fileName: "Menubar/Group.vue",
@@ -1161,7 +1161,7 @@ export default [
1161
1161
  fileName: "Menubar/Item.vue",
1162
1162
  dirPath: "components/UI",
1163
1163
  fileContent:
1164
- '<template>\n <MenubarItem v-bind="forwarded" :class="styles({ inset, class: props.class })">\n <slot>\n <slot name="icon">\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n </slot>\n <slot name="title">\n <span v-if="title">{{ title }}</span>\n </slot>\n </slot>\n <slot name="shortcut">\n <UIMenubarShortcut v-if="shortcut">{{ shortcut }}</UIMenubarShortcut>\n </slot>\n </MenubarItem>\n</template>\n\n<script lang="ts" setup>\n import { MenubarItem, useForwardPropsEmits } from "radix-vue";\n import type { MenubarItemEmits, MenubarItemProps } from "radix-vue";\n\n const props = defineProps<\n MenubarItemProps & {\n inset?: boolean;\n class?: any;\n shortcut?: string;\n title?: string;\n icon?: string;\n }\n >();\n\n const emits = defineEmits<MenubarItemEmits>();\n const forwarded = useForwardPropsEmits(props, emits);\n\n const styles = tv({\n base: "relative flex cursor-default select-none items-center gap-3 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none 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',
1164
+ '<template>\n <MenubarItem v-bind="forwarded" :class="styles({ inset, class: props.class })">\n <slot>\n <slot name="icon">\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n </slot>\n <slot name="title">\n <span v-if="title">{{ title }}</span>\n </slot>\n </slot>\n <slot name="shortcut">\n <UIMenubarShortcut v-if="shortcut">{{ shortcut }}</UIMenubarShortcut>\n </slot>\n </MenubarItem>\n</template>\n\n<script lang="ts" setup>\n import { MenubarItem, useForwardPropsEmits } from "radix-vue";\n import type { MenubarItemEmits, MenubarItemProps } from "radix-vue";\n\n const props = defineProps<\n MenubarItemProps & {\n inset?: boolean;\n class?: any;\n shortcut?: string;\n title?: string;\n icon?: string;\n }\n >();\n\n const emits = defineEmits<MenubarItemEmits>();\n const forwarded = useForwardPropsEmits(props, emits);\n\n const styles = tv({\n base: "relative flex cursor-pointer select-none items-center gap-3 rounded-sm px-2 py-1.5 text-sm outline-none focus:bg-accent focus:text-accent-foreground data-[disabled]:pointer-events-none 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',
1165
1165
  },
1166
1166
  {
1167
1167
  fileName: "Menubar/ItemIndicator.vue",
@@ -1179,7 +1179,7 @@ export default [
1179
1179
  fileName: "Menubar/Menu.vue",
1180
1180
  dirPath: "components/UI",
1181
1181
  fileContent:
1182
- '<template>\n <MenubarMenu v-bind="forwarded">\n <slot></slot>\n </MenubarMenu>\n</template>\n\n<script lang="ts" setup>\n import { MenubarMenu, useForwardProps } from "radix-vue";\n import type { MenubarMenuProps } from "radix-vue";\n\n const props = defineProps<MenubarMenuProps>();\n const forwarded = useForwardProps(props);\n</script>\n',
1182
+ '<template>\n <MenubarMenu v-bind="props">\n <slot></slot>\n </MenubarMenu>\n</template>\n\n<script lang="ts" setup>\n import { MenubarMenu } from "radix-vue";\n import type { MenubarMenuProps } from "radix-vue";\n\n const props = defineProps<MenubarMenuProps>();\n</script>\n',
1183
1183
  },
1184
1184
  {
1185
1185
  fileName: "Menubar/Menubar.vue",
@@ -1203,7 +1203,7 @@ export default [
1203
1203
  fileName: "Menubar/RadioItem.vue",
1204
1204
  dirPath: "components/UI",
1205
1205
  fileContent:
1206
- '<template>\n <MenubarRadioItem 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 text-primary">\n <UIMenubarItemIndicator>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n <Icon v-else name="ph:circle-fill" class="h-2 w-2" />\n </UIMenubarItemIndicator>\n </span>\n <slot>{{ title }}</slot>\n </MenubarRadioItem>\n</template>\n\n<script lang="ts" setup>\n import { MenubarRadioItem, useForwardPropsEmits } from "radix-vue";\n import type { MenubarRadioItemEmits, MenubarRadioItemProps } from "radix-vue";\n\n const props = defineProps<\n MenubarRadioItemProps & {\n class?: any;\n icon?: string;\n title?: string;\n }\n >();\n\n const emits = defineEmits<MenubarRadioItemEmits>();\n const forwarded = useForwardPropsEmits(props, emits);\n\n const styles = tv({\n base: "relative flex cursor-default 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-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n });\n</script>\n',
1206
+ '<template>\n <MenubarRadioItem 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 text-primary">\n <UIMenubarItemIndicator>\n <Icon v-if="icon" :name="icon" class="h-4 w-4" />\n <Icon v-else name="ph:circle-fill" class="h-2 w-2" />\n </UIMenubarItemIndicator>\n </span>\n <slot>{{ title }}</slot>\n </MenubarRadioItem>\n</template>\n\n<script lang="ts" setup>\n import { MenubarRadioItem, useForwardPropsEmits } from "radix-vue";\n import type { MenubarRadioItemEmits, MenubarRadioItemProps } from "radix-vue";\n\n const props = defineProps<\n MenubarRadioItemProps & {\n class?: any;\n icon?: string;\n title?: string;\n }\n >();\n\n const emits = defineEmits<MenubarRadioItemEmits>();\n const forwarded = useForwardPropsEmits(props, emits);\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-[highlighted]:bg-accent data-[highlighted]:text-accent-foreground data-[disabled]:opacity-50",\n });\n</script>\n',
1207
1207
  },
1208
1208
  {
1209
1209
  fileName: "Menubar/Separator.vue",
@@ -1215,7 +1215,7 @@ export default [
1215
1215
  fileName: "Menubar/Shortcut.vue",
1216
1216
  dirPath: "components/UI",
1217
1217
  fileContent:
1218
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\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/dist/Primitive/Primitive";\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\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',
1218
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\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 { as: "span" }\n );\n\n const styles = tv({\n base: "ml-auto text-xs tracking-widest opacity-60",\n });\n</script>\n',
1219
1219
  },
1220
1220
  {
1221
1221
  fileName: "Menubar/Sub.vue",
@@ -1227,19 +1227,19 @@ export default [
1227
1227
  fileName: "Menubar/SubContent.vue",
1228
1228
  dirPath: "components/UI",
1229
1229
  fileContent:
1230
- '<template>\n <UIMenubarPortal :to="to">\n <MenubarSubContent v-bind="{ ...forwarded, ...$attrs }" :class="styles({ class: props.class })">\n <slot></slot>\n </MenubarSubContent>\n </UIMenubarPortal>\n</template>\n\n<script lang="ts" setup>\n import { MenubarSubContent, useForwardPropsEmits } from "radix-vue";\n import type { MenubarSubContentEmits, MenubarSubContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n const props = withDefaults(\n defineProps<\n MenubarSubContentProps & {\n class?: any;\n to?: string | HTMLElement;\n }\n >(),\n {\n loop: true,\n sideOffset: 5,\n avoidCollisions: true,\n collisionPadding: 8,\n sticky: "partial",\n }\n );\n\n const emits = defineEmits<MenubarSubContentEmits>();\n\n const forwarded = useForwardPropsEmits(useOmit(props, ["class", "to"]), emits);\n\n const styles = tv({\n base: "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-accent-foreground 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',
1230
+ '<template>\n <UIMenubarPortal :to="to">\n <MenubarSubContent v-bind="{ ...forwarded, ...$attrs }" :class="styles({ class: props.class })">\n <slot></slot>\n </MenubarSubContent>\n </UIMenubarPortal>\n</template>\n\n<script lang="ts" setup>\n import { MenubarSubContent, useForwardPropsEmits } from "radix-vue";\n import type { MenubarSubContentEmits, MenubarSubContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n const props = withDefaults(\n defineProps<\n MenubarSubContentProps & {\n class?: any;\n to?: string | HTMLElement;\n }\n >(),\n {\n loop: true,\n sideOffset: 5,\n avoidCollisions: true,\n collisionPadding: 8,\n sticky: "partial",\n }\n );\n\n const emits = defineEmits<MenubarSubContentEmits>();\n\n const forwarded = useForwardPropsEmits(props, emits);\n\n const styles = tv({\n base: "z-50 min-w-[8rem] overflow-hidden rounded-md border bg-popover p-1 text-accent-foreground 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',
1231
1231
  },
1232
1232
  {
1233
1233
  fileName: "Menubar/SubTrigger.vue",
1234
1234
  dirPath: "components/UI",
1235
1235
  fileContent:
1236
- '<template>\n <MenubarSubTrigger v-bind="props" :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\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-[state=open]:bg-accent data-[state=open]:text-accent-foreground",\n variants: {\n inset: {\n true: "pl-8",\n },\n },\n });\n</script>\n',
1236
+ '<template>\n <MenubarSubTrigger v-bind="props" :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\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',
1237
1237
  },
1238
1238
  {
1239
1239
  fileName: "Menubar/Trigger.vue",
1240
1240
  dirPath: "components/UI",
1241
1241
  fileContent:
1242
- '<template>\n <MenubarTrigger :class="styles({ class: props.class })" v-bind="props">\n <slot></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 class?: any;\n }\n >();\n\n const styles = tv({\n base: "flex cursor-default 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',
1242
+ '<template>\n <MenubarTrigger :class="styles({ class: props.class })" v-bind="props">\n <slot></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 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',
1243
1243
  },
1244
1244
  ],
1245
1245
  utils: [],
@@ -1268,8 +1268,8 @@ export default [
1268
1268
  name: "Navigation Menu",
1269
1269
  value: "navigation-menu",
1270
1270
  deps: ["radix-vue", "tailwind-variants"],
1271
- devDeps: ["tailwindcss-animate", "nuxt-lodash", "nuxt-icon"],
1272
- nuxtModules: ["nuxt-lodash", "nuxt-icon"],
1271
+ devDeps: ["tailwindcss-animate", "nuxt-icon"],
1272
+ nuxtModules: ["nuxt-icon"],
1273
1273
  files: [
1274
1274
  {
1275
1275
  fileName: "NavigationMenu/Content.vue",
@@ -1281,7 +1281,7 @@ export default [
1281
1281
  fileName: "NavigationMenu/Indicator.vue",
1282
1282
  dirPath: "components/UI",
1283
1283
  fileContent:
1284
- '<template>\n <NavigationMenuIndicator v-bind="forwarded" :class="styles({ class: props.class })">\n <slot></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, useForwardProps } from "radix-vue";\n import type { NavigationMenuIndicatorProps } from "radix-vue";\n\n const props = defineProps<\n NavigationMenuIndicatorProps & {\n class?: any;\n }\n >();\n const forwarded = useForwardProps(props);\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',
1284
+ '<template>\n <NavigationMenuIndicator v-bind="props" :class="styles({ class: props.class })">\n <slot></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 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',
1285
1285
  },
1286
1286
  {
1287
1287
  fileName: "NavigationMenu/Item.vue",
@@ -1317,13 +1317,13 @@ export default [
1317
1317
  fileName: "NavigationMenu/Trigger.vue",
1318
1318
  dirPath: "components/UI",
1319
1319
  fileContent:
1320
- '<template>\n <NavigationMenuTrigger v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>{{ title }}</slot>\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 </NavigationMenuTrigger>\n</template>\n\n<script lang="ts" setup>\n import { NavigationMenuTrigger, useForwardProps } from "radix-vue";\n import type { NavigationMenuTriggerProps } from "radix-vue";\n\n const props = defineProps<\n NavigationMenuTriggerProps & {\n class?: any;\n icon?: string;\n title?: string;\n }\n >();\n const forwarded = useForwardProps(props);\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',
1320
+ '<template>\n <NavigationMenuTrigger v-bind="props" :class="styles({ class: props.class })">\n <slot>{{ title }}</slot>\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 </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 class?: any;\n icon?: string;\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',
1321
1321
  },
1322
1322
  {
1323
1323
  fileName: "NavigationMenu/Viewport.vue",
1324
1324
  dirPath: "components/UI",
1325
1325
  fileContent:
1326
- '<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, useForwardProps } from "radix-vue";\n import type { NavigationMenuViewportProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n const props = defineProps<\n NavigationMenuViewportProps & {\n class?: any;\n }\n >();\n const forwarded = useForwardProps(props);\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',
1326
+ '<template>\n <div class="absolute left-0 top-full flex justify-center">\n <NavigationMenuViewport\n v-bind="{ ...props, ...$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 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',
1327
1327
  },
1328
1328
  ],
1329
1329
  utils: [],
@@ -1412,8 +1412,8 @@ export default [
1412
1412
  name: "Popover",
1413
1413
  value: "popover",
1414
1414
  deps: ["radix-vue", "tailwind-variants"],
1415
- devDeps: ["tailwindcss-animate", "nuxt-lodash", "nuxt-icon"],
1416
- nuxtModules: ["nuxt-lodash", "nuxt-icon"],
1415
+ devDeps: ["tailwindcss-animate", "nuxt-icon"],
1416
+ nuxtModules: ["nuxt-icon"],
1417
1417
  files: [
1418
1418
  {
1419
1419
  fileName: "Popover/Anchor.vue",
@@ -1461,7 +1461,7 @@ export default [
1461
1461
  fileName: "Popover/X.vue",
1462
1462
  dirPath: "components/UI",
1463
1463
  fileContent:
1464
- '<template>\n <PopoverClose v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <Icon :name="icon" class="h-4 w-4" />\n <span class="sr-only">{{ srText }}</span>\n </slot>\n </PopoverClose>\n</template>\n\n<script lang="ts" setup>\n import { PopoverClose, useForwardProps } from "radix-vue";\n import type { PopoverCloseProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PopoverCloseProps & {\n class?: any;\n icon?: string;\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\n const forwarded = useForwardProps(useOmit(props, ["class", "icon", "srText"]));\n</script>\n',
1464
+ '<template>\n <PopoverClose v-bind="forwarded" :class="styles({ class: props.class })">\n <slot>\n <Icon :name="icon" class="h-4 w-4" />\n <span class="sr-only">{{ srText }}</span>\n </slot>\n </PopoverClose>\n</template>\n\n<script lang="ts" setup>\n import { PopoverClose, useForwardProps } from "radix-vue";\n import type { PopoverCloseProps } from "radix-vue";\n\n const props = withDefaults(\n defineProps<\n PopoverCloseProps & {\n class?: any;\n icon?: string;\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\n const forwarded = useForwardProps(props);\n</script>\n',
1465
1465
  },
1466
1466
  ],
1467
1467
  utils: [],
@@ -1568,8 +1568,8 @@ export default [
1568
1568
  name: "Select",
1569
1569
  value: "select",
1570
1570
  deps: ["radix-vue", "tailwind-variants"],
1571
- devDeps: ["tailwindcss-animate", "nuxt-lodash", "nuxt-icon"],
1572
- nuxtModules: ["nuxt-lodash", "nuxt-icon"],
1571
+ devDeps: ["tailwindcss-animate", "nuxt-icon"],
1572
+ nuxtModules: ["nuxt-icon"],
1573
1573
  files: [
1574
1574
  {
1575
1575
  fileName: "Select/Arrow.vue",
@@ -1599,7 +1599,7 @@ export default [
1599
1599
  fileName: "Select/Item.vue",
1600
1600
  dirPath: "components/UI",
1601
1601
  fileContent:
1602
- '<template>\n <SelectItem v-bind="props" :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 class?: any;\n icon?: string;\n text?: string;\n }\n >();\n\n const styles = tv({\n base: "relative flex w-full cursor-default 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',
1602
+ '<template>\n <SelectItem v-bind="props" :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 class?: any;\n icon?: string;\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',
1603
1603
  },
1604
1604
  {
1605
1605
  fileName: "Select/ItemIndicator.vue",
@@ -1676,14 +1676,14 @@ export default [
1676
1676
  name: "Separator",
1677
1677
  value: "separator",
1678
1678
  deps: ["radix-vue", "tailwind-variants"],
1679
- devDeps: ["nuxt-lodash"],
1680
- nuxtModules: ["nuxt-lodash"],
1679
+ devDeps: [],
1680
+ nuxtModules: [],
1681
1681
  files: [
1682
1682
  {
1683
1683
  fileName: "Separator.vue",
1684
1684
  dirPath: "components/UI",
1685
1685
  fileContent:
1686
- '<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 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\n const forwarded = useForwardProps(useOmit(props, ["class"]));\n</script>\n',
1686
+ '<template>\n <Separator v-bind="useForwardProps(props)" :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 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',
1687
1687
  },
1688
1688
  ],
1689
1689
  utils: [],
@@ -1707,7 +1707,7 @@ export default [
1707
1707
  fileName: "Sheet/Content.vue",
1708
1708
  dirPath: "components/UI",
1709
1709
  fileContent:
1710
- '<template>\n <UIDialogPortal :to="to">\n <UIDialogOverlay />\n <DialogContent\n :class="styles({ side, class: props.class })"\n v-bind="{ ...forwarded, ...$attrs }"\n >\n <slot>\n <slot name="header">\n <UIDialogHeader>\n <slot name="title">\n <UIDialogTitle v-if="title" :title="title" />\n </slot>\n <slot name="description">\n <UIDialogDescription v-if="description" :description="description" />\n </slot>\n </UIDialogHeader>\n </slot>\n <slot name="content"></slot>\n <slot name="footer"></slot>\n </slot>\n <slot name="close">\n <UIDialogClose :icon="icon" />\n </slot>\n </DialogContent>\n </UIDialogPortal>\n</template>\n\n<script lang="ts" setup>\n import { DialogContent, useForwardPropsEmits } from "radix-vue";\n import type { DialogContentEmits, DialogContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = defineProps<\n DialogContentProps & {\n icon?: string;\n title?: string;\n description?: string;\n class?: any;\n side?: VariantProps<typeof styles>["side"];\n to?: string | HTMLElement;\n }\n >();\n const emits = defineEmits<DialogContentEmits>();\n const forwarded = useForwardPropsEmits(useOmit(props, ["title", "class"]), emits);\n\n const styles = tv({\n base: "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out",\n variants: {\n side: {\n top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",\n bottom:\n "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",\n left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",\n right:\n "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",\n },\n },\n defaultVariants: {\n side: "left",\n },\n });\n</script>\n',
1710
+ '<template>\n <UIDialogPortal :to="to">\n <UIDialogOverlay />\n <DialogContent\n :class="styles({ side, class: props.class })"\n v-bind="{ ...forwarded, ...$attrs }"\n >\n <slot>\n <slot name="header">\n <UIDialogHeader>\n <slot name="title">\n <UIDialogTitle v-if="title" :title="title" />\n </slot>\n <slot name="description">\n <UIDialogDescription v-if="description" :description="description" />\n </slot>\n </UIDialogHeader>\n </slot>\n <slot name="content"></slot>\n <slot name="footer"></slot>\n </slot>\n <slot name="close">\n <UIDialogClose :icon="icon" />\n </slot>\n </DialogContent>\n </UIDialogPortal>\n</template>\n\n<script lang="ts" setup>\n import { DialogContent, useForwardPropsEmits } from "radix-vue";\n import type { DialogContentEmits, DialogContentProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n\n const props = defineProps<\n DialogContentProps & {\n icon?: string;\n title?: string;\n description?: string;\n class?: any;\n side?: VariantProps<typeof styles>["side"];\n to?: string | HTMLElement;\n }\n >();\n const emits = defineEmits<DialogContentEmits>();\n const forwarded = useForwardPropsEmits(props, emits);\n\n const styles = tv({\n base: "fixed z-50 gap-4 bg-background p-6 shadow-lg transition ease-in-out data-[state=closed]:duration-300 data-[state=open]:duration-500 data-[state=open]:animate-in data-[state=closed]:animate-out",\n variants: {\n side: {\n top: "inset-x-0 top-0 border-b data-[state=closed]:slide-out-to-top data-[state=open]:slide-in-from-top",\n bottom:\n "inset-x-0 bottom-0 border-t data-[state=closed]:slide-out-to-bottom data-[state=open]:slide-in-from-bottom",\n left: "inset-y-0 left-0 h-full w-3/4 border-r data-[state=closed]:slide-out-to-left data-[state=open]:slide-in-from-left sm:max-w-sm",\n right:\n "inset-y-0 right-0 h-full w-3/4 border-l data-[state=closed]:slide-out-to-right data-[state=open]:slide-in-from-right sm:max-w-sm",\n },\n },\n defaultVariants: {\n side: "left",\n },\n });\n</script>\n',
1711
1711
  },
1712
1712
  {
1713
1713
  fileName: "Sheet/Description.vue",
@@ -1719,13 +1719,13 @@ export default [
1719
1719
  fileName: "Sheet/Footer.vue",
1720
1720
  dirPath: "components/UI",
1721
1721
  fileContent:
1722
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\n <slot></slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\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: "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",\n });\n</script>\n',
1722
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\n <slot></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: "flex flex-col-reverse sm:flex-row sm:justify-end sm:space-x-2",\n });\n</script>\n',
1723
1723
  },
1724
1724
  {
1725
1725
  fileName: "Sheet/Header.vue",
1726
1726
  dirPath: "components/UI",
1727
1727
  fileContent:
1728
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\n <slot></slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\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: "flex flex-col space-y-2 text-center sm:text-left",\n });\n</script>\n',
1728
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\n <slot></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: "flex flex-col space-y-2 text-center sm:text-left",\n });\n</script>\n',
1729
1729
  },
1730
1730
  {
1731
1731
  fileName: "Sheet/Overlay.vue",
@@ -1779,7 +1779,7 @@ export default [
1779
1779
  fileName: "Skeleton.vue",
1780
1780
  dirPath: "components/UI",
1781
1781
  fileContent:
1782
- '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\n <slot></slot>\n </Primitive>\n</template>\n\n<script lang="ts" setup>\n import { Primitive } from "radix-vue";\n import type { PrimitiveProps } from "radix-vue/dist/Primitive/Primitive";\n\n const styles = tv({\n base: "animate-pulse rounded-md bg-muted",\n });\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n</script>\n',
1782
+ '<template>\n <Primitive :class="styles({ class: props.class })" v-bind="props">\n <slot></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 });\n\n const props = withDefaults(\n defineProps<\n PrimitiveProps & {\n class?: any;\n }\n >(),\n {\n as: "div",\n }\n );\n</script>\n',
1783
1783
  },
1784
1784
  ],
1785
1785
  utils: [],
@@ -1960,7 +1960,7 @@ export default [
1960
1960
  fileName: "TanStackTable.vue",
1961
1961
  dirPath: "components/UI",
1962
1962
  fileContent:
1963
- '<template>\n <div>\n <div :class="styles({ class: props.class })">\n <UITable :class="tableClass">\n <UITableHeader>\n <UITableRow v-for="headerGroup in table.getHeaderGroups()" :key="headerGroup.id">\n <UITableHead\n v-for="header in headerGroup.headers"\n :key="header.id"\n :colspan="header.colSpan"\n @click="header.column.getToggleSortingHandler()?.($event)"\n :class="[header.column.getCanSort() && \'cursor-pointer select-none\']"\n >\n <template v-if="!header.isPlaceholder">\n <div class="flex items-center gap-3">\n <FlexRender\n :render="header.column.columnDef.header"\n :props="header.getContext()"\n />\n <Icon\n v-if="header.column.getCanSort() && header.column.getIsSorted() === \'asc\'"\n :name="ascIcon"\n class="h-4 w-4"\n />\n <Icon\n v-else-if="header.column.getCanSort() && header.column.getIsSorted() === \'desc\'"\n :name="descIcon"\n class="h-4 w-4"\n />\n <Icon\n v-else-if="header.column.getCanSort() && !header.column.getIsSorted()"\n :name="unsortedIcon"\n class="h-5 w-5"\n />\n </div>\n </template>\n </UITableHead>\n </UITableRow>\n </UITableHeader>\n\n <UITableBody>\n <UITableRow\n v-for="row in table.getRowModel().rows"\n :key="row.id"\n :data-state="row.getIsSelected() ? \'selected\' : \'\'"\n >\n <UITableCell v-for="cell in row.getVisibleCells()" :key="cell.id">\n <FlexRender :render="cell.column.columnDef.cell" :props="cell.getContext()" />\n </UITableCell>\n </UITableRow>\n\n <UITableEmpty\n v-if="table.getRowModel().rows.length === 0"\n :colspan="table.getAllLeafColumns().length"\n >\n <slot :table="table" name="empty"> No data available. </slot>\n </UITableEmpty>\n </UITableBody>\n </UITable>\n </div>\n\n <div\n v-if="showPagination"\n class="my-6 flex flex-col justify-between gap-4 px-2 md:flex-row md:items-center"\n >\n <div class="flex items-center justify-between gap-3">\n <slot name="rowsSelected" :table="table">\n <div v-if="showSelect" class="whitespace-nowrap text-sm text-muted-foreground">\n <span>\n {{ table.getFilteredSelectedRowModel().rows.length }} of {{ " " }}\n {{ table.getFilteredRowModel().rows.length }} row(s) selected\n </span>\n </div>\n </slot>\n <slot name="rowsPerPage" :table="table">\n <div class="flex items-center space-x-2 whitespace-nowrap">\n <p class="hidden text-sm font-medium text-foreground md:inline-block">\n {{ rowsPerPageText }}\n </p>\n <UISelect v-model="pageSize">\n <UISelectTrigger class="h-9 w-[70px]">\n {{ table.getState().pagination.pageSize }}\n </UISelectTrigger>\n <UISelectContent side="top" align="start">\n <UISelectGroup>\n <UISelectItem\n v-for="pageSize in pageSizes"\n :key="pageSize"\n :value="`${pageSize}`"\n >\n {{ pageSize }}\n </UISelectItem>\n </UISelectGroup>\n </UISelectContent>\n </UISelect>\n </div>\n </slot>\n </div>\n\n <div class="flex items-center justify-between gap-3">\n <slot :table="table" name="page">\n <div\n class="flex items-center justify-center whitespace-nowrap text-sm font-medium text-foreground"\n >\n Page {{ table.getState().pagination.pageIndex + 1 }} of\n {{ table.getPageCount() }}\n </div>\n </slot>\n\n <slot :table="table" name="pageButtons">\n <div class="flex items-center space-x-2">\n <UIButton\n variant="outline"\n title="First page"\n class="h-9 w-9 p-0"\n :disabled="!table.getCanPreviousPage()"\n @click="table.setPageIndex(0)"\n >\n <Icon name="lucide:chevrons-left" class="h-4 w-4" />\n </UIButton>\n <UIButton\n variant="outline"\n title="Previous page"\n class="h-9 w-9 p-0"\n :disabled="!table.getCanPreviousPage()"\n @click="table.previousPage()"\n >\n <Icon name="lucide:chevron-left" class="h-4 w-4" />\n </UIButton>\n <UIButton\n variant="outline"\n title="Next page"\n class="h-9 w-9 p-0"\n :disabled="!table.getCanNextPage()"\n @click="table.nextPage()"\n >\n <Icon name="lucide:chevron-right" class="h-4 w-4" />\n </UIButton>\n <UIButton\n variant="outline"\n title="Last page"\n class="h-9 w-9 p-0"\n :disabled="!table.getCanNextPage()"\n @click="table.setPageIndex(table.getPageCount() - 1)"\n >\n <Icon name="lucide:chevrons-right" class="h-4 w-4" />\n </UIButton>\n </div>\n </slot>\n </div>\n </div>\n </div>\n</template>\n\n<script lang="ts" setup generic="T">\n import CheckBox from "@/components/UI/Checkbox/Checkbox.vue";\n import {\n FlexRender,\n getCoreRowModel,\n getFilteredRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n useVueTable,\n } from "@tanstack/vue-table";\n import type { ColumnDef, SortingState, Table } from "@tanstack/vue-table";\n\n const props = withDefaults(\n defineProps<{\n data?: T[];\n columns?: ColumnDef<T>[];\n search?: string;\n showSelect?: boolean;\n pageSizes?: number[];\n pageSize?: number;\n sorting?: SortingState;\n tableClass?: any;\n ascIcon?: string;\n descIcon?: string;\n unsortedIcon?: string;\n class?: any;\n showPagination?: boolean;\n rowsPerPageText?: string;\n }>(),\n {\n pageSizes: () => [10, 20, 30, 40, 50, 100],\n pageSize: () => 10,\n columns: () => [],\n data: () => [],\n sorting: () => [],\n ascIcon: "heroicons:chevron-up",\n descIcon: "heroicons:chevron-down",\n unsortedIcon: "heroicons:chevron-up-down",\n showPagination: true,\n rowsPerPageText: "Rows per page:",\n }\n );\n\n defineOptions({ inheritAttrs: false });\n\n const styles = tv({\n base: "w-full overflow-x-auto",\n });\n\n const checkBoxHeader: ColumnDef<any> = {\n id: "checkbox",\n header: ({ table }) => {\n return h(CheckBox, {\n checked: table.getIsAllRowsSelected(),\n "onUpdate:checked": (value: boolean) => table.toggleAllPageRowsSelected(!!value),\n ariaLabel: "Select all",\n });\n },\n cell: ({ row }) => {\n return h(CheckBox, {\n checked: row.getIsSelected(),\n "onUpdate:checked": (value) => row.toggleSelected(!!value),\n ariaLabel: "Select row",\n });\n },\n enableSorting: false,\n enableHiding: false,\n };\n\n const localColumns: ColumnDef<T>[] = [...props.columns];\n\n if (props.showSelect) {\n localColumns.unshift(checkBoxHeader);\n }\n\n const emit = defineEmits<{\n ready: [table: Table<T>];\n }>();\n\n const localSorting = ref(props.sorting);\n const globalFilter = ref(props.search);\n const columnVisibility = ref({});\n const rowSelection = ref({});\n\n const table = useVueTable({\n get data() {\n return props.data;\n },\n get columns() {\n return localColumns;\n },\n initialState: {\n pagination: {\n pageSize: props.pageSize,\n },\n rowSelection: rowSelection.value,\n globalFilter: props.search,\n },\n state: {\n get sorting() {\n return localSorting.value;\n },\n get globalFilter() {\n return props.search;\n },\n get columnVisibility() {\n return columnVisibility.value;\n },\n get rowSelection() {\n return rowSelection.value;\n },\n },\n onSortingChange: (updaterOrValue) => {\n localSorting.value =\n typeof updaterOrValue === "function" ? updaterOrValue(localSorting.value) : updaterOrValue;\n },\n onGlobalFilterChange: (updaterOrValue) => {\n globalFilter.value =\n typeof updaterOrValue === "function" ? updaterOrValue(globalFilter.value) : updaterOrValue;\n },\n onRowSelectionChange: (updaterOrValue) => {\n rowSelection.value =\n typeof updaterOrValue === "function" ? updaterOrValue(rowSelection.value) : updaterOrValue;\n },\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel(),\n getPaginationRowModel: getPaginationRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n enableRowSelection: () => !!props.showSelect,\n });\n\n function toggleColumnVisibility(column: any) {\n columnVisibility.value = {\n ...columnVisibility.value,\n [column.id]: !column.getIsVisible(),\n };\n }\n\n const pageSize = computed({\n get() {\n return table.getState().pagination.pageSize.toString();\n },\n set(value) {\n table.setPageSize(Number(value));\n },\n });\n\n onMounted(() => {\n emit("ready", table);\n });\n\n defineExpose({ toggleColumnVisibility });\n</script>\n',
1963
+ '<template>\n <div>\n <div :class="styles({ class: props.class })">\n <UITable :class="tableClass">\n <UITableHeader>\n <UITableRow v-for="headerGroup in table.getHeaderGroups()" :key="headerGroup.id">\n <UITableHead\n v-for="header in headerGroup.headers"\n :key="header.id"\n :colspan="header.colSpan"\n @click="header.column.getToggleSortingHandler()?.($event)"\n :class="[header.column.getCanSort() && \'cursor-pointer select-none\']"\n >\n <template v-if="!header.isPlaceholder">\n <div class="flex items-center gap-3">\n <FlexRender\n :render="header.column.columnDef.header"\n :props="header.getContext()"\n />\n <Icon\n v-if="header.column.getCanSort() && header.column.getIsSorted() === \'asc\'"\n :name="ascIcon"\n class="h-4 w-4"\n />\n <Icon\n v-else-if="header.column.getCanSort() && header.column.getIsSorted() === \'desc\'"\n :name="descIcon"\n class="h-4 w-4"\n />\n <Icon\n v-else-if="header.column.getCanSort() && !header.column.getIsSorted()"\n :name="unsortedIcon"\n class="h-5 w-5"\n />\n </div>\n </template>\n </UITableHead>\n </UITableRow>\n </UITableHeader>\n\n <UITableBody>\n <UITableRow\n v-for="row in table.getRowModel().rows"\n :key="row.id"\n :data-state="row.getIsSelected() ? \'selected\' : \'\'"\n >\n <UITableCell v-for="cell in row.getVisibleCells()" :key="cell.id">\n <FlexRender :render="cell.column.columnDef.cell" :props="cell.getContext()" />\n </UITableCell>\n </UITableRow>\n\n <UITableEmpty\n v-if="table.getRowModel().rows.length === 0"\n :colspan="table.getAllLeafColumns().length"\n >\n <slot :table="table" name="empty"> No data available. </slot>\n </UITableEmpty>\n </UITableBody>\n </UITable>\n </div>\n\n <div\n v-if="showPagination"\n class="my-6 flex flex-col justify-between gap-4 px-2 md:flex-row md:items-center"\n >\n <div class="flex items-center justify-between gap-3">\n <slot name="rowsSelected" :table="table">\n <div v-if="showSelect" class="whitespace-nowrap text-sm text-muted-foreground">\n <span>\n {{ table.getFilteredSelectedRowModel().rows.length }} of {{ " " }}\n {{ table.getFilteredRowModel().rows.length }} row(s) selected\n </span>\n </div>\n </slot>\n <slot name="rowsPerPage" :table="table">\n <div class="flex items-center space-x-2 whitespace-nowrap">\n <p class="hidden text-sm font-medium text-foreground md:inline-block">\n {{ rowsPerPageText }}\n </p>\n <UISelect v-model="pageSize">\n <UISelectTrigger class="h-9 w-[70px]">\n {{ table.getState().pagination.pageSize }}\n </UISelectTrigger>\n <UISelectContent side="top" align="start">\n <UISelectGroup>\n <UISelectItem\n v-for="pageSize in pageSizes"\n :key="pageSize"\n :value="`${pageSize}`"\n >\n {{ pageSize }}\n </UISelectItem>\n </UISelectGroup>\n </UISelectContent>\n </UISelect>\n </div>\n </slot>\n </div>\n\n <div class="flex items-center justify-between gap-3">\n <slot :table="table" name="page">\n <div\n class="flex items-center justify-center whitespace-nowrap text-sm font-medium text-foreground"\n >\n Page {{ table.getState().pagination.pageIndex + 1 }} of\n {{ table.getPageCount() }}\n </div>\n </slot>\n\n <slot :table="table" name="pageButtons">\n <div class="flex items-center space-x-2">\n <UIButton\n variant="outline"\n title="First page"\n class="h-9 w-9 p-0"\n :disabled="!table.getCanPreviousPage()"\n @click="table.setPageIndex(0)"\n >\n <Icon name="lucide:chevrons-left" class="h-4 w-4" />\n </UIButton>\n <UIButton\n variant="outline"\n title="Previous page"\n class="h-9 w-9 p-0"\n :disabled="!table.getCanPreviousPage()"\n @click="table.previousPage()"\n >\n <Icon name="lucide:chevron-left" class="h-4 w-4" />\n </UIButton>\n <UIButton\n variant="outline"\n title="Next page"\n class="h-9 w-9 p-0"\n :disabled="!table.getCanNextPage()"\n @click="table.nextPage()"\n >\n <Icon name="lucide:chevron-right" class="h-4 w-4" />\n </UIButton>\n <UIButton\n variant="outline"\n title="Last page"\n class="h-9 w-9 p-0"\n :disabled="!table.getCanNextPage()"\n @click="table.setPageIndex(table.getPageCount() - 1)"\n >\n <Icon name="lucide:chevrons-right" class="h-4 w-4" />\n </UIButton>\n </div>\n </slot>\n </div>\n </div>\n </div>\n</template>\n\n<script lang="ts" setup generic="T">\n import CheckBox from "@/components/UI/Checkbox/Checkbox.vue";\n import {\n FlexRender,\n getCoreRowModel,\n getFilteredRowModel,\n getPaginationRowModel,\n getSortedRowModel,\n useVueTable,\n } from "@tanstack/vue-table";\n import type { ColumnDef, SortingState, Table } from "@tanstack/vue-table";\n\n const props = withDefaults(\n defineProps<{\n data?: T[];\n columns?: ColumnDef<T>[];\n search?: string;\n showSelect?: boolean;\n pageSizes?: number[];\n pageSize?: number;\n sorting?: SortingState;\n tableClass?: any;\n ascIcon?: string;\n descIcon?: string;\n unsortedIcon?: string;\n class?: any;\n showPagination?: boolean;\n rowsPerPageText?: string;\n }>(),\n {\n pageSizes: () => [10, 20, 30, 40, 50, 100],\n pageSize: () => 10,\n columns: () => [],\n data: () => [],\n sorting: () => [],\n ascIcon: "heroicons:chevron-up",\n descIcon: "heroicons:chevron-down",\n unsortedIcon: "heroicons:chevron-up-down",\n showPagination: true,\n rowsPerPageText: "Rows per page:",\n }\n );\n\n defineOptions({ inheritAttrs: false });\n\n const styles = tv({\n base: "w-full overflow-x-auto",\n });\n\n const checkBoxHeader: ColumnDef<any> = {\n id: "checkbox",\n header: ({ table }) => {\n return h(\n "div",\n { class: "flex items-center justify-center" },\n h(CheckBox, {\n checked: table.getIsAllRowsSelected(),\n "onUpdate:checked": (value: boolean) => table.toggleAllPageRowsSelected(!!value),\n ariaLabel: "Select all",\n })\n );\n },\n cell: ({ row }) => {\n return h(\n "div",\n { class: "flex items-center justify-center " },\n h(CheckBox, {\n checked: row.getIsSelected(),\n "onUpdate:checked": (value) => row.toggleSelected(!!value),\n ariaLabel: "Select row",\n })\n );\n },\n enableSorting: false,\n enableHiding: false,\n };\n\n const localColumns: ColumnDef<T>[] = [...props.columns];\n\n if (props.showSelect) {\n localColumns.unshift(checkBoxHeader);\n }\n\n const emit = defineEmits<{\n ready: [table: Table<T>];\n }>();\n\n const localSorting = ref(props.sorting);\n const globalFilter = ref(props.search);\n const columnVisibility = ref({});\n const rowSelection = ref({});\n\n const table = useVueTable({\n get data() {\n return props.data;\n },\n get columns() {\n return localColumns;\n },\n initialState: {\n pagination: {\n pageSize: props.pageSize,\n },\n rowSelection: rowSelection.value,\n globalFilter: props.search,\n },\n state: {\n get sorting() {\n return localSorting.value;\n },\n get globalFilter() {\n return props.search;\n },\n get columnVisibility() {\n return columnVisibility.value;\n },\n get rowSelection() {\n return rowSelection.value;\n },\n },\n onSortingChange: (updaterOrValue) => {\n localSorting.value =\n typeof updaterOrValue === "function" ? updaterOrValue(localSorting.value) : updaterOrValue;\n },\n onGlobalFilterChange: (updaterOrValue) => {\n globalFilter.value =\n typeof updaterOrValue === "function" ? updaterOrValue(globalFilter.value) : updaterOrValue;\n },\n onRowSelectionChange: (updaterOrValue) => {\n rowSelection.value =\n typeof updaterOrValue === "function" ? updaterOrValue(rowSelection.value) : updaterOrValue;\n },\n getCoreRowModel: getCoreRowModel(),\n getSortedRowModel: getSortedRowModel(),\n getPaginationRowModel: getPaginationRowModel(),\n getFilteredRowModel: getFilteredRowModel(),\n enableRowSelection: () => !!props.showSelect,\n });\n\n function toggleColumnVisibility(column: any) {\n columnVisibility.value = {\n ...columnVisibility.value,\n [column.id]: !column.getIsVisible(),\n };\n }\n\n const pageSize = computed({\n get() {\n return table.getState().pagination.pageSize.toString();\n },\n set(value) {\n table.setPageSize(Number(value));\n },\n });\n\n onMounted(() => {\n emit("ready", table);\n });\n\n defineExpose({ toggleColumnVisibility });\n</script>\n',
1964
1964
  },
1965
1965
  ],
1966
1966
  utils: [],
@@ -1978,7 +1978,7 @@ export default [
1978
1978
  fileName: "Textarea.vue",
1979
1979
  dirPath: "components/UI",
1980
1980
  fileContent:
1981
- '<template>\n <textarea :class="styles({ class: props.class })" v-bind="forwarded" v-model="localModel" />\n</template>\n\n<script lang="ts" setup>\n import { useForwardPropsEmits } from "radix-vue";\n\n const props = defineProps<{\n class?: any;\n name?: string;\n id?: string;\n placeholder?: string;\n required?: boolean;\n disabled?: boolean;\n rows?: number;\n modelValue?: string;\n }>();\n\n const emits = defineEmits<{\n "update:modelValue": [value: any];\n }>();\n const forwarded = useForwardPropsEmits(useOmit(props, ["class"]), emits);\n\n const localModel = useVModel(props, "modelValue", emits);\n\n const styles = tv({\n base: "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 ring-offset-background placeholder:text-muted-foreground 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',
1981
+ '<template>\n <textarea :class="styles({ class: props.class })" v-bind="props" v-model="localModel" />\n</template>\n\n<script lang="ts" setup>\n const props = defineProps<{\n class?: any;\n name?: string;\n id?: string;\n placeholder?: string;\n required?: boolean;\n disabled?: boolean;\n rows?: number;\n modelValue?: string;\n }>();\n\n const emits = defineEmits<{\n "update:modelValue": [value: any];\n }>();\n\n const localModel = useVModel(props, "modelValue", emits);\n\n const styles = tv({\n base: "flex min-h-[80px] w-full rounded-md border border-input bg-background px-3 py-2 ring-offset-background placeholder:text-muted-foreground 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',
1982
1982
  },
1983
1983
  ],
1984
1984
  utils: [],
@@ -2106,7 +2106,7 @@ export default [
2106
2106
  fileName: "Tooltip/Tooltip.vue",
2107
2107
  dirPath: "components/UI",
2108
2108
  fileContent:
2109
- '<template>\n <UITooltipProvider v-bind="props">\n <TooltipRoot v-bind="forwarded">\n <slot>\n <slot name="trigger"></slot>\n <slot name="content"></slot>\n </slot>\n </TooltipRoot>\n </UITooltipProvider>\n</template>\n\n<script lang="ts" setup>\n import { TooltipRoot, useForwardPropsEmits } from "radix-vue";\n import type { TooltipProviderProps, TooltipRootEmits, TooltipRootProps } from "radix-vue";\n\n const props = withDefaults(defineProps<TooltipRootProps & TooltipProviderProps>(), {\n delayDuration: 200,\n });\n\n const emits = defineEmits<TooltipRootEmits>();\n\n const forwarded = useForwardPropsEmits(props, emits);\n</script>\n',
2109
+ '<template>\n <UITooltipProvider v-bind="props">\n <TooltipRoot v-bind="{ ...forwarded, ...$attrs }">\n <slot>\n <slot name="trigger"></slot>\n <slot name="content"></slot>\n </slot>\n </TooltipRoot>\n </UITooltipProvider>\n</template>\n\n<script lang="ts" setup>\n import { TooltipRoot, useForwardPropsEmits } from "radix-vue";\n import type { TooltipProviderProps, TooltipRootEmits, TooltipRootProps } from "radix-vue";\n\n defineOptions({ inheritAttrs: false });\n const props = withDefaults(defineProps<TooltipRootProps & TooltipProviderProps>(), {\n delayDuration: 200,\n });\n\n const emits = defineEmits<TooltipRootEmits>();\n\n const forwarded = useForwardPropsEmits(props, emits);\n</script>\n',
2110
2110
  },
2111
2111
  {
2112
2112
  fileName: "Tooltip/Trigger.vue",
@@ -2122,7 +2122,13 @@ export default [
2122
2122
  {
2123
2123
  name: "VeeMultiSelect",
2124
2124
  value: "vee-multi-select",
2125
- deps: ["@vee-validate/nuxt", "radix-vue", "@morev/vue-transitions", "tailwind-variants"],
2125
+ deps: [
2126
+ "@vee-validate/nuxt",
2127
+ "radix-vue",
2128
+ "@morev/vue-transitions",
2129
+ "tailwind-variants",
2130
+ "@vueform/multiselect",
2131
+ ],
2126
2132
  askValidator: true,
2127
2133
  devDeps: ["nuxt-icon"],
2128
2134
  nuxtModules: ["@vee-validate/nuxt", "@morev/vue-transitions/nuxt", "nuxt-icon"],
@@ -2212,7 +2218,7 @@ export default [
2212
2218
  fileName: "Vee/RadioGroup.vue",
2213
2219
  dirPath: "components/UI",
2214
2220
  fileContent:
2215
- '<template>\n <div :class="styles({ class: props.class })">\n <slot name="label" :errorMessage="errorMessage" :value="value">\n <UILabel\n v-if="label"\n class="mb-5 leading-none"\n :class="[errorMessage && \'text-destructive\']"\n >{{ label }}</UILabel\n >\n </slot>\n <UIRadioGroup v-bind="{ ...forwarded, ...$attrs }" v-model="value">\n <slot></slot>\n </UIRadioGroup>\n <div class="flex flex-col gap-1.5">\n <TransitionSlide tag="div" group>\n <slot name="hint" :errorMessage="errorMessage" :value="value">\n <p\n key="hint"\n class="mt-1.5 text-sm leading-none text-muted-foreground"\n v-if="hint && !errorMessage"\n >\n {{ hint }}\n </p>\n </slot>\n <slot name="errorMessage" :errorMessage="errorMessage" :value="value">\n <p\n key="errorMessage"\n class="mt-1.5 text-sm leading-none text-destructive"\n v-if="errorMessage"\n >\n {{ errorMessage }}\n </p>\n </slot>\n </TransitionSlide>\n </div>\n </div>\n</template>\n\n<script lang="ts" setup>\n import { useForwardProps } from "radix-vue";\n import type { RadioGroupRootProps } from "radix-vue";\n\n const props = defineProps<\n RadioGroupRootProps & {\n label?: string;\n hint?: string;\n id?: string;\n rules?: any;\n validateOnMount?: boolean;\n class?: any;\n name: string;\n }\n >();\n\n const forwarded = useForwardProps(\n useOmit(props, ["label", "hint", "id", "rules", "validateOnMount", "class"])\n );\n const styles = tv({\n base: "flex flex-col",\n });\n\n defineOptions({ inheritAttrs: false });\n\n const { errorMessage, value } = useField(() => props.name, props.rules, {\n initialValue: props.modelValue,\n label: props.label,\n validateOnMount: props.validateOnMount,\n type: "radio",\n syncVModel: true,\n });\n</script>\n',
2221
+ '<template>\n <div :class="styles({ class: props.class })">\n <slot name="label" :errorMessage="errorMessage" :value="value">\n <UILabel\n v-if="label"\n class="mb-5 leading-none"\n :class="[errorMessage && \'text-destructive\']"\n >{{ label }}</UILabel\n >\n </slot>\n <UIRadioGroup v-bind="{ ...forwarded, ...$attrs }" v-model="value">\n <slot></slot>\n </UIRadioGroup>\n <div class="flex flex-col gap-1.5">\n <TransitionSlide tag="div" group>\n <slot name="hint" :errorMessage="errorMessage" :value="value">\n <p\n key="hint"\n class="mt-1.5 text-sm leading-none text-muted-foreground"\n v-if="hint && !errorMessage"\n >\n {{ hint }}\n </p>\n </slot>\n <slot name="errorMessage" :errorMessage="errorMessage" :value="value">\n <p\n key="errorMessage"\n class="mt-1.5 text-sm leading-none text-destructive"\n v-if="errorMessage"\n >\n {{ errorMessage }}\n </p>\n </slot>\n </TransitionSlide>\n </div>\n </div>\n</template>\n\n<script lang="ts" setup>\n import { useForwardProps } from "radix-vue";\n import type { RadioGroupRootProps } from "radix-vue";\n\n const props = defineProps<\n RadioGroupRootProps & {\n label?: string;\n hint?: string;\n id?: string;\n rules?: any;\n validateOnMount?: boolean;\n class?: any;\n name: string;\n }\n >();\n\n const forwarded = useForwardProps(props);\n const styles = tv({\n base: "flex flex-col",\n });\n\n defineOptions({ inheritAttrs: false });\n\n const { errorMessage, value } = useField(() => props.name, props.rules, {\n initialValue: props.modelValue,\n label: props.label,\n validateOnMount: props.validateOnMount,\n type: "radio",\n syncVModel: true,\n });\n</script>\n',
2216
2222
  },
2217
2223
  ],
2218
2224
  utils: [],