@una-ui/nuxt 0.53.0 → 0.54.0

package/dist/module.cjs

@@ -0,0 +1,5 @@
+module.exports = function(...args) {
+  return import('./module.mjs').then(m => m.default.call(this, ...args))
+}
+const _meta = module.exports.meta = require('./module.json')
+module.exports.getMeta = () => Promise.resolve(_meta)

package/dist/module.d.ts

@@ -0,0 +1,37 @@
+import * as _nuxt_schema from '@nuxt/schema';
+import { UnaSettings } from '../dist/runtime/types/index.js';
+export * from '../dist/runtime/types/index.js';
+
+declare module '@nuxt/schema' {
+    interface AppConfigInput {
+        una?: Partial<Omit<UnaSettings, 'primaryColors' | 'grayColors'>>;
+    }
+    interface AppConfig {
+        una: Omit<UnaSettings, 'primaryColors' | 'grayColors'>;
+    }
+}
+interface ModuleOptions {
+    /**
+     * @default 'N'
+     */
+    prefix?: string;
+    /**
+     * @default true
+     * @description Enable themeable ui
+     *
+     */
+    themeable?: boolean;
+    /**
+     * @default true
+     * @description Register components globally
+     */
+    global?: boolean;
+    /**
+     * @default false
+     */
+    dev: boolean;
+}
+declare const _default: _nuxt_schema.NuxtModule<ModuleOptions, ModuleOptions, false>;
+
+export { _default as default };
+export type { ModuleOptions };

package/dist/module.json

@@ -1,12 +1,12 @@
 {
   "name": "@una-ui/nuxt",
   "configKey": "una",
-  "version": "0.53.0",
+  "version": "0.54.0",
   "compatibility": {
     "nuxt": ">=3.0.0"
   },
   "builder": {
-    "@nuxt/module-builder": "1.0.1",
+    "@nuxt/module-builder": "0.8.4",
     "unbuild": "3.5.0"
   }
 }

package/dist/module.mjs

@@ -8,7 +8,7 @@ import 'unocss';
 import 'unocss-preset-animations';
 
 const name = "@una-ui/nuxt";
-const version = "0.53.0";
+const version = "0.54.0";
 
 const module = defineNuxtModule({
   meta: {

package/dist/runtime/components/alert-dialog/AlertDialog.vue

@@ -1,47 +1,42 @@
-<script setup>
-import { reactivePick } from "@vueuse/core";
-import { AlertDialogRoot, useForwardPropsEmits, VisuallyHidden } from "reka-ui";
-import { computed } from "vue";
-import { randomId } from "../../utils";
-import AlertDialogAction from "./AlertDialogAction.vue";
-import AlertDialogCancel from "./AlertDialogCancel.vue";
-import AlertDialogContent from "./AlertDialogContent.vue";
-import AlertDialogDescription from "./AlertDialogDescription.vue";
-import AlertDialogFooter from "./AlertDialogFooter.vue";
-import AlertDialogHeader from "./AlertDialogHeader.vue";
-import AlertDialogTitle from "./AlertDialogTitle.vue";
-import AlertDialogTrigger from "./AlertDialogTrigger.vue";
+<script setup lang="ts">
+import type { AlertDialogEmits } from 'reka-ui'
+import type { NAlertDialogProps } from '../../types'
+import { reactivePick } from '@vueuse/core'
+import { AlertDialogRoot, useForwardPropsEmits, VisuallyHidden } from 'reka-ui'
+import { computed } from 'vue'
+import { randomId } from '../../utils'
+import AlertDialogAction from './AlertDialogAction.vue'
+import AlertDialogCancel from './AlertDialogCancel.vue'
+import AlertDialogContent from './AlertDialogContent.vue'
+import AlertDialogDescription from './AlertDialogDescription.vue'
+import AlertDialogFooter from './AlertDialogFooter.vue'
+import AlertDialogHeader from './AlertDialogHeader.vue'
+import AlertDialogTitle from './AlertDialogTitle.vue'
+import AlertDialogTrigger from './AlertDialogTrigger.vue'
+
 defineOptions({
-  inheritAttrs: false
-});
-const props = defineProps({
-  title: { type: String, required: false },
-  description: { type: String, required: false },
-  _alertDialogTitle: { type: Object, required: false },
-  _alertDialogDescription: { type: Object, required: false },
-  _alertDialogContent: { type: Object, required: false },
-  _alertDialogTrigger: { type: Object, required: false },
-  _alertDialogHeader: { type: Object, required: false },
-  _alertDialogFooter: { type: Object, required: false },
-  una: { type: Object, required: false },
-  open: { type: Boolean, required: false },
-  defaultOpen: { type: Boolean, required: false },
-  preventClose: { type: Boolean, required: false },
-  overlay: { type: Boolean, required: false, default: true },
-  _alertDialogCancel: { type: Object, required: false },
-  _alertDialogAction: { type: Object, required: false },
-  _alertDialogOverlay: { type: Object, required: false }
-});
-const emits = defineEmits(["update:open", "cancel", "action"]);
-const DEFAULT_TITLE = randomId("alert-dialog-title");
-const DEFAULT_DESCRIPTION = randomId("alert-dialog-description");
-const title = computed(() => props.title ?? DEFAULT_TITLE);
-const description = computed(() => props.description ?? DEFAULT_DESCRIPTION);
+  inheritAttrs: false,
+})
+
+const props = withDefaults(defineProps<NAlertDialogProps>(), {
+  overlay: true,
+})
+const emits = defineEmits<AlertDialogEmits & {
+  cancel: [Event]
+  action: [Event]
+}>()
+const DEFAULT_TITLE = randomId('alert-dialog-title')
+const DEFAULT_DESCRIPTION = randomId('alert-dialog-description')
+
+const title = computed(() => props.title ?? DEFAULT_TITLE)
+const description = computed(() => props.description ?? DEFAULT_DESCRIPTION)
+
 const rootProps = reactivePick(props, [
-  "open",
-  "defaultOpen"
-]);
-const forwarded = useForwardPropsEmits(rootProps, emits);
+  'open',
+  'defaultOpen',
+])
+
+const forwarded = useForwardPropsEmits(rootProps, emits)
 </script>
 
 <template>
