@clickhouse/click-ui 0.0.136 → 0.0.137

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -31394,6 +31394,7 @@ const Grid = forwardRef(({
31394
31394
  onCopyCallback,
31395
31395
  onContextMenu: onContextMenuProp,
31396
31396
  forwardedGridRef,
31397
+ onItemsRendered: onItemsRenderedProp,
31397
31398
  ...props
31398
31399
  }, forwardedRef) => {
31399
31400
  const [focus, setFocus] = useState(focusProp ?? {
@@ -31836,11 +31837,29 @@ const Grid = forwardRef(({
31836
31837
  setMenuOptions([...defaultMenuOptions, ...newOptions]);
31837
31838
  }
31838
31839
  };
31840
+ const lastItemsRenderedProps = useRef();
31841
+ const lastRowStart = useRef(rowStart);
31842
+ const onItemsRendered = useCallback((props2) => {
31843
+ lastItemsRenderedProps.current = props2;
31844
+ return onItemsRenderedProp == null ? void 0 : onItemsRenderedProp({
31845
+ ...props2,
31846
+ visibleRowStartIndex: props2.visibleRowStartIndex + rowStart,
31847
+ visibleRowStopIndex: props2.visibleRowStopIndex + rowStart,
31848
+ overscanRowStartIndex: props2.overscanRowStartIndex + rowStart,
31849
+ overscanRowStopIndex: props2.overscanRowStopIndex + rowStart
31850
+ });
31851
+ }, [onItemsRenderedProp, rowStart]);
31852
+ useEffect(() => {
31853
+ if (lastItemsRenderedProps.current && rowStart !== lastRowStart.current) {
31854
+ onItemsRendered(lastItemsRenderedProps.current);
31855
+ lastRowStart.current = rowStart;
31856
+ }
31857
+ }, [rowStart, onItemsRendered]);
31839
31858
  return /* @__PURE__ */ jsxRuntimeExports.jsxs(ContextMenu, { modal: false, onOpenChange: setContextMenuOpen, children: [
31840
31859
  /* @__PURE__ */ jsxRuntimeExports.jsx(ContextMenuTrigger, { as: ContextMenu.Trigger, ref: mergeRefs([forwardedRef, containerRef]), tabIndex: 0, onMouseDown, onMouseMove, onKeyDown, onPointerDown, onPointerUp, onPointerLeave: setPointerCapture, onPointerEnter: setPointerCapture, onContextMenu, $rounded: rounded, $height: autoHeight ? rowCount * rowHeight + (showHeader ? headerHeight : 0) + elementBorderRef.current.scrollBarHeight : void 0, $showBorder: showBorder, children: /* @__PURE__ */ jsxRuntimeExports.jsx(AutoSizer, { onResize, children: ({
31841
31860
  height,
31842
31861
  width
31843
- }) => /* @__PURE__ */ jsxRuntimeExports.jsx(VariableSizeGrid, { ref: forwardedGridRef ? mergeRefs([forwardedGridRef, gridRef]) : gridRef, height, width, columnCount, rowHeight: () => rowHeight, useIsScrolling, innerElementType: InnerElementType, itemData: data, initialScrollTop: focus.row < rowStart ? focus.row * rowHeight : (focus.row - rowStart) * rowHeight, initialScrollLeft: getColumnHorizontalPosition(focus.column), columnWidth, rowCount, onScroll, outerRef, outerElementType: OuterElementType, ...props, children: Cell }) }) }),
31862
+ }) => /* @__PURE__ */ jsxRuntimeExports.jsx(VariableSizeGrid, { ref: forwardedGridRef ? mergeRefs([forwardedGridRef, gridRef]) : gridRef, height, width, columnCount, rowHeight: () => rowHeight, useIsScrolling, innerElementType: InnerElementType, itemData: data, initialScrollTop: focus.row < rowStart ? focus.row * rowHeight : (focus.row - rowStart) * rowHeight, initialScrollLeft: getColumnHorizontalPosition(focus.column), columnWidth, rowCount, onScroll, outerRef, outerElementType: OuterElementType, onItemsRendered, ...props, children: Cell }) }) }),
31844
31863
  /* @__PURE__ */ jsxRuntimeExports.jsx(ContextMenu.Content, { children: menuOptions.map((option2, index2) => /* @__PURE__ */ jsxRuntimeExports.jsx(ContextMenu.Item, { onSelect: option2.onSelect, children: option2.label }, `grid-${index2}`)) })
31845
31864
  ] });
31846
31865
  });
