erp-pro-ui 0.2.6 → 0.2.7

package/dist/chunks/date-picker-3IDSmb9Z.mjs

@@ -1,228 +0,0 @@
-import { K as CloseIcon } from "./icons-JzMKLygv.mjs";
-import { t as Calendar } from "./calendar-FxAmm_ao.mjs";
-import { useEffect, useMemo, useRef, useState } from "react";
-import { jsx, jsxs } from "react/jsx-runtime";
-import { motion, useMotionTemplate, useMotionValue } from "framer-motion";
-import { createPortal } from "react-dom";
-//#region src/components/forms/date-picker/DatePicker.tsx
-var formatDate = (date) => date?.toLocaleDateString(void 0, {
-	month: "short",
-	day: "numeric",
-	year: "numeric"
-}) ?? "";
-var isRangeValue = (value) => typeof value === "object" && value !== null && "start" in value && "end" in value;
-var emptyRange = {
-	start: null,
-	end: null
-};
-var PANEL_GAP = 8;
-var VIEWPORT_MARGIN = 12;
-var DatePicker = ({ mode = "single", value, onChange, label, placeholder = "Pick a date", helperText, disabled = false, className = "", presets }) => {
-	const [open, setOpen] = useState(false);
-	const [visible, setVisible] = useState(false);
-	const isControlled = value !== void 0;
-	const [internalValue, setInternalValue] = useState(value ?? (mode === "range" ? emptyRange : null));
-	const currentValue = isControlled ? value : internalValue;
-	const singleValue = mode === "range" ? null : currentValue;
-	const rangeValue = mode === "range" && isRangeValue(currentValue) ? currentValue : mode === "range" ? { ...emptyRange } : emptyRange;
-	const displayValue = useMemo(() => {
-		if (mode === "range") {
-			if (rangeValue.start && rangeValue.end) return `${formatDate(rangeValue.start)} — ${formatDate(rangeValue.end)}`;
-			if (rangeValue.start) return `${formatDate(rangeValue.start)} — …`;
-			return "";
-		}
-		return formatDate(singleValue);
-	}, [
-		mode,
-		rangeValue.end,
-		rangeValue.start,
-		singleValue
-	]);
-	const hasSelection = mode === "range" ? Boolean(rangeValue.start || rangeValue.end) : Boolean(singleValue);
-	const updateValue = (next) => {
-		if (!isControlled) setInternalValue(next);
-		onChange?.(next);
-	};
-	const containerRef = useRef(null);
-	const triggerRef = useRef(null);
-	const panelRef = useRef(null);
-	const mouseX = useMotionValue(0);
-	const mouseY = useMotionValue(0);
-	const radius = 100;
-	const [panelPosition, setPanelPosition] = useState({
-		top: 0,
-		left: 0,
-		minWidth: 320
-	});
-	useEffect(() => {
-		const isEventInside = (event) => {
-			return (typeof event.composedPath === "function" ? event.composedPath() : []).some((target) => {
-				if (!(target instanceof Node)) return false;
-				return containerRef.current?.contains(target) || panelRef.current?.contains(target);
-			});
-		};
-		const handlePointerOutside = (event) => {
-			const target = event.target;
-			if (target instanceof Node && (containerRef.current?.contains(target) || panelRef.current?.contains(target)) || isEventInside(event)) return;
-			setOpen(false);
-		};
-		const handleFocusOutside = (event) => {
-			const target = event.target;
-			if (target instanceof Node && (containerRef.current?.contains(target) || panelRef.current?.contains(target)) || isEventInside(event)) return;
-			setOpen(false);
-		};
-		if (open) {
-			document.addEventListener("pointerdown", handlePointerOutside, true);
-			document.addEventListener("focusin", handleFocusOutside, true);
-		}
-		return () => {
-			document.removeEventListener("pointerdown", handlePointerOutside, true);
-			document.removeEventListener("focusin", handleFocusOutside, true);
-		};
-	}, [open]);
-	useEffect(() => {
-		if (!open) return;
-		const updatePanelPosition = () => {
-			const triggerRect = triggerRef.current?.getBoundingClientRect();
-			if (!triggerRect) return;
-			const panelHeight = panelRef.current?.offsetHeight ?? 360;
-			const shouldOpenAbove = window.innerHeight - triggerRect.bottom < panelHeight + PANEL_GAP && triggerRect.top > panelHeight + PANEL_GAP;
-			const unclampedLeft = triggerRect.left;
-			const maxLeft = Math.max(VIEWPORT_MARGIN, window.innerWidth - Math.max(triggerRect.width, 320) - VIEWPORT_MARGIN);
-			const left = Math.min(Math.max(unclampedLeft, VIEWPORT_MARGIN), maxLeft);
-			setPanelPosition({
-				top: shouldOpenAbove ? Math.max(VIEWPORT_MARGIN, triggerRect.top - panelHeight - PANEL_GAP) : Math.min(triggerRect.bottom + PANEL_GAP, window.innerHeight - panelHeight - VIEWPORT_MARGIN),
-				left,
-				minWidth: Math.max(triggerRect.width, 320)
-			});
-		};
-		updatePanelPosition();
-		const frameId = window.requestAnimationFrame(updatePanelPosition);
-		window.addEventListener("resize", updatePanelPosition);
-		window.addEventListener("scroll", updatePanelPosition, true);
-		return () => {
-			window.cancelAnimationFrame(frameId);
-			window.removeEventListener("resize", updatePanelPosition);
-			window.removeEventListener("scroll", updatePanelPosition, true);
-		};
-	}, [open, presets]);
-	const handleMouseMove = (event) => {
-		const { left, top } = event.currentTarget.getBoundingClientRect();
-		mouseX.set(event.clientX - left);
-		mouseY.set(event.clientY - top);
-	};
-	const handlePresetClick = (getValue) => {
-		updateValue(getValue());
-		setOpen(false);
-	};
-	const handleClearSelection = () => {
-		if (disabled) return;
-		updateValue(mode === "range" ? { ...emptyRange } : null);
-		setOpen(false);
-	};
-	return /* @__PURE__ */ jsxs("div", {
-		ref: containerRef,
-		className: `w-full space-y-2 ${className}`.trim(),
-		children: [
-			label && /* @__PURE__ */ jsx("p", {
-				className: "text-sm font-medium text-ds-1",
-				children: label
-			}),
-			/* @__PURE__ */ jsx("div", {
-				className: "relative",
-				children: /* @__PURE__ */ jsx(motion.div, {
-					style: { backgroundImage: disabled ? "none" : useMotionTemplate`
-                  radial-gradient(
-                    ${visible ? `${radius}px` : "0px"} circle at ${mouseX}px ${mouseY}px,
-                    var(--ds-color-accent),
-                    transparent 90%
-                  )
-                ` },
-					onMouseMove: !disabled ? handleMouseMove : void 0,
-					onMouseEnter: !disabled ? () => setVisible(true) : void 0,
-					onMouseLeave: !disabled ? () => setVisible(false) : void 0,
-					className: disabled ? "group/date-picker rounded-lg border-none bg-ds-surface-1 p-[2px]" : "group/date-picker rounded-lg border-ds-border-2 p-[2px]",
-					children: /* @__PURE__ */ jsxs("div", {
-						className: "relative",
-						children: [/* @__PURE__ */ jsx("button", {
-							ref: triggerRef,
-							type: "button",
-							className: `flex w-full items-center justify-between rounded-md border border-ds-border-field bg-ds-surface-1 px-3 py-2 text-sm text-ds-1 transition duration-400 ease-in-out ${disabled ? "cursor-not-allowed opacity-50" : ""}`,
-							style: { paddingInlineEnd: "2.5rem" },
-							onClick: () => !disabled && setOpen((prev) => !prev),
-							"aria-haspopup": "dialog",
-							"aria-expanded": open,
-							disabled,
-							children: /* @__PURE__ */ jsx("span", {
-								className: displayValue ? "text-ds-1" : "text-ds-2",
-								children: displayValue || placeholder
-							})
-						}), hasSelection && !disabled ? /* @__PURE__ */ jsx("button", {
-							type: "button",
-							className: "absolute top-1/2 inline-flex h-5 w-5 -translate-y-1/2 items-center justify-center rounded-full text-ds-2 transition-colors hover:bg-ds-accent-subtle hover:text-ds-1",
-							style: { insetInlineEnd: "0.75rem" },
-							onClick: handleClearSelection,
-							"aria-label": mode === "range" ? "Clear selected date range" : "Clear selected date",
-							children: /* @__PURE__ */ jsx(CloseIcon, {
-								className: "h-3.5 w-3.5",
-								"aria-hidden": "true"
-							})
-						}) : /* @__PURE__ */ jsx("span", {
-							className: "pointer-events-none absolute top-1/2 -translate-y-1/2 text-ds-2",
-							style: { insetInlineEnd: "0.75rem" },
-							"aria-hidden": "true",
-							children: "📅"
-						})]
-					})
-				})
-			}),
-			helperText && /* @__PURE__ */ jsx("p", {
-				className: "text-xs text-ds-2",
-				children: helperText
-			}),
-			open && !disabled && typeof document !== "undefined" ? createPortal(/* @__PURE__ */ jsxs("div", {
-				className: "fixed inset-0 z-60",
-				children: [/* @__PURE__ */ jsx("div", {
-					className: "absolute inset-0",
-					"aria-hidden": "true",
-					onPointerDown: () => setOpen(false)
-				}), /* @__PURE__ */ jsxs("div", {
-					ref: panelRef,
-					className: "dropdown-panel absolute z-10",
-					style: {
-						top: panelPosition.top,
-						left: panelPosition.left,
-						minWidth: panelPosition.minWidth
-					},
-					role: "dialog",
-					"aria-modal": "false",
-					children: [/* @__PURE__ */ jsx(Calendar, {
-						value: mode === "single" ? singleValue ?? null : void 0,
-						selectionMode: mode,
-						range: mode === "range" ? rangeValue : void 0,
-						onSelect: mode === "single" ? (date) => {
-							updateValue(date);
-							setOpen(false);
-						} : void 0,
-						onRangeSelect: mode === "range" ? (nextRange) => {
-							updateValue(nextRange);
-							if (nextRange.start && nextRange.end) setOpen(false);
-						} : void 0
-					}), presets?.length ? /* @__PURE__ */ jsx("div", {
-						className: "mt-3 flex flex-wrap gap-2 rounded-lg border border-ds-border-2 bg-ds-surface-1/95 p-3 shadow-xl backdrop-blur-xl",
-						children: presets.map((preset) => /* @__PURE__ */ jsx("button", {
-							type: "button",
-							className: "rounded-full border border-ds-border-field px-3 py-1 text-xs text-ds-2 transition-colors hover:border-ds-border-accent hover:bg-ds-accent-subtle hover:text-ds-1",
-							onClick: () => handlePresetClick(preset.value),
-							children: preset.label
-						}, preset.label))
-					}) : null]
-				})]
-			}), document.body) : null
-		]
-	});
-};
-//#endregion
-export { DatePicker as t };
-
-//# sourceMappingURL=date-picker-3IDSmb9Z.mjs.map