@@ -64,7 +59,7 @@ const forwarded = useForwardPropsEmits(rootProps, emits);
         :prevent-close
         :una
       >
-        <VisuallyHidden v-if="title === DEFAULT_TITLE || !!$slots.title || (description === DEFAULT_DESCRIPTION || !!$slots.description)">
+        <VisuallyHidden v-if="(title === DEFAULT_TITLE || !!$slots.title) || (description === DEFAULT_DESCRIPTION || !!$slots.description)">
           <AlertDialogTitle v-if="title === DEFAULT_TITLE || !!$slots.title">
             {{ title }}
           </AlertDialogTitle>

package/dist/runtime/components/alert-dialog/AlertDialogAction.vue

@@ -1,38 +1,12 @@
-<script setup>
-import { AlertDialogAction } from "reka-ui";
-import Button from "../elements/Button.vue";
-const props = defineProps({
-  onClick: { type: Function, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  type: { type: String, required: false },
-  loadingPlacement: { type: String, required: false },
-  icon: { type: Boolean, required: false },
-  disabled: { type: Boolean, required: false },
-  reverse: { type: Boolean, required: false },
-  loading: { type: Boolean, required: false },
-  block: { type: Boolean, required: false },
-  to: { type: null, required: false },
-  label: { type: String, required: false, default: "Continue" },
-  btn: { type: String, required: false, default: "solid-primary" },
-  leading: { type: String, required: false },
-  trailing: { type: String, required: false },
-  size: { type: String, required: false },
-  una: { type: Object, required: false },
-  square: { type: null, required: false },
-  rounded: { type: null, required: false },
-  class: { type: null, required: false },
-  breadcrumbActive: { type: String, required: false },
-  breadcrumbInactive: { type: String, required: false },
-  paginationSelected: { type: String, required: false },
-  paginationUnselected: { type: String, required: false },
-  dropdownMenu: { type: String, required: false },
-  toggleOn: { type: String, required: false },
-  toggleOff: { type: String, required: false },
-  navigationMenu: { type: String, required: false },
-  navigationMenuLink: { type: String, required: false },
-  ariaLabel: { type: String, required: false }
-});
+<script setup lang="ts">
+import type { NAlertDialogActionProps } from '../../types'
+import { AlertDialogAction } from 'reka-ui'
+import Button from '../elements/Button.vue'
+
+const props = withDefaults(defineProps<NAlertDialogActionProps>(), {
+  btn: 'solid-primary',
+  label: 'Continue',
+})
 </script>
 
 <template>

package/dist/runtime/components/alert-dialog/AlertDialogCancel.vue

@@ -1,39 +1,13 @@
-<script setup>
-import { AlertDialogCancel } from "reka-ui";
-import { cn } from "../../utils";
-import Button from "../elements/Button.vue";
-const props = defineProps({
-  onClick: { type: Function, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  type: { type: String, required: false },
-  loadingPlacement: { type: String, required: false },
-  icon: { type: Boolean, required: false },
-  disabled: { type: Boolean, required: false },
-  reverse: { type: Boolean, required: false },
-  loading: { type: Boolean, required: false },
-  block: { type: Boolean, required: false },
-  to: { type: null, required: false },
-  label: { type: String, required: false, default: "Cancel" },
-  btn: { type: String, required: false, default: "solid-gray" },
-  leading: { type: String, required: false },
-  trailing: { type: String, required: false },
-  size: { type: String, required: false },
-  una: { type: Object, required: false },
-  square: { type: null, required: false },
-  rounded: { type: null, required: false },
-  class: { type: null, required: false },
-  breadcrumbActive: { type: String, required: false },
-  breadcrumbInactive: { type: String, required: false },
-  paginationSelected: { type: String, required: false },
-  paginationUnselected: { type: String, required: false },
-  dropdownMenu: { type: String, required: false },
-  toggleOn: { type: String, required: false },
-  toggleOff: { type: String, required: false },
-  navigationMenu: { type: String, required: false },
-  navigationMenuLink: { type: String, required: false },
-  ariaLabel: { type: String, required: false }
-});
+<script setup lang="ts">
+import type { NAlertDialogCancelProps } from '../../types'
+import { AlertDialogCancel } from 'reka-ui'
+import { cn } from '../../utils'
+import Button from '../elements/Button.vue'
+
+const props = withDefaults(defineProps<NAlertDialogCancelProps>(), {
+  btn: 'solid-gray',
+  label: 'Cancel',
+})
 </script>
 
 <template>
@@ -43,9 +17,9 @@ const props = defineProps({
     <Button
       v-bind="props"
       :class="cn(
-  'alert-dialog-cancel',
-  props.class
-)"
+        'alert-dialog-cancel',
+        props.class,
+      )"
     >
       <template v-for="(_, name) in $slots" #[name]="slotData">
         <slot :name="name" v-bind="slotData" />

package/dist/runtime/components/alert-dialog/AlertDialogContent.vue

@@ -1,46 +1,40 @@
-<script setup>
-import { reactiveOmit } from "@vueuse/core";
+<script setup lang="ts">
+import type { AlertDialogContentEmits } from 'reka-ui'
+import type { NAlertDialogContentProps } from '../../types'
+import { reactiveOmit } from '@vueuse/core'
 import {
   AlertDialogContent,
   AlertDialogPortal,
-  useForwardPropsEmits
-} from "reka-ui";
-import { computed } from "vue";
-import { cn } from "../../utils";
-import AlertDialogOverlay from "./AlertDialogOverlay.vue";
+  useForwardPropsEmits,
+} from 'reka-ui'
+import { computed } from 'vue'
+import { cn } from '../../utils'
+import AlertDialogOverlay from './AlertDialogOverlay.vue'
+
 defineOptions({
-  inheritAttrs: false
-});
-const props = defineProps({
-  preventClose: { type: Boolean, required: false },
-  overlay: { type: Boolean, required: false, default: true },
-  _alertDialogCancel: { type: Object, required: false },
-  _alertDialogAction: { type: Object, required: false },
-  _alertDialogOverlay: { type: Object, required: false },
-  una: { type: Object, required: false },
-  forceMount: { type: Boolean, required: false },
-  trapFocus: { type: Boolean, required: false },
-  disableOutsidePointerEvents: { type: Boolean, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  class: { type: null, required: false }
-});
-const emits = defineEmits(["escapeKeyDown", "pointerDownOutside", "focusOutside", "interactOutside", "openAutoFocus", "closeAutoFocus"]);
-const delegatedProps = reactiveOmit(props, ["class", "una", "_alertDialogOverlay"]);
-const forwarded = useForwardPropsEmits(delegatedProps, emits);
+  inheritAttrs: false,
+})
+
+const props = withDefaults(defineProps<NAlertDialogContentProps>(), {
+  overlay: true,
+})
+const emits = defineEmits<AlertDialogContentEmits>()
+const delegatedProps = reactiveOmit(props, ['class', 'una', '_alertDialogOverlay'])
+const forwarded = useForwardPropsEmits(delegatedProps, emits)
 const contentEvents = computed(() => {
   if (props.preventClose) {
     return {
-      pointerDownOutside: (e) => e.preventDefault(),
-      interactOutside: (e) => e.preventDefault(),
-      escapeKeyDown: (e) => e.preventDefault(),
-      closeAutoFocus: (e) => e.preventDefault()
-    };
+      pointerDownOutside: (e: Event) => e.preventDefault(),
+      interactOutside: (e: Event) => e.preventDefault(),
+      escapeKeyDown: (e: Event) => e.preventDefault(),
+      closeAutoFocus: (e: Event) => e.preventDefault(),
+    }
   }
+
   return {
-    closeAutoFocus: (e) => e.preventDefault()
-  };
-});
+    closeAutoFocus: (e: Event) => e.preventDefault(),
+  }
+})
 </script>
 
 <template>
