vft 0.0.48 → 0.0.51

package/es/components/virtual-list/components/dynamic-size-list.js

@@ -0,0 +1,112 @@
+import "@vft/utils";
+import "vue";
+import { throwError as N } from "../../../utils/error.js";
+import "lodash";
+import "@vueuse/core";
+import "../../../utils/ns-cover.js";
+import T from "../builders/build-list.js";
+import { isHorizontal as z } from "../utils.js";
+import { AUTO_ALIGNMENT as E, CENTERED_ALIGNMENT as M, END_ALIGNMENT as l, START_ALIGNMENT as A, DEFAULT_DYNAMIC_LIST_ITEM_SIZE as L, SMART_ALIGNMENT as _ } from "../defaults.js";
+const x = "ElDynamicSizeList", I = (e, s, t) => {
+  const { itemSize: i } = e, { items: o, lastVisitedIndex: n } = t;
+  if (s > n) {
+    let r = 0;
+    if (n >= 0) {
+      const f = o[n];
+      r = f.offset + f.size;
+    }
+    for (let f = n + 1; f <= s; f++) {
+      const m = i(f);
+      o[f] = {
+        offset: r,
+        size: m
+      }, r += m;
+    }
+    t.lastVisitedIndex = s;
+  }
+  return o[s];
+}, y = (e, s, t) => {
+  const { items: i, lastVisitedIndex: o } = s;
+  return (o > 0 ? i[o].offset : 0) >= t ? S(e, s, 0, o, t) : O(e, s, Math.max(0, o), t);
+}, S = (e, s, t, i, o) => {
+  for (; t <= i; ) {
+    const n = t + Math.floor((i - t) / 2), r = I(e, n, s).offset;
+    if (r === o)
+      return n;
+    r < o ? t = n + 1 : r > o && (i = n - 1);
+  }
+  return Math.max(0, t - 1);
+}, O = (e, s, t, i) => {
+  const { total: o } = e;
+  let n = 1;
+  for (; t < o && I(e, t, s).offset < i; )
+    t += n, n *= 2;
+  return S(
+    e,
+    s,
+    Math.floor(t / 2),
+    Math.min(t, o - 1),
+    i
+  );
+}, h = ({ total: e }, { items: s, estimatedItemSize: t, lastVisitedIndex: i }) => {
+  let o = 0;
+  if (i >= e && (i = e - 1), i >= 0) {
+    const f = s[i];
+    o = f.offset + f.size;
+  }
+  const r = (e - i - 1) * t;
+  return o + r;
+}, R = T({
+  name: "ElDynamicSizeList",
+  getItemOffset: (e, s, t) => I(e, s, t).offset,
+  getItemSize: (e, s, { items: t }) => t[s].size,
+  getEstimatedTotalSize: h,
+  getOffset: (e, s, t, i, o) => {
+    const { height: n, layout: r, width: f } = e, m = z(r) ? f : n, u = I(e, s, o), d = h(e, o), c = Math.max(
+      0,
+      Math.min(d - m, u.offset)
+    ), a = Math.max(0, u.offset - m + u.size);
+    switch (t === _ && (i >= a - m && i <= c + m ? t = E : t = M), t) {
+      case A:
+        return c;
+      case l:
+        return a;
+      case M:
+        return Math.round(a + (c - a) / 2);
+      case E:
+      default:
+        return i >= a && i <= c ? i : i < a ? a : c;
+    }
+  },
+  getStartIndexForOffset: (e, s, t) => y(e, t, s),
+  getStopIndexForStartIndex: (e, s, t, i) => {
+    const { height: o, total: n, layout: r, width: f } = e, m = z(r) ? f : o, u = I(e, s, i), d = t + m;
+    let c = u.offset + u.size, a = s;
+    for (; a < n - 1 && c < d; )
+      a++, c += I(e, a, i).size;
+    return a;
+  },
+  initCache({ estimatedItemSize: e = L }, s) {
+    const t = {
+      items: {},
+      estimatedItemSize: e,
+      lastVisitedIndex: -1
+    };
+    return t.clearCacheAfterIndex = (i, o = !0) => {
+      var n, r;
+      t.lastVisitedIndex = Math.min(t.lastVisitedIndex, i - 1), (n = s.exposed) == null || n.getItemStyleCache(-1), o && ((r = s.proxy) == null || r.$forceUpdate());
+    }, t;
+  },
+  clearCache: !1,
+  validateProps: ({ itemSize: e }) => {
+    process.env.NODE_ENV !== "production" && typeof e != "function" && N(
+      x,
+      `
+          itemSize is required as function, but the given value was ${typeof e}
+        `
+    );
+  }
+});
+export {
+  R as default
+};

