@una-ui/nuxt 0.54.2 → 0.54.4

package/dist/runtime/components/elements/Accordion.vue

@@ -1,75 +1,84 @@
-<script setup lang="ts">
-import type { NAccordionItemProps, NAccordionProps } from '../../types'
-
+<script setup>
 import {
   Disclosure,
   DisclosureButton,
-  DisclosurePanel,
-} from '@headlessui/vue'
-import { createReusableTemplate } from '@vueuse/core'
-import { computed, ref } from 'vue'
-
-import { pickProps } from '../../utils'
-import NButton from './Button.vue'
-import NIcon from './Icon.vue'
-
-const props = withDefaults(defineProps<NAccordionProps>(), {
-  trailingOpen: 'accordion-trailing-icon',
-  loadingPlacement: 'trailing',
-})
-
-const buttonRefs = ref<(() => void)[]>([])
-
-function closeOthers(index: number): void {
+  DisclosurePanel
+} from "@headlessui/vue";
+import { createReusableTemplate } from "@vueuse/core";
+import { computed, ref } from "vue";
+import { pickProps } from "../../utils";
+import NButton from "./Button.vue";
+import NIcon from "./Icon.vue";
+const props = defineProps({
+  accordion: { type: String, required: false },
+  trailingOpen: { type: String, required: false, default: "accordion-trailing-icon" },
+  trailingClose: { type: String, required: false },
+  multiple: { type: Boolean, required: false },
+  defaultOpen: { type: Boolean, required: false },
+  unstyle: { type: Boolean, required: false },
+  mounted: { type: Boolean, required: false },
+  items: { type: Array, required: true },
+  una: { type: Object, required: false },
+  type: { type: String, required: false },
+  loadingPlacement: { type: String, required: false, default: "trailing" },
+  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 },
+  btn: { type: String, required: false },
+  leading: { type: String, required: false },
+  trailing: { type: String, required: false },
+  size: { type: String, 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 }
+});
+const buttonRefs = ref([]);
+function closeOthers(index) {
   if (props.multiple && props.items[index] && !props.items[index].closeOthers)
-    return
-
-  buttonRefs.value
-    .filter((_, i) => i !== index)
-    .forEach(close => close())
+    return;
+  buttonRefs.value.filter((_, i) => i !== index).forEach((close) => close());
 }