package/dist/chunks/date-picker-3IDSmb9Z.mjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"date-picker-3IDSmb9Z.mjs","names":[],"sources":["../../src/components/forms/date-picker/DatePicker.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { motion, useMotionTemplate, useMotionValue } from \"framer-motion\";\n\nimport { Calendar } from \"../calendar\";\nimport { CloseIcon } from \"../../icons\";\n\nimport type { DatePickerProps, DatePickerValue, DateRangeValue } from \"./types\";\n\nconst formatDate = (date: Date | null) =>\n  date?.toLocaleDateString(undefined, {\n    month: \"short\",\n    day: \"numeric\",\n    year: \"numeric\",\n  }) ?? \"\";\n\nconst isRangeValue = (value: DatePickerValue): value is DateRangeValue =>\n  typeof value === \"object\" &&\n  value !== null &&\n  \"start\" in value &&\n  \"end\" in value;\n\nconst emptyRange: DateRangeValue = { start: null, end: null };\n\nconst PANEL_GAP = 8;\nconst VIEWPORT_MARGIN = 12;\n\nexport const DatePicker = ({\n  mode = \"single\",\n  value,\n  onChange,\n  label,\n  placeholder = \"Pick a date\",\n  helperText,\n  disabled = false,\n  className = \"\",\n  presets,\n}: DatePickerProps) => {\n  const [open, setOpen] = useState(false);\n  const [visible, setVisible] = useState(false);\n  const isControlled = value !== undefined;\n  const [internalValue, setInternalValue] = useState<DatePickerValue>(\n    value ?? (mode === \"range\" ? emptyRange : null),\n  );\n\n  const currentValue = isControlled ? value : internalValue;\n  const singleValue = mode === \"range\" ? null : (currentValue as Date | null);\n  const rangeValue =\n    mode === \"range\" && isRangeValue(currentValue)\n      ? currentValue\n      : mode === \"range\"\n        ? { ...emptyRange }\n        : emptyRange;\n\n  const displayValue = useMemo(() => {\n    if (mode === \"range\") {\n      if (rangeValue.start && rangeValue.end) {\n        return `${formatDate(rangeValue.start)} — ${formatDate(rangeValue.end)}`;\n      }\n      if (rangeValue.start) {\n        return `${formatDate(rangeValue.start)} — …`;\n      }\n      return \"\";\n    }\n    return formatDate(singleValue);\n  }, [mode, rangeValue.end, rangeValue.start, singleValue]);\n\n  const hasSelection =\n    mode === \"range\"\n      ? Boolean(rangeValue.start || rangeValue.end)\n      : Boolean(singleValue);\n\n  const updateValue = (next: DatePickerValue) => {\n    if (!isControlled) {\n      setInternalValue(next);\n    }\n    onChange?.(next);\n  };\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const panelRef = useRef<HTMLDivElement>(null);\n  const mouseX = useMotionValue(0);\n  const mouseY = useMotionValue(0);\n  const radius = 100;\n  const [panelPosition, setPanelPosition] = useState({\n    top: 0,\n    left: 0,\n    minWidth: 320,\n  });\n\n  useEffect(() => {\n    const isEventInside = (event: Event) => {\n      const eventPath =\n        typeof event.composedPath === \"function\" ? event.composedPath() : [];\n\n      return eventPath.some((target) => {\n        if (!(target instanceof Node)) {\n          return false;\n        }\n\n        return (\n          containerRef.current?.contains(target) ||\n          panelRef.current?.contains(target)\n        );\n      });\n    };\n\n    const handlePointerOutside = (event: PointerEvent) => {\n      const target = event.target;\n\n      if (\n        (target instanceof Node &&\n          (containerRef.current?.contains(target) ||\n            panelRef.current?.contains(target))) ||\n        isEventInside(event)\n      ) {\n        return;\n      }\n\n      setOpen(false);\n    };\n\n    const handleFocusOutside = (event: FocusEvent) => {\n      const target = event.target;\n\n      if (\n        (target instanceof Node &&\n          (containerRef.current?.contains(target) ||\n            panelRef.current?.contains(target))) ||\n        isEventInside(event)\n      ) {\n        return;\n      }\n\n      setOpen(false);\n    };\n\n    if (open) {\n      document.addEventListener(\"pointerdown\", handlePointerOutside, true);\n      document.addEventListener(\"focusin\", handleFocusOutside, true);\n    }\n\n    return () => {\n      document.removeEventListener(\"pointerdown\", handlePointerOutside, true);\n      document.removeEventListener(\"focusin\", handleFocusOutside, true);\n    };\n  }, [open]);\n\n  useEffect(() => {\n    if (!open) {\n      return;\n    }\n\n    const updatePanelPosition = () => {\n      const triggerRect = triggerRef.current?.getBoundingClientRect();\n\n      if (!triggerRect) {\n        return;\n      }\n\n      const panelHeight = panelRef.current?.offsetHeight ?? 360;\n      const spaceBelow = window.innerHeight - triggerRect.bottom;\n      const shouldOpenAbove =\n        spaceBelow < panelHeight + PANEL_GAP &&\n        triggerRect.top > panelHeight + PANEL_GAP;\n\n      const unclampedLeft = triggerRect.left;\n      const maxLeft = Math.max(\n        VIEWPORT_MARGIN,\n        window.innerWidth - Math.max(triggerRect.width, 320) - VIEWPORT_MARGIN,\n      );\n      const left = Math.min(Math.max(unclampedLeft, VIEWPORT_MARGIN), maxLeft);\n\n      setPanelPosition({\n        top: shouldOpenAbove\n          ? Math.max(VIEWPORT_MARGIN, triggerRect.top - panelHeight - PANEL_GAP)\n          : Math.min(\n              triggerRect.bottom + PANEL_GAP,\n              window.innerHeight - panelHeight - VIEWPORT_MARGIN,\n            ),\n        left,\n        minWidth: Math.max(triggerRect.width, 320),\n      });\n    };\n\n    updatePanelPosition();\n\n    const frameId = window.requestAnimationFrame(updatePanelPosition);\n\n    window.addEventListener(\"resize\", updatePanelPosition);\n    window.addEventListener(\"scroll\", updatePanelPosition, true);\n\n    return () => {\n      window.cancelAnimationFrame(frameId);\n      window.removeEventListener(\"resize\", updatePanelPosition);\n      window.removeEventListener(\"scroll\", updatePanelPosition, true);\n    };\n  }, [open, presets]);\n\n  const handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n    const { left, top } = event.currentTarget.getBoundingClientRect();\n    mouseX.set(event.clientX - left);\n    mouseY.set(event.clientY - top);\n  };\n\n  const handlePresetClick = (getValue: () => DatePickerValue) => {\n    const next = getValue();\n    updateValue(next);\n    setOpen(false);\n  };\n\n  const handleClearSelection = () => {\n    if (disabled) {\n      return;\n    }\n\n    updateValue(mode === \"range\" ? { ...emptyRange } : null);\n    setOpen(false);\n  };\n\n  return (\n    <div ref={containerRef} className={`w-full space-y-2 ${className}`.trim()}>\n      {label && <p className=\"text-sm font-medium text-ds-1\">{label}</p>}\n      <div className=\"relative\">\n        <motion.div\n          style={{\n            backgroundImage: disabled\n              ? \"none\"\n              : useMotionTemplate`\n                  radial-gradient(\n                    ${\n                      visible ? `${radius}px` : \"0px\"\n                    } circle at ${mouseX}px ${mouseY}px,\n                    var(--ds-color-accent),\n                    transparent 90%\n                  )\n                `,\n          }}\n          onMouseMove={!disabled ? handleMouseMove : undefined}\n          onMouseEnter={!disabled ? () => setVisible(true) : undefined}\n          onMouseLeave={!disabled ? () => setVisible(false) : undefined}\n          className={\n            disabled\n              ? \"group/date-picker rounded-lg border-none bg-ds-surface-1 p-[2px]\"\n              : \"group/date-picker rounded-lg border-ds-border-2 p-[2px]\"\n          }\n        >\n          <div className=\"relative\">\n            <button\n              ref={triggerRef}\n              type=\"button\"\n              className={`flex w-full items-center justify-between rounded-md border border-ds-border-field bg-ds-surface-1 px-3 py-2 text-sm text-ds-1 transition duration-400 ease-in-out ${\n                disabled ? \"cursor-not-allowed opacity-50\" : \"\"\n              }`}\n              style={{ paddingInlineEnd: \"2.5rem\" }}\n              onClick={() => !disabled && setOpen((prev) => !prev)}\n              aria-haspopup=\"dialog\"\n              aria-expanded={open}\n              disabled={disabled}\n            >\n              <span className={displayValue ? \"text-ds-1\" : \"text-ds-2\"}>\n                {displayValue || placeholder}\n              </span>\n            </button>\n\n            {hasSelection && !disabled ? (\n              <button\n                type=\"button\"\n                className=\"absolute top-1/2 inline-flex h-5 w-5 -translate-y-1/2 items-center justify-center rounded-full text-ds-2 transition-colors hover:bg-ds-accent-subtle hover:text-ds-1\"\n                style={{ insetInlineEnd: \"0.75rem\" }}\n                onClick={handleClearSelection}\n                aria-label={\n                  mode === \"range\"\n                    ? \"Clear selected date range\"\n                    : \"Clear selected date\"\n                }\n              >\n                <CloseIcon className=\"h-3.5 w-3.5\" aria-hidden=\"true\" />\n              </button>\n            ) : (\n              <span\n                className=\"pointer-events-none absolute top-1/2 -translate-y-1/2 text-ds-2\"\n                style={{ insetInlineEnd: \"0.75rem\" }}\n                aria-hidden=\"true\"\n              >\n                📅\n              </span>\n            )}\n          </div>\n        </motion.div>\n      </div>\n      {helperText && <p className=\"text-xs text-ds-2\">{helperText}</p>}\n      {open && !disabled && typeof document !== \"undefined\"\n        ? createPortal(\n            <div className=\"fixed inset-0 z-60\">\n              <div\n                className=\"absolute inset-0\"\n                aria-hidden=\"true\"\n                onPointerDown={() => setOpen(false)}\n              />\n              <div\n                ref={panelRef}\n                className=\"dropdown-panel absolute z-10\"\n                style={{\n                  top: panelPosition.top,\n                  left: panelPosition.left,\n                  minWidth: panelPosition.minWidth,\n                }}\n                role=\"dialog\"\n                aria-modal=\"false\"\n              >\n                <Calendar\n                  value={mode === \"single\" ? (singleValue ?? null) : undefined}\n                  selectionMode={mode}\n                  range={mode === \"range\" ? rangeValue : undefined}\n                  onSelect={\n                    mode === \"single\"\n                      ? (date) => {\n                          updateValue(date);\n                          setOpen(false);\n                        }\n                      : undefined\n                  }\n                  onRangeSelect={\n                    mode === \"range\"\n                      ? (nextRange) => {\n                          updateValue(nextRange);\n                          if (nextRange.start && nextRange.end) {\n                            setOpen(false);\n                          }\n                        }\n                      : undefined\n                  }\n                />\n                {presets?.length ? (\n                  <div className=\"mt-3 flex flex-wrap gap-2 rounded-lg border border-ds-border-2 bg-ds-surface-1/95 p-3 shadow-xl backdrop-blur-xl\">\n                    {presets.map((preset) => (\n                      <button\n                        key={preset.label}\n                        type=\"button\"\n                        className=\"rounded-full border border-ds-border-field px-3 py-1 text-xs text-ds-2 transition-colors hover:border-ds-border-accent hover:bg-ds-accent-subtle hover:text-ds-1\"\n                        onClick={() => handlePresetClick(preset.value)}\n                      >\n                        {preset.label}\n                      </button>\n                    ))}\n                  </div>\n                ) : null}\n              </div>\n            </div>,\n            document.body,\n          )\n        : null}\n    </div>\n  );\n};\n"],"mappings":"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"}

