@yuno-payments/dashboard-design-system 0.0.151 → 0.0.152

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.
@@ -27,6 +27,11 @@ export interface DataTableProps<TData, TValue> {
27
27
  * @default false
28
28
  */
29
29
  checkboxSelection?: boolean;
30
+ /**
31
+ * Key to force reset of row selection. Change this value to clear all selections.
32
+ * Useful when parent needs to programmatically clear selections.
33
+ */
34
+ selectionResetKey?: string | number;
30
35
  /**
31
36
  * Callback fired when row selection changes
32
37
  */
@@ -126,4 +131,4 @@ export interface DataTableProps<TData, TValue> {
126
131
  * />
127
132
  * ```
128
133
  */
129
- export declare function DataTable<TData, TValue>({ columns, data, isLoading, empty, checkboxSelection, onRowSelectionChange, enableSorting, manualSorting, sorting: externalSorting, onSortingChange: externalOnSortingChange, enableColumnFilters, enableColumnResizing, columnResizeMode, enableColumnPinning, onRowClick, actions, height, rowHeight, className, persistKey, initialSettings, onUpdate, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
134
+ export declare function DataTable<TData, TValue>({ columns, data, isLoading, empty, checkboxSelection, selectionResetKey, onRowSelectionChange, enableSorting, manualSorting, sorting: externalSorting, onSortingChange: externalOnSortingChange, enableColumnFilters, enableColumnResizing, columnResizeMode, enableColumnPinning, onRowClick, actions, height, rowHeight, className, persistKey, initialSettings, onUpdate, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
@@ -1,136 +1,139 @@
1
1
  import { j as e } from "../../../_virtual/jsx-runtime.js";
2
- import * as B from "react";
3
- import { useReactTable as I } from "../../../node_modules/@tanstack/react-table/build/lib/index.js";
4
- import { Table as U } from "../../../vendor/shadcn/table.js";
5
- import { cn as x } from "../../../lib/utils.js";
6
- import { DataTableLoading as V } from "./components/states/data-table-loading.js";
7
- import { DataTableHeader as q } from "./components/data-table-header.js";
8
- import { DataTableBody as J } from "./components/data-table-body.js";
9
- import { useDataTableColumns as K } from "./hooks/use-data-table-columns.js";
10
- import { useDataTableState as Q } from "./hooks/use-data-table-state.js";
11
- import { ROW_HEIGHT_DEFAULT as X } from "./utils/data-table-constants.js";
12
- import { getFilteredRowModel as Y, getSortedRowModel as Z, getCoreRowModel as k } from "../../../node_modules/@tanstack/table-core/build/lib/index.js";
13
- import { Empty as O } from "../../molecules/empty/empty.js";
14
- function fo({
2
+ import * as b from "react";
3
+ import { useReactTable as U } from "../../../node_modules/@tanstack/react-table/build/lib/index.js";
4
+ import { Table as V } from "../../../vendor/shadcn/table.js";
5
+ import { cn as h } from "../../../lib/utils.js";
6
+ import { DataTableLoading as q } from "./components/states/data-table-loading.js";
7
+ import { DataTableHeader as J } from "./components/data-table-header.js";
8
+ import { DataTableBody as Q } from "./components/data-table-body.js";
9
+ import { useDataTableColumns as X } from "./hooks/use-data-table-columns.js";
10
+ import { useDataTableState as Y } from "./hooks/use-data-table-state.js";
11
+ import { ROW_HEIGHT_DEFAULT as Z } from "./utils/data-table-constants.js";
12
+ import { getFilteredRowModel as k, getSortedRowModel as K, getCoreRowModel as O } from "../../../node_modules/@tanstack/table-core/build/lib/index.js";
13
+ import { Empty as oo } from "../../molecules/empty/empty.js";
14
+ function go({
15
15
  columns: m,
16
16
  data: d,
17
- isLoading: C = !1,
18
- empty: b,
19
- checkboxSelection: c = !1,
17
+ isLoading: S = !1,
18
+ empty: j,
19
+ checkboxSelection: u = !1,
20
+ selectionResetKey: c,
20
21
  onRowSelectionChange: l,
21
- enableSorting: h = !0,
22
- manualSorting: S = !1,
23
- sorting: j,
24
- onSortingChange: w,
25
- enableColumnFilters: y = !1,
26
- enableColumnResizing: s = !0,
27
- columnResizeMode: R = "onChange",
28
- enableColumnPinning: T = !0,
29
- onRowClick: D,
30
- actions: r,
31
- height: F,
32
- rowHeight: u = X,
33
- className: M,
34
- persistKey: v,
35
- initialSettings: E,
36
- onUpdate: N
22
+ enableSorting: w = !0,
23
+ manualSorting: y = !1,
24
+ sorting: T,
25
+ onSortingChange: R,
26
+ enableColumnFilters: D = !1,
27
+ enableColumnResizing: r = !0,
28
+ columnResizeMode: F = "onChange",
29
+ enableColumnPinning: v = !0,
30
+ onRowClick: E,
31
+ actions: s,
32
+ height: M,
33
+ rowHeight: f = Z,
34
+ className: N,
35
+ persistKey: H,
36
+ initialSettings: P,
37
+ onUpdate: W
37
38
  }) {
38
- const H = K({
39
+ const _ = X({
39
40
  columns: m,
40
- checkboxSelection: c,
41
- actions: r
41
+ checkboxSelection: u,
42
+ actions: s
42
43
  }), {
43
- sorting: f,
44
- setSorting: g,
45
- columnFilters: P,
46
- setColumnFilters: W,
47
- columnVisibility: _,
48
- setColumnVisibility: $,
49
- rowSelection: p,
50
- setRowSelection: z,
51
- columnPinning: A,
52
- handleColumnPinningChange: G
53
- } = Q({
54
- persistKey: v,
55
- hasActions: !!r,
56
- externalSorting: j,
57
- onExternalSortingChange: w,
58
- initialSettings: E,
59
- onUpdate: N
60
- }), i = I({
44
+ sorting: g,
45
+ setSorting: p,
46
+ columnFilters: $,
47
+ setColumnFilters: z,
48
+ columnVisibility: A,
49
+ setColumnVisibility: G,
50
+ rowSelection: x,
51
+ setRowSelection: C,
52
+ columnPinning: L,
53
+ handleColumnPinningChange: B
54
+ } = Y({
55
+ persistKey: H,
56
+ hasActions: !!s,
57
+ externalSorting: T,
58
+ onExternalSortingChange: R,
59
+ initialSettings: P,
60
+ onUpdate: W
61
+ }), i = U({
61
62
  data: d,
62
- columns: H,
63
- getCoreRowModel: k(),
64
- enableColumnResizing: s,
65
- columnResizeMode: R,
66
- enableColumnPinning: T,
63
+ columns: _,
64
+ getCoreRowModel: O(),
65
+ enableColumnResizing: r,
66
+ columnResizeMode: F,
67
+ enableColumnPinning: v,
67
68
  defaultColumn: {
68
69
  enableSorting: !1,
69
70
  minSize: 50
70
71
  },
71
- ...h && {
72
+ ...w && {
72
73
  onSortingChange: (o) => {
73
- g(typeof o == "function" ? o(f) : o);
74
+ p(typeof o == "function" ? o(g) : o);
74
75
  },
75
- getSortedRowModel: Z(),
76
- manualSorting: S
76
+ getSortedRowModel: K(),
77
+ manualSorting: y
77
78
  },
78
- ...y && {
79
- onColumnFiltersChange: W,
80
- getFilteredRowModel: Y()
79
+ ...D && {
80
+ onColumnFiltersChange: z,
81
+ getFilteredRowModel: k()
81
82
  },
82
- onColumnVisibilityChange: $,
83
- onRowSelectionChange: z,
84
- onColumnPinningChange: G,
83
+ onColumnVisibilityChange: G,
84
+ onRowSelectionChange: C,
85
+ onColumnPinningChange: B,
85
86
  state: {
86
- sorting: f,
87
- columnFilters: P,
88
- columnVisibility: _,
89
- rowSelection: p,
90
- columnPinning: A
87
+ sorting: g,
88
+ columnFilters: $,
89
+ columnVisibility: A,
90
+ rowSelection: x,
91
+ columnPinning: L
91
92
  }
92
93
  });
93
- if (B.useEffect(() => {
94
+ if (b.useEffect(() => {
95
+ c !== void 0 && C({});
96
+ }, [c]), b.useEffect(() => {
94
97
  if (l) {
95
98
  const o = i.getFilteredSelectedRowModel().rows.map((t) => t.original);
96
99
  l(o);
97
100
  }
98
- }, [p, l, i]), C)
101
+ }, [x, l, i]), S)
99
102
  return /* @__PURE__ */ e.jsx(
100
- V,
103
+ q,
101
104
  {
102
105
  columns: m,
103
- checkboxSelection: c,
104
- actions: r,
105
- rowHeight: u
106
+ checkboxSelection: u,
107
+ actions: s,
108
+ rowHeight: f
106
109
  }
107
110
  );
108
111
  if (d.length === 0) {
109
- const o = b || {}, {
112
+ const o = j || {}, {
110
113
  title: t = "No results",
111
114
  description: a = "No data available",
112
115
  media: n,
113
- actions: L
116
+ actions: I
114
117
  } = o;
115
118
  return /* @__PURE__ */ e.jsx(
116
- O,
119
+ oo,
117
120
  {
118
121
  media: n,
119
122
  title: t,
120
123
  description: a,
121
- actions: L
124
+ actions: I
122
125
  }
123
126
  );
124
127
  }
125
- return /* @__PURE__ */ e.jsx("div", { className: x("yuno-data-table space-y-4", M), children: /* @__PURE__ */ e.jsx(
128
+ return /* @__PURE__ */ e.jsx("div", { className: h("yuno-data-table space-y-4", N), children: /* @__PURE__ */ e.jsx(
126
129
  "div",
127
130
  {
128
131
  className: "rounded-md border overflow-x-auto",
129
- style: { height: F || "auto" },
132
+ style: { height: M || "auto" },
130
133
  children: /* @__PURE__ */ e.jsxs(
131
- U,
134
+ V,
132
135
  {
133
- className: x("table-fixed"),
136
+ className: h("table-fixed"),
134
137
  children: [
135
138
  /* @__PURE__ */ e.jsx("colgroup", { children: i.getHeaderGroups()[0]?.headers.map((o) => {
136
139
  const t = o.column.columnDef.enableResizing === !1, a = o.column.id === "_spacer", n = o.column.getSize();
@@ -147,19 +150,19 @@ function fo({
147
150
  );
148
151
  }) }),
149
152
  /* @__PURE__ */ e.jsx(
150
- q,
153
+ J,
151
154
  {
152
155
  table: i,
153
- enableColumnResizing: s
156
+ enableColumnResizing: r
154
157
  }
155
158
  ),
156
159
  /* @__PURE__ */ e.jsx(
157
- J,
160
+ Q,
158
161
  {
159
162
  table: i,
160
- enableColumnResizing: s,
161
- onRowClick: D,
162
- rowHeight: u
163
+ enableColumnResizing: r,
164
+ onRowClick: E,
165
+ rowHeight: f
163
166
  }
164
167
  )
165
168
  ]
@@ -169,5 +172,5 @@ function fo({
169
172
  ) });
170
173
  }
171
174
  export {
172
- fo as DataTable
175
+ go as DataTable
173
176
  };
@@ -100,6 +100,7 @@ export interface DataTableProps<TData> {
100
100
  isLoading?: boolean;
101
101
  empty?: EmptyProps;
102
102
  checkboxSelection?: boolean;
103
+ selectionResetKey?: string | number;
103
104
  onRowSelectionChange?: (selectedRows: TData[]) => void;
104
105
  enablePagination?: boolean;
105
106
  pageSize?: number;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yuno-payments/dashboard-design-system",
3
- "version": "0.0.151",
3
+ "version": "0.0.152",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",