-
-function onEnter(element: Element, done: () => void): void {
-  const el = element as HTMLElement
-  el.style.height = '0'
-  el.style.height = `${element.scrollHeight}px`
-  el.addEventListener('transitionend', done, { once: true })
+function onEnter(element, done) {
+  const el = element;
+  el.style.height = "0";
+  el.style.height = `${element.scrollHeight}px`;
+  el.addEventListener("transitionend", done, { once: true });
 }
-
-function onAfterEnter(element: Element): void {
-  const el = element as HTMLElement
-  el.style.height = 'auto'
+function onAfterEnter(element) {
+  const el = element;
+  el.style.height = "auto";
 }
-
-function onBeforeLeave(element: Element): void {
-  const el = element as HTMLElement
-  el.style.height = `${el.scrollHeight}px`
+function onBeforeLeave(element) {
+  const el = element;
+  el.style.height = `${el.scrollHeight}px`;
 }
-
-function onLeave(element: Element, done: () => void): void {
-  const el = element as HTMLElement
-  el.style.height = '0'
-
-  el.addEventListener('transitionend', done, { once: true })
+function onLeave(element, done) {
+  const el = element;
+  el.style.height = "0";
+  el.addEventListener("transitionend", done, { once: true });
 }
-
-const [DefineTemplate, ReuseTemplate] = createReusableTemplate<{
-  item: NAccordionItemProps
-  index: number
-  open: boolean
-  close: () => void
-}>()
-
-const pickedProps = pickProps(props, ['reverse', 'icon', 'btn', 'label', 'leading', 'loading', 'loadingPlacement', 'una', 'trailing', 'leading', 'to', 'type', 'disabled'])
-
-function mergedProps(itemProps: NAccordionItemProps): NAccordionItemProps {
-  return Object.assign(pickedProps, itemProps)
+const [DefineTemplate, ReuseTemplate] = createReusableTemplate();
+const pickedProps = pickProps(props, ["reverse", "icon", "btn", "label", "leading", "loading", "loadingPlacement", "una", "trailing", "leading", "to", "type", "disabled"]);
+function mergedProps(itemProps) {
+  return Object.assign(pickedProps, itemProps);
 }
-
-// TODO: refactor this to sync with NButton variants
-const btnVariants = ['solid', 'outline', 'soft', 'ghost', 'link', 'text'] as const
-const hasVariant = computed(() => btnVariants.some(btnVariants => props.btn?.includes(btnVariants)))
-const isBaseVariant = computed(() => props.btn?.includes('~'))
+const btnVariants = ["solid", "outline", "soft", "ghost", "link", "text"];
+const hasVariant = computed(() => btnVariants.some((btnVariants2) => props.btn?.includes(btnVariants2)));
+const isBaseVariant = computed(() => props.btn?.includes("~"));
 </script>
 
 <template>
@@ -77,11 +86,11 @@ const isBaseVariant = computed(() => props.btn?.includes('~'))
     :accordion="accordion"
     class="accordion"
     :class="[
-      unstyle ? 'space-y-3' : 'accordion-(border divider)',
-      una?.accordion,
-    ]"
+  unstyle ? 'space-y-3' : 'accordion-(border divider)',
+  una?.accordion
+]"
   >
-    <DefineTemplate v-slot="{ item, close, index, open }: any">
+    <DefineTemplate v-slot="{ item, close, index, open }">
       <slot
         :name="item.content ? 'content' : index"
         :item="item" :index="index" :open="open" :close="close"
@@ -89,9 +98,9 @@ const isBaseVariant = computed(() => props.btn?.includes('~'))
         <div
           accordion="panel"
           :class="[
-            una?.accordionPanel,
-            { 'border-t-0': unstyle },
-          ]"
+  una?.accordionPanel,
+  { 'border-t-0': unstyle }
+]"
         >
           {{ item.content }}
         </div>
@@ -108,7 +117,7 @@ const isBaseVariant = computed(() => props.btn?.includes('~'))
       :class="una?.accordionItem"
     >
       <DisclosureButton
-        :ref="() => (buttonRefs[i] = close)"
+        :ref="() => buttonRefs[i] = close"
         as="template"
         :disabled="item.disabled || disabled"
         @click="closeOthers(i)"
@@ -118,14 +127,14 @@ const isBaseVariant = computed(() => props.btn?.includes('~'))
             v-bind="mergedProps(item)"
             :btn="`~ block ${btn || ''}`"
             :class="[
-              { 'accordion-button-default-variant': !hasVariant && !isBaseVariant },
-              { 'accordion-button-padding': !unstyle },
-              una?.accordionButton,
-            ]"
+  { 'accordion-button-default-variant': !hasVariant && !isBaseVariant },
+  { 'accordion-button-padding': !unstyle },
+  una?.accordionButton
+]"
             :una="{
-              btn: 'h-auto accordion-button',
-              btnLabel: 'accordion-label',
-            }"
+  btn: 'h-auto accordion-button',
+  btnLabel: 'accordion-label'
+}"
           >
             <template #leading>
               <!-- TODO: fix conditional statement -->
@@ -143,11 +152,9 @@ const isBaseVariant = computed(() => props.btn?.includes('~'))
                 v-if="trailingOpen || trailingClose"
                 accordion="trailing"
                 :class="[
-                  trailingClose || (!trailingClose && open)
-                    ? una?.accordionTrailingClose || 'accordion-trailing-close'
-                    : una?.accordionTrailingOpen || 'accordion-trailing-open',
-                  una?.accordionTrailing,
-                ]"
+  trailingClose || !trailingClose && open ? una?.accordionTrailingClose || 'accordion-trailing-close' : una?.accordionTrailingOpen || 'accordion-trailing-open',
+  una?.accordionTrailing
+]"
               >
                 <NIcon
                   v-if="(open || !trailingClose) && trailingOpen"
@@ -176,11 +183,11 @@ const isBaseVariant = computed(() => props.btn?.includes('~'))
         <DisclosurePanel v-if="!item.mounted || !mounted">
           <ReuseTemplate
             v-bind="{
-              item,
-              index: i,
-              open,
-              close,
-            }"
+  item,
+  index: i,
+  open,
+  close
+}"
           />
         </DisclosurePanel>
         <DisclosurePanel
@@ -190,11 +197,11 @@ const isBaseVariant = computed(() => props.btn?.includes('~'))
         >
           <ReuseTemplate
             v-bind="{
-              item,
-              index: i,
-              open,
-              close,
-            }"
+  item,
+  index: i,
+  open,
+  close
+}"
           />
         </DisclosurePanel>
       </Transition>

