@vuetify/nightly 3.3.0 → 3.3.1-master.2023-05-24

package/lib/labs/VDataIterator/composables/items.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"items.mjs","names":["computed","getPropertyFromItem","propsFactory","makeDataIteratorItemProps","items","type","Array","default","itemValue","String","Function","returnObject","Boolean","transformItem","props","item","value","raw","transformItems","array","push","useDataIteratorItems"],"sources":["../../../../src/labs/VDataIterator/composables/items.ts"],"sourcesContent":["// Utilities\nimport { computed } from 'vue'\nimport { getPropertyFromItem, propsFactory } from '@/util'\n\n// Types\nimport type { GroupableItem } from '@/labs/VDataTable/composables/group'\nimport type { PropType } from 'vue'\nimport type { SelectItemKey } from '@/util'\n\nexport interface DataIteratorItemProps {\n  items: any[]\n  itemValue: SelectItemKey\n  returnObject: boolean\n}\n\nexport interface DataIteratorItem<T = any> extends GroupableItem<T> {\n  value: unknown\n}\n\n// Composables\nexport const makeDataIteratorItemProps = propsFactory({\n  items: {\n    type: Array as PropType<DataIteratorItemProps['items']>,\n    default: () => ([]),\n  },\n  itemValue: {\n    type: [String, Array, Function] as PropType<SelectItemKey>,\n    default: 'value',\n  },\n  returnObject: Boolean,\n}, 'v-data-iterator-item')\n\nexport function transformItem (\n  props: Omit<DataIteratorItemProps, 'items'>,\n  item: any\n): DataIteratorItem {\n  const value = props.returnObject ? item : getPropertyFromItem(item, props.itemValue)\n\n  return {\n    type: 'item',\n    value,\n    raw: item,\n  }\n}\n\nexport function transformItems (\n  props: Omit<DataIteratorItemProps, 'items'>,\n  items: DataIteratorItemProps['items']\n) {\n  const array: DataIteratorItem[] = []\n\n  for (const item of items) {\n    array.push(transformItem(props, item))\n  }\n\n  return array\n}\n\nexport function useDataIteratorItems (props: DataIteratorItemProps) {\n  const items = computed(() => transformItems(props, props.items))\n\n  return { items }\n}\n"],"mappings":"AAAA;AACA,SAASA,QAAQ,QAAQ,KAAK;AAAA,SACrBC,mBAAmB,EAAEC,YAAY,mCAE1C;AAeA;AACA,OAAO,MAAMC,yBAAyB,GAAGD,YAAY,CAAC;EACpDE,KAAK,EAAE;IACLC,IAAI,EAAEC,KAAiD;IACvDC,OAAO,EAAEA,CAAA,KAAO;EAClB,CAAC;EACDC,SAAS,EAAE;IACTH,IAAI,EAAE,CAACI,MAAM,EAAEH,KAAK,EAAEI,QAAQ,CAA4B;IAC1DH,OAAO,EAAE;EACX,CAAC;EACDI,YAAY,EAAEC;AAChB,CAAC,EAAE,sBAAsB,CAAC;AAE1B,OAAO,SAASC,aAAaA,CAC3BC,KAA2C,EAC3CC,IAAS,EACS;EAClB,MAAMC,KAAK,GAAGF,KAAK,CAACH,YAAY,GAAGI,IAAI,GAAGd,mBAAmB,CAACc,IAAI,EAAED,KAAK,CAACN,SAAS,CAAC;EAEpF,OAAO;IACLH,IAAI,EAAE,MAAM;IACZW,KAAK;IACLC,GAAG,EAAEF;EACP,CAAC;AACH;AAEA,OAAO,SAASG,cAAcA,CAC5BJ,KAA2C,EAC3CV,KAAqC,EACrC;EACA,MAAMe,KAAyB,GAAG,EAAE;EAEpC,KAAK,MAAMJ,IAAI,IAAIX,KAAK,EAAE;IACxBe,KAAK,CAACC,IAAI,CAACP,aAAa,CAACC,KAAK,EAAEC,IAAI,CAAC,CAAC;EACxC;EAEA,OAAOI,KAAK;AACd;AAEA,OAAO,SAASE,oBAAoBA,CAAEP,KAA4B,EAAE;EAClE,MAAMV,KAAK,GAAGJ,QAAQ,CAAC,MAAMkB,cAAc,CAACJ,KAAK,EAAEA,KAAK,CAACV,KAAK,CAAC,CAAC;EAEhE,OAAO;IAAEA;EAAM,CAAC;AAClB"}
+{"version":3,"file":"items.mjs","names":["computed","getPropertyFromItem","propsFactory","makeDataIteratorItemProps","items","type","Array","default","itemValue","String","Function","itemSelectable","returnObject","Boolean","transformItem","props","item","value","selectable","raw","transformItems","array","push","useDataIteratorItems"],"sources":["../../../../src/labs/VDataIterator/composables/items.ts"],"sourcesContent":["// Utilities\nimport { computed } from 'vue'\nimport { getPropertyFromItem, propsFactory } from '@/util'\n\n// Types\nimport type { PropType } from 'vue'\nimport type { GroupableItem } from '@/labs/VDataTable/composables/group'\nimport type { SelectableItem } from '@/labs/VDataTable/composables/select'\nimport type { SelectItemKey } from '@/util'\n\nexport interface DataIteratorItemProps {\n  items: any[]\n  itemValue: SelectItemKey\n  itemSelectable: SelectItemKey\n  returnObject: boolean\n}\n\nexport interface DataIteratorItem<T = any> extends GroupableItem<T>, SelectableItem {\n  value: unknown\n}\n\n// Composables\nexport const makeDataIteratorItemProps = propsFactory({\n  items: {\n    type: Array as PropType<DataIteratorItemProps['items']>,\n    default: () => ([]),\n  },\n  itemValue: {\n    type: [String, Array, Function] as PropType<SelectItemKey>,\n    default: 'id',\n  },\n  itemSelectable: {\n    type: [String, Array, Function] as PropType<SelectItemKey>,\n    default: null,\n  },\n  returnObject: Boolean,\n}, 'v-data-iterator-item')\n\nexport function transformItem (\n  props: Omit<DataIteratorItemProps, 'items'>,\n  item: any\n): DataIteratorItem {\n  const value = props.returnObject ? item : getPropertyFromItem(item, props.itemValue)\n  const selectable = getPropertyFromItem(item, props.itemSelectable, true)\n\n  return {\n    type: 'item',\n    value,\n    selectable,\n    raw: item,\n  }\n}\n\nexport function transformItems (\n  props: Omit<DataIteratorItemProps, 'items'>,\n  items: DataIteratorItemProps['items']\n) {\n  const array: DataIteratorItem[] = []\n\n  for (const item of items) {\n    array.push(transformItem(props, item))\n  }\n\n  return array\n}\n\nexport function useDataIteratorItems (props: DataIteratorItemProps) {\n  const items = computed(() => transformItems(props, props.items))\n\n  return { items }\n}\n"],"mappings":"AAAA;AACA,SAASA,QAAQ,QAAQ,KAAK;AAAA,SACrBC,mBAAmB,EAAEC,YAAY,mCAE1C;AAiBA;AACA,OAAO,MAAMC,yBAAyB,GAAGD,YAAY,CAAC;EACpDE,KAAK,EAAE;IACLC,IAAI,EAAEC,KAAiD;IACvDC,OAAO,EAAEA,CAAA,KAAO;EAClB,CAAC;EACDC,SAAS,EAAE;IACTH,IAAI,EAAE,CAACI,MAAM,EAAEH,KAAK,EAAEI,QAAQ,CAA4B;IAC1DH,OAAO,EAAE;EACX,CAAC;EACDI,cAAc,EAAE;IACdN,IAAI,EAAE,CAACI,MAAM,EAAEH,KAAK,EAAEI,QAAQ,CAA4B;IAC1DH,OAAO,EAAE;EACX,CAAC;EACDK,YAAY,EAAEC;AAChB,CAAC,EAAE,sBAAsB,CAAC;AAE1B,OAAO,SAASC,aAAaA,CAC3BC,KAA2C,EAC3CC,IAAS,EACS;EAClB,MAAMC,KAAK,GAAGF,KAAK,CAACH,YAAY,GAAGI,IAAI,GAAGf,mBAAmB,CAACe,IAAI,EAAED,KAAK,CAACP,SAAS,CAAC;EACpF,MAAMU,UAAU,GAAGjB,mBAAmB,CAACe,IAAI,EAAED,KAAK,CAACJ,cAAc,EAAE,IAAI,CAAC;EAExE,OAAO;IACLN,IAAI,EAAE,MAAM;IACZY,KAAK;IACLC,UAAU;IACVC,GAAG,EAAEH;EACP,CAAC;AACH;AAEA,OAAO,SAASI,cAAcA,CAC5BL,KAA2C,EAC3CX,KAAqC,EACrC;EACA,MAAMiB,KAAyB,GAAG,EAAE;EAEpC,KAAK,MAAML,IAAI,IAAIZ,KAAK,EAAE;IACxBiB,KAAK,CAACC,IAAI,CAACR,aAAa,CAACC,KAAK,EAAEC,IAAI,CAAC,CAAC;EACxC;EAEA,OAAOK,KAAK;AACd;AAEA,OAAO,SAASE,oBAAoBA,CAAER,KAA4B,EAAE;EAClE,MAAMX,KAAK,GAAGJ,QAAQ,CAAC,MAAMoB,cAAc,CAACL,KAAK,EAAEA,KAAK,CAACX,KAAK,CAAC,CAAC;EAEhE,OAAO;IAAEA;EAAM,CAAC;AAClB"}

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

