@povio/ui 2.3.0-rc.11 → 2.3.0-rc.13

package/dist/components/inputs/Checkbox/Checkbox.d.ts

@@ -8,6 +8,7 @@ interface CheckboxBaseProps extends FormFieldErrorProps, CheckboxVariantProps, O
     ref?: Ref<HTMLLabelElement>;
     children: string | ReactElement;
     hideLabel?: boolean;
+    fireBlurOnChange?: boolean;
     selectedIcon?: ComponentType<SVGProps<SVGSVGElement>>;
     indeterminateIcon?: ComponentType<SVGProps<SVGSVGElement>>;
     isDirty?: boolean;

package/dist/components/inputs/Checkbox/Checkbox.js

@@ -12,72 +12,94 @@ import { mergeRefs } from "@react-aria/utils";
 import { Controller } from "react-hook-form";
 //#region src/components/inputs/Checkbox/Checkbox.tsx
 var CheckboxBase = (props) => {
-	const $ = c(38);
+	const $ = c(46);
 	const ui = UIConfig.useConfig();
 	const checkboxTypographyMap = UIStyle.useMapper("checkbox.typography", checkboxTypography);
 	const checkboxContentClassNameMap = UIStyle.useMapper("checkbox.contentClassName", checkboxContentClassName);
 	let children;
 	let className;
 	let error;
+	let fireBlurOnChangeProp;
 	let hideLabelProp;
 	let isDisabled;
+	let onBlur;
+	let onChange;
 	let rest;
 	let variantProp;
 	if ($[0] !== props) {
-		({className, children, isDisabled, error, variant: variantProp, hideLabel: hideLabelProp, ...rest} = props);
+		({className, children, isDisabled, error, variant: variantProp, hideLabel: hideLabelProp, fireBlurOnChange: fireBlurOnChangeProp, onChange, onBlur, ...rest} = props);
 		$[0] = props;
 		$[1] = children;
 		$[2] = className;
 		$[3] = error;
-		$[4] = hideLabelProp;
-		$[5] = isDisabled;
-		$[6] = rest;
-		$[7] = variantProp;
+		$[4] = fireBlurOnChangeProp;
+		$[5] = hideLabelProp;
+		$[6] = isDisabled;
+		$[7] = onBlur;
+		$[8] = onChange;
+		$[9] = rest;
+		$[10] = variantProp;
 	} else {
 		children = $[1];
 		className = $[2];
 		error = $[3];
-		hideLabelProp = $[4];
-		isDisabled = $[5];
-		rest = $[6];
-		variantProp = $[7];
+		fireBlurOnChangeProp = $[4];
+		hideLabelProp = $[5];
+		isDisabled = $[6];
+		onBlur = $[7];
+		onChange = $[8];
+		rest = $[9];
+		variantProp = $[10];
 	}
 	const variant = variantProp ?? ui.checkbox.variant;
 	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
+	const fireBlurOnChange = fireBlurOnChangeProp ?? ui.checkbox.fireBlurOnChange;
 	let t0;
-	if ($[8] !== error || $[9] !== isDisabled) {
+	if ($[11] !== error || $[12] !== isDisabled) {
 		t0 = {
 			error,
 			isDisabled
 		};
-		$[8] = error;
-		$[9] = isDisabled;
-		$[10] = t0;
-	} else t0 = $[10];
+		$[11] = error;
+		$[12] = isDisabled;
+		$[13] = t0;
+	} else t0 = $[13];
 	const formFieldErrorProps = t0;
-	const t1 = !!error;
-	const t2 = error || void 0;
-	const t3 = props.isDirty || void 0;
-	const t4 = props.isRequired || void 0;
-	let t5;
-	if ($[11] !== className) {
-		t5 = clsx("relative", checkboxIndicatorClass, className);
-		$[11] = className;
-		$[12] = t5;
-	} else t5 = $[12];
+	let t1;
+	if ($[14] !== fireBlurOnChange || $[15] !== onBlur || $[16] !== onChange) {
+		t1 = (isSelected) => {
+			onChange?.(isSelected);
+			if (fireBlurOnChange) onBlur?.({});
+		};
+		$[14] = fireBlurOnChange;
+		$[15] = onBlur;
+		$[16] = onChange;
+		$[17] = t1;
+	} else t1 = $[17];
+	const handleChange = t1;
+	const t2 = !!error;
+	const t3 = error || void 0;
+	const t4 = props.isDirty || void 0;
+	const t5 = props.isRequired || void 0;
 	let t6;
-	if ($[13] !== rest || $[14] !== variant) {
-		t6 = /* @__PURE__ */ jsx(CheckboxCheckmark, {
+	if ($[18] !== className) {
+		t6 = clsx("relative", checkboxIndicatorClass, className);
+		$[18] = className;
+		$[19] = t6;
+	} else t6 = $[19];
+	let t7;
+	if ($[20] !== rest || $[21] !== variant) {
+		t7 = /* @__PURE__ */ jsx(CheckboxCheckmark, {
 			variant,
 			...rest
 		});
-		$[13] = rest;
-		$[14] = variant;
-		$[15] = t6;
-	} else t6 = $[15];
-	let t7;
-	if ($[16] !== checkboxContentClassNameMap || $[17] !== checkboxTypographyMap || $[18] !== children || $[19] !== hideLabel || $[20] !== rest || $[21] !== variant) {
-		t7 = !hideLabel && /* @__PURE__ */ jsx(CheckContent, {
+		$[20] = rest;
+		$[21] = variant;
+		$[22] = t7;
+	} else t7 = $[22];
+	let t8;
+	if ($[23] !== checkboxContentClassNameMap || $[24] !== checkboxTypographyMap || $[25] !== children || $[26] !== hideLabel || $[27] !== rest || $[28] !== variant) {
+		t8 = !hideLabel && /* @__PURE__ */ jsx(CheckContent, {
 			typography: checkboxTypographyMap({
 				variant,
 				...rest
@@ -88,51 +110,53 @@ var CheckboxBase = (props) => {
 			}),
 			children
 		});
-		$[16] = checkboxContentClassNameMap;
-		$[17] = checkboxTypographyMap;
-		$[18] = children;
-		$[19] = hideLabel;
-		$[20] = rest;
-		$[21] = variant;
-		$[22] = t7;
-	} else t7 = $[22];
-	let t8;
-	if ($[23] !== isDisabled || $[24] !== rest || $[25] !== t1 || $[26] !== t2 || $[27] !== t3 || $[28] !== t4 || $[29] !== t5 || $[30] !== t6 || $[31] !== t7) {
-		t8 = /* @__PURE__ */ jsxs(Checkbox, {
+		$[23] = checkboxContentClassNameMap;
+		$[24] = checkboxTypographyMap;
+		$[25] = children;
+		$[26] = hideLabel;
+		$[27] = rest;
+		$[28] = variant;
+		$[29] = t8;
+	} else t8 = $[29];
+	let t9;
+	if ($[30] !== handleChange || $[31] !== isDisabled || $[32] !== rest || $[33] !== t2 || $[34] !== t3 || $[35] !== t4 || $[36] !== t5 || $[37] !== t6 || $[38] !== t7 || $[39] !== t8) {
+		t9 = /* @__PURE__ */ jsxs(Checkbox, {
 			...rest,
 			isDisabled,
-			isInvalid: t1,
-			"aria-errormessage": t2,
-			"data-is-dirty": t3,
-			"data-is-required": t4,
-			className: t5,
-			children: [t6, t7]
+			isInvalid: t2,
+			"aria-errormessage": t3,
+			"data-is-dirty": t4,
+			"data-is-required": t5,
+			onChange: handleChange,
+			className: t6,
+			children: [t7, t8]
 		});
-		$[23] = isDisabled;
-		$[24] = rest;
-		$[25] = t1;
-		$[26] = t2;
-		$[27] = t3;
-		$[28] = t4;
-		$[29] = t5;
-		$[30] = t6;
-		$[31] = t7;
-		$[32] = t8;
-	} else t8 = $[32];
-	let t9;
-	if ($[33] !== formFieldErrorProps) {
-		t9 = /* @__PURE__ */ jsx(FormFieldError, { ...formFieldErrorProps });
-		$[33] = formFieldErrorProps;
-		$[34] = t9;
-	} else t9 = $[34];
+		$[30] = handleChange;
+		$[31] = isDisabled;
+		$[32] = rest;
+		$[33] = t2;
+		$[34] = t3;
+		$[35] = t4;
+		$[36] = t5;
+		$[37] = t6;
+		$[38] = t7;
+		$[39] = t8;
+		$[40] = t9;
+	} else t9 = $[40];
 	let t10;
-	if ($[35] !== t8 || $[36] !== t9) {
-		t10 = /* @__PURE__ */ jsxs(Fragment, { children: [t8, t9] });
-		$[35] = t8;
-		$[36] = t9;
-		$[37] = t10;
-	} else t10 = $[37];
-	return t10;
+	if ($[41] !== formFieldErrorProps) {
+		t10 = /* @__PURE__ */ jsx(FormFieldError, { ...formFieldErrorProps });
+		$[41] = formFieldErrorProps;
+		$[42] = t10;
+	} else t10 = $[42];
+	let t11;
+	if ($[43] !== t10 || $[44] !== t9) {
+		t11 = /* @__PURE__ */ jsxs(Fragment, { children: [t9, t10] });
+		$[43] = t10;
+		$[44] = t9;
+		$[45] = t11;
+	} else t11 = $[45];
+	return t11;
 };
 var Checkbox$1 = (props) => {
 	const $ = c(15);

package/dist/components/inputs/DateTime/DatePicker/DatePicker.js

@@ -267,14 +267,14 @@ var DatePicker = ({ fullIso = true, granularity = "day", minValue, maxValue, ren
 		if (calendarDate === null) return null;
 		const normalizedDate = normalizeByGranularity(calendarDate);
 		if (fullIso) return DateTimeUtils.fromCalendarDateToUTCISO(normalizedDate);
-		const date_0 = DateTimeUtils.fromDateValueToLocal(normalizedDate);
-		return DateTime.fromJSDate(date_0).toISODate();
+		const date_0 = DateTimeUtils.fromDateValueToLocal(normalizedDate, "UTC");
+		return DateTime.fromJSDate(date_0, { zone: "UTC" }).toISODate();
 	};
 	const parseCalendarDate = (formattedDate) => {
 		if (formattedDate == null) return formattedDate;
 		if (fullIso) return normalizeByGranularity(DateTimeUtils.fromUTCISOToCalendarDate(formattedDate));
-		const date_1 = DateTime.fromISO(formattedDate).toJSDate();
-		return normalizeByGranularity(toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date_1)));
+		const date_1 = DateTime.fromISO(formattedDate, { zone: "UTC" }).toJSDate();
+		return normalizeByGranularity(toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date_1, "UTC")));
 	};
 	const dateLimits = {
 		minValue: typeof minValue === "string" ? parseCalendarDate(minValue) : minValue,

package/dist/components/inputs/DateTime/DateRangePicker/DateRangePicker.js

@@ -590,11 +590,11 @@ var DateRangePicker = ({ fullIso = true, minValue, maxValue, renderStaticInput,
 			start: DateTimeUtils.fromCalendarDateToUTCISO(range.start),
 			end: DateTimeUtils.fromCalendarDateToUTCISO(range.end, { endOfDay: true })
 		};
-		const startDate = DateTimeUtils.fromDateValueToLocal(range.start);
-		const endDate = DateTimeUtils.fromDateValueToLocal(range.end);
+		const startDate = DateTimeUtils.fromDateValueToLocal(range.start, "UTC");
+		const endDate = DateTimeUtils.fromDateValueToLocal(range.end, "UTC");
 		return {
-			start: DateTime.fromJSDate(startDate).toISODate(),
-			end: DateTime.fromJSDate(endDate).toISODate()
+			start: DateTime.fromJSDate(startDate, { zone: "UTC" }).toISODate(),
+			end: DateTime.fromJSDate(endDate, { zone: "UTC" }).toISODate()
 		};
 	};
 	const parseDateRange = (formattedRange) => {
@@ -603,10 +603,10 @@ var DateRangePicker = ({ fullIso = true, minValue, maxValue, renderStaticInput,
 			start: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.start),
 			end: DateTimeUtils.fromUTCISOToCalendarDate(formattedRange.end)
 		};
-		const startDate_0 = DateTime.fromISO(formattedRange.start).toJSDate();
-		const endDate_0 = DateTime.fromISO(formattedRange.end).toJSDate();
-		const startZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(startDate_0);
-		const endZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(endDate_0);
+		const startDate_0 = DateTime.fromISO(formattedRange.start, { zone: "UTC" }).toJSDate();
+		const endDate_0 = DateTime.fromISO(formattedRange.end, { zone: "UTC" }).toJSDate();
+		const startZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(startDate_0, "UTC");
+		const endZonedDateTime = DateTimeUtils.fromLocalToZonedDateTime(endDate_0, "UTC");
 		return {
 			start: toCalendarDate(startZonedDateTime),
 			end: toCalendarDate(endZonedDateTime)
@@ -615,8 +615,8 @@ var DateRangePicker = ({ fullIso = true, minValue, maxValue, renderStaticInput,
 	const parseCalendarDate = (formattedDate) => {
 		if (formattedDate == null) return formattedDate;
 		if (fullIso) return DateTimeUtils.fromUTCISOToCalendarDate(formattedDate);
-		const date = DateTime.fromISO(formattedDate).toJSDate();
-		return toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date));
+		const date = DateTime.fromISO(formattedDate, { zone: "UTC" }).toJSDate();
+		return toCalendarDate(DateTimeUtils.fromLocalToZonedDateTime(date, "UTC"));
 	};
 	const dateLimits = {
 		minValue: typeof minValue === "string" ? parseCalendarDate(minValue) : minValue,

package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.js

@@ -19,12 +19,12 @@ import { useEffect, useImperativeHandle, useMemo, useRef, useState } from "react
 import { useDatePicker, useLocale } from "react-aria";
 import { mergeRefs } from "@react-aria/utils";
 import { Controller, useWatch } from "react-hook-form";
-import { Time, createCalendar, getLocalTimeZone, now, toCalendarDateTime, today } from "@internationalized/date";
+import { Time, createCalendar, now, toCalendarDateTime, today } from "@internationalized/date";
 import { useCalendarState, useDatePickerState } from "react-stately";
 //#region src/components/inputs/DateTime/DateTimePicker/DateTimePicker.tsx
 var DateTimePickerBase = (props) => {
 	const ui = UIConfig.useConfig();
-	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, value, disableDropdown, isTimeOptional, placeholder, inputClassName, hideLabel: hideLabelProp, variant: variantProp, as: asProp, size: sizeProp, isClearable: isClearableProp, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, shouldUpdateDateOnMonthYearChange: shouldUpdateDateOnMonthYearChangeProp, timeZone, autoFixYear: autoFixYearProp, format, setDateValueOnDateSelection: setDateValueOnDateSelectionProp, ...rest } = props;
+	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, value, disableDropdown, isTimeOptional, placeholder, inputClassName, hideLabel: hideLabelProp, variant: variantProp, as: asProp, size: sizeProp, isClearable: isClearableProp, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, shouldUpdateDateOnMonthYearChange: shouldUpdateDateOnMonthYearChangeProp, timeZone: _timeZone, autoFixYear: autoFixYearProp, format, setDateValueOnDateSelection: setDateValueOnDateSelectionProp, ...rest } = props;
 	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
 	const variant = variantProp ?? ui.input.variant;
 	const as = asProp ?? ui.input.as;
@@ -38,8 +38,7 @@ var DateTimePickerBase = (props) => {
 	const shouldUpdateDateOnMonthYearChange = shouldUpdateDateOnMonthYearChangeProp ?? ui.dateInput.shouldUpdateDateOnMonthYearChange;
 	const autoFixYear = autoFixYearProp ?? ui.dateInput.autoFixYear;
 	const setDateValueOnDateSelection = setDateValueOnDateSelectionProp ?? ui.dateInput.setDateValueOnDateSelection;
-	let effectiveTimeZone = getLocalTimeZone();
-	if (timeZone) effectiveTimeZone = timeZone;
+	const effectiveTimeZone = "UTC";
 	const formFieldProps = {
 		error,
 		label,
@@ -85,7 +84,7 @@ var DateTimePickerBase = (props) => {
 		onChange: (val_0) => {
 			onChange?.(val_0);
 			dialogState.setValue(val_0);
-			calendarState.setFocusedDate(val_0 || today(getLocalTimeZone()));
+			calendarState.setFocusedDate(val_0 || today(effectiveTimeZone));
 			debouncedBlur(val_0);
 		},
 		shouldCloseOnSelect: false,
@@ -257,8 +256,7 @@ var DateTimePicker = ({ fullIso = true, renderStaticInput, ...props }) => {
 	let isFormControlDisabled = false;
 	if ("formControl" in props && props.formControl) isFormControlDisabled = !!props.formControl.control._options?.disabled;
 	const rawValue = watchedValue ?? props.value ?? null;
-	let effectiveTimeZone = getLocalTimeZone();
-	if (props.timeZone) effectiveTimeZone = props.timeZone;
+	const effectiveTimeZone = "UTC";
 	const formatDateValue = (dateValue) => {
 		if (dateValue === null) return null;
 		if (fullIso) return DateTimeUtils.fromDateValueToISO(dateValue, effectiveTimeZone);

package/dist/components/inputs/DateTime/TimePicker/TimePicker.js

@@ -17,7 +17,7 @@ import { useEffect, useRef, useState } from "react";
 import { useLocale, useTimeField } from "react-aria";
 import { mergeRefs } from "@react-aria/utils";
 import { Controller, useWatch } from "react-hook-form";
-import { getLocalTimeZone, now, toTime } from "@internationalized/date";
+import { now, toTime } from "@internationalized/date";
 import { DateTime } from "luxon";
 import { useTimeFieldState } from "react-stately";
 //#region src/components/inputs/DateTime/TimePicker/TimePicker.tsx
@@ -415,8 +415,7 @@ var TimePickerBase = (props) => {
 };
 var TimePicker = ({ renderStaticInput, ...props }) => {
 	const ui = UIConfig.useConfig();
-	let effectiveTimeZone = getLocalTimeZone();
-	if (props.timeZone) effectiveTimeZone = props.timeZone;
+	const effectiveTimeZone = "UTC";
 	const { locale } = useLocale();
 	const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));
 	const inputRef = useRef(null);

package/dist/components/inputs/RadioGroup/RadioGroup.d.ts

@@ -14,6 +14,7 @@ interface RadioGroupBaseProps extends Omit<FormFieldProps, "variant">, RadioVari
     isDirty?: boolean;
     inputClassName?: string;
     labelClassName?: string;
+    fireBlurOnChange?: boolean;
 }
 export interface RadioGroupProps extends RadioGroupBaseProps {
 }

package/dist/components/inputs/RadioGroup/RadioGroup.js

@@ -15,7 +15,7 @@ import { mergeRefs } from "@react-aria/utils";
 import { Controller } from "react-hook-form";
 //#region src/components/inputs/RadioGroup/RadioGroup.tsx
 var RadioGroupBase = (props) => {
-	const $ = c(91);
+	const $ = c(96);
 	const ui = UIConfig.useConfig();
 	const radioCva = UIStyle.useCva("radio.cva", radio);
 	const radioContentWrapperCva = UIStyle.useCva("radio.contentWrapperCva", radioContentWrapper);
@@ -24,11 +24,12 @@ var RadioGroupBase = (props) => {
 	const inputSizeCva = UIStyle.useCva("input.sizeCva", inputSize);
 	const radioTypographyMap = UIStyle.useMapper("radio.typography", radioTypography);
 	const radioContentClassNameMap = UIStyle.useMapper("radio.contentClassName", radioContentClassName);
-	const { ref, label, tooltipText, helperText, isDirty, isRequired, rightContent, isDisabled, headerClassName, errorClassName, labelClassName, inputClassName, isHeaderHidden, error, className, options, value, defaultValue, as: asProp, size: sizeProp, variant: variantProp, hideLabel: hideLabelProp, ...rest } = props;
+	const { ref, label, tooltipText, helperText, isDirty, isRequired, rightContent, isDisabled, headerClassName, errorClassName, labelClassName, inputClassName, isHeaderHidden, error, className, options, value, defaultValue, onChange, onBlur, fireBlurOnChange: fireBlurOnChangeProp, as: asProp, size: sizeProp, variant: variantProp, hideLabel: hideLabelProp, ...rest } = props;
 	const as = asProp ?? ui.input.as;
 	const size = sizeProp ?? ui.input.size;
 	const variant = variantProp ?? ui.radioGroup.variant;
 	const hideLabel = hideLabelProp ?? ui.radioGroup.hideLabel;
+	const fireBlurOnChange = fireBlurOnChangeProp ?? ui.radioGroup.fireBlurOnChange;
 	const radioClassName = radioCva({
 		variant,
 		...rest
@@ -108,42 +109,54 @@ var RadioGroupBase = (props) => {
 	const headerProps = t4;
 	const selectedValue = value ?? defaultValue;
 	const shouldRenderInputFrame = as !== "default";
+	let t5;
+	if ($[25] !== fireBlurOnChange || $[26] !== onBlur || $[27] !== onChange) {
+		t5 = (nextValue) => {
+			onChange?.(nextValue);
+			if (fireBlurOnChange) onBlur?.({});
+		};
+		$[25] = fireBlurOnChange;
+		$[26] = onBlur;
+		$[27] = onChange;
+		$[28] = t5;
+	} else t5 = $[28];
+	const handleChange = t5;
 	const T0 = TooltipWrapper;
-	const t5 = as === "inline" ? -1 : void 0;
+	const t6 = as === "inline" ? -1 : void 0;
 	const T1 = RadioGroup;
-	const t6 = !!error;
-	const t7 = isDirty || void 0;
-	const t8 = isRequired || void 0;
+	const t7 = !!error;
+	const t8 = isDirty || void 0;
+	const t9 = isRequired || void 0;
 	const T2 = FormField;
-	const t9 = as === "inline" && "h-full";
-	let t10;
-	if ($[25] !== className || $[26] !== t9) {
-		t10 = clsx("w-full", t9, className);
-		$[25] = className;
-		$[26] = t9;
-		$[27] = t10;
-	} else t10 = $[27];
-	const t11 = as === "inline" ? -1 : void 0;
-	let t12;
-	if ($[28] !== as || $[29] !== inputBaseCva || $[30] !== inputClassName || $[31] !== shouldRenderInputFrame || $[32] !== ui) {
-		t12 = clsx("group/radio-group-content relative", shouldRenderInputFrame && inputBaseCva({
+	const t10 = as === "inline" && "h-full";
+	let t11;
+	if ($[29] !== className || $[30] !== t10) {
+		t11 = clsx("w-full", t10, className);
+		$[29] = className;
+		$[30] = t10;
+		$[31] = t11;
+	} else t11 = $[31];
+	const t12 = as === "inline" ? -1 : void 0;
+	let t13;
+	if ($[32] !== as || $[33] !== inputBaseCva || $[34] !== inputClassName || $[35] !== shouldRenderInputFrame || $[36] !== ui) {
+		t13 = clsx("group/radio-group-content relative", shouldRenderInputFrame && inputBaseCva({
 			variant: ui.input.variant,
 			as
 		}), inputClassName);
-		$[28] = as;
-		$[29] = inputBaseCva;
-		$[30] = inputClassName;
-		$[31] = shouldRenderInputFrame;
-		$[32] = ui;
-		$[33] = t12;
-	} else t12 = $[33];
-	const t13 = "";
-	const t14 = isDisabled || void 0;
+		$[32] = as;
+		$[33] = inputBaseCva;
+		$[34] = inputClassName;
+		$[35] = shouldRenderInputFrame;
+		$[36] = ui;
+		$[37] = t13;
+	} else t13 = $[37];
+	const t14 = "";
 	const t15 = isDisabled || void 0;
-	const t16 = !!error || void 0;
-	const t17 = selectedValue != null && selectedValue !== "" ? true : void 0;
-	const t18 = "";
-	const t19 = clsx(radioContentWrapperCva({
+	const t16 = isDisabled || void 0;
+	const t17 = !!error || void 0;
+	const t18 = selectedValue != null && selectedValue !== "" ? true : void 0;
+	const t19 = "";
+	const t20 = clsx(radioContentWrapperCva({
 		variant,
 		as,
 		hasInputFrame: shouldRenderInputFrame,
@@ -152,31 +165,31 @@ var RadioGroupBase = (props) => {
 		as,
 		size
 	}));
-	const t20 = isDirty || void 0;
-	const t21 = isRequired || void 0;
-	let t22;
-	if ($[34] !== as || $[35] !== headerProps || $[36] !== size) {
-		t22 = as && ["filter", "floating"].includes(as) && /* @__PURE__ */ jsx(FormFieldLabel, {
+	const t21 = isDirty || void 0;
+	const t22 = isRequired || void 0;
+	let t23;
+	if ($[38] !== as || $[39] !== headerProps || $[40] !== size) {
+		t23 = as && ["filter", "floating"].includes(as) && /* @__PURE__ */ jsx(FormFieldLabel, {
 			as,
 			size,
 			...headerProps
 		});
-		$[34] = as;
-		$[35] = headerProps;
-		$[36] = size;
-		$[37] = t22;
-	} else t22 = $[37];
-	const t23 = radioContentRowCva({
+		$[38] = as;
+		$[39] = headerProps;
+		$[40] = size;
+		$[41] = t23;
+	} else t23 = $[41];
+	const t24 = radioContentRowCva({
 		variant,
 		as,
 		hasInputFrame: shouldRenderInputFrame,
 		...rest
 	});
-	let t24;
-	if ($[38] !== labelClassName || $[39] !== options || $[40] !== radioClassName || $[41] !== radioContentClassNameValue || $[42] !== radioTypographyProps) {
-		let t25;
-		if ($[44] !== labelClassName || $[45] !== radioClassName || $[46] !== radioContentClassNameValue || $[47] !== radioTypographyProps) {
-			t25 = (option) => /* @__PURE__ */ jsxs(Radio, {
+	let t25;
+	if ($[42] !== labelClassName || $[43] !== options || $[44] !== radioClassName || $[45] !== radioContentClassNameValue || $[46] !== radioTypographyProps) {
+		let t26;
+		if ($[48] !== labelClassName || $[49] !== radioClassName || $[50] !== radioContentClassNameValue || $[51] !== radioTypographyProps) {
+			t26 = (option) => /* @__PURE__ */ jsxs(Radio, {
 				value: option.value,
 				className: clsx("relative", radioIndicatorClass),
 				children: [/* @__PURE__ */ jsx("div", { className: radioClassName }), /* @__PURE__ */ jsx(CheckContent, {
@@ -186,127 +199,129 @@ var RadioGroupBase = (props) => {
 					children: option.label
 				})]
 			}, option.value);
-			$[44] = labelClassName;
-			$[45] = radioClassName;
-			$[46] = radioContentClassNameValue;
-			$[47] = radioTypographyProps;
-			$[48] = t25;
-		} else t25 = $[48];
-		t24 = options.map(t25);
-		$[38] = labelClassName;
-		$[39] = options;
-		$[40] = radioClassName;
-		$[41] = radioContentClassNameValue;
-		$[42] = radioTypographyProps;
-		$[43] = t24;
-	} else t24 = $[43];
-	let t25;
-	if ($[49] !== t23 || $[50] !== t24) {
-		t25 = /* @__PURE__ */ jsx("div", {
-			className: t23,
-			children: t24
-		});
-		$[49] = t23;
-		$[50] = t24;
-		$[51] = t25;
-	} else t25 = $[51];
+			$[48] = labelClassName;
+			$[49] = radioClassName;
+			$[50] = radioContentClassNameValue;
+			$[51] = radioTypographyProps;
+			$[52] = t26;
+		} else t26 = $[52];
+		t25 = options.map(t26);
+		$[42] = labelClassName;
+		$[43] = options;
+		$[44] = radioClassName;
+		$[45] = radioContentClassNameValue;
+		$[46] = radioTypographyProps;
+		$[47] = t25;
+	} else t25 = $[47];
 	let t26;
-	if ($[52] !== t19 || $[53] !== t20 || $[54] !== t21 || $[55] !== t22 || $[56] !== t25) {
-		t26 = /* @__PURE__ */ jsxs("div", {
-			className: t19,
-			"data-is-dirty": t20,
-			"data-is-required": t21,
-			children: [t22, t25]
+	if ($[53] !== t24 || $[54] !== t25) {
+		t26 = /* @__PURE__ */ jsx("div", {
+			className: t24,
+			children: t25
 		});
-		$[52] = t19;
-		$[53] = t20;
-		$[54] = t21;
-		$[55] = t22;
-		$[56] = t25;
-		$[57] = t26;
-	} else t26 = $[57];
+		$[53] = t24;
+		$[54] = t25;
+		$[55] = t26;
+	} else t26 = $[55];
 	let t27;
-	if ($[58] !== t12 || $[59] !== t14 || $[60] !== t15 || $[61] !== t16 || $[62] !== t17 || $[63] !== t26) {
-		t27 = /* @__PURE__ */ jsx("div", {
-			className: t12,
-			"data-rac": t13,
-			"data-disabled": t14,
-			"data-is-disabled": t15,
-			"data-invalid": t16,
-			"data-has-selection": t17,
-			"data-radio-group-content": t18,
-			children: t26
+	if ($[56] !== t20 || $[57] !== t21 || $[58] !== t22 || $[59] !== t23 || $[60] !== t26) {
+		t27 = /* @__PURE__ */ jsxs("div", {
+			className: t20,
+			"data-is-dirty": t21,
+			"data-is-required": t22,
+			children: [t23, t26]
 		});
-		$[58] = t12;
-		$[59] = t14;
-		$[60] = t15;
-		$[61] = t16;
-		$[62] = t17;
-		$[63] = t26;
-		$[64] = t27;
-	} else t27 = $[64];
+		$[56] = t20;
+		$[57] = t21;
+		$[58] = t22;
+		$[59] = t23;
+		$[60] = t26;
+		$[61] = t27;
+	} else t27 = $[61];
 	let t28;
-	if ($[65] !== T2 || $[66] !== as || $[67] !== formFieldProps || $[68] !== labelProps || $[69] !== t10 || $[70] !== t11 || $[71] !== t27) {
-		t28 = /* @__PURE__ */ jsx(T2, {
+	if ($[62] !== t13 || $[63] !== t15 || $[64] !== t16 || $[65] !== t17 || $[66] !== t18 || $[67] !== t27) {
+		t28 = /* @__PURE__ */ jsx("div", {
+			className: t13,
+			"data-rac": t14,
+			"data-disabled": t15,
+			"data-is-disabled": t16,
+			"data-invalid": t17,
+			"data-has-selection": t18,
+			"data-radio-group-content": t19,
+			children: t27
+		});
+		$[62] = t13;
+		$[63] = t15;
+		$[64] = t16;
+		$[65] = t17;
+		$[66] = t18;
+		$[67] = t27;
+		$[68] = t28;
+	} else t28 = $[68];
+	let t29;
+	if ($[69] !== T2 || $[70] !== as || $[71] !== formFieldProps || $[72] !== labelProps || $[73] !== t11 || $[74] !== t12 || $[75] !== t28) {
+		t29 = /* @__PURE__ */ jsx(T2, {
 			...formFieldProps,
 			as,
 			labelProps,
-			className: t10,
-			tabIndex: t11,
-			children: t27
+			className: t11,
+			tabIndex: t12,
+			children: t28
 		});
-		$[65] = T2;
-		$[66] = as;
-		$[67] = formFieldProps;
-		$[68] = labelProps;
-		$[69] = t10;
-		$[70] = t11;
-		$[71] = t27;
-		$[72] = t28;
-	} else t28 = $[72];
-	let t29;
-	if ($[73] !== T1 || $[74] !== defaultValue || $[75] !== fieldProps || $[76] !== isDisabled || $[77] !== ref || $[78] !== rest || $[79] !== t28 || $[80] !== t6 || $[81] !== t7 || $[82] !== t8 || $[83] !== value) {
-		t29 = /* @__PURE__ */ jsx(T1, {
+		$[69] = T2;
+		$[70] = as;
+		$[71] = formFieldProps;
+		$[72] = labelProps;
+		$[73] = t11;
+		$[74] = t12;
+		$[75] = t28;
+		$[76] = t29;
+	} else t29 = $[76];
+	let t30;
+	if ($[77] !== T1 || $[78] !== defaultValue || $[79] !== fieldProps || $[80] !== handleChange || $[81] !== isDisabled || $[82] !== ref || $[83] !== rest || $[84] !== t29 || $[85] !== t7 || $[86] !== t8 || $[87] !== t9 || $[88] !== value) {
+		t30 = /* @__PURE__ */ jsx(T1, {
 			...rest,
 			...fieldProps,
 			ref,
 			value,
 			defaultValue,
+			onChange: handleChange,
 			isDisabled,
-			isInvalid: t6,
-			"data-is-dirty": t7,
-			"data-is-required": t8,
-			children: t28
+			isInvalid: t7,
+			"data-is-dirty": t8,
+			"data-is-required": t9,
+			children: t29
 		});
-		$[73] = T1;
-		$[74] = defaultValue;
-		$[75] = fieldProps;
-		$[76] = isDisabled;
-		$[77] = ref;
-		$[78] = rest;
-		$[79] = t28;
-		$[80] = t6;
-		$[81] = t7;
-		$[82] = t8;
-		$[83] = value;
+		$[77] = T1;
+		$[78] = defaultValue;
+		$[79] = fieldProps;
+		$[80] = handleChange;
+		$[81] = isDisabled;
+		$[82] = ref;
+		$[83] = rest;
 		$[84] = t29;
-	} else t29 = $[84];
-	let t30;
-	if ($[85] !== T0 || $[86] !== as || $[87] !== error || $[88] !== t29 || $[89] !== t5) {
-		t30 = /* @__PURE__ */ jsx(T0, {
+		$[85] = t7;
+		$[86] = t8;
+		$[87] = t9;
+		$[88] = value;
+		$[89] = t30;
+	} else t30 = $[89];
+	let t31;
+	if ($[90] !== T0 || $[91] !== as || $[92] !== error || $[93] !== t30 || $[94] !== t6) {
+		t31 = /* @__PURE__ */ jsx(T0, {
 			as,
 			error,
-			triggerTabIndex: t5,
-			children: t29
+			triggerTabIndex: t6,
+			children: t30
 		});
-		$[85] = T0;
-		$[86] = as;
-		$[87] = error;
-		$[88] = t29;
-		$[89] = t5;
-		$[90] = t30;
-	} else t30 = $[90];
-	return t30;
+		$[90] = T0;
+		$[91] = as;
+		$[92] = error;
+		$[93] = t30;
+		$[94] = t6;
+		$[95] = t31;
+	} else t31 = $[95];
+	return t31;
 };
 var RadioGroup$1 = (props) => {
 	const $ = c(15);

package/dist/config/uiConfig.context.d.ts

@@ -23,8 +23,8 @@ export declare namespace UIConfig {
         input: Pick<TextInputProps, "variant" | "isClearable" | "hideLabel" | "as" | "size">;
         button: Pick<ButtonProps, "variant" | "size">;
         numberInput: Pick<NumberInputProps, "formatOptions">;
-        radioGroup: Pick<RadioGroupProps, "variant" | "hideLabel">;
-        checkbox: Pick<CheckboxProps, "variant">;
+        radioGroup: Pick<RadioGroupProps, "variant" | "hideLabel" | "fireBlurOnChange">;
+        checkbox: Pick<CheckboxProps, "variant" | "fireBlurOnChange">;
         select: Pick<SelectBaseProps, "selectionMode" | "isSearchable" | "collapseAfter" | "selectedTagsType" | "hideSearchIcon" | "fireBlurOnChange">;
         queryAutocomplete: {
             isInitialQueryDisabled?: boolean;

package/dist/config/uiConfig.context.js

@@ -28,9 +28,13 @@ var UIConfig;
 		} },
 		radioGroup: {
 			variant: "default",
-			hideLabel: false
+			hideLabel: false,
+			fireBlurOnChange: false
+		},
+		checkbox: {
+			variant: "default",
+			fireBlurOnChange: false
 		},
-		checkbox: { variant: "default" },
 		select: {
 			selectionMode: "single",
 			isSearchable: false,

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@povio/ui",
-  "version": "2.3.0-rc.11",
+  "version": "2.3.0-rc.13",
   "type": "module",
   "module": "dist/index.js",
   "types": "dist/index.d.ts",