@povio/ui 3.4.0-rc.15 → 3.4.0-rc.17

package/dist/components/form-field.js

@@ -0,0 +1,47 @@
+import { FormFieldError } from "./inputs/FormField/FormFieldError.js";
+import { FormFieldHeader } from "./inputs/FormField/FormFieldHeader.js";
+import { FormFieldHelper } from "./inputs/FormField/FormFieldHelper.js";
+import { jsx, jsxs } from "react/jsx-runtime";
+//#region src/components/inputs/FormField/FormField.tsx
+const FormField = ({ ref, as, label, tooltipText, helperText, helperTextId, isRequired, rightContent, isDisabled, error, errorMessageId, hideLabel, headerClassName, errorClassName, children, className, labelProps, isHeaderHidden, tabIndex, onMouseEnter, onFocusCapture }) => {
+	const headerProps = {
+		label,
+		tooltipText,
+		helperText,
+		isRequired,
+		rightContent,
+		isHeaderHidden: hideLabel || isHeaderHidden,
+		isDisabled,
+		className: headerClassName,
+		labelProps
+	};
+	const helperProps = {
+		id: helperTextId,
+		helperText,
+		isDisabled,
+		isHidden: !["filter", "floating"].includes(as ?? ""),
+		hasError: !!error
+	};
+	const errorProps = {
+		id: errorMessageId,
+		error,
+		isDisabled,
+		isHidden: ["filter", "inline"].includes(as ?? ""),
+		className: errorClassName
+	};
+	return /* @__PURE__ */ jsxs("div", {
+		ref,
+		className,
+		tabIndex,
+		onMouseEnter,
+		onFocusCapture,
+		children: [
+			!["filter", "floating"].includes(as ?? "") && /* @__PURE__ */ jsx(FormFieldHeader, { ...headerProps }),
+			children,
+			/* @__PURE__ */ jsx(FormFieldHelper, { ...helperProps }),
+			/* @__PURE__ */ jsx(FormFieldError, { ...errorProps })
+		]
+	});
+};
+//#endregion
+export { FormField };

package/dist/components/icon-button.d.ts