package/dist/runtime/components/elements/Accordion.vue.d.ts

@@ -0,0 +1,28 @@
+import type { NAccordionItemProps, NAccordionProps } from '../../types/index.js';
+declare var __VLS_6: any, __VLS_7: {
+    item: any;
+    index: any;
+    open: any;
+    close: any;
+}, __VLS_21: {
+    item: NAccordionItemProps;
+    index: number;
+    open: any;
+    close: any;
+};
+type __VLS_Slots = {} & {
+    [K in NonNullable<typeof __VLS_6>]?: (props: typeof __VLS_7) => any;
+} & {
+    label?: (props: typeof __VLS_21) => any;
+};
+declare const __VLS_component: import("vue").DefineComponent<NAccordionProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NAccordionProps> & Readonly<{}>, {
+    loadingPlacement: "leading" | "trailing" | "label";
+    trailingOpen: string;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/elements/Alert.vue

@@ -1,54 +1,41 @@
-<script setup lang="ts">
-import type { NAlertProps } from '../../types'
-import { computed } from 'vue'
-import NButton from '../elements/Button.vue'
-import NIcon from '../elements/Icon.vue'
-
+<script setup>
+import { computed } from "vue";
+import NButton from "../elements/Button.vue";
+import NIcon from "../elements/Icon.vue";
 defineOptions({
-  inheritAttrs: false,
-})
-
-const props = withDefaults(defineProps<NAlertProps>(), {
-  icon: false,
-})
-
-const emit = defineEmits(['close'])
-
-const slots = defineSlots<{
-  default?: any
-  title?: any
-  description?: any
-  icon?: any
-  closeIcon?: any
-}>()
-
-const alertVariants = ['soft', 'outline', 'border'] as const
-const hasVariant = computed(() => alertVariants.some(alertVariants => props.alert?.includes(alertVariants)))
-const isBaseVariant = computed(() => props.alert?.includes('~'))
-
+  inheritAttrs: false
+});
+const props = defineProps({
+  alert: { type: String, required: false },
+  icon: { type: [String, Boolean], required: false, default: false },
+  closable: { type: Boolean, required: false },
+  title: { type: String, required: false },
+  description: { type: String, required: false },
+  una: { type: Object, required: false }
+});
+const emit = defineEmits(["close"]);
+const slots = defineSlots();
+const alertVariants = ["soft", "outline", "border"];
+const hasVariant = computed(() => alertVariants.some((alertVariants2) => props.alert?.includes(alertVariants2)));
+const isBaseVariant = computed(() => props.alert?.includes("~"));
 const alertClassVariants = computed(() => {
-  const icon = {
-    info: 'alert-info-icon',
-    success: 'alert-success-icon',
-    warning: 'alert-warning-icon',
-    error: 'alert-error-icon',
-    default: '',
-  }
-
-  // TODO: simplify and optimize this
-  const alertType = props.alert ? (props.alert.includes('info') ? 'info' : (props.alert.includes('success') ? 'success' : (props.alert.includes('warning') ? 'warning' : (props.alert.includes('error') ? 'error' : 'default')))) : 'default'
-
+  const icon2 = {
+    info: "alert-info-icon",
+    success: "alert-success-icon",
+    warning: "alert-warning-icon",
+    error: "alert-error-icon",
+    default: ""
+  };
+  const alertType = props.alert ? props.alert.includes("info") ? "info" : props.alert.includes("success") ? "success" : props.alert.includes("warning") ? "warning" : props.alert.includes("error") ? "error" : "default" : "default";
   return {
-    icon: icon[alertType],
-  }
-})
-
+    icon: icon2[alertType]
+  };
+});
 const icon = computed(() => {
-  if (props.icon === '' || props.icon === undefined || props.icon === true)
-    return alertClassVariants.value.icon
-
-  return props.icon.toString()
-})
+  if (props.icon === "" || props.icon === void 0 || props.icon === true)
+    return alertClassVariants.value.icon;
+  return props.icon.toString();
+});
 </script>
 
 <template>
@@ -57,9 +44,9 @@ const icon = computed(() => {
     :alert="alert"
     class="alert"
     :class="[
-      { 'alert-default-variant': !hasVariant && !isBaseVariant },
-      una?.alert,
-    ]"
+  { 'alert-default-variant': !hasVariant && !isBaseVariant },
+  una?.alert
+]"
   >
     <div
       alert="inner-wrapper"

