@synerise/ds-table-new 0.1.0

package/dist/utils/getIsRevealed.js

@@ -0,0 +1,9 @@
+const getIsRevealed = ({
+  scrollDirection,
+  hasData
+}) => {
+  return hasData && scrollDirection === "backward";
+};
+export {
+  getIsRevealed
+};

package/dist/utils/getPaginationConfig.d.ts

@@ -0,0 +1,10 @@
+import { TablePaginationConfig } from '../Table.types';
+export declare const getPaginationConfig: (pagination?: TablePaginationConfig | boolean) => {
+    initialState: {
+        pagination: {
+            pageSize: number;
+        };
+    };
+} | {
+    initialState: {};
+};

package/dist/utils/getPaginationConfig.js

@@ -0,0 +1,19 @@
+import { DEFAULT_PAGINATION_CONFIG } from "../Table.const.js";
+const getPaginationConfig = (pagination) => {
+  if (!pagination) {
+    return {
+      initialState: {}
+    };
+  }
+  return pagination === true ? DEFAULT_PAGINATION_CONFIG : {
+    initialState: {
+      pagination: {
+        pageSize: pagination.pageSize
+      }
+    },
+    ...pagination
+  };
+};
+export {
+  getPaginationConfig
+};

package/dist/utils/getRecordSelectionStatus.d.ts

@@ -0,0 +1,5 @@
+import { SelectionConfig } from '../Table.types';
+export declare const getRecordSelectionStatus: <TData>(checkRowSelectionStatus: SelectionConfig<TData>["checkRowSelectionStatus"], record: TData) => {
+    unavailable: boolean | undefined;
+    disabled: boolean | undefined;
+};

package/dist/utils/getRecordSelectionStatus.js

@@ -0,0 +1,13 @@
+const getRecordSelectionStatus = (checkRowSelectionStatus, record) => {
+  const {
+    unavailable,
+    disabled
+  } = checkRowSelectionStatus && checkRowSelectionStatus(record) || {};
+  return {
+    unavailable,
+    disabled
+  };
+};
+export {
+  getRecordSelectionStatus
+};

package/dist/utils/index.d.ts

@@ -0,0 +1,2 @@
+export * from './getRecordSelectionStatus';
+export * from './isRecordSelectable';

package/dist/utils/index.js

@@ -0,0 +1,6 @@
+import { getRecordSelectionStatus } from "./getRecordSelectionStatus.js";
+import { isRecordSelectable } from "./isRecordSelectable.js";
+export {
+  getRecordSelectionStatus,
+  isRecordSelectable
+};

package/dist/utils/isRecordSelectable.d.ts

@@ -0,0 +1,2 @@
+import { SelectionConfig } from '../Table.types';
+export declare const isRecordSelectable: <TData>(record: TData, checkRowSelectionStatus?: SelectionConfig<TData>["checkRowSelectionStatus"]) => boolean;

package/dist/utils/isRecordSelectable.js

@@ -0,0 +1,14 @@
+import { getRecordSelectionStatus } from "./getRecordSelectionStatus.js";
+const isRecordSelectable = (record, checkRowSelectionStatus) => {
+  if (!checkRowSelectionStatus) {
+    return true;
+  }
+  const {
+    unavailable,
+    disabled
+  } = getRecordSelectionStatus(checkRowSelectionStatus, record);
+  return !(unavailable || disabled);
+};
+export {
+  isRecordSelectable
+};

package/dist/utils/legacyColumnConfigAdapter.d.ts

@@ -0,0 +1,3 @@
+import { VirtualColumnType as LegacyColumnType } from '@synerise/ds-table';
+import { ColumnDef } from '@tanstack/react-table';
+export declare const legacyColumnConfigAdapter: <DataType, DataValue>(columns: Array<LegacyColumnType<DataType>>) => ColumnDef<DataType, DataValue>[];

package/dist/utils/legacyColumnConfigAdapter.js

