@vuetify/nightly 3.6.7-master.2024-05-29 → 3.6.8-master.2024-05-31

package/dist/vuetify-labs.esm.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.6.7-master.2024-05-29
+* Vuetify v3.6.8-master.2024-05-31
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -6249,7 +6249,15 @@ const VSelectionControl = genericComponent()({
       e.stopPropagation();
     }
     function onInput(e) {
-      if (!isInteractive.value) return;
+      if (!isInteractive.value) {
+        if (input.value) {
+          // model value is not updated when input is not interactive
+          // but the internal checked state of the input is still updated,
+          // so here it's value is restored
+          input.value.checked = model.value;
+        }
+        return;
+      }
       if (props.readonly && group) {
         nextTick(() => group.forceUpdate());
       }
@@ -8702,6 +8710,7 @@ const VListGroup = genericComponent()({
       isBooted
     } = useSsrBoot();
     function onClick(e) {
+      e.stopPropagation();
       open(!isOpen.value, e);
     }
     const activatorProps = computed(() => ({
@@ -9035,6 +9044,8 @@ const VListItem = genericComponent()({
       }), [[resolveDirective("ripple"), isClickable.value && props.ripple]]);
     });
     return {
+      activate,
+      isActivated,
       isGroupActivator,
       isSelected,
       list,
@@ -9371,6 +9382,8 @@ const makeVListProps = propsFactory({
   },
   slim: Boolean,
   nav: Boolean,
+  'onClick:open': EventProp(),
+  'onClick:select': EventProp(),
   ...makeNestedProps({
     selectStrategy: 'single-leaf',
     openStrategy: 'list'
@@ -12682,7 +12695,7 @@ function filterItems(items, query, options) {
     const customMatches = {};
     const defaultMatches = {};
     let match = -1;
-    if (query && !options?.noFilter) {
+    if ((query || customFiltersLength > 0) && !options?.noFilter) {
       if (typeof item === 'object') {
         const filterKeys = keys || Object.keys(transformed);
         for (const key of filterKeys) {
@@ -21523,6 +21536,9 @@ const VDatePickerMonth = genericComponent()({
     });
     function onRangeClick(value) {
       const _value = adapter.startOfDay(value);
+      if (model.value.length === 0) {
+        rangeStart.value = undefined;
+      }
       if (!rangeStart.value) {
         rangeStart.value = _value;
         model.value = [rangeStart.value];
@@ -22230,7 +22246,7 @@ const VEmptyState = genericComponent()({
         "defaults": {
           VBtn: {
             class: 'v-empty-state__action-btn',
-            color: props.color,
+            color: props.color ?? 'surface-variant',
             text: props.actionText
           }
         }
@@ -26675,9 +26691,9 @@ const VTabs = genericComponent()({
           "key": item.text,
           "value": item.value
         }), {
-          default: () => slots[`tab.${item.value}`]?.({
+          default: slots[`tab.${item.value}`] ? () => slots[`tab.${item.value}`]?.({
             item
-          })
+          }) : undefined
         }))]
       }), hasWindow && createVNode(VTabsWindow, mergeProps({
         "modelValue": model.value,
@@ -29359,32 +29375,100 @@ const VTreeviewItem = genericComponent()({
       emit
     } = _ref;
     const link = useLink(props, attrs);
-    const id = computed(() => props.value === undefined ? link.href.value : props.value);
+    const rawId = computed(() => props.value === undefined ? link.href.value : props.value);
     const vListItemRef = ref();
+    const {
+      activate,
+      isActivated,
+      select,
+      isSelected,
+      isIndeterminate,
+      isGroupActivator,
+      root,
+      id
+    } = useNestedItem(rawId, false);
+    const isActivatableGroupActivator = computed(() => root.activatable.value && isGroupActivator);
+    const {
+      densityClasses
+    } = useDensity(props, 'v-list-item');
+    const slotProps = computed(() => ({
+      isActive: isActivated.value,
+      select,
+      isSelected: isSelected.value,
+      isIndeterminate: isIndeterminate.value
+    }));
     const isClickable = computed(() => !props.disabled && props.link !== false && (props.link || link.isClickable.value || props.value != null && !!vListItemRef.value?.list));
-    function onClick(e) {
-      if (!vListItemRef.value?.isGroupActivator || !isClickable.value) return;
-      props.value != null && vListItemRef.value?.select(!vListItemRef.value?.isSelected, e);
+    function activateItem(e) {
+      if (!isClickable.value || !isActivatableGroupActivator.value && isGroupActivator) return;
+      if (root.activatable.value) {
+        if (isActivatableGroupActivator.value) {
+          activate(!isActivated.value, e);
+        } else {
+          vListItemRef.value?.activate(!vListItemRef.value?.isActivated, e);
+        }
+      }
     }
     function onKeyDown(e) {
       if (e.key === 'Enter' || e.key === ' ') {
         e.preventDefault();
-        onClick(e);
+        activateItem(e);
       }
     }
     const visibleIds = inject$1(VTreeviewSymbol, {
       visibleIds: ref()
     }).visibleIds;
     useRender(() => {
+      const hasTitle = slots.title || props.title != null;
+      const hasSubtitle = slots.subtitle || props.subtitle != null;
       const listItemProps = VListItem.filterProps(props);
       const hasPrepend = slots.prepend || props.toggleIcon;
-      return createVNode(VListItem, mergeProps({
+      return isActivatableGroupActivator.value ? withDirectives(createVNode("div", {
+        "class": ['v-list-item', 'v-list-item--one-line', 'v-treeview-item', 'v-treeview-item--activetable-group-activator', {
+          'v-list-item--active': isActivated.value || isSelected.value,
+          'v-treeview-item--filtered': visibleIds.value && !visibleIds.value.has(id.value)
+        }, densityClasses.value, props.class],
+        "onClick": activateItem
+      }, [createVNode(Fragment, null, [genOverlays(isActivated.value || isSelected.value, 'v-list-item'), props.toggleIcon && createVNode(VListItemAction, {
+        "start": false
+      }, {
+        default: () => [createVNode(VBtn, {
+          "density": "compact",
+          "icon": props.toggleIcon,
+          "loading": props.loading,
+          "variant": "text",
+          "onClick": props.onClick
+        }, {
+          loader() {
+            return createVNode(VProgressCircular, {
+              "indeterminate": "disable-shrink",
+              "size": "20",
+              "width": "2"
+            }, null);
+          }
+        })]
+      })]), createVNode("div", {
+        "class": "v-list-item__content",
+        "data-no-activator": ""
+      }, [hasTitle && createVNode(VListItemTitle, {
+        "key": "title"
+      }, {
+        default: () => [slots.title?.({
+          title: props.title
+        }) ?? props.title]
+      }), hasSubtitle && createVNode(VListItemSubtitle, {
+        "key": "subtitle"
+      }, {
+        default: () => [slots.subtitle?.({
+          subtitle: props.subtitle
+        }) ?? props.subtitle]
+      }), slots.default?.(slotProps.value)])]), [[resolveDirective("ripple"), isClickable.value && props.ripple]]) : createVNode(VListItem, mergeProps({
         "ref": vListItemRef
       }, listItemProps, {
         "class": ['v-treeview-item', {
           'v-treeview-item--filtered': visibleIds.value && !visibleIds.value.has(id.value)
         }, props.class],
-        "onClick": onClick,
+        "value": id.value,
+        "onClick": activateItem,
         "onKeydown": isClickable.value && onKeyDown
       }), {
         ...slots,
@@ -29423,7 +29507,8 @@ const makeVTreeviewChildrenProps = propsFactory({
     default: '$loading'
   },
   items: Array,
-  selectable: Boolean
+  selectable: Boolean,
+  selectStrategy: [String, Function, Object]
 }, 'VTreeviewChildren');
 const VTreeviewChildren = genericComponent()({
   name: 'VTreeviewChildren',
@@ -29447,9 +29532,10 @@ const VTreeviewChildren = genericComponent()({
         isLoading.value = null;
       });
     }
-    function onClick(e, item) {
-      e.stopPropagation();
-      checkChildren(item);
+    function selectItem(select, isSelected) {
+      if (props.selectable) {
+        select(!isSelected);
+      }
     }
     return () => slots.default?.() ?? props.items?.map(_ref2 => {
       let {
@@ -29459,23 +29545,21 @@ const VTreeviewChildren = genericComponent()({
       } = _ref2;
       const loading = isLoading.value === item.value;
       const slotsWithItem = {
-        prepend: slots.prepend ? slotProps => slots.prepend?.({
+        prepend: slotProps => createVNode(Fragment, null, [props.selectable && (!children || children && !['leaf', 'single-leaf'].includes(props.selectStrategy)) && createVNode("div", null, [createVNode(VCheckboxBtn, {
+          "key": item.value,
+          "modelValue": slotProps.isSelected,
+          "loading": loading,
+          "indeterminate": slotProps.isIndeterminate,
+          "onClick": withModifiers(() => selectItem(slotProps.select, slotProps.isSelected), ['stop']),
+          "onKeydown": e => {
+            if (!['Enter', 'Space'].includes(e.key)) return;
+            e.stopPropagation();
+            selectItem(slotProps.select, slotProps.isSelected);
+          }
+        }, null)]), slots.prepend?.({
           ...slotProps,
           item
-        }) : props.selectable ? _ref3 => {
-          let {
-            isSelected,
-            isIndeterminate
-          } = _ref3;
-          return createVNode(VCheckboxBtn, {
-            "key": item.value,
-            "tabindex": "-1",
-            "modelValue": isSelected,
-            "loading": loading,
-            "indeterminate": isIndeterminate,
-            "onClick": e => onClick(e, item)
-          }, null);
-        } : undefined,
+        })]),
         append: slots.append ? slotProps => slots.append?.({
           ...slotProps,
           item
@@ -29490,13 +29574,18 @@ const VTreeviewChildren = genericComponent()({
       return children ? createVNode(VTreeviewGroup, mergeProps({
         "value": itemProps?.value
       }, treeviewGroupProps), {
-        activator: _ref4 => {
+        activator: _ref3 => {
           let {
             props: activatorProps
-          } = _ref4;
-          return createVNode(VTreeviewItem, mergeProps(itemProps, activatorProps, {
+          } = _ref3;
+          const listItemProps = {
+            ...itemProps,
+            ...activatorProps,
+            value: itemProps?.value
+          };
+          return createVNode(VTreeviewItem, mergeProps(listItemProps, {
             "loading": loading,
-            "onClick": e => onClick(e, item)
+            "onClick": () => checkChildren(item)
           }), slotsWithItem);
         },
         default: () => createVNode(VTreeviewChildren, mergeProps(treeviewChildrenProps, {
@@ -29527,7 +29616,7 @@ const makeVTreeviewProps = propsFactory({
   ...omit(makeVListProps({
     collapseIcon: '$treeviewCollapse',
     expandIcon: '$treeviewExpand',
-    selectStrategy: 'independent',
+    selectStrategy: 'classic',
     openStrategy: 'multiple',
     slim: true
   }), ['nav'])
@@ -30148,7 +30237,7 @@ function createVuetify$1() {
     goTo
   };
 }
-const version$1 = "3.6.7-master.2024-05-29";
+const version$1 = "3.6.8-master.2024-05-31";
 createVuetify$1.version = version$1;
 
 // Vue's inject() can only be used in setup
@@ -30401,7 +30490,7 @@ var index = /*#__PURE__*/Object.freeze({
 
 /* eslint-disable local-rules/sort-imports */
 
-const version = "3.6.7-master.2024-05-29";
+const version = "3.6.8-master.2024-05-31";
 
 /* eslint-disable local-rules/sort-imports */