@@ -0,0 +1,14 @@
+import { LinkNavigationProps } from "./link.js";
+import { ButtonVariantProps } from "./buttons/Button/button.cva.js";
+import { FC, ReactElement, SVGProps } from "react";
+import { ButtonProps } from "react-aria-components";
+//#region src/components/buttons/IconButton/IconButton.d.ts
+interface IconButtonProps extends ButtonVariantProps, Omit<ButtonProps, "children"> {
+  label: string;
+  icon: FC<SVGProps<SVGSVGElement>> | ReactElement;
+  link?: LinkNavigationProps;
+  disableTooltip?: boolean;
+}
+declare const IconButton: ({ label, disableTooltip, ...props }: IconButtonProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { IconButton, IconButtonProps };

package/dist/components/{buttons/IconButton/IconButton.js → icon-button.js}

@@ -1,9 +1,9 @@
-import { Tooltip } from "../../overlays/Tooltip/Tooltip.js";
-import { Button } from "../Button/Button.js";
+import { Tooltip } from "./tooltip.js";
+import { Button } from "./buttons/Button/Button.js";
 import { c } from "react/compiler-runtime";
 import { jsx } from "react/jsx-runtime";
 //#region src/components/buttons/IconButton/IconButton.tsx
-var IconButton = (t0) => {
+const IconButton = (t0) => {
 	const $ = c(11);
 	let disableTooltip;
 	let label;

package/dist/components/inline-icon-button.d.ts

@@ -0,0 +1,16 @@
+import { LinkNavigationProps } from "./link.js";
+import { ButtonVariantProps } from "./buttons/Button/button.cva.js";
+import { FC, ReactElement, RefObject, SVGProps } from "react";
+import { ButtonProps } from "react-aria-components";
+//#region src/components/buttons/InlineIconButton/InlineIconButton.d.ts
+interface InlineIconButtonProps extends Omit<ButtonProps, "children">, ButtonVariantProps {
+  label: string;
+  icon: FC<SVGProps<SVGSVGElement>> | ReactElement;
+  link?: LinkNavigationProps;
+  ref?: RefObject<HTMLButtonElement | HTMLAnchorElement | null>;
+  disableTooltip?: boolean;
+  staticRender?: boolean;
+}
+declare const InlineIconButton: ({ label, size, ...props }: InlineIconButtonProps) => import("react/jsx-runtime").JSX.Element;
+//#endregion
+export { InlineIconButton, InlineIconButtonProps };

package/dist/components/inline-icon-button.js

@@ -0,0 +1,40 @@
+import { Button } from "./buttons/Button/Button.js";
+import { c } from "react/compiler-runtime";
+import { jsx } from "react/jsx-runtime";
+//#region src/components/buttons/InlineIconButton/InlineIconButton.tsx
+const InlineIconButton = (t0) => {
+	const $ = c(8);
+	let label;
+	let props;
+	let t1;
+	if ($[0] !== t0) {
+		({label, size: t1, ...props} = t0);
+		$[0] = t0;
+		$[1] = label;
+		$[2] = props;
+		$[3] = t1;
+	} else {
+		label = $[1];
+		props = $[2];
+		t1 = $[3];
+	}
+	const size = t1 === void 0 ? "none" : t1;
+	let t2;
+	if ($[4] !== label || $[5] !== props || $[6] !== size) {
+		t2 = /* @__PURE__ */ jsx(Button, {
+			...props,
+			iconOnly: true,
+			variant: "text",
+			size,
+			width: "hug",
+			children: label
+		});
+		$[4] = label;
+		$[5] = props;
+		$[6] = size;
+		$[7] = t2;
+	} else t2 = $[7];
+	return t2;
+};
+//#endregion
+export { InlineIconButton };

package/dist/components/input-upload.d.ts

@@ -0,0 +1,7 @@
+import { FieldValues } from "./inputs/shared/form.binding.js";
+import { InputUploadBaseProps, InputUploadProps } from "./inputs/File/inputUpload.types.js";
+//#region src/components/inputs/File/InputUpload.d.ts
+declare const InputUploadComponent: <TFieldValues extends FieldValues = FieldValues>(props: InputUploadProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
+declare const InputUpload: typeof InputUploadComponent;
+//#endregion
+export { InputUpload, type InputUploadBaseProps, type InputUploadProps };

package/dist/components/input-upload.js

@@ -0,0 +1,118 @@
+import { UIConfig } from "../config/uiConfig.context.js";
+import { FieldController } from "./inputs/shared/form.binding.js";
+import { FormField } from "./form-field.js";
+import { FileUtils } from "../utils/file.utils.js";
+import { InputUploadContent } from "./inputs/File/shared/InputUploadContent.js";
+import { InputUploadFilled } from "./inputs/File/shared/InputUploadFilled.js";
+import { clsx } from "clsx";
+import { memo, useState } from "react";
+import { jsx } from "react/jsx-runtime";
+import { mergeRefs, useLabels } from "@react-aria/utils";
+//#region src/components/inputs/File/InputUpload.tsx
+const InputUploadBase = ({ ref: _ref, label, tooltipText, variant, helperText, isRequired, isDisabled, headerClassName, errorClassName, isHeaderHidden, error, className, onChange, onInvalidFileType, value, defaultValue, allowsMultiple = false, hideLabel, acceptedFileTypes, size, ...rest }) => {
+	const ui = UIConfig.useConfig();
+	const [internalFiles, setInternalFiles] = useState(() => {
+		if (value !== void 0) {
+			if (allowsMultiple) return value || [];
+			return value ? [value] : [];
+		}
+		if (defaultValue !== void 0) {
+			if (allowsMultiple) return defaultValue || [];
+			return defaultValue ? [defaultValue] : [];
+		}
+		return [];
+	});
+	const files = value !== void 0 ? (() => {
+		if (allowsMultiple) return value || [];
+		return value ? [value] : [];
+	})() : internalFiles;
+	const formFieldProps = {
+		error,
+		label,
+		tooltipText,
+		helperText,
+		isRequired,
+		isHeaderHidden,
+		hideLabel: hideLabel ?? ui.input.hideLabel,
+		isDisabled,
+		headerClassName,
+		errorClassName
+	};
+	const labelProps = useLabels({ "aria-label": label });
+	const updateFiles = (newFiles) => {
+		if (value === void 0) setInternalFiles(newFiles);
+		if (allowsMultiple) onChange?.(newFiles);
+		else onChange?.(newFiles[0] || null);
+	};
+	const handleFileSelect = (inputFiles) => {
+		const acceptedFiles = inputFiles.filter((file) => FileUtils.isFileTypeAccepted(file, acceptedFileTypes));
+		const invalidFiles = inputFiles.filter((file) => !FileUtils.isFileTypeAccepted(file, acceptedFileTypes));
+		if (allowsMultiple) {
+			updateFiles([...files, ...acceptedFiles]);
+			if (invalidFiles.length > 0) onInvalidFileType?.(invalidFiles.map((file) => file.name));
+		} else {
+			if (acceptedFiles.length > 0) updateFiles([acceptedFiles[0]]);
+			if (invalidFiles.length > 0) onInvalidFileType?.(invalidFiles[0].name);
+		}
+	};
+	const handleSelect = (inputFiles) => {
+		if (!inputFiles) return;
+		const filesArray = Array.from(inputFiles);
+		handleFileSelect(filesArray);
+	};
+	const handleDrop = async (e) => {
+		if (!e.items) return;
+		const promises = [];
+		e.items.forEach((item) => {
+			if (item.kind === "file") promises.push(item.getFile());
+		});
+		const inputFiles = await Promise.all(promises);
+		handleFileSelect(inputFiles);
+	};
+	const handleRemove = () => {
+		updateFiles([]);
+	};
+	return /* @__PURE__ */ jsx(FormField, {
+		...formFieldProps,
+		labelProps,
+		className: clsx("group w-full", className),
+		children: files.length > 0 ? /* @__PURE__ */ jsx(InputUploadFilled, {
+			files,
+			onRemove: handleRemove,
+			isDisabled,
+			size
+		}) : /* @__PURE__ */ jsx(InputUploadContent, {
+			...rest,
+			label,
+			error,
+			allowsMultiple,
+			acceptedFileTypes,
+			variant,
+			isDisabled,
+			onSelect: handleSelect,
+			onDrop: handleDrop,
+			size
+		})
+	});
+};
+const InputUploadComponent = (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 } }) => /* @__PURE__ */ jsx(InputUploadBase, {
+				...innerProps,
+				ref: mergeRefs(ref, field.ref),
+				value: field.value,
+				onChange: field.onChange,
+				isDisabled: field.disabled || props.isDisabled,
+				error: props.error ?? error?.message
+			})
+		});
+	}
+	return /* @__PURE__ */ jsx(InputUploadBase, { ...props });
+};
+const InputUpload = memo(InputUploadComponent);
+//#endregion
+export { InputUpload };