@@ -55,11 +49,11 @@ const contentEvents = computed(() => {
       data-slot="alert-dialog-content"
       v-bind="{ ...forwarded, ...$attrs }"
       :class="cn(
-  '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%',
-  'alert-dialog-content',
-  props.una?.alertDialogContent,
-  props.class
-)"
+        '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%',
+        'alert-dialog-content',
+        props.una?.alertDialogContent,
+        props.class,
+      )"
       v-on="contentEvents"
     >
       <slot />

package/dist/runtime/components/alert-dialog/AlertDialogDescription.vue

@@ -1,14 +1,12 @@
-<script setup>
-import { reactiveOmit } from "@vueuse/core";
-import { AlertDialogDescription } from "reka-ui";
-import { cn } from "../../utils";
-const props = defineProps({
-  una: { type: Object, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  class: { type: null, required: false }
-});
-const delegatedProps = reactiveOmit(props, "class", "una");
+<script setup lang="ts">
+import type { NAlertDialogDescriptionProps } from '../../types'
+import { reactiveOmit } from '@vueuse/core'
+import { AlertDialogDescription } from 'reka-ui'
+import { cn } from '../../utils'
+
+const props = defineProps<NAlertDialogDescriptionProps>()
+
+const delegatedProps = reactiveOmit(props, 'class', 'una')
 </script>
 
 <template>
@@ -16,10 +14,10 @@ const delegatedProps = reactiveOmit(props, "class", "una");
     data-slot="alert-dialog-description"
     v-bind="delegatedProps"
     :class="cn(
-  'alert-dialog-description',
-  props.una?.alertDialogDescription,
-  props.class
-)"
+      'alert-dialog-description',
+      props.una?.alertDialogDescription,
+      props.class,
+    )"
   >
     <slot />
   </AlertDialogDescription>

