npm - @plexui/ui - Versions diffs - 0.19.1 → 0.20.1 - Mend

@plexui/ui 0.19.1 → 0.20.1

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (402) hide show

package/dist/es/components/DateRangePicker/Calendar.js CHANGED Viewed

@@ -2,22 +2,50 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { DateTime, Interval } from "luxon";
 import { useEffect, useMemo, useRef, useState } from "react";
-import { useBreakpoint } from "../../hooks/useBreakpoints";
-import { chunkIntoWeeks, getDaysOfMonth, isAfter, isBefore, isSameDay, isToday, } from "../../lib/dateUtils";
-import { waitForAnimationFrame } from "../../lib/helpers";
-import { Button } from "../Button";
-import { Check, ChevronLeft, ChevronRight } from "../Icon";
-import { TransitionGroup } from "../Transition";
-import s from "./Calendar.module.css";
-import { useDateRangeContext } from "./context";
-import {} from "./types";
+import { useBreakpoint } from "../../hooks/useBreakpoints.js";
+import { useStableCallback } from "../../hooks/useStableCallback.js";
+import { chunkIntoWeeks, getDaysOfMonth, isAfter, isBefore, isSameDay, isToday, } from "../../lib/dateUtils.js";
+import { waitForAnimationFrame } from "../../lib/helpers.js";
+import { Button } from "../Button/index.js";
+import { Check, ChevronLeft, ChevronRight } from "../Icon/index.js";
+import { TransitionGroup } from "../Transition/index.js";
+import s from "@plexui/styles/components/DateRangePicker/Calendar.module.css";
+import { useDateRangeContext } from "./context.js";
+import {} from "./types.js";
 const CALENDAR_WIDTH_PX = 210;
 const CALENDAR_GAP_PX = 32;
 const STEP_DISTANCE_PX = CALENDAR_WIDTH_PX + CALENDAR_GAP_PX;
+// The day a grid key moves to: a day, a week, the Sunday or Saturday of the
+// week (rows start on Sunday), or a month (Luxon clamps Jan 31 to Feb 28/29)
+const getKeyTarget = (key, day) => {
+    switch (key) {
+        case "ArrowLeft":
+            return day.minus({ days: 1 });
+        case "ArrowRight":
+            return day.plus({ days: 1 });
+        case "ArrowUp":
+            return day.minus({ days: 7 });
+        case "ArrowDown":
+            return day.plus({ days: 7 });
+        case "Home":
+            return day.minus({ days: day.weekday % 7 });
+        case "End":
+            return day.plus({ days: 6 - (day.weekday % 7) });
+        case "PageUp":
+            return day.minus({ months: 1 });
+        case "PageDown":
+            return day.plus({ months: 1 });
+        default:
+            return null;
+    }
+};
+const monthIndex = (date) => date.year * 12 + date.month;
 export const DateRangeCalendar = () => {
     const { value, min, max, maxRangeDays, onChangeRef } = useDateRangeContext();
     const isSmallUp = useBreakpoint("sm");
     const calendarContainerRef = useRef(null);
+    // The day to focus once a key has moved the view to its month
+    const pendingFocusRef = useRef(null);
     const [selectionRange, setSelectionRange] = useState(null);
     const [calendarSteps, setCalendarSteps] = useState(0);
     const [forceRenderIncrement, setForceRenderIncrement] = useState(0);
@@ -85,17 +113,69 @@ export const DateRangeCalendar = () => {
             return [currentStartDate, currentStartDate];
         });
     };
