@cryptlex/web-components 1.3.3 → 1.3.4

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 (53) hide show
  1. package/dist/components/data-table/column-picker.es.js +7 -10
  2. package/dist/components/data-table/column-picker.es.js.map +1 -1
  3. package/dist/components/data-table/data-table.es.js +41 -41
  4. package/dist/components/data-table/data-table.es.js.map +1 -1
  5. package/dist/components/data-table/table-actions.es.js +15 -19
  6. package/dist/components/data-table/table-actions.es.js.map +1 -1
  7. package/dist/components/data-table/table-commons.es.js +21 -24
  8. package/dist/components/data-table/table-commons.es.js.map +1 -1
  9. package/dist/components/data-table/table-utils/createTableFetchFn.es.js +8 -9
  10. package/dist/components/data-table/table-utils/createTableFetchFn.es.js.map +1 -1
  11. package/dist/components/data-table/table-utils/types.es.js.map +1 -1
  12. package/dist/components/info-card/info-card.es.js +11 -14
  13. package/dist/components/info-card/info-card.es.js.map +1 -1
  14. package/dist/components/sidebar/app-layout.es.js +2 -5
  15. package/dist/components/sidebar/app-layout.es.js.map +1 -1
  16. package/dist/components/ui/avatar.es.js +12 -14
  17. package/dist/components/ui/avatar.es.js.map +1 -1
  18. package/dist/components/ui/button.es.js +1 -1
  19. package/dist/components/ui/button.es.js.map +1 -1
  20. package/dist/components/ui/chart.es.js +40 -51
  21. package/dist/components/ui/chart.es.js.map +1 -1
  22. package/dist/components/ui/collapsible.es.js +1 -0
  23. package/dist/components/ui/collapsible.es.js.map +1 -1
  24. package/dist/components/ui/dialog.es.js +23 -22
  25. package/dist/components/ui/dialog.es.js.map +1 -1
  26. package/dist/components/ui/drawer.es.js +5 -38
  27. package/dist/components/ui/drawer.es.js.map +1 -1
  28. package/dist/components/ui/form.es.js +28 -29
  29. package/dist/components/ui/form.es.js.map +1 -1
  30. package/dist/components/ui/mutli-select.es.js +8 -10
  31. package/dist/components/ui/mutli-select.es.js.map +1 -1
  32. package/dist/components/ui/password-input.es.js +9 -8
  33. package/dist/components/ui/password-input.es.js.map +1 -1
  34. package/dist/components/ui/search-input.es.js +5 -4
  35. package/dist/components/ui/search-input.es.js.map +1 -1
  36. package/dist/components/ui/select.es.js +4 -9
  37. package/dist/components/ui/select.es.js.map +1 -1
  38. package/dist/components/ui/separator.es.js +17 -18
  39. package/dist/components/ui/separator.es.js.map +1 -1
  40. package/dist/components/ui/sheet.es.js +1 -0
  41. package/dist/components/ui/sheet.es.js.map +1 -1
  42. package/dist/components/ui/sonner.es.js +3 -2
  43. package/dist/components/ui/sonner.es.js.map +1 -1
  44. package/dist/components/ui/tooltip.es.js +9 -8
  45. package/dist/components/ui/tooltip.es.js.map +1 -1
  46. package/dist/index.es.d.ts +12 -67
  47. package/dist/index.es.js +104 -113
  48. package/dist/index.es.js.map +1 -1
  49. package/package.json +9 -6
  50. package/dist/components/data-table/table-utils/fetch.es.js +0 -40
  51. package/dist/components/data-table/table-utils/fetch.es.js.map +0 -1
  52. package/dist/components/ui/dynamic-input.es.js +0 -141
  53. package/dist/components/ui/dynamic-input.es.js.map +0 -1
@@ -16,7 +16,7 @@ import "../ui/dropdown-menu.es.js";
16
16
  import "../ui/form.es.js";
17
17
  import "../ui/input.es.js";
18
18
  import "../ui/input-otp.es.js";
19
- import { Label as p } from "../ui/label.es.js";
19
+ import { Label as s } from "../ui/label.es.js";
20
20
  import { Columns3 as a } from "lucide-react";
21
21
  import "../ui/mutli-select.es.js";
22
22
  import "../ui/navigation-menu.es.js";
@@ -33,19 +33,16 @@ import "sonner";
33
33
  import "../ui/table.es.js";
34
34
  import "../ui/tabs.es.js";
35
35
  import "../ui/tooltip.es.js";
36
- import "@tanstack/react-query";
37
- import "cmdk";
38
36
  import { useState as u } from "react";
39
- import "use-debounce";
40
37
  import { getResourceDisplayName as C } from "./table-utils/constants.es.js";
