@spaced-out/ui-design-system 0.4.15 → 0.5.0

package/lib/components/Table/InlineEdit.stories.d.ts

@@ -0,0 +1,314 @@
+import * as React from 'react';
+import type { TableProps } from './';
+declare const _default: {
+    tags: string[];
+    title: string;
+    argTypes: {
+        readonly headers: {
+            readonly type: {
+                readonly required: true;
+            };
+            readonly description: "Provide an array of objects to render the header, each object should consist of label(*), key(*), sortable, sticky and render function";
+            readonly control: {
+                readonly type: "object";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "{label: React.Node, key: $Keys<T>, className?: string, filterIcon?: React.Node, filtered?: boolean, subtext?: string, sortable?: boolean, headerIconClassName?: string, sticky?: boolean, render?: React.ComponentType<{data: T, extras?: U, className?: string, selected?: boolean,}>, }";
+                };
+            };
+        };
+        readonly entries: {
+            readonly type: {
+                readonly required: true;
+            };
+            readonly description: "Provide an array of object. Each object belong on one row in the table. Each object should have id and all the keys with values that is being passed in headers array";
+            readonly control: {
+                readonly type: "object";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "Array<T>";
+                };
+            };
+        };
+        readonly classNames: {
+            readonly description: "Provide optional classNames to be applied to the wrapper, table, tableHeader, tableBody, tableRow, or checkbox";
+            readonly control: {
+                readonly type: "object";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "{wrapper?: string, table?: string, tableHeader?: string, tableBody?: string, tableRow?: string, checkbox?: string}";
+                };
+            };
+        };
+        readonly Row: {
+            readonly description: "Custom Row component to be passed to table";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "TableRow<T, U>";
+                };
+            };
+        };
+        readonly sortable: {
+            readonly description: "Sort Icon will appear in right side of column's header with column level true sortable value";
+            readonly name: "sortable";
+            readonly options: readonly [false, true];
+            readonly control: "boolean";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "boolean";
+                };
+                readonly defaultValue: {
+                    readonly summary: true;
+                };
+            };
+        };
+        readonly showHeader: {
+            readonly description: "Show or hide header";
+            readonly options: readonly [false, true];
+            readonly control: "boolean";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "boolean";
+                };
+                readonly defaultValue: {
+                    readonly summary: true;
+                };
+            };
+        };
+        readonly defaultSortKey: {
+            readonly description: "key name for which table should be sorted by default. headers array should have sortable true for that key object";
+            readonly control: {
+                readonly type: "text";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "string";
+                };
+            };
+        };
+        readonly defaultSortDirection: {
+            readonly description: "default sorting direction for the defaultSortKey column";
+            readonly control: {
+                readonly type: "text";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "'asc' | 'desc' | 'original'";
+                };
+            };
+        };
+        readonly selectedKeys: {
+            readonly description: "array of keys which are selected. This prop is also used to decide weather to show checkboxes or not. So, pass an empty array in case no row is selected.";
+            readonly control: {
+                readonly type: "object";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "string[]";
+                };
+            };
+        };
+        readonly disabledKeys: {
+            readonly description: "array of keys which are disabled. This prop is used to disable the checkbox and its events for particular rows.";
+            readonly control: {
+                readonly type: "object";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "string[]";
+                };
+            };
+        };
+        readonly onSelect: {
+            readonly description: "callback function when any row is selected";
+            readonly action: "selected";
+            readonly type: {
+                readonly summary: "(keys: string[]) => mixed";
+            };
+        };
+        readonly idName: {
+            readonly description: "name of key in row objects that has to be used as id";
+        };
+        readonly onSort: {
+            readonly description: "callback function when any table is sorted";
+            readonly action: "sorted";
+            readonly type: {
+                readonly summary: "(key: $Keys<T>, direction: SortDirection) => void";
+            };
+        };
+        readonly isLoading: {
+            readonly description: "to wait for data to populate in table and show loading state when entries array is empty.";
+            readonly options: readonly [false, true];
+            readonly control: "boolean";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "boolean";
+                };
+                readonly defaultValue: {
+                    readonly summary: false;
+                };
+            };
+        };
+        readonly emptyText: {
+            readonly description: "Provide component to be shown in case of empty data";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "React.Component";
+                };
+            };
+        };
+        readonly customLoader: {
+            readonly description: "Provide optional component to be shown in case of loading state. It will override the default loader.";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "React.Component";
+                };
+            };
+        };
+        readonly disabled: {
+            readonly description: "disable all the checkboxes of each row in the table";
+            readonly options: readonly [false, true];
+            readonly control: "boolean";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "boolean";
+                };
+                readonly defaultValue: {
+                    readonly summary: false;
+                };
+            };
+        };
+        readonly borderRadius: {
+            readonly description: "Border Radius of all four corners of the table. Default value is borderRadiusMedium i.e., 12px.";
+            readonly control: "text";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "string";
+                };
+                readonly defaultValue: {
+                    readonly summary: "12px";
+                };
+            };
+        };
+        readonly stickyHeader: {
+            readonly description: "Sticky header will stick the header to the top of the table when scrolling. This would only work if the table wrapper is scrollable.";
+            readonly control: "boolean";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "boolean";
+                };
+                readonly defaultValue: {
+                    readonly summary: false;
+                };
+            };
+        };
+        readonly enableInternalSorting: {
+            readonly description: "Enable internal sorting for the table. This would sort the table data internally and not rely on the apis sorting";
+            readonly control: "boolean";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "?boolean";
+                };
+                readonly defaultValue: {
+                    readonly summary: true;
+                };
+            };
+        };
+        readonly rowsCount: {
+            readonly name: "virtualizationOptions.rowsCount";
+            readonly description: "Total number of virtual rows.";
+            readonly control: {
+                readonly type: "number";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "number";
+                };
+                readonly defaultValue: {
+                    readonly summary: 20;
+                };
+            };
+        };
+        readonly rowHeight: {
+            readonly name: "virtualizationOptions.rowHeight";
+            readonly description: "Row height in CSS units (e.g., \"48px\"). Should be provided correctly, otherwise it will not work as expected.";
+            readonly control: {
+                readonly type: "text";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "string";
+                };
+                readonly defaultValue: {
+                    readonly summary: "48px";
+                };
+            };
+        };
+        readonly isEndLoading: {
+            readonly name: "virtualizationOptions.isEndLoading";
+            readonly description: "Whether to show loading spinner at the bottom.";
+            readonly control: {
+                readonly type: "boolean";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "boolean";
+                };
+                readonly defaultValue: {
+                    readonly summary: false;
+                };
+            };
+        };
+        readonly isAllDataFetched: {
+            readonly name: "virtualizationOptions.isAllDataFetched";
+            readonly description: "Whether all rows are fetched (disables infinite loading).";
+            readonly control: {
+                readonly type: "boolean";
+            };
+            readonly table: {
+                readonly type: {
+                    readonly summary: "boolean";
+                };
+                readonly defaultValue: {
+                    readonly summary: false;
+                };
+            };
+        };
+        readonly onEndReached: {
+            readonly name: "virtualizationOptions.onEndReached";
+            readonly description: "Callback triggered when end of list is reached.";
+            readonly action: "onEndReached";
+            readonly table: {
+                readonly type: {
+                    readonly summary: "() => void";
+                };
+            };
+        };
+    };
+    parameters: {
+        docs: {
+            subtitle: string;
+            description: {
+                component: string;
+            };
+        };
+        storySource: {
+            componentPath: string;
+        };
+    };
+};
+export default _default;
+export declare const _InlineEdit: {
+    (args: TableProps<{
+        [key: string]: unknown;
+    }, {
+        [key: string]: unknown;
+    }>): React.JSX.Element;
+    args: {
+        borderRadius: string;
+    };
+};
+//# sourceMappingURL=InlineEdit.stories.d.ts.map