package/es/components/virtual-list/components/fixed-size-grid.d.ts

@@ -0,0 +1,193 @@
+declare const FixedSizeGrid: import("vue").DefineComponent<{
+    readonly className: import("vft/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
+    readonly containerElement: import("vft/es/utils").EpPropFinalized<(new (...args: any[]) => string | Element) | (() => string | Element) | ((new (...args: any[]) => string | Element) | (() => string | Element))[], unknown, unknown, "div", boolean>;
+    readonly data: import("vft/es/utils").EpPropFinalized<(new (...args: any[]) => any[]) | (() => any[]) | ((new (...args: any[]) => any[]) | (() => any[]))[], unknown, unknown, () => [], boolean>;
+    readonly direction: import("vft/es/utils").EpPropFinalized<StringConstructor, "ltr" | "rtl", never, "ltr", false>;
+    readonly height: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly innerElement: import("vft/es/utils").EpPropFinalized<readonly [StringConstructor, ObjectConstructor], unknown, unknown, "div", boolean>;
+    readonly style: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => string | import("vue").CSSProperties | import("vue").StyleValue[]) | (() => import("vue").StyleValue) | ((new (...args: any[]) => string | import("vue").CSSProperties | import("vue").StyleValue[]) | (() => import("vue").StyleValue))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly useIsScrolling: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    readonly width: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<readonly [NumberConstructor, StringConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly perfMode: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    readonly scrollbarAlwaysOn: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    readonly columnCache: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 2, false>;
+    readonly columnWidth: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize) | ((new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize))[], never, never>>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly estimatedColumnWidth: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly estimatedRowHeight: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly initScrollLeft: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 0, false>;
+    readonly initScrollTop: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 0, false>;
+    readonly itemKey: import("vft/es/utils").EpPropFinalized<(new (...args: any[]) => import("..").GridItemKeyGetter) | (() => import("..").GridItemKeyGetter) | {
+        (): import("..").GridItemKeyGetter;
+        new (): any;
+        readonly prototype: any;
+    } | ((new (...args: any[]) => import("..").GridItemKeyGetter) | (() => import("..").GridItemKeyGetter) | {
+        (): import("..").GridItemKeyGetter;
+        new (): any;
+        readonly prototype: any;
+    })[], unknown, unknown, ({ columnIndex, rowIndex }: {
+        columnIndex: number;
+        rowIndex: number;
+    }) => string, boolean>;
+    readonly rowCache: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 2, false>;
+    readonly rowHeight: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize) | ((new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize))[], never, never>>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly totalColumn: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly totalRow: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly hScrollbarSize: import("vft/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 6, boolean>;
+    readonly vScrollbarSize: import("vft/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 6, boolean>;
+    readonly scrollbarStartGap: import("vft/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
+    readonly scrollbarEndGap: import("vft/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 2, boolean>;
+    readonly role: StringConstructor;
+}, () => import("vue").VNode<import("vue").RendererNode, import("vue").RendererElement, {
+    [key: string]: any;
+}>, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("scroll" | "itemRendered")[], "scroll" | "itemRendered", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly className: import("vft/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
+    readonly containerElement: import("vft/es/utils").EpPropFinalized<(new (...args: any[]) => string | Element) | (() => string | Element) | ((new (...args: any[]) => string | Element) | (() => string | Element))[], unknown, unknown, "div", boolean>;
+    readonly data: import("vft/es/utils").EpPropFinalized<(new (...args: any[]) => any[]) | (() => any[]) | ((new (...args: any[]) => any[]) | (() => any[]))[], unknown, unknown, () => [], boolean>;
+    readonly direction: import("vft/es/utils").EpPropFinalized<StringConstructor, "ltr" | "rtl", never, "ltr", false>;
+    readonly height: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly innerElement: import("vft/es/utils").EpPropFinalized<readonly [StringConstructor, ObjectConstructor], unknown, unknown, "div", boolean>;
+    readonly style: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => string | import("vue").CSSProperties | import("vue").StyleValue[]) | (() => import("vue").StyleValue) | ((new (...args: any[]) => string | import("vue").CSSProperties | import("vue").StyleValue[]) | (() => import("vue").StyleValue))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly useIsScrolling: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    readonly width: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<readonly [NumberConstructor, StringConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly perfMode: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    readonly scrollbarAlwaysOn: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    readonly columnCache: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 2, false>;
+    readonly columnWidth: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize) | ((new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize))[], never, never>>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly estimatedColumnWidth: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly estimatedRowHeight: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly initScrollLeft: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 0, false>;
+    readonly initScrollTop: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 0, false>;
+    readonly itemKey: import("vft/es/utils").EpPropFinalized<(new (...args: any[]) => import("..").GridItemKeyGetter) | (() => import("..").GridItemKeyGetter) | {
+        (): import("..").GridItemKeyGetter;
+        new (): any;
+        readonly prototype: any;
+    } | ((new (...args: any[]) => import("..").GridItemKeyGetter) | (() => import("..").GridItemKeyGetter) | {
+        (): import("..").GridItemKeyGetter;
+        new (): any;
+        readonly prototype: any;
+    })[], unknown, unknown, ({ columnIndex, rowIndex }: {
+        columnIndex: number;
+        rowIndex: number;
+    }) => string, boolean>;
+    readonly rowCache: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 2, false>;
+    readonly rowHeight: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize) | ((new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize))[], never, never>>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly totalColumn: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly totalRow: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly hScrollbarSize: import("vft/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 6, boolean>;
+    readonly vScrollbarSize: import("vft/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 6, boolean>;
+    readonly scrollbarStartGap: import("vft/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 0, boolean>;
+    readonly scrollbarEndGap: import("vft/es/utils").EpPropFinalized<NumberConstructor, unknown, unknown, 2, boolean>;
+    readonly role: StringConstructor;
+}>> & {
+    onScroll?: ((...args: any[]) => any) | undefined;
+    onItemRendered?: ((...args: any[]) => any) | undefined;
+}, {
+    readonly data: any[];
+    readonly scrollbarAlwaysOn: import("vft/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    readonly className: string;
+    readonly direction: import("vft/es/utils").EpPropMergeType<StringConstructor, "ltr" | "rtl", never>;
+    readonly containerElement: import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => string | Element) | (() => string | Element) | ((new (...args: any[]) => string | Element) | (() => string | Element))[], unknown, unknown>;
+    readonly innerElement: import("vft/es/utils").EpPropMergeType<readonly [StringConstructor, ObjectConstructor], unknown, unknown>;
+    readonly useIsScrolling: import("vft/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    readonly perfMode: import("vft/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    readonly itemKey: import("..").GridItemKeyGetter;
+    readonly columnCache: number;
+    readonly initScrollLeft: number;
+    readonly initScrollTop: number;
+    readonly rowCache: number;
+    readonly hScrollbarSize: number;
+    readonly vScrollbarSize: number;
+    readonly scrollbarStartGap: number;
+    readonly scrollbarEndGap: number;
+}>;
+export default FixedSizeGrid;

package/es/components/virtual-list/components/fixed-size-grid.js

@@ -0,0 +1,125 @@
+import { isNumber as E } from "@vft/utils";
+import "vue";
+import { throwError as N } from "../../../utils/error.js";
+import "lodash";
+import "@vueuse/core";
+import "../../../utils/ns-cover.js";
+import S from "../builders/build-grid.js";
+import { AUTO_ALIGNMENT as M, CENTERED_ALIGNMENT as c, END_ALIGNMENT as x, START_ALIGNMENT as O, SMART_ALIGNMENT as l } from "../defaults.js";
+const p = "ElFixedSizeGrid", T = S({
+  name: "ElFixedSizeGrid",
+  getColumnPosition: ({ columnWidth: t }, e) => [
+    t,
+    e * t
+  ],
+  getRowPosition: ({ rowHeight: t }, e) => [
+    t,
+    e * t
+  ],
+  getEstimatedTotalHeight: ({ totalRow: t, rowHeight: e }) => e * t,
+  getEstimatedTotalWidth: ({ totalColumn: t, columnWidth: e }) => e * t,
+  getColumnOffset: ({ totalColumn: t, columnWidth: e, width: a }, o, n, s, u, d) => {
+    a = Number(a);
+    const i = Math.max(
+      0,
+      t * e - a
+    ), f = Math.min(
+      i,
+      o * e
+    ), r = Math.max(
+      0,
+      o * e - a + d + e
+    );
+    switch (n === "smart" && (s >= r - a && s <= f + a ? n = M : n = c), n) {
+      case O:
+        return f;
+      case x:
+        return r;
+      case c: {
+        const m = Math.round(r + (f - r) / 2);
+        return m < Math.ceil(a / 2) ? 0 : m > i + Math.floor(a / 2) ? i : m;
+      }
+      case M:
+      default:
+        return s >= r && s <= f ? s : r > f || s < r ? r : f;
+    }
+  },
+  getRowOffset: ({ rowHeight: t, height: e, totalRow: a }, o, n, s, u, d) => {
+    e = Number(e);
+    const i = Math.max(0, a * t - e), f = Math.min(i, o * t), r = Math.max(
+      0,
+      o * t - e + d + t
+    );
+    switch (n === l && (s >= r - e && s <= f + e ? n = M : n = c), n) {
+      case O:
+        return f;
+      case x:
+        return r;
+      case c: {
+        const m = Math.round(r + (f - r) / 2);
+        return m < Math.ceil(e / 2) ? 0 : m > i + Math.floor(e / 2) ? i : m;
+      }
+      case M:
+      default:
+        return s >= r && s <= f ? s : r > f || s < r ? r : f;
+    }
+  },
+  getColumnStartIndexForOffset: ({ columnWidth: t, totalColumn: e }, a) => Math.max(
+    0,
+    Math.min(
+      e - 1,
+      Math.floor(a / t)
+    )
+  ),
+  getColumnStopIndexForStartIndex: ({ columnWidth: t, totalColumn: e, width: a }, o, n) => {
+    const s = o * t, u = Math.ceil(
+      (a + n - s) / t
+    );
+    return Math.max(
+      0,
+      Math.min(e - 1, o + u - 1)
+    );
+  },
+  getRowStartIndexForOffset: ({ rowHeight: t, totalRow: e }, a) => Math.max(
+    0,
+    Math.min(e - 1, Math.floor(a / t))
+  ),
+  getRowStopIndexForStartIndex: ({ rowHeight: t, totalRow: e, height: a }, o, n) => {
+    const s = o * t, u = Math.ceil(
+      (a + n - s) / t
+    );
+    return Math.max(
+      0,
+      Math.min(
+        e - 1,
+        o + u - 1
+        // -1 is because stop index is inclusive
+      )
+    );
+  },
+  /**
+   * Fixed size grid does not need this cache
+   * Using any to bypass it, TODO: Using type inference to fix this.
+   */
+  initCache: () => {
+  },
+  clearCache: !0,
+  validateProps: ({ columnWidth: t, rowHeight: e }) => {
+    process.env.NODE_ENV !== "production" && (E(t) || N(
+      p,
+      `
+          "columnWidth" must be passed as number,
+            instead ${typeof t} was given.
+        `
+    ), E(e) || N(
+      p,
+      `
+          "columnWidth" must be passed as number,
+            instead ${typeof e} was given.
+        `
+    ));
+  }
+});
+export {
+  T as default
+};

package/es/components/virtual-list/components/fixed-size-list.d.ts

@@ -0,0 +1,164 @@
+declare const FixedSizeList: import("vue").DefineComponent<{
+    readonly className: import("vft/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
+    readonly containerElement: import("vft/es/utils").EpPropFinalized<(new (...args: any[]) => string | Element) | (() => string | Element) | ((new (...args: any[]) => string | Element) | (() => string | Element))[], unknown, unknown, "div", boolean>;
+    readonly data: import("vft/es/utils").EpPropFinalized<(new (...args: any[]) => any[]) | (() => any[]) | ((new (...args: any[]) => any[]) | (() => any[]))[], unknown, unknown, () => [], boolean>;
+    readonly direction: import("vft/es/utils").EpPropFinalized<StringConstructor, "ltr" | "rtl", never, "ltr", false>;
+    readonly height: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly innerElement: import("vft/es/utils").EpPropFinalized<readonly [StringConstructor, ObjectConstructor], unknown, unknown, "div", boolean>;
+    readonly style: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => string | import("vue").CSSProperties | import("vue").StyleValue[]) | (() => import("vue").StyleValue) | ((new (...args: any[]) => string | import("vue").CSSProperties | import("vue").StyleValue[]) | (() => import("vue").StyleValue))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly useIsScrolling: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    readonly width: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<readonly [NumberConstructor, StringConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly perfMode: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    readonly scrollbarAlwaysOn: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    readonly cache: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 2, false>;
+    readonly estimatedItemSize: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly layout: import("vft/es/utils").EpPropFinalized<StringConstructor, "horizontal" | "vertical", never, "vertical", false>;
+    readonly initScrollOffset: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 0, false>;
+    readonly total: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly itemSize: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize) | ((new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize))[], never, never>>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+}, {
+    ns: {
+        namespace: import("vue").Ref<string>;
+        b: (blockSuffix?: string) => string;
+        e: (element?: string | undefined) => string;
+        m: (modifier?: string | undefined) => string;
+        be: (blockSuffix?: string | undefined, element?: string | undefined) => string;
+        em: (element?: string | undefined, modifier?: string | undefined) => string;
+        bm: (blockSuffix?: string | undefined, modifier?: string | undefined) => string;
+        bem: (blockSuffix?: string | undefined, element?: string | undefined, modifier?: string | undefined) => string;
+        is: {
+            (name: string, state: boolean | undefined): string;
+            (name: string): string;
+        };
+        cssVar: (object: Record<string, string | undefined>) => Record<string, string>;
+        cssVarName: (name: string) => string;
+        cssVarBlock: (object: Record<string, string | undefined>) => Record<string, string>;
+        cssVarBlockName: (name: string) => string;
+    };
+    clientSize: import("vue").ComputedRef<string | number | undefined>;
+    estimatedTotalSize: import("vue").ComputedRef<number>;
+    windowStyle: import("vue").ComputedRef<(string | import("vue").CSSProperties | import("vue").StyleValue[] | {
+        [x: string]: string;
+        position: string;
+        WebkitOverflowScrolling: string;
+        willChange: string;
+    } | undefined)[]>;
+    windowRef: import("vue").Ref<HTMLElement | undefined>;
+    innerRef: import("vue").Ref<HTMLElement | undefined>;
+    innerStyle: import("vue").ComputedRef<{
+        height: string;
+        pointerEvents: string | undefined;
+        width: string;
+    }>;
+    itemsToRender: import("vue").ComputedRef<number[]>;
+    scrollbarRef: import("vue").Ref<any>;
+    states: import("vue").Ref<{
+        isScrolling: boolean;
+        scrollDir: string;
+        scrollOffset: number;
+        updateRequested: boolean;
+        isScrollbarDragging: boolean;
+        scrollbarAlwaysOn: import("vft/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    }>;
+    getItemStyle: (idx: number) => import("vue").CSSProperties;
+    onScroll: (e: Event) => void;
+    onScrollbarScroll: (distanceToGo: number, totalSteps: number) => void;
+    onWheel: (e: WheelEvent) => void;
+    scrollTo: (offset: number) => void;
+    scrollToItem: (idx: number, alignment?: import("..").Alignment) => void;
+    resetScrollTop: () => void;
+}, unknown, {}, {}, import("vue").ComponentOptionsMixin, import("vue").ComponentOptionsMixin, ("scroll" | "itemRendered")[], "scroll" | "itemRendered", import("vue").VNodeProps & import("vue").AllowedComponentProps & import("vue").ComponentCustomProps, Readonly<import("vue").ExtractPropTypes<{
+    readonly className: import("vft/es/utils").EpPropFinalized<StringConstructor, unknown, unknown, "", boolean>;
+    readonly containerElement: import("vft/es/utils").EpPropFinalized<(new (...args: any[]) => string | Element) | (() => string | Element) | ((new (...args: any[]) => string | Element) | (() => string | Element))[], unknown, unknown, "div", boolean>;
+    readonly data: import("vft/es/utils").EpPropFinalized<(new (...args: any[]) => any[]) | (() => any[]) | ((new (...args: any[]) => any[]) | (() => any[]))[], unknown, unknown, () => [], boolean>;
+    readonly direction: import("vft/es/utils").EpPropFinalized<StringConstructor, "ltr" | "rtl", never, "ltr", false>;
+    readonly height: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<readonly [StringConstructor, NumberConstructor], unknown, unknown>>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly innerElement: import("vft/es/utils").EpPropFinalized<readonly [StringConstructor, ObjectConstructor], unknown, unknown, "div", boolean>;
+    readonly style: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => string | import("vue").CSSProperties | import("vue").StyleValue[]) | (() => import("vue").StyleValue) | ((new (...args: any[]) => string | import("vue").CSSProperties | import("vue").StyleValue[]) | (() => import("vue").StyleValue))[], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly useIsScrolling: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    readonly width: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<readonly [NumberConstructor, StringConstructor], unknown, unknown>>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly perfMode: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, true, boolean>;
+    readonly scrollbarAlwaysOn: import("vft/es/utils").EpPropFinalized<BooleanConstructor, unknown, unknown, false, boolean>;
+    readonly cache: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 2, false>;
+    readonly estimatedItemSize: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: false;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly layout: import("vft/es/utils").EpPropFinalized<StringConstructor, "horizontal" | "vertical", never, "vertical", false>;
+    readonly initScrollOffset: import("vft/es/utils").EpPropFinalized<NumberConstructor, never, never, 0, false>;
+    readonly total: {
+        readonly type: import("vue").PropType<number>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+    readonly itemSize: {
+        readonly type: import("vue").PropType<import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize) | ((new (...args: any[]) => number | import("..").ItemSize) | (() => number | import("..").ItemSize))[], never, never>>;
+        readonly required: true;
+        readonly validator: ((val: unknown) => boolean) | undefined;
+        __epPropKey: true;
+    };
+}>> & {
+    onScroll?: ((...args: any[]) => any) | undefined;
+    onItemRendered?: ((...args: any[]) => any) | undefined;
+}, {
+    readonly data: any[];
+    readonly layout: import("vft/es/utils").EpPropMergeType<StringConstructor, "horizontal" | "vertical", never>;
+    readonly scrollbarAlwaysOn: import("vft/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    readonly className: string;
+    readonly direction: import("vft/es/utils").EpPropMergeType<StringConstructor, "ltr" | "rtl", never>;
+    readonly containerElement: import("vft/es/utils").EpPropMergeType<(new (...args: any[]) => string | Element) | (() => string | Element) | ((new (...args: any[]) => string | Element) | (() => string | Element))[], unknown, unknown>;
+    readonly innerElement: import("vft/es/utils").EpPropMergeType<readonly [StringConstructor, ObjectConstructor], unknown, unknown>;
+    readonly useIsScrolling: import("vft/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    readonly perfMode: import("vft/es/utils").EpPropMergeType<BooleanConstructor, unknown, unknown>;
+    readonly cache: number;
+    readonly initScrollOffset: number;
+}>;
+export default FixedSizeList;

package/es/components/virtual-list/components/fixed-size-list.js

@@ -0,0 +1,68 @@
+import { isString as p } from "@vft/utils";
+import "vue";
+import { throwError as N } from "../../../utils/error.js";
+import "lodash";
+import "@vueuse/core";
+import "../../../utils/ns-cover.js";
+import l from "../builders/build-list.js";
+import { isHorizontal as M } from "../utils.js";
+import { AUTO_ALIGNMENT as E, CENTERED_ALIGNMENT as d, END_ALIGNMENT as I, START_ALIGNMENT as T, SMART_ALIGNMENT as x } from "../defaults.js";
+const F = l({
+  name: "ElFixedSizeList",
+  getItemOffset: ({ itemSize: t }, e) => e * t,
+  getItemSize: ({ itemSize: t }) => t,
+  getEstimatedTotalSize: ({ total: t, itemSize: e }) => e * t,
+  getOffset: ({ height: t, total: e, itemSize: o, layout: h, width: u }, n, s, i) => {
+    const r = M(h) ? u : t;
+    process.env.NODE_ENV !== "production" && p(r) && N(
+      "[ElVirtualList]",
+      `
+        You should set
+          width/height
+        to number when your layout is
+          horizontal/vertical
+      `
+    );
+    const m = Math.max(0, e * o - r), f = Math.min(m, n * o), a = Math.max(0, (n + 1) * o - r);
+    switch (s === x && (i >= a - r && i <= f + r ? s = E : s = d), s) {
+      case T:
+        return f;
+      case I:
+        return a;
+      case d: {
+        const c = Math.round(a + (f - a) / 2);
+        return c < Math.ceil(r / 2) ? 0 : c > m + Math.floor(r / 2) ? m : c;
+      }
+      case E:
+      default:
+        return i >= a && i <= f ? i : i < a ? a : f;
+    }
+  },
+  getStartIndexForOffset: ({ total: t, itemSize: e }, o) => Math.max(0, Math.min(t - 1, Math.floor(o / e))),
+  getStopIndexForStartIndex: ({ height: t, total: e, itemSize: o, layout: h, width: u }, n, s) => {
+    const i = n * o, r = M(h) ? u : t, m = Math.ceil(
+      (r + s - i) / o
+    );
+    return Math.max(
+      0,
+      Math.min(
+        e - 1,
+        // because startIndex is inclusive, so in order to prevent array outbound indexing
+        // we need to - 1 to prevent outbound behavior
+        n + m - 1
+      )
+    );
+  },
+  /**
+   * Fixed size list does not need this cache
+   * Using any to bypass it, TODO: Using type inference to fix this.
+   */
+  initCache() {
+  },
+  clearCache: !0,
+  validateProps() {
+  }
+});
+export {
+  F as default
+};