@povio/ui 3.3.0-rc.4 → 3.3.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 (63) hide show
  1. package/README.md +15 -1
  2. package/dist/components/Breadcrumbs/Breadcrumbs.js +55 -206
  3. package/dist/components/buttons/InlineIconButton/InlineIconButton.js +9 -34
  4. package/dist/components/buttons/shared/ButtonContent.js +22 -80
  5. package/dist/components/inputs/Checkbox/CheckboxCheckmark.js +10 -24
  6. package/dist/components/inputs/DateTime/DatePicker/DatePicker.js +93 -227
  7. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js +84 -202
  8. package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.js +60 -132
  9. package/dist/components/inputs/DateTime/shared/Calendar.js +139 -339
  10. package/dist/components/inputs/DateTime/shared/CalendarCell.js +114 -308
  11. package/dist/components/inputs/DateTime/shared/CalendarGrid.js +35 -150
  12. package/dist/components/inputs/DateTime/shared/CalendarHeader.js +95 -229
  13. package/dist/components/inputs/DateTime/shared/CalendarSelectHeader.js +115 -296
  14. package/dist/components/inputs/DateTime/shared/DateField.js +135 -306
  15. package/dist/components/inputs/DateTime/shared/DatePickerInput.js +140 -338
  16. package/dist/components/inputs/DateTime/shared/DateTimeDialogFooter.js +10 -59
  17. package/dist/components/inputs/File/FileUpload.js +1 -1
  18. package/dist/components/inputs/File/InputUpload.js +65 -261
  19. package/dist/components/inputs/File/shared/FileUploadContentEmpty.js +48 -180
  20. package/dist/components/inputs/File/shared/FileUploadContentError.js +95 -265
  21. package/dist/components/inputs/File/shared/FileUploadContentFilled.js +99 -261
  22. package/dist/components/inputs/File/shared/FileUploadContentLoading.js +56 -234
  23. package/dist/components/inputs/File/shared/ProgressBar.js +15 -102
  24. package/dist/components/inputs/FormField/FormField.js +34 -47
  25. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.js +75 -313
  26. package/dist/components/inputs/Selection/Autocomplete/Autocomplete.js +23 -83
  27. package/dist/components/inputs/Selection/Select/QuerySelect.js +30 -96
  28. package/dist/components/inputs/Selection/Select/Select.js +3 -3
  29. package/dist/components/inputs/Selection/shared/SelectInput.js +1 -0
  30. package/dist/components/inputs/Selection/shared/SelectListBox.js +51 -163
  31. package/dist/components/inputs/Selection/shared/useSelectItems.js +48 -108
  32. package/dist/components/inputs/Skeleton/InputFrame.js +177 -552
  33. package/dist/components/inputs/TextEditor/TextEditor.js +87 -389
  34. package/dist/components/inputs/shared/InputClear.js +24 -40
  35. package/dist/components/navigation/Accordion/Accordion.js +22 -69
  36. package/dist/components/navigation/Accordion/AccordionItem.js +41 -86
  37. package/dist/components/navigation/Stepper/Stepper.js +22 -67
  38. package/dist/components/overlays/ActionModal/ActionModal.js +35 -169
  39. package/dist/components/overlays/ResponsivePopover/ResponsivePopover.js +29 -110
  40. package/dist/components/shared/pagination/Pagination.js +22 -108
  41. package/dist/components/status/Alert/Alert.js +30 -97
  42. package/dist/components/table/InfiniteTable.js +16 -67
  43. package/dist/components/table/Table.d.ts +2 -8
  44. package/dist/components/table/Table.js +33 -55
  45. package/dist/components/text/Typography/Typography.js +8 -23
  46. package/dist/config/confirmation.context.js +1 -1
  47. package/dist/config/theme.context.js +45 -98
  48. package/dist/config/uiConfig.context.js +8 -39
  49. package/dist/config/uiOverrides.context.d.ts +0 -1
  50. package/dist/hooks/useDebounceCallback.js +17 -51
  51. package/dist/hooks/useFormAutosave.js +33 -120
  52. package/dist/hooks/useLongPressRepeat.js +20 -55
  53. package/dist/index.d.ts +0 -1
  54. package/dist/index.js +1 -2
  55. package/package.json +2 -2
  56. package/dist/components/inputs/FormField/formField.cva.d.ts +0 -11
  57. package/dist/components/inputs/FormField/formField.cva.js +0 -16
  58. package/dist/components/table/TableColumnFilterInput.d.ts +0 -9
  59. package/dist/components/table/TableColumnFilterInput.js +0 -108
  60. package/dist/components/table/TableColumnFilterPlaceholder.d.ts +0 -5
  61. package/dist/components/table/TableColumnFilterPlaceholder.js +0 -41
  62. package/dist/components/table/TableColumnFilterRow.d.ts +0 -16
  63. package/dist/components/table/TableColumnFilterRow.js +0 -68
