@vuetify/nightly 3.7.12-master.2025-02-14 → 3.7.12-master.2025-02-17

package/dist/vuetify-labs.js

@@ -1,5 +1,5 @@
 /*!
-* Vuetify v3.7.12-master.2025-02-14
+* Vuetify v3.7.12-master.2025-02-17
 * Forged by John Leider
 * Released under the MIT License.
 */
@@ -18834,15 +18834,19 @@
       })) ?? [];
       const item = newSortBy.find(x => x.key === column.key);
       if (!item) {
-        if (multiSort.value) newSortBy = [...newSortBy, {
-          key: column.key,
-          order: 'asc'
-        }];else newSortBy = [{
-          key: column.key,
-          order: 'asc'
-        }];
+        if (multiSort.value) {
+          newSortBy.push({
+            key: column.key,
+            order: 'asc'
+          });
+        } else {
+          newSortBy = [{
+            key: column.key,
+            order: 'asc'
+          }];
+        }
       } else if (item.order === 'desc') {
-        if (mustSort.value) {
+        if (mustSort.value && newSortBy.length === 1) {
           item.order = 'asc';
         } else {
           newSortBy = newSortBy.filter(x => x.key !== column.key);
@@ -21467,7 +21471,7 @@
     },
     disabled: {
       type: [Boolean, String, Array],
-      default: false
+      default: null
     },
     nextIcon: {
       type: IconValue,
@@ -21649,7 +21653,10 @@
   // Composables
   const makeCalendarProps = propsFactory({
     allowedDates: [Array, Function],
-    disabled: Boolean,
+    disabled: {
+      type: Boolean,
+      default: null
+    },
     displayValue: null,
     modelValue: Array,
     month: [Number, String],
@@ -28675,7 +28682,11 @@
       type: Number,
       default: 1
     },
-    ...omit(makeVTextFieldProps({}), ['appendInnerIcon', 'modelValue', 'prependInnerIcon'])
+    precision: {
+      type: Number,
+      default: 0
+    },
+    ...omit(makeVTextFieldProps({}), ['modelValue'])
   }, 'VNumberInput');
   const VNumberInput = genericComponent()({
     name: 'VNumberInput',
@@ -28689,27 +28700,37 @@
       let {
         slots
       } = _ref;
-      const _model = useProxiedModel(props, 'modelValue');
-      const model = vue.computed({
-        get: () => _model.value,
-        // model.value could be empty string from VTextField
-        // but _model.value should be eventually kept in type Number | null
+      const vTextFieldRef = vue.ref();
+      const form = useForm(props);
+      const controlsDisabled = vue.computed(() => form.isDisabled.value || form.isReadonly.value);
+      const isFocused = vue.ref(false);
+      function correctPrecision(val) {
+        let precision = arguments.length > 1 && arguments[1] !== undefined ? arguments[1] : props.precision;
+        const fixed = precision == null ? String(val) : val.toFixed(precision);
+        return isFocused.value ? Number(fixed).toString() // trim zeros
+        : fixed;
+      }
+      const model = useProxiedModel(props, 'modelValue', null, val => val ?? null, val => val == null ? val ?? null : clamp(+val, props.min, props.max));
+      const _inputText = vue.shallowRef(null);
+      vue.watchEffect(() => {
+        if (isFocused.value && !controlsDisabled.value) ; else if (model.value == null || controlsDisabled.value) {
+          _inputText.value = model.value && !isNaN(model.value) ? String(model.value) : null;
+        } else if (!isNaN(model.value)) {
+          _inputText.value = correctPrecision(model.value);
+        }
+      });
+      const inputText = vue.computed({
+        get: () => _inputText.value,
         set(val) {
           if (val === null || val === '') {
-            _model.value = null;
-            return;
-          }
-          const value = Number(val);
-          if (!isNaN(value) && value <= props.max && value >= props.min) {
-            _model.value = value;
+            model.value = null;
+            _inputText.value = null;
+          } else if (!isNaN(+val) && +val <= props.max && +val >= props.min) {
+            model.value = +val;
+            _inputText.value = val;
           }
         }
       });
-      const vTextFieldRef = vue.ref();
-      const stepDecimals = vue.computed(() => getDecimals(props.step));
-      const modelDecimals = vue.computed(() => typeof model.value === 'number' ? getDecimals(model.value) : 0);
-      const form = useForm(props);
-      const controlsDisabled = vue.computed(() => form.isDisabled.value || form.isReadonly.value);
       const canIncrease = vue.computed(() => {
         if (controlsDisabled.value) return false;
         return (model.value ?? 0) + props.step <= props.max;
@@ -28731,23 +28752,29 @@
       const decrementSlotProps = vue.computed(() => ({
         click: onClickDown
       }));
+      vue.watch(() => props.precision, () => formatInputValue());
       vue.onMounted(() => {
-        if (!controlsDisabled.value) {
-          clampModel();
-        }
+        clampModel();
       });
+      function inferPrecision(value) {
+        if (value == null) return 0;
+        const str = value.toString();
+        const idx = str.indexOf('.');
+        return ~idx ? str.length - idx : 0;
+      }
       function toggleUpDown() {
         let increment = arguments.length > 0 && arguments[0] !== undefined ? arguments[0] : true;
         if (controlsDisabled.value) return;
         if (model.value == null) {
-          model.value = clamp(0, props.min, props.max);
+          inputText.value = correctPrecision(clamp(0, props.min, props.max));
           return;
         }
-        const decimals = Math.max(modelDecimals.value, stepDecimals.value);
+        let inferredPrecision = Math.max(inferPrecision(model.value), inferPrecision(props.step));
+        if (props.precision != null) inferredPrecision = Math.max(inferredPrecision, props.precision);
         if (increment) {
-          if (canIncrease.value) model.value = +(model.value + props.step).toFixed(decimals);
+          if (canIncrease.value) inputText.value = correctPrecision(model.value + props.step, inferredPrecision);
         } else {
-          if (canDecrease.value) model.value = +(model.value - props.step).toFixed(decimals);
+          if (canDecrease.value) inputText.value = correctPrecision(model.value - props.step, inferredPrecision);
         }
       }
       function onClickUp(e) {
@@ -28770,6 +28797,16 @@
         if (!/^-?(\d+(\.\d*)?|(\.\d+)|\d*|\.)$/.test(potentialNewInputVal)) {
           e.preventDefault();
         }
+        if (props.precision == null) return;
+
+        // Ignore decimal digits above precision limit
+        if (potentialNewInputVal.split('.')[1]?.length > props.precision) {
+          e.preventDefault();
+        }
+        // Ignore decimal separator when precision = 0
+        if (props.precision === 0 && potentialNewInputVal.includes('.')) {
+          e.preventDefault();
+        }
       }
       async function onKeydown(e) {
         if (['Enter', 'ArrowLeft', 'ArrowRight', 'Backspace', 'Delete', 'Tab'].includes(e.key) || e.ctrlKey) return;
@@ -28789,14 +28826,39 @@
         e.stopPropagation();
       }
       function clampModel() {
+        if (controlsDisabled.value) return;
         if (!vTextFieldRef.value) return;
-        const inputText = vTextFieldRef.value.value;
-        if (inputText && !isNaN(+inputText)) {
-          model.value = clamp(+inputText, props.min, props.max);
+        const actualText = vTextFieldRef.value.value;
+        if (actualText && !isNaN(+actualText)) {
+          inputText.value = correctPrecision(clamp(+actualText, props.min, props.max));
         } else {
-          model.value = null;
+          inputText.value = null;
         }
       }
+      function formatInputValue() {
+        if (controlsDisabled.value) return;
+        if (model.value === null || isNaN(model.value)) {
+          inputText.value = null;
+          return;
+        }
+        inputText.value = props.precision == null ? String(model.value) : model.value.toFixed(props.precision);
+      }
+      function trimDecimalZeros() {
+        if (controlsDisabled.value) return;
+        if (model.value === null || isNaN(model.value)) {
+          inputText.value = null;
+          return;
+        }
+        inputText.value = model.value.toString();
+      }
+      function onFocus() {
+        isFocused.value = true;
+        trimDecimalZeros();
+      }
+      function onBlur() {
+        isFocused.value = false;
+        clampModel();
+      }
       useRender(() => {
         const {
           modelValue: _,
@@ -28874,20 +28936,21 @@
           "class": "v-number-input__control"
         }, [vue.createVNode(VDivider, {
           "vertical": true
-        }, null), incrementControlNode()]) : props.reverse ? undefined : vue.createVNode(vue.Fragment, null, [dividerNode(), controlNode()]);
+        }, null), incrementControlNode()]) : props.reverse || controlVariant.value === 'hidden' ? undefined : vue.createVNode(vue.Fragment, null, [dividerNode(), controlNode()]);
         const hasAppendInner = slots['append-inner'] || appendInnerControl;
         const prependInnerControl = controlVariant.value === 'split' ? vue.createVNode("div", {
           "class": "v-number-input__control"
         }, [decrementControlNode(), vue.createVNode(VDivider, {
           "vertical": true
-        }, null)]) : props.reverse ? vue.createVNode(vue.Fragment, null, [controlNode(), dividerNode()]) : undefined;
+        }, null)]) : props.reverse && controlVariant.value !== 'hidden' ? vue.createVNode(vue.Fragment, null, [controlNode(), dividerNode()]) : undefined;
         const hasPrependInner = slots['prepend-inner'] || prependInnerControl;
         return vue.createVNode(VTextField, vue.mergeProps({
           "ref": vTextFieldRef,
-          "modelValue": model.value,
-          "onUpdate:modelValue": $event => model.value = $event,
+          "modelValue": inputText.value,
+          "onUpdate:modelValue": $event => inputText.value = $event,
           "onBeforeinput": onBeforeinput,
-          "onChange": clampModel,
+          "onFocus": onFocus,
+          "onBlur": onBlur,
           "onKeydown": onKeydown,
           "class": ['v-number-input', {
             'v-number-input--default': controlVariant.value === 'default',
@@ -30907,7 +30970,7 @@
       goTo
     };
   }
-  const version$1 = "3.7.12-master.2025-02-14";
+  const version$1 = "3.7.12-master.2025-02-17";
   createVuetify$1.version = version$1;
 
   // Vue's inject() can only be used in setup
@@ -31160,7 +31223,7 @@
 
   /* eslint-disable local-rules/sort-imports */
 
-  const version = "3.7.12-master.2025-02-14";
+  const version = "3.7.12-master.2025-02-17";
 
   /* eslint-disable local-rules/sort-imports */