@salt-ds/lab 1.0.0-alpha.55 → 1.0.0-alpha.57

package/dist-es/calendar/CalendarNavigation.js

@@ -1,15 +1,13 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
 import { makePrefixer, useIcon, Button, Dropdown, Tooltip, useListControlContext, Option } from '@salt-ds/core';
-import { clsx } from 'clsx';
-import { forwardRef, useCallback, useMemo } from 'react';
-import { useCalendarContext } from './internal/CalendarContext.js';
-import { CALENDAR_MAX_YEAR, CALENDAR_MIN_YEAR } from './useCalendarSelection.js';
-import { isSameMonth, isSameYear, CalendarDate } from '@internationalized/date';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
+import { clsx } from 'clsx';
+import { forwardRef, useCallback, useMemo } from 'react';
+import { useLocalization } from '../localization-provider/LocalizationProvider.js';
 import css_248z from './CalendarNavigation.css.js';
-import { formatDate } from './formatDate.js';
-import { monthsForLocale, monthDiff } from './internal/utils.js';
+import { useCalendarContext } from './internal/CalendarContext.js';
+import { generateMonthsForYear, monthDiff } from './internal/utils.js';
 
 const withBaseName = makePrefixer("saltCalendarNavigation");
 const ConditionalTooltip = ({
@@ -22,16 +20,18 @@ const ConditionalTooltip = ({
   }
   return /* @__PURE__ */ jsx(Tooltip, { ...rest, children });
 };
-function generateYearsBetweenRange(minYear, maxYear) {
+function generateYearsBetweenRange(dateAdapter, minYear, maxYear) {
   const years = [];
   for (let year = minYear; year <= maxYear; year++) {
-    years.push(new CalendarDate(year, 1, 1));
+    let startOfYear = dateAdapter.today();
+    startOfYear = dateAdapter.set(startOfYear, { day: 1, month: 1, year });
+    years.push(startOfYear);
   }
   return years;
 }
 function useCalendarNavigation() {
   const {
-    state: { visibleMonth, minDate, maxDate, locale, timeZone },
+    state: { visibleMonth, locale, minDate, maxDate },
     helpers: {
       setVisibleMonth,
       isDayVisible,
@@ -39,77 +39,87 @@ function useCalendarNavigation() {
       isOutsideAllowedMonths
     }
   } = useCalendarContext();
+  const { dateAdapter } = useLocalization();
   const moveToNextMonth = useCallback(
     (event, step = 1) => {
-      setVisibleMonth(event, visibleMonth.add({ months: step }));
+      setVisibleMonth(event, dateAdapter.add(visibleMonth, { months: step }));
     },
-    [setVisibleMonth, visibleMonth]
+    [dateAdapter, setVisibleMonth, visibleMonth]
   );
   const moveToPreviousMonth = useCallback(
     (event, step = 1) => {
-      setVisibleMonth(event, visibleMonth.subtract({ months: step }));
+      setVisibleMonth(
+        event,
+        dateAdapter.subtract(visibleMonth, { months: step })
+      );
     },
-    [setVisibleMonth, visibleMonth]
+    [dateAdapter, setVisibleMonth, visibleMonth]
   );
   const moveToMonth = useCallback(
     (event, month) => {
       let newMonth = month;
-      if (!isOutsideAllowedYears(newMonth)) {
-        if (isOutsideAllowedMonths(newMonth)) {
-          const navigableMonths = monthsForLocale(visibleMonth, locale).filter(
-            (n) => !isOutsideAllowedMonths(n)
-          );
-          newMonth = navigableMonths.reduce(
-            (closestMonth, currentMonth) => Math.abs(monthDiff(currentMonth, newMonth)) < Math.abs(monthDiff(closestMonth, newMonth)) ? currentMonth : closestMonth
-          );
-        }
-        setVisibleMonth(event, newMonth);
+      if (isOutsideAllowedMonths(newMonth)) {
+        const navigableMonths = generateMonthsForYear(
+          dateAdapter,
+          visibleMonth
+        ).filter((n) => !isOutsideAllowedMonths(n));
+        newMonth = navigableMonths.reduce(
+          (closestMonth, currentMonth) => Math.abs(monthDiff(dateAdapter, currentMonth, newMonth)) < Math.abs(monthDiff(dateAdapter, closestMonth, newMonth)) ? currentMonth : closestMonth
+        );
       }
+      setVisibleMonth(event, newMonth);
     },
     [
+      dateAdapter,
       isOutsideAllowedYears,
       isOutsideAllowedMonths,
       setVisibleMonth,
-      visibleMonth,
-      locale
+      visibleMonth
     ]
   );
   const months = useMemo(
-    () => monthsForLocale(visibleMonth, locale),
-    [visibleMonth, locale]
+    () => generateMonthsForYear(dateAdapter, visibleMonth),
+    [visibleMonth]
   );
   const years = useMemo(
     () => generateYearsBetweenRange(
-      Math.min(minDate ? minDate.year : CALENDAR_MIN_YEAR, visibleMonth.year),
-      Math.max(maxDate ? maxDate.year : CALENDAR_MAX_YEAR, visibleMonth.year)
+      dateAdapter,
+      Math.min(
+        dateAdapter.getYear(minDate),
+        dateAdapter.getYear(visibleMonth)
+      ),
+      Math.max(
+        dateAdapter.getYear(maxDate),
+        dateAdapter.getYear(visibleMonth)
+      )
     ),
-    [minDate, maxDate, visibleMonth.year]
+    [dateAdapter, minDate, maxDate, visibleMonth]
   );
   const selectedMonth = months.find(
-    (month) => isSameMonth(month, visibleMonth)
+    (month) => dateAdapter.isSame(month, visibleMonth, "month")
   );
   const selectedYear = years.find(
-    (year) => isSameYear(year, visibleMonth)
+    (year) => dateAdapter.isSame(year, visibleMonth, "year")
   );
-  const canNavigatePrevious = !(minDate && isDayVisible(minDate));
-  const canNavigateNext = !(maxDate && isDayVisible(maxDate));
+  const canNavigatePrevious = !isDayVisible(minDate);
+  const canNavigateNext = !isDayVisible(maxDate);
   return useMemo(
     () => ({
       moveToNextMonth,
       moveToPreviousMonth,
       moveToMonth,
       visibleMonth,
+      locale,
       months,
       years,
       canNavigateNext,
       canNavigatePrevious,
       selectedMonth,
       selectedYear,
-      isOutsideAllowedMonths,
-      locale,
-      timeZone
+      isOutsideAllowedMonths
     }),
     [
+      locale,
       months,
       moveToPreviousMonth,
       moveToNextMonth,
@@ -120,18 +130,16 @@ function useCalendarNavigation() {
       canNavigatePrevious,
       selectedMonth,
       selectedYear,
-      isOutsideAllowedMonths,
-      locale,
-      timeZone
+      isOutsideAllowedMonths
     ]
   );
 }
-const OptionWithTooltip = ({
+function OptionWithTooltip({
   value,
   children,
   disabled = false,
   tooltipContent
-}) => {
+}) {
   const { activeState, openState } = useListControlContext();
   const open = (activeState == null ? void 0 : activeState.value) === value;
   return /* @__PURE__ */ jsx(
@@ -146,174 +154,184 @@ const OptionWithTooltip = ({
       children: /* @__PURE__ */ jsx(Option, { value, disabled, children })
     }
   );
-};
-const CalendarNavigation = forwardRef(function CalendarNavigation2(props, ref) {
-  const {
-    className,
-    formatMonth: formatMonthProp,
-    formatYear: formatYearProp,
-    MonthDropdownProps,
-    YearDropdownProps,
-    hideYearDropdown,
-    step = 1,
-    ...rest
-  } = props;
-  const targetWindow = useWindow();
-  useComponentCssInjection({
-    testId: "salt-calendar-navigation",
-    css: css_248z,
-    window: targetWindow
-  });
-  const { NextIcon, PreviousIcon } = useIcon();
-  const {
-    moveToPreviousMonth,
-    moveToNextMonth,
-    moveToMonth,
-    months,
-    years,
-    canNavigateNext,
-    canNavigatePrevious,
-    selectedMonth,
-    selectedYear,
-    isOutsideAllowedMonths,
-    locale
-  } = useCalendarNavigation();
-  const handleNavigatePrevious = useCallback(
-    (event) => {
-      moveToPreviousMonth(event, step);
-    },
-    [moveToPreviousMonth, step]
-  );
-  const handleNavigateNext = useCallback(
-    (event) => {
-      moveToNextMonth(event, step);
-    },
-    [moveToNextMonth, step]
-  );
-  const handleMonthSelect = useCallback(
-    (event, month) => {
-      moveToMonth(event, month[0]);
-    },
-    [moveToMonth]
-  );
-  const handleYearSelect = useCallback(
-    (event, year) => {
-      moveToMonth(event, year[0]);
-    },
-    [moveToMonth]
-  );
-  const formatMonth = useCallback(
-    (date) => {
-      if (date && formatMonthProp) {
-        return formatMonthProp(date);
-      }
-      return !date ? "" : formatDate(date, locale, {
-        month: hideYearDropdown ? "long" : "short",
-        day: void 0,
-        year: void 0
-      });
-    },
-    [formatMonthProp]
-  );
-  const formatYear = useCallback(
-    (date) => {
-      if (date && formatYearProp) {
-        return formatYearProp(date);
-      }
-      return !date ? "" : `${date.year}`;
-    },
-    [formatYearProp]
-  );
-  return /* @__PURE__ */ jsxs(
-    "div",
-    {
-      className: clsx(
-        withBaseName(),
-        { [withBaseName("hideYearDropdown")]: hideYearDropdown },
-        className
-      ),
-      ref,
-      ...rest,
-      children: [
-        /* @__PURE__ */ jsx(
-          ConditionalTooltip,
-          {
-            placement: "top",
-            disabled: canNavigatePrevious,
-            content: "Past dates are out of range",
-            enterDelay: 0,
-            leaveDelay: 0,
-            children: /* @__PURE__ */ jsx(
-              Button,
-              {
-                disabled: !canNavigatePrevious,
-                appearance: "transparent",
-                sentiment: "neutral",
-                onClick: handleNavigatePrevious,
-                focusableWhenDisabled: true,
-                children: /* @__PURE__ */ jsx(PreviousIcon, { "aria-label": "Previous Month" })
-              }
-            )
-          }
+}
+const CalendarNavigation = forwardRef(
+  (props, ref) => {
+    const {
+      className,
+      formatMonth: formatMonthProp,
+      formatYear: formatYearProp,
+      MonthDropdownProps,
+      YearDropdownProps,
+      hideYearDropdown,
+      step = 1,
+      ...rest
+    } = props;
+    const { dateAdapter } = useLocalization();
+    const targetWindow = useWindow();
+    useComponentCssInjection({
+      testId: "salt-calendar-navigation",
+      css: css_248z,
+      window: targetWindow
+    });
+    const { NextIcon, PreviousIcon } = useIcon();
+    const {
+      locale,
+      moveToPreviousMonth,
+      moveToNextMonth,
+      moveToMonth,
+      months,
+      years,
+      canNavigateNext,
+      canNavigatePrevious,
+      selectedMonth,
+      selectedYear,
+      isOutsideAllowedMonths,
+      visibleMonth
+    } = useCalendarNavigation();
+    const handleNavigatePrevious = useCallback(
+      (event) => {
+        moveToPreviousMonth(event, step);
+      },
+      [moveToPreviousMonth, step]
+    );
+    const handleNavigateNext = useCallback(
+      (event) => {
+        moveToNextMonth(event, step);
+      },
+      [moveToNextMonth, step]
+    );
+    const handleMonthSelect = useCallback(
+      (event, month) => {
+        moveToMonth(event, month[0]);
+      },
+      [moveToMonth]
+    );
+    const handleYearSelect = useCallback(
+      (event, year) => {
+        let newVisibleMonth = dateAdapter.clone(visibleMonth);
+        newVisibleMonth = dateAdapter.set(newVisibleMonth, {
+          year: dateAdapter.getYear(year[0])
+        });
+        moveToMonth(event, newVisibleMonth);
+      },
+      [moveToMonth, visibleMonth]
+    );
+    const formatMonth = useCallback(
+      (date) => {
+        if (date && formatMonthProp) {
+          return dateAdapter.format(date, formatMonthProp, locale);
+        }
+        return date ? dateAdapter.format(date, hideYearDropdown ? "MMMM" : "MMM") : "";
+      },
+      [dateAdapter, formatMonthProp, locale]
+    );
+    const formatYear = useCallback(
+      (date) => {
+        if (date && formatYearProp) {
+          return dateAdapter.format(date, formatYearProp);
+        }
+        return !date ? "" : `${dateAdapter.format(date, "YYYY")}`;
+      },
+      [dateAdapter, formatYearProp]
+    );
+    return /* @__PURE__ */ jsxs(
+      "div",
+      {
+        className: clsx(
+          withBaseName(),
+          { [withBaseName("hideYearDropdown")]: hideYearDropdown },
+          className
         ),
-        /* @__PURE__ */ jsxs("div", { className: clsx({ [withBaseName("dropdowns")]: !hideYearDropdown }), children: [
+        ref,
+        ...rest,
+        children: [
           /* @__PURE__ */ jsx(
-            Dropdown,
+            ConditionalTooltip,
             {
-              "aria-label": "Month Dropdown",
-              selected: selectedMonth ? [selectedMonth] : [],
-              value: formatMonth(selectedMonth),
-              onSelectionChange: handleMonthSelect,
-              ...MonthDropdownProps,
-              children: months.map((month) => /* @__PURE__ */ jsx(
-                OptionWithTooltip,
+              placement: "top",
+              disabled: canNavigatePrevious,
+              content: "Past dates are out of range",
+              enterDelay: 0,
+              leaveDelay: 0,
+              children: /* @__PURE__ */ jsx(
+                Button,
                 {
-                  value: month,
-                  disabled: isOutsideAllowedMonths(month),
-                  tooltipContent: "This month is out of range",
-                  children: formatMonth(month)
-                },
-                formatMonth(month)
-              ))
+                  disabled: !canNavigatePrevious,
+                  appearance: "transparent",
+                  sentiment: "neutral",
+                  onClick: handleNavigatePrevious,
+                  focusableWhenDisabled: true,
+                  children: /* @__PURE__ */ jsx(PreviousIcon, { "aria-label": "Previous Month" })
+                }
+              )
             }
           ),
-          !hideYearDropdown && /* @__PURE__ */ jsx(
-            Dropdown,
+          /* @__PURE__ */ jsxs(
+            "div",
             {
-              "aria-label": "Year Dropdown",
-              selected: selectedYear ? [selectedYear] : [],
-              value: formatYear(selectedYear),
-              onSelectionChange: handleYearSelect,
-              ...YearDropdownProps,
-              children: years.map((year) => /* @__PURE__ */ jsx(OptionWithTooltip, { value: year, children: formatYear(year) }, formatYear(year)))
+              className: clsx({ [withBaseName("dropdowns")]: !hideYearDropdown }),
+              children: [
+                /* @__PURE__ */ jsx(
+                  Dropdown,
+                  {
+                    "aria-label": "Month Dropdown",
+                    selected: selectedMonth ? [selectedMonth] : [],
+                    value: formatMonth(selectedMonth),
+                    onSelectionChange: handleMonthSelect,
+                    ...MonthDropdownProps,
+                    children: months.map((month) => /* @__PURE__ */ jsx(
+                      OptionWithTooltip,
+                      {
+                        value: month,
+                        disabled: isOutsideAllowedMonths(month),
+                        tooltipContent: "This month is out of range",
+                        children: formatMonth(month)
+                      },
+                      formatMonth(month)
+                    ))
+                  }
+                ),
+                !hideYearDropdown && /* @__PURE__ */ jsx(
+                  Dropdown,
+                  {
+                    "aria-label": "Year Dropdown",
+                    selected: selectedYear ? [selectedYear] : [],
+                    value: formatYear(selectedYear),
+                    onSelectionChange: handleYearSelect,
+                    ...YearDropdownProps,
+                    children: years.map((year) => /* @__PURE__ */ jsx(OptionWithTooltip, { value: year, children: formatYear(year) }, formatYear(year)))
+                  }
+                )
+              ]
+            }
+          ),
+          /* @__PURE__ */ jsx(
+            ConditionalTooltip,
+            {
+              placement: "top",
+              disabled: canNavigateNext,
+              content: "Future dates are out of range",
+              enterDelay: 0,
+              leaveDelay: 0,
+              children: /* @__PURE__ */ jsx(
+                Button,
+                {
+                  disabled: !canNavigateNext,
+                  appearance: "transparent",
+                  sentiment: "neutral",
+                  onClick: handleNavigateNext,
+                  focusableWhenDisabled: true,
+                  children: /* @__PURE__ */ jsx(NextIcon, { "aria-label": "Next Month" })
+                }
+              )
             }
           )
-        ] }),
-        /* @__PURE__ */ jsx(
-          ConditionalTooltip,
-          {
-            placement: "top",
-            disabled: canNavigateNext,
-            content: "Future dates are out of range",
-            enterDelay: 0,
-            leaveDelay: 0,
-            children: /* @__PURE__ */ jsx(
-              Button,
-              {
-                disabled: !canNavigateNext,
-                appearance: "transparent",
-                sentiment: "neutral",
-                onClick: handleNavigateNext,
-                focusableWhenDisabled: true,
-                children: /* @__PURE__ */ jsx(NextIcon, { "aria-label": "Next Month" })
-              }
-            )
-          }
-        )
-      ]
-    }
-  );
-});
+        ]
+      }
+    );
+  }
+);
 
 export { CalendarNavigation };
 //# sourceMappingURL=CalendarNavigation.js.map

package/dist-es/calendar/CalendarNavigation.js.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarNavigation.js","sources":["../src/calendar/CalendarNavigation.tsx"],"sourcesContent":["import {\n  Button,\n  type ButtonProps,\n  Dropdown,\n  type DropdownProps,\n  Option,\n  type OptionProps,\n  Tooltip,\n  type TooltipProps,\n  makePrefixer,\n  useIcon,\n  useListControlContext,\n} from \"@salt-ds/core\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithRef,\n  type MouseEventHandler,\n  type SyntheticEvent,\n  forwardRef,\n  useCallback,\n  useMemo,\n} from \"react\";\nimport { useCalendarContext } from \"./internal/CalendarContext\";\nimport { CALENDAR_MAX_YEAR, CALENDAR_MIN_YEAR } from \"./useCalendarSelection\";\n\nimport {\n  CalendarDate,\n  type DateValue,\n  isSameMonth,\n  isSameYear,\n} from \"@internationalized/date\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport calendarNavigationCss from \"./CalendarNavigation.css\";\nimport { formatDate } from \"./formatDate\";\nimport { monthDiff, monthsForLocale } from \"./internal/utils\";\n\ntype DateDropdownProps = DropdownProps<DateValue>;\n\n/**\n * Props for the CalendarNavigation component.\n */\nexport interface CalendarNavigationProps extends ComponentPropsWithRef<\"div\"> {\n  /**\n   * Props for the month dropdown component.\n   */\n  MonthDropdownProps?: DateDropdownProps;\n\n  /**\n   * Props for the year dropdown component.\n   */\n  YearDropdownProps?: DateDropdownProps;\n\n  /**\n   * Callback fired when a month is selected.\n   * @param event - The change event.\n   */\n  onMonthSelect?: DateDropdownProps[\"onChange\"];\n\n  /**\n   * Callback fired when a year is selected.\n   * @param event - The change event.\n   */\n  onYearSelect?: DateDropdownProps[\"onChange\"];\n\n  /**\n   * Callback fired when navigating to the next month.\n   * @param event - The click event.\n   */\n  onNavigateNext?: ButtonProps[\"onClick\"];\n\n  /**\n   * Callback fired when navigating to the previous month.\n   * @param event - The click event.\n   */\n  onNavigatePrevious?: ButtonProps[\"onClick\"];\n\n  /**\n   * If `true`, hides the year dropdown.\n   */\n  hideYearDropdown?: boolean;\n\n  /**\n   * The step value for navigation. Defaults to 1.\n   */\n  step?: number;\n  /**\n   * Format the month dropdown values\n   * @param date\n   */\n  formatMonth?: (date: DateValue) => string;\n  /**\n   * Format the year dropdown values\n   * @param date\n   */\n  formatYear?: (date: DateValue) => string;\n}\n\ninterface OptionWithTooltipProps extends OptionProps {\n  value: DateValue;\n  tooltipContent?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarNavigation\");\n\nconst ConditionalTooltip: React.FC<TooltipProps> = ({\n  children,\n  disabled = true,\n  ...rest\n}) => {\n  if (disabled) {\n    return <>{children}</>;\n  }\n  return <Tooltip {...rest}>{children}</Tooltip>;\n};\n\nfunction generateYearsBetweenRange(\n  minYear: number,\n  maxYear: number,\n): DateValue[] {\n  const years: DateValue[] = [];\n  for (let year = minYear; year <= maxYear; year++) {\n    years.push(new CalendarDate(year, 1, 1));\n  }\n  return years;\n}\n\nfunction useCalendarNavigation() {\n  const {\n    state: { visibleMonth, minDate, maxDate, locale, timeZone },\n    helpers: {\n      setVisibleMonth,\n      isDayVisible,\n      isOutsideAllowedYears,\n      isOutsideAllowedMonths,\n    },\n  } = useCalendarContext();\n\n  const moveToNextMonth = useCallback(\n    (event: SyntheticEvent, step = 1) => {\n      setVisibleMonth(event, visibleMonth.add({ months: step }));\n    },\n    [setVisibleMonth, visibleMonth],\n  );\n\n  const moveToPreviousMonth = useCallback(\n    (event: SyntheticEvent, step = 1) => {\n      setVisibleMonth(event, visibleMonth.subtract({ months: step }));\n    },\n    [setVisibleMonth, visibleMonth],\n  );\n\n  const moveToMonth = useCallback(\n    (event: SyntheticEvent, month: DateValue) => {\n      let newMonth = month;\n\n      if (!isOutsideAllowedYears(newMonth)) {\n        if (isOutsideAllowedMonths(newMonth)) {\n          // If month is navigable we should move to the closest navigable month\n          const navigableMonths = monthsForLocale(visibleMonth, locale).filter(\n            (n) => !isOutsideAllowedMonths(n),\n          );\n          newMonth = navigableMonths.reduce((closestMonth, currentMonth) =>\n            Math.abs(monthDiff(currentMonth, newMonth)) <\n            Math.abs(monthDiff(closestMonth, newMonth))\n              ? currentMonth\n              : closestMonth,\n          );\n        }\n        setVisibleMonth(event, newMonth);\n      }\n    },\n    [\n      isOutsideAllowedYears,\n      isOutsideAllowedMonths,\n      setVisibleMonth,\n      visibleMonth,\n      locale,\n    ],\n  );\n\n  const months: DateValue[] = useMemo(\n    () => monthsForLocale(visibleMonth, locale),\n    [visibleMonth, locale],\n  );\n\n  const years: DateValue[] = useMemo(\n    () =>\n      generateYearsBetweenRange(\n        Math.min(minDate ? minDate.year : CALENDAR_MIN_YEAR, visibleMonth.year),\n        Math.max(maxDate ? maxDate.year : CALENDAR_MAX_YEAR, visibleMonth.year),\n      ),\n    [minDate, maxDate, visibleMonth.year],\n  );\n\n  const selectedMonth: DateValue | undefined = months.find((month: DateValue) =>\n    isSameMonth(month, visibleMonth),\n  );\n  const selectedYear: DateValue | undefined = years.find((year: DateValue) =>\n    isSameYear(year, visibleMonth),\n  );\n\n  const canNavigatePrevious = !(minDate && isDayVisible(minDate));\n  const canNavigateNext = !(maxDate && isDayVisible(maxDate));\n\n  return useMemo(\n    () => ({\n      moveToNextMonth,\n      moveToPreviousMonth,\n      moveToMonth,\n      visibleMonth,\n      months,\n      years,\n      canNavigateNext,\n      canNavigatePrevious,\n      selectedMonth,\n      selectedYear,\n      isOutsideAllowedMonths,\n      locale,\n      timeZone,\n    }),\n    [\n      months,\n      moveToPreviousMonth,\n      moveToNextMonth,\n      moveToMonth,\n      visibleMonth,\n      years,\n      canNavigateNext,\n      canNavigatePrevious,\n      selectedMonth,\n      selectedYear,\n      isOutsideAllowedMonths,\n      locale,\n      timeZone,\n    ],\n  );\n}\n\nconst OptionWithTooltip = ({\n  value,\n  children,\n  disabled = false,\n  tooltipContent,\n}: OptionWithTooltipProps) => {\n  const { activeState, openState } = useListControlContext();\n  const open = activeState?.value === value;\n  return (\n    <ConditionalTooltip\n      placement=\"right\"\n      open={open && openState}\n      disabled={!disabled}\n      content={tooltipContent}\n      enterDelay={0} // --salt-duration-instant\n      leaveDelay={0} // --salt-duration-instant\n    >\n      <Option value={value} disabled={disabled}>\n        {children}\n      </Option>\n    </ConditionalTooltip>\n  );\n};\n\nexport const CalendarNavigation = forwardRef<\n  HTMLDivElement,\n  CalendarNavigationProps\n>(function CalendarNavigation(props, ref) {\n  const {\n    className,\n    formatMonth: formatMonthProp,\n    formatYear: formatYearProp,\n    MonthDropdownProps,\n    YearDropdownProps,\n    hideYearDropdown,\n    step = 1,\n    ...rest\n  } = props;\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-calendar-navigation\",\n    css: calendarNavigationCss,\n    window: targetWindow,\n  });\n\n  const { NextIcon, PreviousIcon } = useIcon();\n\n  const {\n    moveToPreviousMonth,\n    moveToNextMonth,\n    moveToMonth,\n    months,\n    years,\n    canNavigateNext,\n    canNavigatePrevious,\n    selectedMonth,\n    selectedYear,\n    isOutsideAllowedMonths,\n    locale,\n  } = useCalendarNavigation();\n\n  const handleNavigatePrevious: MouseEventHandler<HTMLButtonElement> =\n    useCallback(\n      (event) => {\n        moveToPreviousMonth(event, step);\n      },\n      [moveToPreviousMonth, step],\n    );\n\n  const handleNavigateNext: MouseEventHandler<HTMLButtonElement> = useCallback(\n    (event) => {\n      moveToNextMonth(event, step);\n    },\n    [moveToNextMonth, step],\n  );\n\n  const handleMonthSelect = useCallback(\n    (event: SyntheticEvent, month: DateValue[]) => {\n      moveToMonth(event, month[0]);\n    },\n    [moveToMonth],\n  );\n\n  const handleYearSelect = useCallback(\n    (event: SyntheticEvent, year: DateValue[]) => {\n      moveToMonth(event, year[0]);\n    },\n    [moveToMonth],\n  );\n\n  const formatMonth = useCallback(\n    (date?: DateValue) => {\n      if (date && formatMonthProp) {\n        return formatMonthProp(date);\n      }\n      return !date\n        ? \"\"\n        : formatDate(date, locale, {\n            month: hideYearDropdown ? \"long\" : \"short\",\n            day: undefined,\n            year: undefined,\n          });\n    },\n    [formatMonthProp],\n  );\n\n  const formatYear = useCallback(\n    (date?: DateValue) => {\n      if (date && formatYearProp) {\n        return formatYearProp(date);\n      }\n      return !date ? \"\" : `${date.year}`;\n    },\n    [formatYearProp],\n  );\n\n  return (\n    <div\n      className={clsx(\n        withBaseName(),\n        { [withBaseName(\"hideYearDropdown\")]: hideYearDropdown },\n        className,\n      )}\n      ref={ref}\n      {...rest}\n    >\n      <ConditionalTooltip\n        placement=\"top\"\n        disabled={canNavigatePrevious}\n        content=\"Past dates are out of range\"\n        enterDelay={0} // --salt-duration-instant\n        leaveDelay={0} // --salt-duration-instant\n      >\n        <Button\n          disabled={!canNavigatePrevious}\n          appearance=\"transparent\"\n          sentiment=\"neutral\"\n          onClick={handleNavigatePrevious}\n          focusableWhenDisabled={true}\n        >\n          <PreviousIcon aria-label=\"Previous Month\" />\n        </Button>\n      </ConditionalTooltip>\n      <div className={clsx({ [withBaseName(\"dropdowns\")]: !hideYearDropdown })}>\n        <Dropdown\n          aria-label=\"Month Dropdown\"\n          selected={selectedMonth ? [selectedMonth] : []}\n          value={formatMonth(selectedMonth)}\n          onSelectionChange={handleMonthSelect}\n          {...MonthDropdownProps}\n        >\n          {months.map((month) => (\n            <OptionWithTooltip\n              key={formatMonth(month)}\n              value={month}\n              disabled={isOutsideAllowedMonths(month)}\n              tooltipContent=\"This month is out of range\"\n            >\n              {formatMonth(month)}\n            </OptionWithTooltip>\n          ))}\n        </Dropdown>\n        {!hideYearDropdown && (\n          <Dropdown\n            aria-label=\"Year Dropdown\"\n            selected={selectedYear ? [selectedYear] : []}\n            value={formatYear(selectedYear)}\n            onSelectionChange={handleYearSelect}\n            {...YearDropdownProps}\n          >\n            {years.map((year) => (\n              <OptionWithTooltip key={formatYear(year)} value={year}>\n                {formatYear(year)}\n              </OptionWithTooltip>\n            ))}\n          </Dropdown>\n        )}\n      </div>\n      <ConditionalTooltip\n        placement=\"top\"\n        disabled={canNavigateNext}\n        content=\"Future dates are out of range\"\n        enterDelay={0} // --salt-duration-instant\n        leaveDelay={0} // --salt-duration-instant\n      >\n        <Button\n          disabled={!canNavigateNext}\n          appearance=\"transparent\"\n          sentiment=\"neutral\"\n          onClick={handleNavigateNext}\n          focusableWhenDisabled={true}\n        >\n          <NextIcon aria-label=\"Next Month\" />\n        </Button>\n      </ConditionalTooltip>\n    </div>\n  );\n});\n"],"names":["CalendarNavigation","calendarNavigationCss"],"mappings":";;;;;;;;;;;;;AAuGA,MAAM,YAAA,GAAe,aAAa,wBAAwB,CAAA;AAE1D,MAAM,qBAA6C,CAAC;AAAA,EAClD,QAAA;AAAA,EACA,QAAW,GAAA,IAAA;AAAA,EACX,GAAG;AACL,CAAM,KAAA;AACJ,EAAA,IAAI,QAAU,EAAA;AACZ,IAAA,uCAAU,QAAS,EAAA,CAAA;AAAA;AAErB,EAAA,uBAAQ,GAAA,CAAA,OAAA,EAAA,EAAS,GAAG,IAAA,EAAO,QAAS,EAAA,CAAA;AACtC,CAAA;AAEA,SAAS,yBAAA,CACP,SACA,OACa,EAAA;AACb,EAAA,MAAM,QAAqB,EAAC;AAC5B,EAAA,KAAA,IAAS,IAAO,GAAA,OAAA,EAAS,IAAQ,IAAA,OAAA,EAAS,IAAQ,EAAA,EAAA;AAChD,IAAA,KAAA,CAAM,KAAK,IAAI,YAAA,CAAa,IAAM,EAAA,CAAA,EAAG,CAAC,CAAC,CAAA;AAAA;AAEzC,EAAO,OAAA,KAAA;AACT;AAEA,SAAS,qBAAwB,GAAA;AAC/B,EAAM,MAAA;AAAA,IACJ,OAAO,EAAE,YAAA,EAAc,OAAS,EAAA,OAAA,EAAS,QAAQ,QAAS,EAAA;AAAA,IAC1D,OAAS,EAAA;AAAA,MACP,eAAA;AAAA,MACA,YAAA;AAAA,MACA,qBAAA;AAAA,MACA;AAAA;AACF,MACE,kBAAmB,EAAA;AAEvB,EAAA,MAAM,eAAkB,GAAA,WAAA;AAAA,IACtB,CAAC,KAAuB,EAAA,IAAA,GAAO,CAAM,KAAA;AACnC,MAAA,eAAA,CAAgB,OAAO,YAAa,CAAA,GAAA,CAAI,EAAE,MAAQ,EAAA,IAAA,EAAM,CAAC,CAAA;AAAA,KAC3D;AAAA,IACA,CAAC,iBAAiB,YAAY;AAAA,GAChC;AAEA,EAAA,MAAM,mBAAsB,GAAA,WAAA;AAAA,IAC1B,CAAC,KAAuB,EAAA,IAAA,GAAO,CAAM,KAAA;AACnC,MAAA,eAAA,CAAgB,OAAO,YAAa,CAAA,QAAA,CAAS,EAAE,MAAQ,EAAA,IAAA,EAAM,CAAC,CAAA;AAAA,KAChE;AAAA,IACA,CAAC,iBAAiB,YAAY;AAAA,GAChC;AAEA,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,OAAuB,KAAqB,KAAA;AAC3C,MAAA,IAAI,QAAW,GAAA,KAAA;AAEf,MAAI,IAAA,CAAC,qBAAsB,CAAA,QAAQ,CAAG,EAAA;AACpC,QAAI,IAAA,sBAAA,CAAuB,QAAQ,CAAG,EAAA;AAEpC,UAAA,MAAM,eAAkB,GAAA,eAAA,CAAgB,YAAc,EAAA,MAAM,CAAE,CAAA,MAAA;AAAA,YAC5D,CAAC,CAAA,KAAM,CAAC,sBAAA,CAAuB,CAAC;AAAA,WAClC;AACA,UAAA,QAAA,GAAW,eAAgB,CAAA,MAAA;AAAA,YAAO,CAAC,YAAc,EAAA,YAAA,KAC/C,IAAK,CAAA,GAAA,CAAI,UAAU,YAAc,EAAA,QAAQ,CAAC,CAAA,GAC1C,KAAK,GAAI,CAAA,SAAA,CAAU,cAAc,QAAQ,CAAC,IACtC,YACA,GAAA;AAAA,WACN;AAAA;AAEF,QAAA,eAAA,CAAgB,OAAO,QAAQ,CAAA;AAAA;AACjC,KACF;AAAA,IACA;AAAA,MACE,qBAAA;AAAA,MACA,sBAAA;AAAA,MACA,eAAA;AAAA,MACA,YAAA;AAAA,MACA;AAAA;AACF,GACF;AAEA,EAAA,MAAM,MAAsB,GAAA,OAAA;AAAA,IAC1B,MAAM,eAAgB,CAAA,YAAA,EAAc,MAAM,CAAA;AAAA,IAC1C,CAAC,cAAc,MAAM;AAAA,GACvB;AAEA,EAAA,MAAM,KAAqB,GAAA,OAAA;AAAA,IACzB,MACE,yBAAA;AAAA,MACE,KAAK,GAAI,CAAA,OAAA,GAAU,QAAQ,IAAO,GAAA,iBAAA,EAAmB,aAAa,IAAI,CAAA;AAAA,MACtE,KAAK,GAAI,CAAA,OAAA,GAAU,QAAQ,IAAO,GAAA,iBAAA,EAAmB,aAAa,IAAI;AAAA,KACxE;AAAA,IACF,CAAC,OAAA,EAAS,OAAS,EAAA,YAAA,CAAa,IAAI;AAAA,GACtC;AAEA,EAAA,MAAM,gBAAuC,MAAO,CAAA,IAAA;AAAA,IAAK,CAAC,KAAA,KACxD,WAAY,CAAA,KAAA,EAAO,YAAY;AAAA,GACjC;AACA,EAAA,MAAM,eAAsC,KAAM,CAAA,IAAA;AAAA,IAAK,CAAC,IAAA,KACtD,UAAW,CAAA,IAAA,EAAM,YAAY;AAAA,GAC/B;AAEA,EAAA,MAAM,mBAAsB,GAAA,EAAE,OAAW,IAAA,YAAA,CAAa,OAAO,CAAA,CAAA;AAC7D,EAAA,MAAM,eAAkB,GAAA,EAAE,OAAW,IAAA,YAAA,CAAa,OAAO,CAAA,CAAA;AAEzD,EAAO,OAAA,OAAA;AAAA,IACL,OAAO;AAAA,MACL,eAAA;AAAA,MACA,mBAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,MAAA;AAAA,MACA,KAAA;AAAA,MACA,eAAA;AAAA,MACA,mBAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA;AAAA,MACA,sBAAA;AAAA,MACA,MAAA;AAAA,MACA;AAAA,KACF,CAAA;AAAA,IACA;AAAA,MACE,MAAA;AAAA,MACA,mBAAA;AAAA,MACA,eAAA;AAAA,MACA,WAAA;AAAA,MACA,YAAA;AAAA,MACA,KAAA;AAAA,MACA,eAAA;AAAA,MACA,mBAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA;AAAA,MACA,sBAAA;AAAA,MACA,MAAA;AAAA,MACA;AAAA;AACF,GACF;AACF;AAEA,MAAM,oBAAoB,CAAC;AAAA,EACzB,KAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAW,GAAA,KAAA;AAAA,EACX;AACF,CAA8B,KAAA;AAC5B,EAAA,MAAM,EAAE,WAAA,EAAa,SAAU,EAAA,GAAI,qBAAsB,EAAA;AACzD,EAAM,MAAA,IAAA,GAAA,CAAO,2CAAa,KAAU,MAAA,KAAA;AACpC,EACE,uBAAA,GAAA;AAAA,IAAC,kBAAA;AAAA,IAAA;AAAA,MACC,SAAU,EAAA,OAAA;AAAA,MACV,MAAM,IAAQ,IAAA,SAAA;AAAA,MACd,UAAU,CAAC,QAAA;AAAA,MACX,OAAS,EAAA,cAAA;AAAA,MACT,UAAY,EAAA,CAAA;AAAA,MACZ,UAAY,EAAA,CAAA;AAAA,MAEZ,QAAC,kBAAA,GAAA,CAAA,MAAA,EAAA,EAAO,KAAc,EAAA,QAAA,EACnB,QACH,EAAA;AAAA;AAAA,GACF;AAEJ,CAAA;AAEO,MAAM,kBAAqB,GAAA,UAAA,CAGhC,SAASA,mBAAAA,CAAmB,OAAO,GAAK,EAAA;AACxC,EAAM,MAAA;AAAA,IACJ,SAAA;AAAA,IACA,WAAa,EAAA,eAAA;AAAA,IACb,UAAY,EAAA,cAAA;AAAA,IACZ,kBAAA;AAAA,IACA,iBAAA;AAAA,IACA,gBAAA;AAAA,IACA,IAAO,GAAA,CAAA;AAAA,IACP,GAAG;AAAA,GACD,GAAA,KAAA;AAEJ,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,0BAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EAAA,MAAM,EAAE,QAAA,EAAU,YAAa,EAAA,GAAI,OAAQ,EAAA;AAE3C,EAAM,MAAA;AAAA,IACJ,mBAAA;AAAA,IACA,eAAA;AAAA,IACA,WAAA;AAAA,IACA,MAAA;AAAA,IACA,KAAA;AAAA,IACA,eAAA;AAAA,IACA,mBAAA;AAAA,IACA,aAAA;AAAA,IACA,YAAA;AAAA,IACA,sBAAA;AAAA,IACA;AAAA,MACE,qBAAsB,EAAA;AAE1B,EAAA,MAAM,sBACJ,GAAA,WAAA;AAAA,IACE,CAAC,KAAU,KAAA;AACT,MAAA,mBAAA,CAAoB,OAAO,IAAI,CAAA;AAAA,KACjC;AAAA,IACA,CAAC,qBAAqB,IAAI;AAAA,GAC5B;AAEF,EAAA,MAAM,kBAA2D,GAAA,WAAA;AAAA,IAC/D,CAAC,KAAU,KAAA;AACT,MAAA,eAAA,CAAgB,OAAO,IAAI,CAAA;AAAA,KAC7B;AAAA,IACA,CAAC,iBAAiB,IAAI;AAAA,GACxB;AAEA,EAAA,MAAM,iBAAoB,GAAA,WAAA;AAAA,IACxB,CAAC,OAAuB,KAAuB,KAAA;AAC7C,MAAY,WAAA,CAAA,KAAA,EAAO,KAAM,CAAA,CAAC,CAAC,CAAA;AAAA,KAC7B;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,MAAM,gBAAmB,GAAA,WAAA;AAAA,IACvB,CAAC,OAAuB,IAAsB,KAAA;AAC5C,MAAY,WAAA,CAAA,KAAA,EAAO,IAAK,CAAA,CAAC,CAAC,CAAA;AAAA,KAC5B;AAAA,IACA,CAAC,WAAW;AAAA,GACd;AAEA,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,IAAqB,KAAA;AACpB,MAAA,IAAI,QAAQ,eAAiB,EAAA;AAC3B,QAAA,OAAO,gBAAgB,IAAI,CAAA;AAAA;AAE7B,MAAA,OAAO,CAAC,IAAA,GACJ,EACA,GAAA,UAAA,CAAW,MAAM,MAAQ,EAAA;AAAA,QACvB,KAAA,EAAO,mBAAmB,MAAS,GAAA,OAAA;AAAA,QACnC,GAAK,EAAA,KAAA,CAAA;AAAA,QACL,IAAM,EAAA,KAAA;AAAA,OACP,CAAA;AAAA,KACP;AAAA,IACA,CAAC,eAAe;AAAA,GAClB;AAEA,EAAA,MAAM,UAAa,GAAA,WAAA;AAAA,IACjB,CAAC,IAAqB,KAAA;AACpB,MAAA,IAAI,QAAQ,cAAgB,EAAA;AAC1B,QAAA,OAAO,eAAe,IAAI,CAAA;AAAA;AAE5B,MAAA,OAAO,CAAC,IAAA,GAAO,EAAK,GAAA,CAAA,EAAG,KAAK,IAAI,CAAA,CAAA;AAAA,KAClC;AAAA,IACA,CAAC,cAAc;AAAA,GACjB;AAEA,EACE,uBAAA,IAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,SAAW,EAAA,IAAA;AAAA,QACT,YAAa,EAAA;AAAA,QACb,EAAE,CAAC,YAAA,CAAa,kBAAkB,CAAC,GAAG,gBAAiB,EAAA;AAAA,QACvD;AAAA,OACF;AAAA,MACA,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEJ,QAAA,EAAA;AAAA,wBAAA,GAAA;AAAA,UAAC,kBAAA;AAAA,UAAA;AAAA,YACC,SAAU,EAAA,KAAA;AAAA,YACV,QAAU,EAAA,mBAAA;AAAA,YACV,OAAQ,EAAA,6BAAA;AAAA,YACR,UAAY,EAAA,CAAA;AAAA,YACZ,UAAY,EAAA,CAAA;AAAA,YAEZ,QAAA,kBAAA,GAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,UAAU,CAAC,mBAAA;AAAA,gBACX,UAAW,EAAA,aAAA;AAAA,gBACX,SAAU,EAAA,SAAA;AAAA,gBACV,OAAS,EAAA,sBAAA;AAAA,gBACT,qBAAuB,EAAA,IAAA;AAAA,gBAEvB,QAAA,kBAAA,GAAA,CAAC,YAAa,EAAA,EAAA,YAAA,EAAW,gBAAiB,EAAA;AAAA;AAAA;AAC5C;AAAA,SACF;AAAA,wBACC,IAAA,CAAA,KAAA,EAAA,EAAI,SAAW,EAAA,IAAA,CAAK,EAAE,CAAC,YAAa,CAAA,WAAW,CAAC,GAAG,CAAC,gBAAA,EAAkB,CACrE,EAAA,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACC,YAAW,EAAA,gBAAA;AAAA,cACX,QAAU,EAAA,aAAA,GAAgB,CAAC,aAAa,IAAI,EAAC;AAAA,cAC7C,KAAA,EAAO,YAAY,aAAa,CAAA;AAAA,cAChC,iBAAmB,EAAA,iBAAA;AAAA,cAClB,GAAG,kBAAA;AAAA,cAEH,QAAA,EAAA,MAAA,CAAO,GAAI,CAAA,CAAC,KACX,qBAAA,GAAA;AAAA,gBAAC,iBAAA;AAAA,gBAAA;AAAA,kBAEC,KAAO,EAAA,KAAA;AAAA,kBACP,QAAA,EAAU,uBAAuB,KAAK,CAAA;AAAA,kBACtC,cAAe,EAAA,4BAAA;AAAA,kBAEd,sBAAY,KAAK;AAAA,iBAAA;AAAA,gBALb,YAAY,KAAK;AAAA,eAOzB;AAAA;AAAA,WACH;AAAA,UACC,CAAC,gBACA,oBAAA,GAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cACC,YAAW,EAAA,eAAA;AAAA,cACX,QAAU,EAAA,YAAA,GAAe,CAAC,YAAY,IAAI,EAAC;AAAA,cAC3C,KAAA,EAAO,WAAW,YAAY,CAAA;AAAA,cAC9B,iBAAmB,EAAA,gBAAA;AAAA,cAClB,GAAG,iBAAA;AAAA,cAEH,QAAM,EAAA,KAAA,CAAA,GAAA,CAAI,CAAC,IAAA,yBACT,iBAAyC,EAAA,EAAA,KAAA,EAAO,IAC9C,EAAA,QAAA,EAAA,UAAA,CAAW,IAAI,CAAA,EAAA,EADM,UAAW,CAAA,IAAI,CAEvC,CACD;AAAA;AAAA;AACH,SAEJ,EAAA,CAAA;AAAA,wBACA,GAAA;AAAA,UAAC,kBAAA;AAAA,UAAA;AAAA,YACC,SAAU,EAAA,KAAA;AAAA,YACV,QAAU,EAAA,eAAA;AAAA,YACV,OAAQ,EAAA,+BAAA;AAAA,YACR,UAAY,EAAA,CAAA;AAAA,YACZ,UAAY,EAAA,CAAA;AAAA,YAEZ,QAAA,kBAAA,GAAA;AAAA,cAAC,MAAA;AAAA,cAAA;AAAA,gBACC,UAAU,CAAC,eAAA;AAAA,gBACX,UAAW,EAAA,aAAA;AAAA,gBACX,SAAU,EAAA,SAAA;AAAA,gBACV,OAAS,EAAA,kBAAA;AAAA,gBACT,qBAAuB,EAAA,IAAA;AAAA,gBAEvB,QAAA,kBAAA,GAAA,CAAC,QAAS,EAAA,EAAA,YAAA,EAAW,YAAa,EAAA;AAAA;AAAA;AACpC;AAAA;AACF;AAAA;AAAA,GACF;AAEJ,CAAC;;;;"}
+{"version":3,"file":"CalendarNavigation.js","sources":["../src/calendar/CalendarNavigation.tsx"],"sourcesContent":["import {\n  Button,\n  type ButtonProps,\n  Dropdown,\n  type DropdownProps,\n  Option,\n  type OptionProps,\n  Tooltip,\n  type TooltipProps,\n  makePrefixer,\n  useIcon,\n  useListControlContext,\n} from \"@salt-ds/core\";\nimport type {\n  DateFrameworkType,\n  SaltDateAdapter,\n} from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithRef,\n  type MouseEventHandler,\n  type SyntheticEvent,\n  forwardRef,\n  useCallback,\n  useMemo,\n} from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarNavigationCss from \"./CalendarNavigation.css\";\nimport { useCalendarContext } from \"./internal/CalendarContext\";\nimport { generateMonthsForYear, monthDiff } from \"./internal/utils\";\n\n/**\n * Props for the CalendarNavigation component.\n */\nexport interface CalendarNavigationProps<TDate extends DateFrameworkType>\n  extends ComponentPropsWithRef<\"div\"> {\n  /**\n   * Props for the month dropdown component.\n   */\n  MonthDropdownProps?: DropdownProps<TDate>;\n\n  /**\n   * Props for the year dropdown component.\n   */\n  YearDropdownProps?: DropdownProps<TDate>;\n\n  /**\n   * Callback fired when a month is selected.\n   * @param event - The change event.\n   */\n  onMonthSelect?: DropdownProps<TDate>[\"onChange\"];\n\n  /**\n   * Callback fired when a year is selected.\n   * @param event - The change event.\n   */\n  onYearSelect?: DropdownProps<TDate>[\"onChange\"];\n\n  /**\n   * Callback fired when navigating to the next month.\n   * @param event - The click event.\n   */\n  onNavigateNext?: ButtonProps[\"onClick\"];\n\n  /**\n   * Callback fired when navigating to the previous month.\n   * @param event - The click event.\n   */\n  onNavigatePrevious?: ButtonProps[\"onClick\"];\n\n  /**\n   * If `true`, hides the year dropdown.\n   */\n  hideYearDropdown?: boolean;\n\n  /**\n   * The step value for navigation. Defaults to 1.\n   */\n  step?: number;\n  /**\n   * Format the month dropdown values\n   * @param date\n   */\n  formatMonth?: string;\n  /**\n   * Format the year dropdown values\n   * @param date\n   */\n  formatYear?: string;\n}\n\ninterface OptionWithTooltipProps<TDate> extends OptionProps {\n  value: TDate;\n  tooltipContent?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarNavigation\");\n\nconst ConditionalTooltip: React.FC<TooltipProps> = ({\n  children,\n  disabled = true,\n  ...rest\n}) => {\n  if (disabled) {\n    return <>{children}</>;\n  }\n  return <Tooltip {...rest}>{children}</Tooltip>;\n};\n\nfunction generateYearsBetweenRange<TDate extends DateFrameworkType>(\n  dateAdapter: SaltDateAdapter<TDate>,\n  minYear: number,\n  maxYear: number,\n): TDate[] {\n  const years: TDate[] = [];\n  for (let year = minYear; year <= maxYear; year++) {\n    let startOfYear = dateAdapter.today();\n    startOfYear = dateAdapter.set(startOfYear, { day: 1, month: 1, year });\n    years.push(startOfYear);\n  }\n  return years;\n}\n\nfunction useCalendarNavigation<TDate extends DateFrameworkType>() {\n  const {\n    state: { visibleMonth, locale, minDate, maxDate },\n    helpers: {\n      setVisibleMonth,\n      isDayVisible,\n      isOutsideAllowedYears,\n      isOutsideAllowedMonths,\n    },\n  } = useCalendarContext<TDate>();\n\n  const { dateAdapter } = useLocalization<TDate>();\n\n  const moveToNextMonth = useCallback(\n    (event: SyntheticEvent, step = 1) => {\n      setVisibleMonth(event, dateAdapter.add(visibleMonth, { months: step }));\n    },\n    [dateAdapter, setVisibleMonth, visibleMonth],\n  );\n\n  const moveToPreviousMonth = useCallback(\n    (event: SyntheticEvent, step = 1) => {\n      setVisibleMonth(\n        event,\n        dateAdapter.subtract(visibleMonth, { months: step }),\n      );\n    },\n    [dateAdapter, setVisibleMonth, visibleMonth],\n  );\n\n  const moveToMonth = useCallback(\n    (event: SyntheticEvent, month: TDate) => {\n      let newMonth = month;\n\n      if (isOutsideAllowedMonths(newMonth)) {\n        // If month is navigable we should move to the closest navigable month\n        const navigableMonths = generateMonthsForYear(\n          dateAdapter,\n          visibleMonth,\n        ).filter((n) => !isOutsideAllowedMonths(n));\n        newMonth = navigableMonths.reduce((closestMonth, currentMonth) =>\n          Math.abs(monthDiff(dateAdapter, currentMonth, newMonth)) <\n          Math.abs(monthDiff(dateAdapter, closestMonth, newMonth))\n            ? currentMonth\n            : closestMonth,\n        );\n      }\n      setVisibleMonth(event, newMonth);\n    },\n    [\n      dateAdapter,\n      isOutsideAllowedYears,\n      isOutsideAllowedMonths,\n      setVisibleMonth,\n      visibleMonth,\n    ],\n  );\n\n  const months: TDate[] = useMemo(\n    () => generateMonthsForYear<TDate>(dateAdapter, visibleMonth),\n    [visibleMonth],\n  );\n\n  const years: TDate[] = useMemo(\n    () =>\n      generateYearsBetweenRange<TDate>(\n        dateAdapter,\n        Math.min(\n          dateAdapter.getYear(minDate),\n          dateAdapter.getYear(visibleMonth),\n        ),\n        Math.max(\n          dateAdapter.getYear(maxDate),\n          dateAdapter.getYear(visibleMonth),\n        ),\n      ),\n    [dateAdapter, minDate, maxDate, visibleMonth],\n  );\n\n  const selectedMonth: TDate | undefined = months.find((month: TDate) =>\n    dateAdapter.isSame(month, visibleMonth, \"month\"),\n  );\n  const selectedYear: TDate | undefined = years.find((year: TDate) =>\n    dateAdapter.isSame(year, visibleMonth, \"year\"),\n  );\n\n  const canNavigatePrevious = !isDayVisible(minDate);\n  const canNavigateNext = !isDayVisible(maxDate);\n\n  return useMemo(\n    () => ({\n      moveToNextMonth,\n      moveToPreviousMonth,\n      moveToMonth,\n      visibleMonth,\n      locale,\n      months,\n      years,\n      canNavigateNext,\n      canNavigatePrevious,\n      selectedMonth,\n      selectedYear,\n      isOutsideAllowedMonths,\n    }),\n    [\n      locale,\n      months,\n      moveToPreviousMonth,\n      moveToNextMonth,\n      moveToMonth,\n      visibleMonth,\n      years,\n      canNavigateNext,\n      canNavigatePrevious,\n      selectedMonth,\n      selectedYear,\n      isOutsideAllowedMonths,\n    ],\n  );\n}\n\nfunction OptionWithTooltip<TDate extends DateFrameworkType>({\n  value,\n  children,\n  disabled = false,\n  tooltipContent,\n}: OptionWithTooltipProps<TDate>) {\n  const { activeState, openState } = useListControlContext();\n  const open = activeState?.value === value;\n  return (\n    <ConditionalTooltip\n      placement=\"right\"\n      open={open && openState}\n      disabled={!disabled}\n      content={tooltipContent}\n      enterDelay={0} // --salt-duration-instant\n      leaveDelay={0} // --salt-duration-instant\n    >\n      <Option value={value} disabled={disabled}>\n        {children}\n      </Option>\n    </ConditionalTooltip>\n  );\n}\n\nexport const CalendarNavigation = forwardRef<\n  HTMLDivElement,\n  CalendarNavigationProps<any>\n>(\n  <TDate extends DateFrameworkType>(\n    props: CalendarNavigationProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const {\n      className,\n      formatMonth: formatMonthProp,\n      formatYear: formatYearProp,\n      MonthDropdownProps,\n      YearDropdownProps,\n      hideYearDropdown,\n      step = 1,\n      ...rest\n    } = props;\n\n    const { dateAdapter } = useLocalization<TDate>();\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-calendar-navigation\",\n      css: calendarNavigationCss,\n      window: targetWindow,\n    });\n\n    const { NextIcon, PreviousIcon } = useIcon();\n\n    const {\n      locale,\n      moveToPreviousMonth,\n      moveToNextMonth,\n      moveToMonth,\n      months,\n      years,\n      canNavigateNext,\n      canNavigatePrevious,\n      selectedMonth,\n      selectedYear,\n      isOutsideAllowedMonths,\n      visibleMonth,\n    } = useCalendarNavigation<TDate>();\n\n    const handleNavigatePrevious: MouseEventHandler<HTMLButtonElement> =\n      useCallback(\n        (event) => {\n          moveToPreviousMonth(event, step);\n        },\n        [moveToPreviousMonth, step],\n      );\n\n    const handleNavigateNext: MouseEventHandler<HTMLButtonElement> =\n      useCallback(\n        (event) => {\n          moveToNextMonth(event, step);\n        },\n        [moveToNextMonth, step],\n      );\n\n    const handleMonthSelect = useCallback(\n      (event: SyntheticEvent, month: TDate[]) => {\n        moveToMonth(event, month[0]);\n      },\n      [moveToMonth],\n    );\n\n    const handleYearSelect = useCallback(\n      (event: SyntheticEvent, year: TDate[]) => {\n        let newVisibleMonth = dateAdapter.clone(visibleMonth);\n        newVisibleMonth = dateAdapter.set(newVisibleMonth, {\n          year: dateAdapter.getYear(year[0]),\n        });\n        moveToMonth(event, newVisibleMonth);\n      },\n      [moveToMonth, visibleMonth],\n    );\n\n    const formatMonth = useCallback(\n      (date?: TDate) => {\n        if (date && formatMonthProp) {\n          return dateAdapter.format(date, formatMonthProp, locale);\n        }\n        return date\n          ? dateAdapter.format(date, hideYearDropdown ? \"MMMM\" : \"MMM\")\n          : \"\";\n      },\n      [dateAdapter, formatMonthProp, locale],\n    );\n\n    const formatYear = useCallback(\n      (date?: TDate) => {\n        if (date && formatYearProp) {\n          return dateAdapter.format(date, formatYearProp);\n        }\n        return !date ? \"\" : `${dateAdapter.format(date, \"YYYY\")}`;\n      },\n      [dateAdapter, formatYearProp],\n    );\n\n    return (\n      <div\n        className={clsx(\n          withBaseName(),\n          { [withBaseName(\"hideYearDropdown\")]: hideYearDropdown },\n          className,\n        )}\n        ref={ref}\n        {...rest}\n      >\n        <ConditionalTooltip\n          placement=\"top\"\n          disabled={canNavigatePrevious}\n          content=\"Past dates are out of range\"\n          enterDelay={0} // --salt-duration-instant\n          leaveDelay={0} // --salt-duration-instant\n        >\n          <Button\n            disabled={!canNavigatePrevious}\n            appearance=\"transparent\"\n            sentiment=\"neutral\"\n            onClick={handleNavigatePrevious}\n            focusableWhenDisabled={true}\n          >\n            <PreviousIcon aria-label=\"Previous Month\" />\n          </Button>\n        </ConditionalTooltip>\n        <div\n          className={clsx({ [withBaseName(\"dropdowns\")]: !hideYearDropdown })}\n        >\n          <Dropdown\n            aria-label=\"Month Dropdown\"\n            selected={selectedMonth ? [selectedMonth] : []}\n            value={formatMonth(selectedMonth)}\n            onSelectionChange={handleMonthSelect}\n            {...MonthDropdownProps}\n          >\n            {months.map((month) => (\n              <OptionWithTooltip\n                key={formatMonth(month)}\n                value={month}\n                disabled={isOutsideAllowedMonths(month)}\n                tooltipContent=\"This month is out of range\"\n              >\n                {formatMonth(month)}\n              </OptionWithTooltip>\n            ))}\n          </Dropdown>\n          {!hideYearDropdown && (\n            <Dropdown\n              aria-label=\"Year Dropdown\"\n              selected={selectedYear ? [selectedYear] : []}\n              value={formatYear(selectedYear)}\n              onSelectionChange={handleYearSelect}\n              {...YearDropdownProps}\n            >\n              {years.map((year) => (\n                <OptionWithTooltip key={formatYear(year)} value={year}>\n                  {formatYear(year)}\n                </OptionWithTooltip>\n              ))}\n            </Dropdown>\n          )}\n        </div>\n        <ConditionalTooltip\n          placement=\"top\"\n          disabled={canNavigateNext}\n          content=\"Future dates are out of range\"\n          enterDelay={0} // --salt-duration-instant\n          leaveDelay={0} // --salt-duration-instant\n        >\n          <Button\n            disabled={!canNavigateNext}\n            appearance=\"transparent\"\n            sentiment=\"neutral\"\n            onClick={handleNavigateNext}\n            focusableWhenDisabled={true}\n          >\n            <NextIcon aria-label=\"Next Month\" />\n          </Button>\n        </ConditionalTooltip>\n      </div>\n    );\n  },\n);\n"],"names":["calendarNavigationCss"],"mappings":"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"}

package/dist-es/calendar/CalendarWeekHeader.js

@@ -2,16 +2,22 @@ import { jsx } from 'react/jsx-runtime';
 import { makePrefixer } from '@salt-ds/core';
 import { clsx } from 'clsx';
 import { forwardRef } from 'react';
-import { daysForLocale } from './internal/utils.js';
+import { daysOfWeek } from './internal/utils.js';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
+import { useLocalization } from '../localization-provider/LocalizationProvider.js';
 import css_248z from './CalendarWeekHeader.css.js';
-import { getCurrentLocale } from './formatDate.js';
+import { useCalendarContext } from './internal/CalendarContext.js';
 
 const withBaseName = makePrefixer("saltCalendarWeekHeader");
-const CalendarWeekHeader = forwardRef(function CalendarWeekHeader2({ className, locale = getCurrentLocale(), ...rest }, ref) {
-  const weekdaysShort = daysForLocale("narrow", locale);
-  const weekdaysLong = daysForLocale("long", locale);
+const CalendarWeekHeader = forwardRef(function CalendarWeekHeader2(props, ref) {
+  const { className, ...rest } = props;
+  const { dateAdapter } = useLocalization();
+  const {
+    state: { locale }
+  } = useCalendarContext();
+  const weekdaysShort = daysOfWeek(dateAdapter, "narrow", locale);
+  const weekdaysLong = daysOfWeek(dateAdapter, "long", locale);
   const targetWindow = useWindow();
   useComponentCssInjection({
     testId: "salt-calendar-week-header",