vuetify 3.5.5 → 3.5.7

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

@@ -1,6 +1,31 @@
 import * as vue from 'vue';
-import { ComponentPropsOptions, ExtractPropTypes, PropType, Ref } from 'vue';
+import { ComponentPropsOptions, ExtractPropTypes, VNodeChild, VNode, PropType, Ref } from 'vue';
 
+type SlotsToProps<U extends RawSlots, T = MakeInternalSlots<U>> = {
+    $children?: (VNodeChild | (T extends {
+        default: infer V;
+    } ? V : {}) | {
+        [K in keyof T]?: T[K];
+    });
+    'v-slots'?: {
+        [K in keyof T]?: T[K] | false;
+    };
+} & {
+    [K in keyof T as `v-slot:${K & string}`]?: T[K] | false;
+};
+type RawSlots = Record<string, unknown>;
+type Slot<T> = [T] extends [never] ? () => VNodeChild : (arg: T) => VNodeChild;
+type VueSlot<T> = [T] extends [never] ? () => VNode[] : (arg: T) => VNode[];
+type MakeInternalSlots<T extends RawSlots> = {
+    [K in keyof T]: Slot<T[K]>;
+};
+type MakeSlots<T extends RawSlots> = {
+    [K in keyof T]: VueSlot<T[K]>;
+};
+type GenericProps<Props, Slots extends Record<string, unknown>> = {
+    $props: Props & SlotsToProps<Slots>;
+    $slots: MakeSlots<Slots>;
+};
 interface FilterPropsOptions<PropsOptions extends Readonly<ComponentPropsOptions>, Props = ExtractPropTypes<PropsOptions>> {
     filterProps<T extends Partial<Props>, U extends Exclude<keyof Props, Exclude<keyof Props, keyof T>>>(props: T): Partial<Pick<T, U>>;
 }
@@ -182,7 +207,7 @@ interface DataIteratorItem<T = any> extends GroupableItem<T>, SelectableItem {
     value: unknown;
 }
 
