@povio/ui 3.2.4-rc.4 → 3.3.0-rc.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (41) hide show
  1. package/dist/components/buttons/Button/button.cva.d.ts +1 -1
  2. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.d.ts +0 -1
  3. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js +127 -142
  4. package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.js +17 -2
  5. package/dist/components/inputs/DateTime/shared/DateField.js +87 -92
  6. package/dist/components/inputs/DateTime/shared/DatePickerInput.js +0 -2
  7. package/dist/components/inputs/DateTime/shared/TimePickerInput.js +134 -144
  8. package/dist/components/inputs/FormField/FormField.js +47 -34
  9. package/dist/components/inputs/FormField/formField.cva.d.ts +11 -0
  10. package/dist/components/inputs/FormField/formField.cva.js +16 -0
  11. package/dist/components/inputs/Input/NumberInput/NumberInput.js +1 -2
  12. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.js +1 -2
  13. package/dist/components/inputs/Selection/Autocomplete/QueryAutocomplete.js +2 -54
  14. package/dist/components/inputs/Selection/Select/QuerySelect.js +46 -99
  15. package/dist/components/inputs/Selection/shared/querySelect.utils.d.ts +0 -1
  16. package/dist/components/inputs/Selection/shared/querySelect.utils.js +0 -1
  17. package/dist/components/inputs/Selection/shared/select.context.js +9 -19
  18. package/dist/components/inputs/shared/input.cva.js +1 -1
  19. package/dist/components/shared/pagination/minWidth.cva.d.ts +1 -1
  20. package/dist/components/table/Table.d.ts +8 -2
  21. package/dist/components/table/Table.js +55 -33
  22. package/dist/components/table/TableColumnFilterInput.d.ts +9 -0
  23. package/dist/components/table/TableColumnFilterInput.js +108 -0
  24. package/dist/components/table/TableColumnFilterPlaceholder.d.ts +5 -0
  25. package/dist/components/table/TableColumnFilterPlaceholder.js +41 -0
  26. package/dist/components/table/TableColumnFilterRow.d.ts +16 -0
  27. package/dist/components/table/TableColumnFilterRow.js +68 -0
  28. package/dist/config/uiConfig.context.d.ts +0 -1
  29. package/dist/config/uiConfig.context.js +1 -2
  30. package/dist/config/uiOverrides.context.d.ts +1 -0
  31. package/dist/helpers/dynamicColumns.js +1 -2
  32. package/dist/index.d.ts +1 -1
  33. package/dist/index.js +2 -2
  34. package/dist/utils/date-time.utils.d.ts +1 -0
  35. package/dist/utils/date-time.utils.js +45 -21
  36. package/package.json +1 -1
  37. package/dist/components/inputs/DateTime/shared/useFirefoxDateSegmentSelectionGuard.d.ts +0 -2
  38. package/dist/components/inputs/DateTime/shared/useFirefoxDateSegmentSelectionGuard.js +0 -33
  39. package/dist/utils/intl.utils.d.ts +0 -7
  40. package/dist/utils/intl.utils.js +0 -38
  41. package/dist/utils/intl.utils.spec.d.ts +0 -1
@@ -11,7 +11,7 @@ import { useDateFieldState } from "react-stately";
11
11
  //#region src/components/inputs/DateTime/shared/DateField.tsx
12
12
  var omitNullValue = ({ value: _value, ...props }) => props;