package/dist/chunks/date-picker-_EVYpGga.cjs

@@ -1,234 +0,0 @@
-require("./chunk-B_GkZjkl.cjs");
-const require_icons = require("./icons-ub9iu-JG.cjs");
-const require_calendar = require("./calendar-DCkikZYb.cjs");
-let react = require("react");
-let react_jsx_runtime = require("react/jsx-runtime");
-let framer_motion = require("framer-motion");
-let react_dom = require("react-dom");
-//#region src/components/forms/date-picker/DatePicker.tsx
-var formatDate = (date) => date?.toLocaleDateString(void 0, {
-	month: "short",
-	day: "numeric",
-	year: "numeric"
-}) ?? "";
-var isRangeValue = (value) => typeof value === "object" && value !== null && "start" in value && "end" in value;
-var emptyRange = {
-	start: null,
-	end: null
-};
-var PANEL_GAP = 8;
-var VIEWPORT_MARGIN = 12;
-var DatePicker = ({ mode = "single", value, onChange, label, placeholder = "Pick a date", helperText, disabled = false, className = "", presets }) => {
-	const [open, setOpen] = (0, react.useState)(false);
-	const [visible, setVisible] = (0, react.useState)(false);
-	const isControlled = value !== void 0;
-	const [internalValue, setInternalValue] = (0, react.useState)(value ?? (mode === "range" ? emptyRange : null));
-	const currentValue = isControlled ? value : internalValue;
-	const singleValue = mode === "range" ? null : currentValue;
-	const rangeValue = mode === "range" && isRangeValue(currentValue) ? currentValue : mode === "range" ? { ...emptyRange } : emptyRange;
-	const displayValue = (0, react.useMemo)(() => {
-		if (mode === "range") {
-			if (rangeValue.start && rangeValue.end) return `${formatDate(rangeValue.start)} — ${formatDate(rangeValue.end)}`;
-			if (rangeValue.start) return `${formatDate(rangeValue.start)} — …`;
-			return "";
-		}
-		return formatDate(singleValue);
-	}, [
-		mode,
-		rangeValue.end,
-		rangeValue.start,
-		singleValue
-	]);
-	const hasSelection = mode === "range" ? Boolean(rangeValue.start || rangeValue.end) : Boolean(singleValue);
-	const updateValue = (next) => {
-		if (!isControlled) setInternalValue(next);
-		onChange?.(next);
-	};
-	const containerRef = (0, react.useRef)(null);
-	const triggerRef = (0, react.useRef)(null);
-	const panelRef = (0, react.useRef)(null);
-	const mouseX = (0, framer_motion.useMotionValue)(0);
-	const mouseY = (0, framer_motion.useMotionValue)(0);
-	const radius = 100;
-	const [panelPosition, setPanelPosition] = (0, react.useState)({
-		top: 0,
-		left: 0,
-		minWidth: 320
-	});
-	(0, react.useEffect)(() => {
-		const isEventInside = (event) => {
-			return (typeof event.composedPath === "function" ? event.composedPath() : []).some((target) => {
-				if (!(target instanceof Node)) return false;
-				return containerRef.current?.contains(target) || panelRef.current?.contains(target);
-			});
-		};
-		const handlePointerOutside = (event) => {
-			const target = event.target;
-			if (target instanceof Node && (containerRef.current?.contains(target) || panelRef.current?.contains(target)) || isEventInside(event)) return;
-			setOpen(false);
-		};
-		const handleFocusOutside = (event) => {
-			const target = event.target;
-			if (target instanceof Node && (containerRef.current?.contains(target) || panelRef.current?.contains(target)) || isEventInside(event)) return;
-			setOpen(false);
-		};
-		if (open) {
-			document.addEventListener("pointerdown", handlePointerOutside, true);
-			document.addEventListener("focusin", handleFocusOutside, true);
-		}
-		return () => {
-			document.removeEventListener("pointerdown", handlePointerOutside, true);
-			document.removeEventListener("focusin", handleFocusOutside, true);
-		};
-	}, [open]);
-	(0, react.useEffect)(() => {
-		if (!open) return;
-		const updatePanelPosition = () => {
-			const triggerRect = triggerRef.current?.getBoundingClientRect();
-			if (!triggerRect) return;
-			const panelHeight = panelRef.current?.offsetHeight ?? 360;
-			const shouldOpenAbove = window.innerHeight - triggerRect.bottom < panelHeight + PANEL_GAP && triggerRect.top > panelHeight + PANEL_GAP;
-			const unclampedLeft = triggerRect.left;
-			const maxLeft = Math.max(VIEWPORT_MARGIN, window.innerWidth - Math.max(triggerRect.width, 320) - VIEWPORT_MARGIN);
-			const left = Math.min(Math.max(unclampedLeft, VIEWPORT_MARGIN), maxLeft);
-			setPanelPosition({
-				top: shouldOpenAbove ? Math.max(VIEWPORT_MARGIN, triggerRect.top - panelHeight - PANEL_GAP) : Math.min(triggerRect.bottom + PANEL_GAP, window.innerHeight - panelHeight - VIEWPORT_MARGIN),
-				left,
-				minWidth: Math.max(triggerRect.width, 320)
-			});
-		};
-		updatePanelPosition();
-		const frameId = window.requestAnimationFrame(updatePanelPosition);
-		window.addEventListener("resize", updatePanelPosition);
-		window.addEventListener("scroll", updatePanelPosition, true);
-		return () => {
-			window.cancelAnimationFrame(frameId);
-			window.removeEventListener("resize", updatePanelPosition);
-			window.removeEventListener("scroll", updatePanelPosition, true);
-		};
-	}, [open, presets]);
-	const handleMouseMove = (event) => {
-		const { left, top } = event.currentTarget.getBoundingClientRect();
-		mouseX.set(event.clientX - left);
-		mouseY.set(event.clientY - top);
-	};
-	const handlePresetClick = (getValue) => {
-		updateValue(getValue());
-		setOpen(false);
-	};
-	const handleClearSelection = () => {
-		if (disabled) return;
-		updateValue(mode === "range" ? { ...emptyRange } : null);
-		setOpen(false);
-	};
-	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		ref: containerRef,
-		className: `w-full space-y-2 ${className}`.trim(),
-		children: [
-			label && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-				className: "text-sm font-medium text-ds-1",
-				children: label
-			}),
-			/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "relative",
-				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(framer_motion.motion.div, {
-					style: { backgroundImage: disabled ? "none" : framer_motion.useMotionTemplate`
-                  radial-gradient(
-                    ${visible ? `${radius}px` : "0px"} circle at ${mouseX}px ${mouseY}px,
-                    var(--ds-color-accent),
-                    transparent 90%
-                  )
-                ` },
-					onMouseMove: !disabled ? handleMouseMove : void 0,
-					onMouseEnter: !disabled ? () => setVisible(true) : void 0,
-					onMouseLeave: !disabled ? () => setVisible(false) : void 0,
-					className: disabled ? "group/date-picker rounded-lg border-none bg-ds-surface-1 p-[2px]" : "group/date-picker rounded-lg border-ds-border-2 p-[2px]",
-					children: /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-						className: "relative",
-						children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-							ref: triggerRef,
-							type: "button",
-							className: `flex w-full items-center justify-between rounded-md border border-ds-border-field bg-ds-surface-1 px-3 py-2 text-sm text-ds-1 transition duration-400 ease-in-out ${disabled ? "cursor-not-allowed opacity-50" : ""}`,
-							style: { paddingInlineEnd: "2.5rem" },
-							onClick: () => !disabled && setOpen((prev) => !prev),
-							"aria-haspopup": "dialog",
-							"aria-expanded": open,
-							disabled,
-							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-								className: displayValue ? "text-ds-1" : "text-ds-2",
-								children: displayValue || placeholder
-							})
-						}), hasSelection && !disabled ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-							type: "button",
-							className: "absolute top-1/2 inline-flex h-5 w-5 -translate-y-1/2 items-center justify-center rounded-full text-ds-2 transition-colors hover:bg-ds-accent-subtle hover:text-ds-1",
-							style: { insetInlineEnd: "0.75rem" },
-							onClick: handleClearSelection,
-							"aria-label": mode === "range" ? "Clear selected date range" : "Clear selected date",
-							children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_icons.CloseIcon, {
-								className: "h-3.5 w-3.5",
-								"aria-hidden": "true"
-							})
-						}) : /* @__PURE__ */ (0, react_jsx_runtime.jsx)("span", {
-							className: "pointer-events-none absolute top-1/2 -translate-y-1/2 text-ds-2",
-							style: { insetInlineEnd: "0.75rem" },
-							"aria-hidden": "true",
-							children: "📅"
-						})]
-					})
-				})
-			}),
-			helperText && /* @__PURE__ */ (0, react_jsx_runtime.jsx)("p", {
-				className: "text-xs text-ds-2",
-				children: helperText
-			}),
-			open && !disabled && typeof document !== "undefined" ? (0, react_dom.createPortal)(/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-				className: "fixed inset-0 z-60",
-				children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-					className: "absolute inset-0",
-					"aria-hidden": "true",
-					onPointerDown: () => setOpen(false)
-				}), /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-					ref: panelRef,
-					className: "dropdown-panel absolute z-10",
-					style: {
-						top: panelPosition.top,
-						left: panelPosition.left,
-						minWidth: panelPosition.minWidth
-					},
-					role: "dialog",
-					"aria-modal": "false",
-					children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)(require_calendar.Calendar, {
-						value: mode === "single" ? singleValue ?? null : void 0,
-						selectionMode: mode,
-						range: mode === "range" ? rangeValue : void 0,
-						onSelect: mode === "single" ? (date) => {
-							updateValue(date);
-							setOpen(false);
-						} : void 0,
-						onRangeSelect: mode === "range" ? (nextRange) => {
-							updateValue(nextRange);
-							if (nextRange.start && nextRange.end) setOpen(false);
-						} : void 0
-					}), presets?.length ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-						className: "mt-3 flex flex-wrap gap-2 rounded-lg border border-ds-border-2 bg-ds-surface-1/95 p-3 shadow-xl backdrop-blur-xl",
-						children: presets.map((preset) => /* @__PURE__ */ (0, react_jsx_runtime.jsx)("button", {
-							type: "button",
-							className: "rounded-full border border-ds-border-field px-3 py-1 text-xs text-ds-2 transition-colors hover:border-ds-border-accent hover:bg-ds-accent-subtle hover:text-ds-1",
-							onClick: () => handlePresetClick(preset.value),
-							children: preset.label
-						}, preset.label))
-					}) : null]
-				})]
-			}), document.body) : null
-		]
-	});
-};
-//#endregion
-Object.defineProperty(exports, "DatePicker", {
-	enumerable: true,
-	get: function() {
-		return DatePicker;
-	}
-});
-
-//# sourceMappingURL=date-picker-_EVYpGga.cjs.map

