@povio/ui 3.3.0-rc.3 → 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 (84) hide show
  1. package/README.md +15 -1
  2. package/dist/components/Breadcrumbs/Breadcrumbs.js +55 -206
  3. package/dist/components/buttons/Button/button.cva.d.ts +1 -1
  4. package/dist/components/buttons/InlineIconButton/InlineIconButton.js +9 -34
  5. package/dist/components/buttons/shared/ButtonContent.js +22 -80
  6. package/dist/components/inputs/Checkbox/CheckboxCheckmark.js +10 -24
  7. package/dist/components/inputs/Checkbox/CheckboxGroup.d.ts +5 -1
  8. package/dist/components/inputs/Checkbox/CheckboxGroup.js +234 -201
  9. package/dist/components/inputs/DateTime/DatePicker/DatePicker.js +93 -227
  10. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.d.ts +1 -0
  11. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js +170 -273
  12. package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.js +60 -147
  13. package/dist/components/inputs/DateTime/shared/Calendar.js +139 -339
  14. package/dist/components/inputs/DateTime/shared/CalendarCell.js +114 -308
  15. package/dist/components/inputs/DateTime/shared/CalendarGrid.js +35 -150
  16. package/dist/components/inputs/DateTime/shared/CalendarHeader.js +95 -229
  17. package/dist/components/inputs/DateTime/shared/CalendarSelectHeader.js +115 -296
  18. package/dist/components/inputs/DateTime/shared/DateField.js +135 -301
  19. package/dist/components/inputs/DateTime/shared/DatePickerInput.js +142 -338
  20. package/dist/components/inputs/DateTime/shared/DateTimeDialogFooter.js +10 -59
  21. package/dist/components/inputs/DateTime/shared/TimePickerInput.js +144 -134
  22. package/dist/components/inputs/DateTime/shared/useFirefoxDateSegmentSelectionGuard.d.ts +2 -0
  23. package/dist/components/inputs/DateTime/shared/useFirefoxDateSegmentSelectionGuard.js +33 -0
  24. package/dist/components/inputs/File/FileUpload.js +1 -1
  25. package/dist/components/inputs/File/InputUpload.js +65 -261
  26. package/dist/components/inputs/File/shared/FileUploadContentEmpty.js +48 -180
  27. package/dist/components/inputs/File/shared/FileUploadContentError.js +95 -265
  28. package/dist/components/inputs/File/shared/FileUploadContentFilled.js +99 -261
  29. package/dist/components/inputs/File/shared/FileUploadContentLoading.js +56 -234
  30. package/dist/components/inputs/File/shared/ProgressBar.js +15 -102
  31. package/dist/components/inputs/FormField/FormField.js +34 -47
  32. package/dist/components/inputs/Input/NumberInput/NumberInput.js +2 -1
  33. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.js +77 -314
  34. package/dist/components/inputs/Selection/Autocomplete/Autocomplete.js +23 -83
  35. package/dist/components/inputs/Selection/Autocomplete/QueryAutocomplete.js +56 -2
  36. package/dist/components/inputs/Selection/Select/QuerySelect.js +82 -94
  37. package/dist/components/inputs/Selection/Select/Select.js +3 -3
  38. package/dist/components/inputs/Selection/shared/SelectInput.js +1 -0
  39. package/dist/components/inputs/Selection/shared/SelectListBox.js +51 -163
  40. package/dist/components/inputs/Selection/shared/querySelect.utils.d.ts +1 -0
  41. package/dist/components/inputs/Selection/shared/querySelect.utils.js +1 -0
  42. package/dist/components/inputs/Selection/shared/select.context.js +19 -9
  43. package/dist/components/inputs/Selection/shared/useSelectItems.js +48 -108
  44. package/dist/components/inputs/Skeleton/InputFrame.js +177 -552
  45. package/dist/components/inputs/TextEditor/TextEditor.js +87 -389
  46. package/dist/components/inputs/shared/InputClear.js +24 -40
  47. package/dist/components/inputs/shared/input.cva.js +1 -1
  48. package/dist/components/navigation/Accordion/Accordion.js +22 -69
  49. package/dist/components/navigation/Accordion/AccordionItem.js +41 -86
  50. package/dist/components/navigation/Stepper/Stepper.js +22 -67
  51. package/dist/components/overlays/ActionModal/ActionModal.js +35 -169
  52. package/dist/components/overlays/ResponsivePopover/ResponsivePopover.js +29 -110
  53. package/dist/components/shared/pagination/Pagination.js +22 -108
  54. package/dist/components/shared/pagination/minWidth.cva.d.ts +1 -1
  55. package/dist/components/status/Alert/Alert.js +30 -97
  56. package/dist/components/table/InfiniteTable.js +16 -67
  57. package/dist/components/table/Table.d.ts +2 -8
  58. package/dist/components/table/Table.js +33 -55
  59. package/dist/components/text/Typography/Typography.js +8 -23
  60. package/dist/config/confirmation.context.js +1 -1
  61. package/dist/config/theme.context.js +45 -98
  62. package/dist/config/uiConfig.context.d.ts +1 -0
  63. package/dist/config/uiConfig.context.js +10 -40
  64. package/dist/config/uiOverrides.context.d.ts +0 -1
  65. package/dist/helpers/dynamicColumns.js +2 -1
  66. package/dist/hooks/useDebounceCallback.js +17 -51
  67. package/dist/hooks/useFormAutosave.js +33 -120
  68. package/dist/hooks/useLongPressRepeat.js +20 -55
  69. package/dist/index.d.ts +1 -1
  70. package/dist/index.js +2 -2
  71. package/dist/utils/date-time.utils.d.ts +0 -1
  72. package/dist/utils/date-time.utils.js +21 -45
  73. package/dist/utils/intl.utils.d.ts +7 -0
  74. package/dist/utils/intl.utils.js +38 -0
  75. package/dist/utils/intl.utils.spec.d.ts +1 -0
  76. package/package.json +2 -2
  77. package/dist/components/inputs/FormField/formField.cva.d.ts +0 -11
  78. package/dist/components/inputs/FormField/formField.cva.js +0 -16
  79. package/dist/components/table/TableColumnFilterInput.d.ts +0 -9
  80. package/dist/components/table/TableColumnFilterInput.js +0 -108
  81. package/dist/components/table/TableColumnFilterPlaceholder.d.ts +0 -5
  82. package/dist/components/table/TableColumnFilterPlaceholder.js +0 -41
  83. package/dist/components/table/TableColumnFilterRow.d.ts +0 -16
  84. package/dist/components/table/TableColumnFilterRow.js +0 -68
