vuetify 3.8.0-beta.0 → 3.8.0

package/dist/vuetify.cjs

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.8.0-beta.0
+* Vuetify v3.8.0
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -162,7 +162,7 @@
   function pick(obj, paths) {
     const found = {};
     for (const key of paths) {
-      if (Object.hasOwn(obj, key)) {
+      if (Object.prototype.hasOwnProperty.call(obj, key)) {
         found[key] = obj[key];
       }
     }
@@ -4932,6 +4932,7 @@
     start: Boolean,
     end: Boolean,
     icon: IconValue,
+    opacity: [String, Number],
     ...makeComponentProps(),
     ...makeSizeProps(),
     ...makeTagProps({
@@ -4950,7 +4951,7 @@
       const slotIcon = vue.ref();
       const {
         themeClasses
-      } = provideTheme(props);
+      } = useTheme();
       const {
         iconData
       } = useIcon(vue.computed(() => slotIcon.value || props.icon));
@@ -4976,7 +4977,9 @@
             'v-icon--start': props.start,
             'v-icon--end': props.end
           }, props.class],
-          "style": [!sizeClasses.value ? {
+          "style": [{
+            '--v-icon-opacity': props.opacity
+          }, !sizeClasses.value ? {
             fontSize: convertToUnit(props.size),
             height: convertToUnit(props.size),
             width: convertToUnit(props.size)
@@ -12132,7 +12135,11 @@
           },
           focus,
           blur
-        })]), hasClear && vue.createVNode(VExpandXTransition, {
+        }) ?? vue.createVNode("div", {
+          "id": id.value,
+          "class": "v-field__input",
+          "aria-describedby": messagesId.value
+        }, null)]), hasClear && vue.createVNode(VExpandXTransition, {
           "key": "clear"
         }, {
           default: () => [vue.withDirectives(vue.createVNode("div", {
@@ -13664,12 +13671,7 @@
         } else {
           if (!props.multiple && search.value == null) model.value = [];
           menu.value = false;
-          if (!model.value.some(_ref3 => {
-            let {
-              title
-            } = _ref3;
-            return title === search.value;
-          })) search.value = '';
+          if (props.multiple || hasSelectionSlot.value) search.value = '';
           selectionIndex.value = -1;
         }
       });
@@ -13757,12 +13759,12 @@
                 "items": displayItems.value,
                 "itemKey": "value"
               }, {
-                default: _ref4 => {
+                default: _ref3 => {
                   let {
                     item,
                     index,
                     itemRef
-                  } = _ref4;
+                  } = _ref3;
                   const itemProps = vue.mergeProps(item.props, {
                     ref: itemRef,
                     key: item.value,
@@ -13776,10 +13778,10 @@
                   }) ?? vue.createVNode(VListItem, vue.mergeProps(itemProps, {
                     "role": "option"
                   }), {
-                    prepend: _ref5 => {
+                    prepend: _ref4 => {
                       let {
                         isSelected
-                      } = _ref5;
+                      } = _ref4;
                       return vue.createVNode(vue.Fragment, null, [props.multiple && !props.hideSelected ? vue.createVNode(VCheckboxBtn, {
                         "key": item.value,
                         "modelValue": isSelected,
@@ -16648,7 +16650,7 @@
       const abortController = new AbortController();
       vue.onUnmounted(() => abortController.abort());
       async function openEyeDropper() {
-        if (!SUPPORTS_EYE_DROPPER) return;
+        if (!SUPPORTS_EYE_DROPPER || props.disabled) return;
         const eyeDropper = new window.EyeDropper();
         try {
           const result = await eyeDropper.open({
@@ -16670,10 +16672,11 @@
         "class": "v-color-picker-preview__eye-dropper",
         "key": "eyeDropper"
       }, [vue.createVNode(VBtn, {
-        "onClick": openEyeDropper,
+        "density": "comfortable",
+        "disabled": props.disabled,
         "icon": "$eyeDropper",
         "variant": "plain",
-        "density": "comfortable"
+        "onClick": openEyeDropper
       }, null)]), vue.createVNode("div", {
         "class": "v-color-picker-preview__dot"
       }, [vue.createVNode("div", {
@@ -18701,6 +18704,10 @@
       type: String,
       default: '$vuetify.confirmEdit.ok'
     },
+    disabled: {
+      type: [Boolean, Array],
+      default: undefined
+    },
     hideActions: Boolean
   }, 'VConfirmEdit');
   const VConfirmEdit = genericComponent()({
@@ -18727,6 +18734,17 @@
       const isPristine = vue.computed(() => {
         return deepEqual(model.value, internalModel.value);
       });
+      function isActionDisabled(action) {
+        if (typeof props.disabled === 'boolean') {
+          return props.disabled;
+        }
+        if (Array.isArray(props.disabled)) {
+          return props.disabled.includes(action);
+        }
+        return isPristine.value;
+      }
+      const isSaveDisabled = vue.computed(() => isActionDisabled('save'));
+      const isCancelDisabled = vue.computed(() => isActionDisabled('cancel'));
       function save() {
         model.value = internalModel.value;
         emit('save', internalModel.value);
@@ -18737,13 +18755,13 @@
       }
       function actions(actionsProps) {
         return vue.createVNode(vue.Fragment, null, [vue.createVNode(VBtn, vue.mergeProps({
-          "disabled": isPristine.value,
+          "disabled": isCancelDisabled.value,
           "variant": "text",
           "color": props.color,
           "onClick": cancel,
           "text": t(props.cancelText)
         }, actionsProps), null), vue.createVNode(VBtn, vue.mergeProps({
-          "disabled": isPristine.value,
+          "disabled": isSaveDisabled.value,
           "variant": "text",
           "color": props.color,
           "onClick": save,
@@ -20829,22 +20847,37 @@
           "width": !mobile.value ? column.width : undefined
         }, cellProps, columnCellProps), {
           default: () => {
-            if (slots[slotName] && !mobile.value) return slots[slotName]?.(slotProps);
             if (column.key === 'data-table-select') {
-              return slots['item.data-table-select']?.(slotProps) ?? vue.createVNode(VCheckboxBtn, {
+              return slots['item.data-table-select']?.({
+                ...slotProps,
+                props: {
+                  disabled: !item.selectable,
+                  modelValue: isSelected([item]),
+                  onClick: vue.withModifiers(() => toggleSelect(item), ['stop'])
+                }
+              }) ?? vue.createVNode(VCheckboxBtn, {
                 "disabled": !item.selectable,
                 "modelValue": isSelected([item]),
                 "onClick": vue.withModifiers(event => toggleSelect(item, props.index, event), ['stop'])
               }, null);
             }
             if (column.key === 'data-table-expand') {
-              return slots['item.data-table-expand']?.(slotProps) ?? vue.createVNode(VBtn, {
+              return slots['item.data-table-expand']?.({
+                ...slotProps,
+                props: {
+                  icon: isExpanded(item) ? '$collapse' : '$expand',
+                  size: 'small',
+                  variant: 'text',
+                  onClick: vue.withModifiers(() => toggleExpand(item), ['stop'])
+                }
+              }) ?? vue.createVNode(VBtn, {
                 "icon": isExpanded(item) ? '$collapse' : '$expand',
                 "size": "small",
                 "variant": "text",
                 "onClick": vue.withModifiers(() => toggleExpand(item), ['stop'])
               }, null);
             }
+            if (slots[slotName] && !mobile.value) return slots[slotName](slotProps);
             const displayValue = vue.toDisplayString(slotProps.value);
             return !mobile.value ? displayValue : vue.createVNode(vue.Fragment, null, [vue.createVNode("div", {
               "class": "v-data-table__td-title"
@@ -22183,11 +22216,14 @@
       type: String,
       default: 'dynamic'
     },
-    firstDayOfWeek: [Number, String]
+    firstDayOfWeek: {
+      type: [Number, String],
+      default: 0
+    }
   }, 'calendar');
   function useCalendar(props) {
     const adapter = useDate();
-    const model = useProxiedModel(props, 'modelValue', [], v => wrapInArray(v));
+    const model = useProxiedModel(props, 'modelValue', [], v => wrapInArray(v).map(i => adapter.date(i)));
     const displayValue = vue.computed(() => {
       if (props.displayValue) return adapter.date(props.displayValue);
       if (model.value.length > 0) return adapter.date(model.value[0]);
@@ -22204,15 +22240,15 @@
       const date = adapter.setYear(adapter.startOfMonth(adapter.date()), adapter.getYear(year.value));
       return adapter.setMonth(date, value);
     }, v => adapter.getMonth(v));
-    const defaultFirstDayOfWeek = vue.computed(() => {
-      return props.firstDayOfWeek ?? props.weekdays[0];
-    });
     const weekDays = vue.computed(() => {
-      const firstDayOfWeek = Number(props.firstDayOfWeek ?? 0);
-      return props.weekdays.map(day => (day + firstDayOfWeek) % 7);
+      const firstDayOfWeek = Number(props.firstDayOfWeek);
+
+      // Always generate all days, regardless of props.weekdays
+      return [0, 1, 2, 3, 4, 5, 6].map(day => (day + firstDayOfWeek) % 7);
     });
     const weeksInMonth = vue.computed(() => {
-      const weeks = adapter.getWeekArray(month.value, defaultFirstDayOfWeek.value);
+      const firstDayOfWeek = Number(props.firstDayOfWeek);
+      const weeks = adapter.getWeekArray(month.value, firstDayOfWeek);
       const days = weeks.flat();
 
       // Make sure there's always 6 weeks in month (6 * 7 days)
@@ -22290,7 +22326,7 @@
       if (typeof props.allowedDates === 'function') {
         return !props.allowedDates(date);
       }
-      return false;
+      return !props.weekdays.includes(adapter.toJsDate(date).getDay());
     }
     return {
       displayValue,
@@ -22700,7 +22736,7 @@
       const {
         rtlClasses
       } = useRtl();
-      const model = useProxiedModel(props, 'modelValue', undefined, v => wrapInArray(v), v => props.multiple ? v : v[0]);
+      const model = useProxiedModel(props, 'modelValue', undefined, v => wrapInArray(v).map(i => adapter.date(i)), v => props.multiple ? v : v[0]);
       const viewMode = useProxiedModel(props, 'viewMode');
       // const inputMode = useProxiedModel(props, 'inputMode')
 
@@ -23025,7 +23061,9 @@
             VBtn: {
               class: 'v-empty-state__action-btn',
               color: props.color ?? 'surface-variant',
-              text: props.actionText
+              href: props.href,
+              text: props.actionText,
+              to: props.to
             }
           }
         }, {
@@ -29172,7 +29210,7 @@
       };
     });
   }
-  const version$1 = "3.8.0-beta.0";
+  const version$1 = "3.8.0";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -29197,7 +29235,7 @@
       ...options
     });
   };
-  const version = "3.8.0-beta.0";
+  const version = "3.8.0";
   createVuetify.version = version;
 
   exports.blueprints = index;