package/dist/chunks/date-picker-_EVYpGga.cjs.map

@@ -1 +0,0 @@
-{"version":3,"file":"date-picker-_EVYpGga.cjs","names":[],"sources":["../../src/components/forms/date-picker/DatePicker.tsx"],"sourcesContent":["import { useEffect, useMemo, useRef, useState } from \"react\";\nimport { createPortal } from \"react-dom\";\nimport { motion, useMotionTemplate, useMotionValue } from \"framer-motion\";\n\nimport { Calendar } from \"../calendar\";\nimport { CloseIcon } from \"../../icons\";\n\nimport type { DatePickerProps, DatePickerValue, DateRangeValue } from \"./types\";\n\nconst formatDate = (date: Date | null) =>\n  date?.toLocaleDateString(undefined, {\n    month: \"short\",\n    day: \"numeric\",\n    year: \"numeric\",\n  }) ?? \"\";\n\nconst isRangeValue = (value: DatePickerValue): value is DateRangeValue =>\n  typeof value === \"object\" &&\n  value !== null &&\n  \"start\" in value &&\n  \"end\" in value;\n\nconst emptyRange: DateRangeValue = { start: null, end: null };\n\nconst PANEL_GAP = 8;\nconst VIEWPORT_MARGIN = 12;\n\nexport const DatePicker = ({\n  mode = \"single\",\n  value,\n  onChange,\n  label,\n  placeholder = \"Pick a date\",\n  helperText,\n  disabled = false,\n  className = \"\",\n  presets,\n}: DatePickerProps) => {\n  const [open, setOpen] = useState(false);\n  const [visible, setVisible] = useState(false);\n  const isControlled = value !== undefined;\n  const [internalValue, setInternalValue] = useState<DatePickerValue>(\n    value ?? (mode === \"range\" ? emptyRange : null),\n  );\n\n  const currentValue = isControlled ? value : internalValue;\n  const singleValue = mode === \"range\" ? null : (currentValue as Date | null);\n  const rangeValue =\n    mode === \"range\" && isRangeValue(currentValue)\n      ? currentValue\n      : mode === \"range\"\n        ? { ...emptyRange }\n        : emptyRange;\n\n  const displayValue = useMemo(() => {\n    if (mode === \"range\") {\n      if (rangeValue.start && rangeValue.end) {\n        return `${formatDate(rangeValue.start)} — ${formatDate(rangeValue.end)}`;\n      }\n      if (rangeValue.start) {\n        return `${formatDate(rangeValue.start)} — …`;\n      }\n      return \"\";\n    }\n    return formatDate(singleValue);\n  }, [mode, rangeValue.end, rangeValue.start, singleValue]);\n\n  const hasSelection =\n    mode === \"range\"\n      ? Boolean(rangeValue.start || rangeValue.end)\n      : Boolean(singleValue);\n\n  const updateValue = (next: DatePickerValue) => {\n    if (!isControlled) {\n      setInternalValue(next);\n    }\n    onChange?.(next);\n  };\n\n  const containerRef = useRef<HTMLDivElement>(null);\n  const triggerRef = useRef<HTMLButtonElement>(null);\n  const panelRef = useRef<HTMLDivElement>(null);\n  const mouseX = useMotionValue(0);\n  const mouseY = useMotionValue(0);\n  const radius = 100;\n  const [panelPosition, setPanelPosition] = useState({\n    top: 0,\n    left: 0,\n    minWidth: 320,\n  });\n\n  useEffect(() => {\n    const isEventInside = (event: Event) => {\n      const eventPath =\n        typeof event.composedPath === \"function\" ? event.composedPath() : [];\n\n      return eventPath.some((target) => {\n        if (!(target instanceof Node)) {\n          return false;\n        }\n\n        return (\n          containerRef.current?.contains(target) ||\n          panelRef.current?.contains(target)\n        );\n      });\n    };\n\n    const handlePointerOutside = (event: PointerEvent) => {\n      const target = event.target;\n\n      if (\n        (target instanceof Node &&\n          (containerRef.current?.contains(target) ||\n            panelRef.current?.contains(target))) ||\n        isEventInside(event)\n      ) {\n        return;\n      }\n\n      setOpen(false);\n    };\n\n    const handleFocusOutside = (event: FocusEvent) => {\n      const target = event.target;\n\n      if (\n        (target instanceof Node &&\n          (containerRef.current?.contains(target) ||\n            panelRef.current?.contains(target))) ||\n        isEventInside(event)\n      ) {\n        return;\n      }\n\n      setOpen(false);\n    };\n\n    if (open) {\n      document.addEventListener(\"pointerdown\", handlePointerOutside, true);\n      document.addEventListener(\"focusin\", handleFocusOutside, true);\n    }\n\n    return () => {\n      document.removeEventListener(\"pointerdown\", handlePointerOutside, true);\n      document.removeEventListener(\"focusin\", handleFocusOutside, true);\n    };\n  }, [open]);\n\n  useEffect(() => {\n    if (!open) {\n      return;\n    }\n\n    const updatePanelPosition = () => {\n      const triggerRect = triggerRef.current?.getBoundingClientRect();\n\n      if (!triggerRect) {\n        return;\n      }\n\n      const panelHeight = panelRef.current?.offsetHeight ?? 360;\n      const spaceBelow = window.innerHeight - triggerRect.bottom;\n      const shouldOpenAbove =\n        spaceBelow < panelHeight + PANEL_GAP &&\n        triggerRect.top > panelHeight + PANEL_GAP;\n\n      const unclampedLeft = triggerRect.left;\n      const maxLeft = Math.max(\n        VIEWPORT_MARGIN,\n        window.innerWidth - Math.max(triggerRect.width, 320) - VIEWPORT_MARGIN,\n      );\n      const left = Math.min(Math.max(unclampedLeft, VIEWPORT_MARGIN), maxLeft);\n\n      setPanelPosition({\n        top: shouldOpenAbove\n          ? Math.max(VIEWPORT_MARGIN, triggerRect.top - panelHeight - PANEL_GAP)\n          : Math.min(\n              triggerRect.bottom + PANEL_GAP,\n              window.innerHeight - panelHeight - VIEWPORT_MARGIN,\n            ),\n        left,\n        minWidth: Math.max(triggerRect.width, 320),\n      });\n    };\n\n    updatePanelPosition();\n\n    const frameId = window.requestAnimationFrame(updatePanelPosition);\n\n    window.addEventListener(\"resize\", updatePanelPosition);\n    window.addEventListener(\"scroll\", updatePanelPosition, true);\n\n    return () => {\n      window.cancelAnimationFrame(frameId);\n      window.removeEventListener(\"resize\", updatePanelPosition);\n      window.removeEventListener(\"scroll\", updatePanelPosition, true);\n    };\n  }, [open, presets]);\n\n  const handleMouseMove = (event: React.MouseEvent<HTMLDivElement>) => {\n    const { left, top } = event.currentTarget.getBoundingClientRect();\n    mouseX.set(event.clientX - left);\n    mouseY.set(event.clientY - top);\n  };\n\n  const handlePresetClick = (getValue: () => DatePickerValue) => {\n    const next = getValue();\n    updateValue(next);\n    setOpen(false);\n  };\n\n  const handleClearSelection = () => {\n    if (disabled) {\n      return;\n    }\n\n    updateValue(mode === \"range\" ? { ...emptyRange } : null);\n    setOpen(false);\n  };\n\n  return (\n    <div ref={containerRef} className={`w-full space-y-2 ${className}`.trim()}>\n      {label && <p className=\"text-sm font-medium text-ds-1\">{label}</p>}\n      <div className=\"relative\">\n        <motion.div\n          style={{\n            backgroundImage: disabled\n              ? \"none\"\n              : useMotionTemplate`\n                  radial-gradient(\n                    ${\n                      visible ? `${radius}px` : \"0px\"\n                    } circle at ${mouseX}px ${mouseY}px,\n                    var(--ds-color-accent),\n                    transparent 90%\n                  )\n                `,\n          }}\n          onMouseMove={!disabled ? handleMouseMove : undefined}\n          onMouseEnter={!disabled ? () => setVisible(true) : undefined}\n          onMouseLeave={!disabled ? () => setVisible(false) : undefined}\n          className={\n            disabled\n              ? \"group/date-picker rounded-lg border-none bg-ds-surface-1 p-[2px]\"\n              : \"group/date-picker rounded-lg border-ds-border-2 p-[2px]\"\n          }\n        >\n          <div className=\"relative\">\n            <button\n              ref={triggerRef}\n              type=\"button\"\n              className={`flex w-full items-center justify-between rounded-md border border-ds-border-field bg-ds-surface-1 px-3 py-2 text-sm text-ds-1 transition duration-400 ease-in-out ${\n                disabled ? \"cursor-not-allowed opacity-50\" : \"\"\n              }`}\n              style={{ paddingInlineEnd: \"2.5rem\" }}\n              onClick={() => !disabled && setOpen((prev) => !prev)}\n              aria-haspopup=\"dialog\"\n              aria-expanded={open}\n              disabled={disabled}\n            >\n              <span className={displayValue ? \"text-ds-1\" : \"text-ds-2\"}>\n                {displayValue || placeholder}\n              </span>\n            </button>\n\n            {hasSelection && !disabled ? (\n              <button\n                type=\"button\"\n                className=\"absolute top-1/2 inline-flex h-5 w-5 -translate-y-1/2 items-center justify-center rounded-full text-ds-2 transition-colors hover:bg-ds-accent-subtle hover:text-ds-1\"\n                style={{ insetInlineEnd: \"0.75rem\" }}\n                onClick={handleClearSelection}\n                aria-label={\n                  mode === \"range\"\n                    ? \"Clear selected date range\"\n                    : \"Clear selected date\"\n                }\n              >\n                <CloseIcon className=\"h-3.5 w-3.5\" aria-hidden=\"true\" />\n              </button>\n            ) : (\n              <span\n                className=\"pointer-events-none absolute top-1/2 -translate-y-1/2 text-ds-2\"\n                style={{ insetInlineEnd: \"0.75rem\" }}\n                aria-hidden=\"true\"\n              >\n                📅\n              </span>\n            )}\n          </div>\n        </motion.div>\n      </div>\n      {helperText && <p className=\"text-xs text-ds-2\">{helperText}</p>}\n      {open && !disabled && typeof document !== \"undefined\"\n        ? createPortal(\n            <div className=\"fixed inset-0 z-60\">\n              <div\n                className=\"absolute inset-0\"\n                aria-hidden=\"true\"\n                onPointerDown={() => setOpen(false)}\n              />\n              <div\n                ref={panelRef}\n                className=\"dropdown-panel absolute z-10\"\n                style={{\n                  top: panelPosition.top,\n                  left: panelPosition.left,\n                  minWidth: panelPosition.minWidth,\n                }}\n                role=\"dialog\"\n                aria-modal=\"false\"\n              >\n                <Calendar\n                  value={mode === \"single\" ? (singleValue ?? null) : undefined}\n                  selectionMode={mode}\n                  range={mode === \"range\" ? rangeValue : undefined}\n                  onSelect={\n                    mode === \"single\"\n                      ? (date) => {\n                          updateValue(date);\n                          setOpen(false);\n                        }\n                      : undefined\n                  }\n                  onRangeSelect={\n                    mode === \"range\"\n                      ? (nextRange) => {\n                          updateValue(nextRange);\n                          if (nextRange.start && nextRange.end) {\n                            setOpen(false);\n                          }\n                        }\n                      : undefined\n                  }\n                />\n                {presets?.length ? (\n                  <div className=\"mt-3 flex flex-wrap gap-2 rounded-lg border border-ds-border-2 bg-ds-surface-1/95 p-3 shadow-xl backdrop-blur-xl\">\n                    {presets.map((preset) => (\n                      <button\n                        key={preset.label}\n                        type=\"button\"\n                        className=\"rounded-full border border-ds-border-field px-3 py-1 text-xs text-ds-2 transition-colors hover:border-ds-border-accent hover:bg-ds-accent-subtle hover:text-ds-1\"\n                        onClick={() => handlePresetClick(preset.value)}\n                      >\n                        {preset.label}\n                      </button>\n                    ))}\n                  </div>\n                ) : null}\n              </div>\n            </div>,\n            document.body,\n          )\n        : null}\n    </div>\n  );\n};\n"],"mappings":"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"}