@payfit/unity-components/dist/esm/components/date-range-picker/DateRangePicker.js

import { Icon as e } from "../icon/Icon.js";
import { DateRangeCalendar as t } from "../date-range-calendar/DateRangeCalendar.js";
import { DateRangeInput as n } from "./parts/DateRangeInput.js";
import { forwardRef as r } from "react";
import { uyTv as i } from "@payfit/unity-themes";
import { jsx as a, jsxs as o } from "react/jsx-runtime";
import { useIntl as s } from "react-intl";
import { Dialog as c } from "react-aria-components/Dialog";
import { Button as l, DateRangePicker as u, Group as d, Popover as f } from "react-aria-components/DateRangePicker";
//#region src/components/date-range-picker/DateRangePicker.tsx
var p = i({
	slots: {
		base: ["uy:group uy:flex uy:h-5.5 uy:sm:h-500 uy:border uy:border-solid uy:rounded-100 uy:sm:rounded-75", "uy:active:border-border-form-active uy:data-[focus-visible=true]:border-border-form-active uy:data-[open=true]:border-border-form-active"],
		inputWrapper: [
			"uy:flex uy:grow uy:rounded-100 uy:sm:rounded-75 uy:outline-none",
			"uy:focus-within:outline-2 uy:focus-within:outline-solid uy:focus-within:outline-utility-focus-ring uy:focus-within:outline-offset-3",
			"uy:group-[:has(button:focus)]:data-[focus-within]:outline-none uy:group-[:has(button:focus)]:data-[focus-within]:outline-offset-0 uy:group-[:has(button:focus)]:data-[focus-within]:outline-transparent"
		],
		suffix: [
			"uy:flex-grow-0 uy:content-center uy:p-125 uy:border-l uy:border-solid uy:rounded-r-100 uy:sm:rounded-r-75 uy:text-content-neutral-low",
			"uy:hover:bg-surface-neutral-hover uy:active:bg-surface-neutral-pressed uy:active:border-border-form-active uy:data-[pressed=true]:not-group-data-[open=true]:bg-surface-neutral-pressed uy:data-[pressed=true]:not-group-data-[open=true]:border-border-form-active uy:group-data-[open=true]:border-border-form-active",
			"uy:focus-visible:outline-2 uy:focus-visible:outline-utility-focus-ring uy:focus-visible:outline-offset-3"
		]
	},
	variants: {
		isInvalid: { true: {
			base: "uy:border-border-form-error uy:bg-surface-form-error",
			suffix: "uy:bg-surface-form-error uy:border-border-form-error"
		} },
		isReadOnly: { true: {
			base: "uy:border-border-form-disabled uy:bg-surface-form-disabled",
			inputWrapper: "uy:border-border-form-disabled uy:bg-surface-form-disabled",
			suffix: "uy:bg-surface-form-disabled uy:border-border-form-disabled uy:text-content-form-disabled"
		} },
		isDisabled: { true: {
			base: "uy:border-border-form-disabled uy:bg-surface-form-disabled",
			inputWrapper: "uy:bg-surface-form-disabled uy:text-content-form-disabled",
			suffix: "uy:bg-surface-form-disabled uy:border-border-form-disabled uy:text-content-form-disabled"
		} }
	},
	compoundVariants: [{
		isInvalid: !1,
		isDisabled: !1,
		isReadOnly: !1,
		className: {
			base: "uy:border-border-form-enabled uy:bg-surface-form-enabled",
			suffix: "uy:border-border-form-enabled uy:bg-surface-neutral uy:text-content-neutral-low"
		}
	}]
}), m = i({
	base: "uy:w-[356px] uy:overflow-auto uy:shadow-300 uy:border uy:border-solid uy:border-border-neutral uy:bg-surface-neutral uy:rounded-md uy:sm:rounded-75",
	variants: {
		isEntering: { true: "uy:animate-in uy:fade-in uy:data-[placement-bottom]:slide-in-from-top-1 uy:data-[placement-top]:slide-out-to-bottom-1 uy:duration-200 uy:ease-out" },
		isExiting: { true: "uy:animate-out uy:fade-out uy:data-[placement-bottom]:slide-out-to-top-1 uy:data-[placement-top]:slide-out-to-bottom-1 uy:duration-150 uy:ease-in" }
	}
}), h = r(({ value: r, defaultValue: i, isInvalid: h, isLoading: g, isDisabled: _, isReadOnly: v, onClearButtonPress: y, onBlur: b, onFocus: x, onChange: S, onOpenChange: C, id: w, "aria-label": T, "aria-labelledby": E, "aria-describedby": D, "aria-details": O, ...k }, A) => {
	let j = s(), { base: M, inputWrapper: N, suffix: P } = p({
		isInvalid: !!h,
		isReadOnly: !!v,
		isDisabled: !!_
	}), F = (e) => {
		S?.(e);
	}, I = (e) => {
		C?.(e), e ? x?.() : b?.();
	}, L = (e) => k.isDateUnavailable ? k.isDateUnavailable(e) : !1, R = () => {
		y?.();
	};
	return /* @__PURE__ */ o(u, {
		ref: A,
		"data-dd-privacy": "mask",
		...k,
		className: M(),
		value: r,
		defaultValue: i,
		minValue: k.minValue,
		maxValue: k.maxValue,
		isReadOnly: !!v,
		isDisabled: !!_,
		onChange: F,
		onFocus: x,
		onBlur: b,
		onOpenChange: I,
		isInvalid: !!h,
		isDateUnavailable: L,
		"aria-label": T,
		"aria-labelledby": E,
		"aria-describedby": D,
		"aria-details": O,
		children: [/* @__PURE__ */ o(d, {
			className: N(),
			id: w,
			children: [/* @__PURE__ */ a(n, {
				isLoading: g,
				isDisabled: _,
				isReadOnly: v,
				isInvalid: h,
				onClearButtonPress: R
			}), /* @__PURE__ */ a(l, {
				className: P(),
				isDisabled: v || _,
				children: /* @__PURE__ */ a(e, {
					src: "CalendarBlankOutlined",
					color: "inherit",
					alt: j.formatMessage({
						id: "unity:component:form-field:date-range-picker:calendar-button",
						defaultMessage: "Open Calendar"
					})
				})
			})]
		}), /* @__PURE__ */ a(f, {
			className: ({ isEntering: e, isExiting: t }) => m({
				isEntering: e,
				isExiting: t
			}),
			children: /* @__PURE__ */ a(c, {
				className: "uy:p-150",
				"data-dd-privacy": "mask",
				children: /* @__PURE__ */ a(t, {
					value: r,
					defaultValue: i,
					minValue: k.minValue,
					maxValue: k.maxValue,
					onChange: F,
					firstDayOfWeek: k.firstDayOfWeek
				})
			})
		})]
	});
});
h.displayName = "DateRangePicker";
//#endregion
export { h as DateRangePicker };