element-plus-secondary 0.0.0-dev.1

package/lib/components/virtual-list/src/components/scrollbar.js

@@ -0,0 +1,164 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+require('../../../scrollbar/index.js');
+require('../../../../utils/index.js');
+require('../../../../hooks/index.js');
+var defaults = require('../defaults.js');
+var props = require('../props.js');
+var utils = require('../utils.js');
+var index = require('../../../../hooks/use-namespace/index.js');
+var util = require('../../../scrollbar/src/util.js');
+var raf = require('../../../../utils/raf.js');
+
+const ScrollBar = vue.defineComponent({
+  name: "ElVirtualScrollBar",
+  props: props.virtualizedScrollbarProps,
+  emits: ["scroll", "start-move", "stop-move"],
+  setup(props, { emit }) {
+    const GAP = vue.computed(() => props.startGap + props.endGap);
+    const nsVirtualScrollbar = index.useNamespace("virtual-scrollbar");
+    const nsScrollbar = index.useNamespace("scrollbar");
+    const trackRef = vue.ref();
+    const thumbRef = vue.ref();
+    let frameHandle = null;
+    let onselectstartStore = null;
+    const state = vue.reactive({
+      isDragging: false,
+      traveled: 0
+    });
+    const bar = vue.computed(() => util.BAR_MAP[props.layout]);
+    const trackSize = vue.computed(() => props.clientSize - vue.unref(GAP));
+    const trackStyle = vue.computed(() => ({
+      position: "absolute",
+      width: `${defaults.HORIZONTAL === props.layout ? trackSize.value : props.scrollbarSize}px`,
+      height: `${defaults.HORIZONTAL === props.layout ? props.scrollbarSize : trackSize.value}px`,
+      [defaults.ScrollbarDirKey[props.layout]]: "2px",
+      right: "2px",
+      bottom: "2px",
+      borderRadius: "4px"
+    }));
+    const thumbSize = vue.computed(() => {
+      const ratio = props.ratio;
+      const clientSize = props.clientSize;
+      if (ratio >= 100) {
+        return Number.POSITIVE_INFINITY;
+      }
+      if (ratio >= 50) {
+        return ratio * clientSize / 100;
+      }
+      const SCROLLBAR_MAX_SIZE = clientSize / 3;
+      return Math.floor(Math.min(Math.max(ratio * clientSize, defaults.SCROLLBAR_MIN_SIZE), SCROLLBAR_MAX_SIZE));
+    });
+    const thumbStyle = vue.computed(() => {
+      if (!Number.isFinite(thumbSize.value)) {
+        return {
+          display: "none"
+        };
+      }
+      const thumb = `${thumbSize.value}px`;
+      const style = utils.renderThumbStyle({
+        bar: bar.value,
+        size: thumb,
+        move: state.traveled
+      }, props.layout);
+      return style;
+    });
+    const totalSteps = vue.computed(() => Math.floor(props.clientSize - thumbSize.value - vue.unref(GAP)));
+    const attachEvents = () => {
+      window.addEventListener("mousemove", onMouseMove);
+      window.addEventListener("mouseup", onMouseUp);
+      const thumbEl = vue.unref(thumbRef);
+      if (!thumbEl)
+        return;
+      onselectstartStore = document.onselectstart;
+      document.onselectstart = () => false;
+      thumbEl.addEventListener("touchmove", onMouseMove);
+      thumbEl.addEventListener("touchend", onMouseUp);
+    };
+    const detachEvents = () => {
+      window.removeEventListener("mousemove", onMouseMove);
+      window.removeEventListener("mouseup", onMouseUp);
+      document.onselectstart = onselectstartStore;
+      onselectstartStore = null;
+      const thumbEl = vue.unref(thumbRef);
+      if (!thumbEl)
+        return;
+      thumbEl.removeEventListener("touchmove", onMouseMove);
+      thumbEl.removeEventListener("touchend", onMouseUp);
+    };
+    const onThumbMouseDown = (e) => {
+      e.stopImmediatePropagation();
+      if (e.ctrlKey || [1, 2].includes(e.button)) {
+        return;
+      }
+      state.isDragging = true;
+      state[bar.value.axis] = e.currentTarget[bar.value.offset] - (e[bar.value.client] - e.currentTarget.getBoundingClientRect()[bar.value.direction]);
+      emit("start-move");
+      attachEvents();
+    };
+    const onMouseUp = () => {
+      state.isDragging = false;
+      state[bar.value.axis] = 0;
+      emit("stop-move");
+      detachEvents();
+    };
+    const onMouseMove = (e) => {
+      const { isDragging } = state;
+      if (!isDragging)
+        return;
+      if (!thumbRef.value || !trackRef.value)
+        return;
+      const prevPage = state[bar.value.axis];
+      if (!prevPage)
+        return;
+      raf.cAF(frameHandle);
+      const offset = (trackRef.value.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]) * -1;
+      const thumbClickPosition = thumbRef.value[bar.value.offset] - prevPage;
+      const distance = offset - thumbClickPosition;
+      frameHandle = raf.rAF(() => {
+        state.traveled = Math.max(props.startGap, Math.min(distance, totalSteps.value));
+        emit("scroll", distance, totalSteps.value);
+      });
+    };
+    const clickTrackHandler = (e) => {
+      const offset = Math.abs(e.target.getBoundingClientRect()[bar.value.direction] - e[bar.value.client]);
+      const thumbHalf = thumbRef.value[bar.value.offset] / 2;
+      const distance = offset - thumbHalf;
+      state.traveled = Math.max(0, Math.min(distance, totalSteps.value));
+      emit("scroll", distance, totalSteps.value);
+    };
+    vue.watch(() => props.scrollFrom, (v) => {
+      if (state.isDragging)
+        return;
+      state.traveled = Math.ceil(v * totalSteps.value);
+    });
+    vue.onBeforeUnmount(() => {
+      detachEvents();
+    });
+    return () => {
+      return vue.h("div", {
+        role: "presentation",
+        ref: trackRef,
+        class: [
+          nsVirtualScrollbar.b(),
+          props.class,
+          (props.alwaysOn || state.isDragging) && "always-on"
+        ],
+        style: trackStyle.value,
+        onMousedown: vue.withModifiers(clickTrackHandler, ["stop", "prevent"]),
+        onTouchstartPrevent: onThumbMouseDown
+      }, vue.h("div", {
+        ref: thumbRef,
+        class: nsScrollbar.e("thumb"),
+        style: thumbStyle.value,
+        onMousedown: onThumbMouseDown
+      }, []));
+    };
+  }
+});
+
+exports["default"] = ScrollBar;
+//# sourceMappingURL=scrollbar.js.map

