@coveord/plasma-mantine 55.3.3 → 55.4.0

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 (38) hide show
  1. package/.turbo/turbo-build.log +3 -3
  2. package/.turbo/turbo-test.log +48 -45
  3. package/dist/.tsbuildinfo +1 -1
  4. package/dist/cjs/components/date-range-picker/DateRangePickerInlineCalendar.d.ts.map +1 -1
  5. package/dist/cjs/components/date-range-picker/DateRangePickerInlineCalendar.js +21 -3
  6. package/dist/cjs/components/date-range-picker/DateRangePickerInlineCalendar.js.map +1 -1
  7. package/dist/cjs/components/table/use-table.d.ts +10 -4
  8. package/dist/cjs/components/table/use-table.d.ts.map +1 -1
  9. package/dist/cjs/components/table/use-table.js +184 -12
  10. package/dist/cjs/components/table/use-table.js.map +1 -1
  11. package/dist/cjs/components/table/use-url-synced-state.d.ts +29 -0
  12. package/dist/cjs/components/table/use-url-synced-state.d.ts.map +1 -0
  13. package/dist/cjs/components/table/use-url-synced-state.js +58 -0
  14. package/dist/cjs/components/table/use-url-synced-state.js.map +1 -0
  15. package/dist/esm/components/date-range-picker/DateRangePickerInlineCalendar.d.ts.map +1 -1
  16. package/dist/esm/components/date-range-picker/DateRangePickerInlineCalendar.js +15 -2
  17. package/dist/esm/components/date-range-picker/DateRangePickerInlineCalendar.js.map +1 -1
  18. package/dist/esm/components/table/use-table.d.ts +10 -4
  19. package/dist/esm/components/table/use-table.d.ts.map +1 -1
  20. package/dist/esm/components/table/use-table.js +127 -8
  21. package/dist/esm/components/table/use-table.js.map +1 -1
  22. package/dist/esm/components/table/use-url-synced-state.d.ts +29 -0
  23. package/dist/esm/components/table/use-url-synced-state.d.ts.map +1 -0
  24. package/dist/esm/components/table/use-url-synced-state.js +41 -0
  25. package/dist/esm/components/table/use-url-synced-state.js.map +1 -0
  26. package/package.json +8 -8
  27. package/src/components/date-range-picker/DateRangePickerInlineCalendar.tsx +15 -1
  28. package/src/components/date-range-picker/__tests__/DateRangePickerInlineCalendar.spec.tsx +6 -4
  29. package/src/components/table/__tests__/TableColumnsSelector.spec.tsx +51 -0
  30. package/src/components/table/__tests__/TableDateRangePicker.spec.tsx +53 -1
  31. package/src/components/table/__tests__/TableFilter.spec.tsx +43 -0
  32. package/src/components/table/__tests__/TablePagination.spec.tsx +54 -0
  33. package/src/components/table/__tests__/TablePerPage.spec.tsx +55 -0
  34. package/src/components/table/__tests__/TablePredicate.spec.tsx +69 -0
  35. package/src/components/table/__tests__/Th.spec.tsx +35 -0
  36. package/src/components/table/__tests__/use-url-synced-state.unit.spec.ts +113 -0
  37. package/src/components/table/use-table.ts +120 -15
  38. package/src/components/table/use-url-synced-state.ts +70 -0