+    // Days are named by their full date; skip calendars that are leaving
+    const focusDay = (day) => {
+        const label = day.toLocaleString(DateTime.DATE_HUGE);
+        const buttons = calendarContainerRef.current?.querySelectorAll(`button[aria-label="${label}"]`);
+        Array.from(buttons ?? [])
+            .find((button) => !button.closest("[data-exiting]"))
+            ?.focus();
+    };
+    // A calendar that is leaving keeps the props it last rendered with, so its
+    // days reach the current state through a stable callback
+    const handleDayKeyDown = useStableCallback((event, day) => {
+        if (event.altKey || event.ctrlKey || event.metaKey) {
+            return;
+        }
+        // While a move waits for its month to render, the next key starts from
+        // the day it is moving to (key repeat), not the day that still has focus
+        const target = getKeyTarget(event.key, pendingFocusRef.current ?? day);
+        if (!target) {
+            return;
+        }
+        event.preventDefault();
+        // A disabled day (outside min/max, or past maxRangeDays while selecting)
+        // keeps focus where it is
+        const rangeEndLimit = selectionRange && maxRangeDays != null
+            ? selectionRange[0].plus({ days: maxRangeDays - 1 })
+            : undefined;
+        if ((min && isBefore(target, min.startOf("day"))) ||
+            (max && isAfter(target, max.endOf("day"))) ||
+            (rangeEndLimit && isAfter(target, rangeEndLimit))) {
+            return;
+        }
+        const monthsBefore = monthIndex(leftCalendarDate) - monthIndex(target);
+        const monthsAfter = monthIndex(target) - monthIndex(rightCalendarDate);
+        if (monthsBefore <= 0 && monthsAfter <= 0) {
+            pendingFocusRef.current = null;
+            focusDay(target);
+            return;
+        }
+        // Step the view like the month buttons; a day within min/max keeps every step in bounds
+        if (monthsAfter > 0 ? !canGoForward : !canGoBack) {
+            return;
+        }
+        pendingFocusRef.current = target;
+        for (let step = 0; step < Math.max(monthsBefore, monthsAfter); step++) {
+            if (monthsAfter > 0) {
+                handleNext();
+            }
+            else {
+                handlePrevious();
+            }
+        }
+    });
     const selectedDisplayValue = selectionRange || value;
     // Force re-renders when `value` changes out of brand from direct user-selection
     useEffect(() => {
-        // No-op when value is empty
-        if (!value) {
-            return;
-        }
         // When a new value is received, it could be out of band from the control of this calendar.
         // For example, a shortcut could be selected, or clear could be pressed. In either case, selection
         // should be reset so that the new `value` can be displayed fully.
         setSelectionRange(null);
+        // Nothing else to do when value is empty
+        if (!value) {
+            return;
+        }
         // Check if `value` is still within view of our calendar
         const viewInterval = Interval.fromDateTimes(leftCalendarDate.startOf("month"), rightCalendarDate.endOf("month"));
         const isValueInRangeOfCalendar = viewInterval.contains(value[0]) || viewInterval.contains(value[1]);
@@ -122,7 +202,7 @@ export const DateRangeCalendar = () => {
                 // We want to know the full height of the element, without any transform applied.
                 const height = element.clientHeight;
                 // Ignore calendars that are exiting
-                if (element.closest("[data-exiting")) {
+                if (element.closest("[data-exiting]")) {
                     return;
                 }
                 if (height > maxHeight) {
@@ -139,18 +219,33 @@ export const DateRangeCalendar = () => {
             }
         });
     }, [leftCalendarDate]);
-    return (_jsx("div", { className: s.CalendarWrapper, children: _jsxs("div", { ref: calendarContainerRef, className: s.CalendarContainer, onMouseLeave: handleCalendarMouseLeave, children: [_jsx("div", { className: s.Previous, children: _jsx(Button, { variant: "ghost", color: "secondary", size: "sm", pill: false, gutterSize: "2xs", iconSize: "sm", onClick: handlePrevious, disabled: !canGoBack, children: _jsx(ChevronLeft, {}) }) }), _jsx("div", { className: s.Next, children: _jsx(Button, { variant: "ghost", color: "secondary", size: "sm", pill: false, gutterSize: "2xs", iconSize: "sm", onClick: handleNext, disabled: !canGoForward, children: _jsx(ChevronRight, {}) }) }), _jsx("div", { className: s.CalendarRange, style: {
+    // Focus a pending day once its month has rendered. New calendars mount
+    // after this render (TransitionGroup), so wait a frame like the height does
+    useEffect(() => {
+        if (!pendingFocusRef.current) {
+            return;
+        }
+        return waitForAnimationFrame(() => {
+            const target = pendingFocusRef.current;
+            pendingFocusRef.current = null;
+            if (target) {
+                focusDay(target);
+            }
+        });
+        // eslint-disable-next-line react-hooks/exhaustive-deps -- Only re-run this hook when the months change
+    }, [leftCalendarDate]);
+    return (_jsx("div", { className: s.CalendarWrapper, children: _jsxs("div", { ref: calendarContainerRef, className: s.CalendarContainer, onMouseLeave: handleCalendarMouseLeave, children: [_jsx("div", { className: s.Previous, children: _jsx(Button, { variant: "ghost", color: "secondary", size: "sm", pill: false, gutterSize: "2xs", iconSize: "sm", onClick: handlePrevious, disabled: !canGoBack, "aria-label": "Previous month", children: _jsx(ChevronLeft, {}) }) }), _jsx("div", { className: s.Next, children: _jsx(Button, { variant: "ghost", color: "secondary", size: "sm", pill: false, gutterSize: "2xs", iconSize: "sm", onClick: handleNext, disabled: !canGoForward, "aria-label": "Next month", children: _jsx(ChevronRight, {}) }) }), _jsx("div", { className: s.CalendarRange, style: {
                         transform: `translate(${calendarSteps * -1 * STEP_DISTANCE_PX}px, 0)`,
-                    }, children: _jsxs(TransitionGroup, { enterDuration: 400, exitDuration: 400, children: [_jsx(CalendarView, { stepPosition: calendarSteps, date: leftCalendarDate, selectedDates: selectedDisplayValue, min: min, max: max, selectionStart: selectionRange?.[0], maxRangeDays: maxRangeDays, isSelecting: !!selectionRange, onDateSelect: handleDateSelect, onDateMouseEnter: handleDateMouseEnter }, leftCalendarDate.toLocaleString({
+                    }, children: _jsxs(TransitionGroup, { enterDuration: 400, exitDuration: 400, children: [_jsx(CalendarView, { stepPosition: calendarSteps, date: leftCalendarDate, selectedDates: selectedDisplayValue, min: min, max: max, selectionStart: selectionRange?.[0], maxRangeDays: maxRangeDays, isSelecting: !!selectionRange, onDateSelect: handleDateSelect, onDateMouseEnter: handleDateMouseEnter, onDayKeyDown: handleDayKeyDown }, leftCalendarDate.toLocaleString({
                                 month: "long",
                                 year: "numeric",
-                            })), isSmallUp && (_jsx(CalendarView, { stepPosition: calendarSteps + 1, date: rightCalendarDate, selectedDates: selectedDisplayValue, min: min, max: max, selectionStart: selectionRange?.[0], maxRangeDays: maxRangeDays, isSelecting: !!selectionRange, onDateSelect: handleDateSelect, onDateMouseEnter: handleDateMouseEnter }, rightCalendarDate.toLocaleString({
+                            })), isSmallUp && (_jsx(CalendarView, { stepPosition: calendarSteps + 1, date: rightCalendarDate, selectedDates: selectedDisplayValue, min: min, max: max, selectionStart: selectionRange?.[0], maxRangeDays: maxRangeDays, isSelecting: !!selectionRange, onDateSelect: handleDateSelect, onDateMouseEnter: handleDateMouseEnter, onDayKeyDown: handleDayKeyDown }, rightCalendarDate.toLocaleString({
                                 month: "long",
                                 year: "numeric",
                             })))] }) })] }) }, `stable-view-${forceRenderIncrement}`));
 };
 const daysOfTheWeekLabels = ["Su", "Mo", "Tu", "We", "Th", "Fr", "Sa"];
-const CalendarView = ({ date, selectedDates, min, max, selectionStart, maxRangeDays, isSelecting, onDateSelect, onDateMouseEnter, stepPosition, }) => {
+const CalendarView = ({ date, selectedDates, min, max, selectionStart, maxRangeDays, isSelecting, onDateSelect, onDateMouseEnter, onDayKeyDown, stepPosition, }) => {
     // Lock position on mount and don't respond to changes
     const [position] = useState(stepPosition);
     const { startOfMonth, weeks, enabledInterval } = useMemo(() => {
@@ -160,7 +255,9 @@ const CalendarView = ({ date, selectedDates, min, max, selectionStart, maxRangeD
         const blankDays = new Array(daysBeforeMonthStart).fill(null);
         const daysInMonth = getDaysOfMonth(monthStart);
         const calendarCells = [...blankDays, ...daysInMonth];
-        const enabledDateInterval = Interval.fromDateTimes(min || monthStart, max || endOfMonth);
+        // Cells are start-of-day values and Interval excludes its end, so widen the
+        // bounds to whole days: min/max days themselves stay selectable.
+        const enabledDateInterval = Interval.fromDateTimes((min || monthStart).startOf("day"), (max || endOfMonth).endOf("day"));
         return {
             startOfMonth: monthStart,
             endOfMonth,
@@ -200,12 +297,12 @@ const CalendarView = ({ date, selectedDates, min, max, selectionStart, maxRangeD
                         d.weekday !== 6 &&
                         isInRange &&
                         !isEnd;
-                    return (_jsx("div", { className: s.Day, "data-is-start": isStart ? "" : undefined, "data-is-end": isEnd ? "" : undefined, "data-is-in-range": isInRange ? "" : undefined, "data-is-first-range-trail": isFirstRangeTrail ? "" : undefined, "data-is-last-range-trail": isLastRangeTrail ? "" : undefined, children: _jsxs("button", { className: s.InteractiveDay, disabled: !enabled, onClick: () => d && onDateSelect?.(d), onMouseEnter: () => d && onDateMouseEnter?.(d), children: [d.day, dayIsToday && _jsx("span", { className: s.TodayDot })] }) }, dayIndex));
+                    return (_jsx("div", { className: s.Day, "data-is-start": isStart ? "" : undefined, "data-is-end": isEnd ? "" : undefined, "data-is-in-range": isInRange ? "" : undefined, "data-is-first-range-trail": isFirstRangeTrail ? "" : undefined, "data-is-last-range-trail": isLastRangeTrail ? "" : undefined, children: _jsxs("button", { className: s.InteractiveDay, disabled: !enabled, "aria-label": d.toLocaleString(DateTime.DATE_HUGE), "aria-pressed": !!(isStart || isEnd || isInRange), "aria-current": dayIsToday ? "date" : undefined, onClick: () => d && onDateSelect?.(d), onMouseEnter: () => d && onDateMouseEnter?.(d), onKeyDown: (event) => d && onDayKeyDown?.(event, d), children: [d.day, dayIsToday && _jsx("span", { className: s.TodayDot })] }) }, dayIndex));
                 }) }, weekIndex)))] }));
 };
 export const DateRangeShortcuts = ({ shortcuts }) => {
     const isMediumUp = useBreakpoint("md");
-    const { value, onChangeRef } = useDateRangeContext();
+    const { value, min, max, maxRangeDays, onChangeRef } = useDateRangeContext();
     if (!isMediumUp || !shortcuts?.length) {
         return null;
     }
@@ -214,9 +311,15 @@ export const DateRangeShortcuts = ({ shortcuts }) => {
             const range = getDateRange();
             const [start, end] = range;
             const isActive = !!value && isSameDay(value[0], start) && isSameDay(value[1], end);
-            return (_jsxs(Button, { className: "mb-1", variant: "ghost", color: "primary", pill: false, size: "md", iconSize: "sm", block: true, selected: isActive, onClick: () => onChangeRef.current(range, shortcut), children: [_jsx("span", { className: s.ButtonText, children: label }), isActive && _jsx(Check, {})] }, label));
+            return (_jsxs(Button, { className: "mb-1", variant: "ghost", color: "primary", pill: false, size: "md", iconSize: "sm", block: true, selected: isActive, disabled: !isRangeWithinLimits(range, min, max, maxRangeDays), onClick: () => onChangeRef.current(range, shortcut), children: [_jsx("span", { className: s.ButtonText, children: label }), isActive && _jsx(Check, {})] }, label));
         }) }));
 };
+// A shortcut follows the calendar's limits: whole days from min to max, and
+// no more than maxRangeDays days
+const isRangeWithinLimits = ([start, end], min, max, maxRangeDays) => !(min && isBefore(start, min.startOf("day"))) &&
+    !(max && isAfter(end, max.endOf("day"))) &&
+    !(maxRangeDays != null &&
+        isAfter(end.startOf("day"), start.startOf("day").plus({ days: maxRangeDays - 1 })));
 const getLeftCalendarDate = (targetDate, maxDate) => {
     if (!maxDate) {
         return targetDate;

package/dist/es/components/DateRangePicker/Calendar.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Calendar.js","sourceRoot":"","sources":["../../../../src/components/DateRangePicker/Calendar.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport { DateTime, Interval } from \"luxon\"\nimport { useEffect, useMemo, useRef, useState } from \"react\"\nimport { useBreakpoint } from \"../../hooks/useBreakpoints\"\nimport {\n chunkIntoWeeks,\n getDaysOfMonth,\n isAfter,\n isBefore,\n isSameDay,\n isToday,\n} from \"../../lib/dateUtils\"\nimport { waitForAnimationFrame } from \"../../lib/helpers\"\nimport { Button } from \"../Button\"\nimport { Check, ChevronLeft, ChevronRight } from \"../Icon\"\nimport { TransitionGroup } from \"../Transition\"\nimport s from \"./Calendar.module.css\"\nimport { useDateRangeContext } from \"./context\"\nimport { type DateRange, type DateRangeShortcut } from \"./types\"\n\nconst CALENDAR_WIDTH_PX = 210\nconst CALENDAR_GAP_PX = 32\nconst STEP_DISTANCE_PX = CALENDAR_WIDTH_PX + CALENDAR_GAP_PX\n\nexport const DateRangeCalendar = () => {\n const { value, min, max, maxRangeDays, onChangeRef } = useDateRangeContext()\n const isSmallUp = useBreakpoint(\"sm\")\n const calendarContainerRef = useRef<HTMLDivElement \| null>(null)\n const [selectionRange, setSelectionRange] = useState<DateRange \| null>(null)\n const [calendarSteps, setCalendarSteps] = useState<number>(0)\n const [forceRenderIncrement, setForceRenderIncrement] = useState<number>(0)\n const [leftCalendarDate, setLeftCalendarDate] = useState<DateTime>(() =>\n isSmallUp\n ? getLeftCalendarDate(value?.[0] ?? DateTime.now(), max)\n : value?.[0] ?? DateTime.now(),\n )\n\n const rightCalendarDate = isSmallUp\n ? leftCalendarDate.plus({ months: 1 }).startOf(\"month\")\n : leftCalendarDate.startOf(\"month\")\n\n const canGoBack = !min \|\| isBefore(min, leftCalendarDate.startOf(\"month\"))\n const canGoForward = !max \|\| isBefore(rightCalendarDate.endOf(\"month\"), max)\n\n const handleNext = () => {\n setCalendarSteps((c) => c + 1)\n setLeftCalendarDate((dt) => dt.plus({ months: 1 }))\n }\n\n const handlePrevious = () => {\n setCalendarSteps((c) => c - 1)\n setLeftCalendarDate((dt) => dt.minus({ months: 1 }))\n }\n\n const handleDateSelect = (selectedDate: DateTime) => {\n if (!selectionRange) {\n setSelectionRange([selectedDate, selectedDate])\n return\n }\n\n const [currentSelectionStartDate] = selectionRange\n\n // Selecting a date before the current selected start date moves the start date\n // but does not resolve the selection\n if (isBefore(selectedDate, currentSelectionStartDate)) {\n setSelectionRange([selectedDate, selectedDate])\n return\n }\n\n // Resolve the selection by emitting the value and clearing selection\n onChangeRef.current([currentSelectionStartDate, selectedDate])\n setSelectionRange(null)\n }\n\n const handleDateMouseEnter = (hoveredDate: DateTime) => {\n // If we're not actively selecting, no-op\n if (!selectionRange) {\n return\n }\n\n setSelectionRange((currentSelectionRange) => {\n // impossible due to the check above\n if (!currentSelectionRange) {\n return currentSelectionRange\n }\n\n const [currentStartDate] = currentSelectionRange\n\n // When hovering a date before the current date, don't change the selection range\n if (isBefore(hoveredDate, currentStartDate)) {\n return [currentStartDate, currentStartDate]\n }\n\n return [currentStartDate, hoveredDate]\n })\n }\n\n const handleCalendarMouseLeave = () => {\n // If we're not actively selecting, no-op\n if (!selectionRange) {\n return\n }\n\n setSelectionRange((currentSelectionRange) => {\n if (!currentSelectionRange) {\n return currentSelectionRange\n }\n\n // Reset the end selection\n const [currentStartDate] = currentSelectionRange\n return [currentStartDate, currentStartDate]\n })\n }\n\n const selectedDisplayValue = selectionRange \|\| value\n\n // Force re-renders when `value` changes out of brand from direct user-selection\n useEffect(() => {\n // No-op when value is empty\n if (!value) {\n return\n }\n\n // When a new value is received, it could be out of band from the control of this calendar.\n // For example, a shortcut could be selected, or clear could be pressed. In either case, selection\n // should be reset so that the new `value` can be displayed fully.\n setSelectionRange(null)\n\n // Check if `value` is still within view of our calendar\n const viewInterval = Interval.fromDateTimes(\n leftCalendarDate.startOf(\"month\"),\n rightCalendarDate.endOf(\"month\"),\n )\n const isValueInRangeOfCalendar =\n viewInterval.contains(value[0]) \|\| viewInterval.contains(value[1])\n if (!isValueInRangeOfCalendar) {\n // Reset state the calendar view entirely\n setSelectionRange(null)\n setCalendarSteps(0)\n setLeftCalendarDate(isSmallUp ? getLeftCalendarDate(value[0], max) : value[0])\n setForceRenderIncrement((c) => c + 1)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps -- Only re-run this hook when value changes\n }, [value])\n\n // Detect height changes when new calendars are rendered\n useEffect(() => {\n waitForAnimationFrame(() => {\n const container = calendarContainerRef.current\n\n if (!container) {\n return\n }\n\n let maxHeight = -Infinity\n\n // Find the tallest calendar\n container.querySelectorAll(\"[data-calendar]\")?.forEach((element) => {\n // NOTE: clientHeight does not respect the scale() that popover uses to animate in, which is what we want\n // We want to know the full height of the element, without any transform applied.\n const height = element.clientHeight\n\n // Ignore calendars that are exiting\n if (element.closest(\"[data-exiting\")) {\n return\n }\n\n if (height > maxHeight) {\n maxHeight = height\n }\n })\n\n container.style.height = `${maxHeight}px`\n\n // Don't animate the initial height.\n // This is relevant when the calendar opens to a larger size than the default.\n if (!container.style.transition) {\n waitForAnimationFrame(() => {\n container.style.transition = `height 0.25s var(--cubic-move)`\n })\n }\n })\n }, [leftCalendarDate])\n\n return (\n <div className={s.CalendarWrapper} key={`stable-view-${forceRenderIncrement}`}>\n <div\n ref={calendarContainerRef}\n className={s.CalendarContainer}\n onMouseLeave={handleCalendarMouseLeave}\n >\n <div className={s.Previous}>\n <Button\n variant=\"ghost\"\n color=\"secondary\"\n size=\"sm\"\n pill={false}\n gutterSize=\"2xs\"\n iconSize=\"sm\"\n onClick={handlePrevious}\n disabled={!canGoBack}\n >\n <ChevronLeft />\n </Button>\n </div>\n <div className={s.Next}>\n <Button\n variant=\"ghost\"\n color=\"secondary\"\n size=\"sm\"\n pill={false}\n gutterSize=\"2xs\"\n iconSize=\"sm\"\n onClick={handleNext}\n disabled={!canGoForward}\n >\n <ChevronRight />\n </Button>\n </div>\n <div\n className={s.CalendarRange}\n style={{\n transform: `translate(${calendarSteps * -1 * STEP_DISTANCE_PX}px, 0)`,\n }}\n >\n <TransitionGroup enterDuration={400} exitDuration={400}>\n <CalendarView\n key={leftCalendarDate.toLocaleString({\n month: \"long\",\n year: \"numeric\",\n })}\n stepPosition={calendarSteps}\n date={leftCalendarDate}\n selectedDates={selectedDisplayValue}\n min={min}\n max={max}\n selectionStart={selectionRange?.[0]}\n maxRangeDays={maxRangeDays}\n isSelecting={!!selectionRange}\n onDateSelect={handleDateSelect}\n onDateMouseEnter={handleDateMouseEnter}\n />\n {isSmallUp && (\n <CalendarView\n key={rightCalendarDate.toLocaleString({\n month: \"long\",\n year: \"numeric\",\n })}\n stepPosition={calendarSteps + 1}\n date={rightCalendarDate}\n selectedDates={selectedDisplayValue}\n min={min}\n max={max}\n selectionStart={selectionRange?.[0]}\n maxRangeDays={maxRangeDays}\n isSelecting={!!selectionRange}\n onDateSelect={handleDateSelect}\n onDateMouseEnter={handleDateMouseEnter}\n />\n )}\n </TransitionGroup>\n </div>\n </div>\n </div>\n )\n}\n\ntype CalendarViewProps = {\n // Can be any day within the given month that the calendar should render for\n date: DateTime\n selectedDates?: DateRange \| null\n onDateSelect?: (dt: DateTime) => void\n onDateMouseEnter?: (dt: DateTime) => void\n min?: DateTime\n max?: DateTime\n selectionStart?: DateTime \| null\n maxRangeDays?: number\n isSelecting?: boolean\n stepPosition: number\n}\n\nconst daysOfTheWeekLabels = [\"Su\", \"Mo\", \"Tu\", \"We\", \"Th\", \"Fr\", \"Sa\"]\n\nconst CalendarView = ({\n date,\n selectedDates,\n min,\n max,\n selectionStart,\n maxRangeDays,\n isSelecting,\n onDateSelect,\n onDateMouseEnter,\n stepPosition,\n}: CalendarViewProps) => {\n // Lock position on mount and don't respond to changes\n const [position] = useState(stepPosition)\n const { startOfMonth, weeks, enabledInterval } = useMemo(() => {\n const monthStart = date.startOf(\"month\")\n const endOfMonth = date.endOf(\"month\")\n\n const daysBeforeMonthStart = monthStart.weekday % 7\n const blankDays = new Array(daysBeforeMonthStart).fill(null)\n const daysInMonth = getDaysOfMonth(monthStart)\n const calendarCells = [...blankDays, ...daysInMonth]\n\n const enabledDateInterval = Interval.fromDateTimes(min \|\| monthStart, max \|\| endOfMonth)\n\n return {\n startOfMonth: monthStart,\n endOfMonth,\n weeks: chunkIntoWeeks(calendarCells, 7),\n enabledInterval: enabledDateInterval,\n }\n }, [date, min, max])\n\n const [selectedStart, selectedEnd] = selectedDates \|\| []\n const rangeEndLimit =\n selectionStart && maxRangeDays != null\n ? selectionStart.plus({ days: maxRangeDays - 1 })\n : undefined\n\n const selectedInterval = useMemo<Interval \| null>(() => {\n if (!selectedStart \|\| !selectedEnd) {\n return null\n }\n\n return Interval.fromDateTimes(selectedStart.startOf(\"day\"), selectedEnd.endOf(\"day\"))\n }, [selectedStart, selectedEnd])\n\n return (\n <div className={s.Calendar} style={{ left: position * STEP_DISTANCE_PX }} data-calendar>\n <p className={s.MonthLabel}>\n {startOfMonth.monthLong} {startOfMonth.year}\n </p>\n <div className={s.Week}>\n {daysOfTheWeekLabels.map((day) => (\n <div key={day} className={s.DayLabel}>\n {day}\n </div>\n ))}\n </div>\n {weeks.map((week, weekIndex) => (\n <div className={s.Week} key={weekIndex}>\n {week.map((d, dayIndex) => {\n if (!d) {\n return <div className={s.Day} key={`${weekIndex}-${dayIndex}`} />\n }\n\n // Check if 'day' is within selected range\n const enabled =\n enabledInterval.contains(d) &&\n !(isSelecting && rangeEndLimit && isAfter(d, rangeEndLimit))\n const isStart = enabled && selectedStart && isSameDay(d, selectedStart)\n const isEnd = enabled && selectedEnd && isSameDay(d, selectedEnd)\n const hasRange = selectedStart && selectedEnd && !isSameDay(selectedStart, selectedEnd)\n const isInRange = hasRange && selectedInterval?.contains(d)\n const dayIsToday = isToday(d)\n const isFirstRangeTrail =\n d.day === 1 &&\n // Trail doesn't make sense to display at the start of the week (Monday)\n d.weekday !== 7 &&\n isInRange &&\n !isStart\n const isLastRangeTrail =\n d.day === d.daysInMonth &&\n // Trail doesn't make sense to display at the end of the week (Saturday)\n d.weekday !== 6 &&\n isInRange &&\n !isEnd\n\n return (\n <div\n className={s.Day}\n key={dayIndex}\n data-is-start={isStart ? \"\" : undefined}\n data-is-end={isEnd ? \"\" : undefined}\n data-is-in-range={isInRange ? \"\" : undefined}\n data-is-first-range-trail={isFirstRangeTrail ? \"\" : undefined}\n data-is-last-range-trail={isLastRangeTrail ? \"\" : undefined}\n >\n <button\n className={s.InteractiveDay}\n disabled={!enabled}\n onClick={() => d && onDateSelect?.(d)}\n onMouseEnter={() => d && onDateMouseEnter?.(d)}\n >\n {d.day}\n {dayIsToday && <span className={s.TodayDot} />}\n </button>\n </div>\n )\n })}\n </div>\n ))}\n </div>\n )\n}\n\nexport const DateRangeShortcuts = ({ shortcuts }: { shortcuts?: DateRangeShortcut[] }) => {\n const isMediumUp = useBreakpoint(\"md\")\n const { value, onChangeRef } = useDateRangeContext()\n\n if (!isMediumUp \|\| !shortcuts?.length) {\n return null\n }\n\n return (\n <div className={s.Shortcuts}>\n {shortcuts.map((shortcut) => {\n const { label, getDateRange } = shortcut\n const range = getDateRange()\n const [start, end] = range\n const isActive = !!value && isSameDay(value[0], start) && isSameDay(value[1], end)\n\n return (\n <Button\n key={label}\n className=\"mb-1\"\n variant=\"ghost\"\n color=\"primary\"\n pill={false}\n size=\"md\"\n iconSize=\"sm\"\n block\n selected={isActive}\n onClick={() => onChangeRef.current(range, shortcut)}\n >\n <span className={s.ButtonText}>{label}</span>\n {isActive && <Check />}\n </Button>\n )\n })}\n </div>\n )\n}\n\nconst getLeftCalendarDate = (targetDate: DateTime, maxDate?: DateTime) => {\n if (!maxDate) {\n return targetDate\n }\n\n return isBefore(targetDate.endOf(\"month\"), maxDate) ? targetDate : targetDate.minus({ months: 1 })\n}\n"]}
1	+ {"version":3,"file":"Calendar.js","sourceRoot":"","sources":["../../../../src/components/DateRangePicker/Calendar.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport { DateTime, Interval } from \"luxon\"\nimport { useEffect, useMemo, useRef, useState, type KeyboardEvent } from \"react\"\nimport { useBreakpoint } from \"../../hooks/useBreakpoints\"\nimport { useStableCallback } from \"../../hooks/useStableCallback\"\nimport {\n chunkIntoWeeks,\n getDaysOfMonth,\n isAfter,\n isBefore,\n isSameDay,\n isToday,\n} from \"../../lib/dateUtils\"\nimport { waitForAnimationFrame } from \"../../lib/helpers\"\nimport { Button } from \"../Button\"\nimport { Check, ChevronLeft, ChevronRight } from \"../Icon\"\nimport { TransitionGroup } from \"../Transition\"\nimport s from \"@plexui/styles/components/DateRangePicker/Calendar.module.css\"\nimport { useDateRangeContext } from \"./context\"\nimport { type DateRange, type DateRangeShortcut } from \"./types\"\n\nconst CALENDAR_WIDTH_PX = 210\nconst CALENDAR_GAP_PX = 32\nconst STEP_DISTANCE_PX = CALENDAR_WIDTH_PX + CALENDAR_GAP_PX\n\n// The day a grid key moves to: a day, a week, the Sunday or Saturday of the\n// week (rows start on Sunday), or a month (Luxon clamps Jan 31 to Feb 28/29)\nconst getKeyTarget = (key: string, day: DateTime): DateTime \| null => {\n switch (key) {\n case \"ArrowLeft\":\n return day.minus({ days: 1 })\n case \"ArrowRight\":\n return day.plus({ days: 1 })\n case \"ArrowUp\":\n return day.minus({ days: 7 })\n case \"ArrowDown\":\n return day.plus({ days: 7 })\n case \"Home\":\n return day.minus({ days: day.weekday % 7 })\n case \"End\":\n return day.plus({ days: 6 - (day.weekday % 7) })\n case \"PageUp\":\n return day.minus({ months: 1 })\n case \"PageDown\":\n return day.plus({ months: 1 })\n default:\n return null\n }\n}\n\nconst monthIndex = (date: DateTime) => date.year * 12 + date.month\n\nexport const DateRangeCalendar = () => {\n const { value, min, max, maxRangeDays, onChangeRef } = useDateRangeContext()\n const isSmallUp = useBreakpoint(\"sm\")\n const calendarContainerRef = useRef<HTMLDivElement \| null>(null)\n // The day to focus once a key has moved the view to its month\n const pendingFocusRef = useRef<DateTime \| null>(null)\n const [selectionRange, setSelectionRange] = useState<DateRange \| null>(null)\n const [calendarSteps, setCalendarSteps] = useState<number>(0)\n const [forceRenderIncrement, setForceRenderIncrement] = useState<number>(0)\n const [leftCalendarDate, setLeftCalendarDate] = useState<DateTime>(() =>\n isSmallUp\n ? getLeftCalendarDate(value?.[0] ?? DateTime.now(), max)\n : value?.[0] ?? DateTime.now(),\n )\n\n const rightCalendarDate = isSmallUp\n ? leftCalendarDate.plus({ months: 1 }).startOf(\"month\")\n : leftCalendarDate.startOf(\"month\")\n\n const canGoBack = !min \|\| isBefore(min, leftCalendarDate.startOf(\"month\"))\n const canGoForward = !max \|\| isBefore(rightCalendarDate.endOf(\"month\"), max)\n\n const handleNext = () => {\n setCalendarSteps((c) => c + 1)\n setLeftCalendarDate((dt) => dt.plus({ months: 1 }))\n }\n\n const handlePrevious = () => {\n setCalendarSteps((c) => c - 1)\n setLeftCalendarDate((dt) => dt.minus({ months: 1 }))\n }\n\n const handleDateSelect = (selectedDate: DateTime) => {\n if (!selectionRange) {\n setSelectionRange([selectedDate, selectedDate])\n return\n }\n\n const [currentSelectionStartDate] = selectionRange\n\n // Selecting a date before the current selected start date moves the start date\n // but does not resolve the selection\n if (isBefore(selectedDate, currentSelectionStartDate)) {\n setSelectionRange([selectedDate, selectedDate])\n return\n }\n\n // Resolve the selection by emitting the value and clearing selection\n onChangeRef.current([currentSelectionStartDate, selectedDate])\n setSelectionRange(null)\n }\n\n const handleDateMouseEnter = (hoveredDate: DateTime) => {\n // If we're not actively selecting, no-op\n if (!selectionRange) {\n return\n }\n\n setSelectionRange((currentSelectionRange) => {\n // impossible due to the check above\n if (!currentSelectionRange) {\n return currentSelectionRange\n }\n\n const [currentStartDate] = currentSelectionRange\n\n // When hovering a date before the current date, don't change the selection range\n if (isBefore(hoveredDate, currentStartDate)) {\n return [currentStartDate, currentStartDate]\n }\n\n return [currentStartDate, hoveredDate]\n })\n }\n\n const handleCalendarMouseLeave = () => {\n // If we're not actively selecting, no-op\n if (!selectionRange) {\n return\n }\n\n setSelectionRange((currentSelectionRange) => {\n if (!currentSelectionRange) {\n return currentSelectionRange\n }\n\n // Reset the end selection\n const [currentStartDate] = currentSelectionRange\n return [currentStartDate, currentStartDate]\n })\n }\n\n // Days are named by their full date; skip calendars that are leaving\n const focusDay = (day: DateTime) => {\n const label = day.toLocaleString(DateTime.DATE_HUGE)\n const buttons = calendarContainerRef.current?.querySelectorAll<HTMLButtonElement>(\n `button[aria-label=\"${label}\"]`,\n )\n Array.from(buttons ?? [])\n .find((button) => !button.closest(\"[data-exiting]\"))\n ?.focus()\n }\n\n // A calendar that is leaving keeps the props it last rendered with, so its\n // days reach the current state through a stable callback\n const handleDayKeyDown = useStableCallback((event: KeyboardEvent, day: DateTime) => {\n if (event.altKey \|\| event.ctrlKey \|\| event.metaKey) {\n return\n }\n\n // While a move waits for its month to render, the next key starts from\n // the day it is moving to (key repeat), not the day that still has focus\n const target = getKeyTarget(event.key, pendingFocusRef.current ?? day)\n if (!target) {\n return\n }\n\n event.preventDefault()\n\n // A disabled day (outside min/max, or past maxRangeDays while selecting)\n // keeps focus where it is\n const rangeEndLimit =\n selectionRange && maxRangeDays != null\n ? selectionRange[0].plus({ days: maxRangeDays - 1 })\n : undefined\n if (\n (min && isBefore(target, min.startOf(\"day\"))) \|\|\n (max && isAfter(target, max.endOf(\"day\"))) \|\|\n (rangeEndLimit && isAfter(target, rangeEndLimit))\n ) {\n return\n }\n\n const monthsBefore = monthIndex(leftCalendarDate) - monthIndex(target)\n const monthsAfter = monthIndex(target) - monthIndex(rightCalendarDate)\n if (monthsBefore <= 0 && monthsAfter <= 0) {\n pendingFocusRef.current = null\n focusDay(target)\n return\n }\n\n // Step the view like the month buttons; a day within min/max keeps every step in bounds\n if (monthsAfter > 0 ? !canGoForward : !canGoBack) {\n return\n }\n\n pendingFocusRef.current = target\n for (let step = 0; step < Math.max(monthsBefore, monthsAfter); step++) {\n if (monthsAfter > 0) {\n handleNext()\n } else {\n handlePrevious()\n }\n }\n })\n\n const selectedDisplayValue = selectionRange \|\| value\n\n // Force re-renders when `value` changes out of brand from direct user-selection\n useEffect(() => {\n // When a new value is received, it could be out of band from the control of this calendar.\n // For example, a shortcut could be selected, or clear could be pressed. In either case, selection\n // should be reset so that the new `value` can be displayed fully.\n setSelectionRange(null)\n\n // Nothing else to do when value is empty\n if (!value) {\n return\n }\n\n // Check if `value` is still within view of our calendar\n const viewInterval = Interval.fromDateTimes(\n leftCalendarDate.startOf(\"month\"),\n rightCalendarDate.endOf(\"month\"),\n )\n const isValueInRangeOfCalendar =\n viewInterval.contains(value[0]) \|\| viewInterval.contains(value[1])\n if (!isValueInRangeOfCalendar) {\n // Reset state the calendar view entirely\n setSelectionRange(null)\n setCalendarSteps(0)\n setLeftCalendarDate(isSmallUp ? getLeftCalendarDate(value[0], max) : value[0])\n setForceRenderIncrement((c) => c + 1)\n }\n // eslint-disable-next-line react-hooks/exhaustive-deps -- Only re-run this hook when value changes\n }, [value])\n\n // Detect height changes when new calendars are rendered\n useEffect(() => {\n waitForAnimationFrame(() => {\n const container = calendarContainerRef.current\n\n if (!container) {\n return\n }\n\n let maxHeight = -Infinity\n\n // Find the tallest calendar\n container.querySelectorAll(\"[data-calendar]\")?.forEach((element) => {\n // NOTE: clientHeight does not respect the scale() that popover uses to animate in, which is what we want\n // We want to know the full height of the element, without any transform applied.\n const height = element.clientHeight\n\n // Ignore calendars that are exiting\n if (element.closest(\"[data-exiting]\")) {\n return\n }\n\n if (height > maxHeight) {\n maxHeight = height\n }\n })\n\n container.style.height = `${maxHeight}px`\n\n // Don't animate the initial height.\n // This is relevant when the calendar opens to a larger size than the default.\n if (!container.style.transition) {\n waitForAnimationFrame(() => {\n container.style.transition = `height 0.25s var(--cubic-move)`\n })\n }\n })\n }, [leftCalendarDate])\n\n // Focus a pending day once its month has rendered. New calendars mount\n // after this render (TransitionGroup), so wait a frame like the height does\n useEffect(() => {\n if (!pendingFocusRef.current) {\n return\n }\n\n return waitForAnimationFrame(() => {\n const target = pendingFocusRef.current\n pendingFocusRef.current = null\n if (target) {\n focusDay(target)\n }\n })\n // eslint-disable-next-line react-hooks/exhaustive-deps -- Only re-run this hook when the months change\n }, [leftCalendarDate])\n\n return (\n <div className={s.CalendarWrapper} key={`stable-view-${forceRenderIncrement}`}>\n <div\n ref={calendarContainerRef}\n className={s.CalendarContainer}\n onMouseLeave={handleCalendarMouseLeave}\n >\n <div className={s.Previous}>\n <Button\n variant=\"ghost\"\n color=\"secondary\"\n size=\"sm\"\n pill={false}\n gutterSize=\"2xs\"\n iconSize=\"sm\"\n onClick={handlePrevious}\n disabled={!canGoBack}\n aria-label=\"Previous month\"\n >\n <ChevronLeft />\n </Button>\n </div>\n <div className={s.Next}>\n <Button\n variant=\"ghost\"\n color=\"secondary\"\n size=\"sm\"\n pill={false}\n gutterSize=\"2xs\"\n iconSize=\"sm\"\n onClick={handleNext}\n disabled={!canGoForward}\n aria-label=\"Next month\"\n >\n <ChevronRight />\n </Button>\n </div>\n <div\n className={s.CalendarRange}\n style={{\n transform: `translate(${calendarSteps * -1 * STEP_DISTANCE_PX}px, 0)`,\n }}\n >\n <TransitionGroup enterDuration={400} exitDuration={400}>\n <CalendarView\n key={leftCalendarDate.toLocaleString({\n month: \"long\",\n year: \"numeric\",\n })}\n stepPosition={calendarSteps}\n date={leftCalendarDate}\n selectedDates={selectedDisplayValue}\n min={min}\n max={max}\n selectionStart={selectionRange?.[0]}\n maxRangeDays={maxRangeDays}\n isSelecting={!!selectionRange}\n onDateSelect={handleDateSelect}\n onDateMouseEnter={handleDateMouseEnter}\n onDayKeyDown={handleDayKeyDown}\n />\n {isSmallUp && (\n <CalendarView\n key={rightCalendarDate.toLocaleString({\n month: \"long\",\n year: \"numeric\",\n })}\n stepPosition={calendarSteps + 1}\n date={rightCalendarDate}\n selectedDates={selectedDisplayValue}\n min={min}\n max={max}\n selectionStart={selectionRange?.[0]}\n maxRangeDays={maxRangeDays}\n isSelecting={!!selectionRange}\n onDateSelect={handleDateSelect}\n onDateMouseEnter={handleDateMouseEnter}\n onDayKeyDown={handleDayKeyDown}\n />\n )}\n </TransitionGroup>\n </div>\n </div>\n </div>\n )\n}\n\ntype CalendarViewProps = {\n // Can be any day within the given month that the calendar should render for\n date: DateTime\n selectedDates?: DateRange \| null\n onDateSelect?: (dt: DateTime) => void\n onDateMouseEnter?: (dt: DateTime) => void\n onDayKeyDown?: (event: KeyboardEvent<HTMLButtonElement>, dt: DateTime) => void\n min?: DateTime\n max?: DateTime\n selectionStart?: DateTime \| null\n maxRangeDays?: number\n isSelecting?: boolean\n stepPosition: number\n}\n\nconst daysOfTheWeekLabels = [\"Su\", \"Mo\", \"Tu\", \"We\", \"Th\", \"Fr\", \"Sa\"]\n\nconst CalendarView = ({\n date,\n selectedDates,\n min,\n max,\n selectionStart,\n maxRangeDays,\n isSelecting,\n onDateSelect,\n onDateMouseEnter,\n onDayKeyDown,\n stepPosition,\n}: CalendarViewProps) => {\n // Lock position on mount and don't respond to changes\n const [position] = useState(stepPosition)\n const { startOfMonth, weeks, enabledInterval } = useMemo(() => {\n const monthStart = date.startOf(\"month\")\n const endOfMonth = date.endOf(\"month\")\n\n const daysBeforeMonthStart = monthStart.weekday % 7\n const blankDays = new Array(daysBeforeMonthStart).fill(null)\n const daysInMonth = getDaysOfMonth(monthStart)\n const calendarCells = [...blankDays, ...daysInMonth]\n\n // Cells are start-of-day values and Interval excludes its end, so widen the\n // bounds to whole days: min/max days themselves stay selectable.\n const enabledDateInterval = Interval.fromDateTimes(\n (min \|\| monthStart).startOf(\"day\"),\n (max \|\| endOfMonth).endOf(\"day\"),\n )\n\n return {\n startOfMonth: monthStart,\n endOfMonth,\n weeks: chunkIntoWeeks(calendarCells, 7),\n enabledInterval: enabledDateInterval,\n }\n }, [date, min, max])\n\n const [selectedStart, selectedEnd] = selectedDates \|\| []\n const rangeEndLimit =\n selectionStart && maxRangeDays != null\n ? selectionStart.plus({ days: maxRangeDays - 1 })\n : undefined\n\n const selectedInterval = useMemo<Interval \| null>(() => {\n if (!selectedStart \|\| !selectedEnd) {\n return null\n }\n\n return Interval.fromDateTimes(selectedStart.startOf(\"day\"), selectedEnd.endOf(\"day\"))\n }, [selectedStart, selectedEnd])\n\n return (\n <div className={s.Calendar} style={{ left: position * STEP_DISTANCE_PX }} data-calendar>\n <p className={s.MonthLabel}>\n {startOfMonth.monthLong} {startOfMonth.year}\n </p>\n <div className={s.Week}>\n {daysOfTheWeekLabels.map((day) => (\n <div key={day} className={s.DayLabel}>\n {day}\n </div>\n ))}\n </div>\n {weeks.map((week, weekIndex) => (\n <div className={s.Week} key={weekIndex}>\n {week.map((d, dayIndex) => {\n if (!d) {\n return <div className={s.Day} key={`${weekIndex}-${dayIndex}`} />\n }\n\n // Check if 'day' is within selected range\n const enabled =\n enabledInterval.contains(d) &&\n !(isSelecting && rangeEndLimit && isAfter(d, rangeEndLimit))\n const isStart = enabled && selectedStart && isSameDay(d, selectedStart)\n const isEnd = enabled && selectedEnd && isSameDay(d, selectedEnd)\n const hasRange = selectedStart && selectedEnd && !isSameDay(selectedStart, selectedEnd)\n const isInRange = hasRange && selectedInterval?.contains(d)\n const dayIsToday = isToday(d)\n const isFirstRangeTrail =\n d.day === 1 &&\n // Trail doesn't make sense to display at the start of the week (Monday)\n d.weekday !== 7 &&\n isInRange &&\n !isStart\n const isLastRangeTrail =\n d.day === d.daysInMonth &&\n // Trail doesn't make sense to display at the end of the week (Saturday)\n d.weekday !== 6 &&\n isInRange &&\n !isEnd\n\n return (\n <div\n className={s.Day}\n key={dayIndex}\n data-is-start={isStart ? \"\" : undefined}\n data-is-end={isEnd ? \"\" : undefined}\n data-is-in-range={isInRange ? \"\" : undefined}\n data-is-first-range-trail={isFirstRangeTrail ? \"\" : undefined}\n data-is-last-range-trail={isLastRangeTrail ? \"\" : undefined}\n >\n {/* The full date names the day, which \"15\" alone does not across months */}\n <button\n className={s.InteractiveDay}\n disabled={!enabled}\n aria-label={d.toLocaleString(DateTime.DATE_HUGE)}\n aria-pressed={!!(isStart \|\| isEnd \|\| isInRange)}\n aria-current={dayIsToday ? \"date\" : undefined}\n onClick={() => d && onDateSelect?.(d)}\n onMouseEnter={() => d && onDateMouseEnter?.(d)}\n onKeyDown={(event) => d && onDayKeyDown?.(event, d)}\n >\n {d.day}\n {dayIsToday && <span className={s.TodayDot} />}\n </button>\n </div>\n )\n })}\n </div>\n ))}\n </div>\n )\n}\n\nexport const DateRangeShortcuts = ({ shortcuts }: { shortcuts?: DateRangeShortcut[] }) => {\n const isMediumUp = useBreakpoint(\"md\")\n const { value, min, max, maxRangeDays, onChangeRef } = useDateRangeContext()\n\n if (!isMediumUp \|\| !shortcuts?.length) {\n return null\n }\n\n return (\n <div className={s.Shortcuts}>\n {shortcuts.map((shortcut) => {\n const { label, getDateRange } = shortcut\n const range = getDateRange()\n const [start, end] = range\n const isActive = !!value && isSameDay(value[0], start) && isSameDay(value[1], end)\n\n return (\n <Button\n key={label}\n className=\"mb-1\"\n variant=\"ghost\"\n color=\"primary\"\n pill={false}\n size=\"md\"\n iconSize=\"sm\"\n block\n selected={isActive}\n disabled={!isRangeWithinLimits(range, min, max, maxRangeDays)}\n onClick={() => onChangeRef.current(range, shortcut)}\n >\n <span className={s.ButtonText}>{label}</span>\n {isActive && <Check />}\n </Button>\n )\n })}\n </div>\n )\n}\n\n// A shortcut follows the calendar's limits: whole days from min to max, and\n// no more than maxRangeDays days\nconst isRangeWithinLimits = (\n [start, end]: DateRange,\n min?: DateTime,\n max?: DateTime,\n maxRangeDays?: number,\n) =>\n !(min && isBefore(start, min.startOf(\"day\"))) &&\n !(max && isAfter(end, max.endOf(\"day\"))) &&\n !(\n maxRangeDays != null &&\n isAfter(end.startOf(\"day\"), start.startOf(\"day\").plus({ days: maxRangeDays - 1 }))\n )\n\nconst getLeftCalendarDate = (targetDate: DateTime, maxDate?: DateTime) => {\n if (!maxDate) {\n return targetDate\n }\n\n return isBefore(targetDate.endOf(\"month\"), maxDate) ? targetDate : targetDate.minus({ months: 1 })\n}\n"]}

package/dist/es/components/DateRangePicker/DateRangePicker.js CHANGED Viewed

@@ -2,17 +2,18 @@
 import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import { DateTime } from "luxon";
 import { useMemo } from "react";
-import { useLatestValue } from "../../hooks/useLatestValue";
-import { isBefore } from "../../lib/dateUtils";
-import { Popover } from "../Popover";
-import { DateRangeCalendar, DateRangeShortcuts } from "./Calendar";
-import { DateRangeContext } from "./context";
-import { DateRangeTrigger } from "./Trigger";
-import {} from "./types";
+import { useLatestValue } from "../../hooks/useLatestValue.js";
+import { isAfter } from "../../lib/dateUtils.js";
+import { Popover } from "../Popover/index.js";
+import { DateRangeCalendar, DateRangeShortcuts } from "./Calendar.js";
+import { DateRangeContext } from "./context.js";
+import { DateRangeTrigger } from "./Trigger.js";
+import {} from "./types.js";
 export const DateRangePicker = (props) => {
     const { value, onChange, min, max, maxRangeDays, shortcuts, side = "bottom", sideOffset = 8, align = "center", alignOffset, variant = "outline", size = "md", clearable = false, disabled = false, dropdownIconType, placeholder = "Select date range...", pill = true, block = false, triggerStepperUnit, triggerClassName, triggerShowIcon = true, triggerDateFormat = "MM/dd/yy", } = props;
-    if (min && max && !isBefore(min, max)) {
-        throw new Error("DateRangePicker error: `min` date must be before the `max` date");
+    // min and max are inclusive, so equal bounds allow one date
+    if (min && max && isAfter(min, max)) {
+        throw new Error("DateRangePicker error: `min` date must not be after the `max` date");
     }
     // Create stable, mutable references to avoid memoization requirements from consumers
     const onChangeRef = useLatestValue(onChange);

package/dist/es/components/DateRangePicker/DateRangePicker.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"DateRangePicker.js","sourceRoot":"","sources":["../../../../src/components/DateRangePicker/DateRangePicker.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAChC,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAC3D,OAAO,EAAE,~~QAAQ~~,EAAE,MAAM,qBAAqB,CAAA;~~AAC9C~~,OAAO,EAAE,OAAO,EAA4B,MAAM,YAAY,CAAA;AAE9D,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAA;AAClE,OAAO,EAAE,gBAAgB,EAA8B,MAAM,WAAW,CAAA;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAC5C,OAAO,EAA0C,MAAM,SAAS,CAAA;AAkHhE,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAE,EAAE;IAC7D,MAAM,EACJ,KAAK,EACL,QAAQ,EACR,GAAG,EACH,GAAG,EACH,YAAY,EACZ,SAAS,EACT,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,CAAC,EACd,KAAK,GAAG,QAAQ,EAChB,WAAW,EACX,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,IAAI,EACX,SAAS,GAAG,KAAK,EACjB,QAAQ,GAAG,KAAK,EAChB,gBAAgB,EAChB,WAAW,GAAG,sBAAsB,EACpC,IAAI,GAAG,IAAI,EACX,KAAK,GAAG,KAAK,EACb,kBAAkB,EAClB,gBAAgB,EAChB,eAAe,GAAG,IAAI,EACtB,iBAAiB,GAAG,UAAU,GAC/B,GAAG,KAAK,CAAA;IAET,IAAI,GAAG,IAAI,GAAG,IAAI,~~CAAC~~,~~QAAQ,~~CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC;~~QACtC~~,MAAM,IAAI,KAAK,CAAC,~~iEAAiE~~,CAAC,CAAA;~~IACpF~~,CAAC;IAED,qFAAqF;IACrF,MAAM,WAAW,GAAG,cAAc,CAAC,QAAQ,CAAC,CAAA;IAE5C,MAAM,KAAK,GAAG,OAAO,CACnB,GAAG,EAAE,CAAC,CAAC;QACL,KAAK;QACL,GAAG;QACH,GAAG;QACH,YAAY;QACZ,OAAO;QACP,IAAI;QACJ,gBAAgB;QAChB,SAAS;QACT,QAAQ;QACR,WAAW;QACX,KAAK;QACL,IAAI;QACJ,SAAS;QACT,kBAAkB;QAClB,gBAAgB;QAChB,eAAe;QACf,iBAAiB;QACjB,WAAW;KACZ,CAAC,EACF;QACE,KAAK;QACL,GAAG;QACH,GAAG;QACH,YAAY;QACZ,OAAO;QACP,IAAI;QACJ,gBAAgB;QAChB,SAAS;QACT,QAAQ;QACR,WAAW;QACX,KAAK;QACL,IAAI;QACJ,SAAS;QACT,kBAAkB;QAClB,gBAAgB;QAChB,eAAe;QACf,iBAAiB;QACjB,WAAW;KACZ,CACF,CAAA;IAED,OAAO,CACL,KAAC,gBAAgB,IAAC,KAAK,EAAE,KAAK,YAC5B,MAAC,OAAO,eACN,KAAC,OAAO,CAAC,OAAO,cACd,KAAC,gBAAgB,KAAG,GACJ,EAClB,KAAC,OAAO,CAAC,OAAO,IACd,QAAQ,EAAE,GAAG,EACb,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,IAAI,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAEzD,eAAK,SAAS,EAAC,MAAM,aACnB,KAAC,kBAAkB,IAAC,SAAS,EAAE,SAAS,GAAI,EAC5C,KAAC,iBAAiB,KAAG,IACjB,GACU,IACV,GACO,CACpB,CAAA;AACH,CAAC,CAAA","sourcesContent":["\"use client\"\n\nimport { DateTime } from \"luxon\"\nimport { useMemo } from \"react\"\nimport { useLatestValue } from \"../../hooks/useLatestValue\"\nimport { ~~isBefore~~ } from \"../../lib/dateUtils\"\nimport { Popover, type PopoverContentProps } from \"../Popover\"\nimport type { SelectControlProps } from \"../SelectControl\"\nimport { DateRangeCalendar, DateRangeShortcuts } from \"./Calendar\"\nimport { DateRangeContext, type DateRangeContextValue } from \"./context\"\nimport { DateRangeTrigger } from \"./Trigger\"\nimport { type DateRange, type DateRangeShortcut } from \"./types\"\n\nexport type DateRangePickerProps = {\n /*\n The selected date range value.\n /\n value: DateRange \| null\n /\n Handler that is triggered when the date range changes.\n /\n onChange: (nextValue: DateRange \| null, shortcut?: DateRangeShortcut) => void\n /\n Defines the earliest selectable date (inclusive).\n /\n min?: DateTime\n /\n Defines the latest selectable date (inclusive).\n /\n max?: DateTime\n /\n Maximum length of the selectable range in days (inclusive).\n * When set, the end date cannot be more than this many days after the start date.\n /\n maxRangeDays?: number\n /\n List of date range shortcuts displayed for quick selection, shown to the left of the calendar.\n /\n shortcuts?: DateRangeShortcut[]\n /\n The preferred side of the trigger to render against when open. Will be reversed when collisions occur.\n * @default bottom\n /\n side?: PopoverContentProps[\"side\"]\n /\n The distance in pixels from the trigger.\n * @default 8\n /\n sideOffset?: PopoverContentProps[\"sideOffset\"]\n /\n The preferred alignment against the trigger. May change when collisions occur.\n * @default center\n /\n align?: PopoverContentProps[\"align\"]\n /\n An offset in pixels from the \"start\" or \"end\" alignment options.\n * @default 0\n /\n alignOffset?: PopoverContentProps[\"alignOffset\"]\n\n /\n Disables the select visually and from interactions\n * @default false\n /\n disabled?: boolean\n /\n Placeholder text for the select\n * @default Select date range...\n /\n placeholder?: string\n /\n Style variant for the select trigger\n * @default outline\n /\n variant?: SelectControlProps[\"variant\"]\n /\n Determines if the select trigger should be a fully rounded pill shape\n * @default ~~false~~\n /\n pill?: boolean\n /\n Determines size of the size and spacing of the control.\n \n \| 3xs \| 2xs \| xs \| sm \| md \| lg \| xl \| 2xl \| 3xl \|\n * \| ------- \| ------- \| ------- \| ------- \| ------- \| ------- \| ------- \| ------- \| ------- \|\n * \| `22px` \| `24px` \| `26px` \| `28px` \| `32px` \| `36px` \| `40px` \| `44px` \| `48px` \|\n * @default md\n /\n size?: SelectControlProps[\"size\"]\n /\n Icon displayed in the far right of the select trigger\n * @default dropdown\n /\n dropdownIconType?: SelectControlProps[\"dropdownIconType\"]\n /\n Custom class applied to the select trigger\n /\n triggerClassName?: string\n /\n Display calendar icon at the start of the trigger\n * @default true\n /\n triggerShowIcon?: boolean\n /\n Allows the trigger to display as a stepper when the selected date matches the unit.\n * Currently 'month' is the only supported unit.\n /\n triggerStepperUnit?: \"month\"\n /\n Format of dates displayed in the trigger\n * @default \"MM/dd/yy\"\n /\n triggerDateFormat?: string\n /\n Display a clear action that allows the select to be unset.\n * @default false\n /\n clearable?: boolean\n /\n Extends select to 100% of available width.\n * @default ~~true~~\n */\n block?: boolean\n}\n\nexport const DateRangePicker = (props: DateRangePickerProps) => {\n const {\n value,\n onChange,\n min,\n max,\n maxRangeDays,\n shortcuts,\n side = \"bottom\",\n sideOffset = 8,\n align = \"center\",\n alignOffset,\n variant = \"outline\",\n size = \"md\",\n clearable = false,\n disabled = false,\n dropdownIconType,\n placeholder = \"Select date range...\",\n pill = true,\n block = false,\n triggerStepperUnit,\n triggerClassName,\n triggerShowIcon = true,\n triggerDateFormat = \"MM/dd/yy\",\n } = props\n\n if (min && max && ~~!isBefore~~(min, max)) {\n throw new Error(\"DateRangePicker error: `min` date must be ~~before~~ the `max` date\")\n }\n\n // Create stable, mutable references to avoid memoization requirements from consumers\n const onChangeRef = useLatestValue(onChange)\n\n const store = useMemo<DateRangeContextValue>(\n () => ({\n value,\n min,\n max,\n maxRangeDays,\n variant,\n size,\n dropdownIconType,\n clearable,\n disabled,\n placeholder,\n block,\n pill,\n shortcuts,\n triggerStepperUnit,\n triggerClassName,\n triggerShowIcon,\n triggerDateFormat,\n onChangeRef,\n }),\n [\n value,\n min,\n max,\n maxRangeDays,\n variant,\n size,\n dropdownIconType,\n clearable,\n disabled,\n placeholder,\n block,\n pill,\n shortcuts,\n triggerStepperUnit,\n triggerClassName,\n triggerShowIcon,\n triggerDateFormat,\n onChangeRef,\n ],\n )\n\n return (\n <DateRangeContext value={store}>\n <Popover>\n <Popover.Trigger>\n <DateRangeTrigger />\n </Popover.Trigger>\n <Popover.Content\n minWidth={230}\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset ?? (align === \"center\" ? 0 : -5)}\n >\n <div className=\"flex\">\n <DateRangeShortcuts shortcuts={shortcuts} />\n <DateRangeCalendar />\n </div>\n </Popover.Content>\n </Popover>\n </DateRangeContext>\n )\n}\n"]}
1	+ {"version":3,"file":"DateRangePicker.js","sourceRoot":"","sources":["../../../../src/components/DateRangePicker/DateRangePicker.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,EAAE,QAAQ,EAAE,MAAM,OAAO,CAAA;AAChC,OAAO,EAAE,OAAO,EAAE,MAAM,OAAO,CAAA;AAC/B,OAAO,EAAE,cAAc,EAAE,MAAM,4BAA4B,CAAA;AAC3D,OAAO,EAAE,OAAO,EAAE,MAAM,qBAAqB,CAAA;AAC7C,OAAO,EAAE,OAAO,EAA4B,MAAM,YAAY,CAAA;AAE9D,OAAO,EAAE,iBAAiB,EAAE,kBAAkB,EAAE,MAAM,YAAY,CAAA;AAClE,OAAO,EAAE,gBAAgB,EAA8B,MAAM,WAAW,CAAA;AACxE,OAAO,EAAE,gBAAgB,EAAE,MAAM,WAAW,CAAA;AAC5C,OAAO,EAA0C,MAAM,SAAS,CAAA;AAkHhE,MAAM,CAAC,MAAM,eAAe,GAAG,CAAC,KAA2B,EAAE,EAAE;IAC7D,MAAM,EACJ,KAAK,EACL,QAAQ,EACR,GAAG,EACH,GAAG,EACH,YAAY,EACZ,SAAS,EACT,IAAI,GAAG,QAAQ,EACf,UAAU,GAAG,CAAC,EACd,KAAK,GAAG,QAAQ,EAChB,WAAW,EACX,OAAO,GAAG,SAAS,EACnB,IAAI,GAAG,IAAI,EACX,SAAS,GAAG,KAAK,EACjB,QAAQ,GAAG,KAAK,EAChB,gBAAgB,EAChB,WAAW,GAAG,sBAAsB,EACpC,IAAI,GAAG,IAAI,EACX,KAAK,GAAG,KAAK,EACb,kBAAkB,EAClB,gBAAgB,EAChB,eAAe,GAAG,IAAI,EACtB,iBAAiB,GAAG,UAAU,GAC/B,GAAG,KAAK,CAAA;IAET,4DAA4D;IAC5D,IAAI,GAAG,IAAI,GAAG,IAAI,OAAO,CAAC,GAAG,EAAE,GAAG,CAAC,EAAE,CAAC;QACpC,MAAM,IAAI,KAAK,CAAC,oEAAoE,CAAC,CAAA;IACvF,CAAC;IAED,qFAAqF;IACrF,MAAM,WAAW,GAAG,cAAc,CAAC,QAAQ,CAAC,CAAA;IAE5C,MAAM,KAAK,GAAG,OAAO,CACnB,GAAG,EAAE,CAAC,CAAC;QACL,KAAK;QACL,GAAG;QACH,GAAG;QACH,YAAY;QACZ,OAAO;QACP,IAAI;QACJ,gBAAgB;QAChB,SAAS;QACT,QAAQ;QACR,WAAW;QACX,KAAK;QACL,IAAI;QACJ,SAAS;QACT,kBAAkB;QAClB,gBAAgB;QAChB,eAAe;QACf,iBAAiB;QACjB,WAAW;KACZ,CAAC,EACF;QACE,KAAK;QACL,GAAG;QACH,GAAG;QACH,YAAY;QACZ,OAAO;QACP,IAAI;QACJ,gBAAgB;QAChB,SAAS;QACT,QAAQ;QACR,WAAW;QACX,KAAK;QACL,IAAI;QACJ,SAAS;QACT,kBAAkB;QAClB,gBAAgB;QAChB,eAAe;QACf,iBAAiB;QACjB,WAAW;KACZ,CACF,CAAA;IAED,OAAO,CACL,KAAC,gBAAgB,IAAC,KAAK,EAAE,KAAK,YAC5B,MAAC,OAAO,eACN,KAAC,OAAO,CAAC,OAAO,cACd,KAAC,gBAAgB,KAAG,GACJ,EAClB,KAAC,OAAO,CAAC,OAAO,IACd,QAAQ,EAAE,GAAG,EACb,IAAI,EAAE,IAAI,EACV,UAAU,EAAE,UAAU,EACtB,KAAK,EAAE,KAAK,EACZ,WAAW,EAAE,WAAW,IAAI,CAAC,KAAK,KAAK,QAAQ,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,YAEzD,eAAK,SAAS,EAAC,MAAM,aACnB,KAAC,kBAAkB,IAAC,SAAS,EAAE,SAAS,GAAI,EAC5C,KAAC,iBAAiB,KAAG,IACjB,GACU,IACV,GACO,CACpB,CAAA;AACH,CAAC,CAAA","sourcesContent":["\"use client\"\n\nimport { DateTime } from \"luxon\"\nimport { useMemo } from \"react\"\nimport { useLatestValue } from \"../../hooks/useLatestValue\"\nimport { isAfter } from \"../../lib/dateUtils\"\nimport { Popover, type PopoverContentProps } from \"../Popover\"\nimport type { SelectControlProps } from \"../SelectControl\"\nimport { DateRangeCalendar, DateRangeShortcuts } from \"./Calendar\"\nimport { DateRangeContext, type DateRangeContextValue } from \"./context\"\nimport { DateRangeTrigger } from \"./Trigger\"\nimport { type DateRange, type DateRangeShortcut } from \"./types\"\n\nexport type DateRangePickerProps = {\n /*\n The selected date range value.\n /\n value: DateRange \| null\n /\n Handler that is triggered when the date range changes.\n /\n onChange: (nextValue: DateRange \| null, shortcut?: DateRangeShortcut) => void\n /\n Defines the earliest selectable date (inclusive).\n /\n min?: DateTime\n /\n Defines the latest selectable date (inclusive).\n /\n max?: DateTime\n /\n Maximum length of the selectable range in days (inclusive).\n * When set, the end date cannot be more than this many days after the start date.\n /\n maxRangeDays?: number\n /\n List of date range shortcuts displayed for quick selection, shown to the left of the calendar.\n /\n shortcuts?: DateRangeShortcut[]\n /\n The preferred side of the trigger to render against when open. Will be reversed when collisions occur.\n * @default bottom\n /\n side?: PopoverContentProps[\"side\"]\n /\n The distance in pixels from the trigger.\n * @default 8\n /\n sideOffset?: PopoverContentProps[\"sideOffset\"]\n /\n The preferred alignment against the trigger. May change when collisions occur.\n * @default center\n /\n align?: PopoverContentProps[\"align\"]\n /\n An offset in pixels from the \"start\" or \"end\" alignment options.\n * @default 0\n /\n alignOffset?: PopoverContentProps[\"alignOffset\"]\n\n /\n Disables the select visually and from interactions\n * @default false\n /\n disabled?: boolean\n /\n Placeholder text for the select\n * @default Select date range...\n /\n placeholder?: string\n /\n Style variant for the select trigger\n * @default outline\n /\n variant?: SelectControlProps[\"variant\"]\n /\n Determines if the select trigger should be a fully rounded pill shape\n * @default true\n /\n pill?: boolean\n /\n Determines size of the size and spacing of the control.\n \n \| 3xs \| 2xs \| xs \| sm \| md \| lg \| xl \| 2xl \| 3xl \|\n * \| ------- \| ------- \| ------- \| ------- \| ------- \| ------- \| ------- \| ------- \| ------- \|\n * \| `22px` \| `24px` \| `26px` \| `28px` \| `32px` \| `36px` \| `40px` \| `44px` \| `48px` \|\n * @default md\n /\n size?: SelectControlProps[\"size\"]\n /\n Icon displayed in the far right of the select trigger\n * @default dropdown\n /\n dropdownIconType?: SelectControlProps[\"dropdownIconType\"]\n /\n Custom class applied to the select trigger\n /\n triggerClassName?: string\n /\n Display calendar icon at the start of the trigger\n * @default true\n /\n triggerShowIcon?: boolean\n /\n Allows the trigger to display as a stepper when the selected date matches the unit.\n * Currently 'month' is the only supported unit.\n /\n triggerStepperUnit?: \"month\"\n /\n Format of dates displayed in the trigger\n * @default \"MM/dd/yy\"\n /\n triggerDateFormat?: string\n /\n Display a clear action that allows the select to be unset.\n * @default false\n /\n clearable?: boolean\n /\n Extends select to 100% of available width.\n * @default false\n */\n block?: boolean\n}\n\nexport const DateRangePicker = (props: DateRangePickerProps) => {\n const {\n value,\n onChange,\n min,\n max,\n maxRangeDays,\n shortcuts,\n side = \"bottom\",\n sideOffset = 8,\n align = \"center\",\n alignOffset,\n variant = \"outline\",\n size = \"md\",\n clearable = false,\n disabled = false,\n dropdownIconType,\n placeholder = \"Select date range...\",\n pill = true,\n block = false,\n triggerStepperUnit,\n triggerClassName,\n triggerShowIcon = true,\n triggerDateFormat = \"MM/dd/yy\",\n } = props\n\n // min and max are inclusive, so equal bounds allow one date\n if (min && max && isAfter(min, max)) {\n throw new Error(\"DateRangePicker error: `min` date must not be after the `max` date\")\n }\n\n // Create stable, mutable references to avoid memoization requirements from consumers\n const onChangeRef = useLatestValue(onChange)\n\n const store = useMemo<DateRangeContextValue>(\n () => ({\n value,\n min,\n max,\n maxRangeDays,\n variant,\n size,\n dropdownIconType,\n clearable,\n disabled,\n placeholder,\n block,\n pill,\n shortcuts,\n triggerStepperUnit,\n triggerClassName,\n triggerShowIcon,\n triggerDateFormat,\n onChangeRef,\n }),\n [\n value,\n min,\n max,\n maxRangeDays,\n variant,\n size,\n dropdownIconType,\n clearable,\n disabled,\n placeholder,\n block,\n pill,\n shortcuts,\n triggerStepperUnit,\n triggerClassName,\n triggerShowIcon,\n triggerDateFormat,\n onChangeRef,\n ],\n )\n\n return (\n <DateRangeContext value={store}>\n <Popover>\n <Popover.Trigger>\n <DateRangeTrigger />\n </Popover.Trigger>\n <Popover.Content\n minWidth={230}\n side={side}\n sideOffset={sideOffset}\n align={align}\n alignOffset={alignOffset ?? (align === \"center\" ? 0 : -5)}\n >\n <div className=\"flex\">\n <DateRangeShortcuts shortcuts={shortcuts} />\n <DateRangeCalendar />\n </div>\n </Popover.Content>\n </Popover>\n </DateRangeContext>\n )\n}\n"]}

package/dist/es/components/DateRangePicker/Trigger.js CHANGED Viewed

@@ -2,13 +2,13 @@
 import { jsx as _jsx, jsxs as _jsxs, Fragment as _Fragment } from "react/jsx-runtime";
 import clsx from "clsx";
 import { useMemo } from "react";
-import { getMonthStartAndEnd, isBefore, isSameDay } from "../../lib/dateUtils";
-import { Button } from "../Button";
-import { Calendar, ChevronLeft, ChevronRight } from "../Icon";
-import { SelectControl } from "../SelectControl";
-import s from "./Trigger.module.css";
-import { useDateRangeContext } from "./context";
-import {} from "./types";
+import { getMonthStartAndEnd, isBefore, isSameDay } from "../../lib/dateUtils.js";
+import { Button } from "../Button/index.js";
+import { Calendar, ChevronLeft, ChevronRight } from "../Icon/index.js";
+import { SelectControl } from "../SelectControl/index.js";
+import s from "@plexui/styles/components/DateRangePicker/Trigger.module.css";
+import { useDateRangeContext } from "./context.js";
+import {} from "./types.js";
 export const DateRangeTrigger = (props) => {
     const { value, min, max, disabled, variant, pill, size, block, triggerStepperUnit, triggerClassName, clearable, dropdownIconType, triggerShowIcon, onChangeRef, } = useDateRangeContext();
     const isStepperView = useMemo(() => rangeMatchesStepperUnit(value, triggerStepperUnit, {
@@ -28,10 +28,13 @@ const TriggerStepperView = () => {
     const [startDate, endDate] = value;
     const canGoBack = !min || isBefore(min, startDate.startOf("month"));
     const canGoForward = !max || isBefore(endDate.endOf("month"), max);
-    return (_jsxs("span", { className: s.StepperContent, children: [_jsx(Button, { className: s.StepperPrevious, color: "secondary", variant: "ghost", disabled: disabled || !canGoBack, size: "3xs", uniform: true, pill: pill, onPointerDown: (evt) => {
+    return (_jsxs("span", { className: s.StepperContent, children: [_jsx(Button, { className: s.StepperPrevious, color: "secondary", variant: "ghost", disabled: disabled || !canGoBack, size: "3xs", uniform: true, pill: pill, "aria-label": "Previous month",
+                // Stop the trigger from opening; the step itself runs on click so
+                // Enter and Space work too
+                onPointerDown: (evt) => evt.stopPropagation(), onClick: (evt) => {
                     evt.stopPropagation();
                     onChangeRef.current(getMonthStartAndEnd(startDate.minus({ months: 1 }), { min, max }));
-                }, children: _jsx(ChevronLeft, {}) }), _jsxs("span", { className: s.StepperText, children: [startDate.monthLong, " ", startDate.year] }), _jsx(Button, { className: s.StepperNext, color: "secondary", variant: "ghost", disabled: disabled || !canGoForward, size: "3xs", uniform: true, pill: pill, onPointerDown: (evt) => {
+                }, children: _jsx(ChevronLeft, {}) }), _jsxs("span", { className: s.StepperText, children: [startDate.monthLong, " ", startDate.year] }), _jsx(Button, { className: s.StepperNext, color: "secondary", variant: "ghost", disabled: disabled || !canGoForward, size: "3xs", uniform: true, pill: pill, "aria-label": "Next month", onPointerDown: (evt) => evt.stopPropagation(), onClick: (evt) => {
                     evt.stopPropagation();
                     onChangeRef.current(getMonthStartAndEnd(startDate.plus({ months: 1 }), { min, max }));
                 }, children: _jsx(ChevronRight, {}) })] }));

package/dist/es/components/DateRangePicker/Trigger.js.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"Trigger.js","sourceRoot":"","sources":["../../../../src/components/DateRangePicker/Trigger.tsx"],"names":[],"mappings":"AAAA,YAAY,CAAA;;AAEZ,OAAO,IAAI,MAAM,MAAM,CAAA;AAEvB,OAAO,EAAE,OAAO,EAAuB,MAAM,OAAO,CAAA;AACpD,OAAO,EAAE,mBAAmB,EAAE,QAAQ,EAAE,SAAS,EAAE,MAAM,qBAAqB,CAAA;AAC9E,OAAO,EAAE,MAAM,EAAE,MAAM,WAAW,CAAA;AAClC,OAAO,EAAE,QAAQ,EAAE,WAAW,EAAE,YAAY,EAAE,MAAM,SAAS,CAAA;AAC7D,OAAO,EAAE,aAAa,EAAE,MAAM,kBAAkB,CAAA;AAChD,OAAO,CAAC,MAAM,~~sBAAsB~~,CAAA;~~AACpC~~,OAAO,EAAE,mBAAmB,EAAE,MAAM,WAAW,CAAA;AAC/C,OAAO,EAA0C,MAAM,SAAS,CAAA;AAEhE,MAAM,CAAC,MAAM,gBAAgB,GAAG,CAAC,KAA6B,EAAE,EAAE;IAChE,MAAM,EACJ,KAAK,EACL,GAAG,EACH,GAAG,EACH,QAAQ,EACR,OAAO,EACP,IAAI,EACJ,IAAI,EACJ,KAAK,EACL,kBAAkB,EAClB,gBAAgB,EAChB,SAAS,EACT,gBAAgB,EAChB,eAAe,EACf,WAAW,GACZ,GAAG,mBAAmB,EAAE,CAAA;IAEzB,MAAM,aAAa,GAAG,OAAO,CAC3B,GAAG,EAAE,CACH,uBAAuB,CAAC,KAAK,EAAE,kBAAkB,EAAE;QACjD,GAAG;QACH,GAAG;KACJ,CAAC,EACJ,CAAC,KAAK,EAAE,kBAAkB,EAAE,GAAG,EAAE,GAAG,CAAC,CACtC,CAAA;IAED,MAAM,gBAAgB,GAAG,GAAG,EAAE;QAC5B,WAAW,CAAC,OAAO,CAAC,IAAI,CAAC,CAAA;IAC3B,CAAC,CAAA;IAED,OAAO,CACL,KAAC,aAAa,IACZ,SAAS,EAAE,IAAI,CAAC,aAAa,IAAI,CAAC,CAAC,cAAc,EAAE,gBAAgB,CAAC,EACpE,QAAQ,EAAE,CAAC,CAAC,KAAK,EACjB,OAAO,EAAE,OAAO,EAChB,IAAI,EAAE,IAAI,EACV,KAAK,EAAE,KAAK,EACZ,IAAI,EAAE,IAAI,EACV,QAAQ,EAAE,QAAQ,EAClB,SAAS,EAAE,eAAe,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC,CAAC,SAAS,EACnE,gBAAgB,EAAE,CAAC,aAAa,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,MAAM,EAC5D,YAAY,EAAE,SAAS,IAAI,CAAC,aAAa,CAAC,CAAC,CAAC,gBAAgB,CAAC,CAAC,CAAC,SAAS,KACpE,KAAK,YAER,aAAa,CAAC,CAAC,CAAC,KAAC,kBAAkB,KAAG,CAAC,CAAC,CAAC,KAAC,kBAAkB,KAAG,GAClD,CACjB,CAAA;AACH,CAAC,CAAA;AAED,MAAM,kBAAkB,GAAG,GAAG,EAAE;IAC9B,MAAM,EAAE,KAAK,EAAE,GAAG,EAAE,GAAG,EAAE,QAAQ,EAAE,IAAI,EAAE,WAAW,EAAE,GAAG,mBAAmB,EAAE,CAAA;IAE9E,IAAI,CAAC,KAAK,EAAE,CAAC;QACX,OAAO,IAAI,CAAA;IACb,CAAC;IAED,MAAM,CAAC,SAAS,EAAE,OAAO,CAAC,GAAG,KAAK,CAAA;IAClC,MAAM,SAAS,GAAG,CAAC,GAAG,IAAI,QAAQ,CAAC,GAAG,EAAE,SAAS,CAAC,OAAO,CAAC,OAAO,CAAC,CAAC,CAAA;IACnE,MAAM,YAAY,GAAG,CAAC,GAAG,IAAI,QAAQ,CAAC,OAAO,CAAC,KAAK,CAAC,OAAO,CAAC,EAAE,GAAG,CAAC,CAAA;IAElE,OAAO,CACL,gBAAM,SAAS,EAAE,CAAC,CAAC,cAAc,aAC/B,KAAC,MAAM,IACL,SAAS,EAAE,CAAC,CAAC,eAAe,EAC5B,KAAK,EAAC,WAAW,EACjB,OAAO,EAAC,OAAO,EACf,QAAQ,EAAE,QAAQ,IAAI,CAAC,SAAS,EAChC,IAAI,EAAC,KAAK,EACV,OAAO,QACP,IAAI,EAAE,IAAI,~~EACV~~,aAAa,EAAE,CAAC,GAAG,EAAE,EAAE;~~oBACrB~~,GAAG,CAAC,eAAe,EAAE,CAAA;oBACrB,WAAW,CAAC,OAAO,CAAC,mBAAmB,CAAC,SAAS,CAAC,KAAK,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,CAAA;gBACxF,CAAC,YAED,KAAC,WAAW,KAAG,GACR,EACT,gBAAM,SAAS,EAAE,CAAC,CAAC,WAAW,aAC3B,SAAS,CAAC,SAAS,OAAG,SAAS,CAAC,IAAI,IAChC,EACP,KAAC,MAAM,IACL,SAAS,EAAE,CAAC,CAAC,WAAW,EACxB,KAAK,EAAC,WAAW,EACjB,OAAO,EAAC,OAAO,EACf,QAAQ,EAAE,QAAQ,IAAI,CAAC,YAAY,EACnC,IAAI,EAAC,KAAK,EACV,OAAO,QACP,IAAI,EAAE,IAAI,~~EACV~~,aAAa,EAAE,CAAC,GAAG,EAAE,EAAE;~~oBACrB~~,GAAG,CAAC,eAAe,EAAE,CAAA;oBACrB,WAAW,CAAC,OAAO,CAAC,mBAAmB,CAAC,SAAS,CAAC,IAAI,CAAC,EAAE,MAAM,EAAE,CAAC,EAAE,CAAC,EAAE,EAAE,GAAG,EAAE,GAAG,EAAE,CAAC,CAAC,CAAA;gBACvF,CAAC,YAED,KAAC,YAAY,KAAG,GACT,IACJ,CACR,CAAA;AACH,CAAC,CAAA;AAED,MAAM,kBAAkB,GAAG,GAAG,EAAE;IAC9B,MAAM,EAAE,WAAW,EAAE,KAAK,EAAE,iBAAiB,EAAE,SAAS,EAAE,GAAG,mBAAmB,EAAE,CAAA;IAElF,MAAM,cAAc,GAAG,OAAO,CAAgC,GAAG,EAAE;QACjE,IAAI,CAAC,KAAK,IAAI,CAAC,SAAS,EAAE,MAAM,EAAE,CAAC;YACjC,OAAO,SAAS,CAAA;QAClB,CAAC;QAED,OAAO,SAAS,CAAC,IAAI,CAAC,CAAC,EAAE,EAAE,EAAE;YAC3B,MAAM,CAAC,KAAK,EAAE,GAAG,CAAC,GAAG,EAAE,CAAC,YAAY,EAAE,CAAA;YACtC,OAAO,SAAS,CAAC,KAAK,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,IAAI,SAAS,CAAC,GAAG,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAA;QAC/D,CAAC,CAAC,CAAA;IACJ,CAAC,EAAE,CAAC,KAAK,EAAE,SAAS,CAAC,CAAC,CAAA;IAEtB,OAAO,CACL,4BACG,cAAc,CAAC,CAAC,CAAC,CAChB,eAAM,SAAS,EAAC,cAAc,YAAE,cAAc,CAAC,KAAK,GAAQ,CAC7D,CAAC,CAAC,CAAC,KAAK,IAAI,SAAS,CAAC,KAAK,CAAC,CAAC,CAAC,EAAE,KAAK,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAAC,CAC3C,eAAM,SAAS,EAAC,2BAA2B,YAAE,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,iBAAiB,CAAC,GAAQ,CAC1F,CAAC,CAAC,CAAC,KAAK,CAAC,CAAC,CAAC,CACV,gBAAM,SAAS,EAAC,2BAA2B,aACxC,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,iBAAiB,CAAC,EACrC,eAAM,SAAS,EAAE,CAAC,CAAC,kBAAkB,kBAAU,EAC9C,KAAK,CAAC,CAAC,CAAC,CAAC,QAAQ,CAAC,iBAAiB,CAAC,IAChC,CACR,CAAC,CAAC,CAAC,CACF,WAAW,CACZ,GACA,CACJ,CAAA;AACH,CAAC,CAAA;AAED,MAAM,uBAAuB,GAAG,CAC9B,KAAuB,EACvB,WAAgC,EAChC,EAAE,GAAG,EAAE,GAAG,KAAyC,EAAE,EAC5C,EAAE;IACX,oCAAoC;IACpC,IAAI,CAAC,KAAK,IAAI,CAAC,WAAW,EAAE,CAAC;QAC3B,OAAO,KAAK,CAAA;IACd,CAAC;IAED,MAAM,CAAC,SAAS,EAAE,OAAO,CAAC,GAAG,KAAK,CAAA;IAClC,MAAM,CAAC,gBAAgB,EAAE,cAAc,CAAC,GAAG,mBAAmB,CAAC,SAAS,EAAE;QACxE,GAAG;QACH,GAAG;KACJ,CAAC,CAAA;IAEF,OAAO,SAAS,CAAC,gBAAgB,EAAE,SAAS,CAAC,IAAI,SAAS,CAAC,cAAc,EAAE,OAAO,CAAC,CAAA;AACrF,CAAC,CAAA","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport type { DateTime } from \"luxon\"\nimport { useMemo, type ComponentProps } from \"react\"\nimport { getMonthStartAndEnd, isBefore, isSameDay } from \"../../lib/dateUtils\"\nimport { Button } from \"../Button\"\nimport { Calendar, ChevronLeft, ChevronRight } from \"../Icon\"\nimport { SelectControl } from \"../SelectControl\"\nimport s from \"./Trigger.module.css\"\nimport { useDateRangeContext } from \"./context\"\nimport { type DateRange, type DateRangeShortcut } from \"./types\"\n\nexport const DateRangeTrigger = (props: ComponentProps<\"span\">) => {\n const {\n value,\n min,\n max,\n disabled,\n variant,\n pill,\n size,\n block,\n triggerStepperUnit,\n triggerClassName,\n clearable,\n dropdownIconType,\n triggerShowIcon,\n onChangeRef,\n } = useDateRangeContext()\n\n const isStepperView = useMemo<boolean>(\n () =>\n rangeMatchesStepperUnit(value, triggerStepperUnit, {\n min,\n max,\n }),\n [value, triggerStepperUnit, min, max],\n )\n\n const handleClearClick = () => {\n onChangeRef.current(null)\n }\n\n return (\n <SelectControl\n className={clsx(isStepperView && s.StepperControl, triggerClassName)}\n selected={!!value}\n variant={variant}\n pill={pill}\n block={block}\n size={size}\n disabled={disabled}\n StartIcon={triggerShowIcon && !isStepperView ? Calendar : undefined}\n dropdownIconType={!isStepperView ? dropdownIconType : \"none\"}\n onClearClick={clearable && !isStepperView ? handleClearClick : undefined}\n {...props}\n >\n {isStepperView ? <TriggerStepperView /> : <TriggerDisplayView />}\n </SelectControl>\n )\n}\n\nconst TriggerStepperView = () => {\n const { value, min, max, disabled, pill, onChangeRef } = useDateRangeContext()\n\n if (!value) {\n return null\n }\n\n const [startDate, endDate] = value\n const canGoBack = !min \|\| isBefore(min, startDate.startOf(\"month\"))\n const canGoForward = !max \|\| isBefore(endDate.endOf(\"month\"), max)\n\n return (\n <span className={s.StepperContent}>\n <Button\n className={s.StepperPrevious}\n color=\"secondary\"\n variant=\"ghost\"\n disabled={disabled \|\| !canGoBack}\n size=\"3xs\"\n uniform\n pill={pill}\n onPointerDown={(evt) => {\n evt.stopPropagation()\n onChangeRef.current(getMonthStartAndEnd(startDate.minus({ months: 1 }), { min, max }))\n }}\n >\n <ChevronLeft />\n </Button>\n <span className={s.StepperText}>\n {startDate.monthLong} {startDate.year}\n </span>\n <Button\n className={s.StepperNext}\n color=\"secondary\"\n variant=\"ghost\"\n disabled={disabled \|\| !canGoForward}\n size=\"3xs\"\n uniform\n pill={pill}\n onPointerDown={(evt) => {\n evt.stopPropagation()\n onChangeRef.current(getMonthStartAndEnd(startDate.plus({ months: 1 }), { min, max }))\n }}\n >\n <ChevronRight />\n </Button>\n </span>\n )\n}\n\nconst TriggerDisplayView = () => {\n const { placeholder, value, triggerDateFormat, shortcuts } = useDateRangeContext()\n\n const activeShortcut = useMemo<DateRangeShortcut \| undefined>(() => {\n if (!value \|\| !shortcuts?.length) {\n return undefined\n }\n\n return shortcuts.find((sc) => {\n const [start, end] = sc.getDateRange()\n return isSameDay(start, value[0]) && isSameDay(end, value[1])\n })\n }, [value, shortcuts])\n\n return (\n <>\n {activeShortcut ? (\n <span className=\"inline-block\">{activeShortcut.label}</span>\n ) : value && isSameDay(value[0], value[1]) ? (\n <span className=\"inline-block tabular-nums\">{value[0].toFormat(triggerDateFormat)}</span>\n ) : value ? (\n <span className=\"inline-block tabular-nums\">\n {value[0].toFormat(triggerDateFormat)}\n <span className={s.RangeTextSeparator}>-</span>\n {value[1].toFormat(triggerDateFormat)}\n </span>\n ) : (\n placeholder\n )}\n </>\n )\n}\n\nconst rangeMatchesStepperUnit = (\n range: DateRange \| null,\n stepperUnit: \"month\" \| undefined,\n { min, max }: { min?: DateTime; max?: DateTime } = {},\n): boolean => {\n // Allows method to be called lazily\n if (!range \|\| !stepperUnit) {\n return false\n }\n\n const [startDate, endDate] = range\n const [startDateCompare, endDateCompare] = getMonthStartAndEnd(startDate, {\n min,\n max,\n })\n\n return isSameDay(startDateCompare, startDate) && isSameDay(endDateCompare, endDate)\n}\n"]}
1	+ {"version":3,"file":"Trigger.js","sourceRoot":"","sources":["../../../../src/components/DateRangePicker/Trigger.tsx"],"names":[],"mappings":"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","sourcesContent":["\"use client\"\n\nimport clsx from \"clsx\"\nimport type { DateTime } from \"luxon\"\nimport { useMemo, type ComponentProps } from \"react\"\nimport { getMonthStartAndEnd, isBefore, isSameDay } from \"../../lib/dateUtils\"\nimport { Button } from \"../Button\"\nimport { Calendar, ChevronLeft, ChevronRight } from \"../Icon\"\nimport { SelectControl } from \"../SelectControl\"\nimport s from \"@plexui/styles/components/DateRangePicker/Trigger.module.css\"\nimport { useDateRangeContext } from \"./context\"\nimport { type DateRange, type DateRangeShortcut } from \"./types\"\n\nexport const DateRangeTrigger = (props: ComponentProps<\"span\">) => {\n const {\n value,\n min,\n max,\n disabled,\n variant,\n pill,\n size,\n block,\n triggerStepperUnit,\n triggerClassName,\n clearable,\n dropdownIconType,\n triggerShowIcon,\n onChangeRef,\n } = useDateRangeContext()\n\n const isStepperView = useMemo<boolean>(\n () =>\n rangeMatchesStepperUnit(value, triggerStepperUnit, {\n min,\n max,\n }),\n [value, triggerStepperUnit, min, max],\n )\n\n const handleClearClick = () => {\n onChangeRef.current(null)\n }\n\n return (\n <SelectControl\n className={clsx(isStepperView && s.StepperControl, triggerClassName)}\n selected={!!value}\n variant={variant}\n pill={pill}\n block={block}\n size={size}\n disabled={disabled}\n StartIcon={triggerShowIcon && !isStepperView ? Calendar : undefined}\n dropdownIconType={!isStepperView ? dropdownIconType : \"none\"}\n onClearClick={clearable && !isStepperView ? handleClearClick : undefined}\n {...props}\n >\n {isStepperView ? <TriggerStepperView /> : <TriggerDisplayView />}\n </SelectControl>\n )\n}\n\nconst TriggerStepperView = () => {\n const { value, min, max, disabled, pill, onChangeRef } = useDateRangeContext()\n\n if (!value) {\n return null\n }\n\n const [startDate, endDate] = value\n const canGoBack = !min \|\| isBefore(min, startDate.startOf(\"month\"))\n const canGoForward = !max \|\| isBefore(endDate.endOf(\"month\"), max)\n\n return (\n <span className={s.StepperContent}>\n <Button\n className={s.StepperPrevious}\n color=\"secondary\"\n variant=\"ghost\"\n disabled={disabled \|\| !canGoBack}\n size=\"3xs\"\n uniform\n pill={pill}\n aria-label=\"Previous month\"\n // Stop the trigger from opening; the step itself runs on click so\n // Enter and Space work too\n onPointerDown={(evt) => evt.stopPropagation()}\n onClick={(evt) => {\n evt.stopPropagation()\n onChangeRef.current(getMonthStartAndEnd(startDate.minus({ months: 1 }), { min, max }))\n }}\n >\n <ChevronLeft />\n </Button>\n <span className={s.StepperText}>\n {startDate.monthLong} {startDate.year}\n </span>\n <Button\n className={s.StepperNext}\n color=\"secondary\"\n variant=\"ghost\"\n disabled={disabled \|\| !canGoForward}\n size=\"3xs\"\n uniform\n pill={pill}\n aria-label=\"Next month\"\n onPointerDown={(evt) => evt.stopPropagation()}\n onClick={(evt) => {\n evt.stopPropagation()\n onChangeRef.current(getMonthStartAndEnd(startDate.plus({ months: 1 }), { min, max }))\n }}\n >\n <ChevronRight />\n </Button>\n </span>\n )\n}\n\nconst TriggerDisplayView = () => {\n const { placeholder, value, triggerDateFormat, shortcuts } = useDateRangeContext()\n\n const activeShortcut = useMemo<DateRangeShortcut \| undefined>(() => {\n if (!value \|\| !shortcuts?.length) {\n return undefined\n }\n\n return shortcuts.find((sc) => {\n const [start, end] = sc.getDateRange()\n return isSameDay(start, value[0]) && isSameDay(end, value[1])\n })\n }, [value, shortcuts])\n\n return (\n <>\n {activeShortcut ? (\n <span className=\"inline-block\">{activeShortcut.label}</span>\n ) : value && isSameDay(value[0], value[1]) ? (\n <span className=\"inline-block tabular-nums\">{value[0].toFormat(triggerDateFormat)}</span>\n ) : value ? (\n <span className=\"inline-block tabular-nums\">\n {value[0].toFormat(triggerDateFormat)}\n <span className={s.RangeTextSeparator}>-</span>\n {value[1].toFormat(triggerDateFormat)}\n </span>\n ) : (\n placeholder\n )}\n </>\n )\n}\n\nconst rangeMatchesStepperUnit = (\n range: DateRange \| null,\n stepperUnit: \"month\" \| undefined,\n { min, max }: { min?: DateTime; max?: DateTime } = {},\n): boolean => {\n // Allows method to be called lazily\n if (!range \|\| !stepperUnit) {\n return false\n }\n\n const [startDate, endDate] = range\n const [startDateCompare, endDateCompare] = getMonthStartAndEnd(startDate, {\n min,\n max,\n })\n\n return isSameDay(startDateCompare, startDate) && isSameDay(endDateCompare, endDate)\n}\n"]}

package/dist/es/components/DateRangePicker/index.js CHANGED Viewed

@@ -1,3 +1,3 @@
-export { DateRangePicker } from "./DateRangePicker";
-export {} from "./types";
+export { DateRangePicker } from "./DateRangePicker.js";
+export {} from "./types.js";
 //# sourceMappingURL=index.js.map

package/dist/es/components/Dialog/Dialog.js CHANGED Viewed

@@ -3,10 +3,10 @@ import { jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
 import clsx from "clsx";
 import { Dialog as RadixDialog } from "radix-ui";
 import { createContext, useCallback, useContext, useMemo, useState, } from "react";
-import { useEscCloseStack } from "../../hooks/useEscCloseStack";
-import { preventDefaultHandler, toCssVariables } from "../../lib/helpers";
-import { TransitionGroup } from "../Transition";
-import s from "./Dialog.module.css";
+import { useEscCloseStack } from "../../hooks/useEscCloseStack.js";
+import { preventDefaultHandler, toCssVariables } from "../../lib/helpers.js";
+import { TransitionGroup } from "../Transition/index.js";
+import s from "@plexui/styles/components/Dialog/Dialog.module.css";
 const DialogContext = createContext(null);
 const useDialogContext = () => {
     const context = useContext(DialogContext);
@@ -31,16 +31,20 @@ export const Dialog = ({ open: controlledOpen, onOpenChange: controlledOnOpenCha
 const Trigger = ({ children }) => {
     return _jsx(RadixDialog.Trigger, { asChild: true, children: children });
 };
-const Content = ({ children, width = 480, showClose = true, className }) => {
+const Content = ({ children, width = 480, showClose = true, className, placement = "center", mobilePlacement, onOpenAutoFocus, onCloseAutoFocus, }) => {
     const { open, setOpen } = useDialogContext();
     useEscCloseStack(open, () => {
         setOpen(false);
     });
-    return (_jsx(RadixDialog.Portal, { forceMount: true, children: _jsx(TransitionGroup, { enterDuration: 250, exitDuration: 150, className: s.Transition, disableAnimations: true, children: open && (_jsxs("div", { children: [_jsx(RadixDialog.Overlay, { className: s.Overlay }), _jsx(RadixDialog.Content, { forceMount: true, className: s.Content, style: toCssVariables({ "dialog-width": width }), onEscapeKeyDown: preventDefaultHandler, children: _jsxs("div", { className: clsx(s.Panel, className), children: [showClose && (_jsx(RadixDialog.Close, { asChild: true, children: _jsx("button", { type: "button", className: s.CloseButton, "aria-label": "Close dialog", children: _jsx("svg", { className: s.CloseIcon, viewBox: "0 0 20 20", width: "20", height: "20", "aria-hidden": "true", children: _jsx("path", { fill: "currentColor", d: "M5.22 5.22a.75.75 0 0 1 1.06 0L10 8.94l3.72-3.72a.75.75 0 1 1 1.06 1.06L11.06 10l3.72 3.72a.75.75 0 1 1-1.06 1.06L10 11.06l-3.72 3.72a.75.75 0 1 1-1.06-1.06L8.94 10 5.22 6.28a.75.75 0 0 1 0-1.06" }) }) }) })), children] }) })] }, "dialog")) }) }));
+    return (_jsx(RadixDialog.Portal, { forceMount: true, children: _jsx(TransitionGroup, { enterDuration: 250, exitDuration: 150, className: s.Transition, disableAnimations: true, children: open && (_jsxs("div", { children: [_jsx(RadixDialog.Overlay, { className: s.Overlay }), _jsx(RadixDialog.Content, { forceMount: true, className: s.Content, style: toCssVariables({ "dialog-width": width }), "data-placement": placement === "center" ? undefined : placement, "data-mobile-placement": mobilePlacement, onEscapeKeyDown: preventDefaultHandler, onOpenAutoFocus: onOpenAutoFocus, onCloseAutoFocus: onCloseAutoFocus, children: _jsxs("div", { className: clsx(s.Panel, className), children: [showClose && (_jsx(RadixDialog.Close, { asChild: true, children: _jsx("button", { type: "button", className: s.CloseButton, "aria-label": "Close dialog", children: _jsx("svg", { className: s.CloseIcon, viewBox: "0 0 20 20", width: "20", height: "20", "aria-hidden": "true", children: _jsx("path", { fill: "currentColor", d: "M5.22 5.22a.75.75 0 0 1 1.06 0L10 8.94l3.72-3.72a.75.75 0 1 1 1.06 1.06L11.06 10l3.72 3.72a.75.75 0 1 1-1.06 1.06L10 11.06l-3.72 3.72a.75.75 0 1 1-1.06-1.06L8.94 10 5.22 6.28a.75.75 0 0 1 0-1.06" }) }) }) })), children] }) })] }, "dialog")) }) }));
 };
 const Header = ({ children, className }) => {
     return _jsx("div", { className: clsx(s.Header, className), children: children });
 };
+/** The scrolling part between Header and Footer: with it, only the body scrolls */
+const Body = ({ children, className }) => {
+    return _jsx("div", { className: clsx(s.Body, className), children: children });
+};
 const Footer = ({ children, className }) => {
     return _jsx("div", { className: clsx(s.Footer, className), children: children });
 };
@@ -56,6 +60,7 @@ const Close = ({ children }) => {
 Dialog.Trigger = Trigger;
 Dialog.Content = Content;
 Dialog.Header = Header;
+Dialog.Body = Body;
 Dialog.Footer = Footer;
 Dialog.Title = Title;
 Dialog.Description = Description;