@vuetify/nightly 3.3.3-master.2023-06-08 → 3.3.3-pr-17265.321510f

package/CHANGELOG.md

@@ -1,8 +1,21 @@
-# [](https://github.com/vuetifyjs/vuetify/compare/v3.3.3-master.2023-06-08...v) (2023-06-08)
+# [](https://github.com/vuetifyjs/vuetify/compare/v3.3.3-pr-17265.321510f...v) (2023-06-09)
 
 
 
-## [3.3.3-master.2023-06-08](https://github.com/vuetifyjs/vuetify/compare/v3.3.3...v3.3.3-master.2023-06-08) (2023-06-08)
+## [3.3.3-pr-17265.321510f](https://github.com/vuetifyjs/vuetify/compare/v3.3.3...v3.3.3-pr-17265.321510f) (2023-06-09)
+
+
+### Bug Fixes
+
+* include elements that aren't yet scrollable ([11cbad2](https://github.com/vuetifyjs/vuetify/commit/11cbad2fcc3ec1e8d71c929579939c8ce5137452))
+* **VDataTable:** show-select not reactive ([6987695](https://github.com/vuetifyjs/vuetify/commit/6987695f2ee6045712ee47e829c20100611aa406)), closes [#17557](https://github.com/vuetifyjs/vuetify/issues/17557)
+* use display height if scrolling parent is window ([ff603e8](https://github.com/vuetifyjs/vuetify/commit/ff603e8146f44725ca0eb176b219d4a069609d09))
+* **VVirtualScroll:** set max visible items to 12 if no item-height ([288bcab](https://github.com/vuetifyjs/vuetify/commit/288bcab23e66fc438e0e39c325841e5dc7d91855))
+
+
+### Features
+
+* **VSelect:** implement virtual scrolling ([acd6aae](https://github.com/vuetifyjs/vuetify/commit/acd6aae5e23764423d3f6df846056aa5318a34d5))
 
 
 

package/dist/json/attributes.json

@@ -8551,6 +8551,10 @@
     "type": "string | number\n",
     "description": "Height in pixels of each item to display. When using **dynamic-item-height** this should be an average initial size."
   },
+  "v-virtual-scroll/renderless": {
+    "type": "boolean\n",
+    "description": "MISSING DESCRIPTION"
+  },
   "v-window/model-value": {
     "type": "any\n",
     "description": "The v-model value of the component. If component supports the **multiple** prop, this defaults to an empty array"

package/dist/json/importMap-labs.json

@@ -4,6 +4,10 @@
       "from": "labs/VBottomSheet/index.mjs",
       "styles": []
     },
+    "VInfiniteScroll": {
+      "from": "labs/VInfiniteScroll/index.mjs",
+      "styles": []
+    },
     "VDataTable": {
       "from": "labs/VDataTable/index.mjs",
       "styles": []
@@ -32,10 +36,6 @@
       "from": "labs/VSkeletonLoader/index.mjs",
       "styles": []
     },
-    "VInfiniteScroll": {
-      "from": "labs/VInfiniteScroll/index.mjs",
-      "styles": []
-    },
     "VDataIterator": {
       "from": "labs/VDataIterator/index.mjs",
       "styles": []

package/dist/json/tags.json

@@ -2835,6 +2835,7 @@
       "max-width",
       "min-height",
       "min-width",
+      "renderless",
       "width"
     ],
     "description": ""

package/dist/json/web-types.json

@@ -2,7 +2,7 @@
   "$schema": "http://json.schemastore.org/web-types",
   "framework": "vue",
   "name": "vuetify",
-  "version": "3.3.3-master.2023-06-08",
+  "version": "3.3.3-pr-17265.321510f",
   "contributions": {
     "html": {
       "types-syntax": "typescript",
@@ -13899,6 +13899,7 @@
               "name": "itemHeight",
               "description": "MISSING DESCRIPTION",
               "doc-url": "https://vuetifyjs.com/api/v-data-table-virtual#props",
+              "default": "48",
               "value": {
                 "kind": "expression",
                 "type": "string | number\n"
@@ -33610,10 +33611,21 @@
               "name": "itemHeight",
               "description": "Height in pixels of each item to display. When using **dynamic-item-height** this should be an average initial size.",
               "doc-url": "https://vuetifyjs.com/api/v-virtual-scroll#props",
+              "default": "48",
               "value": {
                 "kind": "expression",
                 "type": "string | number\n"
               }
+            },
+            {
+              "name": "renderless",
+              "description": "MISSING DESCRIPTION",
+              "doc-url": "https://vuetifyjs.com/api/v-virtual-scroll#props",
+              "default": "false",
+              "value": {
+                "kind": "expression",
+                "type": "boolean\n"
+              }
             }
           ],
           "events": [],
@@ -33621,17 +33633,7 @@
             {
               "name": "default",
               "description": "Default slot to render a single item",
-              "doc-url": "https://vuetifyjs.com/api/v-virtual-scroll#slots",
-              "vue-properties": [
-                {
-                  "name": "item",
-                  "type": "unknown"
-                },
-                {
-                  "name": "index",
-                  "type": "number"
-                }
-              ]
+              "doc-url": "https://vuetifyjs.com/api/v-virtual-scroll#slots"
             }
           ],
           "vue-model": {

package/dist/vuetify-labs.css

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.3.3-master.2023-06-08
+* Vuetify v3.3.3-pr-17265.321510f
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -16401,6 +16401,18 @@ html.overflow-y-hidden {
   min-height: 100vh;
   min-height: 100dvh;
   position: relative;
+}.v-app-bar {
+  display: flex;
+}
+.v-app-bar.v-toolbar {
+  background: rgb(var(--v-theme-surface));
+  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
+}
+.v-app-bar.v-toolbar:not(.v-toolbar--flat) {
+  box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.12));
+}
+.v-app-bar:not(.v-toolbar--absolute) {
+  padding-inline-end: var(--v-scrollbar-offset);
 }.v-alert {
   display: grid;
   flex: 1 1;
@@ -16705,18 +16717,6 @@ html.overflow-y-hidden {
 .v-autocomplete--active-menu .v-autocomplete__menu-icon {
   opacity: var(--v-high-emphasis-opacity);
   transform: rotate(180deg);
-}.v-app-bar {
-  display: flex;
-}
-.v-app-bar.v-toolbar {
-  background: rgb(var(--v-theme-surface));
-  color: rgba(var(--v-theme-on-surface), var(--v-high-emphasis-opacity));
-}
-.v-app-bar.v-toolbar:not(.v-toolbar--flat) {
-  box-shadow: 0px 2px 4px -1px var(--v-shadow-key-umbra-opacity, rgba(0, 0, 0, 0.2)), 0px 4px 5px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.14)), 0px 1px 10px 0px var(--v-shadow-key-penumbra-opacity, rgba(0, 0, 0, 0.12));
-}
-.v-app-bar:not(.v-toolbar--absolute) {
-  padding-inline-end: var(--v-scrollbar-offset);
 }.v-avatar {
   flex: none;
   align-items: center;

package/dist/vuetify-labs.d.ts

@@ -55399,6 +55399,7 @@ declare const VVirtualScroll: {
         $data: {};
         $props: {
             style?: vue.StyleValue | undefined;
+            itemHeight?: string | number | undefined;
             key?: string | number | symbol | undefined;
             height?: string | number | undefined;
             width?: string | number | undefined;
@@ -55448,7 +55449,6 @@ declare const VVirtualScroll: {
             }>) => void) | ((vnode: vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>) => void)[] | undefined;
-            itemHeight?: string | number | undefined;
         };
         $attrs: {
             [x: string]: unknown;
@@ -55457,7 +55457,9 @@ declare const VVirtualScroll: {
             [x: string]: unknown;
         };
         $slots: Readonly<{
-            default?: ((arg: VVirtualScrollSlot<unknown>) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            default?: ((arg: VVirtualScrollSlot<unknown> | (VVirtualScrollSlot<unknown> & {
+                itemRef: Ref<HTMLElement | undefined>;
+            })) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[]) | undefined;
         }>;
@@ -55467,6 +55469,7 @@ declare const VVirtualScroll: {
         $el: any;
         $options: vue.ComponentOptionsBase<{
             style: vue.StyleValue;
+            itemHeight: string | number;
         } & {
             height?: string | number | undefined;
             width?: string | number | undefined;
@@ -55475,13 +55478,15 @@ declare const VVirtualScroll: {
             minHeight?: string | number | undefined;
             minWidth?: string | number | undefined;
             class?: any;
-            itemHeight?: string | number | undefined;
         }, {
             scrollToIndex: (index: number) => void;
-        }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<Record<string, any>, "$children" | "v-slot:default" | "items" | "v-slots">, string, {
+        }, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<Record<string, any>, "$children" | "v-slot:default" | "items" | "v-slots" | "renderless">, string, {
             style: vue.StyleValue;
+            itemHeight: string | number;
         }, {}, string, vue.SlotsType<Partial<{
-            default: (arg: VVirtualScrollSlot<unknown>) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+            default: (arg: VVirtualScrollSlot<unknown> | (VVirtualScrollSlot<unknown> & {
+                itemRef: Ref<HTMLElement | undefined>;
+            })) => vue.VNode<vue.RendererNode, vue.RendererElement, {
                 [key: string]: any;
             }>[];
         }>>> & {
@@ -55506,6 +55511,7 @@ declare const VVirtualScroll: {
         $watch<T extends string | ((...args: any) => any)>(source: T, cb: T extends (...args: any) => infer R ? (args_0: R, args_1: R) => any : (...args: any) => any, options?: vue.WatchOptions<boolean> | undefined): vue.WatchStopHandle;
     } & {
         style: vue.StyleValue;
+        itemHeight: string | number;
     } & {
         height?: string | number | undefined;
         width?: string | number | undefined;
@@ -55514,7 +55520,6 @@ declare const VVirtualScroll: {
         minHeight?: string | number | undefined;
         minWidth?: string | number | undefined;
         class?: any;
-        itemHeight?: string | number | undefined;
     } & vue.ShallowUnwrapRef<{
         scrollToIndex: (index: number) => void;
     }> & {} & vue.ComponentCustomProperties & {};
@@ -55523,6 +55528,7 @@ declare const VVirtualScroll: {
     __isSuspense?: undefined;
 } & vue.ComponentOptionsBase<{
     style: vue.StyleValue;
+    itemHeight: string | number;
 } & {
     height?: string | number | undefined;
     width?: string | number | undefined;
@@ -55531,23 +55537,31 @@ declare const VVirtualScroll: {
     minHeight?: string | number | undefined;
     minWidth?: string | number | undefined;
     class?: any;
-    itemHeight?: string | number | undefined;
 }, {
     scrollToIndex: (index: number) => void;
-}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<Record<string, any>, "$children" | "v-slot:default" | "items" | "v-slots">, string, {
+}, unknown, {}, {}, vue.ComponentOptionsMixin, vue.ComponentOptionsMixin, Omit<Record<string, any>, "$children" | "v-slot:default" | "items" | "v-slots" | "renderless">, string, {
     style: vue.StyleValue;
+    itemHeight: string | number;
 }, {}, string, vue.SlotsType<Partial<{
-    default: (arg: VVirtualScrollSlot<unknown>) => vue.VNode<vue.RendererNode, vue.RendererElement, {
+    default: (arg: VVirtualScrollSlot<unknown> | (VVirtualScrollSlot<unknown> & {
+        itemRef: Ref<HTMLElement | undefined>;
+    })) => vue.VNode<vue.RendererNode, vue.RendererElement, {
         [key: string]: any;
     }>[];
-}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T_1>(props: {
+}>>> & vue.VNodeProps & vue.AllowedComponentProps & vue.ComponentCustomProps & (new <T_1, Renderless extends boolean = false>(props: {
     items?: readonly T_1[] | undefined;
+    renderless?: Renderless | undefined;
 }, slots: {
-    default: VVirtualScrollSlot<T_1>;
+    default: VVirtualScrollSlot<T_1> & (Renderless extends true ? {
+        itemRef: Ref<HTMLElement | undefined>;
+    } : {});
 }) => GenericProps<{
     items?: readonly T_1[] | undefined;
+    renderless?: Renderless | undefined;
 }, {
-    default: VVirtualScrollSlot<T_1>;
+    default: VVirtualScrollSlot<T_1> & (Renderless extends true ? {
+        itemRef: Ref<HTMLElement | undefined>;
+    } : {});
 }>) & FilterPropsOptions<{
     height: (StringConstructor | NumberConstructor)[];
     maxHeight: (StringConstructor | NumberConstructor)[];
@@ -55560,11 +55574,15 @@ declare const VVirtualScroll: {
         type: PropType<vue.StyleValue>;
         default: null;
     };
-    itemHeight: (StringConstructor | NumberConstructor)[];
+    itemHeight: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
     items: {
         type: PropType<readonly unknown[]>;
         default: () => never[];
     };
+    renderless: BooleanConstructor;
 }, vue.ExtractPropTypes<{
     height: (StringConstructor | NumberConstructor)[];
     maxHeight: (StringConstructor | NumberConstructor)[];
@@ -55577,11 +55595,15 @@ declare const VVirtualScroll: {
         type: PropType<vue.StyleValue>;
         default: null;
     };
-    itemHeight: (StringConstructor | NumberConstructor)[];
+    itemHeight: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
     items: {
         type: PropType<readonly unknown[]>;
         default: () => never[];
     };
+    renderless: BooleanConstructor;
 }>>;
 type VVirtualScroll = InstanceType<typeof VVirtualScroll>;
 
@@ -64571,6 +64593,7 @@ declare const VDataTableVirtual: {
             selectStrategy?: "all" | "page" | "single" | undefined;
             itemValue?: SelectItemKey | undefined;
             returnObject?: boolean | undefined;
+            itemHeight?: string | number | undefined;
             hideNoData?: boolean | undefined;
             filterMode?: FilterMode | undefined;
             noFilter?: boolean | undefined;
@@ -64862,7 +64885,6 @@ declare const VDataTableVirtual: {
             filterKeys?: FilterKeys | undefined;
             "v-slot:top"?: false | ((arg: VDataTableVirtualSlotProps) => vue.VNodeChild) | undefined;
             "v-slot:bottom"?: false | ((arg: VDataTableVirtualSlotProps) => vue.VNodeChild) | undefined;
-            itemHeight?: string | number | undefined;
             customKeySort?: Record<string, DataTableCompareFunction> | undefined;
             "onUpdate:sortBy"?: ((value: any) => any) | undefined;
             "onUpdate:groupBy"?: ((value: any) => any) | undefined;
@@ -65070,6 +65092,7 @@ declare const VDataTableVirtual: {
             selectStrategy: "all" | "page" | "single";
             itemValue: SelectItemKey;
             returnObject: boolean;
+            itemHeight: string | number;
             hideNoData: boolean;
             filterMode: FilterMode;
             noFilter: boolean;
@@ -65096,7 +65119,6 @@ declare const VDataTableVirtual: {
             customFilter?: FilterFunction | undefined;
             customKeyFilter?: FilterKeyFunctions | undefined;
             filterKeys?: FilterKeys | undefined;
-            itemHeight?: string | number | undefined;
             customKeySort?: Record<string, DataTableCompareFunction> | undefined;
             rowHeight?: number | undefined;
             'onClick:row'?: ((e: Event, value: {
@@ -65447,6 +65469,7 @@ declare const VDataTableVirtual: {
             selectStrategy: "all" | "page" | "single";
             itemValue: SelectItemKey;
             returnObject: boolean;
+            itemHeight: string | number;
             hideNoData: boolean;
             filterMode: FilterMode;
             noFilter: boolean;
@@ -65634,6 +65657,7 @@ declare const VDataTableVirtual: {
         selectStrategy: "all" | "page" | "single";
         itemValue: SelectItemKey;
         returnObject: boolean;
+        itemHeight: string | number;
         hideNoData: boolean;
         filterMode: FilterMode;
         noFilter: boolean;
@@ -65660,7 +65684,6 @@ declare const VDataTableVirtual: {
         customFilter?: FilterFunction | undefined;
         customKeyFilter?: FilterKeyFunctions | undefined;
         filterKeys?: FilterKeys | undefined;
-        itemHeight?: string | number | undefined;
         customKeySort?: Record<string, DataTableCompareFunction> | undefined;
         rowHeight?: number | undefined;
         'onClick:row'?: ((e: Event, value: {
@@ -66006,6 +66029,7 @@ declare const VDataTableVirtual: {
     selectStrategy: "all" | "page" | "single";
     itemValue: SelectItemKey;
     returnObject: boolean;
+    itemHeight: string | number;
     hideNoData: boolean;
     filterMode: FilterMode;
     noFilter: boolean;
@@ -66032,7 +66056,6 @@ declare const VDataTableVirtual: {
     customFilter?: FilterFunction | undefined;
     customKeyFilter?: FilterKeyFunctions | undefined;
     filterKeys?: FilterKeys | undefined;
-    itemHeight?: string | number | undefined;
     customKeySort?: Record<string, DataTableCompareFunction> | undefined;
     rowHeight?: number | undefined;
     'onClick:row'?: ((e: Event, value: {
@@ -66383,6 +66406,7 @@ declare const VDataTableVirtual: {
     selectStrategy: "all" | "page" | "single";
     itemValue: SelectItemKey;
     returnObject: boolean;
+    itemHeight: string | number;
     hideNoData: boolean;
     filterMode: FilterMode;
     noFilter: boolean;
@@ -66544,7 +66568,10 @@ declare const VDataTableVirtual: {
         default: string;
     };
     noFilter: BooleanConstructor;
-    itemHeight: (StringConstructor | NumberConstructor)[];
+    itemHeight: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
     groupBy: {
         type: vue.PropType<readonly SortItem[]>;
         default: () => never[];
@@ -66642,7 +66669,10 @@ declare const VDataTableVirtual: {
         default: string;
     };
     noFilter: BooleanConstructor;
-    itemHeight: (StringConstructor | NumberConstructor)[];
+    itemHeight: {
+        type: (StringConstructor | NumberConstructor)[];
+        default: number;
+    };
     groupBy: {
         type: vue.PropType<readonly SortItem[]>;
         default: () => never[];