package/lib/components/Table/InlineEdit.stories.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"InlineEdit.stories.d.ts","sourceRoot":"","sources":["../../../src/components/Table/InlineEdit.stories.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAgB/B,OAAO,KAAK,EAAC,UAAU,EAAC,MAAM,IAAI,CAAC;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AASnC,wBA+KE;AA4FF,eAAO,MAAM,WAAW;WAChB,UAAU,CACd;QACE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;KACxB,EACD;QACE,CAAC,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;KACxB,CACF;;;;CAoFF,CAAC"}

package/lib/components/Table/StaticTable.d.ts

@@ -0,0 +1,24 @@
+import * as React from 'react';
+import type { ClassNameComponent } from '../../utils/makeClassNameComponent';
+import type { SortDirection } from './hooks';
+import type { GenericObject, TableProps } from './Table';
+export declare const BasicTable: ClassNameComponent<'table'>;
+export declare const BasicTableBody: ClassNameComponent<'tbody'>;
+/**
+ * A Static Default Table.
+ *
+ * Our
+ */
+export declare function StaticTable<Data extends GenericObject, Extras extends GenericObject>(props: TableProps<Data, Extras> & {
+    handleSortClick?: (sortKey: string) => unknown;
+    sortKey?: string;
+    sortDirection?: SortDirection;
+    rowKeys?: string[];
+}): React.JSX.Element;
+export declare function StaticTableVirtualized<Data extends GenericObject, Extras extends GenericObject>(props: TableProps<Data, Extras> & {
+    handleSortClick?: (sortKey: string) => unknown;
+    sortKey?: string;
+    sortDirection?: SortDirection;
+    rowKeys?: string[];
+}): React.JSX.Element;
+//# sourceMappingURL=StaticTable.d.ts.map

