@vuetify/nightly 4.0.0-dev-20230511.0 → 4.0.0-dev-20230512.0

package/lib/components/VSystemBar/VSystemBar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VSystemBar.mjs","names":["makeComponentProps","makeElevationProps","useElevation","makeLayoutItemProps","useLayoutItem","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","useBackgroundColor","useSsrBoot","computed","ref","toRef","genericComponent","useRender","VSystemBar","name","props","color","String","height","Number","window","Boolean","setup","_ref","slots","themeClasses","backgroundColorClasses","backgroundColorStyles","elevationClasses","roundedClasses","ssrBootStyles","layoutItemStyles","id","order","parseInt","position","layoutSize","elementSize","active","absolute","_createVNode","tag","value","class","style"],"sources":["../../../src/components/VSystemBar/VSystemBar.tsx"],"sourcesContent":["// Styles\nimport './VSystemBar.sass'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeLayoutItemProps, useLayoutItem } from '@/composables/layout'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useBackgroundColor } from '@/composables/color'\nimport { useSsrBoot } from '@/composables/ssrBoot'\n\n// Utilities\nimport { computed, ref, toRef } from 'vue'\nimport { genericComponent, useRender } from '@/util'\n\nexport const VSystemBar = genericComponent()({\n  name: 'VSystemBar',\n\n  props: {\n    color: String,\n    height: [Number, String],\n    window: Boolean,\n\n    ...makeComponentProps(),\n    ...makeElevationProps(),\n    ...makeLayoutItemProps(),\n    ...makeRoundedProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'color'))\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(props)\n    const { ssrBootStyles } = useSsrBoot()\n    const height = computed(() => props.height ?? (props.window ? 32 : 24))\n    const { layoutItemStyles } = useLayoutItem({\n      id: props.name,\n      order: computed(() => parseInt(props.order, 10)),\n      position: ref('top'),\n      layoutSize: height,\n      elementSize: height,\n      active: computed(() => true),\n      absolute: toRef(props, 'absolute'),\n    })\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-system-bar',\n          { 'v-system-bar--window': props.window },\n          themeClasses.value,\n          backgroundColorClasses.value,\n          elevationClasses.value,\n          roundedClasses.value,\n          props.class,\n        ]}\n        style={[\n          backgroundColorStyles.value,\n          layoutItemStyles.value,\n          ssrBootStyles.value,\n          props.style,\n        ]}\n        v-slots={ slots }\n      />\n    ))\n\n    return {}\n  },\n})\n\nexport type VSystemBar = InstanceType<typeof VSystemBar>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,kBAAkB;AAAA,SAClBC,kBAAkB,EAAEC,YAAY;AAAA,SAChCC,mBAAmB,EAAEC,aAAa;AAAA,SAClCC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,YAAY;AAAA,SACZC,cAAc,EAAEC,YAAY;AAAA,SAC5BC,kBAAkB;AAAA,SAClBC,UAAU,yCAEnB;AACA,SAASC,QAAQ,EAAEC,GAAG,EAAEC,KAAK,QAAQ,KAAK;AAAA,SACjCC,gBAAgB,EAAEC,SAAS;AAEpC,OAAO,MAAMC,UAAU,GAAGF,gBAAgB,EAAE,CAAC;EAC3CG,IAAI,EAAE,YAAY;EAElBC,KAAK,EAAE;IACLC,KAAK,EAAEC,MAAM;IACbC,MAAM,EAAE,CAACC,MAAM,EAAEF,MAAM,CAAC;IACxBG,MAAM,EAAEC,OAAO;IAEf,GAAGzB,kBAAkB,EAAE;IACvB,GAAGC,kBAAkB,EAAE;IACvB,GAAGE,mBAAmB,EAAE;IACxB,GAAGE,gBAAgB,EAAE;IACrB,GAAGE,YAAY,EAAE;IACjB,GAAGC,cAAc;EACnB,CAAC;EAEDkB,KAAKA,CAAEP,KAAK,EAAAQ,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEE;IAAa,CAAC,GAAGpB,YAAY,CAACU,KAAK,CAAC;IAC5C,MAAM;MAAEW,sBAAsB;MAAEC;IAAsB,CAAC,GAAGrB,kBAAkB,CAACI,KAAK,CAACK,KAAK,EAAE,OAAO,CAAC,CAAC;IACnG,MAAM;MAAEa;IAAiB,CAAC,GAAG9B,YAAY,CAACiB,KAAK,CAAC;IAChD,MAAM;MAAEc;IAAe,CAAC,GAAG3B,UAAU,CAACa,KAAK,CAAC;IAC5C,MAAM;MAAEe;IAAc,CAAC,GAAGvB,UAAU,EAAE;IACtC,MAAMW,MAAM,GAAGV,QAAQ,CAAC,MAAMO,KAAK,CAACG,MAAM,KAAKH,KAAK,CAACK,MAAM,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;IACvE,MAAM;MAAEW;IAAiB,CAAC,GAAG/B,aAAa,CAAC;MACzCgC,EAAE,EAAEjB,KAAK,CAACD,IAAI;MACdmB,KAAK,EAAEzB,QAAQ,CAAC,MAAM0B,QAAQ,CAACnB,KAAK,CAACkB,KAAK,EAAE,EAAE,CAAC,CAAC;MAChDE,QAAQ,EAAE1B,GAAG,CAAC,KAAK,CAAC;MACpB2B,UAAU,EAAElB,MAAM;MAClBmB,WAAW,EAAEnB,MAAM;MACnBoB,MAAM,EAAE9B,QAAQ,CAAC,MAAM,IAAI,CAAC;MAC5B+B,QAAQ,EAAE7B,KAAK,CAACK,KAAK,EAAE,UAAU;IACnC,CAAC,CAAC;IAEFH,SAAS,CAAC,MAAA4B,YAAA,CAAAzB,KAAA,CAAA0B,GAAA;MAAA,SAEC,CACL,cAAc,EACd;QAAE,sBAAsB,EAAE1B,KAAK,CAACK;MAAO,CAAC,EACxCK,YAAY,CAACiB,KAAK,EAClBhB,sBAAsB,CAACgB,KAAK,EAC5Bd,gBAAgB,CAACc,KAAK,EACtBb,cAAc,CAACa,KAAK,EACpB3B,KAAK,CAAC4B,KAAK,CACZ;MAAA,SACM,CACLhB,qBAAqB,CAACe,KAAK,EAC3BX,gBAAgB,CAACW,KAAK,EACtBZ,aAAa,CAACY,KAAK,EACnB3B,KAAK,CAAC6B,KAAK;IACZ,GACSpB,KAAK,CAElB,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
+{"version":3,"file":"VSystemBar.mjs","names":["makeComponentProps","makeElevationProps","useElevation","makeLayoutItemProps","useLayoutItem","makeRoundedProps","useRounded","makeTagProps","makeThemeProps","provideTheme","useBackgroundColor","useSsrBoot","computed","shallowRef","toRef","genericComponent","propsFactory","useRender","makeVSystemBarProps","color","String","height","Number","window","Boolean","VSystemBar","name","props","setup","_ref","slots","themeClasses","backgroundColorClasses","backgroundColorStyles","elevationClasses","roundedClasses","ssrBootStyles","layoutItemStyles","id","order","parseInt","position","layoutSize","elementSize","active","absolute","_createVNode","tag","value","class","style"],"sources":["../../../src/components/VSystemBar/VSystemBar.tsx"],"sourcesContent":["// Styles\nimport './VSystemBar.sass'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeElevationProps, useElevation } from '@/composables/elevation'\nimport { makeLayoutItemProps, useLayoutItem } from '@/composables/layout'\nimport { makeRoundedProps, useRounded } from '@/composables/rounded'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\nimport { useBackgroundColor } from '@/composables/color'\nimport { useSsrBoot } from '@/composables/ssrBoot'\n\n// Utilities\nimport { computed, shallowRef, toRef } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\nexport const makeVSystemBarProps = propsFactory({\n  color: String,\n  height: [Number, String],\n  window: Boolean,\n\n  ...makeComponentProps(),\n  ...makeElevationProps(),\n  ...makeLayoutItemProps(),\n  ...makeRoundedProps(),\n  ...makeTagProps(),\n  ...makeThemeProps(),\n}, 'v-system-bar')\n\nexport const VSystemBar = genericComponent()({\n  name: 'VSystemBar',\n\n  props: makeVSystemBarProps(),\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(toRef(props, 'color'))\n    const { elevationClasses } = useElevation(props)\n    const { roundedClasses } = useRounded(props)\n    const { ssrBootStyles } = useSsrBoot()\n    const height = computed(() => props.height ?? (props.window ? 32 : 24))\n    const { layoutItemStyles } = useLayoutItem({\n      id: props.name,\n      order: computed(() => parseInt(props.order, 10)),\n      position: shallowRef('top'),\n      layoutSize: height,\n      elementSize: height,\n      active: computed(() => true),\n      absolute: toRef(props, 'absolute'),\n    })\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-system-bar',\n          { 'v-system-bar--window': props.window },\n          themeClasses.value,\n          backgroundColorClasses.value,\n          elevationClasses.value,\n          roundedClasses.value,\n          props.class,\n        ]}\n        style={[\n          backgroundColorStyles.value,\n          layoutItemStyles.value,\n          ssrBootStyles.value,\n          props.style,\n        ]}\n        v-slots={ slots }\n      />\n    ))\n\n    return {}\n  },\n})\n\nexport type VSystemBar = InstanceType<typeof VSystemBar>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,kBAAkB;AAAA,SAClBC,kBAAkB,EAAEC,YAAY;AAAA,SAChCC,mBAAmB,EAAEC,aAAa;AAAA,SAClCC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,YAAY;AAAA,SACZC,cAAc,EAAEC,YAAY;AAAA,SAC5BC,kBAAkB;AAAA,SAClBC,UAAU,yCAEnB;AACA,SAASC,QAAQ,EAAEC,UAAU,EAAEC,KAAK,QAAQ,KAAK;AAAA,SACxCC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS;AAElD,OAAO,MAAMC,mBAAmB,GAAGF,YAAY,CAAC;EAC9CG,KAAK,EAAEC,MAAM;EACbC,MAAM,EAAE,CAACC,MAAM,EAAEF,MAAM,CAAC;EACxBG,MAAM,EAAEC,OAAO;EAEf,GAAGxB,kBAAkB,EAAE;EACvB,GAAGC,kBAAkB,EAAE;EACvB,GAAGE,mBAAmB,EAAE;EACxB,GAAGE,gBAAgB,EAAE;EACrB,GAAGE,YAAY,EAAE;EACjB,GAAGC,cAAc;AACnB,CAAC,EAAE,cAAc,CAAC;AAElB,OAAO,MAAMiB,UAAU,GAAGV,gBAAgB,EAAE,CAAC;EAC3CW,IAAI,EAAE,YAAY;EAElBC,KAAK,EAAET,mBAAmB,EAAE;EAE5BU,KAAKA,CAAED,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEE;IAAa,CAAC,GAAGtB,YAAY,CAACkB,KAAK,CAAC;IAC5C,MAAM;MAAEK,sBAAsB;MAAEC;IAAsB,CAAC,GAAGvB,kBAAkB,CAACI,KAAK,CAACa,KAAK,EAAE,OAAO,CAAC,CAAC;IACnG,MAAM;MAAEO;IAAiB,CAAC,GAAGhC,YAAY,CAACyB,KAAK,CAAC;IAChD,MAAM;MAAEQ;IAAe,CAAC,GAAG7B,UAAU,CAACqB,KAAK,CAAC;IAC5C,MAAM;MAAES;IAAc,CAAC,GAAGzB,UAAU,EAAE;IACtC,MAAMU,MAAM,GAAGT,QAAQ,CAAC,MAAMe,KAAK,CAACN,MAAM,KAAKM,KAAK,CAACJ,MAAM,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC;IACvE,MAAM;MAAEc;IAAiB,CAAC,GAAGjC,aAAa,CAAC;MACzCkC,EAAE,EAAEX,KAAK,CAACD,IAAI;MACda,KAAK,EAAE3B,QAAQ,CAAC,MAAM4B,QAAQ,CAACb,KAAK,CAACY,KAAK,EAAE,EAAE,CAAC,CAAC;MAChDE,QAAQ,EAAE5B,UAAU,CAAC,KAAK,CAAC;MAC3B6B,UAAU,EAAErB,MAAM;MAClBsB,WAAW,EAAEtB,MAAM;MACnBuB,MAAM,EAAEhC,QAAQ,CAAC,MAAM,IAAI,CAAC;MAC5BiC,QAAQ,EAAE/B,KAAK,CAACa,KAAK,EAAE,UAAU;IACnC,CAAC,CAAC;IAEFV,SAAS,CAAC,MAAA6B,YAAA,CAAAnB,KAAA,CAAAoB,GAAA;MAAA,SAEC,CACL,cAAc,EACd;QAAE,sBAAsB,EAAEpB,KAAK,CAACJ;MAAO,CAAC,EACxCQ,YAAY,CAACiB,KAAK,EAClBhB,sBAAsB,CAACgB,KAAK,EAC5Bd,gBAAgB,CAACc,KAAK,EACtBb,cAAc,CAACa,KAAK,EACpBrB,KAAK,CAACsB,KAAK,CACZ;MAAA,SACM,CACLhB,qBAAqB,CAACe,KAAK,EAC3BX,gBAAgB,CAACW,KAAK,EACtBZ,aAAa,CAACY,KAAK,EACnBrB,KAAK,CAACuB,KAAK;IACZ,GACSpB,KAAK,CAElB,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

package/lib/components/VSystemBar/index.d.mts

@@ -9,37 +9,69 @@ declare const VSystemBar: {
     new (...args: any[]): {
         $: vue.ComponentInternalInstance;
         $data: {};
-        $props: Partial<{
-            window: boolean;
-            absolute: boolean;
-            order: string | number;
-            style: vue.StyleValue;
-            tag: string;
-            rounded: string | number | boolean;
-        }> & Omit<{
-            window: boolean;
-            absolute: boolean;
-            order: string | number;
-            style: vue.StyleValue;
-            tag: string;
-        } & {
+        $props: {
+            window?: boolean | undefined;
+            absolute?: boolean | undefined;
+            order?: string | number | undefined;
+            style?: vue.StyleValue | undefined;
+            tag?: string | undefined;
+            rounded?: string | number | boolean | undefined;
+            key?: string | number | symbol | undefined;
             height?: string | number | undefined;
             name?: string | undefined;
             color?: string | undefined;
             class?: any;
-            elevation?: string | number | undefined;
-            theme?: string | undefined;
-            rounded?: string | number | boolean | undefined;
-        } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
             };
+            elevation?: string | number | undefined;
+            ref?: vue.VNodeRef | undefined;
+            ref_for?: boolean | undefined;
+            ref_key?: string | undefined;
+            theme?: string | undefined;
+            "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
-        } & {
-            "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
-        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "window" | "absolute" | "order" | "style" | "tag" | "rounded">;
+            onVnodeBeforeMount?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeMounted?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeBeforeUpdate?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeUpdated?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeBeforeUnmount?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeUnmounted?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+        };
         $attrs: {
             [x: string]: unknown;
         };
@@ -47,10 +79,12 @@ declare const VSystemBar: {
             [x: string]: unknown;
         };
         $slots: Readonly<{
-            [name: string]: vue.Slot | undefined;
+            default?: (() => vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>[]) | undefined;
         }>;
-        $root: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
-        $parent: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
+        $root: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null;
+        $parent: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null;
         $emit: (event: string, ...args: any[]) => void;
         $el: any;
         $options: vue.ComponentOptionsBase<{
@@ -83,7 +117,11 @@ declare const VSystemBar: {
             style: vue.StyleValue;
             tag: string;
             rounded: string | number | boolean;
-        }, {}, string> & {
+        }, {}, string, vue.SlotsType<Partial<{
+            default: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>[];
+        }>>> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
             created?: ((() => void) | (() => void)[]) | undefined;
             beforeMount?: ((() => void) | (() => void)[]) | undefined;
@@ -98,7 +136,7 @@ declare const VSystemBar: {
             unmounted?: ((() => void) | (() => void)[]) | undefined;
             renderTracked?: (((e: vue.DebuggerEvent) => void) | ((e: vue.DebuggerEvent) => void)[]) | undefined;
             renderTriggered?: (((e: vue.DebuggerEvent) => void) | ((e: vue.DebuggerEvent) => void)[]) | undefined;
-            errorCaptured?: (((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null, info: string) => boolean | void) | ((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null, info: string) => boolean | void)[]) | undefined;
+            errorCaptured?: (((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null, info: string) => boolean | void) | ((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null, info: string) => boolean | void)[]) | undefined;
         };
         $forceUpdate: () => void;
         $nextTick: typeof vue.nextTick;
@@ -160,7 +198,11 @@ declare const VSystemBar: {
     style: vue.StyleValue;
     tag: string;
     rounded: string | number | boolean;
-}, {}, string> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}, {}, string, vue.SlotsType<Partial<{
+    default: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     theme: StringConstructor;
     tag: {
         type: StringConstructor;

package/lib/components/VTable/VTable.mjs

@@ -7,19 +7,20 @@ import { makeComponentProps } from "../../composables/component.mjs";
 import { makeDensityProps, useDensity } from "../../composables/density.mjs";
 import { makeTagProps } from "../../composables/tag.mjs";
 import { makeThemeProps, provideTheme } from "../../composables/theme.mjs"; // Utilities
-import { convertToUnit, genericComponent, useRender } from "../../util/index.mjs";
+import { convertToUnit, genericComponent, propsFactory, useRender } from "../../util/index.mjs";
+export const makeVTableProps = propsFactory({
+  fixedHeader: Boolean,
+  fixedFooter: Boolean,
+  height: [Number, String],
+  hover: Boolean,
+  ...makeComponentProps(),
+  ...makeDensityProps(),
+  ...makeTagProps(),
+  ...makeThemeProps()
+}, 'v-table');
 export const VTable = genericComponent()({
   name: 'VTable',
-  props: {
-    fixedHeader: Boolean,
-    fixedFooter: Boolean,
-    height: [Number, String],
-    hover: Boolean,
-    ...makeComponentProps(),
-    ...makeDensityProps(),
-    ...makeTagProps(),
-    ...makeThemeProps()
-  },
+  props: makeVTableProps(),
   setup(props, _ref) {
     let {
       slots

package/lib/components/VTable/VTable.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VTable.mjs","names":["makeComponentProps","makeDensityProps","useDensity","makeTagProps","makeThemeProps","provideTheme","convertToUnit","genericComponent","useRender","VTable","name","props","fixedHeader","Boolean","fixedFooter","height","Number","String","hover","setup","_ref","slots","themeClasses","densityClasses","_createVNode","tag","top","bottom","value","class","style","default","wrapper"],"sources":["../../../src/components/VTable/VTable.tsx"],"sourcesContent":["// Styles\nimport './VTable.sass'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\n\n// Utilities\nimport { convertToUnit, genericComponent, useRender } from '@/util'\n\nexport type VTableSlots = {\n  default: []\n  top: []\n  bottom: []\n  wrapper: []\n}\n\nexport const VTable = genericComponent<VTableSlots>()({\n  name: 'VTable',\n\n  props: {\n    fixedHeader: Boolean,\n    fixedFooter: Boolean,\n    height: [Number, String],\n    hover: Boolean,\n\n    ...makeComponentProps(),\n    ...makeDensityProps(),\n    ...makeTagProps(),\n    ...makeThemeProps(),\n  },\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { densityClasses } = useDensity(props)\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-table',\n          {\n            'v-table--fixed-height': !!props.height,\n            'v-table--fixed-header': props.fixedHeader,\n            'v-table--fixed-footer': props.fixedFooter,\n            'v-table--has-top': !!slots.top,\n            'v-table--has-bottom': !!slots.bottom,\n            'v-table--hover': props.hover,\n          },\n          themeClasses.value,\n          densityClasses.value,\n          props.class,\n        ]}\n        style={ props.style }\n      >\n        { slots.top?.() }\n\n        { slots.default ? (\n          <div\n            class=\"v-table__wrapper\"\n            style={{ height: convertToUnit(props.height) }}\n          >\n            <table>\n              { slots.default() }\n            </table>\n          </div>\n        ) : slots.wrapper?.()}\n\n        { slots.bottom?.() }\n      </props.tag>\n    ))\n\n    return {}\n  },\n})\n\nexport type VTable = InstanceType<typeof VTable>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,kBAAkB;AAAA,SAClBC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,YAAY;AAAA,SACZC,cAAc,EAAEC,YAAY,uCAErC;AAAA,SACSC,aAAa,EAAEC,gBAAgB,EAAEC,SAAS;AASnD,OAAO,MAAMC,MAAM,GAAGF,gBAAgB,EAAe,CAAC;EACpDG,IAAI,EAAE,QAAQ;EAEdC,KAAK,EAAE;IACLC,WAAW,EAAEC,OAAO;IACpBC,WAAW,EAAED,OAAO;IACpBE,MAAM,EAAE,CAACC,MAAM,EAAEC,MAAM,CAAC;IACxBC,KAAK,EAAEL,OAAO;IAEd,GAAGb,kBAAkB,EAAE;IACvB,GAAGC,gBAAgB,EAAE;IACrB,GAAGE,YAAY,EAAE;IACjB,GAAGC,cAAc;EACnB,CAAC;EAEDe,KAAKA,CAAER,KAAK,EAAAS,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEE;IAAa,CAAC,GAAGjB,YAAY,CAACM,KAAK,CAAC;IAC5C,MAAM;MAAEY;IAAe,CAAC,GAAGrB,UAAU,CAACS,KAAK,CAAC;IAE5CH,SAAS,CAAC,MAAAgB,YAAA,CAAAb,KAAA,CAAAc,GAAA;MAAA,SAEC,CACL,SAAS,EACT;QACE,uBAAuB,EAAE,CAAC,CAACd,KAAK,CAACI,MAAM;QACvC,uBAAuB,EAAEJ,KAAK,CAACC,WAAW;QAC1C,uBAAuB,EAAED,KAAK,CAACG,WAAW;QAC1C,kBAAkB,EAAE,CAAC,CAACO,KAAK,CAACK,GAAG;QAC/B,qBAAqB,EAAE,CAAC,CAACL,KAAK,CAACM,MAAM;QACrC,gBAAgB,EAAEhB,KAAK,CAACO;MAC1B,CAAC,EACDI,YAAY,CAACM,KAAK,EAClBL,cAAc,CAACK,KAAK,EACpBjB,KAAK,CAACkB,KAAK,CACZ;MAAA,SACOlB,KAAK,CAACmB;IAAK;MAAAC,OAAA,EAAAA,CAAA,MAEjBV,KAAK,CAACK,GAAG,IAAI,EAEbL,KAAK,CAACU,OAAO,GAAAP,YAAA;QAAA,SAEL,kBAAkB;QAAA,SACjB;UAAET,MAAM,EAAET,aAAa,CAACK,KAAK,CAACI,MAAM;QAAE;MAAC,IAAAS,YAAA,iBAG1CH,KAAK,CAACU,OAAO,EAAE,OAGnBV,KAAK,CAACW,OAAO,IAAI,EAEnBX,KAAK,CAACM,MAAM,IAAI;IAAA,EAErB,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}
+{"version":3,"file":"VTable.mjs","names":["makeComponentProps","makeDensityProps","useDensity","makeTagProps","makeThemeProps","provideTheme","convertToUnit","genericComponent","propsFactory","useRender","makeVTableProps","fixedHeader","Boolean","fixedFooter","height","Number","String","hover","VTable","name","props","setup","_ref","slots","themeClasses","densityClasses","_createVNode","tag","top","bottom","value","class","style","default","wrapper"],"sources":["../../../src/components/VTable/VTable.tsx"],"sourcesContent":["// Styles\nimport './VTable.sass'\n\n// Composables\nimport { makeComponentProps } from '@/composables/component'\nimport { makeDensityProps, useDensity } from '@/composables/density'\nimport { makeTagProps } from '@/composables/tag'\nimport { makeThemeProps, provideTheme } from '@/composables/theme'\n\n// Utilities\nimport { convertToUnit, genericComponent, propsFactory, useRender } from '@/util'\n\nexport type VTableSlots = {\n  default: []\n  top: []\n  bottom: []\n  wrapper: []\n}\n\nexport const makeVTableProps = propsFactory({\n  fixedHeader: Boolean,\n  fixedFooter: Boolean,\n  height: [Number, String],\n  hover: Boolean,\n\n  ...makeComponentProps(),\n  ...makeDensityProps(),\n  ...makeTagProps(),\n  ...makeThemeProps(),\n}, 'v-table')\n\nexport const VTable = genericComponent<VTableSlots>()({\n  name: 'VTable',\n\n  props: makeVTableProps(),\n\n  setup (props, { slots }) {\n    const { themeClasses } = provideTheme(props)\n    const { densityClasses } = useDensity(props)\n\n    useRender(() => (\n      <props.tag\n        class={[\n          'v-table',\n          {\n            'v-table--fixed-height': !!props.height,\n            'v-table--fixed-header': props.fixedHeader,\n            'v-table--fixed-footer': props.fixedFooter,\n            'v-table--has-top': !!slots.top,\n            'v-table--has-bottom': !!slots.bottom,\n            'v-table--hover': props.hover,\n          },\n          themeClasses.value,\n          densityClasses.value,\n          props.class,\n        ]}\n        style={ props.style }\n      >\n        { slots.top?.() }\n\n        { slots.default ? (\n          <div\n            class=\"v-table__wrapper\"\n            style={{ height: convertToUnit(props.height) }}\n          >\n            <table>\n              { slots.default() }\n            </table>\n          </div>\n        ) : slots.wrapper?.()}\n\n        { slots.bottom?.() }\n      </props.tag>\n    ))\n\n    return {}\n  },\n})\n\nexport type VTable = InstanceType<typeof VTable>\n"],"mappings":";AAAA;AACA;;AAEA;AAAA,SACSA,kBAAkB;AAAA,SAClBC,gBAAgB,EAAEC,UAAU;AAAA,SAC5BC,YAAY;AAAA,SACZC,cAAc,EAAEC,YAAY,uCAErC;AAAA,SACSC,aAAa,EAAEC,gBAAgB,EAAEC,YAAY,EAAEC,SAAS;AASjE,OAAO,MAAMC,eAAe,GAAGF,YAAY,CAAC;EAC1CG,WAAW,EAAEC,OAAO;EACpBC,WAAW,EAAED,OAAO;EACpBE,MAAM,EAAE,CAACC,MAAM,EAAEC,MAAM,CAAC;EACxBC,KAAK,EAAEL,OAAO;EAEd,GAAGZ,kBAAkB,EAAE;EACvB,GAAGC,gBAAgB,EAAE;EACrB,GAAGE,YAAY,EAAE;EACjB,GAAGC,cAAc;AACnB,CAAC,EAAE,SAAS,CAAC;AAEb,OAAO,MAAMc,MAAM,GAAGX,gBAAgB,EAAe,CAAC;EACpDY,IAAI,EAAE,QAAQ;EAEdC,KAAK,EAAEV,eAAe,EAAE;EAExBW,KAAKA,CAAED,KAAK,EAAAE,IAAA,EAAa;IAAA,IAAX;MAAEC;IAAM,CAAC,GAAAD,IAAA;IACrB,MAAM;MAAEE;IAAa,CAAC,GAAGnB,YAAY,CAACe,KAAK,CAAC;IAC5C,MAAM;MAAEK;IAAe,CAAC,GAAGvB,UAAU,CAACkB,KAAK,CAAC;IAE5CX,SAAS,CAAC,MAAAiB,YAAA,CAAAN,KAAA,CAAAO,GAAA;MAAA,SAEC,CACL,SAAS,EACT;QACE,uBAAuB,EAAE,CAAC,CAACP,KAAK,CAACN,MAAM;QACvC,uBAAuB,EAAEM,KAAK,CAACT,WAAW;QAC1C,uBAAuB,EAAES,KAAK,CAACP,WAAW;QAC1C,kBAAkB,EAAE,CAAC,CAACU,KAAK,CAACK,GAAG;QAC/B,qBAAqB,EAAE,CAAC,CAACL,KAAK,CAACM,MAAM;QACrC,gBAAgB,EAAET,KAAK,CAACH;MAC1B,CAAC,EACDO,YAAY,CAACM,KAAK,EAClBL,cAAc,CAACK,KAAK,EACpBV,KAAK,CAACW,KAAK,CACZ;MAAA,SACOX,KAAK,CAACY;IAAK;MAAAC,OAAA,EAAAA,CAAA,MAEjBV,KAAK,CAACK,GAAG,IAAI,EAEbL,KAAK,CAACU,OAAO,GAAAP,YAAA;QAAA,SAEL,kBAAkB;QAAA,SACjB;UAAEZ,MAAM,EAAER,aAAa,CAACc,KAAK,CAACN,MAAM;QAAE;MAAC,IAAAY,YAAA,iBAG1CH,KAAK,CAACU,OAAO,EAAE,OAGnBV,KAAK,CAACW,OAAO,IAAI,EAEnBX,KAAK,CAACM,MAAM,IAAI;IAAA,EAErB,CAAC;IAEF,OAAO,CAAC,CAAC;EACX;AACF,CAAC,CAAC"}

package/lib/components/VTable/index.d.mts

@@ -11,43 +11,75 @@ declare const VTable: {
     new (...args: any[]): {
         $: vue.ComponentInternalInstance;
         $data: {};
-        $props: Partial<{
-            style: vue.StyleValue;
-            tag: string;
-            density: Density;
-            hover: boolean;
-            fixedHeader: boolean;
-            fixedFooter: boolean;
-        }> & Omit<{
-            style: vue.StyleValue;
-            tag: string;
-            density: Density;
-            hover: boolean;
-            fixedHeader: boolean;
-            fixedFooter: boolean;
-        } & {
+        $props: {
+            style?: vue.StyleValue | undefined;
+            tag?: string | undefined;
+            density?: Density | undefined;
+            hover?: boolean | undefined;
+            fixedHeader?: boolean | undefined;
+            fixedFooter?: boolean | undefined;
+            key?: string | number | symbol | undefined;
             height?: string | number | undefined;
             class?: any;
-            theme?: string | undefined;
-        } & {
             $children?: vue.VNodeChild | (() => vue.VNodeChild) | {
                 default?: (() => vue.VNodeChild) | undefined;
                 top?: (() => vue.VNodeChild) | undefined;
                 bottom?: (() => vue.VNodeChild) | undefined;
                 wrapper?: (() => vue.VNodeChild) | undefined;
             };
+            ref?: vue.VNodeRef | undefined;
+            ref_for?: boolean | undefined;
+            ref_key?: string | undefined;
+            theme?: string | undefined;
+            "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
             'v-slots'?: {
                 default?: false | (() => vue.VNodeChild) | undefined;
                 top?: false | (() => vue.VNodeChild) | undefined;
                 bottom?: false | (() => vue.VNodeChild) | undefined;
                 wrapper?: false | (() => vue.VNodeChild) | undefined;
             } | undefined;
-        } & {
-            "v-slot:default"?: false | (() => vue.VNodeChild) | undefined;
+            onVnodeBeforeMount?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeMounted?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeBeforeUpdate?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeUpdated?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>, oldVNode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeBeforeUnmount?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
+            onVnodeUnmounted?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>) => void)[] | undefined;
             "v-slot:top"?: false | (() => vue.VNodeChild) | undefined;
             "v-slot:bottom"?: false | (() => vue.VNodeChild) | undefined;
             "v-slot:wrapper"?: false | (() => vue.VNodeChild) | undefined;
-        } & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps, "style" | "tag" | "density" | "hover" | "fixedHeader" | "fixedFooter">;
+        };
         $attrs: {
             [x: string]: unknown;
         };
@@ -55,10 +87,21 @@ declare const VTable: {
             [x: string]: unknown;
         };
         $slots: Readonly<{
-            [name: string]: vue.Slot | undefined;
+            default?: (() => vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>[]) | undefined;
+            top?: (() => vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>[]) | undefined;
+            bottom?: (() => vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>[]) | undefined;
+            wrapper?: (() => vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>[]) | undefined;
         }>;
-        $root: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
-        $parent: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null;
+        $root: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null;
+        $parent: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null;
         $emit: (event: string, ...args: any[]) => void;
         $el: any;
         $options: vue.ComponentOptionsBase<{
@@ -97,7 +140,20 @@ declare const VTable: {
             hover: boolean;
             fixedHeader: boolean;
             fixedFooter: boolean;
-        }, {}, string> & {
+        }, {}, string, vue.SlotsType<Partial<{
+            default: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>[];
+            top: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>[];
+            bottom: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>[];
+            wrapper: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+                [key: string]: any;
+            }>[];
+        }>>> & {
             beforeCreate?: ((() => void) | (() => void)[]) | undefined;
             created?: ((() => void) | (() => void)[]) | undefined;
             beforeMount?: ((() => void) | (() => void)[]) | undefined;
@@ -112,7 +168,7 @@ declare const VTable: {
             unmounted?: ((() => void) | (() => void)[]) | undefined;
             renderTracked?: (((e: vue.DebuggerEvent) => void) | ((e: vue.DebuggerEvent) => void)[]) | undefined;
             renderTriggered?: (((e: vue.DebuggerEvent) => void) | ((e: vue.DebuggerEvent) => void)[]) | undefined;
-            errorCaptured?: (((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null, info: string) => boolean | void) | ((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string>, {}> | null, info: string) => boolean | void)[]) | undefined;
+            errorCaptured?: (((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null, info: string) => boolean | void) | ((err: unknown, instance: vue.ComponentPublicInstance<{}, {}, {}, {}, {}, {}, {}, {}, false, vue.ComponentOptionsBase<any, any, any, any, any, any, any, any, any, {}, {}, string, {}>, {}, {}> | null, info: string) => boolean | void)[]) | undefined;
         };
         $forceUpdate: () => void;
         $nextTick: typeof vue.nextTick;
@@ -186,7 +242,20 @@ declare const VTable: {
     hover: boolean;
     fixedHeader: boolean;
     fixedFooter: boolean;
-}, {}, string> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}, {}, string, vue.SlotsType<Partial<{
+    default: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    top: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    bottom: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    wrapper: () => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
     theme: StringConstructor;
     tag: {
         type: StringConstructor;

package/lib/components/VTabs/VTab.mjs

@@ -3,27 +3,27 @@ import { mergeProps as _mergeProps, createVNode as _createVNode } from "vue";
 import "./VTab.css";
 
 // Components
-import { VBtn } from "../VBtn/index.mjs"; // Composables
+import { makeVBtnProps, VBtn } from "../VBtn/VBtn.mjs"; // Composables
 import { useTextColor } from "../../composables/color.mjs"; // Utilities
-import { computed, ref } from 'vue';
-import { animate, genericComponent, omit, standardEasing, useRender } from "../../util/index.mjs";
-import { makeVBtnProps } from "../VBtn/VBtn.mjs"; // Types
-import { VTabsSymbol } from "./shared.mjs";
+import { animate, genericComponent, omit, propsFactory, standardEasing, useRender } from "../../util/index.mjs";
+import { computed, ref, shallowRef } from 'vue';
+import { VTabsSymbol } from "./shared.mjs"; // Types
+export const makeVTabProps = propsFactory({
+  fixed: Boolean,
+  sliderColor: String,
+  hideSlider: Boolean,
+  direction: {
+    type: String,
+    default: 'horizontal'
+  },
+  ...omit(makeVBtnProps({
+    selectedClass: 'v-tab--selected',
+    variant: 'text'
+  }), ['active', 'block', 'flat', 'location', 'position', 'symbol'])
+}, 'v-tabs');
 export const VTab = genericComponent()({
   name: 'VTab',
-  props: {
-    fixed: Boolean,
-    sliderColor: String,
-    hideSlider: Boolean,
-    direction: {
-      type: String,
-      default: 'horizontal'
-    },
-    ...omit(makeVBtnProps({
-      selectedClass: 'v-tab--selected',
-      variant: 'text'
-    }), ['active', 'block', 'flat', 'location', 'position', 'symbol'])
-  },
+  props: makeVTabProps(),
   setup(props, _ref) {
     let {
       slots,
@@ -34,7 +34,7 @@ export const VTab = genericComponent()({
       textColorStyles: sliderColorStyles
     } = useTextColor(props, 'sliderColor');
     const isHorizontal = computed(() => props.direction === 'horizontal');
-    const isSelected = ref(false);
+    const isSelected = shallowRef(false);
     const rootEl = ref();
     const sliderEl = ref();
     function updateSlider(_ref2) {

package/lib/components/VTabs/VTab.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VTab.mjs","names":["VBtn","useTextColor","computed","ref","animate","genericComponent","omit","standardEasing","useRender","makeVBtnProps","VTabsSymbol","VTab","name","props","fixed","Boolean","sliderColor","String","hideSlider","direction","type","default","selectedClass","variant","setup","_ref","slots","attrs","textColorClasses","sliderColorClasses","textColorStyles","sliderColorStyles","isHorizontal","isSelected","rootEl","sliderEl","updateSlider","_ref2","value","prevEl","$el","parentElement","querySelector","nextEl","color","getComputedStyle","prevBox","getBoundingClientRect","nextBox","xy","XY","rightBottom","widthHeight","prevPos","nextPos","delta","origin","Math","sign","size","abs","scale","max","initialScale","sigma","backgroundColor","transform","transformOrigin","Array","fill","duration","easing","btnProps","filterProps","_createVNode","_mergeProps","class","style","undefined","text"],"sources":["../../../src/components/VTabs/VTab.tsx"],"sourcesContent":["// Styles\nimport './VTab.sass'\n\n// Components\nimport { VBtn } from '@/components/VBtn'\n\n// Composables\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { computed, ref } from 'vue'\nimport { animate, genericComponent, omit, standardEasing, useRender } from '@/util'\nimport { makeVBtnProps } from '@/components/VBtn/VBtn'\n\n// Types\nimport type { PropType } from 'vue'\nimport { VTabsSymbol } from './shared'\n\nexport const VTab = genericComponent()({\n  name: 'VTab',\n\n  props: {\n    fixed: Boolean,\n\n    sliderColor: String,\n    hideSlider: Boolean,\n\n    direction: {\n      type: String as PropType<'horizontal' | 'vertical'>,\n      default: 'horizontal',\n    },\n\n    ...omit(makeVBtnProps({\n      selectedClass: 'v-tab--selected',\n      variant: 'text' as const,\n    }), [\n      'active',\n      'block',\n      'flat',\n      'location',\n      'position',\n      'symbol',\n    ]),\n  },\n\n  setup (props, { slots, attrs }) {\n    const { textColorClasses: sliderColorClasses, textColorStyles: sliderColorStyles } = useTextColor(props, 'sliderColor')\n    const isHorizontal = computed(() => props.direction === 'horizontal')\n    const isSelected = ref(false)\n\n    const rootEl = ref<VBtn>()\n    const sliderEl = ref<HTMLElement>()\n\n    function updateSlider ({ value }: { value: boolean }) {\n      isSelected.value = value\n\n      if (value) {\n        const prevEl: HTMLElement | undefined = rootEl.value?.$el.parentElement?.querySelector('.v-tab--selected .v-tab__slider')\n        const nextEl = sliderEl.value\n\n        if (!prevEl || !nextEl) return\n\n        const color = getComputedStyle(prevEl).color\n\n        const prevBox = prevEl.getBoundingClientRect()\n        const nextBox = nextEl.getBoundingClientRect()\n\n        const xy = isHorizontal.value ? 'x' : 'y'\n        const XY = isHorizontal.value ? 'X' : 'Y'\n        const rightBottom = isHorizontal.value ? 'right' : 'bottom'\n        const widthHeight = isHorizontal.value ? 'width' : 'height'\n\n        const prevPos = prevBox[xy]\n        const nextPos = nextBox[xy]\n        const delta = prevPos > nextPos\n          ? prevBox[rightBottom] - nextBox[rightBottom]\n          : prevBox[xy] - nextBox[xy]\n        const origin =\n          Math.sign(delta) > 0 ? (isHorizontal.value ? 'right' : 'bottom')\n          : Math.sign(delta) < 0 ? (isHorizontal.value ? 'left' : 'top')\n          : 'center'\n        const size = Math.abs(delta) + (Math.sign(delta) < 0 ? prevBox[widthHeight] : nextBox[widthHeight])\n        const scale = size / Math.max(prevBox[widthHeight], nextBox[widthHeight])\n        const initialScale = prevBox[widthHeight] / nextBox[widthHeight]\n\n        const sigma = 1.5\n        animate(nextEl, {\n          backgroundColor: [color, ''],\n          transform: [\n            `translate${XY}(${delta}px) scale${XY}(${initialScale})`,\n            `translate${XY}(${delta / sigma}px) scale${XY}(${(scale - 1) / sigma + 1})`,\n            '',\n          ],\n          transformOrigin: Array(3).fill(origin),\n        }, {\n          duration: 225,\n          easing: standardEasing,\n        })\n      }\n    }\n\n    useRender(() => {\n      const [btnProps] = VBtn.filterProps(props)\n\n      return (\n        <VBtn\n          symbol={ VTabsSymbol }\n          ref={ rootEl }\n          class={[\n            'v-tab',\n            props.class,\n          ]}\n          style={ props.style }\n          tabindex={ isSelected.value ? 0 : -1 }\n          role=\"tab\"\n          aria-selected={ String(isSelected.value) }\n          active={ false }\n          block={ props.fixed }\n          maxWidth={ props.fixed ? 300 : undefined }\n          rounded={ 0 }\n          { ...btnProps }\n          { ...attrs }\n          onGroup:selected={ updateSlider }\n        >\n          { slots.default?.() ?? props.text }\n\n          { !props.hideSlider && (\n            <div\n              ref={ sliderEl }\n              class={[\n                'v-tab__slider',\n                sliderColorClasses.value,\n              ]}\n              style={ sliderColorStyles.value }\n            />\n          )}\n        </VBtn>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VTab = InstanceType<typeof VTab>\n"],"mappings":"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"}
+{"version":3,"file":"VTab.mjs","names":["makeVBtnProps","VBtn","useTextColor","animate","genericComponent","omit","propsFactory","standardEasing","useRender","computed","ref","shallowRef","VTabsSymbol","makeVTabProps","fixed","Boolean","sliderColor","String","hideSlider","direction","type","default","selectedClass","variant","VTab","name","props","setup","_ref","slots","attrs","textColorClasses","sliderColorClasses","textColorStyles","sliderColorStyles","isHorizontal","isSelected","rootEl","sliderEl","updateSlider","_ref2","value","prevEl","$el","parentElement","querySelector","nextEl","color","getComputedStyle","prevBox","getBoundingClientRect","nextBox","xy","XY","rightBottom","widthHeight","prevPos","nextPos","delta","origin","Math","sign","size","abs","scale","max","initialScale","sigma","backgroundColor","transform","transformOrigin","Array","fill","duration","easing","btnProps","filterProps","_createVNode","_mergeProps","class","style","undefined","text"],"sources":["../../../src/components/VTabs/VTab.tsx"],"sourcesContent":["// Styles\nimport './VTab.sass'\n\n// Components\nimport { makeVBtnProps, VBtn } from '@/components/VBtn/VBtn'\n\n// Composables\nimport { useTextColor } from '@/composables/color'\n\n// Utilities\nimport { animate, genericComponent, omit, propsFactory, standardEasing, useRender } from '@/util'\nimport { computed, ref, shallowRef } from 'vue'\nimport { VTabsSymbol } from './shared'\n\n// Types\nimport type { PropType } from 'vue'\n\nexport const makeVTabProps = propsFactory({\n  fixed: Boolean,\n\n  sliderColor: String,\n  hideSlider: Boolean,\n\n  direction: {\n    type: String as PropType<'horizontal' | 'vertical'>,\n    default: 'horizontal',\n  },\n\n  ...omit(makeVBtnProps({\n    selectedClass: 'v-tab--selected',\n    variant: 'text' as const,\n  }), [\n    'active',\n    'block',\n    'flat',\n    'location',\n    'position',\n    'symbol',\n  ]),\n}, 'v-tabs')\n\nexport const VTab = genericComponent()({\n  name: 'VTab',\n\n  props: makeVTabProps(),\n\n  setup (props, { slots, attrs }) {\n    const { textColorClasses: sliderColorClasses, textColorStyles: sliderColorStyles } = useTextColor(props, 'sliderColor')\n    const isHorizontal = computed(() => props.direction === 'horizontal')\n    const isSelected = shallowRef(false)\n\n    const rootEl = ref<VBtn>()\n    const sliderEl = ref<HTMLElement>()\n\n    function updateSlider ({ value }: { value: boolean }) {\n      isSelected.value = value\n\n      if (value) {\n        const prevEl: HTMLElement | undefined = rootEl.value?.$el.parentElement?.querySelector('.v-tab--selected .v-tab__slider')\n        const nextEl = sliderEl.value\n\n        if (!prevEl || !nextEl) return\n\n        const color = getComputedStyle(prevEl).color\n\n        const prevBox = prevEl.getBoundingClientRect()\n        const nextBox = nextEl.getBoundingClientRect()\n\n        const xy = isHorizontal.value ? 'x' : 'y'\n        const XY = isHorizontal.value ? 'X' : 'Y'\n        const rightBottom = isHorizontal.value ? 'right' : 'bottom'\n        const widthHeight = isHorizontal.value ? 'width' : 'height'\n\n        const prevPos = prevBox[xy]\n        const nextPos = nextBox[xy]\n        const delta = prevPos > nextPos\n          ? prevBox[rightBottom] - nextBox[rightBottom]\n          : prevBox[xy] - nextBox[xy]\n        const origin =\n          Math.sign(delta) > 0 ? (isHorizontal.value ? 'right' : 'bottom')\n          : Math.sign(delta) < 0 ? (isHorizontal.value ? 'left' : 'top')\n          : 'center'\n        const size = Math.abs(delta) + (Math.sign(delta) < 0 ? prevBox[widthHeight] : nextBox[widthHeight])\n        const scale = size / Math.max(prevBox[widthHeight], nextBox[widthHeight])\n        const initialScale = prevBox[widthHeight] / nextBox[widthHeight]\n\n        const sigma = 1.5\n        animate(nextEl, {\n          backgroundColor: [color, ''],\n          transform: [\n            `translate${XY}(${delta}px) scale${XY}(${initialScale})`,\n            `translate${XY}(${delta / sigma}px) scale${XY}(${(scale - 1) / sigma + 1})`,\n            '',\n          ],\n          transformOrigin: Array(3).fill(origin),\n        }, {\n          duration: 225,\n          easing: standardEasing,\n        })\n      }\n    }\n\n    useRender(() => {\n      const [btnProps] = VBtn.filterProps(props)\n\n      return (\n        <VBtn\n          symbol={ VTabsSymbol }\n          ref={ rootEl }\n          class={[\n            'v-tab',\n            props.class,\n          ]}\n          style={ props.style }\n          tabindex={ isSelected.value ? 0 : -1 }\n          role=\"tab\"\n          aria-selected={ String(isSelected.value) }\n          active={ false }\n          block={ props.fixed }\n          maxWidth={ props.fixed ? 300 : undefined }\n          rounded={ 0 }\n          { ...btnProps }\n          { ...attrs }\n          onGroup:selected={ updateSlider }\n        >\n          { slots.default?.() ?? props.text }\n\n          { !props.hideSlider && (\n            <div\n              ref={ sliderEl }\n              class={[\n                'v-tab__slider',\n                sliderColorClasses.value,\n              ]}\n              style={ sliderColorStyles.value }\n            />\n          )}\n        </VBtn>\n      )\n    })\n\n    return {}\n  },\n})\n\nexport type VTab = InstanceType<typeof VTab>\n"],"mappings":"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"}

package/lib/components/VTabs/VTabs.mjs

@@ -11,7 +11,7 @@ import { provideDefaults } from "../../composables/defaults.mjs";
 import { useBackgroundColor } from "../../composables/color.mjs";
 import { useProxiedModel } from "../../composables/proxiedModel.mjs"; // Utilities
 import { computed, toRef } from 'vue';
-import { convertToUnit, genericComponent, useRender } from "../../util/index.mjs"; // Types
+import { convertToUnit, genericComponent, propsFactory, useRender } from "../../util/index.mjs"; // Types
 import { VTabsSymbol } from "./shared.mjs";
 function parseItems(items) {
   if (!items) return [];
@@ -23,34 +23,35 @@ function parseItems(items) {
     return item;
   });
 }
+export const makeVTabsProps = propsFactory({
+  alignTabs: {
+    type: String,
+    default: 'start'
+  },
+  color: String,
+  fixedTabs: Boolean,
+  items: {
+    type: Array,
+    default: () => []
+  },
+  stacked: Boolean,
+  bgColor: String,
+  grow: Boolean,
+  height: {
+    type: [Number, String],
+    default: undefined
+  },
+  hideSlider: Boolean,
+  sliderColor: String,
+  ...makeVSlideGroupProps({
+    mandatory: 'force'
+  }),
+  ...makeDensityProps(),
+  ...makeTagProps()
+}, 'v-tabs');
 export const VTabs = genericComponent()({
   name: 'VTabs',
-  props: {
-    alignTabs: {
-      type: String,
-      default: 'start'
-    },
-    color: String,
-    fixedTabs: Boolean,
-    items: {
-      type: Array,
-      default: () => []
-    },
-    stacked: Boolean,
-    bgColor: String,
-    grow: Boolean,
-    height: {
-      type: [Number, String],
-      default: undefined
-    },
-    hideSlider: Boolean,
-    sliderColor: String,
-    ...makeVSlideGroupProps({
-      mandatory: 'force'
-    }),
-    ...makeDensityProps(),
-    ...makeTagProps()
-  },
+  props: makeVTabsProps(),
   emits: {
     'update:modelValue': v => true
   },