@react-spectrum/s2 0.9.2 → 0.10.0

package/dist/Calendar.mjs

@@ -0,0 +1,468 @@
+import "./Calendar.css";
+import {ActionButton as $da878a05ab4a403e$export$cfc7921d29ef7b80} from "./ActionButton.mjs";
+import {Header as $8e847109a6ab556d$export$8b251419efc915eb, Heading as $8e847109a6ab556d$export$a8a3e93435678ff9} from "./Content.mjs";
+import {pressScale as $10ea7662e51a285b$export$56e8cba416805d8d} from "./pressScale.mjs";
+import $5c3fed25abf344cc$export$2e2bcd8739ae039 from "../icons/ChevronLeft.mjs";
+import $04f4b15c8c66bb2a$export$2e2bcd8739ae039 from "../icons/ChevronRight.mjs";
+import {helpTextStyles as $9afd80978c252040$export$13b1fd5431595bf6} from "./Field.mjs";
+import $gwkOZ$intlStringsmjs from "./intlStrings.mjs";
+import {useSpectrumContextProps as $5ce63c423902f47d$export$764f6146fadd77f7} from "../icons/useSpectrumContextProps.mjs";
+import {jsx as $gwkOZ$jsx, jsxs as $gwkOZ$jsxs, Fragment as $gwkOZ$Fragment} from "react/jsx-runtime";
+import {Calendar as $gwkOZ$Calendar, Text as $gwkOZ$Text, CalendarGrid as $gwkOZ$CalendarGrid, CalendarGridHeader as $gwkOZ$CalendarGridHeader, CalendarGridBody as $gwkOZ$CalendarGridBody, CalendarStateContext as $gwkOZ$CalendarStateContext, RangeCalendarStateContext as $gwkOZ$RangeCalendarStateContext, CalendarHeaderCell as $gwkOZ$CalendarHeaderCell, CalendarCell as $gwkOZ$CalendarCell} from "react-aria-components";
+import {startOfMonth as $gwkOZ$startOfMonth, getDayOfWeek as $gwkOZ$getDayOfWeek} from "@internationalized/date";
+import {createContext as $gwkOZ$createContext, forwardRef as $gwkOZ$forwardRef, useContext as $gwkOZ$useContext, useMemo as $gwkOZ$useMemo, Fragment as $gwkOZ$Fragment1, useRef as $gwkOZ$useRef} from "react";
+import {useLocalizedStringFormatter as $gwkOZ$useLocalizedStringFormatter, useDateFormatter as $gwkOZ$useDateFormatter, useLocale as $gwkOZ$useLocale} from "@react-aria/i18n";
+
+
+function $parcel$interopDefault(a) {
+  return a && a.__esModule ? a.default : a;
+}
+/*
+ * Copyright 2024 Adobe. All rights reserved.
+ * This file is licensed to you under the Apache License, Version 2.0 (the "License");
+ * you may not use this file except in compliance with the License. You may obtain a copy
+ * of the License at http://www.apache.org/licenses/LICENSE-2.0
+ *
+ * Unless required by applicable law or agreed to in writing, software distributed under
+ * the License is distributed on an "AS IS" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS
+ * OF ANY KIND, either express or implied. See the License for the specific language
+ * governing permissions and limitations under the License.
+ */ 
+
+
+
+
+
+
+
+
+
+
+const $f06f4d5597ad704c$export$3b805cea1f178355 = /*#__PURE__*/ (0, $gwkOZ$createContext)(null);
+const $f06f4d5597ad704c$var$calendarStyles = function anonymous(props, overrides) {
+    let rules = " ";
+    let width = false;
+    let matches = (overrides || '').matchAll(/(?:^|\s)(J|G|I|H|_u|_v|_s|__A|_d|_J|z|y|B|A|_P|_9|W|_l|_A|_z|Z|N|L)[^\s]+/g);
+    for (let p of matches){
+        if (p[1] === "Z") width = true;
+        rules += p[0];
+    }
+    rules += ' sd1';
+    rules += ' _ta1';
+    rules += ' Uj1';
+    rules += ' qj1';
+    if (!width) rules += ' ZJ1';
+    rules += ' __ca1';
+    return rules;
+};
+const $f06f4d5597ad704c$var$headerStyles = " sd1 eb1 _Ce1 Za1";
+const $f06f4d5597ad704c$var$headingStyles = " sd1 eb1 _Ce1 Jy1 Gy1 Iy1 Hy1 Za1";
+const $f06f4d5597ad704c$var$titleStyles = " uk1 uch1 udi1 uea1 ugb1 uhd1 uje1 u2NhKxcl1 uic1 -_6BNtrc-e1 vx1 wd1 xd1 _xa1 wX0cczbc1 xX0cczbc1 _xX0cczba1 wfd1 xfd1 _xfa1 wfX0cczbc1 xfX0cczbc1 _xfX0cczba1 _Fd1 _FezxGHba1 _FnuYUweb1 po1 _Wa1 _ub1 _va1 _sa1 Na1";
+const $f06f4d5597ad704c$var$headerCellStyles = " uk1 uch1 udi1 uea1 ugb1 uhd1 uje1 u2NhKxcl1 uic1 -_6BNtrc-c1 vx1 wd1 xd1 _xa1 wX0cczbc1 xX0cczbc1 _xX0cczba1 wfd1 xfd1 _xfa1 wfX0cczbc1 xfX0cczbc1 _xfX0cczba1 _Fd1 _FezxGHba1 _FnuYUweb1 po1 ri1 _Wa1 Sp1 Sbd1 Rp1 Rkd1 Qe1";
+const $f06f4d5597ad704c$var$cellStyles = function anonymous(props) {
+    let rules = " ";
+    rules += ' _Le1';
+    rules += ' -uq4sQ-Sp1';
+    if (props.isFirstChild) rules += ' Sd1';
+    else rules += ' Sp1';
+    if (props.isLastChild) rules += ' Rd1';
+    else rules += ' Rp1';
+    if (props.isFirstWeek) rules += ' Td1';
+    else rules += ' Tj1';
+    rules += ' Qj1';
+    rules += ' _Pc1';
+    rules += ' ZC1';
+    rules += ' Fx1';
+    if (props.isOutsideMonth) rules += ' sk1';
+    else rules += ' sd1';
+    rules += ' eb1';
+    rules += ' _Ca1';
+    return rules;
+};
+const $f06f4d5597ad704c$var$cellInnerStyles = function anonymous(props) {
+    let rules = " ";
+    if (props.isFocusVisible) rules += ' _Lf1';
+    else rules += ' _Le1';
+    rules += ' Oh1';
+    rules += ' _Mc1';
+    if (props.isSelectionEnd) rules += ' _Kd1';
+    else if (props.isSelectionStart) rules += ' _Kd1';
+    else if (props.isSelected) {
+        if (props.selectionMode === "range") rules += ' _Kb1';
+        else if (props.selectionMode === "single") rules += ' _Kd1';
+    } else if (props.isToday) rules += ' _Kd1';
+    else rules += ' _Kb1';
+    rules += ' Yd1';
+    rules += ' Yle1';
+    rules += ' Xb1';
+    rules += ' Xlb1';
+    rules += ' _2b1';
+    rules += ' _2lb1';
+    rules += ' _Pc1';
+    rules += ' uk1';
+    rules += ' uch1';
+    rules += ' udi1';
+    rules += ' uea1';
+    rules += ' ugb1';
+    rules += ' uhd1';
+    rules += ' uje1';
+    rules += ' u2NhKxcl1';
+    rules += ' uic1';
+    rules += ' -_6BNtrc-c1';
+    rules += ' vx1';
+    rules += ' wb1';
+    rules += ' xb1';
+    rules += ' _xa1';
+    rules += ' _Fb1';
+    rules += ' _FnuYUwec1';
+    if (props.isDisabled) rules += ' pp1';
+    else if (props.isSelectionEnd) rules += ' px1';
+    else if (props.isSelectionStart) rules += ' px1';
+    else if (props.isSelected) {
+        if (props.selectionMode === "range") rules += ' pt1';
+        else rules += ' px1';
+    } else rules += ' pt1';
+    if (props.isDisabled) rules += ' plc1';
+    else if (props.isSelectionEnd) rules += ' ple1';
+    else if (props.isSelectionStart) rules += ' ple1';
+    else if (props.isSelected) rules += ' ple1';
+    else if (props.isToday) rules += ' pla1';
+    else rules += ' plb1';
+    rules += ' ri1';
+    rules += ' Za1';
+    rules += ' Fx1';
+    rules += ' og1';
+    rules += ' ng1';
+    rules += ' kg1';
+    rules += ' jg1';
+    rules += ' sd1';
+    rules += ' eb1';
+    rules += ' _Ca1';
+    rules += ' _yb1';
+    if (props.isUnavailable) rules += ' g91';
+    else if (props.isSelectionEnd) {
+        if (props.isFocusVisible) rules += ' gUgARdd1';
+        else if (props.isPressed) rules += ' gUgARdd1';
+        else if (props.isHovered) rules += ' gUgARdd1';
+        else rules += ' g5qAiPc1';
+    } else if (props.isSelectionStart) {
+        if (props.isFocusVisible) rules += ' gUgARdd1';
+        else if (props.isPressed) rules += ' gUgARdd1';
+        else if (props.isHovered) rules += ' gUgARdd1';
+        else rules += ' g5qAiPc1';
+    } else if (props.isSelected) {
+        if (props.selectionMode === "range") {
+            if (props.isHovered) rules += ' gNAacne1';
+        } else if (props.selectionMode === "single") {
+            if (props.isDisabled) rules += ' g91';
+            else if (props.isFocusVisible) rules += ' gUgARdd1';
+            else if (props.isPressed) rules += ' gUgARdd1';
+            else if (props.isHovered) rules += ' gUgARdd1';
+            else rules += ' g5qAiPc1';
+        }
+    } else if (props.isToday) {
+        if (props.isDisabled) rules += ' gH1';
+        else {
+            if (props.isPressed) rules += ' gw1';
+            else if (props.isFocusVisible) rules += ' gw1';
+            else if (props.isHovered) rules += ' gw1';
+            else rules += ' gE1';
+        }
+    } else if (props.isDisabled) rules += ' g91';
+    else if (props.isPressed) rules += ' gH1';
+    else if (props.isHovered) rules += ' gH1';
+    else rules += ' g91';
+    if (props.isUnavailable) rules += ' gl91';
+    else if (props.isSelectionEnd) rules += ' gle1';
+    else if (props.isSelectionStart) rules += ' gle1';
+    else if (props.isSelected) {
+        if (props.selectionMode === "range") {
+            if (props.isHovered) rules += ' gle1';
+        } else if (props.selectionMode === "single") rules += ' gle1';
+    } else if (props.isHovered) rules += ' gle1';
+    else if (props.isToday) rules += ' glb1';
+    else rules += ' gl91';
+    return rules;
+};
+const $f06f4d5597ad704c$var$unavailableStyles = " _Pa1 WzErnCb1 _EjhYzGc1 _RjhYzGc1 FlAZvq1 _ZN7ydnb1 og1 ng1 kg1 jg1 g5ZbAob1";
+const $f06f4d5597ad704c$var$selectionSpanStyles = " _Pa1 _9a1 Wr1 _AOJNuv1 _zr1 _lr1 _kc1 hc1 mc1 lc1 _ja1 ix1 ilb1 og1 kg1 ng1 jg1 gG1 gle1 _yb1";
+const $f06f4d5597ad704c$export$e1aef45b828286de = /*#__PURE__*/ (0, $gwkOZ$forwardRef)(function Calendar(props, ref) {
+    [props, ref] = (0, $5ce63c423902f47d$export$764f6146fadd77f7)(props, ref, $f06f4d5597ad704c$export$3b805cea1f178355);
+    let { visibleMonths: visibleMonths = 1, errorMessage: errorMessage, UNSAFE_style: UNSAFE_style, UNSAFE_className: UNSAFE_className, styles: styles, ...otherProps } = props;
+    let stringFormatter = (0, $gwkOZ$useLocalizedStringFormatter)((0, ($parcel$interopDefault($gwkOZ$intlStringsmjs))), '@react-spectrum/s2');
+    return /*#__PURE__*/ (0, $gwkOZ$jsx)((0, $gwkOZ$Calendar), {
+        ...otherProps,
+        ref: ref,
+        visibleDuration: {
+            months: visibleMonths
+        },
+        style: UNSAFE_style,
+        className: (UNSAFE_className || '') + $f06f4d5597ad704c$var$calendarStyles(null, styles),
+        children: ({ isInvalid: isInvalid, isDisabled: isDisabled })=>{
+            return /*#__PURE__*/ (0, $gwkOZ$jsxs)((0, $gwkOZ$Fragment), {
+                children: [
+                    /*#__PURE__*/ (0, $gwkOZ$jsxs)((0, $8e847109a6ab556d$export$8b251419efc915eb), {
+                        styles: $f06f4d5597ad704c$var$headerStyles,
+                        children: [
+                            /*#__PURE__*/ (0, $gwkOZ$jsx)($f06f4d5597ad704c$export$adb29da0ac001538, {
+                                slot: "previous",
+                                children: /*#__PURE__*/ (0, $gwkOZ$jsx)((0, $5c3fed25abf344cc$export$2e2bcd8739ae039), {})
+                            }),
+                            /*#__PURE__*/ (0, $gwkOZ$jsx)($f06f4d5597ad704c$export$77af08ed164baa7, {}),
+                            /*#__PURE__*/ (0, $gwkOZ$jsx)($f06f4d5597ad704c$export$adb29da0ac001538, {
+                                slot: "next",
+                                children: /*#__PURE__*/ (0, $gwkOZ$jsx)((0, $04f4b15c8c66bb2a$export$2e2bcd8739ae039), {})
+                            })
+                        ]
+                    }),
+                    /*#__PURE__*/ (0, $gwkOZ$jsx)("div", {
+                        className: " sd1 _tc1 Uj1 qj1 Za1 ed1",
+                        children: Array.from({
+                            length: visibleMonths
+                        }).map((_, i)=>/*#__PURE__*/ (0, $gwkOZ$jsx)($f06f4d5597ad704c$export$5bd780d491cfc46c, {
+                                months: i
+                            }, i))
+                    }),
+                    isInvalid && /*#__PURE__*/ (0, $gwkOZ$jsx)((0, $gwkOZ$Text), {
+                        slot: "errorMessage",
+                        className: (0, $9afd80978c252040$export$13b1fd5431595bf6)({
+                            isInvalid: isInvalid,
+                            isDisabled: isDisabled,
+                            size: 'M'
+                        }),
+                        children: errorMessage || stringFormatter.format('calendar.invalidSelection', {
+                            selectedCount: 1
+                        })
+                    })
+                ]
+            });
+        }
+    });
+});
+const $f06f4d5597ad704c$export$5bd780d491cfc46c = (props)=>{
+    // use isolation to start a new stacking context so that we can use zIndex -1 for the selection span.
+    return /*#__PURE__*/ (0, $gwkOZ$jsxs)((0, $gwkOZ$CalendarGrid), {
+        className: " __na1 __oe1 _Bb1",
+        offset: {
+            months: props.months
+        },
+        children: [
+            /*#__PURE__*/ (0, $gwkOZ$jsx)((0, $gwkOZ$CalendarGridHeader), {
+                children: (day)=>/*#__PURE__*/ (0, $gwkOZ$jsx)($f06f4d5597ad704c$var$CalendarHeaderCell, {
+                        children: day
+                    })
+            }),
+            /*#__PURE__*/ (0, $gwkOZ$jsx)((0, $gwkOZ$CalendarGridBody), {
+                children: (date)=>/*#__PURE__*/ (0, $gwkOZ$jsx)($f06f4d5597ad704c$var$CalendarCell, {
+                        date: date,
+                        firstDayOfWeek: props.firstDayOfWeek
+                    })
+            })
+        ]
+    });
+};
+const $f06f4d5597ad704c$export$77af08ed164baa7 = ()=>{
+    let calendarStateContext = (0, $gwkOZ$useContext)((0, $gwkOZ$CalendarStateContext));
+    let rangeCalendarStateContext = (0, $gwkOZ$useContext)((0, $gwkOZ$RangeCalendarStateContext));
+    let { visibleRange: visibleRange, timeZone: timeZone } = calendarStateContext ?? rangeCalendarStateContext ?? {};
+    let currentMonth = visibleRange?.start ?? visibleRange?.end;
+    let monthFormatter = (0, $gwkOZ$useDateFormatter)({
+        month: 'long',
+        year: 'numeric',
+        era: currentMonth && currentMonth.calendar.identifier === 'gregory' && currentMonth.era === 'BC' ? 'short' : undefined,
+        calendar: visibleRange?.start.calendar.identifier,
+        timeZone: timeZone
+    });
+    let months = (0, $gwkOZ$useMemo)(()=>{
+        if (!visibleRange) return [];
+        let months = [];
+        for(let i = visibleRange.start; i.compare(visibleRange.end) <= 0; i = i.add({
+            months: 1
+        })){
+            // TODO: account for the first week possibly overlapping, like with a custom 454 calendar.
+            // there has to be a better way to do this...
+            if (i.month === visibleRange.start.month) i = i.add({
+                weeks: 1
+            });
+            months.push(monthFormatter.format(i.toDate(timeZone)));
+        }
+        return months;
+    }, [
+        visibleRange,
+        monthFormatter,
+        timeZone
+    ]);
+    return /*#__PURE__*/ (0, $gwkOZ$jsx)((0, $8e847109a6ab556d$export$a8a3e93435678ff9), {
+        styles: $f06f4d5597ad704c$var$headingStyles,
+        children: months.map((month, i)=>{
+            if (i === 0) return /*#__PURE__*/ (0, $gwkOZ$jsx)((0, $gwkOZ$Fragment1), {
+                children: /*#__PURE__*/ (0, $gwkOZ$jsx)("div", {
+                    className: $f06f4d5597ad704c$var$titleStyles,
+                    children: month
+                })
+            }, month);
+            else return /*#__PURE__*/ (0, $gwkOZ$jsxs)((0, $gwkOZ$Fragment1), {
+                children: [
+                    /*#__PURE__*/ (0, $gwkOZ$jsx)("div", {
+                        className: " _6b1 ZC1"
+                    }),
+                    /*#__PURE__*/ (0, $gwkOZ$jsx)("div", {
+                        className: " _6b1 Zo1"
+                    }),
+                    /*#__PURE__*/ (0, $gwkOZ$jsx)("div", {
+                        className: " _6b1 ZC1"
+                    }),
+                    /*#__PURE__*/ (0, $gwkOZ$jsx)("div", {
+                        className: $f06f4d5597ad704c$var$titleStyles,
+                        children: month
+                    })
+                ]
+            }, month);
+        })
+    });
+};
+const $f06f4d5597ad704c$export$adb29da0ac001538 = (props1)=>{
+    let { direction: direction } = (0, $gwkOZ$useLocale)();
+    return /*#__PURE__*/ (0, $gwkOZ$jsx)("div", {
+        className: function anonymous(props) {
+            let rules = " ";
+            if (props.direction === "rtl") {
+                rules += ' -Z4Pn4c-a1';
+                rules += ' __Ha1';
+            }
+            if (props.direction === "rtl") {
+                rules += ' -_04Pn4c-a1';
+                rules += ' __Ha1';
+            }
+            return rules;
+        }({
+            direction: direction
+        }),
+        children: /*#__PURE__*/ (0, $gwkOZ$jsx)((0, $da878a05ab4a403e$export$cfc7921d29ef7b80), {
+            ...props1,
+            isQuiet: true,
+            children: props1.children
+        })
+    });
+};
+const $f06f4d5597ad704c$var$CalendarHeaderCell = (props)=>{
+    return /*#__PURE__*/ (0, $gwkOZ$jsx)((0, $gwkOZ$CalendarHeaderCell), {
+        className: $f06f4d5597ad704c$var$headerCellStyles,
+        children: props.children
+    });
+};
+const $f06f4d5597ad704c$var$CalendarCell = (props)=>{
+    let { locale: locale } = (0, $gwkOZ$useLocale)();
+    let firstDayOfWeek = props.firstDayOfWeek;
+    // Calculate the day and week index based on the date.
+    let { dayIndex: dayIndex, weekIndex: weekIndex } = $f06f4d5597ad704c$var$useWeekAndDayIndices(props.date, locale, firstDayOfWeek);
+    let calendarStateContext = (0, $gwkOZ$useContext)((0, $gwkOZ$CalendarStateContext));
+    let rangeCalendarStateContext = (0, $gwkOZ$useContext)((0, $gwkOZ$RangeCalendarStateContext));
+    let state = calendarStateContext ?? rangeCalendarStateContext;
+    let isFirstWeek = weekIndex === 0;
+    let isFirstChild = dayIndex === 0;
+    let isLastChild = dayIndex === 6;
+    return /*#__PURE__*/ (0, $gwkOZ$jsx)((0, $gwkOZ$CalendarCell), {
+        date: props.date,
+        className: (renderProps)=>$f06f4d5597ad704c$var$cellStyles({
+                ...renderProps,
+                isFirstChild: isFirstChild,
+                isLastChild: isLastChild,
+                isFirstWeek: isFirstWeek
+            }),
+        children: (renderProps)=>/*#__PURE__*/ (0, $gwkOZ$jsx)($f06f4d5597ad704c$var$CalendarCellInner, {
+                ...props,
+                weekIndex: weekIndex,
+                dayIndex: dayIndex,
+                state: state,
+                isRangeSelection: !!rangeCalendarStateContext,
+                renderProps: renderProps
+            })
+    });
+};
+const $f06f4d5597ad704c$var$CalendarCellInner = (props)=>{
+    let { weekIndex: weekIndex, dayIndex: dayIndex, date: date, renderProps: renderProps, state: state, isRangeSelection: isRangeSelection } = props;
+    let { getDatesInWeek: getDatesInWeek } = state;
+    let ref = (0, $gwkOZ$useRef)(null);
+    let { isUnavailable: isUnavailable, formattedDate: formattedDate, isSelected: isSelected } = renderProps;
+    let startDate = (0, $gwkOZ$startOfMonth)(date);
+    let datesInWeek = getDatesInWeek(weekIndex, startDate);
+    // Starting from the current day, find the first day before it in the current week that is not selected.
+    // Then, the span of selected days is the current day minus the first unselected day.
+    let firstUnselectedInRangeInWeek = datesInWeek.slice(0, dayIndex + 1).reverse().findIndex((date, i)=>{
+        return date && i > 0 && (!state.isSelected(date) || date.month !== props.date.month);
+    });
+    let selectionSpan = -1;
+    if (firstUnselectedInRangeInWeek > -1 && isSelected) selectionSpan = firstUnselectedInRangeInWeek - 1;
+    else if (isSelected) selectionSpan = dayIndex;
+    let prevDay = date.subtract({
+        days: 1
+    });
+    let nextDay = date.add({
+        days: 1
+    });
+    let isBackgroundStyleApplied = isSelected && isRangeSelection && (state.isSelected(prevDay) || nextDay.month === date.month && state.isSelected(nextDay));
+    return /*#__PURE__*/ (0, $gwkOZ$jsxs)("div", {
+        className: " _Pc1 ZvFFGYc1 -_4Isswc-ZvFFGYc1 -Z_-ZC1",
+        children: [
+            /*#__PURE__*/ (0, $gwkOZ$jsxs)("div", {
+                ref: ref,
+                style: (0, $10ea7662e51a285b$export$56e8cba416805d8d)(ref, {})(renderProps),
+                className: $f06f4d5597ad704c$var$cellInnerStyles({
+                    ...renderProps,
+                    selectionMode: isRangeSelection ? 'range' : 'single'
+                }),
+                children: [
+                    /*#__PURE__*/ (0, $gwkOZ$jsx)("div", {
+                        children: formattedDate
+                    }),
+                    isUnavailable && /*#__PURE__*/ (0, $gwkOZ$jsx)("div", {
+                        className: $f06f4d5597ad704c$var$unavailableStyles,
+                        role: "presentation"
+                    })
+                ]
+            }),
+            isBackgroundStyleApplied && /*#__PURE__*/ (0, $gwkOZ$jsx)("div", {
+                style: {
+                    '--selection-span': selectionSpan
+                },
+                className: $f06f4d5597ad704c$var$selectionSpanStyles,
+                role: "presentation"
+            })
+        ]
+    });
+};
+/**
+ * Calculate the week index (0-based) and day index (0-based) for a given date within a month in a calendar.
+ * @param date - The date to calculate indices for.
+ * @param locale - The locale string (e.g., 'en-US', 'fr-FR', 'hi-IN-u-ca-indian').
+ * @param firstDayOfWeek - Optional override for the first day of the week ('sun', 'mon', 'tue', etc.).
+ * @returns Object with weekIndex and dayIndex.
+ */ function $f06f4d5597ad704c$var$useWeekAndDayIndices(date, locale, firstDayOfWeek) {
+    let { dayIndex: dayIndex, weekIndex: weekIndex } = (0, $gwkOZ$useMemo)(()=>{
+        // Get the day index within the week (0-6)
+        const dayIndex = (0, $gwkOZ$getDayOfWeek)(date, locale, firstDayOfWeek);
+        const monthStart = (0, $gwkOZ$startOfMonth)(date);
+        // Calculate the week index by finding which week this date falls into
+        // within the month's calendar grid
+        const monthStartDayOfWeek = (0, $gwkOZ$getDayOfWeek)(monthStart, locale, firstDayOfWeek);
+        const dayOfMonth = date.day;
+        const weekIndex = Math.floor((dayOfMonth + monthStartDayOfWeek - 1) / 7);
+        return {
+            weekIndex: weekIndex,
+            dayIndex: dayIndex
+        };
+    }, [
+        date,
+        locale,
+        firstDayOfWeek
+    ]);
+    return {
+        dayIndex: dayIndex,
+        weekIndex: weekIndex
+    };
+}
+
+
+export {$f06f4d5597ad704c$export$3b805cea1f178355 as CalendarContext, $f06f4d5597ad704c$export$e1aef45b828286de as Calendar, $f06f4d5597ad704c$export$adb29da0ac001538 as CalendarButton, $f06f4d5597ad704c$export$77af08ed164baa7 as CalendarHeading, $f06f4d5597ad704c$export$5bd780d491cfc46c as CalendarGrid};
+//# sourceMappingURL=Calendar.mjs.map

