@cloud-app-dev/vidc 4.0.17 → 4.1.0

package/es/GridList/demo.js

@@ -0,0 +1,89 @@
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { useEffect, useState } from 'react';
+import data from "./data";
+import GridList from "./index";
+import { jsx as _jsx } from "react/jsx-runtime";
+import { jsxs as _jsxs } from "react/jsx-runtime";
+var ITEM_WIDTH = 250;
+function getGridGap(elementWidth, windowHeight) {
+  if (elementWidth > 720 && windowHeight > 480) {
+    return 20;
+  } else {
+    return 10;
+  }
+}
+function getColumnCount(elementWidth, gridGap) {
+  return Math.floor(elementWidth / (ITEM_WIDTH + gridGap));
+}
+function getWindowMargin(windowHeight) {
+  return Math.round(windowHeight * 1.5);
+}
+function getItemData(image, columnWidth) {
+  return {
+    key: image.index,
+    height: 400,
+    width: ITEM_WIDTH,
+    url: image.url,
+    columnWidth: columnWidth
+  };
+}
+var App = function App() {
+  var _useState = useState([]),
+    _useState2 = _slicedToArray(_useState, 2),
+    list = _useState2[0],
+    setlist = _useState2[1];
+  useEffect(function () {
+    setTimeout(function () {
+      return setlist(data.data.list);
+    }, 2000);
+  }, []);
+  return /*#__PURE__*/_jsx("div", {
+    style: {
+      height: 800,
+      overflow: 'auto'
+    },
+    children: /*#__PURE__*/_jsx(GridList, {
+      items: list,
+      getGridGap: getGridGap,
+      getColumnCount: getColumnCount,
+      getWindowMargin: getWindowMargin,
+      getItemData: getItemData,
+      renderItem: function renderItem(image) {
+        return /*#__PURE__*/_jsxs("div", {
+          style: {
+            border: '1px solid gray',
+            height: '100%',
+            display: 'flex',
+            flexDirection: 'column'
+          },
+          children: [/*#__PURE__*/_jsx("div", {
+            style: {
+              flex: 1,
+              overflow: 'hidden'
+            },
+            children: /*#__PURE__*/_jsx("img", {
+              src: image.url,
+              alt: "",
+              style: {
+                objectFit: 'cover',
+                display: 'block',
+                width: '100%',
+                height: '100%'
+              }
+            })
+          }), /*#__PURE__*/_jsx("p", {
+            children: image.deviceName
+          }), /*#__PURE__*/_jsx("p", {
+            children: "\u63CF\u8FF0"
+          })]
+        });
+      }
+    })
+  });
+};
+export default App;

package/es/GridList/hook.d.ts

@@ -0,0 +1,13 @@
+import { RefObject } from 'react';
+import { GridListProps } from '.';
+import { ConstRef, ElementScroll, ElementSize, GridListConfigData, GridListContainerData, GridListLayoutData, GridListRenderData } from './interface';
+export declare function useConstRef<T>(value: T): ConstRef<T>;
+export declare function useWindowSize(): ElementSize;
+export declare function useElementSize(ref: RefObject<Element>): ElementSize | null;
+export declare function useWindowScroll(): ElementScroll;
+export declare function useElementWindowOffset(ref: RefObject<HTMLElement>): number | null;
+export declare function useIntersecting(ref: RefObject<HTMLElement>, rootMargin: string): boolean;
+export declare function useGridListContainerData(ref: RefObject<HTMLElement>): GridListContainerData;
+export declare function useGridListConfigData<P>(containerData: GridListContainerData, props: GridListProps<P>): GridListConfigData<P> | null;
+export declare function useGridListLayoutData<P>(configData: GridListConfigData<P> | null): GridListLayoutData<P> | null;
+export declare function useGridListRenderData<P>(containerData: GridListContainerData, configData: GridListConfigData<P> | null, layoutData: GridListLayoutData<P> | null): GridListRenderData<P> | null;

package/es/GridList/hook.js