package/dist/runtime/components/alert-dialog/AlertDialogFooter.vue

@@ -1,21 +1,20 @@
-<script setup>
-import { cn } from "../../utils";
-const props = defineProps({
-  una: { type: Object, required: false },
-  class: { type: null, required: false }
-});
+<script setup lang="ts">
+import type { NAlertDialogFooterProps } from '../../types'
+import { cn } from '../../utils'
+
+const props = defineProps<NAlertDialogFooterProps>()
 </script>
 
 <template>
   <div
     data-slot="alert-dialog-footer"
     :class="
-  cn(
-    'alert-dialog-footer',
-    props.una?.alertDialogFooter,
-    props.class
-  )
-"
+      cn(
+        'alert-dialog-footer',
+        props.una?.alertDialogFooter,
+        props.class,
+      )
+    "
   >
     <slot />
   </div>

package/dist/runtime/components/alert-dialog/AlertDialogHeader.vue

@@ -1,19 +1,18 @@
-<script setup>
-import { cn } from "../../utils";
-const props = defineProps({
-  una: { type: Object, required: false },
-  class: { type: null, required: false }
-});
+<script setup lang="ts">
+import type { NAlertDialogHeaderProps } from '../../types'
+import { cn } from '../../utils'
+
+const props = defineProps<NAlertDialogHeaderProps>()
 </script>
 
 <template>
   <div
     data-slot="alert-dialog-header"
     :class="cn(
-  'alert-dialog-header',
-  props.una?.alertDialogHeader,
-  props.class
-)"
+      'alert-dialog-header',
+      props.una?.alertDialogHeader,
+      props.class,
+    )"
   >
     <slot />
   </div>

package/dist/runtime/components/alert-dialog/AlertDialogOverlay.vue