package/lib/components/Table/StaticTable.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"StaticTable.d.ts","sourceRoot":"","sources":["../../../src/components/Table/StaticTable.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAS/B,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,oCAAoC,CAAC;AAQ3E,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,SAAS,CAAC;AAC3C,OAAO,KAAK,EAAa,aAAa,EAAE,UAAU,EAAC,MAAM,SAAS,CAAC;AAKnE,eAAO,MAAM,UAAU,EAAE,kBAAkB,CAAC,OAAO,CAGlD,CAAC;AAEF,eAAO,MAAM,cAAc,EAAE,kBAAkB,CAAC,OAAO,CACA,CAAC;AAwMxD;;;;GAIG;AAEH,wBAAgB,WAAW,CACzB,IAAI,SAAS,aAAa,EAC1B,MAAM,SAAS,aAAa,EAE5B,KAAK,EAAE,UAAU,CAAC,IAAI,EAAE,MAAM,CAAC,GAAG;IAChC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC;IAC/C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB,qBAiIF;AAED,wBAAgB,sBAAsB,CACpC,IAAI,SAAS,aAAa,EAC1B,MAAM,SAAS,aAAa,EAE5B,KAAK,EAAE,UAAU,CAAC,IAAI,EAAE,MAAM,CAAC,GAAG;IAChC,eAAe,CAAC,EAAE,CAAC,OAAO,EAAE,MAAM,KAAK,OAAO,CAAC;IAC/C,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,aAAa,CAAC,EAAE,aAAa,CAAC;IAC9B,OAAO,CAAC,EAAE,MAAM,EAAE,CAAC;CACpB,qBA2OF"}

package/lib/components/Table/StaticTable.js

@@ -21,7 +21,6 @@ var _DefaultTableHeader = require("./DefaultTableHeader");
 var _TableModule = _interopRequireDefault(require("./Table.module.css"));
 function _interopRequireDefault(e) { return e && e.__esModule ? e : { default: e }; }
 function _interopRequireWildcard(e, t) { if ("function" == typeof WeakMap) var r = new WeakMap(), n = new WeakMap(); return (_interopRequireWildcard = function (e, t) { if (!t && e && e.__esModule) return e; var o, i, f = { __proto__: null, default: e }; if (null === e || "object" != typeof e && "function" != typeof e) return f; if (o = t ? n : r) { if (o.has(e)) return o.get(e); o.set(e, f); } for (const t in e) "default" !== t && {}.hasOwnProperty.call(e, t) && ((i = (o = Object.defineProperty) && Object.getOwnPropertyDescriptor(e, t)) && (i.get || i.set) ? o(f, t, i) : f[t] = e[t]); return f; })(e, t); }
-// $FlowFixMe[untyped-import]
 const BasicTable = exports.BasicTable = (0, _makeClassNameComponent.makeClassNameComponent)(_TableModule.default.defaultTable, 'table');
 const BasicTableBody = exports.BasicTableBody = (0, _makeClassNameComponent.makeClassNameComponent)(_TableModule.default.defaultTableBody, 'tbody');
 function useTableWidth(ref) {
@@ -37,6 +36,7 @@ function useTableWidth(ref) {
   return tableWidth;
 }
 function useMappedKeys(entries, rowKeys, idName) {
+  // @ts-ignore - TS2322 - Type 'string[] | Data[string][]' is not assignable to type 'string[]'.
   return React.useMemo(() => rowKeys ?? entries.map(e => (0, _get.default)(e, idName)), [entries, idName, rowKeys]);
 }
 function useHeaderCheckboxHandler(selectedKeys, entries, idName, onSelect) {
@@ -49,6 +49,7 @@ function useHeaderCheckboxHandler(selectedKeys, entries, idName, onSelect) {
     } = _ref;
     const allIds = entries.map(row => (0, _get.default)(row, idName));
     const newSelection = checked ? allIds : [];
+    // @ts-ignore - TS2345 - Argument of type 'Data[string][]' is not assignable to parameter of type 'string[]'.
     onSelect?.(newSelection);
   };
 }
