@povio/ui 2.3.0-rc.33 → 2.3.0-rc.35

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

@@ -462,8 +462,8 @@ var DatePicker = (t0) => {
 				return /* @__PURE__ */ jsx(DatePickerInner, {
 					...innerProps,
 					ref: mergeRefs(ref, field.ref),
-					value: field.value,
-					onChange: field.onChange,
+					value: field.value ?? null,
+					onChange: (value) => field.onChange(value ?? null),
 					onBlur: field.onBlur,
 					isDirty,
 					isDisabled: field.disabled || props.isDisabled,

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

@@ -798,8 +798,8 @@ var DateRangePicker = (t0) => {
 				return /* @__PURE__ */ jsx(DateRangePickerInner, {
 					...innerProps,
 					ref: mergeRefs(ref, field.ref),
-					value: field.value,
-					onChange: field.onChange,
+					value: field.value ?? null,
+					onChange: (value) => field.onChange(value ?? null),
 					onBlur: field.onBlur,
 					isDirty,
 					isDisabled: field.disabled || props.isDisabled,

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

@@ -55,6 +55,7 @@ var DateTimePickerBase = (props) => {
 		errorClassName
 	};
 	const datePickerInputRef = useRef(null);
+	const isClearingInputRef = useRef(false);
 	const datePickerRef = useMemo(() => ({ get current() {
 		return datePickerInputRef.current?.getContainer?.() || null;
 	} }), []);
@@ -150,11 +151,15 @@ var DateTimePickerBase = (props) => {
 		calendarState.setFocusedDate(toCalendarDate(currentValue));
 	};
 	const onInputClear = () => {
+		isClearingInputRef.current = true;
 		onChange?.(null);
 		state.setValue(null);
 		dialogState.setValue(null);
 		calendarState.setFocusedDate(today(effectiveTimeZone));
 		if (fireBlurOnChange) handleBlur(null);
+		window.setTimeout(() => {
+			isClearingInputRef.current = false;
+		}, 0);
 	};
 	const onOpenChange = (isOpen) => {
 		state.toggle();
@@ -163,6 +168,7 @@ var DateTimePickerBase = (props) => {
 	};
 	const onInputBlur = (e) => {
 		if (!isTimeOptional) return;
+		if (isClearingInputRef.current) return;
 		if (state.value) {
 			dialogState.setValue(state.value);
 			return;
@@ -382,8 +388,8 @@ var DateTimePicker = (t0) => {
 				return /* @__PURE__ */ jsx(DateTimePickerInner, {
 					...innerProps,
 					ref: mergeRefs(ref, field.ref),
-					value: field.value,
-					onChange: field.onChange,
+					value: field.value ?? null,
+					onChange: (value) => field.onChange(value ?? null),
 					onBlur: field.onBlur,
 					isDirty,
 					isDisabled: field.disabled || props.isDisabled,

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

@@ -560,8 +560,8 @@ var TimePicker = (t0) => {
 				return /* @__PURE__ */ jsx(TimePickerInner, {
 					...innerProps,
 					ref: mergeRefs(ref, field.ref),
-					value: field.value,
-					onChange: field.onChange,
+					value: field.value ?? null,
+					onChange: (value) => field.onChange(value ?? null),
 					onBlur: field.onBlur,
 					isDirty,
 					isDisabled: field.disabled || props.isDisabled,

package/dist/components/inputs/shared/InputClear.js

@@ -47,7 +47,7 @@ var InputClear = (t0) => {
 	return t1;
 };
 var InputClearButton = (t0) => {
-	const $ = c(10);
+	const $ = c(13);
 	const { onClear, className, style, show } = t0;
 	const { t } = useTranslation("ui");
 	const t1 = !show && "invisible!";
@@ -65,23 +65,35 @@ var InputClearButton = (t0) => {
 		$[4] = t3;
 	} else t3 = $[4];
 	let t4;
-	if ($[5] !== onClear || $[6] !== style || $[7] !== t2 || $[8] !== t3) {
-		t4 = /* @__PURE__ */ jsx(InlineIconButton, {
+	if ($[5] !== onClear) {
+		t4 = (event) => {
+			event.preventDefault();
+			event.stopPropagation();
+			onClear();
+		};
+		$[5] = onClear;
+		$[6] = t4;
+	} else t4 = $[6];
+	let t5;
+	if ($[7] !== onClear || $[8] !== style || $[9] !== t2 || $[10] !== t3 || $[11] !== t4) {
+		t5 = /* @__PURE__ */ jsx(InlineIconButton, {
 			color: "secondary",
 			className: t2,
 			label: t3,
 			icon: CloseIcon,
 			onPress: onClear,
+			onPointerDown: t4,
 			excludeFromTabOrder: true,
 			style
 		});
-		$[5] = onClear;
-		$[6] = style;
-		$[7] = t2;
-		$[8] = t3;
-		$[9] = t4;
-	} else t4 = $[9];
-	return t4;
+		$[7] = onClear;
+		$[8] = style;
+		$[9] = t2;
+		$[10] = t3;
+		$[11] = t4;
+		$[12] = t5;
+	} else t5 = $[12];
+	return t5;
 };
 function _temp($) {
 	return $.ui.clearAlt;

package/package.json

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