@povio/ui 3.4.0-rc.2 → 3.4.0-rc.22

package/dist/components/inputs/DateTime/shared/CalendarSelectHeader.js

@@ -1,177 +0,0 @@
-import { ArrowDropDownIcon } from "../../../../assets/icons/ArrowDropDown.js";
-import { ChevronLeftIcon } from "../../../../assets/icons/ChevronLeft.js";
-import { ChevronRightIcon } from "../../../../assets/icons/ChevronRight.js";
-import { ChevronsLeftIcon } from "../../../../assets/icons/ChevronsLeft.js";
-import { ChevronsRightIcon } from "../../../../assets/icons/ChevronsRight.js";
-import { InlineIconButton } from "../../../buttons/InlineIconButton/InlineIconButton.js";
-import { PillButton } from "../../../buttons/PillButton/PillButton.js";
-import "../../../../config/i18n.js";
-import { Select } from "../../Selection/Select/Select.js";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { useMemo } from "react";
-import { useTranslation } from "react-i18next";
-import { useDateFormatter } from "@react-aria/i18n";
-//#region src/components/inputs/DateTime/shared/CalendarSelectHeader.tsx
-var CalendarSelectHeader = ({ state, isPrevMonthDisabled, isPrevYearDisabled, isNextMonthDisabled, isNextYearDisabled, offset = { months: 0 }, onNavigate, maxDate, minDate }) => {
-	const { t } = useTranslation("ui");
-	const displayDate = state.visibleRange.start.add(offset);
-	const currentMonth = displayDate.month - 1;
-	const currentYear = displayDate.year;
-	const formatter = useDateFormatter({
-		month: "long",
-		timeZone: state.timeZone
-	});
-	const numMonths = state.focusedDate.calendar.getMonthsInYear(state.focusedDate);
-	const MONTHS = useMemo(() => {
-		const months = [];
-		for (let i = 1; i <= numMonths; i++) {
-			const date = state.focusedDate.set({ month: i });
-			months.push(formatter.format(date.toDate(state.timeZone)));
-		}
-		return months;
-	}, [
-		formatter,
-		numMonths,
-		state.focusedDate,
-		state.timeZone
-	]);
-	const years = Array.from({ length: 201 }, (_, i_0) => currentYear - 100 + i_0);
-	const getAvailableMonths = () => {
-		return MONTHS.map((month, i_1) => {
-			const monthDate = displayDate.set({ month: i_1 + 1 });
-			let isDisabled = false;
-			if (maxDate) isDisabled = monthDate.year > maxDate.year || monthDate.year === maxDate.year && monthDate.month >= maxDate.month;
-			if (minDate) isDisabled = monthDate.year < minDate.year || monthDate.year === minDate.year && monthDate.month <= minDate.month;
-			return {
-				month,
-				value: i_1,
-				isDisabled
-			};
-		});
-	};
-	const getAvailableYears = () => {
-		return years.map((year) => {
-			let isDisabled_0 = false;
-			if (maxDate) isDisabled_0 = year > maxDate.year || year === maxDate.year && displayDate.month >= maxDate.month;
-			if (minDate && !isDisabled_0) isDisabled_0 = year < minDate.year || year === minDate.year && displayDate.month <= minDate.month;
-			return {
-				year,
-				isDisabled: isDisabled_0
-			};
-		});
-	};
-	const availableMonths = getAvailableMonths();
-	const availableYears = getAvailableYears();
-	const handleMonthChange = (value) => {
-		if (value === null) return;
-		const newDate = displayDate.set({ month: value + 1 });
-		onNavigate?.(newDate);
-	};
-	const handleYearChange = (value_0) => {
-		if (value_0 === null) return;
-		const newDate_0 = displayDate.set({ year: value_0 });
-		onNavigate?.(newDate_0);
-	};
-	const handlePrevMonth = (e) => {
-		e.preventDefault();
-		e.stopPropagation();
-		const newDate_1 = displayDate.subtract({ months: 1 });
-		onNavigate?.(newDate_1);
-	};
-	const handleNextMonth = (e_0) => {
-		e_0.preventDefault();
-		e_0.stopPropagation();
-		const newDate_2 = displayDate.add({ months: 1 });
-		onNavigate?.(newDate_2);
-	};
-	const handlePrevYear = (e_1) => {
-		e_1.preventDefault();
-		e_1.stopPropagation();
-		const newDate_3 = displayDate.subtract({ years: 1 });
-		onNavigate?.(newDate_3);
-	};
-	const handleNextYear = (e_2) => {
-		e_2.preventDefault();
-		e_2.stopPropagation();
-		const newDate_4 = displayDate.add({ years: 1 });
-		onNavigate?.(newDate_4);
-	};
-	return /* @__PURE__ */ jsxs("div", {
-		className: "flex w-full items-center justify-between gap-3 border-elevation-outline-default-1 border-b border-solid px-3 py-2-5",
-		children: [
-			/* @__PURE__ */ jsxs("div", {
-				className: "flex items-center",
-				children: [/* @__PURE__ */ jsx(InlineIconButton, {
-					color: "secondary",
-					isDisabled: isPrevYearDisabled,
-					onClick: handlePrevYear,
-					icon: ChevronsLeftIcon,
-					label: t(($) => $.ui.datePicker.navigation.previousYear)
-				}), /* @__PURE__ */ jsx(InlineIconButton, {
-					color: "secondary",
-					isDisabled: isPrevMonthDisabled,
-					onClick: handlePrevMonth,
-					icon: ChevronLeftIcon,
-					label: t(($_0) => $_0.ui.datePicker.navigation.previousMonth)
-				})]
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "flex gap-2",
-				children: [/* @__PURE__ */ jsx(Select, {
-					label: "Month",
-					hideLabel: true,
-					customTrigger: /* @__PURE__ */ jsx(PillButton, {
-						color: "secondary",
-						variant: "subtle",
-						iconPosition: "right",
-						icon: ArrowDropDownIcon,
-						children: MONTHS[currentMonth].slice(0, 3)
-					}),
-					ignoreTriggerWidth: true,
-					items: availableMonths.map(({ month: month_0, value: value_1, isDisabled: isDisabled_1 }) => ({
-						label: month_0,
-						id: value_1,
-						isDisabled: isDisabled_1
-					})).filter(({ isDisabled: isDisabled_2 }) => !isDisabled_2),
-					value: currentMonth,
-					onChange: handleMonthChange
-				}), /* @__PURE__ */ jsx(Select, {
-					label: "Year",
-					hideLabel: true,
-					customTrigger: /* @__PURE__ */ jsx(PillButton, {
-						color: "secondary",
-						variant: "subtle",
-						iconPosition: "right",
-						icon: ArrowDropDownIcon,
-						children: currentYear.toString()
-					}),
-					items: availableYears.map(({ year: year_0, isDisabled: isDisabled_3 }) => ({
-						label: year_0.toString(),
-						id: year_0,
-						isDisabled: isDisabled_3
-					})).filter(({ isDisabled: isDisabled_4 }) => !isDisabled_4),
-					value: currentYear,
-					onChange: handleYearChange
-				})]
-			}),
-			/* @__PURE__ */ jsxs("div", {
-				className: "flex items-center",
-				children: [/* @__PURE__ */ jsx(InlineIconButton, {
-					color: "secondary",
-					isDisabled: isNextMonthDisabled,
-					onClick: handleNextMonth,
-					icon: ChevronRightIcon,
-					label: t(($_1) => $_1.ui.datePicker.navigation.nextMonth)
-				}), /* @__PURE__ */ jsx(InlineIconButton, {
-					color: "secondary",
-					isDisabled: isNextYearDisabled,
-					onClick: handleNextYear,
-					icon: ChevronsRightIcon,
-					label: t(($_2) => $_2.ui.datePicker.navigation.nextYear)
-				})]
-			})
-		]
-	});
-};
-//#endregion
-export { CalendarSelectHeader };