@@ -2,125 +2,44 @@ import { UIOverrides } from "../../../config/uiOverrides.context.js";
2
2
  import { BottomSheet } from "../BottomSheet/BottomSheet.js";
3
3
  import { useBreakpoint } from "../../../hooks/useBreakpoint.js";
4
4
  import { popoverDefinition } from "../../shared/popover.cva.js";
5
- import { c } from "react/compiler-runtime";
6
5
  import { jsx, jsxs } from "react/jsx-runtime";
7
6
  import { clsx } from "clsx";
8
7
  import { Dialog, DialogTrigger, Popover } from "react-aria-components";
9
8
  //#region src/components/overlays/ResponsivePopover/ResponsivePopover.tsx
10
- var ResponsivePopover = (t0) => {
11
- const $ = c(33);
12
- const { trigger, isOpen, onOpenChange, children, popoverClassName, sheetLabel, bottomSheetProps, popoverProps } = t0;
9
+ var ResponsivePopover = ({ trigger, isOpen, onOpenChange, children, popoverClassName, sheetLabel, bottomSheetProps, popoverProps }) => {
13
10
  const popoverCva = UIOverrides.useCva("popover.cva", popoverDefinition);
14
11
  const isDesktop = useBreakpoint("md");
15
- let t1;
16
- if ($[0] !== popoverProps) {
17
- t1 = popoverProps ?? {};
18
- $[0] = popoverProps;
19
- $[1] = t1;
20
- } else t1 = $[1];
21
- let restPopoverProps;
22
- let t2;
23
- let t3;
24
- if ($[2] !== t1) {
25
- ({offset: t2, placement: t3, ...restPopoverProps} = t1);
26
- $[2] = t1;
27
- $[3] = restPopoverProps;
28
- $[4] = t2;
29
- $[5] = t3;
30
- } else {
31
- restPopoverProps = $[3];
32
- t2 = $[4];
33
- t3 = $[5];
34
- }
35
- const offset = t2 === void 0 ? 0 : t2;
36
- const placement = t3 === void 0 ? "bottom start" : t3;
37
- if (!isDesktop) {
38
- let t4;
39
- if ($[6] !== children) {
40
- t4 = /* @__PURE__ */ jsx("div", {
41
- className: "p-4",
42
- children
43
- });
44
- $[6] = children;
45
- $[7] = t4;
46
- } else t4 = $[7];
47
- let t5;
48
- if ($[8] !== bottomSheetProps || $[9] !== isOpen || $[10] !== onOpenChange || $[11] !== sheetLabel || $[12] !== t4 || $[13] !== trigger) {
49
- t5 = /* @__PURE__ */ jsx(BottomSheet, {
50
- height: "auto",
51
- isDismissable: true,
52
- label: sheetLabel,
53
- ...bottomSheetProps,
54
- isOpen,
55
- onOpenChange,
56
- trigger,
57
- children: t4
58
- });
59
- $[8] = bottomSheetProps;
60
- $[9] = isOpen;
61
- $[10] = onOpenChange;
62
- $[11] = sheetLabel;
63
- $[12] = t4;
64
- $[13] = trigger;
65
- $[14] = t5;
66
- } else t5 = $[14];
67
- return t5;
68
- }
69
- let t4;
70
- if ($[15] !== popoverClassName) {
71
- t4 = clsx("my-4 outline-none", popoverClassName);
72
- $[15] = popoverClassName;
73
- $[16] = t4;
74
- } else t4 = $[16];
75
- let t5;
76
- if ($[17] !== popoverCva) {
77
- t5 = clsx(popoverCva({}), "overflow-hidden p-2");
78
- $[17] = popoverCva;
79
- $[18] = t5;
80
- } else t5 = $[18];
81
- let t6;
82
- if ($[19] !== children || $[20] !== t5) {
83
- t6 = /* @__PURE__ */ jsx(Dialog, {
84
- className: "outline-none",
85
- children: /* @__PURE__ */ jsx("div", {
86
- className: t5,
87
- children
88
- })
89
- });
90
- $[19] = children;
91
- $[20] = t5;
92
- $[21] = t6;
93
- } else t6 = $[21];
94
- let t7;
95
- if ($[22] !== offset || $[23] !== placement || $[24] !== restPopoverProps || $[25] !== t4 || $[26] !== t6) {
96
- t7 = /* @__PURE__ */ jsx(Popover, {
12
+ const { offset = 0, placement = "bottom start", ...restPopoverProps } = popoverProps ?? {};
13
+ if (!isDesktop) return /* @__PURE__ */ jsx(BottomSheet, {
14
+ height: "auto",
15
+ isDismissable: true,
16
+ label: sheetLabel,
17
+ ...bottomSheetProps,
18
+ isOpen,
19
+ onOpenChange,
20
+ trigger,
21
+ children: /* @__PURE__ */ jsx("div", {
22
+ className: "p-4",
23
+ children
24
+ })
25
+ });
26
+ return /* @__PURE__ */ jsxs(DialogTrigger, {
27
+ isOpen,
28
+ onOpenChange,
29
+ children: [trigger, /* @__PURE__ */ jsx(Popover, {
97
30
  ...restPopoverProps,
98
- className: t4,
31
+ className: clsx("my-4 outline-none", popoverClassName),
99
32
  offset,
100
33
  placement,
101
- children: t6
102
- });
103
- $[22] = offset;
104
- $[23] = placement;
105
- $[24] = restPopoverProps;
106
- $[25] = t4;
107
- $[26] = t6;
108
- $[27] = t7;
109
- } else t7 = $[27];
110
- let t8;
111
- if ($[28] !== isOpen || $[29] !== onOpenChange || $[30] !== t7 || $[31] !== trigger) {
112
- t8 = /* @__PURE__ */ jsxs(DialogTrigger, {
113
- isOpen,
114
- onOpenChange,
115
- children: [trigger, t7]
116
- });
117
- $[28] = isOpen;
118
- $[29] = onOpenChange;
119
- $[30] = t7;
120
- $[31] = trigger;
121
- $[32] = t8;
122
- } else t8 = $[32];
123
- return t8;
34
+ children: /* @__PURE__ */ jsx(Dialog, {
35
+ className: "outline-none",
36
+ children: /* @__PURE__ */ jsx("div", {
37
+ className: clsx(popoverCva({}), "overflow-hidden p-2"),
38
+ children
39
+ })
40
+ })
41
+ })]
42
+ });
124
43
  };
125
44
  //#endregion
126
45
  export { ResponsivePopover };
@@ -2,31 +2,16 @@ import { Typography } from "../../text/Typography/Typography.js";
2
2
  import "../../../config/i18n.js";
3
3
  import { NumberInput } from "../../inputs/Input/NumberInput/NumberInput.js";
4
4
  import { PaginationList } from "./PaginationList.js";
5
- import { c } from "react/compiler-runtime";
6
5
  import { jsx, jsxs } from "react/jsx-runtime";
7
6
  import { clsx } from "clsx";
8
7
  import { useTranslation } from "react-i18next";
9
8
  //#region src/components/shared/pagination/Pagination.tsx
10
- var Pagination = (t0) => {
11
- const $ = c(34);
12
- const { size: t1, variant: t2, color: t3, page, totalItems, totalPages, pageSize, hideText: t4, hideFirstLast: t5, hidePrevNext: t6, hideNumbers: t7, className, onPageChange, onPageSizeChange } = t0;
13
- const size = t1 === void 0 ? "s" : t1;
14
- const variant = t2 === void 0 ? "subtle" : t2;
15
- const color = t3 === void 0 ? "secondary" : t3;
16
- const hideText = t4 === void 0 ? true : t4;
17
- const hideFirstLast = t5 === void 0 ? true : t5;
18
- const hidePrevNext = t6 === void 0 ? false : t6;
19
- const hideNumbers = t7 === void 0 ? false : t7;
9
+ var Pagination = ({ size = "s", variant = "subtle", color = "secondary", page, totalItems, totalPages, pageSize, hideText = true, hideFirstLast = true, hidePrevNext = false, hideNumbers = false, className, onPageChange, onPageSizeChange }) => {
20
10
  const { t } = useTranslation("ui");
21
- let t8;
22
- if ($[0] !== className) {
23
- t8 = clsx("flex items-center gap-2", className);
24
- $[0] = className;
25
- $[1] = t8;
26
- } else t8 = $[1];
27
- let t9;
28
- if ($[2] !== color || $[3] !== hideFirstLast || $[4] !== hideNumbers || $[5] !== hidePrevNext || $[6] !== hideText || $[7] !== onPageChange || $[8] !== page || $[9] !== pageSize || $[10] !== size || $[11] !== totalItems || $[12] !== totalPages || $[13] !== variant) {
29
- t9 = totalItems > pageSize && /* @__PURE__ */ jsx(PaginationList, {
11
+ return /* @__PURE__ */ jsxs("nav", {
12
+ id: "pagination",
13
+ className: clsx("flex items-center gap-2", className),
14
+ children: [totalItems > pageSize && /* @__PURE__ */ jsx(PaginationList, {
30
15
  page,
31
16
  size,
32
17
  color,
@@ -37,95 +22,24 @@ var Pagination = (t0) => {
37
22
  hideNumbers,
38
23
  totalPages: totalPages ?? Math.ceil(totalItems / pageSize),
39
24
  onPageChange
40
- });
41
- $[2] = color;
42
- $[3] = hideFirstLast;
43
- $[4] = hideNumbers;
44
- $[5] = hidePrevNext;
45
- $[6] = hideText;
46
- $[7] = onPageChange;
47
- $[8] = page;
48
- $[9] = pageSize;
49
- $[10] = size;
50
- $[11] = totalItems;
51
- $[12] = totalPages;
52
- $[13] = variant;
53
- $[14] = t9;
54
- } else t9 = $[14];
55
- let t10;
56
- if ($[15] !== t) {
57
- t10 = t(_temp);
58
- $[15] = t;
59
- $[16] = t10;
60
- } else t10 = $[16];
61
- let t11;
62
- if ($[17] !== t10) {
63
- t11 = /* @__PURE__ */ jsx(Typography, {
64
- variant: "default",
65
- size: "label-2",
66
- as: "span",
67
- className: "whitespace-nowrap text-text-default-1",
68
- children: t10
69
- });
70
- $[17] = t10;
71
- $[18] = t11;
72
- } else t11 = $[18];
73
- let t12;
74
- if ($[19] !== onPageSizeChange) {
75
- t12 = (value) => onPageSizeChange?.(Number(value));
76
- $[19] = onPageSizeChange;
77
- $[20] = t12;
78
- } else t12 = $[20];
79
- let t13;
80
- if ($[21] !== t) {
81
- t13 = t(_temp2);
82
- $[21] = t;
83
- $[22] = t13;
84
- } else t13 = $[22];
85
- let t14;
86
- if ($[23] !== pageSize || $[24] !== t12 || $[25] !== t13) {
87
- t14 = /* @__PURE__ */ jsx(NumberInput, {
88
- value: pageSize,
89
- onChange: t12,
90
- label: t13,
91
- hideLabel: true,
92
- className: "w-min",
93
- inputClassName: "min-w-12 !px-3 !py-0-5"
94
- });
95
- $[23] = pageSize;
96
- $[24] = t12;
97
- $[25] = t13;
98
- $[26] = t14;
99
- } else t14 = $[26];
100
- let t15;
101
- if ($[27] !== t11 || $[28] !== t14) {
102
- t15 = /* @__PURE__ */ jsxs("div", {
25
+ }), /* @__PURE__ */ jsxs("div", {
103
26
  className: "flex items-center gap-2",
104
- children: [t11, t14]
105
- });
106
- $[27] = t11;
107
- $[28] = t14;
108
- $[29] = t15;
109
- } else t15 = $[29];
110
- let t16;
111
- if ($[30] !== t15 || $[31] !== t8 || $[32] !== t9) {
112
- t16 = /* @__PURE__ */ jsxs("nav", {
113
- id: "pagination",
114
- className: t8,
115
- children: [t9, t15]
116
- });
117
- $[30] = t15;
118
- $[31] = t8;
119
- $[32] = t9;
120
- $[33] = t16;
121
- } else t16 = $[33];
122
- return t16;
27
+ children: [/* @__PURE__ */ jsx(Typography, {
28
+ variant: "default",
29
+ size: "label-2",
30
+ as: "span",
31
+ className: "whitespace-nowrap text-text-default-1",
32
+ children: t(($) => $.ui.pagination.resultsPerPage)
33
+ }), /* @__PURE__ */ jsx(NumberInput, {
34
+ value: pageSize,
35
+ onChange: (value) => onPageSizeChange?.(Number(value)),
36
+ label: t(($_0) => $_0.ui.pagination.resultsPerPage),
37
+ hideLabel: true,
38
+ className: "w-min",
39
+ inputClassName: "min-w-12 !px-3 !py-0-5"
40
+ })]
41
+ })]
42
+ });
123
43
  };
124
- function _temp($) {
125
- return $.ui.pagination.resultsPerPage;
126
- }
127
- function _temp2($_0) {
128
- return $_0.ui.pagination.resultsPerPage;
129
- }
130
44
  //#endregion
131
45
  export { Pagination };
@@ -3,112 +3,45 @@ import { Typography } from "../../text/Typography/Typography.js";
3
3
  import { Loader } from "../Loader/Loader.js";
4
4
  import { alertDefinition } from "./alert.cva.js";
5
5
  import { statusIconDefinition, statusSeparatorDefinition } from "../shared/status.cva.js";
6
- import { c } from "react/compiler-runtime";
7
6
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
8
7
  //#region src/components/status/Alert/Alert.tsx
9
- var Alert = (t0) => {
10
- const $ = c(31);
11
- const { variant, color, text, isLoading: t1, rightContent, hasSeparator, icon: Icon, className } = t0;
12
- const isLoading = t1 === void 0 ? false : t1;
8
+ var Alert = ({ variant, color, text, isLoading = false, rightContent, hasSeparator, icon: Icon, className }) => {
13
9
  const alertCva = UIOverrides.useCva("alert.cva", alertDefinition);
14
10
  const iconCva = UIOverrides.useCva("status.iconCva", statusIconDefinition);
15
11
  const separatorCva = UIOverrides.useCva("status.separatorCva", statusSeparatorDefinition);
16
- let t2;
17
- if ($[0] !== alertCva || $[1] !== className || $[2] !== color || $[3] !== variant) {
18
- t2 = alertCva({
12
+ return /* @__PURE__ */ jsx("div", {
13
+ className: alertCva({
19
14
  variant,
20
15
  color,
21
16
  className
22
- });
23
- $[0] = alertCva;
24
- $[1] = className;
25
- $[2] = color;
26
- $[3] = variant;
27
- $[4] = t2;
28
- } else t2 = $[4];
29
- let t3;
30
- if ($[5] !== isLoading) {
31
- t3 = isLoading && /* @__PURE__ */ jsx(Loader, {
32
- size: "default",
33
- className: "shrink-0"
34
- });
35
- $[5] = isLoading;
36
- $[6] = t3;
37
- } else t3 = $[6];
38
- let t4;
39
- if ($[7] !== Icon || $[8] !== color || $[9] !== iconCva || $[10] !== isLoading || $[11] !== variant) {
40
- t4 = !isLoading && Icon && /* @__PURE__ */ jsx(Icon, { className: iconCva({
41
- variant,
42
- color
43
- }) });
44
- $[7] = Icon;
45
- $[8] = color;
46
- $[9] = iconCva;
47
- $[10] = isLoading;
48
- $[11] = variant;
49
- $[12] = t4;
50
- } else t4 = $[12];
51
- let t5;
52
- if ($[13] !== text) {
53
- t5 = /* @__PURE__ */ jsx(Typography, {
54
- size: "label-2",
55
- children: text
56
- });
57
- $[13] = text;
58
- $[14] = t5;
59
- } else t5 = $[14];
60
- let t6;
61
- if ($[15] !== t3 || $[16] !== t4 || $[17] !== t5) {
62
- t6 = /* @__PURE__ */ jsxs("div", {
63
- className: "flex w-full items-start gap-alert-gap-icon-to-text px-alert-side-default py-alert-height-content",
64
- children: [
65
- t3,
66
- t4,
67
- t5
68
- ]
69
- });
70
- $[15] = t3;
71
- $[16] = t4;
72
- $[17] = t5;
73
- $[18] = t6;
74
- } else t6 = $[18];
75
- let t7;
76
- if ($[19] !== color || $[20] !== hasSeparator || $[21] !== rightContent || $[22] !== separatorCva || $[23] !== variant) {
77
- t7 = !!rightContent && /* @__PURE__ */ jsxs(Fragment, { children: [hasSeparator && /* @__PURE__ */ jsx("div", { className: separatorCva({
78
- variant,
79
- color
80
- }) }), /* @__PURE__ */ jsx("div", {
81
- className: "flex w-full shrink-0 flex-wrap items-center justify-end gap-alert-gap-action px-alert-side-default py-alert-height-actions-mobile md:w-auto md:justify-center md:py-alert-height-actions-desktop",
82
- children: rightContent
83
- })] });
84
- $[19] = color;
85
- $[20] = hasSeparator;
86
- $[21] = rightContent;
87
- $[22] = separatorCva;
88
- $[23] = variant;
89
- $[24] = t7;
90
- } else t7 = $[24];
91
- let t8;
92
- if ($[25] !== t6 || $[26] !== t7) {
93
- t8 = /* @__PURE__ */ jsxs("div", {
17
+ }),
18
+ children: /* @__PURE__ */ jsxs("div", {
94
19
  className: "flex w-auto flex-col items-center md:flex-row",
95
- children: [t6, t7]
96
- });
97
- $[25] = t6;
98
- $[26] = t7;
99
- $[27] = t8;
100
- } else t8 = $[27];
101
- let t9;
102
- if ($[28] !== t2 || $[29] !== t8) {
103
- t9 = /* @__PURE__ */ jsx("div", {
104
- className: t2,
105
- children: t8
106
- });
107
- $[28] = t2;
108
- $[29] = t8;
109
- $[30] = t9;
110
- } else t9 = $[30];
111
- return t9;
20
+ children: [/* @__PURE__ */ jsxs("div", {
21
+ className: "flex w-full items-start gap-alert-gap-icon-to-text px-alert-side-default py-alert-height-content",
22
+ children: [
23
+ isLoading && /* @__PURE__ */ jsx(Loader, {
24
+ size: "default",
25
+ className: "shrink-0"
26
+ }),
27
+ !isLoading && Icon && /* @__PURE__ */ jsx(Icon, { className: iconCva({
28
+ variant,
29
+ color
30
+ }) }),
31
+ /* @__PURE__ */ jsx(Typography, {
32
+ size: "label-2",
33
+ children: text
34
+ })
35
+ ]
36
+ }), !!rightContent && /* @__PURE__ */ jsxs(Fragment, { children: [hasSeparator && /* @__PURE__ */ jsx("div", { className: separatorCva({
37
+ variant,
38
+ color
39
+ }) }), /* @__PURE__ */ jsx("div", {
40
+ className: "flex w-full shrink-0 flex-wrap items-center justify-end gap-alert-gap-action px-alert-side-default py-alert-height-actions-mobile md:w-auto md:justify-center md:py-alert-height-actions-desktop",
41
+ children: rightContent
42
+ })] })]
43
+ })
44
+ });
112
45
  };
113
46
  //#endregion
114
47
  export { Alert };
@@ -1,79 +1,28 @@
1
1
  import { Loader } from "../status/Loader/Loader.js";
2
2
  import { useIntersectionObserver } from "../../hooks/useIntersectionObserver.js";
3
3
  import { Table } from "./Table.js";
4
- import { c } from "react/compiler-runtime";
5
4
  import { jsx, jsxs } from "react/jsx-runtime";
5
+ import { useCallback } from "react";
6
6
  //#region src/components/table/InfiniteTable.tsx
7
- var InfiniteTable = (t0) => {
8
- const $ = c(20);
9
- let fetchNextPage;
10
- let hasNextPage;
11
- let rest;
12
- let t1;
13
- if ($[0] !== t0) {
14
- ({hasNextPage, isFetchingNextPage: t1, fetchNextPage, ...rest} = t0);
15
- $[0] = t0;
16
- $[1] = fetchNextPage;
17
- $[2] = hasNextPage;
18
- $[3] = rest;
19
- $[4] = t1;
20
- } else {
21
- fetchNextPage = $[1];
22
- hasNextPage = $[2];
23
- rest = $[3];
24
- t1 = $[4];
25
- }
26
- const isFetchingNextPage = t1 === void 0 ? false : t1;
27
- let t2;
28
- if ($[5] !== fetchNextPage || $[6] !== hasNextPage || $[7] !== isFetchingNextPage) {
29
- t2 = () => {
7
+ var InfiniteTable = ({ hasNextPage, isFetchingNextPage = false, fetchNextPage, ...rest }) => {
8
+ const { ref } = useIntersectionObserver({
9
+ onIntersection: useCallback(() => {
30
10
  if (!isFetchingNextPage && hasNextPage) fetchNextPage();
31
- };
32
- $[5] = fetchNextPage;
33
- $[6] = hasNextPage;
34
- $[7] = isFetchingNextPage;
35
- $[8] = t2;
36
- } else t2 = $[8];
37
- const handleLoadMore = t2;
38
- let t3;
39
- if ($[9] !== handleLoadMore) {
40
- t3 = {
41
- onIntersection: handleLoadMore,
42
- rootMargin: "100px"
43
- };
44
- $[9] = handleLoadMore;
45
- $[10] = t3;
46
- } else t3 = $[10];
47
- const { ref } = useIntersectionObserver(t3);
48
- let t4;
49
- if ($[11] !== rest) {
50
- t4 = /* @__PURE__ */ jsx(Table, { ...rest });
51
- $[11] = rest;
52
- $[12] = t4;
53
- } else t4 = $[12];
54
- let t5;
55
- if ($[13] !== hasNextPage || $[14] !== isFetchingNextPage || $[15] !== ref) {
56
- t5 = (hasNextPage || isFetchingNextPage) && /* @__PURE__ */ jsx("div", {
11
+ }, [
12
+ isFetchingNextPage,
13
+ hasNextPage,
14
+ fetchNextPage
15
+ ]),
16
+ rootMargin: "100px"
17
+ });
18
+ return /* @__PURE__ */ jsxs("div", {
19
+ className: "flex flex-col",
20
+ children: [/* @__PURE__ */ jsx(Table, { ...rest }), (hasNextPage || isFetchingNextPage) && /* @__PURE__ */ jsx("div", {
57
21
  ref,
58
22
  className: "flex justify-center py-4",
59
23
  children: /* @__PURE__ */ jsx(Loader, {})
60
- });
61
- $[13] = hasNextPage;
62
- $[14] = isFetchingNextPage;
63
- $[15] = ref;
64
- $[16] = t5;
65
- } else t5 = $[16];
66
- let t6;
67
- if ($[17] !== t4 || $[18] !== t5) {
68
- t6 = /* @__PURE__ */ jsxs("div", {
69
- className: "flex flex-col",
70
- children: [t4, t5]
71
- });
72
- $[17] = t4;
73
- $[18] = t5;
74
- $[19] = t6;
75
- } else t6 = $[19];
76
- return t6;
24
+ })]
25
+ });
77
26
  };
78
27
  //#endregion
79
28
  export { InfiniteTable };
@@ -1,9 +1,7 @@
1
1
  import { DragEndEvent, UniqueIdentifier } from '@dnd-kit/core';
2
2
  import { ColumnDef, ColumnOrderState, OnChangeFn, Table as ReactTable, Row, RowSelectionState, SortingState, VisibilityState } from '@tanstack/react-table';
3
3
  import { TFunction } from 'i18next';
4
- import { ComponentType, Dispatch, ReactNode, SetStateAction } from 'react';
5
- import { UseFormReturn } from 'react-hook-form';
6
- import { InputDef } from '../inputs/Inputs/InputItem';
4
+ import { ComponentType, Dispatch, SetStateAction } from 'react';
7
5
  import { TableRowVariantProps } from './table.cva';
8
6
  export type BulkSelectionActionsComponent<T> = ComponentType<{
9
7
  table: ReactTable<T>;
@@ -32,12 +30,8 @@ export interface TableProps<T> extends TableRowVariantProps {
32
30
  enableMultiRowSelection?: boolean | ((row: Row<T>) => boolean);
33
31
  defaultSelectedRows?: RowSelectionState;
34
32
  onRowSelectionChange?: OnChangeFn<RowSelectionState>;
35
- filterForm?: UseFormReturn<Record<string, any>>;
36
- filterDefs?: InputDef<any>[];
37
- headerFilterCellClassName?: string;
38
- emptyContent?: ReactNode;
39
33
  }
40
34
  export declare const RowDragHandleCell: ({ rowId }: {
41
35
  rowId: string;
42
36
  }) => import("react/jsx-runtime").JSX.Element;
43
- export declare const Table: <T>({ items, showCellBorder, columns, onRowClick, onDoubleClick, className, sorting, setSorting, columnOrder, setColumnOrder, columnVisibility, setColumnVisibility, bulkSelectionActions: ActionHeader, enableDragDrop, onDragEnd, onReorder, getRowId, enableRowSelection, enableMultiRowSelection, defaultSelectedRows, onRowSelectionChange, filterForm, filterDefs, headerFilterCellClassName, emptyContent, ...props }: TableProps<T>) => import("react/jsx-runtime").JSX.Element;
37
+ export declare const Table: <T>({ items, showCellBorder, columns, onRowClick, onDoubleClick, className, sorting, setSorting, columnOrder, setColumnOrder, columnVisibility, setColumnVisibility, bulkSelectionActions: ActionHeader, enableDragDrop, onDragEnd, onReorder, getRowId, enableRowSelection, enableMultiRowSelection, defaultSelectedRows, onRowSelectionChange, ...props }: TableProps<T>) => import("react/jsx-runtime").JSX.Element;