@povio/ui 3.2.0 → 3.2.2-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 (33) hide show
  1. package/dist/components/inputs/Checkbox/Checkbox.d.ts +4 -2
  2. package/dist/components/inputs/Checkbox/Checkbox.js +83 -69
  3. package/dist/components/inputs/Checkbox/CheckboxGroup.d.ts +23 -0
  4. package/dist/components/inputs/Checkbox/CheckboxGroup.js +363 -0
  5. package/dist/components/inputs/Checkbox/checkbox.cva.d.ts +62 -0
  6. package/dist/components/inputs/Checkbox/checkbox.cva.js +103 -1
  7. package/dist/components/inputs/DateTime/DatePicker/DatePicker.js +1 -1
  8. package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js +1 -1
  9. package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.js +1 -1
  10. package/dist/components/inputs/DateTime/TimePicker/TimePicker.js +1 -1
  11. package/dist/components/inputs/DateTime/shared/DateField.d.ts +2 -1
  12. package/dist/components/inputs/DateTime/shared/DateField.js +167 -149
  13. package/dist/components/inputs/DateTime/shared/DatePickerInput.js +136 -132
  14. package/dist/components/inputs/DateTime/shared/TimePickerInput.js +1 -1
  15. package/dist/components/inputs/FormField/FormFieldHeader.js +1 -1
  16. package/dist/components/inputs/Input/NumberInput/NumberInput.js +1 -1
  17. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeField.js +1 -1
  18. package/dist/components/inputs/Input/NumberRangeInput/NumberRangeInput.js +1 -1
  19. package/dist/components/inputs/Input/TextArea/TextArea.js +2 -2
  20. package/dist/components/inputs/Input/TextInput/TextInput.js +1 -1
  21. package/dist/components/inputs/Input/shared/InputContent.js +1 -1
  22. package/dist/components/inputs/Inputs/InputItem.d.ts +1 -0
  23. package/dist/components/inputs/Inputs/InputItem.js +2 -0
  24. package/dist/components/inputs/RadioGroup/RadioGroup.js +1 -1
  25. package/dist/components/inputs/Selection/shared/SelectDesktop.js +1 -1
  26. package/dist/components/inputs/Selection/shared/SelectInput.js +1 -1
  27. package/dist/components/inputs/Skeleton/InputFrame.js +2 -2
  28. package/dist/components/inputs/TextEditor/TextEditor.js +1 -1
  29. package/dist/config/uiOverrides.context.d.ts +3 -0
  30. package/dist/index.d.ts +3 -1
  31. package/dist/index.js +8 -7
  32. package/dist/tw-ui-plugin.js +2 -0
  33. package/package.json +5 -5
@@ -2,13 +2,13 @@ import { UIOverrides } from "../../../../config/uiOverrides.context.js";
2
2
  import { Typography } from "../../../text/Typography/Typography.js";
3
3
  import { UIConfig } from "../../../../config/uiConfig.context.js";
4
4
  import { InlineIconButton } from "../../../buttons/InlineIconButton/InlineIconButton.js";
5
+ import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
6
+ import { inputBaseDefinition, inputSizeDefinition } from "../../shared/input.cva.js";
5
7
  import { DateTimeUtils } from "../../../../utils/date-time.utils.js";
6
8
  import { DateField } from "./DateField.js";
7
9
  import { datePickerInputContentRowDefinition } from "./datePickerInput.cva.js";
8
10
  import { renderDatePickerTodayIcon } from "./datePickerTodayIcon.js";
9
- import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
10
11
  import { InputClear } from "../../shared/InputClear.js";
11
- import { inputBaseDefinition, inputSizeDefinition } from "../../shared/input.cva.js";
12
12
  import { c } from "react/compiler-runtime";
13
13
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
14
14
  import { clsx } from "clsx";
@@ -18,7 +18,7 @@ import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
18
18
  import { getLocalTimeZone, today } from "@internationalized/date";
19
19
  //#region src/components/inputs/DateTime/shared/DatePickerInput.tsx
