@povio/ui 3.4.0-rc.14 → 3.4.0-rc.16

package/dist/components/inputs/DateTime/DateTimePicker/DateTimePicker.d.ts

@@ -1,41 +1,44 @@
-import { FocusEvent, Ref } from 'react';
-import { DateValue } from 'react-aria';
-import { FieldValues } from '../../shared/form.binding';
-import { DatePickerStateOptions } from 'react-stately';
-import { DatePickerInputHandle } from '../shared/DatePickerInput';
-import { DatePickerTodayIcon, DatePickerTodayIconButtonComponent, DatePickerTodayIconButtonSize, DatePickerTodayIconPlacement } from '../shared/datePicker.types';
-import { FormFieldProps } from '../../FormField/FormField';
-import { ControlProps } from '../../shared/form.types';
-import { InputVariantProps } from '../../shared/input.cva';
+import { FieldValues } from "../../shared/form.binding.js";
+import { ControlProps } from "../../shared/form.types.js";
+import { InputVariantProps } from "../../shared/input.cva.js";
+import { FormFieldProps } from "../../FormField/FormField.js";
+import { DatePickerTodayIcon, DatePickerTodayIconButtonComponent, DatePickerTodayIconButtonSize, DatePickerTodayIconPlacement } from "../shared/datePicker.types.js";
+import { DatePickerInputHandle } from "../shared/DatePickerInput.js";
+import { FocusEvent, Ref } from "react";
+import { DateValue } from "react-aria";
+import { DatePickerStateOptions } from "react-stately";
+//#region src/components/inputs/DateTime/DateTimePicker/DateTimePicker.d.ts
 interface DateTimePickerBaseProps extends FormFieldProps, InputVariantProps, Omit<DatePickerStateOptions<DateValue>, "granularity" | "shouldCloseOnSelect" | "label" | "onBlur"> {
-    ref?: Ref<DatePickerInputHandle & HTMLDivElement>;
-    disableDropdown?: boolean;
-    isTimeOptional?: boolean;
-    isClearable?: boolean;
-    isClearableIfDisabled?: boolean;
-    todayIcon?: DatePickerTodayIcon;
-    todayIconButtonSize?: DatePickerTodayIconButtonSize;
-    todayIconButtonComponent?: DatePickerTodayIconButtonComponent;
-    todayIconPlacement?: DatePickerTodayIconPlacement;
-    isDirty?: boolean;
-    disableManualEntry?: boolean;
-    autoFixYear?: boolean;
-    setDateValueOnDateSelection?: boolean;
-    placeholder?: string;
-    inputClassName?: string;
-    shouldShrinkInput?: boolean;
-    shouldUpdateDateOnMonthYearChange?: boolean;
-    timeZone?: string;
-    format?: string;
-    onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
+  ref?: Ref<DatePickerInputHandle & HTMLDivElement>;
+  disableDropdown?: boolean;
+  isTimeOptional?: boolean;
+  isClearable?: boolean;
+  isClearableIfDisabled?: boolean;
+  todayIcon?: DatePickerTodayIcon;
+  todayIconButtonSize?: DatePickerTodayIconButtonSize;
+  todayIconButtonComponent?: DatePickerTodayIconButtonComponent;
+  todayIconPlacement?: DatePickerTodayIconPlacement;
+  isDirty?: boolean;
+  disableManualEntry?: boolean;
+  autoFixYear?: boolean;
+  setDateValueOnDateSelection?: boolean;
+  placeholder?: string;
+  inputClassName?: string;
+  shouldShrinkInput?: boolean;
+  shouldUpdateDateOnMonthYearChange?: boolean;
+  timeZone?: string;
+  format?: string;
+  onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
 }