41
- function te({ table: r }) {
42
- const [t, s] = u(""), m = r.getAllColumns().filter(
38
+ function oe({ table: r }) {
39
+ const [t, p] = u(""), m = r.getAllColumns().filter(
43
40
  (e) => e.getCanHide() && e.id.toLowerCase().includes(t.toLowerCase())
44
41
  );
45
42
  return /* @__PURE__ */ i(d, { children: [
46
43
  /* @__PURE__ */ o(h, { asChild: !0, children: /* @__PURE__ */ o(c, { icon: a, variant: "outline", children: "Columns" }) }),
47
44
  /* @__PURE__ */ i(f, { className: "flex flex-col gap-4 divide-y-1", children: [
48
- /* @__PURE__ */ o("div", { className: " flex gap-1 justify-center items-center sticky top-0", children: /* @__PURE__ */ o(g, { value: t, onChange: (e) => s(e) }) }),
45
+ /* @__PURE__ */ o("div", { className: " flex gap-1 justify-center items-center sticky top-0", children: /* @__PURE__ */ o(g, { value: t, onChange: (e) => p(e) }) }),
49
46
  /* @__PURE__ */ i("div", { className: "flex items-center space-x-2", children: [
50
47
  /* @__PURE__ */ o(
51
48
  l,
@@ -55,7 +52,7 @@ function te({ table: r }) {
55
52
  onCheckedChange: () => r.toggleAllColumnsVisible()
56
53
  }
57
54
  ),
58
- /* @__PURE__ */ o(p, { className: "font-normal cursor-pointer", htmlFor: "selectAll", children: "Show All Columns" })
55
+ /* @__PURE__ */ o(s, { className: "font-normal cursor-pointer", htmlFor: "selectAll", children: "Show All Columns" })
59
56
  ] }),
60
57
  /* @__PURE__ */ i("div", { className: "flex flex-col gap-3 max-h-96 overflow-auto", children: [
61
58
  m.map((e) => /* @__PURE__ */ i("div", { className: "flex items-center space-x-2", children: [
@@ -67,7 +64,7 @@ function te({ table: r }) {
67
64
  onCheckedChange: (n) => e.toggleVisibility(!!n)
68
65
  }
69
66
  ),
70
- /* @__PURE__ */ o(p, { className: "font-normal cursor-pointer", htmlFor: e.id, children: C(e.id, "admin-portal") })
67
+ /* @__PURE__ */ o(s, { className: "font-normal cursor-pointer", htmlFor: e.id, children: C(e.id, "admin-portal") })
71
68
  ] }, e.id)),
72
69
  " ",
73
70
  m.length === 0 && /* @__PURE__ */ o("p", { className: "text-gray-500 text-sm italic", children: "No matching columns found." })
@@ -76,6 +73,6 @@ function te({ table: r }) {
76
73
  ] });
77
74
  }
78
75
  export {
79
- te as ColumnPicker
76
+ oe as ColumnPicker
80
77
  };
81
78
  //# sourceMappingURL=column-picker.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"column-picker.es.js","sources":["../../../lib/components/data-table/column-picker.tsx"],"sourcesContent":["import {\n Button,\n Checkbox,\n Label,\n Popover,\n PopoverContent,\n PopoverTrigger,\n SearchInput,\n} from '@/index';\nimport { Table } from '@tanstack/react-table';\nimport { Columns3 } from 'lucide-react';\nimport { useState } from 'react';\nimport { getResourceDisplayName } from './table-utils';\n\nexport function ColumnPicker<TData>({ table }: { table: Table<TData> }) {\n const [columnsSearch, setColumnsSearch] = useState('');\n\n const filteredColumns = table\n .getAllColumns()\n .filter(\n (column) =>\n column.getCanHide() && column.id.toLowerCase().includes(columnsSearch.toLowerCase()),\n );\n\n return (\n <Popover>\n <PopoverTrigger asChild>\n <Button icon={Columns3} variant=\"outline\">\n Columns\n </Button>\n </PopoverTrigger>\n <PopoverContent className=\"flex flex-col gap-4 divide-y-1\">\n <div className=\" flex gap-1 justify-center items-center sticky top-0\">\n <SearchInput value={columnsSearch} onChange={(e) => setColumnsSearch(e)} />\n </div>\n <div className=\"flex items-center space-x-2\">\n <Checkbox\n id=\"selectAll\"\n checked={table.getIsAllColumnsVisible()}\n onCheckedChange={() => table.toggleAllColumnsVisible()}\n />\n <Label className=\"font-normal cursor-pointer\" htmlFor={'selectAll'}>\n Show All Columns\n </Label>\n </div>\n {/* Filtered Columns */}\n <div className=\"flex flex-col gap-3 max-h-96 overflow-auto\">\n {filteredColumns.map((column) => (\n <div key={column.id} className=\"flex items-center space-x-2\">\n <Checkbox\n id={column.id}\n checked={column.getIsVisible()}\n onCheckedChange={(value) => column.toggleVisibility(!!value)}\n />\n <Label className=\"font-normal cursor-pointer\" htmlFor={column.id}>\n {getResourceDisplayName(column.id, 'admin-portal')}\n </Label>\n </div>\n ))}{' '}\n {/* No columns found */}\n {filteredColumns.length === 0 && (\n <p className=\"text-gray-500 text-sm italic\">No matching columns found.</p>\n )}\n </div>\n </PopoverContent>\n </Popover>\n );\n}\n"],"names":["ColumnPicker","table","columnsSearch","setColumnsSearch","useState","filteredColumns","column","Popover","jsx","PopoverTrigger","Button","Columns3","jsxs","PopoverContent","SearchInput","Checkbox","Label","value","getResourceDisplayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcgB,SAAAA,GAAoB,EAAE,OAAAC,KAAkC;AACtE,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAS,EAAE,GAE/CC,IAAkBJ,EACrB,cAAA,EACA;AAAA,IACC,CAACK,MACCA,EAAO,WAAA,KAAgBA,EAAO,GAAG,cAAc,SAASJ,EAAc,YAAa,CAAA;AAAA,EACvF;AAEF,2BACGK,GACC,EAAA,UAAA;AAAA,IAAC,gBAAAC,EAAAC,GAAA,EAAe,SAAO,IACrB,UAAC,gBAAAD,EAAAE,GAAA,EAAO,MAAMC,GAAU,SAAQ,WAAU,UAAA,UAE1C,CAAA,GACF;AAAA,IACA,gBAAAC,EAACC,GAAe,EAAA,WAAU,kCACxB,UAAA;AAAA,MAAA,gBAAAL,EAAC,OAAI,EAAA,WAAU,wDACb,UAAA,gBAAAA,EAACM,GAAY,EAAA,OAAOZ,GAAe,UAAU,CAAC,MAAMC,EAAiB,CAAC,EAAG,CAAA,GAC3E;AAAA,MACA,gBAAAS,EAAC,OAAI,EAAA,WAAU,+BACb,UAAA;AAAA,QAAA,gBAAAJ;AAAA,UAACO;AAAA,UAAA;AAAA,YACC,IAAG;AAAA,YACH,SAASd,EAAM,uBAAuB;AAAA,YACtC,iBAAiB,MAAMA,EAAM,wBAAwB;AAAA,UAAA;AAAA,QACvD;AAAA,0BACCe,GAAM,EAAA,WAAU,8BAA6B,SAAS,aAAa,UAEpE,mBAAA,CAAA;AAAA,MAAA,GACF;AAAA,MAEA,gBAAAJ,EAAC,OAAI,EAAA,WAAU,8CACZ,UAAA;AAAA,QAAAP,EAAgB,IAAI,CAACC,MACnB,gBAAAM,EAAA,OAAA,EAAoB,WAAU,+BAC7B,UAAA;AAAA,UAAA,gBAAAJ;AAAA,YAACO;AAAA,YAAA;AAAA,cACC,IAAIT,EAAO;AAAA,cACX,SAASA,EAAO,aAAa;AAAA,cAC7B,iBAAiB,CAACW,MAAUX,EAAO,iBAAiB,CAAC,CAACW,CAAK;AAAA,YAAA;AAAA,UAC7D;AAAA,UACA,gBAAAT,EAACQ,GAAM,EAAA,WAAU,8BAA6B,SAASV,EAAO,IAC3D,UAAuBY,EAAAZ,EAAO,IAAI,cAAc,EACnD,CAAA;AAAA,QAAA,KARQA,EAAO,EASjB,CACD;AAAA,QAAG;AAAA,QAEHD,EAAgB,WAAW,uBACzB,KAAE,EAAA,WAAU,gCAA+B,UAA0B,6BAAA,CAAA;AAAA,MAAA,EAE1E,CAAA;AAAA,IAAA,EACF,CAAA;AAAA,EAAA,GACF;AAEJ;"}
1
+ {"version":3,"file":"column-picker.es.js","sources":["../../../lib/components/data-table/column-picker.tsx"],"sourcesContent":["import {\n Button,\n Checkbox,\n Label,\n Popover,\n PopoverContent,\n PopoverTrigger,\n SearchInput,\n} from '@/index';\nimport { Table } from '@tanstack/react-table';\nimport { Columns3 } from 'lucide-react';\nimport { useState } from 'react';\nimport { getResourceDisplayName } from './table-utils';\n\nexport function ColumnPicker<TData>({ table }: { table: Table<TData> }) {\n const [columnsSearch, setColumnsSearch] = useState('');\n\n const filteredColumns = table\n .getAllColumns()\n .filter(\n (column) =>\n column.getCanHide() && column.id.toLowerCase().includes(columnsSearch.toLowerCase()),\n );\n\n return (\n <Popover>\n <PopoverTrigger asChild>\n <Button icon={Columns3} variant=\"outline\">\n Columns\n </Button>\n </PopoverTrigger>\n <PopoverContent className=\"flex flex-col gap-4 divide-y-1\">\n <div className=\" flex gap-1 justify-center items-center sticky top-0\">\n <SearchInput value={columnsSearch} onChange={(e) => setColumnsSearch(e)} />\n </div>\n <div className=\"flex items-center space-x-2\">\n <Checkbox\n id=\"selectAll\"\n checked={table.getIsAllColumnsVisible()}\n onCheckedChange={() => table.toggleAllColumnsVisible()}\n />\n <Label className=\"font-normal cursor-pointer\" htmlFor={'selectAll'}>\n Show All Columns\n </Label>\n </div>\n {/* Filtered Columns */}\n <div className=\"flex flex-col gap-3 max-h-96 overflow-auto\">\n {filteredColumns.map((column) => (\n <div key={column.id} className=\"flex items-center space-x-2\">\n <Checkbox\n id={column.id}\n checked={column.getIsVisible()}\n onCheckedChange={(value) => column.toggleVisibility(!!value)}\n />\n <Label className=\"font-normal cursor-pointer\" htmlFor={column.id}>\n {getResourceDisplayName(column.id, 'admin-portal')}\n </Label>\n </div>\n ))}{' '}\n {/* No columns found */}\n {filteredColumns.length === 0 && (\n <p className=\"text-gray-500 text-sm italic\">No matching columns found.</p>\n )}\n </div>\n </PopoverContent>\n </Popover>\n );\n}\n"],"names":["ColumnPicker","table","columnsSearch","setColumnsSearch","useState","filteredColumns","column","Popover","jsx","PopoverTrigger","Button","Columns3","jsxs","PopoverContent","SearchInput","Checkbox","Label","value","getResourceDisplayName"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAcgB,SAAAA,GAAoB,EAAE,OAAAC,KAAkC;AACtE,QAAM,CAACC,GAAeC,CAAgB,IAAIC,EAAS,EAAE,GAE/CC,IAAkBJ,EACrB,cAAA,EACA;AAAA,IACC,CAACK,MACCA,EAAO,WAAA,KAAgBA,EAAO,GAAG,cAAc,SAASJ,EAAc,YAAa,CAAA;AAAA,EACvF;AAEF,2BACGK,GACC,EAAA,UAAA;AAAA,IAAC,gBAAAC,EAAAC,GAAA,EAAe,SAAO,IACrB,UAAC,gBAAAD,EAAAE,GAAA,EAAO,MAAMC,GAAU,SAAQ,WAAU,UAAA,UAE1C,CAAA,GACF;AAAA,IACA,gBAAAC,EAACC,GAAe,EAAA,WAAU,kCACxB,UAAA;AAAA,MAAA,gBAAAL,EAAC,OAAI,EAAA,WAAU,wDACb,UAAA,gBAAAA,EAACM,GAAY,EAAA,OAAOZ,GAAe,UAAU,CAAC,MAAMC,EAAiB,CAAC,EAAG,CAAA,GAC3E;AAAA,MACA,gBAAAS,EAAC,OAAI,EAAA,WAAU,+BACb,UAAA;AAAA,QAAA,gBAAAJ;AAAA,UAACO;AAAA,UAAA;AAAA,YACC,IAAG;AAAA,YACH,SAASd,EAAM,uBAAuB;AAAA,YACtC,iBAAiB,MAAMA,EAAM,wBAAwB;AAAA,UAAA;AAAA,QACvD;AAAA,0BACCe,GAAM,EAAA,WAAU,8BAA6B,SAAS,aAAa,UAEpE,mBAAA,CAAA;AAAA,MAAA,GACF;AAAA,MAEA,gBAAAJ,EAAC,OAAI,EAAA,WAAU,8CACZ,UAAA;AAAA,QAAAP,EAAgB,IAAI,CAACC,MACnB,gBAAAM,EAAA,OAAA,EAAoB,WAAU,+BAC7B,UAAA;AAAA,UAAA,gBAAAJ;AAAA,YAACO;AAAA,YAAA;AAAA,cACC,IAAIT,EAAO;AAAA,cACX,SAASA,EAAO,aAAa;AAAA,cAC7B,iBAAiB,CAACW,MAAUX,EAAO,iBAAiB,CAAC,CAACW,CAAK;AAAA,YAAA;AAAA,UAC7D;AAAA,UACA,gBAAAT,EAACQ,GAAM,EAAA,WAAU,8BAA6B,SAASV,EAAO,IAC3D,UAAuBY,EAAAZ,EAAO,IAAI,cAAc,EACnD,CAAA;AAAA,QAAA,KARQA,EAAO,EASjB,CACD;AAAA,QAAG;AAAA,QAEHD,EAAgB,WAAW,uBACzB,KAAE,EAAA,WAAU,gCAA+B,UAA0B,6BAAA,CAAA;AAAA,MAAA,EAE1E,CAAA;AAAA,IAAA,EACF,CAAA;AAAA,EAAA,GACF;AAEJ;"}
@@ -1,3 +1,4 @@
1
+ "use client";
1
2
  import { jsx as i, jsxs as c } from "react/jsx-runtime";
2
3
  import "../ui/accordion.es.js";
3
4
  import "../ui/avatar.es.js";
@@ -34,16 +35,15 @@ import "../ui/table.es.js";
34
35
  import "../ui/tabs.es.js";
35
36
  import { TooltipProvider as L, Tooltip as U, TooltipTrigger as q, TooltipContent as H } from "../ui/tooltip.es.js";
36
37
  import { useQuery as G, keepPreviousData as W } from "@tanstack/react-query";
37
- import "cmdk";
38
- import { useDebounce as X } from "use-debounce";
39
- import { createColumnHelper as B, useReactTable as J, getCoreRowModel as Y } from "@tanstack/react-table";
38
+ import { createColumnHelper as X, useReactTable as B, getCoreRowModel as J } from "@tanstack/react-table";
39
+ import { useDebounce as Y } from "use-debounce";
40
40
  import { ColumnPicker as Z } from "./column-picker.es.js";
41
41
  import { PageSize as $ } from "./page-size.es.js";
42
42
  import { Paginator as Q } from "./paginator.es.js";
43
43
  import tt from "./table-actions.es.js";
44
- import { CHECK_BOX as ot, ID_COLUMN as et, DEFAULT_DATE_COLUMNS as it } from "./table-commons.es.js";
44
+ import { CHECK_BOX as et, ID_COLUMN as ot, DEFAULT_DATE_COLUMNS as it } from "./table-commons.es.js";
45
45
  import { TableContent as nt } from "./table-content.es.js";
46
- function Yt({
46
+ function Jt({
47
47
  columns: u,
48
48
  fetchFn: V,
49
49
  tableName: _,
@@ -65,28 +65,28 @@ function Yt({
65
65
  pagination: { pageIndex: 0, pageSize: 20 }
66
66
  // Pagination state
67
67
  }), n = (t) => {
68
- E((o) => ({ ...o, ...t }));
69
- }, { sorting: p, columnFilters: w, searching: S, columnVisibility: y, rowSelection: d, pagination: f } = j, [k] = X(S.trim(), 300);
68
+ E((e) => ({ ...e, ...t }));
69
+ }, { sorting: p, columnFilters: w, searching: S, columnVisibility: y, rowSelection: d, pagination: f } = j, [k] = Y(S.trim(), 300);
70
70
  I(() => {
71
71
  n({
72
72
  columnVisibility: { id: !1, updatedAt: !1, ...C }
73
73
  });
74
74
  }, [C]);
75
- const e = G({
75
+ const o = G({
76
76
  queryKey: [_, f, p, k],
77
77
  queryFn: () => V(f, p, S.trim(), {}),
78
78
  placeholderData: W
79
79
  // Keep previous data while loading new data
80
- }), z = B(), h = b(() => {
80
+ }), z = X(), h = b(() => {
81
81
  var m;
82
- const t = (m = e.data) == null ? void 0 : m.data;
82
+ const t = (m = o.data) == null ? void 0 : m.data;
83
83
  if (!(t != null && t.length)) return [];
84
- const o = /* @__PURE__ */ new Set();
84
+ const e = /* @__PURE__ */ new Set();
85
85
  return t.forEach((a) => {
86
86
  a.metadata && a.metadata.forEach((s) => {
87
- o.add(s.key);
87
+ e.add(s.key);
88
88
  });
89
- }), Array.from(o).map(
89
+ }), Array.from(e).map(
90
90
  (a) => z.accessor(
91
91
  (s) => {
92
92
  var M;
@@ -112,49 +112,49 @@ function Yt({
112
112
  }
113
113
  )
114
114
  );
115
- }, [(v = e.data) == null ? void 0 : v.data]), x = b(() => [
116
- ...g.selection ? ot : [],
117
- ...et,
118
- ...u.filter((o) => o.id !== "actions"),
115
+ }, [(v = o.data) == null ? void 0 : v.data]), x = b(() => [
116
+ ...g.selection ? et : [],
117
+ ...ot,
118
+ ...u.filter((e) => e.id !== "actions"),
119
119
  ...h.length ? h : [],
120
120
  ...it,
121
- ...u.filter((o) => o.id === "actions")
122
- ], [u, h, (T = e.data) == null ? void 0 : T.data, g.selection]), K = b(
121
+ ...u.filter((e) => e.id === "actions")
122
+ ], [u, h, (T = o.data) == null ? void 0 : T.data, g.selection]), K = b(
123
123
  () => Object.entries(d).map((t) => {
124
- var o, m;
125
- return (m = (o = e == null ? void 0 : e.data) == null ? void 0 : o.data) == null ? void 0 : m[t[0]];
124
+ var e, m;
125
+ return (m = (e = o == null ? void 0 : o.data) == null ? void 0 : e.data) == null ? void 0 : m[t[0]];
126
126
  }),
127
- [(F = e == null ? void 0 : e.data) == null ? void 0 : F.data, d]
128
- ), l = J({
129
- data: ((D = e.data) == null ? void 0 : D.data) ?? [],
127
+ [(F = o == null ? void 0 : o.data) == null ? void 0 : F.data, d]
128
+ ), l = B({
129
+ data: ((D = o.data) == null ? void 0 : D.data) ?? [],
130
130
  columns: x,
131
- getCoreRowModel: Y(),
132
- rowCount: (P = e.data) == null ? void 0 : P.total,
131
+ getCoreRowModel: J(),
132
+ rowCount: (P = o.data) == null ? void 0 : P.total,
133
133
  manualPagination: !0,
134
134
  // Handle pagination manually
135
135
  onPaginationChange: (t) => {
136
- const o = typeof t == "function" ? t(f) : t;
137
- n({ pagination: o });
136
+ const e = typeof t == "function" ? t(f) : t;
137
+ n({ pagination: e });
138
138
  },
139
139
  manualSorting: !0,
140
140
  // Handle sorting manually
141
141
  onSortingChange: (t) => {
142
- const o = typeof t == "function" ? t(p) : t;
143
- n({ sorting: o });
142
+ const e = typeof t == "function" ? t(p) : t;
143
+ n({ sorting: e });
144
144
  },
145
145
  manualFiltering: !0,
146
146
  // Handle filtering manually
147
147
  onGlobalFilterChange: (t) => {
148
- const o = typeof t == "function" ? t(w) : t;
149
- n({ columnFilters: o });
148
+ const e = typeof t == "function" ? t(w) : t;
149
+ n({ columnFilters: e });
150
150
  },
151
151
  onColumnVisibilityChange: (t) => {
152
- const o = typeof t == "function" ? t(y) : t;
153
- n({ columnVisibility: o });
152
+ const e = typeof t == "function" ? t(y) : t;
153
+ n({ columnVisibility: e });
154
154
  },
155
155
  onRowSelectionChange: (t) => {
156
- const o = typeof t == "function" ? t(d) : t;
157
- n({ rowSelection: o });
156
+ const e = typeof t == "function" ? t(d) : t;
157
+ n({ rowSelection: e });
158
158
  },
159
159
  state: {
160
160
  sorting: p,
@@ -164,14 +164,14 @@ function Yt({
164
164
  rowSelection: d
165
165
  },
166
166
  meta: {
167
- refetch: e.refetch
167
+ refetch: o.refetch
168
168
  }
169
169
  });
170
170
  return /* @__PURE__ */ c("div", { className: "flex flex-col w-full bg-card", children: [
171
171
  /* @__PURE__ */ i("div", { className: "border px-1", children: /* @__PURE__ */ i(
172
172
  tt,
173
173
  {
174
- dataQuery: e,
174
+ dataQuery: o,
175
175
  table: l,
176
176
  tableActions: g,
177
177
  stateToPass: {
@@ -181,17 +181,17 @@ function Yt({
181
181
  handleSearching: (t) => n({ searching: t })
182
182
  }
183
183
  ) }),
184
- /* @__PURE__ */ i("div", { className: "relative h-[60vh] z-10 overflow-x-auto border-x align-top justify-start", children: /* @__PURE__ */ i(nt, { table: l, isFetching: e.isFetching, columns: x }) }),
184
+ /* @__PURE__ */ i("div", { className: "relative h-[60vh] z-10 overflow-x-auto border-x align-top justify-start", children: /* @__PURE__ */ i(nt, { table: l, isFetching: o.isFetching, columns: x }) }),
185
185
  /* @__PURE__ */ c("div", { className: "flex overflow-auto flex-row w-full justify-between border gap-4 px-1 py-2", children: [
186
186
  /* @__PURE__ */ c("div", { className: "flex gap-2", children: [
187
187
  /* @__PURE__ */ i(Z, { table: l }),
188
188
  /* @__PURE__ */ i($, { table: l })
189
189
  ] }),
190
- /* @__PURE__ */ i(Q, { table: l, rowCount: ((N = e.data) == null ? void 0 : N.total) ?? 0 })
190
+ /* @__PURE__ */ i(Q, { table: l, rowCount: ((N = o.data) == null ? void 0 : N.total) ?? 0 })
191
191
  ] })
192
192
  ] });
193
193
  }
194
194
  export {
195
- Yt as DataTable
195
+ Jt as DataTable
196
196
  };
197
197
  //# sourceMappingURL=data-table.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"data-table.es.js","sources":["../../../lib/components/data-table/data-table.tsx"],"sourcesContent":["import { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/index';\nimport { keepPreviousData, useQuery } from '@tanstack/react-query';\nimport {\n ColumnDef,\n ColumnFiltersState,\n createColumnHelper,\n getCoreRowModel,\n PaginationState,\n SortingState,\n useReactTable,\n VisibilityState,\n} from '@tanstack/react-table';\nimport { Info } from 'lucide-react';\nimport { useEffect, useMemo, useState } from 'react';\nimport { useDebounce } from 'use-debounce';\nimport { ColumnPicker } from './column-picker';\nimport { PageSize } from './page-size';\nimport { Paginator } from './paginator';\nimport Actions from './table-actions';\nimport { CHECK_BOX, DEFAULT_DATE_COLUMNS, ID_COLUMN } from './table-commons';\nimport { TableContent } from './table-content';\nimport type { FilterableProperties, MetadataDto, TableActions, TableFetchFn } from './table-utils';\n\n// Props type for the DataTable component\nexport interface DataTableProps<TData, TValue = any> {\n columns: ColumnDef<TData, TValue>[]; // Columns for the table\n tableName: string; // Table name used as query key\n fetchFn: TableFetchFn<TData>; // Function for fetching data from the server\n tableActions: TableActions;\n filterableFields: FilterableProperties; // Fields that can be filtered\n columnsToHideByDefault: VisibilityState; // Columns that are hidden by default\n}\nexport function DataTable<TData extends Record<string, any>, TValue = any>({\n columns,\n fetchFn,\n tableName,\n tableActions,\n columnsToHideByDefault,\n}: DataTableProps<TData, TValue>) {\n // State for managing table data and filters\n //TODO: This is later to be stored in url as params\n const [tableState, setTableState] = useState({\n sorting: [] as SortingState, // Sorting state\n columnFilters: [] as ColumnFiltersState, // Filters for columns\n searching: '', // Search query state\n columnVisibility: {} as VisibilityState, // Visibility of columns\n rowSelection: {}, // Row selection state\n pagination: { pageIndex: 0, pageSize: 20 } as PaginationState, // Pagination state\n });\n\n // Update table state with new values\n const updateTableState = (updates: Partial<typeof tableState>) => {\n setTableState((prev) => ({ ...prev, ...updates }));\n };\n\n // Destructuring the table state for easier access\n const { sorting, columnFilters, searching, columnVisibility, rowSelection, pagination } =\n tableState;\n\n // Debounce the search query to avoid making a request on every keystroke\n const [debouncedQuery] = useDebounce(searching.trim(), 300);\n\n // Update column visibility when columnsToHideByDefault changes\n useEffect(() => {\n updateTableState({\n columnVisibility: { id: false, updatedAt: false, ...columnsToHideByDefault },\n });\n }, [columnsToHideByDefault]);\n\n // Fetch table data using the fetchFn and react-query's useQuery hook\n const dataQuery = useQuery({\n queryKey: [tableName, pagination, sorting, debouncedQuery],\n queryFn: () => fetchFn(pagination, sorting, searching.trim(), {}),\n placeholderData: keepPreviousData, // Keep previous data while loading new data\n });\n\n // Create column helpers for dynamic column generation\n const columnHelper = createColumnHelper<TData>();\n const metadataColumns = useMemo<ColumnDef<TData, TValue>[]>(() => {\n const data = dataQuery.data?.data;\n if (!data?.length) return [];\n // set of all the keys present in a given view\n const allMetadataKeys = new Set<string>();\n\n // Collect all unique metadata keys\n data.forEach((row: TData) => {\n if (row.metadata) {\n row.metadata.forEach((meta: MetadataDto) => {\n allMetadataKeys.add(meta.key);\n });\n }\n });\n\n // Generate columns for all unique metadata keys\n return Array.from(allMetadataKeys).map((key) =>\n columnHelper.accessor(\n (row: TData) => {\n // Find the metadata object with the matching key\n const metadataEntry = row.metadata?.find((meta: MetadataDto) => meta.key === key);\n return metadataEntry?.value; // Return the value for the specific key\n },\n {\n header: () => (\n <TooltipProvider delayDuration={0}>\n <Tooltip>\n <TooltipTrigger asChild>\n <span className=\"flex gap-1 items-center align-middle\">\n {key} <Info size={18} strokeWidth={'1px'} />\n </span>\n </TooltipTrigger>\n <TooltipContent>Metadata Key</TooltipContent>\n </Tooltip>\n </TooltipProvider>\n ), // Use the metadata key as the column header\n id: key,\n enableSorting: false,\n cell: (info) => {\n const value = info.getValue();\n // Handle null/undefined values\n if (value === null || value === undefined) return '';\n // For primitive types, return the string representation\n return String(value);\n },\n },\n ),\n );\n }, [dataQuery.data?.data]);\n\n /**\n * ID,createdAt and updatedAt will be added by default for all tables\n * If selection is allowed, checkbox will be added\n * If the dto has metadata, dynamics columns for all the metadata key-value will be added(particular for a view)\n * If there are actions for the table, they will be placed fixed at the right side of table.\n */\n const extendedColumns = useMemo<ColumnDef<any, any>[]>(() => {\n const _columns = [\n ...(tableActions.selection ? CHECK_BOX : []),\n ...ID_COLUMN,\n ...columns.filter((col) => col.id !== 'actions'),\n ...(metadataColumns.length ? metadataColumns : []),\n ...DEFAULT_DATE_COLUMNS,\n ...columns.filter((col) => col.id === 'actions'),\n ];\n\n return _columns;\n }, [columns, metadataColumns, dataQuery.data?.data, tableActions.selection]);\n\n // Get selected row data\n const rowSelectedData = useMemo(\n () => Object.entries(rowSelection).map((d: any) => dataQuery?.data?.data?.[d[0]]),\n [dataQuery?.data?.data, rowSelection],\n );\n\n // Use react-table's hook to create the table instance\n const table = useReactTable({\n data: dataQuery.data?.data ?? [],\n columns: extendedColumns,\n getCoreRowModel: getCoreRowModel(),\n rowCount: dataQuery.data?.total,\n manualPagination: true, // Handle pagination manually\n onPaginationChange: (updater) => {\n const newPagination = typeof updater === 'function' ? updater(pagination) : updater;\n updateTableState({ pagination: newPagination });\n },\n manualSorting: true, // Handle sorting manually\n onSortingChange: (updater) => {\n const newSorting = typeof updater === 'function' ? updater(sorting) : updater;\n updateTableState({ sorting: newSorting });\n },\n manualFiltering: true, // Handle filtering manually\n onGlobalFilterChange: (updater) => {\n const newFilters = typeof updater === 'function' ? updater(columnFilters) : updater;\n updateTableState({ columnFilters: newFilters });\n },\n onColumnVisibilityChange: (updater) => {\n const newVisibility = typeof updater === 'function' ? updater(columnVisibility) : updater;\n updateTableState({ columnVisibility: newVisibility });\n },\n onRowSelectionChange: (updater) => {\n const newSelection = typeof updater === 'function' ? updater(rowSelection) : updater;\n updateTableState({ rowSelection: newSelection });\n },\n state: {\n sorting,\n columnFilters,\n columnVisibility,\n pagination,\n rowSelection,\n },\n meta: {\n refetch: dataQuery.refetch,\n },\n });\n\n return (\n <div className=\"flex flex-col w-full bg-card\">\n {/* Table Actions Section */}\n <div className=\"border px-1\">\n <Actions\n dataQuery={dataQuery}\n table={table}\n tableActions={tableActions}\n stateToPass={{\n stateData: rowSelectedData,\n key: 'state',\n }}\n handleSearching={(value) => updateTableState({ searching: value })}\n />\n </div>\n\n {/* Table Content Section */}\n <div className=\"relative h-[60vh] z-10 overflow-x-auto border-x align-top justify-start\">\n <TableContent table={table} isFetching={dataQuery.isFetching} columns={extendedColumns} />\n </div>\n\n {/* Table Footer Section with Pagination and Column Picker */}\n <div className=\"flex overflow-auto flex-row w-full justify-between border gap-4 px-1 py-2\">\n <div className=\"flex gap-2\">\n <ColumnPicker table={table} />\n <PageSize table={table} />\n </div>\n <Paginator table={table} rowCount={dataQuery.data?.total ?? 0} />\n </div>\n </div>\n );\n}\n"],"names":["DataTable","columns","fetchFn","tableName","tableActions","columnsToHideByDefault","tableState","setTableState","useState","updateTableState","updates","prev","sorting","columnFilters","searching","columnVisibility","rowSelection","pagination","debouncedQuery","useDebounce","useEffect","dataQuery","useQuery","keepPreviousData","columnHelper","createColumnHelper","metadataColumns","useMemo","data","_a","allMetadataKeys","row","meta","key","metadataEntry","jsx","TooltipProvider","Tooltip","TooltipTrigger","jsxs","Info","TooltipContent","info","value","extendedColumns","CHECK_BOX","ID_COLUMN","col","DEFAULT_DATE_COLUMNS","_b","rowSelectedData","d","_c","table","useReactTable","_d","getCoreRowModel","_e","updater","newPagination","newSorting","newFilters","newVisibility","newSelection","Actions","TableContent","ColumnPicker","PageSize","Paginator","_f"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAgCO,SAASA,GAA2D;AAAA,EACzE,SAAAC;AAAA,EACA,SAAAC;AAAA,EACA,WAAAC;AAAA,EACA,cAAAC;AAAA,EACA,wBAAAC;AACF,GAAkC;;AAGhC,QAAM,CAACC,GAAYC,CAAa,IAAIC,EAAS;AAAA,IAC3C,SAAS,CAAC;AAAA;AAAA,IACV,eAAe,CAAC;AAAA;AAAA,IAChB,WAAW;AAAA;AAAA,IACX,kBAAkB,CAAC;AAAA;AAAA,IACnB,cAAc,CAAC;AAAA;AAAA,IACf,YAAY,EAAE,WAAW,GAAG,UAAU,GAAG;AAAA;AAAA,EAAA,CAC1C,GAGKC,IAAmB,CAACC,MAAwC;AAChE,IAAAH,EAAc,CAACI,OAAU,EAAE,GAAGA,GAAM,GAAGD,IAAU;AAAA,EACnD,GAGM,EAAE,SAAAE,GAAS,eAAAC,GAAe,WAAAC,GAAW,kBAAAC,GAAkB,cAAAC,GAAc,YAAAC,MACzEX,GAGI,CAACY,CAAc,IAAIC,EAAYL,EAAU,QAAQ,GAAG;AAG1D,EAAAM,EAAU,MAAM;AACG,IAAAX,EAAA;AAAA,MACf,kBAAkB,EAAE,IAAI,IAAO,WAAW,IAAO,GAAGJ,EAAuB;AAAA,IAAA,CAC5E;AAAA,EAAA,GACA,CAACA,CAAsB,CAAC;AAG3B,QAAMgB,IAAYC,EAAS;AAAA,IACzB,UAAU,CAACnB,GAAWc,GAAYL,GAASM,CAAc;AAAA,IACzD,SAAS,MAAMhB,EAAQe,GAAYL,GAASE,EAAU,KAAQ,GAAA,EAAE;AAAA,IAChE,iBAAiBS;AAAA;AAAA,EAAA,CAClB,GAGKC,IAAeC,EAA0B,GACzCC,IAAkBC,EAAoC,MAAM;;AAC1D,UAAAC,KAAOC,IAAAR,EAAU,SAAV,gBAAAQ,EAAgB;AAC7B,QAAI,EAACD,KAAA,QAAAA,EAAM,QAAQ,QAAO,CAAC;AAErB,UAAAE,wBAAsB,IAAY;AAGnC,WAAAF,EAAA,QAAQ,CAACG,MAAe;AAC3B,MAAIA,EAAI,YACFA,EAAA,SAAS,QAAQ,CAACC,MAAsB;AAC1B,QAAAF,EAAA,IAAIE,EAAK,GAAG;AAAA,MAAA,CAC7B;AAAA,IACH,CACD,GAGM,MAAM,KAAKF,CAAe,EAAE;AAAA,MAAI,CAACG,MACtCT,EAAa;AAAA,QACX,CAACO,MAAe;;AAER,gBAAAG,KAAgBL,IAAAE,EAAI,aAAJ,gBAAAF,EAAc,KAAK,CAACG,MAAsBA,EAAK,QAAQC;AAC7E,iBAAOC,KAAA,gBAAAA,EAAe;AAAA,QACxB;AAAA,QACA;AAAA,UACE,QAAQ,MACN,gBAAAC,EAACC,KAAgB,eAAe,GAC9B,4BAACC,GACC,EAAA,UAAA;AAAA,YAAA,gBAAAF,EAACG,KAAe,SAAO,IACrB,UAAC,gBAAAC,EAAA,QAAA,EAAK,WAAU,wCACb,UAAA;AAAA,cAAAN;AAAA,cAAI;AAAA,cAAE,gBAAAE,EAAAK,GAAA,EAAK,MAAM,IAAI,aAAa,MAAO,CAAA;AAAA,YAAA,EAAA,CAC5C,EACF,CAAA;AAAA,YACA,gBAAAL,EAACM,KAAe,UAAY,eAAA,CAAA;AAAA,UAAA,EAAA,CAC9B,EACF,CAAA;AAAA;AAAA,UAEF,IAAIR;AAAA,UACJ,eAAe;AAAA,UACf,MAAM,CAACS,MAAS;AACR,kBAAAC,IAAQD,EAAK,SAAS;AAE5B,mBAAIC,KAAU,OAAoC,KAE3C,OAAOA,CAAK;AAAA,UAAA;AAAA,QACrB;AAAA,MACF;AAAA,IAEJ;AAAA,EACC,GAAA,EAACd,IAAAR,EAAU,SAAV,gBAAAQ,EAAgB,IAAI,CAAC,GAQnBe,IAAkBjB,EAA+B,MACpC;AAAA,IACf,GAAIvB,EAAa,YAAYyC,KAAY,CAAC;AAAA,IAC1C,GAAGC;AAAA,IACH,GAAG7C,EAAQ,OAAO,CAAC8C,MAAQA,EAAI,OAAO,SAAS;AAAA,IAC/C,GAAIrB,EAAgB,SAASA,IAAkB,CAAC;AAAA,IAChD,GAAGsB;AAAA,IACH,GAAG/C,EAAQ,OAAO,CAAC8C,MAAQA,EAAI,OAAO,SAAS;AAAA,EACjD,GAGC,CAAC9C,GAASyB,IAAiBuB,IAAA5B,EAAU,SAAV,gBAAA4B,EAAgB,MAAM7C,EAAa,SAAS,CAAC,GAGrE8C,IAAkBvB;AAAA,IACtB,MAAM,OAAO,QAAQX,CAAY,EAAE,IAAI,CAACmC;;AAAW,cAAAF,KAAApB,IAAAR,KAAA,gBAAAA,EAAW,SAAX,gBAAAQ,EAAiB,SAAjB,gBAAAoB,EAAwBE,EAAE,CAAC;AAAA,KAAE;AAAA,IAChF,EAACC,IAAA/B,KAAA,gBAAAA,EAAW,SAAX,gBAAA+B,EAAiB,MAAMpC,CAAY;AAAA,EACtC,GAGMqC,IAAQC,EAAc;AAAA,IAC1B,QAAMC,IAAAlC,EAAU,SAAV,gBAAAkC,EAAgB,SAAQ,CAAC;AAAA,IAC/B,SAASX;AAAA,IACT,iBAAiBY,EAAgB;AAAA,IACjC,WAAUC,IAAApC,EAAU,SAAV,gBAAAoC,EAAgB;AAAA,IAC1B,kBAAkB;AAAA;AAAA,IAClB,oBAAoB,CAACC,MAAY;AAC/B,YAAMC,IAAgB,OAAOD,KAAY,aAAaA,EAAQzC,CAAU,IAAIyC;AAC3D,MAAAjD,EAAA,EAAE,YAAYkD,GAAe;AAAA,IAChD;AAAA,IACA,eAAe;AAAA;AAAA,IACf,iBAAiB,CAACD,MAAY;AAC5B,YAAME,IAAa,OAAOF,KAAY,aAAaA,EAAQ9C,CAAO,IAAI8C;AACrD,MAAAjD,EAAA,EAAE,SAASmD,GAAY;AAAA,IAC1C;AAAA,IACA,iBAAiB;AAAA;AAAA,IACjB,sBAAsB,CAACF,MAAY;AACjC,YAAMG,IAAa,OAAOH,KAAY,aAAaA,EAAQ7C,CAAa,IAAI6C;AAC3D,MAAAjD,EAAA,EAAE,eAAeoD,GAAY;AAAA,IAChD;AAAA,IACA,0BAA0B,CAACH,MAAY;AACrC,YAAMI,IAAgB,OAAOJ,KAAY,aAAaA,EAAQ3C,CAAgB,IAAI2C;AACjE,MAAAjD,EAAA,EAAE,kBAAkBqD,GAAe;AAAA,IACtD;AAAA,IACA,sBAAsB,CAACJ,MAAY;AACjC,YAAMK,IAAe,OAAOL,KAAY,aAAaA,EAAQ1C,CAAY,IAAI0C;AAC5D,MAAAjD,EAAA,EAAE,cAAcsD,GAAc;AAAA,IACjD;AAAA,IACA,OAAO;AAAA,MACL,SAAAnD;AAAA,MACA,eAAAC;AAAA,MACA,kBAAAE;AAAA,MACA,YAAAE;AAAA,MACA,cAAAD;AAAA,IACF;AAAA,IACA,MAAM;AAAA,MACJ,SAASK,EAAU;AAAA,IAAA;AAAA,EACrB,CACD;AAGC,SAAA,gBAAAkB,EAAC,OAAI,EAAA,WAAU,gCAEb,UAAA;AAAA,IAAC,gBAAAJ,EAAA,OAAA,EAAI,WAAU,eACb,UAAA,gBAAAA;AAAA,MAAC6B;AAAA,MAAA;AAAA,QACC,WAAA3C;AAAA,QACA,OAAAgC;AAAA,QACA,cAAAjD;AAAA,QACA,aAAa;AAAA,UACX,WAAW8C;AAAA,UACX,KAAK;AAAA,QACP;AAAA,QACA,iBAAiB,CAACP,MAAUlC,EAAiB,EAAE,WAAWkC,EAAO,CAAA;AAAA,MAAA;AAAA,IAAA,GAErE;AAAA,IAGC,gBAAAR,EAAA,OAAA,EAAI,WAAU,2EACb,UAAC,gBAAAA,EAAA8B,IAAA,EAAa,OAAAZ,GAAc,YAAYhC,EAAU,YAAY,SAASuB,EAAiB,CAAA,GAC1F;AAAA,IAGA,gBAAAL,EAAC,OAAI,EAAA,WAAU,8EACb,UAAA;AAAA,MAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,cACb,UAAA;AAAA,QAAA,gBAAAJ,EAAC+B,KAAa,OAAAb,GAAc;AAAA,QAC5B,gBAAAlB,EAACgC,KAAS,OAAAd,EAAc,CAAA;AAAA,MAAA,GAC1B;AAAA,wBACCe,GAAU,EAAA,OAAAf,GAAc,YAAUgB,IAAAhD,EAAU,SAAV,gBAAAgD,EAAgB,UAAS,EAAG,CAAA;AAAA,IAAA,EACjE,CAAA;AAAA,EAAA,GACF;AAEJ;"}
1
+ {"version":3,"file":"data-table.es.js","sources":["../../../lib/components/data-table/data-table.tsx"],"sourcesContent":["'use client';\nimport { Tooltip, TooltipContent, TooltipProvider, TooltipTrigger } from '@/index';\nimport { keepPreviousData, useQuery } from '@tanstack/react-query';\nimport {\n ColumnDef,\n ColumnFiltersState,\n createColumnHelper,\n getCoreRowModel,\n PaginationState,\n SortingState,\n useReactTable,\n VisibilityState,\n} from '@tanstack/react-table';\nimport { Info } from 'lucide-react';\nimport { useEffect, useMemo, useState } from 'react';\nimport { useDebounce } from 'use-debounce';\nimport { ColumnPicker } from './column-picker';\nimport { PageSize } from './page-size';\nimport { Paginator } from './paginator';\nimport Actions from './table-actions';\nimport { CHECK_BOX, DEFAULT_DATE_COLUMNS, ID_COLUMN } from './table-commons';\nimport { TableContent } from './table-content';\nimport type { FilterableProperties, MetadataDto, TableActions, TableFetchFn } from './table-utils';\n\n// Props type for the DataTable component\nexport interface DataTableProps<TData, TValue = any> {\n columns: ColumnDef<TData, TValue>[]; // Columns for the table\n tableName: string; // Table name used as query key\n fetchFn: TableFetchFn<TData>; // Function for fetching data from the server\n tableActions: TableActions;\n filterableFields: FilterableProperties; // Fields that can be filtered\n columnsToHideByDefault: VisibilityState; // Columns that are hidden by default\n}\nexport function DataTable<TData extends Record<string, any>, TValue = any>({\n columns,\n fetchFn,\n tableName,\n tableActions,\n columnsToHideByDefault,\n}: DataTableProps<TData, TValue>) {\n // State for managing table data and filters\n //TODO: This is later to be stored in url as params\n const [tableState, setTableState] = useState({\n sorting: [] as SortingState, // Sorting state\n columnFilters: [] as ColumnFiltersState, // Filters for columns\n searching: '', // Search query state\n columnVisibility: {} as VisibilityState, // Visibility of columns\n rowSelection: {}, // Row selection state\n pagination: { pageIndex: 0, pageSize: 20 } as PaginationState, // Pagination state\n });\n\n // Update table state with new values\n const updateTableState = (updates: Partial<typeof tableState>) => {\n setTableState((prev) => ({ ...prev, ...updates }));\n };\n\n // Destructuring the table state for easier access\n const { sorting, columnFilters, searching, columnVisibility, rowSelection, pagination } =\n tableState;\n\n // Debounce the search query to avoid making a request on every keystroke\n const [debouncedQuery] = useDebounce(searching.trim(), 300);\n\n // Update column visibility when columnsToHideByDefault changes\n useEffect(() => {\n updateTableState({\n columnVisibility: { id: false, updatedAt: false, ...columnsToHideByDefault },\n });\n }, [columnsToHideByDefault]);\n\n // Fetch table data using the fetchFn and react-query's useQuery hook\n const dataQuery = useQuery({\n queryKey: [tableName, pagination, sorting, debouncedQuery],\n queryFn: () => fetchFn(pagination, sorting, searching.trim(), {}),\n placeholderData: keepPreviousData, // Keep previous data while loading new data\n });\n\n // Create column helpers for dynamic column generation\n const columnHelper = createColumnHelper<TData>();\n const metadataColumns = useMemo<ColumnDef<TData, TValue>[]>(() => {\n const data = dataQuery.data?.data;\n if (!data?.length) return [];\n // set of all the keys present in a given view\n const allMetadataKeys = new Set<string>();\n\n // Collect all unique metadata keys\n data.forEach((row: TData) => {\n if (row.metadata) {\n row.metadata.forEach((meta: MetadataDto) => {\n allMetadataKeys.add(meta.key);\n });\n }\n });\n\n // Generate columns for all unique metadata keys\n return Array.from(allMetadataKeys).map((key) =>\n columnHelper.accessor(\n (row: TData) => {\n // Find the metadata object with the matching key\n const metadataEntry = row.metadata?.find((meta: MetadataDto) => meta.key === key);\n return metadataEntry?.value; // Return the value for the specific key\n },\n {\n header: () => (\n <TooltipProvider delayDuration={0}>\n <Tooltip>\n <TooltipTrigger asChild>\n <span className=\"flex gap-1 items-center align-middle\">\n {key} <Info size={18} strokeWidth={'1px'} />\n </span>\n </TooltipTrigger>\n <TooltipContent>Metadata Key</TooltipContent>\n </Tooltip>\n </TooltipProvider>\n ), // Use the metadata key as the column header\n id: key,\n enableSorting: false,\n cell: (info) => {\n const value = info.getValue();\n // Handle null/undefined values\n if (value === null || value === undefined) return '';\n // For primitive types, return the string representation\n return String(value);\n },\n },\n ),\n );\n }, [dataQuery.data?.data]);\n\n /**\n * ID,createdAt and updatedAt will be added by default for all tables\n * If selection is allowed, checkbox will be added\n * If the dto has metadata, dynamics columns for all the metadata key-value will be added(particular for a view)\n * If there are actions for the table, they will be placed fixed at the right side of table.\n */\n const extendedColumns = useMemo<ColumnDef<any, any>[]>(() => {\n const _columns = [\n ...(tableActions.selection ? CHECK_BOX : []),\n ...ID_COLUMN,\n ...columns.filter((col) => col.id !== 'actions'),\n ...(metadataColumns.length ? metadataColumns : []),\n ...DEFAULT_DATE_COLUMNS,\n ...columns.filter((col) => col.id === 'actions'),\n ];\n\n return _columns;\n }, [columns, metadataColumns, dataQuery.data?.data, tableActions.selection]);\n\n // Get selected row data\n const rowSelectedData = useMemo(\n () => Object.entries(rowSelection).map((d: any) => dataQuery?.data?.data?.[d[0]]),\n [dataQuery?.data?.data, rowSelection],\n );\n\n // Use react-table's hook to create the table instance\n const table = useReactTable({\n data: dataQuery.data?.data ?? [],\n columns: extendedColumns,\n getCoreRowModel: getCoreRowModel(),\n rowCount: dataQuery.data?.total,\n manualPagination: true, // Handle pagination manually\n onPaginationChange: (updater) => {\n const newPagination = typeof updater === 'function' ? updater(pagination) : updater;\n updateTableState({ pagination: newPagination });\n },\n manualSorting: true, // Handle sorting manually\n onSortingChange: (updater) => {\n const newSorting = typeof updater === 'function' ? updater(sorting) : updater;\n updateTableState({ sorting: newSorting });\n },\n manualFiltering: true, // Handle filtering manually\n onGlobalFilterChange: (updater) => {\n const newFilters = typeof updater === 'function' ? updater(columnFilters) : updater;\n updateTableState({ columnFilters: newFilters });\n },\n onColumnVisibilityChange: (updater) => {\n const newVisibility = typeof updater === 'function' ? updater(columnVisibility) : updater;\n updateTableState({ columnVisibility: newVisibility });\n },\n onRowSelectionChange: (updater) => {\n const newSelection = typeof updater === 'function' ? updater(rowSelection) : updater;\n updateTableState({ rowSelection: newSelection });\n },\n state: {\n sorting,\n columnFilters,\n columnVisibility,\n pagination,\n rowSelection,\n },\n meta: {\n refetch: dataQuery.refetch,\n },\n });\n\n return (\n <div className=\"flex flex-col w-full bg-card\">\n {/* Table Actions Section */}\n <div className=\"border px-1\">\n <Actions\n dataQuery={dataQuery}\n table={table}\n tableActions={tableActions}\n stateToPass={{\n stateData: rowSelectedData,\n key: 'state',\n }}\n handleSearching={(value) => updateTableState({ searching: value })}\n />\n </div>\n\n {/* Table Content Section */}\n <div className=\"relative h-[60vh] z-10 overflow-x-auto border-x align-top justify-start\">\n <TableContent table={table} isFetching={dataQuery.isFetching} columns={extendedColumns} />\n </div>\n\n {/* Table Footer Section with Pagination and Column Picker */}\n <div className=\"flex overflow-auto flex-row w-full justify-between border gap-4 px-1 py-2\">\n <div className=\"flex gap-2\">\n <ColumnPicker table={table} />\n <PageSize table={table} />\n </div>\n <Paginator table={table} rowCount={dataQuery.data?.total ?? 0} />\n </div>\n </div>\n );\n}\n"],"names":["DataTable","columns","fetchFn","tableName","tableActions","columnsToHideByDefault","tableState","setTableState","useState","updateTableState","updates","prev","sorting","columnFilters","searching","columnVisibility","rowSelection","pagination","debouncedQuery","useDebounce","useEffect","dataQuery","useQuery","keepPreviousData","columnHelper","createColumnHelper","metadataColumns","useMemo","data","_a","allMetadataKeys","row","meta","key","metadataEntry","jsx","TooltipProvider","Tooltip","TooltipTrigger","jsxs","Info","TooltipContent","info","value","extendedColumns","CHECK_BOX","ID_COLUMN","col","DEFAULT_DATE_COLUMNS","_b","rowSelectedData","d","_c","table","useReactTable","_d","getCoreRowModel","_e","updater","newPagination","newSorting","newFilters","newVisibility","newSelection","Actions","TableContent","ColumnPicker","PageSize","Paginator","_f"],"mappings":"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"}
@@ -1,6 +1,6 @@
1
- import { jsxs as p, jsx as i } from "react/jsx-runtime";
2
- import { useRouterState as f, Link as n } from "@tanstack/react-router";
3
- import { RotateCw as g, Plus as a, Pencil as u, Trash as w } from "lucide-react";
1
+ import { jsxs as p, jsx as r } from "react/jsx-runtime";
2
+ import { useRouterState as a, Link as n } from "@tanstack/react-router";
3
+ import { RotateCw as f, Plus as g, Pencil as u, Trash as w } from "lucide-react";
4
4
  import { Button as t } from "../ui/button.es.js";
5
5
  import "../ui/accordion.es.js";
6
6
  import "../ui/avatar.es.js";
@@ -34,40 +34,36 @@ import "sonner";
34
34
  import "../ui/table.es.js";
35
35
  import "../ui/tabs.es.js";
36
36
  import "../ui/tooltip.es.js";
37
- import "@tanstack/react-query";
38
- import "cmdk";
39
37
  import { useState as S } from "react";
40
- import "use-debounce";
41
- function pe({
38
+ function te({
42
39
  table: o,
43
40
  tableActions: e,
44
41
  stateToPass: c,
45
42
  handleSearching: l,
46
- dataQuery: r
43
+ dataQuery: i
47
44
  }) {
48
- const { location: { href: m } = {} } = f(), [h, s] = S("");
45
+ const { location: { href: m } = {} } = a(), [h, s] = S("");
49
46
  return /* @__PURE__ */ p("div", { className: "flex justify-between my-0 py-2 gap-4 overflow-auto", children: [
50
47
  /* @__PURE__ */ p("div", { className: "flex gap-2", children: [
51
- /* @__PURE__ */ i(
48
+ /* @__PURE__ */ r(
52
49
  t,
53
50
  {
54
- loading: r.isFetching,
55
- icon: g,
56
- onClick: () => r.refetch(),
51
+ loading: i.isFetching,
52
+ icon: f,
53
+ onClick: () => i.refetch(),
57
54
  variant: "outline"
58
55
  }
59
56
  ),
60
57
  e.create && o.getSelectedRowModel().rows.length === 0 && /* @__PURE__ */ p(n, { to: `${m}/new`, children: [
61
- /* @__PURE__ */ i(t, { disabled: r.isFetching, icon: a, children: "Create" }),
58
+ /* @__PURE__ */ r(t, { disabled: i.isFetching, icon: g, children: "Create" }),
62
59
  " "
63
60
  ] }),
64
- o.getSelectedRowModel().rows.length > 0 && e.update && /* @__PURE__ */ i(n, { to: `${m}/update`, state: c, children: /* @__PURE__ */ i(t, { disabled: r.isFetching, icon: u, children: "Update" }) }),
65
- o.getSelectedRowModel().rows.length > 0 && (e == null ? void 0 : e.delete) && /* @__PURE__ */ i(n, { to: `${m}/delete`, state: c, children: /* @__PURE__ */ i(t, { disabled: r.isFetching, icon: w, variant: "destructive", children: "Delete" }) })
61
+ o.getSelectedRowModel().rows.length > 0 && e.update && /* @__PURE__ */ r(n, { to: `${m}/update`, state: c, children: /* @__PURE__ */ r(t, { disabled: i.isFetching, icon: u, children: "Update" }) }),
62
+ o.getSelectedRowModel().rows.length > 0 && (e == null ? void 0 : e.delete) && /* @__PURE__ */ r(n, { to: `${m}/delete`, state: c, children: /* @__PURE__ */ r(t, { disabled: i.isFetching, icon: w, variant: "destructive", children: "Delete" }) })
66
63
  ] }),
67
- (e == null ? void 0 : e.search) && /* @__PURE__ */ i("div", { className: "relative flex gap-1 justify-center items-center", children: /* @__PURE__ */ i(
64
+ (e == null ? void 0 : e.search) && /* @__PURE__ */ r("div", { className: "relative flex gap-1 justify-center items-center", children: /* @__PURE__ */ r(
68
65
  v,
69
66
  {
70
- disabled: r.isFetching,
71
67
  value: h,
72
68
  onChange: (d) => {
73
69
  s(d), l(d);
@@ -77,6 +73,6 @@ function pe({
77
73
  ] });
78
74
  }
79
75
  export {
80
- pe as default
76
+ te as default
81
77
  };
82
78
  //# sourceMappingURL=table-actions.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"table-actions.es.js","sources":["../../../lib/components/data-table/table-actions.tsx"],"sourcesContent":["import { Link, useRouterState } from '@tanstack/react-router';\n\nimport { Pencil, Plus, RotateCw, Trash } from 'lucide-react';\n\nimport type { TableActions } from '@/components/data-table/table-utils/index';\nimport { Button } from '@/components/ui/button';\nimport { SearchInput } from '@/index';\nimport type { UseQueryResult } from '@tanstack/react-query';\nimport { Table } from '@tanstack/react-table';\nimport { useState } from 'react';\n\nexport default function Actions<TData>({\n table,\n tableActions,\n stateToPass,\n handleSearching,\n dataQuery,\n}: {\n table: Table<TData>;\n tableActions: TableActions;\n handleSearching: (value: string) => void;\n stateToPass: {\n key: string;\n stateData: any;\n };\n dataQuery: UseQueryResult<any, unknown>;\n}) {\n const { location: { href } = {} } = useRouterState();\n const [search, setSearch] = useState<string>('');\n return (\n <div className=\"flex justify-between my-0 py-2 gap-4 overflow-auto\">\n <div className=\"flex gap-2\">\n <Button\n loading={dataQuery.isFetching}\n icon={RotateCw}\n onClick={() => dataQuery.refetch()}\n variant={'outline'}\n />\n {/* //TODO: we can show the create, delete button based on permsission */}\n {/* All the creating routes will be with url /new to make it resuable */}\n {tableActions.create && table.getSelectedRowModel().rows.length === 0 && (\n <Link to={`${href}/new`}>\n <Button disabled={dataQuery.isFetching} icon={Plus}>\n Create\n </Button>{' '}\n </Link>\n )}\n {/* We can show ids in the url also, but then will make no sense if we are not fetching data if user has url with ids. if we add functionality of fetching selected items based on ids, then it will make sense */}\n {table.getSelectedRowModel().rows.length > 0 && tableActions.update && (\n <Link to={`${href}/update`} state={stateToPass}>\n <Button disabled={dataQuery.isFetching} icon={Pencil}>\n Update\n </Button>\n </Link>\n )}\n {table.getSelectedRowModel().rows.length > 0 && tableActions?.delete && (\n <Link to={`${href}/delete`} state={stateToPass}>\n <Button disabled={dataQuery.isFetching} icon={Trash} variant={'destructive'}>\n Delete\n </Button>\n </Link>\n )}\n </div>\n {tableActions?.search && (\n <div className=\"relative flex gap-1 justify-center items-center\">\n <SearchInput\n disabled={dataQuery.isFetching}\n value={search}\n onChange={(e) => {\n setSearch(e);\n handleSearching(e);\n }}\n />\n </div>\n )}\n </div>\n );\n}\n"],"names":["Actions","table","tableActions","stateToPass","handleSearching","dataQuery","href","useRouterState","search","setSearch","useState","jsxs","jsx","Button","RotateCw","Link","Plus","Pencil","Trash","SearchInput","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,SAAwBA,GAAe;AAAA,EACrC,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC;AACF,GASG;AACK,QAAA,EAAE,UAAU,EAAE,MAAAC,MAAS,CAAC,EAAA,IAAMC,EAAe,GAC7C,CAACC,GAAQC,CAAS,IAAIC,EAAiB,EAAE;AAE7C,SAAA,gBAAAC,EAAC,OAAI,EAAA,WAAU,uDACb,UAAA;AAAA,IAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,cACb,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAASR,EAAU;AAAA,UACnB,MAAMS;AAAA,UACN,SAAS,MAAMT,EAAU,QAAQ;AAAA,UACjC,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,MAGCH,EAAa,UAAUD,EAAM,oBAAA,EAAsB,KAAK,WAAW,KACjE,gBAAAU,EAAAI,GAAA,EAAK,IAAI,GAAGT,CAAI,QACf,UAAA;AAAA,QAAA,gBAAAM,EAACC,KAAO,UAAUR,EAAU,YAAY,MAAMW,GAAM,UAEpD,UAAA;AAAA,QAAU;AAAA,MAAA,GACZ;AAAA,MAGDf,EAAM,oBAAoB,EAAE,KAAK,SAAS,KAAKC,EAAa,UAC1D,gBAAAU,EAAAG,GAAA,EAAK,IAAI,GAAGT,CAAI,WAAW,OAAOH,GACjC,UAAA,gBAAAS,EAACC,GAAO,EAAA,UAAUR,EAAU,YAAY,MAAMY,GAAQ,UAAA,SAAA,CAEtD,EACF,CAAA;AAAA,MAEDhB,EAAM,oBAAoB,EAAE,KAAK,SAAS,MAAKC,KAAA,gBAAAA,EAAc,WAC5D,gBAAAU,EAACG,GAAK,EAAA,IAAI,GAAGT,CAAI,WAAW,OAAOH,GACjC,UAAC,gBAAAS,EAAAC,GAAA,EAAO,UAAUR,EAAU,YAAY,MAAMa,GAAO,SAAS,eAAe,UAAA,SAE7E,CAAA,EACF,CAAA;AAAA,IAAA,GAEJ;AAAA,KACChB,KAAA,gBAAAA,EAAc,WACZ,gBAAAU,EAAA,OAAA,EAAI,WAAU,mDACb,UAAA,gBAAAA;AAAA,MAACO;AAAA,MAAA;AAAA,QACC,UAAUd,EAAU;AAAA,QACpB,OAAOG;AAAA,QACP,UAAU,CAACY,MAAM;AACf,UAAAX,EAAUW,CAAC,GACXhB,EAAgBgB,CAAC;AAAA,QAAA;AAAA,MACnB;AAAA,IAAA,EAEJ,CAAA;AAAA,EAAA,GAEJ;AAEJ;"}
1
+ {"version":3,"file":"table-actions.es.js","sources":["../../../lib/components/data-table/table-actions.tsx"],"sourcesContent":["import { Link, useRouterState } from '@tanstack/react-router';\n\nimport { Pencil, Plus, RotateCw, Trash } from 'lucide-react';\n\nimport type { TableActions } from '@/components/data-table/table-utils/index';\nimport { Button } from '@/components/ui/button';\nimport { SearchInput } from '@/index';\nimport type { UseQueryResult } from '@tanstack/react-query';\nimport { Table } from '@tanstack/react-table';\nimport { useState } from 'react';\n\nexport default function Actions<TData>({\n table,\n tableActions,\n stateToPass,\n handleSearching,\n dataQuery,\n}: {\n table: Table<TData>;\n tableActions: TableActions;\n handleSearching: (value: string) => void;\n stateToPass: {\n key: string;\n stateData: any;\n };\n dataQuery: UseQueryResult<any, unknown>;\n}) {\n const { location: { href } = {} } = useRouterState();\n const [search, setSearch] = useState<string>('');\n return (\n <div className=\"flex justify-between my-0 py-2 gap-4 overflow-auto\">\n <div className=\"flex gap-2\">\n <Button\n loading={dataQuery.isFetching}\n icon={RotateCw}\n onClick={() => dataQuery.refetch()}\n variant={'outline'}\n />\n {/* //TODO: we can show the create, delete button based on permsission */}\n {/* All the creating routes will be with url /new to make it resuable */}\n {tableActions.create && table.getSelectedRowModel().rows.length === 0 && (\n <Link to={`${href}/new`}>\n <Button disabled={dataQuery.isFetching} icon={Plus}>\n Create\n </Button>{' '}\n </Link>\n )}\n {/* We can show ids in the url also, but then will make no sense if we are not fetching data if user has url with ids. if we add functionality of fetching selected items based on ids, then it will make sense */}\n {table.getSelectedRowModel().rows.length > 0 && tableActions.update && (\n <Link to={`${href}/update`} state={stateToPass}>\n <Button disabled={dataQuery.isFetching} icon={Pencil}>\n Update\n </Button>\n </Link>\n )}\n {table.getSelectedRowModel().rows.length > 0 && tableActions?.delete && (\n <Link to={`${href}/delete`} state={stateToPass}>\n <Button disabled={dataQuery.isFetching} icon={Trash} variant={'destructive'}>\n Delete\n </Button>\n </Link>\n )}\n </div>\n {tableActions?.search && (\n <div className=\"relative flex gap-1 justify-center items-center\">\n <SearchInput\n value={search}\n onChange={(e) => {\n setSearch(e);\n handleSearching(e);\n }}\n />\n </div>\n )}\n </div>\n );\n}\n"],"names":["Actions","table","tableActions","stateToPass","handleSearching","dataQuery","href","useRouterState","search","setSearch","useState","jsxs","jsx","Button","RotateCw","Link","Plus","Pencil","Trash","SearchInput","e"],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAWA,SAAwBA,GAAe;AAAA,EACrC,OAAAC;AAAA,EACA,cAAAC;AAAA,EACA,aAAAC;AAAA,EACA,iBAAAC;AAAA,EACA,WAAAC;AACF,GASG;AACK,QAAA,EAAE,UAAU,EAAE,MAAAC,MAAS,CAAC,EAAA,IAAMC,EAAe,GAC7C,CAACC,GAAQC,CAAS,IAAIC,EAAiB,EAAE;AAE7C,SAAA,gBAAAC,EAAC,OAAI,EAAA,WAAU,uDACb,UAAA;AAAA,IAAC,gBAAAA,EAAA,OAAA,EAAI,WAAU,cACb,UAAA;AAAA,MAAA,gBAAAC;AAAA,QAACC;AAAA,QAAA;AAAA,UACC,SAASR,EAAU;AAAA,UACnB,MAAMS;AAAA,UACN,SAAS,MAAMT,EAAU,QAAQ;AAAA,UACjC,SAAS;AAAA,QAAA;AAAA,MACX;AAAA,MAGCH,EAAa,UAAUD,EAAM,oBAAA,EAAsB,KAAK,WAAW,KACjE,gBAAAU,EAAAI,GAAA,EAAK,IAAI,GAAGT,CAAI,QACf,UAAA;AAAA,QAAA,gBAAAM,EAACC,KAAO,UAAUR,EAAU,YAAY,MAAMW,GAAM,UAEpD,UAAA;AAAA,QAAU;AAAA,MAAA,GACZ;AAAA,MAGDf,EAAM,oBAAoB,EAAE,KAAK,SAAS,KAAKC,EAAa,UAC1D,gBAAAU,EAAAG,GAAA,EAAK,IAAI,GAAGT,CAAI,WAAW,OAAOH,GACjC,UAAA,gBAAAS,EAACC,GAAO,EAAA,UAAUR,EAAU,YAAY,MAAMY,GAAQ,UAAA,SAAA,CAEtD,EACF,CAAA;AAAA,MAEDhB,EAAM,oBAAoB,EAAE,KAAK,SAAS,MAAKC,KAAA,gBAAAA,EAAc,WAC5D,gBAAAU,EAACG,GAAK,EAAA,IAAI,GAAGT,CAAI,WAAW,OAAOH,GACjC,UAAC,gBAAAS,EAAAC,GAAA,EAAO,UAAUR,EAAU,YAAY,MAAMa,GAAO,SAAS,eAAe,UAAA,SAE7E,CAAA,EACF,CAAA;AAAA,IAAA,GAEJ;AAAA,KACChB,KAAA,gBAAAA,EAAc,WACZ,gBAAAU,EAAA,OAAA,EAAI,WAAU,mDACb,UAAA,gBAAAA;AAAA,MAACO;AAAA,MAAA;AAAA,QACC,OAAOX;AAAA,QACP,UAAU,CAACY,MAAM;AACf,UAAAX,EAAUW,CAAC,GACXhB,EAAgBgB,CAAC;AAAA,QAAA;AAAA,MACnB;AAAA,IAAA,EAEJ,CAAA;AAAA,EAAA,GAEJ;AAEJ;"}
@@ -1,21 +1,19 @@
1
- import { jsx as a } from "react/jsx-runtime";
2
- import { Button as l } from "../ui/button.es.js";
3
- import { Checkbox as c } from "../ui/checkbox.es.js";
4
- import { createColumnHelper as n } from "@tanstack/react-table";
5
- import { MoreVertical as s } from "lucide-react";
6
- import { FormatDate as r } from "./table-utils/date.es.js";
7
- const o = n(), p = [
8
- o.accessor("checkbox", {
9
- header: ({ table: e }) => /* @__PURE__ */ a(
10
- c,
1
+ import { jsx as c } from "react/jsx-runtime";
2
+ import { Checkbox as l } from "../ui/checkbox.es.js";
3
+ import { createColumnHelper as r } from "@tanstack/react-table";
4
+ import { FormatDate as o } from "./table-utils/date.es.js";
5
+ const a = r(), i = [
6
+ a.accessor("checkbox", {
7
+ header: ({ table: e }) => /* @__PURE__ */ c(
8
+ l,
11
9
  {
12
10
  checked: e.getIsAllPageRowsSelected() || e.getIsSomePageRowsSelected() && "indeterminate",
13
11
  onCheckedChange: (t) => e.toggleAllPageRowsSelected(!!t),
14
12
  "aria-label": "Select all"
15
13
  }
16
14
  ),
17
- cell: ({ row: e }) => /* @__PURE__ */ a(
18
- c,
15
+ cell: ({ row: e }) => /* @__PURE__ */ c(
16
+ l,
19
17
  {
20
18
  checked: e.getIsSelected(),
21
19
  onCheckedChange: (t) => e.toggleSelected(!!t),
@@ -25,31 +23,30 @@ const o = n(), p = [
25
23
  enableSorting: !1,
26
24
  enableHiding: !1
27
25
  })
28
- ], S = [
29
- o.accessor("id", {
26
+ ], h = [
27
+ a.accessor("id", {
30
28
  header: () => "ID"
31
29
  })
32
- ], f = [
33
- o.accessor("createdAt", {
30
+ ], m = [
31
+ a.accessor("createdAt", {
34
32
  header: () => "Creation Date",
35
33
  cell: ({ row: e }) => {
36
34
  const t = e.getValue("createdAt");
37
- return r(t);
35
+ return o(t);
38
36
  },
39
37
  enableHiding: !1
40
38
  }),
41
- o.accessor("updatedAt", {
39
+ a.accessor("updatedAt", {
42
40
  header: () => "Last Updated",
43
41
  cell: ({ row: e }) => {
44
42
  const t = e.getValue("createdAt");
45
- return r(t);
43
+ return o(t);
46
44
  }
47
45
  })
48
- ], A = () => /* @__PURE__ */ a(l, { variant: "secondary", icon: s, size: "icon" });
46
+ ];
49
47
  export {
50
- A as ActionTriggerButton,
51
- p as CHECK_BOX,
52
- f as DEFAULT_DATE_COLUMNS,
53
- S as ID_COLUMN
48
+ i as CHECK_BOX,
49
+ m as DEFAULT_DATE_COLUMNS,
50
+ h as ID_COLUMN
54
51
  };
55
52
  //# sourceMappingURL=table-commons.es.js.map
@@ -1 +1 @@
1
- {"version":3,"file":"table-commons.es.js","sources":["../../../lib/components/data-table/table-commons.tsx"],"sourcesContent":["import { FormatDate } from '@/components/data-table/table-utils/index';\nimport { Button } from '@/components/ui/button';\nimport { Checkbox } from '@/components/ui/checkbox';\nimport { createColumnHelper } from '@tanstack/react-table';\nimport { MoreVertical } from 'lucide-react';\n\nconst cH = createColumnHelper<any>();\nexport const CHECK_BOX = [\n cH.accessor('checkbox', {\n header: ({ table }) => (\n <Checkbox\n checked={\n table.getIsAllPageRowsSelected() || (table.getIsSomePageRowsSelected() && 'indeterminate')\n }\n onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}\n aria-label=\"Select all\"\n />\n ),\n\n cell: ({ row }) => (\n <Checkbox\n checked={row.getIsSelected()}\n onCheckedChange={(value) => row.toggleSelected(!!value)}\n aria-label=\"Select row\"\n />\n ),\n enableSorting: false,\n enableHiding: false,\n }),\n];\n\nexport const ID_COLUMN = [\n cH.accessor('id', {\n header: () => 'ID',\n }),\n];\nexport const DEFAULT_DATE_COLUMNS = [\n cH.accessor('createdAt', {\n header: () => 'Creation Date',\n cell: ({ row }) => {\n const date = row.getValue('createdAt') satisfies string | null | undefined;\n return FormatDate(date);\n },\n enableHiding: false,\n }),\n cH.accessor('updatedAt', {\n header: () => 'Last Updated',\n cell: ({ row }) => {\n const date = row.getValue('createdAt') satisfies string | null | undefined;\n return FormatDate(date);\n },\n }),\n];\n\nexport const ActionTriggerButton = () => (\n <Button variant={'secondary'} icon={MoreVertical} size={'icon'} />\n);"],"names":["cH","createColumnHelper","CHECK_BOX","table","jsx","Checkbox","value","row","ID_COLUMN","DEFAULT_DATE_COLUMNS","date","FormatDate","ActionTriggerButton","Button","MoreVertical"],"mappings":";;;;;;AAMA,MAAMA,IAAKC,EAAwB,GACtBC,IAAY;AAAA,EACvBF,EAAG,SAAS,YAAY;AAAA,IACtB,QAAQ,CAAC,EAAE,OAAAG,EAAA,MACT,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SACEF,EAAM,yBAAA,KAA+BA,EAAM,0BAA+B,KAAA;AAAA,QAE5E,iBAAiB,CAACG,MAAUH,EAAM,0BAA0B,CAAC,CAACG,CAAK;AAAA,QACnE,cAAW;AAAA,MAAA;AAAA,IACb;AAAA,IAGF,MAAM,CAAC,EAAE,KAAAC,EAAA,MACP,gBAAAH;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAASE,EAAI,cAAc;AAAA,QAC3B,iBAAiB,CAACD,MAAUC,EAAI,eAAe,CAAC,CAACD,CAAK;AAAA,QACtD,cAAW;AAAA,MAAA;AAAA,IACb;AAAA,IAEF,eAAe;AAAA,IACf,cAAc;AAAA,EACf,CAAA;AACH,GAEaE,IAAY;AAAA,EACvBR,EAAG,SAAS,MAAM;AAAA,IAChB,QAAQ,MAAM;AAAA,EACf,CAAA;AACH,GACaS,IAAuB;AAAA,EAClCT,EAAG,SAAS,aAAa;AAAA,IACvB,QAAQ,MAAM;AAAA,IACd,MAAM,CAAC,EAAE,KAAAO,QAAU;AACX,YAAAG,IAAOH,EAAI,SAAS,WAAW;AACrC,aAAOI,EAAWD,CAAI;AAAA,IACxB;AAAA,IACA,cAAc;AAAA,EAAA,CACf;AAAA,EACDV,EAAG,SAAS,aAAa;AAAA,IACvB,QAAQ,MAAM;AAAA,IACd,MAAM,CAAC,EAAE,KAAAO,QAAU;AACX,YAAAG,IAAOH,EAAI,SAAS,WAAW;AACrC,aAAOI,EAAWD,CAAI;AAAA,IAAA;AAAA,EAEzB,CAAA;AACH,GAEaE,IAAsB,MAChC,gBAAAR,EAAAS,GAAA,EAAO,SAAS,aAAa,MAAMC,GAAc,MAAM,OAAQ,CAAA;"}
1
+ {"version":3,"file":"table-commons.es.js","sources":["../../../lib/components/data-table/table-commons.tsx"],"sourcesContent":["import { FormatDate } from '@/components/data-table/table-utils/index';\nimport { Checkbox } from '@/components/ui/checkbox';\nimport { createColumnHelper } from '@tanstack/react-table';\n\nconst cH = createColumnHelper<any>();\nexport const CHECK_BOX = [\n cH.accessor('checkbox', {\n header: ({ table }) => (\n <Checkbox\n checked={\n table.getIsAllPageRowsSelected() || (table.getIsSomePageRowsSelected() && 'indeterminate')\n }\n onCheckedChange={(value) => table.toggleAllPageRowsSelected(!!value)}\n aria-label=\"Select all\"\n />\n ),\n\n cell: ({ row }) => (\n <Checkbox\n checked={row.getIsSelected()}\n onCheckedChange={(value) => row.toggleSelected(!!value)}\n aria-label=\"Select row\"\n />\n ),\n enableSorting: false,\n enableHiding: false,\n }),\n];\n\nexport const ID_COLUMN = [\n cH.accessor('id', {\n header: () => 'ID',\n }),\n];\nexport const DEFAULT_DATE_COLUMNS = [\n cH.accessor('createdAt', {\n header: () => 'Creation Date',\n cell: ({ row }) => {\n const date = row.getValue('createdAt') satisfies string | null | undefined;\n return FormatDate(date);\n },\n enableHiding: false,\n }),\n cH.accessor('updatedAt', {\n header: () => 'Last Updated',\n cell: ({ row }) => {\n const date = row.getValue('createdAt') satisfies string | null | undefined;\n return FormatDate(date);\n },\n }),\n];\n"],"names":["cH","createColumnHelper","CHECK_BOX","table","jsx","Checkbox","value","row","ID_COLUMN","DEFAULT_DATE_COLUMNS","date","FormatDate"],"mappings":";;;;AAIA,MAAMA,IAAKC,EAAwB,GACtBC,IAAY;AAAA,EACvBF,EAAG,SAAS,YAAY;AAAA,IACtB,QAAQ,CAAC,EAAE,OAAAG,EAAA,MACT,gBAAAC;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SACEF,EAAM,yBAAA,KAA+BA,EAAM,0BAA+B,KAAA;AAAA,QAE5E,iBAAiB,CAACG,MAAUH,EAAM,0BAA0B,CAAC,CAACG,CAAK;AAAA,QACnE,cAAW;AAAA,MAAA;AAAA,IACb;AAAA,IAGF,MAAM,CAAC,EAAE,KAAAC,EAAA,MACP,gBAAAH;AAAA,MAACC;AAAA,MAAA;AAAA,QACC,SAASE,EAAI,cAAc;AAAA,QAC3B,iBAAiB,CAACD,MAAUC,EAAI,eAAe,CAAC,CAACD,CAAK;AAAA,QACtD,cAAW;AAAA,MAAA;AAAA,IACb;AAAA,IAEF,eAAe;AAAA,IACf,cAAc;AAAA,EACf,CAAA;AACH,GAEaE,IAAY;AAAA,EACvBR,EAAG,SAAS,MAAM;AAAA,IAChB,QAAQ,MAAM;AAAA,EACf,CAAA;AACH,GACaS,IAAuB;AAAA,EAClCT,EAAG,SAAS,aAAa;AAAA,IACvB,QAAQ,MAAM;AAAA,IACd,MAAM,CAAC,EAAE,KAAAO,QAAU;AACX,YAAAG,IAAOH,EAAI,SAAS,WAAW;AACrC,aAAOI,EAAWD,CAAI;AAAA,IACxB;AAAA,IACA,cAAc;AAAA,EAAA,CACf;AAAA,EACDV,EAAG,SAAS,aAAa;AAAA,IACvB,QAAQ,MAAM;AAAA,IACd,MAAM,CAAC,EAAE,KAAAO,QAAU;AACX,YAAAG,IAAOH,EAAI,SAAS,WAAW;AACrC,aAAOI,EAAWD,CAAI;AAAA,IAAA;AAAA,EAEzB,CAAA;AACH;"}
@@ -1,19 +1,18 @@
1
- import { merge as u } from "lodash";
2
- import { ctxClient as m } from "./fetch.es.js";
3
- function f(e, a) {
4
- return async (t, o, c, i) => {
5
- const r = {
1
+ import { merge as d } from "lodash-es";
2
+ function f(e, n, a) {
3
+ return async (t, o, u, s) => {
4
+ const c = {
6
5
  params: {
7
6
  query: {
8
7
  page: t.pageIndex + 1,
9
8
  limit: t.pageSize,
10
9
  sort: p(o[0]),
11
- query: c,
12
- ...i
10
+ query: u,
11
+ ...s
13
12
  }
14
13
  }
15
- }, s = u(r, a);
16
- return console.log(s), m.GET(e, r).then((n) => ({ total: parseInt(n.response.headers.get("Pagination-Count") || "0"), data: n.data }));
14
+ }, i = d(c, a);
15
+ return e.GET(n, i).then((r) => ({ total: parseInt(r.response.headers.get("Pagination-Count") || "0"), data: r.data }));
17
16
  };
18
17
  }
19
18
  function p(e) {
@@ -1 +1 @@
1
- {"version":3,"file":"createTableFetchFn.es.js","sources":["../../../../lib/components/data-table/table-utils/createTableFetchFn.ts"],"sourcesContent":["import { merge } from 'lodash';\nimport { ParamsOption } from 'openapi-fetch';\nimport { ctxClient } from './fetch';\nimport { type TableFetchFn } from './types';\ninterface Params {\n query: Record<string, string | number | boolean | Record<string, string | number | boolean>>;\n}\n\nexport function createTableFetchFn<_any, Return>(\n path: Parameters<typeof ctxClient.GET>[0],\n params: ParamsOption<any>,\n): TableFetchFn<Return> {\n return async (pagination, sorting, searching, filtering) => {\n // TODO merge with params\n const ab: { params: Params } = {\n params: {\n query: {\n page: pagination.pageIndex + 1,\n limit: pagination.pageSize,\n sort: generateSortParam(sorting[0]),\n query: searching,\n ...filtering,\n },\n },\n };\n // deep merge using lodash\n //TODO: Fix type error here when pathParams is used in the GET\n const pathParams = merge(ab, params);\n console.log(pathParams);\n return ctxClient.GET(path, ab).then((value) => {\n const rowCount = parseInt(value.response.headers.get('Pagination-Count') || '0');\n return { total: rowCount, data: value.data };\n });\n };\n}\n\nfunction generateSortParam(sort: { id: string; desc: boolean } | undefined): string {\n if (sort) {\n if (sort.desc) {\n return `-${sort.id}`;\n } else {\n return `+${sort.id}`;\n }\n } else {\n return '-createdAt';\n }\n}\n"],"names":["createTableFetchFn","path","params","pagination","sorting","searching","filtering","ab","generateSortParam","pathParams","merge","ctxClient","value","sort"],"mappings":";;AAQgB,SAAAA,EACdC,GACAC,GACsB;AACtB,SAAO,OAAOC,GAAYC,GAASC,GAAWC,MAAc;AAE1D,UAAMC,IAAyB;AAAA,MAC7B,QAAQ;AAAA,QACN,OAAO;AAAA,UACL,MAAMJ,EAAW,YAAY;AAAA,UAC7B,OAAOA,EAAW;AAAA,UAClB,MAAMK,EAAkBJ,EAAQ,CAAC,CAAC;AAAA,UAClC,OAAOC;AAAA,UACP,GAAGC;AAAA,QAAA;AAAA,MACL;AAAA,IAEJ,GAGMG,IAAaC,EAAMH,GAAIL,CAAM;AACnC,mBAAQ,IAAIO,CAAU,GACfE,EAAU,IAAIV,GAAMM,CAAE,EAAE,KAAK,CAACK,OAE5B,EAAE,OADQ,SAASA,EAAM,SAAS,QAAQ,IAAI,kBAAkB,KAAK,GAAG,GACrD,MAAMA,EAAM,KAAK,EAC5C;AAAA,EACH;AACF;AAEA,SAASJ,EAAkBK,GAAyD;AAClF,SAAIA,IACEA,EAAK,OACA,IAAIA,EAAK,EAAE,KAEX,IAAIA,EAAK,EAAE,KAGb;AAEX;"}
1
+ {"version":3,"file":"createTableFetchFn.es.js","sources":["../../../../lib/components/data-table/table-utils/createTableFetchFn.ts"],"sourcesContent":["import type { paths } from '@cryptlex/web-api-types';\nimport { merge } from 'lodash-es';\nimport createClient, { ParamsOption } from 'openapi-fetch';\nimport { type TableFetchFn } from './types';\n\ninterface Params {\n query: Record<string, string | number | boolean | Record<string, string | number | boolean>>;\n}\n\ntype Client = ReturnType<typeof createClient<paths>>;\n\n// Helper type to extract valid GET paths\ntype GetPaths = {\n [P in keyof paths]: paths[P] extends { get: any } ? P : never;\n}[keyof paths];\n\nexport function createTableFetchFn<_any, Return>(\n ctxclient: Client,\n path: GetPaths,\n // TODO: Use generic type instead\n params?: ParamsOption<any>,\n): TableFetchFn<Return> {\n return async (pagination, sorting, searching, filtering) => {\n const ab: { params: Params } = {\n params: {\n query: {\n page: pagination.pageIndex + 1,\n limit: pagination.pageSize,\n sort: generateSortParam(sorting[0]),\n query: searching,\n ...filtering,\n },\n },\n };\n\n const pathParams = merge(ab, params) as { params: Params };\n\n return ctxclient.GET(path, pathParams).then((value) => {\n const rowCount = parseInt(value.response.headers.get('Pagination-Count') || '0');\n return { total: rowCount, data: value.data };\n });\n };\n}\n\nfunction generateSortParam(sort: { id: string; desc: boolean } | undefined): string {\n if (sort) {\n if (sort.desc) {\n return `-${sort.id}`;\n } else {\n return `+${sort.id}`;\n }\n } else {\n return '-createdAt';\n }\n}\n"],"names":["createTableFetchFn","ctxclient","path","params","pagination","sorting","searching","filtering","ab","generateSortParam","pathParams","merge","value","sort"],"mappings":";AAgBgB,SAAAA,EACdC,GACAC,GAEAC,GACsB;AACtB,SAAO,OAAOC,GAAYC,GAASC,GAAWC,MAAc;AAC1D,UAAMC,IAAyB;AAAA,MAC7B,QAAQ;AAAA,QACN,OAAO;AAAA,UACL,MAAMJ,EAAW,YAAY;AAAA,UAC7B,OAAOA,EAAW;AAAA,UAClB,MAAMK,EAAkBJ,EAAQ,CAAC,CAAC;AAAA,UAClC,OAAOC;AAAA,UACP,GAAGC;AAAA,QAAA;AAAA,MACL;AAAA,IAEJ,GAEMG,IAAaC,EAAMH,GAAIL,CAAM;AAEnC,WAAOF,EAAU,IAAIC,GAAMQ,CAAU,EAAE,KAAK,CAACE,OAEpC,EAAE,OADQ,SAASA,EAAM,SAAS,QAAQ,IAAI,kBAAkB,KAAK,GAAG,GACrD,MAAMA,EAAM,KAAK,EAC5C;AAAA,EACH;AACF;AAEA,SAASH,EAAkBI,GAAyD;AAClF,SAAIA,IACEA,EAAK,OACA,IAAIA,EAAK,EAAE,KAEX,IAAIA,EAAK,EAAE,KAGb;AAEX;"}
@@ -1 +1 @@
1
- {"version":3,"file":"types.es.js","sources":["../../../../lib/components/data-table/table-utils/types.ts"],"sourcesContent":["import { components } from '@cryptlex/web-api-types';\nimport { PaginationState, SortingState } from '@tanstack/react-table';\n// export type RoutePath = RoutePaths<typeof routeTree>;\nexport type fieldsToDisplay = {\n display: string;\n accessor: string;\n};\n[];\nexport enum DYNAMIC_INPUT_TARGET {\n USER,\n ORGANIZATION,\n RESELLER,\n}\nexport type VisibilityState<T> = {\n [K in keyof T]?: boolean;\n};\nexport type TableActions = {\n /** True if reading this resource is allowed. */\n read: boolean;\n\n /** True if creation of resource from dashboard is allowed. */\n create: boolean;\n\n /** True if the resource can be updated */\n update: boolean;\n\n /** True if the resource can be deleted */\n delete: boolean;\n\n /** True if the resource can be exported */\n export: boolean;\n\n /** True if the resource can be linked to tags. */\n tag: boolean;\n\n /** True if searching is supported. Search is defined by the `query` QueryParameter in the Web API */\n search: boolean;\n\n /** True if selection using checkboxes is allowed */\n selection: boolean;\n\n /** True if the resource has support for segments */\n segments: boolean;\n};\n\nexport type JwtDecode = {\n aud: string;\n email: string;\n exp: number;\n iat: number;\n jti: string;\n region: string;\n role: string;\n role_type: string;\n scope: string[];\n sub: string;\n teat: number;\n tenantid: string;\n token_usage: string;\n sadmin?: string;\n};\n\nexport type Portals = 'customer-portal' | 'system-portal' | 'reseller-portal' | 'admin-portal';\nexport type MetadataDto = components['schemas']['MetadataDto'];\n\nexport type TableFetchFn<TData> = (\n p: PaginationState,\n s: SortingState,\n q: string,\n f: any,\n) => Promise<{\n total: number;\n data: TData[] | undefined;\n}>;\n/*** Type for hide some of the columns based on the dto of the particular page\n ** `id`, `updatedAt` are by default hidden\n */\nexport type DefaultVisibilityState<T> = {\n [K in keyof T]?: boolean;\n};\n"],"names":["DYNAMIC_INPUT_TARGET","DYNAMIC_INPUT_TARGET2"],"mappings":"AAQY,IAAAA,sBAAAA,OACVA,EAAAC,EAAA,OAAA,CAAA,IAAA,QACAD,EAAAC,EAAA,eAAA,CAAA,IAAA,gBACAD,EAAAC,EAAA,WAAA,CAAA,IAAA,YAHUD,IAAAA,KAAA,CAAA,CAAA;"}
1
+ {"version":3,"file":"types.es.js","sources":["../../../../lib/components/data-table/table-utils/types.ts"],"sourcesContent":["import { components } from '@cryptlex/web-api-types';\nimport { PaginationState, SortingState } from '@tanstack/react-table';\n// export type RoutePath = RoutePaths<typeof routeTree>;\nexport type fieldsToDisplay = {\n display: string;\n accessor: string;\n};\n[];\nexport enum DYNAMIC_INPUT_TARGET {\n USER,\n ORGANIZATION,\n RESELLER,\n}\nexport type VisibilityState<T> = {\n [K in keyof T]?: boolean;\n};\nexport type TableActions = {\n /** True if reading this resource is allowed. */\n read: boolean;\n\n /** True if creation of resource from dashboard is allowed. */\n create: boolean;\n\n /** True if the resource can be updated */\n update: boolean;\n\n /** True if the resource can be deleted */\n delete: boolean;\n\n /** True if the resource can be exported */\n export: boolean;\n\n /** True if the resource can be linked to tags. */\n tag: boolean;\n\n /** True if searching is supported. Search is defined by the `query` QueryParameter in the Web API */\n search: boolean;\n\n /** True if selection using checkboxes is allowed */\n selection: boolean;\n\n /** True if the resource has support for segments */\n segments: boolean;\n};\n\nexport type MetadataDto = components['schemas']['MetadataDto'];\n\nexport type TableFetchFn<TData> = (\n p: PaginationState,\n s: SortingState,\n q: string,\n f: any,\n) => Promise<{\n total: number;\n data: TData[] | undefined;\n}>;\n/*** Type for hide some of the columns based on the dto of the particular page\n ** `id`, `updatedAt` are by default hidden\n */\nexport type DefaultVisibilityState<T> = {\n [K in keyof T]?: boolean;\n};\n"],"names":["DYNAMIC_INPUT_TARGET","DYNAMIC_INPUT_TARGET2"],"mappings":"AAQY,IAAAA,sBAAAA,OACVA,EAAAC,EAAA,OAAA,CAAA,IAAA,QACAD,EAAAC,EAAA,eAAA,CAAA,IAAA,gBACAD,EAAAC,EAAA,WAAA,CAAA,IAAA,YAHUD,IAAAA,KAAA,CAAA,CAAA;"}