@semcore/data-table 4.0.0-beta.0 → 4.0.0-beta.1

package/lib/types/Body.d.ts

@@ -1,9 +1,8 @@
 import React from 'react';
 import { Component } from '@semcore/core';
 import { RowData, Column, NestedCells, PropsLayer } from './types';
-import ResizeObserver from 'resize-observer-polyfill';
 import syncScroll from '@semcore/utils/lib/syncScroll';
-declare type AsProps = {
+type AsProps = {
     rows: NestedCells[];
     columns: Column[];
     $scrollRef: ReturnType<ReturnType<typeof syncScroll>>;
@@ -19,14 +18,14 @@ declare type AsProps = {
     disabledScroll?: boolean;
     uid?: string;
 };
-declare type State = {
+type State = {
     rowHeight: number | undefined;
     scrollAreaHeight: undefined | number;
     scrollOffset: number;
 };
 declare class Body extends Component<AsProps, State> {
     state: State;
-    firstRowRef: React.RefObject<HTMLElement>;
+    firstRowRef: React.RefObject<HTMLDivElement>;
     firstRowResizeObserver: ResizeObserver | null;
     getRowHeight: () => number | undefined;
     renderCells(cells: NestedCells, rowData: RowData, dataIndex: number): React.ReactNode[];
@@ -37,14 +36,8 @@ declare class Body extends Component<AsProps, State> {
     }): React.ReactNode;
     renderRows(rows: NestedCells[], nested?: boolean): React.ReactNode[];
     renderVirtualizedRows(rows: NestedCells[]): React.ReactNode[];
-    handleFirstRowResize: {
-        (...args: any[]): void;
-        cancel(): void;
-    };
-    handleScrollAreaResize: {
-        (...args: any[]): void;
-        cancel(): void;
-    };
+    handleFirstRowResize: (entries: ResizeObserverEntry[]) => void;
+    handleScrollAreaResize: (entries: ResizeObserverEntry[]) => void;
     handleScrollAreaScroll: (event: React.SyntheticEvent<HTMLElement>) => void;
     setupRowSizeObserver: () => void;
     componentWillUnmount(): void;

package/lib/types/DataTable.d.ts

@@ -3,17 +3,17 @@ import { Property } from 'csstype';
 import { Component, PropGetterFn, UnknownProperties, Intergalactic } from '@semcore/core';
 import { BoxProps, FlexProps } from '@semcore/flex-box';
 declare const ROW_GROUP: unique symbol;
-export declare type DataTableData = {
+export type DataTableData = {
     [key: string]: unknown;
 };
-export declare type DataTableSort<Columns extends string | number | symbol = string> = [
+export type DataTableSort<Columns extends string | number | symbol = string> = [
     sortBy: Columns,
     sortDirection: 'desc' | 'asc'
 ];
-export declare type DataTableTheme = 'muted' | 'info' | 'success' | 'warning' | 'danger';
-export declare type DataTableUse = 'primary' | 'secondary';
-export declare type DataTableRow = DataTableCell[];
-export declare type DataTableCell = {
+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 */
@@ -25,7 +25,7 @@ export interface IDataTableProps<DataTableData extends {
     [key: string]: any;
 }[] = UnknownProperties[]> extends DataTableProps<DataTableData> {
 }
-export declare type DataTableProps<DataTableData extends {
+export type DataTableProps<DataTableData extends {
     [key: string]: any;
 }[] = UnknownProperties[]> = BoxProps & {
     /** Theme for table
@@ -48,7 +48,7 @@ export declare type DataTableProps<DataTableData extends {
 /** @deprecated */
 export interface IDataTableHeadProps extends DataTableHeadProps, UnknownProperties {
 }
-export declare type DataTableHeadProps = BoxProps & {
+export type DataTableHeadProps = BoxProps & {
     /** Sticky header table
      * @deprecated
      * */
@@ -61,7 +61,7 @@ export declare type DataTableHeadProps = BoxProps & {
 /** @deprecated */
 export interface IDataTableColumnProps extends DataTableColumnProps, UnknownProperties {
 }
-export declare type DataTableColumnProps = FlexProps & {
+export type DataTableColumnProps = FlexProps & {
     /** Unique name column */
     name?: string;
     /** Enable sort for column also if you pass string you can set default sort */
@@ -83,7 +83,7 @@ export declare type DataTableColumnProps = FlexProps & {
 /** @deprecated */
 export interface IDataTableBodyProps extends DataTableBodyProps, UnknownProperties {
 }
-export declare type DataTableBodyProps = BoxProps & {
+export type DataTableBodyProps = BoxProps & {
     /** Rows table */
     rows?: DataTableRow[];
     /** When enabled, only visually acessable rows are rendered.
@@ -105,7 +105,7 @@ export declare type DataTableBodyProps = BoxProps & {
 /** @deprecated */
 export interface IDataTableRowProps extends DataTableRowProps, UnknownProperties {
 }
-export declare type DataTableRowProps = BoxProps & {
+export type DataTableRowProps = BoxProps & {
     /** Theme for row */
     theme?: DataTableTheme;
     /** Displays row as active */
@@ -114,23 +114,23 @@ export declare type DataTableRowProps = BoxProps & {
 /** @deprecated */
 export interface IDataTableCellProps extends DataTableCellProps, UnknownProperties {
 }
-export declare type DataTableCellProps = FlexProps & {
+export type DataTableCellProps<Name extends string = string> = FlexProps & {
     /** Unique name column or columns separated by / */
-    name: string;
+    name: Name;
     /** Theme for cell */
     theme?: DataTableTheme;
 };
-declare type DataTableCtx = {
+type DataTableCtx = {
     getHeadProps: PropGetterFn;
     getBodyProps: PropGetterFn;
 };
-declare type IntergalacticDataTableRowComponent = (<Data extends DataTableData[], Tag extends Intergalactic.InternalTypings.ComponentTag = 'div'>(props: Intergalactic.InternalTypings.PropsRenderingResultComponentProps<Tag, DataTableRowProps, DataTableCtx & {
+type IntergalacticDataTableRowComponent = (<Data extends DataTableData[], Tag extends Intergalactic.Tag = 'div'>(props: Intergalactic.InternalTypings.PropsRenderingResultComponentProps<Tag, DataTableRowProps, DataTableCtx & {
     data: Data;
 }, [
     row: Data[0],
     index: number
 ]>) => Intergalactic.InternalTypings.ComponentRenderingResults) & Intergalactic.InternalTypings.ComponentAdditive<'div'>;
-declare type IntergalacticDataTableCellComponent = (<Data extends DataTableData[], Tag extends Intergalactic.InternalTypings.ComponentTag = 'div'>(props: Intergalactic.InternalTypings.PropsRenderingResultComponentProps<Tag, DataTableCellProps, DataTableCtx & {
+type IntergalacticDataTableCellComponent = (<Data extends DataTableData[], Name extends string = string, Tag extends Intergalactic.Tag = 'div'>(props: Intergalactic.InternalTypings.PropsRenderingResultComponentProps<Tag, DataTableCellProps<Name>, DataTableCtx & {
     data: Data;
 }, [
     row: Data[0],

package/lib/types/Head.d.ts

@@ -1,8 +1,7 @@
 import React from 'react';
 import { Component } from '@semcore/core';
 import type { Column } from './types';
-import 'resize-observer-polyfill';
-declare type AsProps = {
+type AsProps = {
     $onSortClick: (name: string, event: React.MouseEvent | React.KeyboardEvent) => void;
     $scrollRef: (instance: unknown) => void;
     use: 'primary' | 'secondary';

package/lib/types/types.d.ts

@@ -1,19 +1,19 @@
 import React from 'react';
 import { ROW_GROUP } from './DataTable';
 import { Property } from 'csstype';
-export declare type PseudoChildPropsGetter = (props: {
+export type PseudoChildPropsGetter = (props: {
     [propName: string]: unknown;
 }, rowData: {
     [columnName: string]: unknown;
 }, index: number) => {
     [propName: string]: unknown;
 };
-export declare type PropsLayer = {
+export type PropsLayer = {
     childrenPropsGetter?: PseudoChildPropsGetter;
     [propName: string]: unknown;
 };
-export declare type SortDirection = 'asc' | 'desc';
-export declare type Column<Props extends {
+export type SortDirection = 'asc' | 'desc';
+export type Column<Props extends {
     [propName: string]: unknown;
 } = {
     [propName: string]: unknown;
@@ -54,11 +54,11 @@ export declare type Column<Props extends {
     columns: Column[];
     parentColumns: Column[];
 };
-export declare type Cell = Pick<Column, 'name' | 'fixed' | 'data'> & {
+export type Cell = Pick<Column, 'name' | 'fixed' | 'data'> & {
     cssVar: string | string[];
     cellPropsLayers: PropsLayer[];
 };
-export declare type RowData<Data extends {
+export type RowData<Data extends {
     [columnName: string]: unknown;
 } = {
     [columnName: string]: unknown;
@@ -66,6 +66,6 @@ export declare type RowData<Data extends {
     name: string;
     [ROW_GROUP]: RowData[];
 }>;
-export declare type NestedCells = (Cell | NestedCells)[] & {
+export type NestedCells = (Cell | NestedCells)[] & {
     flatRowData?: RowData;
 };

package/lib/types/utils.d.ts

@@ -1,6 +1,4 @@
 import type { Column } from './types';
 export declare const getScrollOffsetValue: (columns: Column[]) => [leftOffset: number, rightOffset: number];
-export declare const flattenColumns: (columns: Column[]) => Column<{
-    [propName: string]: unknown;
-}>[];
+export declare const flattenColumns: (columns: Column[]) => Column[];
 export declare const getFixedStyle: (cell: Pick<Column, 'name' | 'fixed'>, columns: Column[]) => [side: "left" | "right", style: string | number] | [side: undefined, style: undefined];

package/package.json

@@ -1,7 +1,7 @@
 {
   "name": "@semcore/data-table",
   "description": "Semrush DataTable Component",
-  "version": "4.0.0-beta.0",
+  "version": "4.0.0-beta.1",
   "main": "lib/cjs/index.js",
   "module": "lib/es6/index.js",
   "typings": "lib/types/index.d.ts",
@@ -9,11 +9,10 @@
   "author": "UI-kit team <ui-kit-team@semrush.com>",
   "license": "MIT",
   "dependencies": {
-    "@semcore/flex-box": "5.0.0-beta.0",
-    "@semcore/icon": "4.0.0-beta.0",
-    "@semcore/scroll-area": "5.0.0-beta.0",
-    "@semcore/utils": "4.0.0-beta.0",
-    "resize-observer-polyfill": "^1.5"
+    "@semcore/flex-box": "5.0.0-beta.1",
+    "@semcore/icon": "4.0.0-beta.1",
+    "@semcore/scroll-area": "5.0.0-beta.1",
+    "@semcore/utils": "4.0.0-beta.1"
   },
   "devDependencies": {
     "@types/react": "18.0.21",
@@ -32,11 +31,11 @@
     "@semcore/spin-container": "*",
     "@semcore/sticky": "*",
     "@semcore/tooltip": "*",
-    "@types/node": "^17.0.45",
+    "@types/node": "^18.16.15",
     "csstype": "3.0.8"
   },
   "peerDependencies": {
-    "@semcore/core": "2.0.0-beta.0",
+    "@semcore/core": "2.0.0-beta.1",
     "react": "16.8 - 18",
     "react-dom": "16.8 - 18"
   },