@cimpress-ui/react 0.3.0 → 0.4.0

package/dist/commonjs/components/date-picker/utils.js

@@ -0,0 +1,31 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.getEraFormat = getEraFormat;
+exports.isDateInvalid = isDateInvalid;
+exports.constrainValue = constrainValue;
+const date_1 = require("@internationalized/date");
+/** @internal */
+function getEraFormat(date) {
+    return date?.calendar.identifier === 'gregory' && date.era === 'BC' ? 'short' : undefined;
+}
+/** @internal */
+function isDateInvalid(date, minValue, maxValue) {
+    return (minValue != null && date.compare(minValue) < 0) || (maxValue != null && date.compare(maxValue) > 0);
+}
+/** @internal */
+function constrainValue(date, minValue, maxValue) {
+    if (minValue) {
+        const newDate = (0, date_1.maxDate)(date, (0, date_1.toCalendarDate)(minValue));
+        if (newDate) {
+            date = newDate;
+        }
+    }
+    if (maxValue) {
+        const newDate = (0, date_1.minDate)(date, (0, date_1.toCalendarDate)(maxValue));
+        if (newDate) {
+            date = newDate;
+        }
+    }
+    return date;
+}
+//# sourceMappingURL=utils.js.map

package/dist/commonjs/components/date-picker/utils.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"utils.js","sourceRoot":"","sources":["../../../../src/components/date-picker/utils.ts"],"names":[],"mappings":";;AAQA,oCAEC;AAGD,sCAEC;AAGD,wCAoBC;AAtCD,kDAA8G;AAO9G,gBAAgB;AAChB,SAAgB,YAAY,CAAC,IAA8B;IACzD,OAAO,IAAI,EAAE,QAAQ,CAAC,UAAU,KAAK,SAAS,IAAI,IAAI,CAAC,GAAG,KAAK,IAAI,CAAC,CAAC,CAAC,OAAO,CAAC,CAAC,CAAC,SAAS,CAAC;AAC5F,CAAC;AAED,gBAAgB;AAChB,SAAgB,aAAa,CAAC,IAAe,EAAE,QAA2B,EAAE,QAA2B;IACrG,OAAO,CAAC,QAAQ,IAAI,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,IAAI,CAAC,QAAQ,IAAI,IAAI,IAAI,IAAI,CAAC,OAAO,CAAC,QAAQ,CAAC,GAAG,CAAC,CAAC,CAAC;AAC9G,CAAC;AAED,gBAAgB;AAChB,SAAgB,cAAc,CAC5B,IAAkB,EAClB,QAA2B,EAC3B,QAA2B;IAE3B,IAAI,QAAQ,EAAE,CAAC;QACb,MAAM,OAAO,GAAG,IAAA,cAAO,EAAC,IAAI,EAAE,IAAA,qBAAc,EAAC,QAAQ,CAAC,CAAC,CAAC;QACxD,IAAI,OAAO,EAAE,CAAC;YACZ,IAAI,GAAG,OAAO,CAAC;QACjB,CAAC;IACH,CAAC;IAED,IAAI,QAAQ,EAAE,CAAC;QACb,MAAM,OAAO,GAAG,IAAA,cAAO,EAAC,IAAI,EAAE,IAAA,qBAAc,EAAC,QAAQ,CAAC,CAAC,CAAC;QACxD,IAAI,OAAO,EAAE,CAAC;YACZ,IAAI,GAAG,OAAO,CAAC;QACjB,CAAC;IACH,CAAC;IAED,OAAO,IAAI,CAAC;AACd,CAAC","sourcesContent":["import { maxDate, minDate, toCalendarDate, type CalendarDate, type DateValue } from '@internationalized/date';\nimport type { Context } from 'react';\nimport type { CalendarStateContext as RACCalendarStateContext } from 'react-aria-components';\n\n/** @internal */\nexport type CalendarState = typeof RACCalendarStateContext extends Context<infer R> ? NonNullable<R> : never;\n\n/** @internal */\nexport function getEraFormat(date: CalendarDate | undefined): 'short' | undefined {\n  return date?.calendar.identifier === 'gregory' && date.era === 'BC' ? 'short' : undefined;\n}\n\n/** @internal */\nexport function isDateInvalid(date: DateValue, minValue?: DateValue | null, maxValue?: DateValue | null): boolean {\n  return (minValue != null && date.compare(minValue) < 0) || (maxValue != null && date.compare(maxValue) > 0);\n}\n\n/** @internal */\nexport function constrainValue(\n  date: CalendarDate,\n  minValue?: DateValue | null,\n  maxValue?: DateValue | null,\n): CalendarDate {\n  if (minValue) {\n    const newDate = maxDate(date, toCalendarDate(minValue));\n    if (newDate) {\n      date = newDate;\n    }\n  }\n\n  if (maxValue) {\n    const newDate = minDate(date, toCalendarDate(maxValue));\n    if (newDate) {\n      date = newDate;\n    }\n  }\n\n  return date;\n}\n"]}

package/dist/commonjs/components/date-picker/views/month/month-view.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=month-view.d.ts.map

package/dist/commonjs/components/date-picker/views/month/month-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"month-view.d.ts","sourceRoot":"","sources":["../../../../../../src/components/date-picker/views/month/month-view.tsx"],"names":[],"mappings":""}

package/dist/commonjs/components/date-picker/views/month/month-view.js

@@ -0,0 +1,35 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MonthView = MonthView;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const date_1 = require("@internationalized/date");
+const clsx_1 = __importDefault(require("clsx"));
+const react_1 = require("react");
+const react_aria_components_1 = require("react-aria-components");
+const index_js_1 = require("../../../../i18n/index.js");
+const index_js_2 = require("../../../../icons/index.js");
+const button_js_1 = require("../../../button/button.js");
+const icon_button_js_1 = require("../../../button/icon-button.js");
+const utils_js_1 = require("../../../typography/utils.js");
+const view_provider_js_1 = require("./../view-provider.js");
+/** @internal */
+function MonthView() {
+    const state = (0, react_1.useContext)(react_aria_components_1.CalendarStateContext);
+    const { 
+    // @ts-expect-error RACHeadingContext contains a `children` property, but it's not in the types
+    children: title, } = (0, react_1.useContext)(react_aria_components_1.HeadingContext);
+    const { switchToView } = (0, view_provider_js_1.useDatePickerView)();
+    const messages = (0, index_js_1.useLocalizedMessages)('datePicker');
+    (0, react_1.useEffect)(() => {
+        state?.setFocused(true);
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, []);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "cim-date-picker-view-header", children: [(0, jsx_runtime_1.jsx)(icon_button_js_1.IconButton, { slot: "previous", "aria-label": messages.format('previousMonth'), icon: (0, jsx_runtime_1.jsx)(index_js_2.IconChevronLeft, {}), variant: "tertiary", size: "small" }), (0, jsx_runtime_1.jsx)(button_js_1.Button, { slot: null, "aria-label": messages.format('switchToYearView'), variant: "tertiary", onPress: () => switchToView('year'), children: title }), (0, jsx_runtime_1.jsx)(icon_button_js_1.IconButton, { slot: "next", "aria-label": messages.format('nextMonth'), icon: (0, jsx_runtime_1.jsx)(index_js_2.IconChevronRight, {}), variant: "tertiary", size: "small" })] }), (0, jsx_runtime_1.jsxs)(react_aria_components_1.CalendarGrid, { className: "cim-date-picker-view-grid", weekdayStyle: "narrow", children: [(0, jsx_runtime_1.jsx)(react_aria_components_1.CalendarGridHeader, { children: (day) => ((0, jsx_runtime_1.jsx)(react_aria_components_1.CalendarHeaderCell, { children: (0, jsx_runtime_1.jsx)("div", { className: (0, clsx_1.default)('cim-date-picker-calendar-header-cell', (0, utils_js_1.textStyle)({ variant: 'medium-semibold', tone: 'base' })), children: day }) })) }), (0, jsx_runtime_1.jsx)(react_aria_components_1.CalendarGridBody, { children: (date) => {
+                            const isCurrentDate = (0, date_1.isToday)(date, state.timeZone);
+                            return ((0, jsx_runtime_1.jsx)(react_aria_components_1.CalendarCell, { className: (0, clsx_1.default)('cim-date-picker-calendar-cell', (0, utils_js_1.textStyle)({ variant: isCurrentDate ? 'medium-semibold' : 'medium' })), date: date, "data-current": isCurrentDate || undefined }));
+                        } })] })] }));
+}
+//# sourceMappingURL=month-view.js.map