package/dist/components/inputs/Checkbox/CheckboxCheckmark.js

@@ -3,7 +3,7 @@ import { checkboxDefinition, checkboxIconDefinition } from "./checkbox.cva.js";
 import { Check, Minus } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/components/inputs/Checkbox/CheckboxCheckmark.tsx
-var CheckboxCheckmark = ({ variant, className, selectedIcon: SelectedIcon = Check, indeterminateIcon: IndeterminateIcon = Minus, ...props }) => {
+const CheckboxCheckmark = ({ variant, className, selectedIcon: SelectedIcon = Check, indeterminateIcon: IndeterminateIcon = Minus, ...props }) => {
 	const checkboxCva = UIOverrides.useCva("checkbox.cva", checkboxDefinition);
 	const checkboxIconCva = UIOverrides.useCva("checkbox.iconCva", checkboxIconDefinition);
 	return /* @__PURE__ */ jsxs("div", {

package/dist/components/inputs/Checkbox/checkbox.cva.d.ts

@@ -1,94 +1,78 @@
-import { TypographyVariantProps } from '../../text/Typography/typography.cva';
-import { UIOverrides } from '../../../config/uiOverrides.context';
-export declare const checkboxDefinition: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly variant: {
-            readonly default: ["m-1 border-interactive-outlined-secondary-on-idle", "text-interactive-contained-primary-on-idle", "group-hover:text-interactive-contained-primary-on-hover", "group-pressed:text-interactive-contained-primary-on-pressed", "group-disabled:text-interactive-contained-primary-on-disabled", "group-disabled:border-interactive-outlined-secondary-on-disabled", "group-hover:border-interactive-outlined-secondary-on-hover", "group-pressed:border-interactive-outlined-secondary-on-pressed", "group-selected:border-interactive-contained-primary-idle", "group-selected:bg-interactive-contained-primary-idle", "group-selected:group-hover:bg-interactive-contained-primary-hover", "group-selected:group-hover:border-interactive-contained-primary-hover", "group-selected:group-pressed:bg-interactive-contained-primary-pressed", "group-selected:group-pressed:border-interactive-contained-primary-pressed", "group-selected:group-disabled:bg-interactive-contained-primary-disabled", "group-selected:group-disabled:border-interactive-contained-primary-disabled", "group-indeterminate:border-interactive-contained-primary-idle", "group-indeterminate:bg-interactive-contained-primary-idle", "group-indeterminate:group-hover:bg-interactive-contained-primary-hover", "group-indeterminate:group-hover:border-interactive-contained-primary-hover", "group-indeterminate:group-pressed:bg-interactive-contained-primary-pressed", "group-indeterminate:group-pressed:border-interactive-contained-primary-pressed", "group-invalid:border-interactive-outlined-error-on-idle", "group-focus-visible:outline-interactive-contained-primary-focus"];
-        };
-    }>;
+import { StyleMergeUtils } from "../../../utils/style-merge.util.js";
+import { UIOverrides } from "../../../config/uiOverrides.context.js";
+import "../../text/Typography/typography.cva.js";
+//#region src/components/inputs/Checkbox/checkbox.cva.d.ts
+declare const checkboxDefinition: {
+  base: string[];
+  config: StyleMergeUtils.Config<{
+    readonly variant: {
+      default: ["m-1 border-interactive-outlined-secondary-on-idle", "text-interactive-contained-primary-on-idle", "group-hover:text-interactive-contained-primary-on-hover", "group-pressed:text-interactive-contained-primary-on-pressed", "group-disabled:text-interactive-contained-primary-on-disabled", "group-disabled:border-interactive-outlined-secondary-on-disabled", "group-hover:border-interactive-outlined-secondary-on-hover", "group-pressed:border-interactive-outlined-secondary-on-pressed", "group-selected:border-interactive-contained-primary-idle", "group-selected:bg-interactive-contained-primary-idle", "group-selected:group-hover:bg-interactive-contained-primary-hover", "group-selected:group-hover:border-interactive-contained-primary-hover", "group-selected:group-pressed:bg-interactive-contained-primary-pressed", "group-selected:group-pressed:border-interactive-contained-primary-pressed", "group-selected:group-disabled:bg-interactive-contained-primary-disabled", "group-selected:group-disabled:border-interactive-contained-primary-disabled", "group-indeterminate:border-interactive-contained-primary-idle", "group-indeterminate:bg-interactive-contained-primary-idle", "group-indeterminate:group-hover:bg-interactive-contained-primary-hover", "group-indeterminate:group-hover:border-interactive-contained-primary-hover", "group-indeterminate:group-pressed:bg-interactive-contained-primary-pressed", "group-indeterminate:group-pressed:border-interactive-contained-primary-pressed", "group-invalid:border-interactive-outlined-error-on-idle", "group-focus-visible:outline-interactive-contained-primary-focus"];
+    };
+  }>;
 };
-export type CheckboxConfig = NonNullable<typeof checkboxDefinition.config>;
-export interface CheckboxVariantProps extends UIOverrides.VariantProps<CheckboxConfig> {
-}
-export declare const checkboxIndicatorClass = "group flex items-center gap-2";
-export declare const checkboxTypography: (props: {
-    readonly variant?: "default" | null | undefined;
-}) => TypographyVariantProps | undefined;
-export declare const checkboxContentClassName: (props: {
-    readonly variant?: "default" | null | undefined;
-}) => string | undefined;
-export declare const checkboxContentWrapperDefinition: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly variant: {
-            readonly default: "";
-        };
-        readonly size: {
-            readonly "extra-small": "";
-            readonly small: "";
-            readonly default: "";
-            readonly large: "";
-        };
-        readonly as: {
-            readonly default: "flex-col";
-            readonly floating: "flex-col";
-            readonly filter: "flex-row flex-wrap items-center gap-2";
-            readonly inline: "flex-row flex-wrap items-center gap-2";
-        };
-        readonly hasInputFrame: {
-            readonly true: "gap-2";
-            readonly false: "";
-        };
-    }>;
+type CheckboxConfig = NonNullable<typeof checkboxDefinition.config>;
+interface CheckboxVariantProps extends UIOverrides.VariantProps<CheckboxConfig> {}
+declare const checkboxContentWrapperDefinition: {
+  base: string[];
+  config: StyleMergeUtils.Config<{
+    readonly variant: {
+      readonly default: "";
+    };
+    readonly size: {
+      readonly "extra-small": "";
+      readonly small: "";
+      readonly default: "";
+      readonly large: "";
+    };
+    readonly as: {
+      readonly default: "flex-col";
+      readonly floating: "flex-col";
+      readonly filter: "flex-row flex-wrap items-center gap-2";
+      readonly inline: "flex-row flex-wrap items-center gap-2";
+    };
+    readonly hasInputFrame: {
+      readonly true: "gap-2";
+      readonly false: "";
+    };
+  }>;
 };
-export type CheckboxContentWrapperConfig = NonNullable<typeof checkboxContentWrapperDefinition.config>;
-export interface CheckboxContentWrapperVariantProps extends UIOverrides.VariantProps<CheckboxContentWrapperConfig> {
-}
-export declare const checkboxGroupLabelDefinition: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly as: {
-            readonly default: "";
-            readonly floating: ["pointer-events-none absolute", "top-[calc(var(--spacing-floating-label-input-height-filled)+var(--spacing-floating-label-input-offset-top))]", "text-text-default-1", "font-semibold!", "text-label-3!"];
-            readonly filter: "";
-            readonly inline: "";
-        };
-    }>;
+declare const checkboxGroupLabelDefinition: {
+  base: string[];
+  config: StyleMergeUtils.Config<{
+    readonly as: {
+      readonly default: "";
+      readonly floating: ["pointer-events-none absolute", "top-[calc(var(--spacing-floating-label-input-height-filled)+var(--spacing-floating-label-input-offset-top))]", "text-text-default-1", "font-semibold!", "text-label-3!"];
+      readonly filter: "";
+      readonly inline: "";
+    };
+  }>;
 };
-export type CheckboxGroupLabelConfig = NonNullable<typeof checkboxGroupLabelDefinition.config>;
-export interface CheckboxGroupLabelVariantProps extends UIOverrides.VariantProps<CheckboxGroupLabelConfig> {
-}
-export declare const checkboxContentRowDefinition: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly variant: {
-            readonly default: "";
-        };
-        readonly as: {
-            readonly default: "flex-col";
-            readonly floating: "flex-col";
-            readonly filter: "flex-row flex-wrap items-center gap-2";
-            readonly inline: "flex-row flex-wrap items-center gap-2";
-        };
-        readonly hasInputFrame: {
-            readonly true: "gap-2";
-            readonly false: "";
-        };
-    }>;
+declare const checkboxContentRowDefinition: {
+  base: string[];
+  config: StyleMergeUtils.Config<{
+    readonly variant: {
+      readonly default: "";
+    };
+    readonly as: {
+      readonly default: "flex-col";
+      readonly floating: "flex-col";
+      readonly filter: "flex-row flex-wrap items-center gap-2";
+      readonly inline: "flex-row flex-wrap items-center gap-2";
+    };
+    readonly hasInputFrame: {
+      readonly true: "gap-2";
+      readonly false: "";
+    };
+  }>;
 };