20
20
  var DatePickerInput = (t0) => {
21
- const $ = c(96);
21
+ const $ = c(98);
22
22
  const { ref, as, groupProps, fieldProps, endFieldProps, fieldValue, endFieldValue, isValueControlled, hasValue, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, shouldShrinkInput, isClearable, headerProps, todayIcon, todayIconButtonSize: t1, todayIconButtonComponent, todayIconPlacement: t2, isDirty, isRequired, disableManualEntry, autoFixYear: t3, placeholder, className, onOpenDropdown, dateGranularity: t4, timeZone: timeZoneProp, isTimeOptional: t5, format, fireBlurOnChange, onClear: onClearProp, ...props } = t0;
23
23
  const todayIconButtonSize = t1 === void 0 ? "none" : t1;
24
24
  const todayIconPlacement = t2 === void 0 ? "content" : t2;
@@ -60,30 +60,34 @@ var DatePickerInput = (t0) => {
60
60
  const containerRef = useRef(null);
61
61
  const t8 = isValueControlled ? fieldValue ?? null : fieldProps.value ?? null;
62
62
  let t9;
63
- if ($[4] !== fieldProps || $[5] !== t8) {
63
+ if ($[4] !== autoFixYear || $[5] !== fieldProps || $[6] !== t8) {
64
64
  t9 = {
65
65
  ...fieldProps,
66
- value: t8
66
+ value: t8,
67
+ shouldAutoFixYear: autoFixYear
67
68
  };
68
- $[4] = fieldProps;
69
- $[5] = t8;
70
- $[6] = t9;
71
- } else t9 = $[6];
69
+ $[4] = autoFixYear;
70
+ $[5] = fieldProps;
71
+ $[6] = t8;
72
+ $[7] = t9;
73
+ } else t9 = $[7];
72
74
  const normalizedFieldProps = t9;
73
75
  let t10;
74
- if ($[7] !== endFieldProps || $[8] !== endFieldValue || $[9] !== isValueControlled) {
76
+ if ($[8] !== autoFixYear || $[9] !== endFieldProps || $[10] !== endFieldValue || $[11] !== isValueControlled) {
75
77
  t10 = endFieldProps ? {
76
78
  ...endFieldProps,
77
- value: isValueControlled ? endFieldValue ?? null : endFieldProps.value ?? null
79
+ value: isValueControlled ? endFieldValue ?? null : endFieldProps.value ?? null,
80
+ shouldAutoFixYear: autoFixYear
78
81
  } : void 0;
79
- $[7] = endFieldProps;
80
- $[8] = endFieldValue;
81
- $[9] = isValueControlled;
82
- $[10] = t10;
83
- } else t10 = $[10];
82
+ $[8] = autoFixYear;
83
+ $[9] = endFieldProps;
84
+ $[10] = endFieldValue;
85
+ $[11] = isValueControlled;
86
+ $[12] = t10;
87
+ } else t10 = $[12];
84
88
  const normalizedEndFieldProps = t10;
85
89
  let t11;
86
- if ($[11] !== endFieldProps || $[12] !== fieldProps || $[13] !== fireBlurOnChange || $[14] !== onClearProp) {
90
+ if ($[13] !== endFieldProps || $[14] !== fieldProps || $[15] !== fireBlurOnChange || $[16] !== onClearProp) {
87
91
  t11 = () => {
88
92
  dateFieldRef.current?.clearField();
89
93
  endDateFieldRef.current?.clearField();
@@ -98,36 +102,36 @@ var DatePickerInput = (t0) => {
98
102
  }
99
103
  setCanClear(false);
100
104
  };
101
- $[11] = endFieldProps;
102
- $[12] = fieldProps;
103
- $[13] = fireBlurOnChange;
104
- $[14] = onClearProp;
105
- $[15] = t11;
106
- } else t11 = $[15];
105
+ $[13] = endFieldProps;
106
+ $[14] = fieldProps;
107
+ $[15] = fireBlurOnChange;
108
+ $[16] = onClearProp;
109
+ $[17] = t11;
110
+ } else t11 = $[17];
107
111
  const clearInput = t11;
108
112
  let t12;
109
113
  let t13;
110
- if ($[16] !== clearInput) {
114
+ if ($[18] !== clearInput) {
111
115
  t12 = () => ({
112
116
  clear: clearInput,
113
117
  getContainer: () => containerRef.current
114
118
  });
115
119
  t13 = [clearInput];
116
- $[16] = clearInput;
117
- $[17] = t12;
118
- $[18] = t13;
120
+ $[18] = clearInput;
121
+ $[19] = t12;
122
+ $[20] = t13;
119
123
  } else {
120
- t12 = $[17];
121
- t13 = $[18];
124
+ t12 = $[19];
125
+ t13 = $[20];
122
126
  }
123
127
  useImperativeHandle(ref, t12, t13);
124
128
  let t14;
125
- if ($[19] === Symbol.for("react.memo_cache_sentinel")) {
129
+ if ($[21] === Symbol.for("react.memo_cache_sentinel")) {
126
130
  t14 = (canClearInput) => {
127
131
  setCanClear(canClearInput);
128
132
  };
129
- $[19] = t14;
130
- } else t14 = $[19];
133
+ $[21] = t14;
134
+ } else t14 = $[21];
131
135
  const onClearChange = t14;
132
136
  const showClear = canClear || hasValue || normalizedFieldProps.value != null || normalizedEndFieldProps?.value != null;
133
137
  const isTodayIconDisabled = isDisabled || buttonProps.isDisabled;
@@ -173,50 +177,50 @@ var DatePickerInput = (t0) => {
173
177
  const t26 = normalizedFieldProps.value != null || void 0;
174
178
  const t27 = shouldShrinkInput ? "min-w-0 flex-1 w-full" : "w-full";
175
179
  let t28;
176
- if ($[20] !== as || $[21] !== inputSizeCva || $[22] !== size || $[23] !== t27) {
180
+ if ($[22] !== as || $[23] !== inputSizeCva || $[24] !== size || $[25] !== t27) {
177
181
  t28 = clsx("flex items-center gap-input-gap-input-text-to-elements pr-0!", t27, inputSizeCva({
178
182
  size,
179
183
  as
180
184
  }));
181
- $[20] = as;
182
- $[21] = inputSizeCva;
183
- $[22] = size;
184
- $[23] = t27;
185
- $[24] = t28;
186
- } else t28 = $[24];
185
+ $[22] = as;
186
+ $[23] = inputSizeCva;
187
+ $[24] = size;
188
+ $[25] = t27;
189
+ $[26] = t28;
190
+ } else t28 = $[26];
187
191
  let t29;
188
- if ($[25] !== as || $[26] !== headerProps) {
192
+ if ($[27] !== as || $[28] !== headerProps) {
189
193
  t29 = as && ["filter", "floating"].includes(as) && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
190
194
  as,
191
195
  ...headerProps
192
196
  });
193
- $[25] = as;
194
- $[26] = headerProps;
195
- $[27] = t29;
196
- } else t29 = $[27];
197
+ $[27] = as;
198
+ $[28] = headerProps;
199
+ $[29] = t29;
200
+ } else t29 = $[29];
197
201
  const t30 = shouldRenderTodayIconWithFieldLabel && todayIconButton;
198
202
  let t31;
199
- if ($[28] !== datePickerInputContentRowCva || $[29] !== size) {
203
+ if ($[30] !== datePickerInputContentRowCva || $[31] !== size) {
200
204
  t31 = datePickerInputContentRowCva({ size });
201
- $[28] = datePickerInputContentRowCva;
202
- $[29] = size;
203
- $[30] = t31;
204
- } else t31 = $[30];
205
+ $[30] = datePickerInputContentRowCva;
206
+ $[31] = size;
207
+ $[32] = t31;
208
+ } else t31 = $[32];
205
209
  let t32;
206
- if ($[31] !== disableManualEntry || $[32] !== isDisabled || $[33] !== onOpenDropdown) {
210
+ if ($[33] !== disableManualEntry || $[34] !== isDisabled || $[35] !== onOpenDropdown) {
207
211
  t32 = disableManualEntry && /* @__PURE__ */ jsx(Button, {
208
212
  onPress: onOpenDropdown,
209
213
  className: "absolute inset-0 z-base",
210
214
  isDisabled
211
215
  });
212
- $[31] = disableManualEntry;
213
- $[32] = isDisabled;
214
- $[33] = onOpenDropdown;
215
- $[34] = t32;
216
- } else t32 = $[34];
216
+ $[33] = disableManualEntry;
217
+ $[34] = isDisabled;
218
+ $[35] = onOpenDropdown;
219
+ $[36] = t32;
220
+ } else t32 = $[36];
217
221
  const t33 = !shouldRenderTodayIconWithFieldLabel && todayIconButton;
218
222
  let t34;
219
- if ($[35] !== as || $[36] !== dateGranularity || $[37] !== disableManualEntry || $[38] !== effectiveTimeZone || $[39] !== fieldProps || $[40] !== format || $[41] !== hidePlaceholder || $[42] !== isDisabled || $[43] !== isInvalid || $[44] !== isTimeOptional || $[45] !== normalizedEndFieldProps || $[46] !== normalizedFieldProps || $[47] !== onClearChange || $[48] !== placeholder) {
223
+ if ($[37] !== as || $[38] !== dateGranularity || $[39] !== disableManualEntry || $[40] !== effectiveTimeZone || $[41] !== fieldProps || $[42] !== format || $[43] !== hidePlaceholder || $[44] !== isDisabled || $[45] !== isInvalid || $[46] !== isTimeOptional || $[47] !== normalizedEndFieldProps || $[48] !== normalizedFieldProps || $[49] !== onClearChange || $[50] !== placeholder) {
220
224
  t34 = disableManualEntry && placeholder && !fieldProps.value ? /* @__PURE__ */ jsx(Typography, {
221
225
  size: "label-1",
222
226
  className: "text-text-default-3",
@@ -250,24 +254,24 @@ var DatePickerInput = (t0) => {
250
254
  timeZone: effectiveTimeZone,
251
255
  segmentGroup: "end"
252
256
  })] })] });
