@nuxt/ui 2.17.0 → 2.18.0

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

@@ -14,7 +14,7 @@
             {{ title }}
           </slot>
         </p>
-        <div v-if="description || $slots.description" :class="twMerge(ui.description, !(title && $slots.title) && 'mt-0 leading-5')">
+        <div v-if="description || $slots.description" :class="twMerge(ui.description, !title && !$slots.title && 'mt-0 leading-5')">
           <slot name="description" :description="description">
             {{ description }}
           </slot>
@@ -42,9 +42,7 @@
 <script>
 import { computed, toRef, defineComponent } from "vue";
 import { twMerge, twJoin } from "tailwind-merge";
-import UIcon from "../elements/Icon.vue";
-import UAvatar from "../elements/Avatar.vue";
-import UButton from "../elements/Button.vue";
+import { UIcon, UAvatar, UButton } from "#components";
 import { useUI } from "../../composables/useUI";
 import { mergeConfig } from "../../utils";
 import appConfig from "#build/app.config";

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

@@ -1,13 +1,53 @@
 import type { PropType } from 'vue';
-import type { Avatar, Button, AlertVariant, AlertAction } from '../../types';
+import type { Avatar, Button, AlertColor, AlertVariant, AlertAction, Strategy } from '../../types.js';
+declare const config: {
+    wrapper: string;
+    inner: string;
+    title: string;
+    description: string;
+    actions: string;
+    shadow: string;
+    rounded: string;
+    padding: string;
+    gap: string;
+    icon: {
+        base: string;
+    };
+    avatar: {
+        base: string;
+        size: "md";
+    };
+    color: {
+        white: {
+            solid: string;
+        };
+    };
+    variant: {
+        solid: string;
+        outline: string;
+        soft: string;
+        subtle: string;
+    };
+    default: {
+        color: string;
+        variant: string;
+        icon: any;
+        closeButton: any;
+        actionButton: {
+            size: "xs";
+            color: "primary";
+            variant: "link";
+        };
+    };
+};
 declare const _default: import("vue").DefineComponent<{
     title: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     description: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     icon: {
         type: StringConstructor;
@@ -15,7 +55,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     avatar: {
         type: PropType<Avatar>;
-        default: null;
+        default: any;
     };
     closeButton: {
         type: PropType<Button>;
@@ -23,16 +63,16 @@ declare const _default: import("vue").DefineComponent<{
     };
     actions: {
         type: PropType<AlertAction[]>;
-        default: () => never[];
+        default: () => any[];
     };
     color: {
-        type: PropType<any>;
-        default: () => any;
+        type: PropType<AlertColor>;
+        default: () => string;
         validator(value: string): boolean;
     };
     variant: {
         type: PropType<AlertVariant>;
-        default: () => any;
+        default: () => string;
         validator(value: string): boolean;
     };
     class: {
@@ -40,11 +80,52 @@ declare const _default: import("vue").DefineComponent<{
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }, {
-    ui: import("vue").ComputedRef<any>;
+    ui: import("vue").ComputedRef<{
+        wrapper: string;
+        inner: string;
+        title: string;
+        description: string;
+        actions: string;
+        shadow: string;
+        rounded: string;
+        padding: string;
+        gap: string;
+        icon: {
+            base: string;
+        };
+        avatar: {
+            base: string;
+            size: "md";
+        };
+        color: {
+            white: {
+                solid: string;
+            };
+        };
+        variant: {
+            solid: string;
+            outline: string;
+            soft: string;
+            subtle: string;
+        };
+        default: {
+            color: string;
+            variant: string;
+            icon: any;
+            closeButton: any;
+            actionButton: {
+                size: "xs";
+                color: "primary";
+                variant: "link";
+            };
+        };
+    }>;
     attrs: import("vue").ComputedRef<Pick<{
         [x: string]: unknown;
     }, string>>;
@@ -54,11 +135,11 @@ declare const _default: import("vue").DefineComponent<{
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, "close"[], "close", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     title: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     description: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     icon: {
         type: StringConstructor;
@@ -66,7 +147,7 @@ declare const _default: import("vue").DefineComponent<{
     };
     avatar: {
         type: PropType<Avatar>;
-        default: null;
+        default: any;
     };
     closeButton: {
         type: PropType<Button>;
@@ -74,16 +155,16 @@ declare const _default: import("vue").DefineComponent<{
     };
     actions: {
         type: PropType<AlertAction[]>;
-        default: () => never[];
+        default: () => any[];
     };
     color: {
-        type: PropType<any>;
-        default: () => any;
+        type: PropType<AlertColor>;
+        default: () => string;
         validator(value: string): boolean;
     };
     variant: {
         type: PropType<AlertVariant>;
-        default: () => any;
+        default: () => string;
         validator(value: string): boolean;
     };
     class: {
@@ -91,19 +172,21 @@ declare const _default: import("vue").DefineComponent<{
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }>> & {
-    onClose?: ((...args: any[]) => any) | undefined;
+    onClose?: (...args: any[]) => any;
 }, {
-    title: string;
-    class: any;
-    avatar: Avatar;
-    color: any;
+    ui: {};
+    color: AlertColor;
     variant: AlertVariant;
-    ui: any;
     icon: string;
+    avatar: any;
+    class: any;
+    title: string;
     description: string;
     closeButton: Button;
     actions: AlertAction[];

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

@@ -23,7 +23,7 @@
 <script>
 import { defineComponent, ref, computed, toRef, watch } from "vue";
 import { twMerge, twJoin } from "tailwind-merge";
-import UIcon from "../elements/Icon.vue";
+import { UIcon } from "#components";
 import { useUI } from "../../composables/useUI";
 import { mergeConfig } from "../../utils";
 import appConfig from "#build/app.config";

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

@@ -1,21 +1,80 @@
 import type { PropType } from 'vue';
-import type { AvatarSize } from '../../types';
+import type { AvatarSize, AvatarChipColor, AvatarChipPosition, Strategy } from '../../types.js';
+declare const config: {
+    wrapper: string;
+    background: string;
+    rounded: string;
+    text: string;
+    placeholder: string;
+    size: {
+        '3xs': string;
+        '2xs': string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        '2xl': string;
+        '3xl': string;
+    };
+    chip: {
+        base: string;
+        background: string;
+        position: {
+            'top-right': string;
+            'bottom-right': string;
+            'top-left': string;
+            'bottom-left': string;
+        };
+        size: {
+            '3xs': string;
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+            '3xl': string;
+        };
+    };
+    icon: {
+        base: string;
+        size: {
+            '3xs': string;
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+            '3xl': string;
+        };
+    };
+    default: {
+        size: string;
+        icon: any;
+        chipColor: any;
+        chipPosition: string;
+    };
+};
 declare const _default: import("vue").DefineComponent<{
     as: {
-        type: (StringConstructor | ObjectConstructor)[];
+        type: (ObjectConstructor | StringConstructor)[];
         default: string;
     };
     src: {
-        type: (StringConstructor | BooleanConstructor)[];
-        default: null;
+        type: (BooleanConstructor | StringConstructor)[];
+        default: any;
     };
     alt: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     text: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     icon: {
         type: StringConstructor;
@@ -23,22 +82,22 @@ declare const _default: import("vue").DefineComponent<{
     };
     size: {
         type: PropType<AvatarSize>;
-        default: () => any;
+        default: () => string;
         validator(value: string): boolean;
     };
     chipColor: {
-        type: PropType<any>;
+        type: PropType<AvatarChipColor>;
         default: () => any;
         validator(value: string): boolean;
     };
     chipPosition: {
-        type: PropType<"top-right" | "bottom-right" | "top-left" | "bottom-left">;
-        default: () => any;
+        type: PropType<AvatarChipPosition>;
+        default: () => string;
         validator(value: string): boolean;
     };
     chipText: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: null;
+        type: (NumberConstructor | StringConstructor)[];
+        default: any;
     };
     imgClass: {
         type: StringConstructor;
@@ -49,11 +108,71 @@ declare const _default: import("vue").DefineComponent<{
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }, {
-    ui: import("vue").ComputedRef<any>;
+    ui: import("vue").ComputedRef<{
+        wrapper: string;
+        background: string;
+        rounded: string;
+        text: string;
+        placeholder: string;
+        size: {
+            '3xs': string;
+            '2xs': string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+            '3xl': string;
+        };
+        chip: {
+            base: string;
+            background: string;
+            position: {
+                'top-right': string;
+                'bottom-right': string;
+                'top-left': string;
+                'bottom-left': string;
+            };
+            size: {
+                '3xs': string;
+                '2xs': string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+                '2xl': string;
+                '3xl': string;
+            };
+        };
+        icon: {
+            base: string;
+            size: {
+                '3xs': string;
+                '2xs': string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+                '2xl': string;
+                '3xl': string;
+            };
+        };
+        default: {
+            size: string;
+            icon: any;
+            chipColor: any;
+            chipPosition: string;
+        };
+    }>;
     attrs: import("vue").ComputedRef<Pick<{
         [x: string]: unknown;
     }, string>>;
@@ -61,26 +180,26 @@ declare const _default: import("vue").DefineComponent<{
     imgClass: import("vue").ComputedRef<string>;
     iconClass: import("vue").ComputedRef<string>;
     chipClass: import("vue").ComputedRef<string>;
-    url: import("vue").ComputedRef<string | null>;
+    url: import("vue").ComputedRef<string>;
     placeholder: import("vue").ComputedRef<string>;
     error: import("vue").Ref<boolean>;
     onError: () => void;
 }, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     as: {
-        type: (StringConstructor | ObjectConstructor)[];
+        type: (ObjectConstructor | StringConstructor)[];
         default: string;
     };
     src: {
-        type: (StringConstructor | BooleanConstructor)[];
-        default: null;
+        type: (BooleanConstructor | StringConstructor)[];
+        default: any;
     };
     alt: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     text: {
         type: StringConstructor;
-        default: null;
+        default: any;
     };
     icon: {
         type: StringConstructor;
@@ -88,22 +207,22 @@ declare const _default: import("vue").DefineComponent<{
     };
     size: {
         type: PropType<AvatarSize>;
-        default: () => any;
+        default: () => string;
         validator(value: string): boolean;
     };
     chipColor: {
-        type: PropType<any>;
+        type: PropType<AvatarChipColor>;
         default: () => any;
         validator(value: string): boolean;
     };
     chipPosition: {
-        type: PropType<"top-right" | "bottom-right" | "top-left" | "bottom-left">;
-        default: () => any;
+        type: PropType<AvatarChipPosition>;
+        default: () => string;
         validator(value: string): boolean;
     };
     chipText: {
-        type: (StringConstructor | NumberConstructor)[];
-        default: null;
+        type: (NumberConstructor | StringConstructor)[];
+        default: any;
     };
     imgClass: {
         type: StringConstructor;
@@ -114,19 +233,21 @@ declare const _default: import("vue").DefineComponent<{
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof config> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }>>, {
+    alt: string;
     size: AvatarSize;
-    text: string;
-    class: any;
+    ui: {};
     as: string | Record<string, any>;
-    ui: any;
     icon: string;
+    class: any;
+    text: string;
     src: string | boolean;
-    alt: string;
-    chipColor: any;
+    chipColor: AvatarChipColor;
     chipPosition: "top-right" | "bottom-right" | "top-left" | "bottom-left";
     chipText: string | number;
     imgClass: string;

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

@@ -1,21 +1,28 @@
 import type { PropType } from 'vue';
-import type { AvatarSize } from '../../types';
+import type { AvatarSize, Strategy } from '../../types.js';
+declare const avatarGroupConfig: {
+    wrapper: string;
+    ring: string;
+    margin: string;
+};
 declare const _default: import("vue").DefineComponent<{
     size: {
         type: PropType<AvatarSize>;
-        default: null;
+        default: any;
         validator(value: string): boolean;
     };
     max: {
         type: NumberConstructor;
-        default: null;
+        default: any;
     };
     class: {
         type: PropType<any>;
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof avatarGroupConfig> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
@@ -23,24 +30,26 @@ declare const _default: import("vue").DefineComponent<{
 }>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     size: {
         type: PropType<AvatarSize>;
-        default: null;
+        default: any;
         validator(value: string): boolean;
     };
     max: {
         type: NumberConstructor;
-        default: null;
+        default: any;
     };
     class: {
         type: PropType<any>;
         default: () => "";
     };
     ui: {
-        type: PropType<any>;
+        type: PropType<Partial<typeof avatarGroupConfig> & {
+            strategy?: Strategy;
+        }>;
         default: () => {};
     };
 }>>, {
     size: AvatarSize;
-    ui: any;
+    ui: {};
     class: any;
     max: number;
 }, {}>;

package/dist/runtime/components/elements/{AvatarGroup.mjs → AvatarGroup.js}

@@ -1,8 +1,8 @@
 import { h, cloneVNode, computed, toRef, defineComponent } from "vue";
 import { twMerge, twJoin } from "tailwind-merge";
 import UAvatar from "./Avatar.vue";
-import { useUI } from "../../composables/useUI.mjs";
-import { mergeConfig, getSlotsChildren } from "../../utils/index.mjs";
+import { useUI } from "../../composables/useUI.js";
+import { mergeConfig, getSlotsChildren } from "../../utils/index.js";
 import appConfig from "#build/app.config";
 import { avatar, avatarGroup } from "#ui/ui.config";
 const avatarConfig = mergeConfig(appConfig.ui.strategy, appConfig.ui.avatar, avatar);