@@ -46,6 +46,36 @@ declare function provideGroupBy(options: {
     isGroupOpen: (group: Group) => boolean;
 };
 
+interface DataTableItemProps {
+    items: any[];
+    itemValue: SelectItemKey;
+    itemSelectable: SelectItemKey;
+    returnObject: boolean;
+}
+
+interface SelectableItem {
+    value: any;
+    selectable: boolean;
+}
+type SelectionProps = Pick<DataTableItemProps, 'itemValue'> & {
+    modelValue: readonly any[];
+    selectStrategy: 'single' | 'page' | 'all';
+    'onUpdate:modelValue': ((value: any[]) => void) | undefined;
+};
+declare function provideSelection(props: SelectionProps, { allItems, currentPage }: {
+    allItems: Ref<SelectableItem[]>;
+    currentPage: Ref<SelectableItem[]>;
+}): {
+    toggleSelect: (item: SelectableItem) => void;
+    select: (items: SelectableItem[], value: boolean) => void;
+    selectAll: (value: boolean) => void;
+    isSelected: (items: SelectableItem | SelectableItem[]) => boolean;
+    isSomeSelected: (items: SelectableItem | SelectableItem[]) => boolean;
+    someSelected: vue.ComputedRef<boolean>;
+    allSelected: vue.ComputedRef<boolean>;
+    showSelectAll: boolean;
+};
+
 type DataTableCompareFunction<T = any> = (a: T, b: T) => number;
 type DataTableHeader = {
     key: string;
@@ -54,8 +84,8 @@ type DataTableHeader = {
     colspan?: number;
     rowspan?: number;
     fixed?: boolean;
-    align?: 'start' | 'end';
-    width?: number;
+    align?: 'start' | 'end' | 'center';
+    width?: number | string;
     minWidth?: string;
     maxWidth?: string;
     sortable?: boolean;
@@ -66,8 +96,7 @@ type InternalDataTableHeader = DataTableHeader & {
     fixedOffset?: number;
     lastFixed?: boolean;
 };
-interface DataTableItem<T = any> extends GroupableItem<T> {
-    value: any;
+interface DataTableItem<T = any> extends GroupableItem<T>, SelectableItem {
     columns: {
         [key: string]: any;
     };
@@ -85,23 +114,6 @@ type FilterKeyFunctions = Record<string, FilterFunction>;
 type FilterKeys = string | string[];
 type FilterMode = 'some' | 'every' | 'union' | 'intersection';
 
-declare function providePagination(options: {
-    page: Ref<number>;
-    itemsPerPage: Ref<number>;
-    itemsLength: Ref<number>;
-}): {
-    page: Ref<number>;
-    itemsPerPage: Ref<number>;
-    startIndex: vue.ComputedRef<number>;
-    stopIndex: vue.ComputedRef<number>;
-    pageCount: vue.ComputedRef<number>;
-    itemsLength: Ref<number>;
-    nextPage: () => void;
-    prevPage: () => void;
-    setPage: (value: number) => void;
-    setItemsPerPage: (value: number) => void;
-};
-
 type ExpandProps = {
     expandOnClick: boolean;
     expanded: readonly string[];
@@ -117,27 +129,24 @@ declare function provideExpanded(props: ExpandProps): {
     toggleExpand: (item: DataTableItem) => void;
 };
 
-interface DataTableItemProps {
-    items: any[];
-    itemValue: SelectItemKey;
-    returnObject: boolean;
-}
-
-type SelectionProps = Pick<DataTableItemProps, 'itemValue'> & {
-    modelValue: readonly any[];
-    'onUpdate:modelValue': ((value: any[]) => void) | undefined;
-};
-declare function provideSelection<T extends DataTableItem>(props: SelectionProps, allItems: Ref<T[]>): {
-    toggleSelect: (item: T) => void;
-    select: (items: T[], value: boolean) => void;
-    selectAll: (value: boolean) => void;
-    isSelected: (items: T | T[]) => boolean;
-    isSomeSelected: (items: T | T[]) => boolean;
-    someSelected: vue.ComputedRef<boolean>;
-    allSelected: vue.ComputedRef<boolean>;
+declare function providePagination(options: {
+    page: Ref<number>;
+    itemsPerPage: Ref<number>;
+    itemsLength: Ref<number>;
+}): {
+    page: Ref<number>;
+    itemsPerPage: Ref<number>;
+    startIndex: vue.ComputedRef<number>;
+    stopIndex: vue.ComputedRef<number>;
+    pageCount: vue.ComputedRef<number>;
+    itemsLength: Ref<number>;
+    nextPage: () => void;
+    prevPage: () => void;
+    setPage: (value: number) => void;
+    setItemsPerPage: (value: number) => void;
 };
 
-interface DataIteratorItem<T = any> extends GroupableItem<T> {
+interface DataIteratorItem<T = any> extends GroupableItem<T>, SelectableItem {
     value: unknown;
 }
 
@@ -175,42 +184,38 @@ declare const VDataIterator: {
             sortBy?: readonly SortItem[] | undefined;
             items?: any[] | undefined;
             modelValue?: readonly any[] | undefined;
+            selectStrategy?: "all" | "page" | "single" | undefined;
             itemValue?: SelectItemKey | undefined;
             returnObject?: boolean | undefined;
             filterMode?: FilterMode | undefined;
             noFilter?: boolean | undefined;
+            itemSelectable?: SelectItemKey | undefined;
+            showSelect?: boolean | undefined;
             multiSort?: boolean | undefined;
             mustSort?: boolean | undefined;
             groupBy?: readonly SortItem[] | undefined;
-            itemsPerPage?: NonNullable<string | number> | undefined;
             expandOnClick?: boolean | undefined;
             showExpand?: boolean | undefined;
-            showSelect?: boolean | undefined;
+            itemsPerPage?: NonNullable<string | number> | undefined;
             search?: string | undefined;
             key?: string | number | symbol | undefined;
             class?: any;
             $children?: vue.VNodeChild | {
-                default?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                header?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                footer?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+                default?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+                header?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+                footer?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
                 'no-data'?: (() => vue.VNodeChild) | undefined;
-            } | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild);
+            } | ((arg: VDataIteratorSlotProps) => vue.VNodeChild);
             ref?: vue.VNodeRef | undefined;
             ref_for?: boolean | undefined;
             ref_key?: string | undefined;
-            "v-slot:default"?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+            "v-slot:default"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
             'v-slots'?: {
-                default?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                header?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                footer?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+                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;
-            $slots?: {
-                default?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                header?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                footer?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                'no-data'?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
             onVnodeBeforeMount?: ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
@@ -250,7 +255,7 @@ declare const VDataIterator: {
                 [key: string]: any;
             }>) => void)[] | undefined;
             "onUpdate:modelValue"?: ((value: any[]) => any) | undefined;
-            "v-slot:header"?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+            "v-slot:header"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
             "v-slot:no-data"?: false | (() => vue.VNodeChild) | undefined;
             customFilter?: FilterFunction | undefined;
             customKeyFilter?: FilterKeyFunctions | undefined;
@@ -258,11 +263,11 @@ declare const VDataIterator: {
             customKeySort?: Record<string, DataTableCompareFunction> | undefined;
             "onUpdate:sortBy"?: ((value: any) => any) | undefined;
             "onUpdate:groupBy"?: ((value: any) => any) | undefined;
+            "onUpdate:expanded"?: ((value: any) => any) | undefined;
             "onUpdate:page"?: ((value: number) => any) | undefined;
             "onUpdate:itemsPerPage"?: ((value: number) => any) | undefined;
-            "onUpdate:expanded"?: ((value: any) => any) | undefined;
             "onUpdate:options"?: ((value: any) => any) | undefined;
-            "v-slot:footer"?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+            "v-slot:footer"?: false | ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
         };
         $attrs: {
             [x: string]: unknown;
@@ -271,13 +276,13 @@ declare const VDataIterator: {
             [x: string]: unknown;
         };
         $slots: Readonly<{
-            default?: ((args_0: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            default?: ((arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[]) | undefined;
-            header?: ((args_0: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            header?: ((arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[]) | undefined;
-            footer?: ((args_0: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            footer?: ((arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[]) | undefined;
             'no-data'?: (() => vue.VNode<vue.RendererNode, vue.RendererElement, {
@@ -297,17 +302,19 @@ declare const VDataIterator: {
             sortBy: readonly SortItem[];
             items: any[];
             modelValue: readonly any[];
+            selectStrategy: "all" | "page" | "single";
             itemValue: SelectItemKey;
             returnObject: boolean;
             filterMode: FilterMode;
             noFilter: boolean;
+            itemSelectable: SelectItemKey;
+            showSelect: boolean;
             multiSort: boolean;
             mustSort: boolean;
             groupBy: readonly SortItem[];
-            itemsPerPage: NonNullable<string | number>;
             expandOnClick: boolean;
             showExpand: boolean;
-            showSelect: boolean;
+            itemsPerPage: NonNullable<string | number>;
         } & {
             search?: string | undefined;
             class?: any;
@@ -317,36 +324,29 @@ declare const VDataIterator: {
             customKeySort?: Record<string, DataTableCompareFunction> | undefined;
         } & {
             $children?: vue.VNodeChild | {
-                default?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                header?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                footer?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+                default?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+                header?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+                footer?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
                 'no-data'?: (() => vue.VNodeChild) | undefined;
-            } | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild);
+            } | ((arg: VDataIteratorSlotProps) => vue.VNodeChild);
             'v-slots'?: {
-                default?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                header?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                footer?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+                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 | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            "v-slot:header"?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            "v-slot:footer"?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | 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;
-        } & {
-            $slots?: {
-                default?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                header?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                footer?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-                'no-data'?: (() => vue.VNodeChild) | undefined;
-            } | undefined;
         } & {
             "onUpdate:modelValue"?: ((value: any[]) => any) | undefined;
             "onUpdate:sortBy"?: ((value: any) => any) | undefined;
             "onUpdate:groupBy"?: ((value: any) => any) | undefined;
+            "onUpdate:expanded"?: ((value: any) => any) | undefined;
             "onUpdate:page"?: ((value: number) => any) | undefined;
             "onUpdate:itemsPerPage"?: ((value: number) => any) | undefined;
-            "onUpdate:expanded"?: ((value: any) => any) | undefined;
             "onUpdate:options"?: ((value: any) => any) | undefined;
         }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
             'update:modelValue': (value: any[]) => boolean;
@@ -365,25 +365,27 @@ declare const VDataIterator: {
             sortBy: readonly SortItem[];
             items: any[];
             modelValue: readonly any[];
+            selectStrategy: "all" | "page" | "single";
             itemValue: SelectItemKey;
             returnObject: boolean;
             filterMode: FilterMode;
             noFilter: boolean;
+            itemSelectable: SelectItemKey;
+            showSelect: boolean;
             multiSort: boolean;
             mustSort: boolean;
             groupBy: readonly SortItem[];
-            itemsPerPage: NonNullable<string | number>;
             expandOnClick: boolean;
             showExpand: boolean;
-            showSelect: boolean;
+            itemsPerPage: NonNullable<string | number>;
         }, {}, string, vue.SlotsType<Partial<{
-            default: (args_0: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            default: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[];
-            header: (args_0: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            header: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[];
-            footer: (args_0: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            footer: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[];
             'no-data': () => vue.VNode<vue.RendererNode, vue.RendererElement, {
@@ -418,17 +420,19 @@ declare const VDataIterator: {
         sortBy: readonly SortItem[];
         items: any[];
         modelValue: readonly any[];
+        selectStrategy: "all" | "page" | "single";
         itemValue: SelectItemKey;
         returnObject: boolean;
         filterMode: FilterMode;
         noFilter: boolean;
+        itemSelectable: SelectItemKey;
+        showSelect: boolean;
         multiSort: boolean;
         mustSort: boolean;
         groupBy: readonly SortItem[];
-        itemsPerPage: NonNullable<string | number>;
         expandOnClick: boolean;
         showExpand: boolean;
-        showSelect: boolean;
+        itemsPerPage: NonNullable<string | number>;
     } & {
         search?: string | undefined;
         class?: any;
@@ -438,36 +442,29 @@ declare const VDataIterator: {
         customKeySort?: Record<string, DataTableCompareFunction> | undefined;
     } & {
         $children?: vue.VNodeChild | {
-            default?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            header?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            footer?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+            default?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+            header?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+            footer?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
             'no-data'?: (() => vue.VNodeChild) | undefined;
-        } | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild);
+        } | ((arg: VDataIteratorSlotProps) => vue.VNodeChild);
         'v-slots'?: {
-            default?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            header?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            footer?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+            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 | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        "v-slot:header"?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        "v-slot:footer"?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | 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;
-    } & {
-        $slots?: {
-            default?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            header?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            footer?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-            'no-data'?: (() => vue.VNodeChild) | undefined;
-        } | undefined;
     } & {
         "onUpdate:modelValue"?: ((value: any[]) => any) | undefined;
         "onUpdate:sortBy"?: ((value: any) => any) | undefined;
         "onUpdate:groupBy"?: ((value: any) => any) | undefined;
+        "onUpdate:expanded"?: ((value: any) => any) | undefined;
         "onUpdate:page"?: ((value: number) => any) | undefined;
         "onUpdate:itemsPerPage"?: ((value: number) => any) | undefined;
-        "onUpdate:expanded"?: ((value: any) => any) | undefined;
         "onUpdate:options"?: ((value: any) => any) | undefined;
     } & vue.ShallowUnwrapRef<{}> & {} & vue.ComponentCustomProperties & {};
     __isFragment?: undefined;
@@ -482,17 +479,19 @@ declare const VDataIterator: {
     sortBy: readonly SortItem[];
     items: any[];
     modelValue: readonly any[];
+    selectStrategy: "all" | "page" | "single";
     itemValue: SelectItemKey;
     returnObject: boolean;
     filterMode: FilterMode;
     noFilter: boolean;
+    itemSelectable: SelectItemKey;
+    showSelect: boolean;
     multiSort: boolean;
     mustSort: boolean;
     groupBy: readonly SortItem[];
-    itemsPerPage: NonNullable<string | number>;
     expandOnClick: boolean;
     showExpand: boolean;
-    showSelect: boolean;
+    itemsPerPage: NonNullable<string | number>;
 } & {
     search?: string | undefined;
     class?: any;
@@ -502,36 +501,29 @@ declare const VDataIterator: {
     customKeySort?: Record<string, DataTableCompareFunction> | undefined;
 } & {
     $children?: vue.VNodeChild | {
-        default?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        header?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        footer?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+        default?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+        header?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+        footer?: ((arg: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
         'no-data'?: (() => vue.VNodeChild) | undefined;
-    } | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild);
+    } | ((arg: VDataIteratorSlotProps) => vue.VNodeChild);
     'v-slots'?: {
-        default?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        header?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        footer?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
+        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 | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-    "v-slot:header"?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-    "v-slot:footer"?: false | ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | 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;
-} & {
-    $slots?: {
-        default?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        header?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        footer?: ((args_0: VDataIteratorSlotProps) => vue.VNodeChild) | undefined;
-        'no-data'?: (() => vue.VNodeChild) | undefined;
-    } | undefined;
 } & {
     "onUpdate:modelValue"?: ((value: any[]) => any) | undefined;
     "onUpdate:sortBy"?: ((value: any) => any) | undefined;
     "onUpdate:groupBy"?: ((value: any) => any) | undefined;
+    "onUpdate:expanded"?: ((value: any) => any) | undefined;
     "onUpdate:page"?: ((value: number) => any) | undefined;
     "onUpdate:itemsPerPage"?: ((value: number) => any) | undefined;
-    "onUpdate:expanded"?: ((value: any) => any) | undefined;
     "onUpdate:options"?: ((value: any) => any) | undefined;
 }, {}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, {
     'update:modelValue': (value: any[]) => boolean;
@@ -550,25 +542,27 @@ declare const VDataIterator: {
     sortBy: readonly SortItem[];
     items: any[];
     modelValue: readonly any[];
+    selectStrategy: "all" | "page" | "single";
     itemValue: SelectItemKey;
     returnObject: boolean;
     filterMode: FilterMode;
     noFilter: boolean;
+    itemSelectable: SelectItemKey;
+    showSelect: boolean;
     multiSort: boolean;
     mustSort: boolean;
     groupBy: readonly SortItem[];
-    itemsPerPage: NonNullable<string | number>;
     expandOnClick: boolean;
     showExpand: boolean;
-    showSelect: boolean;
+    itemsPerPage: NonNullable<string | number>;
 }, {}, string, vue.SlotsType<Partial<{
-    default: (args_0: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    default: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
-    header: (args_0: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    header: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
-    footer: (args_0: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    footer: (arg: VDataIteratorSlotProps) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
     'no-data': () => vue.VNode<vue.RendererNode, vue.RendererElement, {
@@ -616,6 +610,10 @@ declare const VDataIterator: {
     multiSort: BooleanConstructor;
     mustSort: BooleanConstructor;
     showSelect: BooleanConstructor;
+    selectStrategy: {
+        type: vue.PropType<"all" | "page" | "single">;
+        default: string;
+    };
     modelValue: {
         type: vue.PropType<readonly any[]>;
         default: () => never[];
@@ -628,6 +626,10 @@ declare const VDataIterator: {
         type: vue.PropType<SelectItemKey>;
         default: string;
     };
+    itemSelectable: {
+        type: vue.PropType<SelectItemKey>;
+        default: null;
+    };
     returnObject: BooleanConstructor;
     class: vue.PropType<any>;
     style: {
@@ -678,6 +680,10 @@ declare const VDataIterator: {
     multiSort: BooleanConstructor;
     mustSort: BooleanConstructor;
     showSelect: BooleanConstructor;
+    selectStrategy: {
+        type: vue.PropType<"all" | "page" | "single">;
+        default: string;
+    };
     modelValue: {
         type: vue.PropType<readonly any[]>;
         default: () => never[];
@@ -690,6 +696,10 @@ declare const VDataIterator: {
         type: vue.PropType<SelectItemKey>;
         default: string;
     };
+    itemSelectable: {
+        type: vue.PropType<SelectItemKey>;
+        default: null;
+    };
     returnObject: BooleanConstructor;
     class: vue.PropType<any>;
     style: {

package/lib/labs/VDataTable/VDataTable.css

@@ -129,6 +129,7 @@
   z-index: 1;
 }
 
+.v-data-table-rows-loading,
 .v-data-table-rows-no-data {
   text-align: center;
 }

package/lib/labs/VDataTable/VDataTable.mjs

@@ -7,16 +7,16 @@ import { makeVDataTableFooterProps, VDataTableFooter } from "./VDataTableFooter.
 import { makeVDataTableHeadersProps, VDataTableHeaders } from "./VDataTableHeaders.mjs";
 import { makeVDataTableRowsProps, VDataTableRows } from "./VDataTableRows.mjs";
 import { makeVTableProps, VTable } from "../../components/VTable/VTable.mjs"; // Composables
+import { makeDataTableExpandProps, provideExpanded } from "./composables/expand.mjs";
 import { createGroupBy, makeDataTableGroupProps, provideGroupBy, useGroupedItems } from "./composables/group.mjs";
 import { createHeaders, makeDataTableHeaderProps } from "./composables/headers.mjs";
-import { createPagination, makeDataTablePaginateProps, providePagination, usePaginatedItems } from "./composables/paginate.mjs";
-import { createSort, makeDataTableSortProps, provideSort, useSortedItems } from "./composables/sort.mjs";
-import { makeDataTableExpandProps, provideExpanded } from "./composables/expand.mjs";
 import { makeDataTableItemProps, useDataTableItems } from "./composables/items.mjs";
+import { useOptions } from "./composables/options.mjs";
+import { createPagination, makeDataTablePaginateProps, providePagination, usePaginatedItems } from "./composables/paginate.mjs";
 import { makeDataTableSelectProps, provideSelection } from "./composables/select.mjs";
-import { makeFilterProps, useFilter } from "../../composables/filter.mjs";
+import { createSort, makeDataTableSortProps, provideSort, useSortedItems } from "./composables/sort.mjs";
 import { provideDefaults } from "../../composables/defaults.mjs";
-import { useOptions } from "./composables/options.mjs"; // Utilities
+import { makeFilterProps, useFilter } from "../../composables/filter.mjs"; // Utilities
 import { computed, toRef } from 'vue';
 import { genericComponent, propsFactory, useRender } from "../../util/index.mjs"; // Types
 export const makeDataTableProps = propsFactory({
@@ -135,7 +135,10 @@ export const VDataTable = genericComponent()({
       toggleSelect,
       someSelected,
       allSelected
-    } = provideSelection(props, paginatedItemsWithoutGroups);
+    } = provideSelection(props, {
+      allItems: items,
+      currentPage: paginatedItemsWithoutGroups
+    });
     const {
       isExpanded,
       toggleExpand
@@ -172,8 +175,8 @@ export const VDataTable = genericComponent()({
       toggleExpand,
       isGroupOpen,
       toggleGroup,
-      items: paginatedItems.value,
-      groupedItems: flatItems.value,
+      items: paginatedItemsWithoutGroups.value,
+      groupedItems: paginatedItems.value,
       columns: columns.value,
       headers: headers.value
     }));