una-nuxt-module 2.1.26 → 2.1.28

package/.nuxt/templates/accordion/Accordion.vue

@@ -0,0 +1,19 @@
+<script setup lang="ts">
+import type { AccordionRootEmits, AccordionRootProps } from "reka-ui"
+import {
+  AccordionRoot,
+
+  useForwardPropsEmits,
+} from "reka-ui"
+
+const props = defineProps<AccordionRootProps>()
+const emits = defineEmits<AccordionRootEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
+</script>
+
+<template>
+  <AccordionRoot data-slot="accordion" v-bind="forwarded">
+    <slot />
+  </AccordionRoot>
+</template>

package/.nuxt/templates/accordion/AccordionContent.vue

@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import type { AccordionContentProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import { AccordionContent } from "reka-ui"
+import { cn } from '~/src/runtime/lib/utils'
+
+const props = defineProps<AccordionContentProps & { class?: HTMLAttributes["class"] }>()
+
+const delegatedProps = reactiveOmit(props, "class")
+</script>
+
+<template>
+  <AccordionContent
+    data-slot="accordion-content"
+    v-bind="delegatedProps"
+    class="data-[state=closed]:animate-accordion-up data-[state=open]:animate-accordion-down overflow-hidden text-sm"
+  >
+    <div :class="cn('pt-0 pb-4', props.class)">
+      <slot />
+    </div>
+  </AccordionContent>
+</template>

package/.nuxt/templates/accordion/AccordionItem.vue

@@ -0,0 +1,23 @@
+<script setup lang="ts">
+import type { AccordionItemProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import { AccordionItem, useForwardProps } from "reka-ui"
+import { cn } from '~/src/runtime/lib/utils'
+
+const props = defineProps<AccordionItemProps & { class?: HTMLAttributes["class"] }>()
+
+const delegatedProps = reactiveOmit(props, "class")
+
+const forwardedProps = useForwardProps(delegatedProps)
+</script>
+
+<template>
+  <AccordionItem
+    data-slot="accordion-item"
+    v-bind="forwardedProps"
+    :class="cn('border-b last:border-b-0', props.class)"
+  >
+    <slot />
+  </AccordionItem>
+</template>

package/.nuxt/templates/accordion/AccordionTrigger.vue

@@ -0,0 +1,38 @@
+<script setup lang="ts">
+import type { AccordionTriggerProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import { ChevronDown } from "lucide-vue-next"
+import {
+  AccordionHeader,
+  AccordionTrigger,
+
+} from "reka-ui"
+import { cn } from '~/src/runtime/lib/utils'
+
+const props = defineProps<AccordionTriggerProps & { class?: HTMLAttributes["class"] }>()
+
+const delegatedProps = reactiveOmit(props, "class")
+</script>
+
+<template>
+  <AccordionHeader class="flex">
+    <AccordionTrigger
+      data-slot="accordion-trigger"
+      v-bind="delegatedProps"
+      :class="
+        cn(
+          'focus-visible:border-ring focus-visible:ring-ring/50 flex flex-1 items-start justify-between gap-4 rounded-md py-4 text-left text-sm font-medium transition-all outline-none hover:underline focus-visible:ring-[3px] disabled:pointer-events-none disabled:opacity-50 [&[data-state=open]>svg]:rotate-180',
+          props.class,
+        )
+      "
+    >
+      <slot />
+      <slot name="icon">
+        <ChevronDown
+          class="text-muted-foreground pointer-events-none size-4 shrink-0 translate-y-0.5 transition-transform duration-200"
+        />
+      </slot>
+    </AccordionTrigger>
+  </AccordionHeader>
+</template>

package/.nuxt/templates/accordion/index.ts

@@ -0,0 +1,4 @@
+export { default as Accordion } from "./Accordion.vue"
+export { default as AccordionContent } from "./AccordionContent.vue"
+export { default as AccordionItem } from "./AccordionItem.vue"
+export { default as AccordionTrigger } from "./AccordionTrigger.vue"

package/.nuxt/templates/alert/Alert.vue

@@ -0,0 +1,21 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from "vue"
+import type { AlertVariants } from "."
+import { cn } from '~/src/runtime/lib/utils'
+import { alertVariants } from "."
+
+const props = defineProps<{
+  class?: HTMLAttributes["class"]
+  variant?: AlertVariants["variant"]
+}>()
+</script>
+
+<template>
+  <div
+    data-slot="alert"
+    :class="cn(alertVariants({ variant }), props.class)"
+    role="alert"
+  >
+    <slot />
+  </div>
+</template>

package/.nuxt/templates/alert/AlertDescription.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from "vue"
+import { cn } from '~/src/runtime/lib/utils'
+
+const props = defineProps<{
+  class?: HTMLAttributes["class"]
+}>()
+</script>
+
+<template>
+  <div
+    data-slot="alert-description"
+    :class="cn('text-muted-foreground col-start-2 grid justify-items-start gap-1 text-sm [&_p]:leading-relaxed', props.class)"
+  >
+    <slot />
+  </div>
+</template>

package/.nuxt/templates/alert/AlertTitle.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from "vue"
+import { cn } from '~/src/runtime/lib/utils'
+
+const props = defineProps<{
+  class?: HTMLAttributes["class"]
+}>()
+</script>
+
+<template>
+  <div
+    data-slot="alert-title"
+    :class="cn('col-start-2 line-clamp-1 min-h-4 font-medium tracking-tight', props.class)"
+  >
+    <slot />
+  </div>
+</template>

package/.nuxt/templates/alert/index.ts

@@ -0,0 +1,24 @@
+import type { VariantProps } from "class-variance-authority"
+import { cva } from "class-variance-authority"
+
+export { default as Alert } from "./Alert.vue"
+export { default as AlertDescription } from "./AlertDescription.vue"
+export { default as AlertTitle } from "./AlertTitle.vue"
+
+export const alertVariants = cva(
+  "relative w-full rounded-lg border px-4 py-3 text-sm grid has-[>svg]:grid-cols-[calc(var(--spacing)*4)_1fr] grid-cols-[0_1fr] has-[>svg]:gap-x-3 gap-y-0.5 items-start [&>svg]:size-4 [&>svg]:translate-y-0.5 [&>svg]:text-current",
+  {
+    variants: {
+      variant: {
+        default: "bg-card text-card-foreground",
+        destructive:
+          "text-destructive bg-card [&>svg]:text-current *:data-[slot=alert-description]:text-destructive/90",
+      },
+    },
+    defaultVariants: {
+      variant: "default",
+    },
+  },
+)
+
+export type AlertVariants = VariantProps<typeof alertVariants>

package/.nuxt/templates/alert-dialog/AlertDialog.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+import type { AlertDialogEmits, AlertDialogProps } from "reka-ui"
+import { AlertDialogRoot, useForwardPropsEmits } from "reka-ui"
+
+const props = defineProps<AlertDialogProps>()
+const emits = defineEmits<AlertDialogEmits>()
+
+const forwarded = useForwardPropsEmits(props, emits)
+</script>
+
+<template>
+  <AlertDialogRoot data-slot="alert-dialog" v-bind="forwarded">
+    <slot />
+  </AlertDialogRoot>
+</template>

package/.nuxt/templates/alert-dialog/AlertDialogAction.vue

@@ -0,0 +1,18 @@
+<script setup lang="ts">
+import type { AlertDialogActionProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import { AlertDialogAction } from "reka-ui"
+import { cn } from '~/src/runtime/lib/utils'
+import { buttonVariants } from '~/src/runtime/components/ui/button'
+
+const props = defineProps<AlertDialogActionProps & { class?: HTMLAttributes["class"] }>()
+
+const delegatedProps = reactiveOmit(props, "class")
+</script>
+
+<template>
+  <AlertDialogAction v-bind="delegatedProps" :class="cn(buttonVariants(), props.class)">
+    <slot />
+  </AlertDialogAction>
+</template>

package/.nuxt/templates/alert-dialog/AlertDialogCancel.vue

@@ -0,0 +1,25 @@
+<script setup lang="ts">
+import type { AlertDialogCancelProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import { AlertDialogCancel } from "reka-ui"
+import { cn } from '~/src/runtime/lib/utils'
+import { buttonVariants } from '~/src/runtime/components/ui/button'
+
+const props = defineProps<AlertDialogCancelProps & { class?: HTMLAttributes["class"] }>()
+
+const delegatedProps = reactiveOmit(props, "class")
+</script>
+
+<template>
+  <AlertDialogCancel
+    v-bind="delegatedProps"
+    :class="cn(
+      buttonVariants({ variant: 'outline' }),
+      'mt-2 sm:mt-0',
+      props.class,
+    )"
+  >
+    <slot />
+  </AlertDialogCancel>
+</template>

package/.nuxt/templates/alert-dialog/AlertDialogContent.vue

@@ -0,0 +1,41 @@
+<script setup lang="ts">
+import type { AlertDialogContentEmits, AlertDialogContentProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import {
+  AlertDialogContent,
+
+  AlertDialogOverlay,
+  AlertDialogPortal,
+  useForwardPropsEmits,
+} from "reka-ui"
+import { cn } from '~/src/runtime/lib/utils'
+
+const props = defineProps<AlertDialogContentProps & { class?: HTMLAttributes["class"] }>()
+const emits = defineEmits<AlertDialogContentEmits>()
+
+const delegatedProps = reactiveOmit(props, "class")
+
+const forwarded = useForwardPropsEmits(delegatedProps, emits)
+</script>
+
+<template>
+  <AlertDialogPortal>
+    <AlertDialogOverlay
+      data-slot="alert-dialog-overlay"
+      class="data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 fixed inset-0 z-50 bg-black/80"
+    />
+    <AlertDialogContent
+      data-slot="alert-dialog-content"
+      v-bind="forwarded"
+      :class="
+        cn(
+          'bg-background 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 fixed top-[50%] left-[50%] z-50 grid w-full max-w-[calc(100%-2rem)] translate-x-[-50%] translate-y-[-50%] gap-4 rounded-lg border p-6 shadow-lg duration-200 sm:max-w-lg',
+          props.class,
+        )
+      "
+    >
+      <slot />
+    </AlertDialogContent>
+  </AlertDialogPortal>
+</template>

package/.nuxt/templates/alert-dialog/AlertDialogDescription.vue

@@ -0,0 +1,24 @@
+<script setup lang="ts">
+import type { AlertDialogDescriptionProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import {
+  AlertDialogDescription,
+
+} from "reka-ui"
+import { cn } from '~/src/runtime/lib/utils'
+
+const props = defineProps<AlertDialogDescriptionProps & { class?: HTMLAttributes["class"] }>()
+
+const delegatedProps = reactiveOmit(props, "class")
+</script>
+
+<template>
+  <AlertDialogDescription
+    data-slot="alert-dialog-description"
+    v-bind="delegatedProps"
+    :class="cn('text-muted-foreground text-sm', props.class)"
+  >
+    <slot />
+  </AlertDialogDescription>
+</template>

package/.nuxt/templates/alert-dialog/AlertDialogFooter.vue

@@ -0,0 +1,22 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from "vue"
+import { cn } from '~/src/runtime/lib/utils'
+
+const props = defineProps<{
+  class?: HTMLAttributes["class"]
+}>()
+</script>
+
+<template>
+  <div
+    data-slot="alert-dialog-footer"
+    :class="
+      cn(
+        'flex flex-col-reverse gap-2 sm:flex-row sm:justify-end',
+        props.class,
+      )
+    "
+  >
+    <slot />
+  </div>
+</template>

package/.nuxt/templates/alert-dialog/AlertDialogHeader.vue

@@ -0,0 +1,17 @@
+<script setup lang="ts">
+import type { HTMLAttributes } from "vue"
+import { cn } from '~/src/runtime/lib/utils'
+
+const props = defineProps<{
+  class?: HTMLAttributes["class"]
+}>()
+</script>
+
+<template>
+  <div
+    data-slot="alert-dialog-header"
+    :class="cn('flex flex-col gap-2 text-center sm:text-left', props.class)"
+  >
+    <slot />
+  </div>
+</template>

package/.nuxt/templates/alert-dialog/AlertDialogTitle.vue

@@ -0,0 +1,21 @@
+<script setup lang="ts">
+import type { AlertDialogTitleProps } from "reka-ui"
+import type { HTMLAttributes } from "vue"
+import { reactiveOmit } from "@vueuse/core"
+import { AlertDialogTitle } from "reka-ui"
+import { cn } from '~/src/runtime/lib/utils'
+
+const props = defineProps<AlertDialogTitleProps & { class?: HTMLAttributes["class"] }>()
+
+const delegatedProps = reactiveOmit(props, "class")
+</script>
+
+<template>
+  <AlertDialogTitle
+    data-slot="alert-dialog-title"
+    v-bind="delegatedProps"
+    :class="cn('text-lg font-semibold', props.class)"
+  >
+    <slot />
+  </AlertDialogTitle>
+</template>

package/.nuxt/templates/alert-dialog/AlertDialogTrigger.vue

@@ -0,0 +1,12 @@
+<script setup lang="ts">
+import type { AlertDialogTriggerProps } from "reka-ui"
+import { AlertDialogTrigger } from "reka-ui"
+
+const props = defineProps<AlertDialogTriggerProps>()
+</script>
+
+<template>
+  <AlertDialogTrigger data-slot="alert-dialog-trigger" v-bind="props">
+    <slot />
+  </AlertDialogTrigger>
+</template>

package/.nuxt/templates/alert-dialog/index.ts

@@ -0,0 +1,9 @@
+export { default as AlertDialog } from "./AlertDialog.vue"
+export { default as AlertDialogAction } from "./AlertDialogAction.vue"
+export { default as AlertDialogCancel } from "./AlertDialogCancel.vue"
+export { default as AlertDialogContent } from "./AlertDialogContent.vue"
+export { default as AlertDialogDescription } from "./AlertDialogDescription.vue"
+export { default as AlertDialogFooter } from "./AlertDialogFooter.vue"
+export { default as AlertDialogHeader } from "./AlertDialogHeader.vue"
+export { default as AlertDialogTitle } from "./AlertDialogTitle.vue"
+export { default as AlertDialogTrigger } from "./AlertDialogTrigger.vue"

package/.nuxt/templates/aspect-ratio/AspectRatio.vue

@@ -0,0 +1,15 @@
+<script setup lang="ts">
+import type { AspectRatioProps } from "reka-ui"
+import { AspectRatio } from "reka-ui"
+
+const props = defineProps<AspectRatioProps>()
+</script>
+
+<template>
+  <AspectRatio
+    data-slot="aspect-ratio"
+    v-bind="props"
+  >
+    <slot />
+  </AspectRatio>
+</template>

package/.nuxt/templates/aspect-ratio/index.ts

@@ -0,0 +1 @@
+export { default as AspectRatio } from "./AspectRatio.vue"

package/.nuxt/templates/auto-form/AutoForm.vue

@@ -0,0 +1,105 @@
+<script setup lang="ts" generic="T extends ZodObjectOrWrapped">
+import type { FormContext, GenericObject } from 'vee-validate'
+import type { z, ZodAny } from 'zod'
+import type { Config, ConfigItem, Dependency, Shape } from './interface'
+import { Form } from '~/src/runtime/components/ui/form'
+import { toTypedSchema } from '@vee-validate/zod'
+import { computed, toRefs } from 'vue'
+import AutoFormField from './AutoFormField.vue'
+import { provideDependencies } from './dependencies'
+import { getBaseSchema, getBaseType, getDefaultValueInZodStack, getObjectFormSchema, type ZodObjectOrWrapped } from './utils'
+
+const props = defineProps<{
+  schema: T
+  form?: FormContext<GenericObject>
+  fieldConfig?: Config<z.infer<T>>
+  dependencies?: Dependency<z.infer<T>>[]
+}>()
+
+const emits = defineEmits<{
+  submit: [event: z.infer<T>]
+}>()
+
+const { dependencies } = toRefs(props)
+provideDependencies(dependencies)
+
+const shapes = computed(() => {
+  // @ts-expect-error ignore {} not assignable to object
+  const val: { [key in keyof T]: Shape } = {}
+  const baseSchema = getObjectFormSchema(props.schema)
+  const shape = baseSchema.shape
+  Object.keys(shape).forEach((name) => {
+    const item = shape[name] as ZodAny
+    const baseItem = getBaseSchema(item) as ZodAny
+    let options = (baseItem && 'values' in baseItem._def) ? baseItem._def.values as string[] : undefined
+    if (!Array.isArray(options) && typeof options === 'object')
+      options = Object.values(options)
+
+    val[name as keyof T] = {
+      type: getBaseType(item),
+      default: getDefaultValueInZodStack(item),
+      options,
+      required: !['ZodOptional', 'ZodNullable'].includes(item._def.typeName),
+      schema: baseItem,
+    }
+  })
+  return val
+})
+
+const fields = computed(() => {
+  // @ts-expect-error ignore {} not assignable to object
+  const val: { [key in keyof z.infer<T>]: { shape: Shape, fieldName: string, config: ConfigItem } } = {}
+  for (const key in shapes.value) {
+    const shape = shapes.value[key]
+    val[key as keyof z.infer<T>] = {
+      shape,
+      config: props.fieldConfig?.[key] as ConfigItem,
+      fieldName: key,
+    }
+  }
+  return val
+})
+
+const formComponent = computed(() => props.form ? 'form' : Form)
+const formComponentProps = computed(() => {
+  if (props.form) {
+    return {
+      onSubmit: props.form.handleSubmit(val => emits('submit', val)),
+    }
+  }
+  else {
+    const formSchema = toTypedSchema(props.schema)
+    return {
+      keepValues: true,
+      validationSchema: formSchema,
+      onSubmit: (val: GenericObject) => emits('submit', val),
+    }
+  }
+})
+</script>
+
+<template>
+  <component
+    :is="formComponent"
+    v-bind="formComponentProps"
+  >
+    <slot name="customAutoForm" :fields="fields">
+      <template v-for="(shape, key) of shapes" :key="key">
+        <slot
+          :shape="shape"
+          :name="key.toString() as keyof z.infer<T>"
+          :field-name="key.toString()"
+          :config="fieldConfig?.[key as keyof typeof fieldConfig] as ConfigItem"
+        >
+          <AutoFormField
+            :config="fieldConfig?.[key as keyof typeof fieldConfig] as ConfigItem"
+            :field-name="key.toString()"
+            :shape="shape"
+          />
+        </slot>
+      </template>
+    </slot>
+
+    <slot :shapes="shapes" />
+  </component>
+</template>

package/.nuxt/templates/auto-form/AutoFormField.vue

@@ -0,0 +1,45 @@
+<script setup lang="ts" generic="U extends ZodAny">
+import type { ZodAny } from 'zod'
+import type { Config, ConfigItem, Shape } from './interface'
+import { computed } from 'vue'
+import { DEFAULT_ZOD_HANDLERS, INPUT_COMPONENTS } from './constant'
+import useDependencies from './dependencies'
+
+const props = defineProps<{
+  fieldName: string
+  shape: Shape
+  config?: ConfigItem | Config<U>
+}>()
+
+function isValidConfig(config: any): config is ConfigItem {
+  return !!config?.component
+}
+
+const delegatedProps = computed(() => {
+  if (['ZodObject', 'ZodArray'].includes(props.shape?.type))
+    return { schema: props.shape?.schema }
+  return undefined
+})
+
+const { isDisabled, isHidden, isRequired, overrideOptions } = useDependencies(props.fieldName)
+</script>
+
+<template>
+  <component
+    :is="isValidConfig(config)
+      ? typeof config.component === 'string'
+        ? INPUT_COMPONENTS[config.component!]
+        : config.component
+      : INPUT_COMPONENTS[DEFAULT_ZOD_HANDLERS[shape.type]] "
+    v-if="!isHidden"
+    :field-name="fieldName"
+    :label="shape.schema?.description"
+    :required="isRequired || shape.required"
+    :options="overrideOptions || shape.options"
+    :disabled="isDisabled"
+    :config="config"
+    v-bind="delegatedProps"
+  >
+    <slot />
+  </component>
+</template>