package/lib/components/virtual-list/src/components/scrollbar.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"scrollbar.js","sources":["../../../../../../../packages/components/virtual-list/src/components/scrollbar.ts"],"sourcesContent":["// @ts-nocheck\nimport {\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":["defineComponent","virtualizedScrollbarProps","computed","useNamespace","ref","reactive","BAR_MAP","unref","HORIZONTAL","ScrollbarDirKey","SCROLLBAR_MIN_SIZE","renderThumbStyle","cAF","rAF","watch","onBeforeUnmount","h","withModifiers"],"mappings":"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"}

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

@@ -0,0 +1,30 @@
+export declare const DEFAULT_DYNAMIC_LIST_ITEM_SIZE = 50;
+export declare const ITEM_RENDER_EVT = "itemRendered";
+export declare const SCROLL_EVT = "scroll";
+export declare const FORWARD = "forward";
+export declare const BACKWARD = "backward";
+export declare const AUTO_ALIGNMENT = "auto";
+export declare const SMART_ALIGNMENT = "smart";
+export declare const START_ALIGNMENT = "start";
+export declare const CENTERED_ALIGNMENT = "center";
+export declare const END_ALIGNMENT = "end";
+export declare const HORIZONTAL = "horizontal";
+export declare const VERTICAL = "vertical";
+export declare const LTR = "ltr";
+export declare const RTL = "rtl";
+export declare const RTL_OFFSET_NAG = "negative";
+export declare const RTL_OFFSET_POS_ASC = "positive-ascending";
+export declare const RTL_OFFSET_POS_DESC = "positive-descending";
+export declare const PageKey: {
+    horizontal: string;
+    vertical: string;
+};
+export declare const ScrollbarSizeKey: {
+    horizontal: string;
+    vertical: string;
+};
+export declare const ScrollbarDirKey: {
+    horizontal: string;
+    vertical: string;
+};
+export declare const SCROLLBAR_MIN_SIZE = 20;