@@ -114,7 +115,9 @@ function TableWrapper(_ref3) {
   return /*#__PURE__*/React.createElement("div", {
     className: (0, _classify.classify)(_TableModule.default.tableContainer, classNames?.wrapper),
     "data-id": 'table-wrap',
-    ref: tableRef,
+    ref: tableRef
+    // @ts-ignore - TS2322 - Type '{ [key: string]: string | number | null | undefined; } | undefined' is not assignable to type 'CSSProperties | undefined'.
+    ,
     style: wrapperStyle
   }, /*#__PURE__*/React.createElement(BasicTable, {
     "data-id": "basic-table",
@@ -155,11 +158,11 @@ function StaticTable(props) {
     showHeader = true,
     tableHeaderClassName,
     sortable,
-    // eslint-disable-next-line unused-imports/no-unused-vars
+    // @ts-ignore - TS6133 - 'defaultSortKey' is declared but its value is never read.
     defaultSortKey,
-    // eslint-disable-next-line unused-imports/no-unused-vars
+    // @ts-ignore - TS6133 - 'defaultSortDirection' is declared but its value is never read.
     defaultSortDirection = 'original',
-    // eslint-disable-next-line unused-imports/no-unused-vars
+    // @ts-ignore - TS6133 - 'onSort' is declared but its value is never read.
     onSort,
     handleSortClick,
     sortKey,
@@ -179,13 +182,16 @@ function StaticTable(props) {
   // this is a fallback and honestly probably doesn't need the
   // memo'ing
   const tableRef = React.useRef(null);
+  // @ts-ignore - TS2345 - Argument of type 'string | number | symbol' is not assignable to parameter of type 'string'.
   const mappedKeys = useMappedKeys(entries, rowKeys, idName);
   const tableWidth = useTableWidth(tableRef);
 
   /**
    * this function is also used to decide weather to show checkbox in header or not. so it's value is undefined in case selectedKeys is not there.
    */
-  const handleHeaderCheckboxClick = useHeaderCheckboxHandler(selectedKeys, entries, idName, onSelect);
+  const handleHeaderCheckboxClick = useHeaderCheckboxHandler(selectedKeys, entries,
+  // @ts-ignore - TS2345 - Argument of type 'string | number | symbol' is not assignable to parameter of type 'string'.
+  idName, onSelect);
   return /*#__PURE__*/React.createElement(TableWrapper, {
     tableRef: tableRef,
     wrapperStyle: {
@@ -206,7 +212,9 @@ function StaticTable(props) {
     selectedKeys: selectedKeys,
     headers: headers,
     sortKey: sortKey,
-    sortDirection: sortDirection,
+    sortDirection: sortDirection
+    // @ts-ignore - TS2322 - Type '((sortKey: string) => unknown) | undefined' is not assignable to type '((sortKey: keyof Data) => unknown) | undefined'.
+    ,
     handleSortClick: handleSortClick,
     handleHeaderCheckboxClick: handleHeaderCheckboxClick
   }, isLoading || !entries.length ? /*#__PURE__*/React.createElement(_DefaultRow.EmptyRow, {
@@ -219,8 +227,12 @@ function StaticTable(props) {
     if (data == null) {
       return null;
     }
-    const selected = selectedKeys && Array.isArray(selectedKeys) ? selectedKeys.includes((0, _get.default)(data, idName)) : undefined;
-    const isRowDisabled = disabledKeys && Array.isArray(disabledKeys) ? disabledKeys.includes((0, _get.default)(data, idName)) : false;
+    const selected = selectedKeys && Array.isArray(selectedKeys) ?
+    // @ts-ignore - TS2345 - Argument of type 'Data["id"] | Data[keyof Data]' is not assignable to parameter of type 'string'.
+    selectedKeys.includes((0, _get.default)(data, idName)) : undefined;
+    const isRowDisabled = disabledKeys && Array.isArray(disabledKeys) ?
+    // @ts-ignore - TS2345 - Argument of type 'Data["id"] | Data[keyof Data]' is not assignable to parameter of type 'string'.
+    disabledKeys.includes((0, _get.default)(data, idName)) : false;
     return /*#__PURE__*/React.createElement(RowRenderer, {
       TableRow: TableRow,
       keyId: key,
@@ -247,11 +259,11 @@ function StaticTableVirtualized(props) {
     showHeader = true,
     tableHeaderClassName,
     sortable,
-    // eslint-disable-next-line unused-imports/no-unused-vars
+    // @ts-ignore - TS6133 - 'defaultSortKey' is declared but its value is never read.
     defaultSortKey,
-    // eslint-disable-next-line unused-imports/no-unused-vars
+    // @ts-ignore - TS6133 - 'defaultSortDirection' is declared but its value is never read.
     defaultSortDirection = 'original',
-    // eslint-disable-next-line unused-imports/no-unused-vars
+    // @ts-ignore - TS6133 - 'onSort' is declared but its value is never read.
     onSort,
     handleSortClick,
     sortKey,
@@ -279,12 +291,14 @@ function StaticTableVirtualized(props) {
 
   // this is a fallback and honestly probably doesn't need the
   // memo'ing
+  // @ts-ignore - TS2345 - Argument of type 'string | number | symbol' is not assignable to parameter of type 'string'.
   const mappedKeys = useMappedKeys(entries, rowKeys, idName);
   const tableWidth = useTableWidth(tableRef);
   const virtualizer = (0, _reactVirtual.useVirtualizer)({
     count: entries.length,
     getScrollElement: () => tableRef.current,
     estimateSize: () => parseInt(rowHeight),
+    // @ts-ignore - TS2322 - Type '(index: number) => Data["id" | keyof Data]' is not assignable to type '(index: number) => Key'.
     getItemKey: index => entries[index][idName],
     overscan: 1
   });
@@ -312,8 +326,11 @@ function StaticTableVirtualized(props) {
         hasTriggeredRef.current = false; // reset when scrolling up
       }
     };
+
+    // @ts-ignore - TS2339 - Property 'addEventListener' does not exist on type 'never'.
     scrollElement.addEventListener('scroll', handleScroll);
     return () => {
+      // @ts-ignore - TS2339 - Property 'removeEventListener' does not exist on type 'never'.
       scrollElement.removeEventListener('scroll', handleScroll);
     };
   }, [onEndReached, isAllDataFetched]);
@@ -322,7 +339,9 @@ function StaticTableVirtualized(props) {
    * this function is also used to decide weather to show checkbox in header or not. so it's value is undefined in case selectedKeys is not there.
    */
 
-  const handleHeaderCheckboxClick = useHeaderCheckboxHandler(selectedKeys, entries, idName, onSelect);
+  const handleHeaderCheckboxClick = useHeaderCheckboxHandler(selectedKeys, entries,
+  // @ts-ignore - TS2345 - Argument of type 'string | number | symbol' is not assignable to parameter of type 'string'.
+  idName, onSelect);
   const VirtualizedStartRow = () => /*#__PURE__*/React.createElement("tr", {
     style: {
       height: virtualizer.getVirtualItems()[0]?.start ?? _space.spaceNone,
@@ -338,7 +357,9 @@ function StaticTableVirtualized(props) {
   }));
   const VirtualizedEndRow = () => /*#__PURE__*/React.createElement("tr", {
     style: {
-      height: virtualizer.getTotalSize() - (virtualizer.getVirtualItems().at(-1)?.end ?? _space.spaceNone)
+      height: virtualizer.getTotalSize() - (
+      // @ts-ignore - TS2339 - Property 'at' does not exist on type 'VirtualItem[]'.
+      virtualizer.getVirtualItems().at(-1)?.end ?? _space.spaceNone)
     },
     "aria-hidden": true
   }, /*#__PURE__*/React.createElement("td", {
@@ -354,6 +375,7 @@ function StaticTableVirtualized(props) {
     wrapperStyle: {
       '--border-radius': borderRadius,
       '--table-width': tableWidth ? `${tableWidth}px` : _size.sizeFluid,
+      // @ts-ignore - TS2532 - Object is possibly 'undefined'.
       height: (rowsCount + 1) * parseInt(rowHeight),
       overflowY: 'auto'
     },
@@ -371,7 +393,9 @@ function StaticTableVirtualized(props) {
     selectedKeys: selectedKeys,
     headers: headers,
     sortKey: sortKey,
-    sortDirection: sortDirection,
+    sortDirection: sortDirection
+    // @ts-ignore - TS2322 - Type '((sortKey: string) => unknown) | undefined' is not assignable to type '((sortKey: keyof Data) => unknown) | undefined'.
+    ,
     handleSortClick: handleSortClick,
     handleHeaderCheckboxClick: handleHeaderCheckboxClick
   }, /*#__PURE__*/React.createElement(VirtualizedStartRow, null), isLoading || !entries.length ? /*#__PURE__*/React.createElement(_DefaultRow.EmptyRow, {
@@ -385,10 +409,16 @@ function StaticTableVirtualized(props) {
     if (data == null) {
       return null;
     }
-    const selected = selectedKeys && Array.isArray(selectedKeys) ? selectedKeys.includes((0, _get.default)(data, idName)) : undefined;
-    const isRowDisabled = disabledKeys && Array.isArray(disabledKeys) ? disabledKeys.includes((0, _get.default)(data, idName)) : false;
+    const selected = selectedKeys && Array.isArray(selectedKeys) ?
+    // @ts-ignore - TS2345 - Argument of type 'Data[keyof Data] | Data["id"]' is not assignable to parameter of type 'string'.
+    selectedKeys.includes((0, _get.default)(data, idName)) : undefined;
+    const isRowDisabled = disabledKeys && Array.isArray(disabledKeys) ?
+    // @ts-ignore - TS2345 - Argument of type 'Data[keyof Data] | Data["id"]' is not assignable to parameter of type 'string'.
+    disabledKeys.includes((0, _get.default)(data, idName)) : false;
     return /*#__PURE__*/React.createElement(RowRenderer, {
-      TableRow: TableRow,
+      TableRow: TableRow
+      // @ts-ignore - TS2322 - Type 'Key' is not assignable to type 'string'.
+      ,
       keyId: key,
       data: data,
       headers: headers,

package/lib/components/Table/Table.d.ts

@@ -0,0 +1,64 @@
+import * as React from 'react';
+import type { TableRow } from './DefaultRow';
+import type { GenericHeaderItems } from './DefaultTableHeader';
+import type { SortDirection } from './hooks';
+export type GenericObject = {
+    readonly [key: string]: unknown;
+};
+export type ClassNames = Readonly<{
+    wrapper?: string;
+    table?: string;
+    tableHeader?: string;
+    tableBody?: string;
+    tableRow?: string;
+    checkbox?: string;
+}>;
+type VirtualizationOptions = {
+    rowsCount: number;
+    rowHeight?: string;
+    onEndReached?: () => void;
+    isEndLoading?: boolean;
+    isAllDataFetched?: boolean;
+};
+export type TableProps<T, U> = {
+    classNames?: ClassNames;
+    className?: string;
+    TableRow?: TableRow<T, U>;
+    headers: GenericHeaderItems<T, U>;
+    entries: Array<T>;
+    extras?: U;
+    sortable?: boolean;
+    showHeader?: boolean;
+    tableHeaderClassName?: string;
+    headerIconClassName?: string;
+    defaultSortKey?: string;
+    defaultSortDirection?: 'asc' | 'desc' | 'original';
+    enableInternalSorting?: boolean;
+    selectedKeys?: string[];
+    disabledKeys?: string[];
+    onSelect?: (keys: string[]) => unknown;
+    idName?: keyof T;
+    onSort?: (key: keyof T, direction: SortDirection) => void;
+    isLoading?: boolean;
+    emptyText?: React.ReactNode;
+    disabled?: boolean;
+    customLoader?: React.ReactNode;
+    borderRadius?: string;
+    stickyHeader?: boolean;
+    virtualizationOptions?: VirtualizationOptions;
+};
+/**
+ * Table
+ * @param {React.ComponentType} Row - React.ComponentType<{data: Data, extras?: Extras, sortedKeys?: string[]}>
+ * @param {string} className - string
+ *
+ **/
+/**
+ * Table
+ * @param {React.ComponentType} Row - React.ComponentType<{data: Data, extras?: Extras, sortedKeys?: string[]}>
+ * @param {string} className - string
+ *
+ */
+export declare function Table<Data extends GenericObject, Extras extends GenericObject>(props: TableProps<Data, Extras>): React.JSX.Element;
+export {};
+//# sourceMappingURL=Table.d.ts.map

package/lib/components/Table/Table.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"Table.d.ts","sourceRoot":"","sources":["../../../src/components/Table/Table.tsx"],"names":[],"mappings":"AAAA,OAAO,KAAK,KAAK,MAAM,OAAO,CAAC;AAE/B,OAAO,KAAK,EAAC,QAAQ,EAAC,MAAM,cAAc,CAAC;AAC3C,OAAO,KAAK,EAAC,kBAAkB,EAAC,MAAM,sBAAsB,CAAC;AAC7D,OAAO,KAAK,EAAC,aAAa,EAAC,MAAM,SAAS,CAAC;AAM3C,MAAM,MAAM,aAAa,GAAG;IAM1B,QAAQ,EAAE,GAAG,EAAE,MAAM,GAAG,OAAO,CAAC;CACjC,CAAC;AAEF,MAAM,MAAM,UAAU,GAAG,QAAQ,CAAC;IAChC,OAAO,CAAC,EAAE,MAAM,CAAC;IACjB,KAAK,CAAC,EAAE,MAAM,CAAC;IACf,WAAW,CAAC,EAAE,MAAM,CAAC;IACrB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,MAAM,CAAC;IAClB,QAAQ,CAAC,EAAE,MAAM,CAAC;CACnB,CAAC,CAAC;AAEH,KAAK,qBAAqB,GAAG;IAC3B,SAAS,EAAE,MAAM,CAAC;IAClB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,YAAY,CAAC,EAAE,MAAM,IAAI,CAAC;IAC1B,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,gBAAgB,CAAC,EAAE,OAAO,CAAC;CAC5B,CAAC;AAEF,MAAM,MAAM,UAAU,CAAC,CAAC,EAAE,CAAC,IAAI;IAC7B,UAAU,CAAC,EAAE,UAAU,CAAC;IACxB,SAAS,CAAC,EAAE,MAAM,CAAC;IACnB,QAAQ,CAAC,EAAE,QAAQ,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAC1B,OAAO,EAAE,kBAAkB,CAAC,CAAC,EAAE,CAAC,CAAC,CAAC;IAClC,OAAO,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;IAClB,MAAM,CAAC,EAAE,CAAC,CAAC;IACX,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,UAAU,CAAC,EAAE,OAAO,CAAC;IACrB,oBAAoB,CAAC,EAAE,MAAM,CAAC;IAC9B,mBAAmB,CAAC,EAAE,MAAM,CAAC;IAC7B,cAAc,CAAC,EAAE,MAAM,CAAC;IACxB,oBAAoB,CAAC,EAAE,KAAK,GAAG,MAAM,GAAG,UAAU,CAAC;IAEnD,qBAAqB,CAAC,EAAE,OAAO,CAAC;IAChC,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,YAAY,CAAC,EAAE,MAAM,EAAE,CAAC;IACxB,QAAQ,CAAC,EAAE,CAAC,IAAI,EAAE,MAAM,EAAE,KAAK,OAAO,CAAC;IACvC,MAAM,CAAC,EAAE,MAAM,CAAC,CAAC;IACjB,MAAM,CAAC,EAAE,CAAC,GAAG,EAAE,MAAM,CAAC,EAAE,SAAS,EAAE,aAAa,KAAK,IAAI,CAAC;IAC1D,SAAS,CAAC,EAAE,OAAO,CAAC;IACpB,SAAS,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC5B,QAAQ,CAAC,EAAE,OAAO,CAAC;IACnB,YAAY,CAAC,EAAE,KAAK,CAAC,SAAS,CAAC;IAC/B,YAAY,CAAC,EAAE,MAAM,CAAC;IAEtB,YAAY,CAAC,EAAE,OAAO,CAAC;IACvB,qBAAqB,CAAC,EAAE,qBAAqB,CAAC;CAC/C,CAAC;AAEF;;;;;IAKI;AAEJ;;;;;GAKG;AACH,wBAAgB,KAAK,CAAC,IAAI,SAAS,aAAa,EAAE,MAAM,SAAS,aAAa,EAC5E,KAAK,EAAE,UAAU,CAAC,IAAI,EAAE,MAAM,CAAC,qBA6EhC"}