@vuetify/nightly 3.7.18-master.2025-03-24 → 3.7.19-master.2025-03-26

package/dist/vuetify-labs.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.7.18-master.2025-03-24
+* Vuetify v3.7.19-master.2025-03-26
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -13269,12 +13269,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;
         }
       });
@@ -13361,12 +13356,12 @@
                 "renderless": true,
                 "items": displayItems.value
               }, {
-                default: _ref4 => {
+                default: _ref3 => {
                   let {
                     item,
                     index,
                     itemRef
-                  } = _ref4;
+                  } = _ref3;
                   const itemProps = vue.mergeProps(item.props, {
                     ref: itemRef,
                     key: item.value,
@@ -13380,10 +13375,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,
@@ -28256,11 +28251,13 @@
   // Types
 
   const makeVDateInputProps = propsFactory({
+    displayFormat: [Function, String],
     hideActions: Boolean,
     location: {
       type: String,
       default: 'bottom start'
     },
+    ...makeDisplayProps(),
     ...makeFocusProps(),
     ...makeVConfirmEditProps(),
     ...makeVTextFieldProps({
@@ -28276,16 +28273,22 @@
     name: 'VDateInput',
     props: makeVDateInputProps(),
     emits: {
+      save: value => true,
+      cancel: () => true,
       'update:modelValue': val => true
     },
     setup(props, _ref) {
       let {
+        emit,
         slots
       } = _ref;
       const {
         t
       } = useLocale();
       const adapter = useDate();
+      const {
+        mobile
+      } = useDisplay(props);
       const {
         isFocused,
         focus,
@@ -28293,7 +28296,14 @@
       } = useFocus(props);
       const model = useProxiedModel(props, 'modelValue', props.multiple ? [] : null, val => Array.isArray(val) ? val.map(item => adapter.toJsDate(item)) : val ? adapter.toJsDate(val) : val, val => Array.isArray(val) ? val.map(item => adapter.date(item)) : val ? adapter.date(val) : val);
       const menu = vue.shallowRef(false);
+      const isEditingInput = vue.shallowRef(false);
       const vDateInputRef = vue.ref();
+      function format(date) {
+        if (typeof props.displayFormat === 'function') {
+          return props.displayFormat(date);
+        }
+        return adapter.format(date, props.displayFormat ?? 'keyboardDate');
+      }
       const display = vue.computed(() => {
         const value = wrapInArray(model.value);
         if (!value.length) return null;
@@ -28303,11 +28313,22 @@
         if (props.multiple === 'range') {
           const start = value[0];
           const end = value[value.length - 1];
-          return adapter.isValid(start) && adapter.isValid(end) ? `${adapter.format(adapter.date(start), 'keyboardDate')} - ${adapter.format(adapter.date(end), 'keyboardDate')}` : '';
+          if (!adapter.isValid(start) || !adapter.isValid(end)) return '';
+          return `${format(adapter.date(start))} - ${format(adapter.date(end))}`;
         }
-        return adapter.isValid(model.value) ? adapter.format(adapter.date(model.value), 'keyboardDate') : '';
+        return adapter.isValid(model.value) ? format(adapter.date(model.value)) : '';
+      });
+      const inputmode = vue.computed(() => {
+        if (!mobile.value) return undefined;
+        if (isEditingInput.value) return 'text';
+        return 'none';
       });
       const isInteractive = vue.computed(() => !props.disabled && !props.readonly);
+      const isReadonly = vue.computed(() => !(mobile.value && isEditingInput.value) && props.readonly);
+      vue.watch(menu, val => {
+        if (val) return;
+        isEditingInput.value = false;
+      });
       function onKeydown(e) {
         if (e.key !== 'Enter') return;
         if (!menu.value || !isFocused.value) {
@@ -28315,20 +28336,39 @@
           return;
         }
         const target = e.target;
-        model.value = target.value === '' ? null : target.value;
+        model.value = adapter.isValid(target.value) ? target.value : null;
       }
       function onClick(e) {
         e.preventDefault();
         e.stopPropagation();
-        menu.value = true;
+        if (menu.value && mobile.value) {
+          isEditingInput.value = true;
+        } else {
+          menu.value = true;
+        }
+      }
+      function onCancel() {
+        emit('cancel');
+        menu.value = false;
+        isEditingInput.value = false;
       }
-      function onSave() {
+      function onSave(value) {
+        emit('save', value);
         menu.value = false;
       }
-      function onUpdateModel(value) {
+      function onUpdateDisplayModel(value) {
         if (value != null) return;
         model.value = null;
       }
+      function onBlur() {
+        blur();
+
+        // When in mobile mode and editing is done (due to keyboard dismissal), close the menu
+        if (mobile.value && isEditingInput.value && !isFocused.value) {
+          menu.value = false;
+          isEditingInput.value = false;
+        }
+      }
       useRender(() => {
         const confirmEditProps = VConfirmEdit.filterProps(props);
         const datePickerProps = VDatePicker.filterProps(omit(props, ['active', 'location', 'rounded']));
@@ -28339,13 +28379,15 @@
           "class": props.class,
           "style": props.style,
           "modelValue": display.value,
+          "inputmode": inputmode.value,
+          "readonly": isReadonly.value,
           "onKeydown": isInteractive.value ? onKeydown : undefined,
           "focused": menu.value || isFocused.value,
           "onFocus": focus,
-          "onBlur": blur,
+          "onBlur": onBlur,
           "onClick:control": isInteractive.value ? onClick : undefined,
           "onClick:prepend": isInteractive.value ? onClick : undefined,
-          "onUpdate:modelValue": onUpdateModel
+          "onUpdate:modelValue": onUpdateDisplayModel
         }), {
           ...slots,
           default: () => vue.createVNode(vue.Fragment, null, [vue.createVNode(VMenu, {
@@ -28362,7 +28404,7 @@
               "modelValue": model.value,
               "onUpdate:modelValue": $event => model.value = $event,
               "onSave": onSave,
-              "onCancel": () => menu.value = false
+              "onCancel": onCancel
             }), {
               default: _ref2 => {
                 let {
@@ -28372,16 +28414,21 @@
                   cancel,
                   isPristine
                 } = _ref2;
+                function onUpdateModel(value) {
+                  if (!props.hideActions) {
+                    proxyModel.value = value;
+                  } else {
+                    model.value = value;
+                    if (!props.multiple) {
+                      menu.value = false;
+                    }
+                  }
+                  emit('save', value);
+                  vDateInputRef.value?.blur();
+                }
                 return vue.createVNode(VDatePicker, vue.mergeProps(datePickerProps, {
                   "modelValue": props.hideActions ? model.value : proxyModel.value,
-                  "onUpdate:modelValue": val => {
-                    if (!props.hideActions) {
-                      proxyModel.value = val;
-                    } else {
-                      model.value = val;
-                      if (!props.multiple) menu.value = false;
-                    }
-                  },
+                  "onUpdate:modelValue": value => onUpdateModel(value),
                   "onMousedown": e => e.preventDefault()
                 }), {
                   actions: !props.hideActions ? () => slots.actions?.({
@@ -31099,7 +31146,7 @@
       goTo
     };
   }
-  const version$1 = "3.7.18-master.2025-03-24";
+  const version$1 = "3.7.19-master.2025-03-26";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -31352,7 +31399,7 @@
 
   /* eslint-disable local-rules/sort-imports */
 
-  const version = "3.7.18-master.2025-03-24";
+  const version = "3.7.19-master.2025-03-26";
 
   /* eslint-disable local-rules/sort-imports */