@povio/ui 2.3.2-rc.1 → 2.3.2-rc.3

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

@@ -3,7 +3,7 @@ import { FocusEvent, Ref } from 'react';
 import { FieldValues } from 'react-hook-form';
 import { DatePickerStateOptions } from 'react-stately';
 import { DatePickerInputHandle } from '../shared/DatePickerInput';
-import { DatePickerTodayIcon, DatePickerTodayIconButtonSize, DatePickerTodayIconPlacement } from '../shared/datePicker.types';
+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';
@@ -15,6 +15,7 @@ interface DatePickerBaseProps extends FormFieldProps, InputVariantProps, Omit<Da
     className?: string;
     todayIcon?: DatePickerTodayIcon;
     todayIconButtonSize?: DatePickerTodayIconButtonSize;
+    todayIconButtonComponent?: DatePickerTodayIconButtonComponent;
     todayIconPlacement?: DatePickerTodayIconPlacement;
     isDirty?: boolean;
     disableManualEntry?: boolean;

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

@@ -27,7 +27,7 @@ import { useCalendarState, useDatePickerState } from "react-stately";
 var DATE_PICKER_TIME_ZONE = "UTC";
 var DatePickerBase = (props) => {
 	const ui = UIConfig.useConfig();
-	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDirty, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, value, disableDropdown, className, placeholder, inputClassName, as: asProp, hideLabel: hideLabelProp, variant: variantProp, size: sizeProp, isClearable: isClearableProp, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, shouldUpdateDateOnMonthYearChange: shouldUpdateDateOnMonthYearChangeProp, granularity: granularityProp, autoFixYear: autoFixYearProp, fireBlurOnChange: fireBlurOnChangeProp, format, ...rest } = props;
+	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDirty, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, value, disableDropdown, className, placeholder, inputClassName, as: asProp, hideLabel: hideLabelProp, variant: variantProp, size: sizeProp, isClearable: isClearableProp, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconButtonComponent: todayIconButtonComponentProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, shouldUpdateDateOnMonthYearChange: shouldUpdateDateOnMonthYearChangeProp, granularity: granularityProp, autoFixYear: autoFixYearProp, fireBlurOnChange: fireBlurOnChangeProp, format, ...rest } = props;
 	const as = asProp ?? ui.input.as;
 	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
 	const variant = variantProp ?? ui.input.variant;