@@ -1 +1 @@
1
- {"version":3,"file":"DateRangePickerInlineCalendar.d.ts","sourceRoot":"","sources":["../../../../src/components/date-range-picker/DateRangePickerInlineCalendar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,mBAAmB,EAAC,MAAM,gBAAgB,CAAC;AAK/D,OAAO,EAAC,qBAAqB,EAA8B,MAAM,+BAA+B,CAAC;AACjG,OAAO,EAA0B,4BAA4B,EAAC,MAAM,2BAA2B,CAAC;AAEhG,MAAM,MAAM,oBAAoB,GAAG,CAAC,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC,CAAC;AAC9D,MAAM,WAAW,kCACb,SAAQ,IAAI,CAAC,4BAA4B,EAAE,YAAY,GAAG,UAAU,CAAC;IACrE;;OAEG;IACH,YAAY,EAAE,oBAAoB,CAAC;IACnC;;;;OAIG;IACH,OAAO,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,qBAAqB,CAAC,CAAC;IAChD;;OAEG;IACH,kBAAkB,CAAC,EAAE,IAAI,CACrB,mBAAmB,EACnB,OAAO,GAAG,UAAU,GAAG,eAAe,GAAG,oBAAoB,GAAG,mBAAmB,CACtF,CAAC;CACL;AAED,eAAO,MAAM,6BAA6B,4FAQvC,kCAAkC,4CA4DpC,CAAC"}
1
+ {"version":3,"file":"DateRangePickerInlineCalendar.d.ts","sourceRoot":"","sources":["../../../../src/components/date-range-picker/DateRangePickerInlineCalendar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,mBAAmB,EAAC,MAAM,gBAAgB,CAAC;AAM/D,OAAO,EAAC,qBAAqB,EAA8B,MAAM,+BAA+B,CAAC;AACjG,OAAO,EAA0B,4BAA4B,EAAC,MAAM,2BAA2B,CAAC;AAEhG,MAAM,MAAM,oBAAoB,GAAG,CAAC,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC,CAAC;AAC9D,MAAM,WAAW,kCACb,SAAQ,IAAI,CAAC,4BAA4B,EAAE,YAAY,GAAG,UAAU,CAAC;IACrE;;OAEG;IACH,YAAY,EAAE,oBAAoB,CAAC;IACnC;;;;OAIG;IACH,OAAO,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,qBAAqB,CAAC,CAAC;IAChD;;OAEG;IACH,kBAAkB,CAAC,EAAE,IAAI,CACrB,mBAAmB,EACnB,OAAO,GAAG,UAAU,GAAG,eAAe,GAAG,oBAAoB,GAAG,mBAAmB,CACtF,CAAC;CACL;AAOD,eAAO,MAAM,6BAA6B,4FAQvC,kCAAkC,4CAoEpC,CAAC"}
@@ -15,10 +15,17 @@ var _jsxruntime = require("react/jsx-runtime");
15
15
  var _core = require("@mantine/core");
16
16
  var _dates = require("@mantine/dates");
17
17
  var _form = require("@mantine/form");
18
+ var _dayjs = /*#__PURE__*/ _interop_require_default._(require("dayjs"));
18
19
  var _button = require("../button");
19
20
  var _DateRangemodulecss = /*#__PURE__*/ _interop_require_default._(require("./DateRange.module.css"));
20
21
  var _DateRangePickerPresetSelect = require("./DateRangePickerPresetSelect");
21
22
  var _EditableDateRangePicker = require("./EditableDateRangePicker");
23
+ var isDateRangePickerValue = function(value) {
24
+ return Array.isArray(value) && value.length === 2;
25
+ };
26
+ var endOfDay = function(value) {
27
+ return value ? (0, _dayjs.default)(value).endOf('day').toDate() : value;
28
+ };
22
29
  var DateRangePickerInlineCalendar = function(param) {
23
30
  var initialRange = param.initialRange, onApply = param.onApply, onCancel = param.onCancel, presets = param.presets, startProps = param.startProps, endProps = param.endProps, rangeCalendarProps = param.rangeCalendarProps;
24
31
  var form = (0, _form.useForm)({
@@ -27,9 +34,18 @@ var DateRangePickerInlineCalendar = function(param) {
27
34
  }
28
35
  });
29
36
  var calendarInputProps = form.getInputProps('dates');
37
+ var onCalendarChange = function(range) {
38
+ var normalized = isDateRangePickerValue(range) && range[1] ? [
39
+ range[0],
40
+ endOfDay(range[1])
41
+ ] : range;
42
+ calendarInputProps.onChange(normalized);
43
+ };
30
44
  var onCalendarApply = function() {
45
+ // In case the user only clicked the start date, but not the end date,
46
+ // assume a single day was meant to be selected.
31
47
  if (!form.values.dates[1]) {
32
- form.values.dates[1] = form.values.dates[0]; // when date range is the same day
48
+ form.values.dates[1] = endOfDay(form.values.dates[0]);
33
49
  }
34
50
  onApply(form.values.dates);
35
51
  };
@@ -71,7 +87,7 @@ var DateRangePickerInlineCalendar = function(param) {
71
87
  /*#__PURE__*/ (0, _jsxruntime.jsx)(_core.Center, {
72
88
  py: "sm",
73
89
  px: "md",
74
- children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_dates.DatePicker, _object_spread._({
90
+ children: /*#__PURE__*/ (0, _jsxruntime.jsx)(_dates.DatePicker, _object_spread_props._(_object_spread._({
75
91
  numberOfColumns: 2,
76
92
  columnsToScroll: 1,
77
93
  type: "range",
@@ -82,7 +98,9 @@ var DateRangePickerInlineCalendar = function(param) {
82
98
  },
83
99
  firstDayOfWeek: 0,
84
100
  allowSingleDateInRange: true
85
- }, rangeCalendarProps, calendarInputProps))
101
+ }, rangeCalendarProps, calendarInputProps), {
102
+ onChange: onCalendarChange
103
+ }))
86
104
  }),
87
105
  /*#__PURE__*/ (0, _jsxruntime.jsxs)(_core.Group, {
88
106
  justify: "right",
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/date-range-picker/DateRangePickerInlineCalendar.tsx"],"sourcesContent":["import {Center, Group, Space} from '@mantine/core';\nimport {DatePicker, DatePickerBaseProps} from '@mantine/dates';\nimport {useForm} from '@mantine/form';\n\nimport {Button} from '../button';\nimport DateRangeClasses from './DateRange.module.css';\nimport {DateRangePickerPreset, DateRangePickerPresetSelect} from './DateRangePickerPresetSelect';\nimport {EditableDateRangePicker, EditableDateRangePickerProps} from './EditableDateRangePicker';\n\nexport type DateRangePickerValue = [Date | null, Date | null];\nexport interface DateRangePickerInlineCalendarProps\n extends Pick<EditableDateRangePickerProps, 'startProps' | 'endProps'> {\n /**\n * Initial selected range\n */\n initialRange: DateRangePickerValue;\n /**\n * Function called when the user applies the new date range\n *\n * @param range the newly selected dates\n */\n onApply: (range: DateRangePickerValue) => void;\n /**\n * Function called when the user click on the cancel button\n */\n onCancel: () => void;\n /**\n * The presets to display\n *\n * @default {}\n * @example\n * {\n * january: {label: 'January', range: [new Date(2022, 0, 1), new Date(2022, 0, 31)]},\n * february: {label: 'February', range: [new Date(2022, 1, 1), new Date(2022, 1, 28)]}\n * }\n */\n presets?: Record<string, DateRangePickerPreset>;\n /**\n * Props for RangeCalendar displayed in the popover\n */\n rangeCalendarProps?: Omit<\n DatePickerBaseProps,\n 'value' | 'onChange' | 'isDateInRange' | 'isDateFirstInRange' | 'isDateLastInRange'\n >;\n}\n\nexport const DateRangePickerInlineCalendar = ({\n initialRange,\n onApply,\n onCancel,\n presets,\n startProps,\n endProps,\n rangeCalendarProps,\n}: DateRangePickerInlineCalendarProps) => {\n const form = useForm({\n initialValues: {\n dates: initialRange,\n },\n });\n const calendarInputProps = form.getInputProps('dates');\n\n const onCalendarApply = () => {\n if (!form.values.dates[1]) {\n form.values.dates[1] = form.values.dates[0]; // when date range is the same day\n }\n onApply(form.values.dates);\n };\n\n return (\n <>\n <Group align=\"center\" gap=\"xs\" grow px=\"md\" py=\"sm\" className={DateRangeClasses.picker}>\n <EditableDateRangePicker\n value={calendarInputProps.value}\n {...calendarInputProps}\n startProps={startProps}\n endProps={endProps}\n />\n {presets ? (\n <>\n <Space w=\"sm\" />\n <DateRangePickerPresetSelect\n value={calendarInputProps.value}\n presets={presets}\n {...calendarInputProps}\n selectProps={{comboboxProps: {withinPortal: false}}}\n />\n </>\n ) : null}\n </Group>\n\n <Center py=\"sm\" px=\"md\">\n <DatePicker\n numberOfColumns={2}\n columnsToScroll={1}\n type=\"range\"\n styles={{day: {textAlign: 'center'}}}\n firstDayOfWeek={0}\n allowSingleDateInRange\n {...rangeCalendarProps}\n {...calendarInputProps}\n />\n </Center>\n\n <Group justify=\"right\" gap=\"xs\" px=\"md\" py=\"sm\" className={DateRangeClasses.save}>\n <Button variant=\"outline\" size=\"xs\" onClick={onCancel}>\n Cancel\n </Button>\n <Button size=\"xs\" onClick={onCalendarApply}>\n Apply\n </Button>\n </Group>\n </>\n );\n};\n"],"names":["DateRangePickerInlineCalendar","initialRange","onApply","onCancel","presets","startProps","endProps","rangeCalendarProps","form","useForm","initialValues","dates","calendarInputProps","getInputProps","onCalendarApply","values","Group","align","gap","grow","px","py","className","DateRangeClasses","picker","EditableDateRangePicker","value","Space","w","DateRangePickerPresetSelect","selectProps","comboboxProps","withinPortal","Center","DatePicker","numberOfColumns","columnsToScroll","type","styles","day","textAlign","firstDayOfWeek","allowSingleDateInRange","justify","save","Button","variant","size","onClick"],"mappings":";;;;+BA8CaA;;;eAAAA;;;;;;;oBA9CsB;qBACW;oBACxB;sBAED;2EACQ;2CACoC;uCACG;AAuC7D,IAAMA,gCAAgC;QACzCC,qBAAAA,cACAC,gBAAAA,SACAC,iBAAAA,UACAC,gBAAAA,SACAC,mBAAAA,YACAC,iBAAAA,UACAC,2BAAAA;IAEA,IAAMC,OAAOC,IAAAA,aAAO,EAAC;QACjBC,eAAe;YACXC,OAAOV;QACX;IACJ;IACA,IAAMW,qBAAqBJ,KAAKK,aAAa,CAAC;IAE9C,IAAMC,kBAAkB;QACpB,IAAI,CAACN,KAAKO,MAAM,CAACJ,KAAK,CAAC,EAAE,EAAE;YACvBH,KAAKO,MAAM,CAACJ,KAAK,CAAC,EAAE,GAAGH,KAAKO,MAAM,CAACJ,KAAK,CAAC,EAAE,EAAE,kCAAkC;QACnF;QACAT,QAAQM,KAAKO,MAAM,CAACJ,KAAK;IAC7B;IAEA,qBACI;;0BACI,sBAACK,WAAK;gBAACC,OAAM;gBAASC,KAAI;gBAAKC,IAAI;gBAACC,IAAG;gBAAKC,IAAG;gBAAKC,WAAWC,2BAAgB,CAACC,MAAM;;kCAClF,qBAACC,gDAAuB;wBACpBC,OAAOd,mBAAmBc,KAAK;uBAC3Bd;wBACJP,YAAYA;wBACZC,UAAUA;;oBAEbF,wBACG;;0CACI,qBAACuB,WAAK;gCAACC,GAAE;;0CACT,qBAACC,wDAA2B;gCACxBH,OAAOd,mBAAmBc,KAAK;gCAC/BtB,SAASA;+BACLQ;gCACJkB,aAAa;oCAACC,eAAe;wCAACC,cAAc;oCAAK;gCAAC;;;yBAG1D;;;0BAGR,qBAACC,YAAM;gBAACZ,IAAG;gBAAKD,IAAG;0BACf,cAAA,qBAACc,iBAAU;oBACPC,iBAAiB;oBACjBC,iBAAiB;oBACjBC,MAAK;oBACLC,QAAQ;wBAACC,KAAK;4BAACC,WAAW;wBAAQ;oBAAC;oBACnCC,gBAAgB;oBAChBC,sBAAsB;mBAClBnC,oBACAK;;0BAIZ,sBAACI,WAAK;gBAAC2B,SAAQ;gBAAQzB,KAAI;gBAAKE,IAAG;gBAAKC,IAAG;gBAAKC,WAAWC,2BAAgB,CAACqB,IAAI;;kCAC5E,qBAACC,cAAM;wBAACC,SAAQ;wBAAUC,MAAK;wBAAKC,SAAS7C;kCAAU;;kCAGvD,qBAAC0C,cAAM;wBAACE,MAAK;wBAAKC,SAASlC;kCAAiB;;;;;;AAM5D"}
1
+ {"version":3,"sources":["../../../../src/components/date-range-picker/DateRangePickerInlineCalendar.tsx"],"sourcesContent":["import {Center, Group, Space} from '@mantine/core';\nimport {DatePicker, DatePickerBaseProps} from '@mantine/dates';\nimport {useForm} from '@mantine/form';\n\nimport dayjs from 'dayjs';\nimport {Button} from '../button';\nimport DateRangeClasses from './DateRange.module.css';\nimport {DateRangePickerPreset, DateRangePickerPresetSelect} from './DateRangePickerPresetSelect';\nimport {EditableDateRangePicker, EditableDateRangePickerProps} from './EditableDateRangePicker';\n\nexport type DateRangePickerValue = [Date | null, Date | null];\nexport interface DateRangePickerInlineCalendarProps\n extends Pick<EditableDateRangePickerProps, 'startProps' | 'endProps'> {\n /**\n * Initial selected range\n */\n initialRange: DateRangePickerValue;\n /**\n * Function called when the user applies the new date range\n *\n * @param range the newly selected dates\n */\n onApply: (range: DateRangePickerValue) => void;\n /**\n * Function called when the user click on the cancel button\n */\n onCancel: () => void;\n /**\n * The presets to display\n *\n * @default {}\n * @example\n * {\n * january: {label: 'January', range: [new Date(2022, 0, 1), new Date(2022, 0, 31)]},\n * february: {label: 'February', range: [new Date(2022, 1, 1), new Date(2022, 1, 28)]}\n * }\n */\n presets?: Record<string, DateRangePickerPreset>;\n /**\n * Props for RangeCalendar displayed in the popover\n */\n rangeCalendarProps?: Omit<\n DatePickerBaseProps,\n 'value' | 'onChange' | 'isDateInRange' | 'isDateFirstInRange' | 'isDateLastInRange'\n >;\n}\n\nconst isDateRangePickerValue = (value: unknown): value is DateRangePickerValue =>\n Array.isArray(value) && value.length === 2;\n\nconst endOfDay = (value: Date): Date => (value ? dayjs(value).endOf('day').toDate() : value);\n\nexport const DateRangePickerInlineCalendar = ({\n initialRange,\n onApply,\n onCancel,\n presets,\n startProps,\n endProps,\n rangeCalendarProps,\n}: DateRangePickerInlineCalendarProps) => {\n const form = useForm({\n initialValues: {\n dates: initialRange,\n },\n });\n const calendarInputProps = form.getInputProps('dates');\n\n const onCalendarChange = (range: Date | Date[] | DateRangePickerValue): void => {\n const normalized = isDateRangePickerValue(range) && range[1] ? [range[0], endOfDay(range[1])] : range;\n calendarInputProps.onChange(normalized);\n };\n\n const onCalendarApply = () => {\n // In case the user only clicked the start date, but not the end date,\n // assume a single day was meant to be selected.\n if (!form.values.dates[1]) {\n form.values.dates[1] = endOfDay(form.values.dates[0]);\n }\n onApply(form.values.dates);\n };\n\n return (\n <>\n <Group align=\"center\" gap=\"xs\" grow px=\"md\" py=\"sm\" className={DateRangeClasses.picker}>\n <EditableDateRangePicker\n value={calendarInputProps.value}\n {...calendarInputProps}\n startProps={startProps}\n endProps={endProps}\n />\n {presets ? (\n <>\n <Space w=\"sm\" />\n <DateRangePickerPresetSelect\n value={calendarInputProps.value}\n presets={presets}\n {...calendarInputProps}\n selectProps={{comboboxProps: {withinPortal: false}}}\n />\n </>\n ) : null}\n </Group>\n\n <Center py=\"sm\" px=\"md\">\n <DatePicker\n numberOfColumns={2}\n columnsToScroll={1}\n type=\"range\"\n styles={{day: {textAlign: 'center'}}}\n firstDayOfWeek={0}\n allowSingleDateInRange\n {...rangeCalendarProps}\n {...calendarInputProps}\n onChange={onCalendarChange}\n />\n </Center>\n\n <Group justify=\"right\" gap=\"xs\" px=\"md\" py=\"sm\" className={DateRangeClasses.save}>\n <Button variant=\"outline\" size=\"xs\" onClick={onCancel}>\n Cancel\n </Button>\n <Button size=\"xs\" onClick={onCalendarApply}>\n Apply\n </Button>\n </Group>\n </>\n );\n};\n"],"names":["DateRangePickerInlineCalendar","isDateRangePickerValue","value","Array","isArray","length","endOfDay","dayjs","endOf","toDate","initialRange","onApply","onCancel","presets","startProps","endProps","rangeCalendarProps","form","useForm","initialValues","dates","calendarInputProps","getInputProps","onCalendarChange","range","normalized","onChange","onCalendarApply","values","Group","align","gap","grow","px","py","className","DateRangeClasses","picker","EditableDateRangePicker","Space","w","DateRangePickerPresetSelect","selectProps","comboboxProps","withinPortal","Center","DatePicker","numberOfColumns","columnsToScroll","type","styles","day","textAlign","firstDayOfWeek","allowSingleDateInRange","justify","save","Button","variant","size","onClick"],"mappings":";;;;+BAoDaA;;;eAAAA;;;;;;;oBApDsB;qBACW;oBACxB;8DAEJ;sBACG;2EACQ;2CACoC;uCACG;AAuCpE,IAAMC,yBAAyB,SAACC;WAC5BC,MAAMC,OAAO,CAACF,UAAUA,MAAMG,MAAM,KAAK;;AAE7C,IAAMC,WAAW,SAACJ;WAAuBA,QAAQK,IAAAA,cAAK,EAACL,OAAOM,KAAK,CAAC,OAAOC,MAAM,KAAKP;;AAE/E,IAAMF,gCAAgC;QACzCU,qBAAAA,cACAC,gBAAAA,SACAC,iBAAAA,UACAC,gBAAAA,SACAC,mBAAAA,YACAC,iBAAAA,UACAC,2BAAAA;IAEA,IAAMC,OAAOC,IAAAA,aAAO,EAAC;QACjBC,eAAe;YACXC,OAAOV;QACX;IACJ;IACA,IAAMW,qBAAqBJ,KAAKK,aAAa,CAAC;IAE9C,IAAMC,mBAAmB,SAACC;QACtB,IAAMC,aAAaxB,uBAAuBuB,UAAUA,KAAK,CAAC,EAAE,GAAG;YAACA,KAAK,CAAC,EAAE;YAAElB,SAASkB,KAAK,CAAC,EAAE;SAAE,GAAGA;QAChGH,mBAAmBK,QAAQ,CAACD;IAChC;IAEA,IAAME,kBAAkB;QACpB,sEAAsE;QACtE,gDAAgD;QAChD,IAAI,CAACV,KAAKW,MAAM,CAACR,KAAK,CAAC,EAAE,EAAE;YACvBH,KAAKW,MAAM,CAACR,KAAK,CAAC,EAAE,GAAGd,SAASW,KAAKW,MAAM,CAACR,KAAK,CAAC,EAAE;QACxD;QACAT,QAAQM,KAAKW,MAAM,CAACR,KAAK;IAC7B;IAEA,qBACI;;0BACI,sBAACS,WAAK;gBAACC,OAAM;gBAASC,KAAI;gBAAKC,IAAI;gBAACC,IAAG;gBAAKC,IAAG;gBAAKC,WAAWC,2BAAgB,CAACC,MAAM;;kCAClF,qBAACC,gDAAuB;wBACpBpC,OAAOmB,mBAAmBnB,KAAK;uBAC3BmB;wBACJP,YAAYA;wBACZC,UAAUA;;oBAEbF,wBACG;;0CACI,qBAAC0B,WAAK;gCAACC,GAAE;;0CACT,qBAACC,wDAA2B;gCACxBvC,OAAOmB,mBAAmBnB,KAAK;gCAC/BW,SAASA;+BACLQ;gCACJqB,aAAa;oCAACC,eAAe;wCAACC,cAAc;oCAAK;gCAAC;;;yBAG1D;;;0BAGR,qBAACC,YAAM;gBAACX,IAAG;gBAAKD,IAAG;0BACf,cAAA,qBAACa,iBAAU;oBACPC,iBAAiB;oBACjBC,iBAAiB;oBACjBC,MAAK;oBACLC,QAAQ;wBAACC,KAAK;4BAACC,WAAW;wBAAQ;oBAAC;oBACnCC,gBAAgB;oBAChBC,sBAAsB;mBAClBtC,oBACAK;oBACJK,UAAUH;;;0BAIlB,sBAACM,WAAK;gBAAC0B,SAAQ;gBAAQxB,KAAI;gBAAKE,IAAG;gBAAKC,IAAG;gBAAKC,WAAWC,2BAAgB,CAACoB,IAAI;;kCAC5E,qBAACC,cAAM;wBAACC,SAAQ;wBAAUC,MAAK;wBAAKC,SAAShD;kCAAU;;kCAGvD,qBAAC6C,cAAM;wBAACE,MAAK;wBAAKC,SAASjC;kCAAiB;;;;;;AAM5D"}
@@ -1,9 +1,9 @@
1
1
  import { type ExpandedState, type PaginationState, type SortingState } from '@tanstack/table-core';
2
2
  import { Dispatch, SetStateAction } from 'react';
3
3
  import { type DateRangePickerValue } from '../date-range-picker';
4
- type PartialDeep<T> = T extends object ? {
5
- [P in keyof T]?: PartialDeep<T[P]>;
6
- } : T;
4
+ type DeepPartial<T> = {
5
+ [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];
6
+ };
7
7
  export interface TableState<TData = unknown> {
8
8
  /**
9
9
  * Current pagination state
@@ -156,7 +156,7 @@ export interface UseTableOptions<TData = unknown> {
156
156
  /**
157
157
  * Initial state of the table.
158
158
  */
159
- initialState?: PartialDeep<TableState<TData>>;
159
+ initialState?: DeepPartial<TableState<TData>>;
160
160
  /**
161
161
  * Whether rows can be selected.
162
162
  *
@@ -176,6 +176,12 @@ export interface UseTableOptions<TData = unknown> {
176
176
  * @default false
177
177
  */
178
178
  forceSelection?: boolean;
179
+ /**
180
+ * Whether to sync the table state with the URL.
181
+ *
182
+ * @default false
183
+ */
184
+ syncWithUrl?: boolean;
179
185
  }
180
186
  export declare const useTable: <TData>(userOptions?: UseTableOptions<TData>) => TableStore<TData>;
181
187
  export {};
@@ -1 +1 @@
1
- {"version":3,"file":"use-table.d.ts","sourceRoot":"","sources":["../../../../src/components/table/use-table.ts"],"names":[],"mappings":"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"}
1
+ {"version":3,"file":"use-table.d.ts","sourceRoot":"","sources":["../../../../src/components/table/use-table.ts"],"names":[],"mappings":"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"}
@@ -14,10 +14,12 @@ var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
14
14
  var _hooks = require("@mantine/hooks");
15
15
  var _lodashdefaultsdeep = /*#__PURE__*/ _interop_require_default._(require("lodash.defaultsdeep"));
16
16
  var _react = require("react");
17
+ var _useurlsyncedstate = require("./use-url-synced-state");
17
18
  var defaultOptions = {
18
19
  enableRowSelection: true,
19
20
  enableMultiRowSelection: false,
20
- forceSelection: false
21
+ forceSelection: false,
22
+ syncWithUrl: false
21
23
  };
22
24
  var defaultState = {
23
25
  pagination: {
@@ -40,17 +42,187 @@ var useTable = function() {
40
42
  var userOptions = arguments.length > 0 && arguments[0] !== void 0 ? arguments[0] : {};
41
43
  var options = (0, _lodashdefaultsdeep.default)({}, userOptions, defaultOptions);
42
44
  var initialState = (0, _lodashdefaultsdeep.default)({}, options.initialState, defaultState);
43
- var _useState = _sliced_to_array._((0, _react.useState)(initialState.pagination), 2), pagination = _useState[0], setPagination = _useState[1];
44
- var _useState1 = _sliced_to_array._((0, _react.useState)(initialState.totalEntries), 2), totalEntries = _useState1[0], _setTotalEntries = _useState1[1];
45
- var _useState2 = _sliced_to_array._((0, _react.useState)(initialState.totalEntries), 2), unfilteredTotalEntries = _useState2[0], setUnfilteredTotalEntries = _useState2[1];
46
- var _useState3 = _sliced_to_array._((0, _react.useState)(initialState.sorting), 2), sorting = _useState3[0], setSorting = _useState3[1];
47
- var _useState4 = _sliced_to_array._((0, _react.useState)(initialState.globalFilter), 2), globalFilter = _useState4[0], setGlobalFilter = _useState4[1];
48
- var _useState5 = _sliced_to_array._((0, _react.useState)(initialState.expanded), 2), expanded = _useState5[0], setExpanded = _useState5[1];
49
- var _useState6 = _sliced_to_array._((0, _react.useState)(initialState.predicates), 2), predicates = _useState6[0], setPredicates = _useState6[1];
50
- var _useState7 = _sliced_to_array._((0, _react.useState)(initialState.layout), 2), layout = _useState7[0], setLayout = _useState7[1];
51
- var _useState8 = _sliced_to_array._((0, _react.useState)(initialState.dateRange), 2), dateRange = _useState8[0], setDateRange = _useState8[1];
52
- var _useState9 = _sliced_to_array._((0, _react.useState)(initialState.rowSelection), 2), rowSelection = _useState9[0], setRowSelection = _useState9[1];
53
- var _useState10 = _sliced_to_array._((0, _react.useState)(initialState.columnVisibility), 2), columnVisibility = _useState10[0], setColumnVisibility = _useState10[1];
45
+ // synced with url
46
+ var _useUrlSyncedState = _sliced_to_array._((0, _useurlsyncedstate.useUrlSyncedState)({
47
+ initialState: initialState.pagination,
48
+ serializer: function(param) {
49
+ var pageIndex = param.pageIndex, pageSize = param.pageSize;
50
+ return [
51
+ [
52
+ 'page',
53
+ (pageIndex + 1).toString()
54
+ ],
55
+ [
56
+ 'pageSize',
57
+ pageSize.toString()
58
+ ]
59
+ ];
60
+ },
61
+ deserializer: function(params) {
62
+ return (0, _lodashdefaultsdeep.default)({
63
+ pageIndex: params.get('page') ? parseInt(params.get('page'), 10) - 1 : undefined,
64
+ pageSize: params.get('pageSize') ? parseInt(params.get('pageSize'), 10) : undefined
65
+ }, initialState.pagination);
66
+ },
67
+ sync: options.syncWithUrl
68
+ }), 2), pagination = _useUrlSyncedState[0], setPagination = _useUrlSyncedState[1];
69
+ var _useUrlSyncedState1 = _sliced_to_array._((0, _useurlsyncedstate.useUrlSyncedState)({
70
+ initialState: initialState.sorting,
71
+ serializer: function(_sorting) {
72
+ return [
73
+ [
74
+ 'sortBy',
75
+ _sorting.map(function(param) {
76
+ var id = param.id, desc = param.desc;
77
+ return "".concat(id, ".").concat(desc ? 'desc' : 'asc');
78
+ }).join(',')
79
+ ]
80
+ ];
81
+ },
82
+ deserializer: function(params) {
83
+ var _params_get;
84
+ if (!params.has('sortBy')) {
85
+ return initialState.sorting;
86
+ }
87
+ var _params_get_split;
88
+ var sorts = (_params_get_split = (_params_get = params.get('sortBy')) === null || _params_get === void 0 ? void 0 : _params_get.split(',')) !== null && _params_get_split !== void 0 ? _params_get_split : [];
89
+ return sorts.map(function(sort) {
90
+ var _sort_split = _sliced_to_array._(sort.split('.'), 2), id = _sort_split[0], order = _sort_split[1];
91
+ return {
92
+ id: id,
93
+ desc: order === 'desc'
94
+ };
95
+ });
96
+ },
97
+ sync: options.syncWithUrl
98
+ }), 2), sorting = _useUrlSyncedState1[0], setSorting = _useUrlSyncedState1[1];
99
+ var _useUrlSyncedState2 = _sliced_to_array._((0, _useurlsyncedstate.useUrlSyncedState)({
100
+ initialState: initialState.globalFilter,
101
+ serializer: function(filter) {
102
+ return [
103
+ [
104
+ 'filter',
105
+ filter
106
+ ]
107
+ ];
108
+ },
109
+ deserializer: function(params) {
110
+ var _params_get;
111
+ return (_params_get = params.get('filter')) !== null && _params_get !== void 0 ? _params_get : initialState.globalFilter;
112
+ },
113
+ sync: options.syncWithUrl
114
+ }), 2), globalFilter = _useUrlSyncedState2[0], setGlobalFilter = _useUrlSyncedState2[1];
115
+ var _useUrlSyncedState3 = _sliced_to_array._((0, _useurlsyncedstate.useUrlSyncedState)({
116
+ initialState: initialState.predicates,
117
+ serializer: function(_predicates) {
118
+ return Object.entries(_predicates).map(function(param) {
119
+ var _param = _sliced_to_array._(param, 2), key = _param[0], value = _param[1];
120
+ return [
121
+ key,
122
+ value
123
+ ];
124
+ });
125
+ },
126
+ deserializer: function(params) {
127
+ return Object.keys(initialState.predicates).reduce(function(acc, predicateKey) {
128
+ var _params_get;
129
+ acc[predicateKey] = (_params_get = params.get(predicateKey)) !== null && _params_get !== void 0 ? _params_get : initialState.predicates[predicateKey];
130
+ return acc;
131
+ }, {});
132
+ },
133
+ sync: options.syncWithUrl
134
+ }), 2), predicates = _useUrlSyncedState3[0], setPredicates = _useUrlSyncedState3[1];
135
+ var _useUrlSyncedState4 = _sliced_to_array._((0, _useurlsyncedstate.useUrlSyncedState)({
136
+ initialState: initialState.layout,
137
+ serializer: function(_layout) {
138
+ return [
139
+ [
140
+ 'layout',
141
+ _layout
142
+ ]
143
+ ];
144
+ },
145
+ deserializer: function(params) {
146
+ var _params_get;
147
+ return (_params_get = params.get('layout')) !== null && _params_get !== void 0 ? _params_get : initialState.layout;
148
+ },
149
+ sync: options.syncWithUrl
150
+ }), 2), layout = _useUrlSyncedState4[0], setLayout = _useUrlSyncedState4[1];
151
+ var _useUrlSyncedState5 = _sliced_to_array._((0, _useurlsyncedstate.useUrlSyncedState)({
152
+ initialState: initialState.dateRange,
153
+ serializer: function(param) {
154
+ var _param = _sliced_to_array._(param, 2), from = _param[0], to = _param[1];
155
+ var _from_toISOString, _to_toISOString;
156
+ return [
157
+ [
158
+ 'from',
159
+ (_from_toISOString = from === null || from === void 0 ? void 0 : from.toISOString()) !== null && _from_toISOString !== void 0 ? _from_toISOString : ''
160
+ ],
161
+ [
162
+ 'to',
163
+ (_to_toISOString = to === null || to === void 0 ? void 0 : to.toISOString()) !== null && _to_toISOString !== void 0 ? _to_toISOString : ''
164
+ ]
165
+ ];
166
+ },
167
+ deserializer: function(params) {
168
+ return [
169
+ params.get('from') ? new Date(params.get('from')) : initialState.dateRange[0],
170
+ params.get('to') ? new Date(params.get('to')) : initialState.dateRange[1]
171
+ ];
172
+ },
173
+ sync: options.syncWithUrl
174
+ }), 2), dateRange = _useUrlSyncedState5[0], setDateRange = _useUrlSyncedState5[1];
175
+ var _useUrlSyncedState6 = _sliced_to_array._((0, _useurlsyncedstate.useUrlSyncedState)({
176
+ initialState: initialState.columnVisibility,
177
+ serializer: function(columns) {
178
+ return [
179
+ [
180
+ 'show',
181
+ Object.entries(columns).filter(function(param) {
182
+ var _param = _sliced_to_array._(param, 2), visible = _param[1];
183
+ return visible === true;
184
+ }).map(function(param) {
185
+ var _param = _sliced_to_array._(param, 1), columnName = _param[0];
186
+ return columnName;
187
+ }).join(',')
188
+ ],
189
+ [
190
+ 'hide',
191
+ Object.entries(columns).filter(function(param) {
192
+ var _param = _sliced_to_array._(param, 2), visible = _param[1];
193
+ return visible === false;
194
+ }).map(function(param) {
195
+ var _param = _sliced_to_array._(param, 1), columnName = _param[0];
196
+ return columnName;
197
+ }).join(',')
198
+ ]
199
+ ];
200
+ },
201
+ deserializer: function(params) {
202
+ var _params_get, _params_get1;
203
+ if (!params.has('show') && !params.has('hide')) {
204
+ return initialState.columnVisibility;
205
+ }
206
+ var _params_get_split;
207
+ var visible = (_params_get_split = (_params_get = params.get('show')) === null || _params_get === void 0 ? void 0 : _params_get.split(',')) !== null && _params_get_split !== void 0 ? _params_get_split : [];
208
+ var _params_get_split1;
209
+ var invisible = (_params_get_split1 = (_params_get1 = params.get('hide')) === null || _params_get1 === void 0 ? void 0 : _params_get1.split(',')) !== null && _params_get_split1 !== void 0 ? _params_get_split1 : [];
210
+ var columns = {};
211
+ visible.forEach(function(column) {
212
+ columns[column] = true;
213
+ });
214
+ invisible.forEach(function(column) {
215
+ columns[column] = false;
216
+ });
217
+ return columns;
218
+ },
219
+ sync: options.syncWithUrl
220
+ }), 2), columnVisibility = _useUrlSyncedState6[0], setColumnVisibility = _useUrlSyncedState6[1];
221
+ // unsynced
222
+ var _useState = _sliced_to_array._((0, _react.useState)(initialState.totalEntries), 2), totalEntries = _useState[0], _setTotalEntries = _useState[1];
223
+ var _useState1 = _sliced_to_array._((0, _react.useState)(initialState.totalEntries), 2), unfilteredTotalEntries = _useState1[0], setUnfilteredTotalEntries = _useState1[1];
224
+ var _useState2 = _sliced_to_array._((0, _react.useState)(initialState.expanded), 2), expanded = _useState2[0], setExpanded = _useState2[1];
225
+ var _useState3 = _sliced_to_array._((0, _react.useState)(initialState.rowSelection), 2), rowSelection = _useState3[0], setRowSelection = _useState3[1];
54
226
  var isFiltered = !!globalFilter || Object.keys(predicates).some(function(predicate) {
55
227
  return !!predicates[predicate];
56
228
  }) || !!(dateRange === null || dateRange === void 0 ? void 0 : dateRange[0]) || !!(dateRange === null || dateRange === void 0 ? void 0 : dateRange[1]);
@@ -1 +1 @@
1
- {"version":3,"sources":["../../../../src/components/table/use-table.ts"],"sourcesContent":["import {useDidUpdate} from '@mantine/hooks';\nimport {type ExpandedState, type PaginationState, type SortingState} from '@tanstack/table-core';\nimport defaultsDeep from 'lodash.defaultsdeep';\nimport {Dispatch, SetStateAction, useCallback, useMemo, useState} from 'react';\nimport {type DateRangePickerValue} from '../date-range-picker';\n\n// Create a deeply optional version of another type\ntype PartialDeep<T> = T extends object\n ? {\n [P in keyof T]?: PartialDeep<T[P]>;\n }\n : T;\n\nexport interface TableState<TData = unknown> {\n /**\n * Current pagination state\n *\n * @default { pageIndex: 0, pageSize: 50 }\n */\n pagination: PaginationState;\n /**\n * Total number of entries in the table.\n * This number is used to calculate the number of pages in the pagination.\n * When null, the number of pages is calculated using the current data length.\n *\n * @default null\n */\n totalEntries: number | null;\n /**\n * Current sorting state\n *\n * @default []\n */\n sorting: SortingState;\n /**\n * Current global filter value\n *\n * @default ''\n */\n globalFilter: string;\n\n /**\n * Current expanded state\n *\n * @default {}\n */\n expanded: ExpandedState;\n /**\n * Predicates and their current value\n *\n * @default {}\n */\n predicates: Record<string, string>;\n /**\n * Layout currently selected. When null, the first layout is used.\n *\n * @default null\n */\n layout: string | null;\n /**\n * Currently selected date range\n *\n * @default [null, null]\n */\n dateRange: DateRangePickerValue;\n /**\n * Currently selected rows\n *\n * @default {}\n */\n rowSelection: Record<string, TData>;\n /**\n * Columns that are currently visible\n *\n * @default {}\n */\n columnVisibility: Record<string, boolean>;\n}\n\nexport interface TableStore<TData = unknown> {\n /**\n * Current state of the table.\n */\n state: TableState<TData>;\n /**\n * Allows to change the pagination state.\n */\n setPagination: Dispatch<SetStateAction<TableState<TData>['pagination']>>;\n /**\n * Allows to change the total number of entries.\n */\n setTotalEntries: Dispatch<SetStateAction<TableState<TData>['totalEntries']>>;\n /**\n * Allows to change the sorting state.\n */\n setSorting: Dispatch<SetStateAction<TableState<TData>['sorting']>>;\n /**\n * Allows to change the global filter value.\n */\n setGlobalFilter: Dispatch<SetStateAction<TableState<TData>['globalFilter']>>;\n /**\n * Allows to change the rows expanded state.\n */\n setExpanded: Dispatch<SetStateAction<TableState<TData>['expanded']>>;\n /**\n * Allows to change the predicates values.\n */\n setPredicates: Dispatch<SetStateAction<TableState<TData>['predicates']>>;\n /**\n * Allows to change the selected layout.\n */\n setLayout: Dispatch<SetStateAction<TableState<TData>['layout']>>;\n /**\n * Allows to change the selected date range.\n */\n setDateRange: Dispatch<SetStateAction<TableState<TData>['dateRange']>>;\n /**\n * Allows to change the current row selection.\n */\n setRowSelection: Dispatch<SetStateAction<TableState<TData>['rowSelection']>>;\n /**\n * Allows to change the visible columns.\n */\n setColumnVisibility: Dispatch<SetStateAction<TableState<TData>['columnVisibility']>>;\n /**\n * Whether the table is currently filtered.\n */\n isFiltered: boolean;\n /**\n * Whether the table has data when unfiltered.\n *\n * This is derived from the totalEntries so make sure you set that number correctly, even if you're using a client side table.\n */\n isVacant: boolean;\n /**\n * Clear currently applied filters.\n */\n clearFilters: () => void;\n /**\n * Deselects all currently selected rows.\n */\n clearRowSelection: () => void;\n /**\n * Get currently selected rows.\n */\n getSelectedRows: () => TData[];\n /**\n * Get currently selected row\n */\n getSelectedRow: () => TData | null;\n /**\n * Whether the user can select multiple rows at the same time.\n */\n multiRowSelectionEnabled: boolean;\n /**\n * Whether rows can be selected.\n */\n rowSelectionEnabled: boolean;\n /**\n * Whether row selection is forced.\n */\n rowSelectionForced: boolean;\n}\n\nexport interface UseTableOptions<TData = unknown> {\n /**\n * Initial state of the table.\n */\n initialState?: PartialDeep<TableState<TData>>;\n /**\n * Whether rows can be selected.\n *\n * @default true\n */\n enableRowSelection?: boolean;\n /**\n * Whether multiple rows can be selected at the same time.\n *\n * @default false\n */\n enableMultiRowSelection?: boolean;\n /**\n * Forces the user to always have one row selected.\n * When activating that setting, a good practice is to have a row already selected in the initial state.\n *\n * @default false\n */\n forceSelection?: boolean;\n}\n\nconst defaultOptions: UseTableOptions = {\n enableRowSelection: true,\n enableMultiRowSelection: false,\n forceSelection: false,\n};\n\nconst defaultState: Partial<TableState> = {\n pagination: {\n pageIndex: 0,\n pageSize: 50,\n },\n totalEntries: null,\n sorting: [],\n globalFilter: '',\n predicates: {},\n layout: null,\n dateRange: [null, null],\n rowSelection: {},\n columnVisibility: {},\n};\n\nexport const useTable = <TData>(userOptions: UseTableOptions<TData> = {}): TableStore<TData> => {\n const options = defaultsDeep({}, userOptions, defaultOptions) as UseTableOptions<TData>;\n const initialState = defaultsDeep({}, options.initialState, defaultState) as TableState<TData>;\n\n const [pagination, setPagination] = useState<TableState<TData>['pagination']>(initialState.pagination);\n const [totalEntries, _setTotalEntries] = useState<TableState<TData>['totalEntries']>(initialState.totalEntries);\n const [unfilteredTotalEntries, setUnfilteredTotalEntries] = useState<TableState<TData>['totalEntries']>(\n initialState.totalEntries,\n );\n const [sorting, setSorting] = useState<TableState<TData>['sorting']>(initialState.sorting);\n const [globalFilter, setGlobalFilter] = useState<TableState<TData>['globalFilter']>(initialState.globalFilter);\n const [expanded, setExpanded] = useState<TableState<TData>['expanded']>(initialState.expanded);\n const [predicates, setPredicates] = useState<TableState<TData>['predicates']>(initialState.predicates);\n const [layout, setLayout] = useState<TableState<TData>['layout']>(initialState.layout);\n const [dateRange, setDateRange] = useState<TableState<TData>['dateRange']>(initialState.dateRange);\n const [rowSelection, setRowSelection] = useState<TableState<TData>['rowSelection']>(initialState.rowSelection);\n const [columnVisibility, setColumnVisibility] = useState<TableState<TData>['columnVisibility']>(\n initialState.columnVisibility,\n );\n\n const isFiltered =\n !!globalFilter ||\n Object.keys(predicates).some((predicate) => !!predicates[predicate]) ||\n !!dateRange?.[0] ||\n !!dateRange?.[1];\n\n const isVacant = unfilteredTotalEntries === 0;\n\n const setTotalEntries: typeof _setTotalEntries = useCallback(\n (updater) => {\n _setTotalEntries((old) => {\n const newTotalEntries = updater instanceof Function ? updater(old) : updater;\n if (!isFiltered) {\n setUnfilteredTotalEntries(newTotalEntries);\n }\n return newTotalEntries;\n });\n },\n [isFiltered],\n );\n\n const clearFilters = useCallback(() => {\n setPredicates(initialState.predicates);\n setGlobalFilter('');\n }, []);\n\n const clearRowSelection = useCallback(() => {\n setRowSelection({});\n }, []);\n\n const getSelectedRows = useCallback(() => Object.values(rowSelection), [rowSelection]);\n\n const getSelectedRow = () => getSelectedRows()[0] ?? null;\n\n useDidUpdate(() => {\n if (!options.enableMultiRowSelection) {\n clearRowSelection();\n }\n }, [globalFilter, pagination, sorting, dateRange, predicates]);\n\n const state = useMemo(\n () => ({\n pagination,\n totalEntries,\n sorting,\n globalFilter,\n expanded,\n predicates,\n layout,\n dateRange,\n rowSelection,\n columnVisibility,\n }),\n [\n pagination,\n totalEntries,\n sorting,\n globalFilter,\n expanded,\n predicates,\n layout,\n dateRange,\n rowSelection,\n columnVisibility,\n ],\n );\n\n return {\n state,\n setPagination,\n setTotalEntries,\n setSorting,\n setGlobalFilter,\n setExpanded,\n setPredicates,\n setLayout,\n setDateRange,\n setRowSelection,\n setColumnVisibility,\n isFiltered,\n isVacant,\n clearFilters,\n clearRowSelection,\n getSelectedRows,\n getSelectedRow,\n rowSelectionEnabled: options.enableRowSelection,\n rowSelectionForced: options.forceSelection,\n multiRowSelectionEnabled: options.enableMultiRowSelection,\n };\n};\n"],"names":["useTable","defaultOptions","enableRowSelection","enableMultiRowSelection","forceSelection","defaultState","pagination","pageIndex","pageSize","totalEntries","sorting","globalFilter","predicates","layout","dateRange","rowSelection","columnVisibility","userOptions","options","defaultsDeep","initialState","useState","setPagination","_setTotalEntries","unfilteredTotalEntries","setUnfilteredTotalEntries","setSorting","setGlobalFilter","expanded","setExpanded","setPredicates","setLayout","setDateRange","setRowSelection","setColumnVisibility","isFiltered","Object","keys","some","predicate","isVacant","setTotalEntries","useCallback","updater","old","newTotalEntries","Function","clearFilters","clearRowSelection","getSelectedRows","values","getSelectedRow","useDidUpdate","state","useMemo","rowSelectionEnabled","rowSelectionForced","multiRowSelectionEnabled"],"mappings":"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"}
1
+ {"version":3,"sources":["../../../../src/components/table/use-table.ts"],"sourcesContent":["import {useDidUpdate} from '@mantine/hooks';\nimport {type ExpandedState, type PaginationState, type SortingState} from '@tanstack/table-core';\nimport defaultsDeep from 'lodash.defaultsdeep';\nimport {Dispatch, SetStateAction, useCallback, useMemo, useState} from 'react';\nimport {type DateRangePickerValue} from '../date-range-picker';\nimport {useUrlSyncedState} from './use-url-synced-state';\n\n// Create a deeply optional version of another type\ntype DeepPartial<T> = {\n [P in keyof T]?: T[P] extends object ? DeepPartial<T[P]> : T[P];\n};\n\nexport interface TableState<TData = unknown> {\n /**\n * Current pagination state\n *\n * @default { pageIndex: 0, pageSize: 50 }\n */\n pagination: PaginationState;\n /**\n * Total number of entries in the table.\n * This number is used to calculate the number of pages in the pagination.\n * When null, the number of pages is calculated using the current data length.\n *\n * @default null\n */\n totalEntries: number | null;\n /**\n * Current sorting state\n *\n * @default []\n */\n sorting: SortingState;\n /**\n * Current global filter value\n *\n * @default ''\n */\n globalFilter: string;\n\n /**\n * Current expanded state\n *\n * @default {}\n */\n expanded: ExpandedState;\n /**\n * Predicates and their current value\n *\n * @default {}\n */\n predicates: Record<string, string>;\n /**\n * Layout currently selected. When null, the first layout is used.\n *\n * @default null\n */\n layout: string | null;\n /**\n * Currently selected date range\n *\n * @default [null, null]\n */\n dateRange: DateRangePickerValue;\n /**\n * Currently selected rows\n *\n * @default {}\n */\n rowSelection: Record<string, TData>;\n /**\n * Columns that are currently visible\n *\n * @default {}\n */\n columnVisibility: Record<string, boolean>;\n}\n\nexport interface TableStore<TData = unknown> {\n /**\n * Current state of the table.\n */\n state: TableState<TData>;\n /**\n * Allows to change the pagination state.\n */\n setPagination: Dispatch<SetStateAction<TableState<TData>['pagination']>>;\n /**\n * Allows to change the total number of entries.\n */\n setTotalEntries: Dispatch<SetStateAction<TableState<TData>['totalEntries']>>;\n /**\n * Allows to change the sorting state.\n */\n setSorting: Dispatch<SetStateAction<TableState<TData>['sorting']>>;\n /**\n * Allows to change the global filter value.\n */\n setGlobalFilter: Dispatch<SetStateAction<TableState<TData>['globalFilter']>>;\n /**\n * Allows to change the rows expanded state.\n */\n setExpanded: Dispatch<SetStateAction<TableState<TData>['expanded']>>;\n /**\n * Allows to change the predicates values.\n */\n setPredicates: Dispatch<SetStateAction<TableState<TData>['predicates']>>;\n /**\n * Allows to change the selected layout.\n */\n setLayout: Dispatch<SetStateAction<TableState<TData>['layout']>>;\n /**\n * Allows to change the selected date range.\n */\n setDateRange: Dispatch<SetStateAction<TableState<TData>['dateRange']>>;\n /**\n * Allows to change the current row selection.\n */\n setRowSelection: Dispatch<SetStateAction<TableState<TData>['rowSelection']>>;\n /**\n * Allows to change the visible columns.\n */\n setColumnVisibility: Dispatch<SetStateAction<TableState<TData>['columnVisibility']>>;\n /**\n * Whether the table is currently filtered.\n */\n isFiltered: boolean;\n /**\n * Whether the table has data when unfiltered.\n *\n * This is derived from the totalEntries so make sure you set that number correctly, even if you're using a client side table.\n */\n isVacant: boolean;\n /**\n * Clear currently applied filters.\n */\n clearFilters: () => void;\n /**\n * Deselects all currently selected rows.\n */\n clearRowSelection: () => void;\n /**\n * Get currently selected rows.\n */\n getSelectedRows: () => TData[];\n /**\n * Get currently selected row\n */\n getSelectedRow: () => TData | null;\n /**\n * Whether the user can select multiple rows at the same time.\n */\n multiRowSelectionEnabled: boolean;\n /**\n * Whether rows can be selected.\n */\n rowSelectionEnabled: boolean;\n /**\n * Whether row selection is forced.\n */\n rowSelectionForced: boolean;\n}\n\nexport interface UseTableOptions<TData = unknown> {\n /**\n * Initial state of the table.\n */\n initialState?: DeepPartial<TableState<TData>>;\n /**\n * Whether rows can be selected.\n *\n * @default true\n */\n enableRowSelection?: boolean;\n /**\n * Whether multiple rows can be selected at the same time.\n *\n * @default false\n */\n enableMultiRowSelection?: boolean;\n /**\n * Forces the user to always have one row selected.\n * When activating that setting, a good practice is to have a row already selected in the initial state.\n *\n * @default false\n */\n forceSelection?: boolean;\n /**\n * Whether to sync the table state with the URL.\n *\n * @default false\n */\n syncWithUrl?: boolean;\n}\n\nconst defaultOptions: UseTableOptions = {\n enableRowSelection: true,\n enableMultiRowSelection: false,\n forceSelection: false,\n syncWithUrl: false,\n};\n\nconst defaultState: Partial<TableState> = {\n pagination: {\n pageIndex: 0,\n pageSize: 50,\n },\n totalEntries: null,\n sorting: [],\n globalFilter: '',\n predicates: {},\n layout: null,\n dateRange: [null, null],\n rowSelection: {},\n columnVisibility: {},\n};\n\nexport const useTable = <TData>(userOptions: UseTableOptions<TData> = {}): TableStore<TData> => {\n const options = defaultsDeep({}, userOptions, defaultOptions) as UseTableOptions<TData>;\n const initialState = defaultsDeep({}, options.initialState, defaultState) as TableState<TData>;\n\n // synced with url\n const [pagination, setPagination] = useUrlSyncedState<TableState<TData>['pagination']>({\n initialState: initialState.pagination,\n serializer: ({pageIndex, pageSize}) => [\n ['page', (pageIndex + 1).toString()],\n ['pageSize', pageSize.toString()],\n ],\n deserializer: (params) =>\n defaultsDeep(\n {\n pageIndex: params.get('page') ? parseInt(params.get('page'), 10) - 1 : undefined,\n pageSize: params.get('pageSize') ? parseInt(params.get('pageSize'), 10) : undefined,\n },\n initialState.pagination,\n ),\n sync: options.syncWithUrl,\n });\n const [sorting, setSorting] = useUrlSyncedState<TableState<TData>['sorting']>({\n initialState: initialState.sorting,\n serializer: (_sorting) => [\n ['sortBy', _sorting.map(({id, desc}) => `${id}.${desc ? 'desc' : 'asc'}`).join(',')],\n ],\n deserializer: (params) => {\n if (!params.has('sortBy')) {\n return initialState.sorting;\n }\n const sorts = params.get('sortBy')?.split(',') ?? [];\n return sorts.map((sort) => {\n const [id, order] = sort.split('.');\n return {id, desc: order === 'desc'};\n });\n },\n sync: options.syncWithUrl,\n });\n const [globalFilter, setGlobalFilter] = useUrlSyncedState<TableState<TData>['globalFilter']>({\n initialState: initialState.globalFilter,\n serializer: (filter) => [['filter', filter]],\n deserializer: (params) => params.get('filter') ?? initialState.globalFilter,\n sync: options.syncWithUrl,\n });\n const [predicates, setPredicates] = useUrlSyncedState<TableState<TData>['predicates']>({\n initialState: initialState.predicates,\n serializer: (_predicates) => Object.entries(_predicates).map(([key, value]) => [key, value]),\n deserializer: (params) =>\n Object.keys(initialState.predicates).reduce(\n (acc, predicateKey) => {\n acc[predicateKey] = params.get(predicateKey) ?? initialState.predicates[predicateKey];\n return acc;\n },\n {} as TableState<TData>['predicates'],\n ),\n sync: options.syncWithUrl,\n });\n const [layout, setLayout] = useUrlSyncedState<TableState<TData>['layout']>({\n initialState: initialState.layout,\n serializer: (_layout) => [['layout', _layout]],\n deserializer: (params) => params.get('layout') ?? initialState.layout,\n sync: options.syncWithUrl,\n });\n const [dateRange, setDateRange] = useUrlSyncedState<TableState<TData>['dateRange']>({\n initialState: initialState.dateRange,\n serializer: ([from, to]) => [\n ['from', from?.toISOString() ?? ''],\n ['to', to?.toISOString() ?? ''],\n ],\n deserializer: (params) => [\n params.get('from') ? new Date(params.get('from') as string) : initialState.dateRange[0],\n params.get('to') ? new Date(params.get('to') as string) : initialState.dateRange[1],\n ],\n sync: options.syncWithUrl,\n });\n const [columnVisibility, setColumnVisibility] = useUrlSyncedState<TableState<TData>['columnVisibility']>({\n initialState: initialState.columnVisibility,\n serializer: (columns) => [\n [\n 'show',\n Object.entries(columns)\n .filter(([, visible]) => visible === true)\n .map(([columnName]) => columnName)\n .join(','),\n ],\n [\n 'hide',\n Object.entries(columns)\n .filter(([, visible]) => visible === false)\n .map(([columnName]) => columnName)\n .join(','),\n ],\n ],\n deserializer: (params) => {\n if (!params.has('show') && !params.has('hide')) {\n return initialState.columnVisibility;\n }\n const visible = params.get('show')?.split(',') ?? [];\n const invisible = params.get('hide')?.split(',') ?? [];\n const columns = {} as TableState<TData>['columnVisibility'];\n visible.forEach((column) => {\n columns[column] = true;\n });\n invisible.forEach((column) => {\n columns[column] = false;\n });\n return columns;\n },\n sync: options.syncWithUrl,\n });\n\n // unsynced\n const [totalEntries, _setTotalEntries] = useState<TableState<TData>['totalEntries']>(initialState.totalEntries);\n const [unfilteredTotalEntries, setUnfilteredTotalEntries] = useState<TableState<TData>['totalEntries']>(\n initialState.totalEntries,\n );\n const [expanded, setExpanded] = useState<TableState<TData>['expanded']>(initialState.expanded);\n const [rowSelection, setRowSelection] = useState<TableState<TData>['rowSelection']>(initialState.rowSelection);\n\n const isFiltered =\n !!globalFilter ||\n Object.keys(predicates).some((predicate) => !!predicates[predicate]) ||\n !!dateRange?.[0] ||\n !!dateRange?.[1];\n\n const isVacant = unfilteredTotalEntries === 0;\n\n const setTotalEntries: typeof _setTotalEntries = useCallback(\n (updater) => {\n _setTotalEntries((old) => {\n const newTotalEntries = updater instanceof Function ? updater(old) : updater;\n if (!isFiltered) {\n setUnfilteredTotalEntries(newTotalEntries);\n }\n return newTotalEntries;\n });\n },\n [isFiltered],\n );\n\n const clearFilters = useCallback(() => {\n setPredicates(initialState.predicates);\n setGlobalFilter('');\n }, []);\n\n const clearRowSelection = useCallback(() => {\n setRowSelection({});\n }, []);\n\n const getSelectedRows = useCallback(() => Object.values(rowSelection), [rowSelection]);\n\n const getSelectedRow = () => getSelectedRows()[0] ?? null;\n\n useDidUpdate(() => {\n if (!options.enableMultiRowSelection) {\n clearRowSelection();\n }\n }, [globalFilter, pagination, sorting, dateRange, predicates]);\n\n const state = useMemo(\n () => ({\n pagination,\n totalEntries,\n sorting,\n globalFilter,\n expanded,\n predicates,\n layout,\n dateRange,\n rowSelection,\n columnVisibility,\n }),\n [\n pagination,\n totalEntries,\n sorting,\n globalFilter,\n expanded,\n predicates,\n layout,\n dateRange,\n rowSelection,\n columnVisibility,\n ],\n );\n\n return {\n state,\n setPagination,\n setTotalEntries,\n setSorting,\n setGlobalFilter,\n setExpanded,\n setPredicates,\n setLayout,\n setDateRange,\n setRowSelection,\n setColumnVisibility,\n isFiltered,\n isVacant,\n clearFilters,\n clearRowSelection,\n getSelectedRows,\n getSelectedRow,\n rowSelectionEnabled: options.enableRowSelection,\n rowSelectionForced: options.forceSelection,\n multiRowSelectionEnabled: options.enableMultiRowSelection,\n };\n};\n"],"names":["useTable","defaultOptions","enableRowSelection","enableMultiRowSelection","forceSelection","syncWithUrl","defaultState","pagination","pageIndex","pageSize","totalEntries","sorting","globalFilter","predicates","layout","dateRange","rowSelection","columnVisibility","userOptions","options","defaultsDeep","initialState","useUrlSyncedState","serializer","toString","deserializer","params","get","parseInt","undefined","sync","setPagination","_sorting","map","id","desc","join","has","sorts","split","sort","order","setSorting","filter","setGlobalFilter","_predicates","Object","entries","key","value","keys","reduce","acc","predicateKey","setPredicates","_layout","setLayout","from","to","toISOString","Date","setDateRange","columns","visible","columnName","invisible","forEach","column","setColumnVisibility","useState","_setTotalEntries","unfilteredTotalEntries","setUnfilteredTotalEntries","expanded","setExpanded","setRowSelection","isFiltered","some","predicate","isVacant","setTotalEntries","useCallback","updater","old","newTotalEntries","Function","clearFilters","clearRowSelection","getSelectedRows","values","getSelectedRow","useDidUpdate","state","useMemo","rowSelectionEnabled","rowSelectionForced","multiRowSelectionEnabled"],"mappings":"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"}
@@ -0,0 +1,29 @@
1
+ export interface UseUrlSyncedStateOptions<T> {
2
+ /**
3
+ * The initial state
4
+ */
5
+ initialState: T;
6
+ /**
7
+ * The serializer function is used to determine how the state is translated to url search parameters.
8
+ * Called each time the state changes.
9
+ * @param stateValue The new state value to serialize.
10
+ * @returns A list of [key, value] to set as url search parameters.
11
+ * @example (filterValue) => [['filter', filterValue]] // ?filter=filterValue
12
+ */
13
+ serializer: (stateValue: T) => Array<[string, string]>;
14
+ /**
15
+ * The deserializer function is used to determine how the url parameters influence the initial state.
16
+ * Called only once when initializing the state.
17
+ * @param params All the search parameters of the current url.
18
+ * @returns The initial state based on the current url.
19
+ * @example (params) => params.get('filter') ?? '',
20
+ */
21
+ deserializer: (params: URLSearchParams) => T;
22
+ /**
23
+ * Whether the state should be synced with the url.
24
+ * When set to false, the hook behaves just like a regular useState hook from react.
25
+ */
26
+ sync?: boolean;
27
+ }
28
+ export declare const useUrlSyncedState: <T>({ initialState, serializer, deserializer, sync }: UseUrlSyncedStateOptions<T>) => readonly [T, import("react").Dispatch<import("react").SetStateAction<T>>];
29
+ //# sourceMappingURL=use-url-synced-state.d.ts.map
@@ -0,0 +1 @@
1
+ {"version":3,"file":"use-url-synced-state.d.ts","sourceRoot":"","sources":["../../../../src/components/table/use-url-synced-state.ts"],"names":[],"mappings":"AAiBA,MAAM,WAAW,wBAAwB,CAAC,CAAC;IACvC;;OAEG;IACH,YAAY,EAAE,CAAC,CAAC;IAChB;;;;;;OAMG;IACH,UAAU,EAAE,CAAC,UAAU,EAAE,CAAC,KAAK,KAAK,CAAC,CAAC,MAAM,EAAE,MAAM,CAAC,CAAC,CAAC;IACvD;;;;;;OAMG;IACH,YAAY,EAAE,CAAC,MAAM,EAAE,eAAe,KAAK,CAAC,CAAC;IAC7C;;;OAGG;IACH,IAAI,CAAC,EAAE,OAAO,CAAC;CAClB;AAED,eAAO,MAAM,iBAAiB,GAAI,CAAC,oDAAkD,wBAAwB,CAAC,CAAC,CAAC,8EAwB/G,CAAC"}
@@ -0,0 +1,58 @@
1
+ "use strict";
2
+ Object.defineProperty(exports, "__esModule", {
3
+ value: true
4
+ });
5
+ Object.defineProperty(exports, "useUrlSyncedState", {
6
+ enumerable: true,
7
+ get: function() {
8
+ return useUrlSyncedState;
9
+ }
10
+ });
11
+ var _instanceof = require("@swc/helpers/_/_instanceof");
12
+ var _sliced_to_array = require("@swc/helpers/_/_sliced_to_array");
13
+ var _react = require("react");
14
+ var setSearchParam = function(key, value, initial) {
15
+ var url = new URL(window.location.href);
16
+ if (value === '' || value === initial) {
17
+ url.searchParams.delete(key);
18
+ } else {
19
+ url.searchParams.set(key, value);
20
+ }
21
+ window.history.replaceState(null, '', url.toString());
22
+ };
23
+ var getSearchParams = function() {
24
+ var url = new URL(window.location.href);
25
+ return url.searchParams;
26
+ };
27
+ var useUrlSyncedState = function(param) {
28
+ var initialState = param.initialState, serializer = param.serializer, deserializer = param.deserializer, sync = param.sync;
29
+ var _useState = _sliced_to_array._((0, _react.useState)(sync ? deserializer(getSearchParams()) : initialState), 2), state = _useState[0], setState = _useState[1];
30
+ var enhancedSetState = (0, _react.useMemo)(function() {
31
+ if (sync) {
32
+ var initialSerialized = serializer(initialState).reduce(function(acc, param) {
33
+ var _param = _sliced_to_array._(param, 2), key = _param[0], value = _param[1];
34
+ acc[key] = value;
35
+ return acc;
36
+ }, {});
37
+ return function(updater) {
38
+ setState(function(old) {
39
+ var newValue = _instanceof._(updater, Function) ? updater(old) : updater;
40
+ serializer(newValue).forEach(function(param) {
41
+ var _param = _sliced_to_array._(param, 2), key = _param[0], value = _param[1];
42
+ return setSearchParam(key, value, initialSerialized[key]);
43
+ });
44
+ return newValue;
45
+ });
46
+ };
47
+ }
48
+ return setState;
49
+ }, [
50
+ sync
51
+ ]);
52
+ return [
53
+ state,
54
+ enhancedSetState
55
+ ];
56
+ };
57
+
58
+ //# sourceMappingURL=use-url-synced-state.js.map
@@ -0,0 +1 @@
1
+ {"version":3,"sources":["../../../../src/components/table/use-url-synced-state.ts"],"sourcesContent":["import {useMemo, useState} from 'react';\n\nconst setSearchParam = (key: string, value: string, initial: string) => {\n const url = new URL(window.location.href);\n if (value === '' || value === initial) {\n url.searchParams.delete(key);\n } else {\n url.searchParams.set(key, value);\n }\n window.history.replaceState(null, '', url.toString());\n};\n\nconst getSearchParams = (): URLSearchParams => {\n const url = new URL(window.location.href);\n return url.searchParams;\n};\n\nexport interface UseUrlSyncedStateOptions<T> {\n /**\n * The initial state\n */\n initialState: T;\n /**\n * The serializer function is used to determine how the state is translated to url search parameters.\n * Called each time the state changes.\n * @param stateValue The new state value to serialize.\n * @returns A list of [key, value] to set as url search parameters.\n * @example (filterValue) => [['filter', filterValue]] // ?filter=filterValue\n */\n serializer: (stateValue: T) => Array<[string, string]>;\n /**\n * The deserializer function is used to determine how the url parameters influence the initial state.\n * Called only once when initializing the state.\n * @param params All the search parameters of the current url.\n * @returns The initial state based on the current url.\n * @example (params) => params.get('filter') ?? '',\n */\n deserializer: (params: URLSearchParams) => T;\n /**\n * Whether the state should be synced with the url.\n * When set to false, the hook behaves just like a regular useState hook from react.\n */\n sync?: boolean;\n}\n\nexport const useUrlSyncedState = <T>({initialState, serializer, deserializer, sync}: UseUrlSyncedStateOptions<T>) => {\n const [state, setState] = useState<T>(sync ? deserializer(getSearchParams()) : initialState);\n const enhancedSetState = useMemo(() => {\n if (sync) {\n const initialSerialized = serializer(initialState).reduce(\n (acc, [key, value]) => {\n acc[key] = value;\n return acc;\n },\n {} as Record<string, string>,\n );\n return (updater: T | ((old: T) => T)) => {\n setState((old) => {\n const newValue = updater instanceof Function ? updater(old) : updater;\n serializer(newValue).forEach(([key, value]) => setSearchParam(key, value, initialSerialized[key]));\n return newValue;\n });\n };\n }\n\n return setState;\n }, [sync]);\n\n return [state, enhancedSetState] as const;\n};\n"],"names":["useUrlSyncedState","setSearchParam","key","value","initial","url","URL","window","location","href","searchParams","delete","set","history","replaceState","toString","getSearchParams","initialState","serializer","deserializer","sync","useState","state","setState","enhancedSetState","useMemo","initialSerialized","reduce","acc","updater","old","newValue","Function","forEach"],"mappings":";;;;+BA6CaA;;;eAAAA;;;;;qBA7CmB;AAEhC,IAAMC,iBAAiB,SAACC,KAAaC,OAAeC;IAChD,IAAMC,MAAM,IAAIC,IAAIC,OAAOC,QAAQ,CAACC,IAAI;IACxC,IAAIN,UAAU,MAAMA,UAAUC,SAAS;QACnCC,IAAIK,YAAY,CAACC,MAAM,CAACT;IAC5B,OAAO;QACHG,IAAIK,YAAY,CAACE,GAAG,CAACV,KAAKC;IAC9B;IACAI,OAAOM,OAAO,CAACC,YAAY,CAAC,MAAM,IAAIT,IAAIU,QAAQ;AACtD;AAEA,IAAMC,kBAAkB;IACpB,IAAMX,MAAM,IAAIC,IAAIC,OAAOC,QAAQ,CAACC,IAAI;IACxC,OAAOJ,IAAIK,YAAY;AAC3B;AA8BO,IAAMV,oBAAoB;QAAKiB,qBAAAA,cAAcC,mBAAAA,YAAYC,qBAAAA,cAAcC,aAAAA;IAC1E,IAA0BC,+BAAAA,IAAAA,eAAQ,EAAID,OAAOD,aAAaH,qBAAqBC,mBAAxEK,QAAmBD,cAAZE,WAAYF;IAC1B,IAAMG,mBAAmBC,IAAAA,cAAO,EAAC;QAC7B,IAAIL,MAAM;YACN,IAAMM,oBAAoBR,WAAWD,cAAcU,MAAM,CACrD,SAACC;2DAAM1B,iBAAKC;gBACRyB,GAAG,CAAC1B,IAAI,GAAGC;gBACX,OAAOyB;YACX,GACA,CAAC;YAEL,OAAO,SAACC;gBACJN,SAAS,SAACO;oBACN,IAAMC,WAAWF,AAAO,aAAYG,CAAnBH,SAAmBG,YAAWH,QAAQC,OAAOD;oBAC9DX,WAAWa,UAAUE,OAAO,CAAC;mEAAE/B,iBAAKC;+BAAWF,eAAeC,KAAKC,OAAOuB,iBAAiB,CAACxB,IAAI;;oBAChG,OAAO6B;gBACX;YACJ;QACJ;QAEA,OAAOR;IACX,GAAG;QAACH;KAAK;IAET,OAAO;QAACE;QAAOE;KAAiB;AACpC"}
@@ -1 +1 @@
1
- {"version":3,"file":"DateRangePickerInlineCalendar.d.ts","sourceRoot":"","sources":["../../../../src/components/date-range-picker/DateRangePickerInlineCalendar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,mBAAmB,EAAC,MAAM,gBAAgB,CAAC;AAK/D,OAAO,EAAC,qBAAqB,EAA8B,MAAM,+BAA+B,CAAC;AACjG,OAAO,EAA0B,4BAA4B,EAAC,MAAM,2BAA2B,CAAC;AAEhG,MAAM,MAAM,oBAAoB,GAAG,CAAC,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC,CAAC;AAC9D,MAAM,WAAW,kCACb,SAAQ,IAAI,CAAC,4BAA4B,EAAE,YAAY,GAAG,UAAU,CAAC;IACrE;;OAEG;IACH,YAAY,EAAE,oBAAoB,CAAC;IACnC;;;;OAIG;IACH,OAAO,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,qBAAqB,CAAC,CAAC;IAChD;;OAEG;IACH,kBAAkB,CAAC,EAAE,IAAI,CACrB,mBAAmB,EACnB,OAAO,GAAG,UAAU,GAAG,eAAe,GAAG,oBAAoB,GAAG,mBAAmB,CACtF,CAAC;CACL;AAED,eAAO,MAAM,6BAA6B,4FAQvC,kCAAkC,4CA4DpC,CAAC"}
1
+ {"version":3,"file":"DateRangePickerInlineCalendar.d.ts","sourceRoot":"","sources":["../../../../src/components/date-range-picker/DateRangePickerInlineCalendar.tsx"],"names":[],"mappings":"AACA,OAAO,EAAa,mBAAmB,EAAC,MAAM,gBAAgB,CAAC;AAM/D,OAAO,EAAC,qBAAqB,EAA8B,MAAM,+BAA+B,CAAC;AACjG,OAAO,EAA0B,4BAA4B,EAAC,MAAM,2BAA2B,CAAC;AAEhG,MAAM,MAAM,oBAAoB,GAAG,CAAC,IAAI,GAAG,IAAI,EAAE,IAAI,GAAG,IAAI,CAAC,CAAC;AAC9D,MAAM,WAAW,kCACb,SAAQ,IAAI,CAAC,4BAA4B,EAAE,YAAY,GAAG,UAAU,CAAC;IACrE;;OAEG;IACH,YAAY,EAAE,oBAAoB,CAAC;IACnC;;;;OAIG;IACH,OAAO,EAAE,CAAC,KAAK,EAAE,oBAAoB,KAAK,IAAI,CAAC;IAC/C;;OAEG;IACH,QAAQ,EAAE,MAAM,IAAI,CAAC;IACrB;;;;;;;;;OASG;IACH,OAAO,CAAC,EAAE,MAAM,CAAC,MAAM,EAAE,qBAAqB,CAAC,CAAC;IAChD;;OAEG;IACH,kBAAkB,CAAC,EAAE,IAAI,CACrB,mBAAmB,EACnB,OAAO,GAAG,UAAU,GAAG,eAAe,GAAG,oBAAoB,GAAG,mBAAmB,CACtF,CAAC;CACL;AAOD,eAAO,MAAM,6BAA6B,4FAQvC,kCAAkC,4CAoEpC,CAAC"}
@@ -2,10 +2,13 @@ import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-run
2
2
  import { Center, Group, Space } from '@mantine/core';
3
3
  import { DatePicker } from '@mantine/dates';
4
4
  import { useForm } from '@mantine/form';
5
+ import dayjs from 'dayjs';
5
6
  import { Button } from '../button';
6
7
  import DateRangeClasses from './DateRange.module.css';
7
8
  import { DateRangePickerPresetSelect } from './DateRangePickerPresetSelect';
8
9
  import { EditableDateRangePicker } from './EditableDateRangePicker';
10
+ const isDateRangePickerValue = (value)=>Array.isArray(value) && value.length === 2;
11
+ const endOfDay = (value)=>value ? dayjs(value).endOf('day').toDate() : value;
9
12
  export const DateRangePickerInlineCalendar = ({ initialRange, onApply, onCancel, presets, startProps, endProps, rangeCalendarProps })=>{
10
13
  const form = useForm({
11
14
  initialValues: {
@@ -13,9 +16,18 @@ export const DateRangePickerInlineCalendar = ({ initialRange, onApply, onCancel,
13
16
  }
14
17
  });
15
18
  const calendarInputProps = form.getInputProps('dates');
19
+ const onCalendarChange = (range)=>{
20
+ const normalized = isDateRangePickerValue(range) && range[1] ? [
21
+ range[0],
22
+ endOfDay(range[1])
23
+ ] : range;
24
+ calendarInputProps.onChange(normalized);
25
+ };
16
26
  const onCalendarApply = ()=>{
27
+ // In case the user only clicked the start date, but not the end date,
28
+ // assume a single day was meant to be selected.
17
29
  if (!form.values.dates[1]) {
18
- form.values.dates[1] = form.values.dates[0]; // when date range is the same day
30
+ form.values.dates[1] = endOfDay(form.values.dates[0]);
19
31
  }
20
32
  onApply(form.values.dates);
21
33
  };
@@ -69,7 +81,8 @@ export const DateRangePickerInlineCalendar = ({ initialRange, onApply, onCancel,
69
81
  firstDayOfWeek: 0,
70
82
  allowSingleDateInRange: true,
71
83
  ...rangeCalendarProps,
72
- ...calendarInputProps
84
+ ...calendarInputProps,
85
+ onChange: onCalendarChange
73
86
  })
74
87
  }),
75
88
  /*#__PURE__*/ _jsxs(Group, {