@nuxt/ui 2.18.3 → 2.18.5

package/dist/runtime/components/navigation/Tabs.vue

@@ -53,7 +53,7 @@
 </template>
 
 <script>
-import { toRef, ref, watch, onMounted, defineComponent } from "vue";
+import { toRef, ref, watch, onMounted, defineComponent, nextTick } from "vue";
 import { TabGroup as HTabGroup, TabList as HTabList, Tab as HTab, TabPanels as HTabPanels, TabPanel as HTabPanel, provideUseId } from "@headlessui/vue";
 import { useResizeObserver } from "@vueuse/core";
 import UIcon from "../elements/Icon.vue";
@@ -143,7 +143,14 @@ export default defineComponent({
       selectedIndex.value = value;
       calcMarkerSize(selectedIndex.value);
     });
-    onMounted(() => calcMarkerSize(selectedIndex.value));
+    watch(() => props.items, async () => {
+      await nextTick();
+      calcMarkerSize(selectedIndex.value);
+    }, { deep: true });
+    onMounted(async () => {
+      await nextTick();
+      calcMarkerSize(selectedIndex.value);
+    });
     provideUseId(() => useId());
     return {
       // eslint-disable-next-line vue/no-dupe-keys

package/dist/runtime/components/navigation/Tabs.vue.d.ts

@@ -1,5 +1,5 @@
 import type { PropType } from 'vue';
-import type { TabItem, Strategy } from '../../types.js';
+import type { TabItem, Strategy } from '../../types/index.js';
 declare const config: {
     wrapper: string;
     container: string;
@@ -34,7 +34,7 @@ declare const config: {
         };
     };
 };
-declare const _default: import("vue").DefineComponent<{
+declare const _default: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
     modelValue: {
         type: NumberConstructor;
         default: any;
@@ -70,7 +70,7 @@ declare const _default: import("vue").DefineComponent<{
         }>;
         default: () => {};
     };
-}, {
+}>, {
     ui: import("vue").ComputedRef<{
         wrapper: string;
         container: string;
@@ -108,12 +108,12 @@ declare const _default: import("vue").DefineComponent<{
     attrs: import("vue").ComputedRef<Pick<{
         [x: string]: unknown;
     }, string>>;
-    listRef: import("vue").Ref<HTMLElement>;
-    itemRefs: import("vue").Ref<HTMLElement[]>;
-    markerRef: import("vue").Ref<HTMLElement>;
-    selectedIndex: import("vue").Ref<number>;
+    listRef: import("vue").Ref<HTMLElement, HTMLElement>;
+    itemRefs: import("vue").Ref<HTMLElement[], HTMLElement[]>;
+    markerRef: import("vue").Ref<HTMLElement, HTMLElement>;
+    selectedIndex: import("vue").Ref<number, number>;
     onChange: (index: number) => void;
-}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("change" | "update:modelValue")[], "change" | "update:modelValue", import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
     modelValue: {
         type: NumberConstructor;
         default: any;
@@ -149,10 +149,10 @@ declare const _default: import("vue").DefineComponent<{
         }>;
         default: () => {};
     };
-}>> & {
+}>> & Readonly<{
     onChange?: (...args: any[]) => any;
     "onUpdate:modelValue"?: (...args: any[]) => any;
-}, {
+}>, {
     class: any;
     content: boolean;
     orientation: "horizontal" | "vertical";
@@ -161,5 +161,228 @@ declare const _default: import("vue").DefineComponent<{
     unmount: boolean;
     items: TabItem[];
     defaultIndex: number;
-}, {}>;
+}, {}, {
+    UIcon: import("vue").DefineComponent<import("vue").ExtractPropTypes<{
+        name: {
+            type: StringConstructor;
+            required: true;
+        };
+        mode: {
+            type: PropType<"svg" | "css">;
+            required: false;
+            default: any;
+        };
+        size: {
+            type: (StringConstructor | NumberConstructor)[];
+            required: false;
+            default: any;
+        };
+        customize: {
+            type: FunctionConstructor;
+            required: false;
+            default: any;
+        };
+    }>, {}, {}, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {}, string, import("vue").PublicProps, Readonly<import("vue").ExtractPropTypes<{
+        name: {
+            type: StringConstructor;
+            required: true;
+        };
+        mode: {
+            type: PropType<"svg" | "css">;
+            required: false;
+            default: any;
+        };
+        size: {
+            type: (StringConstructor | NumberConstructor)[];
+            required: false;
+            default: any;
+        };
+        customize: {
+            type: FunctionConstructor;
+            required: false;
+            default: any;
+        };
+    }>> & Readonly<{}>, {
+        mode: "svg" | "css";
+        size: string | number;
+        customize: Function;
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    HTabGroup: import("vue").DefineComponent<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+        selectedIndex: {
+            type: NumberConstructor[];
+            default: null;
+        };
+        defaultIndex: {
+            type: NumberConstructor[];
+            default: number;
+        };
+        vertical: {
+            type: BooleanConstructor[];
+            default: boolean;
+        };
+        manual: {
+            type: BooleanConstructor[];
+            default: boolean;
+        };
+    }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, {
+        change: (_index: number) => true;
+    }, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+        selectedIndex: {
+            type: NumberConstructor[];
+            default: null;
+        };
+        defaultIndex: {
+            type: NumberConstructor[];
+            default: number;
+        };
+        vertical: {
+            type: BooleanConstructor[];
+            default: boolean;
+        };
+        manual: {
+            type: BooleanConstructor[];
+            default: boolean;
+        };
+    }>> & {
+        onChange?: ((_index: number) => any) | undefined;
+    }, {
+        as: string | Record<string, any>;
+        vertical: boolean;
+        manual: boolean;
+        selectedIndex: number;
+        defaultIndex: number;
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    HTabList: import("vue").DefineComponent<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+    }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }>[] | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+    }>>, {
+        as: string | Record<string, any>;
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    HTab: import("vue").DefineComponent<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+        disabled: {
+            type: BooleanConstructor[];
+            default: boolean;
+        };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
+    }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }>[] | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+        disabled: {
+            type: BooleanConstructor[];
+            default: boolean;
+        };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
+    }>>, {
+        id: string;
+        as: string | Record<string, any>;
+        disabled: boolean;
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    HTabPanels: import("vue").DefineComponent<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+    }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }>[] | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+    }>>, {
+        as: string | Record<string, any>;
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+    HTabPanel: import("vue").DefineComponent<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+        static: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        unmount: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
+        tabIndex: {
+            type: NumberConstructor;
+            default: number;
+        };
+    }, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }> | import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+        [key: string]: any;
+    }>[] | null, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, Record<string, any>, string, import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+        as: {
+            type: (ObjectConstructor | StringConstructor)[];
+            default: string;
+        };
+        static: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        unmount: {
+            type: BooleanConstructor;
+            default: boolean;
+        };
+        id: {
+            type: StringConstructor;
+            default: null;
+        };
+        tabIndex: {
+            type: NumberConstructor;
+            default: number;
+        };
+    }>>, {
+        id: string;
+        tabIndex: number;
+        as: string | Record<string, any>;
+        unmount: boolean;
+        static: boolean;
+    }, {}, {}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
+}, {}, string, import("vue").ComponentProvideOptions, true, {}, any>;
 export default _default;