package/dist/runtime/components/elements/Alert.vue.d.ts

@@ -0,0 +1,22 @@
+import type { NAlertProps } from '../../types/index.js';
+type __VLS_Slots = {
+    default?: any;
+    title?: any;
+    description?: any;
+    icon?: any;
+    closeIcon?: any;
+};
+declare const __VLS_component: import("vue").DefineComponent<NAlertProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+    close: (...args: any[]) => void;
+}, string, import("vue").PublicProps, Readonly<NAlertProps> & Readonly<{
+    onClose?: ((...args: any[]) => any) | undefined;
+}>, {
+    icon: string | boolean;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/elements/AvatarGroup.vue

@@ -1,94 +1,87 @@
-<script setup lang="ts">
-import type { NAvatarGroupProps } from '../../types'
-import { reactiveOmit } from '@vueuse/core'
-import { Primitive } from 'reka-ui'
-import { computed, h } from 'vue'
-import { cn, omitProps } from '../../utils'
-import Avatar from './avatar/Avatar.vue'
-
-const props = withDefaults(defineProps<NAvatarGroupProps>(), {
-  as: 'div',
-})
-
-const slots = defineSlots()
-
-const max = computed(() => typeof props.max === 'string' ? Number.parseInt(props.max, 10) : props.max)
-
+<script setup>
+import { reactiveOmit } from "@vueuse/core";
+import { Primitive } from "reka-ui";
+import { computed, h } from "vue";
+import { cn, omitProps } from "../../utils";
+import Avatar from "./avatar/Avatar.vue";
+const props = defineProps({
+  max: { type: Number, required: false },
+  overflowLabel: { type: String, required: false },
+  una: { type: Object, required: false },
+  _avatarRoot: { type: Object, required: false },
+  _avatarImage: { type: Object, required: false },
+  _avatarFallback: { type: Object, required: false },
+  class: { type: null, required: false },
+  size: { type: null, required: false },
+  square: { type: null, required: false },
+  rounded: { type: null, required: false },
+  avatar: { type: null, required: false },
+  asChild: { type: Boolean, required: false },
+  as: { type: null, required: false, default: "div" },
+  icon: { type: Boolean, required: false },
+  delayMs: { type: Number, required: false },
+  referrerPolicy: { type: null, required: false }
+});
+const slots = defineSlots();
+const max = computed(() => typeof props.max === "string" ? Number.parseInt(props.max, 10) : props.max);
 const children = computed(() => {
-  let children = slots.default?.()
-  if (children?.length) {
-    children = children.flatMap((child: any) => {
-      if (typeof child.type === 'symbol') {
-        // `v-if="false"` or commented node
-        if (typeof child.children === 'string') {
-          return null
+  let children2 = slots.default?.();
+  if (children2?.length) {
+    children2 = children2.flatMap((child) => {
+      if (typeof child.type === "symbol") {
+        if (typeof child.children === "string") {
+          return null;
         }
-
-        return child.children
+        return child.children;
       }
-
-      return child
-    }).filter(Boolean)
+      return child;
+    }).filter(Boolean);
   }
-
-  return children || []
-})
-
-// Calculate visible and hidden avatars without circular dependencies
+  return children2 || [];
+});
 const maxVisibleCount = computed(() => {
   if (!max.value || max.value <= 0) {
-    return children.value.length
+    return children.value.length;
   }
-  return Math.min(max.value, children.value.length)
-})
-
+  return Math.min(max.value, children.value.length);
+});
 const hiddenCount = computed(() => {
   if (!children.value.length) {
-    return 0
+    return 0;
   }
-  return Math.max(0, children.value.length - maxVisibleCount.value)
-})
-
+  return Math.max(0, children.value.length - maxVisibleCount.value);
+});
 const visibleAvatars = computed(() => {
   if (!children.value.length) {
-    return []
+    return [];
   }
-
-  // Take only the visible portion without modifying the original array
-  return [...children.value].slice(0, maxVisibleCount.value).reverse()
-})
-
+  return [...children.value].slice(0, maxVisibleCount.value).reverse();
+});
 const displayAvatars = computed(() => {
-  const result = [...visibleAvatars.value]
-
+  const result = [...visibleAvatars.value];
   if (hiddenCount.value > 0 || props.overflowLabel) {
-    const avatarProps = children.value.length > 0
-      ? omitProps(children.value[0].props || {}, ['src', 'alt', 'label', 'icon'])
-      : {}
-
+    const avatarProps = children.value.length > 0 ? omitProps(children.value[0].props || {}, ["src", "alt", "label", "icon"]) : {};
     result.unshift(
       h(Avatar, {
         label: props.overflowLabel || `+${hiddenCount.value}`,
         class: cn(
-          props.una?.avatarGroupCount,
+          props.una?.avatarGroupCount
         ),
         una: {
           avatarFallback: cn(
-            'avatar-group-count',
+            "avatar-group-count",
             props.una?.avatarGroupCount,
-            avatarProps.una?.avatarFallback,
+            avatarProps.una?.avatarFallback
           ),
-          ...avatarProps.una,
+          ...avatarProps.una
         },
-        ...avatarProps,
-      }),
-    )
+        ...avatarProps
+      })
+    );
   }