253
- $[35] = as;
254
- $[36] = dateGranularity;
255
- $[37] = disableManualEntry;
256
- $[38] = effectiveTimeZone;
257
- $[39] = fieldProps;
258
- $[40] = format;
259
- $[41] = hidePlaceholder;
260
- $[42] = isDisabled;
261
- $[43] = isInvalid;
262
- $[44] = isTimeOptional;
263
- $[45] = normalizedEndFieldProps;
264
- $[46] = normalizedFieldProps;
265
- $[47] = onClearChange;
266
- $[48] = placeholder;
267
- $[49] = t34;
268
- } else t34 = $[49];
257
+ $[37] = as;
258
+ $[38] = dateGranularity;
259
+ $[39] = disableManualEntry;
260
+ $[40] = effectiveTimeZone;
261
+ $[41] = fieldProps;
262
+ $[42] = format;
263
+ $[43] = hidePlaceholder;
264
+ $[44] = isDisabled;
265
+ $[45] = isInvalid;
266
+ $[46] = isTimeOptional;
267
+ $[47] = normalizedEndFieldProps;
268
+ $[48] = normalizedFieldProps;
269
+ $[49] = onClearChange;
270
+ $[50] = placeholder;
271
+ $[51] = t34;
272
+ } else t34 = $[51];
269
273
  let t35;
