@vuetify/nightly 3.9.5-dev.2025-08-23 → 3.9.5-dev.2025-08-24

package/dist/vuetify-labs.cjs

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.9.5-dev.2025-08-23
+* Vuetify v3.9.5-dev.2025-08-24
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -13747,6 +13747,7 @@
     const keys = options?.filterKeys ? wrapInArray(options.filterKeys) : false;
     const customFiltersLength = Object.keys(options?.customKeyFilter ?? {}).length;
     if (!items?.length) return array;
+    let lookAheadItem = null;
     loop: for (let i = 0; i < items.length; i++) {
       const [item, transformed = item] = wrapInArray(items[i]);
       const customMatches = {};
@@ -13755,6 +13756,14 @@
       if ((query || customFiltersLength > 0) && !options?.noFilter) {
         if (typeof item === 'object') {
           if (item.type === 'divider' || item.type === 'subheader') {
+            if (lookAheadItem?.type === 'divider' && item.type === 'subheader') {
+              array.push(lookAheadItem); // divider before subheader
+            }
+            lookAheadItem = {
+              index: i,
+              matches: {},
+              type: item.type
+            };
             continue;
           }
           const filterKeys = keys || Object.keys(transformed);
@@ -13780,6 +13789,10 @@
         if (options?.filterMode === 'union' && customMatchesLength !== customFiltersLength && !defaultMatchesLength) continue;
         if (options?.filterMode === 'intersection' && (customMatchesLength !== customFiltersLength || !defaultMatchesLength)) continue;
       }
+      if (lookAheadItem) {
+        array.push(lookAheadItem);
+        lookAheadItem = null;
+      }
       array.push({
         index: i,
         matches: {
@@ -33016,59 +33029,140 @@
         emit
       } = _ref;
       const vTextFieldRef = vue.ref();
-      const selection = vue.shallowRef(0);
-      const lazySelection = vue.shallowRef(0);
+      const inputAction = vue.shallowRef();
+      const caretPosition = vue.shallowRef(0);
       const mask = useMask(props);
       const returnMaskedValue = vue.computed(() => props.mask && props.returnMaskedValue);
       const model = useProxiedModel(props, 'modelValue', undefined,
       // Always display masked value in input when mask is applied
       val => props.mask ? mask.mask(mask.unmask(val)) : val, val => {
         if (props.mask) {
-          const valueBeforeChange = mask.unmask(model.value);
+          const valueWithoutDelimiters = removeMaskDelimiters(val);
+
           // E.g. mask is #-# and the input value is '2-23'
           // model-value should be enforced to '2-2'
-          const enforcedMaskedValue = mask.mask(mask.unmask(val));
-          const newUnmaskedValue = mask.unmask(enforcedMaskedValue);
-          if (newUnmaskedValue === valueBeforeChange) {
-            vTextFieldRef.value.value = enforcedMaskedValue;
-          }
-          val = newUnmaskedValue;
-          updateRange();
-          return returnMaskedValue.value ? mask.mask(val) : val;
+          const newMaskedValue = mask.mask(valueWithoutDelimiters);
+          const newUnmaskedValue = mask.unmask(newMaskedValue);
+          const newCaretPosition = getNewCaretPosition({
+            oldValue: model.value,
+            newValue: newMaskedValue,
+            oldCaret: caretPosition.value
+          });
+          vTextFieldRef.value.value = newMaskedValue;
+          vTextFieldRef.value.setSelectionRange(newCaretPosition, newCaretPosition);
+          return returnMaskedValue.value ? mask.mask(newUnmaskedValue) : newUnmaskedValue;
         }
         return val;
       });
       const validationValue = vue.toRef(() => returnMaskedValue.value ? model.value : mask.unmask(model.value));
+      function removeMaskDelimiters(val) {
+        return val.split('').filter(ch => !isMaskDelimiter(ch)).join('');
+      }
+      function getNewCaretPosition(_ref2) {
+        let {
+          oldValue,
+          newValue,
+          oldCaret
+        } = _ref2;
+        if (!newValue) return 0;
+        if (!oldValue) return newValue.length;
+        let newCaret;
+        if (inputAction.value === 'Backspace') {
+          newCaret = oldCaret - 1;
+          while (newCaret > 0 && isMaskDelimiter(newValue[newCaret - 1])) newCaret--;
+        } else if (inputAction.value === 'Delete') {
+          newCaret = oldCaret;
+        } else {
+          // insertion
+          newCaret = oldCaret + 1;
+          while (isMaskDelimiter(newValue[newCaret])) newCaret++;
+          if (isMaskDelimiter(newValue[oldCaret])) newCaret++;
+        }
+        return newCaret;
+      }
       vue.onBeforeMount(() => {
         if (props.returnMaskedValue) {
           emit('update:modelValue', model.value);
         }
       });
-      function setCaretPosition(newSelection) {
-        selection.value = newSelection;
-        vTextFieldRef.value && vTextFieldRef.value.setSelectionRange(selection.value, selection.value);
+      function onKeyDown(e) {
+        if (e.metaKey) return;
+        const inputElement = e.target;
+        caretPosition.value = inputElement.selectionStart || 0;
+        inputAction.value = e.key;
+        const hasSelection = inputElement.selectionStart !== inputElement.selectionEnd;
+        if (e.key === 'Backspace' && hasSelection) {
+          e.preventDefault();
+          deleteSelection(e);
+        }
+      }
+      async function onCut(e) {
+        e.preventDefault();
+        copySelectionToClipboard(e);
+        deleteSelection(e);
       }
-      function resetSelections() {
-        if (!vTextFieldRef.value?.selectionEnd) return;
-        selection.value = vTextFieldRef.value.selectionEnd;
-        lazySelection.value = 0;
-        for (let index = 0; index < selection.value; index++) {
-          isMaskDelimiter(vTextFieldRef.value.value[index]) || lazySelection.value++;
+      async function onPaste(e) {
+        e.preventDefault();
+        const inputElement = e.target;
+        const pastedString = removeMaskDelimiters(e.clipboardData?.getData('text') || '');
+        if (!pastedString) return;
+        const pastedCharacters = [...pastedString];
+        const hasSelection = inputElement.selectionStart !== inputElement.selectionEnd;
+        if (hasSelection) {
+          replaceSelection(inputElement, pastedCharacters);
+        } else {
+          insertCharacters(inputElement, pastedCharacters);
         }
       }
-      function updateRange() {
-        if (!vTextFieldRef.value) return;
-        resetSelections();
-        let selection = 0;
-        const newValue = vTextFieldRef.value.value;
-        if (newValue) {
-          for (let index = 0; index < newValue.length; index++) {
-            if (lazySelection.value <= 0) break;
-            isMaskDelimiter(newValue[index]) || lazySelection.value--;
-            selection++;
-          }
+      function copySelectionToClipboard(e) {
+        const inputElement = e.target;
+        const start = inputElement.selectionStart || 0;
+        const end = inputElement.selectionEnd || 0;
+        const selectedText = inputElement.value.substring(start, end);
+        navigator.clipboard.writeText(selectedText);
+      }
+      async function deleteSelection(e) {
+        const inputElement = e.target;
+        const curStart = inputElement.selectionStart || 0;
+        caretPosition.value = inputElement.selectionEnd || 0;
+        while (caretPosition.value > curStart) {
+          const success = await simulateBackspace(inputElement);
+          if (!success) break;
+        }
+      }
+      async function simulateBackspace(inputElement) {
+        inputAction.value = 'Backspace';
+        model.value = inputElement.value.slice(0, caretPosition.value - 1) + inputElement.value.slice(caretPosition.value);
+        inputAction.value = '';
+        if (caretPosition.value === inputElement.selectionEnd) return false;
+        caretPosition.value = inputElement.selectionEnd || 0;
+        await vue.nextTick();
+        return true;
+      }
+      async function insertCharacters(inputElement, pastedCharacters) {
+        for (let i = 0; i < pastedCharacters.length; i++) {
+          await insertCharacter(inputElement, pastedCharacters[i]);
         }
-        setCaretPosition(selection);
+      }
+      async function insertCharacter(inputElement, character) {
+        caretPosition.value = inputElement.selectionEnd || 0;
+        model.value = inputElement.value.slice(0, caretPosition.value) + character + inputElement.value.slice(caretPosition.value);
+        await vue.nextTick();
+      }
+      async function replaceSelection(inputElement, pastedCharacters) {
+        caretPosition.value = inputElement.selectionStart || 0;
+        for (let i = 0; i < pastedCharacters.length; i++) {
+          await replaceCharacter(caretPosition.value, pastedCharacters[i]);
+          caretPosition.value++;
+        }
+      }
+      async function replaceCharacter(index, character) {
+        let targetIndex = index;
+
+        // Find next non-delimiter position
+        while (targetIndex < model.value.length && isMaskDelimiter(model.value[targetIndex])) targetIndex++;
+        model.value = model.value.slice(0, targetIndex) + character + model.value.slice(targetIndex + 1);
+        await vue.nextTick();
       }
       useRender(() => {
         const textFieldProps = VTextField.filterProps(props);
@@ -33076,7 +33170,10 @@
           "modelValue": model.value,
           "onUpdate:modelValue": $event => model.value = $event,
           "ref": vTextFieldRef,
-          "validationValue": validationValue.value
+          "validationValue": validationValue.value,
+          "onCut": onCut,
+          "onPaste": onPaste,
+          "onKeydown": onKeyDown
         }), {
           ...slots
         });
@@ -35702,7 +35799,7 @@
       };
     });
   }
-  const version$1 = "3.9.5-dev.2025-08-23";
+  const version$1 = "3.9.5-dev.2025-08-24";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -36000,7 +36097,7 @@
 
   /* eslint-disable local-rules/sort-imports */
 
-  const version = "3.9.5-dev.2025-08-23";
+  const version = "3.9.5-dev.2025-08-24";
 
   /* eslint-disable local-rules/sort-imports */