-type VDataIteratorSlotProps = {
+type VDataIteratorSlotProps<T> = {
     page: number;
     itemsPerPage: number;
     sortBy: readonly SortItem[];
@@ -200,8 +225,14 @@ type VDataIteratorSlotProps = {
     toggleExpand: ReturnType<typeof provideExpanded>['toggleExpand'];
     isGroupOpen: ReturnType<typeof provideGroupBy>['isGroupOpen'];
     toggleGroup: ReturnType<typeof provideGroupBy>['toggleGroup'];
-    items: readonly DataIteratorItem[];
-    groupedItems: readonly (DataIteratorItem | Group<DataIteratorItem>)[];
+    items: readonly DataIteratorItem<T>[];
+    groupedItems: readonly (DataIteratorItem<T> | Group<DataIteratorItem<T>>)[];
+};
+type VDataIteratorSlots<T> = {
+    default: VDataIteratorSlotProps<T>;
+    header: VDataIteratorSlotProps<T>;
+    footer: VDataIteratorSlotProps<T>;
+    'no-data': never;
 };
 declare const VDataIterator: {
     new (...args: any[]): vue.CreateComponentPublicInstance<{
@@ -211,7 +242,6 @@ declare const VDataIterator: {
         expanded: readonly string[];
         tag: string;
         sortBy: readonly SortItem[];
-        items: any[];
         modelValue: readonly any[];
         valueComparator: typeof deepEqual;
         selectStrategy: "all" | "page" | "single";
@@ -234,24 +264,6 @@ declare const VDataIterator: {
         customKeyFilter?: FilterKeyFunctions | undefined;
         filterKeys?: FilterKeys | undefined;
         customKeySort?: Record<string, DataTableCompareFunction> | undefined;
-    } & {
-        $children?: vue.VNodeChild | {
-            default?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            header?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            footer?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            'no-data'?: (() => vue.VNodeChild) | undefined;
-        } | ((arg: VDataIteratorSlotProps) => vue.VNodeChild);
-        'v-slots'?: {
-            default?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            header?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            footer?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            'no-data'?: false | (() => vue.VNodeChild) | undefined;
-        } | undefined;
-    } & {
-        "v-slot:default"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        "v-slot:header"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        "v-slot:footer"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        "v-slot:no-data"?: false | (() => vue.VNodeChild) | undefined;
     } & {
         "onUpdate:modelValue"?: ((value: any[]) => any) | undefined;
         "onUpdate:sortBy"?: ((value: any) => any) | undefined;
@@ -261,7 +273,7 @@ declare const VDataIterator: {
         "onUpdate:itemsPerPage"?: ((value: number) => any) | undefined;
         "onUpdate:options"?: ((value: any) => any) | undefined;
         "onUpdate:currentItems"?: ((value: any) => any) | undefined;
-    }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
+    }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
         'update:modelValue': (value: any[]) => boolean;
         'update:groupBy': (value: any) => boolean;
         'update:page': (value: number) => boolean;
@@ -270,14 +282,13 @@ declare const VDataIterator: {
         'update:options': (value: any) => boolean;
         'update:expanded': (value: any) => boolean;
         'update:currentItems': (value: any) => boolean;
-    }, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
+    }, "$children" | "v-slot:default" | "v-slots" | "items" | "v-slot:header" | "v-slot:no-data" | "v-slot:footer">, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
         page: string | number;
         loading: boolean;
         style: vue.StyleValue;
         expanded: readonly string[];
         tag: string;
         sortBy: readonly SortItem[];
-        items: any[];
         modelValue: readonly any[];
         valueComparator: typeof deepEqual;
         selectStrategy: "all" | "page" | "single";
@@ -300,24 +311,6 @@ declare const VDataIterator: {
         customKeyFilter?: FilterKeyFunctions | undefined;
         filterKeys?: FilterKeys | undefined;
         customKeySort?: Record<string, DataTableCompareFunction> | undefined;
-    } & {
-        $children?: vue.VNodeChild | {
-            default?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            header?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            footer?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            'no-data'?: (() => vue.VNodeChild) | undefined;
-        } | ((arg: VDataIteratorSlotProps) => vue.VNodeChild);
-        'v-slots'?: {
-            default?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            header?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            footer?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            'no-data'?: false | (() => vue.VNodeChild) | undefined;
-        } | undefined;
-    } & {
-        "v-slot:default"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        "v-slot:header"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        "v-slot:footer"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        "v-slot:no-data"?: false | (() => vue.VNodeChild) | undefined;
     } & {
         "onUpdate:modelValue"?: ((value: any[]) => any) | undefined;
         "onUpdate:sortBy"?: ((value: any) => any) | undefined;
@@ -334,7 +327,6 @@ declare const VDataIterator: {
         expanded: readonly string[];
         tag: string;
         sortBy: readonly SortItem[];
-        items: any[];
         modelValue: readonly any[];
         valueComparator: typeof deepEqual;
         selectStrategy: "all" | "page" | "single";
@@ -351,13 +343,13 @@ declare const VDataIterator: {
         showExpand: boolean;
         itemsPerPage: NonNullable<string | number>;
     }, true, {}, vue.SlotsType<Partial<{
-        default: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        default: (arg: VDataIteratorSlotProps<unknown>) => vue.VNode<vue.RendererNode, vue.RendererElement, {
             [key: string]: any;
         }>[];
-        header: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        header: (arg: VDataIteratorSlotProps<unknown>) => vue.VNode<vue.RendererNode, vue.RendererElement, {
             [key: string]: any;
         }>[];
-        footer: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        footer: (arg: VDataIteratorSlotProps<unknown>) => vue.VNode<vue.RendererNode, vue.RendererElement, {
             [key: string]: any;
         }>[];
         'no-data': () => vue.VNode<vue.RendererNode, vue.RendererElement, {
@@ -377,7 +369,6 @@ declare const VDataIterator: {
         expanded: readonly string[];
         tag: string;
         sortBy: readonly SortItem[];
-        items: any[];
         modelValue: readonly any[];
         valueComparator: typeof deepEqual;
         selectStrategy: "all" | "page" | "single";
@@ -400,24 +391,6 @@ declare const VDataIterator: {
         customKeyFilter?: FilterKeyFunctions | undefined;
         filterKeys?: FilterKeys | undefined;
         customKeySort?: Record<string, DataTableCompareFunction> | undefined;
-    } & {
-        $children?: vue.VNodeChild | {
-            default?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            header?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            footer?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            'no-data'?: (() => vue.VNodeChild) | undefined;
-        } | ((arg: VDataIteratorSlotProps) => vue.VNodeChild);
-        'v-slots'?: {
-            default?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            header?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            footer?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            'no-data'?: false | (() => vue.VNodeChild) | undefined;
-        } | undefined;
-    } & {
-        "v-slot:default"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        "v-slot:header"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        "v-slot:footer"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        "v-slot:no-data"?: false | (() => vue.VNodeChild) | undefined;
     } & {
         "onUpdate:modelValue"?: ((value: any[]) => any) | undefined;
         "onUpdate:sortBy"?: ((value: any) => any) | undefined;
@@ -434,7 +407,6 @@ declare const VDataIterator: {
         expanded: readonly string[];
         tag: string;
         sortBy: readonly SortItem[];
-        items: any[];
         modelValue: readonly any[];
         valueComparator: typeof deepEqual;
         selectStrategy: "all" | "page" | "single";
@@ -461,7 +433,6 @@ declare const VDataIterator: {
     expanded: readonly string[];
     tag: string;
     sortBy: readonly SortItem[];
-    items: any[];
     modelValue: readonly any[];
     valueComparator: typeof deepEqual;
     selectStrategy: "all" | "page" | "single";
@@ -484,24 +455,6 @@ declare const VDataIterator: {
     customKeyFilter?: FilterKeyFunctions | undefined;
     filterKeys?: FilterKeys | undefined;
     customKeySort?: Record<string, DataTableCompareFunction> | undefined;
-} & {
-    $children?: vue.VNodeChild | {
-        default?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        header?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        footer?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        'no-data'?: (() => vue.VNodeChild) | undefined;
-    } | ((arg: VDataIteratorSlotProps) => vue.VNodeChild);
-    'v-slots'?: {
-        default?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        header?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        footer?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        'no-data'?: false | (() => vue.VNodeChild) | undefined;
-    } | undefined;
-} & {
-    "v-slot:default"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-    "v-slot:header"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-    "v-slot:footer"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-    "v-slot:no-data"?: false | (() => vue.VNodeChild) | undefined;
 } & {
     "onUpdate:modelValue"?: ((value: any[]) => any) | undefined;
     "onUpdate:sortBy"?: ((value: any) => any) | undefined;
@@ -511,7 +464,7 @@ declare const VDataIterator: {
     "onUpdate:itemsPerPage"?: ((value: number) => any) | undefined;
     "onUpdate:options"?: ((value: any) => any) | undefined;
     "onUpdate:currentItems"?: ((value: any) => any) | undefined;
-}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
+}, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<{
     'update:modelValue': (value: any[]) => boolean;
     'update:groupBy': (value: any) => boolean;
     'update:page': (value: number) => boolean;
@@ -520,14 +473,13 @@ declare const VDataIterator: {
     'update:options': (value: any) => boolean;
     'update:expanded': (value: any) => boolean;
     'update:currentItems': (value: any) => boolean;
-}, string, {
+}, "$children" | "v-slot:default" | "v-slots" | "items" | "v-slot:header" | "v-slot:no-data" | "v-slot:footer">, string, {
     page: string | number;
     loading: boolean;
     style: vue.StyleValue;
     expanded: readonly string[];
     tag: string;
     sortBy: readonly SortItem[];
-    items: any[];
     modelValue: readonly any[];
     valueComparator: typeof deepEqual;
     selectStrategy: "all" | "page" | "single";
@@ -544,19 +496,23 @@ declare const VDataIterator: {
     showExpand: boolean;
     itemsPerPage: NonNullable<string | number>;
 }, {}, string, vue.SlotsType<Partial<{
-    default: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    default: (arg: VDataIteratorSlotProps<unknown>) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
-    header: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    header: (arg: VDataIteratorSlotProps<unknown>) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
-    footer: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    footer: (arg: VDataIteratorSlotProps<unknown>) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
     'no-data': () => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
-}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T>(props: {
+    items?: readonly T[] | undefined;
+}, slots: VDataIteratorSlots<T>) => GenericProps<{
+    items?: readonly T[] | undefined;
+}, VDataIteratorSlots<T>>) & FilterPropsOptions<{
     tag: {
         type: StringConstructor;
         default: string;

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

@@ -239,6 +239,219 @@ type VDataTableHeadersSlots = {
 } & {
     [key: `header.${string}`]: VDataTableHeaderCellColumnSlotProps;
 };
+declare const VDataTableHeaders: {
+    new (...args: any[]): vue.CreateComponentPublicInstance<{
+        sticky: boolean;
+        multiSort: boolean;
+        sortAscIcon: IconValue;
+        sortDescIcon: IconValue;
+    } & {
+        color?: string | undefined;
+        loading?: string | boolean | undefined;
+        headerProps?: Record<string, any> | undefined;
+    } & {
+        $children?: {} | vue.VNodeChild | {
+            [x: `header.${string}`]: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            headers?: ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+            loader?: ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-select'?: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-expand'?: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        };
+        'v-slots'?: {
+            [x: `header.${string}`]: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            headers?: false | ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+            loader?: false | ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-select'?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-expand'?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        } | undefined;
+    } & {
+        [x: `v-slot:header.${string}`]: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:headers"?: false | ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:loader"?: false | ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:header.data-table-select"?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:header.data-table-expand"?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+    }, void, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & {
+        sticky: boolean;
+        multiSort: boolean;
+        sortAscIcon: IconValue;
+        sortDescIcon: IconValue;
+    } & {
+        color?: string | undefined;
+        loading?: string | boolean | undefined;
+        headerProps?: Record<string, any> | undefined;
+    } & {
+        $children?: {} | vue.VNodeChild | {
+            [x: `header.${string}`]: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            headers?: ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+            loader?: ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-select'?: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-expand'?: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        };
+        'v-slots'?: {
+            [x: `header.${string}`]: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            headers?: false | ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+            loader?: false | ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-select'?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-expand'?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        } | undefined;
+    } & {
+        [x: `v-slot:header.${string}`]: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:headers"?: false | ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:loader"?: false | ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:header.data-table-select"?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:header.data-table-expand"?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+    }, {
+        sticky: boolean;
+        multiSort: boolean;
+        sortAscIcon: IconValue;
+        sortDescIcon: IconValue;
+    }, true, {}, vue.SlotsType<Partial<{
+        [x: `header.${string}`]: (arg: VDataTableHeaderCellColumnSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            [key: string]: any;
+        }>[];
+        headers: (arg: HeadersSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            [key: string]: any;
+        }>[];
+        loader: (arg: LoaderSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            [key: string]: any;
+        }>[];
+        'header.data-table-select': (arg: VDataTableHeaderCellColumnSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            [key: string]: any;
+        }>[];
+        'header.data-table-expand': (arg: VDataTableHeaderCellColumnSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            [key: string]: any;
+        }>[];
+    }>>, {
+        P: {};
+        B: {};
+        D: {};
+        C: {};
+        M: {};
+        Defaults: {};
+    }, {
+        sticky: boolean;
+        multiSort: boolean;
+        sortAscIcon: IconValue;
+        sortDescIcon: IconValue;
+    } & {
+        color?: string | undefined;
+        loading?: string | boolean | undefined;
+        headerProps?: Record<string, any> | undefined;
+    } & {
+        $children?: {} | vue.VNodeChild | {
+            [x: `header.${string}`]: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            headers?: ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+            loader?: ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-select'?: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-expand'?: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        };
+        'v-slots'?: {
+            [x: `header.${string}`]: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            headers?: false | ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+            loader?: false | ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-select'?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+            'header.data-table-expand'?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        } | undefined;
+    } & {
+        [x: `v-slot:header.${string}`]: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:headers"?: false | ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:loader"?: false | ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:header.data-table-select"?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        "v-slot:header.data-table-expand"?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+    }, {}, {}, {}, {}, {
+        sticky: boolean;
+        multiSort: boolean;
+        sortAscIcon: IconValue;
+        sortDescIcon: IconValue;
+    }>;
+    __isFragment?: undefined;
+    __isTeleport?: undefined;
+    __isSuspense?: undefined;
+} & vue.ComponentOptionsBase<{
+    sticky: boolean;
+    multiSort: boolean;
+    sortAscIcon: IconValue;
+    sortDescIcon: IconValue;
+} & {
+    color?: string | undefined;
+    loading?: string | boolean | undefined;
+    headerProps?: Record<string, any> | undefined;
+} & {
+    $children?: {} | vue.VNodeChild | {
+        [x: `header.${string}`]: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        headers?: ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+        loader?: ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+        'header.data-table-select'?: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        'header.data-table-expand'?: ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+    };
+    'v-slots'?: {
+        [x: `header.${string}`]: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        headers?: false | ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+        loader?: false | ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+        'header.data-table-select'?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+        'header.data-table-expand'?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+    } | undefined;
+} & {
+    [x: `v-slot:header.${string}`]: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+    "v-slot:headers"?: false | ((arg: HeadersSlotProps) => vue.VNodeChild) | undefined;
+    "v-slot:loader"?: false | ((arg: LoaderSlotProps) => vue.VNodeChild) | undefined;
+    "v-slot:header.data-table-select"?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+    "v-slot:header.data-table-expand"?: false | ((arg: VDataTableHeaderCellColumnSlotProps) => vue.VNodeChild) | undefined;
+}, void, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Record<string, any>, string, {
+    sticky: boolean;
+    multiSort: boolean;
+    sortAscIcon: IconValue;
+    sortDescIcon: IconValue;
+}, {}, string, vue.SlotsType<Partial<{
+    [x: `header.${string}`]: (arg: VDataTableHeaderCellColumnSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    headers: (arg: HeadersSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    loader: (arg: LoaderSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    'header.data-table-select': (arg: VDataTableHeaderCellColumnSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+    'header.data-table-expand': (arg: VDataTableHeaderCellColumnSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+        [key: string]: any;
+    }>[];
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & FilterPropsOptions<{
+    loading: (StringConstructor | BooleanConstructor)[];
+    color: StringConstructor;
+    sticky: BooleanConstructor;
+    multiSort: BooleanConstructor;
+    sortAscIcon: {
+        type: PropType<IconValue>;
+        default: string;
+    };
+    sortDescIcon: {
+        type: PropType<IconValue>;
+        default: string;
+    };
+    headerProps: {
+        type: PropType<Record<string, any>>;
+    };
+}, vue.ExtractPropTypes<{
+    loading: (StringConstructor | BooleanConstructor)[];
+    color: StringConstructor;
+    sticky: BooleanConstructor;
+    multiSort: BooleanConstructor;
+    sortAscIcon: {
+        type: PropType<IconValue>;
+        default: string;
+    };
+    sortDescIcon: {
+        type: PropType<IconValue>;
+        default: string;
+    };
+    headerProps: {
+        type: PropType<Record<string, any>>;
+    };
+}>>;
+type VDataTableHeaders = InstanceType<typeof VDataTableHeaders>;
 
 type Density = null | 'default' | 'comfortable' | 'compact';
 
@@ -4176,4 +4389,4 @@ declare const VDataTableServer: {
 }>>;
 type VDataTableServer = InstanceType<typeof VDataTableServer>;
 
-export { VDataTable, VDataTableFooter, VDataTableRow, VDataTableRows, VDataTableServer, VDataTableVirtual };
+export { VDataTable, VDataTableFooter, VDataTableHeaders, VDataTableRow, VDataTableRows, VDataTableServer, VDataTableVirtual };

package/lib/components/VDataTable/index.mjs

@@ -1,4 +1,5 @@
 export { VDataTable } from "./VDataTable.mjs";
+export { VDataTableHeaders } from "./VDataTableHeaders.mjs";
 export { VDataTableFooter } from "./VDataTableFooter.mjs";
 export { VDataTableRows } from "./VDataTableRows.mjs";
 export { VDataTableRow } from "./VDataTableRow.mjs";

package/lib/components/VDataTable/index.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"index.mjs","names":["VDataTable","VDataTableFooter","VDataTableRows","VDataTableRow","VDataTableVirtual","VDataTableServer"],"sources":["../../../src/components/VDataTable/index.ts"],"sourcesContent":["export { VDataTable } from './VDataTable'\nexport { VDataTableFooter } from './VDataTableFooter'\nexport { VDataTableRows } from './VDataTableRows'\nexport { VDataTableRow } from './VDataTableRow'\nexport { VDataTableVirtual } from './VDataTableVirtual'\nexport { VDataTableServer } from './VDataTableServer'\n"],"mappings":"SAASA,UAAU;AAAA,SACVC,gBAAgB;AAAA,SAChBC,cAAc;AAAA,SACdC,aAAa;AAAA,SACbC,iBAAiB;AAAA,SACjBC,gBAAgB"}
+{"version":3,"file":"index.mjs","names":["VDataTable","VDataTableHeaders","VDataTableFooter","VDataTableRows","VDataTableRow","VDataTableVirtual","VDataTableServer"],"sources":["../../../src/components/VDataTable/index.ts"],"sourcesContent":["export { VDataTable } from './VDataTable'\nexport { VDataTableHeaders } from './VDataTableHeaders'\nexport { VDataTableFooter } from './VDataTableFooter'\nexport { VDataTableRows } from './VDataTableRows'\nexport { VDataTableRow } from './VDataTableRow'\nexport { VDataTableVirtual } from './VDataTableVirtual'\nexport { VDataTableServer } from './VDataTableServer'\n"],"mappings":"SAASA,UAAU;AAAA,SACVC,iBAAiB;AAAA,SACjBC,gBAAgB;AAAA,SAChBC,cAAc;AAAA,SACdC,aAAa;AAAA,SACbC,iBAAiB;AAAA,SACjBC,gBAAgB"}

package/lib/components/VExpansionPanel/VExpansionPanel.css

@@ -131,23 +131,20 @@
     opacity: calc(var(--v-focus-opacity) * var(--v-theme-overlay-multiplier));
   }
 }
-.v-expansion-panel-title--active > .v-expansion-panel-title__overlay, .v-expansion-panel-title[aria-haspopup=menu][aria-expanded=true] > .v-expansion-panel-title__overlay {
+.v-expansion-panel-title--focusable.v-expansion-panel-title--active .v-expansion-panel-title__overlay {
   opacity: calc(var(--v-activated-opacity) * var(--v-theme-overlay-multiplier));
 }
-.v-expansion-panel-title--active:hover > .v-expansion-panel-title__overlay, .v-expansion-panel-title[aria-haspopup=menu][aria-expanded=true]:hover > .v-expansion-panel-title__overlay {
+.v-expansion-panel-title--focusable.v-expansion-panel-title--active:hover .v-expansion-panel-title__overlay {
   opacity: calc((var(--v-activated-opacity) + var(--v-hover-opacity)) * var(--v-theme-overlay-multiplier));
 }
-.v-expansion-panel-title--active:focus-visible > .v-expansion-panel-title__overlay, .v-expansion-panel-title[aria-haspopup=menu][aria-expanded=true]:focus-visible > .v-expansion-panel-title__overlay {
+.v-expansion-panel-title--focusable.v-expansion-panel-title--active:focus-visible .v-expansion-panel-title__overlay {
   opacity: calc((var(--v-activated-opacity) + var(--v-focus-opacity)) * var(--v-theme-overlay-multiplier));
 }
 @supports not selector(:focus-visible) {
-  .v-expansion-panel-title--active:focus > .v-expansion-panel-title__overlay, .v-expansion-panel-title[aria-haspopup=menu][aria-expanded=true]:focus > .v-expansion-panel-title__overlay {
+  .v-expansion-panel-title--focusable.v-expansion-panel-title--active:focus .v-expansion-panel-title__overlay {
     opacity: calc((var(--v-activated-opacity) + var(--v-focus-opacity)) * var(--v-theme-overlay-multiplier));
   }
 }
-.v-expansion-panel-title--active::before {
-  opacity: 0.12;
-}
 
 .v-expansion-panel-title__overlay {
   position: absolute;

package/lib/components/VExpansionPanel/VExpansionPanel.sass

@@ -126,10 +126,11 @@
   transition: .3s min-height settings.$standard-easing
   width: 100%
   justify-content: space-between
-  @include tools.states('.v-expansion-panel-title__overlay', true)
 
-  &--active::before
-    opacity: 0.12
+  @include tools.states('.v-expansion-panel-title__overlay', false)
+
+  &--focusable.v-expansion-panel-title--active
+    @include tools.active-states('.v-expansion-panel-title__overlay')
 
 .v-expansion-panel-title__overlay
   @include tools.absolute()

package/lib/components/VExpansionPanel/VExpansionPanelTitle.mjs

@@ -19,6 +19,7 @@ export const makeVExpansionPanelTitleProps = propsFactory({
     default: '$collapse'
   },
   hideActions: Boolean,
+  focusable: Boolean,
   static: Boolean,
   ripple: {
     type: [Boolean, Object],
@@ -53,6 +54,7 @@ export const VExpansionPanelTitle = genericComponent()({
     useRender(() => _withDirectives(_createVNode("button", {
       "class": ['v-expansion-panel-title', {
         'v-expansion-panel-title--active': expansionPanel.isSelected.value,
+        'v-expansion-panel-title--focusable': props.focusable,
         'v-expansion-panel-title--static': props.static
       }, backgroundColorClasses.value, props.class],
       "style": [backgroundColorStyles.value, props.style],

package/lib/components/VExpansionPanel/VExpansionPanelTitle.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"VExpansionPanelTitle.mjs","names":["VExpansionPanelSymbol","VIcon","useBackgroundColor","makeComponentProps","IconValue","Ripple","computed","inject","genericComponent","propsFactory","useRender","makeVExpansionPanelTitleProps","color","String","expandIcon","type","default","collapseIcon","hideActions","Boolean","static","ripple","Object","readonly","VExpansionPanelTitle","name","directives","props","setup","_ref","slots","expansionPanel","Error","backgroundColorClasses","backgroundColorStyles","slotProps","disabled","value","expanded","isSelected","_withDirectives","_createVNode","class","style","undefined","toggle","actions","_resolveDirective"],"sources":["../../../src/components/VExpansionPanel/VExpansionPanelTitle.tsx"],"sourcesContent":["// Components\nimport { VExpansionPanelSymbol } from './VExpansionPanels'\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { useBackgroundColor } from '@/composables/color'\nimport { makeComponentProps } from '@/composables/component'\nimport { IconValue } from '@/composables/icons'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { RippleDirectiveBinding } from '@/directives/ripple'\n\ninterface ExpansionPanelTitleSlot {\n  collapseIcon: IconValue\n  disabled: boolean | undefined\n  expanded: boolean\n  expandIcon: IconValue\n  readonly: boolean\n}\n\nexport type VExpansionPanelTitleSlots = {\n  default: ExpansionPanelTitleSlot\n  actions: ExpansionPanelTitleSlot\n}\n\nexport const makeVExpansionPanelTitleProps = propsFactory({\n  color: String,\n  expandIcon: {\n    type: IconValue,\n    default: '$expand',\n  },\n  collapseIcon: {\n    type: IconValue,\n    default: '$collapse',\n  },\n  hideActions: Boolean,\n  static: Boolean,\n  ripple: {\n    type: [Boolean, Object] as PropType<RippleDirectiveBinding['value']>,\n    default: false,\n  },\n  readonly: Boolean,\n\n  ...makeComponentProps(),\n}, 'VExpansionPanelTitle')\n\nexport const VExpansionPanelTitle = genericComponent<VExpansionPanelTitleSlots>()({\n  name: 'VExpansionPanelTitle',\n\n  directives: { Ripple },\n\n  props: makeVExpansionPanelTitleProps(),\n\n  setup (props, { slots }) {\n    const expansionPanel = inject(VExpansionPanelSymbol)\n\n    if (!expansionPanel) throw new Error('[Vuetify] v-expansion-panel-title needs to be placed inside v-expansion-panel')\n\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(props, 'color')\n\n    const slotProps = computed(() => ({\n      collapseIcon: props.collapseIcon,\n      disabled: expansionPanel.disabled.value,\n      expanded: expansionPanel.isSelected.value,\n      expandIcon: props.expandIcon,\n      readonly: props.readonly,\n    }))\n\n    useRender(() => (\n      <button\n        class={[\n          'v-expansion-panel-title',\n          {\n            'v-expansion-panel-title--active': expansionPanel.isSelected.value,\n            'v-expansion-panel-title--static': props.static,\n          },\n          backgroundColorClasses.value,\n          props.class,\n        ]}\n        style={[\n          backgroundColorStyles.value,\n          props.style,\n        ]}\n        type=\"button\"\n        tabindex={ expansionPanel.disabled.value ? -1 : undefined }\n        disabled={ expansionPanel.disabled.value }\n        aria-expanded={ expansionPanel.isSelected.value }\n        onClick={ !props.readonly ? expansionPanel.toggle : undefined }\n        v-ripple={ props.ripple }\n      >\n        <span class=\"v-expansion-panel-title__overlay\" />\n\n        { slots.default?.(slotProps.value) }\n\n        { !props.hideActions && (\n          <span class=\"v-expansion-panel-title__icon\">\n            {\n              slots.actions ? slots.actions(slotProps.value)\n              : <VIcon icon={ expansionPanel.isSelected.value ? props.collapseIcon : props.expandIcon } />\n            }\n          </span>\n        )}\n      </button>\n    ))\n\n    return {}\n  },\n})\n\nexport type VExpansionPanelTitle = InstanceType<typeof VExpansionPanelTitle>\n"],"mappings":"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"}
+{"version":3,"file":"VExpansionPanelTitle.mjs","names":["VExpansionPanelSymbol","VIcon","useBackgroundColor","makeComponentProps","IconValue","Ripple","computed","inject","genericComponent","propsFactory","useRender","makeVExpansionPanelTitleProps","color","String","expandIcon","type","default","collapseIcon","hideActions","Boolean","focusable","static","ripple","Object","readonly","VExpansionPanelTitle","name","directives","props","setup","_ref","slots","expansionPanel","Error","backgroundColorClasses","backgroundColorStyles","slotProps","disabled","value","expanded","isSelected","_withDirectives","_createVNode","class","style","undefined","toggle","actions","_resolveDirective"],"sources":["../../../src/components/VExpansionPanel/VExpansionPanelTitle.tsx"],"sourcesContent":["// Components\nimport { VExpansionPanelSymbol } from './VExpansionPanels'\nimport { VIcon } from '@/components/VIcon'\n\n// Composables\nimport { useBackgroundColor } from '@/composables/color'\nimport { makeComponentProps } from '@/composables/component'\nimport { IconValue } from '@/composables/icons'\n\n// Directives\nimport { Ripple } from '@/directives/ripple'\n\n// Utilities\nimport { computed, inject } from 'vue'\nimport { genericComponent, propsFactory, useRender } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { RippleDirectiveBinding } from '@/directives/ripple'\n\ninterface ExpansionPanelTitleSlot {\n  collapseIcon: IconValue\n  disabled: boolean | undefined\n  expanded: boolean\n  expandIcon: IconValue\n  readonly: boolean\n}\n\nexport type VExpansionPanelTitleSlots = {\n  default: ExpansionPanelTitleSlot\n  actions: ExpansionPanelTitleSlot\n}\n\nexport const makeVExpansionPanelTitleProps = propsFactory({\n  color: String,\n  expandIcon: {\n    type: IconValue,\n    default: '$expand',\n  },\n  collapseIcon: {\n    type: IconValue,\n    default: '$collapse',\n  },\n  hideActions: Boolean,\n  focusable: Boolean,\n  static: Boolean,\n  ripple: {\n    type: [Boolean, Object] as PropType<RippleDirectiveBinding['value']>,\n    default: false,\n  },\n  readonly: Boolean,\n\n  ...makeComponentProps(),\n}, 'VExpansionPanelTitle')\n\nexport const VExpansionPanelTitle = genericComponent<VExpansionPanelTitleSlots>()({\n  name: 'VExpansionPanelTitle',\n\n  directives: { Ripple },\n\n  props: makeVExpansionPanelTitleProps(),\n\n  setup (props, { slots }) {\n    const expansionPanel = inject(VExpansionPanelSymbol)\n\n    if (!expansionPanel) throw new Error('[Vuetify] v-expansion-panel-title needs to be placed inside v-expansion-panel')\n\n    const { backgroundColorClasses, backgroundColorStyles } = useBackgroundColor(props, 'color')\n\n    const slotProps = computed(() => ({\n      collapseIcon: props.collapseIcon,\n      disabled: expansionPanel.disabled.value,\n      expanded: expansionPanel.isSelected.value,\n      expandIcon: props.expandIcon,\n      readonly: props.readonly,\n    }))\n\n    useRender(() => (\n      <button\n        class={[\n          'v-expansion-panel-title',\n          {\n            'v-expansion-panel-title--active': expansionPanel.isSelected.value,\n            'v-expansion-panel-title--focusable': props.focusable,\n            'v-expansion-panel-title--static': props.static,\n          },\n          backgroundColorClasses.value,\n          props.class,\n        ]}\n        style={[\n          backgroundColorStyles.value,\n          props.style,\n        ]}\n        type=\"button\"\n        tabindex={ expansionPanel.disabled.value ? -1 : undefined }\n        disabled={ expansionPanel.disabled.value }\n        aria-expanded={ expansionPanel.isSelected.value }\n        onClick={ !props.readonly ? expansionPanel.toggle : undefined }\n        v-ripple={ props.ripple }\n      >\n        <span class=\"v-expansion-panel-title__overlay\" />\n\n        { slots.default?.(slotProps.value) }\n\n        { !props.hideActions && (\n          <span class=\"v-expansion-panel-title__icon\">\n            {\n              slots.actions ? slots.actions(slotProps.value)\n              : <VIcon icon={ expansionPanel.isSelected.value ? props.collapseIcon : props.expandIcon } />\n            }\n          </span>\n        )}\n      </button>\n    ))\n\n    return {}\n  },\n})\n\nexport type VExpansionPanelTitle = InstanceType<typeof VExpansionPanelTitle>\n"],"mappings":"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"}

package/lib/components/VExpansionPanel/VExpansionPanels.mjs

@@ -15,6 +15,7 @@ const allowedVariants = ['default', 'accordion', 'inset', 'popout'];
 export const makeVExpansionPanelsProps = propsFactory({
   color: String,
   flat: Boolean,
+  focusable: Boolean,
   static: Boolean,
   tile: Boolean,
   variant: {
@@ -49,6 +50,7 @@ export const VExpansionPanels = genericComponent()({
         readonly: toRef(props, 'readonly')
       },
       VExpansionPanelTitle: {
+        focusable: toRef(props, 'focusable'),
         static: toRef(props, 'static')
       }
     });