-export interface DateTimePickerProps extends Omit<DateTimePickerBaseProps, "value" | "onChange"> {
-    value?: string | null;
-    onChange?: (value: string | null) => void;
-    fullIso?: boolean;
-    renderStaticInput?: boolean;
-    timeZone?: string;
+interface DateTimePickerProps extends Omit<DateTimePickerBaseProps, "value" | "onChange"> {
+  value?: string | null;
+  onChange?: (value: string | null) => void;
+  fullIso?: boolean;
+  renderStaticInput?: boolean;
+  timeZone?: string;
 }
-export type ControlledDateTimePickerProps<TFieldValues extends FieldValues> = ControlProps<DateTimePickerProps, TFieldValues>;
-export declare const DateTimePicker: <TFieldValues extends FieldValues>({ fullIso, renderStaticInput, ...props }: ControlledDateTimePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-export {};
+type ControlledDateTimePickerProps<TFieldValues extends FieldValues> = ControlProps<DateTimePickerProps, TFieldValues>;
+declare const DateTimePickerComponent: <TFieldValues extends FieldValues>({ fullIso, renderStaticInput, ...props }: ControlledDateTimePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
+declare const DateTimePicker: typeof DateTimePickerComponent;
+//#endregion
+export { ControlledDateTimePickerProps, DateTimePicker, DateTimePickerProps };

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

@@ -7,6 +7,7 @@ import { DateTimeUtils } from "../../../../utils/date-time.utils.js";
 import { datePickerInputContentRowDefinition } from "../shared/datePickerInput.cva.js";
 import { renderDatePickerTodayIcon } from "../shared/datePickerTodayIcon.js";
 import { DatePickerInput } from "../shared/DatePickerInput.js";
+import { normalizeDatePickerValue } from "../shared/datePickerValue.utils.js";
 import { DateTimeDialog } from "../shared/DateTimeDialog.js";
 import { DateTimeDialogFooter } from "../shared/DateTimeDialogFooter.js";
 import { getStaticCalendarDateTimeSegments, getStaticDateTimeFocusTarget } from "../shared/staticDateTimeSegments.js";
@@ -14,14 +15,14 @@ import { TooltipWrapper } from "../../shared/TooltipWrapper.js";
 import { InputFrame } from "../../Skeleton/InputFrame.js";
 import { useStaticInputHandoff } from "../../shared/useStaticInputHandoff.js";
 import { clsx } from "clsx";
-import { useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
+import { memo, useEffect, useImperativeHandle, useMemo, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 import { useDatePicker, useLocale } from "react-aria";
 import { mergeRefs } from "@react-aria/utils";
 import { Time, createCalendar, getLocalTimeZone, toCalendarDate, toCalendarDateTime, today } from "@internationalized/date";
 import { useCalendarState, useDatePickerState } from "react-stately";
 //#region src/components/inputs/DateTime/DateTimePicker/DateTimePicker.tsx
-var DateTimePickerBase = (props) => {
+const 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, shouldShrinkInput, hideLabel: hideLabelProp, variant: variantProp, as: asProp, size: sizeProp, isClearable: isClearableProp, isClearableIfDisabled, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconButtonComponent: todayIconButtonComponentProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, shouldUpdateDateOnMonthYearChange: shouldUpdateDateOnMonthYearChangeProp, timeZone: timeZoneProp, autoFixYear: autoFixYearProp, format, setDateValueOnDateSelection: setDateValueOnDateSelectionProp, ...rest } = props;
 	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
@@ -83,10 +84,11 @@ var DateTimePickerBase = (props) => {
 		...rest,
 		shouldForceLeadingZeros,
 		value: normalizedValue,
-		onChange: (val_0) => {
-			onChange?.(val_0);
-			dialogState.setValue(val_0);
-			calendarState.setFocusedDate(val_0 || today(effectiveTimeZone));
+		onChange: (val) => {
+			const normalizedValue = normalizeDatePickerValue(val);
+			onChange?.(normalizedValue);
+			dialogState.setValue(normalizedValue);
+			calendarState.setFocusedDate(val || today(effectiveTimeZone));
 		},
 		shouldCloseOnSelect: false,
 		granularity: "minute",
@@ -248,7 +250,7 @@ var DateTimePickerBase = (props) => {
 		})
 	});
 };
-var DateTimePickerInner = ({ fullIso: _fullIso = true, renderStaticInput, isFormControlDisabled, ...props }) => {
+const DateTimePickerInner = ({ fullIso: _fullIso = true, renderStaticInput, isFormControlDisabled, ...props }) => {
 	const ui = UIConfig.useConfig();
 	const datePickerInputContentRowCva = UIOverrides.useCva("datePickerInput.contentRowCva", datePickerInputContentRowDefinition);
 	const { locale } = useLocale();
@@ -263,10 +265,10 @@ var DateTimePickerInner = ({ fullIso: _fullIso = true, renderStaticInput, isForm
 			const container = input.getContainer?.() ?? input;
 			return container instanceof HTMLElement ? getStaticDateTimeFocusTarget(container, staticTarget) : null;
 		},
-		getPressTarget: (input_0) => {
-			const container_0 = input_0.getContainer?.() ?? input_0;
-			if (!(container_0 instanceof HTMLElement)) return null;
-			return container_0.querySelector("[data-static-press-action]");
+		getPressTarget: (input) => {
+			const container = input.getContainer?.() ?? input;
+			if (!(container instanceof HTMLElement)) return null;
+			return container.querySelector("[data-static-press-action]");
 		}
 	});
 	const normalizedValue = props.value ?? null;
@@ -351,21 +353,21 @@ var DateTimePickerInner = ({ fullIso: _fullIso = true, renderStaticInput, isForm
 		onChange: (value) => props.onChange?.(formatDateValue(value))
 	});
 };
-var DateTimePicker = ({ fullIso = true, renderStaticInput, ...props }) => {
+const DateTimePickerComponent = ({ fullIso = true, renderStaticInput, ...props }) => {
 	if ("field" in props && props.field) {
 		const { field, ref, ...innerProps } = props;
 		const controlWithOptions = field.form;
 		return /* @__PURE__ */ jsx(FieldController, {
 			control: field.form,
 			name: field.name,
-			render: ({ field: field_0, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(DateTimePickerInner, {
+			render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(DateTimePickerInner, {
 				...innerProps,
-				ref: mergeRefs(ref, field_0.ref),
-				value: field_0.value ?? null,
-				onChange: (value) => field_0.onChange(value ?? null),
-				onBlur: field_0.onBlur,
+				ref: mergeRefs(ref, field.ref),
+				value: field.value ?? null,
+				onChange: (value) => field.onChange(value ?? null),
+				onBlur: field.onBlur,
 				isDirty,
-				isDisabled: field_0.disabled || props.isDisabled,
+				isDisabled: field.disabled || props.isDisabled,
 				isFormControlDisabled: !!controlWithOptions._options?.disabled,
 				error: props.error ?? error?.message,
 				fullIso,
@@ -379,5 +381,6 @@ var DateTimePicker = ({ fullIso = true, renderStaticInput, ...props }) => {
 		renderStaticInput
 	});
 };
+const DateTimePicker = memo(DateTimePickerComponent);
 //#endregion
 export { DateTimePicker };

package/dist/components/inputs/DateTime/TimePicker/TimePicker.d.ts

@@ -1,29 +1,32 @@
-import { Ref, FocusEvent } from 'react';
-import { AriaTimeFieldProps, TimeValue } from 'react-aria';
-import { FieldValues } from '../../shared/form.binding';
-import { FormFieldProps } from '../../FormField/FormField';
-import { ControlProps } from '../../shared/form.types';
-import { InputVariantProps } from '../../shared/input.cva';
+import { FieldValues } from "../../shared/form.binding.js";
+import { ControlProps } from "../../shared/form.types.js";
+import { InputVariantProps } from "../../shared/input.cva.js";
+import { FormFieldProps } from "../../FormField/FormField.js";
+import { FocusEvent, Ref } from "react";
+import { AriaTimeFieldProps, TimeValue } from "react-aria";
+//#region src/components/inputs/DateTime/TimePicker/TimePicker.d.ts
 interface TimePickerBaseProps extends FormFieldProps, InputVariantProps, Omit<AriaTimeFieldProps<TimeValue>, "label" | "onBlur"> {
-    ref?: Ref<HTMLDivElement>;
-    disableDropdown?: boolean;
-    date?: string | null;
-    isClearable?: boolean;
-    isClearableIfDisabled?: boolean;
-    isDirty?: boolean;
-    disableManualEntry?: boolean;
-    placeholder?: string;
-    inputClassName?: string;
-    onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
-    shouldForceLeadingZeros?: boolean;
+  ref?: Ref<HTMLDivElement>;
+  disableDropdown?: boolean;
+  date?: string | null;
+  isClearable?: boolean;
+  isClearableIfDisabled?: boolean;
+  isDirty?: boolean;
+  disableManualEntry?: boolean;
+  placeholder?: string;
+  inputClassName?: string;
+  onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
+  shouldForceLeadingZeros?: boolean;
 }
-export interface TimePickerProps extends Omit<TimePickerBaseProps, "value" | "onChange"> {
-    value?: string | null;
-    onChange?: (value: string | null) => void;
-    fullIso?: boolean;
-    timeZone?: string;
-    renderStaticInput?: boolean;
+interface TimePickerProps extends Omit<TimePickerBaseProps, "value" | "onChange"> {
+  value?: string | null;
+  onChange?: (value: string | null) => void;
+  fullIso?: boolean;
+  timeZone?: string;
+  renderStaticInput?: boolean;
 }
-export type ControlledTimePickerProps<TFieldValues extends FieldValues> = ControlProps<TimePickerProps, TFieldValues>;
-export declare const TimePicker: <TFieldValues extends FieldValues>({ renderStaticInput, ...props }: ControlledTimePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-export {};
+type ControlledTimePickerProps<TFieldValues extends FieldValues> = ControlProps<TimePickerProps, TFieldValues>;
+declare const TimePickerComponent: <TFieldValues extends FieldValues>({ renderStaticInput, ...props }: ControlledTimePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
+declare const TimePicker: typeof TimePickerComponent;
+//#endregion
+export { ControlledTimePickerProps, TimePicker, TimePickerProps };