Object.defineProperty(exports, Symbol.toStringTag, { value: "Module" });
const require_chunk = require("../../chunk-CKQMccvm.cjs");
const require_LayoutContext = require("../../LayoutContext-qUdkWJWV.cjs");
const require_useMultipleRefs = require("../../useMultipleRefs-COMoDkic.cjs");
const require_ThemeProvider = require("../../ThemeProvider-0ytg6ico.cjs");
const require_Calendar = require("../../Calendar-BDFvo8RP.cjs");
let clsx = require("clsx");
clsx = require_chunk.__toESM(clsx);
let lucide_react = require("lucide-react");
let react = require("react");
react = require_chunk.__toESM(react);
let react_jsx_runtime = require("react/jsx-runtime");
let react_dom = require("react-dom");
let _floating_ui_react_dom = require("@floating-ui/react-dom");
let date_fns = require("date-fns");
//#region src/components/DatePicker/helpers/context/DatePickerContext.tsx
const DatePickerContext = (0, react.createContext)({
	selectedDate: void 0,
	selectedRange: {
		from: void 0,
		to: void 0
	},
	isOpen: false,
	mode: "single",
	botType: "fullscreen",
	setSelectedDate: (_date) => {},
	setSelectedRange: (_range) => {},
	setIsOpen: (_isOpen) => {}
});
const useDatePicker = () => {
	const context = (0, react.useContext)(DatePickerContext);
	if (!context) throw new Error("useDatePicker must be used within a DatePickerProvider");
	return context;
};
const DatePickerProvider = ({ children, selectedDateFromParent, selectedRangeFromParent, setSelectedDateFromParent, setSelectedRangeFromParent, isOpenFromParent, setIsOpenFromParent, mode, botType }) => {
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DatePickerContext.Provider, {
		value: {
			selectedDate: selectedDateFromParent,
			selectedRange: selectedRangeFromParent,
			setSelectedDate: setSelectedDateFromParent,
			setSelectedRange: setSelectedRangeFromParent,
			mode,
			isOpen: isOpenFromParent,
			setIsOpen: setIsOpenFromParent,
			botType
		},
		children
	});
};
//#endregion
//#region src/components/DatePicker/helpers/utils/helperFn.tsx
const formatDateRange = (range) => {
	if (!range) return "Select a range";
	const { from, to } = range;
	if (!from) return "Select a range";
	if (!to) return (0, date_fns.format)(from, "MMM d, yyyy");
	if (from.toDateString() === to.toDateString()) return (0, date_fns.format)(from, "MMM d, yyyy");
	return `${(0, date_fns.format)(from, "MMM d, yyyy")} - ${(0, date_fns.format)(to, "MMM d, yyyy")}`;
};
const formatSingleDate = (date) => {
	if (!date) return "Select a date";
	return (0, date_fns.format)(date, "MMM d, yyyy");
};
//#endregion
//#region src/components/DatePicker/helpers/components/DatePickerRenderer.tsx
const DatepickerRenderer = (0, react.forwardRef)(({ className, style }, ref) => {
	const { selectedDate, selectedRange, mode, setSelectedDate, setSelectedRange } = useDatePicker();
	if (mode === "single") return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
		ref,
		className: (0, clsx.default)("openui-date-picker-renderer-single-mode", className),
		style,
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Calendar.Calendar, {
			mode: "single",
			selected: selectedDate,
			onSelect: setSelectedDate,
			startMonth: new Date(1900, 0),
			endMonth: new Date(2100, 11)
		})
	});
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
		ref,
		className: (0, clsx.default)("openui-date-picker-renderer-range-mode", className),
		style,
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_Calendar.Calendar, {
			mode: "range",
			selected: selectedRange,
			onSelect: setSelectedRange,
			startMonth: new Date(1900, 0),
			endMonth: new Date(2100, 11)
		})
	});
});
//#endregion
//#region src/components/DatePicker/helpers/components/FloatingDatePickerRenderer.tsx
const FloatingDateInput = () => {
	const { mode, selectedDate, selectedRange, isOpen, setIsOpen } = useDatePicker();
	const hasSelectedDate = mode === "single" ? !!selectedDate : !!(selectedRange && selectedRange.from && selectedRange.to);
	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
		className: (0, clsx.default)("openui-date-picker-renderer-floating-input-container", {
			"openui-date-picker-renderer-floating-input-container-open": isOpen,
			"openui-date-picker-renderer-floating-input-container-not-open": !isOpen,
			"openui-date-picker-renderer-floating-input-container-has-no-selected-date": !hasSelectedDate
		}),
		onClick: (e) => {
			e.stopPropagation();
			setIsOpen(!isOpen);
		},
		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
			className: "openui-date-picker-renderer-floating-input-container-text",
			children: mode === "single" ? formatSingleDate(selectedDate) : formatDateRange(selectedRange)
		}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(lucide_react.ChevronDown, {
			size: 16,
			className: (0, clsx.default)({ "openui-date-picker-renderer-floating-input-container-icon": isOpen })
		})]
	});
};
const FloatingDatePicker = (0, react.forwardRef)((_, ref) => {
	const { isOpen } = useDatePicker();
	const menuPositionDivRef = (0, react.useRef)(null);
	const { portalThemeClassName } = require_ThemeProvider.useTheme();
	const { refs: { setFloating, setReference }, floatingStyles } = (0, _floating_ui_react_dom.useFloating)({
		strategy: "absolute",
		placement: "bottom-start",
		whileElementsMounted: _floating_ui_react_dom.autoUpdate,
		middleware: [(0, _floating_ui_react_dom.offset)(5), (0, _floating_ui_react_dom.flip)()]
	});
	const menuPositionDivRefs = require_useMultipleRefs.useMultipleRefs(setReference, menuPositionDivRef);
	const floatingRef = require_useMultipleRefs.useMultipleRefs(setFloating, ref);
	if (!isOpen) return null;
	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)(react_jsx_runtime.Fragment, { children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
		ref: menuPositionDivRefs,
		className: (0, clsx.default)("openui-date-picker-renderer-floating-reference")
	}), (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
		ref: floatingRef,
		style: {
			...floatingStyles,
			width: "fit-content"
		},
		className: (0, clsx.default)("openui-date-picker-renderer-floating-content", portalThemeClassName),
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
			className: "openui-date-picker-renderer-floating-menu",
			children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DatepickerRenderer, {})
		})
	}), document.body)] });
});
const FloatingDatePickerRenderer = ({ className, style }) => {
	const { isOpen, setIsOpen } = useDatePicker();
	const menuRef = (0, react.useRef)(null);
	const containerRef = (0, react.useRef)(null);
	(0, react.useEffect)(() => {
		if (!isOpen) return;
		const handleInteraction = (e) => {
			const targetNode = e.target;
			if (menuRef.current?.contains(targetNode) || containerRef.current?.contains(targetNode)) return;
			setIsOpen(false);
		};
		document.body.addEventListener("mousedown", handleInteraction);
		document.body.addEventListener("touchstart", handleInteraction);
		return () => {
			document.body.removeEventListener("mousedown", handleInteraction);
			document.body.removeEventListener("touchstart", handleInteraction);
		};
	}, [isOpen, setIsOpen]);
	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
		ref: containerRef,
		className: (0, clsx.default)("openui-date-picker-renderer-floating-container", className),
		style,
		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(FloatingDateInput, {}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FloatingDatePicker, { ref: menuRef })]
	});
};
//#endregion
//#region src/components/DatePicker/DatePicker.tsx
const DatePicker = (props) => {
	const { layout } = require_LayoutContext.useLayoutContext();
	const { mode = "single", selectedSingleDate, selectedRangeDates, setSelectedSingleDate, setSelectedRangeDates, isOpen, setIsOpen, className, style } = props;
	const [internalSelectedDate, setInternalSelectedDate] = (0, react.useState)(selectedSingleDate);
	const [internalSelectedRange, setInternalSelectedRange] = (0, react.useState)(selectedRangeDates);
	const [internalIsOpen, setInternalIsOpen] = (0, react.useState)(isOpen ?? false);
	const selectedDateHandler = (selectedDate) => {
		if (selectedSingleDate) {
			setSelectedSingleDate?.(selectedDate);
			return;
		}
		setSelectedSingleDate?.(selectedDate);
		setInternalSelectedDate(selectedDate);
	};
	const selectedRangeHandler = (selectedRange) => {
		if (selectedRangeDates) {
			setSelectedRangeDates?.(selectedRange);
			return;
		}
		setSelectedRangeDates?.(selectedRange);
		setInternalSelectedRange(selectedRange);
	};
	return /* @__PURE__ */ (0, react_jsx_runtime.jsx)(DatePickerProvider, {
		mode,
		botType: layout,
		selectedDateFromParent: selectedSingleDate ?? internalSelectedDate,
		selectedRangeFromParent: selectedRangeDates ?? internalSelectedRange,
		setSelectedDateFromParent: selectedDateHandler,
		setSelectedRangeFromParent: selectedRangeHandler,
		isOpenFromParent: isOpen ?? internalIsOpen,
		setIsOpenFromParent: setIsOpen ?? setInternalIsOpen,
		children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(FloatingDatePickerRenderer, {
			className,
			style
		})
	});
};
//#endregion
exports.DatePicker = DatePicker;

//# sourceMappingURL=index.cjs.map