@vuetify/nightly 3.1.2-next-20230113.0 → 3.1.2

package/dist/vuetify-labs.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.1.2-next-20230113.0
+* Vuetify v3.1.2
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -4388,9 +4388,69 @@
     updated: updated$1
   };
 
+  // Composables
+
+  // Types
+
+  const oppositeMap = {
+    center: 'center',
+    top: 'bottom',
+    bottom: 'top',
+    left: 'right',
+    right: 'left'
+  };
+  const makeLocationProps = propsFactory({
+    location: String
+  }, 'location');
+  function useLocation(props) {
+    let opposite = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
+    let offset = arguments.length > 2 ? arguments[2] : undefined;
+    const {
+      isRtl
+    } = useRtl();
+    const locationStyles = vue.computed(() => {
+      if (!props.location) return {};
+      const {
+        side,
+        align
+      } = parseAnchor(props.location.split(' ').length > 1 ? props.location : `${props.location} center`, isRtl.value);
+      function getOffset(side) {
+        return offset ? offset(side) : 0;
+      }
+      const styles = {};
+      if (side !== 'center') {
+        if (opposite) styles[oppositeMap[side]] = `calc(100% - ${getOffset(side)}px)`;else styles[side] = 0;
+      }
+      if (align !== 'center') {
+        if (opposite) styles[oppositeMap[align]] = `calc(100% - ${getOffset(align)}px)`;else styles[align] = 0;
+      } else {
+        if (side === 'center') styles.top = styles.left = '50%';else {
+          styles[{
+            top: 'left',
+            bottom: 'left',
+            left: 'top',
+            right: 'top'
+          }[side]] = '50%';
+        }
+        styles.transform = {
+          top: 'translateX(-50%)',
+          bottom: 'translateX(-50%)',
+          left: 'translateY(-50%)',
+          right: 'translateY(-50%)',
+          center: 'translate(-50%, -50%)'
+        }[side];
+      }
+      return styles;
+    });
+    return {
+      locationStyles
+    };
+  }
+
   const VProgressLinear = defineComponent({
     name: 'VProgressLinear',
     props: {
+      absolute: Boolean,
       active: {
         type: Boolean,
         default: true
@@ -4420,6 +4480,9 @@
       stream: Boolean,
       striped: Boolean,
       roundedBar: Boolean,
+      ...makeLocationProps({
+        location: 'top'
+      }),
       ...makeRoundedProps(),
       ...makeTagProps(),
       ...makeThemeProps()
@@ -4438,6 +4501,9 @@
       const {
         themeClasses
       } = provideTheme(props);
+      const {
+        locationStyles
+      } = useLocation(props);
       const {
         textColorClasses,
         textColorStyles
@@ -4479,6 +4545,7 @@
       useRender(() => vue.createVNode(props.tag, {
         "ref": intersectionRef,
         "class": ['v-progress-linear', {
+          'v-progress-linear--absolute': props.absolute,
           'v-progress-linear--active': props.active && isIntersecting.value,
           'v-progress-linear--reverse': isReversed.value,
           'v-progress-linear--rounded': props.rounded,
@@ -4486,8 +4553,11 @@
           'v-progress-linear--striped': props.striped
         }, roundedClasses.value, themeClasses.value],
         "style": {
+          bottom: props.location === 'bottom' ? 0 : undefined,
+          top: props.location === 'top' ? 0 : undefined,
           height: props.active ? convertToUnit(height.value) : 0,
-          '--v-progress-linear-height': convertToUnit(height.value)
+          '--v-progress-linear-height': convertToUnit(height.value),
+          ...locationStyles.value
         },
         "role": "progressbar",
         "aria-hidden": props.active ? 'false' : 'true',
@@ -4573,65 +4643,6 @@
     }, null)]);
   }
 
-  // Composables
-
-  // Types
-
-  const oppositeMap = {
-    center: 'center',
-    top: 'bottom',
-    bottom: 'top',
-    left: 'right',
-    right: 'left'
-  };
-  const makeLocationProps = propsFactory({
-    location: String
-  }, 'location');
-  function useLocation(props) {
-    let opposite = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : false;
-    let offset = arguments.length > 2 ? arguments[2] : undefined;
-    const {
-      isRtl
-    } = useRtl();
-    const locationStyles = vue.computed(() => {
-      if (!props.location) return {};
-      const {
-        side,
-        align
-      } = parseAnchor(props.location.split(' ').length > 1 ? props.location : `${props.location} center`, isRtl.value);
-      function getOffset(side) {
-        return offset ? offset(side) : 0;
-      }
-      const styles = {};
-      if (side !== 'center') {
-        if (opposite) styles[oppositeMap[side]] = `calc(100% - ${getOffset(side)}px)`;else styles[side] = 0;
-      }
-      if (align !== 'center') {
-        if (opposite) styles[oppositeMap[align]] = `calc(100% - ${getOffset(align)}px)`;else styles[align] = 0;
-      } else {
-        if (side === 'center') styles.top = styles.left = '50%';else {
-          styles[{
-            top: 'left',
-            bottom: 'left',
-            left: 'top',
-            right: 'top'
-          }[side]] = '50%';
-        }
-        styles.transform = {
-          top: 'translateX(-50%)',
-          bottom: 'translateX(-50%)',
-          left: 'translateY(-50%)',
-          right: 'translateY(-50%)',
-          center: 'translate(-50%, -50%)'
-        }[side];
-      }
-      return styles;
-    });
-    return {
-      locationStyles
-    };
-  }
-
   // Utilities
 
   // Types
@@ -4837,8 +4848,14 @@
       const group = useGroupItem(props, props.symbol, false);
       const link = useLink(props, attrs);
       const isActive = vue.computed(() => {
-        var _link$isActive;
-        return props.active !== false && (props.active || ((_link$isActive = link.isActive) == null ? void 0 : _link$isActive.value) || (group == null ? void 0 : group.isSelected.value));
+        if (props.active !== undefined) {
+          return props.active;
+        }
+        if (link.isLink.value) {
+          var _link$isActive;
+          return (_link$isActive = link.isActive) == null ? void 0 : _link$isActive.value;
+        }
+        return group == null ? void 0 : group.isSelected.value;
       });
       const isDisabled = vue.computed(() => (group == null ? void 0 : group.disabled.value) || props.disabled);
       const isElevated = vue.computed(() => {
@@ -4848,7 +4865,7 @@
       useRender(() => {
         var _slots$prepend, _slots$default, _slots$append, _slots$loader;
         const Tag = link.isLink.value ? 'a' : props.tag;
-        const hasColor = !group || group.isSelected.value;
+        const hasColor = !group || isActive.value;
         const hasPrepend = !!(props.prependIcon || slots.prepend);
         const hasAppend = !!(props.appendIcon || slots.append);
         const hasIcon = !!(props.icon && props.icon !== true);
@@ -7583,6 +7600,10 @@
       nav: Boolean,
       prependAvatar: String,
       prependIcon: IconValue,
+      ripple: {
+        type: Boolean,
+        default: true
+      },
       subtitle: [String, Number, Boolean],
       title: [String, Number, Boolean],
       value: null,
@@ -7774,7 +7795,7 @@
               "key": "append-avatar"
             }, null)])]
           })]
