@semcore/data-table 16.0.0-prerelease.7 → 16.0.0

package/lib/esm/Head.mjs

@@ -1,369 +0,0 @@
-import _objectSpread from "@babel/runtime/helpers/esm/objectSpread2";
-import _slicedToArray from "@babel/runtime/helpers/esm/slicedToArray";
-import _classCallCheck from "@babel/runtime/helpers/esm/classCallCheck";
-import _createClass from "@babel/runtime/helpers/esm/createClass";
-import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
-import _inherits from "@babel/runtime/helpers/esm/inherits";
-import _createSuper from "@babel/runtime/helpers/esm/createSuper";
-import _defineProperty from "@babel/runtime/helpers/esm/defineProperty";
-import { sstyled, assignProps, Component } from "@semcore/core";
-import React from "react";
-import { ScreenReaderOnly, Flex, Box } from "@semcore/flex-box";
-import ScrollArea, { hideScrollBarsFromScreenReadersContext } from "@semcore/scroll-area";
-import SortDesc from "@semcore/icon/SortDesc/m";
-import SortAsc from "@semcore/icon/SortAsc/m";
-import { callAllEventHandlers } from "@semcore/core/lib/utils/assignProps";
-import { flattenColumns, getFixedStyle, getScrollOffsetValue } from "./utils.mjs";
-import logger from "@semcore/core/lib/utils/logger";
-import { setRef } from "@semcore/core/lib/utils/ref";
-import { getFocusableIn } from "@semcore/core/lib/utils/focus-lock/getFocusableIn";
-var SORT_ICON_WIDTH = 20;
-var SORTING_ICON = {
-  desc: SortDesc,
-  asc: SortAsc
-};
-var ariaSort = {
-  desc: "descending",
-  asc: "ascending"
-};
-var displayContents = {
-  display: "contents"
-};
-function cssToIntDefault(value) {
-  var defaultValue = arguments.length > 1 && arguments[1] !== void 0 ? arguments[1] : 0;
-  var result = parseFloat(value);
-  if (Number.isNaN(result)) {
-    result = defaultValue;
-  }
-  return Math.round(result);
-}
-var Head = /* @__PURE__ */ function(_Component) {
-  _inherits(Head2, _Component);
-  var _super = _createSuper(Head2);
-  function Head2() {
-    var _this;
-    _classCallCheck(this, Head2);
-    for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
-      args[_key] = arguments[_key];
-    }
-    _this = _super.call.apply(_super, [this].concat(args));
-    _defineProperty(_assertThisInitialized(_this), "columns", []);
-    _defineProperty(_assertThisInitialized(_this), "headCellMap", /* @__PURE__ */ new Map());
-    _defineProperty(_assertThisInitialized(_this), "lockedCell", [null, false]);
-    _defineProperty(_assertThisInitialized(_this), "sortWrapperRefs", /* @__PURE__ */ new Map());
-    _defineProperty(_assertThisInitialized(_this), "defaultWidths", /* @__PURE__ */ new Map());
-    _defineProperty(_assertThisInitialized(_this), "handleKeyDown", function(e) {
-      if (e.currentTarget === _this.lockedCell[0]) {
-        var focusableChildren = Array.from(_this.lockedCell[0].children).flatMap(function(node) {
-          return getFocusableIn(node);
-        });
-        if (_this.lockedCell[1]) {
-          if (e.key === "Escape") {
-            var _this$lockedCell$;
-            (_this$lockedCell$ = _this.lockedCell[0]) === null || _this$lockedCell$ === void 0 ? void 0 : _this$lockedCell$.focus();
-            _this.lockedCell[1] = false;
-          }
-          if (e.key.startsWith("Arrow")) {
-            e.stopPropagation();
-          }
-          if (e.key === "Tab") {
-            if (e.target === focusableChildren[0] && e.shiftKey) {
-              var _focusableChildren;
-              (_focusableChildren = focusableChildren[focusableChildren.length - 1]) === null || _focusableChildren === void 0 ? void 0 : _focusableChildren.focus();
-              e.preventDefault();
-            } else if (e.target === focusableChildren[focusableChildren.length - 1] && !e.shiftKey) {
-              var _focusableChildren$;
-              (_focusableChildren$ = focusableChildren[0]) === null || _focusableChildren$ === void 0 ? void 0 : _focusableChildren$.focus();
-              e.preventDefault();
-            }
-          }
-        } else if (e.key === "Enter") {
-          var _focusableChildren$2;
-          _this.lockedCell[1] = true;
-          (_focusableChildren$2 = focusableChildren[0]) === null || _focusableChildren$2 === void 0 ? void 0 : _focusableChildren$2.focus();
-        } else if (e.key === "Tab") {
-          var _this$lockedCell$2;
-          (_this$lockedCell$2 = _this.lockedCell[0]) === null || _this$lockedCell$2 === void 0 ? void 0 : _this$lockedCell$2.setAttribute("inert", "");
-        }
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "onFocusCell", function(e) {
-      if (e.target === e.currentTarget) {
-        var focusableChildren = Array.from(e.currentTarget.children).flatMap(function(node) {
-          return getFocusableIn(node);
-        });
-        if (focusableChildren.length === 1) {
-          focusableChildren[0].focus();
-        } else if (focusableChildren.length > 1) {
-          _this.lockedCell = [e.currentTarget, false];
-        }
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "bindHandlerSortClick", function(name) {
-      return function(event) {
-        _this.asProps.$onSortClick(name, event);
-      };
-    });
-    _defineProperty(_assertThisInitialized(_this), "bindHandlerKeyDown", function(name) {
-      return function(event) {
-        if (event.key === "Enter" || event.key === " ") {
-          event.preventDefault();
-          _this.asProps.$onSortClick(name, event);
-        }
-      };
-    });
-    _defineProperty(_assertThisInitialized(_this), "makeSortRefHandler", function(active) {
-      return function(ref) {
-        if (ref) {
-          _this.sortWrapperRefs.set(ref, active);
-        }
-      };
-    });
-    _defineProperty(_assertThisInitialized(_this), "makeColumnRefHandler", function(column, index) {
-      return function(ref) {
-        setRef(column.props.ref, ref);
-        _this.headCellMap.set(index, ref);
-        if (column.props.forwardRef) {
-          setRef(column.props.forwardRef, ref);
-        }
-        if (ref && ref.getAttribute("scope") === "col") {
-          if (!_this.defaultWidths.has(ref)) {
-            var computedStyle = window.getComputedStyle(ref);
-            _this.defaultWidths.set(ref, {
-              minWidth: cssToIntDefault(computedStyle.getPropertyValue("min-width")),
-              computedWidth: cssToIntDefault(computedStyle.getPropertyValue("width")),
-              maxWidth: cssToIntDefault(computedStyle.getPropertyValue("max-width")) || null,
-              useForRecalculation: Boolean(column.props.sortSizeRecalculation)
-            });
-          }
-        }
-      };
-    });
-    _defineProperty(_assertThisInitialized(_this), "changeMaxNodeWidth", function(diff, exceptNode) {
-      var lastMaxWidth = 0;
-      var node = null;
-      var recalculatedNodes = [];
-      _this.defaultWidths.forEach(function(value, key) {
-        if (value.computedWidth > lastMaxWidth && key !== exceptNode) {
-          node = key;
-          lastMaxWidth = value.computedWidth;
-        }
-        if (value.useForRecalculation) {
-          recalculatedNodes.push(key);
-        }
-      });
-      var setNodeMinWidth = function setNodeMinWidth2(node2, diff2) {
-        var _this$defaultWidths$g, _this$defaultWidths$g2;
-        var defaultNodeWidth = (_this$defaultWidths$g = _this.defaultWidths.get(node2)) === null || _this$defaultWidths$g === void 0 ? void 0 : _this$defaultWidths$g.computedWidth;
-        var defaultNodeMinWidth = (_this$defaultWidths$g2 = _this.defaultWidths.get(node2)) === null || _this$defaultWidths$g2 === void 0 ? void 0 : _this$defaultWidths$g2.minWidth;
-        if (defaultNodeWidth) {
-          var maxWidth = defaultNodeWidth - diff2;
-          node2.style.setProperty("max-width", "".concat(maxWidth, "px"));
-          if (defaultNodeMinWidth) {
-            node2.style.setProperty("min-width", "min(".concat(maxWidth, "px, ").concat(defaultNodeMinWidth, "px)"));
-          }
-        }
-      };
-      if (recalculatedNodes.length > 0) {
-        var diffPart = diff / recalculatedNodes.length;
-        recalculatedNodes.forEach(function(node2) {
-          setNodeMinWidth(node2, diffPart);
-        });
-      } else if (node !== null) {
-        setNodeMinWidth(node, diff);
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "backToColumnDefaults", function(node) {
-      var _this$defaultWidths$g3, _this$defaultWidths$g4;
-      var defaultNodeMinWidth = (_this$defaultWidths$g3 = _this.defaultWidths.get(node)) === null || _this$defaultWidths$g3 === void 0 ? void 0 : _this$defaultWidths$g3.minWidth;
-      var defaultNodeMaxWidth = (_this$defaultWidths$g4 = _this.defaultWidths.get(node)) === null || _this$defaultWidths$g4 === void 0 ? void 0 : _this$defaultWidths$g4.maxWidth;
-      node.style.setProperty("min-width", defaultNodeMinWidth + "px");
-      if (defaultNodeMaxWidth) {
-        node.style.setProperty("max-width", defaultNodeMaxWidth + "px");
-      } else {
-        node.style.removeProperty("max-width");
-      }
-    });
-    _defineProperty(_assertThisInitialized(_this), "calculateActiveColumnMinWidth", function(node) {
-      var _this$defaultWidths$g5, _this$defaultWidths$g6;
-      var clonedColumn = document.createElement("div");
-      var computedStyle = window.getComputedStyle(node);
-      node.childNodes.forEach(function(node2) {
-        if (!_this.sortWrapperRefs.get(node2)) {
-          clonedColumn.append(node2.cloneNode(true));
-        }
-      });
-      clonedColumn.style.setProperty("visibility", "hidden", "important");
-      var styles = ["display", "flex", "margin", "padding", "background", "font-style", "font-width", "font-size", "font-weight"];
-      styles.forEach(function(key) {
-        clonedColumn.style.setProperty(key, computedStyle.getPropertyValue(key), computedStyle.getPropertyPriority(key));
-      });
-      clonedColumn.style.setProperty("width", "fit-content", "important");
-      document.body.appendChild(clonedColumn);
-      var computedWidth = Math.ceil(clonedColumn.getBoundingClientRect().width);
-      document.body.removeChild(clonedColumn);
-      var defaultNodeWidth = (_this$defaultWidths$g5 = (_this$defaultWidths$g6 = _this.defaultWidths.get(node)) === null || _this$defaultWidths$g6 === void 0 ? void 0 : _this$defaultWidths$g6.computedWidth) !== null && _this$defaultWidths$g5 !== void 0 ? _this$defaultWidths$g5 : 0;
-      if (computedWidth >= defaultNodeWidth) {
-        node.style.setProperty("min-width", defaultNodeWidth + SORT_ICON_WIDTH + "px");
-        _this.changeMaxNodeWidth(SORT_ICON_WIDTH, node);
-      } else {
-        var freeSpace = defaultNodeWidth - computedWidth;
-        if (freeSpace < SORT_ICON_WIDTH) {
-          node.style.setProperty("min-width", computedWidth + SORT_ICON_WIDTH + "px");
-          _this.changeMaxNodeWidth(freeSpace, node);
-        }
-      }
-    });
-    return _this;
-  }
-  _createClass(Head2, [{
-    key: "sortableColumnDescribeId",
-    value: function sortableColumnDescribeId() {
-      var uid = this.asProps.uid;
-      return "".concat(uid, "-column-sortable-describer");
-    }
-  }, {
-    key: "componentDidUpdate",
-    value: function componentDidUpdate() {
-      var _this2 = this;
-      var activeColumn = null;
-      this.columns.forEach(function(column) {
-        var _column$props = column.props, changeSortSize = _column$props.changeSortSize, ref = _column$props.ref;
-        if (column.active && changeSortSize && ref.current) {
-          activeColumn = ref.current;
-        }
-        if (ref.current) {
-          _this2.backToColumnDefaults(ref.current);
-        }
-      });
-      if (activeColumn) {
-        this.calculateActiveColumnMinWidth(activeColumn);
-      }
-    }
-  }, {
-    key: "renderColumns",
-    value: function renderColumns(columns, width) {
-      var _this3 = this;
-      return columns.map(function(column) {
-        return _this3.renderColumn(column, width);
-      });
-    }
-  }, {
-    key: "renderColumn",
-    value: function renderColumn(column, width) {
-      var _ref2, _column$columns;
-      var _this$asProps = this.asProps, styles = _this$asProps.styles, use = _this$asProps.use, hidden = _this$asProps.hidden, uid = _this$asProps.uid;
-      var SColumn = Flex;
-      var SHead = Box;
-      var SSortWrapper = "div";
-      var SSortIcon = SORTING_ICON[column.sortDirection];
-      var ariaSortValue = column.sortable && column.active ? ariaSort[column.sortDirection] : void 0;
-      var isGroup = ((_column$columns = column.columns) === null || _column$columns === void 0 ? void 0 : _column$columns.length) > 0;
-      var cSize = isGroup ? flattenColumns(column.columns).length : 1;
-      var _getFixedStyle = getFixedStyle(column, this.columns), _getFixedStyle2 = _slicedToArray(_getFixedStyle, 2), name = _getFixedStyle2[0], value = _getFixedStyle2[1];
-      var style = _objectSpread({
-        flexBasis: column.props.flex === void 0 && "".concat(width * cSize, "%")
-      }, column.props.style);
-      if (name !== void 0 && value !== void 0) {
-        style[name] = value;
-      }
-      if (!column.setVar) {
-        style["flexBasis"] = "var(".concat(column.varWidth, ")");
-      }
-      var ariaDescribedBy = [];
-      if (column.sortable && !column.active) {
-        ariaDescribedBy.push(this.sortableColumnDescribeId());
-      }
-      if (column.parentColumns.length > 0) {
-        var parentName = column.parentColumns[0].name;
-        ariaDescribedBy.push("igc-table-".concat(uid, "-").concat(parentName, "-group"));
-      }
-      var index = this.columns.findIndex(function(flattenCol) {
-        return flattenCol.name === column.name;
-      });
-      return _ref2 = sstyled(styles), /* @__PURE__ */ React.createElement(SColumn, _ref2.cn("SColumn", _objectSpread(_objectSpread({
-        "role": isGroup ? void 0 : "columnheader",
-        "scope": isGroup ? "colgroup" : "col",
-        "key": column.name,
-        "id": "igc-table-".concat(uid, "-").concat(column.name),
-        "use": use,
-        "fixed": column.fixed,
-        "resizable": column.resizable,
-        "sortable": column.sortable,
-        "borderLeft": isGroup ? false : column.borderLeft,
-        "borderRight": isGroup ? false : column.borderRight,
-        "active": isGroup ? false : column.active,
-        "group": isGroup,
-        "tabIndex": isGroup ? void 0 : -1,
-        "__excludeProps": ["hidden"]
-      }, column.props), {}, {
-        "ref": this.makeColumnRefHandler(column, index),
-        "onClick": callAllEventHandlers(column.props.onClick, column.sortable ? this.bindHandlerSortClick(column.name) : void 0),
-        "onKeyDown": callAllEventHandlers(column.props.onKeyDown, column.sortable ? this.bindHandlerKeyDown(column.name) : void 0, this.handleKeyDown),
-        "style": style,
-        "hidden": hidden,
-        "aria-sort": ariaSortValue,
-        "aria-colindex": isGroup ? void 0 : index + 1,
-        "onFocus": this.onFocusCell,
-        "aria-describedby": ariaDescribedBy.length > 0 ? ariaDescribedBy.join(" ") : void 0,
-        "innerOutline": true
-      })), isGroup ? /* @__PURE__ */ React.createElement(React.Fragment, null, /* @__PURE__ */ React.createElement(SColumn, _ref2.cn("SColumn", {
-        "id": "igc-table-".concat(uid, "-").concat(column.name, "-group"),
-        "groupHead": true,
-        "use": use,
-        "active": column.active,
-        "borderLeft": column.borderLeft,
-        "borderRight": column.borderRight
-      }), /* @__PURE__ */ React.createElement("div", _ref2.cn("div", {}), column.props.children)), /* @__PURE__ */ React.createElement(SHead, _ref2.cn("SHead", {}), this.renderColumns(column.columns, 100 / cSize))) : /* @__PURE__ */ React.createElement(React.Fragment, null, column.props.children, column.sortable ? /* @__PURE__ */ React.createElement(SSortWrapper, _ref2.cn("SSortWrapper", {
-        "ref": this.makeSortRefHandler(column.active)
-      }), /* @__PURE__ */ React.createElement(SSortIcon, _ref2.cn("SSortIcon", {}))) : null));
-    }
-  }, {
-    key: "render",
-    value: function render() {
-      var _ref = this.asProps, _ref3;
-      var SHead = Box;
-      var SHeadWrapper = Box;
-      var _this$asProps2 = this.asProps, Children = _this$asProps2.Children, styles = _this$asProps2.styles, columnsChildren = _this$asProps2.columnsChildren, onResize = _this$asProps2.onResize, $scrollRef = _this$asProps2.$scrollRef, sticky = _this$asProps2.sticky, withScrollBar = _this$asProps2.withScrollBar, animationsDisabled = _this$asProps2.animationsDisabled, getI18nText = _this$asProps2.getI18nText;
-      this.columns = flattenColumns(columnsChildren);
-      var _getScrollOffsetValue = getScrollOffsetValue(this.columns), _getScrollOffsetValue2 = _slicedToArray(_getScrollOffsetValue, 2), offsetLeftSum = _getScrollOffsetValue2[0], offsetRightSum = _getScrollOffsetValue2[1];
-      logger.warn(sticky, "'sticky' property is deprecated, use '<Sticky/>' wrapper", this.asProps["data-ui-name"] || Head2.displayName);
-      return _ref3 = sstyled(styles), /* @__PURE__ */ React.createElement(hideScrollBarsFromScreenReadersContext.Provider, {
-        value: true
-      }, /* @__PURE__ */ React.createElement(SHeadWrapper, _ref3.cn("SHeadWrapper", {
-        "sticky": sticky,
-        "animationsDisabled": animationsDisabled
-      }), /* @__PURE__ */ React.createElement(ScrollArea, _ref3.cn("ScrollArea", {
-        "leftOffset": offsetLeftSum,
-        "rightOffset": offsetRightSum,
-        "shadow": true,
-        "onResize": onResize
-      }), /* @__PURE__ */ React.createElement(ScrollArea.Container, {
-        ref: $scrollRef,
-        role: "rowgroup",
-        tabIndex: -1,
-        zIndex: 2
-      }, /* @__PURE__ */ React.createElement(SHead, _ref3.cn("SHead", _objectSpread({}, assignProps({
-        "role": "row",
-        "__excludeProps": ["hidden"]
-      }, _ref))), this.renderColumns(columnsChildren, 100 / this.columns.length))), Boolean(withScrollBar) && /* @__PURE__ */ React.createElement("div", _ref3.cn("div", {
-        "style": displayContents
-      }), /* @__PURE__ */ React.createElement("div", _ref3.cn("div", {
-        "style": displayContents
-      }), /* @__PURE__ */ React.createElement("div", _ref3.cn("div", {
-        "style": displayContents
-      }), /* @__PURE__ */ React.createElement(ScrollArea.Bar, {
-        orientation: "horizontal"
-      }))))), Children.origin, /* @__PURE__ */ React.createElement(ScreenReaderOnly, _ref3.cn("ScreenReaderOnly", {
-        "aria-hidden": true,
-        "id": this.sortableColumnDescribeId()
-      }), getI18nText === null || getI18nText === void 0 ? void 0 : getI18nText("sortableColumn"))));
-    }
-  }]);
-  return Head2;
-}(Component);
-_defineProperty(Head, "displayName", void 0);
-export {
-  SORT_ICON_WIDTH,
-  Head as default
-};

package/lib/types/Body.d.ts

@@ -1,61 +0,0 @@
-import React from 'react';
-import { Component } from '@semcore/core';
-import { RowData, Column, NestedCells, PropsLayer, Cell } from './types';
-import syncScroll from '@semcore/core/lib/utils/syncScroll';
-type AsProps = {
-    rows: NestedCells[][];
-    columns: Column[];
-    $scrollRef: ReturnType<ReturnType<typeof syncScroll>>;
-    onResize: ResizeObserverCallback;
-    onScroll?: (event: React.SyntheticEvent<HTMLElement>) => void;
-    rowPropsLayers: PropsLayer[];
-    use: 'primary' | 'secondary';
-    uniqueKey: string;
-    virtualScroll?: boolean | {
-        tollerance?: number;
-        rowHeight?: number;
-    };
-    renderRows?: (props: {
-        rows: NestedCells[][];
-        columns: Column[];
-        renderRow: (row: Cell[], details: {
-            dataIndex: number;
-            nested: boolean;
-        }) => React.ReactNode;
-    }) => React.ReactNode;
-    disabledScroll?: boolean;
-    uid?: string;
-    animationsDisabled?: boolean;
-    scrollContainerRef: React.Ref<HTMLDivElement>;
-};
-type State = {
-    rowHeight: number | undefined;
-    scrollAreaHeight: undefined | number;
-    scrollOffset: number;
-};
-declare class Body extends Component<AsProps, {}, State> {
-    state: State;
-    scrollContainerRef: React.RefObject<HTMLDivElement>;
-    firstRowRef: React.RefObject<HTMLDivElement>;
-    firstRowResizeObserver: ResizeObserver | null;
-    lockedCell: [HTMLElement | null, boolean];
-    getRowHeight: () => number | undefined;
-    handleKeyDown: (e: React.KeyboardEvent) => void;
-    onFocusCell: (e: React.FocusEvent<HTMLElement, HTMLElement>) => void;
-    renderCells(cells: NestedCells, rowData: RowData, dataIndex: number): React.ReactNode[];
-    renderRow(cells: NestedCells, { dataIndex, topOffset, nested, }: {
-        dataIndex: number;
-        topOffset?: number;
-        nested: boolean;
-    }): React.ReactNode;
-    renderRows(rows: NestedCells[], nested?: boolean): React.ReactNode[];
-    renderVirtualizedRows(rows: NestedCells[]): React.ReactNode[];
-    handleFirstRowResize: (entries: ResizeObserverEntry[]) => void;
-    handleScrollAreaResize: (entries: ResizeObserverEntry[]) => void;
-    handleScrollAreaScroll: (event: React.SyntheticEvent<HTMLElement>) => void;
-    setupRowSizeObserver: () => void;
-    handleBodyTransitionEnd: () => void;
-    componentWillUnmount(): void;
-    render(): JSX.Element;
-}
-export default Body;

package/lib/types/DataTable.d.ts

@@ -1,205 +0,0 @@
-import React from 'react';
-import { Property } from 'csstype';
-import { Component, PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';
-import { BoxProps, FlexProps } from '@semcore/flex-box';
-import type { Column } from './types';
-declare const ROW_GROUP: unique symbol;
-export type DataTableData = {
-    [key: string]: unknown;
-};
-export type DataTableSort<Column = string> = [sortBy: Column, sortDirection: 'desc' | 'asc'];
-export type DataTableTheme = 'muted' | 'info' | 'success' | 'warning' | 'danger';
-export type DataTableUse = 'primary' | 'secondary';
-export type DataTableRow = DataTableCell[];
-export type DataTableCell = {
-    /** Name of column */
-    name: string;
-    /** Data of column */
-    data: React.ReactNode;
-    [key: string]: unknown;
-};
-/**
- * Datatable must have an accessible name (aria-table-name).
- * It should describe table content.
- */
-type DataTableAriaProps = Intergalactic.RequireAtLeastOne<{
-    'aria-label'?: string;
-    'aria-labelledby'?: string;
-    title?: string;
-}>;
-/** @deprecated */
-export interface IDataTableProps<DataTableData extends {
-    [key: string]: any;
-}[] = UnknownProperties[]> extends Omit<DataTableProps<DataTableData>, keyof DataTableAriaProps> {
-}
-export type DataTableProps<DataTableData extends {
-    [key: string]: any;
-}[] = UnknownProperties[]> = BoxProps & {
-    /** Table theme according to visual hierarchy on the page
-     * @default primary
-     * */
-    use?: DataTableUse;
-    /** Data for table */
-    data?: DataTableData;
-    /** Active sort object */
-    sort?: DataTableSort<keyof DataTableData[0]>;
-    /** Handler call when request will change sort */
-    onSortChange?: (sort: DataTableSort<keyof DataTableData[0]>, e?: React.SyntheticEvent) => void;
-    /** Field name in one data entity that is unique accross all dataset
-     * @default id
-     */
-    uniqueKey?: keyof DataTableData[0];
-    /** Make cells compact by changing left and right paddings to smaller ones*/
-    compact?: boolean;
-    /** Count of total rows if table using virtual scroll. Needs for accessibility */
-    totalRows?: number;
-} & DataTableAriaProps;
-/** @deprecated */
-export interface IDataTableHeadProps extends DataTableHeadProps, UnknownProperties {
-}
-export type DataTableHeadProps = BoxProps & {
-    /** Sticky table header
-     * @deprecated
-     * */
-    sticky?: boolean;
-    /** Hidden header */
-    hidden?: boolean;
-    /** Disabled scroll (as action) */
-    disabledScroll?: boolean;
-    /** Enable scroll bar element in header */
-    withScrollBar?: boolean;
-    /** Disables column width change animation **/
-    animationsDisabled?: boolean;
-};
-/** @deprecated */
-export interface IDataTableColumnProps extends DataTableColumnProps, UnknownProperties {
-}
-export type DataTableColumnProps = FlexProps & {
-    /** Unique column name */
-    name?: string;
-    /** Enable sorting for column. And if you are passing a string, you can also set the default sorting */
-    sortable?: boolean | 'desc' | 'asc';
-    /** Enable resize for column
-     * @ignore */
-    resizable?: boolean;
-    /** Fix column on the left o right side of the table */
-    fixed?: 'left' | 'right';
-    /** Fields to control the size of the column */
-    flex?: Property.Flex | 'inherit';
-    /** Add vertical border to the column */
-    vBorders?: boolean;
-    /** Add vertical border to the right side of the cell */
-    borderRight?: boolean;
-    /** Add vertical border to the left side of the cell */
-    borderLeft?: boolean;
-    /**
-     * Enable changing column width with sort icon
-     * @default false
-     */
-    changeSortSize?: boolean;
-    /**
-     * Enable column to use as a column for recalculation width
-     * @default false (By default used first column with maximum width)
-     */
-    sortSizeRecalculation?: boolean;
-};
-/** @deprecated */
-export interface IDataTableBodyProps extends DataTableBodyProps, UnknownProperties {
-}
-export type DataTableBodyProps = BoxProps & {
-    /** Rows table */
-    rows?: DataTableRow[];
-    /** When enabled, only visually acessable rows are rendered.
-     * `tollerance` property controls how many rows outside of viewport are render.
-     * `rowHeight` fixes the rows height if it has known. If not provided, first row node height is measured.
-     * @default { tollerance: 2 }
-     */
-    virtualScroll?: boolean | {
-        tollerance?: number;
-        rowHeight?: number;
-    };
-    /** Allows to redefine rows renderning for a very deep and even fragile customization like building custom virtual scrolling */
-    renderRows?: (props: {
-        rows: DataTableRow[];
-        columns: Column[];
-        renderRow: (row: DataTableRow, details: {
-            dataIndex: number;
-        }) => React.ReactNode;
-    }) => React.ReactNode;
-    /**
-     * Called every time user scrolls area
-     */
-    onScroll?: (event: React.SyntheticEvent<HTMLElement>) => void;
-    /** Disabled scroll */
-    disabledScroll?: boolean;
-    /** Disables column width change animation **/
-    animationsDisabled?: boolean;
-    /** Ref for table body container */
-    scrollContainerRef?: React.Ref<HTMLDivElement>;
-};
-/** @deprecated */
-export interface IDataTableRowProps extends DataTableRowProps, UnknownProperties {
-}
-export type DataTableRowProps = BoxProps & {
-    /** Theme for row */
-    theme?: DataTableTheme;
-    /** Sets row state to active*/
-    active?: boolean;
-};
-/** @deprecated */
-export interface IDataTableCellProps extends DataTableCellProps, UnknownProperties {
-}
-export type DataTableCellProps<Name extends string = string> = FlexProps & {
-    /** Unique name for column or columns separated by / */
-    name: Name;
-    /** Theme for cell */
-    theme?: DataTableTheme;
-};
-type DataTableCtx = {
-    getHeadProps: PropGetterFn;
-    getBodyProps: PropGetterFn;
-};
-type IntergalacticDataTableComponent<PropsExtending extends {} = {}> = (<Data extends DataTableData[], Tag extends Intergalactic.Tag = 'div'>(props: Intergalactic.InternalTypings.ComponentProps<Tag, 'div', DataTableProps<Data> & PropsExtending, DataTableCtx, never>) => Intergalactic.InternalTypings.ComponentRenderingResults) & Intergalactic.InternalTypings.ComponentAdditive<'div', 'div', DataTableProps>;
-type IntergalacticDataTableRowComponent<PropsExtending extends {} = {}> = (<Data extends DataTableData[], Tag extends Intergalactic.Tag = 'div'>(props: Intergalactic.InternalTypings.PropsRenderingResultComponentProps<Tag, DataTableRowProps & {
-    /**
-     * That property is ONLY used for the component strict typings. In the component runtime `data` prop set on `<DataTable>...</DataTable> is used.
-     */
-    data?: Data;
-} & PropsExtending, DataTableCtx & {
-    data: Data;
-}, [
-    row: Data[0],
-    index: number
-]>) => Intergalactic.InternalTypings.ComponentRenderingResults) & Intergalactic.InternalTypings.ComponentAdditive<'div', 'div', DataTableRowProps>;
-type IntergalacticDataTableCellComponent<PropsExtending extends {} = {}> = (<Data extends DataTableData[] = [], Name extends string = string, Tag extends Intergalactic.Tag = 'div'>(props: Intergalactic.InternalTypings.PropsRenderingResultComponentProps<Tag, DataTableCellProps<Name> & {
-    /**
-     * That property is ONLY used for the componenct strict typings. In the component runtime `data` prop set on `<DataTable>...</DataTable> is used.
-     */
-    data?: Data;
-} & PropsExtending, DataTableCtx & {
-    data: Data;
-}, [
-    row: Data[0],
-    index: number
-]>) => Intergalactic.InternalTypings.ComponentRenderingResults) & Intergalactic.InternalTypings.ComponentAdditive<'div', 'div', DataTableCellProps>;
-declare const DefinitionTable: (<Data extends DataTableData[], Tag extends Intergalactic.InternalTypings.ComponentTag = "div">(props: Intergalactic.InternalTypings.ComponentProps<Tag, "div", DataTableProps<Data> & {}, DataTableCtx, never>) => Intergalactic.InternalTypings.ComponentRenderingResults) & Intergalactic.InternalTypings.ComponentAdditive<"div", "div", DataTableProps<UnknownProperties[]>, {}, {}> & {
-    Head: Intergalactic.Component<'div', DataTableHeadProps>;
-    Body: Intergalactic.Component<'div', DataTableBodyProps>;
-    Column: Intergalactic.Component<'div', DataTableColumnProps>;
-    Row: IntergalacticDataTableRowComponent;
-    Cell: IntergalacticDataTableCellComponent;
-};
-export { ROW_GROUP };
-export default DefinitionTable;
-export declare const wrapDataTable: <PropsExtending extends {}>(wrapper: (props: Intergalactic.InternalTypings.EfficientOmit<Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticDataTableComponent<{}>>, "tag" | "ref"> & {
-    ref: React.Ref<any>;
-    tag: Intergalactic.InternalTypings.ComponentTag;
-} & PropsExtending) => React.ReactNode) => IntergalacticDataTableComponent<PropsExtending>;
-export declare const wrapDataTableRow: <PropsExtending extends {}>(wrapper: (props: Intergalactic.InternalTypings.EfficientOmit<Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticDataTableRowComponent<{}>>, "tag" | "ref"> & {
-    ref: React.Ref<any>;
-    tag: Intergalactic.InternalTypings.ComponentTag;
-} & PropsExtending) => React.ReactNode) => IntergalacticDataTableRowComponent<PropsExtending>;
-export declare const wrapDataTableCell: <PropsExtending extends {}>(wrapper: (props: Intergalactic.InternalTypings.EfficientOmit<Intergalactic.InternalTypings.ComponentPropsNesting<IntergalacticDataTableCellComponent<{}>>, "tag" | "ref"> & {
-    ref: React.Ref<any>;
-    tag: Intergalactic.InternalTypings.ComponentTag;
-} & PropsExtending) => React.ReactNode) => IntergalacticDataTableCellComponent<PropsExtending>;