@coveord/plasma-mantine 52.9.0 → 52.10.1

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 (112) hide show
  1. package/.turbo/turbo-build.log +3 -3
  2. package/.turbo/turbo-test.log +33 -32
  3. package/dist/.tsbuildinfo +1 -1
  4. package/dist/cjs/components/code-editor/CodeEditor.d.ts.map +1 -1
  5. package/dist/cjs/components/code-editor/CodeEditor.js +8 -3
  6. package/dist/cjs/components/code-editor/CodeEditor.js.map +1 -1
  7. package/dist/cjs/components/collection/Collection.js +5 -3
  8. package/dist/cjs/components/collection/Collection.js.map +1 -1
  9. package/dist/cjs/components/date-range-picker/DateRangePickerPresetSelect.d.ts.map +1 -1
  10. package/dist/cjs/components/date-range-picker/DateRangePickerPresetSelect.js +2 -1
  11. package/dist/cjs/components/date-range-picker/DateRangePickerPresetSelect.js.map +1 -1
  12. package/dist/cjs/components/date-range-picker/EditableDateRangePicker.js +2 -2
  13. package/dist/cjs/components/date-range-picker/EditableDateRangePicker.js.map +1 -1
  14. package/dist/cjs/components/modal-wizard/ModalWizard.js +2 -2
  15. package/dist/cjs/components/modal-wizard/ModalWizard.js.map +1 -1
  16. package/dist/cjs/components/table/Table.d.ts.map +1 -1
  17. package/dist/cjs/components/table/Table.js +25 -13
  18. package/dist/cjs/components/table/Table.js.map +1 -1
  19. package/dist/cjs/components/table/Table.styles.d.ts.map +1 -1
  20. package/dist/cjs/components/table/Table.styles.js +1 -10
  21. package/dist/cjs/components/table/Table.styles.js.map +1 -1
  22. package/dist/cjs/components/table/Table.types.d.ts +14 -3
  23. package/dist/cjs/components/table/Table.types.d.ts.map +1 -1
  24. package/dist/cjs/components/table/TableFooter.js +2 -2
  25. package/dist/cjs/components/table/TableFooter.js.map +1 -1
  26. package/dist/cjs/components/table/TableHeader.js +1 -1
  27. package/dist/cjs/components/table/TableHeader.js.map +1 -1
  28. package/dist/cjs/components/table/TableLastUpdated.d.ts +24 -0
  29. package/dist/cjs/components/table/TableLastUpdated.d.ts.map +1 -0
  30. package/dist/cjs/components/table/TableLastUpdated.js +73 -0
  31. package/dist/cjs/components/table/TableLastUpdated.js.map +1 -0
  32. package/dist/cjs/components/table/TablePagination.d.ts.map +1 -1
  33. package/dist/cjs/components/table/TablePagination.js +1 -0
  34. package/dist/cjs/components/table/TablePagination.js.map +1 -1
  35. package/dist/cjs/components/table/TablePerPage.js +5 -3
  36. package/dist/cjs/components/table/TablePerPage.js.map +1 -1
  37. package/dist/cjs/components/table/layouts/RowLayout.d.ts.map +1 -1
  38. package/dist/cjs/components/table/layouts/RowLayout.js +41 -9
  39. package/dist/cjs/components/table/layouts/RowLayout.js.map +1 -1
  40. package/dist/cjs/components/table/useRowSelection.d.ts +2 -2
  41. package/dist/cjs/components/table/useRowSelection.d.ts.map +1 -1
  42. package/dist/cjs/components/table/useRowSelection.js +8 -3
  43. package/dist/cjs/components/table/useRowSelection.js.map +1 -1
  44. package/dist/cjs/theme/Theme.js +1 -1
  45. package/dist/cjs/theme/Theme.js.map +1 -1
  46. package/dist/esm/components/code-editor/CodeEditor.d.ts.map +1 -1
  47. package/dist/esm/components/code-editor/CodeEditor.js +8 -3
  48. package/dist/esm/components/code-editor/CodeEditor.js.map +1 -1
  49. package/dist/esm/components/collection/Collection.js +5 -3
  50. package/dist/esm/components/collection/Collection.js.map +1 -1
  51. package/dist/esm/components/date-range-picker/DateRangePickerPresetSelect.d.ts.map +1 -1
  52. package/dist/esm/components/date-range-picker/DateRangePickerPresetSelect.js +2 -1
  53. package/dist/esm/components/date-range-picker/DateRangePickerPresetSelect.js.map +1 -1
  54. package/dist/esm/components/date-range-picker/EditableDateRangePicker.js +2 -2
  55. package/dist/esm/components/date-range-picker/EditableDateRangePicker.js.map +1 -1
  56. package/dist/esm/components/modal-wizard/ModalWizard.js +2 -2
  57. package/dist/esm/components/modal-wizard/ModalWizard.js.map +1 -1
  58. package/dist/esm/components/table/Table.d.ts.map +1 -1
  59. package/dist/esm/components/table/Table.js +27 -15
  60. package/dist/esm/components/table/Table.js.map +1 -1
  61. package/dist/esm/components/table/Table.styles.d.ts.map +1 -1
  62. package/dist/esm/components/table/Table.styles.js +1 -10
  63. package/dist/esm/components/table/Table.styles.js.map +1 -1
  64. package/dist/esm/components/table/Table.types.d.ts +14 -3
  65. package/dist/esm/components/table/Table.types.d.ts.map +1 -1
  66. package/dist/esm/components/table/Table.types.js.map +1 -1
  67. package/dist/esm/components/table/TableFooter.js +2 -2
  68. package/dist/esm/components/table/TableFooter.js.map +1 -1
  69. package/dist/esm/components/table/TableHeader.js +1 -1
  70. package/dist/esm/components/table/TableHeader.js.map +1 -1
  71. package/dist/esm/components/table/TableLastUpdated.d.ts +24 -0
  72. package/dist/esm/components/table/TableLastUpdated.d.ts.map +1 -0
  73. package/dist/esm/components/table/TableLastUpdated.js +62 -0
  74. package/dist/esm/components/table/TableLastUpdated.js.map +1 -0
  75. package/dist/esm/components/table/TablePagination.d.ts.map +1 -1
  76. package/dist/esm/components/table/TablePagination.js +1 -0
  77. package/dist/esm/components/table/TablePagination.js.map +1 -1
  78. package/dist/esm/components/table/TablePerPage.js +5 -3
  79. package/dist/esm/components/table/TablePerPage.js.map +1 -1
  80. package/dist/esm/components/table/layouts/RowLayout.d.ts.map +1 -1
  81. package/dist/esm/components/table/layouts/RowLayout.js +42 -10
  82. package/dist/esm/components/table/layouts/RowLayout.js.map +1 -1
  83. package/dist/esm/components/table/useRowSelection.d.ts +2 -2
  84. package/dist/esm/components/table/useRowSelection.d.ts.map +1 -1
  85. package/dist/esm/components/table/useRowSelection.js +8 -3
  86. package/dist/esm/components/table/useRowSelection.js.map +1 -1
  87. package/dist/esm/theme/Theme.js +1 -1
  88. package/dist/esm/theme/Theme.js.map +1 -1
  89. package/package.json +17 -17
  90. package/src/__tests__/VitestSetup.ts +12 -0
  91. package/src/components/code-editor/CodeEditor.tsx +5 -3
  92. package/src/components/code-editor/__tests__/CodeEditor.spec.tsx +1 -0
  93. package/src/components/date-range-picker/DateRangePickerPresetSelect.tsx +1 -0
  94. package/src/components/date-range-picker/__tests__/DateRangePickerInlineCalendar.spec.tsx +2 -0
  95. package/src/components/date-range-picker/__tests__/DateRangePickerPopoverCalendar.spec.tsx +4 -19
  96. package/src/components/date-range-picker/__tests__/EditableDateRangePicker.spec.tsx +3 -3
  97. package/src/components/modal-wizard/__tests__/ModalWizard.spec.tsx +19 -4
  98. package/src/components/table/Table.styles.ts +0 -9
  99. package/src/components/table/Table.tsx +22 -13
  100. package/src/components/table/Table.types.ts +14 -3
  101. package/src/components/table/TableFooter.tsx +1 -1
  102. package/src/components/table/TableHeader.tsx +1 -1
  103. package/src/components/table/TableLastUpdated.tsx +51 -0
  104. package/src/components/table/TablePagination.tsx +1 -0
  105. package/src/components/table/TablePerPage.tsx +3 -3
  106. package/src/components/table/__tests__/Table.spec.tsx +44 -5
  107. package/src/components/table/__tests__/TableActions.spec.tsx +4 -3
  108. package/src/components/table/__tests__/TableDateRangePicker.spec.tsx +26 -59
  109. package/src/components/table/__tests__/TableLastUpdated.spec.tsx +97 -0
  110. package/src/components/table/__tests__/TablePredicate.spec.tsx +7 -55
  111. package/src/components/table/layouts/RowLayout.tsx +45 -11
  112. package/src/components/table/useRowSelection.ts +13 -6