-        }), [[vue.resolveDirective("ripple"), isClickable.value]]);
+        }), [[vue.resolveDirective("ripple"), isClickable.value && props.ripple]]);
       });
       return {};
     }
@@ -9942,6 +9963,7 @@
               "activator": "parent",
               "contentClass": "v-select__content",
               "eager": props.eager,
+              "maxHeight": 310,
               "openOnClick": false,
               "closeOnContentClick": false,
               "transition": props.transition
@@ -10057,7 +10079,7 @@
     const customFiltersLength = Object.keys((options == null ? void 0 : options.customKeyFilter) ?? {}).length;
     if (!(items != null && items.length)) return array;
     loop: for (let i = 0; i < items.length; i++) {
-      const item = items[i].raw;
+      const item = items[i];
       const customMatches = {};
       const defaultMatches = {};
       let match = -1;
@@ -10097,7 +10119,7 @@
     }
     return array;
   }
-  function useFilter(props, items, query) {
+  function useFilter(props, items, query, options) {
     const strQuery = vue.computed(() => typeof (query == null ? void 0 : query.value) !== 'string' && typeof (query == null ? void 0 : query.value) !== 'number' ? '' : String(query.value));
     const filteredItems = vue.ref([]);
     const filteredMatches = vue.ref(new Map());
@@ -10108,7 +10130,7 @@
       const results = filterItems(transformedItems, strQuery.value, {
         customKeyFilter: props.customKeyFilter,
         default: props.customFilter,
-        filterKeys: props.filterKeys,
+        filterKeys: vue.unref(options == null ? void 0 : options.filterKeys) ?? props.filterKeys,
         filterMode: props.filterMode,
         noFilter: props.noFilter
       });
@@ -10331,6 +10353,7 @@
               "activator": "parent",
               "contentClass": "v-autocomplete__content",
               "eager": props.eager,
+              "maxHeight": 310,
               "openOnClick": false,
               "closeOnContentClick": false,
               "transition": props.transition,
@@ -11039,7 +11062,10 @@
       },
       prependAvatar: String,
       prependIcon: IconValue,
-      ripple: Boolean,
+      ripple: {
+        type: Boolean,
+        default: true
+      },
       subtitle: String,
       text: String,
       title: String,
@@ -11160,7 +11186,7 @@
           }), (_slots$default = slots.default) == null ? void 0 : _slots$default.call(slots), slots.actions && vue.createVNode(VCardActions, null, {
             default: slots.actions
           }), genOverlays(isClickable.value, 'v-card')]