@@ -5,279 +5,109 @@ import { InlineIconButton } from "../../../buttons/InlineIconButton/InlineIconBu
5
5
  import "../../../../config/i18n.js";
6
6
  import { TextButton } from "../../../buttons/TextButton/TextButton.js";
7
7
  import { WarningFilledIcon } from "../../../../assets/icons/WarningFilled.js";
8
- import { c } from "react/compiler-runtime";
9
8
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
10
9
  import { clsx } from "clsx";
11
10
  import { FileTrigger } from "react-aria-components";
12
11
  import { useTranslation } from "react-i18next";
13
12
  //#region src/components/inputs/File/shared/FileUploadContentError.tsx
14
- var FileUploadContentError = (t0) => {
15
- const $ = c(63);
16
- const { variant, as, isDisabled, state, browseText, fileTriggerProps, removeWithIcon: t1, singleFile, onRemove, browseButtonProps } = t0;
17
- const removeWithIcon = t1 === void 0 ? false : t1;
13
+ var FileUploadContentError = ({ variant, as, isDisabled, state, browseText, fileTriggerProps, removeWithIcon = false, singleFile, onRemove, browseButtonProps }) => {
18
14
  const { t } = useTranslation("ui");
19
- let t2;
20
- if ($[0] !== browseButtonProps) {
21
- t2 = browseButtonProps ?? {};
22
- $[0] = browseButtonProps;
23
- $[1] = t2;
24
- } else t2 = $[1];
25
- let browseButtonRestProps;
26
- let t3;
27
- let t4;
28
- let t5;
29
- if ($[2] !== t2) {
30
- ({size: t3, variant: t4, width: t5, ...browseButtonRestProps} = t2);
31
- $[2] = t2;
32
- $[3] = browseButtonRestProps;
33
- $[4] = t3;
34
- $[5] = t4;
35
- $[6] = t5;
36
- } else {
37
- browseButtonRestProps = $[3];
38
- t3 = $[4];
39
- t4 = $[5];
40
- t5 = $[6];
41
- }
42
- const browseButtonSize = t3 === void 0 ? "xs" : t3;
43
- const browseButtonVariant = t4 === void 0 ? "outlined" : t4;
44
- const browseButtonWidth = t5 === void 0 ? "hug" : t5;
45
- let t6;
46
- if ($[7] === Symbol.for("react.memo_cache_sentinel")) {
47
- t6 = clsx("flex w-full flex-fill flex-col items-start");
48
- $[7] = t6;
49
- } else t6 = $[7];
50
- const t7 = variant === "horizontal";
51
- const t8 = variant === "vertical";
52
- const t9 = variant === "vertical" && as === "button";
53
- const t10 = variant === "vertical" && as === "link";
54
- let t11;
55
- if ($[8] !== t10 || $[9] !== t7 || $[10] !== t8 || $[11] !== t9) {
56
- t11 = clsx("flex w-full items-center", {
57
- "flex-row gap-file-upload-content-gap-left-to-right-content": t7,
58
- "flex-col": t8,
59
- "gap-file-upload-content-gap-content-to-button": t9,
60
- "gap-file-upload-content-gap-text-to-text": t10
61
- });
62
- $[8] = t10;
63
- $[9] = t7;
64
- $[10] = t8;
65
- $[11] = t9;
66
- $[12] = t11;
67
- } else t11 = $[12];
68
- const t12 = variant === "vertical";
69
- const t13 = variant === "horizontal";
70
- let t14;
71
- if ($[13] !== isDisabled || $[14] !== t12 || $[15] !== t13) {
72
- t14 = clsx("flex min-w-0 max-w-full flex-grow items-center gap-file-upload-content-gap-icon-to-content", {
73
- "flex-col": t12,
74
- "flex-row": t13,
75
- "opacity-50": isDisabled
76
- });
77
- $[13] = isDisabled;
78
- $[14] = t12;
79
- $[15] = t13;
80
- $[16] = t14;
81
- } else t14 = $[16];
82
- let t15;
83
- if ($[17] === Symbol.for("react.memo_cache_sentinel")) {
84
- t15 = /* @__PURE__ */ jsx(WarningFilledIcon, { className: "h-6 w-6 text-elevation-fill-warning-1" });
85
- $[17] = t15;
86
- } else t15 = $[17];
87
- const t16 = variant === "vertical";
88
- const t17 = variant === "horizontal";
89
- let t18;
90
- if ($[18] !== t16 || $[19] !== t17) {
91
- t18 = clsx("flex flex-col gap-file-upload-content-gap-text-to-text", {
92
- "max-w-full items-center": t16,
93
- "max-w-[calc(100%_-_32px)]": t17
94
- });
95
- $[18] = t16;
96
- $[19] = t17;
97
- $[20] = t18;
98
- } else t18 = $[20];
99
- const t19 = variant === "vertical";
100
- let t20;
101
- if ($[21] !== t19) {
102
- t20 = clsx("self-stretch truncate text-text-default-1", { "text-center": t19 });
103
- $[21] = t19;
104
- $[22] = t20;
105
- } else t20 = $[22];
106
- const t21 = state.file?.name ?? state.displayName ?? "";
107
- let t22;
108
- if ($[23] !== t20 || $[24] !== t21) {
109
- t22 = /* @__PURE__ */ jsx(Typography, {
110
- variant: "prominent-1",
111
- size: "label-1",
112
- as: "span",
113
- className: t20,
114
- children: t21
115
- });
116
- $[23] = t20;
117
- $[24] = t21;
118
- $[25] = t22;
119
- } else t22 = $[25];
120
- const t23 = singleFile ? "label-2" : "label-3";
121
- const t24 = variant === "vertical";
122
- let t25;
123
- if ($[26] !== t24) {
124
- t25 = clsx("text-text-default-2", { "text-center": t24 });
125
- $[26] = t24;
126
- $[27] = t25;
127
- } else t25 = $[27];
128
- const t26 = state.error?.serverMessage ?? state.error?.message;
129
- let t27;
130
- if ($[28] !== t23 || $[29] !== t25 || $[30] !== t26) {
131
- t27 = /* @__PURE__ */ jsx(Typography, {
132
- variant: "default",
133
- size: t23,
134
- as: "span",
135
- className: t25,
136
- children: t26
137
- });
138
- $[28] = t23;
139
- $[29] = t25;
140
- $[30] = t26;
141
- $[31] = t27;
142
- } else t27 = $[31];
143
- let t28;
144
- if ($[32] !== t18 || $[33] !== t22 || $[34] !== t27) {
145
- t28 = /* @__PURE__ */ jsxs("div", {
146
- className: t18,
147
- children: [t22, t27]
148
- });
149
- $[32] = t18;
150
- $[33] = t22;
151
- $[34] = t27;
152
- $[35] = t28;
153
- } else t28 = $[35];
154
- let t29;
155
- if ($[36] !== t14 || $[37] !== t28) {
156
- t29 = /* @__PURE__ */ jsxs("div", {
157
- className: t14,
158
- children: [t15, t28]
159
- });
160
- $[36] = t14;
161
- $[37] = t28;
162
- $[38] = t29;
163
- } else t29 = $[38];
164
- const t30 = variant === "vertical" && as === "button";
165
- const t31 = as === "link";
166
- const t32 = as === "button";
167
- let t33;
168
- if ($[39] !== t30 || $[40] !== t31 || $[41] !== t32) {
169
- t33 = clsx("flex flex-none items-center justify-end", {
170
- "flex-col": t30,
171
- "gap-file-upload-content-gap-text-to-text": t31,
172
- "gap-file-upload-content-gap-content-to-button": t32
173
- });
174
- $[39] = t30;
175
- $[40] = t31;
176
- $[41] = t32;
177
- $[42] = t33;
178
- } else t33 = $[42];
179
- let t34;
180
- if ($[43] !== as || $[44] !== browseButtonRestProps || $[45] !== browseButtonSize || $[46] !== browseButtonVariant || $[47] !== browseButtonWidth || $[48] !== browseText || $[49] !== fileTriggerProps || $[50] !== isDisabled || $[51] !== onRemove || $[52] !== removeWithIcon || $[53] !== state.id || $[54] !== t) {
181
- t34 = as === "link" ? /* @__PURE__ */ jsxs(Fragment, { children: [fileTriggerProps && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(FileTrigger, {
182
- ...fileTriggerProps,
183
- children: /* @__PURE__ */ jsx(TextButton, {
184
- className: "text-interactive-text-primary-idle",
185
- children: browseText ?? ""
186
- })
187
- }), /* @__PURE__ */ jsx(Typography, {
188
- variant: "default",
189
- size: "label-2",
190
- as: "span",
191
- className: "text-text-default-2",
192
- children: t(_temp)
193
- })] }), removeWithIcon ? /* @__PURE__ */ jsx(InlineIconButton, {
194
- label: "Cancel",
195
- color: "secondary",
196
- onPress: () => {
197
- onRemove(state.id ?? "");
198
- },
199
- icon: CloseIcon
200
- }) : /* @__PURE__ */ jsx(TextButton, {
201
- className: "text-interactive-text-primary-idle lowercase",
202
- onPress: () => {
203
- onRemove(state.id ?? "");
204
- },
205
- children: t(_temp2)
206
- })] }) : /* @__PURE__ */ jsxs("div", {
207
- className: "flex items-center justify-center gap-file-upload-content-gap-button-to-button self-stretch",
208
- children: [fileTriggerProps && /* @__PURE__ */ jsx(FileTrigger, {
209
- ...fileTriggerProps,
210
- children: /* @__PURE__ */ jsx(Button$1, {
211
- variant: browseButtonVariant,
212
- size: browseButtonSize,
213
- width: browseButtonWidth,
214
- ...browseButtonRestProps,
215
- isDisabled,
216
- children: browseText ?? ""
15
+ const { size: browseButtonSize = "xs", variant: browseButtonVariant = "outlined", width: browseButtonWidth = "hug", ...browseButtonRestProps } = browseButtonProps ?? {};
16
+ return /* @__PURE__ */ jsx("div", {
17
+ className: clsx("flex w-full flex-fill flex-col items-start"),
18
+ children: /* @__PURE__ */ jsxs("div", {
19
+ className: clsx("flex w-full items-center", {
20
+ "flex-row gap-file-upload-content-gap-left-to-right-content": variant === "horizontal",
21
+ "flex-col": variant === "vertical",
22
+ "gap-file-upload-content-gap-content-to-button": variant === "vertical" && as === "button",
23
+ "gap-file-upload-content-gap-text-to-text": variant === "vertical" && as === "link"
24
+ }),
25
+ children: [/* @__PURE__ */ jsxs("div", {
26
+ className: clsx("flex min-w-0 max-w-full flex-grow items-center gap-file-upload-content-gap-icon-to-content", {
27
+ "flex-col": variant === "vertical",
28
+ "flex-row": variant === "horizontal",
29
+ "opacity-50": isDisabled
30
+ }),
31
+ children: [/* @__PURE__ */ jsx(WarningFilledIcon, { className: "h-6 w-6 text-elevation-fill-warning-1" }), /* @__PURE__ */ jsxs("div", {
32
+ className: clsx("flex flex-col gap-file-upload-content-gap-text-to-text", {
33
+ "max-w-full items-center": variant === "vertical",
34
+ "max-w-[calc(100%_-_32px)]": variant === "horizontal"
35
+ }),
36
+ children: [/* @__PURE__ */ jsx(Typography, {
37
+ variant: "prominent-1",
38
+ size: "label-1",
39
+ as: "span",
40
+ className: clsx("self-stretch truncate text-text-default-1", { "text-center": variant === "vertical" }),
41
+ children: state.file?.name ?? state.displayName ?? ""
42
+ }), /* @__PURE__ */ jsx(Typography, {
43
+ variant: "default",
44
+ size: singleFile ? "label-2" : "label-3",
45
+ as: "span",
46
+ className: clsx("text-text-default-2", { "text-center": variant === "vertical" }),
47
+ children: state.error?.serverMessage ?? state.error?.message
48
+ })]
49
+ })]
50
+ }), /* @__PURE__ */ jsx("div", {
51
+ className: clsx("flex flex-none items-center justify-end", {
52
+ "flex-col": variant === "vertical" && as === "button",
53
+ "gap-file-upload-content-gap-text-to-text": as === "link",
54
+ "gap-file-upload-content-gap-content-to-button": as === "button"
55
+ }),
56
+ children: as === "link" ? /* @__PURE__ */ jsxs(Fragment, { children: [fileTriggerProps && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(FileTrigger, {
57
+ ...fileTriggerProps,
58
+ children: /* @__PURE__ */ jsx(TextButton, {
59
+ className: "text-interactive-text-primary-idle",
60
+ children: browseText ?? ""
61
+ })
62
+ }), /* @__PURE__ */ jsx(Typography, {
63
+ variant: "default",
64
+ size: "label-2",
65
+ as: "span",
66
+ className: "text-text-default-2",
67
+ children: t(($) => $.ui.fileUpload.or)
68
+ })] }), removeWithIcon ? /* @__PURE__ */ jsx(InlineIconButton, {
69
+ label: "Cancel",
70
+ color: "secondary",
71
+ onPress: () => {
72
+ onRemove(state.id ?? "");
73
+ },
74
+ icon: CloseIcon
75
+ }) : /* @__PURE__ */ jsx(TextButton, {
76
+ className: "text-interactive-text-primary-idle lowercase",
77
+ onPress: () => {
78
+ onRemove(state.id ?? "");
79
+ },
80
+ children: t(($_0) => $_0.ui.fileUpload.removeFile)
81
+ })] }) : /* @__PURE__ */ jsxs("div", {
82
+ className: "flex items-center justify-center gap-file-upload-content-gap-button-to-button self-stretch",
83
+ children: [fileTriggerProps && /* @__PURE__ */ jsx(FileTrigger, {
84
+ ...fileTriggerProps,
85
+ children: /* @__PURE__ */ jsx(Button$1, {
86
+ variant: browseButtonVariant,
87
+ size: browseButtonSize,
88
+ width: browseButtonWidth,
89
+ ...browseButtonRestProps,
90
+ isDisabled,
91
+ children: browseText ?? ""
92
+ })
93
+ }), removeWithIcon ? /* @__PURE__ */ jsx(InlineIconButton, {
94
+ label: "Cancel",
95
+ color: "secondary",
96
+ onPress: () => {
97
+ onRemove(state.id ?? "");
98
+ },
99
+ icon: CloseIcon
100
+ }) : /* @__PURE__ */ jsx(TextButton, {
101
+ color: "secondary",
102
+ onPress: () => {
103
+ onRemove(state.id ?? "");
104
+ },
105
+ children: t(($_1) => $_1.ui.fileUpload.removeFile)
106
+ })]
217
107
  })
218
- }), removeWithIcon ? /* @__PURE__ */ jsx(InlineIconButton, {
219
- label: "Cancel",
220
- color: "secondary",
221
- onPress: () => {
222
- onRemove(state.id ?? "");
223
- },
224
- icon: CloseIcon
225
- }) : /* @__PURE__ */ jsx(TextButton, {
226
- color: "secondary",
227
- onPress: () => {
228
- onRemove(state.id ?? "");
229
- },
230
- children: t(_temp3)
231
108
  })]
232
- });
233
- $[43] = as;
234
- $[44] = browseButtonRestProps;
235
- $[45] = browseButtonSize;
236
- $[46] = browseButtonVariant;
237
- $[47] = browseButtonWidth;
238
- $[48] = browseText;
239
- $[49] = fileTriggerProps;
240
- $[50] = isDisabled;
241
- $[51] = onRemove;
242
- $[52] = removeWithIcon;
243
- $[53] = state.id;
244
- $[54] = t;
245
- $[55] = t34;
246
- } else t34 = $[55];
247
- let t35;
248
- if ($[56] !== t33 || $[57] !== t34) {
249
- t35 = /* @__PURE__ */ jsx("div", {
250
- className: t33,
251
- children: t34
252
- });
253
- $[56] = t33;
254
- $[57] = t34;
255
- $[58] = t35;
256
- } else t35 = $[58];
257
- let t36;
258
- if ($[59] !== t11 || $[60] !== t29 || $[61] !== t35) {
259
- t36 = /* @__PURE__ */ jsx("div", {
260
- className: t6,
261
- children: /* @__PURE__ */ jsxs("div", {
262
- className: t11,
263
- children: [t29, t35]
264
- })
265
- });
266
- $[59] = t11;
267
- $[60] = t29;
268
- $[61] = t35;
269
- $[62] = t36;
270
- } else t36 = $[62];
271
- return t36;
109
+ })
110
+ });
272
111
  };
273
- function _temp($) {
274
- return $.ui.fileUpload.or;
275
- }
276
- function _temp2($_0) {
277
- return $_0.ui.fileUpload.removeFile;
278
- }
279
- function _temp3($_1) {
280
- return $_1.ui.fileUpload.removeFile;
281
- }
282
112
  //#endregion
283
113
  export { FileUploadContentError };