package/lib/components/virtual-list/src/defaults.js

@@ -0,0 +1,57 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+const DEFAULT_DYNAMIC_LIST_ITEM_SIZE = 50;
+const ITEM_RENDER_EVT = "itemRendered";
+const SCROLL_EVT = "scroll";
+const FORWARD = "forward";
+const BACKWARD = "backward";
+const AUTO_ALIGNMENT = "auto";
+const SMART_ALIGNMENT = "smart";
+const START_ALIGNMENT = "start";
+const CENTERED_ALIGNMENT = "center";
+const END_ALIGNMENT = "end";
+const HORIZONTAL = "horizontal";
+const VERTICAL = "vertical";
+const LTR = "ltr";
+const RTL = "rtl";
+const RTL_OFFSET_NAG = "negative";
+const RTL_OFFSET_POS_ASC = "positive-ascending";
+const RTL_OFFSET_POS_DESC = "positive-descending";
+const PageKey = {
+  [HORIZONTAL]: "pageX",
+  [VERTICAL]: "pageY"
+};
+const ScrollbarSizeKey = {
+  [HORIZONTAL]: "height",
+  [VERTICAL]: "width"
+};
+const ScrollbarDirKey = {
+  [HORIZONTAL]: "left",
+  [VERTICAL]: "top"
+};
+const SCROLLBAR_MIN_SIZE = 20;
+
+exports.AUTO_ALIGNMENT = AUTO_ALIGNMENT;
+exports.BACKWARD = BACKWARD;
+exports.CENTERED_ALIGNMENT = CENTERED_ALIGNMENT;
+exports.DEFAULT_DYNAMIC_LIST_ITEM_SIZE = DEFAULT_DYNAMIC_LIST_ITEM_SIZE;
+exports.END_ALIGNMENT = END_ALIGNMENT;
+exports.FORWARD = FORWARD;
+exports.HORIZONTAL = HORIZONTAL;
+exports.ITEM_RENDER_EVT = ITEM_RENDER_EVT;
+exports.LTR = LTR;
+exports.PageKey = PageKey;
+exports.RTL = RTL;
+exports.RTL_OFFSET_NAG = RTL_OFFSET_NAG;
+exports.RTL_OFFSET_POS_ASC = RTL_OFFSET_POS_ASC;
+exports.RTL_OFFSET_POS_DESC = RTL_OFFSET_POS_DESC;
+exports.SCROLLBAR_MIN_SIZE = SCROLLBAR_MIN_SIZE;
+exports.SCROLL_EVT = SCROLL_EVT;
+exports.SMART_ALIGNMENT = SMART_ALIGNMENT;
+exports.START_ALIGNMENT = START_ALIGNMENT;
+exports.ScrollbarDirKey = ScrollbarDirKey;
+exports.ScrollbarSizeKey = ScrollbarSizeKey;
+exports.VERTICAL = VERTICAL;
+//# sourceMappingURL=defaults.js.map

package/lib/components/virtual-list/src/defaults.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"defaults.js","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/lib/components/virtual-list/src/hooks/use-cache.d.ts

@@ -0,0 +1 @@
+export declare const useCache: () => import("vue").ComputedRef<(((_: any, __: any, ___: any) => {}) & import("lodash").MemoizedFunction) | import("memoize-one").MemoizedFn<(_: any, __: any, ___: any) => {}>>;

package/lib/components/virtual-list/src/hooks/use-cache.js

@@ -0,0 +1,23 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+var vue = require('vue');
+var lodashUnified = require('lodash-unified');
+var memoOne = require('memoize-one');
+
+function _interopDefaultLegacy (e) { return e && typeof e === 'object' && 'default' in e ? e : { 'default': e }; }
+
+var memoOne__default = /*#__PURE__*/_interopDefaultLegacy(memoOne);
+
+const useCache = () => {
+  const vm = vue.getCurrentInstance();
+  const props = vm.proxy.$props;
+  return vue.computed(() => {
+    const _getItemStyleCache = (_, __, ___) => ({});
+    return props.perfMode ? lodashUnified.memoize(_getItemStyleCache) : memoOne__default["default"](_getItemStyleCache);
+  });
+};
+
+exports.useCache = useCache;
+//# sourceMappingURL=use-cache.js.map