package/dist/components/inputs/DateTime/shared/DateField.d.ts

@@ -1,21 +0,0 @@
-import { DateFieldStateOptions } from '@react-stately/datepicker';
-import { Ref } from 'react';
-export interface DateFieldHandle {
-    clearField: () => void;
-    autoFixYear: () => void;
-}
-interface DateFieldProps extends Omit<DateFieldStateOptions, "locale" | "createCalendar"> {
-    ref?: Ref<DateFieldHandle>;
-    onClearChange?: (canClear: boolean) => void;
-    hidePlaceholder?: boolean;
-    disableManualEntry?: boolean;
-    dateGranularity?: "day" | "month" | "year";
-    isTimeOptional?: boolean;
-    format?: string;
-    timeZone?: string;
-    segmentGroup?: string;
-    shouldAutoFixYear?: boolean;
-    preserveNullValue?: boolean;
-}
-export declare const DateField: ({ ref, onClearChange, hidePlaceholder, isDisabled, disableManualEntry, dateGranularity, isTimeOptional, format, timeZone, segmentGroup, shouldAutoFixYear, preserveNullValue, ...props }: DateFieldProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/inputs/DateTime/shared/DateField.js

@@ -1,156 +0,0 @@
-import { DateSegmentItem } from "./DateSegmentItem.js";
-import { DateTimeUtils } from "../../../../utils/date-time.utils.js";
-import { Fragment, jsx } from "react/jsx-runtime";
-import { clsx } from "clsx";
-import { useCallback, useEffect, useImperativeHandle, useMemo, useRef } from "react";
-import { useDateField, useLocale } from "react-aria";
-import { CalendarDate, CalendarDateTime, createCalendar } from "@internationalized/date";
-import { DateTime } from "luxon";
-import { useDateFieldState } from "react-stately";
-//#region src/components/inputs/DateTime/shared/DateField.tsx
-var omitNullValue = ({ value: _value, ...props }) => props;
-var DateField = ({ ref, onClearChange, hidePlaceholder, isDisabled, disableManualEntry, dateGranularity = "day", isTimeOptional = false, format, timeZone, segmentGroup, shouldAutoFixYear = false, preserveNullValue = false, ...props }) => {
-	const { locale } = useLocale();
-	const previousValueRef = useRef(props.value);
-	const dateFieldProps = props.value == null && !preserveNullValue ? omitNullValue(props) : props;
-	const state = useDateFieldState({
-		...dateFieldProps,
-		isDisabled,
-		isReadOnly: disableManualEntry,
-		locale,
-		createCalendar
-	});
-	const dataFieldRef = useRef(null);
-	const { fieldProps } = useDateField({
-		...dateFieldProps,
-		isDisabled,
-		isReadOnly: disableManualEntry
-	}, state, dataFieldRef);
-	const isSegmentVisible = useCallback((segmentType) => {
-		if (dateGranularity === "day") return true;
-		if (dateGranularity === "month") return segmentType !== "day";
-		if (dateGranularity === "year") return segmentType === "year";
-		return true;
-	}, [dateGranularity]);
-	const getSegmentsToRender = useCallback(() => {
-		const segments = [];
-		for (const segment of state.segments) if (segment.type !== "literal") {
-			if (isSegmentVisible(segment.type)) segments.push(segment);
-		} else if (segments.length > 0 && segments.at(-1)?.type !== "literal") segments.push(segment);
-		return segments;
-	}, [state.segments, isSegmentVisible]);
-	const segmentsToRender = useMemo(() => getSegmentsToRender(), [getSegmentsToRender]);
-	const getSegmentNumber = (segment_0) => {
-		if (!segment_0) return null;
-		if (typeof segment_0.value === "number" && !Number.isNaN(segment_0.value)) return segment_0.value;
-		const parsedValue = parseInt(segment_0.text ?? "");
-		return Number.isNaN(parsedValue) ? null : parsedValue;
-	};
-	const autoFixYear = () => {
-		const monthSegment = state.segments.find((segment_1) => segment_1.type === "month");
-		const daySegment = state.segments.find((segment_2) => segment_2.type === "day");
-		const yearSegment = state.segments.find((segment_3) => segment_3.type === "year");
-		const hourSegment = state.segments.find((segment_4) => segment_4.type === "hour");
-		const minuteSegment = state.segments.find((segment_5) => segment_5.type === "minute");
-		const isMonthFilled = monthSegment && !monthSegment.isPlaceholder;
-		const isDayFilled = daySegment && !daySegment.isPlaceholder;
-		const isYearFilled = yearSegment && !yearSegment.isPlaceholder && yearSegment.text?.length > 0;
-		const isYearComplete = isYearFilled && yearSegment.text?.length === 4;
-		const isYearEmpty = yearSegment && !(parseInt(yearSegment.text) && yearSegment.text?.length === 4);
-		const isDateFilled = isMonthFilled && isDayFilled && isYearFilled;
-		const isHourEmpty = hourSegment && (hourSegment.isPlaceholder || Number.isNaN(parseInt(hourSegment.text ?? "", 10)));
-		const isMinuteEmpty = minuteSegment && (minuteSegment.isPlaceholder || Number.isNaN(parseInt(minuteSegment.text ?? "", 10)));
-		const month = getSegmentNumber(monthSegment);
-		const day = getSegmentNumber(daySegment);
-		const segmentYear = getSegmentNumber(yearSegment);
-		let correctedValue = null;
-		if (!isTimeOptional && isDateFilled && minuteSegment && isMinuteEmpty) {
-			let minute = minuteSegment?.value || 0;
-			if (minuteSegment?.text?.length && minuteSegment?.text?.length > 0) {
-				minute = parseInt(minuteSegment?.text ?? "00");
-				if (isNaN(minute)) minute = 0;
-			}
-			state.setSegment("minute", minute);
-		}
-		if (!isTimeOptional && isDateFilled && hourSegment && isHourEmpty) {
-			let hour = hourSegment?.value || 0;
-			if (hourSegment?.text?.length && hourSegment?.text?.length > 0) {
-				hour = parseInt(hourSegment?.text ?? "00");
-				if (isNaN(hour)) hour = 0;
-			}
-			state.setSegment("hour", hour);
-		}
-		if (shouldAutoFixYear && isMonthFilled && isDayFilled && isYearEmpty) {
-			let correctedYear = (/* @__PURE__ */ new Date()).getFullYear();
-			if (yearSegment?.text?.length && yearSegment?.text?.length === 2) correctedYear = parseInt(`20${yearSegment?.text}`);
-			state.setSegment("year", correctedYear);
-			const hasDateSegments = month !== null && day !== null;
-			const hasTimeSegment = !!(hourSegment || minuteSegment);
-			if (state.value) correctedValue = state.value.set({ year: correctedYear });
-			else if (hasDateSegments && hasTimeSegment) correctedValue = new CalendarDateTime(correctedYear, month, day, getSegmentNumber(hourSegment) ?? 0, getSegmentNumber(minuteSegment) ?? 0);
-			else if (hasDateSegments) correctedValue = new CalendarDate(correctedYear, month, day);
-		}
-		if (isTimeOptional && !state.value && isMonthFilled && isDayFilled && isYearComplete && hourSegment?.isPlaceholder && minuteSegment?.isPlaceholder && month !== null && day !== null && segmentYear !== null) correctedValue = new CalendarDateTime(segmentYear, month, day, 0, 0, 0, 0);
-		const valueToCorrect = correctedValue ?? state.value;
-		if (!valueToCorrect) return;
-		const { year } = valueToCorrect;
-		if (shouldAutoFixYear && year >= 0 && year <= 99) {
-			const correctedYear_0 = year <= 50 ? 2e3 + year : 1900 + year;
-			correctedValue = valueToCorrect.set({ year: correctedYear_0 });
-		}
-		if (correctedValue) {
-			state.setValue(correctedValue);
-			props.onChange?.(correctedValue);
-		}
-	};
-	const handleBlur = (e) => {
-		if ((shouldAutoFixYear || isTimeOptional) && !e.currentTarget.contains(e.relatedTarget)) autoFixYear();
-		fieldProps.onBlur?.(e);
-	};
-	useImperativeHandle(ref, () => ({
-		clearField: () => {
-			state.setValue(null);
-		},
-		autoFixYear
-	}));
-	useEffect(() => {
-		if (previousValueRef.current != null && props.value == null && state.value !== null) state.setValue(null);
-		previousValueRef.current = props.value;
-	}, [props.value, state]);
-	useEffect(() => {
-		onClearChange?.(state.segments.some((segment_6) => segment_6.type !== "literal" && segment_6.isPlaceholder === false));
-	}, [state.segments, onClearChange]);
-	const getFormattedDisplayValue = () => {
-		if (!disableManualEntry) return null;
-		if (!format) return null;
-		if (!state.value) return null;
-		const jsDate = DateTimeUtils.fromDateValueToLocal(state.value, timeZone);
-		const formattedDate = DateTime.fromJSDate(jsDate);
-		if (!formattedDate.isValid) return null;
-		return formattedDate.toFormat(format);
-	};
-	const formattedDisplayValue = getFormattedDisplayValue();
-	let fieldContent = /* @__PURE__ */ jsx(Fragment, { children: segmentsToRender.map((segment_7, i) => /* @__PURE__ */ jsx(DateSegmentItem, {
-		segment: segment_7,
-		segmentGroup,
-		state,
-		isDisabled,
-		hidePlaceholder
-	}, i)) });
-	if (formattedDisplayValue) fieldContent = /* @__PURE__ */ jsx("span", {
-		className: clsx("select-none", isDisabled && "text-interactive-text-secondary-disabled"),
-		children: formattedDisplayValue
-	});
-	return /* @__PURE__ */ jsx("div", {
-		...fieldProps,
-		ref: dataFieldRef,
-		onBlur: handleBlur,
-		className: clsx("relative w-full", disableManualEntry && "pointer-events-none"),
-		children: /* @__PURE__ */ jsx("div", {
-			className: "flex",
-			children: fieldContent
-		})
-	});
-};
-//#endregion
-export { DateField };

package/dist/components/inputs/DateTime/shared/DatePickerInput.d.ts

@@ -1,45 +0,0 @@
-import { Ref } from 'react';
-import { DatePickerAria } from 'react-aria';
-import { DatePickerTodayIcon, DatePickerTodayIconButtonComponent, DatePickerTodayIconButtonSize, DatePickerTodayIconPlacement } from './datePicker.types';
-import { FormFieldHeaderProps } from '../../FormField/FormFieldHeader';
-import { InputVariantProps } from '../../shared/input.cva';
-export interface DatePickerInputHandle {
-    clear: () => void;
-    getContainer?: () => HTMLDivElement | null;
-}
-interface DatePickerInputProps extends InputVariantProps {
-    ref?: Ref<DatePickerInputHandle & HTMLDivElement>;
-    groupProps: DatePickerAria["groupProps"];
-    fieldProps: DatePickerAria["fieldProps"];
-    endFieldProps?: DatePickerAria["fieldProps"];
-    fieldValue?: DatePickerAria["fieldProps"]["value"];
-    endFieldValue?: DatePickerAria["fieldProps"]["value"];
-    isValueControlled?: boolean;
-    hasValue?: boolean;
-    buttonProps: DatePickerAria["buttonProps"];
-    isDisabled?: boolean;
-    isInvalid?: boolean;
-    disableDropdown?: boolean;
-    isDateTime?: boolean;
-    shouldShrinkInput?: boolean;
-    isClearable?: boolean;
-    headerProps?: FormFieldHeaderProps;
-    todayIcon?: DatePickerTodayIcon;
-    todayIconButtonSize?: DatePickerTodayIconButtonSize;
-    todayIconButtonComponent?: DatePickerTodayIconButtonComponent;
-    todayIconPlacement?: DatePickerTodayIconPlacement;
-    isDirty?: boolean;
-    isRequired?: boolean;
-    disableManualEntry?: boolean;
-    autoFixYear?: boolean;
-    placeholder?: string;
-    className?: string;
-    onOpenDropdown?: () => void;
-    dateGranularity?: "day" | "month" | "year";
-    timeZone?: string;
-    isTimeOptional?: boolean;
-    format?: string;
-    onClear?: () => void;
-}
-export declare const DatePickerInput: ({ ref, as, groupProps, fieldProps, endFieldProps, fieldValue, endFieldValue, isValueControlled, hasValue, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, shouldShrinkInput, isClearable, headerProps, todayIcon, todayIconButtonSize, todayIconButtonComponent, todayIconPlacement, isDirty, isRequired, disableManualEntry, autoFixYear, placeholder, className, onOpenDropdown, dateGranularity, timeZone: timeZoneProp, isTimeOptional, format, onClear: onClearProp, ...props }: DatePickerInputProps) => import("react/jsx-runtime").JSX.Element;
-export {};

package/dist/components/inputs/DateTime/shared/DatePickerInput.js

@@ -1,197 +0,0 @@
-import { UIOverrides } from "../../../../config/uiOverrides.context.js";
-import { Typography } from "../../../text/Typography/Typography.js";
-import { UIConfig } from "../../../../config/uiConfig.context.js";
-import { InlineIconButton } from "../../../buttons/InlineIconButton/InlineIconButton.js";
-import { FormFieldLabel } from "../../FormField/FormFieldLabel.js";
-import { inputBaseDefinition, inputSizeDefinition } from "../../shared/input.cva.js";
-import { DateTimeUtils } from "../../../../utils/date-time.utils.js";
-import { DateField } from "./DateField.js";
-import { datePickerInputContentRowDefinition } from "./datePickerInput.cva.js";
-import { renderDatePickerTodayIcon } from "./datePickerTodayIcon.js";
-import { useFirefoxDateSegmentSelectionGuard } from "./useFirefoxDateSegmentSelectionGuard.js";
-import { InputClear } from "../../shared/InputClear.js";
-import { Fragment, jsx, jsxs } from "react/jsx-runtime";
-import { clsx } from "clsx";
-import { useCallback, useImperativeHandle, useRef, useState } from "react";
-import { Button } from "react-aria-components";
-import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
-import { getLocalTimeZone, today } from "@internationalized/date";
-//#region src/components/inputs/DateTime/shared/DatePickerInput.tsx
-var DatePickerInput = ({ ref, as, groupProps, fieldProps, endFieldProps, fieldValue, endFieldValue, isValueControlled, hasValue, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, shouldShrinkInput, isClearable, headerProps, todayIcon, todayIconButtonSize = "none", todayIconButtonComponent, todayIconPlacement = "content", isDirty, isRequired, disableManualEntry, autoFixYear = false, placeholder, className, onOpenDropdown, dateGranularity = "day", timeZone: timeZoneProp, isTimeOptional = false, format, onClear: onClearProp, ...props }) => {
-	const uiConfig = UIConfig.useConfig();
-	const timeZone = timeZoneProp ?? uiConfig.dateInput.timeZone;
-	let effectiveTimeZone = getLocalTimeZone();
-	if (timeZone !== "clientLocal") effectiveTimeZone = timeZone;
-	const inputBaseCva = UIOverrides.useCva("input.baseCva", inputBaseDefinition);
-	const inputSizeCva = UIOverrides.useCva("input.sizeCva", inputSizeDefinition);
-	const datePickerInputContentRowCva = UIOverrides.useCva("datePickerInput.contentRowCva", datePickerInputContentRowDefinition);
-	const [canClear, setCanClear] = useState(false);
-	const { hoverProps, isHovered } = useHover({ isDisabled });
-	const [isFocused, setIsFocused] = useState(false);
-	const { focusWithinProps } = useFocusWithin({ onFocusWithinChange: (isFocusWithin) => {
-		setIsFocused(isFocusWithin);
-		if (!isFocusWithin && autoFixYear) {
-			dateFieldRef.current?.autoFixYear();
-			endDateFieldRef.current?.autoFixYear();
-		}
-	} });
-	const { isFocusVisible } = useFocusVisible();
-	const dateFieldRef = useRef(null);
-	const endDateFieldRef = useRef(null);
-	const containerRef = useRef(null);
-	useFirefoxDateSegmentSelectionGuard(containerRef);
-	const normalizedFieldProps = {
-		...fieldProps,
-		value: isValueControlled ? fieldValue ?? null : fieldProps.value ?? null,
-		shouldAutoFixYear: autoFixYear
-	};
-	const normalizedEndFieldProps = endFieldProps ? {
-		...endFieldProps,
-		value: isValueControlled ? endFieldValue ?? null : endFieldProps.value ?? null,
-		shouldAutoFixYear: autoFixYear
-	} : void 0;
-	const clearInput = useCallback(() => {
-		if (onClearProp) onClearProp();
-		else {
-			dateFieldRef.current?.clearField();
-			endDateFieldRef.current?.clearField();
-			fieldProps.onChange?.(null);
-			endFieldProps?.onChange?.(null);
-		}
-		setCanClear(false);
-	}, [
-		endFieldProps,
-		fieldProps,
-		onClearProp
-	]);
-	useImperativeHandle(ref, () => ({
-		clear: clearInput,
-		getContainer: () => containerRef.current
-	}), [clearInput]);
-	const onClearChange = useCallback((canClearInput) => {
-		setCanClear(canClearInput);
-	}, []);
-	const showClear = canClear || hasValue || normalizedFieldProps.value != null || normalizedEndFieldProps?.value != null;
-	const isTodayIconDisabled = isDisabled || buttonProps.isDisabled;
-	const onToday = () => {
-		if (isTodayIconDisabled) return;
-		if (isDateTime) {
-			const calendarDateTime = DateTimeUtils.getCurrentWallClockCalendarDateTime();
-			fieldProps.onChange?.(calendarDateTime);
-			if (endFieldProps) endFieldProps.onChange?.(calendarDateTime);
-		} else {
-			fieldProps.onChange?.(today(effectiveTimeZone));
-			if (endFieldProps) endFieldProps.onChange?.(today(effectiveTimeZone));
-		}
-	};
-	const hidePlaceholder = as === "floating" && !fieldProps.value && !isFocused;
-	const todayIconButton = renderDatePickerTodayIcon(todayIcon, {
-		isDisabled: isTodayIconDisabled,
-		onPress: onToday,
-		size: todayIconButtonSize,
-		todayIconButtonComponent
-	});
-	const shouldRenderTodayIconWithFieldLabel = todayIconPlacement === "fieldLabel";
-	const pickerIcon = isDateTime ? uiConfig.dateInput.dateTimeIcon : uiConfig.dateInput.calendarIcon;
-	return /* @__PURE__ */ jsxs("div", {
-		ref: containerRef,
-		...groupProps,
-		...focusWithinProps,
-		...hoverProps,
-		className: clsx("group group/date-picker-content relative flex items-center justify-between gap-2", shouldShrinkInput ? "min-w-0" : "min-w-input-width-min-width", groupProps.className, inputBaseCva({
-			variant,
-			as,
-			...props
-		}), 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": normalizedFieldProps.value == null || void 0,
-		"data-focus-within": isFocused || void 0,
-		"data-focus-visible": isFocused && isFocusVisible || void 0,
-		"data-has-selection": normalizedFieldProps.value != null || void 0,
-		"data-is-dirty": isDirty || void 0,
-		"data-is-required": isRequired || void 0,
-		"data-is-filled": normalizedFieldProps.value != null || void 0,
-		children: [/* @__PURE__ */ jsxs("div", {
-			className: clsx("flex items-center gap-input-gap-input-text-to-elements pr-0!", shouldShrinkInput ? "min-w-0 flex-1 w-full" : "w-full", inputSizeCva({
-				size,
-				as
-			})),
-			children: [
-				as && ["filter", "floating"].includes(as) && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
-					as,
-					...headerProps
-				}),
-				shouldRenderTodayIconWithFieldLabel && todayIconButton,
-				/* @__PURE__ */ jsxs("div", {
-					className: datePickerInputContentRowCva({ size }),
-					children: [
-						disableManualEntry && /* @__PURE__ */ jsx(Button, {
-							onPress: onOpenDropdown,
-							className: "absolute inset-0 z-base",
-							isDisabled
-						}),
-						!shouldRenderTodayIconWithFieldLabel && todayIconButton,
-						disableManualEntry && placeholder && !fieldProps.value ? /* @__PURE__ */ jsx(Typography, {
-							size: "label-1",
-							className: "text-text-default-3",
-							children: placeholder
-						}) : /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx(DateField, {
-							ref: dateFieldRef,
-							...normalizedFieldProps,
-							isDisabled,
-							isInvalid,
-							onClearChange,
-							hidePlaceholder,
-							disableManualEntry,
-							dateGranularity,
-							isTimeOptional,
-							preserveNullValue: isValueControlled && !endFieldProps,
-							format,
-							timeZone: effectiveTimeZone,
-							segmentGroup: normalizedEndFieldProps ? "start" : void 0
-						}), normalizedEndFieldProps && /* @__PURE__ */ jsxs(Fragment, { children: [!((as === "floating" || as === "filter") && hidePlaceholder) && /* @__PURE__ */ jsx("span", {
-							className: clsx("pointer-events-none select-none", isDisabled && "text-interactive-text-secondary-disabled"),
-							children: "–"
-						}), /* @__PURE__ */ jsx(DateField, {
-							ref: endDateFieldRef,
-							...normalizedEndFieldProps,
-							isDisabled,
-							isInvalid,
-							onClearChange,
-							hidePlaceholder,
-							disableManualEntry,
-							isTimeOptional,
-							format,
-							timeZone: effectiveTimeZone,
-							segmentGroup: "end"
-						})] })] })
-					]
-				})
-			]
-		}), /* @__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: clearInput,
-				show: showClear
-			}), (!disableDropdown || disableManualEntry) && /* @__PURE__ */ jsx(InlineIconButton, {
-				label: "",
-				color: "secondary",
-				...buttonProps,
-				icon: pickerIcon,
-				isDisabled,
-				className: "border-0!",
-				"data-static-press-action": ""
-			})]
-		})]
-	});
-};
-//#endregion
-export { DatePickerInput };