package/dist/commonjs/components/date-picker/views/month/month-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"month-view.js","sourceRoot":"","sources":["../../../../../../src/components/date-picker/views/month/month-view.tsx"],"names":[],"mappings":";;;;;AAoBA,8BA6EC;;AAjGD,kDAAkD;AAClD,gDAAwB;AACxB,iCAA8C;AAC9C,iEAQ+B;AAC/B,wDAAiE;AACjE,yDAA+E;AAC/E,yDAAmD;AACnD,mEAA4D;AAC5D,2DAAyD;AACzD,4DAA0D;AAE1D,gBAAgB;AAChB,SAAgB,SAAS;IACvB,MAAM,KAAK,GAAG,IAAA,kBAAU,EAAC,4CAAuB,CAAC,CAAC;IAClD,MAAM;IACJ,+FAA+F;IAC/F,QAAQ,EAAE,KAAK,GAChB,GAAG,IAAA,kBAAU,EAAC,sCAAiB,CAAC,CAAC;IAClC,MAAM,EAAE,YAAY,EAAE,GAAG,IAAA,oCAAiB,GAAE,CAAC;IAC7C,MAAM,QAAQ,GAAG,IAAA,+BAAoB,EAAC,YAAY,CAAC,CAAC;IAEpD,IAAA,iBAAS,EAAC,GAAG,EAAE;QACb,KAAK,EAAE,UAAU,CAAC,IAAI,CAAC,CAAC;QACxB,uDAAuD;IACzD,CAAC,EAAE,EAAE,CAAC,CAAC;IAEP,OAAO,CACL,6DACE,iCAAK,SAAS,EAAC,6BAA6B,aAC1C,uBAAC,2BAAU,IACT,IAAI,EAAC,UAAU,gBACH,QAAQ,CAAC,MAAM,CAAC,eAAe,CAAC,EAC5C,IAAI,EAAE,uBAAC,0BAAe,KAAG,EACzB,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,GACZ,EAEF,uBAAC,kBAAM,IACL,IAAI,EAAE,IAAI,gBACE,QAAQ,CAAC,MAAM,CAAC,kBAAkB,CAAC,EAC/C,OAAO,EAAC,UAAU,EAClB,OAAO,EAAE,GAAG,EAAE,CAAC,YAAY,CAAC,MAAM,CAAC,YAElC,KAAK,GACC,EAET,uBAAC,2BAAU,IACT,IAAI,EAAC,MAAM,gBACC,QAAQ,CAAC,MAAM,CAAC,WAAW,CAAC,EACxC,IAAI,EAAE,uBAAC,2BAAgB,KAAG,EAC1B,OAAO,EAAC,UAAU,EAClB,IAAI,EAAC,OAAO,GACZ,IACE,EAEN,wBAAC,oCAAe,IAAC,SAAS,EAAC,2BAA2B,EAAC,YAAY,EAAC,QAAQ,aAC1E,uBAAC,0CAAqB,cACnB,CAAC,GAAG,EAAE,EAAE,CAAC,CACR,uBAAC,0CAAqB,cACpB,gCACE,SAAS,EAAE,IAAA,cAAI,EACb,sCAAsC,EACtC,IAAA,oBAAS,EAAC,EAAE,OAAO,EAAE,iBAAiB,EAAE,IAAI,EAAE,MAAM,EAAE,CAAC,CACxD,YAEA,GAAG,GACA,GACgB,CACzB,GACqB,EACxB,uBAAC,wCAAmB,cACjB,CAAC,IAAI,EAAE,EAAE;4BACR,MAAM,aAAa,GAAG,IAAA,cAAO,EAAC,IAAI,EAAE,KAAM,CAAC,QAAQ,CAAC,CAAC;4BAErD,OAAO,CACL,uBAAC,oCAAe,IACd,SAAS,EAAE,IAAA,cAAI,EACb,+BAA+B,EAC/B,IAAA,oBAAS,EAAC,EAAE,OAAO,EAAE,aAAa,CAAC,CAAC,CAAC,iBAAiB,CAAC,CAAC,CAAC,QAAQ,EAAE,CAAC,CACrE,EACD,IAAI,EAAE,IAAI,kBACI,aAAa,IAAI,SAAS,GACxC,CACH,CAAC;wBACJ,CAAC,GACmB,IACN,IACjB,CACJ,CAAC;AACJ,CAAC","sourcesContent":["import { isToday } from '@internationalized/date';\nimport clsx from 'clsx';\nimport { useContext, useEffect } from 'react';\nimport {\n  CalendarCell as RACCalendarCell,\n  CalendarGrid as RACCalendarGrid,\n  CalendarGridBody as RACCalendarGridBody,\n  CalendarGridHeader as RACCalendarGridHeader,\n  CalendarHeaderCell as RACCalendarHeaderCell,\n  CalendarStateContext as RACCalendarStateContext,\n  HeadingContext as RACHeadingContext,\n} from 'react-aria-components';\nimport { useLocalizedMessages } from '../../../../i18n/index.js';\nimport { IconChevronLeft, IconChevronRight } from '../../../../icons/index.js';\nimport { Button } from '../../../button/button.js';\nimport { IconButton } from '../../../button/icon-button.js';\nimport { textStyle } from '../../../typography/utils.js';\nimport { useDatePickerView } from './../view-provider.js';\n\n/** @internal */\nexport function MonthView() {\n  const state = useContext(RACCalendarStateContext);\n  const {\n    // @ts-expect-error RACHeadingContext contains a `children` property, but it's not in the types\n    children: title,\n  } = useContext(RACHeadingContext);\n  const { switchToView } = useDatePickerView();\n  const messages = useLocalizedMessages('datePicker');\n\n  useEffect(() => {\n    state?.setFocused(true);\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, []);\n\n  return (\n    <>\n      <div className=\"cim-date-picker-view-header\">\n        <IconButton\n          slot=\"previous\"\n          aria-label={messages.format('previousMonth')}\n          icon={<IconChevronLeft />}\n          variant=\"tertiary\"\n          size=\"small\"\n        />\n\n        <Button\n          slot={null}\n          aria-label={messages.format('switchToYearView')}\n          variant=\"tertiary\"\n          onPress={() => switchToView('year')}\n        >\n          {title}\n        </Button>\n\n        <IconButton\n          slot=\"next\"\n          aria-label={messages.format('nextMonth')}\n          icon={<IconChevronRight />}\n          variant=\"tertiary\"\n          size=\"small\"\n        />\n      </div>\n\n      <RACCalendarGrid className=\"cim-date-picker-view-grid\" weekdayStyle=\"narrow\">\n        <RACCalendarGridHeader>\n          {(day) => (\n            <RACCalendarHeaderCell>\n              <div\n                className={clsx(\n                  'cim-date-picker-calendar-header-cell',\n                  textStyle({ variant: 'medium-semibold', tone: 'base' }),\n                )}\n              >\n                {day}\n              </div>\n            </RACCalendarHeaderCell>\n          )}\n        </RACCalendarGridHeader>\n        <RACCalendarGridBody>\n          {(date) => {\n            const isCurrentDate = isToday(date, state!.timeZone);\n\n            return (\n              <RACCalendarCell\n                className={clsx(\n                  'cim-date-picker-calendar-cell',\n                  textStyle({ variant: isCurrentDate ? 'medium-semibold' : 'medium' }),\n                )}\n                date={date}\n                data-current={isCurrentDate || undefined}\n              />\n            );\n          }}\n        </RACCalendarGridBody>\n      </RACCalendarGrid>\n    </>\n  );\n}\n"]}

package/dist/commonjs/components/date-picker/views/multi-year/multi-year-view.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=multi-year-view.d.ts.map

package/dist/commonjs/components/date-picker/views/multi-year/multi-year-view.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"multi-year-view.d.ts","sourceRoot":"","sources":["../../../../../../src/components/date-picker/views/multi-year/multi-year-view.tsx"],"names":[],"mappings":""}

package/dist/commonjs/components/date-picker/views/multi-year/multi-year-view.js

@@ -0,0 +1,16 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.MultiYearView = MultiYearView;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const icon_button_js_1 = require("../../../button/icon-button.js");
+const text_js_1 = require("../../../typography/text.js");
+const use_view_header_js_1 = require("../use-view-header.js");
+const view_grid_js_1 = require("../view-grid.js");
+const use_multi_year_view_state_js_1 = require("./use-multi-year-view-state.js");
+/** @internal */
+function MultiYearView() {
+    const state = (0, use_multi_year_view_state_js_1.useMultiYearViewState)();
+    const { nextButtonProps, prevButtonProps } = (0, use_view_header_js_1.useViewHeader)(state);
+    return ((0, jsx_runtime_1.jsxs)(jsx_runtime_1.Fragment, { children: [(0, jsx_runtime_1.jsxs)("div", { className: "cim-date-picker-view-header", children: [(0, jsx_runtime_1.jsx)(icon_button_js_1.IconButton, { slot: null, ...prevButtonProps }), (0, jsx_runtime_1.jsx)(text_js_1.Text, { as: "span", variant: "title-6", tone: "base", children: state.header }), (0, jsx_runtime_1.jsx)(icon_button_js_1.IconButton, { slot: null, ...nextButtonProps })] }), (0, jsx_runtime_1.jsx)(view_grid_js_1.ViewGrid, { state: state, className: "cim-date-picker-view-grid-multi-year" })] }));
+}
+//# sourceMappingURL=multi-year-view.js.map

package/dist/commonjs/components/date-picker/views/multi-year/multi-year-view.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"multi-year-view.js","sourceRoot":"","sources":["../../../../../../src/components/date-picker/views/multi-year/multi-year-view.tsx"],"names":[],"mappings":";;AAOA,sCAmBC;;AA1BD,mEAA4D;AAC5D,yDAAmD;AACnD,8DAAsD;AACtD,kDAA2C;AAC3C,iFAAuE;AAEvE,gBAAgB;AAChB,SAAgB,aAAa;IAC3B,MAAM,KAAK,GAAG,IAAA,oDAAqB,GAAE,CAAC;IACtC,MAAM,EAAE,eAAe,EAAE,eAAe,EAAE,GAAG,IAAA,kCAAa,EAAC,KAAK,CAAC,CAAC;IAElE,OAAO,CACL,6DACE,iCAAK,SAAS,EAAC,6BAA6B,aAC1C,uBAAC,2BAAU,IAAC,IAAI,EAAE,IAAI,KAAM,eAAe,GAAI,EAE/C,uBAAC,cAAI,IAAC,EAAE,EAAC,MAAM,EAAC,OAAO,EAAC,SAAS,EAAC,IAAI,EAAC,MAAM,YAC1C,KAAK,CAAC,MAAM,GACR,EAEP,uBAAC,2BAAU,IAAC,IAAI,EAAE,IAAI,KAAM,eAAe,GAAI,IAC3C,EAEN,uBAAC,uBAAQ,IAAC,KAAK,EAAE,KAAK,EAAE,SAAS,EAAC,sCAAsC,GAAG,IAC1E,CACJ,CAAC;AACJ,CAAC","sourcesContent":["import { IconButton } from '../../../button/icon-button.js';\nimport { Text } from '../../../typography/text.js';\nimport { useViewHeader } from '../use-view-header.js';\nimport { ViewGrid } from '../view-grid.js';\nimport { useMultiYearViewState } from './use-multi-year-view-state.js';\n\n/** @internal */\nexport function MultiYearView() {\n  const state = useMultiYearViewState();\n  const { nextButtonProps, prevButtonProps } = useViewHeader(state);\n\n  return (\n    <>\n      <div className=\"cim-date-picker-view-header\">\n        <IconButton slot={null} {...prevButtonProps} />\n\n        <Text as=\"span\" variant=\"title-6\" tone=\"base\">\n          {state.header}\n        </Text>\n\n        <IconButton slot={null} {...nextButtonProps} />\n      </div>\n\n      <ViewGrid state={state} className=\"cim-date-picker-view-grid-multi-year\" />\n    </>\n  );\n}\n"]}

package/dist/commonjs/components/date-picker/views/multi-year/use-multi-year-view-state.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=use-multi-year-view-state.d.ts.map

package/dist/commonjs/components/date-picker/views/multi-year/use-multi-year-view-state.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-multi-year-view-state.d.ts","sourceRoot":"","sources":["../../../../../../src/components/date-picker/views/multi-year/use-multi-year-view-state.ts"],"names":[],"mappings":""}

package/dist/commonjs/components/date-picker/views/multi-year/use-multi-year-view-state.js

@@ -0,0 +1,130 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useMultiYearViewState = useMultiYearViewState;
+const date_1 = require("@internationalized/date");
+const react_1 = require("react");
+const react_aria_1 = require("react-aria");
+const react_aria_components_1 = require("react-aria-components");
+const index_js_1 = require("../../../../i18n/index.js");
+const utils_js_1 = require("../../utils.js");
+const view_provider_js_1 = require("../view-provider.js");
+const ITEMS_PER_ROW = 4;
+const YEARS_PER_SECTION = 20;
+const YEARS_SKIP_AMOUNT = 100;
+/** @internal */
+function useMultiYearViewState() {
+    const calendarState = (0, react_1.useContext)(react_aria_components_1.CalendarStateContext);
+    const { switchToView, focusedDate, setFocusedDate } = (0, view_provider_js_1.useDatePickerView)();
+    const messages = (0, index_js_1.useLocalizedMessages)('datePicker');
+    const [isFocused, setIsFocused] = (0, react_1.useState)(true);
+    const currentDate = (0, react_1.useMemo)(() => (0, date_1.today)(calendarState.timeZone), [calendarState.timeZone]);
+    const yearFormatter = (0, react_aria_1.useDateFormatter)({
+        year: 'numeric',
+        era: (0, utils_js_1.getEraFormat)(focusedDate),
+        calendar: focusedDate.calendar.identifier,
+        timeZone: calendarState.timeZone,
+    });
+    let startYear = (Math.ceil(focusedDate.year / YEARS_PER_SECTION) - 1) * YEARS_PER_SECTION + 1;
+    let endYear = startYear + YEARS_PER_SECTION - 1;
+    // Years are always represented by positive numbers.
+    // If era implies negative years, flip start and end.
+    const isNegativeEra = focusedDate.era === 'BC';
+    if (isNegativeEra) {
+        const temp = startYear;
+        startYear = endYear;
+        endYear = temp;
+    }
+    const data = (0, react_1.useMemo)(() => {
+        const rowCount = Math.ceil(YEARS_PER_SECTION / ITEMS_PER_ROW);
+        const result = new Array(rowCount);
+        for (let rowIdx = 0; rowIdx < rowCount; rowIdx++) {
+            result[rowIdx] = new Array(ITEMS_PER_ROW).fill(null);
+        }
+        for (let yearIdx = 0; yearIdx < YEARS_PER_SECTION; yearIdx++) {
+            const rowIdx = Math.floor(yearIdx / ITEMS_PER_ROW);
+            const colIdx = yearIdx % ITEMS_PER_ROW;
+            const yearToSet = startYear + (isNegativeEra ? -yearIdx : yearIdx);
+            const date = focusedDate.set({ year: yearToSet });
+            if (date.year !== yearToSet) {
+                // Reached minimum/maximum date
+                continue;
+            }
+            const content = yearFormatter.format(date.toDate(calendarState.timeZone));
+            result[rowIdx][colIdx] = {
+                date,
+                content,
+                ariaLabel: content,
+                isCurrent: (0, date_1.isSameYear)(date, currentDate),
+            };
+        }
+        return result;
+    }, [startYear, calendarState.timeZone, focusedDate, yearFormatter, isNegativeEra, currentDate]);
+    const focusCell = (date) => {
+        setFocusedDate((0, utils_js_1.constrainValue)(date, calendarState.minValue, calendarState.maxValue));
+    };
+    return {
+        header: yearFormatter.formatRange(focusedDate.set({ year: startYear }).toDate(calendarState.timeZone), focusedDate.set({ year: endYear }).toDate(calendarState.timeZone)),
+        previousLabel: messages.format('previousMultiYearSection', { yearCount: 20 }),
+        nextLabel: messages.format('nextMultiYearSection', { yearCount: 20 }),
+        data,
+        isReadOnly: calendarState.isReadOnly,
+        isDisabled: calendarState.isDisabled,
+        isFocused,
+        setIsFocused,
+        focusedDate,
+        setFocusedDate,
+        timeZone: calendarState.timeZone,
+        focusPreviousItem() {
+            focusCell(focusedDate.subtract({ years: 1 }));
+        },
+        focusNextItem() {
+            focusCell(focusedDate.add({ years: 1 }));
+        },
+        focusPreviousRow() {
+            focusCell(focusedDate.subtract({ years: ITEMS_PER_ROW }));
+        },
+        focusNextRow() {
+            focusCell(focusedDate.add({ years: ITEMS_PER_ROW }));
+        },
+        focusSectionStart() {
+            focusCell(focusedDate.set({ year: startYear }));
+        },
+        focusSectionEnd() {
+            focusCell(focusedDate.set({ year: endYear }));
+        },
+        focusPreviousSection(shouldSkip) {
+            focusCell(focusedDate.subtract({ years: shouldSkip ? YEARS_SKIP_AMOUNT : YEARS_PER_SECTION }));
+        },
+        focusNextSection(shouldSkip) {
+            focusCell(focusedDate.add({ years: shouldSkip ? YEARS_SKIP_AMOUNT : YEARS_PER_SECTION }));
+        },
+        isPreviousSectionInvalid() {
+            const current = (0, date_1.startOfYear)(focusedDate.set({ year: startYear }));
+            const prev = current.subtract({ days: 1 });
+            return ((0, utils_js_1.isDateInvalid)(current, calendarState.minValue, calendarState.maxValue) ||
+                (0, utils_js_1.isDateInvalid)(prev, calendarState.minValue, calendarState.maxValue) ||
+                (0, date_1.isSameDay)(prev, current));
+        },
+        isNextSectionInvalid() {
+            const current = (0, date_1.endOfYear)(focusedDate.set({ year: endYear }));
+            const next = current.add({ days: 1 });
+            return ((0, utils_js_1.isDateInvalid)(current, calendarState.minValue, calendarState.maxValue) ||
+                (0, utils_js_1.isDateInvalid)(next, calendarState.minValue, calendarState.maxValue) ||
+                (0, date_1.isSameDay)(next, current));
+        },
+        selectFocusedDate() {
+            switchToView('year');
+        },
+        isCellDisabled(date) {
+            return ((0, utils_js_1.isDateInvalid)((0, date_1.endOfYear)(date), calendarState.minValue, null) ||
+                (0, utils_js_1.isDateInvalid)((0, date_1.startOfYear)(date), null, calendarState.maxValue));
+        },
+        isCellSelected(date) {
+            return calendarState.value !== null && (0, date_1.isSameYear)(date, calendarState.value);
+        },
+        isCellTabbable(date) {
+            return (0, date_1.isSameYear)(date, focusedDate);
+        },
+    };
+}
+//# sourceMappingURL=use-multi-year-view-state.js.map

package/dist/commonjs/components/date-picker/views/multi-year/use-multi-year-view-state.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-multi-year-view-state.js","sourceRoot":"","sources":["../../../../../../src/components/date-picker/views/multi-year/use-multi-year-view-state.ts"],"names":[],"mappings":"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","sourcesContent":["import { endOfYear, isSameDay, isSameYear, startOfYear, today, type CalendarDate } from '@internationalized/date';\nimport { useContext, useMemo, useState } from 'react';\nimport { useDateFormatter } from 'react-aria';\nimport { CalendarStateContext as RACCalendarStateContext } from 'react-aria-components';\nimport { useLocalizedMessages } from '../../../../i18n/index.js';\nimport { constrainValue, getEraFormat, isDateInvalid } from '../../utils.js';\nimport type { ViewGridCellData, ViewGridState } from '../types.js';\nimport { useDatePickerView } from '../view-provider.js';\n\nconst ITEMS_PER_ROW = 4;\nconst YEARS_PER_SECTION = 20;\nconst YEARS_SKIP_AMOUNT = 100;\n\n/** @internal */\nexport function useMultiYearViewState(): ViewGridState {\n  const calendarState = useContext(RACCalendarStateContext)!;\n  const { switchToView, focusedDate, setFocusedDate } = useDatePickerView();\n  const messages = useLocalizedMessages('datePicker');\n  const [isFocused, setIsFocused] = useState(true);\n\n  const currentDate = useMemo(() => today(calendarState.timeZone), [calendarState.timeZone]);\n\n  const yearFormatter = useDateFormatter({\n    year: 'numeric',\n    era: getEraFormat(focusedDate),\n    calendar: focusedDate.calendar.identifier,\n    timeZone: calendarState.timeZone,\n  });\n\n  let startYear = (Math.ceil(focusedDate.year / YEARS_PER_SECTION) - 1) * YEARS_PER_SECTION + 1;\n  let endYear = startYear + YEARS_PER_SECTION - 1;\n\n  // Years are always represented by positive numbers.\n  // If era implies negative years, flip start and end.\n  const isNegativeEra = focusedDate.era === 'BC';\n  if (isNegativeEra) {\n    const temp = startYear;\n    startYear = endYear;\n    endYear = temp;\n  }\n\n  const data: (ViewGridCellData | null)[][] = useMemo(() => {\n    const rowCount = Math.ceil(YEARS_PER_SECTION / ITEMS_PER_ROW);\n    const result: (ViewGridCellData | null)[][] = new Array(rowCount);\n\n    for (let rowIdx = 0; rowIdx < rowCount; rowIdx++) {\n      result[rowIdx] = new Array(ITEMS_PER_ROW).fill(null);\n    }\n\n    for (let yearIdx = 0; yearIdx < YEARS_PER_SECTION; yearIdx++) {\n      const rowIdx = Math.floor(yearIdx / ITEMS_PER_ROW);\n      const colIdx = yearIdx % ITEMS_PER_ROW;\n\n      const yearToSet = startYear + (isNegativeEra ? -yearIdx : yearIdx);\n      const date = focusedDate.set({ year: yearToSet });\n\n      if (date.year !== yearToSet) {\n        // Reached minimum/maximum date\n        continue;\n      }\n\n      const content = yearFormatter.format(date.toDate(calendarState.timeZone));\n\n      result[rowIdx]![colIdx] = {\n        date,\n        content,\n        ariaLabel: content,\n        isCurrent: isSameYear(date, currentDate),\n      };\n    }\n\n    return result;\n  }, [startYear, calendarState.timeZone, focusedDate, yearFormatter, isNegativeEra, currentDate]);\n\n  const focusCell = (date: CalendarDate) => {\n    setFocusedDate(constrainValue(date, calendarState.minValue, calendarState.maxValue));\n  };\n\n  return {\n    header: yearFormatter.formatRange(\n      focusedDate.set({ year: startYear }).toDate(calendarState.timeZone),\n      focusedDate.set({ year: endYear }).toDate(calendarState.timeZone),\n    ),\n    previousLabel: messages.format('previousMultiYearSection', { yearCount: 20 }),\n    nextLabel: messages.format('nextMultiYearSection', { yearCount: 20 }),\n    data,\n    isReadOnly: calendarState.isReadOnly,\n    isDisabled: calendarState.isDisabled,\n    isFocused,\n    setIsFocused,\n    focusedDate,\n    setFocusedDate,\n    timeZone: calendarState.timeZone,\n    focusPreviousItem() {\n      focusCell(focusedDate.subtract({ years: 1 }));\n    },\n    focusNextItem() {\n      focusCell(focusedDate.add({ years: 1 }));\n    },\n    focusPreviousRow() {\n      focusCell(focusedDate.subtract({ years: ITEMS_PER_ROW }));\n    },\n    focusNextRow() {\n      focusCell(focusedDate.add({ years: ITEMS_PER_ROW }));\n    },\n    focusSectionStart() {\n      focusCell(focusedDate.set({ year: startYear }));\n    },\n    focusSectionEnd() {\n      focusCell(focusedDate.set({ year: endYear }));\n    },\n    focusPreviousSection(shouldSkip) {\n      focusCell(focusedDate.subtract({ years: shouldSkip ? YEARS_SKIP_AMOUNT : YEARS_PER_SECTION }));\n    },\n    focusNextSection(shouldSkip) {\n      focusCell(focusedDate.add({ years: shouldSkip ? YEARS_SKIP_AMOUNT : YEARS_PER_SECTION }));\n    },\n    isPreviousSectionInvalid() {\n      const current = startOfYear(focusedDate.set({ year: startYear }));\n      const prev = current.subtract({ days: 1 });\n\n      return (\n        isDateInvalid(current, calendarState.minValue, calendarState.maxValue) ||\n        isDateInvalid(prev, calendarState.minValue, calendarState.maxValue) ||\n        isSameDay(prev, current)\n      );\n    },\n    isNextSectionInvalid() {\n      const current = endOfYear(focusedDate.set({ year: endYear }));\n      const next = current.add({ days: 1 });\n\n      return (\n        isDateInvalid(current, calendarState.minValue, calendarState.maxValue) ||\n        isDateInvalid(next, calendarState.minValue, calendarState.maxValue) ||\n        isSameDay(next, current)\n      );\n    },\n    selectFocusedDate() {\n      switchToView('year');\n    },\n    isCellDisabled(date) {\n      return (\n        isDateInvalid(endOfYear(date), calendarState.minValue, null) ||\n        isDateInvalid(startOfYear(date), null, calendarState.maxValue)\n      );\n    },\n    isCellSelected(date) {\n      return calendarState.value !== null && isSameYear(date, calendarState.value);\n    },\n    isCellTabbable(date) {\n      return isSameYear(date, focusedDate);\n    },\n  };\n}\n"]}

package/dist/commonjs/components/date-picker/views/types.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=types.d.ts.map

package/dist/commonjs/components/date-picker/views/types.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.d.ts","sourceRoot":"","sources":["../../../../../src/components/date-picker/views/types.ts"],"names":[],"mappings":""}

package/dist/commonjs/components/date-picker/views/types.js

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=types.js.map

package/dist/commonjs/components/date-picker/views/types.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"types.js","sourceRoot":"","sources":["../../../../../src/components/date-picker/views/types.ts"],"names":[],"mappings":"","sourcesContent":["import type { CalendarDate } from '@internationalized/date';\n\n/** @internal */\nexport interface ViewGridCellData {\n  date: CalendarDate;\n  content: string;\n  ariaLabel: string;\n  isCurrent: boolean;\n}\n\n/** @internal */\nexport interface ViewGridState {\n  header: string;\n  previousLabel: string;\n  nextLabel: string;\n  data: (ViewGridCellData | null)[][];\n  isReadOnly: boolean;\n  isDisabled: boolean;\n  isFocused: boolean;\n  setIsFocused(value: boolean): void;\n  focusedDate: CalendarDate;\n  setFocusedDate(date: CalendarDate): void;\n  timeZone: string;\n  focusPreviousItem(): void;\n  focusNextItem(): void;\n  focusPreviousRow(): void;\n  focusNextRow(): void;\n  focusSectionStart(): void;\n  focusSectionEnd(): void;\n  focusPreviousSection(shouldSkip?: boolean): void;\n  focusNextSection(shouldSkip?: boolean): void;\n  isPreviousSectionInvalid(): boolean;\n  isNextSectionInvalid(): boolean;\n  selectFocusedDate(): void;\n  isCellDisabled(date: CalendarDate): boolean;\n  isCellSelected(date: CalendarDate): boolean;\n  isCellTabbable(date: CalendarDate): boolean;\n}\n"]}

package/dist/commonjs/components/date-picker/views/use-view-header.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=use-view-header.d.ts.map

package/dist/commonjs/components/date-picker/views/use-view-header.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-view-header.d.ts","sourceRoot":"","sources":["../../../../../src/components/date-picker/views/use-view-header.tsx"],"names":[],"mappings":""}

package/dist/commonjs/components/date-picker/views/use-view-header.js

@@ -0,0 +1,56 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.useViewHeader = useViewHeader;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const live_announcer_1 = require("@react-aria/live-announcer");
+const utils_1 = require("@react-aria/utils");
+const react_1 = require("react");
+const index_js_1 = require("../../../icons/index.js");
+/** @internal */
+function useViewHeader(state) {
+    const { isFocused, header } = state;
+    // Announce when the section changes
+    (0, utils_1.useUpdateEffect)(() => {
+        // only when pressing the Previous or Next button
+        if (!isFocused) {
+            (0, live_announcer_1.announce)(header);
+        }
+        // eslint-disable-next-line react-hooks/exhaustive-deps
+    }, [header]);
+    // If the next or previous buttons become disabled while they are focused, move focus to the grid.
+    const [previousFocused, setPreviousFocused] = (0, react_1.useState)(false);
+    const previousDisabled = state.isDisabled || state.isPreviousSectionInvalid();
+    if (previousDisabled && previousFocused) {
+        setPreviousFocused(false);
+        state.setIsFocused(true);
+    }
+    const [nextFocused, setNextFocused] = (0, react_1.useState)(false);
+    const nextDisabled = state.isDisabled || state.isNextSectionInvalid();
+    if (nextDisabled && nextFocused) {
+        setNextFocused(false);
+        state.setIsFocused(true);
+    }
+    return {
+        prevButtonProps: {
+            onPress: () => state.focusPreviousSection(),
+            'aria-label': state.previousLabel,
+            icon: (0, jsx_runtime_1.jsx)(index_js_1.IconChevronLeft, {}),
+            variant: 'tertiary',
+            size: 'small',
+            isDisabled: previousDisabled,
+            // @ts-expect-error our buttons don't expose `onFocusChange`, but it gets passed to React Aria anyway
+            onFocusChange: setPreviousFocused,
+        },
+        nextButtonProps: {
+            onPress: () => state.focusNextSection(),
+            'aria-label': state.nextLabel,
+            icon: (0, jsx_runtime_1.jsx)(index_js_1.IconChevronRight, {}),
+            variant: 'tertiary',
+            size: 'small',
+            isDisabled: nextDisabled,
+            // @ts-expect-error our buttons don't expose `onFocusChange`, but it gets passed to React Aria anyway
+            onFocusChange: setNextFocused,
+        },
+    };
+}
+//# sourceMappingURL=use-view-header.js.map

package/dist/commonjs/components/date-picker/views/use-view-header.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"use-view-header.js","sourceRoot":"","sources":["../../../../../src/components/date-picker/views/use-view-header.tsx"],"names":[],"mappings":";;AAaA,sCAiDC;;AA9DD,+DAAsD;AACtD,6CAAoD;AACpD,iCAAiC;AACjC,sDAA4E;AAS5E,gBAAgB;AAChB,SAAgB,aAAa,CAAC,KAAoB;IAChD,MAAM,EAAE,SAAS,EAAE,MAAM,EAAE,GAAG,KAAK,CAAC;IAEpC,oCAAoC;IACpC,IAAA,uBAAe,EAAC,GAAG,EAAE;QACnB,iDAAiD;QACjD,IAAI,CAAC,SAAS,EAAE,CAAC;YACf,IAAA,yBAAQ,EAAC,MAAM,CAAC,CAAC;QACnB,CAAC;QACD,uDAAuD;IACzD,CAAC,EAAE,CAAC,MAAM,CAAC,CAAC,CAAC;IAEb,kGAAkG;IAClG,MAAM,CAAC,eAAe,EAAE,kBAAkB,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IAC9D,MAAM,gBAAgB,GAAG,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,wBAAwB,EAAE,CAAC;IAC9E,IAAI,gBAAgB,IAAI,eAAe,EAAE,CAAC;QACxC,kBAAkB,CAAC,KAAK,CAAC,CAAC;QAC1B,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC;IAED,MAAM,CAAC,WAAW,EAAE,cAAc,CAAC,GAAG,IAAA,gBAAQ,EAAC,KAAK,CAAC,CAAC;IACtD,MAAM,YAAY,GAAG,KAAK,CAAC,UAAU,IAAI,KAAK,CAAC,oBAAoB,EAAE,CAAC;IACtE,IAAI,YAAY,IAAI,WAAW,EAAE,CAAC;QAChC,cAAc,CAAC,KAAK,CAAC,CAAC;QACtB,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,CAAC;IAC3B,CAAC;IAED,OAAO;QACL,eAAe,EAAE;YACf,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,oBAAoB,EAAE;YAC3C,YAAY,EAAE,KAAK,CAAC,aAAa;YACjC,IAAI,EAAE,uBAAC,0BAAe,KAAG;YACzB,OAAO,EAAE,UAAU;YACnB,IAAI,EAAE,OAAO;YACb,UAAU,EAAE,gBAAgB;YAC5B,qGAAqG;YACrG,aAAa,EAAE,kBAAkB;SAClC;QACD,eAAe,EAAE;YACf,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,gBAAgB,EAAE;YACvC,YAAY,EAAE,KAAK,CAAC,SAAS;YAC7B,IAAI,EAAE,uBAAC,2BAAgB,KAAG;YAC1B,OAAO,EAAE,UAAU;YACnB,IAAI,EAAE,OAAO;YACb,UAAU,EAAE,YAAY;YACxB,qGAAqG;YACrG,aAAa,EAAE,cAAc;SAC9B;KACF,CAAC;AACJ,CAAC","sourcesContent":["import { announce } from '@react-aria/live-announcer';\nimport { useUpdateEffect } from '@react-aria/utils';\nimport { useState } from 'react';\nimport { IconChevronLeft, IconChevronRight } from '../../../icons/index.js';\nimport type { IconButtonProps } from '../../button/icon-button.js';\nimport type { ViewGridState } from './types.js';\n\ninterface UseViewHeader {\n  prevButtonProps: IconButtonProps;\n  nextButtonProps: IconButtonProps;\n}\n\n/** @internal */\nexport function useViewHeader(state: ViewGridState): UseViewHeader {\n  const { isFocused, header } = state;\n\n  // Announce when the section changes\n  useUpdateEffect(() => {\n    // only when pressing the Previous or Next button\n    if (!isFocused) {\n      announce(header);\n    }\n    // eslint-disable-next-line react-hooks/exhaustive-deps\n  }, [header]);\n\n  // If the next or previous buttons become disabled while they are focused, move focus to the grid.\n  const [previousFocused, setPreviousFocused] = useState(false);\n  const previousDisabled = state.isDisabled || state.isPreviousSectionInvalid();\n  if (previousDisabled && previousFocused) {\n    setPreviousFocused(false);\n    state.setIsFocused(true);\n  }\n\n  const [nextFocused, setNextFocused] = useState(false);\n  const nextDisabled = state.isDisabled || state.isNextSectionInvalid();\n  if (nextDisabled && nextFocused) {\n    setNextFocused(false);\n    state.setIsFocused(true);\n  }\n\n  return {\n    prevButtonProps: {\n      onPress: () => state.focusPreviousSection(),\n      'aria-label': state.previousLabel,\n      icon: <IconChevronLeft />,\n      variant: 'tertiary',\n      size: 'small',\n      isDisabled: previousDisabled,\n      // @ts-expect-error our buttons don't expose `onFocusChange`, but it gets passed to React Aria anyway\n      onFocusChange: setPreviousFocused,\n    },\n    nextButtonProps: {\n      onPress: () => state.focusNextSection(),\n      'aria-label': state.nextLabel,\n      icon: <IconChevronRight />,\n      variant: 'tertiary',\n      size: 'small',\n      isDisabled: nextDisabled,\n      // @ts-expect-error our buttons don't expose `onFocusChange`, but it gets passed to React Aria anyway\n      onFocusChange: setNextFocused,\n    },\n  };\n}\n"]}

package/dist/commonjs/components/date-picker/views/view-grid-cell.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=view-grid-cell.d.ts.map

package/dist/commonjs/components/date-picker/views/view-grid-cell.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"view-grid-cell.d.ts","sourceRoot":"","sources":["../../../../../src/components/date-picker/views/view-grid-cell.tsx"],"names":[],"mappings":""}

package/dist/commonjs/components/date-picker/views/view-grid-cell.js

@@ -0,0 +1,72 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ViewGridCell = ViewGridCell;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const focus_1 = require("@react-aria/focus");
+const interactions_1 = require("@react-aria/interactions");
+const utils_1 = require("@react-aria/utils");
+const clsx_1 = __importDefault(require("clsx"));
+const react_1 = require("react");
+const utils_js_1 = require("../../typography/utils.js");
+/** @internal */
+function ViewGridCell({ cellData, state }) {
+    const ref = (0, react_1.useRef)(null);
+    const isDisabled = cellData ? state.isDisabled || state.isCellDisabled(cellData.date) : true;
+    const isSelected = cellData ? !isDisabled && state.isCellSelected(cellData.date) : false;
+    const isTabbable = cellData ? state.isCellTabbable(cellData.date) : false;
+    const isFocused = state.isFocused && isTabbable;
+    const { pressProps, isPressed } = (0, interactions_1.usePress)({
+        preventFocusOnPress: true,
+        isDisabled: isDisabled || state.isReadOnly,
+        onPress: () => {
+            if (!state.isReadOnly && cellData) {
+                state.setFocusedDate(cellData.date);
+                state.selectFocusedDate();
+            }
+        },
+    });
+    let tabIndex = undefined;
+    if (!isDisabled) {
+        tabIndex = isTabbable ? 0 : -1;
+    }
+    // Focus the button in the DOM when the state updates.
+    (0, react_1.useEffect)(() => {
+        if (isFocused && ref.current) {
+            (0, utils_1.focusWithoutScrolling)(ref.current);
+            // Scroll into view if navigating with a keyboard
+            if ((0, interactions_1.getInteractionModality)() !== 'pointer' && document.activeElement === ref.current) {
+                (0, utils_1.scrollIntoViewport)(ref.current, { containingElement: (0, utils_1.getScrollParent)(ref.current) });
+            }
+        }
+    }, [isFocused]);
+    const { hoverProps, isHovered } = (0, interactions_1.useHover)({ isDisabled });
+    const { focusProps, isFocusVisible } = (0, focus_1.useFocusRing)();
+    const cellProps = {
+        role: 'gridcell',
+        'aria-disabled': isDisabled || undefined,
+        'aria-selected': isSelected || undefined,
+    };
+    if (!cellData) {
+        return (0, jsx_runtime_1.jsx)("td", { ...cellProps });
+    }
+    const { date, content, ariaLabel, isCurrent } = cellData;
+    const buttonProps = (0, utils_1.mergeProps)(pressProps, hoverProps, focusProps, {
+        onFocus() {
+            if (!isDisabled) {
+                state.setFocusedDate(date);
+            }
+        },
+        tabIndex,
+        role: 'button',
+        'aria-disabled': isDisabled || undefined,
+        'aria-label': ariaLabel,
+        onContextMenu(e) {
+            e.preventDefault();
+        },
+    });
+    return ((0, jsx_runtime_1.jsx)("td", { ...cellProps, children: (0, jsx_runtime_1.jsx)("div", { ...buttonProps, ref: ref, className: (0, clsx_1.default)('cim-date-picker-calendar-cell', (0, utils_js_1.textStyle)({ variant: isCurrent ? 'medium-semibold' : 'medium' })), "data-disabled": isDisabled || undefined, "data-hovered": isHovered || undefined, "data-pressed": isPressed || undefined, "data-selected": isSelected || undefined, "data-focus-visible": (isFocusVisible && isFocused) || undefined, "data-current": isCurrent || undefined, children: content }) }));
+}
+//# sourceMappingURL=view-grid-cell.js.map

package/dist/commonjs/components/date-picker/views/view-grid-cell.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"view-grid-cell.js","sourceRoot":"","sources":["../../../../../src/components/date-picker/views/view-grid-cell.tsx"],"names":[],"mappings":"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","sourcesContent":["import { useFocusRing } from '@react-aria/focus';\nimport { getInteractionModality, useHover, usePress } from '@react-aria/interactions';\nimport { focusWithoutScrolling, getScrollParent, mergeProps, scrollIntoViewport } from '@react-aria/utils';\nimport clsx from 'clsx';\nimport { type DOMAttributes, useEffect, useRef } from 'react';\nimport type { NativeElementProps } from '../../types.js';\nimport { textStyle } from '../../typography/utils.js';\nimport type { ViewGridCellData, ViewGridState } from './types.js';\n\n/** @internal */\nexport function ViewGridCell({ cellData, state }: { cellData: ViewGridCellData | null; state: ViewGridState }) {\n  const ref = useRef<HTMLDivElement>(null);\n\n  const isDisabled = cellData ? state.isDisabled || state.isCellDisabled(cellData.date) : true;\n  const isSelected = cellData ? !isDisabled && state.isCellSelected(cellData.date) : false;\n  const isTabbable = cellData ? state.isCellTabbable(cellData.date) : false;\n  const isFocused = state.isFocused && isTabbable;\n\n  const { pressProps, isPressed } = usePress({\n    preventFocusOnPress: true,\n    isDisabled: isDisabled || state.isReadOnly,\n    onPress: () => {\n      if (!state.isReadOnly && cellData) {\n        state.setFocusedDate(cellData.date);\n        state.selectFocusedDate();\n      }\n    },\n  });\n\n  let tabIndex: number | undefined = undefined;\n  if (!isDisabled) {\n    tabIndex = isTabbable ? 0 : -1;\n  }\n\n  // Focus the button in the DOM when the state updates.\n  useEffect(() => {\n    if (isFocused && ref.current) {\n      focusWithoutScrolling(ref.current);\n\n      // Scroll into view if navigating with a keyboard\n      if (getInteractionModality() !== 'pointer' && document.activeElement === ref.current) {\n        scrollIntoViewport(ref.current, { containingElement: getScrollParent(ref.current) });\n      }\n    }\n  }, [isFocused]);\n\n  const { hoverProps, isHovered } = useHover({ isDisabled });\n  const { focusProps, isFocusVisible } = useFocusRing();\n\n  const cellProps: NativeElementProps<HTMLTableCellElement> = {\n    role: 'gridcell',\n    'aria-disabled': isDisabled || undefined,\n    'aria-selected': isSelected || undefined,\n  };\n\n  if (!cellData) {\n    return <td {...cellProps} />;\n  }\n\n  const { date, content, ariaLabel, isCurrent } = cellData;\n\n  const buttonProps = mergeProps(pressProps, hoverProps, focusProps, {\n    onFocus() {\n      if (!isDisabled) {\n        state.setFocusedDate(date);\n      }\n    },\n    tabIndex,\n    role: 'button',\n    'aria-disabled': isDisabled || undefined,\n    'aria-label': ariaLabel,\n    onContextMenu(e) {\n      e.preventDefault();\n    },\n  } as DOMAttributes<HTMLDivElement>);\n\n  return (\n    <td {...cellProps}>\n      <div\n        {...buttonProps}\n        ref={ref}\n        className={clsx(\n          'cim-date-picker-calendar-cell',\n          textStyle({ variant: isCurrent ? 'medium-semibold' : 'medium' }),\n        )}\n        data-disabled={isDisabled || undefined}\n        data-hovered={isHovered || undefined}\n        data-pressed={isPressed || undefined}\n        data-selected={isSelected || undefined}\n        data-focus-visible={(isFocusVisible && isFocused) || undefined}\n        data-current={isCurrent || undefined}\n      >\n        {content}\n      </div>\n    </td>\n  );\n}\n"]}

package/dist/commonjs/components/date-picker/views/view-grid.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=view-grid.d.ts.map

package/dist/commonjs/components/date-picker/views/view-grid.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"view-grid.d.ts","sourceRoot":"","sources":["../../../../../src/components/date-picker/views/view-grid.tsx"],"names":[],"mappings":""}

package/dist/commonjs/components/date-picker/views/view-grid.js

@@ -0,0 +1,75 @@
+"use strict";
+var __importDefault = (this && this.__importDefault) || function (mod) {
+    return (mod && mod.__esModule) ? mod : { "default": mod };
+};
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.ViewGrid = ViewGrid;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const clsx_1 = __importDefault(require("clsx"));
+const index_js_1 = require("../../../i18n/index.js");
+const view_grid_cell_js_1 = require("./view-grid-cell.js");
+/** @internal */
+function ViewGrid({ state, className }) {
+    const { direction } = (0, index_js_1.useLocaleInfo)();
+    const onKeyDown = (e) => {
+        switch (e.key) {
+            case 'Enter':
+            case ' ':
+                e.preventDefault();
+                state.selectFocusedDate();
+                break;
+            case 'PageUp':
+                e.preventDefault();
+                e.stopPropagation();
+                state.focusPreviousSection(e.shiftKey);
+                break;
+            case 'PageDown':
+                e.preventDefault();
+                e.stopPropagation();
+                state.focusNextSection(e.shiftKey);
+                break;
+            case 'End':
+                e.preventDefault();
+                e.stopPropagation();
+                state.focusSectionEnd();
+                break;
+            case 'Home':
+                e.preventDefault();
+                e.stopPropagation();
+                state.focusSectionStart();
+                break;
+            case 'ArrowLeft':
+                e.preventDefault();
+                e.stopPropagation();
+                if (direction === 'rtl') {
+                    state.focusNextItem();
+                }
+                else {
+                    state.focusPreviousItem();
+                }
+                break;
+            case 'ArrowUp':
+                e.preventDefault();
+                e.stopPropagation();
+                state.focusPreviousRow();
+                break;
+            case 'ArrowRight':
+                e.preventDefault();
+                e.stopPropagation();
+                if (direction === 'rtl') {
+                    state.focusPreviousItem();
+                }
+                else {
+                    state.focusNextItem();
+                }
+                break;
+            case 'ArrowDown':
+                e.preventDefault();
+                e.stopPropagation();
+                state.focusNextRow();
+                break;
+        }
+    };
+    return ((0, jsx_runtime_1.jsx)("table", { role: "grid", className: (0, clsx_1.default)('cim-date-picker-view-grid', className), "aria-label": state.header, "aria-readonly": state.isReadOnly || undefined, "aria-disabled": state.isDisabled || undefined, onKeyDown: onKeyDown, onFocus: () => state.setIsFocused(true), onBlur: () => state.setIsFocused(false), children: (0, jsx_runtime_1.jsx)("tbody", { children: state.data.map((row, idx) => ((0, jsx_runtime_1.jsx)("tr", { children: row.map((cellData, idx) => ((0, jsx_runtime_1.jsx)(view_grid_cell_js_1.ViewGridCell, { cellData: cellData, state: state }, cellData?.ariaLabel ?? idx))) }, idx))) }) }));
+}
+//# sourceMappingURL=view-grid.js.map

package/dist/commonjs/components/date-picker/views/view-grid.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"view-grid.js","sourceRoot":"","sources":["../../../../../src/components/date-picker/views/view-grid.tsx"],"names":[],"mappings":";;;;;AAOA,4BAkFC;;AAzFD,gDAAwB;AAExB,qDAAuD;AAEvD,2DAAmD;AAEnD,gBAAgB;AAChB,SAAgB,QAAQ,CAAC,EAAE,KAAK,EAAE,SAAS,EAAgD;IACzF,MAAM,EAAE,SAAS,EAAE,GAAG,IAAA,wBAAa,GAAE,CAAC;IAEtC,MAAM,SAAS,GAAG,CAAC,CAAgB,EAAE,EAAE;QACrC,QAAQ,CAAC,CAAC,GAAG,EAAE,CAAC;YACd,KAAK,OAAO,CAAC;YACb,KAAK,GAAG;gBACN,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,KAAK,CAAC,iBAAiB,EAAE,CAAC;gBAC1B,MAAM;YACR,KAAK,QAAQ;gBACX,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,KAAK,CAAC,oBAAoB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;gBACvC,MAAM;YACR,KAAK,UAAU;gBACb,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,KAAK,CAAC,gBAAgB,CAAC,CAAC,CAAC,QAAQ,CAAC,CAAC;gBACnC,MAAM;YACR,KAAK,KAAK;gBACR,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,KAAK,CAAC,eAAe,EAAE,CAAC;gBACxB,MAAM;YACR,KAAK,MAAM;gBACT,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,KAAK,CAAC,iBAAiB,EAAE,CAAC;gBAC1B,MAAM;YACR,KAAK,WAAW;gBACd,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,IAAI,SAAS,KAAK,KAAK,EAAE,CAAC;oBACxB,KAAK,CAAC,aAAa,EAAE,CAAC;gBACxB,CAAC;qBAAM,CAAC;oBACN,KAAK,CAAC,iBAAiB,EAAE,CAAC;gBAC5B,CAAC;gBACD,MAAM;YACR,KAAK,SAAS;gBACZ,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,KAAK,CAAC,gBAAgB,EAAE,CAAC;gBACzB,MAAM;YACR,KAAK,YAAY;gBACf,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,IAAI,SAAS,KAAK,KAAK,EAAE,CAAC;oBACxB,KAAK,CAAC,iBAAiB,EAAE,CAAC;gBAC5B,CAAC;qBAAM,CAAC;oBACN,KAAK,CAAC,aAAa,EAAE,CAAC;gBACxB,CAAC;gBACD,MAAM;YACR,KAAK,WAAW;gBACd,CAAC,CAAC,cAAc,EAAE,CAAC;gBACnB,CAAC,CAAC,eAAe,EAAE,CAAC;gBACpB,KAAK,CAAC,YAAY,EAAE,CAAC;gBACrB,MAAM;QACV,CAAC;IACH,CAAC,CAAC;IACF,OAAO,CACL,kCACE,IAAI,EAAC,MAAM,EACX,SAAS,EAAE,IAAA,cAAI,EAAC,2BAA2B,EAAE,SAAS,CAAC,gBAC3C,KAAK,CAAC,MAAM,mBACT,KAAK,CAAC,UAAU,IAAI,SAAS,mBAC7B,KAAK,CAAC,UAAU,IAAI,SAAS,EAC5C,SAAS,EAAE,SAAS,EACpB,OAAO,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,IAAI,CAAC,EACvC,MAAM,EAAE,GAAG,EAAE,CAAC,KAAK,CAAC,YAAY,CAAC,KAAK,CAAC,YAEvC,4CACG,KAAK,CAAC,IAAI,CAAC,GAAG,CAAC,CAAC,GAAG,EAAE,GAAG,EAAE,EAAE,CAAC,CAC5B,yCACG,GAAG,CAAC,GAAG,CAAC,CAAC,QAAQ,EAAE,GAAG,EAAE,EAAE,CAAC,CAC1B,uBAAC,gCAAY,IAAC,QAAQ,EAAE,QAAQ,EAAmC,KAAK,EAAE,KAAK,IAAxC,QAAQ,EAAE,SAAS,IAAI,GAAG,CAAkB,CACpF,CAAC,IAHK,GAAG,CAIP,CACN,CAAC,GACI,GACF,CACT,CAAC;AACJ,CAAC","sourcesContent":["import clsx from 'clsx';\nimport type { KeyboardEvent } from 'react';\nimport { useLocaleInfo } from '../../../i18n/index.js';\nimport type { ViewGridState } from './types.js';\nimport { ViewGridCell } from './view-grid-cell.js';\n\n/** @internal */\nexport function ViewGrid({ state, className }: { state: ViewGridState; className?: string }) {\n  const { direction } = useLocaleInfo();\n\n  const onKeyDown = (e: KeyboardEvent) => {\n    switch (e.key) {\n      case 'Enter':\n      case ' ':\n        e.preventDefault();\n        state.selectFocusedDate();\n        break;\n      case 'PageUp':\n        e.preventDefault();\n        e.stopPropagation();\n        state.focusPreviousSection(e.shiftKey);\n        break;\n      case 'PageDown':\n        e.preventDefault();\n        e.stopPropagation();\n        state.focusNextSection(e.shiftKey);\n        break;\n      case 'End':\n        e.preventDefault();\n        e.stopPropagation();\n        state.focusSectionEnd();\n        break;\n      case 'Home':\n        e.preventDefault();\n        e.stopPropagation();\n        state.focusSectionStart();\n        break;\n      case 'ArrowLeft':\n        e.preventDefault();\n        e.stopPropagation();\n        if (direction === 'rtl') {\n          state.focusNextItem();\n        } else {\n          state.focusPreviousItem();\n        }\n        break;\n      case 'ArrowUp':\n        e.preventDefault();\n        e.stopPropagation();\n        state.focusPreviousRow();\n        break;\n      case 'ArrowRight':\n        e.preventDefault();\n        e.stopPropagation();\n        if (direction === 'rtl') {\n          state.focusPreviousItem();\n        } else {\n          state.focusNextItem();\n        }\n        break;\n      case 'ArrowDown':\n        e.preventDefault();\n        e.stopPropagation();\n        state.focusNextRow();\n        break;\n    }\n  };\n  return (\n    <table\n      role=\"grid\"\n      className={clsx('cim-date-picker-view-grid', className)}\n      aria-label={state.header}\n      aria-readonly={state.isReadOnly || undefined}\n      aria-disabled={state.isDisabled || undefined}\n      onKeyDown={onKeyDown}\n      onFocus={() => state.setIsFocused(true)}\n      onBlur={() => state.setIsFocused(false)}\n    >\n      <tbody>\n        {state.data.map((row, idx) => (\n          <tr key={idx}>\n            {row.map((cellData, idx) => (\n              <ViewGridCell cellData={cellData} key={cellData?.ariaLabel ?? idx} state={state} />\n            ))}\n          </tr>\n        ))}\n      </tbody>\n    </table>\n  );\n}\n"]}

package/dist/commonjs/components/date-picker/views/view-provider.d.ts

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=view-provider.d.ts.map

package/dist/commonjs/components/date-picker/views/view-provider.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"view-provider.d.ts","sourceRoot":"","sources":["../../../../../src/components/date-picker/views/view-provider.tsx"],"names":[],"mappings":""}

package/dist/commonjs/components/date-picker/views/view-provider.js

@@ -0,0 +1,21 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+exports.DatePickerViewProvider = DatePickerViewProvider;
+exports.useDatePickerView = useDatePickerView;
+const jsx_runtime_1 = require("react/jsx-runtime");
+const react_1 = require("react");
+const DatePickerViewContext = (0, react_1.createContext)(null);
+/** @internal */
+function DatePickerViewProvider({ children, currentView, switchToView, focusedDate, setFocusedDate, }) {
+    return ((0, jsx_runtime_1.jsx)(DatePickerViewContext.Provider, { value: { currentView, switchToView, focusedDate, setFocusedDate }, children: children }));
+}
+/** @internal */
+// eslint-disable-next-line react-refresh/only-export-components
+function useDatePickerView() {
+    const state = (0, react_1.useContext)(DatePickerViewContext);
+    if (!state) {
+        throw new Error('Cannot use date picker view state outside of a date picker');
+    }
+    return state;
+}
+//# sourceMappingURL=view-provider.js.map