@@ -0,0 +1,113 @@
+import { EXPANDED_ROW_PROPERTY } from "../Table.const.js";
+import { calculatePixels } from "./calculatePixels.js";
+const getSortStateApiAdapter = (headerContext) => {
+  const sortState = headerContext.table.getState().sorting;
+  const legacyColumnSortState = {};
+  sortState.forEach((column, index) => {
+    legacyColumnSortState[column.id] = {
+      sortOrder: column.desc ? "descend" : "ascend",
+      multiple: sortState.length > 1 ? index : false
+    };
+  });
+  return {
+    columnsSortState: legacyColumnSortState,
+    // get sort order for column by key
+    getColumnSortOrder: (key) => {
+      switch (headerContext.table.getColumn(key)?.getIsSorted()) {
+        case "asc":
+          return "ascend";
+        case "desc":
+          return "descend";
+        default:
+          return null;
+      }
+    },
+    setColumnSortOrder: (key, sort) => {
+      const allowMultiple = headerContext.table.getColumn(key)?.columnDef.meta?.enableMultiSort;
+      headerContext.table.getColumn(key)?.toggleSorting(sort === "descend", allowMultiple);
+    },
+    updateColumnsData: () => {
+    }
+  };
+};
+const DEFAULT_SORT_FN = "text";
+const getSortingConfig = (sorter) => {
+  if (!sorter) {
+    return {
+      enableSorting: false
+    };
+  }
+  if (sorter === true) {
+    return {
+      sortingFn: DEFAULT_SORT_FN
+    };
+  }
+  let sortFn;
+  let enableMultiSort;
+  let multiSortOrder;
+  if (typeof sorter === "function") {
+    sortFn = sorter;
+  }
+  if ("compare" in sorter && sorter.compare) {
+    sortFn = sorter.compare;
+    enableMultiSort = !!sorter.multiple;
+    multiSortOrder = sorter.multiple;
+  }
+  return {
+    sortingFn: sortFn ? (rowA, rowB, _columnId) => {
+      return sortFn(rowA.original, rowB.original);
+    } : DEFAULT_SORT_FN,
+    enableMultiSort,
+    multiSortOrder
+  };
+};
+const legacyColumnConfigAdapter = (columns) => {
+  return columns.map((column, index) => {
+    const customSortRender = column.sortRender && typeof column.sortRender !== "string" ? (headerContext) => {
+      const legacySortStateApi = getSortStateApiAdapter(headerContext);
+      return column.sortRender && typeof column.sortRender !== "string" && column.sortRender(legacySortStateApi, column);
+    } : void 0;
+    const {
+      multiSortOrder,
+      ...sortingConfig
+    } = getSortingConfig(column.sorter);
+    return {
+      accessorKey: `${column.dataIndex}`,
+      header: () => {
+        return typeof column.title === "function" ? column.title({}) : column.title;
+      },
+      cell: (info) => {
+        return column.render?.(info.getValue(), info.row.original, info.column.getIndex()) || info.getValue();
+      },
+      meta: {
+        minWidth: column.minWidth,
+        maxWidth: column.maxWidth,
+        width: column.width,
+        fixed: column.fixed,
+        sortOrder: column.sortOrder,
+        sortRender: typeof column.sortRender === "string" ? column.sortRender : void 0,
+        renderCustomSortButton: customSortRender,
+        multipleSortingOrder: multiSortOrder,
+        childCell: (info) => {
+          if (column.childRender) {
+            const rowData = {
+              ...info.row.original,
+              [EXPANDED_ROW_PROPERTY]: true,
+              index: info.row.index
+            };
+            return column.childRender(info.getValue(), rowData, info.column.getIndex());
+          }
+          return column.render?.(info.getValue(), info.row.original, info.column.getIndex()) || info.getValue();
+        }
+      },
+      enablePinning: !!column.fixed,
+      ...sortingConfig,
+      size: calculatePixels(column.width),
+      ...column,
+      id: `${column.id || column.key || `${column.dataIndex}-${index}`}`
+    };
+  });
+};
+export {
+  legacyColumnConfigAdapter
+};

package/dist/utils/processColumns.d.ts

@@ -0,0 +1,3 @@
+import { ColumnDef } from '@tanstack/react-table';
+import { TableTexts } from '../Table.types';
+export declare const processColumns: <TData extends object, TValue>(columns: ColumnDef<TData, TValue>[], selection: boolean, texts: TableTexts) => ColumnDef<TData, TValue>[];

package/dist/utils/processColumns.js

@@ -0,0 +1,24 @@
+import { jsx } from "react/jsx-runtime";
+import { SELECTION_COLUMN_ID } from "../Table.const.js";
+import { TableRowSelection } from "../components/TableBody/TableRowSelection/TableRowSelection.js";
+const processColumns = (columns, selection, texts) => {
+  const selectionColumn = {
+    id: SELECTION_COLUMN_ID,
+    size: 64,
+    minSize: 64,
+    maxSize: 64,
+    meta: {
+      style: {
+        paddingRight: "8px"
+      }
+    },
+    header: "",
+    cell: ({
+      row
+    }) => /* @__PURE__ */ jsx(TableRowSelection, { row, texts })
+  };
+  return selection ? [selectionColumn, ...columns] : columns;
+};
+export {
+  processColumns
+};