-
-  return result
-})
-
-const rootProps = reactiveOmit(props, ['max', 'as', 'asChild', 'overflowLabel'])
+  return result;
+});
+const rootProps = reactiveOmit(props, ["max", "as", "asChild", "overflowLabel"]);
 </script>
 
 <template>
@@ -96,9 +89,9 @@ const rootProps = reactiveOmit(props, ['max', 'as', 'asChild', 'overflowLabel'])
     :as
     :size
     :class="cn(
-      'avatar-group',
-      una?.avatarGroup,
-    )"
+  'avatar-group',
+  una?.avatarGroup
+)"
     :as-child
   >
     <component
@@ -107,9 +100,9 @@ const rootProps = reactiveOmit(props, ['max', 'as', 'asChild', 'overflowLabel'])
       v-bind="{ ...rootProps, ...avatar.props }"
       :key="count"
       :class="cn(
-        'avatar-group-item',
-        props.class,
-      )"
+  'avatar-group-item',
+  props.class
+)"
     />
   </Primitive>
 </template>

package/dist/runtime/components/elements/AvatarGroup.vue.d.ts

@@ -0,0 +1,11 @@
+import type { NAvatarGroupProps } from '../../types/index.js';
+declare const __VLS_component: import("vue").DefineComponent<NAvatarGroupProps, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<NAvatarGroupProps> & Readonly<{}>, {
+    as: import("reka-ui").AsTag | import("vue").Component;
+}, {}, {}, {}, string, import("vue").ComponentProvideOptions, false, {}, any>;
+declare const _default: __VLS_WithSlots<typeof __VLS_component, __VLS_Slots>;
+export default _default;
+type __VLS_WithSlots<T, S> = T & {
+    new (): {
+        $slots: S;
+    };
+};

package/dist/runtime/components/elements/Badge.vue

@@ -1,20 +1,19 @@
-<script setup lang="ts">
-import type { NBadgeProps } from '../../types'
-
-import { computed } from 'vue'
-import NIcon from './Icon.vue'
-
-const props = withDefaults(defineProps<NBadgeProps>(), {
-  una: () => ({
-    badgeDefaultVariant: 'badge-default-variant',
-  }),
-})
-
-const emit = defineEmits(['close'])
-
-const badgeVariants = ['solid', 'soft', 'outline'] as const
-const hasVariant = computed(() => badgeVariants.some(badgeVariants => props.badge?.includes(badgeVariants)))
-const isBaseVariant = computed(() => props.badge?.includes('~'))
+<script setup>
+import { computed } from "vue";
+import NIcon from "./Icon.vue";
+const props = defineProps({
+  badge: { type: String, required: false },
+  label: { type: String, required: false },
+  icon: { type: String, required: false },
+  closable: { type: Boolean, required: false },
+  una: { type: Object, required: false, default: () => ({
+    badgeDefaultVariant: "badge-default-variant"
+  }) }
+});
+const emit = defineEmits(["close"]);
+const badgeVariants = ["solid", "soft", "outline"];
+const hasVariant = computed(() => badgeVariants.some((badgeVariants2) => props.badge?.includes(badgeVariants2)));
+const isBaseVariant = computed(() => props.badge?.includes("~"));
 </script>
 
 <template>
@@ -22,9 +21,9 @@ const isBaseVariant = computed(() => props.badge?.includes('~'))
     :badge="badge"
     class="badge"
     :class="[
-      !hasVariant && !isBaseVariant ? una?.badgeDefaultVariant : '',
-      una?.badge,
-    ]"
+  !hasVariant && !isBaseVariant ? una?.badgeDefaultVariant : '',
+  una?.badge
+]"
   >
     <NIcon
       v-if="icon"