@yuno-payments/dashboard-design-system 0.0.135 → 0.0.136

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.
Files changed (4) hide show
  1. package/dist/components/organisms/data-table/data-table.d.ts +6 -1
  2. package/dist/components/organisms/data-table/data-table.js +73 -72
  3. package/dist/components/organisms/data-table/data-table.types.d.ts +1 -0
  4. package/package.json +1 -1
package/dist/components/organisms/data-table/data-table.d.ts CHANGED
@@ -65,6 +65,11 @@ export interface DataTableProps<TData, TValue> {
65
65
  * @default 'onChange'
66
66
  */
67
67
  columnResizeMode?: ColumnResizeMode;
68
+ /**
69
+ * Whether to enable column pinning
70
+ * @default true
71
+ */
72
+ enableColumnPinning?: boolean;
68
73
  /**
69
74
  * Callback fired when a row is clicked
70
75
  */
@@ -121,4 +126,4 @@ export interface DataTableProps<TData, TValue> {
121
126
  * />
122
127
  * ```
123
128
  */
124
- export declare function DataTable<TData, TValue>({ columns, data, isLoading, empty, checkboxSelection, onRowSelectionChange, enableSorting, manualSorting, sorting: externalSorting, onSortingChange: externalOnSortingChange, enableColumnFilters, enableColumnResizing, columnResizeMode, onRowClick, actions, height, rowHeight, className, persistKey, initialSettings, onUpdate, }: DataTableProps<TData, TValue>): import("react/jsx-runtime").JSX.Element;
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;
package/dist/components/organisms/data-table/data-table.js CHANGED
@@ -1,102 +1,103 @@
1
1
  import { j as o } from "../../../_virtual/jsx-runtime.js";
2
- import * as I 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";
2
+ import * as U from "react";
3
+ import { useReactTable as V } from "../../../node_modules/@tanstack/react-table/build/lib/index.js";
4
+ import { Table as q } from "../../../vendor/shadcn/table.js";
5
5
  import { cn as u } 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 K } from "./components/data-table-body.js";
9
- import { useDataTableColumns as Q } from "./hooks/use-data-table-columns.js";
10
- import { useDataTableState as X } from "./hooks/use-data-table-state.js";
11
- import { ROW_HEIGHT_DEFAULT as Y } from "./utils/data-table-constants.js";
12
- import { getFilteredRowModel as Z, getSortedRowModel as $, getCoreRowModel as k } from "../../../node_modules/@tanstack/table-core/build/lib/index.js";
13
- import { Empty as z } from "../../molecules/empty/empty.js";
14
- function fe({
6
+ import { DataTableLoading as J } from "./components/states/data-table-loading.js";
7
+ import { DataTableHeader as K } 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 $, getSortedRowModel as k, getCoreRowModel as z } from "../../../node_modules/@tanstack/table-core/build/lib/index.js";
13
+ import { Empty as O } from "../../molecules/empty/empty.js";
14
+ function ge({
15
15
  columns: a,
16
16
  data: s,
17
17
  isLoading: p = !1,
18
18
  empty: C,
19
19
  checkboxSelection: m = !1,
20
- onRowSelectionChange: n,
21
- enableSorting: b = !0,
22
- manualSorting: h = !1,
20
+ onRowSelectionChange: i,
21
+ enableSorting: h = !0,
22
+ manualSorting: b = !1,
23
23
  sorting: x,
24
24
  onSortingChange: w,
25
25
  enableColumnFilters: y = !1,
26
- enableColumnResizing: i = !0,
26
+ enableColumnResizing: n = !0,
27
27
  columnResizeMode: S = "onChange",
28
- onRowClick: T,
28
+ enableColumnPinning: T = !0,
29
+ onRowClick: j,
29
30
  actions: r,
30
- height: j,
31
- rowHeight: d = Y,
32
- className: R,
33
- persistKey: D,
34
- initialSettings: F,
35
- onUpdate: M
31
+ height: R,
32
+ rowHeight: d = Z,
33
+ className: D,
34
+ persistKey: F,
35
+ initialSettings: M,
36
+ onUpdate: E
36
37
  }) {
37
- const E = Q({
38
+ const N = X({
38
39
  columns: a,
39
40
  checkboxSelection: m,
40
41
  actions: r
41
42
  }), {
42
43
  sorting: f,
43
44
  setSorting: g,
44
- columnFilters: N,
45
- setColumnFilters: v,
46
- columnVisibility: P,
47
- setColumnVisibility: A,
45
+ columnFilters: v,
46
+ setColumnFilters: P,
47
+ columnVisibility: A,
48
+ setColumnVisibility: H,
48
49
  rowSelection: c,
49
- setRowSelection: H,
50
- columnPinning: L,
51
- handleColumnPinningChange: W
52
- } = X({
53
- persistKey: D,
50
+ setRowSelection: L,
51
+ columnPinning: W,
52
+ handleColumnPinningChange: _
53
+ } = Y({
54
+ persistKey: F,
54
55
  hasActions: !!r,
55
56
  externalSorting: x,
56
57
  onExternalSortingChange: w,
57
- initialSettings: F,
58
- onUpdate: M
59
- }), t = U({
58
+ initialSettings: M,
59
+ onUpdate: E
60
+ }), t = V({
60
61
  data: s,
61
- columns: E,
62
- getCoreRowModel: k(),
63
- enableColumnResizing: i,
62
+ columns: N,
63
+ getCoreRowModel: z(),
64
+ enableColumnResizing: n,
64
65
  columnResizeMode: S,
65
- enableColumnPinning: !0,
66
+ enableColumnPinning: T,
66
67
  defaultColumn: {
67
68
  enableSorting: !1,
68
69
  minSize: 50
69
70
  },
70
- ...b && {
71
+ ...h && {
71
72
  onSortingChange: (e) => {
72
73
  g(typeof e == "function" ? e(f) : e);
73
74
  },
74
- getSortedRowModel: $(),
75
- manualSorting: h
75
+ getSortedRowModel: k(),
76
+ manualSorting: b
76
77
  },
77
78
  ...y && {
78
- onColumnFiltersChange: v,
79
- getFilteredRowModel: Z()
79
+ onColumnFiltersChange: P,
80
+ getFilteredRowModel: $()
80
81
  },
81
- onColumnVisibilityChange: A,
82
- onRowSelectionChange: H,
83
- onColumnPinningChange: W,
82
+ onColumnVisibilityChange: H,
83
+ onRowSelectionChange: L,
84
+ onColumnPinningChange: _,
84
85
  state: {
85
86
  sorting: f,
86
- columnFilters: N,
87
- columnVisibility: P,
87
+ columnFilters: v,
88
+ columnVisibility: A,
88
89
  rowSelection: c,
89
- columnPinning: L
90
+ columnPinning: W
90
91
  }
91
92
  });
92
- if (I.useEffect(() => {
93
- if (n) {
93
+ if (U.useEffect(() => {
94
+ if (i) {
94
95
  const e = t.getFilteredSelectedRowModel().rows.map((l) => l.original);
95
- n(e);
96
+ i(e);
96
97
  }
97
- }, [c, n, t]), p)
98
+ }, [c, i, t]), p)
98
99
  return /* @__PURE__ */ o.jsx(
99
- q,
100
+ J,
100
101
  {
101
102
  columns: a,
102
103
  checkboxSelection: m,
@@ -107,44 +108,44 @@ function fe({
107
108
  if (s.length === 0) {
108
109
  const e = C || {}, {
109
110
  title: l = "No results",
110
- description: _ = "No data available",
111
- media: B,
112
- actions: G
111
+ description: B = "No data available",
112
+ media: G,
113
+ actions: I
113
114
  } = e;
114
115
  return /* @__PURE__ */ o.jsx(
115
- z,
116
+ O,
116
117
  {
117
- media: B,
118
+ media: G,
118
119
  title: l,
119
- description: _,
120
- actions: G
120
+ description: B,
121
+ actions: I
121
122
  }
122
123
  );
123
124
  }
124
- return /* @__PURE__ */ o.jsx("div", { className: u("space-y-4", R), children: /* @__PURE__ */ o.jsx(
125
+ return /* @__PURE__ */ o.jsx("div", { className: u("space-y-4", D), children: /* @__PURE__ */ o.jsx(
125
126
  "div",
126
127
  {
127
128
  className: "rounded-md border overflow-x-auto",
128
- style: { height: j || "auto" },
129
+ style: { height: R || "auto" },
129
130
  children: /* @__PURE__ */ o.jsxs(
130
- V,
131
+ q,
131
132
  {
132
133
  className: u("table-fixed"),
133
134
  style: { width: "max-content", minWidth: "100%" },
134
135
  children: [
135
136
  /* @__PURE__ */ o.jsx(
136
- J,
137
+ K,
137
138
  {
138
139
  table: t,
139
- enableColumnResizing: i
140
+ enableColumnResizing: n
140
141
  }
141
142
  ),
142
143
  /* @__PURE__ */ o.jsx(
143
- K,
144
+ Q,
144
145
  {
145
146
  table: t,
146
- enableColumnResizing: i,
147
- onRowClick: T,
147
+ enableColumnResizing: n,
148
+ onRowClick: j,
148
149
  rowHeight: d
149
150
  }
150
151
  )
@@ -155,5 +156,5 @@ function fe({
155
156
  ) });
156
157
  }
157
158
  export {
158
- fe as DataTable
159
+ ge as DataTable
159
160
  };
package/dist/components/organisms/data-table/data-table.types.d.ts CHANGED
@@ -114,6 +114,7 @@ export interface DataTableProps<TData> {
114
114
  enableColumnFilters?: boolean;
115
115
  columnFilters?: ColumnFiltersState;
116
116
  onColumnFiltersChange?: (filters: ColumnFiltersState) => void;
117
+ enableColumnPinning?: boolean;
117
118
  columnVisibility?: VisibilityState;
118
119
  onColumnVisibilityChange?: (visibility: VisibilityState) => void;
119
120
  onRowClick?: (row: TData) => void;
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@yuno-payments/dashboard-design-system",
3
- "version": "0.0.135",
3
+ "version": "0.0.136",
4
4
  "type": "module",
5
5
  "main": "./dist/index.js",
6
6
  "module": "./dist/index.js",