package/dist/utils/sort.d.ts

@@ -0,0 +1,3 @@
+import { Column, SortDirection } from '@tanstack/react-table';
+export declare const isSorted: <TData>(column: Column<TData>) => boolean;
+export declare const getSortOrder: <TData>(column: Column<TData>) => false | SortDirection;

package/dist/utils/sort.js

@@ -0,0 +1,14 @@
+const isSorted = (column) => {
+  return Boolean(column.columnDef.meta?.sortOrder ?? column.getIsSorted());
+};
+const SORT_ORDER = {
+  ascend: "asc",
+  descend: "desc"
+};
+const getSortOrder = (column) => {
+  return column.columnDef.meta?.sortOrder ? SORT_ORDER[column.columnDef.meta?.sortOrder] : column.getIsSorted();
+};
+export {
+  getSortOrder,
+  isSorted
+};

package/package.json

@@ -0,0 +1,76 @@
+{
+  "name": "@synerise/ds-table-new",
+  "version": "0.1.0",
+  "description": "TableNew UI Component for the Synerise Design System",
+  "license": "ISC",
+  "repository": "Synerise/synerise-design",
+  "main": "dist/index.js",
+  "files": [
+    "/dist",
+    "CHANGELOG.md",
+    "README.md",
+    "package.json",
+    "LICENSE.md"
+  ],
+  "publishConfig": {
+    "access": "public"
+  },
+  "scripts": {
+    "build": "vite build",
+    "build:watch": "vite build --watch",
+    "defs": "tsc --declaration --outDir dist/ --emitDeclarationOnly",
+    "prepublish": "pnpm run build",
+    "types": "tsc --noEmit",
+    "pack:ci": "pnpm pack --pack-destination ../../storybook/storybook-static/static",
+    "test": "vitest run",
+    "test:watch": "vitest",
+    "check:circular-dependencies": "madge --circular --extensions ts,tsx,js,jsx --ts-config tsconfig.json src/ --exclude '/dist/'",
+    "upgrade:ds": "ncu -f \"@synerise/ds-*\" -u"
+  },
+  "sideEffects": [
+    "dist/style/*",
+    "*.less"
+  ],
+  "types": "dist/index.d.ts",
+  "dependencies": {
+    "@floating-ui/react": "^0.27.16",
+    "@synerise/ds-badge": "^1.0.46",
+    "@synerise/ds-button": "^1.5.20",
+    "@synerise/ds-checkbox": "^1.2.23",
+    "@synerise/ds-copy-icon": "^1.2.4",
+    "@synerise/ds-dropdown": "^1.3.4",
+    "@synerise/ds-flag": "^1.0.10",
+    "@synerise/ds-icon": "^1.15.3",
+    "@synerise/ds-inline-alert": "^1.1.17",
+    "@synerise/ds-input": "^1.7.0",
+    "@synerise/ds-input-number": "^1.2.37",
+    "@synerise/ds-loader": "^1.0.15",
+    "@synerise/ds-modal": "^1.4.3",
+    "@synerise/ds-pagination": "^1.0.55",
+    "@synerise/ds-result": "^1.0.51",
+    "@synerise/ds-scrollbar": "^1.2.19",
+    "@synerise/ds-search": "^1.5.12",
+    "@synerise/ds-skeleton": "^1.0.47",
+    "@synerise/ds-table": "^1.10.0",
+    "@synerise/ds-tag": "^1.4.20",
+    "@synerise/ds-tags": "^1.5.30",
+    "@synerise/ds-tooltip": "^1.4.12",
+    "@synerise/ds-typography": "^1.1.15",
+    "@synerise/ds-utils": "^1.8.0",
+    "@tanstack/react-table": "^8.21.3",
+    "@tanstack/react-virtual": "^3.13.12",
+    "unit-to-px": "^1.0.5",
+    "uuid": "^10.0.0"
+  },
+  "devDependencies": {
+    "vitest": "4"
+  },
+  "peerDependencies": {
+    "@synerise/ds-core": "*",
+    "antd": "^4.24.16",
+    "react": ">=16.9.0 <= 18.3.1",
+    "react-intl": ">= 3.12.0 <= 6.8",
+    "styled-components": "^5.3.3"
+  },
+  "gitHead": "ce3c6d75efe8573a2b274853636f959b75a6cd32"
+}