@povio/ui 3.4.0-rc.9 → 4.0.0-rc.2

package/dist/TextArea-BcIy_nZ2.js

@@ -0,0 +1,181 @@
+import { t as UIConfig } from "./uiConfig.context-BvBsrMFI.js";
+import { t as clsx } from "./clsx-CnD0nOiA.js";
+import { n as $7230ffa83bc0c2cf$export$29f1550f4b0d4415, r as $7230ffa83bc0c2cf$export$4d86445c2cf5e3, s as $7230ffa83bc0c2cf$export$df3a06d6289f983e } from "./utils-D3gCeElo.js";
+import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
+import { r as $a8ea2faf2ebe4d2f$re_export$mergeRefs } from "./import-DDGNxVX8.js";
+import { t as FieldController } from "./form.binding-DLM7NA2s.js";
+import { r as FormFieldLabel, t as FormField } from "./FormField-BHPdCLEV.js";
+import { a as inputSizeDefinition, i as inputSideDefinition, o as useInputCva } from "./input.cva-KYGD4Bdz.js";
+import { n as InputClear, t as TooltipWrapper } from "./TooltipWrapper-DYfZF2Ly.js";
+import $ahdqC$react, { createContext, forwardRef, memo, useRef } from "react";
+import { mergeProps } from "react-aria/mergeProps";
+import { useFocusRing } from "react-aria/useFocusRing";
+import { useHover } from "react-aria/useHover";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useTextField } from "@react-aria/textfield";
+//#region ../../node_modules/.bun/react-aria-components@1.20.0+67f6792bdf102c28/node_modules/react-aria-components/dist/private/TextArea.mjs
+const $bd263d78e9bf3c56$export$2dc6166a7e65358c = /*#__PURE__*/ createContext({});
+let $bd263d78e9bf3c56$var$filterHoverProps = (props) => {
+	let { onHoverStart, onHoverChange, onHoverEnd, ...otherProps } = props;
+	return otherProps;
+};
+const $bd263d78e9bf3c56$export$f5c9f3c2c4054eec = /*#__PURE__*/ forwardRef(function TextArea(props, ref) {
+	[props, ref] = $7230ffa83bc0c2cf$export$29f1550f4b0d4415(props, ref, $bd263d78e9bf3c56$export$2dc6166a7e65358c);
+	let { hoverProps, isHovered } = useHover(props);
+	let { isFocused, isFocusVisible, focusProps } = useFocusRing({
+		isTextInput: true,
+		autoFocus: props.autoFocus
+	});
+	let isInvalid = !!props["aria-invalid"] && props["aria-invalid"] !== "false";
+	let renderProps = $7230ffa83bc0c2cf$export$4d86445c2cf5e3({
+		...props,
+		values: {
+			isHovered,
+			isFocused,
+			isFocusVisible,
+			isDisabled: props.disabled || false,
+			isInvalid
+		},
+		defaultClassName: "react-aria-TextArea"
+	});
+	return /*#__PURE__*/ $ahdqC$react.createElement($7230ffa83bc0c2cf$export$df3a06d6289f983e.textarea, {
+		...mergeProps($bd263d78e9bf3c56$var$filterHoverProps(props), focusProps, hoverProps),
+		...renderProps,
+		ref,
+		"data-focused": isFocused || void 0,
+		"data-disabled": props.disabled || void 0,
+		"data-hovered": isHovered || void 0,
+		"data-focus-visible": isFocusVisible || void 0,
+		"data-invalid": isInvalid || void 0
+	});
+});
+//#endregion
+//#region src/components/inputs/Input/TextArea/TextArea.cva.ts
+const textAreaWrapperDefinition = UIOverrides.defineConfig({ base: ["group/text-area relative h-full"] });
+//#endregion
+//#region src/components/inputs/Input/TextArea/TextArea.tsx
+const TextAreaBase = (props) => {
+	const ui = UIConfig.useConfig();
+	const inputCva = useInputCva();
+	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
+	const inputSideCva = UIOverrides.useCva("input.sideCva", inputSideDefinition);
+	const textAreaWrapperCva = UIOverrides.useCva("textArea.wrapperCva", textAreaWrapperDefinition);
+	const { ref, className, inputClassName, error, errorMessage, label, tooltipText, helperText, isRequired, required, rightContent, isDisabled, disabled, isDirty, headerClassName, errorClassName, isHeaderHidden, value, onChange, onBlur, as: asProp, layout: layoutProp, hideLabel: hideLabelProp, variant: variantProp, isClearable: isClearableProp, isClearableIfDisabled, ...rest } = props;
+	const as = layoutProp ?? asProp ?? ui.input.as;
+	const resolvedIsDisabled = isDisabled ?? disabled;
+	const resolvedIsRequired = isRequired ?? required;
+	const resolvedError = errorMessage ?? error;
+	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
+	const variant = variantProp ?? ui.input.variant;
+	const isClearable = isClearableProp ?? ui.input.isClearable;
+	const textFieldRef = useRef(null);
+	const textFieldProps = {
+		...rest,
+		label,
+		isDisabled: resolvedIsDisabled,
+		isInvalid: !!resolvedError,
+		isRequired: resolvedIsRequired,
+		value,
+		onChange,
+		onBlur
+	};
+	const { labelProps, inputProps } = useTextField(textFieldProps, textFieldRef);
+	const formFieldProps = {
+		error: resolvedError,
+		label,
+		tooltipText,
+		helperText,
+		isRequired: resolvedIsRequired,
+		rightContent,
+		isHeaderHidden: isHeaderHidden || as === "inline" || as === "filter" || as === "floating",
+		hideLabel,
+		isDisabled: resolvedIsDisabled,
+		headerClassName,
+		errorClassName
+	};
+	const headerProps = {
+		label,
+		tooltipText,
+		helperText,
+		isRequired: resolvedIsRequired,
+		rightContent,
+		isHeaderHidden: hideLabel || isHeaderHidden,
+		isDisabled: resolvedIsDisabled,
+		className: headerClassName,
+		labelProps
+	};
+	const showClear = isClearable && value != null && value !== "" && (!resolvedIsDisabled || isClearableIfDisabled === true);
+	return /* @__PURE__ */ jsx(TooltipWrapper, {
+		as,
+		error: resolvedError,
+		triggerTabIndex: as === "inline" ? -1 : void 0,
+		children: /* @__PURE__ */ jsx(FormField, {
+			...formFieldProps,
+			as,
+			labelProps,
+			className: clsx("group w-full flex flex-col", className),
+			tabIndex: as === "inline" ? -1 : void 0,
+			children: /* @__PURE__ */ jsxs("div", {
+				className: textAreaWrapperCva({}),
+				"data-text-area": true,
+				children: [
+					as === "floating" && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
+						as,
+						...headerProps,
+						className: clsx(headerProps.className, inputSideCva({
+							size: "default",
+							type: "left"
+						}))
+					}),
+					/* @__PURE__ */ jsx($bd263d78e9bf3c56$export$f5c9f3c2c4054eec, {
+						...inputProps,
+						"data-is-dirty": isDirty || void 0,
+						"data-is-required": resolvedIsRequired || void 0,
+						"data-is-empty": value?.trim() === "" || value === null || value === void 0 || void 0,
+						placeholder: as === "floating" ? "" : inputProps.placeholder,
+						className: inputCva({
+							variant,
+							as,
+							...rest,
+							className: clsx("block h-full min-h-8", inputClassName)
+						}),
+						ref
+					}),
+					showClear && /* @__PURE__ */ jsx("span", {
+						className: clsx("absolute top-0 right-0", inputSizeCva({ size: "default" })),
+						children: /* @__PURE__ */ jsx(InputClear, {
+							onClear: () => {
+								onChange?.("");
+								onBlur?.(null);
+							},
+							show: true
+						})
+					})
+				]
+			})
+		})
+	});
+};
+const TextAreaComponent = (props) => {
+	if ("field" in props && props.field) {
+		const { field, ref, ...innerProps } = props;
+		return /* @__PURE__ */ jsx(FieldController, {
+			control: field.form,
+			name: field.name,
+			render: ({ field, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(TextAreaBase, {
+				...innerProps,
+				ref: $a8ea2faf2ebe4d2f$re_export$mergeRefs(ref, field.ref),
+				value: field.value ?? "",
+				onChange: field.onChange,
+				onBlur: field.onBlur,
+				isDirty,
+				isDisabled: field.disabled || props.isDisabled,
+				error: props.error ?? error?.message
+			})
+		});
+	}
+	return /* @__PURE__ */ jsx(TextAreaBase, { ...props });
+};
+const TextArea = memo(TextAreaComponent);
+//#endregion
+export { textAreaWrapperDefinition as n, TextArea as t };

package/dist/TextArea-CBWJ7w-p.d.ts

@@ -0,0 +1,24 @@
+import { n as FieldValues } from "./form.binding-DVJ5F0JE.js";
+import { t as ControlProps } from "./form.types-CecYaerF.js";
+import { n as FormFieldProps } from "./FormField-DTDj3F0A.js";
+import { n as InputVariantProps } from "./input.cva-ByFuAEIS.js";
+import { Ref } from "react";
+import { TextAreaProps } from "react-aria-components";
+import { AriaTextFieldProps } from "@react-aria/textfield";
+//#region src/components/inputs/Input/TextArea/TextArea.d.ts
+interface TextAreaBaseProps extends FormFieldProps, InputVariantProps, Omit<TextAreaProps, "value" | "defaultValue" | "onChange" | "disabled" | "required" | "className" | keyof AriaTextFieldProps>, Omit<AriaTextFieldProps<HTMLTextAreaElement>, "label" | "errorMessage"> {
+  ref?: Ref<HTMLTextAreaElement>;
+  isClearable?: boolean;
+  isClearableIfDisabled?: boolean;
+  isDirty?: boolean;
+  inputClassName?: string;
+  disabled?: boolean;
+  required?: boolean;
+  errorMessage?: string;
+}
+interface TextAreaProps$1 extends TextAreaBaseProps {}
+type ControlledTextAreaProps<TFieldValues extends FieldValues> = ControlProps<TextAreaProps$1, TFieldValues>;
+declare const TextAreaComponent: <TFieldValues extends FieldValues>(props: ControlledTextAreaProps<TFieldValues>) => import("react").JSX.Element;
+declare const TextArea: typeof TextAreaComponent;
+//#endregion
+export { TextArea as n, TextAreaProps$1 as r, ControlledTextAreaProps as t };

package/dist/TextButton-D7e_YBLe.d.ts

@@ -0,0 +1,15 @@
+import { n as LinkNavigationProps } from "./Link-DS9-0Ijl.js";
+import { n as ButtonVariantProps } from "./button.cva-ChabF4Am.js";
+import { t as ButtonContentVariantProps } from "./buttonContent.cva-CP857foM.js";
+import { r as ButtonIconProps } from "./Button-DTNjsGx5.js";
+import { ReactNode } from "react";
+import { ButtonProps } from "react-aria-components";
+//#region src/components/buttons/TextButton/TextButton.d.ts
+type TextButtonProps = Omit<ButtonVariantProps, "variant"> & ButtonContentVariantProps & ButtonProps & ButtonIconProps<true | false> & {
+  children: ReactNode;
+  isLoading?: boolean;
+  link?: LinkNavigationProps;
+};
+declare const TextButton: ({ children, ...props }: TextButtonProps) => import("react").JSX.Element;
+//#endregion
+export { TextButtonProps as n, TextButton as t };

package/dist/TimePicker-BZ4WrI5Z.d.ts

@@ -0,0 +1,33 @@
+import { n as FieldValues } from "./form.binding-DVJ5F0JE.js";
+import { t as ControlProps } from "./form.types-CecYaerF.js";
+import { n as FormFieldProps } from "./FormField-DTDj3F0A.js";
+import { n as InputVariantProps } from "./input.cva-ByFuAEIS.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;
+  onValueCommit?: () => void;
+  shouldForceLeadingZeros?: boolean;
+}
+interface TimePickerProps extends Omit<TimePickerBaseProps, "value" | "onChange" | "onValueCommit"> {
+  value?: string | null;
+  onChange?: (value: string | null) => void;
+  fullIso?: boolean;
+  timeZone?: string;
+  renderStaticInput?: boolean;
+}
+type ControlledTimePickerProps<TFieldValues extends FieldValues> = ControlProps<TimePickerProps, TFieldValues>;
+declare const TimePickerComponent: <TFieldValues extends FieldValues>({ renderStaticInput, ...props }: ControlledTimePickerProps<TFieldValues>) => import("react").JSX.Element;
+declare const TimePicker: typeof TimePickerComponent;
+//#endregion
+export { TimePicker as n, TimePickerProps as r, ControlledTimePickerProps as t };

package/dist/TimePicker-vbrwgBc5.js

@@ -0,0 +1,428 @@
+import { t as UIConfig } from "./uiConfig.context-BvBsrMFI.js";
+import { t as clsx } from "./clsx-CnD0nOiA.js";
+import { n as $7705c033048f6da7$export$353f5b6fc5456de1 } from "./Button-CRlZqaJq.js";
+import { t as UIOverrides } from "./uiOverrides.context-Bfm2n-n8.js";
+import { r as $2eb8e6d23f3d0cb0$export$43bb16f9c6d9e3f7, t as $3e6197669829fe11$export$40bfa8c7b0832715 } from "./useControlledState-BMVd3AOQ.js";
+import { a as getStaticTimeSegments, c as useFirefoxDateSegmentSelectionGuard, d as $8e7461aabf74661f$export$60e84778edff6d26, i as getStaticDateTimeFocusTarget, l as DateSegmentItem, o as DateTimeDialogFooter, s as DateTimeDialog, y as $7541913c0284d84b$export$4c842f6a241dc825 } from "./staticDateTimeSegments-B9kkwiDz.js";
+import { t as Typography } from "./Typography-AcUd9df8.js";
+import { InlineIconButton } from "./components/inline-icon-button.js";
+import { r as $a8ea2faf2ebe4d2f$re_export$mergeRefs } from "./import-DDGNxVX8.js";
+import { t as FieldController } from "./form.binding-DLM7NA2s.js";
+import { r as FormFieldLabel, t as FormField } from "./FormField-BHPdCLEV.js";
+import { a as inputSizeDefinition, t as inputBaseDefinition } from "./input.cva-KYGD4Bdz.js";
+import { n as InputClear, t as TooltipWrapper } from "./TooltipWrapper-DYfZF2Ly.js";
+import { i as InputFrame, n as useStaticInputHandoff } from "./useStaticInputHandoff-Denoy4V_.js";
+import { n as TimePickerForm, t as normalizeDatePickerValue } from "./datePickerValue.utils-BxOJpTbb.js";
+import { t as DateTimeUtils } from "./date-time.utils-0F9qduim.js";
+import { memo, useCallback, useEffect, useMemo, useRef, useState } from "react";
+import { GregorianCalendar, Time, getLocalTimeZone, now, toCalendarDateTime, toTime, toZoned, today } from "@internationalized/date";
+import { jsx, jsxs } from "react/jsx-runtime";
+import { useFocusVisible, useFocusWithin, useHover } from "@react-aria/interactions";
+//#region ../../node_modules/.bun/react-stately@3.49.0+83d5fd7b249dbeef/node_modules/react-stately/dist/private/datepicker/useTimeFieldState.mjs
+function $b822555cf9fe955c$export$fd53cef0cc796101(props) {
+	let { placeholderValue = new Time(), minValue, maxValue, defaultValue, granularity, validate } = props;
+	let [value, setValue] = $3e6197669829fe11$export$40bfa8c7b0832715(props.value, defaultValue ?? null, props.onChange);
+	let v = value || placeholderValue;
+	let day = v && "day" in v ? v : void 0;
+	let defaultValueTimeZone = defaultValue && "timeZone" in defaultValue ? defaultValue.timeZone : void 0;
+	let placeholderDate = useMemo(() => {
+		let valueTimeZone = v && "timeZone" in v ? v.timeZone : void 0;
+		return (valueTimeZone || defaultValueTimeZone) && placeholderValue ? toZoned($b822555cf9fe955c$var$convertValue(placeholderValue), valueTimeZone || defaultValueTimeZone) : $b822555cf9fe955c$var$convertValue(placeholderValue);
+	}, [
+		placeholderValue,
+		v,
+		defaultValueTimeZone
+	]);
+	let minDate = useMemo(() => $b822555cf9fe955c$var$convertValue(minValue, day), [minValue, day]);
+	let maxDate = useMemo(() => $b822555cf9fe955c$var$convertValue(maxValue, day), [maxValue, day]);
+	let timeValue = useMemo(() => value && "day" in value ? toTime(value) : value, [value]);
+	let dateTime = useMemo(() => value == null ? null : $b822555cf9fe955c$var$convertValue(value), [value]);
+	let defaultDateTime = useMemo(() => defaultValue == null ? null : $b822555cf9fe955c$var$convertValue(defaultValue), [defaultValue]);
+	let onChange = (newValue) => {
+		setValue(day || defaultValueTimeZone ? newValue : newValue && toTime(newValue));
+	};
+	return {
+		...$8e7461aabf74661f$export$60e84778edff6d26({
+			...props,
+			value: dateTime,
+			defaultValue: defaultDateTime,
+			minValue: minDate,
+			maxValue: maxDate,
+			onChange,
+			granularity: granularity || "minute",
+			maxGranularity: "hour",
+			placeholderValue: placeholderDate ?? void 0,
+			createCalendar: () => new GregorianCalendar(),
+			validate: useCallback(() => validate?.(value), [validate, value])
+		}),
+		timeValue
+	};
+}
+function $b822555cf9fe955c$var$convertValue(value, date = today(getLocalTimeZone())) {
+	if (!value) return null;
+	if ("day" in value) return value;
+	return toCalendarDateTime(date, value);
+}
+//#endregion
+//#region src/components/inputs/DateTime/shared/TimeField.tsx
+const TimeField = ({ ref, fieldProps, state, isDisabled, hidePlaceholder }) => {
+	return /* @__PURE__ */ jsx("div", { children: /* @__PURE__ */ jsx("div", {
+		...fieldProps,
+		ref,
+		className: "flex",
+		children: state.segments.map((segment, i) => /* @__PURE__ */ jsx(DateSegmentItem, {
+			segment,
+			state,
+			isDisabled,
+			timePickerOnly: true,
+			hidePlaceholder
+		}, i))
+	}) });
+};
+//#endregion
+//#region src/components/inputs/DateTime/shared/TimePickerInput.tsx
+const TimePickerInput = ({ ref, as, fieldProps, state, isDisabled, isDirty, isRequired, isInvalid, disableDropdown, variant, size, isClearable, isClearableIfDisabled, headerProps, disableManualEntry, placeholder, className, onPress, onClear, ...props }) => {
+	const uiConfig = UIConfig.useConfig();
+	const inputBaseCva = UIOverrides.useCva("input.baseCva", inputBaseDefinition);
+	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
+	const { hoverProps, isHovered } = useHover({ isDisabled });
+	const [isFocused, setIsFocused] = useState(false);
+	const { focusWithinProps } = useFocusWithin({ onFocusWithinChange: setIsFocused });
+	const { isFocusVisible } = useFocusVisible();
+	const containerRef = useRef(null);
+	useFirefoxDateSegmentSelectionGuard(containerRef);
+	const hidePlaceholder = as === "floating" && !state.value && !isFocused;
+	const canClear = state.segments.some((segment) => segment.type !== "literal" && segment.isPlaceholder === false);
+	return /* @__PURE__ */ jsxs("div", {
+		ref: $a8ea2faf2ebe4d2f$re_export$mergeRefs(ref, containerRef),
+		className: clsx(inputBaseCva({
+			variant,
+			as,
+			...props
+		}), "group/date-picker-content relative min-w-input-width-min-width", "flex items-center justify-between gap-input-gap-input-text-to-elements", className),
+		"data-rac": "",
+		"data-datetime-input": "",
+		"data-hovered": isHovered || void 0,
+		"data-disabled": isDisabled || void 0,
+		"data-is-disabled": isDisabled || void 0,
+		"data-invalid": isInvalid || void 0,
+		"data-is-empty": state.value === null || void 0,
+		"data-focus-within": isFocused || void 0,
+		"data-focus-visible": isFocused && isFocusVisible || void 0,
+		"data-has-selection": state.value !== null || void 0,
+		"data-is-dirty": isDirty || void 0,
+		"data-required": isRequired || void 0,
+		"data-is-required": isRequired || void 0,
+		"data-is-filled": state.value !== null || void 0,
+		...fieldProps,
+		...focusWithinProps,
+		...hoverProps,
+		children: [/* @__PURE__ */ jsxs("div", {
+			className: clsx(inputSizeCva({
+				size,
+				as
+			}), "flex w-full items-center gap-input-gap-input-text-to-elements pr-0!"),
+			children: [
+				disableManualEntry && /* @__PURE__ */ jsx($7705c033048f6da7$export$353f5b6fc5456de1, {
+					onPress,
+					className: "absolute inset-0 z-base"
+				}),
+				as && ["filter", "floating"].includes(as) && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
+					as,
+					...headerProps
+				}),
+				/* @__PURE__ */ jsx("div", { children: disableManualEntry && placeholder && !state.value ? /* @__PURE__ */ jsx(Typography, {
+					size: "label-1",
+					className: "text-text-default-3",
+					children: placeholder
+				}) : /* @__PURE__ */ jsx(TimeField, {
+					fieldProps,
+					state,
+					isDisabled,
+					hidePlaceholder
+				}) })
+			]
+		}), /* @__PURE__ */ jsxs("div", {
+			className: clsx(inputSizeCva({
+				size,
+				as
+			}), "flex items-center gap-input-gap-trailing-elements py-0! pl-0!"),
+			children: [isClearable && /* @__PURE__ */ jsx(InputClear, {
+				onClear: () => {
+					if (onClear) onClear();
+					else state.setValue(null);
+				},
+				show: canClear && (!isDisabled || isClearableIfDisabled === true)
+			}), (!disableDropdown || disableManualEntry) && /* @__PURE__ */ jsx(InlineIconButton, {
+				label: "",
+				color: "secondary",
+				onPress,
+				icon: uiConfig.dateInput.timeIcon,
+				isDisabled,
+				className: "border-0!",
+				"data-static-press-action": ""
+			})]
+		})]
+	});
+};
+//#endregion
+//#region src/components/inputs/DateTime/TimePicker/TimePicker.tsx
+const TimePickerBase = (props) => {
+	const ui = UIConfig.useConfig();
+	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, onValueCommit, value, disableDropdown, placeholder, className, inputClassName, variant: variantProp, as: asProp, size: sizeProp, hideLabel: hideLabelProp, isClearable: isClearableProp, isClearableIfDisabled, disableManualEntry: disableManualEntryProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, ...rest } = props;
+	const variant = variantProp ?? ui.input.variant;
+	const as = asProp ?? ui.input.as;
+	const size = sizeProp ?? ui.input.size;
+	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
+	const isClearable = isClearableProp ?? ui.input.isClearable;
+	const disableManualEntry = disableManualEntryProp ?? ui.dateInput.disableManualEntry;
+	const shouldForceLeadingZeros = shouldForceLeadingZerosProp ?? ui.dateInput.shouldForceLeadingZeros;
+	const formFieldProps = {
+		error,
+		label,
+		tooltipText,
+		helperText,
+		isRequired,
+		rightContent,
+		isHeaderHidden: isHeaderHidden || as === "inline" || as === "filter" || as === "floating",
+		hideLabel,
+		isDisabled,
+		headerClassName,
+		errorClassName
+	};
+	const [isOpen, setIsOpen] = useState(false);
+	const initialDateEmitRef = useRef(true);
+	const { locale } = $2eb8e6d23f3d0cb0$export$43bb16f9c6d9e3f7();
+	const normalizedValue = value ?? null;
+	const dialogState = $b822555cf9fe955c$export$fd53cef0cc796101({
+		...rest,
+		defaultValue: normalizedValue ?? rest.defaultValue ?? null,
+		locale,
+		shouldForceLeadingZeros
+	});
+	const handleBlur = (val) => {
+		onBlur?.({ target: { value: val } });
+	};
+	const state = $b822555cf9fe955c$export$fd53cef0cc796101({
+		...rest,
+		isDisabled,
+		value: normalizedValue,
+		onChange: (val) => {
+			onChange?.(normalizeDatePickerValue(val));
+		},
+		locale,
+		shouldForceLeadingZeros
+	});
+	useEffect(() => {
+		if (initialDateEmitRef.current) {
+			initialDateEmitRef.current = false;
+			return;
+		}
+		if (state.timeValue) onChange?.(state.timeValue);
+	}, [rest.date]);
+	const timeFieldRef = useRef(null);
+	const { labelProps, fieldProps } = $7541913c0284d84b$export$4c842f6a241dc825({
+		...rest,
+		label,
+		isReadOnly: disableManualEntry,
+		shouldForceLeadingZeros
+	}, state, timeFieldRef);
+	const headerProps = {
+		label,
+		tooltipText,
+		helperText,
+		isRequired,
+		rightContent,
+		isHeaderHidden: hideLabel || isHeaderHidden,
+		isDisabled,
+		className: headerClassName,
+		labelProps
+	};
+	const onApply = () => {
+		const newValue = dialogState.value;
+		state.setValue(newValue);
+		onValueCommit?.();
+		setIsOpen(false);
+	};
+	const onOpenChange = (open) => {
+		setIsOpen(open);
+		if (!isOpen) dialogState.setValue(state.value);
+	};
+	const onOpen = () => {
+		dialogState.setValue(state.value);
+		setIsOpen(true);
+	};
+	const onInputClear = () => {
+		onChange?.(null);
+		onValueCommit?.();
+	};
+	return /* @__PURE__ */ jsx(TooltipWrapper, {
+		as,
+		error,
+		triggerTabIndex: as === "inline" ? -1 : void 0,
+		children: /* @__PURE__ */ jsxs(FormField, {
+			...formFieldProps,
+			as,
+			labelProps,
+			className: clsx("group relative inline-flex w-full flex-col text-left", className),
+			tabIndex: as === "inline" ? -1 : void 0,
+			children: [/* @__PURE__ */ jsx(TimePickerInput, {
+				ref: $a8ea2faf2ebe4d2f$re_export$mergeRefs(ref, timeFieldRef),
+				as,
+				fieldProps: {
+					...fieldProps,
+					onBlur: (event) => {
+						fieldProps.onBlur?.(event);
+						handleBlur(state.value);
+					}
+				},
+				state,
+				onPress: onOpen,
+				isDisabled,
+				isDirty,
+				isRequired,
+				isInvalid: !!error,
+				disableDropdown,
+				variant,
+				size,
+				isClearable,
+				isClearableIfDisabled,
+				headerProps,
+				disableManualEntry,
+				placeholder,
+				className: inputClassName,
+				onClear: onInputClear
+			}), (!disableDropdown || disableManualEntry) && /* @__PURE__ */ jsx(DateTimeDialog, {
+				footer: /* @__PURE__ */ jsx(DateTimeDialogFooter, {
+					isDisabled,
+					onApply,
+					isValid: !dialogState.isInvalid && !!dialogState.value
+				}),
+				label,
+				triggerRef: timeFieldRef,
+				isOpen,
+				onOpenChange,
+				children: /* @__PURE__ */ jsx(TimePickerForm, { state: dialogState })
+			})]
+		})
+	});
+};
+const TimePickerInner = ({ renderStaticInput, isFormControlDisabled, ...props }) => {
+	const ui = UIConfig.useConfig();
+	const timeZone = props.timeZone ?? ui.dateInput.timeZone;
+	let effectiveTimeZone = getLocalTimeZone();
+	if (timeZone !== "clientLocal") effectiveTimeZone = timeZone;
+	const { locale } = $2eb8e6d23f3d0cb0$export$43bb16f9c6d9e3f7();
+	const [renderInput, setRenderInput] = useState(!(renderStaticInput ?? ui.renderStaticInput));
+	const inputRef = useRef(null);
+	const { renderRealInput, replayStaticInputPress } = useStaticInputHandoff({
+		inputRef,
+		renderInput,
+		setRenderInput,
+		getFocusTarget: (input, staticTarget, fromEnd) => getStaticDateTimeFocusTarget(input, staticTarget, fromEnd),
+		getPressTarget: (input) => input.querySelector("[data-static-press-action]")
+	});
+	const normalizedValue = props.value ?? null;
+	const formatTimeValue = (timeValue) => {
+		if (timeValue === null) return null;
+		let parsedDate;
+		if (props.date) parsedDate = new Date(props.date);
+		let dateValue = now(effectiveTimeZone);
+		if (parsedDate) dateValue = DateTimeUtils.fromLocalToZonedDateTime(parsedDate, effectiveTimeZone);
+		const dateTimeValue = dateValue.set(timeValue);
+		return DateTimeUtils.fromDateValueToISO(dateTimeValue, effectiveTimeZone);
+	};
+	const parseTimeValue = (isoString) => {
+		if (isoString == null) return null;
+		const zonedDateTime = DateTimeUtils.fromISOtoZonedDateTime(isoString, effectiveTimeZone);
+		return toTime(zonedDateTime);
+	};
+	if (!renderInput) {
+		const timeValue = normalizedValue ? parseTimeValue(normalizedValue) : null;
+		const as = props.as ?? ui.input.as;
+		const isDisabled = isFormControlDisabled || !!props.isDisabled;
+		const disableManualEntry = props.disableManualEntry ?? ui.dateInput.disableManualEntry;
+		const shouldForceLeadingZeros = props.shouldForceLeadingZeros ?? ui.dateInput.shouldForceLeadingZeros;
+		const showDropdown = !props.disableDropdown || disableManualEntry;
+		const staticSegments = getStaticTimeSegments({
+			value: timeValue,
+			locale,
+			shouldForceLeadingZeros,
+			isDisabled,
+			hidePlaceholder: as === "floating" && !timeValue,
+			disableManualEntry,
+			placeholder: props.placeholder
+		});
+		return /* @__PURE__ */ jsx(InputFrame, {
+			...props,
+			onClear: () => {
+				props.onChange?.(null);
+				props.onValueCommit?.();
+			},
+			isDisabled,
+			className: clsx("group relative inline-flex w-full flex-col text-left", props.className),
+			inputClassName: clsx("min-w-input-width-min-width", props.inputClassName),
+			contentClassName: "pr-0!",
+			contentGroup: "date-picker",
+			labelPlacement: "content-row",
+			dataAttributes: {
+				dataIsEmpty: timeValue == null,
+				dataIsFilled: timeValue != null,
+				dataIsDirty: props.isDirty,
+				dataIsRequired: props.isRequired,
+				dataIsDisabled: isDisabled,
+				dataDisabled: isDisabled,
+				dataInvalid: !!props.error,
+				dataHasSelection: timeValue != null
+			},
+			onStaticInteract: renderRealInput,
+			onStaticPress: replayStaticInputPress,
+			staticPressTarget: "action",
+			showClear: timeValue != null,
+			wrapContentAndTrailing: true,
+			trailingClassName: "py-0! pl-0!",
+			action: showDropdown ? {
+				icon: ui.dateInput.timeIcon,
+				onClick: () => {},
+				altText: ""
+			} : void 0,
+			children: staticSegments
+		});
+	}
+	return /* @__PURE__ */ jsx(TimePickerBase, {
+		...props,
+		ref: $a8ea2faf2ebe4d2f$re_export$mergeRefs(props.ref, inputRef),
+		value: parseTimeValue(normalizedValue),
+		onChange: (value) => props.onChange?.(formatTimeValue(value))
+	});
+};
+const TimePickerComponent = ({ 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, fieldState: { error, isDirty } }) => /* @__PURE__ */ jsx(TimePickerInner, {
+				...innerProps,
+				ref: $a8ea2faf2ebe4d2f$re_export$mergeRefs(ref, field.ref),
+				value: field.value ?? null,
+				onChange: (value) => field.onChange(value ?? null),
+				onBlur: field.onBlur,
+				onValueCommit: field.onBlur,
+				isDirty,
+				isDisabled: field.disabled || props.isDisabled,
+				isFormControlDisabled: !!controlWithOptions._options?.disabled,
+				error: props.error ?? error?.message,
+				renderStaticInput
+			})
+		});
+	}
+	return /* @__PURE__ */ jsx(TimePickerInner, {
+		...props,
+		renderStaticInput
+	});
+};
+const TimePicker = memo(TimePickerComponent);
+//#endregion
+export { TimePicker as t };