@pinnacle0/web-ui 0.4.19 → 0.4.20

package/core/{VirtualList.d.ts → VirtualList/index.d.ts}

@@ -1,8 +1,12 @@
-import "../internal/polyfill/ResizeObserver";
-import type { VirtualizerOptions } from "@tanstack/react-virtual";
+import "../../internal/polyfill/ResizeObserver";
+import React from "react";
+import type { VirtualizerOptions, Virtualizer } from "@tanstack/react-virtual";
 import type { ComponentType } from "react";
-import type { StringKey } from "../internal/type";
-type Direction = "horizontal" | "vertical";
+import type { StringKey } from "../../internal/type";
+import "./index.less";
+export type Direction = "horizontal" | "vertical";
+export interface VirtualListHandler extends Pick<Virtualizer<HTMLElement, HTMLElement>, "scrollElement" | "scrollToIndex" | "scrollToOffset" | "measure" | "getVirtualItems" | "range" | "indexFromElement" | "getTotalSize" | "scrollElement"> {
+}
 export interface ItemProps<T extends object> {
     index: number;
     data: T;
@@ -20,9 +24,10 @@ export interface Props<T extends object> {
     overscan?: number;
     observeElementRect?: VirtualizerOptions<HTMLElement, HTMLElement>["observeElementRect"];
     observeElementOffset?: VirtualizerOptions<HTMLElement, HTMLElement>["observeElementOffset"];
+    className?: string;
+    listRef?: React.Ref<VirtualListHandler>;
 }
 /**
  * Efficiently rendering large lists and tabular data
  */
-export declare function VirtualList<T extends object>({ data, rowKey, direction, renderItem: renderData, overscan, initialRect, observeElementOffset, fixedSize, observeElementRect, }: Props<T>): JSX.Element;
-export {};
+export declare function VirtualList<T extends object>({ data, rowKey, direction, renderItem: renderData, overscan, initialRect, observeElementOffset, fixedSize, observeElementRect, className, listRef, }: Props<T>): JSX.Element;

package/core/{VirtualList.js → VirtualList/index.js}

@@ -1,27 +1,17 @@
-var __assign = (this && this.__assign) || function () {
-    __assign = Object.assign || function(t) {
-        for (var s, i = 1, n = arguments.length; i < n; i++) {
-            s = arguments[i];
-            for (var p in s) if (Object.prototype.hasOwnProperty.call(s, p))
-                t[p] = s[p];
-        }
-        return t;
-    };
-    return __assign.apply(this, arguments);
-};
-import "../internal/polyfill/ResizeObserver";
+import "../../internal/polyfill/ResizeObserver";
 import React from "react";
+import { classNames } from "../../util/ClassNames";
 import { useVirtualizer, observeElementOffset as defaultObserveElementOffset, observeElementRect as defaultObserveElementRect } from "@tanstack/react-virtual";
+import "./index.less";
 var DEFAULT_ITEM_SIZE = 100;
 /**
  * Efficiently rendering large lists and tabular data
  */
 export function VirtualList(_a) {
-    var data = _a.data, _b = _a.rowKey, rowKey = _b === void 0 ? "index" : _b, _c = _a.direction, direction = _c === void 0 ? "vertical" : _c, renderData = _a.renderItem, _d = _a.overscan, overscan = _d === void 0 ? 5 : _d, _e = _a.initialRect, initialRect = _e === void 0 ? { width: 0, height: 0 } : _e, observeElementOffset = _a.observeElementOffset, fixedSize = _a.fixedSize, observeElementRect = _a.observeElementRect;
+    var data = _a.data, _b = _a.rowKey, rowKey = _b === void 0 ? "index" : _b, _c = _a.direction, direction = _c === void 0 ? "vertical" : _c, renderData = _a.renderItem, _d = _a.overscan, overscan = _d === void 0 ? 5 : _d, _e = _a.initialRect, initialRect = _e === void 0 ? { width: 0, height: 0 } : _e, observeElementOffset = _a.observeElementOffset, fixedSize = _a.fixedSize, observeElementRect = _a.observeElementRect, className = _a.className, listRef = _a.listRef;
     var Item = renderData;
     var parentRef = React.useRef(null);
     var horizontal = direction === "horizontal";
-    var sizeStyle = horizontal ? { height: "100%" } : { width: "100%" };
     var virtualizer = useVirtualizer({
         initialRect: initialRect,
         horizontal: horizontal,
@@ -32,14 +22,20 @@ export function VirtualList(_a) {
         observeElementRect: observeElementRect !== null && observeElementRect !== void 0 ? observeElementRect : defaultObserveElementRect,
         overscan: overscan,
     });
+    React.useImperativeHandle(listRef, function () { return ({
+        getVirtualItems: virtualizer.getVirtualItems,
+        scrollElement: virtualizer.scrollElement,
+        measure: virtualizer.measure,
+        scrollToIndex: virtualizer.scrollToIndex,
+        scrollToOffset: virtualizer.scrollToOffset,
+        getTotalSize: virtualizer.getTotalSize,
+        indexFromElement: virtualizer.indexFromElement,
+        range: virtualizer.range,
+    }); });
     var getItemKey = function (index) { return (rowKey === "index" ? index : data[index][rowKey]); };
-    return (React.createElement("div", { className: "g-virtual-list", ref: parentRef, style: { flex: 1, width: "100%", height: "100%", overflow: "auto" } },
-        React.createElement("div", { className: "g-virtual-list-inner", style: {
-                position: "relative",
-                height: horizontal ? "100%" : virtualizer.getTotalSize(),
-                width: horizontal ? virtualizer.getTotalSize() : "100%",
-            } }, virtualizer.getVirtualItems().map(function (virtualRow) { return (React.createElement("div", { className: "g-virtual-list-item", key: getItemKey(virtualRow.index), ref: virtualizer.measureElement, "data-index": virtualRow.index, style: __assign({ position: "absolute", top: 0, left: 0, transform: horizontal ? "translateX(".concat(virtualRow.start, "px)") : "translateY(".concat(virtualRow.start, "px)") }, sizeStyle) },
-            React.createElement("div", { className: "g-virtual-list-item-wrapper", style: __assign({}, sizeStyle) },
+    return (React.createElement("div", { className: classNames("g-virtual-list", className, { horizontal: horizontal }), ref: parentRef },
+        React.createElement("div", { className: "g-virtual-list-inner", style: horizontal ? { width: virtualizer.getTotalSize() } : { height: virtualizer.getTotalSize() } }, virtualizer.getVirtualItems().map(function (virtualRow) { return (React.createElement("div", { className: "g-virtual-list-item", key: getItemKey(virtualRow.index), ref: virtualizer.measureElement, "data-index": virtualRow.index, style: { transform: horizontal ? "translateX(".concat(virtualRow.start, "px)") : "translateY(".concat(virtualRow.start, "px)") } },
+            React.createElement("div", { className: "g-virtual-list-item-wrapper" },
                 React.createElement(Item, { data: data[virtualRow.index], index: virtualRow.index })))); }))));
 }
-//# sourceMappingURL=VirtualList.js.map
+//# sourceMappingURL=index.js.map

package/core/VirtualList/index.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"index.js","sourceRoot":"","sources":["../../../src/core/VirtualList/index.tsx"],"names":[],"mappings":"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"}

package/core/VirtualList/index.less

@@ -0,0 +1,31 @@
+.g-virtual-list {
+    flex: 1;
+    width: 100%;
+    height: 100%;
+    overflow: auto;
+
+    .g-virtual-list-inner {
+        position: relative;
+        width: 100%;
+
+        .g-virtual-list-item {
+            position: absolute;
+            top: 0;
+            left: 0;
+            width: 100%;
+
+            .g-virtual-list-item-wrapper {
+                width: 100%;
+            }
+        }
+    }
+
+    &.horizontal {
+        .g-virtual-list-inner,
+        .g-virtual-list-item,
+        .g-virtual-list-item-wrapper {
+            width: auto;
+            height: 100%;
+        }
+    }
+}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@pinnacle0/web-ui",
-  "version": "0.4.19",
+  "version": "0.4.20",
   "author": "Pinnacle",
   "license": "MIT",
   "sideEffects": [

package/core/VirtualList.js.map

@@ -1 +0,0 @@
-{"version":3,"file":"VirtualList.js","sourceRoot":"","sources":["../../src/core/VirtualList.tsx"],"names":[],"mappings":"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"}