-        }), [[vue.resolveDirective("ripple"), isClickable.value]]);
+        }), [[vue.resolveDirective("ripple"), isClickable.value && props.ripple]]);
       });
       return {};
     }
@@ -12453,6 +12479,10 @@
       position: {
         type: Number,
         required: true
+      },
+      ripple: {
+        type: Boolean,
+        default: true
       }
     },
     emits: {
@@ -12553,7 +12583,7 @@
         }, null), vue.withDirectives(vue.createVNode("div", {
           "class": ['v-slider-thumb__ripple', textColorClasses.value],
           "style": textColorStyles.value
-        }, null), [[vue.resolveDirective("ripple"), true, null, {
+        }, null), [[vue.resolveDirective("ripple"), props.ripple, null, {
           circle: true,
           center: true
         }]]), vue.createVNode(VScaleTransition, {
@@ -13605,7 +13635,7 @@
             vTextFieldRef.value.setSelectionRange(0, 0);
           }
         }
-        if (e.key === 'Enter') {
+        if (e.key === 'Enter' && search.value) {
           select(transformItem$1(props, search.value));
           search.value = '';
         }
@@ -13694,6 +13724,7 @@
               "activator": "parent",
               "contentClass": "v-combobox__content",
               "eager": props.eager,
+              "maxHeight": 310,
               "openOnClick": false,
               "closeOnContentClick": false,
               "transition": props.transition,
@@ -18523,9 +18554,13 @@
         order: val.order ?? false
       })).concat(sortBy.value);
     });
