lew-ui 2.7.21 → 2.7.24

package/dist/index.js

@@ -6192,10 +6192,8 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
     }));
     const totalColumnWidth = computed(() => {
       let width = sumBy(processedColumns.value, "width");
-      if (props2.checkable)
-        width += getCheckableWidth.value;
-      if (props2.sortable)
-        width += getDragColumnWidth.value;
+      if (props2.checkable) width += getCheckableWidth.value;
+      if (props2.sortable) width += getDragColumnWidth.value;
       return width;
     });
     const fixedWidths = computed(() => {
@@ -6236,8 +6234,7 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
     });
     const columnLevel = computed(() => {
       const findMaxDepth = (columns, currentDepth = 1) => {
-        if (!columns || columns.length === 0)
-          return currentDepth;
+        if (!columns || columns.length === 0) return currentDepth;
         let maxDepth = currentDepth;
         for (const col of columns) {
           if (col.children && col.children.length > 0) {
@@ -6425,8 +6422,8 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
                         column?.title,
                         column.sortable && h(SortIcon, {
                           "sort-value": sortValue.value[column.field],
-                          "size": props2.size,
-                          "class": "lew-table-sorter"
+                          size: props2.size,
+                          class: "lew-table-sorter"
                         })
                       ]
                     }
@@ -6470,8 +6467,7 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
       }
     }
     function updateScrollState() {
-      if (!tableRef.value)
-        return;
+      if (!tableRef.value) return;
       const element = tableRef.value;
       const { clientWidth, scrollWidth, scrollLeft } = element;
       if (scrollWidth === clientWidth) {
@@ -6489,12 +6485,10 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
       state.hiddenScrollLine = "";
     }
     function computeTableRowHeight() {
-      console.log("🚀 Starting height computation...");
       nextTick(() => {
         const newTrHeightMap = {};
         const newTrPositionsMap = {};
         const allRowIds = state.dataSource.map((row) => row._lew_table_tr_id);
-        console.log(`Found ${allRowIds.length} rows to process`);
         allRowIds.forEach((rowId) => {
           let maxHeight = 0;
           let mainHeight = 0;
@@ -6518,22 +6512,6 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
             rightHeight = rightRect.height;
             maxHeight = Math.max(maxHeight, rightHeight);
           }
-          console.log(
-            `Row ${rowId}: main=${mainHeight}, left=${leftHeight}, right=${rightHeight}, max=${maxHeight}`
-          );
-          console.log(
-            `Elements found: main=${!!mainElement}, left=${!!leftElement}, right=${!!rightElement}`
-          );
-          if (mainElement) {
-            console.log(
-              `Main element current style.height: ${mainElement.style.height}, computed height: ${getComputedStyle(mainElement).height}`
-            );
-          }
-          if (rightElement) {
-            console.log(
-              `Right element current style.height: ${rightElement.style.height}, computed height: ${getComputedStyle(rightElement).height}`
-            );
-          }
           if (maxHeight > 0) {
             newTrHeightMap[rowId] = maxHeight;
             const referenceElement = mainElement || leftElement || rightElement;
@@ -6550,16 +6528,11 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
         });
         state.trHeightMap = newTrHeightMap;
         state.trPositionsMap = newTrPositionsMap;
-        console.log("✅ Height computation completed, updated state:", newTrHeightMap);
-        nextTick(() => {
-          console.log("🔄 Forcing re-render after height update");
-        });
       });
     }
     const handleTableResize = throttle(() => {
       const table = tableRef.value;
-      if (!table)
-        return;
+      if (!table) return;
       const newScrollClientWidth = table.clientWidth;
       const newIsScroll = table.scrollWidth > table.clientWidth + 5;
       if (state.scrollClientWidth !== newScrollClientWidth) {
@@ -6613,8 +6586,7 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
     }
     const throttledTooltipUpdate = throttle(updateTooltipPosition, TOOLTIP_THROTTLE_DELAY);
     function dragStart(event, row, index2) {
-      if (!props2.sortable)
-        return;
+      if (!props2.sortable) return;
       initDragState();
       computeTableRowHeight();
       state.dragIndex = index2;
@@ -6699,8 +6671,7 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
     }
     function updateDragTarget(mouseY) {
       state.lastMouseY = mouseY;
-      if (!state.dragRowId || Object.keys(state.trPositionsMap).length === 0)
-        return;
+      if (!state.dragRowId || Object.keys(state.trPositionsMap).length === 0) return;
       const dragDistance = Math.abs(state.initialDragY - mouseY);
       const minDragDistance = 5;
       if (dragDistance < minDragDistance) {
@@ -6714,8 +6685,7 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
       }));
       positionEntries.sort((a, b) => a.top - b.top);
       for (const entry of positionEntries) {
-        if (entry.id === state.dragRowId)
-          continue;
+        if (entry.id === state.dragRowId) continue;
         const position = entry;
         if (mouseY >= position.top && mouseY <= position.bottom) {
           targetRowId = position.id;
@@ -6725,10 +6695,8 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
       }
       if (!targetRowId) {
         for (let i = 0; i < positionEntries.length - 1; i++) {
-          if (positionEntries[i].id === state.dragRowId)
-            continue;
-          if (positionEntries[i + 1].id === state.dragRowId)
-            continue;
+          if (positionEntries[i].id === state.dragRowId) continue;
+          if (positionEntries[i + 1].id === state.dragRowId) continue;
           if (mouseY > positionEntries[i].bottom && mouseY < positionEntries[i + 1].top) {
             if (mouseY - positionEntries[i].bottom < positionEntries[i + 1].top - mouseY) {
               targetRowId = positionEntries[i].id;
@@ -6763,8 +6731,7 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
     `;
       }
       const targetPosition = state.trPositionsMap[state.targetRowId];
-      if (!targetPosition)
-        return "display: none;";
+      if (!targetPosition) return "display: none;";
       const top2 = state.isAboveTarget ? targetPosition.top : targetPosition.bottom;
       const tableRect = tableRef.value?.getBoundingClientRect();
       const offsetTop = tableRect ? top2 - tableRect.top : 0;
@@ -6783,13 +6750,9 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
       });
     }
     function getRowHeight(row) {
-      if (!row || !row._lew_table_tr_id)
-        return "auto";
+      if (!row || !row._lew_table_tr_id) return "auto";
       const height = state.trHeightMap[row._lew_table_tr_id];
       const result = height ? `${height}px` : "auto";
-      if (height) {
-        console.log(`getRowHeight for ${row._lew_table_tr_id}: ${result}`);
-      }
       return result;
     }
     function setTrRef(el, row) {
@@ -6813,18 +6776,6 @@ const _sfc_main$10 = /* @__PURE__ */ defineComponent({
         state.isInitialized = false;
         handleTableResize();
       });
-      if (props2.checkable && !props2.rowKey) {
-        console.warn(
-          '[LewTable] Invalid rowKey: "undefined". Expected: string when checkable is enabled'
-        );
-      }
-      if (props2.columns.some(
-        (col) => !col.width && (!col.children || col.children.length === 0)
-      )) {
-        console.warn(
-          '[LewTable] Invalid column width: "undefined". Expected: number for every column'
-        );
-      }
     });
     onUnmounted(() => {
       if (tooltipAnimationFrame) {
@@ -11895,13 +11846,13 @@ const _sfc_main$U = /* @__PURE__ */ defineComponent({
         },
         onClickOutside() {
           if (props2.clickOutsideToHide) {
-            instance.hide();
+            instance?.hide();
           }
         }
       });
       instance?.popper.children[0].setAttribute("data-lew", "popover");
       if (disabled && instance) {
-        instance.disable();
+        instance?.disable();
       }
     }
     onActivated(() => {
@@ -22830,7 +22781,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
   setup(__props2, { expose: __expose2, emit: __emit2 }) {
     const props2 = __props2;
     const emit2 = __emit2;
-    const selectValue = useModel(__props2, "modelValue");
+    const modelValue2 = useModel(__props2, "modelValue");
     const slots = useSlots();
     const lewSelectRef = ref();
     const lewPopoverRef = ref();
@@ -22905,52 +22856,52 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
       state.loading = false;
     }
     function clearHandle() {
-      selectValue.value = [];
+      modelValue2.value = [];
       emit2("clear");
       setTimeout(() => {
         lewPopoverRef.value && lewPopoverRef.value.refresh();
       }, 100);
-      emit2("change", selectValue.value);
+      emit2("change", modelValue2.value);
       state.visible = false;
       emit2("blur");
     }
     function deleteTag({ value }) {
-      const valueIndex = selectValue.value.findIndex((_value) => value === _value);
+      const valueIndex = modelValue2.value.findIndex((_value) => value === _value);
       if (valueIndex > -1) {
-        const item = selectValue.value[valueIndex];
-        selectValue.value.splice(valueIndex, 1);
-        emit2("delete", cloneDeep(selectValue.value), item);
-        if (selectValue.value.length === 0) {
+        const item = modelValue2.value[valueIndex];
+        modelValue2.value.splice(valueIndex, 1);
+        emit2("delete", cloneDeep(modelValue2.value), item);
+        if (modelValue2.value.length === 0) {
           lewPopoverValueRef.value && lewPopoverValueRef.value.hide();
         }
         setTimeout(() => {
           lewPopoverRef.value && lewPopoverRef.value.refresh();
         }, 100);
-        emit2("change", selectValue.value);
+        emit2("change", modelValue2.value);
       }
     }
     function selectHandle(item) {
       if (item.disabled || item.isGroup) {
         return;
       }
-      const _value = selectValue.value || [];
+      const _value = modelValue2.value || [];
       const index2 = _value.findIndex((e) => e === item.value);
       if (index2 >= 0) {
         _value.splice(index2, 1);
       } else {
         _value.push(item.value);
       }
-      selectValue.value = _value;
+      modelValue2.value = _value;
       emit2("select", _value);
       setTimeout(() => {
         lewPopoverRef.value && lewPopoverRef.value.refresh();
       }, 100);
-      emit2("change", selectValue.value);
+      emit2("change", modelValue2.value);
       getSelectWidth();
     }
     const getChecked = computed(() => (value) => {
-      if (selectValue.value) {
-        return JSON.parse(JSON.stringify(selectValue.value.includes(value)));
+      if (modelValue2.value) {
+        return JSON.parse(JSON.stringify(modelValue2.value.includes(value)));
       }
       return false;
     });
@@ -22962,7 +22913,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
         };
       });
       if (state.options.length > 0) {
-        const selectedRows = selectValue.value && selectValue.value.map((v) => {
+        const selectedRows = modelValue2.value && modelValue2.value.map((v) => {
           return state.options.find((e) => v === e.value);
         });
         if (!selectedRows || selectedRows.length === 0) {
@@ -22978,7 +22929,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
     });
     const getSelectClassName = computed(() => {
       let { clearable, size, disabled, readonly } = props2;
-      clearable = clearable ? !!selectValue.value : false;
+      clearable = clearable ? !!modelValue2.value : false;
       const focus = state.visible;
       return object2class("lew-select", {
         clearable,
@@ -23018,7 +22969,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
       if (state.options && state.options.length === 0 && props2.searchable) {
         search({ target: { value: "" } });
       }
-      const indexes = (selectValue.value || []).map((value) => state.options.findIndex((e) => e.value === value)).filter((index2) => index2 > -1);
+      const indexes = (modelValue2.value || []).map((value) => state.options.findIndex((e) => e.value === value)).filter((index2) => index2 > -1);
       const minIndex = Math.min(...indexes);
       poll({
         callback: () => {
@@ -23089,6 +23040,15 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
         deep: true
       }
     );
+    watch(
+      () => modelValue2.value,
+      () => {
+        getSelectWidth();
+      },
+      {
+        deep: true
+      }
+    );
     const getResultText = computed(() => {
       return state.options.length > 0 ? locale.t("selectMultiple.resultCount", {
         num: numFormat(state.options.filter((e) => !e.isGroup).length)
@@ -23104,8 +23064,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
       return getSelectedRows.value && getSelectedRows.value.length === 0;
     });
     const selectedItemsText = computed(() => {
-      if (!hasSelectedItems.value)
-        return "";
+      if (!hasSelectedItems.value) return "";
       return getSelectedRows.value.map((item) => item.label).join(props2.valueTextSplit);
     });
     const showResultCount = computed(() => {
@@ -23128,6 +23087,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
       return props2.placeholder || locale.t("selectMultiple.placeholder");
     });
     const textValueStyle = computed(() => {
+      console.log(state.selectWidth);
       return {
         opacity: state.visible ? 0.6 : 1,
         width: `calc(${state.selectWidth - 24}px)`
@@ -23404,7 +23364,7 @@ const _sfc_main$u = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const LewSelectMultiple = /* @__PURE__ */ _export_sfc(_sfc_main$u, [["__scopeId", "data-v-b682dcf8"]]);
+const LewSelectMultiple = /* @__PURE__ */ _export_sfc(_sfc_main$u, [["__scopeId", "data-v-05030c8e"]]);
 const sliderEmits = {
   change: (value) => value
 };
@@ -23558,30 +23518,33 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
         return Math.max(getMin.value, Math.min(getMax.value, safeVal));
       }
     });
+    const internalViewValue = ref(0);
     const dotRef = ref(null);
     const trackRef = ref(null);
     const dotX = ref(0);
+    const throttledUpdateView = throttle((newValue) => {
+      const clampedValue = Math.max(getMin.value, Math.min(getMax.value, newValue));
+      internalViewValue.value = clampedValue;
+      setDotByValue(clampedValue);
+    }, 50);
     const throttledUpdateModelValue = throttle((newValue) => {
       const clampedValue = Math.max(getMin.value, Math.min(getMax.value, newValue));
       modelValue2.value = clampedValue;
       emit2("change", clampedValue);
-    }, 16);
+    }, 250);
     function getMarkPosition(value) {
       const trackMax = getTrackMax.value;
       const trackMin = getTrackMin.value;
       const range = trackMax - trackMin;
-      if (range <= 0)
-        return 0;
+      if (range <= 0) return 0;
       const safeValue = safeNumber(value, trackMin);
       const percentage = (safeValue - trackMin) / range * 100;
       return Math.max(0, Math.min(100, percentage));
     }
     function calculateValue(position) {
-      if (!trackRef.value)
-        return getMin.value;
+      if (!trackRef.value) return getMin.value;
       const trackWidth = trackRef.value.clientWidth;
-      if (trackWidth <= 0)
-        return getMin.value;
+      if (trackWidth <= 0) return getMin.value;
       const percentage = Math.max(0, Math.min(1, position / trackWidth));
       dotX.value = position;
       const trackMax = getTrackMax.value;
@@ -23589,8 +23552,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
       const range = trackMax - trackMin;
       const value = percentage * range + trackMin;
       const step = safeNumber(props2.step, 1);
-      if (step <= 0)
-        return value;
+      if (step <= 0) return value;
       const decimalPlaces = (step.toString().split(".")[1] || "").length;
       return Number(value.toFixed(decimalPlaces));
     }
@@ -23600,28 +23562,20 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
       }
       try {
         const trackRect = trackRef.value.getBoundingClientRect();
-        const clickX = Math.max(
-          0,
-          Math.min(e.clientX - trackRect.left, trackRect.width)
-        );
+        const clickX = Math.max(0, Math.min(e.clientX - trackRect.left, trackRect.width));
         const step = safeNumber(props2.step, 1);
-        if (step <= 0)
-          return;
+        if (step <= 0) return;
         const trackMax = getTrackMax.value;
         const trackMin = getTrackMin.value;
         const range = trackMax - trackMin;
-        if (range <= 0)
-          return;
+        if (range <= 0) return;
         const stepSize = trackRect.width / (range / step);
         const nearestStep = Math.round(clickX / stepSize) * stepSize;
         const newValue = calculateValue(nearestStep);
-        const clampedValue = Math.max(
-          getMin.value,
-          Math.min(getMax.value, newValue)
-        );
+        const clampedValue = Math.max(getMin.value, Math.min(getMax.value, newValue));
         if (clampedValue >= getMin.value && clampedValue <= getMax.value) {
+          throttledUpdateView(clampedValue);
           throttledUpdateModelValue(clampedValue);
-          setDotByValue(clampedValue);
         }
       } catch (error) {
         console.warn("[LewSlider] setDot error:", error);
@@ -23632,33 +23586,24 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
       const trackMin = getTrackMin.value;
       const range = trackMax - trackMin;
       const step = safeNumber(props2.step, 1);
-      if (range <= 0 || step <= 0)
-        return 0;
+      if (range <= 0 || step <= 0) return 0;
       const steps = Math.round((value - trackMin) / step);
       return steps * step / range * 100;
     }
     function setDotByClick(value) {
-      if (props2.readonly || props2.disabled)
-        return;
+      if (props2.readonly || props2.disabled) return;
       const safeValue = safeNumber(value, getMin.value);
-      const clampedValue = Math.max(
-        getMin.value,
-        Math.min(getMax.value, safeValue)
-      );
+      const clampedValue = Math.max(getMin.value, Math.min(getMax.value, safeValue));
       if (clampedValue >= getMin.value && clampedValue <= getMax.value) {
+        throttledUpdateView(clampedValue);
         throttledUpdateModelValue(clampedValue);
-        setDotByValue(clampedValue);
       }
     }
     function setDotByValue(value) {
-      if (!dotRef.value)
-        return;
+      if (!dotRef.value) return;
       try {
         const safeValue = safeNumber(value, getMin.value);
-        const clampedValue = Math.max(
-          getMin.value,
-          Math.min(getMax.value, safeValue)
-        );
+        const clampedValue = Math.max(getMin.value, Math.min(getMax.value, safeValue));
         const nearestStep = calculateNearestStep(clampedValue);
         const clampedStep = Math.max(0, Math.min(100, nearestStep));
         dotRef.value.style.left = `${clampedStep}%`;
@@ -23686,12 +23631,9 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
             callback: (e) => {
               try {
                 const newValue = calculateValue(e.x);
-                const clampedValue = Math.max(
-                  getMin.value,
-                  Math.min(getMax.value, newValue)
-                );
+                const clampedValue = Math.max(getMin.value, Math.min(getMax.value, newValue));
+                throttledUpdateView(clampedValue);
                 throttledUpdateModelValue(clampedValue);
-                setDotByValue(clampedValue);
               } catch (error) {
                 console.warn("[LewSlider] drag callback error:", error);
               }
@@ -23699,6 +23641,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
           });
         }
         const currentValue = modelValue2.value || getMin.value;
+        internalViewValue.value = currentValue;
         setDotByValue(currentValue);
       } catch (error) {
         console.warn("[LewSlider] init error:", error);
@@ -23728,6 +23671,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
     onUnmounted(() => {
       try {
         _dragmove();
+        throttledUpdateView.cancel();
         throttledUpdateModelValue.cancel();
       } catch (error) {
         console.warn("[LewSlider] cleanup error:", error);
@@ -23737,6 +23681,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
       modelValue2,
       (newValue) => {
         const safeValue = safeNumber(newValue, getMin.value);
+        internalViewValue.value = safeValue;
         setDotByValue(safeValue);
       },
       { immediate: true }
@@ -23781,7 +23726,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
       }
       return {
         ...objStyle,
-        "width": any2px(width),
+        width: any2px(width),
         "--lew-slider-height": `var(--lew-form-item-height-${safeSize})`
       };
     });
@@ -23823,10 +23768,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
           left: "0%"
         };
       }
-      const width = Math.max(
-        0,
-        Math.min(100, (getMax.value - getMin.value) / range * 100)
-      );
+      const width = Math.max(0, Math.min(100, (getMax.value - getMin.value) / range * 100));
       const left2 = getMarkPosition(getMin.value);
       return {
         width: `${width}%`,
@@ -23834,21 +23776,21 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
       };
     });
     const selectedTrackStyles = computed(() => {
-      const currentValue = modelValue2.value || getMin.value;
+      const currentValue = internalViewValue.value || getMin.value;
       const width = getMarkPosition(currentValue);
       return {
         width: `${width}%`
       };
     });
     const dotStyles = computed(() => {
-      const currentValue = modelValue2.value;
+      const currentValue = internalViewValue.value;
       const opacity = currentValue !== void 0 && currentValue !== null ? "1" : "0";
       return {
         opacity
       };
     });
     const tooltipConfig = computed(() => {
-      const currentValue = safeNumber(modelValue2.value);
+      const currentValue = safeNumber(internalViewValue.value);
       return {
         content: safeFormatTooltip(currentValue),
         placement: "top",
@@ -23860,7 +23802,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
     const optionMarkStyles = computed(() => {
       return validOptions.value.map((item) => {
         const value = safeNumber(item.value);
-        const currentValue = safeNumber(modelValue2.value);
+        const currentValue = safeNumber(internalViewValue.value);
         const isSelected = value <= currentValue;
         return {
           key: `mark-${item.value}`,
@@ -23963,7 +23905,7 @@ const _sfc_main$t = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const LewSlider = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["__scopeId", "data-v-b0677332"]]);
+const LewSlider = /* @__PURE__ */ _export_sfc(_sfc_main$t, [["__scopeId", "data-v-c779ddf8"]]);
 const sliderRangeEmits = {
   change: (value) => value
 };
@@ -24096,10 +24038,18 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
         return [getMin.value, getMax.value];
       }
     });
+    const internalViewValue = ref([0, 0]);
     const dotRef1 = ref(null);
     const dotRef2 = ref(null);
     const trackRef = ref(null);
     const dotX = ref(0);
+    const throttledUpdateView = throttle(
+      (leftValue, rightValue) => {
+        internalViewValue.value = [leftValue, rightValue];
+        updateDotsByModelValue([leftValue, rightValue]);
+      },
+      50
+    );
     const throttledUpdateModelValue = throttle(
       (leftValue, rightValue) => {
         if (!modelValue2.value) {
@@ -24108,7 +24058,7 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
         modelValue2.value = [leftValue, rightValue];
         emit2("change", modelValue2.value);
       },
-      16
+      250
     );
     function getMarkPosition(value) {
       const range = getTrackMax.value - getTrackMin.value;
@@ -24171,12 +24121,12 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
           trackMin: () => getTrackMin.value,
           callback: (e) => {
             const newValue = [
-              modelValue2.value?.[0] || getMin.value,
-              modelValue2.value?.[1] || getMax.value
+              internalViewValue.value?.[0] || getMin.value,
+              internalViewValue.value?.[1] || getMax.value
             ];
             newValue[0] = calculateValue(e.x);
+            throttledUpdateView(newValue[0], newValue[1]);
             throttledUpdateModelValue(newValue[0], newValue[1]);
-            updateDotsByModelValue([newValue[0], newValue[1]]);
           }
         });
         _dragmove = dragmove({
@@ -24190,16 +24140,18 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
           trackMin: () => getTrackMin.value,
           callback: (e) => {
             const newValue = [
-              modelValue2.value?.[0] || getMin.value,
-              modelValue2.value?.[1] || getMax.value
+              internalViewValue.value?.[0] || getMin.value,
+              internalViewValue.value?.[1] || getMax.value
             ];
             newValue[1] = calculateValue(e.x);
+            throttledUpdateView(newValue[0], newValue[1]);
             throttledUpdateModelValue(newValue[0], newValue[1]);
-            updateDotsByModelValue([newValue[0], newValue[1]]);
           }
         });
       }
-      updateDotsByModelValue(modelValue2.value || [getMin.value, getMax.value]);
+      const initialValue = modelValue2.value || [getMin.value, getMax.value];
+      internalViewValue.value = initialValue;
+      updateDotsByModelValue(initialValue);
     }
     watch(
       [
@@ -24218,12 +24170,15 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
     });
     onUnmounted(() => {
       _dragmove();
+      throttledUpdateView.cancel();
       throttledUpdateModelValue.cancel();
     });
     watch(
       modelValue2,
       (newValue) => {
-        updateDotsByModelValue(newValue || [getMin.value, getMax.value]);
+        const safeValue = newValue || [getMin.value, getMax.value];
+        internalViewValue.value = safeValue;
+        updateDotsByModelValue(safeValue);
       },
       {
         deep: true
@@ -24295,8 +24250,8 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
       };
     });
     const selectedLineStyle = computed(() => {
-      const currentMin = modelValue2.value?.[0] ?? getMin.value;
-      const currentMax = modelValue2.value?.[1] ?? getMax.value;
+      const currentMin = internalViewValue.value?.[0] ?? getMin.value;
+      const currentMax = internalViewValue.value?.[1] ?? getMax.value;
       const width = Math.max(
         0,
         Math.min(
@@ -24313,8 +24268,8 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
     const optionStyles = computed(() => {
       return props2.options?.map((item, index2) => {
         const itemValue = Number(item.value);
-        const currentMin = modelValue2.value?.[0] ?? getMin.value;
-        const currentMax = modelValue2.value?.[1] ?? getMax.value;
+        const currentMin = internalViewValue.value?.[0] ?? getMin.value;
+        const currentMax = internalViewValue.value?.[1] ?? getMax.value;
         const isSelected = itemValue >= Math.min(currentMin, currentMax) && itemValue <= Math.max(currentMin, currentMax);
         const isDisabled = itemValue < Number(getMin.value) || itemValue > Number(getMax.value);
         return {
@@ -24343,17 +24298,17 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
     const dotStyles = computed(() => {
       return {
         dot1: {
-          opacity: modelValue2.value?.[0] !== void 0 ? "1" : "0"
+          opacity: internalViewValue.value?.[0] !== void 0 ? "1" : "0"
         },
         dot2: {
-          opacity: modelValue2.value?.[1] !== void 0 ? "1" : "0"
+          opacity: internalViewValue.value?.[1] !== void 0 ? "1" : "0"
         }
       };
     });
     const tooltipContent = computed(() => {
       return {
-        dot1: props2.formatTooltip(modelValue2.value?.[0] ?? getMin.value),
-        dot2: props2.formatTooltip(modelValue2.value?.[1] ?? getMax.value)
+        dot1: props2.formatTooltip(internalViewValue.value?.[0] ?? getMin.value),
+        dot2: props2.formatTooltip(internalViewValue.value?.[1] ?? getMax.value)
       };
     });
     return (_ctx, _cache) => {
@@ -24443,7 +24398,7 @@ const _sfc_main$s = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const LewSliderRange = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["__scopeId", "data-v-8702eb83"]]);
+const LewSliderRange = /* @__PURE__ */ _export_sfc(_sfc_main$s, [["__scopeId", "data-v-94778521"]]);
 const switchEmits = {
   change: (value) => value
 };
@@ -29489,7 +29444,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     const emit2 = __emit2;
     const _options = ref(props2.options);
     function clickItem(item) {
-      const instance = props2.dropdownInstance || window.LewContextMenu.instance || window.LewHoverMenu.instance || null;
+      const instance = props2.dropdownInstance || window.LewContextMenu?.instance || window.LewHoverMenu?.instance || null;
       if (isFunction$1(item.onClick)) {
         const proxyItem = new Proxy(item, {
           get(target, prop, receiver) {
@@ -29508,9 +29463,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
       emit2("change", item);
     }
     const uniqueId = getUniqueId();
-    const itemRefs = ref(
-      []
-    );
+    const itemRefs = ref([]);
     function initTippy() {
       itemRefs.value.forEach((el, index2) => {
         if (!el || props2.options[index2].disabled || (props2.options[index2].children || []).length === 0) {
@@ -29548,7 +29501,10 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
           zIndex: 2001,
           content: menuDom
         });
-        window.LewContextMenu.menuInstance[uniqueId].popper.children[0].setAttribute("data-lew", "popover");
+        window.LewContextMenu.menuInstance[uniqueId].popper.children[0].setAttribute(
+          "data-lew",
+          "popover"
+        );
       });
     }
     onMounted(() => {
@@ -29626,7 +29582,7 @@ const _sfc_main$3 = /* @__PURE__ */ defineComponent({
     };
   }
 });
-const LewContextMenu = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-c01b5d30"]]);
+const LewContextMenu = /* @__PURE__ */ _export_sfc(_sfc_main$3, [["__scopeId", "data-v-7eb0a25c"]]);
 const LewContextMenu$1 = /* @__PURE__ */ Object.freeze(/* @__PURE__ */ Object.defineProperty({
   __proto__: null,
   default: LewContextMenu
@@ -29694,10 +29650,10 @@ const LewVContextMenu = {
               return;
             e.preventDefault();
             const { instance } = window.LewContextMenu;
-            instance.hide();
+            instance?.hide();
             const menuDom = createContextMenu(menuConfig.options);
             setTimeout(() => {
-              instance.setProps({
+              instance?.setProps({
                 content: menuDom,
                 getReferenceClientRect: () => ({
                   width: 0,
@@ -29708,7 +29664,7 @@ const LewVContextMenu = {
                   right: e.clientX
                 })
               });
-              instance.show();
+              instance?.show();
             }, 120);
           };
           window.addEventListener(
@@ -29815,7 +29771,7 @@ const LewVHoverMenu = {
               return;
             const options = window.LewHoverMenu.menu[id];
             const { instance } = window.LewHoverMenu;
-            instance.hide();
+            instance?.hide();
             const menuDom = document.createElement("div");
             createApp({
               render() {
@@ -29838,8 +29794,8 @@ const LewVHoverMenu = {
                   right: rect.right
                 })
               };
-              instance.setProps(props2);
-              instance.show();
+              instance?.setProps(props2);
+              instance?.show();
             }, 120);
           };
           window.addEventListener("mouseover", window.LewHoverMenu.hoverMenu);