270
- if ($[50] !== t31 || $[51] !== t32 || $[52] !== t33 || $[53] !== t34) {
274
+ if ($[52] !== t31 || $[53] !== t32 || $[54] !== t33 || $[55] !== t34) {
271
275
  t35 = /* @__PURE__ */ jsxs("div", {
272
276
  className: t31,
273
277
  children: [
@@ -276,14 +280,14 @@ var DatePickerInput = (t0) => {
276
280
  t34
277
281
  ]
278
282
  });
279
- $[50] = t31;
280
- $[51] = t32;
281
- $[52] = t33;
282
- $[53] = t34;
283
- $[54] = t35;
284
- } else t35 = $[54];
283
+ $[52] = t31;
284
+ $[53] = t32;
285
+ $[54] = t33;
286
+ $[55] = t34;
287
+ $[56] = t35;
288
+ } else t35 = $[56];
285
289
  let t36;
286
- if ($[55] !== t28 || $[56] !== t29 || $[57] !== t30 || $[58] !== t35) {
290
+ if ($[57] !== t28 || $[58] !== t29 || $[59] !== t30 || $[60] !== t35) {
287
291
  t36 = /* @__PURE__ */ jsxs("div", {
288
292
  className: t28,
289
293
  children: [
@@ -292,36 +296,36 @@ var DatePickerInput = (t0) => {
292
296
  t35
293
297
  ]
294
298
  });
295
- $[55] = t28;
296
- $[56] = t29;
297
- $[57] = t30;
298
- $[58] = t35;
299
- $[59] = t36;
300
- } else t36 = $[59];
299
+ $[57] = t28;
300
+ $[58] = t29;
301
+ $[59] = t30;
302
+ $[60] = t35;
303
+ $[61] = t36;
304
+ } else t36 = $[61];
301
305
  let t37;
302
- if ($[60] !== as || $[61] !== inputSizeCva || $[62] !== size) {
306
+ if ($[62] !== as || $[63] !== inputSizeCva || $[64] !== size) {
303
307
  t37 = clsx(inputSizeCva({
304
308
  size,
305
309
  as
306
310
  }), "flex items-center gap-input-gap-trailing-elements py-0! pl-0!");
307
- $[60] = as;
308
- $[61] = inputSizeCva;
309
- $[62] = size;
310
- $[63] = t37;
311
- } else t37 = $[63];
311
+ $[62] = as;
312
+ $[63] = inputSizeCva;
313
+ $[64] = size;
314
+ $[65] = t37;
315
+ } else t37 = $[65];
312
316
  let t38;
313
- if ($[64] !== clearInput || $[65] !== isClearable || $[66] !== showClear) {
317
+ if ($[66] !== clearInput || $[67] !== isClearable || $[68] !== showClear) {
314
318
  t38 = isClearable && /* @__PURE__ */ jsx(InputClear, {
315
319
  onClear: clearInput,
316
320
  show: showClear
317
321
  });
318
- $[64] = clearInput;
319
- $[65] = isClearable;
320
- $[66] = showClear;
321
- $[67] = t38;
322
- } else t38 = $[67];
322
+ $[66] = clearInput;
323
+ $[67] = isClearable;
324
+ $[68] = showClear;
325
+ $[69] = t38;
326
+ } else t38 = $[69];
323
327
  let t39;
324
- if ($[68] !== buttonProps || $[69] !== disableDropdown || $[70] !== disableManualEntry || $[71] !== isDisabled || $[72] !== pickerIcon) {
328
+ if ($[70] !== buttonProps || $[71] !== disableDropdown || $[72] !== disableManualEntry || $[73] !== isDisabled || $[74] !== pickerIcon) {
325
329
  t39 = (!disableDropdown || disableManualEntry) && /* @__PURE__ */ jsx(InlineIconButton, {
326
330
  label: "",
327
331
  color: "secondary",
@@ -331,26 +335,26 @@ var DatePickerInput = (t0) => {
331
335
  className: "border-0!",
332
336
  "data-static-press-action": ""
333
337
  });
334
- $[68] = buttonProps;
335
- $[69] = disableDropdown;
336
- $[70] = disableManualEntry;
337
- $[71] = isDisabled;
338
- $[72] = pickerIcon;
339
- $[73] = t39;
340
- } else t39 = $[73];
338
+ $[70] = buttonProps;
339
+ $[71] = disableDropdown;
340
+ $[72] = disableManualEntry;
341
+ $[73] = isDisabled;
342
+ $[74] = pickerIcon;
343
+ $[75] = t39;
344
+ } else t39 = $[75];
341
345
  let t40;
342
- if ($[74] !== t37 || $[75] !== t38 || $[76] !== t39) {
346
+ if ($[76] !== t37 || $[77] !== t38 || $[78] !== t39) {
343
347
  t40 = /* @__PURE__ */ jsxs("div", {
344
348
  className: t37,
345
349
  children: [t38, t39]
346
350
  });
347
- $[74] = t37;
348
- $[75] = t38;
349
- $[76] = t39;
350
- $[77] = t40;
351
- } else t40 = $[77];
351
+ $[76] = t37;
352
+ $[77] = t38;
353
+ $[78] = t39;
354
+ $[79] = t40;
355
+ } else t40 = $[79];
352
356
  let t41;
353
- if ($[78] !== focusWithinProps || $[79] !== groupProps || $[80] !== hoverProps || $[81] !== t15 || $[82] !== t16 || $[83] !== t17 || $[84] !== t18 || $[85] !== t19 || $[86] !== t20 || $[87] !== t21 || $[88] !== t22 || $[89] !== t23 || $[90] !== t24 || $[91] !== t25 || $[92] !== t26 || $[93] !== t36 || $[94] !== t40) {
357
+ if ($[80] !== focusWithinProps || $[81] !== groupProps || $[82] !== hoverProps || $[83] !== t15 || $[84] !== t16 || $[85] !== t17 || $[86] !== t18 || $[87] !== t19 || $[88] !== t20 || $[89] !== t21 || $[90] !== t22 || $[91] !== t23 || $[92] !== t24 || $[93] !== t25 || $[94] !== t26 || $[95] !== t36 || $[96] !== t40) {
354
358
  t41 = /* @__PURE__ */ jsxs("div", {
355
359
  ref: containerRef,
356
360
  ...groupProps,
@@ -372,25 +376,25 @@ var DatePickerInput = (t0) => {
372
376
  "data-is-filled": t26,
373
377
  children: [t36, t40]
374
378
  });
375
- $[78] = focusWithinProps;
376
- $[79] = groupProps;
377
- $[80] = hoverProps;
378
- $[81] = t15;
379
- $[82] = t16;
380
- $[83] = t17;
381
- $[84] = t18;
382
- $[85] = t19;
383
- $[86] = t20;
384
- $[87] = t21;
385
- $[88] = t22;
386
- $[89] = t23;
387
- $[90] = t24;
388
- $[91] = t25;
389
- $[92] = t26;
390
- $[93] = t36;
391
- $[94] = t40;
392
- $[95] = t41;
393
- } else t41 = $[95];
379
+ $[80] = focusWithinProps;
380
+ $[81] = groupProps;
381
+ $[82] = hoverProps;
382
+ $[83] = t15;
383
+ $[84] = t16;
384
+ $[85] = t17;
385
+ $[86] = t18;
386
+ $[87] = t19;
387
+ $[88] = t20;
388
+ $[89] = t21;
389
+ $[90] = t22;
390
+ $[91] = t23;
391
+ $[92] = t24;
392
+ $[93] = t25;
393
+ $[94] = t26;
394
+ $[95] = t36;
395
+ $[96] = t40;
396
+ $[97] = t41;
397
+ } else t41 = $[97];
394
398
  return t41;
395
399
  };
396
400
  //#endregion
@@ -3,8 +3,8 @@ import { Typography } from "../../../text/Typography/Typography.js";
3
3
  import { UIConfig } from "../../../../config/uiConfig.context.js";
4
4
  import { InlineIconButton } from "../../../buttons/InlineIconButton/InlineIconButton.js";
5
5
  import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
6
- import { InputClear } from "../../shared/InputClear.js";
7
6
  import { inputBaseDefinition, inputSizeDefinition } from "../../shared/input.cva.js";
7
+ import { InputClear } from "../../shared/InputClear.js";
8
8
  import { TimeField } from "./TimeField.js";
9
9
  import { c } from "react/compiler-runtime";
10
10
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -2,8 +2,8 @@ import { InfoIcon } from "../../../assets/icons/Info.js";
2
2
  import { UIOverrides } from "../../../config/uiOverrides.context.js";
3
3
  import { Typography } from "../../text/Typography/Typography.js";
4
4
  import { Tooltip as Tooltip$1 } from "../../overlays/Tooltip/Tooltip.js";
5
- import { FormFieldLabel } from "./FormFieldLabel.js";
6
5
  import { formFieldHeaderDefinition } from "./formFieldHeader.cva.js";
6
+ import { FormFieldLabel } from "./FormFieldLabel.js";
7
7
  import { c } from "react/compiler-runtime";
8
8
  import { jsx, jsxs } from "react/jsx-runtime";
9
9
  import { clsx } from "clsx";
@@ -1,7 +1,7 @@
1
1
  import { UIOverrides } from "../../../../config/uiOverrides.context.js";
2
2
  import { UIConfig } from "../../../../config/uiConfig.context.js";
3
- import { inputBaseDefinition } from "../../shared/input.cva.js";
4
3
  import { FormField } from "../../FormField/FormField.js";
4
+ import { inputBaseDefinition } from "../../shared/input.cva.js";
5
5
  import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
6
6
  import { InputFrame } from "../../Skeleton/InputFrame.js";
7
7
  import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
@@ -1,7 +1,7 @@
1
1
  import { UIConfig } from "../../../../config/uiConfig.context.js";
2
2
  import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
3
- import { InputClear } from "../../shared/InputClear.js";
4
3
  import { FormField } from "../../FormField/FormField.js";
4
+ import { InputClear } from "../../shared/InputClear.js";
5
5
  import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
6
6
  import { c } from "react/compiler-runtime";
7
7
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -1,8 +1,8 @@
1
1
  import { UIOverrides } from "../../../../config/uiOverrides.context.js";
2
2
  import { UIConfig } from "../../../../config/uiConfig.context.js";
3
3
  import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
4
- import { InputClear } from "../../shared/InputClear.js";
5
4
  import { inputBaseDefinition, inputSizeDefinition } from "../../shared/input.cva.js";
5
+ import { InputClear } from "../../shared/InputClear.js";
6
6
  import { InputFrame } from "../../Skeleton/InputFrame.js";
7
7
  import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
8
8
  import { getStaticNumberDisplayValue } from "../shared/numberStatic.utils.js";
@@ -1,9 +1,9 @@
1
1
  import { UIOverrides } from "../../../../config/uiOverrides.context.js";
2
2
  import { UIConfig } from "../../../../config/uiConfig.context.js";
3
3
  import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
4
- import { InputClear } from "../../shared/InputClear.js";
5
- import { inputSideDefinition, inputSizeDefinition, useInputCva } from "../../shared/input.cva.js";
6
4
  import { FormField } from "../../FormField/FormField.js";
5
+ import { inputSideDefinition, inputSizeDefinition, useInputCva } from "../../shared/input.cva.js";
6
+ import { InputClear } from "../../shared/InputClear.js";
7
7
  import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
8
8
  import { textAreaWrapperDefinition } from "./TextArea.cva.js";
9
9
  import { c } from "react/compiler-runtime";
@@ -1,7 +1,7 @@
1
1
  import { UIOverrides } from "../../../../config/uiOverrides.context.js";
2
2
  import { UIConfig } from "../../../../config/uiConfig.context.js";
3
- import { inputBaseDefinition } from "../../shared/input.cva.js";
4
3
  import { FormField } from "../../FormField/FormField.js";
4
+ import { inputBaseDefinition } from "../../shared/input.cva.js";
5
5
  import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
6
6
  import { InputFrame } from "../../Skeleton/InputFrame.js";
7
7
  import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
@@ -3,8 +3,8 @@ import { typographyDefinition } from "../../../text/Typography/typography.cva.js
3
3
  import { Loader } from "../../../status/Loader/Loader.js";
4
4
  import { InlineIconButton } from "../../../buttons/InlineIconButton/InlineIconButton.js";
5
5
  import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
6
- import { InputClear } from "../../shared/InputClear.js";
7
6
  import { inputContentWrapperDefinition, inputSizeDefinition } from "../../shared/input.cva.js";
7
+ import { InputClear } from "../../shared/InputClear.js";
8
8
  import { c } from "react/compiler-runtime";
9
9
  import { jsx, jsxs } from "react/jsx-runtime";
10
10
  import { clsx } from "clsx";
@@ -7,6 +7,7 @@ import { HasRequiredProperty } from '../../../types/common';
7
7
  declare const componentRegistry: {
8
8
  readonly toggle: <TFieldValues extends import('react-hook-form').FieldValues>(props: import('../Toggle/Toggle').ControlledToggleProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
9
9
  readonly checkbox: <TFieldValues extends import('react-hook-form').FieldValues>(props: import('../Checkbox/Checkbox').ControlledCheckboxProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
10
+ readonly checkboxGroup: <TFieldValues extends import('react-hook-form').FieldValues>(props: import('../Checkbox/CheckboxGroup').ControlledCheckboxGroupProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
10
11
  readonly numberInput: <TFieldValues extends import('react-hook-form').FieldValues>({ renderStaticInput, ...props }: import('../Input/NumberInput/NumberInput').ControlledNumberInputProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
11
12
  readonly numberRangeInput: <TFieldValues extends import('react-hook-form').FieldValues>({ renderStaticInput, ...props }: import('../Input/NumberRangeInput/NumberRangeInput').ControlledNumberRangeInputProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
12
13
  readonly slider: <TFieldValues extends import('react-hook-form').FieldValues, IsRange extends boolean = false>(props: import('../Slider/Slider').ControlledSliderProps<TFieldValues, IsRange>) => import("react/jsx-runtime").JSX.Element;
@@ -1,4 +1,5 @@
1
1
  import { Checkbox } from "../Checkbox/Checkbox.js";
2
+ import { CheckboxGroup } from "../Checkbox/CheckboxGroup.js";
2
3
  import { DatePicker } from "../DateTime/DatePicker/DatePicker.js";
3
4
  import { TextInput } from "../Input/TextInput/TextInput.js";
4
5
  import { Select } from "../Selection/Select/Select.js";
@@ -21,6 +22,7 @@ import { jsx } from "react/jsx-runtime";
21
22
  var componentRegistry = {
22
23
  toggle: Toggle,
23
24
  checkbox: Checkbox,
25
+ checkboxGroup: CheckboxGroup,
24
26
  numberInput: NumberInput,
25
27
  numberRangeInput: NumberRangeInput,
26
28
  slider: Slider,
@@ -2,8 +2,8 @@ import { UIOverrides } from "../../../config/uiOverrides.context.js";
2
2
  import { UIConfig } from "../../../config/uiConfig.context.js";
3
3
  import { CheckContent } from "../shared/CheckContent.js";
4
4
  import { FormFieldLabel } from "../FormField/FormFieldLabel.js";
5
- import { inputBaseDefinition, inputSizeDefinition } from "../shared/input.cva.js";
6
5
  import { FormField } from "../FormField/FormField.js";
6
+ import { inputBaseDefinition, inputSizeDefinition } from "../shared/input.cva.js";
7
7
  import { radioContentClassName, radioContentRowDefinition, radioContentWrapperDefinition, radioDefinition, radioIndicatorClass, radioTypography } from "./radio.cva.js";
8
8
  import { c } from "react/compiler-runtime";
9
9
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -1,6 +1,6 @@
1
1
  import { UIOverrides } from "../../../../config/uiOverrides.context.js";
2
- import { popoverDefinition } from "../../../shared/popover.cva.js";
3
2
  import { FormField } from "../../FormField/FormField.js";
3
+ import { popoverDefinition } from "../../../shared/popover.cva.js";
4
4
  import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
5
5
  import "./useSelectItems.js";
6
6
  import { SelectContext } from "./select.context.js";
@@ -3,8 +3,8 @@ import { UIOverrides } from "../../../../config/uiOverrides.context.js";
3
3
  import { Typography } from "../../../text/Typography/Typography.js";
4
4
  import "../../../../config/i18n.js";
5
5
  import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
6
- import { InputClear } from "../../shared/InputClear.js";
7
6
  import { inputBaseDefinition, inputClearClassDefinition, inputSizeDefinition } from "../../shared/input.cva.js";
7
+ import { InputClear } from "../../shared/InputClear.js";
8
8
  import { SelectInputTags } from "./SelectInputTags.js";
9
9
  import { SelectContext } from "./select.context.js";
10
10
  import { selectInputTagsContentWrapperDefinition } from "./selectInput.cva.js";
@@ -4,9 +4,9 @@ import { Loader } from "../../status/Loader/Loader.js";
4
4
  import { UIConfig } from "../../../config/uiConfig.context.js";
5
5
  import { InlineIconButton } from "../../buttons/InlineIconButton/InlineIconButton.js";
6
6
  import { FormFieldLabel } from "../FormField/FormFieldLabel.js";
7
- import { InputClear } from "../shared/InputClear.js";
8
- import { inputBaseDefinition, inputContentWrapperDefinition, inputSizeDefinition } from "../shared/input.cva.js";
9
7
  import { FormField } from "../FormField/FormField.js";
8
+ import { inputBaseDefinition, inputContentWrapperDefinition, inputSizeDefinition } from "../shared/input.cva.js";
9
+ import { InputClear } from "../shared/InputClear.js";
10
10
  import { TooltipWrapper } from "../shared/TooltipWrapper.js";
11
11
  import { c } from "react/compiler-runtime";
12
12
  import { Fragment, jsx, jsxs } from "react/jsx-runtime";
@@ -2,8 +2,8 @@ import { UIOverrides } from "../../../config/uiOverrides.context.js";
2
2
  import { isEqual } from "../../../utils/isEqual.js";
3
3
  import { uiOutlineClass } from "../../outline.clsx.js";
4
4
  import { FormFieldLabel } from "../FormField/FormFieldLabel.js";
5
- import { inputSideDefinition } from "../shared/input.cva.js";
6
5
  import { FormField } from "../FormField/FormField.js";
6
+ import { inputSideDefinition } from "../shared/input.cva.js";
7
7
  import { TextEditorToolbar } from "./Toolbar/TextEditorToolbar.js";
8
8
  import { c } from "react/compiler-runtime";
9
9
  import { jsx, jsxs } from "react/jsx-runtime";
@@ -36,6 +36,9 @@ export declare namespace UIOverrides {
36
36
  };
37
37
  checkbox: {
38
38
  cva?: GenericCvaOption;
39
+ contentWrapperCva?: GenericCvaOption;
40
+ contentRowCva?: GenericCvaOption;
41
+ groupLabelCva?: GenericCvaOption;
39
42
  iconCva?: GenericCvaOption;
40
43
  typography?: Mapper;
41
44
  contentClassName?: Mapper;
package/dist/index.d.ts CHANGED
@@ -58,6 +58,8 @@ export type { ToggleButtonProps } from './components/buttons/ToggleButton/Toggle
58
58
  export { ToggleButton } from './components/buttons/ToggleButton/ToggleButton';
59
59
  export type { CheckboxProps, ControlledCheckboxProps } from './components/inputs/Checkbox/Checkbox';
60
60
  export { Checkbox } from './components/inputs/Checkbox/Checkbox';
61
+ export type { CheckboxGroupProps, ControlledCheckboxGroupProps } from './components/inputs/Checkbox/CheckboxGroup';
62
+ export { CheckboxGroup } from './components/inputs/Checkbox/CheckboxGroup';
61
63
  export type { CheckboxVariantProps } from './components/inputs/Checkbox/checkbox.cva';
62
64
  export type { ControlledDatePickerProps, DatePickerProps } from './components/inputs/DateTime/DatePicker/DatePicker';
63
65
  export { DatePicker } from './components/inputs/DateTime/DatePicker/DatePicker';
@@ -184,7 +186,7 @@ export { UIOverrides } from './config/uiOverrides.context';
184
186
  export { breadcrumbChevronDefinition, breadcrumbIconDefinition, breadcrumbItemDefinition, breadcrumbsDefinition, breadcrumbSegmentDefinition, } from './components/Breadcrumbs/breadcrumbs.cva';
185
187
  export { buttonContentDefinition, buttonDefinition, buttonIconSizeDefinition, buttonSizeDefinition, } from './components/buttons/Button/button.cva';
186
188
  export { pillButtonContentDefinition, pillButtonDefinition } from './components/buttons/PillButton/pillButton.cva';
187
- export { checkboxDefinition, checkboxIconDefinition } from './components/inputs/Checkbox/checkbox.cva';
189
+ export { checkboxContentRowDefinition, checkboxContentWrapperDefinition, checkboxDefinition, checkboxGroupLabelDefinition, checkboxIconDefinition, } from './components/inputs/Checkbox/checkbox.cva';
188
190
  export { datePickerInputContentRowDefinition } from './components/inputs/DateTime/shared/datePickerInput.cva';
189
191
  export { fileUploadDropZoneDefinition } from './components/inputs/File/shared/fileUpload.cva';
190
192
  export { inputUploadButtonDefinition, inputUploadDropZoneDefinition, } from './components/inputs/File/shared/inputUploadButton.cva';