-    function toggleGroup(group, value) {
-      const open = value == null ? !opened.value.has(group) : value;
-      if (open) opened.value.add(group);else opened.value.delete(group);
+    function isGroupOpen(group) {
+      return opened.value.has(group.id);
+    }
+    function toggleGroup(group) {
+      const newOpened = new Set(opened.value);
+      if (!isGroupOpen(group)) newOpened.add(group.id);else newOpened.delete(group.id);
+      opened.value = newOpened;
     }
     function extractRows(items) {
       function dive(group) {
@@ -18558,7 +18593,8 @@
       toggleGroup,
       opened,
       groupBy,
-      extractRows
+      extractRows,
+      isGroupOpen
     };
     vue.provide(VDataTableGroupSymbol, data);
     return data;
@@ -18644,7 +18680,7 @@
         slots
       } = _ref;
       const {
-        opened,
+        isGroupOpen,
         toggleGroup,
         extractRows
       } = useGroupBy();
@@ -18667,8 +18703,8 @@
       }, [columns.value.map(column => {
         if (column.key === 'data-table-group') {
           var _slots$dataTableGro;
-          const icon = opened.value.has(props.item.id) ? '$expand' : '$next';
-          const onClick = () => toggleGroup(props.item.id);
+          const icon = isGroupOpen(props.item) ? '$expand' : '$next';
+          const onClick = () => toggleGroup(props.item);
           return ((_slots$dataTableGro = slots['data-table-group']) == null ? void 0 : _slots$dataTableGro.call(slots, {
             item: props.item,
             count: rows.value.length,
@@ -18861,10 +18897,18 @@
         columns
       } = useHeaders();
       const {
-        expanded,
-        expand,
-        expandOnClick
+        expandOnClick,
+        toggleExpand,
+        isExpanded
       } = useExpanded();
+      const {
+        isSelected,
+        toggleSelect
+      } = useSelection();
+      const {
+        toggleGroup,
+        isGroupOpen
+      } = useGroupBy();
       const {
         t
       } = useLocale();
@@ -18883,23 +18927,41 @@
         })), props.items.map((item, index) => {
           var _slots$expandedRow;
           if (item.type === 'group-header') {
-            return vue.createVNode(VDataTableGroupHeaderRow, {
+            return slots['group-header'] ? slots['group-header']({
+              index,
+              item,
+              columns: columns.value,
+              isExpanded,
+              toggleExpand,
+              isSelected,
+              toggleSelect,
+              toggleGroup,
+              isGroupOpen
+            }) : vue.createVNode(VDataTableGroupHeaderRow, {
               "key": `group-header_${item.id}`,
               "item": item
             }, slots);
           }
-          return vue.createVNode(vue.Fragment, null, [vue.createVNode(VDataTableRow, {
+          return vue.createVNode(vue.Fragment, null, [slots.item ? slots.item({
+            index,
+            item,
+            columns: columns.value,
+            isExpanded,
+            toggleExpand,
+            isSelected,
+            toggleSelect
+          }) : vue.createVNode(VDataTableRow, {
             "key": `item_${item.value}`,
             "onClick": event => {
               if (expandOnClick.value) {
-                expand(item, !expanded.value.has(item.value));
+                toggleExpand(item.value);
               }
               emit('click:row', event, {
                 item
               });
             },
             "item": item
-          }, slots), expanded.value.has(item.value) && ((_slots$expandedRow = slots['expanded-row']) == null ? void 0 : _slots$expandedRow.call(slots, {
+          }, slots), isExpanded(item.value) && ((_slots$expandedRow = slots['expanded-row']) == null ? void 0 : _slots$expandedRow.call(slots, {
             item,
             columns: columns.value
           }))]);
@@ -19197,9 +19259,12 @@
       const {
         items
       } = useDataTableItems(props, columns);
+      const filterKeys = vue.computed(() => columns.value.map(c => 'columns.' + c.key));
       const {
         filteredItems
-      } = useFilter(props, items, vue.toRef(props, 'search'));
+      } = useFilter(props, items, vue.toRef(props, 'search'), {
+        filterKeys
+      });
       const {
         sortBy
       } = createSort(props);
@@ -19389,9 +19454,12 @@
       const {
         items
       } = useDataTableItems(props, columns);
+      const filterKeys = vue.computed(() => columns.value.map(c => 'columns.' + c.key));
       const {
         filteredItems
-      } = useFilter(props, items, vue.toRef(props, 'search'));
+      } = useFilter(props, items, vue.toRef(props, 'search'), {
+        filterKeys
+      });
       const {
         sortBy
       } = createSort(props);
@@ -20089,7 +20157,7 @@
       locale
     };
   }
-  const version$1 = "3.1.2-next-20230113.0";
+  const version$1 = "3.1.2";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -20102,7 +20170,7 @@
     }
   }
 
-  const version = "3.1.2-next-20230113.0";
+  const version = "3.1.2";
 
   const createVuetify = function () {
     let options = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : {};