@salt-ds/lab 1.0.0-alpha.76 → 1.0.0-alpha.78

package/dist-es/button-bar/internal/DescendantContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"DescendantContext.js","sources":["../src/button-bar/internal/DescendantContext.tsx"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\n// Copied from https://gist.github.com/ryanflorence/10e9387f633f9d2e6f444a9bddaabf6e\nimport {\n  createContext,\n  type Dispatch,\n  type MutableRefObject,\n  type ReactNode,\n  type SetStateAction,\n  useRef,\n  useState,\n} from \"react\";\n\n// //////////////////////////////////////////////////////////////////////////////\n// SUPER HACKS AHEAD: The React team will hate this enough to hopefully give us\n// a way to know the index of a descendant given a parent (will help generate\n// IDs for accessibility a long with the ability create maximally composable\n// component abstractions).\n//\n// This is all to avoid cloneElement. If we can avoid cloneElement then people\n// can have arbitrary markup around MenuItems.  This basically takes advantage\n// of React's render lifecycles to let us \"register\" descendants to an\n// ancestor, so that we can track all the descendants and manage focus on them,\n// etc.  The super hacks here are for the child to know its index as well, so\n// that it can set attributes, match against state from above, etc.\ninterface DescendantProviderProps {\n  children?: ReactNode;\n  items: Record<string, any>[];\n  setItems: Dispatch<SetStateAction<Record<string, any>[]>>;\n}\n\ninterface DescendantContextType {\n  assigning?: MutableRefObject<boolean>;\n  setItems?: DescendantProviderProps[\"setItems\"];\n}\nexport const DescendantContext = createContext<DescendantContextType>({});\n\nexport function DescendantProvider({\n  items,\n  setItems,\n  ...props\n}: DescendantProviderProps) {\n  // On the first render we say we're \"assigning\", and the children will push\n  // into the array when they show up in their own useLayoutEffect.\n  const assigning = useRef(true);\n\n  // since children are pushed into the array in useLayoutEffect of the child,\n  // children can't read their index on first render.  So we need to cause a\n  // second render so they can read their index.\n  const [, forceUpdate] = useState<unknown>();\n\n  // parent useLayoutEffect is always last\n  // biome-ignore lint/correctness/useExhaustiveDependencies: We only want this to run when items change, not on every render\n  useIsomorphicLayoutEffect(() => {\n    if (assigning.current) {\n      // At this point all of the children have pushed into the array so we set\n      // assigning to false and force an update. Since we're in\n      // useLayoutEffect, we won't get a flash of rendered content, it will all\n      // happen synchronously. And now that this is false, children won't push\n      // into the array on the forceUpdate\n      assigning.current = false;\n      forceUpdate({});\n    } else {\n      // After the forceUpdate completes, we end up here and set assigning back\n      // to true for the next update from the app\n      assigning.current = true;\n    }\n    return () => {\n      // this cleanup function runs right before the next render, so it's the\n      // right time to empty out the array to be reassigned with whatever shows\n      // up next render.\n      if (assigning.current) {\n        // we only want to empty out the array before the next render cycle if\n        // it was NOT the result of our forceUpdate, so being guarded behind\n        // assigning.current works\n        setItems([]);\n      }\n    };\n  }, [items]);\n\n  return (\n    <DescendantContext.Provider {...props} value={{ setItems, assigning }} />\n  );\n}\n"],"names":[],"mappings":";;;;AAkCa,MAAA,iBAAA,GAAoB,aAAqC,CAAA,EAAE;AAEjE,SAAS,kBAAmB,CAAA;AAAA,EACjC,KAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAA4B,EAAA;AAG1B,EAAM,MAAA,SAAA,GAAY,OAAO,IAAI,CAAA;AAK7B,EAAA,MAAM,GAAG,WAAW,CAAA,GAAI,QAAkB,EAAA;AAI1C,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,UAAU,OAAS,EAAA;AAMrB,MAAA,SAAA,CAAU,OAAU,GAAA,KAAA;AACpB,MAAA,WAAA,CAAY,EAAE,CAAA;AAAA,KACT,MAAA;AAGL,MAAA,SAAA,CAAU,OAAU,GAAA,IAAA;AAAA;AAEtB,IAAA,OAAO,MAAM;AAIX,MAAA,IAAI,UAAU,OAAS,EAAA;AAIrB,QAAA,QAAA,CAAS,EAAE,CAAA;AAAA;AACb,KACF;AAAA,GACF,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EACE,uBAAA,GAAA,CAAC,iBAAkB,CAAA,QAAA,EAAlB,EAA4B,GAAG,OAAO,KAAO,EAAA,EAAE,QAAU,EAAA,SAAA,EAAa,EAAA,CAAA;AAE3E;;;;"}
+{"version":3,"file":"DescendantContext.js","sources":["../src/button-bar/internal/DescendantContext.tsx"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\n// Copied from https://gist.github.com/ryanflorence/10e9387f633f9d2e6f444a9bddaabf6e\nimport {\n  createContext,\n  type Dispatch,\n  type MutableRefObject,\n  type ReactNode,\n  type SetStateAction,\n  useRef,\n  useState,\n} from \"react\";\n\n// //////////////////////////////////////////////////////////////////////////////\n// SUPER HACKS AHEAD: The React team will hate this enough to hopefully give us\n// a way to know the index of a descendant given a parent (will help generate\n// IDs for accessibility a long with the ability create maximally composable\n// component abstractions).\n//\n// This is all to avoid cloneElement. If we can avoid cloneElement then people\n// can have arbitrary markup around MenuItems.  This basically takes advantage\n// of React's render lifecycles to let us \"register\" descendants to an\n// ancestor, so that we can track all the descendants and manage focus on them,\n// etc.  The super hacks here are for the child to know its index as well, so\n// that it can set attributes, match against state from above, etc.\ninterface DescendantProviderProps {\n  children?: ReactNode;\n  items: Record<string, any>[];\n  setItems: Dispatch<SetStateAction<Record<string, any>[]>>;\n}\n\ninterface DescendantContextType {\n  assigning?: MutableRefObject<boolean>;\n  setItems?: DescendantProviderProps[\"setItems\"];\n}\nexport const DescendantContext = createContext<DescendantContextType>({});\n\nexport function DescendantProvider({\n  items,\n  setItems,\n  ...props\n}: DescendantProviderProps) {\n  // On the first render we say we're \"assigning\", and the children will push\n  // into the array when they show up in their own useLayoutEffect.\n  const assigning = useRef(true);\n\n  // since children are pushed into the array in useLayoutEffect of the child,\n  // children can't read their index on first render.  So we need to cause a\n  // second render so they can read their index.\n  const [, forceUpdate] = useState<unknown>();\n\n  // parent useLayoutEffect is always last\n  // biome-ignore lint/correctness/useExhaustiveDependencies: We only want this to run when items change, not on every render\n  useIsomorphicLayoutEffect(() => {\n    if (assigning.current) {\n      // At this point all of the children have pushed into the array so we set\n      // assigning to false and force an update. Since we're in\n      // useLayoutEffect, we won't get a flash of rendered content, it will all\n      // happen synchronously. And now that this is false, children won't push\n      // into the array on the forceUpdate\n      assigning.current = false;\n      forceUpdate({});\n    } else {\n      // After the forceUpdate completes, we end up here and set assigning back\n      // to true for the next update from the app\n      assigning.current = true;\n    }\n    return () => {\n      // this cleanup function runs right before the next render, so it's the\n      // right time to empty out the array to be reassigned with whatever shows\n      // up next render.\n      if (assigning.current) {\n        // we only want to empty out the array before the next render cycle if\n        // it was NOT the result of our forceUpdate, so being guarded behind\n        // assigning.current works\n        setItems([]);\n      }\n    };\n  }, [items]);\n\n  return (\n    <DescendantContext.Provider {...props} value={{ setItems, assigning }} />\n  );\n}\n"],"names":[],"mappings":";;;;AAkCO,MAAM,iBAAA,GAAoB,aAAA,CAAqC,EAAE;AAEjE,SAAS,kBAAA,CAAmB;AAAA,EACjC,KAAA;AAAA,EACA,QAAA;AAAA,EACA,GAAG;AACL,CAAA,EAA4B;AAG1B,EAAA,MAAM,SAAA,GAAY,OAAO,IAAI,CAAA;AAK7B,EAAA,MAAM,GAAG,WAAW,CAAA,GAAI,QAAA,EAAkB;AAI1C,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAI,UAAU,OAAA,EAAS;AAMrB,MAAA,SAAA,CAAU,OAAA,GAAU,KAAA;AACpB,MAAA,WAAA,CAAY,EAAE,CAAA;AAAA,IAChB,CAAA,MAAO;AAGL,MAAA,SAAA,CAAU,OAAA,GAAU,IAAA;AAAA,IACtB;AACA,IAAA,OAAO,MAAM;AAIX,MAAA,IAAI,UAAU,OAAA,EAAS;AAIrB,QAAA,QAAA,CAAS,EAAE,CAAA;AAAA,MACb;AAAA,IACF,CAAA;AAAA,EACF,CAAA,EAAG,CAAC,KAAK,CAAC,CAAA;AAEV,EAAA,uBACE,GAAA,CAAC,iBAAA,CAAkB,QAAA,EAAlB,EAA4B,GAAG,OAAO,KAAA,EAAO,EAAE,QAAA,EAAU,SAAA,EAAU,EAAG,CAAA;AAE3E;;;;"}

package/dist-es/button-bar/internal/useDescendant.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDescendant.js","sources":["../src/button-bar/internal/useDescendant.ts"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\n// Copied from https://gist.github.com/ryanflorence/10e9387f633f9d2e6f444a9bddaabf6e\nimport { useContext, useRef } from \"react\";\n\nimport { DescendantContext } from \"./DescendantContext\";\n\nexport function useDescendant(descendant: Record<string, any>): number {\n  const { assigning, setItems } = useContext(DescendantContext);\n  const index = useRef(-1);\n\n  useIsomorphicLayoutEffect(() => {\n    if (assigning?.current && setItems) {\n      setItems((old) => {\n        index.current = old.length;\n        return old.concat(descendant);\n      });\n    }\n  });\n\n  // first render its wrong, after a forceUpdate in parent useIsomorphicLayoutEffect it's\n  // right, and its all synchronous so we don't get any flashing\n  return index.current;\n}\n"],"names":[],"mappings":";;;;AAMO,SAAS,cAAc,UAAyC,EAAA;AACrE,EAAA,MAAM,EAAE,SAAA,EAAW,QAAS,EAAA,GAAI,WAAW,iBAAiB,CAAA;AAC5D,EAAM,MAAA,KAAA,GAAQ,OAAO,EAAE,CAAA;AAEvB,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAI,IAAA,CAAA,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAW,YAAW,QAAU,EAAA;AAClC,MAAA,QAAA,CAAS,CAAC,GAAQ,KAAA;AAChB,QAAA,KAAA,CAAM,UAAU,GAAI,CAAA,MAAA;AACpB,QAAO,OAAA,GAAA,CAAI,OAAO,UAAU,CAAA;AAAA,OAC7B,CAAA;AAAA;AACH,GACD,CAAA;AAID,EAAA,OAAO,KAAM,CAAA,OAAA;AACf;;;;"}
+{"version":3,"file":"useDescendant.js","sources":["../src/button-bar/internal/useDescendant.ts"],"sourcesContent":["import { useIsomorphicLayoutEffect } from \"@salt-ds/core\";\n// Copied from https://gist.github.com/ryanflorence/10e9387f633f9d2e6f444a9bddaabf6e\nimport { useContext, useRef } from \"react\";\n\nimport { DescendantContext } from \"./DescendantContext\";\n\nexport function useDescendant(descendant: Record<string, any>): number {\n  const { assigning, setItems } = useContext(DescendantContext);\n  const index = useRef(-1);\n\n  useIsomorphicLayoutEffect(() => {\n    if (assigning?.current && setItems) {\n      setItems((old) => {\n        index.current = old.length;\n        return old.concat(descendant);\n      });\n    }\n  });\n\n  // first render its wrong, after a forceUpdate in parent useIsomorphicLayoutEffect it's\n  // right, and its all synchronous so we don't get any flashing\n  return index.current;\n}\n"],"names":[],"mappings":";;;;AAMO,SAAS,cAAc,UAAA,EAAyC;AACrE,EAAA,MAAM,EAAE,SAAA,EAAW,QAAA,EAAS,GAAI,WAAW,iBAAiB,CAAA;AAC5D,EAAA,MAAM,KAAA,GAAQ,OAAO,EAAE,CAAA;AAEvB,EAAA,yBAAA,CAA0B,MAAM;AAC9B,IAAA,IAAA,CAAI,SAAA,IAAA,IAAA,GAAA,MAAA,GAAA,SAAA,CAAW,YAAW,QAAA,EAAU;AAClC,MAAA,QAAA,CAAS,CAAC,GAAA,KAAQ;AAChB,QAAA,KAAA,CAAM,UAAU,GAAA,CAAI,MAAA;AACpB,QAAA,OAAO,GAAA,CAAI,OAAO,UAAU,CAAA;AAAA,MAC9B,CAAC,CAAA;AAAA,IACH;AAAA,EACF,CAAC,CAAA;AAID,EAAA,OAAO,KAAA,CAAM,OAAA;AACf;;;;"}

package/dist-es/button-bar/internal/useDescendants.js.map

@@ -1 +1 @@
-{"version":3,"file":"useDescendants.js","sources":["../src/button-bar/internal/useDescendants.ts"],"sourcesContent":["// Copied from https://gist.github.com/ryanflorence/10e9387f633f9d2e6f444a9bddaabf6e\nimport { type Dispatch, type SetStateAction, useState } from \"react\";\n\nexport function useDescendants<T>(): [T[], Dispatch<SetStateAction<T[]>>] {\n  return useState<T[]>([]);\n}\n"],"names":[],"mappings":";;AAGO,SAAS,cAA0D,GAAA;AACxE,EAAO,OAAA,QAAA,CAAc,EAAE,CAAA;AACzB;;;;"}
+{"version":3,"file":"useDescendants.js","sources":["../src/button-bar/internal/useDescendants.ts"],"sourcesContent":["// Copied from https://gist.github.com/ryanflorence/10e9387f633f9d2e6f444a9bddaabf6e\nimport { type Dispatch, type SetStateAction, useState } from \"react\";\n\nexport function useDescendants<T>(): [T[], Dispatch<SetStateAction<T[]>>] {\n  return useState<T[]>([]);\n}\n"],"names":[],"mappings":";;AAGO,SAAS,cAAA,GAA0D;AACxE,EAAA,OAAO,QAAA,CAAc,EAAE,CAAA;AACzB;;;;"}

package/dist-es/calendar/Calendar.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltCalendar {\n  background: var(--salt-container-primary-background);\n  padding: var(--salt-spacing-100);\n}\n";
+var css_248z = ".saltCalendar {\n  --calendar-gap: var(--salt-spacing-fixed-100);\n  --calendar-day-size: var(--salt-size-base);\n\n  background: var(--salt-container-primary-background);\n  padding: var(--salt-spacing-100);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=Calendar.css.js.map

package/dist-es/calendar/Calendar.js

@@ -3,7 +3,7 @@ import { makePrefixer } from '@salt-ds/core';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
 import { clsx } from 'clsx';
-import { forwardRef, useRef } from 'react';
+import { forwardRef, useEffect, useRef } from 'react';
 import { useLocalization } from '../localization-provider/LocalizationProvider.js';
 import css_248z from './Calendar.css.js';
 import { CalendarContext } from './internal/CalendarContext.js';
@@ -22,6 +22,7 @@ function getStartOrEndDate(dateRange, isMultiselect2) {
   const range = dateRange;
   return (range == null ? void 0 : range.startDate) ?? (range == null ? void 0 : range.endDate);
 }
+let warnedOnce = false;
 const Calendar = forwardRef(
   (props, ref) => {
     const targetWindow = useWindow();
@@ -46,7 +47,6 @@ const Calendar = forwardRef(
       focusedDateRef,
       isDayUnselectable,
       isDayHighlighted,
-      isDayDisabled,
       minDate,
       maxDate,
       multiselect,
@@ -58,6 +58,16 @@ const Calendar = forwardRef(
       timezone: timezoneProp,
       ...propsRest
     } = props;
+    useEffect(() => {
+      if (process.env.NODE_ENV !== "production") {
+        if (!warnedOnce && multiselect && selectionVariant !== "single") {
+          console.warn(
+            `'multiselect' with selection variant '${selectionVariant}' is experimental and not for production use.`
+          );
+          warnedOnce = true;
+        }
+      }
+    }, [multiselect, warnedOnce, selectionVariant]);
     let timezone = "default";
     if (timezoneProp) {
       timezone = timezoneProp;
@@ -97,7 +107,6 @@ const Calendar = forwardRef(
       focusedDateRef: focusedDateRef !== void 0 ? focusedDateRef : defaultFocusedDateRef,
       isDayUnselectable,
       isDayHighlighted,
-      isDayDisabled,
       multiselect,
       minDate,
       maxDate,

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

@@ -1 +1 @@
-{"version":3,"file":"Calendar.js","sources":["../src/calendar/Calendar.tsx"],"sourcesContent":["import { makePrefixer, type ResponsiveProp } from \"@salt-ds/core\";\nimport type { DateFrameworkType, Timezone } from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n  useRef,\n} from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarCss from \"./Calendar.css\";\nimport { CalendarContext } from \"./internal/CalendarContext\";\nimport {\n  type UseCalendarMultiselectOffsetProps,\n  type UseCalendarMultiselectRangeProps,\n  type UseCalendarMultiselectSingleProps,\n  type UseCalendarOffsetProps,\n  type UseCalendarRangeProps,\n  type UseCalendarSingleProps,\n  useCalendar,\n} from \"./useCalendar\";\nimport type { DateRangeSelection } from \"./useCalendarSelection\";\n\n/**\n * Base props for the Calendar component.\n */\nexport interface CalendarBaseProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content to be rendered inside the Calendar.\n   */\n  children: ReactNode;\n  /**\n   * If `true`, hides dates that are out of the selectable range.\n   */\n  hideOutOfRangeDates?: boolean;\n  /**\n   * Ref to attach to the focused element,enabling focus to be controlled.\n   */\n  focusedDateRef?: React.MutableRefObject<HTMLElement | null>;\n  /**\n   * Number of visible months, maximum 12, defaults to 1\n   */\n  numberOfVisibleMonths?: ResponsiveProp<\n    1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n  >;\n  /**\n   * Specifies the timezone behavior:\n   * - If undefined, the timezone will be derived from the passed date, or from `defaultSelectedDate`/`selectedDate`.\n   * - If set to \"default\", the default timezone of the date library will be used.\n   * - If set to \"system\", the local system's timezone will be applied.\n   * - If set to \"UTC\", the time will be returned in UTC.\n   * - If set to a valid IANA timezone identifier, the time will be returned for that specific timezone.\n   */\n  timezone?: Timezone;\n  /**\n   * If `true`, the calendar will be multiselect.\n   */\n  multiselect?: boolean;\n}\n\n/**\n * Props for the Calendar component with single date selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarSingleProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarSingleProps<TDate> {\n  /**\n   * The selection variant, set to \"single\".\n   */\n  selectionVariant: \"single\";\n}\n\n/**\n * Props for the Calendar component with multi-select, date selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarMultiselectSingleProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarMultiselectSingleProps<TDate> {\n  /**\n   * The selection variant, set to \"single\".\n   */\n  selectionVariant: \"single\";\n  /**\n   * Multiple selection\n   */\n  multiselect: true;\n}\n\n/**\n * Props for the Calendar component with date range selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarRangeProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarRangeProps<TDate> {\n  /**\n   * The selection variant, set to \"range\".\n   */\n  selectionVariant: \"range\";\n}\n\n/**\n * Props for the Calendar component with multi-select, date range selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarMultiselectRangeProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarMultiselectRangeProps<TDate> {\n  /**\n   * The selection variant, set to \"single\".\n   */\n  selectionVariant: \"range\";\n  /**\n   * Multiple selection\n   */\n  multiselect: true;\n}\n\n/**\n * Props for the Calendar component with offset date selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarOffsetProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarOffsetProps<TDate> {\n  /**\n   * The selection variant, set to \"offset\".\n   */\n  selectionVariant: \"offset\";\n}\n\n/**\n * Props for the Calendar component with multi-select, offset date selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarMultiselectOffsetProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarMultiselectOffsetProps<TDate> {\n  /**\n   * The selection variant, set to \"offset\".\n   */\n  selectionVariant: \"offset\";\n  /**\n   * Multiple selection\n   */\n  multiselect: true;\n}\n\n/**\n * Type representing the props for the Calendar component with various selection variants.\n * @template TDate - The type of the date object.\n */\nexport type CalendarProps<TDate extends DateFrameworkType> =\n  | CalendarSingleProps<TDate>\n  | CalendarMultiselectSingleProps<TDate>\n  | CalendarRangeProps<TDate>\n  | CalendarMultiselectRangeProps<TDate>\n  | CalendarOffsetProps<TDate>\n  | CalendarMultiselectOffsetProps<TDate>;\n\nconst withBaseName = makePrefixer(\"saltCalendar\");\n\nfunction isMultiselect<TDate>(\n  props: CalendarProps<TDate>,\n): props is\n  | CalendarMultiselectSingleProps<TDate>\n  | CalendarMultiselectRangeProps<TDate>\n  | CalendarMultiselectOffsetProps<TDate> {\n  return props.multiselect === true;\n}\n\nfunction getStartOrEndDate<TDate>(\n  dateRange:\n    | DateRangeSelection<TDate>\n    | DateRangeSelection<TDate>[]\n    | undefined,\n  isMultiselect: boolean,\n): TDate | null | undefined {\n  if (isMultiselect) {\n    const rangeArray = dateRange as DateRangeSelection<TDate>[];\n    return rangeArray?.[0]?.startDate ?? rangeArray?.[0]?.endDate;\n  }\n  const range = dateRange as DateRangeSelection<TDate>;\n  return range?.startDate ?? range?.endDate;\n}\n\nexport const Calendar = forwardRef<\n  HTMLDivElement,\n  CalendarProps<DateFrameworkType>\n>(\n  <TDate extends DateFrameworkType>(\n    props: CalendarProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const targetWindow = useWindow();\n    const { dateAdapter } = useLocalization<TDate>();\n    useComponentCssInjection({\n      testId: \"salt-calendar\",\n      css: calendarCss,\n      window: targetWindow,\n    });\n    const {\n      children,\n      className,\n      selectedDate,\n      defaultSelectedDate,\n      visibleMonth: visibleMonthProp,\n      defaultVisibleMonth,\n      onFocusedDateChange,\n      onSelectionChange,\n      onVisibleMonthChange,\n      hideOutOfRangeDates,\n      focusedDate,\n      focusedDateRef,\n      isDayUnselectable,\n      isDayHighlighted,\n      isDayDisabled,\n      minDate,\n      maxDate,\n      multiselect,\n      numberOfVisibleMonths = 1,\n      select,\n      selectionVariant,\n      onHoveredDateChange,\n      hoveredDate,\n      timezone: timezoneProp,\n      ...propsRest\n    } = props;\n\n    let timezone: Timezone = \"default\";\n    if (timezoneProp) {\n      timezone = timezoneProp;\n    } else {\n      let defaultTimezoneDate: TDate | null | undefined;\n\n      if (selectionVariant === \"range\" || selectionVariant === \"offset\") {\n        const shouldExtractFromList = isMultiselect(props);\n        defaultTimezoneDate =\n          getStartOrEndDate(selectedDate, shouldExtractFromList) ??\n          getStartOrEndDate(defaultSelectedDate, shouldExtractFromList);\n      } else if (selectionVariant === \"single\") {\n        if (isMultiselect(props)) {\n          defaultTimezoneDate =\n            (defaultSelectedDate as TDate[])?.[0] ?? undefined;\n        } else {\n          defaultTimezoneDate =\n            (selectedDate as TDate | null) ??\n            (defaultSelectedDate as TDate | null);\n        }\n      }\n      if (defaultTimezoneDate) {\n        timezone = dateAdapter.getTimezone(defaultTimezoneDate);\n      }\n    }\n\n    let startDateOffset: CalendarOffsetProps<TDate>[\"startDateOffset\"];\n    let endDateOffset: CalendarOffsetProps<TDate>[\"startDateOffset\"];\n    let rest: Partial<typeof props>;\n    if (selectionVariant === \"offset\") {\n      ({ startDateOffset, endDateOffset, ...rest } =\n        propsRest as CalendarOffsetProps<TDate>);\n    } else {\n      rest = propsRest;\n    }\n    const defaultFocusedDateRef = useRef(null);\n\n    // biome-ignore lint/suspicious/noExplicitAny: type guard\n    const useCalendarProps: any = {\n      selectedDate,\n      defaultSelectedDate,\n      visibleMonth: visibleMonthProp,\n      defaultVisibleMonth,\n      onSelectionChange,\n      onVisibleMonthChange,\n      focusedDate,\n      focusedDateRef:\n        focusedDateRef !== undefined ? focusedDateRef : defaultFocusedDateRef,\n      isDayUnselectable,\n      isDayHighlighted,\n      isDayDisabled,\n      multiselect,\n      minDate,\n      maxDate,\n      numberOfVisibleMonths,\n      select,\n      selectionVariant,\n      onFocusedDateChange,\n      onHoveredDateChange,\n      hideOutOfRangeDates,\n      hoveredDate,\n      startDateOffset,\n      endDateOffset,\n      timezone,\n    };\n    const { state, helpers } = useCalendar<TDate>(useCalendarProps);\n    const calendarLabel = dateAdapter.format(state.visibleMonth, \"MMMM YYYY\");\n\n    return (\n      <CalendarContext.Provider\n        value={{\n          state,\n          helpers,\n        }}\n      >\n        <div\n          className={clsx(withBaseName(), className)}\n          role=\"application\"\n          aria-label={calendarLabel}\n          ref={ref}\n          {...rest}\n        >\n          {children}\n        </div>\n      </CalendarContext.Provider>\n    );\n  },\n);\n"],"names":["isMultiselect","calendarCss"],"mappings":"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"}
+{"version":3,"file":"Calendar.js","sources":["../src/calendar/Calendar.tsx"],"sourcesContent":["import { makePrefixer, type ResponsiveProp } from \"@salt-ds/core\";\nimport type { DateFrameworkType, Timezone } from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport {\n  type ComponentPropsWithoutRef,\n  forwardRef,\n  type ReactNode,\n  useEffect,\n  useRef,\n} from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarCss from \"./Calendar.css\";\nimport { CalendarContext } from \"./internal/CalendarContext\";\nimport {\n  type UseCalendarMultiselectOffsetProps,\n  type UseCalendarMultiselectRangeProps,\n  type UseCalendarMultiselectSingleProps,\n  type UseCalendarOffsetProps,\n  type UseCalendarRangeProps,\n  type UseCalendarSingleProps,\n  useCalendar,\n} from \"./useCalendar\";\nimport type { DateRangeSelection } from \"./useCalendarSelection\";\n\n/**\n * Base props for the Calendar component.\n */\nexport interface CalendarBaseProps extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * The content to be rendered inside the Calendar.\n   */\n  children: ReactNode;\n  /**\n   * If `true`, hides dates that are out of the selectable range.\n   */\n  hideOutOfRangeDates?: boolean;\n  /**\n   * Ref to attach to the focused element,enabling focus to be controlled.\n   */\n  focusedDateRef?: React.MutableRefObject<HTMLElement | null>;\n  /**\n   * Number of visible months, maximum 12, defaults to 1\n   */\n  numberOfVisibleMonths?: ResponsiveProp<\n    1 | 2 | 3 | 4 | 5 | 6 | 7 | 8 | 9 | 10 | 11 | 12\n  >;\n  /**\n   * Specifies the timezone behavior:\n   * - If undefined, the timezone will be derived from the passed date, or from `defaultSelectedDate`/`selectedDate`.\n   * - If set to \"default\", the default timezone of the date library will be used.\n   * - If set to \"system\", the local system's timezone will be applied.\n   * - If set to \"UTC\", the time will be returned in UTC.\n   * - If set to a valid IANA timezone identifier, the time will be returned for that specific timezone.\n   */\n  timezone?: Timezone;\n  /**\n   * If `true`, the calendar will be multiselect.\n   */\n  multiselect?: boolean;\n}\n\n/**\n * Props for the Calendar component with single date selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarSingleProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarSingleProps<TDate> {\n  /**\n   * The selection variant, set to \"single\".\n   */\n  selectionVariant: \"single\";\n}\n\n/**\n * Props for the Calendar component with multi-select, date selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarMultiselectSingleProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarMultiselectSingleProps<TDate> {\n  /**\n   * The selection variant, set to \"single\".\n   */\n  selectionVariant: \"single\";\n  /**\n   * Multiple selection\n   */\n  multiselect: true;\n}\n\n/**\n * Props for the Calendar component with date range selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarRangeProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarRangeProps<TDate> {\n  /**\n   * The selection variant, set to \"range\".\n   */\n  selectionVariant: \"range\";\n}\n\n/**\n * Props for the Calendar component with multi-select, date range selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarMultiselectRangeProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarMultiselectRangeProps<TDate> {\n  /**\n   * The selection variant, set to \"single\".\n   */\n  selectionVariant: \"range\";\n  /**\n   * Multiple selection\n   */\n  multiselect: true;\n}\n\n/**\n * Props for the Calendar component with offset date selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarOffsetProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarOffsetProps<TDate> {\n  /**\n   * The selection variant, set to \"offset\".\n   */\n  selectionVariant: \"offset\";\n}\n\n/**\n * Props for the Calendar component with multi-select, offset date selection.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarMultiselectOffsetProps<TDate extends DateFrameworkType>\n  extends CalendarBaseProps,\n    UseCalendarMultiselectOffsetProps<TDate> {\n  /**\n   * The selection variant, set to \"offset\".\n   */\n  selectionVariant: \"offset\";\n  /**\n   * Multiple selection\n   */\n  multiselect: true;\n}\n\n/**\n * Type representing the props for the Calendar component with various selection variants.\n * @template TDate - The type of the date object.\n */\nexport type CalendarProps<TDate extends DateFrameworkType> =\n  | CalendarSingleProps<TDate>\n  | CalendarMultiselectSingleProps<TDate>\n  | CalendarRangeProps<TDate>\n  | CalendarMultiselectRangeProps<TDate>\n  | CalendarOffsetProps<TDate>\n  | CalendarMultiselectOffsetProps<TDate>;\n\nconst withBaseName = makePrefixer(\"saltCalendar\");\n\nfunction isMultiselect<TDate>(\n  props: CalendarProps<TDate>,\n): props is\n  | CalendarMultiselectSingleProps<TDate>\n  | CalendarMultiselectRangeProps<TDate>\n  | CalendarMultiselectOffsetProps<TDate> {\n  return props.multiselect === true;\n}\n\nfunction getStartOrEndDate<TDate>(\n  dateRange:\n    | DateRangeSelection<TDate>\n    | DateRangeSelection<TDate>[]\n    | undefined,\n  isMultiselect: boolean,\n): TDate | null | undefined {\n  if (isMultiselect) {\n    const rangeArray = dateRange as DateRangeSelection<TDate>[];\n    return rangeArray?.[0]?.startDate ?? rangeArray?.[0]?.endDate;\n  }\n  const range = dateRange as DateRangeSelection<TDate>;\n  return range?.startDate ?? range?.endDate;\n}\n\nlet warnedOnce = false;\n\nexport const Calendar = forwardRef<\n  HTMLDivElement,\n  CalendarProps<DateFrameworkType>\n>(\n  <TDate extends DateFrameworkType>(\n    props: CalendarProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const targetWindow = useWindow();\n    const { dateAdapter } = useLocalization<TDate>();\n    useComponentCssInjection({\n      testId: \"salt-calendar\",\n      css: calendarCss,\n      window: targetWindow,\n    });\n    const {\n      children,\n      className,\n      selectedDate,\n      defaultSelectedDate,\n      visibleMonth: visibleMonthProp,\n      defaultVisibleMonth,\n      onFocusedDateChange,\n      onSelectionChange,\n      onVisibleMonthChange,\n      hideOutOfRangeDates,\n      focusedDate,\n      focusedDateRef,\n      isDayUnselectable,\n      isDayHighlighted,\n      minDate,\n      maxDate,\n      multiselect,\n      numberOfVisibleMonths = 1,\n      select,\n      selectionVariant,\n      onHoveredDateChange,\n      hoveredDate,\n      timezone: timezoneProp,\n      ...propsRest\n    } = props;\n\n    useEffect(() => {\n      if (process.env.NODE_ENV !== \"production\") {\n        if (!warnedOnce && multiselect && selectionVariant !== \"single\") {\n          console.warn(\n            `'multiselect' with selection variant '${selectionVariant}' is experimental and not for production use.`,\n          );\n          warnedOnce = true;\n        }\n      }\n    }, [multiselect, warnedOnce, selectionVariant]);\n\n    let timezone: Timezone = \"default\";\n    if (timezoneProp) {\n      timezone = timezoneProp;\n    } else {\n      let defaultTimezoneDate: TDate | null | undefined;\n\n      if (selectionVariant === \"range\" || selectionVariant === \"offset\") {\n        const shouldExtractFromList = isMultiselect(props);\n        defaultTimezoneDate =\n          getStartOrEndDate(selectedDate, shouldExtractFromList) ??\n          getStartOrEndDate(defaultSelectedDate, shouldExtractFromList);\n      } else if (selectionVariant === \"single\") {\n        if (isMultiselect(props)) {\n          defaultTimezoneDate =\n            (defaultSelectedDate as TDate[])?.[0] ?? undefined;\n        } else {\n          defaultTimezoneDate =\n            (selectedDate as TDate | null) ??\n            (defaultSelectedDate as TDate | null);\n        }\n      }\n      if (defaultTimezoneDate) {\n        timezone = dateAdapter.getTimezone(defaultTimezoneDate);\n      }\n    }\n\n    let startDateOffset: CalendarOffsetProps<TDate>[\"startDateOffset\"];\n    let endDateOffset: CalendarOffsetProps<TDate>[\"startDateOffset\"];\n    let rest: Partial<typeof props>;\n    if (selectionVariant === \"offset\") {\n      ({ startDateOffset, endDateOffset, ...rest } =\n        propsRest as CalendarOffsetProps<TDate>);\n    } else {\n      rest = propsRest;\n    }\n    const defaultFocusedDateRef = useRef(null);\n\n    // biome-ignore lint/suspicious/noExplicitAny: type guard\n    const useCalendarProps: any = {\n      selectedDate,\n      defaultSelectedDate,\n      visibleMonth: visibleMonthProp,\n      defaultVisibleMonth,\n      onSelectionChange,\n      onVisibleMonthChange,\n      focusedDate,\n      focusedDateRef:\n        focusedDateRef !== undefined ? focusedDateRef : defaultFocusedDateRef,\n      isDayUnselectable,\n      isDayHighlighted,\n      multiselect,\n      minDate,\n      maxDate,\n      numberOfVisibleMonths,\n      select,\n      selectionVariant,\n      onFocusedDateChange,\n      onHoveredDateChange,\n      hideOutOfRangeDates,\n      hoveredDate,\n      startDateOffset,\n      endDateOffset,\n      timezone,\n    };\n    const { state, helpers } = useCalendar<TDate>(useCalendarProps);\n    const calendarLabel = dateAdapter.format(state.visibleMonth, \"MMMM YYYY\");\n\n    return (\n      <CalendarContext.Provider\n        value={{\n          state,\n          helpers,\n        }}\n      >\n        <div\n          className={clsx(withBaseName(), className)}\n          role=\"application\"\n          aria-label={calendarLabel}\n          ref={ref}\n          {...rest}\n        >\n          {children}\n        </div>\n      </CalendarContext.Provider>\n    );\n  },\n);\n"],"names":["isMultiselect","calendarCss"],"mappings":"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"}

package/dist-es/calendar/CalendarGrid.js

@@ -1,6 +1,6 @@
 import { jsx, jsxs } from 'react/jsx-runtime';
 import { useForkRef, GridLayout, GridItem } from '@salt-ds/core';
-import { forwardRef, useRef } from 'react';
+import { forwardRef, useRef, useMemo } from 'react';
 import { useLocalization } from '../localization-provider/LocalizationProvider.js';
 import { CalendarMonthHeader } from './CalendarMonthHeader.js';
 import { CalendarWeekHeader } from './CalendarWeekHeader.js';
@@ -26,16 +26,23 @@ const CalendarGrid = forwardRef(
     const containerRef = useForkRef(ref, calendarGridRef);
     const handleCalendarGridBlur = (event) => {
       event.stopPropagation();
-      setTimeout(() => {
-        var _a;
-        if ((_a = calendarGridRef == null ? void 0 : calendarGridRef.current) == null ? void 0 : _a.contains(document.activeElement)) {
-          return;
-        }
-        setFocusedDate(event, null);
-        setHoveredDate(event, null);
-      }, 0);
+      const relatedTarget = event.relatedTarget;
+      if (calendarGridRef.current && relatedTarget && calendarGridRef.current.contains(relatedTarget)) {
+        return;
+      }
+      setFocusedDate(event, null);
+      setHoveredDate(event, null);
       onBlur == null ? void 0 : onBlur(event);
     };
+    const visibleMonths = useMemo(
+      () => Array.from({ length: numberOfVisibleMonths }, (_value, index) => {
+        const gridItemVisibleMonth = dateAdapter.add(visibleMonth, {
+          months: index
+        });
+        return gridItemVisibleMonth;
+      }),
+      [dateAdapter, numberOfVisibleMonths, visibleMonth]
+    );
     return /* @__PURE__ */ jsx(
       GridLayout,
       {
@@ -44,34 +51,29 @@ const CalendarGrid = forwardRef(
         ref: containerRef,
         onBlur: handleCalendarGridBlur,
         ...rest,
-        children: Array.from({ length: numberOfVisibleMonths }, (_value, index) => {
-          const gridItemVisibleMonth = dateAdapter.add(visibleMonth, {
-            months: index
-          });
-          return /* @__PURE__ */ jsxs(
-            GridItem,
-            {
-              children: [
-                numberOfVisibleMonths > 1 ? /* @__PURE__ */ jsx(
-                  CalendarMonthHeader,
-                  {
-                    ...CalendarMonthHeaderProps,
-                    month: gridItemVisibleMonth
-                  }
-                ) : null,
-                /* @__PURE__ */ jsx(CalendarWeekHeader, { ...CalendarWeekHeaderProps }),
-                /* @__PURE__ */ jsx(
-                  CalendarMonth,
-                  {
-                    date: gridItemVisibleMonth,
-                    CalendarDayProps
-                  }
-                )
-              ]
-            },
-            `calendar-grid-item-${dateAdapter.format(gridItemVisibleMonth, "MMMM YYYY")}`
-          );
-        })
+        children: visibleMonths.map((gridItemVisibleMonth) => /* @__PURE__ */ jsxs(
+          GridItem,
+          {
+            children: [
+              numberOfVisibleMonths > 1 ? /* @__PURE__ */ jsx(
+                CalendarMonthHeader,
+                {
+                  ...CalendarMonthHeaderProps,
+                  month: gridItemVisibleMonth
+                }
+              ) : null,
+              /* @__PURE__ */ jsx(CalendarWeekHeader, { ...CalendarWeekHeaderProps }),
+              /* @__PURE__ */ jsx(
+                CalendarMonth,
+                {
+                  date: gridItemVisibleMonth,
+                  CalendarDayProps
+                }
+              )
+            ]
+          },
+          `calendar-grid-item-${dateAdapter.format(gridItemVisibleMonth, "MMMM YYYY")}`
+        ))
       }
     );
   }

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

@@ -1 +1 @@
-{"version":3,"file":"CalendarGrid.js","sources":["../src/calendar/CalendarGrid.tsx"],"sourcesContent":["import {\n  GridItem,\n  GridLayout,\n  type ResponsiveProp,\n  useForkRef,\n} from \"@salt-ds/core\";\nimport type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport {\n  type ComponentPropsWithoutRef,\n  type FocusEventHandler,\n  forwardRef,\n  useRef,\n} from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport {\n  CalendarMonthHeader,\n  type CalendarMonthHeaderProps,\n} from \"./CalendarMonthHeader\";\nimport {\n  CalendarWeekHeader,\n  type CalendarWeekHeaderProps,\n} from \"./CalendarWeekHeader\";\nimport { useCalendarContext } from \"./internal/CalendarContext\";\nimport type { CalendarDayProps } from \"./internal/CalendarDay\";\nimport { CalendarMonth } from \"./internal/CalendarMonth\";\n\n/**\n * Props for the CalendarGrid component.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarGridProps<TDate extends DateFrameworkType>\n  extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Number of columns\n   */\n  columns?: ResponsiveProp<number | string>;\n  /**\n   * Props for `CalendarWeekHeader`\n   */\n  CalendarWeekHeaderProps?: Partial<CalendarWeekHeaderProps>;\n  /**\n   * Props for `CalendarMonthHeader`\n   */\n  CalendarMonthHeaderProps?: Partial<CalendarMonthHeaderProps<TDate>>;\n  /**\n   * Props for `CalendarDay`\n   */\n  CalendarDayProps?: Partial<CalendarDayProps<TDate>>;\n}\n\nexport const CalendarGrid = forwardRef<\n  HTMLDivElement,\n  CalendarGridProps<DateFrameworkType>\n>(\n  <TDate extends DateFrameworkType>(\n    props: CalendarGridProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const {\n      CalendarDayProps,\n      CalendarWeekHeaderProps,\n      CalendarMonthHeaderProps,\n      columns = 1,\n      onBlur,\n      ...rest\n    } = props;\n\n    const { dateAdapter } = useLocalization<TDate>();\n\n    const {\n      helpers: { setFocusedDate, setHoveredDate },\n      state: { visibleMonth, numberOfVisibleMonths = 1 },\n    } = useCalendarContext<TDate>();\n    const calendarGridRef = useRef<HTMLDivElement>(null);\n    const containerRef = useForkRef(ref, calendarGridRef);\n\n    const handleCalendarGridBlur: FocusEventHandler<HTMLDivElement> = (\n      event,\n    ) => {\n      event.stopPropagation();\n      setTimeout(() => {\n        if (calendarGridRef?.current?.contains(document.activeElement)) {\n          return;\n        }\n        setFocusedDate(event, null);\n        setHoveredDate(event, null);\n      }, 0);\n      onBlur?.(event);\n    };\n\n    return (\n      <GridLayout\n        columns={columns}\n        gap={1}\n        ref={containerRef}\n        onBlur={handleCalendarGridBlur}\n        {...rest}\n      >\n        {Array.from({ length: numberOfVisibleMonths }, (_value, index) => {\n          const gridItemVisibleMonth: TDate = dateAdapter.add(visibleMonth, {\n            months: index,\n          });\n          return (\n            <GridItem\n              key={`calendar-grid-item-${dateAdapter.format(gridItemVisibleMonth, \"MMMM YYYY\")}`}\n            >\n              {numberOfVisibleMonths > 1 ? (\n                <CalendarMonthHeader\n                  {...CalendarMonthHeaderProps}\n                  month={gridItemVisibleMonth}\n                />\n              ) : null}\n              <CalendarWeekHeader {...CalendarWeekHeaderProps} />\n              <CalendarMonth\n                date={gridItemVisibleMonth}\n                CalendarDayProps={CalendarDayProps}\n              />\n            </GridItem>\n          );\n        })}\n      </GridLayout>\n    );\n  },\n);\n"],"names":[],"mappings":";;;;;;;;;AAkDO,MAAM,YAAe,GAAA,UAAA;AAAA,EAI1B,CACE,OACA,GACG,KAAA;AACH,IAAM,MAAA;AAAA,MACJ,gBAAA;AAAA,MACA,uBAAA;AAAA,MACA,wBAAA;AAAA,MACA,OAAU,GAAA,CAAA;AAAA,MACV,MAAA;AAAA,MACA,GAAG;AAAA,KACD,GAAA,KAAA;AAEJ,IAAM,MAAA,EAAE,WAAY,EAAA,GAAI,eAAuB,EAAA;AAE/C,IAAM,MAAA;AAAA,MACJ,OAAA,EAAS,EAAE,cAAA,EAAgB,cAAe,EAAA;AAAA,MAC1C,KAAO,EAAA,EAAE,YAAc,EAAA,qBAAA,GAAwB,CAAE;AAAA,QAC/C,kBAA0B,EAAA;AAC9B,IAAM,MAAA,eAAA,GAAkB,OAAuB,IAAI,CAAA;AACnD,IAAM,MAAA,YAAA,GAAe,UAAW,CAAA,GAAA,EAAK,eAAe,CAAA;AAEpD,IAAM,MAAA,sBAAA,GAA4D,CAChE,KACG,KAAA;AACH,MAAA,KAAA,CAAM,eAAgB,EAAA;AACtB,MAAA,UAAA,CAAW,MAAM;AAhFvB,QAAA,IAAA,EAAA;AAiFQ,QAAA,IAAA,CAAI,EAAiB,GAAA,eAAA,IAAA,IAAA,GAAA,MAAA,GAAA,eAAA,CAAA,OAAA,KAAjB,IAA0B,GAAA,MAAA,GAAA,EAAA,CAAA,QAAA,CAAS,SAAS,aAAgB,CAAA,EAAA;AAC9D,UAAA;AAAA;AAEF,QAAA,cAAA,CAAe,OAAO,IAAI,CAAA;AAC1B,QAAA,cAAA,CAAe,OAAO,IAAI,CAAA;AAAA,SACzB,CAAC,CAAA;AACJ,MAAS,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAA,KAAA,CAAA;AAAA,KACX;AAEA,IACE,uBAAA,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,OAAA;AAAA,QACA,GAAK,EAAA,CAAA;AAAA,QACL,GAAK,EAAA,YAAA;AAAA,QACL,MAAQ,EAAA,sBAAA;AAAA,QACP,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA,KAAA,CAAM,KAAK,EAAE,MAAA,EAAQ,uBAAyB,EAAA,CAAC,QAAQ,KAAU,KAAA;AAChE,UAAM,MAAA,oBAAA,GAA8B,WAAY,CAAA,GAAA,CAAI,YAAc,EAAA;AAAA,YAChE,MAAQ,EAAA;AAAA,WACT,CAAA;AACD,UACE,uBAAA,IAAA;AAAA,YAAC,QAAA;AAAA,YAAA;AAAA,cAGE,QAAA,EAAA;AAAA,gBAAA,qBAAA,GAAwB,CACvB,mBAAA,GAAA;AAAA,kBAAC,mBAAA;AAAA,kBAAA;AAAA,oBACE,GAAG,wBAAA;AAAA,oBACJ,KAAO,EAAA;AAAA;AAAA,iBAEP,GAAA,IAAA;AAAA,gCACJ,GAAA,CAAC,kBAAoB,EAAA,EAAA,GAAG,uBAAyB,EAAA,CAAA;AAAA,gCACjD,GAAA;AAAA,kBAAC,aAAA;AAAA,kBAAA;AAAA,oBACC,IAAM,EAAA,oBAAA;AAAA,oBACN;AAAA;AAAA;AACF;AAAA,aAAA;AAAA,YAZK,CAAsB,mBAAA,EAAA,WAAA,CAAY,MAAO,CAAA,oBAAA,EAAsB,WAAW,CAAC,CAAA;AAAA,WAalF;AAAA,SAEH;AAAA;AAAA,KACH;AAAA;AAGN;;;;"}
+{"version":3,"file":"CalendarGrid.js","sources":["../src/calendar/CalendarGrid.tsx"],"sourcesContent":["import {\n  GridItem,\n  GridLayout,\n  type ResponsiveProp,\n  useForkRef,\n} from \"@salt-ds/core\";\nimport type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport {\n  type ComponentPropsWithoutRef,\n  type FocusEventHandler,\n  forwardRef,\n  useMemo,\n  useRef,\n} from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport {\n  CalendarMonthHeader,\n  type CalendarMonthHeaderProps,\n} from \"./CalendarMonthHeader\";\nimport {\n  CalendarWeekHeader,\n  type CalendarWeekHeaderProps,\n} from \"./CalendarWeekHeader\";\nimport { useCalendarContext } from \"./internal/CalendarContext\";\nimport type { CalendarDayProps } from \"./internal/CalendarDay\";\nimport { CalendarMonth } from \"./internal/CalendarMonth\";\n\n/**\n * Props for the CalendarGrid component.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarGridProps<TDate extends DateFrameworkType>\n  extends ComponentPropsWithoutRef<\"div\"> {\n  /**\n   * Number of columns\n   */\n  columns?: ResponsiveProp<number | string>;\n  /**\n   * Props for `CalendarWeekHeader`\n   */\n  CalendarWeekHeaderProps?: Partial<CalendarWeekHeaderProps>;\n  /**\n   * Props for `CalendarMonthHeader`\n   */\n  CalendarMonthHeaderProps?: Partial<CalendarMonthHeaderProps<TDate>>;\n  /**\n   * Props for `CalendarDay`\n   */\n  CalendarDayProps?: Partial<CalendarDayProps<TDate>>;\n}\n\nexport const CalendarGrid = forwardRef<\n  HTMLDivElement,\n  CalendarGridProps<DateFrameworkType>\n>(\n  <TDate extends DateFrameworkType>(\n    props: CalendarGridProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const {\n      CalendarDayProps,\n      CalendarWeekHeaderProps,\n      CalendarMonthHeaderProps,\n      columns = 1,\n      onBlur,\n      ...rest\n    } = props;\n\n    const { dateAdapter } = useLocalization<TDate>();\n\n    const {\n      helpers: { setFocusedDate, setHoveredDate },\n      state: { visibleMonth, numberOfVisibleMonths = 1 },\n    } = useCalendarContext<TDate>();\n    const calendarGridRef = useRef<HTMLDivElement>(null);\n    const containerRef = useForkRef(ref, calendarGridRef);\n\n    const handleCalendarGridBlur: FocusEventHandler<HTMLDivElement> = (\n      event,\n    ) => {\n      event.stopPropagation();\n      const relatedTarget = event.relatedTarget as HTMLElement;\n      if (\n        calendarGridRef.current &&\n        relatedTarget &&\n        calendarGridRef.current.contains(relatedTarget)\n      ) {\n        return;\n      }\n      setFocusedDate(event, null);\n      setHoveredDate(event, null);\n      onBlur?.(event);\n    };\n\n    const visibleMonths = useMemo(\n      () =>\n        Array.from({ length: numberOfVisibleMonths }, (_value, index) => {\n          const gridItemVisibleMonth: TDate = dateAdapter.add(visibleMonth, {\n            months: index,\n          });\n          return gridItemVisibleMonth;\n        }),\n      [dateAdapter, numberOfVisibleMonths, visibleMonth],\n    );\n\n    return (\n      <GridLayout\n        columns={columns}\n        gap={1}\n        ref={containerRef}\n        onBlur={handleCalendarGridBlur}\n        {...rest}\n      >\n        {visibleMonths.map((gridItemVisibleMonth) => (\n          <GridItem\n            key={`calendar-grid-item-${dateAdapter.format(gridItemVisibleMonth, \"MMMM YYYY\")}`}\n          >\n            {numberOfVisibleMonths > 1 ? (\n              <CalendarMonthHeader\n                {...CalendarMonthHeaderProps}\n                month={gridItemVisibleMonth}\n              />\n            ) : null}\n            <CalendarWeekHeader {...CalendarWeekHeaderProps} />\n            <CalendarMonth\n              date={gridItemVisibleMonth}\n              CalendarDayProps={CalendarDayProps}\n            />\n          </GridItem>\n        ))}\n      </GridLayout>\n    );\n  },\n);\n"],"names":[],"mappings":";;;;;;;;;AAmDO,MAAM,YAAA,GAAe,UAAA;AAAA,EAI1B,CACE,OACA,GAAA,KACG;AACH,IAAA,MAAM;AAAA,MACJ,gBAAA;AAAA,MACA,uBAAA;AAAA,MACA,wBAAA;AAAA,MACA,OAAA,GAAU,CAAA;AAAA,MACV,MAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AAEJ,IAAA,MAAM,EAAE,WAAA,EAAY,GAAI,eAAA,EAAuB;AAE/C,IAAA,MAAM;AAAA,MACJ,OAAA,EAAS,EAAE,cAAA,EAAgB,cAAA,EAAe;AAAA,MAC1C,KAAA,EAAO,EAAE,YAAA,EAAc,qBAAA,GAAwB,CAAA;AAAE,QAC/C,kBAAA,EAA0B;AAC9B,IAAA,MAAM,eAAA,GAAkB,OAAuB,IAAI,CAAA;AACnD,IAAA,MAAM,YAAA,GAAe,UAAA,CAAW,GAAA,EAAK,eAAe,CAAA;AAEpD,IAAA,MAAM,sBAAA,GAA4D,CAChE,KAAA,KACG;AACH,MAAA,KAAA,CAAM,eAAA,EAAgB;AACtB,MAAA,MAAM,gBAAgB,KAAA,CAAM,aAAA;AAC5B,MAAA,IACE,gBAAgB,OAAA,IAChB,aAAA,IACA,gBAAgB,OAAA,CAAQ,QAAA,CAAS,aAAa,CAAA,EAC9C;AACA,QAAA;AAAA,MACF;AACA,MAAA,cAAA,CAAe,OAAO,IAAI,CAAA;AAC1B,MAAA,cAAA,CAAe,OAAO,IAAI,CAAA;AAC1B,MAAA,MAAA,IAAA,IAAA,GAAA,MAAA,GAAA,MAAA,CAAS,KAAA,CAAA;AAAA,IACX,CAAA;AAEA,IAAA,MAAM,aAAA,GAAgB,OAAA;AAAA,MACpB,MACE,MAAM,IAAA,CAAK,EAAE,QAAQ,qBAAA,EAAsB,EAAG,CAAC,MAAA,EAAQ,KAAA,KAAU;AAC/D,QAAA,MAAM,oBAAA,GAA8B,WAAA,CAAY,GAAA,CAAI,YAAA,EAAc;AAAA,UAChE,MAAA,EAAQ;AAAA,SACT,CAAA;AACD,QAAA,OAAO,oBAAA;AAAA,MACT,CAAC,CAAA;AAAA,MACH,CAAC,WAAA,EAAa,qBAAA,EAAuB,YAAY;AAAA,KACnD;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,UAAA;AAAA,MAAA;AAAA,QACC,OAAA;AAAA,QACA,GAAA,EAAK,CAAA;AAAA,QACL,GAAA,EAAK,YAAA;AAAA,QACL,MAAA,EAAQ,sBAAA;AAAA,QACP,GAAG,IAAA;AAAA,QAEH,QAAA,EAAA,aAAA,CAAc,GAAA,CAAI,CAAC,oBAAA,qBAClB,IAAA;AAAA,UAAC,QAAA;AAAA,UAAA;AAAA,YAGE,QAAA,EAAA;AAAA,cAAA,qBAAA,GAAwB,CAAA,mBACvB,GAAA;AAAA,gBAAC,mBAAA;AAAA,gBAAA;AAAA,kBACE,GAAG,wBAAA;AAAA,kBACJ,KAAA,EAAO;AAAA;AAAA,eACT,GACE,IAAA;AAAA,8BACJ,GAAA,CAAC,kBAAA,EAAA,EAAoB,GAAG,uBAAA,EAAyB,CAAA;AAAA,8BACjD,GAAA;AAAA,gBAAC,aAAA;AAAA,gBAAA;AAAA,kBACC,IAAA,EAAM,oBAAA;AAAA,kBACN;AAAA;AAAA;AACF;AAAA,WAAA;AAAA,UAZK,CAAA,mBAAA,EAAsB,WAAA,CAAY,MAAA,CAAO,oBAAA,EAAsB,WAAW,CAAC,CAAA;AAAA,SAcnF;AAAA;AAAA,KACH;AAAA,EAEJ;AACF;;;;"}

package/dist-es/calendar/CalendarMonthHeader.js

@@ -36,7 +36,7 @@ const CalendarMonthHeader = forwardRef(
         className: clsx(withBaseName(), className),
         ref,
         ...rest,
-        children: /* @__PURE__ */ jsx(Text, { children: /* @__PURE__ */ jsx("small", { children: formatMonth(month) }) })
+        children: /* @__PURE__ */ jsx(Text, { children: formatMonth(month) })
       }
     );
   }

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

@@ -1 +1 @@
-{"version":3,"file":"CalendarMonthHeader.js","sources":["../src/calendar/CalendarMonthHeader.tsx"],"sourcesContent":["import { makePrefixer, Text } from \"@salt-ds/core\";\nimport type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithRef, forwardRef, useCallback } from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarMonthHeaderCss from \"./CalendarMonthHeader.css\";\n\n/**\n * Props for the CalendarMonthHeader component.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarMonthHeaderProps<TDate extends DateFrameworkType>\n  extends ComponentPropsWithRef<\"div\"> {\n  /**\n   * Month value\n   */\n  month: TDate;\n  /**\n   * Format the month value\n   * @param date\n   */\n  format?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarMonthHeader\");\n\nexport const CalendarMonthHeader = forwardRef<\n  HTMLDivElement,\n  CalendarMonthHeaderProps<DateFrameworkType>\n>(\n  <TDate extends DateFrameworkType>(\n    props: CalendarMonthHeaderProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const {\n      className,\n      format: formatMonthProp = \"MMMM\",\n      month,\n      ...rest\n    } = props;\n    const { dateAdapter } = useLocalization<TDate>();\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-calendar-month-header\",\n      css: calendarMonthHeaderCss,\n      window: targetWindow,\n    });\n\n    const formatMonth = useCallback(\n      (date?: TDate) => {\n        return dateAdapter.format(date, formatMonthProp);\n      },\n      [dateAdapter, formatMonthProp],\n    );\n\n    return (\n      <div\n        data-testid=\"CalendarMonthHeader\"\n        className={clsx(withBaseName(), className)}\n        ref={ref}\n        {...rest}\n      >\n        <Text>\n          <small>{formatMonth(month)}</small>\n        </Text>\n      </div>\n    );\n  },\n);\n"],"names":["calendarMonthHeaderCss"],"mappings":";;;;;;;;;AA0BA,MAAM,YAAA,GAAe,aAAa,yBAAyB,CAAA;AAEpD,MAAM,mBAAsB,GAAA,UAAA;AAAA,EAIjC,CACE,OACA,GACG,KAAA;AACH,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,QAAQ,eAAkB,GAAA,MAAA;AAAA,MAC1B,KAAA;AAAA,MACA,GAAG;AAAA,KACD,GAAA,KAAA;AACJ,IAAM,MAAA,EAAE,WAAY,EAAA,GAAI,eAAuB,EAAA;AAE/C,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,4BAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,WAAc,GAAA,WAAA;AAAA,MAClB,CAAC,IAAiB,KAAA;AAChB,QAAO,OAAA,WAAA,CAAY,MAAO,CAAA,IAAA,EAAM,eAAe,CAAA;AAAA,OACjD;AAAA,MACA,CAAC,aAAa,eAAe;AAAA,KAC/B;AAEA,IACE,uBAAA,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,aAAY,EAAA,qBAAA;AAAA,QACZ,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,8BAAC,IACC,EAAA,EAAA,QAAA,kBAAA,GAAA,CAAC,WAAO,QAAY,EAAA,WAAA,CAAA,KAAK,GAAE,CAC7B,EAAA;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}
+{"version":3,"file":"CalendarMonthHeader.js","sources":["../src/calendar/CalendarMonthHeader.tsx"],"sourcesContent":["import { makePrefixer, Text } from \"@salt-ds/core\";\nimport type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithRef, forwardRef, useCallback } from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarMonthHeaderCss from \"./CalendarMonthHeader.css\";\n\n/**\n * Props for the CalendarMonthHeader component.\n * @template TDate - The type of the date object.\n */\nexport interface CalendarMonthHeaderProps<TDate extends DateFrameworkType>\n  extends ComponentPropsWithRef<\"div\"> {\n  /**\n   * Month value\n   */\n  month: TDate;\n  /**\n   * Format the month value\n   * @param date\n   */\n  format?: string;\n}\n\nconst withBaseName = makePrefixer(\"saltCalendarMonthHeader\");\n\nexport const CalendarMonthHeader = forwardRef<\n  HTMLDivElement,\n  CalendarMonthHeaderProps<DateFrameworkType>\n>(\n  <TDate extends DateFrameworkType>(\n    props: CalendarMonthHeaderProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const {\n      className,\n      format: formatMonthProp = \"MMMM\",\n      month,\n      ...rest\n    } = props;\n    const { dateAdapter } = useLocalization<TDate>();\n\n    const targetWindow = useWindow();\n    useComponentCssInjection({\n      testId: \"salt-calendar-month-header\",\n      css: calendarMonthHeaderCss,\n      window: targetWindow,\n    });\n\n    const formatMonth = useCallback(\n      (date?: TDate) => {\n        return dateAdapter.format(date, formatMonthProp);\n      },\n      [dateAdapter, formatMonthProp],\n    );\n\n    return (\n      <div\n        data-testid=\"CalendarMonthHeader\"\n        className={clsx(withBaseName(), className)}\n        ref={ref}\n        {...rest}\n      >\n        <Text>{formatMonth(month)}</Text>\n      </div>\n    );\n  },\n);\n"],"names":["calendarMonthHeaderCss"],"mappings":";;;;;;;;;AA0BA,MAAM,YAAA,GAAe,aAAa,yBAAyB,CAAA;AAEpD,MAAM,mBAAA,GAAsB,UAAA;AAAA,EAIjC,CACE,OACA,GAAA,KACG;AACH,IAAA,MAAM;AAAA,MACJ,SAAA;AAAA,MACA,QAAQ,eAAA,GAAkB,MAAA;AAAA,MAC1B,KAAA;AAAA,MACA,GAAG;AAAA,KACL,GAAI,KAAA;AACJ,IAAA,MAAM,EAAE,WAAA,EAAY,GAAI,eAAA,EAAuB;AAE/C,IAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,IAAA,wBAAA,CAAyB;AAAA,MACvB,MAAA,EAAQ,4BAAA;AAAA,MACR,GAAA,EAAKA,QAAA;AAAA,MACL,MAAA,EAAQ;AAAA,KACT,CAAA;AAED,IAAA,MAAM,WAAA,GAAc,WAAA;AAAA,MAClB,CAAC,IAAA,KAAiB;AAChB,QAAA,OAAO,WAAA,CAAY,MAAA,CAAO,IAAA,EAAM,eAAe,CAAA;AAAA,MACjD,CAAA;AAAA,MACA,CAAC,aAAa,eAAe;AAAA,KAC/B;AAEA,IAAA,uBACE,GAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,aAAA,EAAY,qBAAA;AAAA,QACZ,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,QACzC,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,QAAA,kBAAA,GAAA,CAAC,IAAA,EAAA,EAAM,QAAA,EAAA,WAAA,CAAY,KAAK,CAAA,EAAE;AAAA;AAAA,KAC5B;AAAA,EAEJ;AACF;;;;"}

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

@@ -1,4 +1,4 @@
-var css_248z = ".saltCalendarNavigation {\n  display: grid;\n  grid-template-columns: min-content auto min-content;\n  padding-bottom: var(--salt-spacing-100);\n  grid-gap: var(--salt-spacing-25);\n  align-items: center;\n  box-sizing: border-box;\n}\n\n.saltCalendarNavigation-hideYearDropdown {\n  grid-template-columns: min-content auto min-content;\n  grid-gap: var(--salt-spacing-300);\n}\n\n.saltCalendarNavigation-dropdowns {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  grid-gap: var(--salt-spacing-100);\n}\n";
+var css_248z = ".saltCalendarNavigation {\n  display: grid;\n  grid-template-columns: min-content auto min-content;\n  padding-bottom: var(--salt-spacing-100);\n  grid-gap: var(--salt-spacing-25);\n  align-items: center;\n  box-sizing: border-box;\n}\n\n.saltCalendarNavigation-yearDropdown {\n  min-width: 4.3em;\n}\n\n.saltCalendarNavigation-hideYearDropdown {\n  grid-template-columns: min-content auto min-content;\n  grid-gap: var(--salt-spacing-300);\n}\n\n.saltCalendarNavigation-dropdowns {\n  display: grid;\n  grid-template-columns: 1fr 1fr;\n  grid-gap: var(--salt-spacing-100);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=CalendarNavigation.css.js.map

package/dist-es/calendar/CalendarNavigation.js

@@ -1,5 +1,5 @@
 import { jsxs, jsx, Fragment } from 'react/jsx-runtime';
-import { makePrefixer, useIcon, Button, Dropdown, Tooltip, useListControlContext, Option } from '@salt-ds/core';
+import { makePrefixer, useIcon, Button, Dropdown, Option, Tooltip, useListControlContext } from '@salt-ds/core';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
 import { clsx } from 'clsx';
@@ -270,19 +270,22 @@ const CalendarNavigation = forwardRef(
                     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)
-                    ))
+                    children: months.map((month) => {
+                      const outsideAllowedMonths = isOutsideAllowedMonths(month);
+                      return /* @__PURE__ */ jsx(
+                        OptionWithTooltip,
+                        {
+                          value: month,
+                          disabled: outsideAllowedMonths,
+                          tooltipContent: "This month is out of range",
+                          children: formatMonth(month)
+                        },
+                        formatMonth(month)
+                      );
+                    })
                   }
                 ),
-                !hideYearDropdown && /* @__PURE__ */ jsx(
+                !hideYearDropdown ? /* @__PURE__ */ jsx(
                   Dropdown,
                   {
                     "aria-label": "Year Dropdown",
@@ -290,9 +293,13 @@ const CalendarNavigation = forwardRef(
                     value: formatYear(selectedYear),
                     onSelectionChange: handleYearSelect,
                     ...YearDropdownProps,
-                    children: years.map((year) => /* @__PURE__ */ jsx(OptionWithTooltip, { value: year, children: formatYear(year) }, formatYear(year)))
+                    className: clsx(
+                      withBaseName("yearDropdown"),
+                      YearDropdownProps == null ? void 0 : YearDropdownProps.className
+                    ),
+                    children: years.map((year) => /* @__PURE__ */ jsx(Option, { value: year, children: formatYear(year) }, formatYear(year)))
                   }
-                )
+                ) : null
               ]
             }
           ),

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  makePrefixer,\n  Option,\n  type OptionProps,\n  Tooltip,\n  type TooltipProps,\n  useIcon,\n  useListControlContext,\n} from \"@salt-ds/core\";\nimport type {\n  DateFrameworkType,\n  SaltDateAdapter,\n  Timezone,\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  forwardRef,\n  type MouseEventHandler,\n  type SyntheticEvent,\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 * @template TDate - The type of the date object.\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   * If `true` then navigate next button is enabled\n   */\n  disableNavigateNext?: boolean;\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` then navigate previous button is enabled\n   */\n  disableNavigatePrevious?: boolean;\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  timezone: Timezone = \"default\",\n): TDate[] {\n  const years: TDate[] = [];\n  let startOfYear = dateAdapter.today(timezone);\n  for (let year = minYear; year <= maxYear; year++) {\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, timezone, minDate, maxDate },\n    helpers: { setVisibleMonth, isDayVisible, isOutsideAllowedMonths },\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    [dateAdapter, isOutsideAllowedMonths, setVisibleMonth, visibleMonth],\n  );\n\n  const months: TDate[] = useMemo(\n    () => generateMonthsForYear<TDate>(dateAdapter, visibleMonth),\n    [dateAdapter, 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        timezone,\n      ),\n    [dateAdapter, minDate, maxDate, visibleMonth, timezone],\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 disableNavigatePrevious = isDayVisible(minDate);\n  const disableNavigateNext = isDayVisible(maxDate);\n\n  return useMemo(\n    () => ({\n      moveToNextMonth,\n      moveToPreviousMonth,\n      moveToMonth,\n      visibleMonth,\n      months,\n      years,\n      disableNavigateNext,\n      disableNavigatePrevious,\n      selectedMonth,\n      selectedYear,\n      isOutsideAllowedMonths,\n    }),\n    [\n      months,\n      moveToPreviousMonth,\n      moveToNextMonth,\n      moveToMonth,\n      visibleMonth,\n      years,\n      disableNavigateNext,\n      disableNavigatePrevious,\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<DateFrameworkType>\n>(\n  <TDate extends DateFrameworkType>(\n    props: CalendarNavigationProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const {\n      className,\n      disableNavigatePrevious: disableNavigatePreviousProp,\n      disableNavigateNext: disableNavigateNextProp,\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      moveToPreviousMonth,\n      moveToNextMonth,\n      moveToMonth,\n      months,\n      years,\n      disableNavigateNext,\n      disableNavigatePrevious,\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      [dateAdapter, moveToMonth, visibleMonth],\n    );\n\n    const formatMonth = useCallback(\n      (date?: TDate) => {\n        if (date && formatMonthProp) {\n          return dateAdapter.format(date, formatMonthProp);\n        }\n        return date\n          ? dateAdapter.format(date, hideYearDropdown ? \"MMMM\" : \"MMM\")\n          : \"\";\n      },\n      [dateAdapter, formatMonthProp, hideYearDropdown],\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={!(disableNavigatePreviousProp || disableNavigatePrevious)}\n          content=\"Past dates are out of range\"\n          enterDelay={0} // --salt-duration-instant\n          leaveDelay={0} // --salt-duration-instant\n        >\n          <Button\n            aria-label=\"Previous Month\"\n            disabled={disableNavigatePreviousProp || disableNavigatePrevious}\n            appearance=\"transparent\"\n            sentiment=\"neutral\"\n            onClick={handleNavigatePrevious}\n            focusableWhenDisabled={true}\n          >\n            <PreviousIcon aria-hidden />\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={!(disableNavigateNextProp || disableNavigateNext)}\n          content=\"Future dates are out of range\"\n          enterDelay={0} // --salt-duration-instant\n          leaveDelay={0} // --salt-duration-instant\n        >\n          <Button\n            aria-label=\"Next Month\"\n            disabled={disableNavigateNextProp || disableNavigateNext}\n            appearance=\"transparent\"\n            sentiment=\"neutral\"\n            onClick={handleNavigateNext}\n            focusableWhenDisabled={true}\n          >\n            <NextIcon aria-hidden />\n          </Button>\n        </ConditionalTooltip>\n      </div>\n    );\n  },\n);\n"],"names":["calendarNavigationCss"],"mappings":";;;;;;;;;;;AA8GA,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,yBACP,CAAA,WAAA,EACA,OACA,EAAA,OAAA,EACA,WAAqB,SACZ,EAAA;AACT,EAAA,MAAM,QAAiB,EAAC;AACxB,EAAI,IAAA,WAAA,GAAc,WAAY,CAAA,KAAA,CAAM,QAAQ,CAAA;AAC5C,EAAA,KAAA,IAAS,IAAO,GAAA,OAAA,EAAS,IAAQ,IAAA,OAAA,EAAS,IAAQ,EAAA,EAAA;AAChD,IAAc,WAAA,GAAA,WAAA,CAAY,IAAI,WAAa,EAAA,EAAE,KAAK,CAAG,EAAA,KAAA,EAAO,CAAG,EAAA,IAAA,EAAM,CAAA;AACrE,IAAA,KAAA,CAAM,KAAK,WAAW,CAAA;AAAA;AAExB,EAAO,OAAA,KAAA;AACT;AAEA,SAAS,qBAAyD,GAAA;AAChE,EAAM,MAAA;AAAA,IACJ,KAAO,EAAA,EAAE,YAAc,EAAA,QAAA,EAAU,SAAS,OAAQ,EAAA;AAAA,IAClD,OAAS,EAAA,EAAE,eAAiB,EAAA,YAAA,EAAc,sBAAuB;AAAA,MAC/D,kBAA0B,EAAA;AAE9B,EAAM,MAAA,EAAE,WAAY,EAAA,GAAI,eAAuB,EAAA;AAE/C,EAAA,MAAM,eAAkB,GAAA,WAAA;AAAA,IACtB,CAAC,KAAuB,EAAA,IAAA,GAAO,CAAM,KAAA;AACnC,MAAgB,eAAA,CAAA,KAAA,EAAO,YAAY,GAAI,CAAA,YAAA,EAAc,EAAE,MAAQ,EAAA,IAAA,EAAM,CAAC,CAAA;AAAA,KACxE;AAAA,IACA,CAAC,WAAa,EAAA,eAAA,EAAiB,YAAY;AAAA,GAC7C;AAEA,EAAA,MAAM,mBAAsB,GAAA,WAAA;AAAA,IAC1B,CAAC,KAAuB,EAAA,IAAA,GAAO,CAAM,KAAA;AACnC,MAAA,eAAA;AAAA,QACE,KAAA;AAAA,QACA,YAAY,QAAS,CAAA,YAAA,EAAc,EAAE,MAAA,EAAQ,MAAM;AAAA,OACrD;AAAA,KACF;AAAA,IACA,CAAC,WAAa,EAAA,eAAA,EAAiB,YAAY;AAAA,GAC7C;AAEA,EAAA,MAAM,WAAc,GAAA,WAAA;AAAA,IAClB,CAAC,OAAuB,KAAiB,KAAA;AACvC,MAAA,IAAI,QAAW,GAAA,KAAA;AAEf,MAAI,IAAA,sBAAA,CAAuB,QAAQ,CAAG,EAAA;AAEpC,QAAA,MAAM,eAAkB,GAAA,qBAAA;AAAA,UACtB,WAAA;AAAA,UACA;AAAA,UACA,MAAO,CAAA,CAAC,MAAM,CAAC,sBAAA,CAAuB,CAAC,CAAC,CAAA;AAC1C,QAAA,QAAA,GAAW,eAAgB,CAAA,MAAA;AAAA,UAAO,CAAC,YAAc,EAAA,YAAA,KAC/C,KAAK,GAAI,CAAA,SAAA,CAAU,aAAa,YAAc,EAAA,QAAQ,CAAC,CACvD,GAAA,IAAA,CAAK,IAAI,SAAU,CAAA,WAAA,EAAa,cAAc,QAAQ,CAAC,IACnD,YACA,GAAA;AAAA,SACN;AAAA;AAEF,MAAA,eAAA,CAAgB,OAAO,QAAQ,CAAA;AAAA,KACjC;AAAA,IACA,CAAC,WAAA,EAAa,sBAAwB,EAAA,eAAA,EAAiB,YAAY;AAAA,GACrE;AAEA,EAAA,MAAM,MAAkB,GAAA,OAAA;AAAA,IACtB,MAAM,qBAA6B,CAAA,WAAA,EAAa,YAAY,CAAA;AAAA,IAC5D,CAAC,aAAa,YAAY;AAAA,GAC5B;AAEA,EAAA,MAAM,KAAiB,GAAA,OAAA;AAAA,IACrB,MACE,yBAAA;AAAA,MACE,WAAA;AAAA,MACA,IAAK,CAAA,GAAA;AAAA,QACH,WAAA,CAAY,QAAQ,OAAO,CAAA;AAAA,QAC3B,WAAA,CAAY,QAAQ,YAAY;AAAA,OAClC;AAAA,MACA,IAAK,CAAA,GAAA;AAAA,QACH,WAAA,CAAY,QAAQ,OAAO,CAAA;AAAA,QAC3B,WAAA,CAAY,QAAQ,YAAY;AAAA,OAClC;AAAA,MACA;AAAA,KACF;AAAA,IACF,CAAC,WAAA,EAAa,OAAS,EAAA,OAAA,EAAS,cAAc,QAAQ;AAAA,GACxD;AAEA,EAAA,MAAM,gBAAmC,MAAO,CAAA,IAAA;AAAA,IAAK,CAAC,KACpD,KAAA,WAAA,CAAY,MAAO,CAAA,KAAA,EAAO,cAAc,OAAO;AAAA,GACjD;AACA,EAAA,MAAM,eAAkC,KAAM,CAAA,IAAA;AAAA,IAAK,CAAC,IAClD,KAAA,WAAA,CAAY,MAAO,CAAA,IAAA,EAAM,cAAc,MAAM;AAAA,GAC/C;AAEA,EAAM,MAAA,uBAAA,GAA0B,aAAa,OAAO,CAAA;AACpD,EAAM,MAAA,mBAAA,GAAsB,aAAa,OAAO,CAAA;AAEhD,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,mBAAA;AAAA,MACA,uBAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA;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,mBAAA;AAAA,MACA,uBAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA;AAAA,MACA;AAAA;AACF,GACF;AACF;AAEA,SAAS,iBAAmD,CAAA;AAAA,EAC1D,KAAA;AAAA,EACA,QAAA;AAAA,EACA,QAAW,GAAA,KAAA;AAAA,EACX;AACF,CAAkC,EAAA;AAChC,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;AAEO,MAAM,kBAAqB,GAAA,UAAA;AAAA,EAIhC,CACE,OACA,GACG,KAAA;AACH,IAAM,MAAA;AAAA,MACJ,SAAA;AAAA,MACA,uBAAyB,EAAA,2BAAA;AAAA,MACzB,mBAAqB,EAAA,uBAAA;AAAA,MACrB,WAAa,EAAA,eAAA;AAAA,MACb,UAAY,EAAA,cAAA;AAAA,MACZ,kBAAA;AAAA,MACA,iBAAA;AAAA,MACA,gBAAA;AAAA,MACA,IAAO,GAAA,CAAA;AAAA,MACP,GAAG;AAAA,KACD,GAAA,KAAA;AAEJ,IAAM,MAAA,EAAE,WAAY,EAAA,GAAI,eAAuB,EAAA;AAE/C,IAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,IAAyB,wBAAA,CAAA;AAAA,MACvB,MAAQ,EAAA,0BAAA;AAAA,MACR,GAAK,EAAAA,QAAA;AAAA,MACL,MAAQ,EAAA;AAAA,KACT,CAAA;AAED,IAAA,MAAM,EAAE,QAAA,EAAU,YAAa,EAAA,GAAI,OAAQ,EAAA;AAE3C,IAAM,MAAA;AAAA,MACJ,mBAAA;AAAA,MACA,eAAA;AAAA,MACA,WAAA;AAAA,MACA,MAAA;AAAA,MACA,KAAA;AAAA,MACA,mBAAA;AAAA,MACA,uBAAA;AAAA,MACA,aAAA;AAAA,MACA,YAAA;AAAA,MACA,sBAAA;AAAA,MACA;AAAA,QACE,qBAA6B,EAAA;AAEjC,IAAA,MAAM,sBACJ,GAAA,WAAA;AAAA,MACE,CAAC,KAAU,KAAA;AACT,QAAA,mBAAA,CAAoB,OAAO,IAAI,CAAA;AAAA,OACjC;AAAA,MACA,CAAC,qBAAqB,IAAI;AAAA,KAC5B;AAEF,IAAA,MAAM,kBACJ,GAAA,WAAA;AAAA,MACE,CAAC,KAAU,KAAA;AACT,QAAA,eAAA,CAAgB,OAAO,IAAI,CAAA;AAAA,OAC7B;AAAA,MACA,CAAC,iBAAiB,IAAI;AAAA,KACxB;AAEF,IAAA,MAAM,iBAAoB,GAAA,WAAA;AAAA,MACxB,CAAC,OAAuB,KAAmB,KAAA;AACzC,QAAY,WAAA,CAAA,KAAA,EAAO,KAAM,CAAA,CAAC,CAAC,CAAA;AAAA,OAC7B;AAAA,MACA,CAAC,WAAW;AAAA,KACd;AAEA,IAAA,MAAM,gBAAmB,GAAA,WAAA;AAAA,MACvB,CAAC,OAAuB,IAAkB,KAAA;AACxC,QAAI,IAAA,eAAA,GAAkB,WAAY,CAAA,KAAA,CAAM,YAAY,CAAA;AACpD,QAAkB,eAAA,GAAA,WAAA,CAAY,IAAI,eAAiB,EAAA;AAAA,UACjD,IAAM,EAAA,WAAA,CAAY,OAAQ,CAAA,IAAA,CAAK,CAAC,CAAC;AAAA,SAClC,CAAA;AACD,QAAA,WAAA,CAAY,OAAO,eAAe,CAAA;AAAA,OACpC;AAAA,MACA,CAAC,WAAa,EAAA,WAAA,EAAa,YAAY;AAAA,KACzC;AAEA,IAAA,MAAM,WAAc,GAAA,WAAA;AAAA,MAClB,CAAC,IAAiB,KAAA;AAChB,QAAA,IAAI,QAAQ,eAAiB,EAAA;AAC3B,UAAO,OAAA,WAAA,CAAY,MAAO,CAAA,IAAA,EAAM,eAAe,CAAA;AAAA;AAEjD,QAAA,OAAO,OACH,WAAY,CAAA,MAAA,CAAO,MAAM,gBAAmB,GAAA,MAAA,GAAS,KAAK,CAC1D,GAAA,EAAA;AAAA,OACN;AAAA,MACA,CAAC,WAAa,EAAA,eAAA,EAAiB,gBAAgB;AAAA,KACjD;AAEA,IAAA,MAAM,UAAa,GAAA,WAAA;AAAA,MACjB,CAAC,IAAiB,KAAA;AAChB,QAAA,IAAI,QAAQ,cAAgB,EAAA;AAC1B,UAAO,OAAA,WAAA,CAAY,MAAO,CAAA,IAAA,EAAM,cAAc,CAAA;AAAA;AAEhD,QAAO,OAAA,CAAC,OAAO,EAAK,GAAA,CAAA,EAAG,YAAY,MAAO,CAAA,IAAA,EAAM,MAAM,CAAC,CAAA,CAAA;AAAA,OACzD;AAAA,MACA,CAAC,aAAa,cAAc;AAAA,KAC9B;AAEA,IACE,uBAAA,IAAA;AAAA,MAAC,KAAA;AAAA,MAAA;AAAA,QACC,SAAW,EAAA,IAAA;AAAA,UACT,YAAa,EAAA;AAAA,UACb,EAAE,CAAC,YAAA,CAAa,kBAAkB,CAAC,GAAG,gBAAiB,EAAA;AAAA,UACvD;AAAA,SACF;AAAA,QACA,GAAA;AAAA,QACC,GAAG,IAAA;AAAA,QAEJ,QAAA,EAAA;AAAA,0BAAA,GAAA;AAAA,YAAC,kBAAA;AAAA,YAAA;AAAA,cACC,SAAU,EAAA,KAAA;AAAA,cACV,QAAA,EAAU,EAAE,2BAA+B,IAAA,uBAAA,CAAA;AAAA,cAC3C,OAAQ,EAAA,6BAAA;AAAA,cACR,UAAY,EAAA,CAAA;AAAA,cACZ,UAAY,EAAA,CAAA;AAAA,cAEZ,QAAA,kBAAA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,YAAW,EAAA,gBAAA;AAAA,kBACX,UAAU,2BAA+B,IAAA,uBAAA;AAAA,kBACzC,UAAW,EAAA,aAAA;AAAA,kBACX,SAAU,EAAA,SAAA;AAAA,kBACV,OAAS,EAAA,sBAAA;AAAA,kBACT,qBAAuB,EAAA,IAAA;AAAA,kBAEvB,QAAA,kBAAA,GAAA,CAAC,YAAa,EAAA,EAAA,aAAA,EAAW,IAAC,EAAA;AAAA;AAAA;AAC5B;AAAA,WACF;AAAA,0BACA,IAAA;AAAA,YAAC,KAAA;AAAA,YAAA;AAAA,cACC,SAAA,EAAW,IAAK,CAAA,EAAE,CAAC,YAAA,CAAa,WAAW,CAAC,GAAG,CAAC,gBAAA,EAAkB,CAAA;AAAA,cAElE,QAAA,EAAA;AAAA,gCAAA,GAAA;AAAA,kBAAC,QAAA;AAAA,kBAAA;AAAA,oBACC,YAAW,EAAA,gBAAA;AAAA,oBACX,QAAU,EAAA,aAAA,GAAgB,CAAC,aAAa,IAAI,EAAC;AAAA,oBAC7C,KAAA,EAAO,YAAY,aAAa,CAAA;AAAA,oBAChC,iBAAmB,EAAA,iBAAA;AAAA,oBAClB,GAAG,kBAAA;AAAA,oBAEH,QAAA,EAAA,MAAA,CAAO,GAAI,CAAA,CAAC,KACX,qBAAA,GAAA;AAAA,sBAAC,iBAAA;AAAA,sBAAA;AAAA,wBAEC,KAAO,EAAA,KAAA;AAAA,wBACP,QAAA,EAAU,uBAAuB,KAAK,CAAA;AAAA,wBACtC,cAAe,EAAA,4BAAA;AAAA,wBAEd,sBAAY,KAAK;AAAA,uBAAA;AAAA,sBALb,YAAY,KAAK;AAAA,qBAOzB;AAAA;AAAA,iBACH;AAAA,gBACC,CAAC,gBACA,oBAAA,GAAA;AAAA,kBAAC,QAAA;AAAA,kBAAA;AAAA,oBACC,YAAW,EAAA,eAAA;AAAA,oBACX,QAAU,EAAA,YAAA,GAAe,CAAC,YAAY,IAAI,EAAC;AAAA,oBAC3C,KAAA,EAAO,WAAW,YAAY,CAAA;AAAA,oBAC9B,iBAAmB,EAAA,gBAAA;AAAA,oBAClB,GAAG,iBAAA;AAAA,oBAEH,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;AAAA;AAAA,WAEJ;AAAA,0BACA,GAAA;AAAA,YAAC,kBAAA;AAAA,YAAA;AAAA,cACC,SAAU,EAAA,KAAA;AAAA,cACV,QAAA,EAAU,EAAE,uBAA2B,IAAA,mBAAA,CAAA;AAAA,cACvC,OAAQ,EAAA,+BAAA;AAAA,cACR,UAAY,EAAA,CAAA;AAAA,cACZ,UAAY,EAAA,CAAA;AAAA,cAEZ,QAAA,kBAAA,GAAA;AAAA,gBAAC,MAAA;AAAA,gBAAA;AAAA,kBACC,YAAW,EAAA,YAAA;AAAA,kBACX,UAAU,uBAA2B,IAAA,mBAAA;AAAA,kBACrC,UAAW,EAAA,aAAA;AAAA,kBACX,SAAU,EAAA,SAAA;AAAA,kBACV,OAAS,EAAA,kBAAA;AAAA,kBACT,qBAAuB,EAAA,IAAA;AAAA,kBAEvB,QAAA,kBAAA,GAAA,CAAC,QAAS,EAAA,EAAA,aAAA,EAAW,IAAC,EAAA;AAAA;AAAA;AACxB;AAAA;AACF;AAAA;AAAA,KACF;AAAA;AAGN;;;;"}
+{"version":3,"file":"CalendarNavigation.js","sources":["../src/calendar/CalendarNavigation.tsx"],"sourcesContent":["import {\n  Button,\n  type ButtonProps,\n  Dropdown,\n  type DropdownProps,\n  makePrefixer,\n  Option,\n  type OptionProps,\n  Tooltip,\n  type TooltipProps,\n  useIcon,\n  useListControlContext,\n} from \"@salt-ds/core\";\nimport type {\n  DateFrameworkType,\n  SaltDateAdapter,\n  Timezone,\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  forwardRef,\n  type MouseEventHandler,\n  type SyntheticEvent,\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 * @template TDate - The type of the date object.\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   * If `true` then navigate next button is enabled\n   */\n  disableNavigateNext?: boolean;\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` then navigate previous button is enabled\n   */\n  disableNavigatePrevious?: boolean;\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  timezone: Timezone = \"default\",\n): TDate[] {\n  const years: TDate[] = [];\n  let startOfYear = dateAdapter.today(timezone);\n  for (let year = minYear; year <= maxYear; year++) {\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, timezone, minDate, maxDate },\n    helpers: { setVisibleMonth, isDayVisible, isOutsideAllowedMonths },\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    [dateAdapter, isOutsideAllowedMonths, setVisibleMonth, visibleMonth],\n  );\n\n  const months: TDate[] = useMemo(\n    () => generateMonthsForYear<TDate>(dateAdapter, visibleMonth),\n    [dateAdapter, 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        timezone,\n      ),\n    [dateAdapter, minDate, maxDate, visibleMonth, timezone],\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 disableNavigatePrevious = isDayVisible(minDate);\n  const disableNavigateNext = isDayVisible(maxDate);\n\n  return useMemo(\n    () => ({\n      moveToNextMonth,\n      moveToPreviousMonth,\n      moveToMonth,\n      visibleMonth,\n      months,\n      years,\n      disableNavigateNext,\n      disableNavigatePrevious,\n      selectedMonth,\n      selectedYear,\n      isOutsideAllowedMonths,\n    }),\n    [\n      months,\n      moveToPreviousMonth,\n      moveToNextMonth,\n      moveToMonth,\n      visibleMonth,\n      years,\n      disableNavigateNext,\n      disableNavigatePrevious,\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<DateFrameworkType>\n>(\n  <TDate extends DateFrameworkType>(\n    props: CalendarNavigationProps<TDate>,\n    ref: React.Ref<HTMLDivElement>,\n  ) => {\n    const {\n      className,\n      disableNavigatePrevious: disableNavigatePreviousProp,\n      disableNavigateNext: disableNavigateNextProp,\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      moveToPreviousMonth,\n      moveToNextMonth,\n      moveToMonth,\n      months,\n      years,\n      disableNavigateNext,\n      disableNavigatePrevious,\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      [dateAdapter, moveToMonth, visibleMonth],\n    );\n\n    const formatMonth = useCallback(\n      (date?: TDate) => {\n        if (date && formatMonthProp) {\n          return dateAdapter.format(date, formatMonthProp);\n        }\n        return date\n          ? dateAdapter.format(date, hideYearDropdown ? \"MMMM\" : \"MMM\")\n          : \"\";\n      },\n      [dateAdapter, formatMonthProp, hideYearDropdown],\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={!(disableNavigatePreviousProp || disableNavigatePrevious)}\n          content=\"Past dates are out of range\"\n          enterDelay={0} // --salt-duration-instant\n          leaveDelay={0} // --salt-duration-instant\n        >\n          <Button\n            aria-label=\"Previous Month\"\n            disabled={disableNavigatePreviousProp || disableNavigatePrevious}\n            appearance=\"transparent\"\n            sentiment=\"neutral\"\n            onClick={handleNavigatePrevious}\n            focusableWhenDisabled={true}\n          >\n            <PreviousIcon aria-hidden />\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              const outsideAllowedMonths = isOutsideAllowedMonths(month);\n              return (\n                <OptionWithTooltip\n                  key={formatMonth(month)}\n                  value={month}\n                  disabled={outsideAllowedMonths}\n                  tooltipContent={\"This month is out of range\"}\n                >\n                  {formatMonth(month)}\n                </OptionWithTooltip>\n              );\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              className={clsx(\n                withBaseName(\"yearDropdown\"),\n                YearDropdownProps?.className,\n              )}\n            >\n              {years.map((year) => (\n                <Option key={formatYear(year)} value={year}>\n                  {formatYear(year)}\n                </Option>\n              ))}\n            </Dropdown>\n          ) : null}\n        </div>\n        <ConditionalTooltip\n          placement=\"top\"\n          disabled={!(disableNavigateNextProp || disableNavigateNext)}\n          content=\"Future dates are out of range\"\n          enterDelay={0} // --salt-duration-instant\n          leaveDelay={0} // --salt-duration-instant\n        >\n          <Button\n            aria-label=\"Next Month\"\n            disabled={disableNavigateNextProp || disableNavigateNext}\n            appearance=\"transparent\"\n            sentiment=\"neutral\"\n            onClick={handleNavigateNext}\n            focusableWhenDisabled={true}\n          >\n            <NextIcon aria-hidden />\n          </Button>\n        </ConditionalTooltip>\n      </div>\n    );\n  },\n);\n"],"names":["calendarNavigationCss"],"mappings":"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"}