@@ -0,0 +1,270 @@
+function _createForOfIteratorHelper(o, allowArrayLike) { var it = typeof Symbol !== "undefined" && o[Symbol.iterator] || o["@@iterator"]; if (!it) { if (Array.isArray(o) || (it = _unsupportedIterableToArray(o)) || allowArrayLike && o && typeof o.length === "number") { if (it) o = it; var i = 0; var F = function F() {}; return { s: F, n: function n() { if (i >= o.length) return { done: true }; return { done: false, value: o[i++] }; }, e: function e(_e2) { throw _e2; }, f: F }; } throw new TypeError("Invalid attempt to iterate non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); } var normalCompletion = true, didErr = false, err; return { s: function s() { it = it.call(o); }, n: function n() { var step = it.next(); normalCompletion = step.done; return step; }, e: function e(_e3) { didErr = true; err = _e3; }, f: function f() { try { if (!normalCompletion && it.return != null) it.return(); } finally { if (didErr) throw err; } } }; }
+function _slicedToArray(arr, i) { return _arrayWithHoles(arr) || _iterableToArrayLimit(arr, i) || _unsupportedIterableToArray(arr, i) || _nonIterableRest(); }
+function _nonIterableRest() { throw new TypeError("Invalid attempt to destructure non-iterable instance.\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method."); }
+function _unsupportedIterableToArray(o, minLen) { if (!o) return; if (typeof o === "string") return _arrayLikeToArray(o, minLen); var n = Object.prototype.toString.call(o).slice(8, -1); if (n === "Object" && o.constructor) n = o.constructor.name; if (n === "Map" || n === "Set") return Array.from(o); if (n === "Arguments" || /^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(n)) return _arrayLikeToArray(o, minLen); }
+function _arrayLikeToArray(arr, len) { if (len == null || len > arr.length) len = arr.length; for (var i = 0, arr2 = new Array(len); i < len; i++) arr2[i] = arr[i]; return arr2; }
+function _iterableToArrayLimit(arr, i) { var _i = null == arr ? null : "undefined" != typeof Symbol && arr[Symbol.iterator] || arr["@@iterator"]; if (null != _i) { var _s, _e, _x, _r, _arr = [], _n = !0, _d = !1; try { if (_x = (_i = _i.call(arr)).next, 0 === i) { if (Object(_i) !== _i) return; _n = !1; } else for (; !(_n = (_s = _x.call(_i)).done) && (_arr.push(_s.value), _arr.length !== i); _n = !0); } catch (err) { _d = !0, _e = err; } finally { try { if (!_n && null != _i.return && (_r = _i.return(), Object(_r) !== _r)) return; } finally { if (_d) throw _e; } } return _arr; } }
+function _arrayWithHoles(arr) { if (Array.isArray(arr)) return arr; }
+import { useScroll } from 'ahooks';
+import { useEffect, useMemo, useRef, useState } from 'react';
+import { getColumnWidth, getElementOffset, getElementSize, getWindowScroll, getWindowSize, isSameElementScroll, isSameElementSize } from "./utils";
+export function useConstRef(value) {
+  var ref = useRef(value);
+  ref.current = value;
+  return ref;
+}
+export function useWindowSize() {
+  var _useState = useState(function () {
+      return getWindowSize();
+    }),
+    _useState2 = _slicedToArray(_useState, 2),
+    windowSize = _useState2[0],
+    setWindowSize = _useState2[1];
+  var windowSizeRef = useConstRef(windowSize);
+  useEffect(function () {
+    function onResize() {
+      var nextWindowSize = getWindowSize();
+      if (!isSameElementSize(windowSizeRef.current, nextWindowSize)) {
+        setWindowSize(nextWindowSize);
+      }
+    }
+    window.addEventListener('resize', onResize);
+    return function () {
+      return window.removeEventListener('resize', onResize);
+    };
+  }, [windowSizeRef]);
+  return windowSize;
+}
+export function useElementSize(ref) {
+  var _useState3 = useState(function () {
+      if (ref.current) {
+        return getElementSize(ref.current);
+      } else {
+        return null;
+      }
+    }),
+    _useState4 = _slicedToArray(_useState3, 2),
+    elementSize = _useState4[0],
+    setElementSize = _useState4[1];
+  var elementSizeRef = useConstRef(elementSize);
+  useEffect(function () {
+    var observer = new ResizeObserver(function (entries) {
+      var nextElementSize = getElementSize(entries[0].target);
+      if (elementSizeRef.current === null || !isSameElementSize(elementSizeRef.current, nextElementSize)) {
+        setElementSize(nextElementSize);
+      }
+    });
+    if (ref.current) observer.observe(ref.current);
+    return function () {
+      return observer.disconnect();
+    };
+  }, [ref]);
+  return elementSize;
+}
+export function useWindowScroll() {
+  var _useState5 = useState(getWindowScroll()),
+    _useState6 = _slicedToArray(_useState5, 2),
+    scrollPosition = _useState6[0],
+    setScrollPosition = _useState6[1];
+  var ref = useConstRef(scrollPosition);
+  useEffect(function () {
+    function update() {
+      var nextScrollPosition = getWindowScroll();
+      if (!isSameElementScroll(ref.current, nextScrollPosition)) {
+        setScrollPosition(nextScrollPosition);
+      }
+    }
+    window.addEventListener('scroll', update);
+    window.addEventListener('resize', update);
+    return function () {
+      window.removeEventListener('scroll', update);
+      window.removeEventListener('resize', update);
+    };
+  }, [ref]);
+  return scrollPosition;
+}
+export function useElementWindowOffset(ref) {
+  var _useState7 = useState(function () {
+      if (ref.current) {
+        return getElementOffset(ref.current);
+      } else {
+        return null;
+      }
+    }),
+    _useState8 = _slicedToArray(_useState7, 2),
+    elementOffset = _useState8[0],
+    setElementOffset = _useState8[1];
+  useEffect(function () {
+    var observer = new ResizeObserver(function (entries) {
+      setElementOffset(getElementOffset(entries[0].target));
+    });
+    if (ref.current) observer.observe(ref.current);
+    return function () {
+      return observer.disconnect();
+    };
+  }, [ref]);
+  return elementOffset;
+}
+export function useIntersecting(ref, rootMargin) {
+  var _useState9 = useState(false),
+    _useState10 = _slicedToArray(_useState9, 2),
+    intersecting = _useState10[0],
+    setIntersecting = _useState10[1];
+  useEffect(function () {
+    var observer = new IntersectionObserver(function (entries) {
+      setIntersecting(entries[0].isIntersecting);
+    }, {
+      rootMargin: rootMargin
+    });
+    if (ref.current) observer.observe(ref.current);
+    return function () {
+      return observer.disconnect();
+    };
+  }, [ref, rootMargin]);
+  return intersecting;
+}
+export function useGridListContainerData(ref) {
+  var windowSize = useWindowSize();
+  var windowScroll = useScroll(ref);
+  var elementWindowOffset = useElementWindowOffset(ref);
+  var elementSize = useElementSize(ref);
+  return useMemo(function () {
+    return {
+      windowSize: windowSize,
+      windowScroll: {
+        x: (windowScroll === null || windowScroll === void 0 ? void 0 : windowScroll.left) || 0,
+        y: (windowScroll === null || windowScroll === void 0 ? void 0 : windowScroll.top) || 0
+      },
+      elementWindowOffset: elementWindowOffset,
+      elementSize: elementSize
+    };
+  }, [windowSize, windowScroll, elementWindowOffset, elementSize]);
+}
+export function useGridListConfigData(containerData, props) {
+  var items = props.items,
+    getWindowMargin = props.getWindowMargin,
+    getGridGap = props.getGridGap,
+    getColumnCount = props.getColumnCount,
+    getItemData = props.getItemData;
+  var elementWidth = containerData.elementSize ? containerData.elementSize.width : null;
+  var windowMargin = useMemo(function () {
+    if (getWindowMargin) {
+      return getWindowMargin(containerData.windowSize.height);
+    } else {
+      return containerData.windowSize.height;
+    }
+  }, [containerData.windowSize.height, getWindowMargin]);
+  var gridGap = useMemo(function () {
+    if (elementWidth === null) return null;
+    if (getGridGap) {
+      return getGridGap(elementWidth, containerData.windowSize.height);
+    } else {
+      return 0;
+    }
+  }, [elementWidth, containerData.windowSize.height, getGridGap]);
+  var columnCount = useMemo(function () {
+    if (elementWidth === null) return null;
+    if (gridGap === null) return null;
+    return getColumnCount(elementWidth, gridGap);
+  }, [getColumnCount, elementWidth, gridGap]);
+  var columnWidth = getColumnWidth(columnCount, gridGap, elementWidth);
+  var entries = useMemo(function () {
+    if (columnWidth === null) return null;
+    var safeColumnWidth = columnWidth;
+    return items.map(function (item) {
+      return {
+        data: getItemData(item, safeColumnWidth),
+        item: item
+      };
+    });
+  }, [items, columnWidth, getItemData]);
+  return useMemo(function () {
+    if (windowMargin === null || gridGap === null || columnCount === null || entries === null) {
+      return null;
+    }
+    return {
+      windowMargin: windowMargin,
+      gridGap: gridGap,
+      columnCount: columnCount,
+      entries: entries
+    };
+  }, [windowMargin, gridGap, columnCount, entries]);
+}
+export function useGridListLayoutData(configData) {
+  return useMemo(function () {
+    if (configData === null) return null;
+    var currentRowNumber = 1;
+    var prevRowsTotalHeight = 0;
+    var currentRowMaxHeight = 0;
+    var cells = configData.entries.map(function (entry, index) {
+      var key = entry.data.key;
+      var columnNumber = index % configData.columnCount + 1;
+      var rowNumber = Math.floor(index / configData.columnCount) + 1;
+      if (rowNumber !== currentRowNumber) {
+        currentRowNumber = rowNumber;
+        prevRowsTotalHeight += currentRowMaxHeight + configData.gridGap;
+        currentRowMaxHeight = 0;
+      }
+      var offset = prevRowsTotalHeight;
+      var height = Math.round(entry.data.height);
+      var width = Math.round(entry.data.width);
+      currentRowMaxHeight = Math.max(currentRowMaxHeight, height);
+      return {
+        key: key,
+        columnNumber: columnNumber,
+        rowNumber: rowNumber,
+        offset: offset,
+        height: height,
+        width: width,
+        item: entry.item
+      };
+    });
+    var totalHeight = prevRowsTotalHeight + currentRowMaxHeight;
+    return {
+      totalHeight: totalHeight,
+      cells: cells
+    };
+  }, [configData]);
+}
+export function useGridListRenderData(containerData, configData, layoutData) {
+  return useMemo(function () {
+    if (layoutData === null || configData === null) return null;
+    var cellsToRender = [];
+    var firstRenderedRowNumber = null;
+    var firstRenderedRowOffset = null;
+    if (containerData.elementWindowOffset !== null) {
+      var elementWindowOffset = containerData.elementWindowOffset;
+      var _iterator = _createForOfIteratorHelper(layoutData.cells),
+        _step;
+      try {
+        for (_iterator.s(); !(_step = _iterator.n()).done;) {
+          var cell = _step.value;
+          var cellTop = elementWindowOffset + cell.offset;
+          var cellBottom = cellTop + cell.height;
+          var windowTop = containerData.windowScroll.y;
+          var windowBottom = windowTop + containerData.windowSize.height;
+          var renderTop = windowTop - configData.windowMargin;
+          var renderBottom = windowBottom + configData.windowMargin;
+          if (cellTop > renderBottom) continue;
+          if (cellBottom < renderTop) continue;
+          if (firstRenderedRowNumber === null) {
+            firstRenderedRowNumber = cell.rowNumber;
+          }
+          if (cell.rowNumber === firstRenderedRowNumber) {
+            firstRenderedRowOffset = firstRenderedRowOffset ? Math.min(firstRenderedRowOffset, cell.offset) : cell.offset;
+          }
+          cellsToRender.push(cell);
+        }
+      } catch (err) {
+        _iterator.e(err);
+      } finally {
+        _iterator.f();
+      }
+    }
+    return {
+      cellsToRender: cellsToRender,
+      firstRenderedRowNumber: firstRenderedRowNumber,
+      firstRenderedRowOffset: firstRenderedRowOffset
+    };
+  }, [layoutData, configData, containerData.windowScroll.y, containerData.windowSize.height, containerData.elementWindowOffset]);
+}

package/es/GridList/index.d.ts

@@ -0,0 +1,14 @@
+import React from 'react';
+import { GridListCell, GridListItemData } from './interface';
+export interface GridListProps<P> {
+    items: P[];
+    getGridGap?: (elementWidth: number, windowHeight: number) => number;
+    getWindowMargin?: (windowHeight: number) => number;
+    getColumnCount: (elementWidth: number, gridGap: number) => number;
+    getItemData: (item: P, columnWidth: number) => GridListItemData;
+    renderItem: (item: P, cell: GridListCell<P>) => React.ReactNode;
+    fixedColumnWidth?: number;
+    className?: string;
+}
+declare const GridList: React.ForwardRefExoticComponent<GridListProps<unknown> & React.RefAttributes<HTMLDivElement>>;
+export default GridList;

package/es/GridList/index.js

@@ -0,0 +1,51 @@
+var _templateObject;
+function _taggedTemplateLiteral(strings, raw) { if (!raw) { raw = strings.slice(0); } return Object.freeze(Object.defineProperties(strings, { raw: { value: Object.freeze(raw) } })); }
+import { css } from '@emotion/css';
+import React, { useRef } from 'react';
+import { useGridListConfigData, useGridListContainerData, useGridListLayoutData, useGridListRenderData, useIntersecting } from "./hook";
+import { getGridRowStart } from "./utils";
+import { jsx as _jsx } from "react/jsx-runtime";
+var cloudappGridListCss = css(_templateObject || (_templateObject = _taggedTemplateLiteral(["\n  width: 100%;\n  height: 100%;\n  padding: 20px;\n  overflow: auto;\n  contain: strict;\n  box-sizing: border-box;\n"])));
+var GridList = /*#__PURE__*/React.forwardRef(function GridList(props, ref) {
+  var containerRef = useRef(null);
+  var domRef = ref !== null && ref !== void 0 ? ref : containerRef;
+  var containerData = useGridListContainerData(domRef);
+  var configData = useGridListConfigData(containerData, props);
+  var layoutData = useGridListLayoutData(configData);
+  var renderData = useGridListRenderData(containerData, configData, layoutData);
+  var intersecting = useIntersecting(domRef, "".concat(configData !== null ? configData.windowMargin : 0, "px"));
+  var colWidth = props.fixedColumnWidth ? "".concat(props.fixedColumnWidth, "px") : '1fr';
+  return /*#__PURE__*/_jsx("div", {
+    ref: domRef,
+    className: "".concat(cloudappGridListCss, " ").concat(props.className || ''),
+    children: /*#__PURE__*/_jsx("div", {
+      style: {
+        boxSizing: 'border-box',
+        height: layoutData !== null ? layoutData.totalHeight : undefined,
+        paddingTop: renderData !== null && renderData.firstRenderedRowOffset !== null ? renderData.firstRenderedRowOffset : 0
+      },
+      children: intersecting && /*#__PURE__*/_jsx("div", {
+        style: {
+          display: 'grid',
+          gridTemplateColumns: configData !== null ? "repeat(".concat(configData.columnCount, ", ").concat(colWidth, ")") : undefined,
+          gridGap: configData ? configData.gridGap : undefined,
+          justifyContent: 'center',
+          alignItems: 'center'
+        },
+        children: renderData !== null && renderData.cellsToRender.map(function (cell) {
+          return /*#__PURE__*/_jsx("div", {
+            style: {
+              height: cell.height,
+              // maxWidth: cell.width,
+              width: '100%',
+              gridColumnStart: "".concat(cell.columnNumber),
+              gridRowStart: getGridRowStart(cell, renderData)
+            },
+            children: props.renderItem(cell.item, cell)
+          }, cell.key);
+        })
+      })
+    })
+  });
+});
+export default GridList;

package/es/GridList/interface.d.ts

@@ -0,0 +1,59 @@
+import { MutableRefObject } from 'react';
+
+export type ConstRef<T> = Readonly<MutableRefObject<T>>;
+
+export interface ElementSize {
+  width: number;
+  height: number;
+}
+
+export interface ElementScroll {
+  x: number;
+  y: number;
+}
+
+export interface GridListItemData {
+  key: string;
+  height: number;
+  width: number;
+}
+
+export interface GridListEntry<P> {
+  item: P;
+  data: GridListItemData;
+}
+
+export interface GridListConfigData<P> {
+  windowMargin: number;
+  gridGap: number;
+  columnCount: number;
+  entries: GridListEntry<P>[];
+}
+
+export interface GridListContainerData {
+  windowSize: ElementSize;
+  elementSize: ElementSize | null;
+  windowScroll: ElementScroll;
+  elementWindowOffset: number | null;
+}
+
+export interface GridListCell<P> {
+  key: string;
+  columnNumber: number;
+  rowNumber: number;
+  offset: number;
+  height: number;
+  width: number;
+  item: P;
+}
+
+export interface GridListLayoutData<P> {
+  totalHeight: number;
+  cells: GridListCell<P>[];
+}
+
+export interface GridListRenderData<P> {
+  cellsToRender: GridListCell<P>[];
+  firstRenderedRowNumber: number | null;
+  firstRenderedRowOffset: number | null;
+}

package/es/GridList/utils.d.ts

@@ -0,0 +1,9 @@
+import { ElementScroll, ElementSize, GridListCell, GridListRenderData } from './interface';
+export declare function isSameElementSize(a: ElementSize, b: ElementSize): boolean;
+export declare function getWindowSize(): ElementSize;
+export declare function getElementSize(element: Element): ElementSize;
+export declare function isSameElementScroll(a: ElementScroll, b: ElementScroll): boolean;
+export declare function getWindowScroll(): ElementScroll;
+export declare function getElementOffset(element: Element): number;
+export declare function getColumnWidth(columnCount: number | null, gridGap: number | null, elementWidth: number | null): number | null;
+export declare function getGridRowStart<P>(cell: GridListCell<P>, renderData: GridListRenderData<P> | null): string | undefined;

package/es/GridList/utils.js

@@ -0,0 +1,42 @@
+export function isSameElementSize(a, b) {
+  return a.width === b.width && a.height === b.height;
+}
+export function getWindowSize() {
+  return {
+    width: window.innerWidth,
+    height: window.innerHeight
+  };
+}
+export function getElementSize(element) {
+  var rect = element.getBoundingClientRect();
+  return {
+    width: rect.width,
+    height: rect.height
+  };
+}
+export function isSameElementScroll(a, b) {
+  return a.x === b.x && a.y === b.y;
+}
+export function getWindowScroll() {
+  return {
+    x: window.scrollX,
+    y: window.scrollY
+  };
+}
+export function getElementOffset(element) {
+  return window.scrollY + element.getBoundingClientRect().top;
+}
+export function getColumnWidth(columnCount, gridGap, elementWidth) {
+  if (columnCount === null || gridGap === null || elementWidth === null) {
+    return null;
+  }
+  var totalGapSpace = (columnCount - 1) * gridGap;
+  var columnWidth = Math.round((elementWidth - totalGapSpace) / columnCount);
+  return columnWidth;
+}
+export function getGridRowStart(cell, renderData) {
+  if (renderData === null) return undefined;
+  var offset = renderData.firstRenderedRowNumber !== null ? renderData.firstRenderedRowNumber - 1 : 0;
+  var gridRowStart = cell.rowNumber - offset;
+  return "".concat(gridRowStart);
+}

package/es/HightLevel/index.d.ts

@@ -0,0 +1,8 @@
+import React from 'react';
+interface HightLevelProps {
+    keyword: string;
+    name: string;
+}
+declare function HighLevel({ keyword, name }: HightLevelProps): import("react/jsx-runtime").JSX.Element;
+declare const _default: React.MemoExoticComponent<typeof HighLevel>;
+export default _default;

package/es/HightLevel/index.js

@@ -0,0 +1,20 @@
+import { escapeRegExp, replace } from 'lodash-es';
+import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+function HighLevel(_ref) {
+  var keyword = _ref.keyword,
+    name = _ref.name;
+  if (!keyword) {
+    return /*#__PURE__*/_jsx("span", {
+      children: name
+    });
+  }
+  var reg = new RegExp(escapeRegExp(keyword), 'g');
+  var html = replace(name, reg, "<span style=\"color: var(--primary-dark);\">".concat(keyword, "</span>"));
+  return /*#__PURE__*/_jsx("span", {
+    dangerouslySetInnerHTML: {
+      __html: html
+    }
+  });
+}
+export default /*#__PURE__*/React.memo(HighLevel);

package/es/IconFont/index.d.ts

@@ -0,0 +1,12 @@
+import React from 'react';
+export interface IIconFontProps extends React.HTMLAttributes<HTMLSpanElement> {
+    type?: string;
+    className?: string;
+    title?: string;
+    style?: React.CSSProperties;
+}
+declare function IconFont({ type, className, title, style, ...props }: IIconFontProps): import("react/jsx-runtime").JSX.Element;
+declare namespace IconFont {
+    var registerIconFont: (scriptUrl: string) => void;
+}
+export default IconFont;

package/es/IconFont/index.js

@@ -0,0 +1,63 @@
+function _typeof(obj) { "@babel/helpers - typeof"; return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function (obj) { return typeof obj; } : function (obj) { return obj && "function" == typeof Symbol && obj.constructor === Symbol && obj !== Symbol.prototype ? "symbol" : typeof obj; }, _typeof(obj); }
+var _excluded = ["type", "className", "title", "style"];
+function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); enumerableOnly && (symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; })), keys.push.apply(keys, symbols); } return keys; }
+function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = null != arguments[i] ? arguments[i] : {}; i % 2 ? ownKeys(Object(source), !0).forEach(function (key) { _defineProperty(target, key, source[key]); }) : Object.getOwnPropertyDescriptors ? Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)) : ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } return target; }
+function _defineProperty(obj, key, value) { key = _toPropertyKey(key); if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _toPropertyKey(arg) { var key = _toPrimitive(arg, "string"); return _typeof(key) === "symbol" ? key : String(key); }
+function _toPrimitive(input, hint) { if (_typeof(input) !== "object" || input === null) return input; var prim = input[Symbol.toPrimitive]; if (prim !== undefined) { var res = prim.call(input, hint || "default"); if (_typeof(res) !== "object") return res; throw new TypeError("@@toPrimitive must return a primitive value."); } return (hint === "string" ? String : Number)(input); }
+function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
+function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
+import React from 'react';
+import { jsx as _jsx } from "react/jsx-runtime";
+var global = window;
+if (!global._ICON_SCRIPT_URL) {
+  global._ICON_SCRIPT_URL = {};
+}
+function loadScript(url) {
+  return new Promise(function (resolve, reject) {
+    var script = document.createElement('script');
+    script.src = url;
+    document.body.appendChild(script);
+    script.addEventListener('load', function () {
+      resolve(null);
+    });
+    script.addEventListener('error', function (err) {
+      reject(err);
+    });
+  });
+}
+function registerIconFont(scriptUrl) {
+  if (!global._ICON_SCRIPT_URL[scriptUrl]) {
+    global._ICON_SCRIPT_URL[scriptUrl] = true;
+    loadScript(scriptUrl).catch(function (e) {
+      global._ICON_SCRIPT_URL[scriptUrl] = false;
+      console.error(e);
+    });
+  }
+}
+function IconFont(_ref) {
+  var type = _ref.type,
+    _ref$className = _ref.className,
+    className = _ref$className === void 0 ? '' : _ref$className,
+    title = _ref.title,
+    style = _ref.style,
+    props = _objectWithoutProperties(_ref, _excluded);
+  return /*#__PURE__*/_jsx("i", _objectSpread(_objectSpread({
+    className: "anticon ".concat(className),
+    title: title,
+    style: style
+  }, props), {}, {
+    children: /*#__PURE__*/_jsx("svg", {
+      width: "1em",
+      height: "1em",
+      fill: "currentColor",
+      "aria-hidden": "true",
+      focusable: "false",
+      children: /*#__PURE__*/_jsx("use", {
+        xlinkHref: "#".concat(type)
+      })
+    })
+  }));
+}
+IconFont.registerIconFont = registerIconFont;
+export default IconFont;

package/es/InstanceHistory/index.d.ts

@@ -0,0 +1,3 @@
+import { VHistory } from '../useHistory/interface';
+declare const InstanceHistory: VHistory;
+export default InstanceHistory;