@7shifts/sous-chef 3.57.3-beta0 → 3.57.3-beta1

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.
package/dist/index.js CHANGED
@@ -6279,13 +6279,25 @@ var styles$19 = {"data-table-scroll-fake-border":"_wZ8Xg","data-table-scroll-fak
6279
6279
  */
6280
6280
  var DataTableScrollFakeBorder = function DataTableScrollFakeBorder(_ref) {
6281
6281
  var _classNames, _classNames2, _classNames3;
6282
- var placement = _ref.placement;
6282
+ var placement = _ref.placement,
6283
+ tableRef = _ref.tableRef;
6284
+ var _React$useState = React__default["default"].useState(24),
6285
+ headerheight = _React$useState[0],
6286
+ setHeaderHeight = _React$useState[1];
6287
+ React.useLayoutEffect(function () {
6288
+ if (!tableRef.current) {
6289
+ return;
6290
+ }
6291
+ var header = tableRef.current.getElementsByTagName('thead')[0];
6292
+ setHeaderHeight(header.clientHeight);
6293
+ }, [setHeaderHeight, tableRef]);
6283
6294
  var backgroundColor = useBackgroundColor();
6284
6295
  return React__default["default"].createElement("div", {
6285
6296
  className: classnames__default["default"](styles$19['data-table-scroll-fake-border'], (_classNames = {}, _classNames[styles$19['data-table-scroll-fake-border--top']] = placement === 'top', _classNames[styles$19['data-table-scroll-fake-border--bottom']] = placement === 'bottom', _classNames)),
6286
- // @ts-expect-error This difines a custom CSS variable
6287
6297
  style: {
6288
- '--corner-background-color': backgroundColor
6298
+ // @ts-expect-error This difines a custom CSS variable
6299
+ '--corner-background-color': backgroundColor,
6300
+ top: placement === 'top' ? headerheight : undefined
6289
6301
  }
6290
6302
  }, React__default["default"].createElement("div", {
6291
6303
  className: classnames__default["default"](styles$19['data-table-scroll-fake-border__left'], (_classNames2 = {}, _classNames2[styles$19['data-table-scroll-fake-border__left--top']] = placement === 'top', _classNames2[styles$19['data-table-scroll-fake-border__left--bottom']] = placement === 'bottom', _classNames2))
@@ -9318,7 +9330,8 @@ var DataTable = function DataTable(_ref) {
9318
9330
  isShowingFooter: !!isShowingFooter,
9319
9331
  tableRef: tableRef
9320
9332
  }, isShowingColumns && isScrollableTable && React__default["default"].createElement(DataTableScrollFakeBorder, {
9321
- placement: "top"
9333
+ placement: "top",
9334
+ tableRef: tableRef
9322
9335
  }), React__default["default"].createElement("div", {
9323
9336
  className: classnames__default["default"](styles$1a['data-table__content'], (_classNames = {}, _classNames[styles$1a['data-table__content--with-scroll']] = isScrollableTable, _classNames)),
9324
9337
  style: conditionalStyles
@@ -9353,7 +9366,8 @@ var DataTable = function DataTable(_ref) {
9353
9366
  className: styles$1a['data-table__footer'],
9354
9367
  "data-testid": testId && testId + "-footer"
9355
9368
  }, footerComponent)))), !isShowingFooter && isScrollableTable && React__default["default"].createElement(DataTableScrollFakeBorder, {
9356
- placement: "bottom"
9369
+ placement: "bottom",
9370
+ tableRef: tableRef
9357
9371
  })), React__default["default"].createElement(Pagination, null));
9358
9372
  };
9359
9373