-export type CheckboxContentRowConfig = NonNullable<typeof checkboxContentRowDefinition.config>;
-export interface CheckboxContentRowVariantProps extends UIOverrides.VariantProps<CheckboxContentRowConfig> {
-}
-export declare const checkboxIconDefinition: {
-    base: string[];
-    config: import("../../../utils/style-merge.util").StyleMergeUtils.Config<{
-        readonly iconVariant: {
-            readonly selected: ["group-selected:block"];
-            readonly indeterminate: ["group-indeterminate:block"];
-        };
-    }>;
+declare const checkboxIconDefinition: {
+  base: string[];
+  config: StyleMergeUtils.Config<{
+    readonly iconVariant: {
+      selected: ["group-selected:block"];
+      indeterminate: ["group-indeterminate:block"];
+    };
+  }>;
 };
-export type CheckboxIconConfig = NonNullable<typeof checkboxIconDefinition.config>;
-export interface CheckboxIconVariantProps extends UIOverrides.VariantProps<CheckboxIconConfig> {
-}
+//#endregion
+export { CheckboxConfig, CheckboxVariantProps, checkboxContentRowDefinition, checkboxContentWrapperDefinition, checkboxDefinition, checkboxGroupLabelDefinition, checkboxIconDefinition };

package/dist/components/inputs/Checkbox/checkbox.cva.js

@@ -2,7 +2,7 @@ import { UIOverrides } from "../../../config/uiOverrides.context.js";
 import { uiGroupOutlineClass } from "../../outline.clsx.js";
 import { compoundMapper } from "../../../utils/compoundMapper.js";
 //#region src/components/inputs/Checkbox/checkbox.cva.ts
-var checkboxDefinition = UIOverrides.defineConfig({
+const checkboxDefinition = UIOverrides.defineConfig({
 	base: [
 		"flex items-center justify-center border-2",
 		"relative size-4 shrink-0 rounded-xs p-1",
@@ -38,14 +38,14 @@ var checkboxDefinition = UIOverrides.defineConfig({
 		defaultVariants: { variant: "default" }
 	}
 });
-var checkboxIndicatorClass = "group flex items-center gap-2";
-var checkboxTypography = compoundMapper({ default: {
+const checkboxIndicatorClass = "group flex items-center gap-2";
+const checkboxTypography = compoundMapper({ default: {
 	size: "label-1",
 	sizeMobile: "label-1",
 	variant: "default"
 } });
-var checkboxContentClassName = compoundMapper({ default: "text-text-default-2" });
-var checkboxContentWrapperDefinition = UIOverrides.defineConfig({
+const checkboxContentClassName = compoundMapper({ default: "text-text-default-2" });
+const checkboxContentWrapperDefinition = UIOverrides.defineConfig({
 	base: ["relative flex"],
 	config: {
 		variants: {
@@ -106,7 +106,7 @@ var checkboxContentWrapperDefinition = UIOverrides.defineConfig({
 		}
 	}
 });
-var checkboxGroupLabelDefinition = UIOverrides.defineConfig({
+const checkboxGroupLabelDefinition = UIOverrides.defineConfig({
 	base: [""],
 	config: {
 		variants: { as: {
@@ -124,7 +124,7 @@ var checkboxGroupLabelDefinition = UIOverrides.defineConfig({
 		defaultVariants: { as: "default" }
 	}
 });
-var checkboxContentRowDefinition = UIOverrides.defineConfig({
+const checkboxContentRowDefinition = UIOverrides.defineConfig({
 	base: ["flex"],
 	config: {
 		variants: {
@@ -147,7 +147,7 @@ var checkboxContentRowDefinition = UIOverrides.defineConfig({
 		}
 	}
 });
-var checkboxIconDefinition = UIOverrides.defineConfig({
+const checkboxIconDefinition = UIOverrides.defineConfig({
 	base: ["absolute hidden size-3"],
 	config: {
 		variants: { iconVariant: {

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

@@ -1,41 +1,44 @@
-import { CalendarDate, DateValue } from '@internationalized/date';
-import { FocusEvent, Ref } from 'react';
-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 "../../../form-field.js";
+import { DatePickerTodayIcon, DatePickerTodayIconButtonComponent, DatePickerTodayIconButtonSize, DatePickerTodayIconPlacement } from "../shared/datePicker.types.js";
+import { DatePickerInputHandle } from "../shared/DatePickerInput.js";
+import { FocusEvent, Ref } from "react";
+import { CalendarDate, DateValue } from "@internationalized/date";
+import { DatePickerStateOptions } from "react-stately";
+//#region src/components/inputs/DateTime/DatePicker/DatePicker.d.ts
 type DatePickerGranularity = "day" | "month" | "year";
 interface DatePickerBaseProps extends FormFieldProps, InputVariantProps, Omit<DatePickerStateOptions<CalendarDate>, "granularity" | "shouldCloseOnSelect" | "label" | "onBlur"> {
-    ref?: Ref<DatePickerInputHandle & HTMLDivElement>;
-    disableDropdown?: boolean;
-    isClearable?: boolean;
-    isClearableIfDisabled?: boolean;
-    className?: string;
-    todayIcon?: DatePickerTodayIcon;
-    todayIconButtonSize?: DatePickerTodayIconButtonSize;
-    todayIconButtonComponent?: DatePickerTodayIconButtonComponent;
-    todayIconPlacement?: DatePickerTodayIconPlacement;
-    isDirty?: boolean;
-    disableManualEntry?: boolean;
-    autoFixYear?: boolean;
-    placeholder?: string;
-    inputClassName?: string;
-    onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
-    shouldUpdateDateOnMonthYearChange?: boolean;
-    granularity?: DatePickerGranularity;
-    format?: string;
+  ref?: Ref<DatePickerInputHandle & HTMLDivElement>;
+  disableDropdown?: boolean;
+  isClearable?: boolean;
+  isClearableIfDisabled?: boolean;
+  className?: string;
+  todayIcon?: DatePickerTodayIcon;
+  todayIconButtonSize?: DatePickerTodayIconButtonSize;
+  todayIconButtonComponent?: DatePickerTodayIconButtonComponent;
+  todayIconPlacement?: DatePickerTodayIconPlacement;
+  isDirty?: boolean;
+  disableManualEntry?: boolean;
+  autoFixYear?: boolean;
+  placeholder?: string;
+  inputClassName?: string;
+  onBlur?: (e: FocusEvent<HTMLInputElement>) => void;
+  shouldUpdateDateOnMonthYearChange?: boolean;
+  granularity?: DatePickerGranularity;
+  format?: string;
 }
-export interface DatePickerProps extends Omit<DatePickerBaseProps, "value" | "onChange" | "minValue" | "maxValue"> {
-    value?: string | null;
-    onChange?: (value: string | null) => void;
-    fullIso?: boolean;
-    minValue?: DateValue | string;
-    maxValue?: DateValue | string;
-    renderStaticInput?: boolean;
+interface DatePickerProps extends Omit<DatePickerBaseProps, "value" | "onChange" | "minValue" | "maxValue"> {
+  value?: string | null;
+  onChange?: (value: string | null) => void;
+  fullIso?: boolean;
+  minValue?: DateValue | string;
+  maxValue?: DateValue | string;
+  renderStaticInput?: boolean;
 }
-export type ControlledDatePickerProps<TFieldValues extends FieldValues> = ControlProps<DatePickerProps, TFieldValues>;
-export declare const DatePicker: <TFieldValues extends FieldValues>({ fullIso, granularity, minValue, maxValue, renderStaticInput, ...props }: ControlledDatePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
-export {};
+type ControlledDatePickerProps<TFieldValues extends FieldValues> = ControlProps<DatePickerProps, TFieldValues>;
+declare const DatePickerComponent: <TFieldValues extends FieldValues>({ fullIso, granularity, minValue, maxValue, renderStaticInput, ...props }: ControlledDatePickerProps<TFieldValues>) => import("react/jsx-runtime").JSX.Element;
+declare const DatePicker: typeof DatePickerComponent;
+//#endregion
+export { ControlledDatePickerProps, DatePicker, DatePickerProps };