@@ -1,24 +1,20 @@
-<script setup>
-import { DialogOverlay } from "reka-ui";
-import { cn } from "../../utils";
-const props = defineProps({
-  una: { type: Object, required: false },
-  class: { type: null, required: false },
-  forceMount: { type: Boolean, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false }
-});
+<script lang="ts" setup>
+import type { NAlertDialogOverlayProps } from '../../types'
+import { DialogOverlay } from 'reka-ui'
+import { cn } from '../../utils'
+
+const props = defineProps<NAlertDialogOverlayProps>()
 </script>
 
 <template>
   <DialogOverlay
     data-slot="alert-dialog-overlay"
     :class="cn(
-  'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 ',
-  'alert-dialog-overlay',
-  props.una?.alertDialogOverlay,
-  props.class
-)"
+      'data-[state=open]:animate-in data-[state=closed]:animate-out data-[state=closed]:fade-out-0 data-[state=open]:fade-in-0 ',
+      'alert-dialog-overlay',
+      props.una?.alertDialogOverlay,
+      props.class,
+    )"
   >
     <slot />
   </DialogOverlay>

package/dist/runtime/components/alert-dialog/AlertDialogTitle.vue

@@ -1,14 +1,12 @@
-<script setup>
-import { reactiveOmit } from "@vueuse/core";
-import { AlertDialogTitle } from "reka-ui";
-import { cn } from "../../utils";
-const props = defineProps({
-  una: { type: Object, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  class: { type: null, required: false }
-});
-const delegatedProps = reactiveOmit(props, "class", "una");
+<script setup lang="ts">
+import type { NAlertDialogTitleProps } from '../../types'
+import { reactiveOmit } from '@vueuse/core'
+import { AlertDialogTitle } from 'reka-ui'
+import { cn } from '../../utils'
+
+const props = defineProps<NAlertDialogTitleProps>()
+
+const delegatedProps = reactiveOmit(props, 'class', 'una')
 </script>
 
 <template>
@@ -16,10 +14,10 @@ const delegatedProps = reactiveOmit(props, "class", "una");
     data-slot="alert-dialog-title"
     v-bind="delegatedProps"
     :class="cn(
-  'alert-dialog-title',
-  props.una?.alertDialogTitle,
-  props.class
-)"
+      'alert-dialog-title',
+      props.una?.alertDialogTitle,
+      props.class,
+    )"
   >
     <slot />
   </AlertDialogTitle>

package/dist/runtime/components/alert-dialog/AlertDialogTrigger.vue

@@ -1,9 +1,8 @@
-<script setup>
-import { AlertDialogTrigger } from "reka-ui";
-const props = defineProps({
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false }
-});
+<script setup lang="ts">
+import type { NAlertDialogTriggerProps } from '../../types'
+import { AlertDialogTrigger } from 'reka-ui'
+
+const props = defineProps<NAlertDialogTriggerProps>()
 </script>
 
 <template>

package/dist/runtime/components/aspect-ratio/AspectRatio.vue

@@ -1,17 +1,15 @@
-<script setup>
-import { reactiveOmit } from "@vueuse/core";
-import { AspectRatio } from "reka-ui";
-import { cn } from "../../utils";
-const props = defineProps({
-  aspectRatio: { type: String, required: false, default: "soft" },
-  una: { type: Object, required: false },
-  ratio: { type: Number, required: false },
-  asChild: { type: Boolean, required: false },
-  as: { type: null, required: false },
-  class: { type: null, required: false },
-  rounded: { type: null, required: false, default: "md" }
-});
-const delegatedProps = reactiveOmit(props, "class");
+<script setup lang="ts">
+import type { NAspectRatioProps } from '../../types/aspect-ratio'
+import { reactiveOmit } from '@vueuse/core'
+import { AspectRatio } from 'reka-ui'
+import { cn } from '../../utils'
+
+const props = withDefaults(defineProps<NAspectRatioProps>(), {
+  aspectRatio: 'soft',
+  rounded: 'md',
+})
+
+const delegatedProps = reactiveOmit(props, 'class')
 </script>
 
 <template>
@@ -19,10 +17,10 @@ const delegatedProps = reactiveOmit(props, "class");
     v-slot="{ aspect }"
     v-bind="delegatedProps"
     :class="cn(
-  'aspect-ratio',
-  props.una?.aspectRatio,
-  props.class
-)"
+      'aspect-ratio',
+      props.una?.aspectRatio,
+      props.class,
+    )"
     :aspect-ratio
     :rounded
   >