package/lib/components/virtual-list/src/hooks/use-cache.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-cache.js","sources":["../../../../../../../packages/components/virtual-list/src/hooks/use-cache.ts"],"sourcesContent":["import { computed, getCurrentInstance } from 'vue'\nimport { memoize } from 'lodash-unified'\nimport memoOne from 'memoize-one'\n\nimport type { VirtualizedProps } from '../props'\n\nexport const useCache = () => {\n  const vm = getCurrentInstance()!\n\n  const props = vm.proxy!.$props as VirtualizedProps\n\n  return computed(() => {\n    // eslint-disable-next-line @typescript-eslint/no-unused-vars\n    const _getItemStyleCache = (_: any, __: any, ___: any) => ({})\n    return props.perfMode\n      ? memoize(_getItemStyleCache)\n      : memoOne(_getItemStyleCache)\n  })\n}\n"],"names":["getCurrentInstance","computed","memoize","memoOne"],"mappings":";;;;;;;;;;;;AAGY,MAAC,QAAQ,GAAG,MAAM;AAC9B,EAAE,MAAM,EAAE,GAAGA,sBAAkB,EAAE,CAAC;AAClC,EAAE,MAAM,KAAK,GAAG,EAAE,CAAC,KAAK,CAAC,MAAM,CAAC;AAChC,EAAE,OAAOC,YAAQ,CAAC,MAAM;AACxB,IAAI,MAAM,kBAAkB,GAAG,CAAC,CAAC,EAAE,EAAE,EAAE,GAAG,MAAM,EAAE,CAAC,CAAC;AACpD,IAAI,OAAO,KAAK,CAAC,QAAQ,GAAGC,qBAAO,CAAC,kBAAkB,CAAC,GAAGC,2BAAO,CAAC,kBAAkB,CAAC,CAAC;AACtF,GAAG,CAAC,CAAC;AACL;;;;"}

package/lib/components/virtual-list/src/hooks/use-grid-wheel.d.ts

@@ -0,0 +1,13 @@
+import type { ComputedRef } from 'vue';
+interface GridWheelState {
+    atXStartEdge: ComputedRef<boolean>;
+    atXEndEdge: ComputedRef<boolean>;
+    atYStartEdge: ComputedRef<boolean>;
+    atYEndEdge: ComputedRef<boolean>;
+}
+declare type GridWheelHandler = (x: number, y: number) => void;
+export declare const useGridWheel: ({ atXEndEdge, atXStartEdge, atYEndEdge, atYStartEdge }: GridWheelState, onWheelDelta: GridWheelHandler) => {
+    hasReachedEdge: (x: number, y: number) => boolean;
+    onWheel: (e: WheelEvent) => void;
+};
+export {};

package/lib/components/virtual-list/src/hooks/use-grid-wheel.js

@@ -0,0 +1,51 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('../../../../utils/index.js');
+var raf = require('../../../../utils/raf.js');
+var browser = require('../../../../utils/browser.js');
+
+const useGridWheel = ({ atXEndEdge, atXStartEdge, atYEndEdge, atYStartEdge }, onWheelDelta) => {
+  let frameHandle = null;
+  let xOffset = 0;
+  let yOffset = 0;
+  const hasReachedEdge = (x, y) => {
+    const xEdgeReached = x < 0 && atXStartEdge.value || x > 0 && atXEndEdge.value;
+    const yEdgeReached = y < 0 && atYStartEdge.value || y > 0 && atYEndEdge.value;
+    return xEdgeReached && yEdgeReached;
+  };
+  const onWheel = (e) => {
+    raf.cAF(frameHandle);
+    let x = e.deltaX;
+    let y = e.deltaY;
+    if (Math.abs(x) > Math.abs(y)) {
+      y = 0;
+    } else {
+      x = 0;
+    }
+    if (e.shiftKey && y !== 0) {
+      x = y;
+      y = 0;
+    }
+    if (hasReachedEdge(xOffset, yOffset) && hasReachedEdge(xOffset + x, yOffset + y))
+      return;
+    xOffset += x;
+    yOffset += y;
+    if (!browser.isFirefox()) {
+      e.preventDefault();
+    }
+    frameHandle = raf.rAF(() => {
+      onWheelDelta(xOffset, yOffset);
+      xOffset = 0;
+      yOffset = 0;
+    });
+  };
+  return {
+    hasReachedEdge,
+    onWheel
+  };
+};
+
+exports.useGridWheel = useGridWheel;
+//# sourceMappingURL=use-grid-wheel.js.map

package/lib/components/virtual-list/src/hooks/use-grid-wheel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-grid-wheel.js","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    // Special case for windows machine with shift key + wheel scrolling\n    if (e.shiftKey && y !== 0) {\n      x = y\n      y = 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":["cAF","isFirefox","rAF"],"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,IAAIA,OAAG,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,QAAQ,IAAI,CAAC,KAAK,CAAC,EAAE;AAC/B,MAAM,CAAC,GAAG,CAAC,CAAC;AACZ,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,CAACC,iBAAS,EAAE,EAAE;AACtB,MAAM,CAAC,CAAC,cAAc,EAAE,CAAC;AACzB,KAAK;AACL,IAAI,WAAW,GAAGC,OAAG,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/lib/components/virtual-list/src/hooks/use-wheel.d.ts

@@ -0,0 +1,13 @@
+import type { ComputedRef } from 'vue';
+import type { LayoutDirection } from '../types';
+interface ListWheelState {
+    atStartEdge: ComputedRef<boolean>;
+    atEndEdge: ComputedRef<boolean>;
+    layout: ComputedRef<LayoutDirection>;
+}
+declare type ListWheelHandler = (offset: number) => void;
+declare const useWheel: ({ atEndEdge, atStartEdge, layout }: ListWheelState, onWheelDelta: ListWheelHandler) => {
+    hasReachedEdge: (offset: number) => boolean;
+    onWheel: (e: WheelEvent) => void;
+};
+export default useWheel;

package/lib/components/virtual-list/src/hooks/use-wheel.js

@@ -0,0 +1,42 @@
+'use strict';
+
+Object.defineProperty(exports, '__esModule', { value: true });
+
+require('../../../../utils/index.js');
+var defaults = require('../defaults.js');
+var raf = require('../../../../utils/raf.js');
+var browser = require('../../../../utils/browser.js');
+
+const LayoutKeys = {
+  [defaults.HORIZONTAL]: "deltaX",
+  [defaults.VERTICAL]: "deltaY"
+};
+const useWheel = ({ atEndEdge, atStartEdge, layout }, onWheelDelta) => {
+  let frameHandle;
+  let offset = 0;
+  const hasReachedEdge = (offset2) => {
+    const edgeReached = offset2 < 0 && atStartEdge.value || offset2 > 0 && atEndEdge.value;
+    return edgeReached;
+  };
+  const onWheel = (e) => {
+    raf.cAF(frameHandle);
+    const newOffset = e[LayoutKeys[layout.value]];
+    if (hasReachedEdge(offset) && hasReachedEdge(offset + newOffset))
+      return;
+    offset += newOffset;
+    if (!browser.isFirefox()) {
+      e.preventDefault();
+    }
+    frameHandle = raf.rAF(() => {
+      onWheelDelta(offset);
+      offset = 0;
+    });
+  };
+  return {
+    hasReachedEdge,
+    onWheel
+  };
+};
+
+exports["default"] = useWheel;
+//# sourceMappingURL=use-wheel.js.map

package/lib/components/virtual-list/src/hooks/use-wheel.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-wheel.js","sources":["../../../../../../../packages/components/virtual-list/src/hooks/use-wheel.ts"],"sourcesContent":["// @ts-nocheck\nimport { cAF, isFirefox, rAF } from '@element-plus/utils'\nimport { HORIZONTAL, VERTICAL } from '../defaults'\n\nimport type { ComputedRef } from 'vue'\nimport type { LayoutDirection } from '../types'\n\nconst LayoutKeys = {\n  [HORIZONTAL]: 'deltaX',\n  [VERTICAL]: 'deltaY',\n}\n\ninterface ListWheelState {\n  atStartEdge: ComputedRef<boolean> // exclusive to reachEnd\n  atEndEdge: ComputedRef<boolean>\n  layout: ComputedRef<LayoutDirection>\n}\n\ntype ListWheelHandler = (offset: number) => void\n\nconst useWheel = (\n  { atEndEdge, atStartEdge, layout }: ListWheelState,\n  onWheelDelta: ListWheelHandler\n) => {\n  let frameHandle: number\n  let offset = 0\n\n  // let scrollLock = false\n  // let lockHandle = null\n\n  // const lockScroll = () => {\n  //   clearTimeout(lockHandle)\n  //   scrollLock = true\n  //   lockHandle = setTimeout(() => scrollLock = false, 50)\n  // }\n\n  const hasReachedEdge = (offset: number) => {\n    const edgeReached =\n      (offset < 0 && atStartEdge.value) || (offset > 0 && atEndEdge.value)\n\n    return edgeReached\n  }\n\n  const onWheel = (e: WheelEvent) => {\n    cAF(frameHandle)\n\n    const newOffset = e[LayoutKeys[layout.value]]\n\n    if (hasReachedEdge(offset) && hasReachedEdge(offset + newOffset)) return\n\n    offset += newOffset\n\n    if (!isFirefox()) {\n      e.preventDefault()\n    }\n\n    frameHandle = rAF(() => {\n      onWheelDelta(offset)\n      offset = 0\n    })\n  }\n\n  return {\n    hasReachedEdge,\n    onWheel,\n  }\n}\n\nexport default useWheel\n"],"names":["HORIZONTAL","VERTICAL","cAF","isFirefox","rAF"],"mappings":";;;;;;;;;AAEA,MAAM,UAAU,GAAG;AACnB,EAAE,CAACA,mBAAU,GAAG,QAAQ;AACxB,EAAE,CAACC,iBAAQ,GAAG,QAAQ;AACtB,CAAC,CAAC;AACG,MAAC,QAAQ,GAAG,CAAC,EAAE,SAAS,EAAE,WAAW,EAAE,MAAM,EAAE,EAAE,YAAY,KAAK;AACvE,EAAE,IAAI,WAAW,CAAC;AAClB,EAAE,IAAI,MAAM,GAAG,CAAC,CAAC;AACjB,EAAE,MAAM,cAAc,GAAG,CAAC,OAAO,KAAK;AACtC,IAAI,MAAM,WAAW,GAAG,OAAO,GAAG,CAAC,IAAI,WAAW,CAAC,KAAK,IAAI,OAAO,GAAG,CAAC,IAAI,SAAS,CAAC,KAAK,CAAC;AAC3F,IAAI,OAAO,WAAW,CAAC;AACvB,GAAG,CAAC;AACJ,EAAE,MAAM,OAAO,GAAG,CAAC,CAAC,KAAK;AACzB,IAAIC,OAAG,CAAC,WAAW,CAAC,CAAC;AACrB,IAAI,MAAM,SAAS,GAAG,CAAC,CAAC,UAAU,CAAC,MAAM,CAAC,KAAK,CAAC,CAAC,CAAC;AAClD,IAAI,IAAI,cAAc,CAAC,MAAM,CAAC,IAAI,cAAc,CAAC,MAAM,GAAG,SAAS,CAAC;AACpE,MAAM,OAAO;AACb,IAAI,MAAM,IAAI,SAAS,CAAC;AACxB,IAAI,IAAI,CAACC,iBAAS,EAAE,EAAE;AACtB,MAAM,CAAC,CAAC,cAAc,EAAE,CAAC;AACzB,KAAK;AACL,IAAI,WAAW,GAAGC,OAAG,CAAC,MAAM;AAC5B,MAAM,YAAY,CAAC,MAAM,CAAC,CAAC;AAC3B,MAAM,MAAM,GAAG,CAAC,CAAC;AACjB,KAAK,CAAC,CAAC;AACP,GAAG,CAAC;AACJ,EAAE,OAAO;AACT,IAAI,cAAc;AAClB,IAAI,OAAO;AACX,GAAG,CAAC;AACJ;;;;"}