@fluentui/react-calendar-compat 0.1.9 → 0.1.10

package/CHANGELOG.md

@@ -1,18 +1,32 @@
 # Change Log - @fluentui/react-calendar-compat
 
-This log was last generated on Thu, 23 May 2024 07:57:52 GMT and should not be manually modified.
+This log was last generated on Thu, 06 Jun 2024 15:22:12 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [0.1.10](https://github.com/microsoft/fluentui/tree/@fluentui/react-calendar-compat_v0.1.10)
+
+Thu, 06 Jun 2024 15:22:12 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-calendar-compat_v0.1.9..@fluentui/react-calendar-compat_v0.1.10)
+
+### Patches
+
+- feat(calendar-compat): changed design for the selected state ([PR #31509](https://github.com/microsoft/fluentui/pull/31509) by vkozlova@microsoft.com)
+- chore: ensure only state or defaultState is provided on useControllableState hook invocation ([PR #31461](https://github.com/microsoft/fluentui/pull/31461) by bernardo.sunderhus@gmail.com)
+- chore: Renaming useCalendarMonthStyles.ts to useCalendarMonthStyles.styles.ts. ([PR #31568](https://github.com/microsoft/fluentui/pull/31568) by Humberto.Morimoto@microsoft.com)
+- Bump @fluentui/react-jsx-runtime to v9.0.39 ([PR #31586](https://github.com/microsoft/fluentui/pull/31586) by beachball)
+- Bump @fluentui/react-tabster to v9.21.5 ([PR #31586](https://github.com/microsoft/fluentui/pull/31586) by beachball)
+- Bump @fluentui/react-utilities to v9.18.10 ([PR #31586](https://github.com/microsoft/fluentui/pull/31586) by beachball)
+
 ## [0.1.9](https://github.com/microsoft/fluentui/tree/@fluentui/react-calendar-compat_v0.1.9)
 
-Thu, 23 May 2024 07:57:52 GMT 
+Thu, 23 May 2024 08:02:41 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-calendar-compat_v0.1.8..@fluentui/react-calendar-compat_v0.1.9)
 
 ### Patches
 
 - chore: replace usage of .shorthands() in styles ([PR #31449](https://github.com/microsoft/fluentui/pull/31449) by olfedias@microsoft.com)
-- Bump @fluentui/react-tabster to v9.21.4 ([commit](https://github.com/microsoft/fluentui/commit/10e6758b203de79c53ce31ba264e137f83f50ff4) by beachball)
+- Bump @fluentui/react-tabster to v9.21.4 ([commit](https://github.com/microsoft/fluentui/commit/03599d609e8310b08c57d1f871cffbf717d79207) by beachball)
 
 ## [0.1.8](https://github.com/microsoft/fluentui/tree/@fluentui/react-calendar-compat_v0.1.8)
 

package/dist/index.d.ts

@@ -265,6 +265,10 @@ export declare interface CalendarDayGridStyles {
      * The style to apply to grid cells for days in the selected range
      */
     daySelected?: string;
+    /**
+     * The classname applied when a single day is selected
+     */
+    daySingleSelected?: string;
     /**
      * The style to apply to row around weeks
      */
@@ -305,6 +309,10 @@ export declare interface CalendarDayGridStyles {
      * The style applied to the marker on days to mark as important
      */
     dayMarker?: string;
+    /**
+     * The classname applied to the day "today" span
+     */
+    dayTodayMarker?: string;
 }
 
 export declare interface CalendarDayProps extends CalendarDayGridProps {
@@ -1068,8 +1076,10 @@ declare interface Day {
     isInMonth: boolean;
     /** Is current date is "today" date */
     isToday: boolean;
-    /** Is current date is selected */
+    /** Is current date is selected in range */
     isSelected: boolean;
+    /** Is current date is selected */
+    isSingleSelected: boolean;
     /** Is current date within restriction boundaries */
     isInBounds: boolean;
     /** Is current date marked */

package/lib/components/Calendar/Calendar.js

@@ -17,18 +17,13 @@ const defaultWorkWeekDays = [
 ];
 function useDateState(props) {
     const { value, today: todayProp, onSelectDate } = props;
-    const today = React.useMemo(()=>{
-        if (todayProp === undefined) {
-            return new Date();
-        }
-        return todayProp;
-    }, [
+    const today = React.useMemo(()=>todayProp !== null && todayProp !== void 0 ? todayProp : new Date(), [
         todayProp
     ]);
     /** The currently selected date in the calendar */ const [selectedDate, setSelectedDate] = useControllableState({
-        defaultState: today,
-        initialState: today,
-        state: value
+        state: value,
+        defaultState: value ? undefined : today,
+        initialState: today
     });
     /** The currently focused date in the day picker, but not necessarily selected */ const [navigatedDay = today, setNavigatedDay] = React.useState(value);
     /** The currently focused date in the month picker, but not necessarily selected */ const [navigatedMonth = today, setNavigatedMonth] = React.useState(value);
@@ -65,16 +60,8 @@ function useVisibilityState({ isDayPickerVisible: isDayPickerVisibleProp, isMont
         isDayPickerVisible: isDayPickerVisibleProp,
         showMonthPickerAsOverlay
     });
-    const [isMonthPickerVisible, setIsMonthPickerVisible] = useControllableState({
-        defaultState: false,
-        initialState: true,
-        state: showMonthPickerAsOverlayState ? undefined : isMonthPickerVisibleProp
-    });
-    /** State used to show/hide day picker */ const [isDayPickerVisible, setIsDayPickerVisible] = useControllableState({
-        defaultState: true,
-        initialState: true,
-        state: showMonthPickerAsOverlayState ? undefined : isDayPickerVisibleProp
-    });
+    const [isMonthPickerVisible, setIsMonthPickerVisible] = React.useState(()=>showMonthPickerAsOverlayState ? false : isMonthPickerVisibleProp !== null && isMonthPickerVisibleProp !== void 0 ? isMonthPickerVisibleProp : false);
+    /** State used to show/hide day picker */ const [isDayPickerVisible, setIsDayPickerVisible] = React.useState(()=>showMonthPickerAsOverlayState ? true : isDayPickerVisibleProp !== null && isDayPickerVisibleProp !== void 0 ? isDayPickerVisibleProp : true);
     const toggleDayMonthPickerVisibility = ()=>{
         setIsMonthPickerVisible(!isMonthPickerVisible);
         setIsDayPickerVisible(!isDayPickerVisible);

package/lib/components/Calendar/Calendar.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Calendar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Backspace, Enter, Escape, PageDown, PageUp, Space } from '@fluentui/keyboard-keys';\nimport { useControllableState } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n  addMonths,\n  addYears,\n  DateRangeType,\n  DayOfWeek,\n  DEFAULT_CALENDAR_STRINGS,\n  DEFAULT_DATE_FORMATTING,\n  FirstWeekOfYear,\n  focusAsync,\n} from '../../utils';\nimport { CalendarDay } from '../CalendarDay/CalendarDay';\nimport { CalendarMonth } from '../CalendarMonth/CalendarMonth';\nimport { defaultNavigationIcons } from './calendarNavigationIcons';\nimport { useCalendarStyles_unstable } from './useCalendarStyles.styles';\nimport type { ICalendarDay } from '../CalendarDay/CalendarDay.types';\nimport type { ICalendarMonth } from '../CalendarMonth/CalendarMonth.types';\nimport type { CalendarProps } from './Calendar.types';\n\nconst MIN_SIZE_FORCE_OVERLAY = 440;\n\nconst defaultWorkWeekDays: DayOfWeek[] = [\n  DayOfWeek.Monday,\n  DayOfWeek.Tuesday,\n  DayOfWeek.Wednesday,\n  DayOfWeek.Thursday,\n  DayOfWeek.Friday,\n];\n\nfunction useDateState(props: CalendarProps) {\n  const { value, today: todayProp, onSelectDate } = props;\n\n  const today = React.useMemo(() => {\n    if (todayProp === undefined) {\n      return new Date();\n    }\n    return todayProp;\n  }, [todayProp]);\n\n  /** The currently selected date in the calendar */\n  const [selectedDate, setSelectedDate] = useControllableState({\n    defaultState: today,\n    initialState: today,\n    state: value,\n  });\n\n  /** The currently focused date in the day picker, but not necessarily selected */\n  const [navigatedDay = today, setNavigatedDay] = React.useState(value);\n\n  /** The currently focused date in the month picker, but not necessarily selected */\n  const [navigatedMonth = today, setNavigatedMonth] = React.useState(value);\n\n  /** If using a controlled value, when that value changes, navigate to that date */\n  const [lastSelectedDate = today, setLastSelectedDate] = React.useState(value);\n  if (value && lastSelectedDate.valueOf() !== value.valueOf()) {\n    setNavigatedDay(value);\n    setNavigatedMonth(value);\n    setLastSelectedDate(value);\n  }\n\n  const navigateMonth = (date: Date) => {\n    setNavigatedMonth(date);\n  };\n\n  const navigateDay = (date: Date) => {\n    setNavigatedMonth(date);\n    setNavigatedDay(date);\n  };\n\n  const onDateSelected = (date: Date, selectedDateRangeArray?: Date[]) => {\n    setNavigatedMonth(date);\n    setNavigatedDay(date);\n    setSelectedDate(date);\n    onSelectDate?.(date, selectedDateRangeArray);\n  };\n\n  return [selectedDate, navigatedDay, navigatedMonth, onDateSelected, navigateDay, navigateMonth] as const;\n}\n\nfunction useVisibilityState({\n  isDayPickerVisible: isDayPickerVisibleProp,\n  isMonthPickerVisible: isMonthPickerVisibleProp,\n  showMonthPickerAsOverlay,\n}: CalendarProps) {\n  /** State used to show/hide month picker */\n  const showMonthPickerAsOverlayState = useShowMonthPickerAsOverlay({\n    isDayPickerVisible: isDayPickerVisibleProp,\n    showMonthPickerAsOverlay,\n  });\n\n  const [isMonthPickerVisible, setIsMonthPickerVisible] = useControllableState({\n    defaultState: false,\n    initialState: true,\n    state: showMonthPickerAsOverlayState ? undefined : isMonthPickerVisibleProp,\n  });\n  /** State used to show/hide day picker */\n  const [isDayPickerVisible, setIsDayPickerVisible] = useControllableState({\n    defaultState: true,\n    initialState: true,\n    state: showMonthPickerAsOverlayState ? undefined : isDayPickerVisibleProp,\n  });\n\n  const toggleDayMonthPickerVisibility = () => {\n    setIsMonthPickerVisible(!isMonthPickerVisible);\n    setIsDayPickerVisible(!isDayPickerVisible);\n  };\n\n  return [isMonthPickerVisible, isDayPickerVisible, toggleDayMonthPickerVisibility] as const;\n}\n\nfunction useFocusLogic({ componentRef }: CalendarProps, isDayPickerVisible: boolean, isMonthPickerVisible: boolean) {\n  const dayPicker = React.useRef<ICalendarDay>(null);\n  const monthPicker = React.useRef<ICalendarMonth>(null);\n  const focusOnUpdate = React.useRef(false);\n  const { targetDocument } = useFluent();\n  const win = targetDocument?.defaultView;\n\n  const focus = React.useCallback(() => {\n    if (isDayPickerVisible && dayPicker.current) {\n      focusAsync(dayPicker.current, win);\n    } else if (isMonthPickerVisible && monthPicker.current) {\n      focusAsync(monthPicker.current, win);\n    }\n  }, [isDayPickerVisible, isMonthPickerVisible, win]);\n\n  React.useImperativeHandle(componentRef, () => ({ focus }), [focus]);\n\n  React.useEffect(() => {\n    if (focusOnUpdate.current) {\n      focus();\n      focusOnUpdate.current = false;\n    }\n  });\n\n  const focusOnNextUpdate = () => {\n    focusOnUpdate.current = true;\n  };\n\n  return [dayPicker, monthPicker, focusOnNextUpdate] as const;\n}\n\n/**\n * @internal\n */\nexport const Calendar: React.FunctionComponent<CalendarProps> = React.forwardRef<HTMLDivElement, CalendarProps>(\n  (props, forwardedRef) => {\n    const {\n      allFocusable = false,\n      calendarDayProps,\n      calendarMonthProps,\n      className,\n      componentRef,\n      dateRangeType = DateRangeType.Day,\n      dateTimeFormatter = DEFAULT_DATE_FORMATTING,\n      firstDayOfWeek = DayOfWeek.Sunday,\n      firstWeekOfYear = FirstWeekOfYear.FirstDay,\n      highlightCurrentMonth = false,\n      highlightSelectedMonth = false,\n      id,\n      isDayPickerVisible: isDayPickerVisibleProp = true,\n      isMonthPickerVisible: isMonthPickerVisibleProp = true,\n      maxDate,\n      minDate,\n      onDismiss,\n      onSelectDate,\n      restrictedDates,\n      showCloseButton = false,\n      showGoToToday = true,\n      showMonthPickerAsOverlay: showMonthPickerAsOverlayProp = false,\n      showSixWeeksByDefault = false,\n      showWeekNumbers = false,\n      strings = DEFAULT_CALENDAR_STRINGS,\n      today: todayProp,\n      value,\n      workWeekDays = defaultWorkWeekDays,\n    } = props;\n\n    const today = React.useMemo(() => {\n      return todayProp ?? new Date();\n    }, [todayProp]);\n\n    const [selectedDate, navigatedDay, navigatedMonth, onDateSelected, navigateDay, navigateMonth] = useDateState({\n      onSelectDate,\n      value,\n      today,\n    });\n    const [isMonthPickerVisible, isDayPickerVisible, toggleDayMonthPickerVisibility] = useVisibilityState({\n      isDayPickerVisible: isDayPickerVisibleProp,\n      isMonthPickerVisible: isMonthPickerVisibleProp,\n      showMonthPickerAsOverlay: showMonthPickerAsOverlayProp,\n    });\n    const [dayPicker, monthPicker, focusOnNextUpdate] = useFocusLogic(\n      { componentRef },\n      isDayPickerVisible,\n      isMonthPickerVisible,\n    );\n\n    const renderGoToTodayButton = () => {\n      let goTodayEnabled = showGoToToday;\n\n      if (goTodayEnabled && today) {\n        goTodayEnabled =\n          navigatedDay.getFullYear() !== today.getFullYear() ||\n          navigatedDay.getMonth() !== today.getMonth() ||\n          navigatedMonth.getFullYear() !== today.getFullYear() ||\n          navigatedMonth.getMonth() !== today.getMonth();\n      }\n\n      return (\n        showGoToToday && (\n          <button\n            className={classes.goTodayButton}\n            onClick={onGotoToday}\n            onKeyDown={onButtonKeyDown(onGotoToday)}\n            type=\"button\"\n            disabled={!goTodayEnabled}\n          >\n            {strings!.goToToday}\n          </button>\n        )\n      );\n    };\n\n    const onNavigateDayDate = (date: Date, focusOnNavigatedDay: boolean): void => {\n      navigateDay(date);\n      if (focusOnNavigatedDay) {\n        focusOnNextUpdate();\n      }\n    };\n\n    const onNavigateMonthDate = (date: Date, focusOnNavigatedDay: boolean): void => {\n      if (focusOnNavigatedDay) {\n        focusOnNextUpdate();\n      }\n\n      if (!focusOnNavigatedDay) {\n        navigateMonth(date);\n        return;\n      }\n\n      if (monthPickerOnly) {\n        onDateSelected(date);\n      }\n\n      navigateDay(date);\n    };\n\n    const showMonthPickerAsOverlay = useShowMonthPickerAsOverlay({\n      isDayPickerVisible: isDayPickerVisibleProp,\n      showMonthPickerAsOverlay: showMonthPickerAsOverlayProp,\n    });\n\n    const onHeaderSelect = showMonthPickerAsOverlay\n      ? (): void => {\n          toggleDayMonthPickerVisibility();\n\n          focusOnNextUpdate();\n        }\n      : undefined;\n\n    const onGotoToday = (): void => {\n      navigateDay(today!);\n      if (showMonthPickerAsOverlay && isMonthPickerVisible) {\n        toggleDayMonthPickerVisibility();\n      }\n      focusOnNextUpdate();\n    };\n\n    const onButtonKeyDown = (callback: () => void): ((ev: React.KeyboardEvent<HTMLButtonElement>) => void) => {\n      return (ev: React.KeyboardEvent<HTMLButtonElement>) => {\n        switch (ev.key) {\n          case Enter:\n          case Space:\n            callback();\n            break;\n        }\n      };\n    };\n\n    const onDatePickerPopupKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {\n      switch (ev.key) {\n        case Enter:\n          ev.preventDefault();\n          break;\n\n        case Backspace:\n          ev.preventDefault();\n          break;\n\n        case Escape:\n          ev.stopPropagation();\n          onDismiss?.();\n          break;\n\n        case PageUp:\n          if (ev.ctrlKey) {\n            // go to next year\n            navigateDay(addYears(navigatedDay, 1));\n          } else {\n            // go to next month\n            navigateDay(addMonths(navigatedDay, 1));\n          }\n          ev.preventDefault();\n          break;\n        case PageDown:\n          if (ev.ctrlKey) {\n            // go to previous year\n            navigateDay(addYears(navigatedDay, -1));\n          } else {\n            // go to previous month\n            navigateDay(addMonths(navigatedDay, -1));\n          }\n          ev.preventDefault();\n          break;\n        default:\n          break;\n      }\n    };\n\n    const monthPickerOnly = !showMonthPickerAsOverlay && !isDayPickerVisible;\n\n    const classes = useCalendarStyles_unstable({\n      className,\n      isDayPickerVisible,\n      isMonthPickerVisible,\n      showWeekNumbers,\n    });\n\n    let todayDateString: string = '';\n    let selectedDateString: string = '';\n    if (dateTimeFormatter && strings!.todayDateFormatString) {\n      todayDateString = strings!.todayDateFormatString.replace(\n        '{0}',\n        dateTimeFormatter.formatMonthDayYear(today, strings!),\n      );\n    }\n    if (dateTimeFormatter && strings!.selectedDateFormatString) {\n      const dateStringFormatter = monthPickerOnly\n        ? dateTimeFormatter.formatMonthYear\n        : dateTimeFormatter.formatMonthDayYear;\n      selectedDateString = strings!.selectedDateFormatString.replace(\n        '{0}',\n        dateStringFormatter(selectedDate, strings!),\n      );\n    }\n    const selectionAndTodayString = selectedDateString + ', ' + todayDateString;\n\n    return (\n      <div\n        id={id}\n        ref={forwardedRef}\n        role=\"group\"\n        aria-label={selectionAndTodayString}\n        className={classes.root}\n        onKeyDown={onDatePickerPopupKeyDown}\n      >\n        <div className={classes.liveRegion} aria-live=\"polite\" aria-atomic=\"true\">\n          <span>{selectedDateString}</span>\n        </div>\n        {isDayPickerVisible && (\n          <CalendarDay\n            selectedDate={selectedDate!}\n            navigatedDate={navigatedDay!}\n            today={today}\n            onSelectDate={onDateSelected}\n            // eslint-disable-next-line react/jsx-no-bind\n            onNavigateDate={onNavigateDayDate}\n            onDismiss={onDismiss}\n            firstDayOfWeek={firstDayOfWeek!}\n            dateRangeType={dateRangeType!}\n            strings={strings!}\n            // eslint-disable-next-line react/jsx-no-bind\n            onHeaderSelect={onHeaderSelect}\n            showWeekNumbers={showWeekNumbers}\n            firstWeekOfYear={firstWeekOfYear!}\n            dateTimeFormatter={dateTimeFormatter!}\n            showSixWeeksByDefault={showSixWeeksByDefault}\n            minDate={minDate}\n            maxDate={maxDate}\n            navigationIcons={defaultNavigationIcons}\n            restrictedDates={restrictedDates}\n            workWeekDays={workWeekDays}\n            componentRef={dayPicker}\n            showCloseButton={showCloseButton}\n            allFocusable={allFocusable}\n            {...calendarDayProps} // at end of list so consumer's custom functions take precedence\n          />\n        )}\n        {isDayPickerVisible && isMonthPickerVisible && <div className={classes.divider} />}\n        {isMonthPickerVisible ? (\n          <div className={classes.monthPickerWrapper}>\n            <CalendarMonth\n              navigatedDate={navigatedMonth}\n              selectedDate={navigatedDay}\n              strings={strings!}\n              // eslint-disable-next-line react/jsx-no-bind\n              onNavigateDate={onNavigateMonthDate}\n              today={today}\n              highlightCurrentMonth={highlightCurrentMonth!}\n              highlightSelectedMonth={highlightSelectedMonth!}\n              // eslint-disable-next-line react/jsx-no-bind\n              onHeaderSelect={onHeaderSelect}\n              dateTimeFormatter={dateTimeFormatter!}\n              minDate={minDate}\n              maxDate={maxDate}\n              componentRef={monthPicker}\n              navigationIcons={defaultNavigationIcons}\n              {...calendarMonthProps} // at end of list so consumer's custom functions take precedence\n            />\n            {renderGoToTodayButton()}\n          </div>\n        ) : (\n          renderGoToTodayButton()\n        )}\n      </div>\n    );\n  },\n);\nCalendar.displayName = 'Calendar';\n\nconst useShowMonthPickerAsOverlay = ({ isDayPickerVisible, showMonthPickerAsOverlay }: CalendarProps) => {\n  const { targetDocument } = useFluent();\n  const win = targetDocument?.defaultView;\n  return showMonthPickerAsOverlay || (isDayPickerVisible && win && win.innerWidth <= MIN_SIZE_FORCE_OVERLAY);\n};\n"],"names":["React","Backspace","Enter","Escape","PageDown","PageUp","Space","useControllableState","useFluent_unstable","useFluent","addMonths","addYears","DateRangeType","DayOfWeek","DEFAULT_CALENDAR_STRINGS","DEFAULT_DATE_FORMATTING","FirstWeekOfYear","focusAsync","CalendarDay","CalendarMonth","defaultNavigationIcons","useCalendarStyles_unstable","MIN_SIZE_FORCE_OVERLAY","defaultWorkWeekDays","Monday","Tuesday","Wednesday","Thursday","Friday","useDateState","props","value","today","todayProp","onSelectDate","useMemo","undefined","Date","selectedDate","setSelectedDate","defaultState","initialState","state","navigatedDay","setNavigatedDay","useState","navigatedMonth","setNavigatedMonth","lastSelectedDate","setLastSelectedDate","valueOf","navigateMonth","date","navigateDay","onDateSelected","selectedDateRangeArray","useVisibilityState","isDayPickerVisible","isDayPickerVisibleProp","isMonthPickerVisible","isMonthPickerVisibleProp","showMonthPickerAsOverlay","showMonthPickerAsOverlayState","useShowMonthPickerAsOverlay","setIsMonthPickerVisible","setIsDayPickerVisible","toggleDayMonthPickerVisibility","useFocusLogic","componentRef","dayPicker","useRef","monthPicker","focusOnUpdate","targetDocument","win","defaultView","focus","useCallback","current","useImperativeHandle","useEffect","focusOnNextUpdate","Calendar","forwardRef","forwardedRef","allFocusable","calendarDayProps","calendarMonthProps","className","dateRangeType","Day","dateTimeFormatter","firstDayOfWeek","Sunday","firstWeekOfYear","FirstDay","highlightCurrentMonth","highlightSelectedMonth","id","maxDate","minDate","onDismiss","restrictedDates","showCloseButton","showGoToToday","showMonthPickerAsOverlayProp","showSixWeeksByDefault","showWeekNumbers","strings","workWeekDays","renderGoToTodayButton","goTodayEnabled","getFullYear","getMonth","button","classes","goTodayButton","onClick","onGotoToday","onKeyDown","onButtonKeyDown","type","disabled","goToToday","onNavigateDayDate","focusOnNavigatedDay","onNavigateMonthDate","monthPickerOnly","onHeaderSelect","callback","ev","key","onDatePickerPopupKeyDown","preventDefault","stopPropagation","ctrlKey","todayDateString","selectedDateString","todayDateFormatString","replace","formatMonthDayYear","selectedDateFormatString","dateStringFormatter","formatMonthYear","selectionAndTodayString","div","ref","role","aria-label","root","liveRegion","aria-live","aria-atomic","span","navigatedDate","onNavigateDate","navigationIcons","divider","monthPickerWrapper","displayName","innerWidth"],"mappings":"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"}
+{"version":3,"sources":["Calendar.tsx"],"sourcesContent":["import * as React from 'react';\nimport { Backspace, Enter, Escape, PageDown, PageUp, Space } from '@fluentui/keyboard-keys';\nimport { useControllableState } from '@fluentui/react-utilities';\nimport { useFluent_unstable as useFluent } from '@fluentui/react-shared-contexts';\nimport {\n  addMonths,\n  addYears,\n  DateRangeType,\n  DayOfWeek,\n  DEFAULT_CALENDAR_STRINGS,\n  DEFAULT_DATE_FORMATTING,\n  FirstWeekOfYear,\n  focusAsync,\n} from '../../utils';\nimport { CalendarDay } from '../CalendarDay/CalendarDay';\nimport { CalendarMonth } from '../CalendarMonth/CalendarMonth';\nimport { defaultNavigationIcons } from './calendarNavigationIcons';\nimport { useCalendarStyles_unstable } from './useCalendarStyles.styles';\nimport type { ICalendarDay } from '../CalendarDay/CalendarDay.types';\nimport type { ICalendarMonth } from '../CalendarMonth/CalendarMonth.types';\nimport type { CalendarProps } from './Calendar.types';\n\nconst MIN_SIZE_FORCE_OVERLAY = 440;\n\nconst defaultWorkWeekDays: DayOfWeek[] = [\n  DayOfWeek.Monday,\n  DayOfWeek.Tuesday,\n  DayOfWeek.Wednesday,\n  DayOfWeek.Thursday,\n  DayOfWeek.Friday,\n];\n\nfunction useDateState(props: CalendarProps) {\n  const { value, today: todayProp, onSelectDate } = props;\n\n  const today = React.useMemo(() => todayProp ?? new Date(), [todayProp]);\n\n  /** The currently selected date in the calendar */\n  const [selectedDate, setSelectedDate] = useControllableState({\n    state: value,\n    defaultState: value ? undefined : today,\n    initialState: today,\n  });\n\n  /** The currently focused date in the day picker, but not necessarily selected */\n  const [navigatedDay = today, setNavigatedDay] = React.useState(value);\n\n  /** The currently focused date in the month picker, but not necessarily selected */\n  const [navigatedMonth = today, setNavigatedMonth] = React.useState(value);\n\n  /** If using a controlled value, when that value changes, navigate to that date */\n  const [lastSelectedDate = today, setLastSelectedDate] = React.useState(value);\n  if (value && lastSelectedDate.valueOf() !== value.valueOf()) {\n    setNavigatedDay(value);\n    setNavigatedMonth(value);\n    setLastSelectedDate(value);\n  }\n\n  const navigateMonth = (date: Date) => {\n    setNavigatedMonth(date);\n  };\n\n  const navigateDay = (date: Date) => {\n    setNavigatedMonth(date);\n    setNavigatedDay(date);\n  };\n\n  const onDateSelected = (date: Date, selectedDateRangeArray?: Date[]) => {\n    setNavigatedMonth(date);\n    setNavigatedDay(date);\n    setSelectedDate(date);\n    onSelectDate?.(date, selectedDateRangeArray);\n  };\n\n  return [selectedDate, navigatedDay, navigatedMonth, onDateSelected, navigateDay, navigateMonth] as const;\n}\n\nfunction useVisibilityState({\n  isDayPickerVisible: isDayPickerVisibleProp,\n  isMonthPickerVisible: isMonthPickerVisibleProp,\n  showMonthPickerAsOverlay,\n}: CalendarProps) {\n  /** State used to show/hide month picker */\n  const showMonthPickerAsOverlayState = useShowMonthPickerAsOverlay({\n    isDayPickerVisible: isDayPickerVisibleProp,\n    showMonthPickerAsOverlay,\n  });\n\n  const [isMonthPickerVisible, setIsMonthPickerVisible] = React.useState(() =>\n    showMonthPickerAsOverlayState ? false : isMonthPickerVisibleProp ?? false,\n  );\n  /** State used to show/hide day picker */\n  const [isDayPickerVisible, setIsDayPickerVisible] = React.useState(() =>\n    showMonthPickerAsOverlayState ? true : isDayPickerVisibleProp ?? true,\n  );\n\n  const toggleDayMonthPickerVisibility = () => {\n    setIsMonthPickerVisible(!isMonthPickerVisible);\n    setIsDayPickerVisible(!isDayPickerVisible);\n  };\n\n  return [isMonthPickerVisible, isDayPickerVisible, toggleDayMonthPickerVisibility] as const;\n}\n\nfunction useFocusLogic({ componentRef }: CalendarProps, isDayPickerVisible: boolean, isMonthPickerVisible: boolean) {\n  const dayPicker = React.useRef<ICalendarDay>(null);\n  const monthPicker = React.useRef<ICalendarMonth>(null);\n  const focusOnUpdate = React.useRef(false);\n  const { targetDocument } = useFluent();\n  const win = targetDocument?.defaultView;\n\n  const focus = React.useCallback(() => {\n    if (isDayPickerVisible && dayPicker.current) {\n      focusAsync(dayPicker.current, win);\n    } else if (isMonthPickerVisible && monthPicker.current) {\n      focusAsync(monthPicker.current, win);\n    }\n  }, [isDayPickerVisible, isMonthPickerVisible, win]);\n\n  React.useImperativeHandle(componentRef, () => ({ focus }), [focus]);\n\n  React.useEffect(() => {\n    if (focusOnUpdate.current) {\n      focus();\n      focusOnUpdate.current = false;\n    }\n  });\n\n  const focusOnNextUpdate = () => {\n    focusOnUpdate.current = true;\n  };\n\n  return [dayPicker, monthPicker, focusOnNextUpdate] as const;\n}\n\n/**\n * @internal\n */\nexport const Calendar: React.FunctionComponent<CalendarProps> = React.forwardRef<HTMLDivElement, CalendarProps>(\n  (props, forwardedRef) => {\n    const {\n      allFocusable = false,\n      calendarDayProps,\n      calendarMonthProps,\n      className,\n      componentRef,\n      dateRangeType = DateRangeType.Day,\n      dateTimeFormatter = DEFAULT_DATE_FORMATTING,\n      firstDayOfWeek = DayOfWeek.Sunday,\n      firstWeekOfYear = FirstWeekOfYear.FirstDay,\n      highlightCurrentMonth = false,\n      highlightSelectedMonth = false,\n      id,\n      isDayPickerVisible: isDayPickerVisibleProp = true,\n      isMonthPickerVisible: isMonthPickerVisibleProp = true,\n      maxDate,\n      minDate,\n      onDismiss,\n      onSelectDate,\n      restrictedDates,\n      showCloseButton = false,\n      showGoToToday = true,\n      showMonthPickerAsOverlay: showMonthPickerAsOverlayProp = false,\n      showSixWeeksByDefault = false,\n      showWeekNumbers = false,\n      strings = DEFAULT_CALENDAR_STRINGS,\n      today: todayProp,\n      value,\n      workWeekDays = defaultWorkWeekDays,\n    } = props;\n\n    const today = React.useMemo(() => {\n      return todayProp ?? new Date();\n    }, [todayProp]);\n\n    const [selectedDate, navigatedDay, navigatedMonth, onDateSelected, navigateDay, navigateMonth] = useDateState({\n      onSelectDate,\n      value,\n      today,\n    });\n    const [isMonthPickerVisible, isDayPickerVisible, toggleDayMonthPickerVisibility] = useVisibilityState({\n      isDayPickerVisible: isDayPickerVisibleProp,\n      isMonthPickerVisible: isMonthPickerVisibleProp,\n      showMonthPickerAsOverlay: showMonthPickerAsOverlayProp,\n    });\n    const [dayPicker, monthPicker, focusOnNextUpdate] = useFocusLogic(\n      { componentRef },\n      isDayPickerVisible,\n      isMonthPickerVisible,\n    );\n\n    const renderGoToTodayButton = () => {\n      let goTodayEnabled = showGoToToday;\n\n      if (goTodayEnabled && today) {\n        goTodayEnabled =\n          navigatedDay.getFullYear() !== today.getFullYear() ||\n          navigatedDay.getMonth() !== today.getMonth() ||\n          navigatedMonth.getFullYear() !== today.getFullYear() ||\n          navigatedMonth.getMonth() !== today.getMonth();\n      }\n\n      return (\n        showGoToToday && (\n          <button\n            className={classes.goTodayButton}\n            onClick={onGotoToday}\n            onKeyDown={onButtonKeyDown(onGotoToday)}\n            type=\"button\"\n            disabled={!goTodayEnabled}\n          >\n            {strings!.goToToday}\n          </button>\n        )\n      );\n    };\n\n    const onNavigateDayDate = (date: Date, focusOnNavigatedDay: boolean): void => {\n      navigateDay(date);\n      if (focusOnNavigatedDay) {\n        focusOnNextUpdate();\n      }\n    };\n\n    const onNavigateMonthDate = (date: Date, focusOnNavigatedDay: boolean): void => {\n      if (focusOnNavigatedDay) {\n        focusOnNextUpdate();\n      }\n\n      if (!focusOnNavigatedDay) {\n        navigateMonth(date);\n        return;\n      }\n\n      if (monthPickerOnly) {\n        onDateSelected(date);\n      }\n\n      navigateDay(date);\n    };\n\n    const showMonthPickerAsOverlay = useShowMonthPickerAsOverlay({\n      isDayPickerVisible: isDayPickerVisibleProp,\n      showMonthPickerAsOverlay: showMonthPickerAsOverlayProp,\n    });\n\n    const onHeaderSelect = showMonthPickerAsOverlay\n      ? (): void => {\n          toggleDayMonthPickerVisibility();\n\n          focusOnNextUpdate();\n        }\n      : undefined;\n\n    const onGotoToday = (): void => {\n      navigateDay(today!);\n      if (showMonthPickerAsOverlay && isMonthPickerVisible) {\n        toggleDayMonthPickerVisibility();\n      }\n      focusOnNextUpdate();\n    };\n\n    const onButtonKeyDown = (callback: () => void): ((ev: React.KeyboardEvent<HTMLButtonElement>) => void) => {\n      return (ev: React.KeyboardEvent<HTMLButtonElement>) => {\n        switch (ev.key) {\n          case Enter:\n          case Space:\n            callback();\n            break;\n        }\n      };\n    };\n\n    const onDatePickerPopupKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {\n      switch (ev.key) {\n        case Enter:\n          ev.preventDefault();\n          break;\n\n        case Backspace:\n          ev.preventDefault();\n          break;\n\n        case Escape:\n          ev.stopPropagation();\n          onDismiss?.();\n          break;\n\n        case PageUp:\n          if (ev.ctrlKey) {\n            // go to next year\n            navigateDay(addYears(navigatedDay, 1));\n          } else {\n            // go to next month\n            navigateDay(addMonths(navigatedDay, 1));\n          }\n          ev.preventDefault();\n          break;\n        case PageDown:\n          if (ev.ctrlKey) {\n            // go to previous year\n            navigateDay(addYears(navigatedDay, -1));\n          } else {\n            // go to previous month\n            navigateDay(addMonths(navigatedDay, -1));\n          }\n          ev.preventDefault();\n          break;\n        default:\n          break;\n      }\n    };\n\n    const monthPickerOnly = !showMonthPickerAsOverlay && !isDayPickerVisible;\n\n    const classes = useCalendarStyles_unstable({\n      className,\n      isDayPickerVisible,\n      isMonthPickerVisible,\n      showWeekNumbers,\n    });\n\n    let todayDateString: string = '';\n    let selectedDateString: string = '';\n    if (dateTimeFormatter && strings!.todayDateFormatString) {\n      todayDateString = strings!.todayDateFormatString.replace(\n        '{0}',\n        dateTimeFormatter.formatMonthDayYear(today, strings!),\n      );\n    }\n    if (dateTimeFormatter && strings!.selectedDateFormatString) {\n      const dateStringFormatter = monthPickerOnly\n        ? dateTimeFormatter.formatMonthYear\n        : dateTimeFormatter.formatMonthDayYear;\n      selectedDateString = strings!.selectedDateFormatString.replace(\n        '{0}',\n        dateStringFormatter(selectedDate, strings!),\n      );\n    }\n    const selectionAndTodayString = selectedDateString + ', ' + todayDateString;\n\n    return (\n      <div\n        id={id}\n        ref={forwardedRef}\n        role=\"group\"\n        aria-label={selectionAndTodayString}\n        className={classes.root}\n        onKeyDown={onDatePickerPopupKeyDown}\n      >\n        <div className={classes.liveRegion} aria-live=\"polite\" aria-atomic=\"true\">\n          <span>{selectedDateString}</span>\n        </div>\n        {isDayPickerVisible && (\n          <CalendarDay\n            selectedDate={selectedDate!}\n            navigatedDate={navigatedDay!}\n            today={today}\n            onSelectDate={onDateSelected}\n            // eslint-disable-next-line react/jsx-no-bind\n            onNavigateDate={onNavigateDayDate}\n            onDismiss={onDismiss}\n            firstDayOfWeek={firstDayOfWeek!}\n            dateRangeType={dateRangeType!}\n            strings={strings!}\n            // eslint-disable-next-line react/jsx-no-bind\n            onHeaderSelect={onHeaderSelect}\n            showWeekNumbers={showWeekNumbers}\n            firstWeekOfYear={firstWeekOfYear!}\n            dateTimeFormatter={dateTimeFormatter!}\n            showSixWeeksByDefault={showSixWeeksByDefault}\n            minDate={minDate}\n            maxDate={maxDate}\n            navigationIcons={defaultNavigationIcons}\n            restrictedDates={restrictedDates}\n            workWeekDays={workWeekDays}\n            componentRef={dayPicker}\n            showCloseButton={showCloseButton}\n            allFocusable={allFocusable}\n            {...calendarDayProps} // at end of list so consumer's custom functions take precedence\n          />\n        )}\n        {isDayPickerVisible && isMonthPickerVisible && <div className={classes.divider} />}\n        {isMonthPickerVisible ? (\n          <div className={classes.monthPickerWrapper}>\n            <CalendarMonth\n              navigatedDate={navigatedMonth}\n              selectedDate={navigatedDay}\n              strings={strings!}\n              // eslint-disable-next-line react/jsx-no-bind\n              onNavigateDate={onNavigateMonthDate}\n              today={today}\n              highlightCurrentMonth={highlightCurrentMonth!}\n              highlightSelectedMonth={highlightSelectedMonth!}\n              // eslint-disable-next-line react/jsx-no-bind\n              onHeaderSelect={onHeaderSelect}\n              dateTimeFormatter={dateTimeFormatter!}\n              minDate={minDate}\n              maxDate={maxDate}\n              componentRef={monthPicker}\n              navigationIcons={defaultNavigationIcons}\n              {...calendarMonthProps} // at end of list so consumer's custom functions take precedence\n            />\n            {renderGoToTodayButton()}\n          </div>\n        ) : (\n          renderGoToTodayButton()\n        )}\n      </div>\n    );\n  },\n);\nCalendar.displayName = 'Calendar';\n\nconst useShowMonthPickerAsOverlay = ({ isDayPickerVisible, showMonthPickerAsOverlay }: CalendarProps) => {\n  const { targetDocument } = useFluent();\n  const win = targetDocument?.defaultView;\n  return showMonthPickerAsOverlay || (isDayPickerVisible && win && win.innerWidth <= MIN_SIZE_FORCE_OVERLAY);\n};\n"],"names":["React","Backspace","Enter","Escape","PageDown","PageUp","Space","useControllableState","useFluent_unstable","useFluent","addMonths","addYears","DateRangeType","DayOfWeek","DEFAULT_CALENDAR_STRINGS","DEFAULT_DATE_FORMATTING","FirstWeekOfYear","focusAsync","CalendarDay","CalendarMonth","defaultNavigationIcons","useCalendarStyles_unstable","MIN_SIZE_FORCE_OVERLAY","defaultWorkWeekDays","Monday","Tuesday","Wednesday","Thursday","Friday","useDateState","props","value","today","todayProp","onSelectDate","useMemo","Date","selectedDate","setSelectedDate","state","defaultState","undefined","initialState","navigatedDay","setNavigatedDay","useState","navigatedMonth","setNavigatedMonth","lastSelectedDate","setLastSelectedDate","valueOf","navigateMonth","date","navigateDay","onDateSelected","selectedDateRangeArray","useVisibilityState","isDayPickerVisible","isDayPickerVisibleProp","isMonthPickerVisible","isMonthPickerVisibleProp","showMonthPickerAsOverlay","showMonthPickerAsOverlayState","useShowMonthPickerAsOverlay","setIsMonthPickerVisible","setIsDayPickerVisible","toggleDayMonthPickerVisibility","useFocusLogic","componentRef","dayPicker","useRef","monthPicker","focusOnUpdate","targetDocument","win","defaultView","focus","useCallback","current","useImperativeHandle","useEffect","focusOnNextUpdate","Calendar","forwardRef","forwardedRef","allFocusable","calendarDayProps","calendarMonthProps","className","dateRangeType","Day","dateTimeFormatter","firstDayOfWeek","Sunday","firstWeekOfYear","FirstDay","highlightCurrentMonth","highlightSelectedMonth","id","maxDate","minDate","onDismiss","restrictedDates","showCloseButton","showGoToToday","showMonthPickerAsOverlayProp","showSixWeeksByDefault","showWeekNumbers","strings","workWeekDays","renderGoToTodayButton","goTodayEnabled","getFullYear","getMonth","button","classes","goTodayButton","onClick","onGotoToday","onKeyDown","onButtonKeyDown","type","disabled","goToToday","onNavigateDayDate","focusOnNavigatedDay","onNavigateMonthDate","monthPickerOnly","onHeaderSelect","callback","ev","key","onDatePickerPopupKeyDown","preventDefault","stopPropagation","ctrlKey","todayDateString","selectedDateString","todayDateFormatString","replace","formatMonthDayYear","selectedDateFormatString","dateStringFormatter","formatMonthYear","selectionAndTodayString","div","ref","role","aria-label","root","liveRegion","aria-live","aria-atomic","span","navigatedDate","onNavigateDate","navigationIcons","divider","monthPickerWrapper","displayName","innerWidth"],"mappings":"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"}

package/lib/components/CalendarDay/useCalendarDayStyles.styles.js

@@ -71,7 +71,7 @@ const useMonthAndYearStyles = /*#__PURE__*/__styles({
     Bbmb7ep: 0,
     Btl43ni: 0,
     B7oj6ja: 0,
-    Dimara: "fl4tsp0",
+    Dimara: "ft85np5",
     sj55zd: "f19n0e5",
     mc9l5x: "f14t3ns0",
     Bh6795r: "fqerorx",
@@ -114,7 +114,7 @@ const useMonthAndYearStyles = /*#__PURE__*/__styles({
     E5hylx: "fy2scak"
   }
 }, {
-  d: [".f122n59{align-items:center;}", ".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".f1ern45e{border-top-style:none;}", ".f1n71otn{border-right-style:none;}", ".f1deefiw{border-left-style:none;}", ".f1h8hb77{border-bottom-style:none;}", [".fl4tsp0{border-radius:2px;}", {
+  d: [".f122n59{align-items:center;}", ".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".f1ern45e{border-top-style:none;}", ".f1n71otn{border-right-style:none;}", ".f1deefiw{border-left-style:none;}", ".f1h8hb77{border-bottom-style:none;}", [".ft85np5{border-radius:var(--borderRadiusMedium);}", {
     p: -1
   }], ".f19n0e5{color:var(--colorNeutralForeground1);}", ".f14t3ns0{display:inline-block;}", ".fqerorx{flex-grow:1;}", ".f1mo0ibp{font-family:inherit;}", ".fkhj508{font-size:var(--fontSizeBase300);}", ".fl43uef{font-weight:var(--fontWeightSemibold);}", ".f336tjw{line-height:28px;}", [".f1a3p1vp{overflow:hidden;}", {
     p: -1
@@ -149,7 +149,7 @@ const useHeaderIconButtonStyles = /*#__PURE__*/__styles({
     Bbmb7ep: 0,
     Btl43ni: 0,
     B7oj6ja: 0,
-    Dimara: "fl4tsp0",
+    Dimara: "ft85np5",
     sj55zd: "f11d4kpn",
     mc9l5x: "ftgm304",
     Bahqtrf: "f1mo0ibp",
@@ -178,7 +178,7 @@ const useHeaderIconButtonStyles = /*#__PURE__*/__styles({
     B2d53fq: "f1wdoaqd"
   }
 }, {
-  d: [".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".f1ern45e{border-top-style:none;}", ".f1n71otn{border-right-style:none;}", ".f1deefiw{border-left-style:none;}", ".f1h8hb77{border-bottom-style:none;}", [".fl4tsp0{border-radius:2px;}", {
+  d: [".f1c21dwh{background-color:var(--colorTransparentBackground);}", ".f1ern45e{border-top-style:none;}", ".f1n71otn{border-right-style:none;}", ".f1deefiw{border-left-style:none;}", ".f1h8hb77{border-bottom-style:none;}", [".ft85np5{border-radius:var(--borderRadiusMedium);}", {
     p: -1
   }], ".f11d4kpn{color:var(--colorNeutralForeground3);}", ".ftgm304{display:block;}", ".f1mo0ibp{font-family:inherit;}", ".fy9rknc{font-size:var(--fontSizeBase200);}", ".fxldao9{height:28px;}", ".f336tjw{line-height:28px;}", [".f1gl81tg{overflow:visible;}", {
     p: -1

package/lib/components/CalendarDay/useCalendarDayStyles.styles.js.map

@@ -1 +1 @@
-{"version":3,"names":["tokens","__styles","mergeClasses","shorthands","DURATION_2","EASING_FUNCTION_2","FADE_IN","calendarDayClassNames","root","header","monthAndYear","monthComponents","headerIconButton","disabledStyle","useRootStyles","base","B7ck84d","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","a9b677","normalize","E5pizo","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","showWeekNumbers","d","p","useHeaderStyles","mc9l5x","Bqenvij","Bg96gwp","qhf8xq","useMonthAndYearStyles","Bt984gj","De3pzq","icvyot","vrafjx","oivjwe","wvpqe5","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","sj55zd","Bh6795r","Bahqtrf","Be2twd7","Bhrd7zp","B68tc82","Bmxbyg5","Bpg54ce","fsow6f","ygn44y","Huce71","animation","vin17d","Bf5fcs","Bv12yb3","Ezkn3b","headerIsClickable","Jwef8y","Bi91k9c","eoavqd","pugfm4","ukgb2i","Dwtyhm","Biisq0s","iro3zm","B2d53fq","c3iz72","mghro0","Bx68yb","syojd9","E5hylx","k","h","useMonthComponentsStyles","qb2dma","useHeaderIconButtonStyles","useDisabledStyleStyles","Bg33ivm","t69wg0","useCalendarDayStyles_unstable","props","rootStyles","headerStyles","monthAndYearStyles","monthComponentsStyles","headerIconButtonStyles","disabledStyleStyles","className"],"sources":["useCalendarDayStyles.styles.js"],"sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { DURATION_2, EASING_FUNCTION_2, FADE_IN } from '../../utils/animations';\n/**\n * @internal\n */ export const calendarDayClassNames = {\n    root: 'fui-CalendarDay',\n    header: 'fui-CalendarDay__header',\n    monthAndYear: 'fui-CalendarDay__monthAndYear',\n    monthComponents: 'fui-CalendarDay__monthComponents',\n    headerIconButton: 'fui-CalendarDay__headerIconButton',\n    disabledStyle: 'fui-CalendarDay__disabledStyle'\n};\nconst useRootStyles = makeStyles({\n    base: {\n        boxSizing: 'content-box',\n        padding: '12px',\n        width: '196px'\n    },\n    normalize: {\n        boxShadow: 'none',\n        boxSizing: 'border-box',\n        margin: '0',\n        padding: '0'\n    },\n    showWeekNumbers: {\n        width: '226px'\n    }\n});\nconst useHeaderStyles = makeStyles({\n    base: {\n        display: 'inline-flex',\n        height: '28px',\n        lineHeight: '44px',\n        position: 'relative',\n        width: '100%'\n    }\n});\nconst useMonthAndYearStyles = makeStyles({\n    base: {\n        alignItems: 'center',\n        backgroundColor: tokens.colorTransparentBackground,\n        ...shorthands.borderStyle('none'),\n        borderRadius: '2px',\n        color: tokens.colorNeutralForeground1,\n        display: 'inline-block',\n        flexGrow: 1,\n        fontFamily: 'inherit',\n        fontSize: tokens.fontSizeBase300,\n        fontWeight: tokens.fontWeightSemibold,\n        lineHeight: '28px',\n        overflow: 'hidden',\n        padding: '0 4px 0 10px',\n        textAlign: 'left',\n        textOverflow: 'ellipsis',\n        whiteSpace: 'nowrap'\n    },\n    animation: {\n        animationDuration: DURATION_2,\n        animationFillMode: 'both',\n        animationName: FADE_IN,\n        animationTimingFunction: EASING_FUNCTION_2\n    },\n    headerIsClickable: {\n        '&:hover': {\n            backgroundColor: tokens.colorBrandBackgroundInvertedHover,\n            color: tokens.colorBrandForegroundOnLightHover,\n            cursor: 'pointer',\n            outline: `1px solid ${tokens.colorTransparentStroke}`\n        },\n        '&:hover:active': {\n            backgroundColor: tokens.colorBrandBackgroundInvertedPressed,\n            color: tokens.colorBrandForegroundOnLightPressed,\n            cursor: 'pointer',\n            outline: `1px solid ${tokens.colorTransparentStroke}`\n        }\n    }\n});\nconst useMonthComponentsStyles = makeStyles({\n    base: {\n        alignSelf: 'flex-end',\n        display: 'inline-flex'\n    }\n});\nconst useHeaderIconButtonStyles = makeStyles({\n    base: {\n        backgroundColor: tokens.colorTransparentBackground,\n        ...shorthands.borderStyle('none'),\n        borderRadius: '2px',\n        color: tokens.colorNeutralForeground3,\n        display: 'block',\n        fontFamily: 'inherit',\n        fontSize: tokens.fontSizeBase200,\n        height: '28px',\n        lineHeight: '28px',\n        overflow: 'visible',\n        padding: '0',\n        position: 'relative',\n        textAlign: 'center',\n        width: '28px',\n        '&:hover': {\n            backgroundColor: tokens.colorBrandBackgroundInvertedHover,\n            color: tokens.colorBrandForegroundOnLightHover,\n            cursor: 'pointer',\n            outline: `1px solid ${tokens.colorTransparentStroke}`\n        },\n        '&:hover:active': {\n            backgroundColor: tokens.colorBrandBackgroundInvertedPressed,\n            color: tokens.colorBrandForegroundOnLightPressed\n        }\n    }\n});\nconst useDisabledStyleStyles = makeStyles({\n    base: {\n        '&, &:disabled, & button': {\n            color: tokens.colorNeutralForegroundDisabled,\n            pointerEvents: 'none'\n        }\n    }\n});\n/**\n * @internal\n *\n * Apply styling to the CalendarDay slots based on the state\n */ export const useCalendarDayStyles_unstable = (props)=>{\n    const rootStyles = useRootStyles();\n    const headerStyles = useHeaderStyles();\n    const monthAndYearStyles = useMonthAndYearStyles();\n    const monthComponentsStyles = useMonthComponentsStyles();\n    const headerIconButtonStyles = useHeaderIconButtonStyles();\n    const disabledStyleStyles = useDisabledStyleStyles();\n    const { className, headerIsClickable, showWeekNumbers } = props;\n    return {\n        root: mergeClasses(calendarDayClassNames.root, rootStyles.normalize, rootStyles.base, showWeekNumbers && rootStyles.showWeekNumbers, className),\n        header: mergeClasses(calendarDayClassNames.header, headerStyles.base),\n        monthAndYear: mergeClasses(calendarDayClassNames.monthAndYear, monthAndYearStyles.base, monthAndYearStyles.animation, headerIsClickable && monthAndYearStyles.headerIsClickable),\n        monthComponents: mergeClasses(calendarDayClassNames.monthComponents, monthComponentsStyles.base),\n        headerIconButton: mergeClasses(calendarDayClassNames.headerIconButton, headerIconButtonStyles.base),\n        disabledStyle: mergeClasses(calendarDayClassNames.disabledStyle, disabledStyleStyles.base)\n    };\n};\n"],"mappings":"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","ignoreList":[]}
+{"version":3,"names":["tokens","__styles","mergeClasses","shorthands","DURATION_2","EASING_FUNCTION_2","FADE_IN","calendarDayClassNames","root","header","monthAndYear","monthComponents","headerIconButton","disabledStyle","useRootStyles","base","B7ck84d","Byoj8tv","uwmqm3","z189sj","z8tnut","B0ocmuz","a9b677","normalize","E5pizo","jrapky","Frg6f3","t21cq0","B6of3ja","B74szlk","showWeekNumbers","d","p","useHeaderStyles","mc9l5x","Bqenvij","Bg96gwp","qhf8xq","useMonthAndYearStyles","Bt984gj","De3pzq","icvyot","vrafjx","oivjwe","wvpqe5","Beyfa6y","Bbmb7ep","Btl43ni","B7oj6ja","Dimara","sj55zd","Bh6795r","Bahqtrf","Be2twd7","Bhrd7zp","B68tc82","Bmxbyg5","Bpg54ce","fsow6f","ygn44y","Huce71","animation","vin17d","Bf5fcs","Bv12yb3","Ezkn3b","headerIsClickable","Jwef8y","Bi91k9c","eoavqd","pugfm4","ukgb2i","Dwtyhm","Biisq0s","iro3zm","B2d53fq","c3iz72","mghro0","Bx68yb","syojd9","E5hylx","k","h","useMonthComponentsStyles","qb2dma","useHeaderIconButtonStyles","useDisabledStyleStyles","Bg33ivm","t69wg0","useCalendarDayStyles_unstable","props","rootStyles","headerStyles","monthAndYearStyles","monthComponentsStyles","headerIconButtonStyles","disabledStyleStyles","className"],"sources":["useCalendarDayStyles.styles.js"],"sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { DURATION_2, EASING_FUNCTION_2, FADE_IN } from '../../utils/animations';\n/**\n * @internal\n */ export const calendarDayClassNames = {\n    root: 'fui-CalendarDay',\n    header: 'fui-CalendarDay__header',\n    monthAndYear: 'fui-CalendarDay__monthAndYear',\n    monthComponents: 'fui-CalendarDay__monthComponents',\n    headerIconButton: 'fui-CalendarDay__headerIconButton',\n    disabledStyle: 'fui-CalendarDay__disabledStyle'\n};\nconst useRootStyles = makeStyles({\n    base: {\n        boxSizing: 'content-box',\n        padding: '12px',\n        width: '196px'\n    },\n    normalize: {\n        boxShadow: 'none',\n        boxSizing: 'border-box',\n        margin: '0',\n        padding: '0'\n    },\n    showWeekNumbers: {\n        width: '226px'\n    }\n});\nconst useHeaderStyles = makeStyles({\n    base: {\n        display: 'inline-flex',\n        height: '28px',\n        lineHeight: '44px',\n        position: 'relative',\n        width: '100%'\n    }\n});\nconst useMonthAndYearStyles = makeStyles({\n    base: {\n        alignItems: 'center',\n        backgroundColor: tokens.colorTransparentBackground,\n        ...shorthands.borderStyle('none'),\n        borderRadius: tokens.borderRadiusMedium,\n        color: tokens.colorNeutralForeground1,\n        display: 'inline-block',\n        flexGrow: 1,\n        fontFamily: 'inherit',\n        fontSize: tokens.fontSizeBase300,\n        fontWeight: tokens.fontWeightSemibold,\n        lineHeight: '28px',\n        overflow: 'hidden',\n        padding: '0 4px 0 10px',\n        textAlign: 'left',\n        textOverflow: 'ellipsis',\n        whiteSpace: 'nowrap'\n    },\n    animation: {\n        animationDuration: DURATION_2,\n        animationFillMode: 'both',\n        animationName: FADE_IN,\n        animationTimingFunction: EASING_FUNCTION_2\n    },\n    headerIsClickable: {\n        '&:hover': {\n            backgroundColor: tokens.colorBrandBackgroundInvertedHover,\n            color: tokens.colorBrandForegroundOnLightHover,\n            cursor: 'pointer',\n            outline: `1px solid ${tokens.colorTransparentStroke}`\n        },\n        '&:hover:active': {\n            backgroundColor: tokens.colorBrandBackgroundInvertedPressed,\n            color: tokens.colorBrandForegroundOnLightPressed,\n            cursor: 'pointer',\n            outline: `1px solid ${tokens.colorTransparentStroke}`\n        }\n    }\n});\nconst useMonthComponentsStyles = makeStyles({\n    base: {\n        alignSelf: 'flex-end',\n        display: 'inline-flex'\n    }\n});\nconst useHeaderIconButtonStyles = makeStyles({\n    base: {\n        backgroundColor: tokens.colorTransparentBackground,\n        ...shorthands.borderStyle('none'),\n        borderRadius: tokens.borderRadiusMedium,\n        color: tokens.colorNeutralForeground3,\n        display: 'block',\n        fontFamily: 'inherit',\n        fontSize: tokens.fontSizeBase200,\n        height: '28px',\n        lineHeight: '28px',\n        overflow: 'visible',\n        padding: '0',\n        position: 'relative',\n        textAlign: 'center',\n        width: '28px',\n        '&:hover': {\n            backgroundColor: tokens.colorBrandBackgroundInvertedHover,\n            color: tokens.colorBrandForegroundOnLightHover,\n            cursor: 'pointer',\n            outline: `1px solid ${tokens.colorTransparentStroke}`\n        },\n        '&:hover:active': {\n            backgroundColor: tokens.colorBrandBackgroundInvertedPressed,\n            color: tokens.colorBrandForegroundOnLightPressed\n        }\n    }\n});\nconst useDisabledStyleStyles = makeStyles({\n    base: {\n        '&, &:disabled, & button': {\n            color: tokens.colorNeutralForegroundDisabled,\n            pointerEvents: 'none'\n        }\n    }\n});\n/**\n * @internal\n *\n * Apply styling to the CalendarDay slots based on the state\n */ export const useCalendarDayStyles_unstable = (props)=>{\n    const rootStyles = useRootStyles();\n    const headerStyles = useHeaderStyles();\n    const monthAndYearStyles = useMonthAndYearStyles();\n    const monthComponentsStyles = useMonthComponentsStyles();\n    const headerIconButtonStyles = useHeaderIconButtonStyles();\n    const disabledStyleStyles = useDisabledStyleStyles();\n    const { className, headerIsClickable, showWeekNumbers } = props;\n    return {\n        root: mergeClasses(calendarDayClassNames.root, rootStyles.normalize, rootStyles.base, showWeekNumbers && rootStyles.showWeekNumbers, className),\n        header: mergeClasses(calendarDayClassNames.header, headerStyles.base),\n        monthAndYear: mergeClasses(calendarDayClassNames.monthAndYear, monthAndYearStyles.base, monthAndYearStyles.animation, headerIsClickable && monthAndYearStyles.headerIsClickable),\n        monthComponents: mergeClasses(calendarDayClassNames.monthComponents, monthComponentsStyles.base),\n        headerIconButton: mergeClasses(calendarDayClassNames.headerIconButton, headerIconButtonStyles.base),\n        disabledStyle: mergeClasses(calendarDayClassNames.disabledStyle, disabledStyleStyles.base)\n    };\n};\n"],"mappings":"AAAA,SAASA,MAAM,QAAQ,uBAAuB;AAC9C,SAAAC,QAAA,EAAqBC,YAAY,EAAEC,UAAU,QAAQ,gBAAgB;AACrE,SAASC,UAAU,EAAEC,iBAAiB,EAAEC,OAAO,QAAQ,wBAAwB;AAC/E;AACA;AACA;AAAI,OAAO,MAAMC,qBAAqB,GAAG;EACrCC,IAAI,EAAE,iBAAiB;EACvBC,MAAM,EAAE,yBAAyB;EACjCC,YAAY,EAAE,+BAA+B;EAC7CC,eAAe,EAAE,kCAAkC;EACnDC,gBAAgB,EAAE,mCAAmC;EACrDC,aAAa,EAAE;AACnB,CAAC;AACD,MAAMC,aAAa,gBAAGb,QAAA;EAAAc,IAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,SAAA;IAAAC,MAAA;IAAAR,OAAA;IAAAS,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAZ,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;EAAAS,eAAA;IAAAR,MAAA;EAAA;AAAA;EAAAS,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAerB,CAAC;AACF,MAAMC,eAAe,gBAAGhC,QAAA;EAAAc,IAAA;IAAAmB,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAf,MAAA;EAAA;AAAA;EAAAS,CAAA;AAAA,CAQvB,CAAC;AACF,MAAMO,qBAAqB,gBAAGrC,QAAA;EAAAc,IAAA;IAAAwB,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAhB,MAAA;IAAAiB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAlB,OAAA;IAAAmB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAxC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAqC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;EAAAC,SAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;EAAA;EAAAC,iBAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;EAAA;AAAA;EAAAjD,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAiD,CAAA;EAAAC,CAAA;IAAAlD,CAAA;EAAA;IAAAA,CAAA;EAAA;AAAA,CAuC7B,CAAC;AACF,MAAMmD,wBAAwB,gBAAGlF,QAAA;EAAAc,IAAA;IAAAqE,MAAA;IAAAlD,MAAA;EAAA;AAAA;EAAAH,CAAA;AAAA,CAKhC,CAAC;AACF,MAAMsD,yBAAyB,gBAAGpF,QAAA;EAAAc,IAAA;IAAAyB,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAhB,MAAA;IAAAkB,OAAA;IAAAC,OAAA;IAAAlB,OAAA;IAAAC,OAAA;IAAAmB,OAAA;IAAAC,OAAA;IAAAC,OAAA;IAAAxC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAgB,MAAA;IAAAqB,MAAA;IAAApC,MAAA;IAAA6C,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,MAAA;IAAAC,OAAA;IAAAC,MAAA;IAAAC,OAAA;EAAA;AAAA;EAAA5C,CAAA;IAAAC,CAAA;EAAA;IAAAA,CAAA;EAAA;IAAAA,CAAA;EAAA;EAAAkD,CAAA;IAAAlD,CAAA;EAAA;AAAA,CA2BjC,CAAC;AACF,MAAMsD,sBAAsB,gBAAGrF,QAAA;EAAAc,IAAA;IAAAwE,OAAA;IAAAC,MAAA;EAAA;AAAA;EAAAzD,CAAA;AAAA,CAO9B,CAAC;AACF;AACA;AACA;AACA;AACA;AAAI,OAAO,MAAM0D,6BAA6B,GAAIC,KAAK,IAAG;EACtD,MAAMC,UAAU,GAAG7E,aAAa,CAAC,CAAC;EAClC,MAAM8E,YAAY,GAAG3D,eAAe,CAAC,CAAC;EACtC,MAAM4D,kBAAkB,GAAGvD,qBAAqB,CAAC,CAAC;EAClD,MAAMwD,qBAAqB,GAAGX,wBAAwB,CAAC,CAAC;EACxD,MAAMY,sBAAsB,GAAGV,yBAAyB,CAAC,CAAC;EAC1D,MAAMW,mBAAmB,GAAGV,sBAAsB,CAAC,CAAC;EACpD,MAAM;IAAEW,SAAS;IAAE/B,iBAAiB;IAAEpC;EAAgB,CAAC,GAAG4D,KAAK;EAC/D,OAAO;IACHlF,IAAI,EAAEN,YAAY,CAACK,qBAAqB,CAACC,IAAI,EAAEmF,UAAU,CAACpE,SAAS,EAAEoE,UAAU,CAAC5E,IAAI,EAAEe,eAAe,IAAI6D,UAAU,CAAC7D,eAAe,EAAEmE,SAAS,CAAC;IAC/IxF,MAAM,EAAEP,YAAY,CAACK,qBAAqB,CAACE,MAAM,EAAEmF,YAAY,CAAC7E,IAAI,CAAC;IACrEL,YAAY,EAAER,YAAY,CAACK,qBAAqB,CAACG,YAAY,EAAEmF,kBAAkB,CAAC9E,IAAI,EAAE8E,kBAAkB,CAAChC,SAAS,EAAEK,iBAAiB,IAAI2B,kBAAkB,CAAC3B,iBAAiB,CAAC;IAChLvD,eAAe,EAAET,YAAY,CAACK,qBAAqB,CAACI,eAAe,EAAEmF,qBAAqB,CAAC/E,IAAI,CAAC;IAChGH,gBAAgB,EAAEV,YAAY,CAACK,qBAAqB,CAACK,gBAAgB,EAAEmF,sBAAsB,CAAChF,IAAI,CAAC;IACnGF,aAAa,EAAEX,YAAY,CAACK,qBAAqB,CAACM,aAAa,EAAEmF,mBAAmB,CAACjF,IAAI;EAC7F,CAAC;AACL,CAAC","ignoreList":[]}

package/lib/components/CalendarDayGrid/CalendarDayGrid.types.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CalendarDayGrid.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { AnimationDirection } from '../Calendar/Calendar.types';\nimport { DayOfWeek, FirstWeekOfYear, DateRangeType } from '../../utils';\nimport type { CalendarStrings, DateFormatting, DayGridOptions } from '../../utils';\n\n/**\n * @internal\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport interface ICalendarDayGrid {\n  focus(): void;\n}\n\n/**\n * @internal\n */\nexport interface CalendarDayGridProps extends DayGridOptions {\n  /**\n   * Optional callback to access the ICalendarDayGrid interface. Use this instead of ref for accessing\n   * the public methods and properties of the component.\n   */\n  componentRef?: React.RefObject<ICalendarDayGrid>;\n\n  /**\n   * Additional CSS class(es) to apply to the CalendarDayGrid.\n   */\n  className?: string;\n\n  /**\n   * Localized strings to use in the CalendarDayGrid\n   */\n  strings: CalendarStrings;\n\n  /**\n   * The currently selected date\n   */\n  selectedDate: Date;\n\n  /**\n   * The currently navigated date\n   */\n  navigatedDate: Date;\n\n  /**\n   * Callback issued when a date is selected\n   * @param date - The date the user selected\n   * @param selectedDateRangeArray - The resultant list of dates that are selected based on the date range type set\n   * for the component.\n   */\n  onSelectDate?: (date: Date, selectedDateRangeArray?: Date[]) => void;\n\n  /**\n   * Callback issued when a date in the calendar is navigated\n   * @param date - The date that is navigated to\n   * @param focusOnNavigatedDay - Whether to set the focus to the navigated date.\n   */\n  onNavigateDate: (date: Date, focusOnNavigatedDay: boolean) => void;\n\n  /**\n   * Callback issued when calendar day is closed\n   */\n  onDismiss?: () => void;\n\n  /**\n   * The first day of the week for your locale.\n   * @default DayOfWeek.Sunday\n   */\n  firstDayOfWeek: DayOfWeek;\n\n  /**\n   * Defines when the first week of the year should start, FirstWeekOfYear.FirstDay,\n   * FirstWeekOfYear.FirstFullWeek or FirstWeekOfYear.FirstFourDayWeek are the possible values\n   * @default FirstWeekOfYear.FirstDay\n   */\n  firstWeekOfYear: FirstWeekOfYear;\n\n  /**\n   * The date range type indicating how  many days should be selected as the user\n   * selects days\n   * @default DateRangeType.Day\n   */\n  dateRangeType: DateRangeType;\n\n  /**\n   * The number of days to select while dateRangeType === DateRangeType.Day. Used in order to have multi-day\n   * views.\n   * @default 1\n   */\n  daysToSelectInDayView?: number;\n\n  /**\n   * Value of today. If unspecified, current time in client machine will be used.\n   */\n  today?: Date;\n\n  /**\n   * Whether the calendar should show the week number (weeks 1 to 53) before each week row\n   * @default false\n   */\n  showWeekNumbers?: boolean;\n\n  /**\n   * Apply additional formatting to dates, for example localized date formatting.\n   */\n  dateTimeFormatter: DateFormatting;\n\n  /**\n   * Ref callback for individual days. Allows for customization of the styling, properties, or listeners of the\n   * specific day.\n   */\n  customDayCellRef?: (element: HTMLElement, date: Date, classNames: CalendarDayGridStyles) => void;\n\n  /**\n   * How many weeks to show by default. If not provided, will show enough weeks to display the current\n   * month, between 4 and 6 depending\n   * @default undefined\n   */\n  weeksToShow?: number;\n\n  /**\n   * If set the Calendar will not allow navigation to or selection of a date earlier than this value.\n   */\n  minDate?: Date;\n\n  /**\n   * If set the Calendar will not allow navigation to or selection of a date later than this value.\n   */\n  maxDate?: Date;\n\n  /**\n   * If set the Calendar will not allow selection of dates in this array.\n   */\n  restrictedDates?: Date[];\n\n  /**\n   * The days that are selectable when `dateRangeType` is WorkWeek.\n   * If `dateRangeType` is not WorkWeek this property does nothing.\n   * @default [Monday,Tuesday,Wednesday,Thursday,Friday]\n   */\n  workWeekDays?: DayOfWeek[];\n\n  /**\n   * Whether the close button should be shown or not\n   * @default false\n   */\n  showCloseButton?: boolean;\n\n  /**\n   * Allows all dates and buttons to be focused, including disabled ones\n   * @default false\n   */\n  allFocusable?: boolean;\n\n  /**\n   * The ID of the control that labels this one\n   */\n  labelledBy?: string;\n\n  /**\n   * Whether to show days outside the selected month with lighter styles\n   * @default true\n   */\n  lightenDaysOutsideNavigatedMonth?: boolean;\n\n  /**\n   * The cardinal directions for animation to occur during transitions, either horizontal or veritcal\n   */\n  animationDirection?: AnimationDirection;\n\n  /**\n   * Optional callback function to mark specific days with a small symbol. Fires when the date range changes,\n   * gives the starting and ending displayed dates and expects the list of which days in between should be\n   * marked.\n   */\n  getMarkedDays?: (startingDate: Date, endingDate: Date) => Date[];\n}\n\n/**\n * @internal\n */\nexport interface CalendarDayGridStyleProps {\n  /**\n   * Accept custom classNames\n   */\n  className?: string;\n\n  /**\n   * The date range type\n   */\n  dateRangeType?: DateRangeType;\n\n  /**\n   * Whether week numbers are being shown\n   */\n  showWeekNumbers?: boolean;\n\n  /**\n   * Whether to show days outside the selected month with lighter styles\n   */\n  lightenDaysOutsideNavigatedMonth?: boolean;\n\n  /**\n   * Whether grid entering animation should be forwards or backwards\n   */\n  animateBackwards?: boolean;\n\n  /**\n   * The cardinal directions for animation to occur during transitions, either horizontal or vertical\n   */\n  animationDirection?: AnimationDirection;\n}\n\n/**\n * @internal\n */\nexport interface CalendarDayGridStyles {\n  /**\n   * The style for the root div\n   */\n  wrapper?: string;\n\n  /**\n   * The style for the table containing the grid\n   */\n  table?: string;\n\n  /**\n   * The style to apply to the grid cells for days\n   */\n  dayCell?: string;\n\n  /**\n   * The style to apply to grid cells for days in the selected range\n   */\n  daySelected?: string;\n\n  /**\n   * The style to apply to row around weeks\n   */\n  weekRow?: string;\n\n  /**\n   * The style to apply to the column headers above the weeks\n   */\n  weekDayLabelCell?: string;\n\n  /**\n   * The style to apply to grid cells for week numbers\n   */\n  weekNumberCell?: string;\n\n  /**\n   * The style to apply to individual days that are outside the min/max date range\n   */\n  dayOutsideBounds?: string;\n\n  /**\n   * The style to apply to individual days that are outside the current month\n   */\n  dayOutsideNavigatedMonth?: string;\n\n  /**\n   * The style to apply to the button element within the day cells\n   */\n  dayButton?: string;\n\n  /**\n   * The style to apply to the individual button element that matches the \"today\" parameter\n   */\n  dayIsToday?: string;\n\n  /**\n   * The style applied to the first placeholder week used during transitions\n   */\n  firstTransitionWeek?: string;\n\n  /**\n   * The style applied to the last placeholder week used during transitions\n   */\n  lastTransitionWeek?: string;\n\n  /**\n   * The style applied to the marker on days to mark as important\n   */\n  dayMarker?: string;\n}\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}
+{"version":3,"sources":["CalendarDayGrid.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { AnimationDirection } from '../Calendar/Calendar.types';\nimport { DayOfWeek, FirstWeekOfYear, DateRangeType } from '../../utils';\nimport type { CalendarStrings, DateFormatting, DayGridOptions } from '../../utils';\n\n/**\n * @internal\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport interface ICalendarDayGrid {\n  focus(): void;\n}\n\n/**\n * @internal\n */\nexport interface CalendarDayGridProps extends DayGridOptions {\n  /**\n   * Optional callback to access the ICalendarDayGrid interface. Use this instead of ref for accessing\n   * the public methods and properties of the component.\n   */\n  componentRef?: React.RefObject<ICalendarDayGrid>;\n\n  /**\n   * Additional CSS class(es) to apply to the CalendarDayGrid.\n   */\n  className?: string;\n\n  /**\n   * Localized strings to use in the CalendarDayGrid\n   */\n  strings: CalendarStrings;\n\n  /**\n   * The currently selected date\n   */\n  selectedDate: Date;\n\n  /**\n   * The currently navigated date\n   */\n  navigatedDate: Date;\n\n  /**\n   * Callback issued when a date is selected\n   * @param date - The date the user selected\n   * @param selectedDateRangeArray - The resultant list of dates that are selected based on the date range type set\n   * for the component.\n   */\n  onSelectDate?: (date: Date, selectedDateRangeArray?: Date[]) => void;\n\n  /**\n   * Callback issued when a date in the calendar is navigated\n   * @param date - The date that is navigated to\n   * @param focusOnNavigatedDay - Whether to set the focus to the navigated date.\n   */\n  onNavigateDate: (date: Date, focusOnNavigatedDay: boolean) => void;\n\n  /**\n   * Callback issued when calendar day is closed\n   */\n  onDismiss?: () => void;\n\n  /**\n   * The first day of the week for your locale.\n   * @default DayOfWeek.Sunday\n   */\n  firstDayOfWeek: DayOfWeek;\n\n  /**\n   * Defines when the first week of the year should start, FirstWeekOfYear.FirstDay,\n   * FirstWeekOfYear.FirstFullWeek or FirstWeekOfYear.FirstFourDayWeek are the possible values\n   * @default FirstWeekOfYear.FirstDay\n   */\n  firstWeekOfYear: FirstWeekOfYear;\n\n  /**\n   * The date range type indicating how  many days should be selected as the user\n   * selects days\n   * @default DateRangeType.Day\n   */\n  dateRangeType: DateRangeType;\n\n  /**\n   * The number of days to select while dateRangeType === DateRangeType.Day. Used in order to have multi-day\n   * views.\n   * @default 1\n   */\n  daysToSelectInDayView?: number;\n\n  /**\n   * Value of today. If unspecified, current time in client machine will be used.\n   */\n  today?: Date;\n\n  /**\n   * Whether the calendar should show the week number (weeks 1 to 53) before each week row\n   * @default false\n   */\n  showWeekNumbers?: boolean;\n\n  /**\n   * Apply additional formatting to dates, for example localized date formatting.\n   */\n  dateTimeFormatter: DateFormatting;\n\n  /**\n   * Ref callback for individual days. Allows for customization of the styling, properties, or listeners of the\n   * specific day.\n   */\n  customDayCellRef?: (element: HTMLElement, date: Date, classNames: CalendarDayGridStyles) => void;\n\n  /**\n   * How many weeks to show by default. If not provided, will show enough weeks to display the current\n   * month, between 4 and 6 depending\n   * @default undefined\n   */\n  weeksToShow?: number;\n\n  /**\n   * If set the Calendar will not allow navigation to or selection of a date earlier than this value.\n   */\n  minDate?: Date;\n\n  /**\n   * If set the Calendar will not allow navigation to or selection of a date later than this value.\n   */\n  maxDate?: Date;\n\n  /**\n   * If set the Calendar will not allow selection of dates in this array.\n   */\n  restrictedDates?: Date[];\n\n  /**\n   * The days that are selectable when `dateRangeType` is WorkWeek.\n   * If `dateRangeType` is not WorkWeek this property does nothing.\n   * @default [Monday,Tuesday,Wednesday,Thursday,Friday]\n   */\n  workWeekDays?: DayOfWeek[];\n\n  /**\n   * Whether the close button should be shown or not\n   * @default false\n   */\n  showCloseButton?: boolean;\n\n  /**\n   * Allows all dates and buttons to be focused, including disabled ones\n   * @default false\n   */\n  allFocusable?: boolean;\n\n  /**\n   * The ID of the control that labels this one\n   */\n  labelledBy?: string;\n\n  /**\n   * Whether to show days outside the selected month with lighter styles\n   * @default true\n   */\n  lightenDaysOutsideNavigatedMonth?: boolean;\n\n  /**\n   * The cardinal directions for animation to occur during transitions, either horizontal or veritcal\n   */\n  animationDirection?: AnimationDirection;\n\n  /**\n   * Optional callback function to mark specific days with a small symbol. Fires when the date range changes,\n   * gives the starting and ending displayed dates and expects the list of which days in between should be\n   * marked.\n   */\n  getMarkedDays?: (startingDate: Date, endingDate: Date) => Date[];\n}\n\n/**\n * @internal\n */\nexport interface CalendarDayGridStyleProps {\n  /**\n   * Accept custom classNames\n   */\n  className?: string;\n\n  /**\n   * The date range type\n   */\n  dateRangeType?: DateRangeType;\n\n  /**\n   * Whether week numbers are being shown\n   */\n  showWeekNumbers?: boolean;\n\n  /**\n   * Whether to show days outside the selected month with lighter styles\n   */\n  lightenDaysOutsideNavigatedMonth?: boolean;\n\n  /**\n   * Whether grid entering animation should be forwards or backwards\n   */\n  animateBackwards?: boolean;\n\n  /**\n   * The cardinal directions for animation to occur during transitions, either horizontal or vertical\n   */\n  animationDirection?: AnimationDirection;\n}\n\n/**\n * @internal\n */\nexport interface CalendarDayGridStyles {\n  /**\n   * The style for the root div\n   */\n  wrapper?: string;\n\n  /**\n   * The style for the table containing the grid\n   */\n  table?: string;\n\n  /**\n   * The style to apply to the grid cells for days\n   */\n  dayCell?: string;\n\n  /**\n   * The style to apply to grid cells for days in the selected range\n   */\n  daySelected?: string;\n\n  /**\n   * The classname applied when a single day is selected\n   */\n  daySingleSelected?: string;\n\n  /**\n   * The style to apply to row around weeks\n   */\n  weekRow?: string;\n\n  /**\n   * The style to apply to the column headers above the weeks\n   */\n  weekDayLabelCell?: string;\n\n  /**\n   * The style to apply to grid cells for week numbers\n   */\n  weekNumberCell?: string;\n\n  /**\n   * The style to apply to individual days that are outside the min/max date range\n   */\n  dayOutsideBounds?: string;\n\n  /**\n   * The style to apply to individual days that are outside the current month\n   */\n  dayOutsideNavigatedMonth?: string;\n\n  /**\n   * The style to apply to the button element within the day cells\n   */\n  dayButton?: string;\n\n  /**\n   * The style to apply to the individual button element that matches the \"today\" parameter\n   */\n  dayIsToday?: string;\n\n  /**\n   * The style applied to the first placeholder week used during transitions\n   */\n  firstTransitionWeek?: string;\n\n  /**\n   * The style applied to the last placeholder week used during transitions\n   */\n  lastTransitionWeek?: string;\n\n  /**\n   * The style applied to the marker on days to mark as important\n   */\n  dayMarker?: string;\n\n  /**\n   * The classname applied to the day \"today\" span\n   */\n  dayTodayMarker?: string;\n}\n"],"names":["React"],"mappings":"AAAA,YAAYA,WAAW,QAAQ"}

package/lib/components/CalendarDayGrid/CalendarGridDayCell.js

@@ -128,7 +128,7 @@ import { extraCalendarDayGridClassNames } from './useCalendarDayGridStyles.style
     }
     const isFocusable = !ariaHidden && (allFocusable || (day.isInBounds ? true : undefined));
     return /*#__PURE__*/ React.createElement("td", {
-        className: mergeClasses(classNames.dayCell, weekCorners && cornerStyle, day.isSelected && classNames.daySelected, !day.isInBounds && classNames.dayOutsideBounds, !day.isInMonth && classNames.dayOutsideNavigatedMonth),
+        className: mergeClasses(classNames.dayCell, weekCorners && cornerStyle, day.isSelected && !day.isSingleSelected && classNames.daySelected, day.isSingleSelected && classNames.daySingleSelected, !day.isInBounds && classNames.dayOutsideBounds, !day.isInMonth && classNames.dayOutsideNavigatedMonth),
         ref: (element)=>{
             customDayCellRef === null || customDayCellRef === void 0 ? void 0 : customDayCellRef(element, day.originalDate, classNames);
             day.setRef(element);
@@ -156,6 +156,7 @@ import { extraCalendarDayGridClassNames } from './useCalendarDayGridStyles.style
         type: "button",
         tabIndex: -1
     }, /*#__PURE__*/ React.createElement("span", {
+        className: day.isToday ? mergeClasses(classNames.dayTodayMarker) : undefined,
         "aria-hidden": "true"
     }, dateTimeFormatter.formatDay(day.originalDate)), day.isMarked && /*#__PURE__*/ React.createElement("div", {
         "aria-hidden": "true",

package/lib/components/CalendarDayGrid/CalendarGridDayCell.js.map

@@ -1 +1 @@
-{"version":3,"sources":["CalendarGridDayCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, Enter } from '@fluentui/keyboard-keys';\nimport { getRTLSafeKey } from '@fluentui/react-utilities';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { mergeClasses } from '@griffel/react';\nimport { addDays, addWeeks, compareDates, findAvailableDate, DateRangeType } from '../../utils';\nimport { weekCornersClassNames } from './useWeekCornerStyles.styles';\nimport { extraCalendarDayGridClassNames } from './useCalendarDayGridStyles.styles';\nimport type { AvailableDateOptions } from '../../utils';\nimport type { DayInfo } from './CalendarDayGrid';\nimport type { CalendarGridRowProps } from './CalendarGridRow';\n\n/**\n * @internal\n */\nexport interface CalendarGridDayCellProps extends CalendarGridRowProps {\n  day: DayInfo;\n  dayIndex: number;\n}\n\n/**\n * @internal\n */\nexport const CalendarGridDayCell: React.FunctionComponent<CalendarGridDayCellProps> = props => {\n  const {\n    navigatedDate,\n    dateTimeFormatter,\n    allFocusable,\n    strings,\n    activeDescendantId,\n    navigatedDayRef,\n    calculateRoundedStyles,\n    weeks,\n    classNames,\n    day,\n    dayIndex,\n    weekIndex,\n    weekCorners,\n    ariaHidden,\n    customDayCellRef,\n    dateRangeType,\n    daysToSelectInDayView,\n    onSelectDate,\n    restrictedDates,\n    minDate,\n    maxDate,\n    onNavigateDate,\n    getDayInfosInRangeOfDay,\n    getRefsFromDayInfos,\n  } = props;\n  const cornerStyle = weekCorners?.[weekIndex + '_' + dayIndex] ?? '';\n  const isNavigatedDate = compareDates(navigatedDate, day.originalDate);\n\n  const { dir } = useFluent_unstable();\n\n  const navigateMonthEdge = (ev: React.KeyboardEvent<HTMLElement>, date: Date): void => {\n    let targetDate: Date | undefined = undefined;\n    let direction = 1; // by default search forward\n\n    if (ev.key === ArrowUp) {\n      targetDate = addWeeks(date, -1);\n      direction = -1;\n    } else if (ev.key === ArrowDown) {\n      targetDate = addWeeks(date, 1);\n    } else if (ev.key === getRTLSafeKey(ArrowLeft, dir)) {\n      targetDate = addDays(date, -1);\n      direction = -1;\n    } else if (ev.key === getRTLSafeKey(ArrowRight, dir)) {\n      targetDate = addDays(date, 1);\n    }\n\n    if (!targetDate) {\n      // if we couldn't find a target date at all, do nothing\n      return;\n    }\n\n    const findAvailableDateOptions: AvailableDateOptions = {\n      initialDate: date,\n      targetDate,\n      direction,\n      restrictedDates,\n      minDate,\n      maxDate,\n    };\n\n    // target date is restricted, search in whatever direction until finding the next possible date,\n    // stopping at boundaries\n    let nextDate = findAvailableDate(findAvailableDateOptions);\n\n    if (!nextDate) {\n      // if no dates available in initial direction, try going backwards\n      findAvailableDateOptions.direction = -direction;\n      nextDate = findAvailableDate(findAvailableDateOptions);\n    }\n\n    // if the nextDate is still inside the same focusZone area, let the focusZone handle setting the focus so we\n    // don't jump the view unnecessarily\n    const isInCurrentView =\n      weeks &&\n      nextDate &&\n      weeks.slice(1, weeks.length - 1).some((week: DayInfo[]) => {\n        return week.some((dayToCompare: DayInfo) => {\n          return compareDates(dayToCompare.originalDate, nextDate!);\n        });\n      });\n    if (isInCurrentView) {\n      return;\n    }\n\n    // else, fire navigation on the date to change the view to show it\n    if (nextDate) {\n      onNavigateDate(nextDate, true);\n      ev.preventDefault();\n    }\n  };\n\n  const onMouseOverDay = (ev: React.MouseEvent<HTMLElement>) => {\n    const dayInfos = getDayInfosInRangeOfDay(day);\n    const dayRefs = getRefsFromDayInfos(dayInfos);\n\n    dayRefs.forEach((dayRef: HTMLElement | null, index: number) => {\n      if (dayRef) {\n        dayRef.classList.add(extraCalendarDayGridClassNames.hoverStyle);\n        if (\n          !dayInfos[index].isSelected &&\n          dateRangeType === DateRangeType.Day &&\n          daysToSelectInDayView &&\n          daysToSelectInDayView > 1\n        ) {\n          // remove the static classes first to overwrite them\n          dayRef.classList.remove(\n            weekCornersClassNames.bottomLeftCornerDate!,\n            weekCornersClassNames.bottomRightCornerDate!,\n            weekCornersClassNames.topLeftCornerDate!,\n            weekCornersClassNames.topRightCornerDate!,\n          );\n\n          const classNamesToAdd = calculateRoundedStyles(false, false, index > 0, index < dayRefs.length - 1).trim();\n          if (classNamesToAdd) {\n            dayRef.classList.add(...classNamesToAdd.trim().split(' '));\n          }\n        }\n      }\n    });\n  };\n\n  const onMouseDownDay = (ev: React.MouseEvent<HTMLElement>) => {\n    const dayInfos = getDayInfosInRangeOfDay(day);\n    const dayRefs = getRefsFromDayInfos(dayInfos);\n\n    dayRefs.forEach((dayRef: HTMLElement | null) => {\n      if (dayRef) {\n        dayRef.classList.add(extraCalendarDayGridClassNames.pressedStyle);\n      }\n    });\n  };\n\n  const onMouseUpDay = (ev: React.MouseEvent<HTMLElement>) => {\n    const dayInfos = getDayInfosInRangeOfDay(day);\n    const dayRefs = getRefsFromDayInfos(dayInfos);\n\n    dayRefs.forEach((dayRef: HTMLElement | null) => {\n      if (dayRef) {\n        dayRef.classList.remove(extraCalendarDayGridClassNames.pressedStyle);\n      }\n    });\n  };\n\n  const onMouseOutDay = (ev: React.MouseEvent<HTMLElement>) => {\n    const dayInfos = getDayInfosInRangeOfDay(day);\n    const dayRefs = getRefsFromDayInfos(dayInfos);\n\n    dayRefs.forEach((dayRef: HTMLElement | null, index: number) => {\n      if (dayRef) {\n        dayRef.classList.remove(extraCalendarDayGridClassNames.hoverStyle);\n        dayRef.classList.remove(extraCalendarDayGridClassNames.pressedStyle);\n        if (\n          !dayInfos[index].isSelected &&\n          dateRangeType === DateRangeType.Day &&\n          daysToSelectInDayView &&\n          daysToSelectInDayView > 1\n        ) {\n          const classNamesToAdd = calculateRoundedStyles(false, false, index > 0, index < dayRefs.length - 1).trim();\n          if (classNamesToAdd) {\n            dayRef.classList.remove(...classNamesToAdd.trim().split(' '));\n          }\n        }\n      }\n    });\n  };\n\n  const onDayKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {\n    if (ev.key === Enter) {\n      onSelectDate?.(day.originalDate);\n    } else {\n      navigateMonthEdge(ev, day.originalDate);\n    }\n  };\n\n  let ariaLabel =\n    day.originalDate.getDate() +\n    ', ' +\n    strings.months[day.originalDate.getMonth()] +\n    ', ' +\n    day.originalDate.getFullYear();\n\n  if (day.isMarked) {\n    ariaLabel = ariaLabel + ', ' + strings.dayMarkedAriaLabel;\n  }\n\n  const isFocusable = !ariaHidden && (allFocusable || (day.isInBounds ? true : undefined));\n\n  return (\n    <td\n      className={mergeClasses(\n        classNames.dayCell,\n        weekCorners && cornerStyle,\n        day.isSelected && classNames.daySelected,\n        !day.isInBounds && classNames.dayOutsideBounds,\n        !day.isInMonth && classNames.dayOutsideNavigatedMonth,\n      )}\n      ref={(element: HTMLTableCellElement) => {\n        customDayCellRef?.(element, day.originalDate, classNames);\n        day.setRef(element);\n        isNavigatedDate && (navigatedDayRef.current = element);\n      }}\n      aria-hidden={ariaHidden}\n      aria-disabled={!ariaHidden && !day.isInBounds}\n      onClick={day.isInBounds && !ariaHidden ? day.onSelected : undefined}\n      onMouseOver={!ariaHidden ? onMouseOverDay : undefined}\n      onMouseDown={!ariaHidden ? onMouseDownDay : undefined}\n      onMouseUp={!ariaHidden ? onMouseUpDay : undefined}\n      onMouseOut={!ariaHidden ? onMouseOutDay : undefined}\n      onKeyDown={!ariaHidden ? onDayKeyDown : undefined}\n      role=\"gridcell\"\n      tabIndex={isNavigatedDate || isFocusable ? 0 : undefined}\n      aria-current={day.isToday ? 'date' : undefined}\n      aria-selected={day.isInBounds ? day.isSelected : undefined}\n    >\n      <button\n        key={day.key + 'button'}\n        aria-hidden={ariaHidden}\n        className={mergeClasses(classNames.dayButton, day.isToday && classNames.dayIsToday)}\n        aria-label={ariaLabel}\n        id={isNavigatedDate ? activeDescendantId : undefined}\n        disabled={!ariaHidden && !day.isInBounds}\n        type=\"button\"\n        tabIndex={-1}\n      >\n        <span aria-hidden=\"true\">{dateTimeFormatter.formatDay(day.originalDate)}</span>\n        {day.isMarked && <div aria-hidden=\"true\" className={classNames.dayMarker} />}\n      </button>\n    </td>\n  );\n};\n"],"names":["React","ArrowDown","ArrowLeft","ArrowRight","ArrowUp","Enter","getRTLSafeKey","useFluent_unstable","mergeClasses","addDays","addWeeks","compareDates","findAvailableDate","DateRangeType","weekCornersClassNames","extraCalendarDayGridClassNames","CalendarGridDayCell","props","navigatedDate","dateTimeFormatter","allFocusable","strings","activeDescendantId","navigatedDayRef","calculateRoundedStyles","weeks","classNames","day","dayIndex","weekIndex","weekCorners","ariaHidden","customDayCellRef","dateRangeType","daysToSelectInDayView","onSelectDate","restrictedDates","minDate","maxDate","onNavigateDate","getDayInfosInRangeOfDay","getRefsFromDayInfos","cornerStyle","isNavigatedDate","originalDate","dir","navigateMonthEdge","ev","date","targetDate","undefined","direction","key","findAvailableDateOptions","initialDate","nextDate","isInCurrentView","slice","length","some","week","dayToCompare","preventDefault","onMouseOverDay","dayInfos","dayRefs","forEach","dayRef","index","classList","add","hoverStyle","isSelected","Day","remove","bottomLeftCornerDate","bottomRightCornerDate","topLeftCornerDate","topRightCornerDate","classNamesToAdd","trim","split","onMouseDownDay","pressedStyle","onMouseUpDay","onMouseOutDay","onDayKeyDown","ariaLabel","getDate","months","getMonth","getFullYear","isMarked","dayMarkedAriaLabel","isFocusable","isInBounds","td","className","dayCell","daySelected","dayOutsideBounds","isInMonth","dayOutsideNavigatedMonth","ref","element","setRef","current","aria-hidden","aria-disabled","onClick","onSelected","onMouseOver","onMouseDown","onMouseUp","onMouseOut","onKeyDown","role","tabIndex","aria-current","isToday","aria-selected","button","dayButton","dayIsToday","aria-label","id","disabled","type","span","formatDay","div","dayMarker"],"mappings":"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"}
+{"version":3,"sources":["CalendarGridDayCell.tsx"],"sourcesContent":["import * as React from 'react';\nimport { ArrowDown, ArrowLeft, ArrowRight, ArrowUp, Enter } from '@fluentui/keyboard-keys';\nimport { getRTLSafeKey } from '@fluentui/react-utilities';\nimport { useFluent_unstable } from '@fluentui/react-shared-contexts';\nimport { mergeClasses } from '@griffel/react';\nimport { addDays, addWeeks, compareDates, findAvailableDate, DateRangeType } from '../../utils';\nimport { weekCornersClassNames } from './useWeekCornerStyles.styles';\nimport { extraCalendarDayGridClassNames } from './useCalendarDayGridStyles.styles';\nimport type { AvailableDateOptions } from '../../utils';\nimport type { DayInfo } from './CalendarDayGrid';\nimport type { CalendarGridRowProps } from './CalendarGridRow';\n\n/**\n * @internal\n */\nexport interface CalendarGridDayCellProps extends CalendarGridRowProps {\n  day: DayInfo;\n  dayIndex: number;\n}\n\n/**\n * @internal\n */\nexport const CalendarGridDayCell: React.FunctionComponent<CalendarGridDayCellProps> = props => {\n  const {\n    navigatedDate,\n    dateTimeFormatter,\n    allFocusable,\n    strings,\n    activeDescendantId,\n    navigatedDayRef,\n    calculateRoundedStyles,\n    weeks,\n    classNames,\n    day,\n    dayIndex,\n    weekIndex,\n    weekCorners,\n    ariaHidden,\n    customDayCellRef,\n    dateRangeType,\n    daysToSelectInDayView,\n    onSelectDate,\n    restrictedDates,\n    minDate,\n    maxDate,\n    onNavigateDate,\n    getDayInfosInRangeOfDay,\n    getRefsFromDayInfos,\n  } = props;\n  const cornerStyle = weekCorners?.[weekIndex + '_' + dayIndex] ?? '';\n  const isNavigatedDate = compareDates(navigatedDate, day.originalDate);\n\n  const { dir } = useFluent_unstable();\n\n  const navigateMonthEdge = (ev: React.KeyboardEvent<HTMLElement>, date: Date): void => {\n    let targetDate: Date | undefined = undefined;\n    let direction = 1; // by default search forward\n\n    if (ev.key === ArrowUp) {\n      targetDate = addWeeks(date, -1);\n      direction = -1;\n    } else if (ev.key === ArrowDown) {\n      targetDate = addWeeks(date, 1);\n    } else if (ev.key === getRTLSafeKey(ArrowLeft, dir)) {\n      targetDate = addDays(date, -1);\n      direction = -1;\n    } else if (ev.key === getRTLSafeKey(ArrowRight, dir)) {\n      targetDate = addDays(date, 1);\n    }\n\n    if (!targetDate) {\n      // if we couldn't find a target date at all, do nothing\n      return;\n    }\n\n    const findAvailableDateOptions: AvailableDateOptions = {\n      initialDate: date,\n      targetDate,\n      direction,\n      restrictedDates,\n      minDate,\n      maxDate,\n    };\n\n    // target date is restricted, search in whatever direction until finding the next possible date,\n    // stopping at boundaries\n    let nextDate = findAvailableDate(findAvailableDateOptions);\n\n    if (!nextDate) {\n      // if no dates available in initial direction, try going backwards\n      findAvailableDateOptions.direction = -direction;\n      nextDate = findAvailableDate(findAvailableDateOptions);\n    }\n\n    // if the nextDate is still inside the same focusZone area, let the focusZone handle setting the focus so we\n    // don't jump the view unnecessarily\n    const isInCurrentView =\n      weeks &&\n      nextDate &&\n      weeks.slice(1, weeks.length - 1).some((week: DayInfo[]) => {\n        return week.some((dayToCompare: DayInfo) => {\n          return compareDates(dayToCompare.originalDate, nextDate!);\n        });\n      });\n    if (isInCurrentView) {\n      return;\n    }\n\n    // else, fire navigation on the date to change the view to show it\n    if (nextDate) {\n      onNavigateDate(nextDate, true);\n      ev.preventDefault();\n    }\n  };\n\n  const onMouseOverDay = (ev: React.MouseEvent<HTMLElement>) => {\n    const dayInfos = getDayInfosInRangeOfDay(day);\n    const dayRefs = getRefsFromDayInfos(dayInfos);\n\n    dayRefs.forEach((dayRef: HTMLElement | null, index: number) => {\n      if (dayRef) {\n        dayRef.classList.add(extraCalendarDayGridClassNames.hoverStyle);\n        if (\n          !dayInfos[index].isSelected &&\n          dateRangeType === DateRangeType.Day &&\n          daysToSelectInDayView &&\n          daysToSelectInDayView > 1\n        ) {\n          // remove the static classes first to overwrite them\n          dayRef.classList.remove(\n            weekCornersClassNames.bottomLeftCornerDate!,\n            weekCornersClassNames.bottomRightCornerDate!,\n            weekCornersClassNames.topLeftCornerDate!,\n            weekCornersClassNames.topRightCornerDate!,\n          );\n\n          const classNamesToAdd = calculateRoundedStyles(false, false, index > 0, index < dayRefs.length - 1).trim();\n          if (classNamesToAdd) {\n            dayRef.classList.add(...classNamesToAdd.trim().split(' '));\n          }\n        }\n      }\n    });\n  };\n\n  const onMouseDownDay = (ev: React.MouseEvent<HTMLElement>) => {\n    const dayInfos = getDayInfosInRangeOfDay(day);\n    const dayRefs = getRefsFromDayInfos(dayInfos);\n\n    dayRefs.forEach((dayRef: HTMLElement | null) => {\n      if (dayRef) {\n        dayRef.classList.add(extraCalendarDayGridClassNames.pressedStyle);\n      }\n    });\n  };\n\n  const onMouseUpDay = (ev: React.MouseEvent<HTMLElement>) => {\n    const dayInfos = getDayInfosInRangeOfDay(day);\n    const dayRefs = getRefsFromDayInfos(dayInfos);\n\n    dayRefs.forEach((dayRef: HTMLElement | null) => {\n      if (dayRef) {\n        dayRef.classList.remove(extraCalendarDayGridClassNames.pressedStyle);\n      }\n    });\n  };\n\n  const onMouseOutDay = (ev: React.MouseEvent<HTMLElement>) => {\n    const dayInfos = getDayInfosInRangeOfDay(day);\n    const dayRefs = getRefsFromDayInfos(dayInfos);\n\n    dayRefs.forEach((dayRef: HTMLElement | null, index: number) => {\n      if (dayRef) {\n        dayRef.classList.remove(extraCalendarDayGridClassNames.hoverStyle);\n        dayRef.classList.remove(extraCalendarDayGridClassNames.pressedStyle);\n        if (\n          !dayInfos[index].isSelected &&\n          dateRangeType === DateRangeType.Day &&\n          daysToSelectInDayView &&\n          daysToSelectInDayView > 1\n        ) {\n          const classNamesToAdd = calculateRoundedStyles(false, false, index > 0, index < dayRefs.length - 1).trim();\n          if (classNamesToAdd) {\n            dayRef.classList.remove(...classNamesToAdd.trim().split(' '));\n          }\n        }\n      }\n    });\n  };\n\n  const onDayKeyDown = (ev: React.KeyboardEvent<HTMLElement>): void => {\n    if (ev.key === Enter) {\n      onSelectDate?.(day.originalDate);\n    } else {\n      navigateMonthEdge(ev, day.originalDate);\n    }\n  };\n\n  let ariaLabel =\n    day.originalDate.getDate() +\n    ', ' +\n    strings.months[day.originalDate.getMonth()] +\n    ', ' +\n    day.originalDate.getFullYear();\n\n  if (day.isMarked) {\n    ariaLabel = ariaLabel + ', ' + strings.dayMarkedAriaLabel;\n  }\n\n  const isFocusable = !ariaHidden && (allFocusable || (day.isInBounds ? true : undefined));\n\n  return (\n    <td\n      className={mergeClasses(\n        classNames.dayCell,\n        weekCorners && cornerStyle,\n        day.isSelected && !day.isSingleSelected && classNames.daySelected,\n        day.isSingleSelected && classNames.daySingleSelected,\n        !day.isInBounds && classNames.dayOutsideBounds,\n        !day.isInMonth && classNames.dayOutsideNavigatedMonth,\n      )}\n      ref={(element: HTMLTableCellElement) => {\n        customDayCellRef?.(element, day.originalDate, classNames);\n        day.setRef(element);\n        isNavigatedDate && (navigatedDayRef.current = element);\n      }}\n      aria-hidden={ariaHidden}\n      aria-disabled={!ariaHidden && !day.isInBounds}\n      onClick={day.isInBounds && !ariaHidden ? day.onSelected : undefined}\n      onMouseOver={!ariaHidden ? onMouseOverDay : undefined}\n      onMouseDown={!ariaHidden ? onMouseDownDay : undefined}\n      onMouseUp={!ariaHidden ? onMouseUpDay : undefined}\n      onMouseOut={!ariaHidden ? onMouseOutDay : undefined}\n      onKeyDown={!ariaHidden ? onDayKeyDown : undefined}\n      role=\"gridcell\"\n      tabIndex={isNavigatedDate || isFocusable ? 0 : undefined}\n      aria-current={day.isToday ? 'date' : undefined}\n      aria-selected={day.isInBounds ? day.isSelected : undefined}\n    >\n      <button\n        key={day.key + 'button'}\n        aria-hidden={ariaHidden}\n        className={mergeClasses(classNames.dayButton, day.isToday && classNames.dayIsToday)}\n        aria-label={ariaLabel}\n        id={isNavigatedDate ? activeDescendantId : undefined}\n        disabled={!ariaHidden && !day.isInBounds}\n        type=\"button\"\n        tabIndex={-1}\n      >\n        <span className={day.isToday ? mergeClasses(classNames.dayTodayMarker) : undefined} aria-hidden=\"true\">\n          {dateTimeFormatter.formatDay(day.originalDate)}\n        </span>\n        {day.isMarked && <div aria-hidden=\"true\" className={classNames.dayMarker} />}\n      </button>\n    </td>\n  );\n};\n"],"names":["React","ArrowDown","ArrowLeft","ArrowRight","ArrowUp","Enter","getRTLSafeKey","useFluent_unstable","mergeClasses","addDays","addWeeks","compareDates","findAvailableDate","DateRangeType","weekCornersClassNames","extraCalendarDayGridClassNames","CalendarGridDayCell","props","navigatedDate","dateTimeFormatter","allFocusable","strings","activeDescendantId","navigatedDayRef","calculateRoundedStyles","weeks","classNames","day","dayIndex","weekIndex","weekCorners","ariaHidden","customDayCellRef","dateRangeType","daysToSelectInDayView","onSelectDate","restrictedDates","minDate","maxDate","onNavigateDate","getDayInfosInRangeOfDay","getRefsFromDayInfos","cornerStyle","isNavigatedDate","originalDate","dir","navigateMonthEdge","ev","date","targetDate","undefined","direction","key","findAvailableDateOptions","initialDate","nextDate","isInCurrentView","slice","length","some","week","dayToCompare","preventDefault","onMouseOverDay","dayInfos","dayRefs","forEach","dayRef","index","classList","add","hoverStyle","isSelected","Day","remove","bottomLeftCornerDate","bottomRightCornerDate","topLeftCornerDate","topRightCornerDate","classNamesToAdd","trim","split","onMouseDownDay","pressedStyle","onMouseUpDay","onMouseOutDay","onDayKeyDown","ariaLabel","getDate","months","getMonth","getFullYear","isMarked","dayMarkedAriaLabel","isFocusable","isInBounds","td","className","dayCell","isSingleSelected","daySelected","daySingleSelected","dayOutsideBounds","isInMonth","dayOutsideNavigatedMonth","ref","element","setRef","current","aria-hidden","aria-disabled","onClick","onSelected","onMouseOver","onMouseDown","onMouseUp","onMouseOut","onKeyDown","role","tabIndex","aria-current","isToday","aria-selected","button","dayButton","dayIsToday","aria-label","id","disabled","type","span","dayTodayMarker","formatDay","div","dayMarker"],"mappings":"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"}