@algorithm-shift/design-system 1.2.974 → 1.2.975
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.d.mts +1 -1
- package/dist/index.d.ts +1 -1
- package/dist/index.js +67 -6
- package/dist/index.js.map +1 -1
- package/dist/index.mjs +67 -6
- package/dist/index.mjs.map +1 -1
- package/package.json +1 -1
package/dist/index.mjs
CHANGED
|
@@ -29542,7 +29542,7 @@ var sanitizeValue = (val) => {
|
|
|
29542
29542
|
}
|
|
29543
29543
|
return String(val);
|
|
29544
29544
|
};
|
|
29545
|
-
var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers = {}, format3, customFormatters = {}) => {
|
|
29545
|
+
var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers = {}, format3, customFormatters = {}, info) => {
|
|
29546
29546
|
const formattedValue = valueFormatter(value, format3, customFormatters);
|
|
29547
29547
|
const rowValue = row?.[rendererProps?.rowField];
|
|
29548
29548
|
switch (renderer) {
|
|
@@ -29665,6 +29665,16 @@ var cellRendererFactory = (renderer, rendererProps, value, row, customRenderers
|
|
|
29665
29665
|
i
|
|
29666
29666
|
)) });
|
|
29667
29667
|
}
|
|
29668
|
+
case "checkbox":
|
|
29669
|
+
return /* @__PURE__ */ jsx50(
|
|
29670
|
+
"input",
|
|
29671
|
+
{
|
|
29672
|
+
type: "checkbox",
|
|
29673
|
+
checked: info.row.getIsSelected(),
|
|
29674
|
+
disabled: !info.row.getCanSelect(),
|
|
29675
|
+
onChange: info.row.getToggleSelectedHandler()
|
|
29676
|
+
}
|
|
29677
|
+
);
|
|
29668
29678
|
/* -------------------- ADVANCED -------------------- */
|
|
29669
29679
|
case "custom": {
|
|
29670
29680
|
const CustomRenderer = customRenderers[rendererProps?.customRendererId] || customRenderers[rendererProps?.rendererId];
|
|
@@ -29704,9 +29714,18 @@ var useDynamicColumns = (config, customRenderers = {}, customFormatters = {}) =>
|
|
|
29704
29714
|
}
|
|
29705
29715
|
return sanitizeValue(row[accessorKey]);
|
|
29706
29716
|
};
|
|
29717
|
+
const existingMeta = col.meta || {};
|
|
29718
|
+
const additional = {};
|
|
29719
|
+
if (col.size && col.size > 0) {
|
|
29720
|
+
Object.assign(additional, { size: col.size });
|
|
29721
|
+
} else {
|
|
29722
|
+
Object.assign(additional, { size: 180, minSize: 0, maxSize: Number.MAX_SAFE_INTEGER });
|
|
29723
|
+
Object.assign(existingMeta, { className: "w-full" });
|
|
29724
|
+
}
|
|
29707
29725
|
return columnHelper.accessor(accessorFn, {
|
|
29708
29726
|
...col,
|
|
29709
|
-
|
|
29727
|
+
...additional,
|
|
29728
|
+
// size: (col.size && col.size > 0) ? col.size : 180,
|
|
29710
29729
|
id: col.id ?? accessorKey,
|
|
29711
29730
|
header: col.header,
|
|
29712
29731
|
cell: (info) => {
|
|
@@ -29719,12 +29738,18 @@ var useDynamicColumns = (config, customRenderers = {}, customFormatters = {}) =>
|
|
|
29719
29738
|
row,
|
|
29720
29739
|
customRenderers,
|
|
29721
29740
|
col.format,
|
|
29722
|
-
customFormatters
|
|
29741
|
+
customFormatters,
|
|
29742
|
+
info
|
|
29723
29743
|
);
|
|
29724
29744
|
},
|
|
29725
29745
|
enableSorting: col.enableSorting,
|
|
29726
29746
|
enableColumnFilter: col.enableColumnFilter,
|
|
29727
|
-
meta
|
|
29747
|
+
// Merge existing meta to preserve headerLabel and other properties
|
|
29748
|
+
meta: {
|
|
29749
|
+
...existingMeta,
|
|
29750
|
+
// Preserve headerLabel if it exists
|
|
29751
|
+
...existingMeta.headerLabel ? { headerLabel: existingMeta.headerLabel } : {}
|
|
29752
|
+
}
|
|
29728
29753
|
});
|
|
29729
29754
|
});
|
|
29730
29755
|
};
|
|
@@ -29747,14 +29772,40 @@ function DataTable({
|
|
|
29747
29772
|
globalSearch,
|
|
29748
29773
|
onCellClick,
|
|
29749
29774
|
onDeleteRow,
|
|
29750
|
-
rowActions
|
|
29775
|
+
rowActions,
|
|
29776
|
+
enableRowSelection = false,
|
|
29777
|
+
getRowSelection
|
|
29751
29778
|
}) {
|
|
29752
29779
|
const [columnFilters, setColumnFilters] = React9.useState([]);
|
|
29753
29780
|
const [columnVisibility, setColumnVisibility] = React9.useState({});
|
|
29754
29781
|
const [manualSort, setManualSort] = React9.useState(null);
|
|
29755
29782
|
const [searchTerm, setSearchTerm] = React9.useState("");
|
|
29756
29783
|
const tableData = Array.isArray(data) ? data : [];
|
|
29757
|
-
const
|
|
29784
|
+
const finalCols = [...columns];
|
|
29785
|
+
if (enableRowSelection) {
|
|
29786
|
+
finalCols.unshift({
|
|
29787
|
+
id: "__select__",
|
|
29788
|
+
renderer: "checkbox",
|
|
29789
|
+
size: 40,
|
|
29790
|
+
header: ({ table: table2 }) => /* @__PURE__ */ jsx51(
|
|
29791
|
+
"input",
|
|
29792
|
+
{
|
|
29793
|
+
type: "checkbox",
|
|
29794
|
+
checked: table2.getIsAllRowsSelected(),
|
|
29795
|
+
onChange: table2.getToggleAllRowsSelectedHandler()
|
|
29796
|
+
}
|
|
29797
|
+
),
|
|
29798
|
+
meta: {
|
|
29799
|
+
cellClass: "",
|
|
29800
|
+
cellStyle: {},
|
|
29801
|
+
headerLabel: "Select"
|
|
29802
|
+
},
|
|
29803
|
+
enableSorting: false,
|
|
29804
|
+
enableColumnFilter: false
|
|
29805
|
+
});
|
|
29806
|
+
}
|
|
29807
|
+
const dynamicCols = useDynamicColumns({ columns: finalCols, enableRowSelection });
|
|
29808
|
+
const [rowSelection, setRowSelection] = React9.useState({});
|
|
29758
29809
|
const [localPageSize, setLocalPageSize] = React9.useState(pageSize);
|
|
29759
29810
|
const table = useReactTable({
|
|
29760
29811
|
data: tableData,
|
|
@@ -29762,6 +29813,7 @@ function DataTable({
|
|
|
29762
29813
|
state: {
|
|
29763
29814
|
columnFilters,
|
|
29764
29815
|
columnVisibility,
|
|
29816
|
+
rowSelection,
|
|
29765
29817
|
...paginationMode === "server" ? {
|
|
29766
29818
|
pagination: {
|
|
29767
29819
|
pageIndex: controlledPageIndex ?? 0,
|
|
@@ -29769,6 +29821,15 @@ function DataTable({
|
|
|
29769
29821
|
}
|
|
29770
29822
|
} : {}
|
|
29771
29823
|
},
|
|
29824
|
+
enableRowSelection: !!enableRowSelection,
|
|
29825
|
+
onRowSelectionChange: (updater) => {
|
|
29826
|
+
setRowSelection((old) => {
|
|
29827
|
+
const newState = typeof updater === "function" ? updater(old) : updater;
|
|
29828
|
+
const selectedData = Object.keys(newState).filter((key) => newState[key]).map((rowId) => tableData[Number(rowId)]);
|
|
29829
|
+
getRowSelection?.(selectedData);
|
|
29830
|
+
return newState;
|
|
29831
|
+
});
|
|
29832
|
+
},
|
|
29772
29833
|
onColumnFiltersChange: setColumnFilters,
|
|
29773
29834
|
onColumnVisibilityChange: setColumnVisibility,
|
|
29774
29835
|
getCoreRowModel: getCoreRowModel(),
|