element-pe 2.0.7 → 2.0.8

package/es/components/virtual-list/src/components/scrollbar.mjs

@@ -1,12 +1,12 @@
-import { defineComponent, ref, reactive, computed, unref, watch, onMounted, onBeforeUnmount, h, withModifiers } from 'vue';
-import { isClient } from '@vueuse/core';
+import { defineComponent, computed, ref, reactive, unref, watch, onBeforeUnmount, h, withModifiers } from 'vue';
 import '../../../scrollbar/index.mjs';
 import '../../../../utils/index.mjs';
+import '../../../../hooks/index.mjs';
 import { HORIZONTAL, ScrollbarDirKey, SCROLLBAR_MIN_SIZE } from '../defaults.mjs';
 import { virtualizedScrollbarProps } from '../props.mjs';
 import { renderThumbStyle } from '../utils.mjs';
+import { useNamespace } from '../../../../hooks/use-namespace/index.mjs';
 import { BAR_MAP } from '../../../scrollbar/src/util.mjs';
-import { on, off } from '../../../../utils/dom/event.mjs';
 import { cAF, rAF } from '../../../../utils/raf.mjs';
 
 const ScrollBar = defineComponent({
@@ -14,7 +14,9 @@ const ScrollBar = defineComponent({
   props: virtualizedScrollbarProps,
   emits: ["scroll", "start-move", "stop-move"],
   setup(props, { emit }) {
-    const GAP = 4;
+    const GAP = computed(() => props.startGap + props.endGap);
+    const nsVirtualScrollbar = useNamespace("virtual-scrollbar");
+    const nsScrollbar = useNamespace("scrollbar");
     const trackRef = ref();
     const thumbRef = ref();
     let frameHandle = null;
@@ -24,11 +26,11 @@ const ScrollBar = defineComponent({
       traveled: 0
     });
     const bar = computed(() => BAR_MAP[props.layout]);
-    const trackSize = computed(() => props.clientSize - GAP);
+    const trackSize = computed(() => props.clientSize - unref(GAP));
     const trackStyle = computed(() => ({
       position: "absolute",
-      width: HORIZONTAL === props.layout ? `${trackSize.value}px` : "6px",
-      height: HORIZONTAL === props.layout ? "6px" : `${trackSize.value}px`,
+      width: `${HORIZONTAL === props.layout ? trackSize.value : props.scrollbarSize}px`,
+      height: `${HORIZONTAL === props.layout ? props.scrollbarSize : trackSize.value}px`,
       [ScrollbarDirKey[props.layout]]: "2px",
       right: "2px",
       bottom: "2px",
@@ -60,28 +62,28 @@ const ScrollBar = defineComponent({
       }, props.layout);
       return style;
     });
-    const totalSteps = computed(() => Math.floor(props.clientSize - thumbSize.value - GAP));
+    const totalSteps = computed(() => Math.floor(props.clientSize - thumbSize.value - unref(GAP)));
     const attachEvents = () => {
-      on(window, "mousemove", onMouseMove);
-      on(window, "mouseup", onMouseUp);
+      window.addEventListener("mousemove", onMouseMove);
+      window.addEventListener("mouseup", onMouseUp);
       const thumbEl = unref(thumbRef);
       if (!thumbEl)
         return;
       onselectstartStore = document.onselectstart;
       document.onselectstart = () => false;
-      on(thumbEl, "touchmove", onMouseMove);
-      on(thumbEl, "touchend", onMouseUp);
+      thumbEl.addEventListener("touchmove", onMouseMove);
+      thumbEl.addEventListener("touchend", onMouseUp);
     };
     const detachEvents = () => {
-      off(window, "mousemove", onMouseMove);
-      off(window, "mouseup", onMouseUp);
+      window.removeEventListener("mousemove", onMouseMove);
+      window.removeEventListener("mouseup", onMouseUp);
       document.onselectstart = onselectstartStore;
       onselectstartStore = null;
       const thumbEl = unref(thumbRef);
       if (!thumbEl)
         return;
-      off(thumbEl, "touchmove", onMouseMove);
-      off(thumbEl, "touchend", onMouseUp);
+      thumbEl.removeEventListener("touchmove", onMouseMove);
+      thumbEl.removeEventListener("touchend", onMouseUp);
     };
     const onThumbMouseDown = (e) => {
       e.stopImmediatePropagation();
@@ -113,7 +115,7 @@ const ScrollBar = defineComponent({
       const thumbClickPosition = thumbRef.value[bar.value.offset] - prevPage;
       const distance = offset - thumbClickPosition;
       frameHandle = rAF(() => {
-        state.traveled = Math.max(0, Math.min(distance, totalSteps.value));
+        state.traveled = Math.max(props.startGap, Math.min(distance, totalSteps.value));
         emit("scroll", distance, totalSteps.value);
       });
     };
@@ -124,32 +126,29 @@ const ScrollBar = defineComponent({
       state.traveled = Math.max(0, Math.min(distance, totalSteps.value));
       emit("scroll", distance, totalSteps.value);
     };
-    const onScrollbarTouchStart = (e) => e.preventDefault();
     watch(() => props.scrollFrom, (v) => {
       if (state.isDragging)
         return;
       state.traveled = Math.ceil(v * totalSteps.value);
     });
-    onMounted(() => {
-      if (!isClient)
-        return;
-      on(trackRef.value, "touchstart", onScrollbarTouchStart);
-      on(thumbRef.value, "touchstart", onThumbMouseDown);
-    });
     onBeforeUnmount(() => {
-      off(trackRef.value, "touchstart", onScrollbarTouchStart);
       detachEvents();
     });
     return () => {
       return h("div", {
         role: "presentation",
         ref: trackRef,
-        class: "el-virtual-scrollbar",
+        class: [
+          nsVirtualScrollbar.b(),
+          props.class,
+          (props.alwaysOn || state.isDragging) && "always-on"
+        ],
         style: trackStyle.value,
-        onMousedown: withModifiers(clickTrackHandler, ["stop", "prevent"])
+        onMousedown: withModifiers(clickTrackHandler, ["stop", "prevent"]),
+        onTouchstartPrevent: onThumbMouseDown
       }, h("div", {
         ref: thumbRef,
-        class: "el-scrollbar__thumb",
+        class: nsScrollbar.e("thumb"),
         style: thumbStyle.value,
         onMousedown: onThumbMouseDown
       }, []));

package/es/components/virtual-list/src/components/scrollbar.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"scrollbar.mjs","sources":["../../../../../../../packages/components/virtual-list/src/components/scrollbar.ts"],"sourcesContent":["import {\n  computed,\n  defineComponent,\n  h,\n  onBeforeUnmount,\n  onMounted,\n  reactive,\n  ref,\n  unref,\n  watch,\n  withModifiers,\n} from 'vue'\nimport { isClient } from '@vueuse/core'\nimport { BAR_MAP } from '@element-plus/components/scrollbar'\nimport { cAF, off, on, rAF } from '@element-plus/utils'\n\nimport { HORIZONTAL, SCROLLBAR_MIN_SIZE, ScrollbarDirKey } from '../defaults'\nimport { virtualizedScrollbarProps } from '../props'\nimport { renderThumbStyle } from '../utils'\n\nimport type { CSSProperties } from 'vue'\n\nconst ScrollBar = defineComponent({\n  name: 'ElVirtualScrollBar',\n  props: virtualizedScrollbarProps,\n  emits: ['scroll', 'start-move', 'stop-move'],\n  setup(props, { emit }) {\n    const GAP = 4 // top 2 + bottom 2 | left 2 + right 2\n\n    // DOM refs\n    const trackRef = ref<HTMLElement>()\n    const thumbRef = ref<HTMLElement>()\n\n    // local variables\n    let frameHandle: null | number = null\n    let onselectstartStore: null | typeof document.onselectstart = null\n\n    // data\n    const state = reactive({\n      isDragging: false,\n      traveled: 0,\n    })\n\n    const bar = computed(() => BAR_MAP[props.layout])\n\n    const trackSize = computed(() => props.clientSize! - GAP)\n\n    const trackStyle = computed<CSSProperties>(() => ({\n      position: 'absolute',\n      width: HORIZONTAL === props.layout ? `${trackSize.value}px` : '6px',\n      height: HORIZONTAL === props.layout ? '6px' : `${trackSize.value}px`,\n      [ScrollbarDirKey[props.layout]]: '2px',\n      right: '2px',\n      bottom: '2px',\n      borderRadius: '4px',\n    }))\n\n    const thumbSize = computed(() => {\n      const ratio = props.ratio!\n      const clientSize = props.clientSize!\n      if (ratio >= 100) {\n        return Number.POSITIVE_INFINITY\n      }\n\n      if (ratio >= 50) {\n        return (ratio * clientSize) / 100\n      }\n\n      const SCROLLBAR_MAX_SIZE = clientSize / 3\n      return Math.floor(\n        Math.min(\n          Math.max(ratio * clientSize, SCROLLBAR_MIN_SIZE),\n          SCROLLBAR_MAX_SIZE\n        )\n      )\n    })\n\n    // const sizeRange = computed(() => props.size - thumbSize.value)\n\n    const thumbStyle = computed<CSSProperties>(() => {\n      if (!Number.isFinite(thumbSize.value)) {\n        return {\n          display: 'none',\n        }\n      }\n\n      const thumb = `${thumbSize.value}px`\n\n      const style: CSSProperties = renderThumbStyle(\n        {\n          bar: bar.value,\n          size: thumb,\n          move: state.traveled,\n        },\n        props.layout\n      )\n\n      return style\n    })\n\n    const totalSteps = computed(() =>\n      Math.floor(props.clientSize! - thumbSize.value - GAP)\n    )\n\n    const attachEvents = () => {\n      on(window, 'mousemove', onMouseMove)\n      on(window, 'mouseup', onMouseUp)\n\n      const thumbEl = unref(thumbRef)\n\n      if (!thumbEl) return\n\n      onselectstartStore = document.onselectstart\n      document.onselectstart = () => false\n\n      on(thumbEl, 'touchmove', onMouseMove)\n      on(thumbEl, 'touchend', onMouseUp)\n    }\n\n    const detachEvents = () => {\n      off(window, 'mousemove', onMouseMove)\n      off(window, 'mouseup', onMouseUp)\n\n      document.onselectstart = onselectstartStore\n      onselectstartStore = null\n\n      const thumbEl = unref(thumbRef)\n      if (!thumbEl) return\n\n      off(thumbEl, 'touchmove', onMouseMove)\n      off(thumbEl, 'touchend', onMouseUp)\n    }\n\n    const onThumbMouseDown = (e: Event) => {\n      e.stopImmediatePropagation()\n      if (\n        (e as KeyboardEvent).ctrlKey ||\n        [1, 2].includes((e as MouseEvent).button)\n      ) {\n        return\n      }\n\n      state.isDragging = true\n      state[bar.value.axis] =\n        e.currentTarget![bar.value.offset] -\n        (e[bar.value.client] -\n          (e.currentTarget as HTMLElement).getBoundingClientRect()[\n            bar.value.direction\n          ])\n\n      emit('start-move')\n      attachEvents()\n    }\n\n    const onMouseUp = () => {\n      state.isDragging = false\n      state[bar.value.axis] = 0\n      emit('stop-move')\n      detachEvents()\n    }\n\n    const onMouseMove = (e: Event) => {\n      const { isDragging } = state\n      if (!isDragging) return\n      if (!thumbRef.value || !trackRef.value) return\n\n      const prevPage = state[bar.value.axis]\n      if (!prevPage) return\n\n      cAF(frameHandle!)\n      // using the current track's offset top/left - the current pointer's clientY/clientX\n      // to get the relative position of the pointer to the track.\n      const offset =\n        (trackRef.value.getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]) *\n        -1\n\n      // find where the thumb was clicked on.\n      const thumbClickPosition = thumbRef.value[bar.value.offset] - prevPage\n      /**\n       *  +--------------+                                   +--------------+\n       *  |              -  <--------- thumb.offsetTop       |              |\n       *  |             |+|             <--+                 |              |\n       *  |              -                 |                 |              |\n       *  |   Content    |                 |                 |              |\n       *  |              |                 |                 |              |\n       *  |              |                 |                 |              |\n       *  |              |                 |                 |              -\n       *  |              |                 +-->              |             |+|\n       *  |              |                                   |              -\n       *  +--------------+                                   +--------------+\n       */\n\n      // using the current position - prev position to\n\n      const distance = offset - thumbClickPosition\n      // get how many steps in total.\n      // gap of 2 on top, 2 on bottom, in total 4.\n      // using totalSteps ÷ totalSize getting each step's size * distance to get the new\n      // scroll offset to scrollTo\n      frameHandle = rAF(() => {\n        state.traveled = Math.max(\n          0,\n          Math.min(\n            distance,\n            totalSteps.value // 2 is the top value\n          )\n        )\n        emit('scroll', distance, totalSteps.value)\n      })\n    }\n\n    const clickTrackHandler = (e: MouseEvent) => {\n      const offset = Math.abs(\n        (e.target as HTMLElement).getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]\n      )\n      const thumbHalf = thumbRef.value![bar.value.offset] / 2\n      const distance = offset - thumbHalf\n\n      state.traveled = Math.max(0, Math.min(distance, totalSteps.value))\n      emit('scroll', distance, totalSteps.value)\n    }\n\n    const onScrollbarTouchStart = (e: Event) => e.preventDefault()\n\n    watch(\n      () => props.scrollFrom,\n      (v) => {\n        if (state.isDragging) return\n        /**\n         *  this is simply mapping the current scrollbar offset\n         *\n         *  formula 1:\n         *    v = scrollOffset / (estimatedTotalSize - clientSize)\n         *    traveled = v * (clientSize - thumbSize - GAP) --> v * totalSteps\n         *\n         *  formula 2:\n         *    traveled = (v * clientSize) / (clientSize / totalSteps) --> (v * clientSize) * (totalSteps / clientSize) --> v * totalSteps\n         */\n        state.traveled = Math.ceil(v! * totalSteps.value)\n      }\n    )\n\n    onMounted(() => {\n      if (!isClient) return\n\n      on(trackRef.value!, 'touchstart', onScrollbarTouchStart)\n      on(thumbRef.value!, 'touchstart', onThumbMouseDown)\n    })\n\n    onBeforeUnmount(() => {\n      off(trackRef.value!, 'touchstart', onScrollbarTouchStart)\n      detachEvents()\n    })\n\n    return () => {\n      return h(\n        'div',\n        {\n          role: 'presentation',\n          ref: trackRef,\n          class: 'el-virtual-scrollbar',\n          style: trackStyle.value,\n          onMousedown: withModifiers(clickTrackHandler, ['stop', 'prevent']),\n        },\n        h(\n          'div',\n          {\n            ref: thumbRef,\n            class: 'el-scrollbar__thumb',\n            style: thumbStyle.value,\n            onMousedown: onThumbMouseDown,\n          },\n          []\n        )\n      )\n    }\n  },\n})\n\nexport default ScrollBar\n"],"names":[],"mappings":"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"}
+{"version":3,"file":"scrollbar.mjs","sources":["../../../../../../../packages/components/virtual-list/src/components/scrollbar.ts"],"sourcesContent":["import {\n  computed,\n  defineComponent,\n  h,\n  onBeforeUnmount,\n  reactive,\n  ref,\n  unref,\n  watch,\n  withModifiers,\n} from 'vue'\nimport { BAR_MAP } from '@element-plus/components/scrollbar'\nimport { cAF, rAF } from '@element-plus/utils'\n\nimport { useNamespace } from '@element-plus/hooks'\nimport { HORIZONTAL, SCROLLBAR_MIN_SIZE, ScrollbarDirKey } from '../defaults'\nimport { virtualizedScrollbarProps } from '../props'\nimport { renderThumbStyle } from '../utils'\n\nimport type { CSSProperties } from 'vue'\n\nconst ScrollBar = defineComponent({\n  name: 'ElVirtualScrollBar',\n  props: virtualizedScrollbarProps,\n  emits: ['scroll', 'start-move', 'stop-move'],\n  setup(props, { emit }) {\n    const GAP = computed(() => props.startGap + props.endGap) // top 2 + bottom 2 | left 2 + right 2\n\n    const nsVirtualScrollbar = useNamespace('virtual-scrollbar')\n    const nsScrollbar = useNamespace('scrollbar')\n    // DOM refs\n    const trackRef = ref<HTMLElement>()\n    const thumbRef = ref<HTMLElement>()\n\n    // local variables\n    let frameHandle: null | number = null\n    let onselectstartStore: null | typeof document.onselectstart = null\n\n    // data\n    const state = reactive({\n      isDragging: false,\n      traveled: 0,\n    })\n\n    const bar = computed(() => BAR_MAP[props.layout])\n\n    const trackSize = computed(() => props.clientSize! - unref(GAP))\n\n    const trackStyle = computed<CSSProperties>(() => ({\n      position: 'absolute',\n      width: `${\n        HORIZONTAL === props.layout ? trackSize.value : props.scrollbarSize\n      }px`,\n      height: `${\n        HORIZONTAL === props.layout ? props.scrollbarSize : trackSize.value\n      }px`,\n      [ScrollbarDirKey[props.layout]]: '2px',\n      right: '2px',\n      bottom: '2px',\n      borderRadius: '4px',\n    }))\n\n    const thumbSize = computed(() => {\n      const ratio = props.ratio!\n      const clientSize = props.clientSize!\n      if (ratio >= 100) {\n        return Number.POSITIVE_INFINITY\n      }\n\n      if (ratio >= 50) {\n        return (ratio * clientSize) / 100\n      }\n\n      const SCROLLBAR_MAX_SIZE = clientSize / 3\n      return Math.floor(\n        Math.min(\n          Math.max(ratio * clientSize, SCROLLBAR_MIN_SIZE),\n          SCROLLBAR_MAX_SIZE\n        )\n      )\n    })\n\n    // const sizeRange = computed(() => props.size - thumbSize.value)\n\n    const thumbStyle = computed<CSSProperties>(() => {\n      if (!Number.isFinite(thumbSize.value)) {\n        return {\n          display: 'none',\n        }\n      }\n\n      const thumb = `${thumbSize.value}px`\n\n      const style: CSSProperties = renderThumbStyle(\n        {\n          bar: bar.value,\n          size: thumb,\n          move: state.traveled,\n        },\n        props.layout\n      )\n\n      return style\n    })\n\n    const totalSteps = computed(() =>\n      Math.floor(props.clientSize! - thumbSize.value - unref(GAP))\n    )\n\n    const attachEvents = () => {\n      window.addEventListener('mousemove', onMouseMove)\n      window.addEventListener('mouseup', onMouseUp)\n\n      const thumbEl = unref(thumbRef)\n\n      if (!thumbEl) return\n\n      onselectstartStore = document.onselectstart\n      document.onselectstart = () => false\n\n      thumbEl.addEventListener('touchmove', onMouseMove)\n      thumbEl.addEventListener('touchend', onMouseUp)\n    }\n\n    const detachEvents = () => {\n      window.removeEventListener('mousemove', onMouseMove)\n      window.removeEventListener('mouseup', onMouseUp)\n\n      document.onselectstart = onselectstartStore\n      onselectstartStore = null\n\n      const thumbEl = unref(thumbRef)\n      if (!thumbEl) return\n\n      thumbEl.removeEventListener('touchmove', onMouseMove)\n      thumbEl.removeEventListener('touchend', onMouseUp)\n    }\n\n    const onThumbMouseDown = (e: Event) => {\n      e.stopImmediatePropagation()\n      if (\n        (e as KeyboardEvent).ctrlKey ||\n        [1, 2].includes((e as MouseEvent).button)\n      ) {\n        return\n      }\n\n      state.isDragging = true\n      state[bar.value.axis] =\n        e.currentTarget![bar.value.offset] -\n        (e[bar.value.client] -\n          (e.currentTarget as HTMLElement).getBoundingClientRect()[\n            bar.value.direction\n          ])\n\n      emit('start-move')\n      attachEvents()\n    }\n\n    const onMouseUp = () => {\n      state.isDragging = false\n      state[bar.value.axis] = 0\n      emit('stop-move')\n      detachEvents()\n    }\n\n    const onMouseMove = (e: Event) => {\n      const { isDragging } = state\n      if (!isDragging) return\n      if (!thumbRef.value || !trackRef.value) return\n\n      const prevPage = state[bar.value.axis]\n      if (!prevPage) return\n\n      cAF(frameHandle!)\n      // using the current track's offset top/left - the current pointer's clientY/clientX\n      // to get the relative position of the pointer to the track.\n      const offset =\n        (trackRef.value.getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]) *\n        -1\n\n      // find where the thumb was clicked on.\n      const thumbClickPosition = thumbRef.value[bar.value.offset] - prevPage\n      /**\n       *  +--------------+                                   +--------------+\n       *  |              -  <--------- thumb.offsetTop       |              |\n       *  |             |+|             <--+                 |              |\n       *  |              -                 |                 |              |\n       *  |   Content    |                 |                 |              |\n       *  |              |                 |                 |              |\n       *  |              |                 |                 |              |\n       *  |              |                 |                 |              -\n       *  |              |                 +-->              |             |+|\n       *  |              |                                   |              -\n       *  +--------------+                                   +--------------+\n       */\n\n      // using the current position - prev position to\n\n      const distance = offset - thumbClickPosition\n      // get how many steps in total.\n      // gap of 2 on top, 2 on bottom, in total 4.\n      // using totalSteps ÷ totalSize getting each step's size * distance to get the new\n      // scroll offset to scrollTo\n      frameHandle = rAF(() => {\n        state.traveled = Math.max(\n          props.startGap,\n          Math.min(\n            distance,\n            totalSteps.value // 2 is the top value\n          )\n        )\n        emit('scroll', distance, totalSteps.value)\n      })\n    }\n\n    const clickTrackHandler = (e: MouseEvent) => {\n      const offset = Math.abs(\n        (e.target as HTMLElement).getBoundingClientRect()[bar.value.direction] -\n          e[bar.value.client]\n      )\n      const thumbHalf = thumbRef.value![bar.value.offset] / 2\n      const distance = offset - thumbHalf\n\n      state.traveled = Math.max(0, Math.min(distance, totalSteps.value))\n      emit('scroll', distance, totalSteps.value)\n    }\n\n    watch(\n      () => props.scrollFrom,\n      (v) => {\n        if (state.isDragging) return\n        /**\n         *  this is simply mapping the current scrollbar offset\n         *\n         *  formula 1:\n         *    v = scrollOffset / (estimatedTotalSize - clientSize)\n         *    traveled = v * (clientSize - thumbSize - GAP) --> v * totalSteps\n         *\n         *  formula 2:\n         *    traveled = (v * clientSize) / (clientSize / totalSteps) --> (v * clientSize) * (totalSteps / clientSize) --> v * totalSteps\n         */\n        state.traveled = Math.ceil(v! * totalSteps.value)\n      }\n    )\n\n    onBeforeUnmount(() => {\n      detachEvents()\n    })\n\n    return () => {\n      return h(\n        'div',\n        {\n          role: 'presentation',\n          ref: trackRef,\n          class: [\n            nsVirtualScrollbar.b(),\n            props.class,\n            (props.alwaysOn || state.isDragging) && 'always-on',\n          ],\n          style: trackStyle.value,\n          onMousedown: withModifiers(clickTrackHandler, ['stop', 'prevent']),\n          onTouchstartPrevent: onThumbMouseDown,\n        },\n        h(\n          'div',\n          {\n            ref: thumbRef,\n            class: nsScrollbar.e('thumb'),\n            style: thumbStyle.value,\n            onMousedown: onThumbMouseDown,\n          },\n          []\n        )\n      )\n    }\n  },\n})\n\nexport default ScrollBar\n"],"names":[],"mappings":"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"}

package/es/components/virtual-list/src/defaults.d.ts

@@ -1,5 +1,5 @@
 export declare const DEFAULT_DYNAMIC_LIST_ITEM_SIZE = 50;
-export declare const ITEM_RENDER_EVT = "item-rendered";
+export declare const ITEM_RENDER_EVT = "itemRendered";
 export declare const SCROLL_EVT = "scroll";
 export declare const FORWARD = "forward";
 export declare const BACKWARD = "backward";

package/es/components/virtual-list/src/defaults.mjs

@@ -1,5 +1,5 @@
 const DEFAULT_DYNAMIC_LIST_ITEM_SIZE = 50;
-const ITEM_RENDER_EVT = "item-rendered";
+const ITEM_RENDER_EVT = "itemRendered";
 const SCROLL_EVT = "scroll";
 const FORWARD = "forward";
 const BACKWARD = "backward";

package/es/components/virtual-list/src/defaults.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"defaults.mjs","sources":["../../../../../../packages/components/virtual-list/src/defaults.ts"],"sourcesContent":["export const DEFAULT_DYNAMIC_LIST_ITEM_SIZE = 50\n\nexport const ITEM_RENDER_EVT = 'item-rendered'\nexport const SCROLL_EVT = 'scroll'\n\nexport const FORWARD = 'forward'\nexport const BACKWARD = 'backward'\n\nexport const AUTO_ALIGNMENT = 'auto'\nexport const SMART_ALIGNMENT = 'smart'\nexport const START_ALIGNMENT = 'start'\nexport const CENTERED_ALIGNMENT = 'center'\nexport const END_ALIGNMENT = 'end'\n\nexport const HORIZONTAL = 'horizontal'\nexport const VERTICAL = 'vertical'\n\nexport const LTR = 'ltr'\nexport const RTL = 'rtl'\n\nexport const RTL_OFFSET_NAG = 'negative'\nexport const RTL_OFFSET_POS_ASC = 'positive-ascending'\nexport const RTL_OFFSET_POS_DESC = 'positive-descending'\n\nexport const PageKey = {\n  [HORIZONTAL]: 'pageX',\n  [VERTICAL]: 'pageY',\n}\n\nexport const ScrollbarSizeKey = {\n  [HORIZONTAL]: 'height',\n  [VERTICAL]: 'width',\n}\n\nexport const ScrollbarDirKey = {\n  [HORIZONTAL]: 'left',\n  [VERTICAL]: 'top',\n}\n\nexport const SCROLLBAR_MIN_SIZE = 20\n"],"names":[],"mappings":"AAAY,MAAC,8BAA8B,GAAG,GAAG;AACrC,MAAC,eAAe,GAAG,gBAAgB;AACnC,MAAC,UAAU,GAAG,SAAS;AACvB,MAAC,OAAO,GAAG,UAAU;AACrB,MAAC,QAAQ,GAAG,WAAW;AACvB,MAAC,cAAc,GAAG,OAAO;AACzB,MAAC,eAAe,GAAG,QAAQ;AAC3B,MAAC,eAAe,GAAG,QAAQ;AAC3B,MAAC,kBAAkB,GAAG,SAAS;AAC/B,MAAC,aAAa,GAAG,MAAM;AACvB,MAAC,UAAU,GAAG,aAAa;AAC3B,MAAC,QAAQ,GAAG,WAAW;AACvB,MAAC,GAAG,GAAG,MAAM;AACb,MAAC,GAAG,GAAG,MAAM;AACb,MAAC,cAAc,GAAG,WAAW;AAC7B,MAAC,kBAAkB,GAAG,qBAAqB;AAC3C,MAAC,mBAAmB,GAAG,sBAAsB;AAC7C,MAAC,OAAO,GAAG;AACvB,EAAE,CAAC,UAAU,GAAG,OAAO;AACvB,EAAE,CAAC,QAAQ,GAAG,OAAO;AACrB,EAAE;AACU,MAAC,gBAAgB,GAAG;AAChC,EAAE,CAAC,UAAU,GAAG,QAAQ;AACxB,EAAE,CAAC,QAAQ,GAAG,OAAO;AACrB,EAAE;AACU,MAAC,eAAe,GAAG;AAC/B,EAAE,CAAC,UAAU,GAAG,MAAM;AACtB,EAAE,CAAC,QAAQ,GAAG,KAAK;AACnB,EAAE;AACU,MAAC,kBAAkB,GAAG;;;;"}
+{"version":3,"file":"defaults.mjs","sources":["../../../../../../packages/components/virtual-list/src/defaults.ts"],"sourcesContent":["export const DEFAULT_DYNAMIC_LIST_ITEM_SIZE = 50\n\nexport const ITEM_RENDER_EVT = 'itemRendered'\nexport const SCROLL_EVT = 'scroll'\n\nexport const FORWARD = 'forward'\nexport const BACKWARD = 'backward'\n\nexport const AUTO_ALIGNMENT = 'auto'\nexport const SMART_ALIGNMENT = 'smart'\nexport const START_ALIGNMENT = 'start'\nexport const CENTERED_ALIGNMENT = 'center'\nexport const END_ALIGNMENT = 'end'\n\nexport const HORIZONTAL = 'horizontal'\nexport const VERTICAL = 'vertical'\n\nexport const LTR = 'ltr'\nexport const RTL = 'rtl'\n\nexport const RTL_OFFSET_NAG = 'negative'\nexport const RTL_OFFSET_POS_ASC = 'positive-ascending'\nexport const RTL_OFFSET_POS_DESC = 'positive-descending'\n\nexport const PageKey = {\n  [HORIZONTAL]: 'pageX',\n  [VERTICAL]: 'pageY',\n}\n\nexport const ScrollbarSizeKey = {\n  [HORIZONTAL]: 'height',\n  [VERTICAL]: 'width',\n}\n\nexport const ScrollbarDirKey = {\n  [HORIZONTAL]: 'left',\n  [VERTICAL]: 'top',\n}\n\nexport const SCROLLBAR_MIN_SIZE = 20\n"],"names":[],"mappings":"AAAY,MAAC,8BAA8B,GAAG,GAAG;AACrC,MAAC,eAAe,GAAG,eAAe;AAClC,MAAC,UAAU,GAAG,SAAS;AACvB,MAAC,OAAO,GAAG,UAAU;AACrB,MAAC,QAAQ,GAAG,WAAW;AACvB,MAAC,cAAc,GAAG,OAAO;AACzB,MAAC,eAAe,GAAG,QAAQ;AAC3B,MAAC,eAAe,GAAG,QAAQ;AAC3B,MAAC,kBAAkB,GAAG,SAAS;AAC/B,MAAC,aAAa,GAAG,MAAM;AACvB,MAAC,UAAU,GAAG,aAAa;AAC3B,MAAC,QAAQ,GAAG,WAAW;AACvB,MAAC,GAAG,GAAG,MAAM;AACb,MAAC,GAAG,GAAG,MAAM;AACb,MAAC,cAAc,GAAG,WAAW;AAC7B,MAAC,kBAAkB,GAAG,qBAAqB;AAC3C,MAAC,mBAAmB,GAAG,sBAAsB;AAC7C,MAAC,OAAO,GAAG;AACvB,EAAE,CAAC,UAAU,GAAG,OAAO;AACvB,EAAE,CAAC,QAAQ,GAAG,OAAO;AACrB,EAAE;AACU,MAAC,gBAAgB,GAAG;AAChC,EAAE,CAAC,UAAU,GAAG,QAAQ;AACxB,EAAE,CAAC,QAAQ,GAAG,OAAO;AACrB,EAAE;AACU,MAAC,eAAe,GAAG;AAC/B,EAAE,CAAC,UAAU,GAAG,MAAM;AACtB,EAAE,CAAC,QAAQ,GAAG,KAAK;AACnB,EAAE;AACU,MAAC,kBAAkB,GAAG;;;;"}

package/es/components/virtual-list/src/hooks/use-grid-wheel.mjs

@@ -13,8 +13,13 @@ const useGridWheel = ({ atXEndEdge, atXStartEdge, atYEndEdge, atYStartEdge }, on
   };
   const onWheel = (e) => {
     cAF(frameHandle);
-    const x = e.deltaX;
-    const y = e.deltaY;
+    let x = e.deltaX;
+    let y = e.deltaY;
+    if (Math.abs(x) > Math.abs(y)) {
+      y = 0;
+    } else {
+      x = 0;
+    }
     if (hasReachedEdge(xOffset, yOffset) && hasReachedEdge(xOffset + x, yOffset + y))
       return;
     xOffset += x;

package/es/components/virtual-list/src/hooks/use-grid-wheel.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"use-grid-wheel.mjs","sources":["../../../../../../../packages/components/virtual-list/src/hooks/use-grid-wheel.ts"],"sourcesContent":["import { cAF, isFirefox, rAF } from '@element-plus/utils'\n\nimport type { ComputedRef } from 'vue'\n\ninterface GridWheelState {\n  atXStartEdge: ComputedRef<boolean>\n  atXEndEdge: ComputedRef<boolean>\n  atYStartEdge: ComputedRef<boolean>\n  atYEndEdge: ComputedRef<boolean>\n}\n\ntype GridWheelHandler = (x: number, y: number) => void\n\nexport const useGridWheel = (\n  { atXEndEdge, atXStartEdge, atYEndEdge, atYStartEdge }: GridWheelState,\n  onWheelDelta: GridWheelHandler\n) => {\n  let frameHandle: number | null = null\n  let xOffset = 0\n  let yOffset = 0\n\n  const hasReachedEdge = (x: number, y: number) => {\n    const xEdgeReached =\n      (x < 0 && atXStartEdge.value) || (x > 0 && atXEndEdge.value)\n    const yEdgeReached =\n      (y < 0 && atYStartEdge.value) || (y > 0 && atYEndEdge.value)\n    return xEdgeReached && yEdgeReached\n  }\n\n  const onWheel = (e: WheelEvent) => {\n    cAF(frameHandle!)\n\n    const x = e.deltaX\n    const y = e.deltaY\n\n    if (\n      hasReachedEdge(xOffset, yOffset) &&\n      hasReachedEdge(xOffset + x, yOffset + y)\n    )\n      return\n\n    xOffset += x\n    yOffset += y\n\n    if (!isFirefox()) {\n      e.preventDefault()\n    }\n\n    frameHandle = rAF(() => {\n      onWheelDelta(xOffset, yOffset)\n      xOffset = 0\n      yOffset = 0\n    })\n  }\n\n  return {\n    hasReachedEdge,\n    onWheel,\n  }\n}\n"],"names":[],"mappings":";;;;AACY,MAAC,YAAY,GAAG,CAAC,EAAE,UAAU,EAAE,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,EAAE,YAAY,KAAK;AACtG,EAAE,IAAI,WAAW,GAAG,IAAI,CAAC;AACzB,EAAE,IAAI,OAAO,GAAG,CAAC,CAAC;AAClB,EAAE,IAAI,OAAO,GAAG,CAAC,CAAC;AAClB,EAAE,MAAM,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK;AACnC,IAAI,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,IAAI,YAAY,CAAC,KAAK,IAAI,CAAC,GAAG,CAAC,IAAI,UAAU,CAAC,KAAK,CAAC;AAClF,IAAI,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,IAAI,YAAY,CAAC,KAAK,IAAI,CAAC,GAAG,CAAC,IAAI,UAAU,CAAC,KAAK,CAAC;AAClF,IAAI,OAAO,YAAY,IAAI,YAAY,CAAC;AACxC,GAAG,CAAC;AACJ,EAAE,MAAM,OAAO,GAAG,CAAC,CAAC,KAAK;AACzB,IAAI,GAAG,CAAC,WAAW,CAAC,CAAC;AACrB,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC;AACvB,IAAI,MAAM,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC;AACvB,IAAI,IAAI,cAAc,CAAC,OAAO,EAAE,OAAO,CAAC,IAAI,cAAc,CAAC,OAAO,GAAG,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC;AACpF,MAAM,OAAO;AACb,IAAI,OAAO,IAAI,CAAC,CAAC;AACjB,IAAI,OAAO,IAAI,CAAC,CAAC;AACjB,IAAI,IAAI,CAAC,SAAS,EAAE,EAAE;AACtB,MAAM,CAAC,CAAC,cAAc,EAAE,CAAC;AACzB,KAAK;AACL,IAAI,WAAW,GAAG,GAAG,CAAC,MAAM;AAC5B,MAAM,YAAY,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;AACrC,MAAM,OAAO,GAAG,CAAC,CAAC;AAClB,MAAM,OAAO,GAAG,CAAC,CAAC;AAClB,KAAK,CAAC,CAAC;AACP,GAAG,CAAC;AACJ,EAAE,OAAO;AACT,IAAI,cAAc;AAClB,IAAI,OAAO;AACX,GAAG,CAAC;AACJ;;;;"}
+{"version":3,"file":"use-grid-wheel.mjs","sources":["../../../../../../../packages/components/virtual-list/src/hooks/use-grid-wheel.ts"],"sourcesContent":["import { cAF, isFirefox, rAF } from '@element-plus/utils'\n\nimport type { ComputedRef } from 'vue'\n\ninterface GridWheelState {\n  atXStartEdge: ComputedRef<boolean>\n  atXEndEdge: ComputedRef<boolean>\n  atYStartEdge: ComputedRef<boolean>\n  atYEndEdge: ComputedRef<boolean>\n}\n\ntype GridWheelHandler = (x: number, y: number) => void\n\nexport const useGridWheel = (\n  { atXEndEdge, atXStartEdge, atYEndEdge, atYStartEdge }: GridWheelState,\n  onWheelDelta: GridWheelHandler\n) => {\n  let frameHandle: number | null = null\n  let xOffset = 0\n  let yOffset = 0\n\n  const hasReachedEdge = (x: number, y: number) => {\n    const xEdgeReached =\n      (x < 0 && atXStartEdge.value) || (x > 0 && atXEndEdge.value)\n    const yEdgeReached =\n      (y < 0 && atYStartEdge.value) || (y > 0 && atYEndEdge.value)\n    return xEdgeReached && yEdgeReached\n  }\n\n  const onWheel = (e: WheelEvent) => {\n    cAF(frameHandle!)\n\n    let x = e.deltaX\n    let y = e.deltaY\n    // Simulate native behavior when using touch pad/track pad for wheeling.\n    if (Math.abs(x) > Math.abs(y)) {\n      y = 0\n    } else {\n      x = 0\n    }\n\n    if (\n      hasReachedEdge(xOffset, yOffset) &&\n      hasReachedEdge(xOffset + x, yOffset + y)\n    )\n      return\n\n    xOffset += x\n    yOffset += y\n\n    if (!isFirefox()) {\n      e.preventDefault()\n    }\n\n    frameHandle = rAF(() => {\n      onWheelDelta(xOffset, yOffset)\n      xOffset = 0\n      yOffset = 0\n    })\n  }\n\n  return {\n    hasReachedEdge,\n    onWheel,\n  }\n}\n"],"names":[],"mappings":";;;;AACY,MAAC,YAAY,GAAG,CAAC,EAAE,UAAU,EAAE,YAAY,EAAE,UAAU,EAAE,YAAY,EAAE,EAAE,YAAY,KAAK;AACtG,EAAE,IAAI,WAAW,GAAG,IAAI,CAAC;AACzB,EAAE,IAAI,OAAO,GAAG,CAAC,CAAC;AAClB,EAAE,IAAI,OAAO,GAAG,CAAC,CAAC;AAClB,EAAE,MAAM,cAAc,GAAG,CAAC,CAAC,EAAE,CAAC,KAAK;AACnC,IAAI,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,IAAI,YAAY,CAAC,KAAK,IAAI,CAAC,GAAG,CAAC,IAAI,UAAU,CAAC,KAAK,CAAC;AAClF,IAAI,MAAM,YAAY,GAAG,CAAC,GAAG,CAAC,IAAI,YAAY,CAAC,KAAK,IAAI,CAAC,GAAG,CAAC,IAAI,UAAU,CAAC,KAAK,CAAC;AAClF,IAAI,OAAO,YAAY,IAAI,YAAY,CAAC;AACxC,GAAG,CAAC;AACJ,EAAE,MAAM,OAAO,GAAG,CAAC,CAAC,KAAK;AACzB,IAAI,GAAG,CAAC,WAAW,CAAC,CAAC;AACrB,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC;AACrB,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,MAAM,CAAC;AACrB,IAAI,IAAI,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,GAAG,IAAI,CAAC,GAAG,CAAC,CAAC,CAAC,EAAE;AACnC,MAAM,CAAC,GAAG,CAAC,CAAC;AACZ,KAAK,MAAM;AACX,MAAM,CAAC,GAAG,CAAC,CAAC;AACZ,KAAK;AACL,IAAI,IAAI,cAAc,CAAC,OAAO,EAAE,OAAO,CAAC,IAAI,cAAc,CAAC,OAAO,GAAG,CAAC,EAAE,OAAO,GAAG,CAAC,CAAC;AACpF,MAAM,OAAO;AACb,IAAI,OAAO,IAAI,CAAC,CAAC;AACjB,IAAI,OAAO,IAAI,CAAC,CAAC;AACjB,IAAI,IAAI,CAAC,SAAS,EAAE,EAAE;AACtB,MAAM,CAAC,CAAC,cAAc,EAAE,CAAC;AACzB,KAAK;AACL,IAAI,WAAW,GAAG,GAAG,CAAC,MAAM;AAC5B,MAAM,YAAY,CAAC,OAAO,EAAE,OAAO,CAAC,CAAC;AACrC,MAAM,OAAO,GAAG,CAAC,CAAC;AAClB,MAAM,OAAO,GAAG,CAAC,CAAC;AAClB,KAAK,CAAC,CAAC;AACP,GAAG,CAAC;AACJ,EAAE,OAAO;AACT,IAAI,cAAc;AAClB,IAAI,OAAO;AACX,GAAG,CAAC;AACJ;;;;"}

package/es/components/virtual-list/src/props.d.ts

@@ -54,13 +54,22 @@ export declare const virtualizedGridProps: {
     readonly rowHeight: import("element-pe/es/utils").BuildPropReturn<import("element-pe/es/utils").PropWrapper<number | ItemSize>, never, true, never, never>;
     readonly totalColumn: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, never, true, never, never>;
     readonly totalRow: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, never, true, never, never>;
+    readonly hScrollbarSize: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, 6, unknown, unknown, unknown>;
+    readonly vScrollbarSize: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, 6, unknown, unknown, unknown>;
+    readonly scrollbarStartGap: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, 2, unknown, unknown, unknown>;
+    readonly scrollbarEndGap: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, 2, unknown, unknown, unknown>;
 };
 export declare const virtualizedScrollbarProps: {
+    readonly alwaysOn: BooleanConstructor;
+    readonly class: StringConstructor;
     readonly layout: import("element-pe/es/utils").BuildPropReturn<StringConstructor, "vertical", false, "horizontal" | "vertical", never>;
     readonly total: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, never, true, never, never>;
     readonly ratio: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, unknown, true, unknown, unknown>;
     readonly clientSize: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, unknown, true, unknown, unknown>;
     readonly scrollFrom: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, unknown, true, unknown, unknown>;
+    readonly scrollbarSize: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, 6, unknown, unknown, unknown>;
+    readonly startGap: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, 2, unknown, unknown, unknown>;
+    readonly endGap: import("element-pe/es/utils").BuildPropReturn<NumberConstructor, 2, unknown, unknown, unknown>;
     readonly visible: BooleanConstructor;
 };
 export declare type VirtualizedProps = ExtractPropTypes<typeof virtualizedProps>;

package/es/components/virtual-list/src/props.mjs

@@ -83,6 +83,12 @@ const virtualizedListProps = buildProps({
   itemSize,
   ...virtualizedProps
 });
+const scrollbarSize = {
+  type: Number,
+  default: 6
+};
+const startGap = { type: Number, default: 2 };
+const endGap = { type: Number, default: 2 };
 const virtualizedGridProps = buildProps({
   columnCache: cache,
   columnWidth: itemSize,
@@ -94,9 +100,15 @@ const virtualizedGridProps = buildProps({
   rowHeight: itemSize,
   totalColumn: total,
   totalRow: total,
+  hScrollbarSize: scrollbarSize,
+  vScrollbarSize: scrollbarSize,
+  scrollbarStartGap: startGap,
+  scrollbarEndGap: endGap,
   ...virtualizedProps
 });
 const virtualizedScrollbarProps = buildProps({
+  alwaysOn: Boolean,
+  class: String,
   layout,
   total,
   ratio: {
@@ -111,6 +123,9 @@ const virtualizedScrollbarProps = buildProps({
     type: Number,
     required: true
   },
+  scrollbarSize,
+  startGap,
+  endGap,
   visible: Boolean
 });
 

package/es/components/virtual-list/src/props.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"props.mjs","sources":["../../../../../../packages/components/virtual-list/src/props.ts"],"sourcesContent":["import {\n  buildProp,\n  buildProps,\n  definePropType,\n  mutable,\n} from '@element-plus/utils'\nimport { VERTICAL } from './defaults'\n\nimport type { ExtractPropTypes, StyleValue } from 'vue'\nimport type { ItemSize } from './types'\n\nconst itemSize = buildProp({\n  type: definePropType<number | ItemSize>([Number, Function]),\n  required: true,\n} as const)\n\nconst estimatedItemSize = buildProp({\n  type: Number,\n} as const)\n\nconst cache = buildProp({\n  type: Number,\n  default: 2,\n} as const)\n\nconst direction = buildProp({\n  type: String,\n  values: ['ltr', 'rtl'],\n  default: 'ltr',\n} as const)\n\nconst initScrollOffset = buildProp({\n  type: Number,\n  default: 0,\n} as const)\n\nconst total = buildProp({\n  type: Number,\n  required: true,\n} as const)\n\nconst layout = buildProp({\n  type: String,\n  values: ['horizontal', 'vertical'],\n  default: VERTICAL,\n} as const)\n\nexport const virtualizedProps = buildProps({\n  className: {\n    type: String,\n    default: '',\n  },\n\n  containerElement: {\n    type: definePropType<string | Element>([String, Object]),\n    default: 'div',\n  },\n\n  data: {\n    type: definePropType<any[]>(Array),\n    default: () => mutable([] as const),\n  },\n\n  /**\n   * @description controls the horizontal direction.\n   */\n  direction,\n\n  height: {\n    type: [String, Number],\n    required: true,\n  },\n\n  innerElement: {\n    type: [String, Object],\n    default: 'div',\n  },\n\n  style: {\n    type: definePropType<StyleValue>([Object, String, Array]),\n  },\n\n  useIsScrolling: {\n    type: Boolean,\n    default: false,\n  },\n\n  width: {\n    type: [Number, String],\n    required: false,\n  },\n\n  perfMode: {\n    type: Boolean,\n    default: true,\n  },\n  scrollbarAlwaysOn: {\n    type: Boolean,\n    default: false,\n  },\n} as const)\n\nexport const virtualizedListProps = buildProps({\n  /**\n   * @description describes how many items should be pre rendered to the head\n   * and the tail of the window\n   */\n  cache,\n\n  estimatedItemSize,\n\n  /**\n   * @description controls the list's orientation\n   */\n  layout,\n\n  initScrollOffset,\n\n  /**\n   * @description describes the total number of the list.\n   */\n  total,\n\n  itemSize,\n  ...virtualizedProps,\n} as const)\n\nexport const virtualizedGridProps = buildProps({\n  columnCache: cache,\n  columnWidth: itemSize,\n  estimatedColumnWidth: estimatedItemSize,\n  estimatedRowHeight: estimatedItemSize,\n  initScrollLeft: initScrollOffset,\n  initScrollTop: initScrollOffset,\n  rowCache: cache,\n  rowHeight: itemSize,\n  totalColumn: total,\n  totalRow: total,\n  ...virtualizedProps,\n} as const)\n\nexport const virtualizedScrollbarProps = buildProps({\n  layout,\n  total,\n  ratio: {\n    type: Number,\n    required: true,\n  },\n  clientSize: {\n    type: Number,\n    required: true,\n  },\n  scrollFrom: {\n    type: Number,\n    required: true,\n  },\n  visible: Boolean,\n} as const)\n\nexport type VirtualizedProps = ExtractPropTypes<typeof virtualizedProps>\nexport type VirtualizedListProps = ExtractPropTypes<typeof virtualizedListProps>\nexport type VirtualizedGridProps = ExtractPropTypes<typeof virtualizedGridProps>\n\nexport type VirtualizedScrollbarProps = ExtractPropTypes<\n  typeof virtualizedScrollbarProps\n>\n"],"names":[],"mappings":";;;;;AAOA,MAAM,QAAQ,GAAG,SAAS,CAAC;AAC3B,EAAE,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,QAAQ,CAAC,CAAC;AAC1C,EAAE,QAAQ,EAAE,IAAI;AAChB,CAAC,CAAC,CAAC;AACH,MAAM,iBAAiB,GAAG,SAAS,CAAC;AACpC,EAAE,IAAI,EAAE,MAAM;AACd,CAAC,CAAC,CAAC;AACH,MAAM,KAAK,GAAG,SAAS,CAAC;AACxB,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC,CAAC;AACH,MAAM,SAAS,GAAG,SAAS,CAAC;AAC5B,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,MAAM,EAAE,CAAC,KAAK,EAAE,KAAK,CAAC;AACxB,EAAE,OAAO,EAAE,KAAK;AAChB,CAAC,CAAC,CAAC;AACH,MAAM,gBAAgB,GAAG,SAAS,CAAC;AACnC,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,OAAO,EAAE,CAAC;AACZ,CAAC,CAAC,CAAC;AACH,MAAM,KAAK,GAAG,SAAS,CAAC;AACxB,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,QAAQ,EAAE,IAAI;AAChB,CAAC,CAAC,CAAC;AACH,MAAM,MAAM,GAAG,SAAS,CAAC;AACzB,EAAE,IAAI,EAAE,MAAM;AACd,EAAE,MAAM,EAAE,CAAC,YAAY,EAAE,UAAU,CAAC;AACpC,EAAE,OAAO,EAAE,QAAQ;AACnB,CAAC,CAAC,CAAC;AACS,MAAC,gBAAgB,GAAG,UAAU,CAAC;AAC3C,EAAE,SAAS,EAAE;AACb,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,OAAO,EAAE,EAAE;AACf,GAAG;AACH,EAAE,gBAAgB,EAAE;AACpB,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;AAC1C,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,IAAI,EAAE;AACR,IAAI,IAAI,EAAE,cAAc,CAAC,KAAK,CAAC;AAC/B,IAAI,OAAO,EAAE,MAAM,OAAO,CAAC,EAAE,CAAC;AAC9B,GAAG;AACH,EAAE,SAAS;AACX,EAAE,MAAM,EAAE;AACV,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,QAAQ,EAAE,IAAI;AAClB,GAAG;AACH,EAAE,YAAY,EAAE;AAChB,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,cAAc,CAAC,CAAC,MAAM,EAAE,MAAM,EAAE,KAAK,CAAC,CAAC;AACjD,GAAG;AACH,EAAE,cAAc,EAAE;AAClB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,CAAC,MAAM,EAAE,MAAM,CAAC;AAC1B,IAAI,QAAQ,EAAE,KAAK;AACnB,GAAG;AACH,EAAE,QAAQ,EAAE;AACZ,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,IAAI;AACjB,GAAG;AACH,EAAE,iBAAiB,EAAE;AACrB,IAAI,IAAI,EAAE,OAAO;AACjB,IAAI,OAAO,EAAE,KAAK;AAClB,GAAG;AACH,CAAC,EAAE;AACS,MAAC,oBAAoB,GAAG,UAAU,CAAC;AAC/C,EAAE,KAAK;AACP,EAAE,iBAAiB;AACnB,EAAE,MAAM;AACR,EAAE,gBAAgB;AAClB,EAAE,KAAK;AACP,EAAE,QAAQ;AACV,EAAE,GAAG,gBAAgB;AACrB,CAAC,EAAE;AACS,MAAC,oBAAoB,GAAG,UAAU,CAAC;AAC/C,EAAE,WAAW,EAAE,KAAK;AACpB,EAAE,WAAW,EAAE,QAAQ;AACvB,EAAE,oBAAoB,EAAE,iBAAiB;AACzC,EAAE,kBAAkB,EAAE,iBAAiB;AACvC,EAAE,cAAc,EAAE,gBAAgB;AAClC,EAAE,aAAa,EAAE,gBAAgB;AACjC,EAAE,QAAQ,EAAE,KAAK;AACjB,EAAE,SAAS,EAAE,QAAQ;AACrB,EAAE,WAAW,EAAE,KAAK;AACpB,EAAE,QAAQ,EAAE,KAAK;AACjB,EAAE,GAAG,gBAAgB;AACrB,CAAC,EAAE;AACS,MAAC,yBAAyB,GAAG,UAAU,CAAC;AACpD,EAAE,MAAM;AACR,EAAE,KAAK;AACP,EAAE,KAAK,EAAE;AACT,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,QAAQ,EAAE,IAAI;AAClB,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,QAAQ,EAAE,IAAI;AAClB,GAAG;AACH,EAAE,UAAU,EAAE;AACd,IAAI,IAAI,EAAE,MAAM;AAChB,IAAI,QAAQ,EAAE,IAAI;AAClB,GAAG;AACH,EAAE,OAAO,EAAE,OAAO;AAClB,CAAC;;;;"}
+{"version":3,"file":"props.mjs","sources":["../../../../../../packages/components/virtual-list/src/props.ts"],"sourcesContent":["import {\n  buildProp,\n  buildProps,\n  definePropType,\n  mutable,\n} from '@element-plus/utils'\nimport { VERTICAL } from './defaults'\n\nimport type { ExtractPropTypes, StyleValue } from 'vue'\nimport type { ItemSize } from './types'\n\nconst itemSize = buildProp({\n  type: definePropType<number | ItemSize>([Number, Function]),\n  required: true,\n} as const)\n\nconst estimatedItemSize = buildProp({\n  type: Number,\n} as const)\n\nconst cache = buildProp({\n  type: Number,\n  default: 2,\n} as const)\n\nconst direction = buildProp({\n  type: String,\n  values: ['ltr', 'rtl'],\n  default: 'ltr',\n} as const)\n\nconst initScrollOffset = buildProp({\n  type: Number,\n  default: 0,\n} as const)\n\nconst total = buildProp({\n  type: Number,\n  required: true,\n} as const)\n\nconst layout = buildProp({\n  type: String,\n  values: ['horizontal', 'vertical'],\n  default: VERTICAL,\n} as const)\n\nexport const virtualizedProps = buildProps({\n  className: {\n    type: String,\n    default: '',\n  },\n\n  containerElement: {\n    type: definePropType<string | Element>([String, Object]),\n    default: 'div',\n  },\n\n  data: {\n    type: definePropType<any[]>(Array),\n    default: () => mutable([] as const),\n  },\n\n  /**\n   * @description controls the horizontal direction.\n   */\n  direction,\n\n  height: {\n    type: [String, Number],\n    required: true,\n  },\n\n  innerElement: {\n    type: [String, Object],\n    default: 'div',\n  },\n\n  style: {\n    type: definePropType<StyleValue>([Object, String, Array]),\n  },\n\n  useIsScrolling: {\n    type: Boolean,\n    default: false,\n  },\n\n  width: {\n    type: [Number, String],\n    required: false,\n  },\n\n  perfMode: {\n    type: Boolean,\n    default: true,\n  },\n  scrollbarAlwaysOn: {\n    type: Boolean,\n    default: false,\n  },\n} as const)\n\nexport const virtualizedListProps = buildProps({\n  /**\n   * @description describes how many items should be pre rendered to the head\n   * and the tail of the window\n   */\n  cache,\n\n  estimatedItemSize,\n\n  /**\n   * @description controls the list's orientation\n   */\n  layout,\n\n  initScrollOffset,\n\n  /**\n   * @description describes the total number of the list.\n   */\n  total,\n\n  itemSize,\n  ...virtualizedProps,\n} as const)\n\nconst scrollbarSize = {\n  type: Number,\n  default: 6,\n} as const\n\nconst startGap = { type: Number, default: 2 } as const\nconst endGap = { type: Number, default: 2 } as const\n\nexport const virtualizedGridProps = buildProps({\n  columnCache: cache,\n  columnWidth: itemSize,\n  estimatedColumnWidth: estimatedItemSize,\n  estimatedRowHeight: estimatedItemSize,\n  initScrollLeft: initScrollOffset,\n  initScrollTop: initScrollOffset,\n  rowCache: cache,\n  rowHeight: itemSize,\n  totalColumn: total,\n  totalRow: total,\n  hScrollbarSize: scrollbarSize,\n  vScrollbarSize: scrollbarSize,\n  scrollbarStartGap: startGap,\n  scrollbarEndGap: endGap,\n  ...virtualizedProps,\n} as const)\n\nexport const virtualizedScrollbarProps = buildProps({\n  alwaysOn: Boolean,\n  class: String,\n  layout,\n  total,\n  ratio: {\n    type: Number,\n    required: true,\n  },\n  clientSize: {\n    type: Number,\n    required: true,\n  },\n  scrollFrom: {\n    type: Number,\n    required: true,\n  },\n  scrollbarSize,\n  startGap,\n  endGap,\n\n  visible: Boolean,\n} as const)\n\nexport type VirtualizedProps = ExtractPropTypes<typeof virtualizedProps>\nexport type VirtualizedListProps = ExtractPropTypes<typeof virtualizedListProps>\nexport type VirtualizedGridProps = ExtractPropTypes<typeof virtualizedGridProps>\n\nexport type VirtualizedScrollbarProps = ExtractPropTypes<\n  typeof virtualizedScrollbarProps\n>\n"],"names":[],"mappings":"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"}

package/es/components/virtual-list/src/types.d.ts

@@ -99,6 +99,7 @@ export declare type GridConstructorProps<T, P extends InitGridCacheFunc<T> = Ini
     getRowStartIndexForOffset: GetStartIndexForOffset<T, P>;
     getRowStopIndexForStartIndex: GetStopIndexForStartIndex<T, P>;
     initCache: P;
+    injectToInstance?: (instance: Instance, cache: Ref<ReturnType<P>>) => void;
     clearCache: boolean;
     validateProps: PropValidator<T>;
 };
@@ -123,3 +124,7 @@ export declare type GridItemRenderedEvtParams = {
     rowVisibleStart: number;
     rowVisibleEnd: number;
 };
+export declare type GridScrollOptions = {
+    scrollLeft?: number;
+    scrollTop?: number;
+};

package/es/index.mjs

@@ -7,29 +7,29 @@ import './hooks/index.mjs';
 import './tokens/index.mjs';
 export { makeInstaller } from './make-installer.mjs';
 export { default as dayjs } from 'dayjs';
-export { affixEmits, affixProps } from './components/affix/src/affix2.mjs';
+export { affixEmits, affixProps } from './components/affix/src/affix.mjs';
 export { ElAffix } from './components/affix/index.mjs';
-export { alertEffects, alertEmits, alertProps } from './components/alert/src/alert.mjs';
+export { alertEffects, alertEmits, alertProps } from './components/alert/src/alert2.mjs';
 export { ElAlert } from './components/alert/index.mjs';
-export { autocompleteEmits, autocompleteProps } from './components/autocomplete/src/autocomplete2.mjs';
+export { autocompleteEmits, autocompleteProps } from './components/autocomplete/src/autocomplete.mjs';
 export { ElAutocomplete } from './components/autocomplete/index.mjs';
-export { avatarEmits, avatarProps } from './components/avatar/src/avatar.mjs';
+export { avatarEmits, avatarProps } from './components/avatar/src/avatar2.mjs';
 export { ElAvatar } from './components/avatar/index.mjs';
-export { backtopEmits, backtopProps } from './components/backtop/src/backtop2.mjs';
+export { backtopEmits, backtopProps } from './components/backtop/src/backtop.mjs';
 export { ElBacktop } from './components/backtop/index.mjs';
-export { badgeProps } from './components/badge/src/badge.mjs';
+export { badgeProps } from './components/badge/src/badge2.mjs';
 export { ElBadge } from './components/badge/index.mjs';
-export { breadcrumbProps } from './components/breadcrumb/src/breadcrumb2.mjs';
-export { breadcrumbItemProps } from './components/breadcrumb/src/breadcrumb-item.mjs';
+export { breadcrumbProps } from './components/breadcrumb/src/breadcrumb.mjs';
+export { breadcrumbItemProps } from './components/breadcrumb/src/breadcrumb-item2.mjs';
 export { ElBreadcrumb, ElBreadcrumbItem } from './components/breadcrumb/index.mjs';
-export { buttonEmits, buttonNativeTypes, buttonProps, buttonTypes } from './components/button/src/button2.mjs';
+export { buttonEmits, buttonNativeTypes, buttonProps, buttonTypes } from './components/button/src/button.mjs';
 export { ElButton, ElButtonGroup } from './components/button/index.mjs';
 export { calendarEmits, calendarProps } from './components/calendar/src/calendar.mjs';
 export { ElCalendar } from './components/calendar/index.mjs';
-export { cardProps } from './components/card/src/card.mjs';
+export { cardProps } from './components/card/src/card2.mjs';
 export { ElCard } from './components/card/index.mjs';
-export { carouselEmits, carouselProps } from './components/carousel/src/carousel.mjs';
-export { carouselItemProps } from './components/carousel/src/carousel-item2.mjs';
+export { carouselEmits, carouselProps } from './components/carousel/src/carousel2.mjs';
+export { carouselItemProps } from './components/carousel/src/carousel-item.mjs';
 export { ElCarousel, ElCarouselItem } from './components/carousel/index.mjs';
 export { ElCascader } from './components/cascader/index.mjs';
 export { CASCADER_PANEL_INJECTION_KEY, ExpandTrigger } from './components/cascader-panel/src/types.mjs';
@@ -53,9 +53,9 @@ export { ElDescriptions, ElDescriptionsItem } from './components/descriptions/in
 export { useDialog } from './components/dialog/src/use-dialog.mjs';
 export { dialogEmits, dialogProps } from './components/dialog/src/dialog2.mjs';
 export { ElDialog } from './components/dialog/index.mjs';
-export { dividerProps } from './components/divider/src/divider2.mjs';
+export { dividerProps } from './components/divider/src/divider.mjs';
 export { ElDivider } from './components/divider/index.mjs';
-export { drawerEmits, drawerProps } from './components/drawer/src/drawer.mjs';
+export { drawerEmits, drawerProps } from './components/drawer/src/drawer2.mjs';
 export { ElDrawer } from './components/drawer/index.mjs';
 export { DROPDOWN_COLLECTION_INJECTION_KEY, DROPDOWN_COLLECTION_ITEM_INJECTION_KEY, ElCollection, ElCollectionItem, FIRST_KEYS, FIRST_LAST_KEYS, LAST_KEYS, dropdownItemProps, dropdownMenuProps, dropdownProps } from './components/dropdown/src/dropdown.mjs';
 export { DROPDOWN_INJECTION_KEY } from './components/dropdown/src/tokens.mjs';
@@ -65,26 +65,26 @@ export { ElEmpty } from './components/empty/index.mjs';
 export { formEmits, formProps } from './components/form/src/form.mjs';
 export { formItemProps, formItemValidateStates } from './components/form/src/form-item.mjs';
 export { ElForm, ElFormItem } from './components/form/index.mjs';
-export { iconProps } from './components/icon/src/icon2.mjs';
+export { iconProps } from './components/icon/src/icon.mjs';
 export { ElIcon } from './components/icon/index.mjs';
 export { imageEmits, imageProps } from './components/image/src/image2.mjs';
 export { ElImage } from './components/image/index.mjs';
-export { imageViewerEmits, imageViewerProps } from './components/image-viewer/src/image-viewer2.mjs';
+export { imageViewerEmits, imageViewerProps } from './components/image-viewer/src/image-viewer.mjs';
 export { ElImageViewer } from './components/image-viewer/index.mjs';
-export { inputEmits, inputProps } from './components/input/src/input.mjs';
+export { inputEmits, inputProps } from './components/input/src/input2.mjs';
 export { ElInput } from './components/input/index.mjs';
-export { inputNumberEmits, inputNumberProps } from './components/input-number/src/input-number2.mjs';
+export { inputNumberEmits, inputNumberProps } from './components/input-number/src/input-number.mjs';
 export { ElInputNumber } from './components/input-number/index.mjs';
-export { linkEmits, linkProps } from './components/link/src/link2.mjs';
+export { linkEmits, linkProps } from './components/link/src/link.mjs';
 export { ElLink } from './components/link/index.mjs';
 export { menuEmits, menuProps } from './components/menu/src/menu.mjs';
-export { menuItemEmits, menuItemProps } from './components/menu/src/menu-item2.mjs';
+export { menuItemEmits, menuItemProps } from './components/menu/src/menu-item.mjs';
 export { menuItemGroupProps } from './components/menu/src/menu-item-group.mjs';
 export { subMenuProps } from './components/menu/src/sub-menu.mjs';
 export { ElMenu, ElMenuItem, ElMenuItemGroup, ElSubMenu } from './components/menu/index.mjs';
 export { overlayEmits, overlayProps } from './components/overlay/src/overlay.mjs';
 export { ElOverlay } from './components/overlay/index.mjs';
-export { pageHeaderEmits, pageHeaderProps } from './components/page-header/src/page-header2.mjs';
+export { pageHeaderEmits, pageHeaderProps } from './components/page-header/src/page-header.mjs';
 export { ElPageHeader } from './components/page-header/index.mjs';
 export { paginationEmits, paginationProps } from './components/pagination/src/pagination.mjs';
 export { ElPagination } from './components/pagination/index.mjs';
@@ -92,28 +92,28 @@ export { popconfirmProps } from './components/popconfirm/src/popconfirm.mjs';
 export { ElPopconfirm } from './components/popconfirm/index.mjs';
 export { useDeprecateAppendToBody } from './components/popper/src/deprecation.mjs';
 export { Effect, usePopperProps } from './components/popper/src/popper.mjs';
-export { usePopperTriggerProps } from './components/popper/src/trigger.mjs';
+export { usePopperTriggerProps } from './components/popper/src/trigger2.mjs';
 export { usePopperContentProps, usePopperCoreConfigProps } from './components/popper/src/content.mjs';
 export { usePopperArrowProps } from './components/popper/src/arrow2.mjs';
 export { default as ElPopperArrow } from './components/popper/src/arrow.mjs';
-export { default as ElPopperTrigger } from './components/popper/src/trigger2.mjs';
+export { default as ElPopperTrigger } from './components/popper/src/trigger.mjs';
 export { default as ElPopperContent } from './components/popper/src/content2.mjs';
 export { ElPopper } from './components/popper/index.mjs';
-export { progressProps } from './components/progress/src/progress2.mjs';
+export { progressProps } from './components/progress/src/progress.mjs';
 export { ElProgress } from './components/progress/index.mjs';
-export { radioEmits, radioProps, radioPropsBase, useRadio } from './components/radio/src/radio.mjs';
+export { radioEmits, radioProps, radioPropsBase, useRadio } from './components/radio/src/radio2.mjs';
 export { radioGroupEmits, radioGroupProps } from './components/radio/src/radio-group.mjs';
 export { radioButtonProps } from './components/radio/src/radio-button.mjs';
 export { ElRadio, ElRadioButton, ElRadioGroup } from './components/radio/index.mjs';
 export { rateEmits, rateProps } from './components/rate/src/rate2.mjs';
 export { ElRate } from './components/rate/index.mjs';
-export { IconComponentMap, IconMap, resultProps } from './components/result/src/result.mjs';
+export { IconComponentMap, IconMap, resultProps } from './components/result/src/result2.mjs';
 export { ElResult } from './components/result/index.mjs';
 export { rowProps } from './components/row/src/row.mjs';
 export { ElRow } from './components/row/index.mjs';
 export { BAR_MAP, renderThumbStyle } from './components/scrollbar/src/util.mjs';
-export { scrollbarEmits, scrollbarProps } from './components/scrollbar/src/scrollbar.mjs';
-export { thumbProps } from './components/scrollbar/src/thumb.mjs';
+export { scrollbarEmits, scrollbarProps } from './components/scrollbar/src/scrollbar2.mjs';
+export { thumbProps } from './components/scrollbar/src/thumb2.mjs';
 export { ElScrollbar } from './components/scrollbar/index.mjs';
 export { selectGroupKey, selectKey } from './components/select/src/token.mjs';
 export { ElOption, ElOptionGroup, ElSelect } from './components/select/index.mjs';
@@ -127,15 +127,15 @@ export { spaceProps } from './components/space/src/space.mjs';
 export { useSpace } from './components/space/src/use-space.mjs';
 export { ElSpace } from './components/space/index.mjs';
 export { ElStep, ElSteps } from './components/steps/index.mjs';
-export { switchEmits, switchProps } from './components/switch/src/switch2.mjs';
+export { switchEmits, switchProps } from './components/switch/src/switch.mjs';
 export { ElSwitch } from './components/switch/index.mjs';
 export { ElTable, ElTableColumn } from './components/table/index.mjs';
 export { tabsEmits, tabsProps } from './components/tabs/src/tabs.mjs';
-export { tabBarProps } from './components/tabs/src/tab-bar2.mjs';
+export { tabBarProps } from './components/tabs/src/tab-bar.mjs';
 export { tabNavProps } from './components/tabs/src/tab-nav.mjs';
 export { tabPaneProps } from './components/tabs/src/tab-pane2.mjs';
 export { ElTabPane, ElTabs } from './components/tabs/index.mjs';
-export { tagEmits, tagProps } from './components/tag/src/tag.mjs';
+export { tagEmits, tagProps } from './components/tag/src/tag2.mjs';
 export { ElTag } from './components/tag/index.mjs';
 export { extractDateFormat, extractTimeFormat, rangeArr } from './components/time-picker/src/common/date-utils.mjs';
 export { DEFAULT_FORMATS_DATE, DEFAULT_FORMATS_DATEPICKER, DEFAULT_FORMATS_TIME } from './components/time-picker/src/common/constant.mjs';
@@ -155,7 +155,7 @@ export { ElTree } from './components/tree/index.mjs';
 export { ElTreeSelect } from './components/tree-select/index.mjs';
 export { ElTreeV2 } from './components/tree-v2/index.mjs';
 export { genFileId, uploadBaseProps, uploadListTypes, uploadProps } from './components/upload/src/upload.mjs';
-export { uploadContentProps } from './components/upload/src/upload-content.mjs';
+export { uploadContentProps } from './components/upload/src/upload-content2.mjs';
 export { uploadListEmits, uploadListProps } from './components/upload/src/upload-list.mjs';
 export { uploadDraggerEmits, uploadDraggerProps } from './components/upload/src/upload-dragger.mjs';
 export { ElUpload } from './components/upload/index.mjs';

package/es/utils/animation.mjs

@@ -1,4 +1,6 @@
-const cubic = (value) => value ** 3;
+const cubic = (value) => {
+  return value ** 3;
+};
 const easeInOutCubic = (value) => value < 0.5 ? cubic(value * 2) / 2 : 1 - cubic((1 - value) * 2) / 2;
 
 export { cubic, easeInOutCubic };

package/es/utils/animation.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"animation.mjs","sources":["../../../../packages/utils/animation.ts"],"sourcesContent":["export const cubic = (value: number): number => value ** 3\n\nexport const easeInOutCubic = (value: number): number =>\n  value < 0.5 ? cubic(value * 2) / 2 : 1 - cubic((1 - value) * 2) / 2\n"],"names":[],"mappings":"AAAY,MAAC,KAAK,GAAG,CAAC,KAAK,KAAK,KAAK,IAAI,EAAE;AAC/B,MAAC,cAAc,GAAG,CAAC,KAAK,KAAK,KAAK,GAAG,GAAG,GAAG,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,GAAG;;;;"}
+{"version":3,"file":"animation.mjs","sources":["../../../../packages/utils/animation.ts"],"sourcesContent":["export const cubic = (value: number): number => {\n  return value ** 3\n}\n\nexport const easeInOutCubic = (value: number): number =>\n  value < 0.5 ? cubic(value * 2) / 2 : 1 - cubic((1 - value) * 2) / 2\n"],"names":[],"mappings":"AAAY,MAAC,KAAK,GAAG,CAAC,KAAK,KAAK;AAChC,EAAE,OAAO,KAAK,IAAI,CAAC,CAAC;AACpB,EAAE;AACU,MAAC,cAAc,GAAG,CAAC,KAAK,KAAK,KAAK,GAAG,GAAG,GAAG,KAAK,CAAC,KAAK,GAAG,CAAC,CAAC,GAAG,CAAC,GAAG,CAAC,GAAG,KAAK,CAAC,CAAC,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,GAAG;;;;"}

package/es/version.d.ts

@@ -1 +1 @@
-export declare const version = "2.0.0";
+export declare const version = "2.0.7";

package/es/version.mjs

@@ -1,4 +1,4 @@
-const version = "2.0.0";
+const version = "2.0.7";
 
 export { version };
 //# sourceMappingURL=version.mjs.map

package/es/version.mjs.map

@@ -1 +1 @@
-{"version":3,"file":"version.mjs","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '2.0.0'\n"],"names":[],"mappings":"AAAY,MAAC,OAAO,GAAG;;;;"}
+{"version":3,"file":"version.mjs","sources":["../../../packages/element-plus/version.ts"],"sourcesContent":["export const version = '2.0.7'\n"],"names":[],"mappings":"AAAY,MAAC,OAAO,GAAG;;;;"}

package/lib/components/affix/index.js

@@ -3,8 +3,8 @@
 Object.defineProperty(exports, '__esModule', { value: true });
 
 require('../../utils/index.js');
-var affix$1 = require('./src/affix.js');
-var affix = require('./src/affix2.js');
+var affix$1 = require('./src/affix2.js');
+var affix = require('./src/affix.js');
 var install = require('../../utils/vue/install.js');
 
 const ElAffix = install.withInstall(affix$1["default"]);