@@ -31411,6 +31411,7 @@ var __publicField = (obj, key, value) => {
31411
31411
  onCopyCallback,
31412
31412
  onContextMenu: onContextMenuProp,
31413
31413
  forwardedGridRef,
31414
+ onItemsRendered: onItemsRenderedProp,
31414
31415
  ...props
31415
31416
  }, forwardedRef) => {
31416
31417
  const [focus, setFocus] = React.useState(focusProp ?? {
@@ -31853,11 +31854,29 @@ var __publicField = (obj, key, value) => {
31853
31854
  setMenuOptions([...defaultMenuOptions, ...newOptions]);
31854
31855
  }
31855
31856
  };
31857
+ const lastItemsRenderedProps = React.useRef();
31858
+ const lastRowStart = React.useRef(rowStart);
31859
+ const onItemsRendered = React.useCallback((props2) => {
31860
+ lastItemsRenderedProps.current = props2;
31861
+ return onItemsRenderedProp == null ? void 0 : onItemsRenderedProp({
31862
+ ...props2,
31863
+ visibleRowStartIndex: props2.visibleRowStartIndex + rowStart,
31864
+ visibleRowStopIndex: props2.visibleRowStopIndex + rowStart,
31865
+ overscanRowStartIndex: props2.overscanRowStartIndex + rowStart,
31866
+ overscanRowStopIndex: props2.overscanRowStopIndex + rowStart
31867
+ });
31868
+ }, [onItemsRenderedProp, rowStart]);
31869
+ React.useEffect(() => {
31870
+ if (lastItemsRenderedProps.current && rowStart !== lastRowStart.current) {
31871
+ onItemsRendered(lastItemsRenderedProps.current);
31872
+ lastRowStart.current = rowStart;
31873
+ }
31874
+ }, [rowStart, onItemsRendered]);
31856
31875
  return /* @__PURE__ */ jsxRuntimeExports.jsxs(ContextMenu, { modal: false, onOpenChange: setContextMenuOpen, children: [
31857
31876
  /* @__PURE__ */ jsxRuntimeExports.jsx(ContextMenuTrigger, { as: ContextMenu.Trigger, ref: mergeRefs([forwardedRef, containerRef]), tabIndex: 0, onMouseDown, onMouseMove, onKeyDown, onPointerDown, onPointerUp, onPointerLeave: setPointerCapture, onPointerEnter: setPointerCapture, onContextMenu, $rounded: rounded, $height: autoHeight ? rowCount * rowHeight + (showHeader ? headerHeight : 0) + elementBorderRef.current.scrollBarHeight : void 0, $showBorder: showBorder, children: /* @__PURE__ */ jsxRuntimeExports.jsx(AutoSizer, { onResize, children: ({
31858
31877
  height,
31859
31878
  width
31860
- }) => /* @__PURE__ */ jsxRuntimeExports.jsx(VariableSizeGrid, { ref: forwardedGridRef ? mergeRefs([forwardedGridRef, gridRef]) : gridRef, height, width, columnCount, rowHeight: () => rowHeight, useIsScrolling, innerElementType: InnerElementType, itemData: data, initialScrollTop: focus.row < rowStart ? focus.row * rowHeight : (focus.row - rowStart) * rowHeight, initialScrollLeft: getColumnHorizontalPosition(focus.column), columnWidth, rowCount, onScroll, outerRef, outerElementType: OuterElementType, ...props, children: Cell }) }) }),
31879
+ }) => /* @__PURE__ */ jsxRuntimeExports.jsx(VariableSizeGrid, { ref: forwardedGridRef ? mergeRefs([forwardedGridRef, gridRef]) : gridRef, height, width, columnCount, rowHeight: () => rowHeight, useIsScrolling, innerElementType: InnerElementType, itemData: data, initialScrollTop: focus.row < rowStart ? focus.row * rowHeight : (focus.row - rowStart) * rowHeight, initialScrollLeft: getColumnHorizontalPosition(focus.column), columnWidth, rowCount, onScroll, outerRef, outerElementType: OuterElementType, onItemsRendered, ...props, children: Cell }) }) }),
31861
31880
  /* @__PURE__ */ jsxRuntimeExports.jsx(ContextMenu.Content, { children: menuOptions.map((option, index2) => /* @__PURE__ */ jsxRuntimeExports.jsx(ContextMenu.Item, { onSelect: option.onSelect, children: option.label }, `grid-${index2}`)) })
31862
31881
  ] });
31863
31882
  });
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@clickhouse/click-ui",
3
- "version": "0.0.136",
3
+ "version": "0.0.137",
4
4
  "description": "Official ClickHouse design system react library",
5
5
  "type": "module",
6
6
  "license": "Apache-2.0",