@element-plus/nightly 0.0.20240207 → 0.0.20240209

package/dist/index.full.js

@@ -1,4 +1,4 @@
-/*! Element Plus v0.0.20240207 */
+/*! Element Plus v0.0.20240209 */
 
 (function (global, factory) {
   typeof exports === 'object' && typeof module !== 'undefined' ? factory(exports, require('vue')) :
@@ -11572,7 +11572,7 @@
 
   const ElConfigProvider = withInstall(ConfigProvider);
 
-  const version$1 = "0.0.20240207";
+  const version$1 = "0.0.20240209";
 
   const makeInstaller = (components = []) => {
     const install = (app, options) => {
@@ -14480,15 +14480,9 @@
       type: Boolean,
       default: true
     },
-    width: String,
-    height: String,
-    ratioX: {
-      type: Number,
-      default: 1
-    },
-    ratioY: {
+    minSize: {
       type: Number,
-      default: 1
+      required: true
     }
   });
 
@@ -14497,31 +14491,52 @@
     props: barProps,
     setup(__props, { expose }) {
       const props = __props;
+      const scrollbar = vue.inject(scrollbarContextKey);
       const moveX = vue.ref(0);
       const moveY = vue.ref(0);
+      const sizeWidth = vue.ref("");
+      const sizeHeight = vue.ref("");
+      const ratioY = vue.ref(1);
+      const ratioX = vue.ref(1);
       const handleScroll = (wrap) => {
         if (wrap) {
           const offsetHeight = wrap.offsetHeight - GAP;
           const offsetWidth = wrap.offsetWidth - GAP;
-          moveY.value = wrap.scrollTop * 100 / offsetHeight * props.ratioY;
-          moveX.value = wrap.scrollLeft * 100 / offsetWidth * props.ratioX;
+          moveY.value = wrap.scrollTop * 100 / offsetHeight * ratioY.value;
+          moveX.value = wrap.scrollLeft * 100 / offsetWidth * ratioX.value;
         }
       };
+      const update = () => {
+        const wrap = scrollbar == null ? void 0 : scrollbar.wrapElement;
+        if (!wrap)
+          return;
+        const offsetHeight = wrap.offsetHeight - GAP;
+        const offsetWidth = wrap.offsetWidth - GAP;
+        const originalHeight = offsetHeight ** 2 / wrap.scrollHeight;
+        const originalWidth = offsetWidth ** 2 / wrap.scrollWidth;
+        const height = Math.max(originalHeight, props.minSize);
+        const width = Math.max(originalWidth, props.minSize);
+        ratioY.value = originalHeight / (offsetHeight - originalHeight) / (height / (offsetHeight - height));
+        ratioX.value = originalWidth / (offsetWidth - originalWidth) / (width / (offsetWidth - width));
+        sizeHeight.value = height + GAP < offsetHeight ? `${height}px` : "";
+        sizeWidth.value = width + GAP < offsetWidth ? `${width}px` : "";
+      };
       expose({
-        handleScroll
+        handleScroll,
+        update
       });
       return (_ctx, _cache) => {
         return vue.openBlock(), vue.createElementBlock(vue.Fragment, null, [
           vue.createVNode(Thumb, {
             move: moveX.value,
-            ratio: _ctx.ratioX,
-            size: _ctx.width,
+            ratio: ratioX.value,
+            size: sizeWidth.value,
             always: _ctx.always
           }, null, 8, ["move", "ratio", "size", "always"]),
           vue.createVNode(Thumb, {
             move: moveY.value,
-            ratio: _ctx.ratioY,
-            size: _ctx.height,
+            ratio: ratioY.value,
+            size: sizeHeight.value,
             vertical: "",
             always: _ctx.always
           }, null, 8, ["move", "ratio", "size", "always"])
@@ -14601,11 +14616,7 @@
       const scrollbarRef = vue.ref();
       const wrapRef = vue.ref();
       const resizeRef = vue.ref();
-      const sizeWidth = vue.ref("0");
-      const sizeHeight = vue.ref("0");
       const barRef = vue.ref();
-      const ratioY = vue.ref(1);
-      const ratioX = vue.ref(1);
       const wrapStyle = vue.computed(() => {
         const style = {};
         if (props.height)
@@ -14654,18 +14665,8 @@
         wrapRef.value.scrollLeft = value;
       };
       const update = () => {
-        if (!wrapRef.value)
-          return;
-        const offsetHeight = wrapRef.value.offsetHeight - GAP;
-        const offsetWidth = wrapRef.value.offsetWidth - GAP;
-        const originalHeight = offsetHeight ** 2 / wrapRef.value.scrollHeight;
-        const originalWidth = offsetWidth ** 2 / wrapRef.value.scrollWidth;
-        const height = Math.max(originalHeight, props.minSize);
-        const width = Math.max(originalWidth, props.minSize);
-        ratioY.value = originalHeight / (offsetHeight - originalHeight) / (height / (offsetHeight - height));
-        ratioX.value = originalWidth / (offsetWidth - originalWidth) / (width / (offsetWidth - width));
-        sizeHeight.value = height + GAP < offsetHeight ? `${height}px` : "";
-        sizeWidth.value = width + GAP < offsetWidth ? `${width}px` : "";
+        var _a;
+        (_a = barRef.value) == null ? void 0 : _a.update();
       };
       vue.watch(() => props.noresize, (noresize) => {
         if (noresize) {
@@ -14738,12 +14739,9 @@
             key: 0,
             ref_key: "barRef",
             ref: barRef,
-            height: sizeHeight.value,
-            width: sizeWidth.value,
             always: _ctx.always,
-            "ratio-x": ratioX.value,
-            "ratio-y": ratioY.value
-          }, null, 8, ["height", "width", "always", "ratio-x", "ratio-y"])) : vue.createCommentVNode("v-if", true)
+            "min-size": _ctx.minSize
+          }, null, 8, ["always", "min-size"])) : vue.createCommentVNode("v-if", true)
         ], 2);
       };
     }
@@ -39813,7 +39811,8 @@
         initStates();
       }
     }, {
-      deep: true
+      deep: true,
+      flush: "post"
     });
     vue.watch(() => filteredOptions.value, () => {
       return menuRef.value && vue.nextTick(menuRef.value.resetScrollTop);