package/dist-es/calendar/CalendarWeekHeader.css.js

@@ -1,4 +1,4 @@
-var css_248z = ".saltCalendarWeekHeader {\n  display: grid;\n  gap: var(--salt-spacing-fixed-100);\n  grid-template-columns: repeat(7, var(--salt-size-base));\n  text-align: center;\n  align-items: center;\n  height: var(--salt-size-base);\n  margin: var(--salt-spacing-fixed-100);\n}\n\n.saltCalendarWeekHeader-dayOfWeek {\n  width: var(--salt-size-base);\n  color: var(--salt-content-secondary-foreground);\n  font-family: var(--salt-text-fontFamily);\n  font-weight: var(--salt-text-fontWeight);\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n}\n";
+var css_248z = ".saltCalendarWeekHeader {\n  display: flex;\n  text-align: center;\n  align-items: center;\n  height: var(--salt-size-base);\n  gap: var(--calendar-gap);\n}\n\n.saltCalendarWeekHeader-dayOfWeek {\n  width: var(--calendar-day-size);\n  color: var(--salt-content-secondary-foreground);\n  font-family: var(--salt-text-fontFamily);\n  font-weight: var(--salt-text-fontWeight);\n  font-size: var(--salt-text-fontSize);\n  line-height: var(--salt-text-lineHeight);\n}\n";
 
 export { css_248z as default };
 //# sourceMappingURL=CalendarWeekHeader.css.js.map