@@ -20,16 +20,7 @@ var _core = require("@mantine/core");
20
20
  var useStyles = (0, _core.createStyles)(function(theme) {
21
21
  return {
22
22
  table: {
23
- width: "100%",
24
- "& thead tr th": {
25
- borderBottom: "none"
26
- },
27
- "& td:first-of-type": {
28
- paddingLeft: theme.spacing.xl
29
- },
30
- "& tbody td": {
31
- verticalAlign: "top"
32
- }
23
+ width: "100%"
33
24
  },
34
25
  header: {
35
26
  position: "sticky",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/table/Table.styles.ts"],"sourcesContent":["import {createStyles} from '@mantine/core';\n\nconst useStyles = createStyles<string>((theme) => ({\n table: {\n width: '100%',\n '& thead tr th': {\n borderBottom: 'none',\n },\n '& td:first-of-type': {\n paddingLeft: theme.spacing.xl,\n },\n '& tbody td': {\n verticalAlign: 'top',\n },\n },\n\n header: {\n position: 'sticky',\n top: 0,\n backgroundColor: theme.colorScheme === 'dark' ? theme.black : theme.white,\n transition: 'box-shadow 150ms ease',\n zIndex: 1,\n\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n left: 0,\n right: 0,\n bottom: 0,\n borderBottom: `1px solid ${theme.colors.gray[3]}`,\n },\n },\n}));\n\nexport const TableComponentsOrder = {\n MultiSelectInfo: 6,\n Actions: 5,\n Predicate: 4,\n Filter: 3,\n DateRangePicker: 2,\n LayoutControl: 1,\n};\n\nexport default useStyles;\n"],"names":["TableComponentsOrder","useStyles","createStyles","theme","table","width","borderBottom","paddingLeft","spacing","xl","verticalAlign","header","position","top","backgroundColor","colorScheme","black","white","transition","zIndex","content","left","right","bottom","colors","gray","MultiSelectInfo","Actions","Predicate","Filter","DateRangePicker","LayoutControl"],"mappings":";;;;;;;;;;;IAkCaA,oBAAoB;eAApBA;;IASb,OAAyB;eAAzB;;;oBA3C2B;AAE3B,IAAMC,YAAYC,IAAAA,kBAAY,EAAS,SAACC;WAAW;QAC/CC,OAAO;YACHC,OAAO;YACP,iBAAiB;gBACbC,cAAc;YAClB;YACA,sBAAsB;gBAClBC,aAAaJ,MAAMK,OAAO,CAACC,EAAE;YACjC;YACA,cAAc;gBACVC,eAAe;YACnB;QACJ;QAEAC,QAAQ;YACJC,UAAU;YACVC,KAAK;YACLC,iBAAiBX,MAAMY,WAAW,KAAK,SAASZ,MAAMa,KAAK,GAAGb,MAAMc,KAAK;YACzEC,YAAY;YACZC,QAAQ;YAER,YAAY;gBACRC,SAAS;gBACTR,UAAU;gBACVS,MAAM;gBACNC,OAAO;gBACPC,QAAQ;gBACRjB,cAAc,AAAC,aAAiC,OAArBH,MAAMqB,MAAM,CAACC,IAAI,CAAC,EAAE;YACnD;QACJ;IACJ;;AAEO,IAAMzB,uBAAuB;IAChC0B,iBAAiB;IACjBC,SAAS;IACTC,WAAW;IACXC,QAAQ;IACRC,iBAAiB;IACjBC,eAAe;AACnB;IAEA,WAAe9B"}
1
+ {"version":3,"sources":["../../../../src/components/table/Table.styles.ts"],"sourcesContent":["import {createStyles} from '@mantine/core';\n\nconst useStyles = createStyles<string>((theme) => ({\n table: {\n width: '100%',\n },\n\n header: {\n position: 'sticky',\n top: 0,\n backgroundColor: theme.colorScheme === 'dark' ? theme.black : theme.white,\n transition: 'box-shadow 150ms ease',\n zIndex: 1,\n\n '&::after': {\n content: '\"\"',\n position: 'absolute',\n left: 0,\n right: 0,\n bottom: 0,\n borderBottom: `1px solid ${theme.colors.gray[3]}`,\n },\n },\n}));\n\nexport const TableComponentsOrder = {\n MultiSelectInfo: 6,\n Actions: 5,\n Predicate: 4,\n Filter: 3,\n DateRangePicker: 2,\n LayoutControl: 1,\n};\n\nexport default useStyles;\n"],"names":["TableComponentsOrder","useStyles","createStyles","theme","table","width","header","position","top","backgroundColor","colorScheme","black","white","transition","zIndex","content","left","right","bottom","borderBottom","colors","gray","MultiSelectInfo","Actions","Predicate","Filter","DateRangePicker","LayoutControl"],"mappings":";;;;;;;;;;;IAyBaA,oBAAoB;eAApBA;;IASb,OAAyB;eAAzB;;;oBAlC2B;AAE3B,IAAMC,YAAYC,IAAAA,kBAAY,EAAS,SAACC;WAAW;QAC/CC,OAAO;YACHC,OAAO;QACX;QAEAC,QAAQ;YACJC,UAAU;YACVC,KAAK;YACLC,iBAAiBN,MAAMO,WAAW,KAAK,SAASP,MAAMQ,KAAK,GAAGR,MAAMS,KAAK;YACzEC,YAAY;YACZC,QAAQ;YAER,YAAY;gBACRC,SAAS;gBACTR,UAAU;gBACVS,MAAM;gBACNC,OAAO;gBACPC,QAAQ;gBACRC,cAAc,AAAC,aAAiC,OAArBhB,MAAMiB,MAAM,CAACC,IAAI,CAAC,EAAE;YACnD;QACJ;IACJ;;AAEO,IAAMrB,uBAAuB;IAChCsB,iBAAiB;IACjBC,SAAS;IACTC,WAAW;IACXC,QAAQ;IACRC,iBAAiB;IACjBC,eAAe;AACnB;IAEA,WAAe1B"}
@@ -1,8 +1,9 @@
1
+ import { Icon } from '@coveord/plasma-react-icons';
1
2
  import { UseFormReturnType } from '@mantine/form';
2
- import { ColumnDef, CoreOptions, Table, TableOptions, InitialTableState as TanstackInitialTableState, TableState as TanstackTableState } from '@tanstack/table-core';
3
+ import { ColumnDef, CoreOptions, InitialTableState as TanstackInitialTableState, Table, TableOptions, TableState as TanstackTableState } from '@tanstack/table-core';
3
4
  import { Dispatch, ReactElement, ReactNode, RefObject } from 'react';
4
- import { Icon } from '@coveord/plasma-react-icons';
5
5
  import { DateRangePickerValue } from '../date-range-picker/DateRangePickerInlineCalendar';
6
+ import { TableLayouts } from './layouts/TableLayouts';
6
7
  import { TableActions } from './TableActions';
7
8
  import { TableAccordionColumn, TableCollapsibleColumn } from './TableCollapsibleColumn';
8
9
  import { TableConsumer } from './TableConsumer';
@@ -10,11 +11,11 @@ import { TableDateRangePicker } from './TableDateRangePicker';
10
11
  import { TableFilter } from './TableFilter';
11
12
  import { TableFooter } from './TableFooter';
12
13
  import { TableHeader } from './TableHeader';
14
+ import { TableLastUpdated } from './TableLastUpdated';
13
15
  import { TableLoading } from './TableLoading';
14
16
  import { TablePagination } from './TablePagination';
15
17
  import { TablePerPage } from './TablePerPage';
16
18
  import { TablePredicate } from './TablePredicate';
17
- import { TableLayouts } from './layouts/TableLayouts';
18
19
  export type RowSelectionWithData<TData> = Record<string, TData>;
19
20
  export interface RowSelectionState<TData> {
20
21
  rowSelection: RowSelectionWithData<TData>;
@@ -227,6 +228,15 @@ export interface TableProps<T> {
227
228
  * @default false
228
229
  */
229
230
  disableRowSelection?: boolean;
231
+ /**
232
+ * Nodes that are considered inside the table.
233
+ *
234
+ * Rows normally get unselected when clicking outside the table, but sometimes it has difficulties guessing what is inside or outside, for example when using modals.
235
+ * You can use this prop to force the table to consider some nodes to be inside the table.
236
+ *
237
+ * @see https://mantine.dev/hooks/use-click-outside/#multiple-nodes
238
+ */
239
+ additionalRootNodes?: HTMLElement[];
230
240
  /**
231
241
  * Additional options that can be passed to the table
232
242
  */
@@ -238,6 +248,7 @@ export interface TableType {
238
248
  Filter: typeof TableFilter;
239
249
  Footer: typeof TableFooter;
240
250
  Header: typeof TableHeader;
251
+ LastUpdated: typeof TableLastUpdated;
241
252
  Pagination: typeof TablePagination;
242
253
  PerPage: typeof TablePerPage;
243
254
  Predicate: typeof TablePredicate;
@@ -1 +1 @@
1
- {"version":3,"file":"Table.types.d.ts","sourceRoot":"","sources":["../../../../src/components/table/Table.types.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"Table.types.d.ts","sourceRoot":"","sources":["../../../../src/components/table/Table.types.ts"],"names":[],"mappings":"AAAA,OAAO,EAAC,IAAI,EAAC,MAAM,6BAA6B,CAAC;AACjD,OAAO,EAAC,iBAAiB,EAAC,MAAM,eAAe,CAAC;AAChD,OAAO,EACH,SAAS,EACT,WAAW,EACX,iBAAiB,IAAI,yBAAyB,EAC9C,KAAK,EACL,YAAY,EACZ,UAAU,IAAI,kBAAkB,EACnC,MAAM,sBAAsB,CAAC;AAC9B,OAAO,EAAC,QAAQ,EAAE,YAAY,EAAE,SAAS,EAAE,SAAS,EAAC,MAAM,OAAO,CAAC;AAEnE,OAAO,EAAC,oBAAoB,EAAC,MAAM,oDAAoD,CAAC;AACxF,OAAO,EAAC,YAAY,EAAC,MAAM,wBAAwB,CAAC;AACpD,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAC,oBAAoB,EAAE,sBAAsB,EAAC,MAAM,0BAA0B,CAAC;AACtF,OAAO,EAAC,aAAa,EAAC,MAAM,iBAAiB,CAAC;AAC9C,OAAO,EAAC,oBAAoB,EAAC,MAAM,wBAAwB,CAAC;AAC5D,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAC,WAAW,EAAC,MAAM,eAAe,CAAC;AAC1C,OAAO,EAAC,gBAAgB,EAAC,MAAM,oBAAoB,CAAC;AACpD,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAC,eAAe,EAAC,MAAM,mBAAmB,CAAC;AAClD,OAAO,EAAC,YAAY,EAAC,MAAM,gBAAgB,CAAC;AAC5C,OAAO,EAAC,cAAc,EAAC,MAAM,kBAAkB,CAAC;AAEhD,MAAM,MAAM,oBAAoB,CAAC,KAAK,IAAI,MAAM,CAAC,MAAM,EAAE,KAAK,CAAC,CAAC;AAChE,MAAM,WAAW,iBAAiB,CAAC,KAAK;IACpC,YAAY,EAAE,oBAAoB,CAAC,KAAK,CAAC,CAAC;CAC7C;AAED,MAAM,WAAW,UAAU,CAAC,KAAK,CAAE,SAAQ,IAAI,CAAC,kBAAkB,EAAE,cAAc,CAAC,EAAE,iBAAiB,CAAC,KAAK,CAAC;CAAG;AAEhH,MAAM,WAAW,iBAAiB,CAAC,KAAK,CACpC,SAAQ,IAAI,CAAC,yBAAyB,EAAE,cAAc,CAAC,EACnD,OAAO,CAAC,iBAAiB,CAAC,KAAK,CAAC,CAAC,EACjC,OAAO,CAAC,aAAa,CAAC;CAAG;AAEjC,MAAM,MAAM,kBAAkB,CAAC,KAAK,IAAI,CAAC,MAAM,EAAE,UAAU,CAAC,KAAK,CAAC,GAAG,aAAa,KAAK,IAAI,CAAC;AAE5F,MAAM,WAAW,WAAW;IACxB;;;OAGG;IACH,IAAI,EAAE,MAAM,CAAC;IACb;;;OAGG;IACH,IAAI,CAAC,EAAE,IAAI,CAAC;IACZ;;;OAGG;IACH,MAAM,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,gBAAgB,CAAC,CAAC,CAAC,KAAK,YAAY,CAAC;IACxD;;;OAGG;IACH,IAAI,EAAE,CAAC,CAAC,EAAE,KAAK,EAAE,gBAAgB,CAAC,CAAC,CAAC,KAAK,YAAY,CAAC;CACzD;AAED,MAAM,WAAW,gBAAgB,CAAC,CAAC,GAAG,OAAO;IACzC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC;IAChB,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;OAEG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IACvC;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,SAAS,CAAC;CAC/C;AAED,MAAM,MAAM,aAAa,GAAG;IACxB;;;;OAIG;IACH,UAAU,EAAE,MAAM,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC;IACnC;;;;OAIG;IACH,SAAS,EAAE,oBAAoB,CAAC;IAChC;;OAEG;IACH,MAAM,EAAE,WAAW,CAAC,MAAM,CAAC,CAAC;CAC/B,CAAC;AAEF,MAAM,MAAM,gBAAgB,CAAC,KAAK,IAAI;IAClC;;OAEG;IACH,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB;;;;OAIG;IACH,KAAK,EAAE,UAAU,CAAC,KAAK,CAAC,CAAC;IACzB;;OAEG;IACH,QAAQ,EAAE,QAAQ,CAAC,CAAC,SAAS,EAAE,UAAU,CAAC,KAAK,CAAC,KAAK,UAAU,CAAC,KAAK,CAAC,CAAC,CAAC;IACxE;;;OAGG;IACH,UAAU,EAAE,OAAO,CAAC;IACpB;;OAEG;IACH,YAAY,EAAE,MAAM,IAAI,CAAC;IACzB;;OAEG;IACH,cAAc,EAAE,MAAM,KAAK,GAAG,IAAI,CAAC;IACnC;;OAEG;IACH,eAAe,EAAE,MAAM,KAAK,EAAE,CAAC;IAC/B;;OAEG;IACH,cAAc,EAAE,MAAM,IAAI,CAAC;IAC3B;;OAEG;IACH,IAAI,EAAE,iBAAiB,CAAC,aAAa,CAAC,CAAC;IACvC;;OAEG;IACH,YAAY,EAAE,SAAS,CAAC,cAAc,CAAC,CAAC;IACxC;;OAEG;IACH,wBAAwB,EAAE,OAAO,CAAC;IAClC;;OAEG;IACH,mBAAmB,EAAE,OAAO,CAAC;IAC7B;;OAEG;IACH,YAAY,EAAE,MAAM,MAAM,CAAC;IAC3B;;OAEG;IACH,OAAO,EAAE,WAAW,EAAE,CAAC;CAC1B,CAAC;AAEF,MAAM,WAAW,UAAU,CAAC,CAAC;IACzB;;OAEG;IACH,IAAI,EAAE,CAAC,EAAE,CAAC;IACV;;OAEG;IACH,QAAQ,CAAC,EAAE,WAAW,CAAC,CAAC,CAAC,CAAC,UAAU,CAAC,CAAC;IACtC;;;;OAIG;IACH,OAAO,EAAE,KAAK,CAAC,SAAS,CAAC,CAAC,CAAC,CAAC,CAAC;IAC7B;;;;OAIG;IACH,OAAO,CAAC,EAAE,WAAW,EAAE,CAAC;IACxB;;;;OAIG;IACH,OAAO,CAAC,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC;IAChC;;;;OAIG;IACH,QAAQ,CAAC,EAAE,kBAAkB,CAAC,CAAC,CAAC,CAAC;IACjC;;;;;OAKG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,SAAS,CAAC;IAC5C;;OAEG;IACH,cAAc,CAAC,EAAE,SAAS,CAAC;IAC3B;;;;OAIG;IACH,OAAO,CAAC,EAAE,OAAO,CAAC;IAClB;;;;;;;;;OASG;IACH,QAAQ,CAAC,EAAE,SAAS,CAAC;IACrB;;OAEG;IACH,YAAY,CAAC,EAAE,iBAAiB,CAAC,CAAC,CAAC,CAAC;IACpC;;OAEG;IACH,iBAAiB,CAAC,EAAE,CAAC,KAAK,EAAE,CAAC,KAAK,IAAI,CAAC;IACvC;;;;OAIG;IACH,oBAAoB,CAAC,EAAE,CAAC,YAAY,EAAE,CAAC,EAAE,KAAK,IAAI,CAAC;IACnD;;;;OAIG;IACH,wBAAwB,CAAC,EAAE,OAAO,CAAC;IACnC;;;;OAIG;IACH,mBAAmB,CAAC,EAAE,OAAO,CAAC;IAC9B;;;;;;;OAOG;IACH,mBAAmB,CAAC,EAAE,WAAW,EAAE,CAAC;IACpC;;OAEG;IACH,OAAO,CAAC,EAAE,IAAI,CACV,OAAO,CAAC,YAAY,CAAC,CAAC,CAAC,CAAC,EACtB,cAAc,GACd,MAAM,GACN,SAAS,GACT,kBAAkB,GAClB,yBAAyB,GACzB,UAAU,GACV,iBAAiB,GACjB,oBAAoB,GACpB,sBAAsB,CAC3B,CAAC;CACL;AAED,MAAM,WAAW,SAAS;IACtB,CAAC,CAAC,EAAE,KAAK,EAAE,UAAU,CAAC,CAAC,CAAC,GAAG,YAAY,CAAC;IACxC,OAAO,EAAE,OAAO,YAAY,CAAC;IAC7B,MAAM,EAAE,OAAO,WAAW,CAAC;IAC3B,MAAM,EAAE,OAAO,WAAW,CAAC;IAC3B,MAAM,EAAE,OAAO,WAAW,CAAC;IAC3B,WAAW,EAAE,OAAO,gBAAgB,CAAC;IACrC,UAAU,EAAE,OAAO,eAAe,CAAC;IACnC,OAAO,EAAE,OAAO,YAAY,CAAC;IAC7B,SAAS,EAAE,OAAO,cAAc,CAAC;IACjC,eAAe,EAAE,OAAO,oBAAoB,CAAC;IAC7C,iBAAiB,EAAE,OAAO,sBAAsB,CAAC;IACjD,eAAe,EAAE,OAAO,oBAAoB,CAAC;IAC7C,QAAQ,EAAE,OAAO,aAAa,CAAC;IAC/B,OAAO,EAAE,OAAO,YAAY,CAAC;IAC7B,OAAO,EAAE,OAAO,YAAY,CAAC;CAChC"}
@@ -19,8 +19,8 @@ var TableFooter = function(_param) /*#__PURE__*/ {
19
19
  ]);
20
20
  return (0, _jsxruntime.jsx)(_core.Group, _object_spread_props._(_object_spread._({
21
21
  position: "apart",
22
- px: "md",
23
- py: "sm"
22
+ px: "xl",
23
+ py: "md"
24
24
  }, others), {
25
25
  children: children
26
26
  }));
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/table/TableFooter.tsx"],"sourcesContent":["import {Group, DefaultProps} from '@mantine/core';\nimport {FunctionComponent, ReactNode} from 'react';\n\ninterface TableFooterProps extends DefaultProps {\n children?: ReactNode;\n}\nexport const TableFooter: FunctionComponent<TableFooterProps> = ({children, ...others}) => (\n <Group position=\"apart\" px=\"md\" py=\"sm\" {...others}>\n {children}\n </Group>\n);\n"],"names":["TableFooter","children","others","Group","position","px","py"],"mappings":";;;;+BAMaA;;;eAAAA;;;;;;;oBANqB;AAM3B,IAAMA,cAAmD;QAAEC,kBAAAA,UAAaC;QAAbD;;WAC9D,qBAACE,WAAK;QAACC,UAAS;QAAQC,IAAG;QAAKC,IAAG;OAASJ;kBACvCD;;AACE"}
1
+ {"version":3,"sources":["../../../../src/components/table/TableFooter.tsx"],"sourcesContent":["import {Group, DefaultProps} from '@mantine/core';\nimport {FunctionComponent, ReactNode} from 'react';\n\ninterface TableFooterProps extends DefaultProps {\n children?: ReactNode;\n}\nexport const TableFooter: FunctionComponent<TableFooterProps> = ({children, ...others}) => (\n <Group position=\"apart\" px=\"xl\" py=\"md\" {...others}>\n {children}\n </Group>\n);\n"],"names":["TableFooter","children","others","Group","position","px","py"],"mappings":";;;;+BAMaA;;;eAAAA;;;;;;;oBANqB;AAM3B,IAAMA,cAAmD;QAAEC,kBAAAA,UAAaC;QAAbD;;WAC9D,qBAACE,WAAK;QAACC,UAAS;QAAQC,IAAG;QAAKC,IAAG;OAASJ;kBACvCD;;AACE"}
@@ -27,7 +27,7 @@ var useStyles = (0, _core.createStyles)(function(theme) {
27
27
  borderBottom: "1px solid ".concat(theme.colors.gray[3])
28
28
  },
29
29
  multiSelectInfo: {
30
- justifySelf: "flex-start"
30
+ display: "flex"
31
31
  }
32
32
  };
33
33
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/table/TableHeader.tsx"],"sourcesContent":["import {CrossSize16Px} from '@coveord/plasma-react-icons';\nimport {createStyles, DefaultProps, Grid, Selectors, Tooltip} from '@mantine/core';\nimport {FunctionComponent, ReactNode} from 'react';\n\nimport {Button} from '../button';\nimport {TableComponentsOrder} from './Table.styles';\nimport {useTable} from './TableContext';\nimport {TableLayoutControl} from './TableLayoutControl';\n\nconst useStyles = createStyles((theme) => ({\n root: {\n flexDirection: 'row-reverse',\n flexWrap: 'wrap-reverse',\n background: `repeating-linear-gradient(${theme.colors.gray[1]}, ${theme.colors.gray[1]} 68px, ${theme.colors.gray[3]} 68px, ${theme.colors.gray[3]} 69px)`,\n borderBottom: `1px solid ${theme.colors.gray[3]}`,\n },\n multiSelectInfo: {\n justifySelf: 'flex-start',\n },\n}));\n\ntype TableHeaderStylesNames = Selectors<typeof useStyles>;\ninterface TableHeaderProps extends DefaultProps<TableHeaderStylesNames> {\n /* Children of header (ie: actions, datepicker, etc.) */\n children?: ReactNode;\n}\nexport const TableHeader: FunctionComponent<TableHeaderProps> = ({\n classNames,\n styles,\n unstyled,\n children,\n ...others\n}) => {\n const {getSelectedRows, multiRowSelectionEnabled, clearSelection, disableRowSelection} = useTable();\n const {classes} = useStyles(null, {name: 'TableHeader', classNames, styles, unstyled});\n const selectedRows = getSelectedRows();\n\n return (\n <Grid\n justify=\"flex-start\"\n align=\"center\"\n gutter=\"sm\"\n p={0}\n pl=\"md\"\n pr=\"lg\"\n m={0}\n className={classes.root}\n {...others}\n >\n {multiRowSelectionEnabled && selectedRows.length > 0 ? (\n <Grid.Col\n span=\"auto\"\n py=\"sm\"\n className={classes.multiSelectInfo}\n order={TableComponentsOrder.MultiSelectInfo}\n >\n <Tooltip label=\"Unselect all\">\n <Button\n onClick={clearSelection}\n variant=\"subtle\"\n disabled={disableRowSelection}\n leftIcon={<CrossSize16Px height={16} />}\n >\n {selectedRows.length} selected\n </Button>\n </Tooltip>\n </Grid.Col>\n ) : null}\n {children}\n <TableLayoutControl />\n </Grid>\n );\n};\n"],"names":["TableHeader","useStyles","createStyles","theme","root","flexDirection","flexWrap","background","colors","gray","borderBottom","multiSelectInfo","justifySelf","classNames","styles","unstyled","children","others","useTable","getSelectedRows","multiRowSelectionEnabled","clearSelection","disableRowSelection","classes","name","selectedRows","Grid","justify","align","gutter","p","pl","pr","m","className","length","Col","span","py","order","TableComponentsOrder","MultiSelectInfo","Tooltip","label","Button","onClick","variant","disabled","leftIcon","CrossSize16Px","height","TableLayoutControl"],"mappings":";;;;+BA0BaA;;;eAAAA;;;;;;;gCA1Be;oBACuC;sBAG9C;2BACc;4BACZ;kCACU;AAEjC,IAAMC,YAAYC,IAAAA,kBAAY,EAAC,SAACC;WAAW;QACvCC,MAAM;YACFC,eAAe;YACfC,UAAU;YACVC,YAAY,AAAC,6BAAqDJ,OAAzBA,MAAMK,MAAM,CAACC,IAAI,CAAC,EAAE,EAAC,MAAkCN,OAA9BA,MAAMK,MAAM,CAACC,IAAI,CAAC,EAAE,EAAC,WAAuCN,OAA9BA,MAAMK,MAAM,CAACC,IAAI,CAAC,EAAE,EAAC,WAA8B,OAArBN,MAAMK,MAAM,CAACC,IAAI,CAAC,EAAE,EAAC;YACnJC,cAAc,AAAC,aAAiC,OAArBP,MAAMK,MAAM,CAACC,IAAI,CAAC,EAAE;QACnD;QACAE,iBAAiB;YACbC,aAAa;QACjB;IACJ;;AAOO,IAAMZ,cAAmD;QAC5Da,oBAAAA,YACAC,gBAAAA,QACAC,kBAAAA,UACAC,kBAAAA,UACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAyFE,YAAAA,IAAAA,sBAAQ,KAA1FC,kBAAkFD,UAAlFC,iBAAiBC,2BAAiEF,UAAjEE,0BAA0BC,iBAAuCH,UAAvCG,gBAAgBC,sBAAuBJ,UAAvBI;IAClE,IAAM,AAACC,UAAWtB,UAAU,MAAM;QAACuB,MAAM;QAAeX,YAAAA;QAAYC,QAAAA;QAAQC,UAAAA;IAAQ,GAA7EQ;IACP,IAAME,eAAeN;IAErB,qBACI,sBAACO,UAAI;QACDC,SAAQ;QACRC,OAAM;QACNC,QAAO;QACPC,GAAG;QACHC,IAAG;QACHC,IAAG;QACHC,GAAG;QACHC,WAAWX,QAAQnB,IAAI;OACnBa;;YAEHG,4BAA4BK,aAAaU,MAAM,GAAG,kBAC/C,qBAACT,UAAI,CAACU,GAAG;gBACLC,MAAK;gBACLC,IAAG;gBACHJ,WAAWX,QAAQZ,eAAe;gBAClC4B,OAAOC,iCAAoB,CAACC,eAAe;0BAE3C,cAAA,qBAACC,aAAO;oBAACC,OAAM;8BACX,cAAA,sBAACC,cAAM;wBACHC,SAASxB;wBACTyB,SAAQ;wBACRC,UAAUzB;wBACV0B,wBAAU,qBAACC,+BAAa;4BAACC,QAAQ;;;4BAEhCzB,aAAaU,MAAM;4BAAC;;;;iBAIjC;YACHnB;0BACD,qBAACmC,sCAAkB;;;AAG/B"}
1
+ {"version":3,"sources":["../../../../src/components/table/TableHeader.tsx"],"sourcesContent":["import {CrossSize16Px} from '@coveord/plasma-react-icons';\nimport {createStyles, DefaultProps, Grid, Selectors, Tooltip} from '@mantine/core';\nimport {FunctionComponent, ReactNode} from 'react';\n\nimport {Button} from '../button';\nimport {TableComponentsOrder} from './Table.styles';\nimport {useTable} from './TableContext';\nimport {TableLayoutControl} from './TableLayoutControl';\n\nconst useStyles = createStyles((theme) => ({\n root: {\n flexDirection: 'row-reverse',\n flexWrap: 'wrap-reverse',\n background: `repeating-linear-gradient(${theme.colors.gray[1]}, ${theme.colors.gray[1]} 68px, ${theme.colors.gray[3]} 68px, ${theme.colors.gray[3]} 69px)`,\n borderBottom: `1px solid ${theme.colors.gray[3]}`,\n },\n multiSelectInfo: {\n display: 'flex',\n },\n}));\n\ntype TableHeaderStylesNames = Selectors<typeof useStyles>;\ninterface TableHeaderProps extends DefaultProps<TableHeaderStylesNames> {\n /* Children of header (ie: actions, datepicker, etc.) */\n children?: ReactNode;\n}\nexport const TableHeader: FunctionComponent<TableHeaderProps> = ({\n classNames,\n styles,\n unstyled,\n children,\n ...others\n}) => {\n const {getSelectedRows, multiRowSelectionEnabled, clearSelection, disableRowSelection} = useTable();\n const {classes} = useStyles(null, {name: 'TableHeader', classNames, styles, unstyled});\n const selectedRows = getSelectedRows();\n\n return (\n <Grid\n justify=\"flex-start\"\n align=\"center\"\n gutter=\"sm\"\n p={0}\n pl=\"md\"\n pr=\"lg\"\n m={0}\n className={classes.root}\n {...others}\n >\n {multiRowSelectionEnabled && selectedRows.length > 0 ? (\n <Grid.Col\n span=\"auto\"\n py=\"sm\"\n className={classes.multiSelectInfo}\n order={TableComponentsOrder.MultiSelectInfo}\n >\n <Tooltip label=\"Unselect all\">\n <Button\n onClick={clearSelection}\n variant=\"subtle\"\n disabled={disableRowSelection}\n leftIcon={<CrossSize16Px height={16} />}\n >\n {selectedRows.length} selected\n </Button>\n </Tooltip>\n </Grid.Col>\n ) : null}\n {children}\n <TableLayoutControl />\n </Grid>\n );\n};\n"],"names":["TableHeader","useStyles","createStyles","theme","root","flexDirection","flexWrap","background","colors","gray","borderBottom","multiSelectInfo","display","classNames","styles","unstyled","children","others","useTable","getSelectedRows","multiRowSelectionEnabled","clearSelection","disableRowSelection","classes","name","selectedRows","Grid","justify","align","gutter","p","pl","pr","m","className","length","Col","span","py","order","TableComponentsOrder","MultiSelectInfo","Tooltip","label","Button","onClick","variant","disabled","leftIcon","CrossSize16Px","height","TableLayoutControl"],"mappings":";;;;+BA0BaA;;;eAAAA;;;;;;;gCA1Be;oBACuC;sBAG9C;2BACc;4BACZ;kCACU;AAEjC,IAAMC,YAAYC,IAAAA,kBAAY,EAAC,SAACC;WAAW;QACvCC,MAAM;YACFC,eAAe;YACfC,UAAU;YACVC,YAAY,AAAC,6BAAqDJ,OAAzBA,MAAMK,MAAM,CAACC,IAAI,CAAC,EAAE,EAAC,MAAkCN,OAA9BA,MAAMK,MAAM,CAACC,IAAI,CAAC,EAAE,EAAC,WAAuCN,OAA9BA,MAAMK,MAAM,CAACC,IAAI,CAAC,EAAE,EAAC,WAA8B,OAArBN,MAAMK,MAAM,CAACC,IAAI,CAAC,EAAE,EAAC;YACnJC,cAAc,AAAC,aAAiC,OAArBP,MAAMK,MAAM,CAACC,IAAI,CAAC,EAAE;QACnD;QACAE,iBAAiB;YACbC,SAAS;QACb;IACJ;;AAOO,IAAMZ,cAAmD;QAC5Da,oBAAAA,YACAC,gBAAAA,QACAC,kBAAAA,UACAC,kBAAAA,UACGC;QAJHJ;QACAC;QACAC;QACAC;;IAGA,IAAyFE,YAAAA,IAAAA,sBAAQ,KAA1FC,kBAAkFD,UAAlFC,iBAAiBC,2BAAiEF,UAAjEE,0BAA0BC,iBAAuCH,UAAvCG,gBAAgBC,sBAAuBJ,UAAvBI;IAClE,IAAM,AAACC,UAAWtB,UAAU,MAAM;QAACuB,MAAM;QAAeX,YAAAA;QAAYC,QAAAA;QAAQC,UAAAA;IAAQ,GAA7EQ;IACP,IAAME,eAAeN;IAErB,qBACI,sBAACO,UAAI;QACDC,SAAQ;QACRC,OAAM;QACNC,QAAO;QACPC,GAAG;QACHC,IAAG;QACHC,IAAG;QACHC,GAAG;QACHC,WAAWX,QAAQnB,IAAI;OACnBa;;YAEHG,4BAA4BK,aAAaU,MAAM,GAAG,kBAC/C,qBAACT,UAAI,CAACU,GAAG;gBACLC,MAAK;gBACLC,IAAG;gBACHJ,WAAWX,QAAQZ,eAAe;gBAClC4B,OAAOC,iCAAoB,CAACC,eAAe;0BAE3C,cAAA,qBAACC,aAAO;oBAACC,OAAM;8BACX,cAAA,sBAACC,cAAM;wBACHC,SAASxB;wBACTyB,SAAQ;wBACRC,UAAUzB;wBACV0B,wBAAU,qBAACC,+BAAa;4BAACC,QAAQ;;;4BAEhCzB,aAAaU,MAAM;4BAAC;;;;iBAIjC;YACHnB;0BACD,qBAACmC,sCAAkB;;;AAG/B"}
@@ -0,0 +1,24 @@
1
+ import { DefaultProps, Selectors } from '@mantine/core';
2
+ import { FunctionComponent } from 'react';
3
+ declare const useStyles: (params: void, options?: import("@mantine/core").UseStylesOptions<string>) => {
4
+ classes: {
5
+ root: string;
6
+ label: string;
7
+ };
8
+ cx: (...args: any) => string;
9
+ theme: import("@mantine/core").MantineTheme;
10
+ };
11
+ type TableLastUpdatedStylesNames = Selectors<typeof useStyles>;
12
+ interface TableLastUpdatedProps extends DefaultProps<TableLastUpdatedStylesNames> {
13
+ /**
14
+ * Label to contextualize the date
15
+ *
16
+ * @default "Last update:"
17
+ */
18
+ label?: string;
19
+ }
20
+ export declare const TableLastUpdated: FunctionComponent<TableLastUpdatedProps & {
21
+ dependencies?: never;
22
+ }>;
23
+ export {};
24
+ //# sourceMappingURL=TableLastUpdated.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"TableLastUpdated.d.ts","sourceRoot":"","sources":["../../../../src/components/table/TableLastUpdated.tsx"],"names":[],"mappings":"AAAA,OAAO,EAAe,YAAY,EAAS,SAAS,EAAO,MAAM,eAAe,CAAC;AAGjF,OAAO,EAAC,iBAAiB,EAAW,MAAM,OAAO,CAAC;AAGlD,QAAA,MAAM,SAAS;;;;;;;CAOZ,CAAC;AAEJ,KAAK,2BAA2B,GAAG,SAAS,CAAC,OAAO,SAAS,CAAC,CAAC;AAE/D,UAAU,qBAAsB,SAAQ,YAAY,CAAC,2BAA2B,CAAC;IAC7E;;;;OAIG;IACH,KAAK,CAAC,EAAE,MAAM,CAAC;CAClB;AAED,eAAO,MAAM,gBAAgB,EAAE,iBAAiB,CAAC,qBAAqB,GAAG;IAAC,YAAY,CAAC,EAAE,KAAK,CAAA;CAAC,CAwB9F,CAAC"}
@@ -0,0 +1,73 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "TableLastUpdated", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return TableLastUpdated;
9
+ }
10
+ });
11
+ var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
12
+ var _object_spread = require("@swc/helpers/_/_object_spread");
13
+ var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
14
+ var _object_without_properties = require("@swc/helpers/_/_object_without_properties");
15
+ var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
16
+ var _to_consumable_array = require("@swc/helpers/_/_to_consumable_array");
17
+ var _jsxruntime = require("react/jsx-runtime");
18
+ var _core = require("@mantine/core");
19
+ var _hooks = require("@mantine/hooks");
20
+ var _dayjs = /*#__PURE__*/ _interop_require_default._(require("dayjs"));
21
+ var _react = require("react");
22
+ var _TableContext = require("./TableContext");
23
+ var useStyles = (0, _core.createStyles)(function(theme) {
24
+ return {
25
+ root: {
26
+ minHeight: "98px"
27
+ },
28
+ label: {
29
+ color: theme.colors.gray[6]
30
+ }
31
+ };
32
+ });
33
+ var TableLastUpdated = function(_param) {
34
+ var _param_label = _param.label, label = _param_label === void 0 ? "Last update:" : _param_label, dependencies = _param.dependencies, classNames = _param.classNames, styles = _param.styles, unstyled = _param.unstyled, others = _object_without_properties._(_param, [
35
+ "label",
36
+ "dependencies",
37
+ "classNames",
38
+ "styles",
39
+ "unstyled"
40
+ ]);
41
+ var classes = useStyles(null, {
42
+ name: "TableLastUpdated",
43
+ classNames: classNames,
44
+ styles: styles,
45
+ unstyled: unstyled
46
+ }).classes;
47
+ var state = (0, _TableContext.useTable)().state;
48
+ var _useState = _sliced_to_array._((0, _react.useState)(new Date()), 2), time = _useState[0], setTime = _useState[1];
49
+ (0, _hooks.useDidUpdate)(function() {
50
+ setTime(new Date());
51
+ }, [
52
+ state
53
+ ].concat(_to_consumable_array._(dependencies)));
54
+ return /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Group, {
55
+ className: classes.root,
56
+ px: "xl",
57
+ position: "right",
58
+ children: /*#__PURE__*/ (0, _jsxruntime.jsxs)(_core.Text, _object_spread_props._(_object_spread._({
59
+ size: "xs",
60
+ className: classes.label
61
+ }, others), {
62
+ children: [
63
+ label,
64
+ /*#__PURE__*/ (0, _jsxruntime.jsx)("span", {
65
+ role: "timer",
66
+ children: (0, _dayjs.default)(time).format("h:mm:ss A")
67
+ })
68
+ ]
69
+ }))
70
+ });
71
+ };
72
+
73
+ //# sourceMappingURL=TableLastUpdated.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../src/components/table/TableLastUpdated.tsx"],"sourcesContent":["import {createStyles, DefaultProps, Group, Selectors, Text} from '@mantine/core';\nimport {useDidUpdate} from '@mantine/hooks';\nimport dayjs from 'dayjs';\nimport {FunctionComponent, useState} from 'react';\nimport {useTable} from './TableContext';\n\nconst useStyles = createStyles((theme) => ({\n root: {\n minHeight: '98px',\n },\n label: {\n color: theme.colors.gray[6],\n },\n}));\n\ntype TableLastUpdatedStylesNames = Selectors<typeof useStyles>;\n\ninterface TableLastUpdatedProps extends DefaultProps<TableLastUpdatedStylesNames> {\n /**\n * Label to contextualize the date\n *\n * @default \"Last update:\"\n */\n label?: string;\n}\n\nexport const TableLastUpdated: FunctionComponent<TableLastUpdatedProps & {dependencies?: never}> = ({\n label = 'Last update:',\n dependencies,\n classNames,\n styles,\n unstyled,\n ...others\n}) => {\n const {classes} = useStyles(null, {name: 'TableLastUpdated', classNames, styles, unstyled});\n const {state} = useTable();\n const [time, setTime] = useState(new Date());\n\n useDidUpdate(() => {\n setTime(new Date());\n }, [state, ...dependencies]);\n\n return (\n <Group className={classes.root} px=\"xl\" position=\"right\">\n <Text size=\"xs\" className={classes.label} {...others}>\n {label}\n <span role=\"timer\">{dayjs(time).format('h:mm:ss A')}</span>\n </Text>\n </Group>\n );\n};\n"],"names":["TableLastUpdated","useStyles","createStyles","theme","root","minHeight","label","color","colors","gray","dependencies","classNames","styles","unstyled","others","classes","name","state","useTable","useState","Date","time","setTime","useDidUpdate","Group","className","px","position","Text","size","span","role","dayjs","format"],"mappings":";;;;+BA0BaA;;;eAAAA;;;;;;;;;;oBA1BoD;qBACtC;8DACT;qBACwB;4BACnB;AAEvB,IAAMC,YAAYC,IAAAA,kBAAY,EAAC,SAACC;WAAW;QACvCC,MAAM;YACFC,WAAW;QACf;QACAC,OAAO;YACHC,OAAOJ,MAAMK,MAAM,CAACC,IAAI,CAAC,EAAE;QAC/B;IACJ;;AAaO,IAAMT,mBAAsF;8BAC/FM,OAAAA,kCAAQ,+BACRI,sBAAAA,cACAC,oBAAAA,YACAC,gBAAAA,QACAC,kBAAAA,UACGC;QALHR;QACAI;QACAC;QACAC;QACAC;;IAGA,IAAM,AAACE,UAAWd,UAAU,MAAM;QAACe,MAAM;QAAoBL,YAAAA;QAAYC,QAAAA;QAAQC,UAAAA;IAAQ,GAAlFE;IACP,IAAM,AAACE,QAASC,IAAAA,sBAAQ,IAAjBD;IACP,IAAwBE,+BAAAA,IAAAA,eAAQ,EAAC,IAAIC,aAA9BC,OAAiBF,cAAXG,UAAWH;IAExBI,IAAAA,mBAAY,EAAC;QACTD,QAAQ,IAAIF;IAChB,GAAG;QAACH;KAAuB,CAAxB,OAAQ,uBAAGP;IAEd,qBACI,qBAACc,WAAK;QAACC,WAAWV,QAAQX,IAAI;QAAEsB,IAAG;QAAKC,UAAS;kBAC7C,cAAA,sBAACC,UAAI;YAACC,MAAK;YAAKJ,WAAWV,QAAQT,KAAK;WAAMQ;;gBACzCR;8BACD,qBAACwB;oBAAKC,MAAK;8BAASC,IAAAA,cAAK,EAACX,MAAMY,MAAM,CAAC;;;;;AAIvD"}
@@ -1 +1 @@
1
- {"version":3,"file":"TablePagination.d.ts","sourceRoot":"","sources":["../../../../src/components/table/TablePagination.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,iBAAiB,EAAC,MAAM,OAAO,CAAC;AAIxC,UAAU,oBAAoB;IAC1B;;OAEG;IACH,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;CAC7B;AAED,eAAO,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,CAkCnE,CAAC"}
1
+ {"version":3,"file":"TablePagination.d.ts","sourceRoot":"","sources":["../../../../src/components/table/TablePagination.tsx"],"names":[],"mappings":"AACA,OAAO,EAAC,iBAAiB,EAAC,MAAM,OAAO,CAAC;AAIxC,UAAU,oBAAoB;IAC1B;;OAEG;IACH,UAAU,EAAE,MAAM,GAAG,IAAI,CAAC;CAC7B;AAED,eAAO,MAAM,eAAe,EAAE,iBAAiB,CAAC,oBAAoB,CAmCnE,CAAC"}
@@ -35,6 +35,7 @@ var TablePagination = function(param) {
35
35
  total: total,
36
36
  boundaries: 0,
37
37
  size: "md",
38
+ spacing: "xs",
38
39
  getControlProps: function(control) {
39
40
  switch(control){
40
41
  case "previous":
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/table/TablePagination.tsx"],"sourcesContent":["import {Pagination} from '@mantine/core';\nimport {FunctionComponent} from 'react';\n\nimport {useTable} from './TableContext';\n\ninterface TablePaginationProps {\n /**\n * The total number of page. Use null only if your table is paginated client side\n */\n totalPages: number | null;\n}\n\nexport const TablePagination: FunctionComponent<TablePaginationProps> = ({totalPages}) => {\n const {state, setState, containerRef, getPageCount} = useTable();\n const updatePage = (newPage: number) => {\n setState((prevState) => ({\n ...prevState,\n pagination: {...prevState.pagination, pageIndex: newPage - 1},\n }));\n containerRef.current.scrollIntoView({behavior: 'smooth'});\n };\n\n const total = totalPages === null ? getPageCount() : totalPages;\n\n return (\n <Pagination\n value={state.pagination.pageIndex + 1}\n onChange={updatePage}\n total={total}\n boundaries={0}\n size=\"md\"\n getControlProps={(control) => {\n switch (control) {\n case 'previous':\n return {\n component: 'button',\n 'aria-label': 'previous page',\n };\n case 'next':\n return {component: 'button', 'aria-label': 'next page'};\n default:\n return {};\n }\n }}\n />\n );\n};\n"],"names":["TablePagination","totalPages","useTable","state","setState","containerRef","getPageCount","updatePage","newPage","prevState","pagination","pageIndex","current","scrollIntoView","behavior","total","Pagination","value","onChange","boundaries","size","getControlProps","control","component"],"mappings":";;;;+BAYaA;;;eAAAA;;;;;;oBAZY;4BAGF;AAShB,IAAMA,kBAA2D;QAAEC,mBAAAA;IACtE,IAAsDC,YAAAA,IAAAA,sBAAQ,KAAvDC,QAA+CD,UAA/CC,OAAOC,WAAwCF,UAAxCE,UAAUC,eAA8BH,UAA9BG,cAAcC,eAAgBJ,UAAhBI;IACtC,IAAMC,aAAa,SAACC;QAChBJ,SAAS,SAACK;mBAAe,4CAClBA;gBACHC,YAAY,4CAAID,UAAUC,UAAU;oBAAEC,WAAWH,UAAU;;;;QAE/DH,aAAaO,OAAO,CAACC,cAAc,CAAC;YAACC,UAAU;QAAQ;IAC3D;IAEA,IAAMC,QAAQd,eAAe,OAAOK,iBAAiBL;IAErD,qBACI,qBAACe,gBAAU;QACPC,OAAOd,MAAMO,UAAU,CAACC,SAAS,GAAG;QACpCO,UAAUX;QACVQ,OAAOA;QACPI,YAAY;QACZC,MAAK;QACLC,iBAAiB,SAACC;YACd,OAAQA;gBACJ,KAAK;oBACD,OAAO;wBACHC,WAAW;wBACX,cAAc;oBAClB;gBACJ,KAAK;oBACD,OAAO;wBAACA,WAAW;wBAAU,cAAc;oBAAW;gBAC1D;oBACI,OAAO,CAAC;YAChB;QACJ;;AAGZ"}
1
+ {"version":3,"sources":["../../../../src/components/table/TablePagination.tsx"],"sourcesContent":["import {Pagination} from '@mantine/core';\nimport {FunctionComponent} from 'react';\n\nimport {useTable} from './TableContext';\n\ninterface TablePaginationProps {\n /**\n * The total number of page. Use null only if your table is paginated client side\n */\n totalPages: number | null;\n}\n\nexport const TablePagination: FunctionComponent<TablePaginationProps> = ({totalPages}) => {\n const {state, setState, containerRef, getPageCount} = useTable();\n const updatePage = (newPage: number) => {\n setState((prevState) => ({\n ...prevState,\n pagination: {...prevState.pagination, pageIndex: newPage - 1},\n }));\n containerRef.current.scrollIntoView({behavior: 'smooth'});\n };\n\n const total = totalPages === null ? getPageCount() : totalPages;\n\n return (\n <Pagination\n value={state.pagination.pageIndex + 1}\n onChange={updatePage}\n total={total}\n boundaries={0}\n size=\"md\"\n spacing=\"xs\"\n getControlProps={(control) => {\n switch (control) {\n case 'previous':\n return {\n component: 'button',\n 'aria-label': 'previous page',\n };\n case 'next':\n return {component: 'button', 'aria-label': 'next page'};\n default:\n return {};\n }\n }}\n />\n );\n};\n"],"names":["TablePagination","totalPages","useTable","state","setState","containerRef","getPageCount","updatePage","newPage","prevState","pagination","pageIndex","current","scrollIntoView","behavior","total","Pagination","value","onChange","boundaries","size","spacing","getControlProps","control","component"],"mappings":";;;;+BAYaA;;;eAAAA;;;;;;oBAZY;4BAGF;AAShB,IAAMA,kBAA2D;QAAEC,mBAAAA;IACtE,IAAsDC,YAAAA,IAAAA,sBAAQ,KAAvDC,QAA+CD,UAA/CC,OAAOC,WAAwCF,UAAxCE,UAAUC,eAA8BH,UAA9BG,cAAcC,eAAgBJ,UAAhBI;IACtC,IAAMC,aAAa,SAACC;QAChBJ,SAAS,SAACK;mBAAe,4CAClBA;gBACHC,YAAY,4CAAID,UAAUC,UAAU;oBAAEC,WAAWH,UAAU;;;;QAE/DH,aAAaO,OAAO,CAACC,cAAc,CAAC;YAACC,UAAU;QAAQ;IAC3D;IAEA,IAAMC,QAAQd,eAAe,OAAOK,iBAAiBL;IAErD,qBACI,qBAACe,gBAAU;QACPC,OAAOd,MAAMO,UAAU,CAACC,SAAS,GAAG;QACpCO,UAAUX;QACVQ,OAAOA;QACPI,YAAY;QACZC,MAAK;QACLC,SAAQ;QACRC,iBAAiB,SAACC;YACd,OAAQA;gBACJ,KAAK;oBACD,OAAO;wBACHC,WAAW;wBACX,cAAc;oBAClB;gBACJ,KAAK;oBACD,OAAO;wBAACA,WAAW;wBAAU,cAAc;oBAAW;gBAC1D;oBACI,OAAO,CAAC;YAChB;QACJ;;AAGZ"}
@@ -19,7 +19,7 @@ var TablePerPage = function(param) {
19
19
  50,
20
20
  100
21
21
  ] : _param_values;
22
- var _values__toString, _this, _values;
22
+ var _values;
23
23
  var _useTable = (0, _TableContext.useTable)(), state = _useTable.state, setState = _useTable.setState;
24
24
  var updatePerPage = function(newPerPage) {
25
25
  setState(function(prevState) {
@@ -33,18 +33,20 @@ var TablePerPage = function(param) {
33
33
  };
34
34
  var _state_pagination_pageSize_toString;
35
35
  return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_core.Group, {
36
+ spacing: "sm",
36
37
  children: [
37
38
  /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Text, {
39
+ fw: 500,
38
40
  children: label
39
41
  }),
40
42
  /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.SegmentedControl, {
41
- value: (_state_pagination_pageSize_toString = state.pagination.pageSize.toString()) !== null && _state_pagination_pageSize_toString !== void 0 ? _state_pagination_pageSize_toString : (_values = values) === null || _values === void 0 ? void 0 : (_values__toString = (_this = _values[1]).toString) === null || _values__toString === void 0 ? void 0 : _values__toString.call(_this),
43
+ value: (_state_pagination_pageSize_toString = state.pagination.pageSize.toString()) !== null && _state_pagination_pageSize_toString !== void 0 ? _state_pagination_pageSize_toString : (_values = values) === null || _values === void 0 ? void 0 : _values[1].toString(),
42
44
  onChange: updatePerPage,
43
45
  data: values.map(function(value) {
44
46
  return value.toString();
45
47
  }),
46
48
  color: "action",
47
- size: "md"
49
+ size: "sm"
48
50
  })
49
51
  ]
50
52
  });
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/table/TablePerPage.tsx"],"sourcesContent":["import {Group, SegmentedControl, Text} from '@mantine/core';\nimport {FunctionComponent} from 'react';\n\nimport {useTable} from './TableContext';\n\ninterface TablePerPageProps {\n /**\n * The label displayed before the control\n *\n * @default Results per page\n */\n label?: string;\n /**\n * The per page choices to display\n *\n * @default [25, 50, 100]\n */\n values?: number[];\n}\n\nexport const TablePerPage: FunctionComponent<TablePerPageProps> & {DEFAULT_SIZE: number} = ({\n label = 'Results per page',\n values = [25, 50, 100],\n}) => {\n const {state, setState} = useTable();\n\n const updatePerPage = (newPerPage: string) => {\n setState((prevState) => ({\n ...prevState,\n pagination: {pageIndex: 0, pageSize: parseInt(newPerPage, 10)},\n }));\n };\n\n return (\n <Group>\n <Text>{label}</Text>\n <SegmentedControl\n value={state.pagination.pageSize.toString() ?? values?.[1].toString()}\n onChange={updatePerPage}\n data={values.map((value) => value.toString())}\n color=\"action\"\n size=\"md\"\n />\n </Group>\n );\n};\n\nTablePerPage.DEFAULT_SIZE = 50;\n"],"names":["TablePerPage","label","values","useTable","state","setState","updatePerPage","newPerPage","prevState","pagination","pageIndex","pageSize","parseInt","Group","Text","SegmentedControl","value","toString","onChange","data","map","color","size","DEFAULT_SIZE"],"mappings":";;;;+BAoBaA;;;eAAAA;;;;;;oBApB+B;4BAGrB;AAiBhB,IAAMA,eAA8E;6BACvFC,OAAAA,kCAAQ,yDACRC,QAAAA,oCAAS;QAAC;QAAI;QAAI;KAAI;QAeqCA,0BAAAA;IAb3D,IAA0BC,YAAAA,IAAAA,sBAAQ,KAA3BC,QAAmBD,UAAnBC,OAAOC,WAAYF,UAAZE;IAEd,IAAMC,gBAAgB,SAACC;QACnBF,SAAS,SAACG;mBAAe,4CAClBA;gBACHC,YAAY;oBAACC,WAAW;oBAAGC,UAAUC,SAASL,YAAY;gBAAG;;;IAErE;QAMmBH;IAJnB,qBACI,sBAACS,WAAK;;0BACF,qBAACC,UAAI;0BAAEb;;0BACP,qBAACc,sBAAgB;gBACbC,OAAOZ,CAAAA,sCAAAA,MAAMK,UAAU,CAACE,QAAQ,CAACM,QAAQ,gBAAlCb,iDAAAA,uCAAwCF,UAAAA,oBAAAA,+BAAAA,oBAAAA,SAAAA,OAAQ,CAAC,EAAE,EAACe,QAAQ,cAApBf,wCAAAA;gBAC/CgB,UAAUZ;gBACVa,MAAMjB,OAAOkB,GAAG,CAAC,SAACJ;2BAAUA,MAAMC,QAAQ;;gBAC1CI,OAAM;gBACNC,MAAK;;;;AAIrB;AAEAtB,aAAauB,YAAY,GAAG"}
1
+ {"version":3,"sources":["../../../../src/components/table/TablePerPage.tsx"],"sourcesContent":["import {Group, SegmentedControl, Text} from '@mantine/core';\nimport {FunctionComponent} from 'react';\n\nimport {useTable} from './TableContext';\n\ninterface TablePerPageProps {\n /**\n * The label displayed before the control\n *\n * @default Results per page\n */\n label?: string;\n /**\n * The per page choices to display\n *\n * @default [25, 50, 100]\n */\n values?: number[];\n}\n\nexport const TablePerPage: FunctionComponent<TablePerPageProps> & {DEFAULT_SIZE: number} = ({\n label = 'Results per page',\n values = [25, 50, 100],\n}) => {\n const {state, setState} = useTable();\n\n const updatePerPage = (newPerPage: string) => {\n setState((prevState) => ({\n ...prevState,\n pagination: {pageIndex: 0, pageSize: parseInt(newPerPage, 10)},\n }));\n };\n\n return (\n <Group spacing=\"sm\">\n <Text fw={500}>{label}</Text>\n <SegmentedControl\n value={state.pagination.pageSize.toString() ?? values?.[1].toString()}\n onChange={updatePerPage}\n data={values.map((value) => value.toString())}\n color=\"action\"\n size=\"sm\"\n />\n </Group>\n );\n};\n\nTablePerPage.DEFAULT_SIZE = 50;\n"],"names":["TablePerPage","label","values","useTable","state","setState","updatePerPage","newPerPage","prevState","pagination","pageIndex","pageSize","parseInt","Group","spacing","Text","fw","SegmentedControl","value","toString","onChange","data","map","color","size","DEFAULT_SIZE"],"mappings":";;;;+BAoBaA;;;eAAAA;;;;;;oBApB+B;4BAGrB;AAiBhB,IAAMA,eAA8E;6BACvFC,OAAAA,kCAAQ,yDACRC,QAAAA,oCAAS;QAAC;QAAI;QAAI;KAAI;QAeqCA;IAb3D,IAA0BC,YAAAA,IAAAA,sBAAQ,KAA3BC,QAAmBD,UAAnBC,OAAOC,WAAYF,UAAZE;IAEd,IAAMC,gBAAgB,SAACC;QACnBF,SAAS,SAACG;mBAAe,4CAClBA;gBACHC,YAAY;oBAACC,WAAW;oBAAGC,UAAUC,SAASL,YAAY;gBAAG;;;IAErE;QAMmBH;IAJnB,qBACI,sBAACS,WAAK;QAACC,SAAQ;;0BACX,qBAACC,UAAI;gBAACC,IAAI;0BAAMf;;0BAChB,qBAACgB,sBAAgB;gBACbC,OAAOd,CAAAA,sCAAAA,MAAMK,UAAU,CAACE,QAAQ,CAACQ,QAAQ,gBAAlCf,iDAAAA,uCAAwCF,UAAAA,oBAAAA,8BAAAA,OAAQ,CAAC,EAAE,CAACiB,QAAQ;gBACnEC,UAAUd;gBACVe,MAAMnB,OAAOoB,GAAG,CAAC,SAACJ;2BAAUA,MAAMC,QAAQ;;gBAC1CI,OAAM;gBACNC,MAAK;;;;AAIrB;AAEAxB,aAAayB,YAAY,GAAG"}
@@ -1 +1 @@
1
- {"version":3,"file":"RowLayout.d.ts","sourceRoot":"","sources":["../../../../../src/components/table/layouts/RowLayout.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAC,WAAW,EAAmB,MAAM,gBAAgB,CAAC;AA2I7D,eAAO,MAAM,SAAS,EAAE,WAKvB,CAAC"}
1
+ {"version":3,"file":"RowLayout.d.ts","sourceRoot":"","sources":["../../../../../src/components/table/layouts/RowLayout.tsx"],"names":[],"mappings":"AAKA,OAAO,EAAC,WAAW,EAAmB,MAAM,gBAAgB,CAAC;AA6K7D,eAAO,MAAM,SAAS,EAAE,WAKvB,CAAC"}
@@ -18,14 +18,16 @@ var _react = require("react");
18
18
  var _TableCollapsibleColumn = require("../TableCollapsibleColumn");
19
19
  var _TableContext = require("../TableContext");
20
20
  var _TableLoading = require("../TableLoading");
21
+ var _TableSelectableColumn = require("../TableSelectableColumn");
21
22
  var _Th = require("../Th");
22
23
  var useStyles = (0, _core.createStyles)(function(theme, param) {
23
24
  var multiRowSelectionEnabled = param.multiRowSelectionEnabled, disableRowSelection = param.disableRowSelection;
24
- var rowBackgroundColor = theme.colorScheme === "dark" ? theme.fn.rgba(theme.colors[theme.primaryColor][7], 0.2) : theme.colors[theme.primaryColor][0];
25
+ var rowBackgroundColor = theme.colorScheme === "dark" ? theme.fn.rgba(theme.colors[theme.primaryColor][7], 0.2) : theme.colors.gray[1];
26
+ var border = "".concat((0, _core.rem)(1), " solid ").concat(theme.colorScheme === "dark" ? theme.colors.dark[4] : theme.colors.gray[3]);
25
27
  return {
26
28
  headerColumns: {
27
29
  "& th:first-of-type > *": {
28
- paddingLeft: theme.spacing.xl
30
+ paddingLeft: "40px"
29
31
  },
30
32
  "& input[type=checkbox]": {
31
33
  backgroundColor: disableRowSelection ? "".concat(theme.colors.gray[2]) : undefined,
@@ -56,9 +58,23 @@ var useStyles = (0, _core.createStyles)(function(theme, param) {
56
58
  padding: "calc(".concat(theme.spacing.xs, "/2) ").concat(theme.spacing.sm, " !important")
57
59
  },
58
60
  row: {
61
+ "& td:first-of-type": {
62
+ paddingLeft: "40px"
63
+ },
59
64
  "&:hover": {
60
65
  backgroundColor: rowBackgroundColor
61
66
  }
67
+ },
68
+ cell: {
69
+ verticalAlign: "middle",
70
+ // We must use height instead of minHeight here, otherwise it doesn't apply
71
+ height: "56px",
72
+ padding: "".concat(theme.spacing.xs, " ").concat(theme.spacing.sm),
73
+ borderBottom: border
74
+ },
75
+ collapsible: {
76
+ backgroundColor: rowBackgroundColor,
77
+ borderBottom: border
62
78
  }
63
79
  };
64
80
  });
@@ -90,18 +106,28 @@ var RowLayoutBody = function(param) {
90
106
  disableRowSelection: disableRowSelection,
91
107
  multiRowSelectionEnabled: multiRowSelectionEnabled
92
108
  }), classes = _useStyles.classes, cx = _useStyles.cx;
109
+ var toggleCollapsible = function(el) {
110
+ var cell = el.children[el.children.length - 1];
111
+ cell.querySelector("button").click();
112
+ };
93
113
  var rows = table.getRowModel().rows.map(function(row) {
94
114
  var _getExpandChildren;
95
115
  var _getExpandChildren1;
96
116
  var rowChildren = (_getExpandChildren1 = (_getExpandChildren = getExpandChildren) === null || _getExpandChildren === void 0 ? void 0 : _getExpandChildren(row.original)) !== null && _getExpandChildren1 !== void 0 ? _getExpandChildren1 : null;
97
117
  var isSelected = !!row.getIsSelected();
118
+ var onClick = function(event) {
119
+ if (rowChildren) {
120
+ toggleCollapsible(event.currentTarget);
121
+ }
122
+ if (!disableRowSelection && !multiRowSelectionEnabled) {
123
+ row.toggleSelected();
124
+ }
125
+ };
98
126
  var _obj;
99
127
  return /*#__PURE__*/ (0, _jsxruntime.jsxs)(_react.Fragment, {
100
128
  children: [
101
129
  /*#__PURE__*/ (0, _jsxruntime.jsx)("tr", {
102
- onClick: function() {
103
- return disableRowSelection ? undefined : row.toggleSelected();
104
- },
130
+ onClick: onClick,
105
131
  onDoubleClick: function() {
106
132
  var _doubleClickAction;
107
133
  return (_doubleClickAction = doubleClickAction) === null || _doubleClickAction === void 0 ? void 0 : _doubleClickAction(row.original);
@@ -111,11 +137,18 @@ var RowLayoutBody = function(param) {
111
137
  children: row.getVisibleCells().map(function(cell) {
112
138
  var size = cell.column.getSize();
113
139
  var width = size !== _tablecore.defaultColumnSizing.size ? size : undefined;
140
+ var onCollapsibleCellClick = function(event) {
141
+ if (cell.column.id === _TableSelectableColumn.TableSelectableColumn.id && !disableRowSelection) {
142
+ event.stopPropagation();
143
+ row.getToggleSelectedHandler();
144
+ }
145
+ };
114
146
  return /*#__PURE__*/ (0, _jsxruntime.jsx)("td", {
115
147
  style: {
116
148
  width: width
117
149
  },
118
- className: cx(_define_property._({}, classes.rowCollapsibleButtonCell, cell.column.id === _TableCollapsibleColumn.TableCollapsibleColumn.id)),
150
+ className: cx(classes.cell, _define_property._({}, classes.rowCollapsibleButtonCell, cell.column.id === _TableCollapsibleColumn.TableCollapsibleColumn.id)),
151
+ onClick: onCollapsibleCellClick,
119
152
  children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_TableLoading.TableLoading, {
120
153
  visible: loading,
121
154
  children: (0, _reacttable.flexRender)(cell.column.columnDef.cell, cell.getContext())
@@ -127,13 +160,12 @@ var RowLayoutBody = function(param) {
127
160
  children: /*#__PURE__*/ (0, _jsxruntime.jsx)("td", {
128
161
  colSpan: table.getAllColumns().length,
129
162
  style: {
130
- padding: 0,
131
- borderTop: row.getIsExpanded() ? undefined : "none",
132
- borderBottom: row.getIsExpanded() ? undefined : "none"
163
+ padding: 0
133
164
  },
134
165
  children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Collapse, {
135
166
  in: row.getIsExpanded(),
136
167
  children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Box, {
168
+ className: classes.collapsible,
137
169
  px: "sm",
138
170
  py: "xs",
139
171
  children: rowChildren
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../../src/components/table/layouts/RowLayout.tsx"],"sourcesContent":["import {ListSize16Px} from '@coveord/plasma-react-icons';\nimport {Box, Collapse, createStyles} from '@mantine/core';\nimport {flexRender} from '@tanstack/react-table';\nimport {defaultColumnSizing} from '@tanstack/table-core';\nimport {Fragment} from 'react';\nimport {TableLayout, TableLayoutProps} from '../Table.types';\nimport {TableCollapsibleColumn} from '../TableCollapsibleColumn';\nimport {useTable} from '../TableContext';\nimport {TableLoading} from '../TableLoading';\nimport {Th} from '../Th';\n\ninterface TableStylesParams {\n multiRowSelectionEnabled: boolean;\n disableRowSelection: boolean;\n}\n\nconst useStyles = createStyles<string, TableStylesParams>((theme, {multiRowSelectionEnabled, disableRowSelection}) => {\n const rowBackgroundColor =\n theme.colorScheme === 'dark'\n ? theme.fn.rgba(theme.colors[theme.primaryColor][7], 0.2)\n : theme.colors[theme.primaryColor][0];\n return {\n headerColumns: {\n '& th:first-of-type > *': {\n paddingLeft: theme.spacing.xl,\n },\n\n '& input[type=checkbox]': {\n backgroundColor: disableRowSelection ? `${theme.colors.gray[2]}` : undefined,\n borderColor: disableRowSelection ? `${theme.colors.gray[3]}` : `${theme.colors.gray[4]}`,\n pointerEvents: disableRowSelection ? 'none' : 'auto',\n cursor: disableRowSelection ? 'not-allowed' : 'default',\n\n '& + svg': {\n color: disableRowSelection ? `${theme.colors.gray[5]}` : 'inherit',\n },\n },\n },\n\n rowSelected: {\n backgroundColor: multiRowSelectionEnabled ? undefined : rowBackgroundColor,\n },\n\n rowUnselectable: {\n '& input[type=checkbox]': {\n backgroundColor: `${theme.colors.gray[2]}`,\n borderColor: `${theme.colors.gray[3]}`,\n pointerEvents: 'none',\n cursor: 'not-allowed',\n\n '&:checked + svg': {\n color: `${theme.colors.gray[5]}`,\n },\n },\n },\n\n rowCollapsibleButtonCell: {\n textAlign: 'right',\n padding: `calc(${theme.spacing.xs}/2) ${theme.spacing.sm} !important`,\n },\n\n row: {\n '&:hover': {\n backgroundColor: rowBackgroundColor,\n },\n },\n };\n});\n\nconst RowLayoutHeader = <T,>({table}: TableLayoutProps<T>) => {\n const {multiRowSelectionEnabled, disableRowSelection} = useTable();\n const {classes} = useStyles({disableRowSelection, multiRowSelectionEnabled});\n const headers = table.getHeaderGroups().map((headerGroup) => (\n <tr key={headerGroup.id} className={classes.headerColumns}>\n {headerGroup.headers.map((columnHeader) => (\n <Th key={columnHeader.id} header={columnHeader} />\n ))}\n </tr>\n ));\n return <>{headers}</>;\n};\n\nconst RowLayoutBody = <T,>({table, doubleClickAction, getExpandChildren, loading}: TableLayoutProps<T>) => {\n const {multiRowSelectionEnabled, disableRowSelection} = useTable();\n const {classes, cx} = useStyles({disableRowSelection, multiRowSelectionEnabled});\n\n const rows = table.getRowModel().rows.map((row) => {\n const rowChildren = getExpandChildren?.(row.original) ?? null;\n const isSelected = !!row.getIsSelected();\n\n return (\n <Fragment key={row.id}>\n <tr\n onClick={() => (disableRowSelection ? undefined : row.toggleSelected())}\n onDoubleClick={() => doubleClickAction?.(row.original)}\n className={cx(classes.row, {\n [classes.rowSelected]: isSelected,\n [classes.rowUnselectable]: disableRowSelection,\n })}\n aria-selected={isSelected}\n >\n {row.getVisibleCells().map((cell) => {\n const size = cell.column.getSize();\n const width = size !== defaultColumnSizing.size ? size : undefined;\n return (\n <td\n key={cell.id}\n style={{width}}\n className={cx({\n [classes.rowCollapsibleButtonCell]: cell.column.id === TableCollapsibleColumn.id,\n })}\n >\n <TableLoading visible={loading}>\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </TableLoading>\n </td>\n );\n })}\n </tr>\n {rowChildren ? (\n <tr>\n <td\n colSpan={table.getAllColumns().length}\n style={{\n padding: 0,\n borderTop: row.getIsExpanded() ? undefined : 'none',\n borderBottom: row.getIsExpanded() ? undefined : 'none',\n }}\n >\n <Collapse in={row.getIsExpanded()}>\n <Box px=\"sm\" py=\"xs\">\n {rowChildren}\n </Box>\n </Collapse>\n </td>\n </tr>\n ) : null}\n </Fragment>\n );\n });\n\n return <>{rows}</>;\n};\n\nexport const RowLayout: TableLayout = {\n name: 'Rows',\n icon: ListSize16Px,\n Header: RowLayoutHeader,\n Body: RowLayoutBody,\n};\n"],"names":["RowLayout","useStyles","createStyles","theme","multiRowSelectionEnabled","disableRowSelection","rowBackgroundColor","colorScheme","fn","rgba","colors","primaryColor","headerColumns","paddingLeft","spacing","xl","backgroundColor","gray","undefined","borderColor","pointerEvents","cursor","color","rowSelected","rowUnselectable","rowCollapsibleButtonCell","textAlign","padding","xs","sm","row","RowLayoutHeader","table","useTable","classes","headers","getHeaderGroups","map","headerGroup","tr","className","columnHeader","Th","header","id","RowLayoutBody","doubleClickAction","getExpandChildren","loading","cx","rows","getRowModel","rowChildren","original","isSelected","getIsSelected","Fragment","onClick","toggleSelected","onDoubleClick","aria-selected","getVisibleCells","cell","size","column","getSize","width","defaultColumnSizing","td","style","TableCollapsibleColumn","TableLoading","visible","flexRender","columnDef","getContext","colSpan","getAllColumns","length","borderTop","getIsExpanded","borderBottom","Collapse","in","Box","px","py","name","icon","ListSize16Px","Header","Body"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../../src/components/table/layouts/RowLayout.tsx"],"sourcesContent":["import {ListSize16Px} from '@coveord/plasma-react-icons';\nimport {Box, Collapse, createStyles, rem} from '@mantine/core';\nimport {flexRender} from '@tanstack/react-table';\nimport {defaultColumnSizing} from '@tanstack/table-core';\nimport {Fragment, type MouseEvent} from 'react';\nimport {TableLayout, TableLayoutProps} from '../Table.types';\nimport {TableCollapsibleColumn} from '../TableCollapsibleColumn';\nimport {useTable} from '../TableContext';\nimport {TableLoading} from '../TableLoading';\nimport {TableSelectableColumn} from '../TableSelectableColumn';\nimport {Th} from '../Th';\n\ninterface TableStylesParams {\n multiRowSelectionEnabled: boolean;\n disableRowSelection: boolean;\n}\n\nconst useStyles = createStyles<string, TableStylesParams>((theme, {multiRowSelectionEnabled, disableRowSelection}) => {\n const rowBackgroundColor =\n theme.colorScheme === 'dark' ? theme.fn.rgba(theme.colors[theme.primaryColor][7], 0.2) : theme.colors.gray[1];\n const border = `${rem(1)} solid ${theme.colorScheme === 'dark' ? theme.colors.dark[4] : theme.colors.gray[3]}`;\n return {\n headerColumns: {\n '& th:first-of-type > *': {\n paddingLeft: '40px',\n },\n\n '& input[type=checkbox]': {\n backgroundColor: disableRowSelection ? `${theme.colors.gray[2]}` : undefined,\n borderColor: disableRowSelection ? `${theme.colors.gray[3]}` : `${theme.colors.gray[4]}`,\n pointerEvents: disableRowSelection ? 'none' : 'auto',\n cursor: disableRowSelection ? 'not-allowed' : 'default',\n\n '& + svg': {\n color: disableRowSelection ? `${theme.colors.gray[5]}` : 'inherit',\n },\n },\n },\n\n rowSelected: {\n backgroundColor: multiRowSelectionEnabled ? undefined : rowBackgroundColor,\n },\n\n rowUnselectable: {\n '& input[type=checkbox]': {\n backgroundColor: `${theme.colors.gray[2]}`,\n borderColor: `${theme.colors.gray[3]}`,\n pointerEvents: 'none',\n cursor: 'not-allowed',\n\n '&:checked + svg': {\n color: `${theme.colors.gray[5]}`,\n },\n },\n },\n\n rowCollapsibleButtonCell: {\n textAlign: 'right',\n padding: `calc(${theme.spacing.xs}/2) ${theme.spacing.sm} !important`,\n },\n\n row: {\n '& td:first-of-type': {\n paddingLeft: '40px',\n },\n '&:hover': {\n backgroundColor: rowBackgroundColor,\n },\n },\n\n cell: {\n verticalAlign: 'middle',\n // We must use height instead of minHeight here, otherwise it doesn't apply\n height: '56px',\n padding: `${theme.spacing.xs} ${theme.spacing.sm}`,\n borderBottom: border,\n },\n\n collapsible: {\n backgroundColor: rowBackgroundColor,\n borderBottom: border,\n },\n };\n});\n\nconst RowLayoutHeader = <T,>({table}: TableLayoutProps<T>) => {\n const {multiRowSelectionEnabled, disableRowSelection} = useTable();\n const {classes} = useStyles({disableRowSelection, multiRowSelectionEnabled});\n const headers = table.getHeaderGroups().map((headerGroup) => (\n <tr key={headerGroup.id} className={classes.headerColumns}>\n {headerGroup.headers.map((columnHeader) => (\n <Th key={columnHeader.id} header={columnHeader} />\n ))}\n </tr>\n ));\n return <>{headers}</>;\n};\n\nconst RowLayoutBody = <T,>({table, doubleClickAction, getExpandChildren, loading}: TableLayoutProps<T>) => {\n const {multiRowSelectionEnabled, disableRowSelection} = useTable();\n const {classes, cx} = useStyles({disableRowSelection, multiRowSelectionEnabled});\n\n const toggleCollapsible = (el: HTMLTableRowElement) => {\n const cell = el.children[el.children.length - 1] as HTMLTableCellElement;\n cell.querySelector('button').click();\n };\n\n const rows = table.getRowModel().rows.map((row) => {\n const rowChildren = getExpandChildren?.(row.original) ?? null;\n const isSelected = !!row.getIsSelected();\n const onClick = (event: MouseEvent<HTMLTableRowElement>) => {\n if (rowChildren) {\n toggleCollapsible(event.currentTarget);\n }\n if (!disableRowSelection && !multiRowSelectionEnabled) {\n row.toggleSelected();\n }\n };\n\n return (\n <Fragment key={row.id}>\n <tr\n onClick={onClick}\n onDoubleClick={() => doubleClickAction?.(row.original)}\n className={cx(classes.row, {\n [classes.rowSelected]: isSelected,\n [classes.rowUnselectable]: disableRowSelection,\n })}\n aria-selected={isSelected}\n >\n {row.getVisibleCells().map((cell) => {\n const size = cell.column.getSize();\n const width = size !== defaultColumnSizing.size ? size : undefined;\n const onCollapsibleCellClick = (event: MouseEvent<HTMLTableCellElement>) => {\n if (cell.column.id === TableSelectableColumn.id && !disableRowSelection) {\n event.stopPropagation();\n row.getToggleSelectedHandler();\n }\n };\n return (\n <td\n key={cell.id}\n style={{width}}\n className={cx(classes.cell, {\n [classes.rowCollapsibleButtonCell]: cell.column.id === TableCollapsibleColumn.id,\n })}\n onClick={onCollapsibleCellClick}\n >\n <TableLoading visible={loading}>\n {flexRender(cell.column.columnDef.cell, cell.getContext())}\n </TableLoading>\n </td>\n );\n })}\n </tr>\n {rowChildren ? (\n <tr>\n <td\n colSpan={table.getAllColumns().length}\n style={{\n padding: 0,\n }}\n >\n <Collapse in={row.getIsExpanded()}>\n <Box className={classes.collapsible} px=\"sm\" py=\"xs\">\n {rowChildren}\n </Box>\n </Collapse>\n </td>\n </tr>\n ) : null}\n </Fragment>\n );\n });\n\n return <>{rows}</>;\n};\n\nexport const RowLayout: TableLayout = {\n name: 'Rows',\n icon: ListSize16Px,\n Header: RowLayoutHeader,\n Body: RowLayoutBody,\n};\n"],"names":["RowLayout","useStyles","createStyles","theme","multiRowSelectionEnabled","disableRowSelection","rowBackgroundColor","colorScheme","fn","rgba","colors","primaryColor","gray","border","rem","dark","headerColumns","paddingLeft","backgroundColor","undefined","borderColor","pointerEvents","cursor","color","rowSelected","rowUnselectable","rowCollapsibleButtonCell","textAlign","padding","spacing","xs","sm","row","cell","verticalAlign","height","borderBottom","collapsible","RowLayoutHeader","table","useTable","classes","headers","getHeaderGroups","map","headerGroup","tr","className","columnHeader","Th","header","id","RowLayoutBody","doubleClickAction","getExpandChildren","loading","cx","toggleCollapsible","el","children","length","querySelector","click","rows","getRowModel","rowChildren","original","isSelected","getIsSelected","onClick","event","currentTarget","toggleSelected","Fragment","onDoubleClick","aria-selected","getVisibleCells","size","column","getSize","width","defaultColumnSizing","onCollapsibleCellClick","TableSelectableColumn","stopPropagation","getToggleSelectedHandler","td","style","TableCollapsibleColumn","TableLoading","visible","flexRender","columnDef","getContext","colSpan","getAllColumns","Collapse","in","getIsExpanded","Box","px","py","name","icon","ListSize16Px","Header","Body"],"mappings":";;;;+BAkLaA;;;eAAAA;;;;;gCAlLc;oBACoB;0BACtB;yBACS;qBACM;sCAEH;4BACd;4BACI;qCACS;kBACnB;AAOjB,IAAMC,YAAYC,IAAAA,kBAAY,EAA4B,SAACC;QAAQC,iCAAAA,0BAA0BC,4BAAAA;IACzF,IAAMC,qBACFH,MAAMI,WAAW,KAAK,SAASJ,MAAMK,EAAE,CAACC,IAAI,CAACN,MAAMO,MAAM,CAACP,MAAMQ,YAAY,CAAC,CAAC,EAAE,EAAE,OAAOR,MAAMO,MAAM,CAACE,IAAI,CAAC,EAAE;IACjH,IAAMC,SAAS,AAAC,GAAkBV,OAAhBW,IAAAA,SAAG,EAAC,IAAG,WAAoF,OAA3EX,MAAMI,WAAW,KAAK,SAASJ,MAAMO,MAAM,CAACK,IAAI,CAAC,EAAE,GAAGZ,MAAMO,MAAM,CAACE,IAAI,CAAC,EAAE;IAC5G,OAAO;QACHI,eAAe;YACX,0BAA0B;gBACtBC,aAAa;YACjB;YAEA,0BAA0B;gBACtBC,iBAAiBb,sBAAsB,AAAC,GAAuB,OAArBF,MAAMO,MAAM,CAACE,IAAI,CAAC,EAAE,IAAKO;gBACnEC,aAAaf,sBAAsB,AAAC,GAAuB,OAArBF,MAAMO,MAAM,CAACE,IAAI,CAAC,EAAE,IAAK,AAAC,GAAuB,OAArBT,MAAMO,MAAM,CAACE,IAAI,CAAC,EAAE;gBACtFS,eAAehB,sBAAsB,SAAS;gBAC9CiB,QAAQjB,sBAAsB,gBAAgB;gBAE9C,WAAW;oBACPkB,OAAOlB,sBAAsB,AAAC,GAAuB,OAArBF,MAAMO,MAAM,CAACE,IAAI,CAAC,EAAE,IAAK;gBAC7D;YACJ;QACJ;QAEAY,aAAa;YACTN,iBAAiBd,2BAA2Be,YAAYb;QAC5D;QAEAmB,iBAAiB;YACb,0BAA0B;gBACtBP,iBAAiB,AAAC,GAAuB,OAArBf,MAAMO,MAAM,CAACE,IAAI,CAAC,EAAE;gBACxCQ,aAAa,AAAC,GAAuB,OAArBjB,MAAMO,MAAM,CAACE,IAAI,CAAC,EAAE;gBACpCS,eAAe;gBACfC,QAAQ;gBAER,mBAAmB;oBACfC,OAAO,AAAC,GAAuB,OAArBpB,MAAMO,MAAM,CAACE,IAAI,CAAC,EAAE;gBAClC;YACJ;QACJ;QAEAc,0BAA0B;YACtBC,WAAW;YACXC,SAAS,AAAC,QAA8BzB,OAAvBA,MAAM0B,OAAO,CAACC,EAAE,EAAC,QAAuB,OAAjB3B,MAAM0B,OAAO,CAACE,EAAE,EAAC;QAC7D;QAEAC,KAAK;YACD,sBAAsB;gBAClBf,aAAa;YACjB;YACA,WAAW;gBACPC,iBAAiBZ;YACrB;QACJ;QAEA2B,MAAM;YACFC,eAAe;YACf,2EAA2E;YAC3EC,QAAQ;YACRP,SAAS,AAAC,GAAsBzB,OAApBA,MAAM0B,OAAO,CAACC,EAAE,EAAC,KAAoB,OAAjB3B,MAAM0B,OAAO,CAACE,EAAE;YAChDK,cAAcvB;QAClB;QAEAwB,aAAa;YACTnB,iBAAiBZ;YACjB8B,cAAcvB;QAClB;IACJ;AACJ;AAEA,IAAMyB,kBAAkB;QAAMC,cAAAA;IAC1B,IAAwDC,YAAAA,IAAAA,sBAAQ,KAAzDpC,2BAAiDoC,UAAjDpC,0BAA0BC,sBAAuBmC,UAAvBnC;IACjC,IAAM,AAACoC,UAAWxC,UAAU;QAACI,qBAAAA;QAAqBD,0BAAAA;IAAwB,GAAnEqC;IACP,IAAMC,UAAUH,MAAMI,eAAe,GAAGC,GAAG,CAAC,SAACC;6BACzC,qBAACC;YAAwBC,WAAWN,QAAQzB,aAAa;sBACpD6B,YAAYH,OAAO,CAACE,GAAG,CAAC,SAACI;qCACtB,qBAACC,MAAE;oBAAuBC,QAAQF;mBAAzBA,aAAaG,EAAE;;WAFvBN,YAAYM,EAAE;;IAM3B,qBAAO;kBAAGT;;AACd;AAEA,IAAMU,gBAAgB;QAAMb,cAAAA,OAAOc,0BAAAA,mBAAmBC,0BAAAA,mBAAmBC,gBAAAA;IACrE,IAAwDf,YAAAA,IAAAA,sBAAQ,KAAzDpC,2BAAiDoC,UAAjDpC,0BAA0BC,sBAAuBmC,UAAvBnC;IACjC,IAAsBJ,aAAAA,UAAU;QAACI,qBAAAA;QAAqBD,0BAAAA;IAAwB,IAAvEqC,UAAexC,WAAfwC,SAASe,KAAMvD,WAANuD;IAEhB,IAAMC,oBAAoB,SAACC;QACvB,IAAMzB,OAAOyB,GAAGC,QAAQ,CAACD,GAAGC,QAAQ,CAACC,MAAM,GAAG,EAAE;QAChD3B,KAAK4B,aAAa,CAAC,UAAUC,KAAK;IACtC;IAEA,IAAMC,OAAOxB,MAAMyB,WAAW,GAAGD,IAAI,CAACnB,GAAG,CAAC,SAACZ;YACnBsB;YAAAA;QAApB,IAAMW,cAAcX,CAAAA,uBAAAA,qBAAAA,+BAAAA,yCAAAA,mBAAoBtB,IAAIkC,QAAQ,eAAhCZ,iCAAAA,sBAAqC;QACzD,IAAMa,aAAa,CAAC,CAACnC,IAAIoC,aAAa;QACtC,IAAMC,UAAU,SAACC;YACb,IAAIL,aAAa;gBACbR,kBAAkBa,MAAMC,aAAa;YACzC;YACA,IAAI,CAAClE,uBAAuB,CAACD,0BAA0B;gBACnD4B,IAAIwC,cAAc;YACtB;QACJ;YAOuC;QALvC,qBACI,sBAACC,eAAQ;;8BACL,qBAAC3B;oBACGuB,SAASA;oBACTK,eAAe;4BAAMrB;gCAAAA,qBAAAA,+BAAAA,yCAAAA,mBAAoBrB,IAAIkC,QAAQ;;oBACrDnB,WAAWS,GAAGf,QAAQT,GAAG,GAAE,WACvB,mBADuB,MACtBS,QAAQjB,WAAW,EAAG2C,aACvB,mBAFuB,MAEtB1B,QAAQhB,eAAe,EAAGpB,sBAFJ;oBAI3BsE,iBAAeR;8BAEdnC,IAAI4C,eAAe,GAAGhC,GAAG,CAAC,SAACX;wBACxB,IAAM4C,OAAO5C,KAAK6C,MAAM,CAACC,OAAO;wBAChC,IAAMC,QAAQH,SAASI,8BAAmB,CAACJ,IAAI,GAAGA,OAAO1D;wBACzD,IAAM+D,yBAAyB,SAACZ;4BAC5B,IAAIrC,KAAK6C,MAAM,CAAC3B,EAAE,KAAKgC,4CAAqB,CAAChC,EAAE,IAAI,CAAC9C,qBAAqB;gCACrEiE,MAAMc,eAAe;gCACrBpD,IAAIqD,wBAAwB;4BAChC;wBACJ;wBACA,qBACI,qBAACC;4BAEGC,OAAO;gCAACP,OAAAA;4BAAK;4BACbjC,WAAWS,GAAGf,QAAQR,IAAI,EACtB,uBAACQ,QAAQf,wBAAwB,EAAGO,KAAK6C,MAAM,CAAC3B,EAAE,KAAKqC,8CAAsB,CAACrC,EAAE;4BAEpFkB,SAASa;sCAET,cAAA,qBAACO,0BAAY;gCAACC,SAASnC;0CAClBoC,IAAAA,sBAAU,EAAC1D,KAAK6C,MAAM,CAACc,SAAS,CAAC3D,IAAI,EAAEA,KAAK4D,UAAU;;2BARtD5D,KAAKkB,EAAE;oBAYxB;;gBAEHc,4BACG,qBAACnB;8BACG,cAAA,qBAACwC;wBACGQ,SAASvD,MAAMwD,aAAa,GAAGnC,MAAM;wBACrC2B,OAAO;4BACH3D,SAAS;wBACb;kCAEA,cAAA,qBAACoE,cAAQ;4BAACC,IAAIjE,IAAIkE,aAAa;sCAC3B,cAAA,qBAACC,SAAG;gCAACpD,WAAWN,QAAQJ,WAAW;gCAAE+D,IAAG;gCAAKC,IAAG;0CAC3CpC;;;;qBAKjB;;WAlDOjC,IAAImB,EAAE;IAqD7B;IAEA,qBAAO;kBAAGY;;AACd;AAEO,IAAM/D,YAAyB;IAClCsG,MAAM;IACNC,MAAMC,8BAAY;IAClBC,QAAQnE;IACRoE,MAAMtD;AACV"}
@@ -1,10 +1,10 @@
1
1
  /// <reference types="react" />
2
2
  import { Table } from '@tanstack/table-core';
3
3
  import { TableProps } from './Table.types';
4
- export declare const useRowSelection: <T>(table: Table<T>, { onRowSelectionChange, multiRowSelectionEnabled, }: Pick<TableProps<T>, "multiRowSelectionEnabled" | "onRowSelectionChange">) => {
4
+ export declare const useRowSelection: <T>(table: Table<T>, { onRowSelectionChange, multiRowSelectionEnabled, additionalRootNodes, }: Pick<TableProps<T>, "multiRowSelectionEnabled" | "onRowSelectionChange" | "additionalRootNodes">) => {
5
5
  clearSelection: () => void;
6
6
  getSelectedRow: () => T;
7
7
  getSelectedRows: () => T[];
8
- outsideClickRef: import("react").MutableRefObject<any>;
8
+ outsideClickRef: import("react").MutableRefObject<HTMLDivElement>;
9
9
  };
10
10
  //# sourceMappingURL=useRowSelection.d.ts.map
@@ -1 +1 @@
1
- {"version":3,"file":"useRowSelection.d.ts","sourceRoot":"","sources":["../../../../src/components/table/useRowSelection.ts"],"names":[],"mappings":";AACA,OAAO,EAAsC,KAAK,EAAC,MAAM,sBAAsB,CAAC;AAGhF,OAAO,EAAuB,UAAU,EAAa,MAAM,eAAe,CAAC;AAE3E,eAAO,MAAM,eAAe;;;;;CA0D3B,CAAC"}
1
+ {"version":3,"file":"useRowSelection.d.ts","sourceRoot":"","sources":["../../../../src/components/table/useRowSelection.ts"],"names":[],"mappings":";AACA,OAAO,EAAsC,KAAK,EAAC,MAAM,sBAAsB,CAAC;AAIhF,OAAO,EAAuB,UAAU,EAAa,MAAM,eAAe,CAAC;AAE3E,eAAO,MAAM,eAAe;;;;;CAgE3B,CAAC"}
@@ -11,16 +11,21 @@ Object.defineProperty(exports, "useRowSelection", {
11
11
  var _interop_require_default = require("@swc/helpers/_/_interop_require_default");
12
12
  var _object_spread = require("@swc/helpers/_/_object_spread");
13
13
  var _object_spread_props = require("@swc/helpers/_/_object_spread_props");
14
+ var _to_consumable_array = require("@swc/helpers/_/_to_consumable_array");
14
15
  var _hooks = require("@mantine/hooks");
15
16
  var _tablecore = require("@tanstack/table-core");
16
17
  var _fastdeepequal = /*#__PURE__*/ _interop_require_default._(require("fast-deep-equal"));
18
+ var _react = require("react");
17
19
  var useRowSelection = function(table, param) {
18
- var onRowSelectionChange = param.onRowSelectionChange, multiRowSelectionEnabled = param.multiRowSelectionEnabled;
19
- var outsideClickRef = (0, _hooks.useClickOutside)(function() {
20
+ var onRowSelectionChange = param.onRowSelectionChange, multiRowSelectionEnabled = param.multiRowSelectionEnabled, _param_additionalRootNodes = param.additionalRootNodes, additionalRootNodes = _param_additionalRootNodes === void 0 ? [] : _param_additionalRootNodes;
21
+ var outsideClickRef = (0, _react.useRef)();
22
+ (0, _hooks.useClickOutside)(function() {
20
23
  if (!multiRowSelectionEnabled) {
21
24
  clearSelection();
22
25
  }
23
- });
26
+ }, null, [
27
+ outsideClickRef.current
28
+ ].concat(_to_consumable_array._(additionalRootNodes)));
24
29
  table.setOptions(function(prev) {
25
30
  return _object_spread_props._(_object_spread._({}, prev), {
26
31
  onRowSelectionChange: function(rowSelectionUpdater) {
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/table/useRowSelection.ts"],"sourcesContent":["import {useClickOutside} from '@mantine/hooks';\nimport {functionalUpdate, RowSelectionState, Table} from '@tanstack/table-core';\nimport isEqual from 'fast-deep-equal';\n\nimport {RowSelectionWithData, TableProps, TableState} from './Table.types';\n\nexport const useRowSelection = <T>(\n table: Table<T>,\n {\n onRowSelectionChange,\n multiRowSelectionEnabled,\n }: Pick<TableProps<T>, 'onRowSelectionChange' | 'multiRowSelectionEnabled'>\n) => {\n const outsideClickRef = useClickOutside(() => {\n if (!multiRowSelectionEnabled) {\n clearSelection();\n }\n });\n\n table.setOptions((prev) => ({\n ...prev,\n onRowSelectionChange: (rowSelectionUpdater) => {\n table.setState((old) => {\n const newRowSelection = functionalUpdate(\n rowSelectionUpdater,\n old['rowSelection']\n ) as RowSelectionWithData<T>;\n\n if (isEqual(old['rowSelection'], newRowSelection)) {\n return old;\n }\n\n const rows = table.getRowModel().rowsById;\n\n Object.keys(newRowSelection).forEach((rowId) => {\n if (newRowSelection[rowId] === true) {\n if (!rows[rowId]) {\n console.error(\n 'The table was not initialized properly, the rowSelection state should contain an object of type Record<string, TData>.'\n );\n }\n newRowSelection[rowId] = rows[rowId]?.original ?? (true as T);\n }\n });\n\n onRowSelectionChange?.(Object.values(newRowSelection));\n\n return {\n ...old,\n rowSelection: newRowSelection as RowSelectionState,\n };\n });\n },\n }));\n\n const clearSelection = () => {\n table.resetRowSelection(true);\n };\n\n const getSelectedRows = () => Object.values((table.getState() as TableState<T>).rowSelection);\n\n const getSelectedRow = () => getSelectedRows()[0] ?? null;\n\n return {clearSelection, getSelectedRow, getSelectedRows, outsideClickRef};\n};\n"],"names":["useRowSelection","table","onRowSelectionChange","multiRowSelectionEnabled","outsideClickRef","useClickOutside","clearSelection","setOptions","prev","rowSelectionUpdater","setState","old","newRowSelection","functionalUpdate","isEqual","rows","getRowModel","rowsById","Object","keys","forEach","rowId","console","error","original","values","rowSelection","resetRowSelection","getSelectedRows","getState","getSelectedRow"],"mappings":";;;;+BAMaA;;;eAAAA;;;;;;qBANiB;yBAC2B;sEACrC;AAIb,IAAMA,kBAAkB,SAC3BC;QAEIC,6BAAAA,sBACAC,iCAAAA;IAGJ,IAAMC,kBAAkBC,IAAAA,sBAAe,EAAC;QACpC,IAAI,CAACF,0BAA0B;YAC3BG;QACJ;IACJ;IAEAL,MAAMM,UAAU,CAAC,SAACC;eAAU,4CACrBA;YACHN,sBAAsB,SAACO;gBACnBR,MAAMS,QAAQ,CAAC,SAACC;wBAuBZT;oBAtBA,IAAMU,kBAAkBC,IAAAA,2BAAgB,EACpCJ,qBACAE,GAAG,CAAC,eAAe;oBAGvB,IAAIG,IAAAA,sBAAO,EAACH,GAAG,CAAC,eAAe,EAAEC,kBAAkB;wBAC/C,OAAOD;oBACX;oBAEA,IAAMI,OAAOd,MAAMe,WAAW,GAAGC,QAAQ;oBAEzCC,OAAOC,IAAI,CAACP,iBAAiBQ,OAAO,CAAC,SAACC;wBAClC,IAAIT,eAAe,CAACS,MAAM,KAAK,MAAM;gCAMRN;4BALzB,IAAI,CAACA,IAAI,CAACM,MAAM,EAAE;gCACdC,QAAQC,KAAK,CACT;4BAER;gCACyBR;4BAAzBH,eAAe,CAACS,MAAM,GAAGN,CAAAA,wBAAAA,cAAAA,IAAI,CAACM,MAAM,cAAXN,kCAAAA,YAAaS,QAAQ,cAArBT,kCAAAA,uBAA0B;wBACvD;oBACJ;qBAEAb,wBAAAA,kCAAAA,4CAAAA,sBAAuBgB,OAAOO,MAAM,CAACb;oBAErC,OAAO,4CACAD;wBACHe,cAAcd;;gBAEtB;YACJ;;;IAGJ,IAAMN,iBAAiB;QACnBL,MAAM0B,iBAAiB,CAAC;IAC5B;IAEA,IAAMC,kBAAkB;eAAMV,OAAOO,MAAM,CAAC,AAACxB,MAAM4B,QAAQ,GAAqBH,YAAY;;QAE/DE;IAA7B,IAAME,iBAAiB;eAAMF,CAAAA,oBAAAA,iBAAiB,CAAC,EAAE,cAApBA,+BAAAA,oBAAwB;;IAErD,OAAO;QAACtB,gBAAAA;QAAgBwB,gBAAAA;QAAgBF,iBAAAA;QAAiBxB,iBAAAA;IAAe;AAC5E"}
1
+ {"version":3,"sources":["../../../../src/components/table/useRowSelection.ts"],"sourcesContent":["import {useClickOutside} from '@mantine/hooks';\nimport {functionalUpdate, RowSelectionState, Table} from '@tanstack/table-core';\nimport isEqual from 'fast-deep-equal';\n\nimport {useRef} from 'react';\nimport {RowSelectionWithData, TableProps, TableState} from './Table.types';\n\nexport const useRowSelection = <T>(\n table: Table<T>,\n {\n onRowSelectionChange,\n multiRowSelectionEnabled,\n additionalRootNodes = [],\n }: Pick<TableProps<T>, 'onRowSelectionChange' | 'multiRowSelectionEnabled' | 'additionalRootNodes'>\n) => {\n const outsideClickRef = useRef<HTMLDivElement>();\n useClickOutside(\n () => {\n if (!multiRowSelectionEnabled) {\n clearSelection();\n }\n },\n null,\n [outsideClickRef.current, ...additionalRootNodes]\n );\n\n table.setOptions((prev) => ({\n ...prev,\n onRowSelectionChange: (rowSelectionUpdater) => {\n table.setState((old) => {\n const newRowSelection = functionalUpdate(\n rowSelectionUpdater,\n old['rowSelection']\n ) as RowSelectionWithData<T>;\n\n if (isEqual(old['rowSelection'], newRowSelection)) {\n return old;\n }\n\n const rows = table.getRowModel().rowsById;\n\n Object.keys(newRowSelection).forEach((rowId) => {\n if (newRowSelection[rowId] === true) {\n if (!rows[rowId]) {\n console.error(\n 'The table was not initialized properly, the rowSelection state should contain an object of type Record<string, TData>.'\n );\n }\n newRowSelection[rowId] = rows[rowId]?.original ?? (true as T);\n }\n });\n\n onRowSelectionChange?.(Object.values(newRowSelection));\n\n return {\n ...old,\n rowSelection: newRowSelection as RowSelectionState,\n };\n });\n },\n }));\n\n const clearSelection = () => {\n table.resetRowSelection(true);\n };\n\n const getSelectedRows = () => Object.values((table.getState() as TableState<T>).rowSelection);\n\n const getSelectedRow = () => getSelectedRows()[0] ?? null;\n\n return {clearSelection, getSelectedRow, getSelectedRows, outsideClickRef};\n};\n"],"names":["useRowSelection","table","onRowSelectionChange","multiRowSelectionEnabled","additionalRootNodes","outsideClickRef","useRef","useClickOutside","clearSelection","current","setOptions","prev","rowSelectionUpdater","setState","old","newRowSelection","functionalUpdate","isEqual","rows","getRowModel","rowsById","Object","keys","forEach","rowId","console","error","original","values","rowSelection","resetRowSelection","getSelectedRows","getState","getSelectedRow"],"mappings":";;;;+BAOaA;;;eAAAA;;;;;;;qBAPiB;yBAC2B;sEACrC;qBAEC;AAGd,IAAMA,kBAAkB,SAC3BC;QAEIC,6BAAAA,sBACAC,iCAAAA,6DACAC,qBAAAA,8DAAsB,EAAE;IAG5B,IAAMC,kBAAkBC,IAAAA,aAAM;IAC9BC,IAAAA,sBAAe,EACX;QACI,IAAI,CAACJ,0BAA0B;YAC3BK;QACJ;IACJ,GACA,MACA;QAACH,gBAAgBI,OAAO;KAAyB,CAAjD,OAA0B,uBAAGL;IAGjCH,MAAMS,UAAU,CAAC,SAACC;eAAU,4CACrBA;YACHT,sBAAsB,SAACU;gBACnBX,MAAMY,QAAQ,CAAC,SAACC;wBAuBZZ;oBAtBA,IAAMa,kBAAkBC,IAAAA,2BAAgB,EACpCJ,qBACAE,GAAG,CAAC,eAAe;oBAGvB,IAAIG,IAAAA,sBAAO,EAACH,GAAG,CAAC,eAAe,EAAEC,kBAAkB;wBAC/C,OAAOD;oBACX;oBAEA,IAAMI,OAAOjB,MAAMkB,WAAW,GAAGC,QAAQ;oBAEzCC,OAAOC,IAAI,CAACP,iBAAiBQ,OAAO,CAAC,SAACC;wBAClC,IAAIT,eAAe,CAACS,MAAM,KAAK,MAAM;gCAMRN;4BALzB,IAAI,CAACA,IAAI,CAACM,MAAM,EAAE;gCACdC,QAAQC,KAAK,CACT;4BAER;gCACyBR;4BAAzBH,eAAe,CAACS,MAAM,GAAGN,CAAAA,wBAAAA,cAAAA,IAAI,CAACM,MAAM,cAAXN,kCAAAA,YAAaS,QAAQ,cAArBT,kCAAAA,uBAA0B;wBACvD;oBACJ;qBAEAhB,wBAAAA,kCAAAA,4CAAAA,sBAAuBmB,OAAOO,MAAM,CAACb;oBAErC,OAAO,4CACAD;wBACHe,cAAcd;;gBAEtB;YACJ;;;IAGJ,IAAMP,iBAAiB;QACnBP,MAAM6B,iBAAiB,CAAC;IAC5B;IAEA,IAAMC,kBAAkB;eAAMV,OAAOO,MAAM,CAAC,AAAC3B,MAAM+B,QAAQ,GAAqBH,YAAY;;QAE/DE;IAA7B,IAAME,iBAAiB;eAAMF,CAAAA,oBAAAA,iBAAiB,CAAC,EAAE,cAApBA,+BAAAA,oBAAwB;;IAErD,OAAO;QAACvB,gBAAAA;QAAgByB,gBAAAA;QAAgBF,iBAAAA;QAAiB1B,iBAAAA;IAAe;AAC5E"}