package/dist/components/inputs/DateTime/shared/DateSegmentItem.d.ts

@@ -1,28 +0,0 @@
-import { DateFieldState, DateSegment } from '@react-stately/datepicker';
-import { HTMLAttributes, ReactNode, Ref } from 'react';
-interface DateSegmentProps {
-    state: DateFieldState;
-    segment: DateSegment;
-    segmentGroup?: string;
-    isDisabled?: boolean;
-    timePickerOnly?: boolean;
-    hidePlaceholder?: boolean;
-}
-export declare const getPlaceholder: (segment: DateSegment) => string | null;
-export declare const DateSegmentItem: ({ segment, state, segmentGroup, isDisabled, timePickerOnly, hidePlaceholder, }: DateSegmentProps) => import("react/jsx-runtime").JSX.Element;
-interface DateSegmentItemViewProps {
-    ref?: Ref<HTMLDivElement>;
-    segmentProps?: HTMLAttributes<HTMLDivElement>;
-    role?: HTMLAttributes<HTMLDivElement>["role"];
-    type?: DateSegment["type"] | Intl.DateTimeFormatPartTypes;
-    text: ReactNode;
-    placeholder?: ReactNode;
-    isPlaceholder?: boolean;
-    segmentGroup?: string;
-    isInputEmpty?: boolean;
-    isDisabled?: boolean;
-    timePickerOnly?: boolean;
-    hidePlaceholder?: boolean;
-}
-export declare const DateSegmentItemView: ({ ref, segmentProps, role, type, text, placeholder, isPlaceholder, segmentGroup, isInputEmpty, isDisabled, timePickerOnly, hidePlaceholder, }: DateSegmentItemViewProps) => import("react/jsx-runtime").JSX.Element;
-export {};