package/dist-es/calendar/CalendarWeekHeader.js

@@ -1,5 +1,5 @@
 import { jsx } from 'react/jsx-runtime';
-import { makePrefixer } from '@salt-ds/core';
+import { makePrefixer, Text } from '@salt-ds/core';
 import { useComponentCssInjection } from '@salt-ds/styles';
 import { useWindow } from '@salt-ds/window';
 import { clsx } from 'clsx';
@@ -28,7 +28,7 @@ const CalendarWeekHeader = forwardRef(function CalendarWeekHeader2(props, ref) {
       ref,
       ...rest,
       children: weekdaysShort.map((day, index) => /* @__PURE__ */ jsx(
-        "small",
+        Text,
         {
           "aria-hidden": true,
           className: withBaseName("dayOfWeek"),

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

@@ -1 +1 @@
-{"version":3,"file":"CalendarWeekHeader.js","sources":["../src/calendar/CalendarWeekHeader.tsx"],"sourcesContent":["import { makePrefixer } from \"@salt-ds/core\";\nimport type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithRef, forwardRef } from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarWeekHeaderCss from \"./CalendarWeekHeader.css\";\nimport { daysOfWeek } from \"./internal/utils\";\n\n/**\n * Props for the CalendarWeekHeader component.\n */\nexport type CalendarWeekHeaderProps = ComponentPropsWithRef<\"div\"> & {};\n\nconst withBaseName = makePrefixer(\"saltCalendarWeekHeader\");\n\nexport const CalendarWeekHeader = forwardRef(function CalendarWeekHeader<\n  TDate extends DateFrameworkType,\n>(props: CalendarWeekHeaderProps, ref: React.Ref<HTMLDivElement>) {\n  const { className, ...rest } = props;\n  const { dateAdapter } = useLocalization<TDate>();\n\n  const weekdaysShort = daysOfWeek(dateAdapter, \"narrow\");\n  const weekdaysLong = daysOfWeek(dateAdapter, \"long\");\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-calendar-week-header\",\n    css: calendarWeekHeaderCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      data-testid=\"CalendarWeekHeader\"\n      className={clsx(withBaseName(), className)}\n      ref={ref}\n      {...rest}\n    >\n      {weekdaysShort.map((day, index) => (\n        <small\n          aria-hidden\n          key={weekdaysLong[index]}\n          className={withBaseName(\"dayOfWeek\")}\n        >\n          {day}\n        </small>\n      ))}\n    </div>\n  );\n});\n"],"names":["CalendarWeekHeader","calendarWeekHeaderCss"],"mappings":";;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,wBAAwB,CAAA;AAEnD,MAAM,kBAAqB,GAAA,UAAA,CAAW,SAASA,mBAAAA,CAEpD,OAAgC,GAAgC,EAAA;AAChE,EAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAS,GAAA,KAAA;AAC/B,EAAM,MAAA,EAAE,WAAY,EAAA,GAAI,eAAuB,EAAA;AAE/C,EAAM,MAAA,aAAA,GAAgB,UAAW,CAAA,WAAA,EAAa,QAAQ,CAAA;AACtD,EAAM,MAAA,YAAA,GAAe,UAAW,CAAA,WAAA,EAAa,MAAM,CAAA;AAEnD,EAAA,MAAM,eAAe,SAAU,EAAA;AAC/B,EAAyB,wBAAA,CAAA;AAAA,IACvB,MAAQ,EAAA,2BAAA;AAAA,IACR,GAAK,EAAAC,QAAA;AAAA,IACL,MAAQ,EAAA;AAAA,GACT,CAAA;AAED,EACE,uBAAA,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,aAAY,EAAA,oBAAA;AAAA,MACZ,SAAW,EAAA,IAAA,CAAK,YAAa,EAAA,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAc,EAAA,aAAA,CAAA,GAAA,CAAI,CAAC,GAAA,EAAK,KACvB,qBAAA,GAAA;AAAA,QAAC,OAAA;AAAA,QAAA;AAAA,UACC,aAAW,EAAA,IAAA;AAAA,UAEX,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,UAElC,QAAA,EAAA;AAAA,SAAA;AAAA,QAHI,aAAa,KAAK;AAAA,OAK1B;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}
+{"version":3,"file":"CalendarWeekHeader.js","sources":["../src/calendar/CalendarWeekHeader.tsx"],"sourcesContent":["import { makePrefixer, Text } from \"@salt-ds/core\";\nimport type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport { useComponentCssInjection } from \"@salt-ds/styles\";\nimport { useWindow } from \"@salt-ds/window\";\nimport { clsx } from \"clsx\";\nimport { type ComponentPropsWithRef, forwardRef } from \"react\";\nimport { useLocalization } from \"../localization-provider\";\nimport calendarWeekHeaderCss from \"./CalendarWeekHeader.css\";\nimport { daysOfWeek } from \"./internal/utils\";\n\n/**\n * Props for the CalendarWeekHeader component.\n */\nexport type CalendarWeekHeaderProps = ComponentPropsWithRef<\"div\"> & {};\n\nconst withBaseName = makePrefixer(\"saltCalendarWeekHeader\");\n\nexport const CalendarWeekHeader = forwardRef(function CalendarWeekHeader<\n  TDate extends DateFrameworkType,\n>(props: CalendarWeekHeaderProps, ref: React.Ref<HTMLDivElement>) {\n  const { className, ...rest } = props;\n  const { dateAdapter } = useLocalization<TDate>();\n\n  const weekdaysShort = daysOfWeek(dateAdapter, \"narrow\");\n  const weekdaysLong = daysOfWeek(dateAdapter, \"long\");\n\n  const targetWindow = useWindow();\n  useComponentCssInjection({\n    testId: \"salt-calendar-week-header\",\n    css: calendarWeekHeaderCss,\n    window: targetWindow,\n  });\n\n  return (\n    <div\n      data-testid=\"CalendarWeekHeader\"\n      className={clsx(withBaseName(), className)}\n      ref={ref}\n      {...rest}\n    >\n      {weekdaysShort.map((day, index) => (\n        <Text\n          aria-hidden\n          key={weekdaysLong[index]}\n          className={withBaseName(\"dayOfWeek\")}\n        >\n          {day}\n        </Text>\n      ))}\n    </div>\n  );\n});\n"],"names":["CalendarWeekHeader","calendarWeekHeaderCss"],"mappings":";;;;;;;;;;AAeA,MAAM,YAAA,GAAe,aAAa,wBAAwB,CAAA;AAEnD,MAAM,kBAAA,GAAqB,UAAA,CAAW,SAASA,mBAAAA,CAEpD,OAAgC,GAAA,EAAgC;AAChE,EAAA,MAAM,EAAE,SAAA,EAAW,GAAG,IAAA,EAAK,GAAI,KAAA;AAC/B,EAAA,MAAM,EAAE,WAAA,EAAY,GAAI,eAAA,EAAuB;AAE/C,EAAA,MAAM,aAAA,GAAgB,UAAA,CAAW,WAAA,EAAa,QAAQ,CAAA;AACtD,EAAA,MAAM,YAAA,GAAe,UAAA,CAAW,WAAA,EAAa,MAAM,CAAA;AAEnD,EAAA,MAAM,eAAe,SAAA,EAAU;AAC/B,EAAA,wBAAA,CAAyB;AAAA,IACvB,MAAA,EAAQ,2BAAA;AAAA,IACR,GAAA,EAAKC,QAAA;AAAA,IACL,MAAA,EAAQ;AAAA,GACT,CAAA;AAED,EAAA,uBACE,GAAA;AAAA,IAAC,KAAA;AAAA,IAAA;AAAA,MACC,aAAA,EAAY,oBAAA;AAAA,MACZ,SAAA,EAAW,IAAA,CAAK,YAAA,EAAa,EAAG,SAAS,CAAA;AAAA,MACzC,GAAA;AAAA,MACC,GAAG,IAAA;AAAA,MAEH,QAAA,EAAA,aAAA,CAAc,GAAA,CAAI,CAAC,GAAA,EAAK,KAAA,qBACvB,GAAA;AAAA,QAAC,IAAA;AAAA,QAAA;AAAA,UACC,aAAA,EAAW,IAAA;AAAA,UAEX,SAAA,EAAW,aAAa,WAAW,CAAA;AAAA,UAElC,QAAA,EAAA;AAAA,SAAA;AAAA,QAHI,aAAa,KAAK;AAAA,OAK1B;AAAA;AAAA,GACH;AAEJ,CAAC;;;;"}

package/dist-es/calendar/internal/CalendarContext.js.map

@@ -1 +1 @@
-{"version":3,"file":"CalendarContext.js","sources":["../src/calendar/internal/CalendarContext.tsx"],"sourcesContent":["import type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport { createContext, useContext } from \"react\";\nimport type { UseCalendarReturn } from \"../useCalendar\";\n\ninterface CalendarState<TDate extends DateFrameworkType>\n  extends UseCalendarReturn<TDate> {}\n\nconst CalendarContext = createContext<CalendarState<DateFrameworkType> | null>(\n  null,\n);\n\nif (process.env.NODE_ENV !== \"production\") {\n  CalendarContext.displayName = \"CalendarContext\";\n}\n\nfunction useCalendarContext<\n  TDate extends DateFrameworkType,\n>(): CalendarState<TDate> {\n  const context = useContext(\n    CalendarContext as React.Context<CalendarState<TDate> | null>,\n  );\n  if (!context) {\n    throw new Error(\n      \"useCalendarContext should be called inside CalendarContext.Provider\",\n    );\n  }\n\n  return context;\n}\n\nexport { CalendarContext, useCalendarContext };\n"],"names":[],"mappings":";;AAOA,MAAM,eAAkB,GAAA,aAAA;AAAA,EACtB;AACF;AAEA,IAAI,OAAA,CAAQ,GAAI,CAAA,QAAA,KAAa,YAAc,EAAA;AACzC,EAAA,eAAA,CAAgB,WAAc,GAAA,iBAAA;AAChC;AAEA,SAAS,kBAEiB,GAAA;AACxB,EAAA,MAAM,OAAU,GAAA,UAAA;AAAA,IACd;AAAA,GACF;AACA,EAAA,IAAI,CAAC,OAAS,EAAA;AACZ,IAAA,MAAM,IAAI,KAAA;AAAA,MACR;AAAA,KACF;AAAA;AAGF,EAAO,OAAA,OAAA;AACT;;;;"}
+{"version":3,"file":"CalendarContext.js","sources":["../src/calendar/internal/CalendarContext.tsx"],"sourcesContent":["import type { DateFrameworkType } from \"@salt-ds/date-adapters\";\nimport { createContext, useContext } from \"react\";\nimport type { UseCalendarReturn } from \"../useCalendar\";\n\ninterface CalendarState<TDate extends DateFrameworkType>\n  extends UseCalendarReturn<TDate> {}\n\nconst CalendarContext = createContext<CalendarState<DateFrameworkType> | null>(\n  null,\n);\n\nif (process.env.NODE_ENV !== \"production\") {\n  CalendarContext.displayName = \"CalendarContext\";\n}\n\nfunction useCalendarContext<\n  TDate extends DateFrameworkType,\n>(): CalendarState<TDate> {\n  const context = useContext(\n    CalendarContext as React.Context<CalendarState<TDate> | null>,\n  );\n  if (!context) {\n    throw new Error(\n      \"useCalendarContext should be called inside CalendarContext.Provider\",\n    );\n  }\n\n  return context;\n}\n\nexport { CalendarContext, useCalendarContext };\n"],"names":[],"mappings":";;AAOA,MAAM,eAAA,GAAkB,aAAA;AAAA,EACtB;AACF;AAEA,IAAI,OAAA,CAAQ,GAAA,CAAI,QAAA,KAAa,YAAA,EAAc;AACzC,EAAA,eAAA,CAAgB,WAAA,GAAc,iBAAA;AAChC;AAEA,SAAS,kBAAA,GAEiB;AACxB,EAAA,MAAM,OAAA,GAAU,UAAA;AAAA,IACd;AAAA,GACF;AACA,EAAA,IAAI,CAAC,OAAA,EAAS;AACZ,IAAA,MAAM,IAAI,KAAA;AAAA,MACR;AAAA,KACF;AAAA,EACF;AAEA,EAAA,OAAO,OAAA;AACT;;;;"}