package/dist/Calendar.mjs.map

@@ -0,0 +1 @@
+{"mappings":";;;;;;;;;;;;;;;;;;;AAAA;;;;;;;;;;CAUC;;;;;;;;;;;AAwDM,MAAM,0DAAkB,CAAA,GAAA,oBAAY,EAA6D;AAExG,MAAM;;;;;;;;;;;;;;;;AAQN,MAAM;AAON,MAAM;AAQN,MAAM;AASN,MAAM;AAeN,MAAM;;;;;;;;;;;;;;;;;;;;AA8BN,MAAM;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAuGN,MAAM;AAWN,MAAM;AA0BC,MAAM,4CAAyB,AAAd,WAAW,GAAI,CAAA,GAAA,iBAAS,EAAqB,SAAS,SAA8B,KAAuB,EAAE,GAAiC;IACpK,CAAC,OAAO,IAAI,GAAG,CAAA,GAAA,yCAAsB,EAAE,OAAO,KAAK;IACnD,IAAI,iBACF,gBAAgB,iBAChB,YAAY,gBACZ,YAAY,oBACZ,gBAAgB,UAChB,MAAM,EACN,GAAG,YACJ,GAAG;IACJ,IAAI,kBAAkB,CAAA,GAAA,kCAA0B,EAAE,CAAA,GAAA,+CAAW,GAAG;IAChE,qBACE,gBAAC,CAAA,GAAA,eAAW;QACT,GAAG,UAAU;QACd,KAAK;QACL,iBAAiB;YAAC,QAAQ;QAAa;QACvC,OAAO;QACP,WAAW,AAAC,CAAA,oBAAoB,EAAC,IAAK,qCAAe,MAAM;kBAC1D,CAAC,aAAC,SAAS,cAAE,UAAU,EAAC;YACvB,qBACE;;kCACE,iBAAC,CAAA,GAAA,yCAAK;wBAAE,QAAQ;;0CACd,gBAAC;gCAAe,MAAK;0CAAW,cAAA,gBAAC,CAAA,GAAA,wCAAc;;0CAC/C,gBAAC;0CACD,gBAAC;gCAAe,MAAK;0CAAO,cAAA,gBAAC,CAAA,GAAA,wCAAe;;;;kCAE9C,gBAAC;wBACC,SAAS;kCAOR,MAAM,IAAI,CAAC;4BAAC,QAAQ;wBAAa,GAAG,GAAG,CAAC,CAAC,GAAG,kBAC3C,gBAAC;gCAAa,QAAQ;+BAAQ;;oBAGjC,2BACC,gBAAC,CAAA,GAAA,WAAG;wBAAE,MAAK;wBAAe,WAAW,CAAA,GAAA,yCAAa,EAAE;uCAAC;wCAAW;4BAAY,MAAM;wBAAG;kCAClF,gBAAgB,gBAAgB,MAAM,CAAC,6BAA6B;4BAAC,eAAe;wBAAC;;;;QAKhG;;AAGN;AAEO,MAAM,4CAAe,CAAC;IAC3B,qGAAqG;IACrG,qBACE,iBAAC,CAAA,GAAA,mBAAe;QACd,SAAS;QAKT,QAAQ;YAAC,QAAQ,MAAM,MAAM;QAAA;;0BAC7B,gBAAC,CAAA,GAAA,yBAAiB;0BACf,CAAC,oBACA,gBAAC;kCACE;;;0BAIP,gBAAC,CAAA,GAAA,uBAAe;0BACb,CAAC,qBACA,gBAAC;wBAAa,MAAM;wBAAM,gBAAgB,MAAM,cAAc;;;;;AAKxE;AAIO,MAAM,2CAAkB;IAC7B,IAAI,uBAAuB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,2BAAmB;IACzD,IAAI,4BAA4B,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,gCAAwB;IACnE,IAAI,gBAAC,YAAY,YAAE,QAAQ,EAAC,GAAG,wBAAwB,6BAA6B,CAAC;IACrF,IAAI,eAAe,cAAc,SAAS,cAAc;IACxD,IAAI,iBAAiB,CAAA,GAAA,uBAAe,EAAE;QACpC,OAAO;QACP,MAAM;QACN,KAAK,gBAAgB,aAAa,QAAQ,CAAC,UAAU,KAAK,aAAa,aAAa,GAAG,KAAK,OAAO,UAAU;QAC7G,UAAU,cAAc,MAAM,SAAS;kBACvC;IACF;IACA,IAAI,SAAS,CAAA,GAAA,cAAM,EAAE;QACnB,IAAI,CAAC,cACH,OAAO,EAAE;QAEX,IAAI,SAAmB,EAAE;QACzB,IAAK,IAAI,IAAI,aAAa,KAAK,EAAE,EAAE,OAAO,CAAC,aAAa,GAAG,KAAK,GAAG,IAAI,EAAE,GAAG,CAAC;YAAC,QAAQ;QAAC,GAAI;YACzF,0FAA0F;YAC1F,6CAA6C;YAC7C,IAAI,EAAE,KAAK,KAAK,aAAa,KAAK,CAAC,KAAK,EACtC,IAAI,EAAE,GAAG,CAAC;gBAAC,OAAO;YAAC;YAErB,OAAO,IAAI,CAAC,eAAe,MAAM,CAAC,EAAE,MAAM,CAAC;QAC7C;QACA,OAAO;IACT,GAAG;QAAC;QAAc;QAAgB;KAAS;IAE3C,qBACE,gBAAC,CAAA,GAAA,yCAAM;QAAE,QAAQ;kBACd,OAAO,GAAG,CAAC,CAAC,OAAO;YAClB,IAAI,MAAM,GACR,qBACE,gBAAC,CAAA,GAAA,gBAAO;0BACN,cAAA,gBAAC;oBAAI,WAAW;8BAAc;;eADjB;iBAKjB,qBACE,iBAAC,CAAA,GAAA,gBAAO;;kCAEN,gBAAC;wBAAI,SAAS;;kCACd,gBAAC;wBAAI,SAAS;;kCACd,gBAAC;wBAAI,SAAS;;kCACd,gBAAC;wBAAI,WAAW;kCAAc;;;eALjB;QASrB;;AAGN;AAEO,MAAM,4CAAiB,CAAC;IAC7B,IAAI,aAAC,SAAS,EAAC,GAAG,CAAA,GAAA,gBAAQ;IAC1B,qBACE,gBAAC;QACC,WACE;;;;;;;;;;;UAMG;uBAAC;QAAS;kBAEf,cAAA,gBAAC,CAAA,GAAA,yCAAW;YACT,GAAG,MAAK;YACT,OAAO;sBACN,OAAM,QAAQ;;;AAIvB;AAEA,MAAM,2CAAqB,CAAC;IAC1B,qBACE,gBAAC,CAAA,GAAA,yBAAqB;QAAE,WAAW;kBAChC,MAAM,QAAQ;;AAGrB;AAEA,MAAM,qCAAe,CAAC;IACpB,IAAI,UAAC,MAAM,EAAC,GAAG,CAAA,GAAA,gBAAQ;IACvB,IAAI,iBAAiB,MAAM,cAAc;IACzC,sDAAsD;IACtD,IAAI,YAAC,QAAQ,aAAE,SAAS,EAAC,GAAG,2CAAqB,MAAM,IAAI,EAAE,QAAQ;IAErE,IAAI,uBAAuB,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,2BAAmB;IACzD,IAAI,4BAA4B,CAAA,GAAA,iBAAS,EAAE,CAAA,GAAA,gCAAwB;IACnE,IAAI,QAAS,wBAAwB;IAErC,IAAI,cAAc,cAAc;IAChC,IAAI,eAAe,aAAa;IAChC,IAAI,cAAc,aAAa;IAC/B,qBACE,gBAAC,CAAA,GAAA,mBAAe;QACd,MAAM,MAAM,IAAI;QAChB,WAAW,CAAC,cAAgB,iCAAW;gBAAC,GAAG,WAAW;8BAAE;6BAAc;6BAAa;YAAW;kBAC7F,CAAC,4BAAgB,gBAAC;gBAAmB,GAAG,KAAK;gBAAE,WAAW;gBAAW,UAAU;gBAAU,OAAO;gBAAO,kBAAkB,CAAC,CAAC;gBAA2B,aAAa;;;AAG1K;AAEA,MAAM,0CAAoB,CAAC;IACzB,IAAI,aAAC,SAAS,YAAE,QAAQ,QAAE,IAAI,eAAE,WAAW,SAAE,KAAK,oBAAE,gBAAgB,EAAC,GAAG;IACxE,IAAI,kBAAC,cAAc,EAAC,GAAG;IACvB,IAAI,MAAM,CAAA,GAAA,aAAK,EAAkB;IACjC,IAAI,iBAAC,aAAa,iBAAE,aAAa,cAAE,UAAU,EAAC,GAAG;IACjD,IAAI,YAAY,CAAA,GAAA,mBAAW,EAAE;IAC7B,IAAI,cAAc,eAAe,WAAW;IAE5C,wGAAwG;IACxG,qFAAqF;IACrF,IAAI,+BAA+B,YAAY,KAAK,CAAC,GAAG,WAAW,GAAG,OAAO,GAAG,SAAS,CAAC,CAAC,MAAM;QAC/F,OAAO,QAAQ,IAAI,KAAM,CAAA,CAAC,MAAM,UAAU,CAAC,SAAS,KAAK,KAAK,KAAK,MAAM,IAAI,CAAC,KAAK,AAAD;IACpF;IACA,IAAI,gBAAgB;IACpB,IAAI,+BAA+B,MAAM,YACvC,gBAAgB,+BAA+B;SAC1C,IAAI,YACT,gBAAgB;IAGlB,IAAI,UAAU,KAAK,QAAQ,CAAC;QAAC,MAAM;IAAC;IACpC,IAAI,UAAU,KAAK,GAAG,CAAC;QAAC,MAAM;IAAC;IAC/B,IAAI,2BACF,cACG,oBACC,CAAA,MAAM,UAAU,CAAC,YACf,QAAQ,KAAK,KAAK,KAAK,KAAK,IAAI,MAAM,UAAU,CAAC,QAAQ;IAGjE,qBACE,iBAAC;QACC,SAAS;;0BAQT,iBAAC;gBACC,KAAK;gBACL,OAAO,CAAA,GAAA,yCAAS,EAAE,KAAK,CAAC,GAAG;gBAC3B,WAAW,sCAAgB;oBAAC,GAAG,WAAW;oBAAG,eAAe,mBAAmB,UAAU;gBAAQ;;kCACjG,gBAAC;kCACE;;oBAEF,+BAAiB,gBAAC;wBAAI,WAAW;wBAAmB,MAAK;;;;YAE3D,0CAA4B,gBAAC;gBAAI,OAAO;oBAAC,oBAAoB;gBAAa;gBAAoB,WAAW;gBAAqB,MAAK;;;;AAG1I;AAIA;;;;;;CAMC,GACD,SAAS,2CACP,IAAkB,EAClB,MAAc,EACd,cAA0B;IAE1B,IAAI,YAAC,QAAQ,aAAE,SAAS,EAAC,GAAG,CAAA,GAAA,cAAM,EAAE;QAClC,0CAA0C;QAC1C,MAAM,WAAW,CAAA,GAAA,mBAAW,EAAE,MAAM,QAAQ;QAE5C,MAAM,aAAa,CAAA,GAAA,mBAAW,EAAE;QAEhC,sEAAsE;QACtE,mCAAmC;QACnC,MAAM,sBAAsB,CAAA,GAAA,mBAAW,EAAE,YAAY,QAAQ;QAC7D,MAAM,aAAa,KAAK,GAAG;QAE3B,MAAM,YAAY,KAAK,KAAK,CAAC,AAAC,CAAA,aAAa,sBAAsB,CAAA,IAAK;QAEtE,OAAO;uBACL;sBACA;QACF;IACF,GAAG;QAAC;QAAM;QAAQ;KAAe;IAEjC,OAAO;kBAAC;mBAAU;IAAS;AAC7B","sources":["packages/@react-spectrum/s2/src/Calendar.tsx"],"sourcesContent":["/*\n * Copyright 2024 Adobe. All rights reserved.\n * This file is licensed to you under the Apache License, Version 2.0 (the \"License\");\n * you may not use this file except in compliance with the License. You may obtain a copy\n * of the License at http://www.apache.org/licenses/LICENSE-2.0\n *\n * Unless required by applicable law or agreed to in writing, software distributed under\n * the License is distributed on an \"AS IS\" BASIS, WITHOUT WARRANTIES OR REPRESENTATIONS\n * OF ANY KIND, either express or implied. See the License for the specific language\n * governing permissions and limitations under the License.\n */\n\nimport {ActionButton, Header, Heading, pressScale} from './';\nimport {\n  Calendar as AriaCalendar,\n  CalendarCell as AriaCalendarCell,\n  CalendarGrid as AriaCalendarGrid,\n  CalendarHeaderCell as AriaCalendarHeaderCell,\n  CalendarProps as AriaCalendarProps,\n  ButtonProps,\n  CalendarCellProps,\n  CalendarCellRenderProps,\n  CalendarGridBody,\n  CalendarGridHeader,\n  CalendarHeaderCellProps,\n  CalendarState,\n  CalendarStateContext,\n  ContextValue,\n  DateValue,\n  RangeCalendarState,\n  RangeCalendarStateContext,\n  Text\n} from 'react-aria-components';\nimport {AriaCalendarGridProps} from '@react-aria/calendar';\nimport {baseColor, focusRing, lightDark, style} from '../style' with {type: 'macro'};\nimport {\n  CalendarDate,\n  getDayOfWeek,\n  startOfMonth\n} from '@internationalized/date';\nimport ChevronLeftIcon from '../s2wf-icons/S2_Icon_ChevronLeft_20_N.svg';\nimport ChevronRightIcon from '../s2wf-icons/S2_Icon_ChevronRight_20_N.svg';\nimport {forwardRefType, GlobalDOMAttributes} from '@react-types/shared';\nimport {getAllowedOverrides, StyleProps} from './style-utils' with {type: 'macro'};\nimport {helpTextStyles} from './Field';\n// @ts-ignore\nimport intlMessages from '../intl/*.json';\nimport React, {createContext, CSSProperties, ForwardedRef, forwardRef, Fragment, PropsWithChildren, ReactElement, ReactNode, useContext, useMemo, useRef} from 'react';\nimport {useDateFormatter, useLocale, useLocalizedStringFormatter} from '@react-aria/i18n';\nimport {useSpectrumContextProps} from './useSpectrumContextProps';\n\n\nexport interface CalendarProps<T extends DateValue>\n  extends Omit<AriaCalendarProps<T>, 'visibleDuration' | 'style' | 'className' | 'styles' | keyof GlobalDOMAttributes>,\n  StyleProps {\n  /**\n   * The error message to display when the calendar is invalid.\n   */\n  errorMessage?: ReactNode,\n  /**\n   * The number of months to display at once.\n   * @default 1\n   */\n  visibleMonths?: number\n}\n\nexport const CalendarContext = createContext<ContextValue<Partial<CalendarProps<any>>, HTMLDivElement>>(null);\n\nconst calendarStyles = style({\n  display: 'flex',\n  flexDirection: 'column',\n  gap: 24,\n  width: 'fit',\n  disableTapHighlight: true\n}, getAllowedOverrides());\n\nconst headerStyles = style({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  width: 'full'\n});\n\nconst headingStyles = style({\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'space-between',\n  margin: 0,\n  width: 'full'\n});\n\nconst titleStyles = style({\n  font: 'title-lg',\n  textAlign: 'center',\n  flexGrow: 1,\n  flexShrink: 0,\n  flexBasis: '0%',\n  minWidth: 0\n});\n\nconst headerCellStyles = style({\n  font: 'title-sm',\n  cursor: 'default',\n  textAlign: 'center',\n  paddingStart: {\n    default: 4,\n    ':first-child': 0\n  },\n  paddingEnd: {\n    default: 4,\n    ':last-child': 0\n  },\n  paddingBottom: 12\n});\n\nconst cellStyles = style({\n  outlineStyle: 'none',\n  '--cell-gap': {\n    type: 'paddingStart',\n    value: 4\n  },\n  paddingStart: {\n    default: 4,\n    isFirstChild: 0\n  },\n  paddingEnd: {\n    default: 4,\n    isLastChild: 0\n  },\n  paddingTop: {\n    default: 2,\n    isFirstWeek: 0\n  },\n  paddingBottom: 2,\n  position: 'relative',\n  width: 32,\n  height: 32,\n  display: {\n    default: 'flex',\n    isOutsideMonth: 'none'\n  },\n  alignItems: 'center',\n  justifyContent: 'center'\n});\n\nconst cellInnerStyles = style<CalendarCellRenderProps & {selectionMode: 'single' | 'range'}>({\n  ...focusRing(),\n  transition: {\n    default: 'default',\n    forcedColors: 'none'\n  },\n  outlineOffset: {\n    default: -2,\n    isToday: 2,\n    isSelected: {\n      selectionMode: {\n        single: 2,\n        range: -2\n      }\n    },\n    isSelectionStart: 2,\n    isSelectionEnd: 2\n  },\n  position: 'relative',\n  font: 'body-sm',\n  cursor: 'default',\n  width: 'full',\n  height: 32,\n  borderRadius: 'full',\n  display: 'flex',\n  alignItems: 'center',\n  justifyContent: 'center',\n  forcedColorAdjust: 'none',\n  backgroundColor: {\n    default: 'transparent',\n    isHovered: 'gray-100',\n    isPressed: 'gray-100',\n    isDisabled: 'transparent',\n    isToday: {\n      default: baseColor('gray-300'),\n      isDisabled: 'disabled'\n    },\n    isSelected: {\n      selectionMode: {\n        single: {\n          default: lightDark('accent-900', 'accent-700'),\n          isHovered: lightDark('accent-1000', 'accent-600'),\n          isPressed: lightDark('accent-1000', 'accent-600'),\n          isFocusVisible: lightDark('accent-1000', 'accent-600'),\n          isDisabled: 'transparent'\n        },\n        range: {\n          isHovered: 'blue-500'\n        }\n      }\n    },\n    isSelectionStart: {\n      default: lightDark('accent-900', 'accent-700'),\n      isHovered: lightDark('accent-1000', 'accent-600'),\n      isPressed: lightDark('accent-1000', 'accent-600'),\n      isFocusVisible: lightDark('accent-1000', 'accent-600')\n    },\n    isSelectionEnd: {\n      default: lightDark('accent-900', 'accent-700'),\n      isHovered: lightDark('accent-1000', 'accent-600'),\n      isPressed: lightDark('accent-1000', 'accent-600'),\n      isFocusVisible: lightDark('accent-1000', 'accent-600')\n    },\n    isUnavailable: 'transparent',\n    forcedColors: {\n      default: 'transparent',\n      isToday: 'ButtonFace',\n      isHovered: 'Highlight',\n      isSelected: {\n        selectionMode: {\n          single: 'Highlight',\n          range: {\n            isHovered: 'Highlight'\n          }\n        }\n      },\n      isSelectionStart: 'Highlight',\n      isSelectionEnd: 'Highlight',\n      isUnavailable: 'transparent'\n    }\n  },\n  color: {\n    default: 'neutral',\n    isSelected: {\n      default: 'white',\n      selectionMode: {\n        range: 'neutral'\n      }\n    },\n    isSelectionStart: 'white',\n    isSelectionEnd: 'white',\n    isDisabled: 'disabled',\n    forcedColors: {\n      default: 'ButtonText',\n      isToday: 'ButtonFace',\n      isSelected: 'HighlightText',\n      isSelectionStart: 'HighlightText',\n      isSelectionEnd: 'HighlightText',\n      isDisabled: 'GrayText'\n    }\n  }\n});\n\nconst unavailableStyles = style({\n  position: 'absolute',\n  top: 'calc(50% - 1px)',\n  left: 'calc(25% - 1px)',\n  right: 'calc(25% - 1px)',\n  height: 2,\n  transform: 'rotate(-16deg)',\n  borderRadius: 'full',\n  backgroundColor: '[currentColor]'\n});\n\nconst selectionSpanStyles = style({\n  position: 'absolute',\n  zIndex: -1,\n  top: 0,\n  insetStart: 'calc(-1 * var(--selection-span) * (var(--cell-width) + var(--cell-gap) + var(--cell-gap)))',\n  insetEnd: 0,\n  bottom: 0,\n  borderWidth: 2,\n  borderStyle: 'dashed',\n  borderColor: {\n    default: 'blue-800', // focus-indicator-color\n    forcedColors: {\n      default: 'ButtonText'\n    }\n  },\n  borderStartRadius: 'full',\n  borderEndRadius: 'full',\n  backgroundColor: {\n    default: 'blue-subtle',\n    forcedColors: {\n      default: 'Highlight'\n    }\n  },\n  forcedColorAdjust: 'none'\n});\n\nexport const Calendar = /*#__PURE__*/ (forwardRef as forwardRefType)(function Calendar<T extends DateValue>(props: CalendarProps<T>, ref: ForwardedRef<HTMLDivElement>) {\n  [props, ref] = useSpectrumContextProps(props, ref, CalendarContext);\n  let {\n    visibleMonths = 1,\n    errorMessage,\n    UNSAFE_style,\n    UNSAFE_className,\n    styles,\n    ...otherProps\n  } = props;\n  let stringFormatter = useLocalizedStringFormatter(intlMessages, '@react-spectrum/s2');\n  return (\n    <AriaCalendar\n      {...otherProps}\n      ref={ref}\n      visibleDuration={{months: visibleMonths}}\n      style={UNSAFE_style}\n      className={(UNSAFE_className || '') + calendarStyles(null, styles)}>\n      {({isInvalid, isDisabled}) => {\n        return (\n          <>\n            <Header styles={headerStyles}>\n              <CalendarButton slot=\"previous\"><ChevronLeftIcon /></CalendarButton>\n              <CalendarHeading />\n              <CalendarButton slot=\"next\"><ChevronRightIcon /></CalendarButton>\n            </Header>\n            <div\n              className={style({\n                display: 'flex',\n                flexDirection: 'row',\n                gap: 24,\n                width: 'full',\n                alignItems: 'start'\n              })}>\n              {Array.from({length: visibleMonths}).map((_, i) => (\n                <CalendarGrid months={i} key={i} />\n              ))}\n            </div>\n            {isInvalid && (\n              <Text slot=\"errorMessage\" className={helpTextStyles({isInvalid, isDisabled, size: 'M'})}>\n                {errorMessage || stringFormatter.format('calendar.invalidSelection', {selectedCount: 1})}\n              </Text>\n            )}\n          </>\n        );\n      }}\n    </AriaCalendar>\n  );\n});\n\nexport const CalendarGrid = (props: Omit<AriaCalendarGridProps, 'children'> & PropsWithChildren & {months: number}): ReactElement => {\n  // use isolation to start a new stacking context so that we can use zIndex -1 for the selection span.\n  return (\n    <AriaCalendarGrid\n      className={style({\n        borderCollapse: 'collapse',\n        borderSpacing: 0,\n        isolation: 'isolate'\n      })}\n      offset={{months: props.months}}>\n      <CalendarGridHeader>\n        {(day) => (\n          <CalendarHeaderCell>\n            {day}\n          </CalendarHeaderCell>\n        )}\n      </CalendarGridHeader>\n      <CalendarGridBody>\n        {(date) => (\n          <CalendarCell date={date} firstDayOfWeek={props.firstDayOfWeek} />\n        )}\n      </CalendarGridBody>\n    </AriaCalendarGrid>\n  );\n};\n\n// Ordinarily the heading is a formatted date range, ie January 2025 - February 2025.\n// However, we want to show each month individually.\nexport const CalendarHeading = (): ReactElement => {\n  let calendarStateContext = useContext(CalendarStateContext);\n  let rangeCalendarStateContext = useContext(RangeCalendarStateContext);\n  let {visibleRange, timeZone} = calendarStateContext ?? rangeCalendarStateContext ?? {};\n  let currentMonth = visibleRange?.start ?? visibleRange?.end;\n  let monthFormatter = useDateFormatter({\n    month: 'long',\n    year: 'numeric',\n    era: currentMonth && currentMonth.calendar.identifier === 'gregory' && currentMonth.era === 'BC' ? 'short' : undefined,\n    calendar: visibleRange?.start.calendar.identifier,\n    timeZone\n  });\n  let months = useMemo(() => {\n    if (!visibleRange) {\n      return [];\n    }\n    let months: string[] = [];\n    for (let i = visibleRange.start; i.compare(visibleRange.end) <= 0; i = i.add({months: 1})) {\n      // TODO: account for the first week possibly overlapping, like with a custom 454 calendar.\n      // there has to be a better way to do this...\n      if (i.month === visibleRange.start.month) {\n        i = i.add({weeks: 1});\n      }\n      months.push(monthFormatter.format(i.toDate(timeZone!)));\n    }\n    return months;\n  }, [visibleRange, monthFormatter, timeZone]);\n\n  return (\n    <Heading styles={headingStyles}>\n      {months.map((month, i) => {\n        if (i === 0) {\n          return (\n            <Fragment key={month}>\n              <div className={titleStyles}>{month}</div>\n            </Fragment>\n          );\n        } else {\n          return (\n            <Fragment key={month}>\n              {/* Spacers to account for Next/Previous buttons and gap, spelled out to show the math */}\n              <div className={style({visibility: 'hidden', width: 32})} />\n              <div className={style({visibility: 'hidden', width: 24})} />\n              <div className={style({visibility: 'hidden', width: 32})} />\n              <div className={titleStyles}>{month}</div>\n            </Fragment>\n          );\n        }\n      })}\n    </Heading>\n  );\n};\n\nexport const CalendarButton = (props: Omit<ButtonProps, 'children'> & {children: ReactNode}): ReactElement => {\n  let {direction} = useLocale();\n  return (\n    <div\n      className={\n        style({\n          scale: {\n            direction: {\n              rtl: -1\n            }\n          }\n        })({direction})\n      }>\n      <ActionButton\n        {...props}\n        isQuiet>\n        {props.children}\n      </ActionButton>\n    </div>\n  );\n};\n\nconst CalendarHeaderCell = (props: Omit<CalendarHeaderCellProps, 'children'> & PropsWithChildren): ReactElement => {\n  return (\n    <AriaCalendarHeaderCell className={headerCellStyles}>\n      {props.children}\n    </AriaCalendarHeaderCell>\n  );\n};\n\nconst CalendarCell = (props: Omit<CalendarCellProps, 'children'> & {firstDayOfWeek: 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat' | undefined}): ReactElement => {\n  let {locale} = useLocale();\n  let firstDayOfWeek = props.firstDayOfWeek;\n  // Calculate the day and week index based on the date.\n  let {dayIndex, weekIndex} = useWeekAndDayIndices(props.date, locale, firstDayOfWeek);\n\n  let calendarStateContext = useContext(CalendarStateContext);\n  let rangeCalendarStateContext = useContext(RangeCalendarStateContext);\n  let state = (calendarStateContext ?? rangeCalendarStateContext)!;\n\n  let isFirstWeek = weekIndex === 0;\n  let isFirstChild = dayIndex === 0;\n  let isLastChild = dayIndex === 6;\n  return (\n    <AriaCalendarCell\n      date={props.date}\n      className={(renderProps) => cellStyles({...renderProps, isFirstChild, isLastChild, isFirstWeek})}>\n      {(renderProps) => <CalendarCellInner {...props} weekIndex={weekIndex} dayIndex={dayIndex} state={state} isRangeSelection={!!rangeCalendarStateContext} renderProps={renderProps} />}\n    </AriaCalendarCell>\n  );\n};\n\nconst CalendarCellInner = (props: Omit<CalendarCellProps, 'children'> & {isRangeSelection: boolean, state: CalendarState | RangeCalendarState, weekIndex: number, dayIndex: number, renderProps?: CalendarCellRenderProps, date: DateValue}): ReactElement => {\n  let {weekIndex, dayIndex, date, renderProps, state, isRangeSelection} = props;\n  let {getDatesInWeek} = state;\n  let ref = useRef<HTMLDivElement>(null);\n  let {isUnavailable, formattedDate, isSelected} = renderProps!;\n  let startDate = startOfMonth(date);\n  let datesInWeek = getDatesInWeek(weekIndex, startDate);\n\n  // Starting from the current day, find the first day before it in the current week that is not selected.\n  // Then, the span of selected days is the current day minus the first unselected day.\n  let firstUnselectedInRangeInWeek = datesInWeek.slice(0, dayIndex + 1).reverse().findIndex((date, i) => {\n    return date && i > 0 && (!state.isSelected(date) || date.month !== props.date.month);\n  });\n  let selectionSpan = -1;\n  if (firstUnselectedInRangeInWeek > -1 && isSelected) {\n    selectionSpan = firstUnselectedInRangeInWeek - 1;\n  } else if (isSelected) {\n    selectionSpan = dayIndex;\n  }\n\n  let prevDay = date.subtract({days: 1});\n  let nextDay = date.add({days: 1});\n  let isBackgroundStyleApplied = (\n    isSelected\n    && isRangeSelection\n    && (state.isSelected(prevDay)\n      || (nextDay.month === date.month && state.isSelected(nextDay)))\n    );\n\n  return (\n    <div\n      className={style({\n        position: 'relative',\n        width: 32,\n        '--cell-width': {\n          type: 'width',\n          value: '[self(width)]'\n        }\n      })}>\n      <div\n        ref={ref}\n        style={pressScale(ref, {})(renderProps!)}\n        className={cellInnerStyles({...renderProps!, selectionMode: isRangeSelection ? 'range' : 'single'})}>\n        <div>\n          {formattedDate}\n        </div>\n        {isUnavailable && <div className={unavailableStyles} role=\"presentation\" />}\n      </div>\n      {isBackgroundStyleApplied && <div style={{'--selection-span': selectionSpan} as CSSProperties} className={selectionSpanStyles} role=\"presentation\" />}\n    </div>\n  );\n};\n\ntype DayOfWeek = 'sun' | 'mon' | 'tue' | 'wed' | 'thu' | 'fri' | 'sat';\n\n/**\n * Calculate the week index (0-based) and day index (0-based) for a given date within a month in a calendar.\n * @param date - The date to calculate indices for.\n * @param locale - The locale string (e.g., 'en-US', 'fr-FR', 'hi-IN-u-ca-indian').\n * @param firstDayOfWeek - Optional override for the first day of the week ('sun', 'mon', 'tue', etc.).\n * @returns Object with weekIndex and dayIndex.\n */\nfunction useWeekAndDayIndices(\n  date: CalendarDate,\n  locale: string,\n  firstDayOfWeek?: DayOfWeek\n) {\n  let {dayIndex, weekIndex} = useMemo(() => {\n    // Get the day index within the week (0-6)\n    const dayIndex = getDayOfWeek(date, locale, firstDayOfWeek);\n\n    const monthStart = startOfMonth(date);\n\n    // Calculate the week index by finding which week this date falls into\n    // within the month's calendar grid\n    const monthStartDayOfWeek = getDayOfWeek(monthStart, locale, firstDayOfWeek);\n    const dayOfMonth = date.day;\n\n    const weekIndex = Math.floor((dayOfMonth + monthStartDayOfWeek - 1) / 7);\n\n    return {\n      weekIndex,\n      dayIndex\n    };\n  }, [date, locale, firstDayOfWeek]);\n\n  return {dayIndex, weekIndex};\n}\n"],"names":[],"version":3,"file":"Calendar.mjs.map"}