13
13
  var DateField = (t0) => {
14
- const $ = c(65);
14
+ const $ = c(63);
15
15
  const { ref, onClearChange, hidePlaceholder, isDisabled, disableManualEntry, dateGranularity: t1, isTimeOptional: t2, format, timeZone, segmentGroup, shouldAutoFixYear: t3, ...props } = t0;
16
16
  const dateGranularity = t1 === void 0 ? "day" : t1;
17
17
  const isTimeOptional = t2 === void 0 ? false : t2;
@@ -84,7 +84,7 @@ var DateField = (t0) => {
84
84
  const segmentsToRender = t8;
85
85
  const getSegmentNumber = _temp;
86
86
  let t9;
87
- if ($[16] !== isTimeOptional || $[17] !== props || $[18] !== shouldAutoFixYear || $[19] !== state) {
87
+ if ($[16] !== isTimeOptional || $[17] !== props || $[18] !== state) {
88
88
  t9 = () => {
89
89
  const monthSegment = state.segments.find(_temp2);
90
90
  const daySegment = state.segments.find(_temp3);
@@ -94,14 +94,10 @@ var DateField = (t0) => {
94
94
  const isMonthFilled = monthSegment && !monthSegment.isPlaceholder;
95
95
  const isDayFilled = daySegment && !daySegment.isPlaceholder;
96
96
  const isYearFilled = yearSegment && !yearSegment.isPlaceholder && yearSegment.text?.length > 0;
97
- const isYearComplete = isYearFilled && yearSegment.text?.length === 4;
98
97
  const isYearEmpty = yearSegment && !(parseInt(yearSegment.text) && yearSegment.text?.length === 4);
99
98
  const isDateFilled = isMonthFilled && isDayFilled && isYearFilled;
100
99
  const isHourEmpty = hourSegment && (hourSegment.isPlaceholder || Number.isNaN(parseInt(hourSegment.text ?? "", 10)));
101
100
  const isMinuteEmpty = minuteSegment && (minuteSegment.isPlaceholder || Number.isNaN(parseInt(minuteSegment.text ?? "", 10)));
102
- const month = getSegmentNumber(monthSegment);
103
- const day = getSegmentNumber(daySegment);
104
- const segmentYear = getSegmentNumber(yearSegment);
105
101
  let correctedValue = null;
106
102
  if (!isTimeOptional && isDateFilled && minuteSegment && isMinuteEmpty) {
107
103
  let minute = minuteSegment?.value || 0;
@@ -119,23 +115,24 @@ var DateField = (t0) => {
119
115
  }
120
116
  state.setSegment("hour", hour);
121
117
  }
122
- if (shouldAutoFixYear && isMonthFilled && isDayFilled && isYearEmpty) {
123
- let correctedYear = (/* @__PURE__ */ new Date()).getFullYear();
124
- if (yearSegment?.text?.length && yearSegment?.text?.length === 2) correctedYear = parseInt(`20${yearSegment?.text}`);
125
- state.setSegment("year", correctedYear);
118
+ if (isMonthFilled && isDayFilled && isYearEmpty) {
119
+ let year = (/* @__PURE__ */ new Date()).getFullYear();
120
+ if (yearSegment?.text?.length && yearSegment?.text?.length === 2) year = parseInt(`20${yearSegment?.text}`);
121
+ state.setSegment("year", year);
122
+ const month = getSegmentNumber(monthSegment);
123
+ const day = getSegmentNumber(daySegment);
126
124
  const hasDateSegments = month !== null && day !== null;
127
125
  const hasTimeSegment = !!(hourSegment || minuteSegment);
128
- if (state.value) correctedValue = state.value.set({ year: correctedYear });
129
- else if (hasDateSegments && hasTimeSegment) correctedValue = new CalendarDateTime(correctedYear, month, day, getSegmentNumber(hourSegment) ?? 0, getSegmentNumber(minuteSegment) ?? 0);
130
- else if (hasDateSegments) correctedValue = new CalendarDate(correctedYear, month, day);
126
+ if (state.value) correctedValue = state.value.set({ year });
127
+ else if (hasDateSegments && hasTimeSegment) correctedValue = new CalendarDateTime(year, month, day, getSegmentNumber(hourSegment) ?? 0, getSegmentNumber(minuteSegment) ?? 0);
128
+ else if (hasDateSegments) correctedValue = new CalendarDate(year, month, day);
131
129
  }
132
- if (isTimeOptional && !state.value && isMonthFilled && isDayFilled && isYearComplete && hourSegment?.isPlaceholder && minuteSegment?.isPlaceholder && month !== null && day !== null && segmentYear !== null) correctedValue = new CalendarDateTime(segmentYear, month, day, 0, 0, 0, 0);
133
130
  const valueToCorrect = correctedValue ?? state.value;
134
131
  if (!valueToCorrect) return;
135
- const { year } = valueToCorrect;
136
- if (shouldAutoFixYear && year >= 0 && year <= 99) {
137
- const correctedYear_0 = year <= 50 ? 2e3 + year : 1900 + year;
138
- correctedValue = valueToCorrect.set({ year: correctedYear_0 });
132
+ const { year: year_0 } = valueToCorrect;
133
+ if (year_0 >= 0 && year_0 <= 99) {
134
+ const correctedYear = year_0 <= 50 ? 2e3 + year_0 : 1900 + year_0;
135
+ correctedValue = valueToCorrect.set({ year: correctedYear });
139
136
  }
140
137
  if (correctedValue) {
141
138
  state.setValue(correctedValue);
@@ -144,74 +141,72 @@ var DateField = (t0) => {
144
141
  };
145
142
  $[16] = isTimeOptional;
146
143
  $[17] = props;
147
- $[18] = shouldAutoFixYear;
148
- $[19] = state;
149
- $[20] = t9;
150
- } else t9 = $[20];
144
+ $[18] = state;
145
+ $[19] = t9;
146
+ } else t9 = $[19];
151
147
  const autoFixYear = t9;
152
148
  let t10;
153
- if ($[21] !== autoFixYear || $[22] !== fieldProps || $[23] !== isTimeOptional || $[24] !== shouldAutoFixYear) {
149
+ if ($[20] !== autoFixYear || $[21] !== fieldProps || $[22] !== shouldAutoFixYear) {
154
150
  t10 = (e) => {
155
- if ((shouldAutoFixYear || isTimeOptional) && !e.currentTarget.contains(e.relatedTarget)) autoFixYear();
151
+ if (shouldAutoFixYear && !e.currentTarget.contains(e.relatedTarget)) autoFixYear();
156
152
  fieldProps.onBlur?.(e);
157
153
  };
158
- $[21] = autoFixYear;
159
- $[22] = fieldProps;
160
- $[23] = isTimeOptional;
161
- $[24] = shouldAutoFixYear;
162
- $[25] = t10;
163
- } else t10 = $[25];
154
+ $[20] = autoFixYear;
155
+ $[21] = fieldProps;
156
+ $[22] = shouldAutoFixYear;
157
+ $[23] = t10;
158
+ } else t10 = $[23];
164
159
  const handleBlur = t10;
165
160
  let t11;
166
- if ($[26] !== autoFixYear || $[27] !== state) {
161
+ if ($[24] !== autoFixYear || $[25] !== state) {
167
162
  t11 = () => ({
168
163
  clearField: () => {
169
164
  state.setValue(null);
170
165
  },
171
166
  autoFixYear
172
167
  });
173
- $[26] = autoFixYear;
174
- $[27] = state;
175
- $[28] = t11;
176
- } else t11 = $[28];
168
+ $[24] = autoFixYear;
169
+ $[25] = state;
170
+ $[26] = t11;
171
+ } else t11 = $[26];
177
172
  useImperativeHandle(ref, t11);
178
173
  let t12;
179
- if ($[29] !== previousValueRef || $[30] !== props.value || $[31] !== state) {
174
+ if ($[27] !== previousValueRef || $[28] !== props.value || $[29] !== state) {
180
175
  t12 = () => {
181
176
  if (previousValueRef.current != null && props.value == null && state.value !== null) state.setValue(null);
182
177
  previousValueRef.current = props.value;
183
178
  };
184
- $[29] = previousValueRef;
185
- $[30] = props.value;
186
- $[31] = state;
187
- $[32] = t12;
188
- } else t12 = $[32];
179
+ $[27] = previousValueRef;
180
+ $[28] = props.value;
181
+ $[29] = state;
182
+ $[30] = t12;
183
+ } else t12 = $[30];
189
184
  let t13;
190
- if ($[33] !== props.value || $[34] !== state) {
185
+ if ($[31] !== props.value || $[32] !== state) {
191
186
  t13 = [props.value, state];
192
- $[33] = props.value;
193
- $[34] = state;
194
- $[35] = t13;
195
- } else t13 = $[35];
187
+ $[31] = props.value;
188
+ $[32] = state;
189
+ $[33] = t13;
190
+ } else t13 = $[33];
196
191
  useEffect(t12, t13);
197
192
  let t14;
198
193
  let t15;
199
- if ($[36] !== onClearChange || $[37] !== state.segments) {
194
+ if ($[34] !== onClearChange || $[35] !== state.segments) {
200
195
  t14 = () => {
201
196
  onClearChange?.(state.segments.some(_temp7));
202
197
  };
203
198
  t15 = [state.segments, onClearChange];
204
- $[36] = onClearChange;
205
- $[37] = state.segments;
206
- $[38] = t14;
207
- $[39] = t15;
199
+ $[34] = onClearChange;
200
+ $[35] = state.segments;
201
+ $[36] = t14;
202
+ $[37] = t15;
208
203
  } else {
209
- t14 = $[38];
210
- t15 = $[39];
204
+ t14 = $[36];
205
+ t15 = $[37];
211
206
  }
212
207
  useEffect(t14, t15);
213
208
  let t16;
214
- if ($[40] !== disableManualEntry || $[41] !== format || $[42] !== state.value || $[43] !== timeZone) {
209
+ if ($[38] !== disableManualEntry || $[39] !== format || $[40] !== state.value || $[41] !== timeZone) {
215
210
  const getFormattedDisplayValue = () => {
216
211
  if (!disableManualEntry) return null;
217
212
  if (!format) return null;
@@ -222,15 +217,15 @@ var DateField = (t0) => {
222
217
  return formattedDate.toFormat(format);
223
218
  };
224
219
  t16 = getFormattedDisplayValue();
225
- $[40] = disableManualEntry;
226
- $[41] = format;
227
- $[42] = state.value;
228
- $[43] = timeZone;
229
- $[44] = t16;
230
- } else t16 = $[44];
220
+ $[38] = disableManualEntry;
221
+ $[39] = format;
222
+ $[40] = state.value;
223
+ $[41] = timeZone;
224
+ $[42] = t16;
225
+ } else t16 = $[42];
231
226
  const formattedDisplayValue = t16;
232
227
  let t17;
233
- if ($[45] !== hidePlaceholder || $[46] !== isDisabled || $[47] !== segmentGroup || $[48] !== segmentsToRender || $[49] !== state) {
228
+ if ($[43] !== hidePlaceholder || $[44] !== isDisabled || $[45] !== segmentGroup || $[46] !== segmentsToRender || $[47] !== state) {
234
229
  t17 = /* @__PURE__ */ jsx(Fragment, { children: segmentsToRender.map((segment_7, i) => /* @__PURE__ */ jsx(DateSegmentItem, {
235
230
  segment: segment_7,
236
231
  segmentGroup,
@@ -238,52 +233,52 @@ var DateField = (t0) => {
238
233
  isDisabled,
239
234
  hidePlaceholder
240
235
  }, i)) });
241
- $[45] = hidePlaceholder;
242
- $[46] = isDisabled;
243
- $[47] = segmentGroup;
244
- $[48] = segmentsToRender;
245
- $[49] = state;
246
- $[50] = t17;
247
- } else t17 = $[50];
236
+ $[43] = hidePlaceholder;
237
+ $[44] = isDisabled;
238
+ $[45] = segmentGroup;
239
+ $[46] = segmentsToRender;
240
+ $[47] = state;
241
+ $[48] = t17;
242
+ } else t17 = $[48];
248
243
  let fieldContent = t17;
249
244
  if (formattedDisplayValue) {
250
245
  const t18 = isDisabled && "text-interactive-text-secondary-disabled";
251
246
  let t19;
252
- if ($[51] !== t18) {
247
+ if ($[49] !== t18) {
253
248
  t19 = clsx("select-none", t18);
254
- $[51] = t18;
255
- $[52] = t19;
256
- } else t19 = $[52];
249
+ $[49] = t18;
250
+ $[50] = t19;
251
+ } else t19 = $[50];
257
252
  let t20;
258
- if ($[53] !== formattedDisplayValue || $[54] !== t19) {
253
+ if ($[51] !== formattedDisplayValue || $[52] !== t19) {
259
254
  t20 = /* @__PURE__ */ jsx("span", {
260
255
  className: t19,
261
256
  children: formattedDisplayValue
262
257
  });
263
- $[53] = formattedDisplayValue;
264
- $[54] = t19;
265
- $[55] = t20;
266
- } else t20 = $[55];
258
+ $[51] = formattedDisplayValue;
259
+ $[52] = t19;
260
+ $[53] = t20;
261
+ } else t20 = $[53];
267
262
  fieldContent = t20;
268
263
  }
269
264
  const t18 = disableManualEntry && "pointer-events-none";
270
265
  let t19;
271
- if ($[56] !== t18) {
266
+ if ($[54] !== t18) {
272
267
  t19 = clsx("relative w-full", t18);
273
- $[56] = t18;
274
- $[57] = t19;
275
- } else t19 = $[57];
268
+ $[54] = t18;
269
+ $[55] = t19;
270
+ } else t19 = $[55];
276
271
  let t20;
277
- if ($[58] !== fieldContent) {
272
+ if ($[56] !== fieldContent) {
278
273
  t20 = /* @__PURE__ */ jsx("div", {
279
274
  className: "flex",
280
275
  children: fieldContent
281
276
  });
282
- $[58] = fieldContent;
283
- $[59] = t20;
284
- } else t20 = $[59];
277
+ $[56] = fieldContent;
278
+ $[57] = t20;
279
+ } else t20 = $[57];
285
280
  let t21;
286
- if ($[60] !== fieldProps || $[61] !== handleBlur || $[62] !== t19 || $[63] !== t20) {
281
+ if ($[58] !== fieldProps || $[59] !== handleBlur || $[60] !== t19 || $[61] !== t20) {
287
282
  t21 = /* @__PURE__ */ jsx("div", {
288
283
  ...fieldProps,
289
284
  ref: dataFieldRef,
@@ -291,12 +286,12 @@ var DateField = (t0) => {
291
286
  className: t19,
292
287
  children: t20
293
288
  });
294
- $[60] = fieldProps;
295
- $[61] = handleBlur;
296
- $[62] = t19;
297
- $[63] = t20;
298
- $[64] = t21;
299
- } else t21 = $[64];
289
+ $[58] = fieldProps;
290
+ $[59] = handleBlur;
291
+ $[60] = t19;
292
+ $[61] = t20;
293
+ $[62] = t21;
294
+ } else t21 = $[62];
300
295
  return t21;
301
296
  };
302
297
  function _temp(segment_0) {
@@ -8,7 +8,6 @@ import { DateTimeUtils } from "../../../../utils/date-time.utils.js";
8
8
  import { DateField } from "./DateField.js";
9
9
  import { datePickerInputContentRowDefinition } from "./datePickerInput.cva.js";
10
10
  import { renderDatePickerTodayIcon } from "./datePickerTodayIcon.js";
11
- import { useFirefoxDateSegmentSelectionGuard } from "./useFirefoxDateSegmentSelectionGuard.js";
12
11
  import { InputClear } from "../../shared/InputClear.js";
13
12
  import { c } from "react/compiler-runtime";
14
13
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -59,7 +58,6 @@ var DatePickerInput = (t0) => {
59
58
  const dateFieldRef = useRef(null);
60
59
  const endDateFieldRef = useRef(null);
61
60
  const containerRef = useRef(null);
62
- useFirefoxDateSegmentSelectionGuard(containerRef);
63
61
  const t8 = isValueControlled ? fieldValue ?? null : fieldProps.value ?? null;
64
62
  let t9;
65
63
  if ($[4] !== autoFixYear || $[5] !== fieldProps || $[6] !== t8) {