@@ -35,6 +35,7 @@ var DatePickerBase = (props) => {
 	const isClearable = isClearableProp ?? ui.input.isClearable;
 	const todayIcon = todayIconProp ?? ui.dateInput.todayIcon;
 	const todayIconButtonSize = todayIconButtonSizeProp ?? ui.dateInput.todayIconButtonSize;
+	const todayIconButtonComponent = todayIconButtonComponentProp ?? ui.dateInput.todayIconButtonComponent;
 	const todayIconPlacement = todayIconPlacementProp ?? ui.dateInput.todayIconPlacement;
 	const shouldForceLeadingZeros = shouldForceLeadingZerosProp ?? ui.dateInput.shouldForceLeadingZeros;
 	const disableManualEntry = disableManualEntryProp ?? ui.dateInput.disableManualEntry;
@@ -217,6 +218,7 @@ var DatePickerBase = (props) => {
 				headerProps,
 				todayIcon,
 				todayIconButtonSize,
+				todayIconButtonComponent,
 				todayIconPlacement,
 				onOpenDropdown: () => state.toggle(),
 				placeholder,
@@ -342,11 +344,13 @@ var DatePickerInner = (t0) => {
 		const isDisabled = isFormControlDisabled || !!props.isDisabled;
 		const todayIcon = props.todayIcon ?? ui.dateInput.todayIcon;
 		const todayIconButtonSize = props.todayIconButtonSize ?? ui.dateInput.todayIconButtonSize;
+		const todayIconButtonComponent = props.todayIconButtonComponent ?? ui.dateInput.todayIconButtonComponent;
 		const todayIconPlacement = props.todayIconPlacement ?? ui.dateInput.todayIconPlacement;
 		const staticTodayIcon = renderDatePickerTodayIcon(todayIcon, {
 			isDisabled,
 			renderStatic: true,
-			size: todayIconButtonSize
+			size: todayIconButtonSize,
+			todayIconButtonComponent
 		});
 		const disableManualEntry = props.disableManualEntry ?? ui.dateInput.disableManualEntry;
 		const showDropdown = !props.disableDropdown || disableManualEntry;
@@ -367,6 +371,7 @@ var DatePickerInner = (t0) => {
 			inputClassName: clsx("min-w-input-width-min-width", props.inputClassName),
 			contentClassName: "pr-0!",
 			contentWrapperClassName: datePickerInputContentRowCva({ size }),
+			contentGroup: "date-picker",
 			labelPlacement: "content-row",
 			dataAttributes: {
 				dataIsEmpty: dateValue == null,

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

@@ -4,7 +4,7 @@ import { DateValue } from 'react-aria';
 import { FieldValues } from 'react-hook-form';
 import { DateRangePickerStateOptions } from 'react-stately';
 import { DatePickerInputHandle } from '../shared/DatePickerInput';
-import { DatePickerTodayIcon, DatePickerTodayIconButtonSize, DatePickerTodayIconPlacement } from '../shared/datePicker.types';
+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';
@@ -16,6 +16,7 @@ interface DateRangePickerBaseProps extends FormFieldProps, InputVariantProps, Om
     className?: string;
     todayIcon?: DatePickerTodayIcon;
     todayIconButtonSize?: DatePickerTodayIconButtonSize;
+    todayIconButtonComponent?: DatePickerTodayIconButtonComponent;
     todayIconPlacement?: DatePickerTodayIconPlacement;
     isDirty?: boolean;
     disableManualEntry?: boolean;

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

@@ -32,7 +32,7 @@ var DATE_PICKER_TIME_ZONE = "UTC";
 var DateRangePickerBase = (props) => {
 	const ui = UIConfig.useConfig();
 	const { t } = useTranslation();
-	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, value, disableDropdown, className, hideSidebar, placeholder, inputClassName, hideLabel: hideLabelProp, variant: variantProp, as: asProp, size: sizeProp, isClearable: isClearableProp, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, autoFixYear: autoFixYearProp, fireBlurOnChange: fireBlurOnChangeProp, ...rest } = props;
+	const { ref, label, tooltipText, helperText, isRequired, rightContent, isDisabled, isDirty, headerClassName, errorClassName, isHeaderHidden, error, onChange, onBlur, value, disableDropdown, className, hideSidebar, placeholder, inputClassName, hideLabel: hideLabelProp, variant: variantProp, as: asProp, size: sizeProp, isClearable: isClearableProp, todayIcon: todayIconProp, todayIconButtonSize: todayIconButtonSizeProp, todayIconButtonComponent: todayIconButtonComponentProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, autoFixYear: autoFixYearProp, fireBlurOnChange: fireBlurOnChangeProp, ...rest } = props;
 	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
 	const variant = variantProp ?? ui.input.variant;
 	const as = asProp ?? ui.input.as;
@@ -40,6 +40,7 @@ var DateRangePickerBase = (props) => {
 	const isClearable = isClearableProp ?? ui.input.isClearable;
 	const todayIcon = todayIconProp ?? ui.dateInput.todayIcon;
 	const todayIconButtonSize = todayIconButtonSizeProp ?? ui.dateInput.todayIconButtonSize;
+	const todayIconButtonComponent = todayIconButtonComponentProp ?? ui.dateInput.todayIconButtonComponent;
 	const todayIconPlacement = todayIconPlacementProp ?? ui.dateInput.todayIconPlacement;
 	const shouldForceLeadingZeros = shouldForceLeadingZerosProp ?? ui.dateInput.shouldForceLeadingZeros;
 	const disableManualEntry = disableManualEntryProp ?? ui.dateInput.disableManualEntry;
@@ -528,6 +529,7 @@ var DateRangePickerBase = (props) => {
 				headerProps,
 				todayIcon,
 				todayIconButtonSize,
+				todayIconButtonComponent,
 				todayIconPlacement,
 				isDirty,
 				disableManualEntry,
@@ -690,11 +692,13 @@ var DateRangePickerInner = (t0) => {
 		const isDisabled = isFormControlDisabled || !!props.isDisabled;
 		const todayIcon = props.todayIcon ?? ui.dateInput.todayIcon;
 		const todayIconButtonSize = props.todayIconButtonSize ?? ui.dateInput.todayIconButtonSize;
+		const todayIconButtonComponent = props.todayIconButtonComponent ?? ui.dateInput.todayIconButtonComponent;
 		const todayIconPlacement = props.todayIconPlacement ?? ui.dateInput.todayIconPlacement;
 		const staticTodayIcon = renderDatePickerTodayIcon(todayIcon, {
 			isDisabled,
 			renderStatic: true,
-			size: todayIconButtonSize
+			size: todayIconButtonSize,
+			todayIconButtonComponent
 		});
 		const disableManualEntry = props.disableManualEntry ?? ui.dateInput.disableManualEntry;
 		const showDropdown = !props.disableDropdown || disableManualEntry;
@@ -715,6 +719,7 @@ var DateRangePickerInner = (t0) => {
 			inputClassName: clsx("min-w-input-width-min-width", props.inputClassName),
 			contentClassName: "pr-0!",
 			contentWrapperClassName: datePickerInputContentRowCva({ size }),
+			contentGroup: "date-picker",
 			labelPlacement: "content-row",
 			dataAttributes: {
 				dataIsEmpty: !hasProvidedRangeValue,

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

@@ -3,7 +3,7 @@ import { DateValue } from 'react-aria';
 import { FieldValues } from 'react-hook-form';
 import { DatePickerStateOptions } from 'react-stately';
 import { DatePickerInputHandle } from '../shared/DatePickerInput';
-import { DatePickerTodayIcon, DatePickerTodayIconButtonSize, DatePickerTodayIconPlacement } from '../shared/datePicker.types';
+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';
@@ -14,6 +14,7 @@ interface DateTimePickerBaseProps extends FormFieldProps, InputVariantProps, Omi
     isClearable?: boolean;
     todayIcon?: DatePickerTodayIcon;
     todayIconButtonSize?: DatePickerTodayIconButtonSize;
+    todayIconButtonComponent?: DatePickerTodayIconButtonComponent;
     todayIconPlacement?: DatePickerTodayIconPlacement;
     isDirty?: boolean;
     disableManualEntry?: boolean;

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

@@ -25,7 +25,7 @@ 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: _timeZone, autoFixYear: autoFixYearProp, fireBlurOnChange: fireBlurOnChangeProp, 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, todayIconButtonComponent: todayIconButtonComponentProp, todayIconPlacement: todayIconPlacementProp, shouldForceLeadingZeros: shouldForceLeadingZerosProp, disableManualEntry: disableManualEntryProp, shouldUpdateDateOnMonthYearChange: shouldUpdateDateOnMonthYearChangeProp, timeZone: _timeZone, autoFixYear: autoFixYearProp, fireBlurOnChange: fireBlurOnChangeProp, format, setDateValueOnDateSelection: setDateValueOnDateSelectionProp, ...rest } = props;
 	const hideLabel = hideLabelProp ?? ui.input.hideLabel;
 	const variant = variantProp ?? ui.input.variant;
 	const as = asProp ?? ui.input.as;
@@ -33,6 +33,7 @@ var DateTimePickerBase = (props) => {
 	const isClearable = isClearableProp ?? ui.input.isClearable;
 	const todayIcon = todayIconProp ?? ui.dateInput.todayIcon;
 	const todayIconButtonSize = todayIconButtonSizeProp ?? ui.dateInput.todayIconButtonSize;
+	const todayIconButtonComponent = todayIconButtonComponentProp ?? ui.dateInput.todayIconButtonComponent;
 	const todayIconPlacement = todayIconPlacementProp ?? ui.dateInput.todayIconPlacement;
 	const shouldForceLeadingZeros = shouldForceLeadingZerosProp ?? ui.dateInput.shouldForceLeadingZeros;
 	const disableManualEntry = disableManualEntryProp ?? ui.dateInput.disableManualEntry;
@@ -205,6 +206,7 @@ var DateTimePickerBase = (props) => {
 				headerProps,
 				todayIcon,
 				todayIconButtonSize,
+				todayIconButtonComponent,
 				todayIconPlacement,
 				isRequired,
 				disableManualEntry,
@@ -267,11 +269,13 @@ var DateTimePickerInner = (t0) => {
 		const isDisabled = isFormControlDisabled || !!props.isDisabled;
 		const todayIcon = props.todayIcon ?? ui.dateInput.todayIcon;
 		const todayIconButtonSize = props.todayIconButtonSize ?? ui.dateInput.todayIconButtonSize;
+		const todayIconButtonComponent = props.todayIconButtonComponent ?? ui.dateInput.todayIconButtonComponent;
 		const todayIconPlacement = props.todayIconPlacement ?? ui.dateInput.todayIconPlacement;
 		const staticTodayIcon = renderDatePickerTodayIcon(todayIcon, {
 			isDisabled,
 			renderStatic: true,
-			size: todayIconButtonSize
+			size: todayIconButtonSize,
+			todayIconButtonComponent
 		});
 		const disableManualEntry = props.disableManualEntry ?? ui.dateInput.disableManualEntry;
 		const showDropdown = !props.disableDropdown || disableManualEntry;
@@ -291,6 +295,7 @@ var DateTimePickerInner = (t0) => {
 			inputClassName: clsx("min-w-input-width-min-width", props.inputClassName),
 			contentClassName: "pr-0!",
 			contentWrapperClassName: datePickerInputContentRowCva({ size }),
+			contentGroup: "date-picker",
 			labelPlacement: "content-row",
 			dataAttributes: {
 				dataIsEmpty: dateTimeValue == null,

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

@@ -498,6 +498,7 @@ var TimePickerInner = (t0) => {
 			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_0 == null,

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

@@ -1,6 +1,6 @@
 import { Ref } from 'react';
 import { DatePickerAria } from 'react-aria';
-import { DatePickerTodayIcon, DatePickerTodayIconButtonSize, DatePickerTodayIconPlacement } from './datePicker.types';
+import { DatePickerTodayIcon, DatePickerTodayIconButtonComponent, DatePickerTodayIconButtonSize, DatePickerTodayIconPlacement } from './datePicker.types';
 import { FormFieldHeaderProps } from '../../FormField/FormFieldHeader';
 import { InputVariantProps } from '../../shared/input.cva';
 export interface DatePickerInputHandle {
@@ -25,6 +25,7 @@ interface DatePickerInputProps extends InputVariantProps {
     headerProps?: FormFieldHeaderProps;
     todayIcon?: DatePickerTodayIcon;
     todayIconButtonSize?: DatePickerTodayIconButtonSize;
+    todayIconButtonComponent?: DatePickerTodayIconButtonComponent;
     todayIconPlacement?: DatePickerTodayIconPlacement;
     isDirty?: boolean;
     isRequired?: boolean;
@@ -40,5 +41,5 @@ interface DatePickerInputProps extends InputVariantProps {
     fireBlurOnChange?: boolean;
     onClear?: () => void;
 }
-export declare const DatePickerInput: ({ ref, as, groupProps, fieldProps, endFieldProps, fieldValue, endFieldValue, isValueControlled, hasValue, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, isClearable, headerProps, todayIcon, todayIconButtonSize, todayIconPlacement, isDirty, isRequired, disableManualEntry, autoFixYear, placeholder, className, onOpenDropdown, dateGranularity, timeZone, isTimeOptional, format, fireBlurOnChange, onClear: onClearProp, ...props }: DatePickerInputProps) => import("react/jsx-runtime").JSX.Element;
+export declare const DatePickerInput: ({ ref, as, groupProps, fieldProps, endFieldProps, fieldValue, endFieldValue, isValueControlled, hasValue, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, isClearable, headerProps, todayIcon, todayIconButtonSize, todayIconButtonComponent, todayIconPlacement, isDirty, isRequired, disableManualEntry, autoFixYear, placeholder, className, onOpenDropdown, dateGranularity, timeZone, isTimeOptional, format, fireBlurOnChange, onClear: onClearProp, ...props }: DatePickerInputProps) => import("react/jsx-runtime").JSX.Element;
 export {};

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

@@ -18,8 +18,8 @@ import { useFocusVisible, useFocusWithin, useHover } from "react-aria";
 import { today } from "@internationalized/date";
 //#region src/components/inputs/DateTime/shared/DatePickerInput.tsx
 var DatePickerInput = (t0) => {
-	const $ = c(107);
-	const { ref, as, groupProps, fieldProps, endFieldProps, fieldValue, endFieldValue, isValueControlled, hasValue, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, isClearable, headerProps, todayIcon, todayIconButtonSize: t1, todayIconPlacement: t2, isDirty, isRequired, disableManualEntry, autoFixYear: t3, placeholder, className, onOpenDropdown, dateGranularity: t4, timeZone, isTimeOptional: t5, format, fireBlurOnChange, onClear: onClearProp, ...props } = t0;
+	const $ = c(108);
+	const { ref, as, groupProps, fieldProps, endFieldProps, fieldValue, endFieldValue, isValueControlled, hasValue, buttonProps, isDisabled, isInvalid, disableDropdown, variant, size, isDateTime, isClearable, headerProps, todayIcon, todayIconButtonSize: t1, todayIconButtonComponent, todayIconPlacement: t2, isDirty, isRequired, disableManualEntry, autoFixYear: t3, placeholder, className, onOpenDropdown, dateGranularity: t4, timeZone, isTimeOptional: t5, format, fireBlurOnChange, onClear: onClearProp, ...props } = t0;
 	const todayIconButtonSize = t1 === void 0 ? "none" : t1;
 	const todayIconPlacement = t2 === void 0 ? "content" : t2;
 	const autoFixYear = t3 === void 0 ? false : t3;
@@ -157,18 +157,20 @@ var DatePickerInput = (t0) => {
 	const onToday = t15;
 	const hidePlaceholder = as === "floating" && !fieldProps.value && !isFocused;
 	let t16;
-	if ($[27] !== isTodayIconDisabled || $[28] !== onToday || $[29] !== todayIcon || $[30] !== todayIconButtonSize) {
+	if ($[27] !== isTodayIconDisabled || $[28] !== onToday || $[29] !== todayIcon || $[30] !== todayIconButtonComponent || $[31] !== todayIconButtonSize) {
 		t16 = renderDatePickerTodayIcon(todayIcon, {
 			isDisabled: isTodayIconDisabled,
 			onPress: onToday,
-			size: todayIconButtonSize
+			size: todayIconButtonSize,
+			todayIconButtonComponent
 		});
 		$[27] = isTodayIconDisabled;
 		$[28] = onToday;
 		$[29] = todayIcon;
-		$[30] = todayIconButtonSize;
-		$[31] = t16;
-	} else t16 = $[31];
+		$[30] = todayIconButtonComponent;
+		$[31] = todayIconButtonSize;
+		$[32] = t16;
+	} else t16 = $[32];
 	const todayIconButton = t16;
 	const shouldRenderTodayIconWithFieldLabel = todayIconPlacement === "fieldLabel";
 	const pickerIcon = isDateTime ? uiConfig.dateInput.dateTimeIcon : uiConfig.dateInput.calendarIcon;
@@ -189,49 +191,49 @@ var DatePickerInput = (t0) => {
 	const t27 = isRequired || void 0;
 	const t28 = normalizedFieldProps.value != null || void 0;
 	let t29;
-	if ($[32] !== as || $[33] !== inputSizeCva || $[34] !== size) {
+	if ($[33] !== as || $[34] !== inputSizeCva || $[35] !== size) {
 		t29 = clsx("flex w-full items-center gap-input-gap-input-text-to-elements pr-0!", inputSizeCva({
 			size,
 			as
 		}));
-		$[32] = as;
-		$[33] = inputSizeCva;
-		$[34] = size;
-		$[35] = t29;
-	} else t29 = $[35];
+		$[33] = as;
+		$[34] = inputSizeCva;
+		$[35] = size;
+		$[36] = t29;
+	} else t29 = $[36];
 	let t30;
-	if ($[36] !== as || $[37] !== headerProps) {
+	if ($[37] !== as || $[38] !== headerProps) {
 		t30 = as && ["filter", "floating"].includes(as) && headerProps && /* @__PURE__ */ jsx(FormFieldLabel, {
 			as,
 			...headerProps
 		});
-		$[36] = as;
-		$[37] = headerProps;
-		$[38] = t30;
-	} else t30 = $[38];
+		$[37] = as;
+		$[38] = headerProps;
+		$[39] = t30;
+	} else t30 = $[39];
 	const t31 = shouldRenderTodayIconWithFieldLabel && todayIconButton;
 	let t32;
-	if ($[39] !== datePickerInputContentRowCva || $[40] !== size) {
+	if ($[40] !== datePickerInputContentRowCva || $[41] !== size) {
 		t32 = datePickerInputContentRowCva({ size });
-		$[39] = datePickerInputContentRowCva;
-		$[40] = size;
-		$[41] = t32;
-	} else t32 = $[41];
+		$[40] = datePickerInputContentRowCva;
+		$[41] = size;
+		$[42] = t32;
+	} else t32 = $[42];
 	let t33;
-	if ($[42] !== disableManualEntry || $[43] !== isDisabled || $[44] !== onOpenDropdown) {
+	if ($[43] !== disableManualEntry || $[44] !== isDisabled || $[45] !== onOpenDropdown) {
 		t33 = disableManualEntry && /* @__PURE__ */ jsx(Button, {
 			onPress: onOpenDropdown,
 			className: "absolute inset-0 z-0",
 			isDisabled
 		});
-		$[42] = disableManualEntry;
-		$[43] = isDisabled;
-		$[44] = onOpenDropdown;
-		$[45] = t33;
-	} else t33 = $[45];
+		$[43] = disableManualEntry;
+		$[44] = isDisabled;
+		$[45] = onOpenDropdown;
+		$[46] = t33;
+	} else t33 = $[46];
 	const t34 = !shouldRenderTodayIconWithFieldLabel && todayIconButton;
 	let t35;
-	if ($[46] !== as || $[47] !== dateGranularity || $[48] !== disableManualEntry || $[49] !== effectiveTimeZone || $[50] !== fieldProps || $[51] !== format || $[52] !== hidePlaceholder || $[53] !== isDisabled || $[54] !== isInvalid || $[55] !== isTimeOptional || $[56] !== normalizedEndFieldProps || $[57] !== normalizedFieldProps || $[58] !== onClearChange || $[59] !== placeholder) {
+	if ($[47] !== as || $[48] !== dateGranularity || $[49] !== disableManualEntry || $[50] !== effectiveTimeZone || $[51] !== fieldProps || $[52] !== format || $[53] !== hidePlaceholder || $[54] !== isDisabled || $[55] !== isInvalid || $[56] !== isTimeOptional || $[57] !== normalizedEndFieldProps || $[58] !== normalizedFieldProps || $[59] !== onClearChange || $[60] !== placeholder) {
 		t35 = disableManualEntry && placeholder && !fieldProps.value ? /* @__PURE__ */ jsx(Typography, {
 			size: "label-1",
 			className: "text-text-default-3",
@@ -263,24 +265,24 @@ var DatePickerInput = (t0) => {
 			format,
 			timeZone: effectiveTimeZone
 		})] })] });
-		$[46] = as;
-		$[47] = dateGranularity;
-		$[48] = disableManualEntry;
-		$[49] = effectiveTimeZone;
-		$[50] = fieldProps;
-		$[51] = format;
-		$[52] = hidePlaceholder;
-		$[53] = isDisabled;
-		$[54] = isInvalid;
-		$[55] = isTimeOptional;
-		$[56] = normalizedEndFieldProps;
-		$[57] = normalizedFieldProps;
-		$[58] = onClearChange;
-		$[59] = placeholder;
-		$[60] = t35;
-	} else t35 = $[60];
+		$[47] = as;
+		$[48] = dateGranularity;
+		$[49] = disableManualEntry;
+		$[50] = effectiveTimeZone;
+		$[51] = fieldProps;
+		$[52] = format;
+		$[53] = hidePlaceholder;
+		$[54] = isDisabled;
+		$[55] = isInvalid;
+		$[56] = isTimeOptional;
+		$[57] = normalizedEndFieldProps;
+		$[58] = normalizedFieldProps;
+		$[59] = onClearChange;
+		$[60] = placeholder;
+		$[61] = t35;
+	} else t35 = $[61];
 	let t36;
-	if ($[61] !== t32 || $[62] !== t33 || $[63] !== t34 || $[64] !== t35) {
+	if ($[62] !== t32 || $[63] !== t33 || $[64] !== t34 || $[65] !== t35) {
 		t36 = /* @__PURE__ */ jsxs("div", {
 			className: t32,
 			children: [
@@ -289,14 +291,14 @@ var DatePickerInput = (t0) => {
 				t35
 			]
 		});
-		$[61] = t32;
-		$[62] = t33;
-		$[63] = t34;
-		$[64] = t35;
-		$[65] = t36;
-	} else t36 = $[65];
+		$[62] = t32;
+		$[63] = t33;
+		$[64] = t34;
+		$[65] = t35;
+		$[66] = t36;
+	} else t36 = $[66];
 	let t37;
-	if ($[66] !== t29 || $[67] !== t30 || $[68] !== t31 || $[69] !== t36) {
+	if ($[67] !== t29 || $[68] !== t30 || $[69] !== t31 || $[70] !== t36) {
 		t37 = /* @__PURE__ */ jsxs("div", {
 			className: t29,
 			children: [
@@ -305,37 +307,36 @@ var DatePickerInput = (t0) => {
 				t36
 			]
 		});
-		$[66] = t29;
-		$[67] = t30;
-		$[68] = t31;
-		$[69] = t36;
-		$[70] = t37;
-	} else t37 = $[70];
+		$[67] = t29;
+		$[68] = t30;
+		$[69] = t31;
+		$[70] = t36;
+		$[71] = t37;
+	} else t37 = $[71];
 	let t38;
-	if ($[71] !== as || $[72] !== inputSizeCva || $[73] !== size) {
+	if ($[72] !== as || $[73] !== inputSizeCva || $[74] !== size) {
 		t38 = clsx(inputSizeCva({
 			size,
 			as
 		}), "flex items-center gap-input-gap-trailing-elements py-0! pl-0!");
-		$[71] = as;
-		$[72] = inputSizeCva;
-		$[73] = size;
-		$[74] = t38;
-	} else t38 = $[74];
+		$[72] = as;
+		$[73] = inputSizeCva;
+		$[74] = size;
+		$[75] = t38;
+	} else t38 = $[75];
 	let t39;
-	if ($[75] !== clearInput || $[76] !== isClearable || $[77] !== showClear) {
+	if ($[76] !== clearInput || $[77] !== isClearable || $[78] !== showClear) {
 		t39 = isClearable && /* @__PURE__ */ jsx(InputClear, {
 			onClear: clearInput,
-			show: showClear,
-			style: showClear ? { visibility: "visible" } : void 0
+			show: showClear
 		});
-		$[75] = clearInput;
-		$[76] = isClearable;
-		$[77] = showClear;
-		$[78] = t39;
-	} else t39 = $[78];
+		$[76] = clearInput;
+		$[77] = isClearable;
+		$[78] = showClear;
+		$[79] = t39;
+	} else t39 = $[79];
 	let t40;
-	if ($[79] !== buttonProps || $[80] !== disableDropdown || $[81] !== disableManualEntry || $[82] !== isDisabled || $[83] !== pickerIcon) {
+	if ($[80] !== buttonProps || $[81] !== disableDropdown || $[82] !== disableManualEntry || $[83] !== isDisabled || $[84] !== pickerIcon) {
 		t40 = (!disableDropdown || disableManualEntry) && /* @__PURE__ */ jsx(InlineIconButton, {
 			label: "",
 			color: "secondary",
@@ -344,26 +345,26 @@ var DatePickerInput = (t0) => {
 			isDisabled,
 			className: "border-0!"
 		});
-		$[79] = buttonProps;
-		$[80] = disableDropdown;
-		$[81] = disableManualEntry;
-		$[82] = isDisabled;
-		$[83] = pickerIcon;
-		$[84] = t40;
-	} else t40 = $[84];
+		$[80] = buttonProps;
+		$[81] = disableDropdown;
+		$[82] = disableManualEntry;
+		$[83] = isDisabled;
+		$[84] = pickerIcon;
+		$[85] = t40;
+	} else t40 = $[85];
 	let t41;
-	if ($[85] !== t38 || $[86] !== t39 || $[87] !== t40) {
+	if ($[86] !== t38 || $[87] !== t39 || $[88] !== t40) {
 		t41 = /* @__PURE__ */ jsxs("div", {
 			className: t38,
 			children: [t39, t40]
 		});
-		$[85] = t38;
-		$[86] = t39;
-		$[87] = t40;
-		$[88] = t41;
-	} else t41 = $[88];
+		$[86] = t38;
+		$[87] = t39;
+		$[88] = t40;
+		$[89] = t41;
+	} else t41 = $[89];
 	let t42;
-	if ($[89] !== focusWithinProps || $[90] !== groupProps || $[91] !== hoverProps || $[92] !== t17 || $[93] !== t18 || $[94] !== t19 || $[95] !== t20 || $[96] !== t21 || $[97] !== t22 || $[98] !== t23 || $[99] !== t24 || $[100] !== t25 || $[101] !== t26 || $[102] !== t27 || $[103] !== t28 || $[104] !== t37 || $[105] !== t41) {
+	if ($[90] !== focusWithinProps || $[91] !== groupProps || $[92] !== hoverProps || $[93] !== t17 || $[94] !== t18 || $[95] !== t19 || $[96] !== t20 || $[97] !== t21 || $[98] !== t22 || $[99] !== t23 || $[100] !== t24 || $[101] !== t25 || $[102] !== t26 || $[103] !== t27 || $[104] !== t28 || $[105] !== t37 || $[106] !== t41) {
 		t42 = /* @__PURE__ */ jsxs("div", {
 			ref: containerRef,
 			...groupProps,
@@ -385,25 +386,25 @@ var DatePickerInput = (t0) => {
 			"data-is-filled": t28,
 			children: [t37, t41]
 		});
-		$[89] = focusWithinProps;
-		$[90] = groupProps;
-		$[91] = hoverProps;
-		$[92] = t17;
-		$[93] = t18;
-		$[94] = t19;
-		$[95] = t20;
-		$[96] = t21;
-		$[97] = t22;
-		$[98] = t23;
-		$[99] = t24;
-		$[100] = t25;
-		$[101] = t26;
-		$[102] = t27;
-		$[103] = t28;
-		$[104] = t37;
-		$[105] = t41;
-		$[106] = t42;
-	} else t42 = $[106];
+		$[90] = focusWithinProps;
+		$[91] = groupProps;
+		$[92] = hoverProps;
+		$[93] = t17;
+		$[94] = t18;
+		$[95] = t19;
+		$[96] = t20;
+		$[97] = t21;
+		$[98] = t22;
+		$[99] = t23;
+		$[100] = t24;
+		$[101] = t25;
+		$[102] = t26;
+		$[103] = t27;
+		$[104] = t28;
+		$[105] = t37;
+		$[106] = t41;
+		$[107] = t42;
+	} else t42 = $[107];
 	return t42;
 };
 //#endregion

package/dist/components/inputs/DateTime/shared/datePicker.types.d.ts

@@ -1,4 +1,5 @@
 import { IconButtonProps } from '../../../buttons/IconButton/IconButton';
 export type DatePickerTodayIcon = boolean | IconButtonProps["icon"];
 export type DatePickerTodayIconButtonSize = IconButtonProps["size"];
+export type DatePickerTodayIconButtonComponent = "iconButton" | "inlineIconButton";
 export type DatePickerTodayIconPlacement = "content" | "fieldLabel";

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

@@ -1,6 +1,6 @@
 import { FC, ReactElement, SVGProps } from 'react';
 import { PressEvent } from 'react-aria-components';
-import { DatePickerTodayIcon, DatePickerTodayIconButtonSize } from './datePicker.types';
+import { DatePickerTodayIcon, DatePickerTodayIconButtonComponent, DatePickerTodayIconButtonSize } from './datePicker.types';
 type TodayIconComponent = FC<SVGProps<SVGSVGElement>> | ReactElement;
 type DatePickerTodayIconOptions = {
     className?: string;
@@ -8,6 +8,7 @@ type DatePickerTodayIconOptions = {
     onPress?: (event: PressEvent) => void;
     renderStatic?: boolean;
     size?: DatePickerTodayIconButtonSize;
+    todayIconButtonComponent?: DatePickerTodayIconButtonComponent;
 };
 export declare const getDatePickerTodayIcon: (todayIcon: DatePickerTodayIcon | undefined) => TodayIconComponent | null;
 export declare const renderDatePickerTodayIcon: (todayIcon: DatePickerTodayIcon | undefined, options?: DatePickerTodayIconOptions) => import("react/jsx-runtime").JSX.Element | undefined;