@fluentui/react-calendar-compat 0.4.1 → 0.4.2

package/CHANGELOG.md

@@ -1,19 +1,30 @@
 # Change Log - @fluentui/react-calendar-compat
 
-This log was last generated on Thu, 23 Apr 2026 11:59:55 GMT and should not be manually modified.
+This log was last generated on Tue, 26 May 2026 09:34:08 GMT and should not be manually modified.
 
 <!-- Start content -->
 
+## [0.4.2](https://github.com/microsoft/fluentui/tree/@fluentui/react-calendar-compat_v0.4.2)
+
+Tue, 26 May 2026 09:34:08 GMT 
+[Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-calendar-compat_v0.4.1..@fluentui/react-calendar-compat_v0.4.2)
+
+### Patches
+
+- Bump @fluentui/react-jsx-runtime to v9.4.3 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
+- Bump @fluentui/react-tabster to v9.26.15 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
+- Bump @fluentui/react-utilities to v9.26.4 ([PR #36246](https://github.com/microsoft/fluentui/pull/36246) by beachball)
+
 ## [0.4.1](https://github.com/microsoft/fluentui/tree/@fluentui/react-calendar-compat_v0.4.1)
 
-Thu, 23 Apr 2026 11:59:55 GMT 
+Thu, 23 Apr 2026 14:21:18 GMT 
 [Compare changes](https://github.com/microsoft/fluentui/compare/@fluentui/react-calendar-compat_v0.4.0..@fluentui/react-calendar-compat_v0.4.1)
 
 ### Patches
 
-- Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
-- Bump @fluentui/react-tabster to v9.26.14 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
-- Bump @fluentui/react-utilities to v9.26.3 ([PR #35996](https://github.com/microsoft/fluentui/pull/35996) by beachball)
+- Bump @fluentui/react-jsx-runtime to v9.4.2 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
+- Bump @fluentui/react-tabster to v9.26.14 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
+- Bump @fluentui/react-utilities to v9.26.3 ([PR #36035](https://github.com/microsoft/fluentui/pull/36035) by beachball)
 
 ## [0.4.0](https://github.com/microsoft/fluentui/tree/@fluentui/react-calendar-compat_v0.4.0)
 

package/lib/components/CalendarDayGrid/CalendarDayGrid.js

@@ -29,8 +29,10 @@ function useAnimateBackwards(weeks) {
         previousNavigatedDateRef.current = weeks[0][0].originalDate;
     });
     const previousNavigatedDate = previousNavigatedDateRef.current;
+    // eslint-disable-next-line react-hooks/refs
     if (!previousNavigatedDate || previousNavigatedDate.getTime() === weeks[0][0].originalDate.getTime()) {
         return undefined;
+    // eslint-disable-next-line react-hooks/refs
     } else if (previousNavigatedDate <= weeks[0][0].originalDate) {
         return false;
     } else {
@@ -48,6 +50,7 @@ export const CalendarDayGrid = (props)=>{
             maxDate,
             restrictedDates
         };
+        // eslint-disable-next-line react-hooks/immutability
         let dateRange = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek, workWeekDays, daysToSelectInDayView);
         dateRange = getBoundedDateRange(dateRange, minDate, maxDate);
         dateRange = dateRange.filter((d)=>{

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

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CalendarDayGrid/CalendarDayGrid.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { useId } from '@fluentui/react-utilities';\nimport { getBoundedDateRange, getDateRangeArray, isRestrictedDate, DateRangeType } from '../../utils';\nimport { useCalendarDayGridStyles_unstable } from './useCalendarDayGridStyles.styles';\nimport { CalendarMonthHeaderRow } from './CalendarMonthHeaderRow';\nimport { CalendarGridRow } from './CalendarGridRow';\nimport { useWeeks } from './useWeeks';\nimport type { WeekCorners } from './useWeekCornerStyles.styles';\nimport { useWeekCornerStyles } from './useWeekCornerStyles.styles';\nimport { mergeClasses } from '@griffel/react';\nimport type { Day, DayOfWeek } from '../../utils';\nimport type { CalendarDayGridProps } from './CalendarDayGrid.types';\n\nexport interface DayInfo extends Day {\n  onSelected: () => void;\n  setRef(element: HTMLElement | null): void;\n}\n\nfunction useDayRefs() {\n  const daysRef = React.useRef<Record<string, HTMLElement>>({});\n\n  const getSetRefCallback = (dayKey: string) => (element: HTMLElement | null) => {\n    if (element === null) {\n      delete daysRef.current[dayKey];\n    } else {\n      daysRef.current[dayKey] = element;\n    }\n  };\n\n  return [daysRef, getSetRefCallback] as const;\n}\n\nfunction useAnimateBackwards(weeks: DayInfo[][]): boolean | undefined {\n  const previousNavigatedDateRef = React.useRef<Date | undefined>(undefined);\n  React.useEffect(() => {\n    previousNavigatedDateRef.current = weeks[0][0].originalDate;\n  });\n  const previousNavigatedDate = previousNavigatedDateRef.current;\n\n  if (!previousNavigatedDate || previousNavigatedDate.getTime() === weeks[0][0].originalDate.getTime()) {\n    return undefined;\n  } else if (previousNavigatedDate <= weeks[0][0].originalDate) {\n    return false;\n  } else {\n    return true;\n  }\n}\n\nexport const CalendarDayGrid: React.FunctionComponent<CalendarDayGridProps> = props => {\n  const navigatedDayRef = React.useRef<HTMLTableCellElement>(\n    null,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ) as React.MutableRefObject<HTMLTableCellElement | null>;\n\n  const activeDescendantId = useId();\n\n  const onSelectDate = (selectedDate: Date): void => {\n    const { firstDayOfWeek, minDate, maxDate, workWeekDays, daysToSelectInDayView, restrictedDates } = props;\n    const restrictedDatesOptions = { minDate, maxDate, restrictedDates };\n\n    let dateRange = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek, workWeekDays, daysToSelectInDayView);\n    dateRange = getBoundedDateRange(dateRange, minDate, maxDate);\n\n    dateRange = dateRange.filter((d: Date) => {\n      return !isRestrictedDate(d, restrictedDatesOptions);\n    });\n\n    props.onSelectDate?.(selectedDate, dateRange);\n    props.onNavigateDate?.(selectedDate, true);\n  };\n\n  const [daysRef, getSetRefCallback] = useDayRefs();\n\n  const weeks = useWeeks(props, onSelectDate, getSetRefCallback);\n  const animateBackwards = useAnimateBackwards(weeks);\n  const [getWeekCornerStyles, calculateRoundedStyles] = useWeekCornerStyles(props);\n\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      focus() {\n        navigatedDayRef.current?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  /**\n   *\n   * Section for setting hover/pressed styles. Because we want arbitrary blobs of days to be selectable, to support\n   * highlighting every day in the month for month view, css :hover style isn't enough, so we need mouse callbacks\n   * to set classnames on all relevant child refs to apply the styling\n   *\n   */\n  const getDayInfosInRangeOfDay = (dayToCompare: DayInfo): DayInfo[] => {\n    // The hover state looks weird with non-contiguous days in work week view. In work week, show week hover state\n    const dateRangeHoverType = getDateRangeTypeToUse(props.dateRangeType, props.workWeekDays);\n\n    // gets all the dates for the given date range type that are in the same date range as the given day\n    const dateRange = getDateRangeArray(\n      dayToCompare.originalDate,\n      dateRangeHoverType,\n      props.firstDayOfWeek,\n      props.workWeekDays,\n      props.daysToSelectInDayView,\n    ).map((date: Date) => date.getTime());\n\n    // gets all the day refs for the given dates\n    const dayInfosInRange = weeks.reduce((accumulatedValue: DayInfo[], currentWeek: DayInfo[]) => {\n      return accumulatedValue.concat(\n        currentWeek.filter((weekDay: DayInfo) => dateRange.indexOf(weekDay.originalDate.getTime()) !== -1),\n      );\n    }, []);\n\n    return dayInfosInRange;\n  };\n\n  const getRefsFromDayInfos = (dayInfosInRange: DayInfo[]): (HTMLElement | null)[] => {\n    let dayRefs: (HTMLElement | null)[] = [];\n    dayRefs = dayInfosInRange.map((dayInfo: DayInfo) => daysRef.current[dayInfo.key]);\n\n    return dayRefs;\n  };\n\n  const {\n    gridLabel,\n    dateRangeType,\n    showWeekNumbers,\n    labelledBy,\n    lightenDaysOutsideNavigatedMonth,\n    animationDirection,\n  } = props;\n\n  const classNames = useCalendarDayGridStyles_unstable({\n    animateBackwards,\n    animationDirection,\n    dateRangeType,\n    lightenDaysOutsideNavigatedMonth:\n      lightenDaysOutsideNavigatedMonth === undefined ? true : lightenDaysOutsideNavigatedMonth,\n    showWeekNumbers,\n  });\n\n  // When the month is highlighted get the corner dates so that styles can be added to them\n  const weekCorners: WeekCorners = getWeekCornerStyles(weeks!);\n  const partialWeekProps = {\n    weeks,\n    navigatedDayRef,\n    calculateRoundedStyles,\n    activeDescendantId,\n    classNames,\n    weekCorners,\n    getDayInfosInRangeOfDay,\n    getRefsFromDayInfos,\n  } as const;\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid-linear' });\n\n  return (\n    <table\n      className={mergeClasses(classNames.table, props.className)}\n      aria-multiselectable=\"false\"\n      aria-label={gridLabel}\n      aria-labelledby={labelledBy}\n      aria-activedescendant={activeDescendantId}\n      role=\"grid\"\n      {...arrowNavigationAttributes}\n    >\n      <tbody>\n        <CalendarMonthHeaderRow {...props} classNames={classNames} weeks={weeks} />\n        <CalendarGridRow\n          {...props}\n          {...partialWeekProps}\n          week={weeks[0]}\n          weekIndex={-1}\n          rowClassName={classNames.firstTransitionWeek}\n          aria-role=\"presentation\"\n          ariaHidden={true}\n        />\n        {weeks!.slice(1, weeks!.length - 1).map((week: DayInfo[], weekIndex: number) => (\n          <CalendarGridRow\n            {...props}\n            {...partialWeekProps}\n            key={weekIndex}\n            week={week}\n            weekIndex={weekIndex}\n            rowClassName={classNames.weekRow}\n          />\n        ))}\n        <CalendarGridRow\n          {...props}\n          {...partialWeekProps}\n          week={weeks![weeks!.length - 1]}\n          weekIndex={-2}\n          rowClassName={classNames.lastTransitionWeek}\n          aria-role=\"presentation\"\n          ariaHidden={true}\n        />\n      </tbody>\n    </table>\n  );\n};\nCalendarDayGrid.displayName = 'CalendarDayGrid';\n\n/**\n * When given work week, if the days are non-contiguous, the hover states look really weird. So for non-contiguous\n * work weeks, we'll just show week view instead.\n */\nfunction getDateRangeTypeToUse(dateRangeType: DateRangeType, workWeekDays: DayOfWeek[] | undefined): DateRangeType {\n  if (workWeekDays && dateRangeType === DateRangeType.WorkWeek) {\n    const sortedWWDays = workWeekDays.slice().sort();\n    let isContiguous = true;\n    for (let i = 1; i < sortedWWDays.length; i++) {\n      if (sortedWWDays[i] !== sortedWWDays[i - 1] + 1) {\n        isContiguous = false;\n        break;\n      }\n    }\n\n    if (!isContiguous || workWeekDays.length === 0) {\n      return DateRangeType.Week;\n    }\n  }\n\n  return dateRangeType;\n}\n"],"names":["React","useArrowNavigationGroup","useId","getBoundedDateRange","getDateRangeArray","isRestrictedDate","DateRangeType","useCalendarDayGridStyles_unstable","CalendarMonthHeaderRow","CalendarGridRow","useWeeks","useWeekCornerStyles","mergeClasses","useDayRefs","daysRef","useRef","getSetRefCallback","dayKey","element","current","useAnimateBackwards","weeks","previousNavigatedDateRef","undefined","useEffect","originalDate","previousNavigatedDate","getTime","CalendarDayGrid","props","navigatedDayRef","activeDescendantId","onSelectDate","selectedDate","firstDayOfWeek","minDate","maxDate","workWeekDays","daysToSelectInDayView","restrictedDates","restrictedDatesOptions","dateRange","dateRangeType","filter","d","onNavigateDate","animateBackwards","getWeekCornerStyles","calculateRoundedStyles","useImperativeHandle","componentRef","focus","getDayInfosInRangeOfDay","dayToCompare","dateRangeHoverType","getDateRangeTypeToUse","map","date","dayInfosInRange","reduce","accumulatedValue","currentWeek","concat","weekDay","indexOf","getRefsFromDayInfos","dayRefs","dayInfo","key","gridLabel","showWeekNumbers","labelledBy","lightenDaysOutsideNavigatedMonth","animationDirection","classNames","weekCorners","partialWeekProps","arrowNavigationAttributes","axis","table","className","aria-multiselectable","aria-label","aria-labelledby","aria-activedescendant","role","tbody","week","weekIndex","rowClassName","firstTransitionWeek","aria-role","ariaHidden","slice","length","weekRow","lastTransitionWeek","displayName","WorkWeek","sortedWWDays","sort","isContiguous","i","Week"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SAASC,KAAK,QAAQ,4BAA4B;AAClD,SAASC,mBAAmB,EAAEC,iBAAiB,EAAEC,gBAAgB,EAAEC,aAAa,QAAQ,cAAc;AACtG,SAASC,iCAAiC,QAAQ,oCAAoC;AACtF,SAASC,sBAAsB,QAAQ,2BAA2B;AAClE,SAASC,eAAe,QAAQ,oBAAoB;AACpD,SAASC,QAAQ,QAAQ,aAAa;AAEtC,SAASC,mBAAmB,QAAQ,+BAA+B;AACnE,SAASC,YAAY,QAAQ,iBAAiB;AAS9C,SAASC;IACP,MAAMC,UAAUd,MAAMe,MAAM,CAA8B,CAAC;IAE3D,MAAMC,oBAAoB,CAACC,SAAmB,CAACC;YAC7C,IAAIA,YAAY,MAAM;gBACpB,OAAOJ,QAAQK,OAAO,CAACF,OAAO;YAChC,OAAO;gBACLH,QAAQK,OAAO,CAACF,OAAO,GAAGC;YAC5B;QACF;IAEA,OAAO;QAACJ;QAASE;KAAkB;AACrC;AAEA,SAASI,oBAAoBC,KAAkB;IAC7C,MAAMC,2BAA2BtB,MAAMe,MAAM,CAAmBQ;IAChEvB,MAAMwB,SAAS,CAAC;QACdF,yBAAyBH,OAAO,GAAGE,KAAK,CAAC,EAAE,CAAC,EAAE,CAACI,YAAY;IAC7D;IACA,MAAMC,wBAAwBJ,yBAAyBH,OAAO;IAE9D,IAAI,CAACO,yBAAyBA,sBAAsBC,OAAO,OAAON,KAAK,CAAC,EAAE,CAAC,EAAE,CAACI,YAAY,CAACE,OAAO,IAAI;QACpG,OAAOJ;IACT,OAAO,IAAIG,yBAAyBL,KAAK,CAAC,EAAE,CAAC,EAAE,CAACI,YAAY,EAAE;QAC5D,OAAO;IACT,OAAO;QACL,OAAO;IACT;AACF;AAEA,OAAO,MAAMG,kBAAiEC,CAAAA;IAC5E,MAAMC,kBAAkB9B,MAAMe,MAAM,CAClC;IAIF,MAAMgB,qBAAqB7B;IAE3B,MAAM8B,eAAe,CAACC;YAWpBJ,qBACAA;QAXA,MAAM,EAAEK,cAAc,EAAEC,OAAO,EAAEC,OAAO,EAAEC,YAAY,EAAEC,qBAAqB,EAAEC,eAAe,EAAE,GAAGV;QACnG,MAAMW,yBAAyB;YAAEL;YAASC;YAASG;QAAgB;QAEnE,IAAIE,YAAYrC,kBAAkB6B,cAAcS,eAAeR,gBAAgBG,cAAcC;QAC7FG,YAAYtC,oBAAoBsC,WAAWN,SAASC;QAEpDK,YAAYA,UAAUE,MAAM,CAAC,CAACC;YAC5B,OAAO,CAACvC,iBAAiBuC,GAAGJ;QAC9B;SAEAX,sBAAAA,MAAMG,YAAY,cAAlBH,0CAAAA,yBAAAA,OAAqBI,cAAcQ;SACnCZ,wBAAAA,MAAMgB,cAAc,cAApBhB,4CAAAA,2BAAAA,OAAuBI,cAAc;IACvC;IAEA,MAAM,CAACnB,SAASE,kBAAkB,GAAGH;IAErC,MAAMQ,QAAQX,SAASmB,OAAOG,cAAchB;IAC5C,MAAM8B,mBAAmB1B,oBAAoBC;IAC7C,MAAM,CAAC0B,qBAAqBC,uBAAuB,GAAGrC,oBAAoBkB;IAE1E7B,MAAMiD,mBAAmB,CACvBpB,MAAMqB,YAAY,EAClB,IAAO,CAAA;YACLC;oBACErB,gCAAAA;iBAAAA,2BAAAA,gBAAgBX,OAAO,cAAvBW,gDAAAA,iCAAAA,yBAAyBqB,KAAK,cAA9BrB,qDAAAA,oCAAAA;YACF;QACF,CAAA,GACA,EAAE;IAGJ;;;;;;GAMC,GACD,MAAMsB,0BAA0B,CAACC;QAC/B,8GAA8G;QAC9G,MAAMC,qBAAqBC,sBAAsB1B,MAAMa,aAAa,EAAEb,MAAMQ,YAAY;QAExF,oGAAoG;QACpG,MAAMI,YAAYrC,kBAChBiD,aAAa5B,YAAY,EACzB6B,oBACAzB,MAAMK,cAAc,EACpBL,MAAMQ,YAAY,EAClBR,MAAMS,qBAAqB,EAC3BkB,GAAG,CAAC,CAACC,OAAeA,KAAK9B,OAAO;QAElC,4CAA4C;QAC5C,MAAM+B,kBAAkBrC,MAAMsC,MAAM,CAAC,CAACC,kBAA6BC;YACjE,OAAOD,iBAAiBE,MAAM,CAC5BD,YAAYlB,MAAM,CAAC,CAACoB,UAAqBtB,UAAUuB,OAAO,CAACD,QAAQtC,YAAY,CAACE,OAAO,QAAQ,CAAC;QAEpG,GAAG,EAAE;QAEL,OAAO+B;IACT;IAEA,MAAMO,sBAAsB,CAACP;QAC3B,IAAIQ,UAAkC,EAAE;QACxCA,UAAUR,gBAAgBF,GAAG,CAAC,CAACW,UAAqBrD,QAAQK,OAAO,CAACgD,QAAQC,GAAG,CAAC;QAEhF,OAAOF;IACT;IAEA,MAAM,EACJG,SAAS,EACT3B,aAAa,EACb4B,eAAe,EACfC,UAAU,EACVC,gCAAgC,EAChCC,kBAAkB,EACnB,GAAG5C;IAEJ,MAAM6C,aAAanE,kCAAkC;QACnDuC;QACA2B;QACA/B;QACA8B,kCACEA,qCAAqCjD,YAAY,OAAOiD;QAC1DF;IACF;IAEA,yFAAyF;IACzF,MAAMK,cAA2B5B,oBAAoB1B;IACrD,MAAMuD,mBAAmB;QACvBvD;QACAS;QACAkB;QACAjB;QACA2C;QACAC;QACAvB;QACAa;IACF;IAEA,MAAMY,4BAA4B5E,wBAAwB;QAAE6E,MAAM;IAAc;IAEhF,qBACE,oBAACC;QACCC,WAAWpE,aAAa8D,WAAWK,KAAK,EAAElD,MAAMmD,SAAS;QACzDC,wBAAqB;QACrBC,cAAYb;QACZc,mBAAiBZ;QACjBa,yBAAuBrD;QACvBsD,MAAK;QACJ,GAAGR,yBAAyB;qBAE7B,oBAACS,6BACC,oBAAC9E;QAAwB,GAAGqB,KAAK;QAAE6C,YAAYA;QAAYrD,OAAOA;sBAClE,oBAACZ;QACE,GAAGoB,KAAK;QACR,GAAG+C,gBAAgB;QACpBW,MAAMlE,KAAK,CAAC,EAAE;QACdmE,WAAW,CAAC;QACZC,cAAcf,WAAWgB,mBAAmB;QAC5CC,aAAU;QACVC,YAAY;QAEbvE,MAAOwE,KAAK,CAAC,GAAGxE,MAAOyE,MAAM,GAAG,GAAGtC,GAAG,CAAC,CAAC+B,MAAiBC,0BACxD,oBAAC/E;YACE,GAAGoB,KAAK;YACR,GAAG+C,gBAAgB;YACpBR,KAAKoB;YACLD,MAAMA;YACNC,WAAWA;YACXC,cAAcf,WAAWqB,OAAO;2BAGpC,oBAACtF;QACE,GAAGoB,KAAK;QACR,GAAG+C,gBAAgB;QACpBW,MAAMlE,KAAM,CAACA,MAAOyE,MAAM,GAAG,EAAE;QAC/BN,WAAW,CAAC;QACZC,cAAcf,WAAWsB,kBAAkB;QAC3CL,aAAU;QACVC,YAAY;;AAKtB,EAAE;AACFhE,gBAAgBqE,WAAW,GAAG;AAE9B;;;CAGC,GACD,SAAS1C,sBAAsBb,aAA4B,EAAEL,YAAqC;IAChG,IAAIA,gBAAgBK,kBAAkBpC,cAAc4F,QAAQ,EAAE;QAC5D,MAAMC,eAAe9D,aAAawD,KAAK,GAAGO,IAAI;QAC9C,IAAIC,eAAe;QACnB,IAAK,IAAIC,IAAI,GAAGA,IAAIH,aAAaL,MAAM,EAAEQ,IAAK;YAC5C,IAAIH,YAAY,CAACG,EAAE,KAAKH,YAAY,CAACG,IAAI,EAAE,GAAG,GAAG;gBAC/CD,eAAe;gBACf;YACF;QACF;QAEA,IAAI,CAACA,gBAAgBhE,aAAayD,MAAM,KAAK,GAAG;YAC9C,OAAOxF,cAAciG,IAAI;QAC3B;IACF;IAEA,OAAO7D;AACT"}
+{"version":3,"sources":["../src/components/CalendarDayGrid/CalendarDayGrid.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { useId } from '@fluentui/react-utilities';\nimport { getBoundedDateRange, getDateRangeArray, isRestrictedDate, DateRangeType } from '../../utils';\nimport { useCalendarDayGridStyles_unstable } from './useCalendarDayGridStyles.styles';\nimport { CalendarMonthHeaderRow } from './CalendarMonthHeaderRow';\nimport { CalendarGridRow } from './CalendarGridRow';\nimport { useWeeks } from './useWeeks';\nimport type { WeekCorners } from './useWeekCornerStyles.styles';\nimport { useWeekCornerStyles } from './useWeekCornerStyles.styles';\nimport { mergeClasses } from '@griffel/react';\nimport type { Day, DayOfWeek } from '../../utils';\nimport type { CalendarDayGridProps } from './CalendarDayGrid.types';\n\nexport interface DayInfo extends Day {\n  onSelected: () => void;\n  setRef(element: HTMLElement | null): void;\n}\n\nfunction useDayRefs() {\n  const daysRef = React.useRef<Record<string, HTMLElement>>({});\n\n  const getSetRefCallback = (dayKey: string) => (element: HTMLElement | null) => {\n    if (element === null) {\n      delete daysRef.current[dayKey];\n    } else {\n      daysRef.current[dayKey] = element;\n    }\n  };\n\n  return [daysRef, getSetRefCallback] as const;\n}\n\nfunction useAnimateBackwards(weeks: DayInfo[][]): boolean | undefined {\n  const previousNavigatedDateRef = React.useRef<Date | undefined>(undefined);\n  React.useEffect(() => {\n    previousNavigatedDateRef.current = weeks[0][0].originalDate;\n  });\n  const previousNavigatedDate = previousNavigatedDateRef.current;\n\n  // eslint-disable-next-line react-hooks/refs\n  if (!previousNavigatedDate || previousNavigatedDate.getTime() === weeks[0][0].originalDate.getTime()) {\n    return undefined;\n    // eslint-disable-next-line react-hooks/refs\n  } else if (previousNavigatedDate <= weeks[0][0].originalDate) {\n    return false;\n  } else {\n    return true;\n  }\n}\n\nexport const CalendarDayGrid: React.FunctionComponent<CalendarDayGridProps> = props => {\n  const navigatedDayRef = React.useRef<HTMLTableCellElement>(\n    null,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ) as React.MutableRefObject<HTMLTableCellElement | null>;\n\n  const activeDescendantId = useId();\n\n  const onSelectDate = (selectedDate: Date): void => {\n    const { firstDayOfWeek, minDate, maxDate, workWeekDays, daysToSelectInDayView, restrictedDates } = props;\n    const restrictedDatesOptions = { minDate, maxDate, restrictedDates };\n\n    // eslint-disable-next-line react-hooks/immutability\n    let dateRange = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek, workWeekDays, daysToSelectInDayView);\n    dateRange = getBoundedDateRange(dateRange, minDate, maxDate);\n\n    dateRange = dateRange.filter((d: Date) => {\n      return !isRestrictedDate(d, restrictedDatesOptions);\n    });\n\n    props.onSelectDate?.(selectedDate, dateRange);\n    props.onNavigateDate?.(selectedDate, true);\n  };\n\n  const [daysRef, getSetRefCallback] = useDayRefs();\n\n  const weeks = useWeeks(props, onSelectDate, getSetRefCallback);\n  const animateBackwards = useAnimateBackwards(weeks);\n  const [getWeekCornerStyles, calculateRoundedStyles] = useWeekCornerStyles(props);\n\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      focus() {\n        navigatedDayRef.current?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  /**\n   *\n   * Section for setting hover/pressed styles. Because we want arbitrary blobs of days to be selectable, to support\n   * highlighting every day in the month for month view, css :hover style isn't enough, so we need mouse callbacks\n   * to set classnames on all relevant child refs to apply the styling\n   *\n   */\n  const getDayInfosInRangeOfDay = (dayToCompare: DayInfo): DayInfo[] => {\n    // The hover state looks weird with non-contiguous days in work week view. In work week, show week hover state\n    const dateRangeHoverType = getDateRangeTypeToUse(props.dateRangeType, props.workWeekDays);\n\n    // gets all the dates for the given date range type that are in the same date range as the given day\n    const dateRange = getDateRangeArray(\n      dayToCompare.originalDate,\n      dateRangeHoverType,\n      props.firstDayOfWeek,\n      props.workWeekDays,\n      props.daysToSelectInDayView,\n    ).map((date: Date) => date.getTime());\n\n    // gets all the day refs for the given dates\n    const dayInfosInRange = weeks.reduce((accumulatedValue: DayInfo[], currentWeek: DayInfo[]) => {\n      return accumulatedValue.concat(\n        currentWeek.filter((weekDay: DayInfo) => dateRange.indexOf(weekDay.originalDate.getTime()) !== -1),\n      );\n    }, []);\n\n    return dayInfosInRange;\n  };\n\n  const getRefsFromDayInfos = (dayInfosInRange: DayInfo[]): (HTMLElement | null)[] => {\n    let dayRefs: (HTMLElement | null)[] = [];\n    dayRefs = dayInfosInRange.map((dayInfo: DayInfo) => daysRef.current[dayInfo.key]);\n\n    return dayRefs;\n  };\n\n  const {\n    gridLabel,\n    dateRangeType,\n    showWeekNumbers,\n    labelledBy,\n    lightenDaysOutsideNavigatedMonth,\n    animationDirection,\n  } = props;\n\n  const classNames = useCalendarDayGridStyles_unstable({\n    animateBackwards,\n    animationDirection,\n    dateRangeType,\n    lightenDaysOutsideNavigatedMonth:\n      lightenDaysOutsideNavigatedMonth === undefined ? true : lightenDaysOutsideNavigatedMonth,\n    showWeekNumbers,\n  });\n\n  // When the month is highlighted get the corner dates so that styles can be added to them\n  const weekCorners: WeekCorners = getWeekCornerStyles(weeks!);\n  const partialWeekProps = {\n    weeks,\n    navigatedDayRef,\n    calculateRoundedStyles,\n    activeDescendantId,\n    classNames,\n    weekCorners,\n    getDayInfosInRangeOfDay,\n    getRefsFromDayInfos,\n  } as const;\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid-linear' });\n\n  return (\n    <table\n      className={mergeClasses(classNames.table, props.className)}\n      aria-multiselectable=\"false\"\n      aria-label={gridLabel}\n      aria-labelledby={labelledBy}\n      aria-activedescendant={activeDescendantId}\n      role=\"grid\"\n      {...arrowNavigationAttributes}\n    >\n      <tbody>\n        <CalendarMonthHeaderRow {...props} classNames={classNames} weeks={weeks} />\n        <CalendarGridRow\n          {...props}\n          {...partialWeekProps}\n          week={weeks[0]}\n          weekIndex={-1}\n          rowClassName={classNames.firstTransitionWeek}\n          aria-role=\"presentation\"\n          ariaHidden={true}\n        />\n        {weeks!.slice(1, weeks!.length - 1).map((week: DayInfo[], weekIndex: number) => (\n          <CalendarGridRow\n            {...props}\n            {...partialWeekProps}\n            key={weekIndex}\n            week={week}\n            weekIndex={weekIndex}\n            rowClassName={classNames.weekRow}\n          />\n        ))}\n        <CalendarGridRow\n          {...props}\n          {...partialWeekProps}\n          week={weeks![weeks!.length - 1]}\n          weekIndex={-2}\n          rowClassName={classNames.lastTransitionWeek}\n          aria-role=\"presentation\"\n          ariaHidden={true}\n        />\n      </tbody>\n    </table>\n  );\n};\nCalendarDayGrid.displayName = 'CalendarDayGrid';\n\n/**\n * When given work week, if the days are non-contiguous, the hover states look really weird. So for non-contiguous\n * work weeks, we'll just show week view instead.\n */\nfunction getDateRangeTypeToUse(dateRangeType: DateRangeType, workWeekDays: DayOfWeek[] | undefined): DateRangeType {\n  if (workWeekDays && dateRangeType === DateRangeType.WorkWeek) {\n    const sortedWWDays = workWeekDays.slice().sort();\n    let isContiguous = true;\n    for (let i = 1; i < sortedWWDays.length; i++) {\n      if (sortedWWDays[i] !== sortedWWDays[i - 1] + 1) {\n        isContiguous = false;\n        break;\n      }\n    }\n\n    if (!isContiguous || workWeekDays.length === 0) {\n      return DateRangeType.Week;\n    }\n  }\n\n  return dateRangeType;\n}\n"],"names":["React","useArrowNavigationGroup","useId","getBoundedDateRange","getDateRangeArray","isRestrictedDate","DateRangeType","useCalendarDayGridStyles_unstable","CalendarMonthHeaderRow","CalendarGridRow","useWeeks","useWeekCornerStyles","mergeClasses","useDayRefs","daysRef","useRef","getSetRefCallback","dayKey","element","current","useAnimateBackwards","weeks","previousNavigatedDateRef","undefined","useEffect","originalDate","previousNavigatedDate","getTime","CalendarDayGrid","props","navigatedDayRef","activeDescendantId","onSelectDate","selectedDate","firstDayOfWeek","minDate","maxDate","workWeekDays","daysToSelectInDayView","restrictedDates","restrictedDatesOptions","dateRange","dateRangeType","filter","d","onNavigateDate","animateBackwards","getWeekCornerStyles","calculateRoundedStyles","useImperativeHandle","componentRef","focus","getDayInfosInRangeOfDay","dayToCompare","dateRangeHoverType","getDateRangeTypeToUse","map","date","dayInfosInRange","reduce","accumulatedValue","currentWeek","concat","weekDay","indexOf","getRefsFromDayInfos","dayRefs","dayInfo","key","gridLabel","showWeekNumbers","labelledBy","lightenDaysOutsideNavigatedMonth","animationDirection","classNames","weekCorners","partialWeekProps","arrowNavigationAttributes","axis","table","className","aria-multiselectable","aria-label","aria-labelledby","aria-activedescendant","role","tbody","week","weekIndex","rowClassName","firstTransitionWeek","aria-role","ariaHidden","slice","length","weekRow","lastTransitionWeek","displayName","WorkWeek","sortedWWDays","sort","isContiguous","i","Week"],"mappings":"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"}

package/lib/components/CalendarMonth/CalendarMonth.js

@@ -13,7 +13,9 @@ function useAnimateBackwards({ navigatedDate }) {
     React.useEffect(()=>{
         previousYearRef.current = currentYear;
     });
+    // eslint-disable-next-line react-hooks/refs
     const previousYear = previousYearRef.current;
+    // eslint-disable-next-line react-hooks/refs
     if (previousYear === undefined || previousYear === currentYear) {
         return undefined;
     } else {

package/lib/components/CalendarMonth/CalendarMonth.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CalendarMonth/CalendarMonth.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Enter } from '@fluentui/keyboard-keys';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { mergeClasses } from '@griffel/react';\nimport {\n  addYears,\n  compareDatePart,\n  getMonthEnd,\n  getMonthStart,\n  getYearEnd,\n  getYearStart,\n  setMonth,\n  DEFAULT_DATE_FORMATTING,\n} from '../../utils';\nimport { CalendarYear } from '../CalendarYear/CalendarYear';\nimport { useCalendarMonthStyles_unstable } from './useCalendarMonthStyles.styles';\nimport type { CalendarMonthProps } from './CalendarMonth.types';\nimport type { CalendarYearRange, ICalendarYear } from '../CalendarYear/CalendarYear.types';\n\nconst MONTHS_PER_ROW = 4;\n\nfunction useAnimateBackwards({ navigatedDate }: { navigatedDate: CalendarMonthProps['navigatedDate'] }) {\n  const currentYear = navigatedDate.getFullYear();\n\n  const previousYearRef = React.useRef<number | undefined>(undefined);\n  React.useEffect(() => {\n    previousYearRef.current = currentYear;\n  });\n  const previousYear = previousYearRef.current;\n\n  if (previousYear === undefined || previousYear === currentYear) {\n    return undefined;\n  } else {\n    return previousYear > currentYear;\n  }\n}\n\nfunction useFocusLogic({ componentRef }: { componentRef: CalendarMonthProps['componentRef'] }) {\n  const navigatedMonthRef = React.useRef<HTMLButtonElement>(null);\n  const calendarYearRef = React.useRef<ICalendarYear>(null);\n  const focusOnUpdate = React.useRef(false);\n\n  const focus = React.useCallback(() => {\n    if (calendarYearRef.current) {\n      calendarYearRef.current.focus();\n    } else if (navigatedMonthRef.current) {\n      navigatedMonthRef.current.focus();\n    }\n  }, []);\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 [navigatedMonthRef, calendarYearRef, focusOnNextUpdate] as const;\n}\n\n/**\n * @internal\n */\nexport const CalendarMonth: React.FunctionComponent<CalendarMonthProps> = props => {\n  const {\n    allFocusable,\n    animationDirection,\n    className,\n    componentRef,\n    dateTimeFormatter = DEFAULT_DATE_FORMATTING,\n    highlightCurrentMonth,\n    highlightSelectedMonth,\n    maxDate,\n    minDate,\n    navigatedDate,\n    navigationIcons,\n    onHeaderSelect: onUserHeaderSelect,\n    onNavigateDate,\n    selectedDate,\n    strings,\n    today = new Date(),\n    yearPickerHidden = false,\n  } = props;\n\n  const [navigatedMonthRef, calendarYearRef, focusOnNextUpdate] = useFocusLogic({ componentRef });\n  const [isYearPickerVisible, setIsYearPickerVisible] = React.useState(false);\n\n  const animateBackwards = useAnimateBackwards({ navigatedDate });\n\n  const selectMonthCallback = (newMonth: number): (() => void) => {\n    return () => onSelectMonth(newMonth);\n  };\n\n  const onSelectNextYear = (): void => {\n    onNavigateDate(addYears(navigatedDate, 1), false);\n  };\n\n  const onSelectPrevYear = (): void => {\n    onNavigateDate(addYears(navigatedDate, -1), false);\n  };\n\n  const onSelectMonth = (newMonth: number): void => {\n    // If header is clickable the calendars are overlayed, switch back to day picker when month is clicked\n    onUserHeaderSelect?.();\n    onNavigateDate(setMonth(navigatedDate, newMonth), true);\n  };\n\n  const onHeaderSelect = (): void => {\n    if (!yearPickerHidden) {\n      focusOnNextUpdate();\n      setIsYearPickerVisible(true);\n    } else {\n      onUserHeaderSelect?.();\n    }\n  };\n\n  const onSelectYear = (selectedYear: number) => {\n    focusOnNextUpdate();\n    const navYear = navigatedDate.getFullYear();\n    if (navYear !== selectedYear) {\n      let newNavigationDate = new Date(navigatedDate.getTime());\n      newNavigationDate.setFullYear(selectedYear);\n      // for min and max dates, adjust the new navigation date - perhaps this should be\n      // checked on the master navigation date handler (i.e. in Calendar)\n      if (maxDate && newNavigationDate > maxDate) {\n        newNavigationDate = setMonth(newNavigationDate, maxDate.getMonth());\n      } else if (minDate && newNavigationDate < minDate) {\n        newNavigationDate = setMonth(newNavigationDate, minDate.getMonth());\n      }\n      onNavigateDate(newNavigationDate, true);\n    }\n    setIsYearPickerVisible(false);\n  };\n\n  const onYearPickerHeaderSelect = (focus: boolean): void => {\n    focusOnNextUpdate();\n    setIsYearPickerVisible(false);\n  };\n\n  const dateFormatter = dateTimeFormatter!;\n\n  // determine if previous/next years are in bounds\n  const isPrevYearInBounds = minDate ? compareDatePart(minDate, getYearStart(navigatedDate)) < 0 : true;\n  const isNextYearInBounds = maxDate ? compareDatePart(getYearEnd(navigatedDate), maxDate) < 0 : true;\n\n  const classNames = useCalendarMonthStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!onUserHeaderSelect || !yearPickerHidden,\n    highlightCurrent: highlightCurrentMonth,\n    highlightSelected: highlightSelectedMonth,\n    animateBackwards,\n    animationDirection,\n  });\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid' });\n\n  if (isYearPickerVisible) {\n    const [onRenderYear, yearStrings] = getYearStrings({ dateTimeFormatter, navigatedDate, strings });\n    // use navigated date for the year picker\n    return (\n      <CalendarYear\n        key={'calendarYear'}\n        minYear={minDate ? minDate.getFullYear() : undefined}\n        maxYear={maxDate ? maxDate.getFullYear() : undefined}\n        // eslint-disable-next-line react/jsx-no-bind\n        onSelectYear={onSelectYear}\n        // eslint-disable-next-line react/jsx-no-bind\n        onHeaderSelect={onYearPickerHeaderSelect}\n        selectedYear={\n          selectedDate ? selectedDate.getFullYear() : navigatedDate ? navigatedDate.getFullYear() : undefined\n        }\n        navigatedYear={navigatedDate.getFullYear()}\n        navigationIcons={navigationIcons}\n        onRenderYear={onRenderYear}\n        strings={yearStrings}\n        componentRef={calendarYearRef}\n        highlightCurrentYear={highlightCurrentMonth}\n        highlightSelectedYear={highlightSelectedMonth}\n        animationDirection={animationDirection}\n      />\n    );\n  }\n\n  const rowIndexes = [];\n  for (let i = 0; i < strings.shortMonths.length / MONTHS_PER_ROW; i++) {\n    rowIndexes.push(i);\n  }\n\n  const yearString = dateFormatter.formatYear(navigatedDate);\n  const headerAriaLabel = strings.monthPickerHeaderAriaLabel\n    ? strings.monthPickerHeaderAriaLabel.replace('{0}', yearString)\n    : yearString;\n\n  return (\n    <div className={classNames.root}>\n      <div className={classNames.headerContainer}>\n        <button\n          className={classNames.currentItemButton}\n          onClick={onHeaderSelect}\n          onKeyDown={onButtonKeyDown(onHeaderSelect)}\n          aria-label={headerAriaLabel}\n          tabIndex={!!onUserHeaderSelect || !yearPickerHidden ? 0 : -1}\n          type=\"button\"\n        >\n          <span aria-live=\"polite\" aria-atomic=\"true\">\n            {yearString}\n          </span>\n        </button>\n        <div className={classNames.navigationButtonsContainer}>\n          <button\n            className={mergeClasses(classNames.navigationButton, !isPrevYearInBounds && classNames.disabled)}\n            aria-disabled={!isPrevYearInBounds}\n            tabIndex={isPrevYearInBounds ? undefined : allFocusable ? 0 : -1}\n            onClick={isPrevYearInBounds ? onSelectPrevYear : undefined}\n            onKeyDown={isPrevYearInBounds ? onButtonKeyDown(onSelectPrevYear) : undefined}\n            title={\n              strings.prevYearAriaLabel\n                ? strings.prevYearAriaLabel + ' ' + dateFormatter.formatYear(addYears(navigatedDate, -1))\n                : undefined\n            }\n            type=\"button\"\n          >\n            {navigationIcons.upNavigation}\n          </button>\n          <button\n            className={mergeClasses(classNames.navigationButton, !isNextYearInBounds && classNames.disabled)}\n            aria-disabled={!isNextYearInBounds}\n            tabIndex={isNextYearInBounds ? undefined : allFocusable ? 0 : -1}\n            onClick={isNextYearInBounds ? onSelectNextYear : undefined}\n            onKeyDown={isNextYearInBounds ? onButtonKeyDown(onSelectNextYear) : undefined}\n            title={\n              strings.nextYearAriaLabel\n                ? strings.nextYearAriaLabel + ' ' + dateFormatter.formatYear(addYears(navigatedDate, 1))\n                : undefined\n            }\n            type=\"button\"\n          >\n            {navigationIcons.downNavigation}\n          </button>\n        </div>\n      </div>\n      <div {...arrowNavigationAttributes} className={classNames.gridContainer} role=\"grid\" aria-label={yearString}>\n        {rowIndexes.map((rowNum: number) => {\n          const monthsForRow = strings!.shortMonths.slice(rowNum * MONTHS_PER_ROW, (rowNum + 1) * MONTHS_PER_ROW);\n          return (\n            <div key={'monthRow_' + rowNum + navigatedDate.getFullYear()} role=\"row\" className={classNames.buttonRow}>\n              {monthsForRow.map((month: string, index: number) => {\n                const monthIndex = rowNum * MONTHS_PER_ROW + index;\n                const indexedMonth = setMonth(navigatedDate, monthIndex);\n                const isNavigatedMonth = navigatedDate.getMonth() === monthIndex;\n                const isSelectedMonth = selectedDate.getMonth() === monthIndex;\n                const isSelectedYear = selectedDate.getFullYear() === navigatedDate.getFullYear();\n                const isInBounds =\n                  (minDate ? compareDatePart(minDate, getMonthEnd(indexedMonth)) < 1 : true) &&\n                  (maxDate ? compareDatePart(getMonthStart(indexedMonth), maxDate) < 1 : true);\n\n                return (\n                  <button\n                    ref={isNavigatedMonth ? navigatedMonthRef : undefined}\n                    role={'gridcell'}\n                    className={mergeClasses(\n                      classNames.itemButton,\n                      highlightCurrentMonth &&\n                        isCurrentMonth(monthIndex, navigatedDate.getFullYear(), today) &&\n                        classNames.current,\n                      highlightSelectedMonth && isSelectedMonth && isSelectedYear && classNames.selected,\n                      !isInBounds && classNames.disabled,\n                    )}\n                    disabled={!allFocusable && !isInBounds}\n                    key={monthIndex}\n                    onClick={isInBounds ? selectMonthCallback(monthIndex) : undefined}\n                    onKeyDown={isInBounds ? onButtonKeyDown(selectMonthCallback(monthIndex)) : undefined}\n                    aria-label={dateFormatter.formatMonth(indexedMonth, strings!)}\n                    aria-selected={isNavigatedMonth}\n                    tabIndex={isInBounds ? 0 : -1}\n                    type=\"button\"\n                  >\n                    {month}\n                  </button>\n                );\n              })}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n};\nCalendarMonth.displayName = 'CalendarMonth';\n\nfunction getYearStrings({\n  dateTimeFormatter,\n  navigatedDate,\n  strings,\n}: Pick<CalendarMonthProps, 'dateTimeFormatter' | 'navigatedDate' | 'strings'>) {\n  const yearToString = (year: number) => {\n    if (dateTimeFormatter) {\n      // create a date based on the current nav date\n      const yearFormattingDate = new Date(navigatedDate.getTime());\n      yearFormattingDate.setFullYear(year);\n      return dateTimeFormatter.formatYear(yearFormattingDate);\n    }\n    return String(year);\n  };\n\n  const yearRangeToString = (yearRange: CalendarYearRange) => {\n    return `${yearToString(yearRange.fromYear)} - ${yearToString(yearRange.toYear)}`;\n  };\n\n  const yearRangeToNextDecadeLabel = (yearRange: CalendarYearRange) => {\n    return strings.nextYearRangeAriaLabel ? `${strings.nextYearRangeAriaLabel} ${yearRangeToString(yearRange)}` : '';\n  };\n\n  const yearRangeToPrevDecadeLabel = (yearRange: CalendarYearRange) => {\n    return strings.prevYearRangeAriaLabel ? `${strings.prevYearRangeAriaLabel} ${yearRangeToString(yearRange)}` : '';\n  };\n\n  return [\n    yearToString,\n    {\n      rangeAriaLabel: yearRangeToString,\n      prevRangeAriaLabel: yearRangeToPrevDecadeLabel,\n      nextRangeAriaLabel: yearRangeToNextDecadeLabel,\n      headerAriaLabelFormatString: strings.monthPickerHeaderAriaLabel,\n    } as const,\n  ] as const;\n}\n\nfunction isCurrentMonth(month: number, year: number, today: Date): boolean {\n  return today.getFullYear() === year && today.getMonth() === month;\n}\n\nfunction onButtonKeyDown(callback: () => void): (ev: React.KeyboardEvent<HTMLButtonElement>) => void {\n  return (ev: React.KeyboardEvent<HTMLButtonElement>) => {\n    switch (ev.key) {\n      case Enter:\n        callback();\n        break;\n    }\n  };\n}\n"],"names":["React","Enter","useArrowNavigationGroup","mergeClasses","addYears","compareDatePart","getMonthEnd","getMonthStart","getYearEnd","getYearStart","setMonth","DEFAULT_DATE_FORMATTING","CalendarYear","useCalendarMonthStyles_unstable","MONTHS_PER_ROW","useAnimateBackwards","navigatedDate","currentYear","getFullYear","previousYearRef","useRef","undefined","useEffect","current","previousYear","useFocusLogic","componentRef","navigatedMonthRef","calendarYearRef","focusOnUpdate","focus","useCallback","useImperativeHandle","focusOnNextUpdate","CalendarMonth","props","allFocusable","animationDirection","className","dateTimeFormatter","highlightCurrentMonth","highlightSelectedMonth","maxDate","minDate","navigationIcons","onHeaderSelect","onUserHeaderSelect","onNavigateDate","selectedDate","strings","today","Date","yearPickerHidden","isYearPickerVisible","setIsYearPickerVisible","useState","animateBackwards","selectMonthCallback","newMonth","onSelectMonth","onSelectNextYear","onSelectPrevYear","onSelectYear","selectedYear","navYear","newNavigationDate","getTime","setFullYear","getMonth","onYearPickerHeaderSelect","dateFormatter","isPrevYearInBounds","isNextYearInBounds","classNames","hasHeaderClickCallback","highlightCurrent","highlightSelected","arrowNavigationAttributes","axis","onRenderYear","yearStrings","getYearStrings","key","minYear","maxYear","navigatedYear","highlightCurrentYear","highlightSelectedYear","rowIndexes","i","shortMonths","length","push","yearString","formatYear","headerAriaLabel","monthPickerHeaderAriaLabel","replace","div","root","headerContainer","button","currentItemButton","onClick","onKeyDown","onButtonKeyDown","aria-label","tabIndex","type","span","aria-live","aria-atomic","navigationButtonsContainer","navigationButton","disabled","aria-disabled","title","prevYearAriaLabel","upNavigation","nextYearAriaLabel","downNavigation","gridContainer","role","map","rowNum","monthsForRow","slice","buttonRow","month","index","monthIndex","indexedMonth","isNavigatedMonth","isSelectedMonth","isSelectedYear","isInBounds","ref","itemButton","isCurrentMonth","selected","formatMonth","aria-selected","displayName","yearToString","year","yearFormattingDate","String","yearRangeToString","yearRange","fromYear","toYear","yearRangeToNextDecadeLabel","nextYearRangeAriaLabel","yearRangeToPrevDecadeLabel","prevYearRangeAriaLabel","rangeAriaLabel","prevRangeAriaLabel","nextRangeAriaLabel","headerAriaLabelFormatString","callback","ev"],"mappings":"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"}
+{"version":3,"sources":["../src/components/CalendarMonth/CalendarMonth.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Enter } from '@fluentui/keyboard-keys';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { mergeClasses } from '@griffel/react';\nimport {\n  addYears,\n  compareDatePart,\n  getMonthEnd,\n  getMonthStart,\n  getYearEnd,\n  getYearStart,\n  setMonth,\n  DEFAULT_DATE_FORMATTING,\n} from '../../utils';\nimport { CalendarYear } from '../CalendarYear/CalendarYear';\nimport { useCalendarMonthStyles_unstable } from './useCalendarMonthStyles.styles';\nimport type { CalendarMonthProps } from './CalendarMonth.types';\nimport type { CalendarYearRange, ICalendarYear } from '../CalendarYear/CalendarYear.types';\n\nconst MONTHS_PER_ROW = 4;\n\nfunction useAnimateBackwards({ navigatedDate }: { navigatedDate: CalendarMonthProps['navigatedDate'] }) {\n  const currentYear = navigatedDate.getFullYear();\n\n  const previousYearRef = React.useRef<number | undefined>(undefined);\n  React.useEffect(() => {\n    previousYearRef.current = currentYear;\n  });\n  // eslint-disable-next-line react-hooks/refs\n  const previousYear = previousYearRef.current;\n\n  // eslint-disable-next-line react-hooks/refs\n  if (previousYear === undefined || previousYear === currentYear) {\n    return undefined;\n  } else {\n    return previousYear > currentYear;\n  }\n}\n\nfunction useFocusLogic({ componentRef }: { componentRef: CalendarMonthProps['componentRef'] }) {\n  const navigatedMonthRef = React.useRef<HTMLButtonElement>(null);\n  const calendarYearRef = React.useRef<ICalendarYear>(null);\n  const focusOnUpdate = React.useRef(false);\n\n  const focus = React.useCallback(() => {\n    if (calendarYearRef.current) {\n      calendarYearRef.current.focus();\n    } else if (navigatedMonthRef.current) {\n      navigatedMonthRef.current.focus();\n    }\n  }, []);\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 [navigatedMonthRef, calendarYearRef, focusOnNextUpdate] as const;\n}\n\n/**\n * @internal\n */\nexport const CalendarMonth: React.FunctionComponent<CalendarMonthProps> = props => {\n  const {\n    allFocusable,\n    animationDirection,\n    className,\n    componentRef,\n    dateTimeFormatter = DEFAULT_DATE_FORMATTING,\n    highlightCurrentMonth,\n    highlightSelectedMonth,\n    maxDate,\n    minDate,\n    navigatedDate,\n    navigationIcons,\n    onHeaderSelect: onUserHeaderSelect,\n    onNavigateDate,\n    selectedDate,\n    strings,\n    today = new Date(),\n    yearPickerHidden = false,\n  } = props;\n\n  const [navigatedMonthRef, calendarYearRef, focusOnNextUpdate] = useFocusLogic({ componentRef });\n  const [isYearPickerVisible, setIsYearPickerVisible] = React.useState(false);\n\n  const animateBackwards = useAnimateBackwards({ navigatedDate });\n\n  const selectMonthCallback = (newMonth: number): (() => void) => {\n    return () => onSelectMonth(newMonth);\n  };\n\n  const onSelectNextYear = (): void => {\n    onNavigateDate(addYears(navigatedDate, 1), false);\n  };\n\n  const onSelectPrevYear = (): void => {\n    onNavigateDate(addYears(navigatedDate, -1), false);\n  };\n\n  const onSelectMonth = (newMonth: number): void => {\n    // If header is clickable the calendars are overlayed, switch back to day picker when month is clicked\n    onUserHeaderSelect?.();\n    onNavigateDate(setMonth(navigatedDate, newMonth), true);\n  };\n\n  const onHeaderSelect = (): void => {\n    if (!yearPickerHidden) {\n      focusOnNextUpdate();\n      setIsYearPickerVisible(true);\n    } else {\n      onUserHeaderSelect?.();\n    }\n  };\n\n  const onSelectYear = (selectedYear: number) => {\n    focusOnNextUpdate();\n    const navYear = navigatedDate.getFullYear();\n    if (navYear !== selectedYear) {\n      let newNavigationDate = new Date(navigatedDate.getTime());\n      newNavigationDate.setFullYear(selectedYear);\n      // for min and max dates, adjust the new navigation date - perhaps this should be\n      // checked on the master navigation date handler (i.e. in Calendar)\n      if (maxDate && newNavigationDate > maxDate) {\n        newNavigationDate = setMonth(newNavigationDate, maxDate.getMonth());\n      } else if (minDate && newNavigationDate < minDate) {\n        newNavigationDate = setMonth(newNavigationDate, minDate.getMonth());\n      }\n      onNavigateDate(newNavigationDate, true);\n    }\n    setIsYearPickerVisible(false);\n  };\n\n  const onYearPickerHeaderSelect = (focus: boolean): void => {\n    focusOnNextUpdate();\n    setIsYearPickerVisible(false);\n  };\n\n  const dateFormatter = dateTimeFormatter!;\n\n  // determine if previous/next years are in bounds\n  const isPrevYearInBounds = minDate ? compareDatePart(minDate, getYearStart(navigatedDate)) < 0 : true;\n  const isNextYearInBounds = maxDate ? compareDatePart(getYearEnd(navigatedDate), maxDate) < 0 : true;\n\n  const classNames = useCalendarMonthStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!onUserHeaderSelect || !yearPickerHidden,\n    highlightCurrent: highlightCurrentMonth,\n    highlightSelected: highlightSelectedMonth,\n    animateBackwards,\n    animationDirection,\n  });\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid' });\n\n  if (isYearPickerVisible) {\n    const [onRenderYear, yearStrings] = getYearStrings({ dateTimeFormatter, navigatedDate, strings });\n    // use navigated date for the year picker\n    return (\n      <CalendarYear\n        key={'calendarYear'}\n        minYear={minDate ? minDate.getFullYear() : undefined}\n        maxYear={maxDate ? maxDate.getFullYear() : undefined}\n        // eslint-disable-next-line react/jsx-no-bind\n        onSelectYear={onSelectYear}\n        // eslint-disable-next-line react/jsx-no-bind\n        onHeaderSelect={onYearPickerHeaderSelect}\n        selectedYear={\n          selectedDate ? selectedDate.getFullYear() : navigatedDate ? navigatedDate.getFullYear() : undefined\n        }\n        navigatedYear={navigatedDate.getFullYear()}\n        navigationIcons={navigationIcons}\n        onRenderYear={onRenderYear}\n        strings={yearStrings}\n        componentRef={calendarYearRef}\n        highlightCurrentYear={highlightCurrentMonth}\n        highlightSelectedYear={highlightSelectedMonth}\n        animationDirection={animationDirection}\n      />\n    );\n  }\n\n  const rowIndexes = [];\n  for (let i = 0; i < strings.shortMonths.length / MONTHS_PER_ROW; i++) {\n    rowIndexes.push(i);\n  }\n\n  const yearString = dateFormatter.formatYear(navigatedDate);\n  const headerAriaLabel = strings.monthPickerHeaderAriaLabel\n    ? strings.monthPickerHeaderAriaLabel.replace('{0}', yearString)\n    : yearString;\n\n  return (\n    <div className={classNames.root}>\n      <div className={classNames.headerContainer}>\n        <button\n          className={classNames.currentItemButton}\n          onClick={onHeaderSelect}\n          onKeyDown={onButtonKeyDown(onHeaderSelect)}\n          aria-label={headerAriaLabel}\n          tabIndex={!!onUserHeaderSelect || !yearPickerHidden ? 0 : -1}\n          type=\"button\"\n        >\n          <span aria-live=\"polite\" aria-atomic=\"true\">\n            {yearString}\n          </span>\n        </button>\n        <div className={classNames.navigationButtonsContainer}>\n          <button\n            className={mergeClasses(classNames.navigationButton, !isPrevYearInBounds && classNames.disabled)}\n            aria-disabled={!isPrevYearInBounds}\n            tabIndex={isPrevYearInBounds ? undefined : allFocusable ? 0 : -1}\n            onClick={isPrevYearInBounds ? onSelectPrevYear : undefined}\n            onKeyDown={isPrevYearInBounds ? onButtonKeyDown(onSelectPrevYear) : undefined}\n            title={\n              strings.prevYearAriaLabel\n                ? strings.prevYearAriaLabel + ' ' + dateFormatter.formatYear(addYears(navigatedDate, -1))\n                : undefined\n            }\n            type=\"button\"\n          >\n            {navigationIcons.upNavigation}\n          </button>\n          <button\n            className={mergeClasses(classNames.navigationButton, !isNextYearInBounds && classNames.disabled)}\n            aria-disabled={!isNextYearInBounds}\n            tabIndex={isNextYearInBounds ? undefined : allFocusable ? 0 : -1}\n            onClick={isNextYearInBounds ? onSelectNextYear : undefined}\n            onKeyDown={isNextYearInBounds ? onButtonKeyDown(onSelectNextYear) : undefined}\n            title={\n              strings.nextYearAriaLabel\n                ? strings.nextYearAriaLabel + ' ' + dateFormatter.formatYear(addYears(navigatedDate, 1))\n                : undefined\n            }\n            type=\"button\"\n          >\n            {navigationIcons.downNavigation}\n          </button>\n        </div>\n      </div>\n      <div {...arrowNavigationAttributes} className={classNames.gridContainer} role=\"grid\" aria-label={yearString}>\n        {rowIndexes.map((rowNum: number) => {\n          const monthsForRow = strings!.shortMonths.slice(rowNum * MONTHS_PER_ROW, (rowNum + 1) * MONTHS_PER_ROW);\n          return (\n            <div key={'monthRow_' + rowNum + navigatedDate.getFullYear()} role=\"row\" className={classNames.buttonRow}>\n              {monthsForRow.map((month: string, index: number) => {\n                const monthIndex = rowNum * MONTHS_PER_ROW + index;\n                const indexedMonth = setMonth(navigatedDate, monthIndex);\n                const isNavigatedMonth = navigatedDate.getMonth() === monthIndex;\n                const isSelectedMonth = selectedDate.getMonth() === monthIndex;\n                const isSelectedYear = selectedDate.getFullYear() === navigatedDate.getFullYear();\n                const isInBounds =\n                  (minDate ? compareDatePart(minDate, getMonthEnd(indexedMonth)) < 1 : true) &&\n                  (maxDate ? compareDatePart(getMonthStart(indexedMonth), maxDate) < 1 : true);\n\n                return (\n                  <button\n                    ref={isNavigatedMonth ? navigatedMonthRef : undefined}\n                    role={'gridcell'}\n                    className={mergeClasses(\n                      classNames.itemButton,\n                      highlightCurrentMonth &&\n                        isCurrentMonth(monthIndex, navigatedDate.getFullYear(), today) &&\n                        classNames.current,\n                      highlightSelectedMonth && isSelectedMonth && isSelectedYear && classNames.selected,\n                      !isInBounds && classNames.disabled,\n                    )}\n                    disabled={!allFocusable && !isInBounds}\n                    key={monthIndex}\n                    onClick={isInBounds ? selectMonthCallback(monthIndex) : undefined}\n                    onKeyDown={isInBounds ? onButtonKeyDown(selectMonthCallback(monthIndex)) : undefined}\n                    aria-label={dateFormatter.formatMonth(indexedMonth, strings!)}\n                    aria-selected={isNavigatedMonth}\n                    tabIndex={isInBounds ? 0 : -1}\n                    type=\"button\"\n                  >\n                    {month}\n                  </button>\n                );\n              })}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n};\nCalendarMonth.displayName = 'CalendarMonth';\n\nfunction getYearStrings({\n  dateTimeFormatter,\n  navigatedDate,\n  strings,\n}: Pick<CalendarMonthProps, 'dateTimeFormatter' | 'navigatedDate' | 'strings'>) {\n  const yearToString = (year: number) => {\n    if (dateTimeFormatter) {\n      // create a date based on the current nav date\n      const yearFormattingDate = new Date(navigatedDate.getTime());\n      yearFormattingDate.setFullYear(year);\n      return dateTimeFormatter.formatYear(yearFormattingDate);\n    }\n    return String(year);\n  };\n\n  const yearRangeToString = (yearRange: CalendarYearRange) => {\n    return `${yearToString(yearRange.fromYear)} - ${yearToString(yearRange.toYear)}`;\n  };\n\n  const yearRangeToNextDecadeLabel = (yearRange: CalendarYearRange) => {\n    return strings.nextYearRangeAriaLabel ? `${strings.nextYearRangeAriaLabel} ${yearRangeToString(yearRange)}` : '';\n  };\n\n  const yearRangeToPrevDecadeLabel = (yearRange: CalendarYearRange) => {\n    return strings.prevYearRangeAriaLabel ? `${strings.prevYearRangeAriaLabel} ${yearRangeToString(yearRange)}` : '';\n  };\n\n  return [\n    yearToString,\n    {\n      rangeAriaLabel: yearRangeToString,\n      prevRangeAriaLabel: yearRangeToPrevDecadeLabel,\n      nextRangeAriaLabel: yearRangeToNextDecadeLabel,\n      headerAriaLabelFormatString: strings.monthPickerHeaderAriaLabel,\n    } as const,\n  ] as const;\n}\n\nfunction isCurrentMonth(month: number, year: number, today: Date): boolean {\n  return today.getFullYear() === year && today.getMonth() === month;\n}\n\nfunction onButtonKeyDown(callback: () => void): (ev: React.KeyboardEvent<HTMLButtonElement>) => void {\n  return (ev: React.KeyboardEvent<HTMLButtonElement>) => {\n    switch (ev.key) {\n      case Enter:\n        callback();\n        break;\n    }\n  };\n}\n"],"names":["React","Enter","useArrowNavigationGroup","mergeClasses","addYears","compareDatePart","getMonthEnd","getMonthStart","getYearEnd","getYearStart","setMonth","DEFAULT_DATE_FORMATTING","CalendarYear","useCalendarMonthStyles_unstable","MONTHS_PER_ROW","useAnimateBackwards","navigatedDate","currentYear","getFullYear","previousYearRef","useRef","undefined","useEffect","current","previousYear","useFocusLogic","componentRef","navigatedMonthRef","calendarYearRef","focusOnUpdate","focus","useCallback","useImperativeHandle","focusOnNextUpdate","CalendarMonth","props","allFocusable","animationDirection","className","dateTimeFormatter","highlightCurrentMonth","highlightSelectedMonth","maxDate","minDate","navigationIcons","onHeaderSelect","onUserHeaderSelect","onNavigateDate","selectedDate","strings","today","Date","yearPickerHidden","isYearPickerVisible","setIsYearPickerVisible","useState","animateBackwards","selectMonthCallback","newMonth","onSelectMonth","onSelectNextYear","onSelectPrevYear","onSelectYear","selectedYear","navYear","newNavigationDate","getTime","setFullYear","getMonth","onYearPickerHeaderSelect","dateFormatter","isPrevYearInBounds","isNextYearInBounds","classNames","hasHeaderClickCallback","highlightCurrent","highlightSelected","arrowNavigationAttributes","axis","onRenderYear","yearStrings","getYearStrings","key","minYear","maxYear","navigatedYear","highlightCurrentYear","highlightSelectedYear","rowIndexes","i","shortMonths","length","push","yearString","formatYear","headerAriaLabel","monthPickerHeaderAriaLabel","replace","div","root","headerContainer","button","currentItemButton","onClick","onKeyDown","onButtonKeyDown","aria-label","tabIndex","type","span","aria-live","aria-atomic","navigationButtonsContainer","navigationButton","disabled","aria-disabled","title","prevYearAriaLabel","upNavigation","nextYearAriaLabel","downNavigation","gridContainer","role","map","rowNum","monthsForRow","slice","buttonRow","month","index","monthIndex","indexedMonth","isNavigatedMonth","isSelectedMonth","isSelectedYear","isInBounds","ref","itemButton","isCurrentMonth","selected","formatMonth","aria-selected","displayName","yearToString","year","yearFormattingDate","String","yearRangeToString","yearRange","fromYear","toYear","yearRangeToNextDecadeLabel","nextYearRangeAriaLabel","yearRangeToPrevDecadeLabel","prevYearRangeAriaLabel","rangeAriaLabel","prevRangeAriaLabel","nextRangeAriaLabel","headerAriaLabelFormatString","callback","ev"],"mappings":"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"}

package/lib/components/CalendarYear/CalendarYear.js

@@ -223,7 +223,9 @@ function useAnimateBackwards({ selectedYear, navigatedYear }) {
     React.useRef(()=>{
         previousFromYearRef.current = fromYear;
     });
+    // eslint-disable-next-line react-hooks/refs
     const previousFromYear = previousFromYearRef.current;
+    // eslint-disable-next-line react-hooks/refs
     if (!previousFromYear || previousFromYear === fromYear) {
         return undefined;
     } else if (previousFromYear > fromYear) {
@@ -251,6 +253,7 @@ function useYearRangeState({ selectedYear, navigatedYear, onNavigateDate }) {
         onNavigateDate === null || onNavigateDate === void 0 ? void 0 : onNavigateDate(newFromYear);
     };
     React.useEffect(()=>{
+        // eslint-disable-next-line react-hooks/set-state-in-effect
         setFromYear(rangeYear);
     }, [
         rangeYear

package/lib/components/CalendarYear/CalendarYear.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CalendarYear/CalendarYear.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { mergeClasses } from '@griffel/react';\nimport { useCalendarYearStyles_unstable } from './useCalendarYearStyles.styles';\nimport type {\n  CalendarYearStrings,\n  CalendarYearProps,\n  CalendarYearRange,\n  CalendarYearHeaderProps,\n} from './CalendarYear.types';\n\nconst CELL_COUNT = 12;\nconst CELLS_PER_ROW = 4;\n\nconst DefaultCalendarYearStrings: CalendarYearStrings = {\n  prevRangeAriaLabel: undefined,\n  nextRangeAriaLabel: undefined,\n};\ninterface CalendarYearGrid {\n  focus(): void;\n}\n\ninterface CalendarYearGridCellProps extends CalendarYearProps {\n  year: number;\n  current?: boolean;\n  selected?: boolean;\n  disabled?: boolean;\n  onSelectYear?: (year: number) => void;\n  onRenderYear?: (year: number) => React.ReactNode;\n}\n\ninterface CalendarYearGridProps extends CalendarYearProps, CalendarYearRange {\n  selectedYear?: number;\n  animateBackwards?: boolean;\n  componentRef?: React.RefObject<CalendarYearGridCell | null>;\n}\n\ninterface CalendarYearGridCell {\n  focus(): void;\n}\n\nconst CalendarYearGridCell: React.FunctionComponent<CalendarYearGridCellProps> = props => {\n  const {\n    className,\n    highlightCurrentYear,\n    highlightSelectedYear,\n    year,\n    selected,\n    disabled,\n    componentRef,\n    onSelectYear,\n    onRenderYear,\n  } = props;\n\n  const buttonRef = React.useRef<HTMLButtonElement>(null);\n\n  React.useImperativeHandle(\n    componentRef,\n    () => ({\n      focus() {\n        buttonRef.current?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  const onClick = () => {\n    onSelectYear?.(year);\n  };\n\n  const onKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter) {\n      onSelectYear?.(year);\n    }\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    highlightCurrent: highlightCurrentYear,\n    highlightSelected: highlightSelectedYear,\n  });\n\n  return (\n    <button\n      className={mergeClasses(classNames.itemButton, selected && classNames.selected, disabled && classNames.disabled)}\n      type=\"button\"\n      role=\"gridcell\"\n      onClick={!disabled ? onClick : undefined}\n      onKeyDown={!disabled ? onKeyDown : undefined}\n      disabled={disabled}\n      aria-selected={selected}\n      ref={buttonRef}\n    >\n      {onRenderYear?.(year) ?? year}\n    </button>\n  );\n};\nCalendarYearGridCell.displayName = 'CalendarYearGridCell';\n\nconst CalendarYearGrid: React.FunctionComponent<CalendarYearGridProps> = props => {\n  const {\n    className,\n    fromYear,\n    toYear,\n    animationDirection,\n    animateBackwards,\n    minYear,\n    maxYear,\n    onSelectYear,\n    selectedYear,\n    componentRef,\n  } = props;\n\n  const selectedCellRef = React.useRef<CalendarYearGridCell>(null);\n\n  const currentCellRef = React.useRef<CalendarYearGridCell>(null);\n\n  React.useImperativeHandle(\n    componentRef,\n    () => ({\n      focus() {\n        (selectedCellRef.current || currentCellRef.current)?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  const renderCell = (yearToRender: number): React.ReactNode => {\n    const selected = yearToRender === selectedYear;\n    const disabled =\n      (minYear !== undefined && yearToRender < minYear) || (maxYear !== undefined && yearToRender > maxYear);\n    const current = yearToRender === new Date().getFullYear();\n\n    return (\n      <CalendarYearGridCell\n        {...props}\n        key={yearToRender}\n        year={yearToRender}\n        selected={selected}\n        current={current}\n        disabled={disabled}\n        onSelectYear={onSelectYear}\n        componentRef={selected ? selectedCellRef : current ? currentCellRef : undefined}\n      />\n    );\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    animateBackwards,\n    animationDirection,\n  });\n\n  const onRenderYear = (value: number) => {\n    return props.onRenderYear?.(value) ?? value;\n  };\n\n  const gridAriaLabel = `${onRenderYear(fromYear)} - ${onRenderYear(toYear)}`;\n\n  let year = fromYear;\n  const cells: React.ReactNode[][] = [];\n\n  for (let i = 0; i < (toYear - fromYear + 1) / CELLS_PER_ROW; i++) {\n    cells.push([]);\n    for (let j = 0; j < CELLS_PER_ROW; j++) {\n      cells[i].push(renderCell(year));\n      year++;\n    }\n  }\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid' });\n\n  return (\n    <div {...arrowNavigationAttributes} className={classNames.gridContainer} role=\"grid\" aria-label={gridAriaLabel}>\n      {cells.map((cellRow: React.ReactNode[], index: number) => {\n        return (\n          <div key={'yearPickerRow_' + index + '_' + fromYear} role=\"row\" className={classNames.buttonRow}>\n            {cellRow}\n          </div>\n        );\n      })}\n    </div>\n  );\n};\nCalendarYearGrid.displayName = 'CalendarYearGrid';\n\nconst CalendarYearNavDirection = {\n  Previous: 0 as const,\n  Next: 1 as const,\n};\n\ninterface CalendarYearNavArrowProps extends CalendarYearHeaderProps {\n  direction: (typeof CalendarYearNavDirection)[keyof typeof CalendarYearNavDirection];\n}\n\nconst CalendarYearNavArrow: React.FunctionComponent<CalendarYearNavArrowProps> = props => {\n  const {\n    className,\n    strings = DefaultCalendarYearStrings,\n    direction,\n    onSelectPrev,\n    onSelectNext,\n    fromYear,\n    toYear,\n    maxYear,\n    minYear,\n    navigationIcons,\n  } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  const ariaLabel =\n    direction === CalendarYearNavDirection.Previous ? strings.prevRangeAriaLabel : strings.nextRangeAriaLabel;\n  const newRangeOffset = direction === CalendarYearNavDirection.Previous ? -CELL_COUNT : CELL_COUNT;\n  const newRange = { fromYear: fromYear + newRangeOffset, toYear: toYear + newRangeOffset };\n  const ariaLabelString = ariaLabel ? (typeof ariaLabel === 'string' ? ariaLabel : ariaLabel(newRange)) : undefined;\n  const disabled =\n    direction === CalendarYearNavDirection.Previous\n      ? minYear !== undefined && fromYear < minYear\n      : maxYear !== undefined && props.fromYear + CELL_COUNT > maxYear;\n\n  const onNavigate = () => {\n    direction === CalendarYearNavDirection.Previous ? onSelectPrev?.() : onSelectNext?.();\n  };\n\n  const onKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter) {\n      onNavigate();\n    }\n  };\n\n  return (\n    <button\n      className={mergeClasses(classNames.navigationButton, disabled && classNames.disabled)}\n      onClick={!disabled ? onNavigate : undefined}\n      onKeyDown={!disabled ? onKeyDown : undefined}\n      type=\"button\"\n      title={ariaLabelString}\n      disabled={disabled}\n    >\n      {direction === CalendarYearNavDirection.Previous ? navigationIcons.upNavigation : navigationIcons.downNavigation}\n    </button>\n  );\n};\nCalendarYearNavArrow.displayName = 'CalendarYearNavArrow';\n\nconst CalendarYearNav: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const { className } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  return (\n    <div className={classNames.navigationButtonsContainer}>\n      <CalendarYearNavArrow {...props} direction={CalendarYearNavDirection.Previous} />\n      <CalendarYearNavArrow {...props} direction={CalendarYearNavDirection.Next} />\n    </div>\n  );\n};\nCalendarYearNav.displayName = 'CalendarYearNav';\n\nconst CalendarYearTitle: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const {\n    className,\n    fromYear,\n    toYear,\n    strings = DefaultCalendarYearStrings,\n    animateBackwards,\n    animationDirection,\n  } = props;\n\n  const onHeaderSelect = () => {\n    props.onHeaderSelect?.(true);\n  };\n\n  const onHeaderKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter || ev.key === Space) {\n      onHeaderSelect();\n    }\n  };\n\n  const onRenderYear = (year: number) => {\n    return props.onRenderYear?.(year) ?? year;\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!props.onHeaderSelect,\n    animateBackwards,\n    animationDirection,\n  });\n\n  if (props.onHeaderSelect) {\n    const rangeAriaLabel = strings.rangeAriaLabel;\n    const headerAriaLabelFormatString = strings.headerAriaLabelFormatString;\n    const currentDateRange = rangeAriaLabel\n      ? typeof rangeAriaLabel === 'string'\n        ? rangeAriaLabel\n        : rangeAriaLabel(props)\n      : undefined;\n\n    const ariaLabel = headerAriaLabelFormatString\n      ? headerAriaLabelFormatString.replace('{0}', currentDateRange ?? '')\n      : currentDateRange;\n\n    return (\n      <button\n        className={classNames.currentItemButton}\n        onClick={onHeaderSelect}\n        onKeyDown={onHeaderKeyDown}\n        aria-label={ariaLabel}\n        role=\"button\"\n        type=\"button\"\n      >\n        <span aria-live=\"assertive\" aria-atomic=\"true\">\n          {onRenderYear(fromYear)} - {onRenderYear(toYear)}\n        </span>\n      </button>\n    );\n  }\n\n  return (\n    <div className={classNames.current}>\n      {onRenderYear(fromYear)} - {onRenderYear(toYear)}\n    </div>\n  );\n};\nCalendarYearTitle.displayName = 'CalendarYearTitle';\n\nconst CalendarYearHeader: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const { className, animateBackwards, animationDirection, onRenderTitle } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!props.onHeaderSelect,\n    animateBackwards,\n    animationDirection,\n  });\n\n  return (\n    <div className={classNames.headerContainer}>\n      {onRenderTitle?.(props) ?? <CalendarYearTitle {...props} />}\n      <CalendarYearNav {...props} />\n    </div>\n  );\n};\nCalendarYearHeader.displayName = 'CalendarYearHeader';\n\nfunction useAnimateBackwards({ selectedYear, navigatedYear }: CalendarYearProps) {\n  const rangeYear = selectedYear || navigatedYear || new Date().getFullYear();\n  const fromYear = Math.floor(rangeYear / 10) * 10;\n\n  const previousFromYearRef = React.useRef<number | undefined>(fromYear);\n  React.useRef(() => {\n    previousFromYearRef.current = fromYear;\n  });\n  const previousFromYear = previousFromYearRef.current;\n\n  if (!previousFromYear || previousFromYear === fromYear) {\n    return undefined;\n  } else if (previousFromYear > fromYear) {\n    return true;\n  } else {\n    return false;\n  }\n}\n\nfunction useYearRangeState({ selectedYear, navigatedYear, onNavigateDate }: CalendarYearProps) {\n  const rangeYear = React.useMemo(() => {\n    return selectedYear || navigatedYear || Math.floor(new Date().getFullYear() / 10) * 10;\n  }, [navigatedYear, selectedYear]);\n\n  const [fromYear, setFromYear] = React.useState<number>(rangeYear);\n\n  const onNavNext = () => {\n    const newFromYear = fromYear + CELL_COUNT;\n    setFromYear(newFromYear);\n    onNavigateDate?.(newFromYear);\n  };\n\n  const onNavPrevious = () => {\n    const newFromYear = fromYear - CELL_COUNT;\n    setFromYear(newFromYear);\n    onNavigateDate?.(newFromYear);\n  };\n\n  React.useEffect(() => {\n    setFromYear(rangeYear);\n  }, [rangeYear]);\n\n  const toYear = fromYear + CELL_COUNT - 1;\n\n  return [fromYear, toYear, onNavNext, onNavPrevious] as const;\n}\n\n/**\n * @internal\n */\nexport const CalendarYear: React.FunctionComponent<CalendarYearProps> = props => {\n  const animateBackwards = useAnimateBackwards(props);\n  const [fromYear, toYear, onNavNext, onNavPrevious] = useYearRangeState(props);\n\n  const gridRef = React.useRef<CalendarYearGrid>(null);\n\n  React.useImperativeHandle(props.componentRef, () => ({\n    focus() {\n      gridRef.current?.focus?.();\n    },\n  }));\n\n  const { className } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  return (\n    <div className={classNames.root}>\n      <CalendarYearHeader\n        {...props}\n        fromYear={fromYear}\n        toYear={toYear}\n        onSelectPrev={onNavPrevious}\n        onSelectNext={onNavNext}\n        animateBackwards={animateBackwards}\n      />\n      <CalendarYearGrid\n        {...props}\n        fromYear={fromYear}\n        toYear={toYear}\n        animateBackwards={animateBackwards}\n        componentRef={gridRef}\n      />\n    </div>\n  );\n};\nCalendarYear.displayName = 'CalendarYear';\n"],"names":["React","Enter","Space","useArrowNavigationGroup","mergeClasses","useCalendarYearStyles_unstable","CELL_COUNT","CELLS_PER_ROW","DefaultCalendarYearStrings","prevRangeAriaLabel","undefined","nextRangeAriaLabel","CalendarYearGridCell","props","className","highlightCurrentYear","highlightSelectedYear","year","selected","disabled","componentRef","onSelectYear","onRenderYear","buttonRef","useRef","useImperativeHandle","focus","current","onClick","onKeyDown","ev","key","classNames","highlightCurrent","highlightSelected","button","itemButton","type","role","aria-selected","ref","displayName","CalendarYearGrid","fromYear","toYear","animationDirection","animateBackwards","minYear","maxYear","selectedYear","selectedCellRef","currentCellRef","renderCell","yearToRender","Date","getFullYear","value","gridAriaLabel","cells","i","push","j","arrowNavigationAttributes","axis","div","gridContainer","aria-label","map","cellRow","index","buttonRow","CalendarYearNavDirection","Previous","Next","CalendarYearNavArrow","strings","direction","onSelectPrev","onSelectNext","navigationIcons","ariaLabel","newRangeOffset","newRange","ariaLabelString","onNavigate","navigationButton","title","upNavigation","downNavigation","CalendarYearNav","navigationButtonsContainer","CalendarYearTitle","onHeaderSelect","onHeaderKeyDown","hasHeaderClickCallback","rangeAriaLabel","headerAriaLabelFormatString","currentDateRange","replace","currentItemButton","span","aria-live","aria-atomic","CalendarYearHeader","onRenderTitle","headerContainer","useAnimateBackwards","navigatedYear","rangeYear","Math","floor","previousFromYearRef","previousFromYear","useYearRangeState","onNavigateDate","useMemo","setFromYear","useState","onNavNext","newFromYear","onNavPrevious","useEffect","CalendarYear","gridRef","root"],"mappings":"AAAA;AAEA,YAAYA,WAAW,QAAQ;AAC/B,SAASC,KAAK,EAAEC,KAAK,QAAQ,0BAA0B;AACvD,SAASC,uBAAuB,QAAQ,0BAA0B;AAClE,SAASC,YAAY,QAAQ,iBAAiB;AAC9C,SAASC,8BAA8B,QAAQ,iCAAiC;AAQhF,MAAMC,aAAa;AACnB,MAAMC,gBAAgB;AAEtB,MAAMC,6BAAkD;IACtDC,oBAAoBC;IACpBC,oBAAoBD;AACtB;AAwBA,MAAME,uBAA2EC,CAAAA;IAC/E,MAAM,EACJC,SAAS,EACTC,oBAAoB,EACpBC,qBAAqB,EACrBC,IAAI,EACJC,QAAQ,EACRC,QAAQ,EACRC,YAAY,EACZC,YAAY,EACZC,YAAY,EACb,GAAGT;IAEJ,MAAMU,YAAYvB,MAAMwB,MAAM,CAAoB;IAElDxB,MAAMyB,mBAAmB,CACvBL,cACA,IAAO,CAAA;YACLM;oBACEH,0BAAAA;iBAAAA,qBAAAA,UAAUI,OAAO,cAAjBJ,0CAAAA,2BAAAA,mBAAmBG,KAAK,cAAxBH,+CAAAA,8BAAAA;YACF;QACF,CAAA,GACA,EAAE;IAGJ,MAAMK,UAAU;QACdP,yBAAAA,mCAAAA,aAAeJ;IACjB;IAEA,MAAMY,YAAY,CAACC;QACjB,IAAIA,GAAGC,GAAG,KAAK9B,OAAO;YACpBoB,yBAAAA,mCAAAA,aAAeJ;QACjB;IACF;IAEA,MAAMe,aAAa3B,+BAA+B;QAChDS;QACAmB,kBAAkBlB;QAClBmB,mBAAmBlB;IACrB;QAaKM;IAXL,qBACE,oBAACa;QACCrB,WAAWV,aAAa4B,WAAWI,UAAU,EAAElB,YAAYc,WAAWd,QAAQ,EAAEC,YAAYa,WAAWb,QAAQ;QAC/GkB,MAAK;QACLC,MAAK;QACLV,SAAS,CAACT,WAAWS,UAAUlB;QAC/BmB,WAAW,CAACV,WAAWU,YAAYnB;QACnCS,UAAUA;QACVoB,iBAAerB;QACfsB,KAAKjB;OAEJD,CAAAA,gBAAAA,yBAAAA,mCAAAA,aAAeL,mBAAfK,2BAAAA,gBAAwBL;AAG/B;AACAL,qBAAqB6B,WAAW,GAAG;AAEnC,MAAMC,mBAAmE7B,CAAAA;IACvE,MAAM,EACJC,SAAS,EACT6B,QAAQ,EACRC,MAAM,EACNC,kBAAkB,EAClBC,gBAAgB,EAChBC,OAAO,EACPC,OAAO,EACP3B,YAAY,EACZ4B,YAAY,EACZ7B,YAAY,EACb,GAAGP;IAEJ,MAAMqC,kBAAkBlD,MAAMwB,MAAM,CAAuB;IAE3D,MAAM2B,iBAAiBnD,MAAMwB,MAAM,CAAuB;IAE1DxB,MAAMyB,mBAAmB,CACvBL,cACA,IAAO,CAAA;YACLM;oBACE,QAACwB;iBAAAA,QAAAA,gBAAgBvB,OAAO,IAAIwB,eAAexB,OAAO,cAAjDuB,6BAAD,SAAA,AAACA,MAAoDxB,KAAK,cAA1D,6BAAA,YAACwB;YACH;QACF,CAAA,GACA,EAAE;IAGJ,MAAME,aAAa,CAACC;QAClB,MAAMnC,WAAWmC,iBAAiBJ;QAClC,MAAM9B,WACJ,AAAC4B,YAAYrC,aAAa2C,eAAeN,WAAaC,YAAYtC,aAAa2C,eAAeL;QAChG,MAAMrB,UAAU0B,iBAAiB,IAAIC,OAAOC,WAAW;QAEvD,qBACE,oBAAC3C;YACE,GAAGC,KAAK;YACTkB,KAAKsB;YACLpC,MAAMoC;YACNnC,UAAUA;YACVS,SAASA;YACTR,UAAUA;YACVE,cAAcA;YACdD,cAAcF,WAAWgC,kBAAkBvB,UAAUwB,iBAAiBzC;;IAG5E;IAEA,MAAMsB,aAAa3B,+BAA+B;QAChDS;QACAgC;QACAD;IACF;IAEA,MAAMvB,eAAe,CAACkC;YACb3C;YAAAA;QAAP,OAAOA,CAAAA,wBAAAA,sBAAAA,MAAMS,YAAY,cAAlBT,0CAAAA,yBAAAA,OAAqB2C,oBAArB3C,kCAAAA,uBAA+B2C;IACxC;IAEA,MAAMC,gBAAgB,GAAGnC,aAAaqB,UAAU,GAAG,EAAErB,aAAasB,SAAS;IAE3E,IAAI3B,OAAO0B;IACX,MAAMe,QAA6B,EAAE;IAErC,IAAK,IAAIC,IAAI,GAAGA,IAAI,AAACf,CAAAA,SAASD,WAAW,CAAA,IAAKpC,eAAeoD,IAAK;QAChED,MAAME,IAAI,CAAC,EAAE;QACb,IAAK,IAAIC,IAAI,GAAGA,IAAItD,eAAesD,IAAK;YACtCH,KAAK,CAACC,EAAE,CAACC,IAAI,CAACR,WAAWnC;YACzBA;QACF;IACF;IAEA,MAAM6C,4BAA4B3D,wBAAwB;QAAE4D,MAAM;IAAO;IAEzE,qBACE,oBAACC;QAAK,GAAGF,yBAAyB;QAAEhD,WAAWkB,WAAWiC,aAAa;QAAE3B,MAAK;QAAO4B,cAAYT;OAC9FC,MAAMS,GAAG,CAAC,CAACC,SAA4BC;QACtC,qBACE,oBAACL;YAAIjC,KAAK,mBAAmBsC,QAAQ,MAAM1B;YAAUL,MAAK;YAAMxB,WAAWkB,WAAWsC,SAAS;WAC5FF;IAGP;AAGN;AACA1B,iBAAiBD,WAAW,GAAG;AAE/B,MAAM8B,2BAA2B;IAC/BC,UAAU;IACVC,MAAM;AACR;AAMA,MAAMC,uBAA2E7D,CAAAA;IAC/E,MAAM,EACJC,SAAS,EACT6D,UAAUnE,0BAA0B,EACpCoE,SAAS,EACTC,YAAY,EACZC,YAAY,EACZnC,QAAQ,EACRC,MAAM,EACNI,OAAO,EACPD,OAAO,EACPgC,eAAe,EAChB,GAAGlE;IAEJ,MAAMmB,aAAa3B,+BAA+B;QAChDS;IACF;IAEA,MAAMkE,YACJJ,cAAcL,yBAAyBC,QAAQ,GAAGG,QAAQlE,kBAAkB,GAAGkE,QAAQhE,kBAAkB;IAC3G,MAAMsE,iBAAiBL,cAAcL,yBAAyBC,QAAQ,GAAG,CAAClE,aAAaA;IACvF,MAAM4E,WAAW;QAAEvC,UAAUA,WAAWsC;QAAgBrC,QAAQA,SAASqC;IAAe;IACxF,MAAME,kBAAkBH,YAAa,OAAOA,cAAc,WAAWA,YAAYA,UAAUE,YAAaxE;IACxG,MAAMS,WACJyD,cAAcL,yBAAyBC,QAAQ,GAC3CzB,YAAYrC,aAAaiC,WAAWI,UACpCC,YAAYtC,aAAaG,MAAM8B,QAAQ,GAAGrC,aAAa0C;IAE7D,MAAMoC,aAAa;QACjBR,cAAcL,yBAAyBC,QAAQ,GAAGK,yBAAAA,mCAAAA,iBAAmBC,yBAAAA,mCAAAA;IACvE;IAEA,MAAMjD,YAAY,CAACC;QACjB,IAAIA,GAAGC,GAAG,KAAK9B,OAAO;YACpBmF;QACF;IACF;IAEA,qBACE,oBAACjD;QACCrB,WAAWV,aAAa4B,WAAWqD,gBAAgB,EAAElE,YAAYa,WAAWb,QAAQ;QACpFS,SAAS,CAACT,WAAWiE,aAAa1E;QAClCmB,WAAW,CAACV,WAAWU,YAAYnB;QACnC2B,MAAK;QACLiD,OAAOH;QACPhE,UAAUA;OAETyD,cAAcL,yBAAyBC,QAAQ,GAAGO,gBAAgBQ,YAAY,GAAGR,gBAAgBS,cAAc;AAGtH;AACAd,qBAAqBjC,WAAW,GAAG;AAEnC,MAAMgD,kBAAoE5E,CAAAA;IACxE,MAAM,EAAEC,SAAS,EAAE,GAAGD;IAEtB,MAAMmB,aAAa3B,+BAA+B;QAChDS;IACF;IAEA,qBACE,oBAACkD;QAAIlD,WAAWkB,WAAW0D,0BAA0B;qBACnD,oBAAChB;QAAsB,GAAG7D,KAAK;QAAE+D,WAAWL,yBAAyBC,QAAQ;sBAC7E,oBAACE;QAAsB,GAAG7D,KAAK;QAAE+D,WAAWL,yBAAyBE,IAAI;;AAG/E;AACAgB,gBAAgBhD,WAAW,GAAG;AAE9B,MAAMkD,oBAAsE9E,CAAAA;IAC1E,MAAM,EACJC,SAAS,EACT6B,QAAQ,EACRC,MAAM,EACN+B,UAAUnE,0BAA0B,EACpCsC,gBAAgB,EAChBD,kBAAkB,EACnB,GAAGhC;IAEJ,MAAM+E,iBAAiB;YACrB/E;SAAAA,wBAAAA,MAAM+E,cAAc,cAApB/E,4CAAAA,2BAAAA,OAAuB;IACzB;IAEA,MAAMgF,kBAAkB,CAAC/D;QACvB,IAAIA,GAAGC,GAAG,KAAK9B,SAAS6B,GAAGC,GAAG,KAAK7B,OAAO;YACxC0F;QACF;IACF;IAEA,MAAMtE,eAAe,CAACL;YACbJ;YAAAA;QAAP,OAAOA,CAAAA,wBAAAA,sBAAAA,MAAMS,YAAY,cAAlBT,0CAAAA,yBAAAA,OAAqBI,mBAArBJ,kCAAAA,uBAA8BI;IACvC;IAEA,MAAMe,aAAa3B,+BAA+B;QAChDS;QACAgF,wBAAwB,CAAC,CAACjF,MAAM+E,cAAc;QAC9C9C;QACAD;IACF;IAEA,IAAIhC,MAAM+E,cAAc,EAAE;QACxB,MAAMG,iBAAiBpB,QAAQoB,cAAc;QAC7C,MAAMC,8BAA8BrB,QAAQqB,2BAA2B;QACvE,MAAMC,mBAAmBF,iBACrB,OAAOA,mBAAmB,WACxBA,iBACAA,eAAelF,SACjBH;QAEJ,MAAMsE,YAAYgB,8BACdA,4BAA4BE,OAAO,CAAC,OAAOD,6BAAAA,8BAAAA,mBAAoB,MAC/DA;QAEJ,qBACE,oBAAC9D;YACCrB,WAAWkB,WAAWmE,iBAAiB;YACvCvE,SAASgE;YACT/D,WAAWgE;YACX3B,cAAYc;YACZ1C,MAAK;YACLD,MAAK;yBAEL,oBAAC+D;YAAKC,aAAU;YAAYC,eAAY;WACrChF,aAAaqB,WAAU,OAAIrB,aAAasB;IAIjD;IAEA,qBACE,oBAACoB;QAAIlD,WAAWkB,WAAWL,OAAO;OAC/BL,aAAaqB,WAAU,OAAIrB,aAAasB;AAG/C;AACA+C,kBAAkBlD,WAAW,GAAG;AAEhC,MAAM8D,qBAAuE1F,CAAAA;IAC3E,MAAM,EAAEC,SAAS,EAAEgC,gBAAgB,EAAED,kBAAkB,EAAE2D,aAAa,EAAE,GAAG3F;IAE3E,MAAMmB,aAAa3B,+BAA+B;QAChDS;QACAgF,wBAAwB,CAAC,CAACjF,MAAM+E,cAAc;QAC9C9C;QACAD;IACF;QAIK2D;IAFL,qBACE,oBAACxC;QAAIlD,WAAWkB,WAAWyE,eAAe;OACvCD,CAAAA,iBAAAA,0BAAAA,oCAAAA,cAAgB3F,oBAAhB2F,4BAAAA,+BAA0B,oBAACb,mBAAsB9E,sBAClD,oBAAC4E,iBAAoB5E;AAG3B;AACA0F,mBAAmB9D,WAAW,GAAG;AAEjC,SAASiE,oBAAoB,EAAEzD,YAAY,EAAE0D,aAAa,EAAqB;IAC7E,MAAMC,YAAY3D,gBAAgB0D,iBAAiB,IAAIrD,OAAOC,WAAW;IACzE,MAAMZ,WAAWkE,KAAKC,KAAK,CAACF,YAAY,MAAM;IAE9C,MAAMG,sBAAsB/G,MAAMwB,MAAM,CAAqBmB;IAC7D3C,MAAMwB,MAAM,CAAC;QACXuF,oBAAoBpF,OAAO,GAAGgB;IAChC;IACA,MAAMqE,mBAAmBD,oBAAoBpF,OAAO;IAEpD,IAAI,CAACqF,oBAAoBA,qBAAqBrE,UAAU;QACtD,OAAOjC;IACT,OAAO,IAAIsG,mBAAmBrE,UAAU;QACtC,OAAO;IACT,OAAO;QACL,OAAO;IACT;AACF;AAEA,SAASsE,kBAAkB,EAAEhE,YAAY,EAAE0D,aAAa,EAAEO,cAAc,EAAqB;IAC3F,MAAMN,YAAY5G,MAAMmH,OAAO,CAAC;QAC9B,OAAOlE,gBAAgB0D,iBAAiBE,KAAKC,KAAK,CAAC,IAAIxD,OAAOC,WAAW,KAAK,MAAM;IACtF,GAAG;QAACoD;QAAe1D;KAAa;IAEhC,MAAM,CAACN,UAAUyE,YAAY,GAAGpH,MAAMqH,QAAQ,CAAST;IAEvD,MAAMU,YAAY;QAChB,MAAMC,cAAc5E,WAAWrC;QAC/B8G,YAAYG;QACZL,2BAAAA,qCAAAA,eAAiBK;IACnB;IAEA,MAAMC,gBAAgB;QACpB,MAAMD,cAAc5E,WAAWrC;QAC/B8G,YAAYG;QACZL,2BAAAA,qCAAAA,eAAiBK;IACnB;IAEAvH,MAAMyH,SAAS,CAAC;QACdL,YAAYR;IACd,GAAG;QAACA;KAAU;IAEd,MAAMhE,SAASD,WAAWrC,aAAa;IAEvC,OAAO;QAACqC;QAAUC;QAAQ0E;QAAWE;KAAc;AACrD;AAEA;;CAEC,GACD,OAAO,MAAME,eAA2D7G,CAAAA;IACtE,MAAMiC,mBAAmB4D,oBAAoB7F;IAC7C,MAAM,CAAC8B,UAAUC,QAAQ0E,WAAWE,cAAc,GAAGP,kBAAkBpG;IAEvE,MAAM8G,UAAU3H,MAAMwB,MAAM,CAAmB;IAE/CxB,MAAMyB,mBAAmB,CAACZ,MAAMO,YAAY,EAAE,IAAO,CAAA;YACnDM;oBACEiG,wBAAAA;iBAAAA,mBAAAA,QAAQhG,OAAO,cAAfgG,wCAAAA,yBAAAA,iBAAiBjG,KAAK,cAAtBiG,6CAAAA,4BAAAA;YACF;QACF,CAAA;IAEA,MAAM,EAAE7G,SAAS,EAAE,GAAGD;IAEtB,MAAMmB,aAAa3B,+BAA+B;QAChDS;IACF;IAEA,qBACE,oBAACkD;QAAIlD,WAAWkB,WAAW4F,IAAI;qBAC7B,oBAACrB;QACE,GAAG1F,KAAK;QACT8B,UAAUA;QACVC,QAAQA;QACRiC,cAAc2C;QACd1C,cAAcwC;QACdxE,kBAAkBA;sBAEpB,oBAACJ;QACE,GAAG7B,KAAK;QACT8B,UAAUA;QACVC,QAAQA;QACRE,kBAAkBA;QAClB1B,cAAcuG;;AAItB,EAAE;AACFD,aAAajF,WAAW,GAAG"}
+{"version":3,"sources":["../src/components/CalendarYear/CalendarYear.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { mergeClasses } from '@griffel/react';\nimport { useCalendarYearStyles_unstable } from './useCalendarYearStyles.styles';\nimport type {\n  CalendarYearStrings,\n  CalendarYearProps,\n  CalendarYearRange,\n  CalendarYearHeaderProps,\n} from './CalendarYear.types';\n\nconst CELL_COUNT = 12;\nconst CELLS_PER_ROW = 4;\n\nconst DefaultCalendarYearStrings: CalendarYearStrings = {\n  prevRangeAriaLabel: undefined,\n  nextRangeAriaLabel: undefined,\n};\ninterface CalendarYearGrid {\n  focus(): void;\n}\n\ninterface CalendarYearGridCellProps extends CalendarYearProps {\n  year: number;\n  current?: boolean;\n  selected?: boolean;\n  disabled?: boolean;\n  onSelectYear?: (year: number) => void;\n  onRenderYear?: (year: number) => React.ReactNode;\n}\n\ninterface CalendarYearGridProps extends CalendarYearProps, CalendarYearRange {\n  selectedYear?: number;\n  animateBackwards?: boolean;\n  componentRef?: React.RefObject<CalendarYearGridCell | null>;\n}\n\ninterface CalendarYearGridCell {\n  focus(): void;\n}\n\nconst CalendarYearGridCell: React.FunctionComponent<CalendarYearGridCellProps> = props => {\n  const {\n    className,\n    highlightCurrentYear,\n    highlightSelectedYear,\n    year,\n    selected,\n    disabled,\n    componentRef,\n    onSelectYear,\n    onRenderYear,\n  } = props;\n\n  const buttonRef = React.useRef<HTMLButtonElement>(null);\n\n  React.useImperativeHandle(\n    componentRef,\n    () => ({\n      focus() {\n        buttonRef.current?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  const onClick = () => {\n    onSelectYear?.(year);\n  };\n\n  const onKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter) {\n      onSelectYear?.(year);\n    }\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    highlightCurrent: highlightCurrentYear,\n    highlightSelected: highlightSelectedYear,\n  });\n\n  return (\n    <button\n      className={mergeClasses(classNames.itemButton, selected && classNames.selected, disabled && classNames.disabled)}\n      type=\"button\"\n      role=\"gridcell\"\n      onClick={!disabled ? onClick : undefined}\n      onKeyDown={!disabled ? onKeyDown : undefined}\n      disabled={disabled}\n      aria-selected={selected}\n      ref={buttonRef}\n    >\n      {onRenderYear?.(year) ?? year}\n    </button>\n  );\n};\nCalendarYearGridCell.displayName = 'CalendarYearGridCell';\n\nconst CalendarYearGrid: React.FunctionComponent<CalendarYearGridProps> = props => {\n  const {\n    className,\n    fromYear,\n    toYear,\n    animationDirection,\n    animateBackwards,\n    minYear,\n    maxYear,\n    onSelectYear,\n    selectedYear,\n    componentRef,\n  } = props;\n\n  const selectedCellRef = React.useRef<CalendarYearGridCell>(null);\n\n  const currentCellRef = React.useRef<CalendarYearGridCell>(null);\n\n  React.useImperativeHandle(\n    componentRef,\n    () => ({\n      focus() {\n        (selectedCellRef.current || currentCellRef.current)?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  const renderCell = (yearToRender: number): React.ReactNode => {\n    const selected = yearToRender === selectedYear;\n    const disabled =\n      (minYear !== undefined && yearToRender < minYear) || (maxYear !== undefined && yearToRender > maxYear);\n    const current = yearToRender === new Date().getFullYear();\n\n    return (\n      <CalendarYearGridCell\n        {...props}\n        key={yearToRender}\n        year={yearToRender}\n        selected={selected}\n        current={current}\n        disabled={disabled}\n        onSelectYear={onSelectYear}\n        componentRef={selected ? selectedCellRef : current ? currentCellRef : undefined}\n      />\n    );\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    animateBackwards,\n    animationDirection,\n  });\n\n  const onRenderYear = (value: number) => {\n    return props.onRenderYear?.(value) ?? value;\n  };\n\n  const gridAriaLabel = `${onRenderYear(fromYear)} - ${onRenderYear(toYear)}`;\n\n  let year = fromYear;\n  const cells: React.ReactNode[][] = [];\n\n  for (let i = 0; i < (toYear - fromYear + 1) / CELLS_PER_ROW; i++) {\n    cells.push([]);\n    for (let j = 0; j < CELLS_PER_ROW; j++) {\n      cells[i].push(renderCell(year));\n      year++;\n    }\n  }\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid' });\n\n  return (\n    <div {...arrowNavigationAttributes} className={classNames.gridContainer} role=\"grid\" aria-label={gridAriaLabel}>\n      {cells.map((cellRow: React.ReactNode[], index: number) => {\n        return (\n          <div key={'yearPickerRow_' + index + '_' + fromYear} role=\"row\" className={classNames.buttonRow}>\n            {cellRow}\n          </div>\n        );\n      })}\n    </div>\n  );\n};\nCalendarYearGrid.displayName = 'CalendarYearGrid';\n\nconst CalendarYearNavDirection = {\n  Previous: 0 as const,\n  Next: 1 as const,\n};\n\ninterface CalendarYearNavArrowProps extends CalendarYearHeaderProps {\n  direction: (typeof CalendarYearNavDirection)[keyof typeof CalendarYearNavDirection];\n}\n\nconst CalendarYearNavArrow: React.FunctionComponent<CalendarYearNavArrowProps> = props => {\n  const {\n    className,\n    strings = DefaultCalendarYearStrings,\n    direction,\n    onSelectPrev,\n    onSelectNext,\n    fromYear,\n    toYear,\n    maxYear,\n    minYear,\n    navigationIcons,\n  } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  const ariaLabel =\n    direction === CalendarYearNavDirection.Previous ? strings.prevRangeAriaLabel : strings.nextRangeAriaLabel;\n  const newRangeOffset = direction === CalendarYearNavDirection.Previous ? -CELL_COUNT : CELL_COUNT;\n  const newRange = { fromYear: fromYear + newRangeOffset, toYear: toYear + newRangeOffset };\n  const ariaLabelString = ariaLabel ? (typeof ariaLabel === 'string' ? ariaLabel : ariaLabel(newRange)) : undefined;\n  const disabled =\n    direction === CalendarYearNavDirection.Previous\n      ? minYear !== undefined && fromYear < minYear\n      : maxYear !== undefined && props.fromYear + CELL_COUNT > maxYear;\n\n  const onNavigate = () => {\n    direction === CalendarYearNavDirection.Previous ? onSelectPrev?.() : onSelectNext?.();\n  };\n\n  const onKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter) {\n      onNavigate();\n    }\n  };\n\n  return (\n    <button\n      className={mergeClasses(classNames.navigationButton, disabled && classNames.disabled)}\n      onClick={!disabled ? onNavigate : undefined}\n      onKeyDown={!disabled ? onKeyDown : undefined}\n      type=\"button\"\n      title={ariaLabelString}\n      disabled={disabled}\n    >\n      {direction === CalendarYearNavDirection.Previous ? navigationIcons.upNavigation : navigationIcons.downNavigation}\n    </button>\n  );\n};\nCalendarYearNavArrow.displayName = 'CalendarYearNavArrow';\n\nconst CalendarYearNav: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const { className } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  return (\n    <div className={classNames.navigationButtonsContainer}>\n      <CalendarYearNavArrow {...props} direction={CalendarYearNavDirection.Previous} />\n      <CalendarYearNavArrow {...props} direction={CalendarYearNavDirection.Next} />\n    </div>\n  );\n};\nCalendarYearNav.displayName = 'CalendarYearNav';\n\nconst CalendarYearTitle: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const {\n    className,\n    fromYear,\n    toYear,\n    strings = DefaultCalendarYearStrings,\n    animateBackwards,\n    animationDirection,\n  } = props;\n\n  const onHeaderSelect = () => {\n    props.onHeaderSelect?.(true);\n  };\n\n  const onHeaderKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter || ev.key === Space) {\n      onHeaderSelect();\n    }\n  };\n\n  const onRenderYear = (year: number) => {\n    return props.onRenderYear?.(year) ?? year;\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!props.onHeaderSelect,\n    animateBackwards,\n    animationDirection,\n  });\n\n  if (props.onHeaderSelect) {\n    const rangeAriaLabel = strings.rangeAriaLabel;\n    const headerAriaLabelFormatString = strings.headerAriaLabelFormatString;\n    const currentDateRange = rangeAriaLabel\n      ? typeof rangeAriaLabel === 'string'\n        ? rangeAriaLabel\n        : rangeAriaLabel(props)\n      : undefined;\n\n    const ariaLabel = headerAriaLabelFormatString\n      ? headerAriaLabelFormatString.replace('{0}', currentDateRange ?? '')\n      : currentDateRange;\n\n    return (\n      <button\n        className={classNames.currentItemButton}\n        onClick={onHeaderSelect}\n        onKeyDown={onHeaderKeyDown}\n        aria-label={ariaLabel}\n        role=\"button\"\n        type=\"button\"\n      >\n        <span aria-live=\"assertive\" aria-atomic=\"true\">\n          {onRenderYear(fromYear)} - {onRenderYear(toYear)}\n        </span>\n      </button>\n    );\n  }\n\n  return (\n    <div className={classNames.current}>\n      {onRenderYear(fromYear)} - {onRenderYear(toYear)}\n    </div>\n  );\n};\nCalendarYearTitle.displayName = 'CalendarYearTitle';\n\nconst CalendarYearHeader: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const { className, animateBackwards, animationDirection, onRenderTitle } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!props.onHeaderSelect,\n    animateBackwards,\n    animationDirection,\n  });\n\n  return (\n    <div className={classNames.headerContainer}>\n      {onRenderTitle?.(props) ?? <CalendarYearTitle {...props} />}\n      <CalendarYearNav {...props} />\n    </div>\n  );\n};\nCalendarYearHeader.displayName = 'CalendarYearHeader';\n\nfunction useAnimateBackwards({ selectedYear, navigatedYear }: CalendarYearProps) {\n  const rangeYear = selectedYear || navigatedYear || new Date().getFullYear();\n  const fromYear = Math.floor(rangeYear / 10) * 10;\n\n  const previousFromYearRef = React.useRef<number | undefined>(fromYear);\n  React.useRef(() => {\n    previousFromYearRef.current = fromYear;\n  });\n  // eslint-disable-next-line react-hooks/refs\n  const previousFromYear = previousFromYearRef.current;\n\n  // eslint-disable-next-line react-hooks/refs\n  if (!previousFromYear || previousFromYear === fromYear) {\n    return undefined;\n  } else if (previousFromYear > fromYear) {\n    return true;\n  } else {\n    return false;\n  }\n}\n\nfunction useYearRangeState({ selectedYear, navigatedYear, onNavigateDate }: CalendarYearProps) {\n  const rangeYear = React.useMemo(() => {\n    return selectedYear || navigatedYear || Math.floor(new Date().getFullYear() / 10) * 10;\n  }, [navigatedYear, selectedYear]);\n\n  const [fromYear, setFromYear] = React.useState<number>(rangeYear);\n\n  const onNavNext = () => {\n    const newFromYear = fromYear + CELL_COUNT;\n    setFromYear(newFromYear);\n    onNavigateDate?.(newFromYear);\n  };\n\n  const onNavPrevious = () => {\n    const newFromYear = fromYear - CELL_COUNT;\n    setFromYear(newFromYear);\n    onNavigateDate?.(newFromYear);\n  };\n\n  React.useEffect(() => {\n    // eslint-disable-next-line react-hooks/set-state-in-effect\n    setFromYear(rangeYear);\n  }, [rangeYear]);\n\n  const toYear = fromYear + CELL_COUNT - 1;\n\n  return [fromYear, toYear, onNavNext, onNavPrevious] as const;\n}\n\n/**\n * @internal\n */\nexport const CalendarYear: React.FunctionComponent<CalendarYearProps> = props => {\n  const animateBackwards = useAnimateBackwards(props);\n  const [fromYear, toYear, onNavNext, onNavPrevious] = useYearRangeState(props);\n\n  const gridRef = React.useRef<CalendarYearGrid>(null);\n\n  React.useImperativeHandle(props.componentRef, () => ({\n    focus() {\n      gridRef.current?.focus?.();\n    },\n  }));\n\n  const { className } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  return (\n    <div className={classNames.root}>\n      <CalendarYearHeader\n        {...props}\n        fromYear={fromYear}\n        toYear={toYear}\n        onSelectPrev={onNavPrevious}\n        onSelectNext={onNavNext}\n        animateBackwards={animateBackwards}\n      />\n      <CalendarYearGrid\n        {...props}\n        fromYear={fromYear}\n        toYear={toYear}\n        animateBackwards={animateBackwards}\n        componentRef={gridRef}\n      />\n    </div>\n  );\n};\nCalendarYear.displayName = 'CalendarYear';\n"],"names":["React","Enter","Space","useArrowNavigationGroup","mergeClasses","useCalendarYearStyles_unstable","CELL_COUNT","CELLS_PER_ROW","DefaultCalendarYearStrings","prevRangeAriaLabel","undefined","nextRangeAriaLabel","CalendarYearGridCell","props","className","highlightCurrentYear","highlightSelectedYear","year","selected","disabled","componentRef","onSelectYear","onRenderYear","buttonRef","useRef","useImperativeHandle","focus","current","onClick","onKeyDown","ev","key","classNames","highlightCurrent","highlightSelected","button","itemButton","type","role","aria-selected","ref","displayName","CalendarYearGrid","fromYear","toYear","animationDirection","animateBackwards","minYear","maxYear","selectedYear","selectedCellRef","currentCellRef","renderCell","yearToRender","Date","getFullYear","value","gridAriaLabel","cells","i","push","j","arrowNavigationAttributes","axis","div","gridContainer","aria-label","map","cellRow","index","buttonRow","CalendarYearNavDirection","Previous","Next","CalendarYearNavArrow","strings","direction","onSelectPrev","onSelectNext","navigationIcons","ariaLabel","newRangeOffset","newRange","ariaLabelString","onNavigate","navigationButton","title","upNavigation","downNavigation","CalendarYearNav","navigationButtonsContainer","CalendarYearTitle","onHeaderSelect","onHeaderKeyDown","hasHeaderClickCallback","rangeAriaLabel","headerAriaLabelFormatString","currentDateRange","replace","currentItemButton","span","aria-live","aria-atomic","CalendarYearHeader","onRenderTitle","headerContainer","useAnimateBackwards","navigatedYear","rangeYear","Math","floor","previousFromYearRef","previousFromYear","useYearRangeState","onNavigateDate","useMemo","setFromYear","useState","onNavNext","newFromYear","onNavPrevious","useEffect","CalendarYear","gridRef","root"],"mappings":"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"}

package/lib-commonjs/components/CalendarDayGrid/CalendarDayGrid.js

@@ -40,8 +40,10 @@ function useAnimateBackwards(weeks) {
         previousNavigatedDateRef.current = weeks[0][0].originalDate;
     });
     const previousNavigatedDate = previousNavigatedDateRef.current;
+    // eslint-disable-next-line react-hooks/refs
     if (!previousNavigatedDate || previousNavigatedDate.getTime() === weeks[0][0].originalDate.getTime()) {
         return undefined;
+    // eslint-disable-next-line react-hooks/refs
     } else if (previousNavigatedDate <= weeks[0][0].originalDate) {
         return false;
     } else {
@@ -59,6 +61,7 @@ const CalendarDayGrid = (props)=>{
             maxDate,
             restrictedDates
         };
+        // eslint-disable-next-line react-hooks/immutability
         let dateRange = (0, _utils.getDateRangeArray)(selectedDate, dateRangeType, firstDayOfWeek, workWeekDays, daysToSelectInDayView);
         dateRange = (0, _utils.getBoundedDateRange)(dateRange, minDate, maxDate);
         dateRange = dateRange.filter((d)=>{

package/lib-commonjs/components/CalendarDayGrid/CalendarDayGrid.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CalendarDayGrid/CalendarDayGrid.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { useId } from '@fluentui/react-utilities';\nimport { getBoundedDateRange, getDateRangeArray, isRestrictedDate, DateRangeType } from '../../utils';\nimport { useCalendarDayGridStyles_unstable } from './useCalendarDayGridStyles.styles';\nimport { CalendarMonthHeaderRow } from './CalendarMonthHeaderRow';\nimport { CalendarGridRow } from './CalendarGridRow';\nimport { useWeeks } from './useWeeks';\nimport type { WeekCorners } from './useWeekCornerStyles.styles';\nimport { useWeekCornerStyles } from './useWeekCornerStyles.styles';\nimport { mergeClasses } from '@griffel/react';\nimport type { Day, DayOfWeek } from '../../utils';\nimport type { CalendarDayGridProps } from './CalendarDayGrid.types';\n\nexport interface DayInfo extends Day {\n  onSelected: () => void;\n  setRef(element: HTMLElement | null): void;\n}\n\nfunction useDayRefs() {\n  const daysRef = React.useRef<Record<string, HTMLElement>>({});\n\n  const getSetRefCallback = (dayKey: string) => (element: HTMLElement | null) => {\n    if (element === null) {\n      delete daysRef.current[dayKey];\n    } else {\n      daysRef.current[dayKey] = element;\n    }\n  };\n\n  return [daysRef, getSetRefCallback] as const;\n}\n\nfunction useAnimateBackwards(weeks: DayInfo[][]): boolean | undefined {\n  const previousNavigatedDateRef = React.useRef<Date | undefined>(undefined);\n  React.useEffect(() => {\n    previousNavigatedDateRef.current = weeks[0][0].originalDate;\n  });\n  const previousNavigatedDate = previousNavigatedDateRef.current;\n\n  if (!previousNavigatedDate || previousNavigatedDate.getTime() === weeks[0][0].originalDate.getTime()) {\n    return undefined;\n  } else if (previousNavigatedDate <= weeks[0][0].originalDate) {\n    return false;\n  } else {\n    return true;\n  }\n}\n\nexport const CalendarDayGrid: React.FunctionComponent<CalendarDayGridProps> = props => {\n  const navigatedDayRef = React.useRef<HTMLTableCellElement>(\n    null,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ) as React.MutableRefObject<HTMLTableCellElement | null>;\n\n  const activeDescendantId = useId();\n\n  const onSelectDate = (selectedDate: Date): void => {\n    const { firstDayOfWeek, minDate, maxDate, workWeekDays, daysToSelectInDayView, restrictedDates } = props;\n    const restrictedDatesOptions = { minDate, maxDate, restrictedDates };\n\n    let dateRange = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek, workWeekDays, daysToSelectInDayView);\n    dateRange = getBoundedDateRange(dateRange, minDate, maxDate);\n\n    dateRange = dateRange.filter((d: Date) => {\n      return !isRestrictedDate(d, restrictedDatesOptions);\n    });\n\n    props.onSelectDate?.(selectedDate, dateRange);\n    props.onNavigateDate?.(selectedDate, true);\n  };\n\n  const [daysRef, getSetRefCallback] = useDayRefs();\n\n  const weeks = useWeeks(props, onSelectDate, getSetRefCallback);\n  const animateBackwards = useAnimateBackwards(weeks);\n  const [getWeekCornerStyles, calculateRoundedStyles] = useWeekCornerStyles(props);\n\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      focus() {\n        navigatedDayRef.current?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  /**\n   *\n   * Section for setting hover/pressed styles. Because we want arbitrary blobs of days to be selectable, to support\n   * highlighting every day in the month for month view, css :hover style isn't enough, so we need mouse callbacks\n   * to set classnames on all relevant child refs to apply the styling\n   *\n   */\n  const getDayInfosInRangeOfDay = (dayToCompare: DayInfo): DayInfo[] => {\n    // The hover state looks weird with non-contiguous days in work week view. In work week, show week hover state\n    const dateRangeHoverType = getDateRangeTypeToUse(props.dateRangeType, props.workWeekDays);\n\n    // gets all the dates for the given date range type that are in the same date range as the given day\n    const dateRange = getDateRangeArray(\n      dayToCompare.originalDate,\n      dateRangeHoverType,\n      props.firstDayOfWeek,\n      props.workWeekDays,\n      props.daysToSelectInDayView,\n    ).map((date: Date) => date.getTime());\n\n    // gets all the day refs for the given dates\n    const dayInfosInRange = weeks.reduce((accumulatedValue: DayInfo[], currentWeek: DayInfo[]) => {\n      return accumulatedValue.concat(\n        currentWeek.filter((weekDay: DayInfo) => dateRange.indexOf(weekDay.originalDate.getTime()) !== -1),\n      );\n    }, []);\n\n    return dayInfosInRange;\n  };\n\n  const getRefsFromDayInfos = (dayInfosInRange: DayInfo[]): (HTMLElement | null)[] => {\n    let dayRefs: (HTMLElement | null)[] = [];\n    dayRefs = dayInfosInRange.map((dayInfo: DayInfo) => daysRef.current[dayInfo.key]);\n\n    return dayRefs;\n  };\n\n  const {\n    gridLabel,\n    dateRangeType,\n    showWeekNumbers,\n    labelledBy,\n    lightenDaysOutsideNavigatedMonth,\n    animationDirection,\n  } = props;\n\n  const classNames = useCalendarDayGridStyles_unstable({\n    animateBackwards,\n    animationDirection,\n    dateRangeType,\n    lightenDaysOutsideNavigatedMonth:\n      lightenDaysOutsideNavigatedMonth === undefined ? true : lightenDaysOutsideNavigatedMonth,\n    showWeekNumbers,\n  });\n\n  // When the month is highlighted get the corner dates so that styles can be added to them\n  const weekCorners: WeekCorners = getWeekCornerStyles(weeks!);\n  const partialWeekProps = {\n    weeks,\n    navigatedDayRef,\n    calculateRoundedStyles,\n    activeDescendantId,\n    classNames,\n    weekCorners,\n    getDayInfosInRangeOfDay,\n    getRefsFromDayInfos,\n  } as const;\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid-linear' });\n\n  return (\n    <table\n      className={mergeClasses(classNames.table, props.className)}\n      aria-multiselectable=\"false\"\n      aria-label={gridLabel}\n      aria-labelledby={labelledBy}\n      aria-activedescendant={activeDescendantId}\n      role=\"grid\"\n      {...arrowNavigationAttributes}\n    >\n      <tbody>\n        <CalendarMonthHeaderRow {...props} classNames={classNames} weeks={weeks} />\n        <CalendarGridRow\n          {...props}\n          {...partialWeekProps}\n          week={weeks[0]}\n          weekIndex={-1}\n          rowClassName={classNames.firstTransitionWeek}\n          aria-role=\"presentation\"\n          ariaHidden={true}\n        />\n        {weeks!.slice(1, weeks!.length - 1).map((week: DayInfo[], weekIndex: number) => (\n          <CalendarGridRow\n            {...props}\n            {...partialWeekProps}\n            key={weekIndex}\n            week={week}\n            weekIndex={weekIndex}\n            rowClassName={classNames.weekRow}\n          />\n        ))}\n        <CalendarGridRow\n          {...props}\n          {...partialWeekProps}\n          week={weeks![weeks!.length - 1]}\n          weekIndex={-2}\n          rowClassName={classNames.lastTransitionWeek}\n          aria-role=\"presentation\"\n          ariaHidden={true}\n        />\n      </tbody>\n    </table>\n  );\n};\nCalendarDayGrid.displayName = 'CalendarDayGrid';\n\n/**\n * When given work week, if the days are non-contiguous, the hover states look really weird. So for non-contiguous\n * work weeks, we'll just show week view instead.\n */\nfunction getDateRangeTypeToUse(dateRangeType: DateRangeType, workWeekDays: DayOfWeek[] | undefined): DateRangeType {\n  if (workWeekDays && dateRangeType === DateRangeType.WorkWeek) {\n    const sortedWWDays = workWeekDays.slice().sort();\n    let isContiguous = true;\n    for (let i = 1; i < sortedWWDays.length; i++) {\n      if (sortedWWDays[i] !== sortedWWDays[i - 1] + 1) {\n        isContiguous = false;\n        break;\n      }\n    }\n\n    if (!isContiguous || workWeekDays.length === 0) {\n      return DateRangeType.Week;\n    }\n  }\n\n  return dateRangeType;\n}\n"],"names":["React","useArrowNavigationGroup","useId","getBoundedDateRange","getDateRangeArray","isRestrictedDate","DateRangeType","useCalendarDayGridStyles_unstable","CalendarMonthHeaderRow","CalendarGridRow","useWeeks","useWeekCornerStyles","mergeClasses","useDayRefs","daysRef","useRef","getSetRefCallback","dayKey","element","current","useAnimateBackwards","weeks","previousNavigatedDateRef","undefined","useEffect","originalDate","previousNavigatedDate","getTime","CalendarDayGrid","props","navigatedDayRef","activeDescendantId","onSelectDate","selectedDate","firstDayOfWeek","minDate","maxDate","workWeekDays","daysToSelectInDayView","restrictedDates","restrictedDatesOptions","dateRange","dateRangeType","filter","d","onNavigateDate","animateBackwards","getWeekCornerStyles","calculateRoundedStyles","useImperativeHandle","componentRef","focus","getDayInfosInRangeOfDay","dayToCompare","dateRangeHoverType","getDateRangeTypeToUse","map","date","dayInfosInRange","reduce","accumulatedValue","currentWeek","concat","weekDay","indexOf","getRefsFromDayInfos","dayRefs","dayInfo","key","gridLabel","showWeekNumbers","labelledBy","lightenDaysOutsideNavigatedMonth","animationDirection","classNames","weekCorners","partialWeekProps","arrowNavigationAttributes","axis","table","className","aria-multiselectable","aria-label","aria-labelledby","aria-activedescendant","role","tbody","week","weekIndex","rowClassName","firstTransitionWeek","aria-role","ariaHidden","slice","length","weekRow","lastTransitionWeek","displayName","WorkWeek","sortedWWDays","sort","isContiguous","i","Week"],"mappings":"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"}
+{"version":3,"sources":["../src/components/CalendarDayGrid/CalendarDayGrid.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { useId } from '@fluentui/react-utilities';\nimport { getBoundedDateRange, getDateRangeArray, isRestrictedDate, DateRangeType } from '../../utils';\nimport { useCalendarDayGridStyles_unstable } from './useCalendarDayGridStyles.styles';\nimport { CalendarMonthHeaderRow } from './CalendarMonthHeaderRow';\nimport { CalendarGridRow } from './CalendarGridRow';\nimport { useWeeks } from './useWeeks';\nimport type { WeekCorners } from './useWeekCornerStyles.styles';\nimport { useWeekCornerStyles } from './useWeekCornerStyles.styles';\nimport { mergeClasses } from '@griffel/react';\nimport type { Day, DayOfWeek } from '../../utils';\nimport type { CalendarDayGridProps } from './CalendarDayGrid.types';\n\nexport interface DayInfo extends Day {\n  onSelected: () => void;\n  setRef(element: HTMLElement | null): void;\n}\n\nfunction useDayRefs() {\n  const daysRef = React.useRef<Record<string, HTMLElement>>({});\n\n  const getSetRefCallback = (dayKey: string) => (element: HTMLElement | null) => {\n    if (element === null) {\n      delete daysRef.current[dayKey];\n    } else {\n      daysRef.current[dayKey] = element;\n    }\n  };\n\n  return [daysRef, getSetRefCallback] as const;\n}\n\nfunction useAnimateBackwards(weeks: DayInfo[][]): boolean | undefined {\n  const previousNavigatedDateRef = React.useRef<Date | undefined>(undefined);\n  React.useEffect(() => {\n    previousNavigatedDateRef.current = weeks[0][0].originalDate;\n  });\n  const previousNavigatedDate = previousNavigatedDateRef.current;\n\n  // eslint-disable-next-line react-hooks/refs\n  if (!previousNavigatedDate || previousNavigatedDate.getTime() === weeks[0][0].originalDate.getTime()) {\n    return undefined;\n    // eslint-disable-next-line react-hooks/refs\n  } else if (previousNavigatedDate <= weeks[0][0].originalDate) {\n    return false;\n  } else {\n    return true;\n  }\n}\n\nexport const CalendarDayGrid: React.FunctionComponent<CalendarDayGridProps> = props => {\n  const navigatedDayRef = React.useRef<HTMLTableCellElement>(\n    null,\n    // eslint-disable-next-line @typescript-eslint/no-deprecated\n  ) as React.MutableRefObject<HTMLTableCellElement | null>;\n\n  const activeDescendantId = useId();\n\n  const onSelectDate = (selectedDate: Date): void => {\n    const { firstDayOfWeek, minDate, maxDate, workWeekDays, daysToSelectInDayView, restrictedDates } = props;\n    const restrictedDatesOptions = { minDate, maxDate, restrictedDates };\n\n    // eslint-disable-next-line react-hooks/immutability\n    let dateRange = getDateRangeArray(selectedDate, dateRangeType, firstDayOfWeek, workWeekDays, daysToSelectInDayView);\n    dateRange = getBoundedDateRange(dateRange, minDate, maxDate);\n\n    dateRange = dateRange.filter((d: Date) => {\n      return !isRestrictedDate(d, restrictedDatesOptions);\n    });\n\n    props.onSelectDate?.(selectedDate, dateRange);\n    props.onNavigateDate?.(selectedDate, true);\n  };\n\n  const [daysRef, getSetRefCallback] = useDayRefs();\n\n  const weeks = useWeeks(props, onSelectDate, getSetRefCallback);\n  const animateBackwards = useAnimateBackwards(weeks);\n  const [getWeekCornerStyles, calculateRoundedStyles] = useWeekCornerStyles(props);\n\n  React.useImperativeHandle(\n    props.componentRef,\n    () => ({\n      focus() {\n        navigatedDayRef.current?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  /**\n   *\n   * Section for setting hover/pressed styles. Because we want arbitrary blobs of days to be selectable, to support\n   * highlighting every day in the month for month view, css :hover style isn't enough, so we need mouse callbacks\n   * to set classnames on all relevant child refs to apply the styling\n   *\n   */\n  const getDayInfosInRangeOfDay = (dayToCompare: DayInfo): DayInfo[] => {\n    // The hover state looks weird with non-contiguous days in work week view. In work week, show week hover state\n    const dateRangeHoverType = getDateRangeTypeToUse(props.dateRangeType, props.workWeekDays);\n\n    // gets all the dates for the given date range type that are in the same date range as the given day\n    const dateRange = getDateRangeArray(\n      dayToCompare.originalDate,\n      dateRangeHoverType,\n      props.firstDayOfWeek,\n      props.workWeekDays,\n      props.daysToSelectInDayView,\n    ).map((date: Date) => date.getTime());\n\n    // gets all the day refs for the given dates\n    const dayInfosInRange = weeks.reduce((accumulatedValue: DayInfo[], currentWeek: DayInfo[]) => {\n      return accumulatedValue.concat(\n        currentWeek.filter((weekDay: DayInfo) => dateRange.indexOf(weekDay.originalDate.getTime()) !== -1),\n      );\n    }, []);\n\n    return dayInfosInRange;\n  };\n\n  const getRefsFromDayInfos = (dayInfosInRange: DayInfo[]): (HTMLElement | null)[] => {\n    let dayRefs: (HTMLElement | null)[] = [];\n    dayRefs = dayInfosInRange.map((dayInfo: DayInfo) => daysRef.current[dayInfo.key]);\n\n    return dayRefs;\n  };\n\n  const {\n    gridLabel,\n    dateRangeType,\n    showWeekNumbers,\n    labelledBy,\n    lightenDaysOutsideNavigatedMonth,\n    animationDirection,\n  } = props;\n\n  const classNames = useCalendarDayGridStyles_unstable({\n    animateBackwards,\n    animationDirection,\n    dateRangeType,\n    lightenDaysOutsideNavigatedMonth:\n      lightenDaysOutsideNavigatedMonth === undefined ? true : lightenDaysOutsideNavigatedMonth,\n    showWeekNumbers,\n  });\n\n  // When the month is highlighted get the corner dates so that styles can be added to them\n  const weekCorners: WeekCorners = getWeekCornerStyles(weeks!);\n  const partialWeekProps = {\n    weeks,\n    navigatedDayRef,\n    calculateRoundedStyles,\n    activeDescendantId,\n    classNames,\n    weekCorners,\n    getDayInfosInRangeOfDay,\n    getRefsFromDayInfos,\n  } as const;\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid-linear' });\n\n  return (\n    <table\n      className={mergeClasses(classNames.table, props.className)}\n      aria-multiselectable=\"false\"\n      aria-label={gridLabel}\n      aria-labelledby={labelledBy}\n      aria-activedescendant={activeDescendantId}\n      role=\"grid\"\n      {...arrowNavigationAttributes}\n    >\n      <tbody>\n        <CalendarMonthHeaderRow {...props} classNames={classNames} weeks={weeks} />\n        <CalendarGridRow\n          {...props}\n          {...partialWeekProps}\n          week={weeks[0]}\n          weekIndex={-1}\n          rowClassName={classNames.firstTransitionWeek}\n          aria-role=\"presentation\"\n          ariaHidden={true}\n        />\n        {weeks!.slice(1, weeks!.length - 1).map((week: DayInfo[], weekIndex: number) => (\n          <CalendarGridRow\n            {...props}\n            {...partialWeekProps}\n            key={weekIndex}\n            week={week}\n            weekIndex={weekIndex}\n            rowClassName={classNames.weekRow}\n          />\n        ))}\n        <CalendarGridRow\n          {...props}\n          {...partialWeekProps}\n          week={weeks![weeks!.length - 1]}\n          weekIndex={-2}\n          rowClassName={classNames.lastTransitionWeek}\n          aria-role=\"presentation\"\n          ariaHidden={true}\n        />\n      </tbody>\n    </table>\n  );\n};\nCalendarDayGrid.displayName = 'CalendarDayGrid';\n\n/**\n * When given work week, if the days are non-contiguous, the hover states look really weird. So for non-contiguous\n * work weeks, we'll just show week view instead.\n */\nfunction getDateRangeTypeToUse(dateRangeType: DateRangeType, workWeekDays: DayOfWeek[] | undefined): DateRangeType {\n  if (workWeekDays && dateRangeType === DateRangeType.WorkWeek) {\n    const sortedWWDays = workWeekDays.slice().sort();\n    let isContiguous = true;\n    for (let i = 1; i < sortedWWDays.length; i++) {\n      if (sortedWWDays[i] !== sortedWWDays[i - 1] + 1) {\n        isContiguous = false;\n        break;\n      }\n    }\n\n    if (!isContiguous || workWeekDays.length === 0) {\n      return DateRangeType.Week;\n    }\n  }\n\n  return dateRangeType;\n}\n"],"names":["React","useArrowNavigationGroup","useId","getBoundedDateRange","getDateRangeArray","isRestrictedDate","DateRangeType","useCalendarDayGridStyles_unstable","CalendarMonthHeaderRow","CalendarGridRow","useWeeks","useWeekCornerStyles","mergeClasses","useDayRefs","daysRef","useRef","getSetRefCallback","dayKey","element","current","useAnimateBackwards","weeks","previousNavigatedDateRef","undefined","useEffect","originalDate","previousNavigatedDate","getTime","CalendarDayGrid","props","navigatedDayRef","activeDescendantId","onSelectDate","selectedDate","firstDayOfWeek","minDate","maxDate","workWeekDays","daysToSelectInDayView","restrictedDates","restrictedDatesOptions","dateRange","dateRangeType","filter","d","onNavigateDate","animateBackwards","getWeekCornerStyles","calculateRoundedStyles","useImperativeHandle","componentRef","focus","getDayInfosInRangeOfDay","dayToCompare","dateRangeHoverType","getDateRangeTypeToUse","map","date","dayInfosInRange","reduce","accumulatedValue","currentWeek","concat","weekDay","indexOf","getRefsFromDayInfos","dayRefs","dayInfo","key","gridLabel","showWeekNumbers","labelledBy","lightenDaysOutsideNavigatedMonth","animationDirection","classNames","weekCorners","partialWeekProps","arrowNavigationAttributes","axis","table","className","aria-multiselectable","aria-label","aria-labelledby","aria-activedescendant","role","tbody","week","weekIndex","rowClassName","firstTransitionWeek","aria-role","ariaHidden","slice","length","weekRow","lastTransitionWeek","displayName","WorkWeek","sortedWWDays","sort","isContiguous","i","Week"],"mappings":"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"}

package/lib-commonjs/components/CalendarMonth/CalendarMonth.js

@@ -24,7 +24,9 @@ function useAnimateBackwards({ navigatedDate }) {
     _react.useEffect(()=>{
         previousYearRef.current = currentYear;
     });
+    // eslint-disable-next-line react-hooks/refs
     const previousYear = previousYearRef.current;
+    // eslint-disable-next-line react-hooks/refs
     if (previousYear === undefined || previousYear === currentYear) {
         return undefined;
     } else {

package/lib-commonjs/components/CalendarMonth/CalendarMonth.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CalendarMonth/CalendarMonth.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Enter } from '@fluentui/keyboard-keys';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { mergeClasses } from '@griffel/react';\nimport {\n  addYears,\n  compareDatePart,\n  getMonthEnd,\n  getMonthStart,\n  getYearEnd,\n  getYearStart,\n  setMonth,\n  DEFAULT_DATE_FORMATTING,\n} from '../../utils';\nimport { CalendarYear } from '../CalendarYear/CalendarYear';\nimport { useCalendarMonthStyles_unstable } from './useCalendarMonthStyles.styles';\nimport type { CalendarMonthProps } from './CalendarMonth.types';\nimport type { CalendarYearRange, ICalendarYear } from '../CalendarYear/CalendarYear.types';\n\nconst MONTHS_PER_ROW = 4;\n\nfunction useAnimateBackwards({ navigatedDate }: { navigatedDate: CalendarMonthProps['navigatedDate'] }) {\n  const currentYear = navigatedDate.getFullYear();\n\n  const previousYearRef = React.useRef<number | undefined>(undefined);\n  React.useEffect(() => {\n    previousYearRef.current = currentYear;\n  });\n  const previousYear = previousYearRef.current;\n\n  if (previousYear === undefined || previousYear === currentYear) {\n    return undefined;\n  } else {\n    return previousYear > currentYear;\n  }\n}\n\nfunction useFocusLogic({ componentRef }: { componentRef: CalendarMonthProps['componentRef'] }) {\n  const navigatedMonthRef = React.useRef<HTMLButtonElement>(null);\n  const calendarYearRef = React.useRef<ICalendarYear>(null);\n  const focusOnUpdate = React.useRef(false);\n\n  const focus = React.useCallback(() => {\n    if (calendarYearRef.current) {\n      calendarYearRef.current.focus();\n    } else if (navigatedMonthRef.current) {\n      navigatedMonthRef.current.focus();\n    }\n  }, []);\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 [navigatedMonthRef, calendarYearRef, focusOnNextUpdate] as const;\n}\n\n/**\n * @internal\n */\nexport const CalendarMonth: React.FunctionComponent<CalendarMonthProps> = props => {\n  const {\n    allFocusable,\n    animationDirection,\n    className,\n    componentRef,\n    dateTimeFormatter = DEFAULT_DATE_FORMATTING,\n    highlightCurrentMonth,\n    highlightSelectedMonth,\n    maxDate,\n    minDate,\n    navigatedDate,\n    navigationIcons,\n    onHeaderSelect: onUserHeaderSelect,\n    onNavigateDate,\n    selectedDate,\n    strings,\n    today = new Date(),\n    yearPickerHidden = false,\n  } = props;\n\n  const [navigatedMonthRef, calendarYearRef, focusOnNextUpdate] = useFocusLogic({ componentRef });\n  const [isYearPickerVisible, setIsYearPickerVisible] = React.useState(false);\n\n  const animateBackwards = useAnimateBackwards({ navigatedDate });\n\n  const selectMonthCallback = (newMonth: number): (() => void) => {\n    return () => onSelectMonth(newMonth);\n  };\n\n  const onSelectNextYear = (): void => {\n    onNavigateDate(addYears(navigatedDate, 1), false);\n  };\n\n  const onSelectPrevYear = (): void => {\n    onNavigateDate(addYears(navigatedDate, -1), false);\n  };\n\n  const onSelectMonth = (newMonth: number): void => {\n    // If header is clickable the calendars are overlayed, switch back to day picker when month is clicked\n    onUserHeaderSelect?.();\n    onNavigateDate(setMonth(navigatedDate, newMonth), true);\n  };\n\n  const onHeaderSelect = (): void => {\n    if (!yearPickerHidden) {\n      focusOnNextUpdate();\n      setIsYearPickerVisible(true);\n    } else {\n      onUserHeaderSelect?.();\n    }\n  };\n\n  const onSelectYear = (selectedYear: number) => {\n    focusOnNextUpdate();\n    const navYear = navigatedDate.getFullYear();\n    if (navYear !== selectedYear) {\n      let newNavigationDate = new Date(navigatedDate.getTime());\n      newNavigationDate.setFullYear(selectedYear);\n      // for min and max dates, adjust the new navigation date - perhaps this should be\n      // checked on the master navigation date handler (i.e. in Calendar)\n      if (maxDate && newNavigationDate > maxDate) {\n        newNavigationDate = setMonth(newNavigationDate, maxDate.getMonth());\n      } else if (minDate && newNavigationDate < minDate) {\n        newNavigationDate = setMonth(newNavigationDate, minDate.getMonth());\n      }\n      onNavigateDate(newNavigationDate, true);\n    }\n    setIsYearPickerVisible(false);\n  };\n\n  const onYearPickerHeaderSelect = (focus: boolean): void => {\n    focusOnNextUpdate();\n    setIsYearPickerVisible(false);\n  };\n\n  const dateFormatter = dateTimeFormatter!;\n\n  // determine if previous/next years are in bounds\n  const isPrevYearInBounds = minDate ? compareDatePart(minDate, getYearStart(navigatedDate)) < 0 : true;\n  const isNextYearInBounds = maxDate ? compareDatePart(getYearEnd(navigatedDate), maxDate) < 0 : true;\n\n  const classNames = useCalendarMonthStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!onUserHeaderSelect || !yearPickerHidden,\n    highlightCurrent: highlightCurrentMonth,\n    highlightSelected: highlightSelectedMonth,\n    animateBackwards,\n    animationDirection,\n  });\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid' });\n\n  if (isYearPickerVisible) {\n    const [onRenderYear, yearStrings] = getYearStrings({ dateTimeFormatter, navigatedDate, strings });\n    // use navigated date for the year picker\n    return (\n      <CalendarYear\n        key={'calendarYear'}\n        minYear={minDate ? minDate.getFullYear() : undefined}\n        maxYear={maxDate ? maxDate.getFullYear() : undefined}\n        // eslint-disable-next-line react/jsx-no-bind\n        onSelectYear={onSelectYear}\n        // eslint-disable-next-line react/jsx-no-bind\n        onHeaderSelect={onYearPickerHeaderSelect}\n        selectedYear={\n          selectedDate ? selectedDate.getFullYear() : navigatedDate ? navigatedDate.getFullYear() : undefined\n        }\n        navigatedYear={navigatedDate.getFullYear()}\n        navigationIcons={navigationIcons}\n        onRenderYear={onRenderYear}\n        strings={yearStrings}\n        componentRef={calendarYearRef}\n        highlightCurrentYear={highlightCurrentMonth}\n        highlightSelectedYear={highlightSelectedMonth}\n        animationDirection={animationDirection}\n      />\n    );\n  }\n\n  const rowIndexes = [];\n  for (let i = 0; i < strings.shortMonths.length / MONTHS_PER_ROW; i++) {\n    rowIndexes.push(i);\n  }\n\n  const yearString = dateFormatter.formatYear(navigatedDate);\n  const headerAriaLabel = strings.monthPickerHeaderAriaLabel\n    ? strings.monthPickerHeaderAriaLabel.replace('{0}', yearString)\n    : yearString;\n\n  return (\n    <div className={classNames.root}>\n      <div className={classNames.headerContainer}>\n        <button\n          className={classNames.currentItemButton}\n          onClick={onHeaderSelect}\n          onKeyDown={onButtonKeyDown(onHeaderSelect)}\n          aria-label={headerAriaLabel}\n          tabIndex={!!onUserHeaderSelect || !yearPickerHidden ? 0 : -1}\n          type=\"button\"\n        >\n          <span aria-live=\"polite\" aria-atomic=\"true\">\n            {yearString}\n          </span>\n        </button>\n        <div className={classNames.navigationButtonsContainer}>\n          <button\n            className={mergeClasses(classNames.navigationButton, !isPrevYearInBounds && classNames.disabled)}\n            aria-disabled={!isPrevYearInBounds}\n            tabIndex={isPrevYearInBounds ? undefined : allFocusable ? 0 : -1}\n            onClick={isPrevYearInBounds ? onSelectPrevYear : undefined}\n            onKeyDown={isPrevYearInBounds ? onButtonKeyDown(onSelectPrevYear) : undefined}\n            title={\n              strings.prevYearAriaLabel\n                ? strings.prevYearAriaLabel + ' ' + dateFormatter.formatYear(addYears(navigatedDate, -1))\n                : undefined\n            }\n            type=\"button\"\n          >\n            {navigationIcons.upNavigation}\n          </button>\n          <button\n            className={mergeClasses(classNames.navigationButton, !isNextYearInBounds && classNames.disabled)}\n            aria-disabled={!isNextYearInBounds}\n            tabIndex={isNextYearInBounds ? undefined : allFocusable ? 0 : -1}\n            onClick={isNextYearInBounds ? onSelectNextYear : undefined}\n            onKeyDown={isNextYearInBounds ? onButtonKeyDown(onSelectNextYear) : undefined}\n            title={\n              strings.nextYearAriaLabel\n                ? strings.nextYearAriaLabel + ' ' + dateFormatter.formatYear(addYears(navigatedDate, 1))\n                : undefined\n            }\n            type=\"button\"\n          >\n            {navigationIcons.downNavigation}\n          </button>\n        </div>\n      </div>\n      <div {...arrowNavigationAttributes} className={classNames.gridContainer} role=\"grid\" aria-label={yearString}>\n        {rowIndexes.map((rowNum: number) => {\n          const monthsForRow = strings!.shortMonths.slice(rowNum * MONTHS_PER_ROW, (rowNum + 1) * MONTHS_PER_ROW);\n          return (\n            <div key={'monthRow_' + rowNum + navigatedDate.getFullYear()} role=\"row\" className={classNames.buttonRow}>\n              {monthsForRow.map((month: string, index: number) => {\n                const monthIndex = rowNum * MONTHS_PER_ROW + index;\n                const indexedMonth = setMonth(navigatedDate, monthIndex);\n                const isNavigatedMonth = navigatedDate.getMonth() === monthIndex;\n                const isSelectedMonth = selectedDate.getMonth() === monthIndex;\n                const isSelectedYear = selectedDate.getFullYear() === navigatedDate.getFullYear();\n                const isInBounds =\n                  (minDate ? compareDatePart(minDate, getMonthEnd(indexedMonth)) < 1 : true) &&\n                  (maxDate ? compareDatePart(getMonthStart(indexedMonth), maxDate) < 1 : true);\n\n                return (\n                  <button\n                    ref={isNavigatedMonth ? navigatedMonthRef : undefined}\n                    role={'gridcell'}\n                    className={mergeClasses(\n                      classNames.itemButton,\n                      highlightCurrentMonth &&\n                        isCurrentMonth(monthIndex, navigatedDate.getFullYear(), today) &&\n                        classNames.current,\n                      highlightSelectedMonth && isSelectedMonth && isSelectedYear && classNames.selected,\n                      !isInBounds && classNames.disabled,\n                    )}\n                    disabled={!allFocusable && !isInBounds}\n                    key={monthIndex}\n                    onClick={isInBounds ? selectMonthCallback(monthIndex) : undefined}\n                    onKeyDown={isInBounds ? onButtonKeyDown(selectMonthCallback(monthIndex)) : undefined}\n                    aria-label={dateFormatter.formatMonth(indexedMonth, strings!)}\n                    aria-selected={isNavigatedMonth}\n                    tabIndex={isInBounds ? 0 : -1}\n                    type=\"button\"\n                  >\n                    {month}\n                  </button>\n                );\n              })}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n};\nCalendarMonth.displayName = 'CalendarMonth';\n\nfunction getYearStrings({\n  dateTimeFormatter,\n  navigatedDate,\n  strings,\n}: Pick<CalendarMonthProps, 'dateTimeFormatter' | 'navigatedDate' | 'strings'>) {\n  const yearToString = (year: number) => {\n    if (dateTimeFormatter) {\n      // create a date based on the current nav date\n      const yearFormattingDate = new Date(navigatedDate.getTime());\n      yearFormattingDate.setFullYear(year);\n      return dateTimeFormatter.formatYear(yearFormattingDate);\n    }\n    return String(year);\n  };\n\n  const yearRangeToString = (yearRange: CalendarYearRange) => {\n    return `${yearToString(yearRange.fromYear)} - ${yearToString(yearRange.toYear)}`;\n  };\n\n  const yearRangeToNextDecadeLabel = (yearRange: CalendarYearRange) => {\n    return strings.nextYearRangeAriaLabel ? `${strings.nextYearRangeAriaLabel} ${yearRangeToString(yearRange)}` : '';\n  };\n\n  const yearRangeToPrevDecadeLabel = (yearRange: CalendarYearRange) => {\n    return strings.prevYearRangeAriaLabel ? `${strings.prevYearRangeAriaLabel} ${yearRangeToString(yearRange)}` : '';\n  };\n\n  return [\n    yearToString,\n    {\n      rangeAriaLabel: yearRangeToString,\n      prevRangeAriaLabel: yearRangeToPrevDecadeLabel,\n      nextRangeAriaLabel: yearRangeToNextDecadeLabel,\n      headerAriaLabelFormatString: strings.monthPickerHeaderAriaLabel,\n    } as const,\n  ] as const;\n}\n\nfunction isCurrentMonth(month: number, year: number, today: Date): boolean {\n  return today.getFullYear() === year && today.getMonth() === month;\n}\n\nfunction onButtonKeyDown(callback: () => void): (ev: React.KeyboardEvent<HTMLButtonElement>) => void {\n  return (ev: React.KeyboardEvent<HTMLButtonElement>) => {\n    switch (ev.key) {\n      case Enter:\n        callback();\n        break;\n    }\n  };\n}\n"],"names":["React","Enter","useArrowNavigationGroup","mergeClasses","addYears","compareDatePart","getMonthEnd","getMonthStart","getYearEnd","getYearStart","setMonth","DEFAULT_DATE_FORMATTING","CalendarYear","useCalendarMonthStyles_unstable","MONTHS_PER_ROW","useAnimateBackwards","navigatedDate","currentYear","getFullYear","previousYearRef","useRef","undefined","useEffect","current","previousYear","useFocusLogic","componentRef","navigatedMonthRef","calendarYearRef","focusOnUpdate","focus","useCallback","useImperativeHandle","focusOnNextUpdate","CalendarMonth","props","allFocusable","animationDirection","className","dateTimeFormatter","highlightCurrentMonth","highlightSelectedMonth","maxDate","minDate","navigationIcons","onHeaderSelect","onUserHeaderSelect","onNavigateDate","selectedDate","strings","today","Date","yearPickerHidden","isYearPickerVisible","setIsYearPickerVisible","useState","animateBackwards","selectMonthCallback","newMonth","onSelectMonth","onSelectNextYear","onSelectPrevYear","onSelectYear","selectedYear","navYear","newNavigationDate","getTime","setFullYear","getMonth","onYearPickerHeaderSelect","dateFormatter","isPrevYearInBounds","isNextYearInBounds","classNames","hasHeaderClickCallback","highlightCurrent","highlightSelected","arrowNavigationAttributes","axis","onRenderYear","yearStrings","getYearStrings","key","minYear","maxYear","navigatedYear","highlightCurrentYear","highlightSelectedYear","rowIndexes","i","shortMonths","length","push","yearString","formatYear","headerAriaLabel","monthPickerHeaderAriaLabel","replace","div","root","headerContainer","button","currentItemButton","onClick","onKeyDown","onButtonKeyDown","aria-label","tabIndex","type","span","aria-live","aria-atomic","navigationButtonsContainer","navigationButton","disabled","aria-disabled","title","prevYearAriaLabel","upNavigation","nextYearAriaLabel","downNavigation","gridContainer","role","map","rowNum","monthsForRow","slice","buttonRow","month","index","monthIndex","indexedMonth","isNavigatedMonth","isSelectedMonth","isSelectedYear","isInBounds","ref","itemButton","isCurrentMonth","selected","formatMonth","aria-selected","displayName","yearToString","year","yearFormattingDate","String","yearRangeToString","yearRange","fromYear","toYear","yearRangeToNextDecadeLabel","nextYearRangeAriaLabel","yearRangeToPrevDecadeLabel","prevYearRangeAriaLabel","rangeAriaLabel","prevRangeAriaLabel","nextRangeAriaLabel","headerAriaLabelFormatString","callback","ev"],"mappings":"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"}
+{"version":3,"sources":["../src/components/CalendarMonth/CalendarMonth.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Enter } from '@fluentui/keyboard-keys';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { mergeClasses } from '@griffel/react';\nimport {\n  addYears,\n  compareDatePart,\n  getMonthEnd,\n  getMonthStart,\n  getYearEnd,\n  getYearStart,\n  setMonth,\n  DEFAULT_DATE_FORMATTING,\n} from '../../utils';\nimport { CalendarYear } from '../CalendarYear/CalendarYear';\nimport { useCalendarMonthStyles_unstable } from './useCalendarMonthStyles.styles';\nimport type { CalendarMonthProps } from './CalendarMonth.types';\nimport type { CalendarYearRange, ICalendarYear } from '../CalendarYear/CalendarYear.types';\n\nconst MONTHS_PER_ROW = 4;\n\nfunction useAnimateBackwards({ navigatedDate }: { navigatedDate: CalendarMonthProps['navigatedDate'] }) {\n  const currentYear = navigatedDate.getFullYear();\n\n  const previousYearRef = React.useRef<number | undefined>(undefined);\n  React.useEffect(() => {\n    previousYearRef.current = currentYear;\n  });\n  // eslint-disable-next-line react-hooks/refs\n  const previousYear = previousYearRef.current;\n\n  // eslint-disable-next-line react-hooks/refs\n  if (previousYear === undefined || previousYear === currentYear) {\n    return undefined;\n  } else {\n    return previousYear > currentYear;\n  }\n}\n\nfunction useFocusLogic({ componentRef }: { componentRef: CalendarMonthProps['componentRef'] }) {\n  const navigatedMonthRef = React.useRef<HTMLButtonElement>(null);\n  const calendarYearRef = React.useRef<ICalendarYear>(null);\n  const focusOnUpdate = React.useRef(false);\n\n  const focus = React.useCallback(() => {\n    if (calendarYearRef.current) {\n      calendarYearRef.current.focus();\n    } else if (navigatedMonthRef.current) {\n      navigatedMonthRef.current.focus();\n    }\n  }, []);\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 [navigatedMonthRef, calendarYearRef, focusOnNextUpdate] as const;\n}\n\n/**\n * @internal\n */\nexport const CalendarMonth: React.FunctionComponent<CalendarMonthProps> = props => {\n  const {\n    allFocusable,\n    animationDirection,\n    className,\n    componentRef,\n    dateTimeFormatter = DEFAULT_DATE_FORMATTING,\n    highlightCurrentMonth,\n    highlightSelectedMonth,\n    maxDate,\n    minDate,\n    navigatedDate,\n    navigationIcons,\n    onHeaderSelect: onUserHeaderSelect,\n    onNavigateDate,\n    selectedDate,\n    strings,\n    today = new Date(),\n    yearPickerHidden = false,\n  } = props;\n\n  const [navigatedMonthRef, calendarYearRef, focusOnNextUpdate] = useFocusLogic({ componentRef });\n  const [isYearPickerVisible, setIsYearPickerVisible] = React.useState(false);\n\n  const animateBackwards = useAnimateBackwards({ navigatedDate });\n\n  const selectMonthCallback = (newMonth: number): (() => void) => {\n    return () => onSelectMonth(newMonth);\n  };\n\n  const onSelectNextYear = (): void => {\n    onNavigateDate(addYears(navigatedDate, 1), false);\n  };\n\n  const onSelectPrevYear = (): void => {\n    onNavigateDate(addYears(navigatedDate, -1), false);\n  };\n\n  const onSelectMonth = (newMonth: number): void => {\n    // If header is clickable the calendars are overlayed, switch back to day picker when month is clicked\n    onUserHeaderSelect?.();\n    onNavigateDate(setMonth(navigatedDate, newMonth), true);\n  };\n\n  const onHeaderSelect = (): void => {\n    if (!yearPickerHidden) {\n      focusOnNextUpdate();\n      setIsYearPickerVisible(true);\n    } else {\n      onUserHeaderSelect?.();\n    }\n  };\n\n  const onSelectYear = (selectedYear: number) => {\n    focusOnNextUpdate();\n    const navYear = navigatedDate.getFullYear();\n    if (navYear !== selectedYear) {\n      let newNavigationDate = new Date(navigatedDate.getTime());\n      newNavigationDate.setFullYear(selectedYear);\n      // for min and max dates, adjust the new navigation date - perhaps this should be\n      // checked on the master navigation date handler (i.e. in Calendar)\n      if (maxDate && newNavigationDate > maxDate) {\n        newNavigationDate = setMonth(newNavigationDate, maxDate.getMonth());\n      } else if (minDate && newNavigationDate < minDate) {\n        newNavigationDate = setMonth(newNavigationDate, minDate.getMonth());\n      }\n      onNavigateDate(newNavigationDate, true);\n    }\n    setIsYearPickerVisible(false);\n  };\n\n  const onYearPickerHeaderSelect = (focus: boolean): void => {\n    focusOnNextUpdate();\n    setIsYearPickerVisible(false);\n  };\n\n  const dateFormatter = dateTimeFormatter!;\n\n  // determine if previous/next years are in bounds\n  const isPrevYearInBounds = minDate ? compareDatePart(minDate, getYearStart(navigatedDate)) < 0 : true;\n  const isNextYearInBounds = maxDate ? compareDatePart(getYearEnd(navigatedDate), maxDate) < 0 : true;\n\n  const classNames = useCalendarMonthStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!onUserHeaderSelect || !yearPickerHidden,\n    highlightCurrent: highlightCurrentMonth,\n    highlightSelected: highlightSelectedMonth,\n    animateBackwards,\n    animationDirection,\n  });\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid' });\n\n  if (isYearPickerVisible) {\n    const [onRenderYear, yearStrings] = getYearStrings({ dateTimeFormatter, navigatedDate, strings });\n    // use navigated date for the year picker\n    return (\n      <CalendarYear\n        key={'calendarYear'}\n        minYear={minDate ? minDate.getFullYear() : undefined}\n        maxYear={maxDate ? maxDate.getFullYear() : undefined}\n        // eslint-disable-next-line react/jsx-no-bind\n        onSelectYear={onSelectYear}\n        // eslint-disable-next-line react/jsx-no-bind\n        onHeaderSelect={onYearPickerHeaderSelect}\n        selectedYear={\n          selectedDate ? selectedDate.getFullYear() : navigatedDate ? navigatedDate.getFullYear() : undefined\n        }\n        navigatedYear={navigatedDate.getFullYear()}\n        navigationIcons={navigationIcons}\n        onRenderYear={onRenderYear}\n        strings={yearStrings}\n        componentRef={calendarYearRef}\n        highlightCurrentYear={highlightCurrentMonth}\n        highlightSelectedYear={highlightSelectedMonth}\n        animationDirection={animationDirection}\n      />\n    );\n  }\n\n  const rowIndexes = [];\n  for (let i = 0; i < strings.shortMonths.length / MONTHS_PER_ROW; i++) {\n    rowIndexes.push(i);\n  }\n\n  const yearString = dateFormatter.formatYear(navigatedDate);\n  const headerAriaLabel = strings.monthPickerHeaderAriaLabel\n    ? strings.monthPickerHeaderAriaLabel.replace('{0}', yearString)\n    : yearString;\n\n  return (\n    <div className={classNames.root}>\n      <div className={classNames.headerContainer}>\n        <button\n          className={classNames.currentItemButton}\n          onClick={onHeaderSelect}\n          onKeyDown={onButtonKeyDown(onHeaderSelect)}\n          aria-label={headerAriaLabel}\n          tabIndex={!!onUserHeaderSelect || !yearPickerHidden ? 0 : -1}\n          type=\"button\"\n        >\n          <span aria-live=\"polite\" aria-atomic=\"true\">\n            {yearString}\n          </span>\n        </button>\n        <div className={classNames.navigationButtonsContainer}>\n          <button\n            className={mergeClasses(classNames.navigationButton, !isPrevYearInBounds && classNames.disabled)}\n            aria-disabled={!isPrevYearInBounds}\n            tabIndex={isPrevYearInBounds ? undefined : allFocusable ? 0 : -1}\n            onClick={isPrevYearInBounds ? onSelectPrevYear : undefined}\n            onKeyDown={isPrevYearInBounds ? onButtonKeyDown(onSelectPrevYear) : undefined}\n            title={\n              strings.prevYearAriaLabel\n                ? strings.prevYearAriaLabel + ' ' + dateFormatter.formatYear(addYears(navigatedDate, -1))\n                : undefined\n            }\n            type=\"button\"\n          >\n            {navigationIcons.upNavigation}\n          </button>\n          <button\n            className={mergeClasses(classNames.navigationButton, !isNextYearInBounds && classNames.disabled)}\n            aria-disabled={!isNextYearInBounds}\n            tabIndex={isNextYearInBounds ? undefined : allFocusable ? 0 : -1}\n            onClick={isNextYearInBounds ? onSelectNextYear : undefined}\n            onKeyDown={isNextYearInBounds ? onButtonKeyDown(onSelectNextYear) : undefined}\n            title={\n              strings.nextYearAriaLabel\n                ? strings.nextYearAriaLabel + ' ' + dateFormatter.formatYear(addYears(navigatedDate, 1))\n                : undefined\n            }\n            type=\"button\"\n          >\n            {navigationIcons.downNavigation}\n          </button>\n        </div>\n      </div>\n      <div {...arrowNavigationAttributes} className={classNames.gridContainer} role=\"grid\" aria-label={yearString}>\n        {rowIndexes.map((rowNum: number) => {\n          const monthsForRow = strings!.shortMonths.slice(rowNum * MONTHS_PER_ROW, (rowNum + 1) * MONTHS_PER_ROW);\n          return (\n            <div key={'monthRow_' + rowNum + navigatedDate.getFullYear()} role=\"row\" className={classNames.buttonRow}>\n              {monthsForRow.map((month: string, index: number) => {\n                const monthIndex = rowNum * MONTHS_PER_ROW + index;\n                const indexedMonth = setMonth(navigatedDate, monthIndex);\n                const isNavigatedMonth = navigatedDate.getMonth() === monthIndex;\n                const isSelectedMonth = selectedDate.getMonth() === monthIndex;\n                const isSelectedYear = selectedDate.getFullYear() === navigatedDate.getFullYear();\n                const isInBounds =\n                  (minDate ? compareDatePart(minDate, getMonthEnd(indexedMonth)) < 1 : true) &&\n                  (maxDate ? compareDatePart(getMonthStart(indexedMonth), maxDate) < 1 : true);\n\n                return (\n                  <button\n                    ref={isNavigatedMonth ? navigatedMonthRef : undefined}\n                    role={'gridcell'}\n                    className={mergeClasses(\n                      classNames.itemButton,\n                      highlightCurrentMonth &&\n                        isCurrentMonth(monthIndex, navigatedDate.getFullYear(), today) &&\n                        classNames.current,\n                      highlightSelectedMonth && isSelectedMonth && isSelectedYear && classNames.selected,\n                      !isInBounds && classNames.disabled,\n                    )}\n                    disabled={!allFocusable && !isInBounds}\n                    key={monthIndex}\n                    onClick={isInBounds ? selectMonthCallback(monthIndex) : undefined}\n                    onKeyDown={isInBounds ? onButtonKeyDown(selectMonthCallback(monthIndex)) : undefined}\n                    aria-label={dateFormatter.formatMonth(indexedMonth, strings!)}\n                    aria-selected={isNavigatedMonth}\n                    tabIndex={isInBounds ? 0 : -1}\n                    type=\"button\"\n                  >\n                    {month}\n                  </button>\n                );\n              })}\n            </div>\n          );\n        })}\n      </div>\n    </div>\n  );\n};\nCalendarMonth.displayName = 'CalendarMonth';\n\nfunction getYearStrings({\n  dateTimeFormatter,\n  navigatedDate,\n  strings,\n}: Pick<CalendarMonthProps, 'dateTimeFormatter' | 'navigatedDate' | 'strings'>) {\n  const yearToString = (year: number) => {\n    if (dateTimeFormatter) {\n      // create a date based on the current nav date\n      const yearFormattingDate = new Date(navigatedDate.getTime());\n      yearFormattingDate.setFullYear(year);\n      return dateTimeFormatter.formatYear(yearFormattingDate);\n    }\n    return String(year);\n  };\n\n  const yearRangeToString = (yearRange: CalendarYearRange) => {\n    return `${yearToString(yearRange.fromYear)} - ${yearToString(yearRange.toYear)}`;\n  };\n\n  const yearRangeToNextDecadeLabel = (yearRange: CalendarYearRange) => {\n    return strings.nextYearRangeAriaLabel ? `${strings.nextYearRangeAriaLabel} ${yearRangeToString(yearRange)}` : '';\n  };\n\n  const yearRangeToPrevDecadeLabel = (yearRange: CalendarYearRange) => {\n    return strings.prevYearRangeAriaLabel ? `${strings.prevYearRangeAriaLabel} ${yearRangeToString(yearRange)}` : '';\n  };\n\n  return [\n    yearToString,\n    {\n      rangeAriaLabel: yearRangeToString,\n      prevRangeAriaLabel: yearRangeToPrevDecadeLabel,\n      nextRangeAriaLabel: yearRangeToNextDecadeLabel,\n      headerAriaLabelFormatString: strings.monthPickerHeaderAriaLabel,\n    } as const,\n  ] as const;\n}\n\nfunction isCurrentMonth(month: number, year: number, today: Date): boolean {\n  return today.getFullYear() === year && today.getMonth() === month;\n}\n\nfunction onButtonKeyDown(callback: () => void): (ev: React.KeyboardEvent<HTMLButtonElement>) => void {\n  return (ev: React.KeyboardEvent<HTMLButtonElement>) => {\n    switch (ev.key) {\n      case Enter:\n        callback();\n        break;\n    }\n  };\n}\n"],"names":["React","Enter","useArrowNavigationGroup","mergeClasses","addYears","compareDatePart","getMonthEnd","getMonthStart","getYearEnd","getYearStart","setMonth","DEFAULT_DATE_FORMATTING","CalendarYear","useCalendarMonthStyles_unstable","MONTHS_PER_ROW","useAnimateBackwards","navigatedDate","currentYear","getFullYear","previousYearRef","useRef","undefined","useEffect","current","previousYear","useFocusLogic","componentRef","navigatedMonthRef","calendarYearRef","focusOnUpdate","focus","useCallback","useImperativeHandle","focusOnNextUpdate","CalendarMonth","props","allFocusable","animationDirection","className","dateTimeFormatter","highlightCurrentMonth","highlightSelectedMonth","maxDate","minDate","navigationIcons","onHeaderSelect","onUserHeaderSelect","onNavigateDate","selectedDate","strings","today","Date","yearPickerHidden","isYearPickerVisible","setIsYearPickerVisible","useState","animateBackwards","selectMonthCallback","newMonth","onSelectMonth","onSelectNextYear","onSelectPrevYear","onSelectYear","selectedYear","navYear","newNavigationDate","getTime","setFullYear","getMonth","onYearPickerHeaderSelect","dateFormatter","isPrevYearInBounds","isNextYearInBounds","classNames","hasHeaderClickCallback","highlightCurrent","highlightSelected","arrowNavigationAttributes","axis","onRenderYear","yearStrings","getYearStrings","key","minYear","maxYear","navigatedYear","highlightCurrentYear","highlightSelectedYear","rowIndexes","i","shortMonths","length","push","yearString","formatYear","headerAriaLabel","monthPickerHeaderAriaLabel","replace","div","root","headerContainer","button","currentItemButton","onClick","onKeyDown","onButtonKeyDown","aria-label","tabIndex","type","span","aria-live","aria-atomic","navigationButtonsContainer","navigationButton","disabled","aria-disabled","title","prevYearAriaLabel","upNavigation","nextYearAriaLabel","downNavigation","gridContainer","role","map","rowNum","monthsForRow","slice","buttonRow","month","index","monthIndex","indexedMonth","isNavigatedMonth","isSelectedMonth","isSelectedYear","isInBounds","ref","itemButton","isCurrentMonth","selected","formatMonth","aria-selected","displayName","yearToString","year","yearFormattingDate","String","yearRangeToString","yearRange","fromYear","toYear","yearRangeToNextDecadeLabel","nextYearRangeAriaLabel","yearRangeToPrevDecadeLabel","prevYearRangeAriaLabel","rangeAriaLabel","prevRangeAriaLabel","nextRangeAriaLabel","headerAriaLabelFormatString","callback","ev"],"mappings":"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"}

package/lib-commonjs/components/CalendarYear/CalendarYear.js

@@ -234,7 +234,9 @@ function useAnimateBackwards({ selectedYear, navigatedYear }) {
     _react.useRef(()=>{
         previousFromYearRef.current = fromYear;
     });
+    // eslint-disable-next-line react-hooks/refs
     const previousFromYear = previousFromYearRef.current;
+    // eslint-disable-next-line react-hooks/refs
     if (!previousFromYear || previousFromYear === fromYear) {
         return undefined;
     } else if (previousFromYear > fromYear) {
@@ -262,6 +264,7 @@ function useYearRangeState({ selectedYear, navigatedYear, onNavigateDate }) {
         onNavigateDate === null || onNavigateDate === void 0 ? void 0 : onNavigateDate(newFromYear);
     };
     _react.useEffect(()=>{
+        // eslint-disable-next-line react-hooks/set-state-in-effect
         setFromYear(rangeYear);
     }, [
         rangeYear

package/lib-commonjs/components/CalendarYear/CalendarYear.js.map

@@ -1 +1 @@
-{"version":3,"sources":["../src/components/CalendarYear/CalendarYear.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { mergeClasses } from '@griffel/react';\nimport { useCalendarYearStyles_unstable } from './useCalendarYearStyles.styles';\nimport type {\n  CalendarYearStrings,\n  CalendarYearProps,\n  CalendarYearRange,\n  CalendarYearHeaderProps,\n} from './CalendarYear.types';\n\nconst CELL_COUNT = 12;\nconst CELLS_PER_ROW = 4;\n\nconst DefaultCalendarYearStrings: CalendarYearStrings = {\n  prevRangeAriaLabel: undefined,\n  nextRangeAriaLabel: undefined,\n};\ninterface CalendarYearGrid {\n  focus(): void;\n}\n\ninterface CalendarYearGridCellProps extends CalendarYearProps {\n  year: number;\n  current?: boolean;\n  selected?: boolean;\n  disabled?: boolean;\n  onSelectYear?: (year: number) => void;\n  onRenderYear?: (year: number) => React.ReactNode;\n}\n\ninterface CalendarYearGridProps extends CalendarYearProps, CalendarYearRange {\n  selectedYear?: number;\n  animateBackwards?: boolean;\n  componentRef?: React.RefObject<CalendarYearGridCell | null>;\n}\n\ninterface CalendarYearGridCell {\n  focus(): void;\n}\n\nconst CalendarYearGridCell: React.FunctionComponent<CalendarYearGridCellProps> = props => {\n  const {\n    className,\n    highlightCurrentYear,\n    highlightSelectedYear,\n    year,\n    selected,\n    disabled,\n    componentRef,\n    onSelectYear,\n    onRenderYear,\n  } = props;\n\n  const buttonRef = React.useRef<HTMLButtonElement>(null);\n\n  React.useImperativeHandle(\n    componentRef,\n    () => ({\n      focus() {\n        buttonRef.current?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  const onClick = () => {\n    onSelectYear?.(year);\n  };\n\n  const onKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter) {\n      onSelectYear?.(year);\n    }\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    highlightCurrent: highlightCurrentYear,\n    highlightSelected: highlightSelectedYear,\n  });\n\n  return (\n    <button\n      className={mergeClasses(classNames.itemButton, selected && classNames.selected, disabled && classNames.disabled)}\n      type=\"button\"\n      role=\"gridcell\"\n      onClick={!disabled ? onClick : undefined}\n      onKeyDown={!disabled ? onKeyDown : undefined}\n      disabled={disabled}\n      aria-selected={selected}\n      ref={buttonRef}\n    >\n      {onRenderYear?.(year) ?? year}\n    </button>\n  );\n};\nCalendarYearGridCell.displayName = 'CalendarYearGridCell';\n\nconst CalendarYearGrid: React.FunctionComponent<CalendarYearGridProps> = props => {\n  const {\n    className,\n    fromYear,\n    toYear,\n    animationDirection,\n    animateBackwards,\n    minYear,\n    maxYear,\n    onSelectYear,\n    selectedYear,\n    componentRef,\n  } = props;\n\n  const selectedCellRef = React.useRef<CalendarYearGridCell>(null);\n\n  const currentCellRef = React.useRef<CalendarYearGridCell>(null);\n\n  React.useImperativeHandle(\n    componentRef,\n    () => ({\n      focus() {\n        (selectedCellRef.current || currentCellRef.current)?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  const renderCell = (yearToRender: number): React.ReactNode => {\n    const selected = yearToRender === selectedYear;\n    const disabled =\n      (minYear !== undefined && yearToRender < minYear) || (maxYear !== undefined && yearToRender > maxYear);\n    const current = yearToRender === new Date().getFullYear();\n\n    return (\n      <CalendarYearGridCell\n        {...props}\n        key={yearToRender}\n        year={yearToRender}\n        selected={selected}\n        current={current}\n        disabled={disabled}\n        onSelectYear={onSelectYear}\n        componentRef={selected ? selectedCellRef : current ? currentCellRef : undefined}\n      />\n    );\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    animateBackwards,\n    animationDirection,\n  });\n\n  const onRenderYear = (value: number) => {\n    return props.onRenderYear?.(value) ?? value;\n  };\n\n  const gridAriaLabel = `${onRenderYear(fromYear)} - ${onRenderYear(toYear)}`;\n\n  let year = fromYear;\n  const cells: React.ReactNode[][] = [];\n\n  for (let i = 0; i < (toYear - fromYear + 1) / CELLS_PER_ROW; i++) {\n    cells.push([]);\n    for (let j = 0; j < CELLS_PER_ROW; j++) {\n      cells[i].push(renderCell(year));\n      year++;\n    }\n  }\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid' });\n\n  return (\n    <div {...arrowNavigationAttributes} className={classNames.gridContainer} role=\"grid\" aria-label={gridAriaLabel}>\n      {cells.map((cellRow: React.ReactNode[], index: number) => {\n        return (\n          <div key={'yearPickerRow_' + index + '_' + fromYear} role=\"row\" className={classNames.buttonRow}>\n            {cellRow}\n          </div>\n        );\n      })}\n    </div>\n  );\n};\nCalendarYearGrid.displayName = 'CalendarYearGrid';\n\nconst CalendarYearNavDirection = {\n  Previous: 0 as const,\n  Next: 1 as const,\n};\n\ninterface CalendarYearNavArrowProps extends CalendarYearHeaderProps {\n  direction: (typeof CalendarYearNavDirection)[keyof typeof CalendarYearNavDirection];\n}\n\nconst CalendarYearNavArrow: React.FunctionComponent<CalendarYearNavArrowProps> = props => {\n  const {\n    className,\n    strings = DefaultCalendarYearStrings,\n    direction,\n    onSelectPrev,\n    onSelectNext,\n    fromYear,\n    toYear,\n    maxYear,\n    minYear,\n    navigationIcons,\n  } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  const ariaLabel =\n    direction === CalendarYearNavDirection.Previous ? strings.prevRangeAriaLabel : strings.nextRangeAriaLabel;\n  const newRangeOffset = direction === CalendarYearNavDirection.Previous ? -CELL_COUNT : CELL_COUNT;\n  const newRange = { fromYear: fromYear + newRangeOffset, toYear: toYear + newRangeOffset };\n  const ariaLabelString = ariaLabel ? (typeof ariaLabel === 'string' ? ariaLabel : ariaLabel(newRange)) : undefined;\n  const disabled =\n    direction === CalendarYearNavDirection.Previous\n      ? minYear !== undefined && fromYear < minYear\n      : maxYear !== undefined && props.fromYear + CELL_COUNT > maxYear;\n\n  const onNavigate = () => {\n    direction === CalendarYearNavDirection.Previous ? onSelectPrev?.() : onSelectNext?.();\n  };\n\n  const onKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter) {\n      onNavigate();\n    }\n  };\n\n  return (\n    <button\n      className={mergeClasses(classNames.navigationButton, disabled && classNames.disabled)}\n      onClick={!disabled ? onNavigate : undefined}\n      onKeyDown={!disabled ? onKeyDown : undefined}\n      type=\"button\"\n      title={ariaLabelString}\n      disabled={disabled}\n    >\n      {direction === CalendarYearNavDirection.Previous ? navigationIcons.upNavigation : navigationIcons.downNavigation}\n    </button>\n  );\n};\nCalendarYearNavArrow.displayName = 'CalendarYearNavArrow';\n\nconst CalendarYearNav: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const { className } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  return (\n    <div className={classNames.navigationButtonsContainer}>\n      <CalendarYearNavArrow {...props} direction={CalendarYearNavDirection.Previous} />\n      <CalendarYearNavArrow {...props} direction={CalendarYearNavDirection.Next} />\n    </div>\n  );\n};\nCalendarYearNav.displayName = 'CalendarYearNav';\n\nconst CalendarYearTitle: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const {\n    className,\n    fromYear,\n    toYear,\n    strings = DefaultCalendarYearStrings,\n    animateBackwards,\n    animationDirection,\n  } = props;\n\n  const onHeaderSelect = () => {\n    props.onHeaderSelect?.(true);\n  };\n\n  const onHeaderKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter || ev.key === Space) {\n      onHeaderSelect();\n    }\n  };\n\n  const onRenderYear = (year: number) => {\n    return props.onRenderYear?.(year) ?? year;\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!props.onHeaderSelect,\n    animateBackwards,\n    animationDirection,\n  });\n\n  if (props.onHeaderSelect) {\n    const rangeAriaLabel = strings.rangeAriaLabel;\n    const headerAriaLabelFormatString = strings.headerAriaLabelFormatString;\n    const currentDateRange = rangeAriaLabel\n      ? typeof rangeAriaLabel === 'string'\n        ? rangeAriaLabel\n        : rangeAriaLabel(props)\n      : undefined;\n\n    const ariaLabel = headerAriaLabelFormatString\n      ? headerAriaLabelFormatString.replace('{0}', currentDateRange ?? '')\n      : currentDateRange;\n\n    return (\n      <button\n        className={classNames.currentItemButton}\n        onClick={onHeaderSelect}\n        onKeyDown={onHeaderKeyDown}\n        aria-label={ariaLabel}\n        role=\"button\"\n        type=\"button\"\n      >\n        <span aria-live=\"assertive\" aria-atomic=\"true\">\n          {onRenderYear(fromYear)} - {onRenderYear(toYear)}\n        </span>\n      </button>\n    );\n  }\n\n  return (\n    <div className={classNames.current}>\n      {onRenderYear(fromYear)} - {onRenderYear(toYear)}\n    </div>\n  );\n};\nCalendarYearTitle.displayName = 'CalendarYearTitle';\n\nconst CalendarYearHeader: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const { className, animateBackwards, animationDirection, onRenderTitle } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!props.onHeaderSelect,\n    animateBackwards,\n    animationDirection,\n  });\n\n  return (\n    <div className={classNames.headerContainer}>\n      {onRenderTitle?.(props) ?? <CalendarYearTitle {...props} />}\n      <CalendarYearNav {...props} />\n    </div>\n  );\n};\nCalendarYearHeader.displayName = 'CalendarYearHeader';\n\nfunction useAnimateBackwards({ selectedYear, navigatedYear }: CalendarYearProps) {\n  const rangeYear = selectedYear || navigatedYear || new Date().getFullYear();\n  const fromYear = Math.floor(rangeYear / 10) * 10;\n\n  const previousFromYearRef = React.useRef<number | undefined>(fromYear);\n  React.useRef(() => {\n    previousFromYearRef.current = fromYear;\n  });\n  const previousFromYear = previousFromYearRef.current;\n\n  if (!previousFromYear || previousFromYear === fromYear) {\n    return undefined;\n  } else if (previousFromYear > fromYear) {\n    return true;\n  } else {\n    return false;\n  }\n}\n\nfunction useYearRangeState({ selectedYear, navigatedYear, onNavigateDate }: CalendarYearProps) {\n  const rangeYear = React.useMemo(() => {\n    return selectedYear || navigatedYear || Math.floor(new Date().getFullYear() / 10) * 10;\n  }, [navigatedYear, selectedYear]);\n\n  const [fromYear, setFromYear] = React.useState<number>(rangeYear);\n\n  const onNavNext = () => {\n    const newFromYear = fromYear + CELL_COUNT;\n    setFromYear(newFromYear);\n    onNavigateDate?.(newFromYear);\n  };\n\n  const onNavPrevious = () => {\n    const newFromYear = fromYear - CELL_COUNT;\n    setFromYear(newFromYear);\n    onNavigateDate?.(newFromYear);\n  };\n\n  React.useEffect(() => {\n    setFromYear(rangeYear);\n  }, [rangeYear]);\n\n  const toYear = fromYear + CELL_COUNT - 1;\n\n  return [fromYear, toYear, onNavNext, onNavPrevious] as const;\n}\n\n/**\n * @internal\n */\nexport const CalendarYear: React.FunctionComponent<CalendarYearProps> = props => {\n  const animateBackwards = useAnimateBackwards(props);\n  const [fromYear, toYear, onNavNext, onNavPrevious] = useYearRangeState(props);\n\n  const gridRef = React.useRef<CalendarYearGrid>(null);\n\n  React.useImperativeHandle(props.componentRef, () => ({\n    focus() {\n      gridRef.current?.focus?.();\n    },\n  }));\n\n  const { className } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  return (\n    <div className={classNames.root}>\n      <CalendarYearHeader\n        {...props}\n        fromYear={fromYear}\n        toYear={toYear}\n        onSelectPrev={onNavPrevious}\n        onSelectNext={onNavNext}\n        animateBackwards={animateBackwards}\n      />\n      <CalendarYearGrid\n        {...props}\n        fromYear={fromYear}\n        toYear={toYear}\n        animateBackwards={animateBackwards}\n        componentRef={gridRef}\n      />\n    </div>\n  );\n};\nCalendarYear.displayName = 'CalendarYear';\n"],"names":["React","Enter","Space","useArrowNavigationGroup","mergeClasses","useCalendarYearStyles_unstable","CELL_COUNT","CELLS_PER_ROW","DefaultCalendarYearStrings","prevRangeAriaLabel","undefined","nextRangeAriaLabel","CalendarYearGridCell","props","className","highlightCurrentYear","highlightSelectedYear","year","selected","disabled","componentRef","onSelectYear","onRenderYear","buttonRef","useRef","useImperativeHandle","focus","current","onClick","onKeyDown","ev","key","classNames","highlightCurrent","highlightSelected","button","itemButton","type","role","aria-selected","ref","displayName","CalendarYearGrid","fromYear","toYear","animationDirection","animateBackwards","minYear","maxYear","selectedYear","selectedCellRef","currentCellRef","renderCell","yearToRender","Date","getFullYear","value","gridAriaLabel","cells","i","push","j","arrowNavigationAttributes","axis","div","gridContainer","aria-label","map","cellRow","index","buttonRow","CalendarYearNavDirection","Previous","Next","CalendarYearNavArrow","strings","direction","onSelectPrev","onSelectNext","navigationIcons","ariaLabel","newRangeOffset","newRange","ariaLabelString","onNavigate","navigationButton","title","upNavigation","downNavigation","CalendarYearNav","navigationButtonsContainer","CalendarYearTitle","onHeaderSelect","onHeaderKeyDown","hasHeaderClickCallback","rangeAriaLabel","headerAriaLabelFormatString","currentDateRange","replace","currentItemButton","span","aria-live","aria-atomic","CalendarYearHeader","onRenderTitle","headerContainer","useAnimateBackwards","navigatedYear","rangeYear","Math","floor","previousFromYearRef","previousFromYear","useYearRangeState","onNavigateDate","useMemo","setFromYear","useState","onNavNext","newFromYear","onNavPrevious","useEffect","CalendarYear","gridRef","root"],"mappings":"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"}
+{"version":3,"sources":["../src/components/CalendarYear/CalendarYear.tsx"],"sourcesContent":["'use client';\n\nimport * as React from 'react';\nimport { Enter, Space } from '@fluentui/keyboard-keys';\nimport { useArrowNavigationGroup } from '@fluentui/react-tabster';\nimport { mergeClasses } from '@griffel/react';\nimport { useCalendarYearStyles_unstable } from './useCalendarYearStyles.styles';\nimport type {\n  CalendarYearStrings,\n  CalendarYearProps,\n  CalendarYearRange,\n  CalendarYearHeaderProps,\n} from './CalendarYear.types';\n\nconst CELL_COUNT = 12;\nconst CELLS_PER_ROW = 4;\n\nconst DefaultCalendarYearStrings: CalendarYearStrings = {\n  prevRangeAriaLabel: undefined,\n  nextRangeAriaLabel: undefined,\n};\ninterface CalendarYearGrid {\n  focus(): void;\n}\n\ninterface CalendarYearGridCellProps extends CalendarYearProps {\n  year: number;\n  current?: boolean;\n  selected?: boolean;\n  disabled?: boolean;\n  onSelectYear?: (year: number) => void;\n  onRenderYear?: (year: number) => React.ReactNode;\n}\n\ninterface CalendarYearGridProps extends CalendarYearProps, CalendarYearRange {\n  selectedYear?: number;\n  animateBackwards?: boolean;\n  componentRef?: React.RefObject<CalendarYearGridCell | null>;\n}\n\ninterface CalendarYearGridCell {\n  focus(): void;\n}\n\nconst CalendarYearGridCell: React.FunctionComponent<CalendarYearGridCellProps> = props => {\n  const {\n    className,\n    highlightCurrentYear,\n    highlightSelectedYear,\n    year,\n    selected,\n    disabled,\n    componentRef,\n    onSelectYear,\n    onRenderYear,\n  } = props;\n\n  const buttonRef = React.useRef<HTMLButtonElement>(null);\n\n  React.useImperativeHandle(\n    componentRef,\n    () => ({\n      focus() {\n        buttonRef.current?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  const onClick = () => {\n    onSelectYear?.(year);\n  };\n\n  const onKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter) {\n      onSelectYear?.(year);\n    }\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    highlightCurrent: highlightCurrentYear,\n    highlightSelected: highlightSelectedYear,\n  });\n\n  return (\n    <button\n      className={mergeClasses(classNames.itemButton, selected && classNames.selected, disabled && classNames.disabled)}\n      type=\"button\"\n      role=\"gridcell\"\n      onClick={!disabled ? onClick : undefined}\n      onKeyDown={!disabled ? onKeyDown : undefined}\n      disabled={disabled}\n      aria-selected={selected}\n      ref={buttonRef}\n    >\n      {onRenderYear?.(year) ?? year}\n    </button>\n  );\n};\nCalendarYearGridCell.displayName = 'CalendarYearGridCell';\n\nconst CalendarYearGrid: React.FunctionComponent<CalendarYearGridProps> = props => {\n  const {\n    className,\n    fromYear,\n    toYear,\n    animationDirection,\n    animateBackwards,\n    minYear,\n    maxYear,\n    onSelectYear,\n    selectedYear,\n    componentRef,\n  } = props;\n\n  const selectedCellRef = React.useRef<CalendarYearGridCell>(null);\n\n  const currentCellRef = React.useRef<CalendarYearGridCell>(null);\n\n  React.useImperativeHandle(\n    componentRef,\n    () => ({\n      focus() {\n        (selectedCellRef.current || currentCellRef.current)?.focus?.();\n      },\n    }),\n    [],\n  );\n\n  const renderCell = (yearToRender: number): React.ReactNode => {\n    const selected = yearToRender === selectedYear;\n    const disabled =\n      (minYear !== undefined && yearToRender < minYear) || (maxYear !== undefined && yearToRender > maxYear);\n    const current = yearToRender === new Date().getFullYear();\n\n    return (\n      <CalendarYearGridCell\n        {...props}\n        key={yearToRender}\n        year={yearToRender}\n        selected={selected}\n        current={current}\n        disabled={disabled}\n        onSelectYear={onSelectYear}\n        componentRef={selected ? selectedCellRef : current ? currentCellRef : undefined}\n      />\n    );\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    animateBackwards,\n    animationDirection,\n  });\n\n  const onRenderYear = (value: number) => {\n    return props.onRenderYear?.(value) ?? value;\n  };\n\n  const gridAriaLabel = `${onRenderYear(fromYear)} - ${onRenderYear(toYear)}`;\n\n  let year = fromYear;\n  const cells: React.ReactNode[][] = [];\n\n  for (let i = 0; i < (toYear - fromYear + 1) / CELLS_PER_ROW; i++) {\n    cells.push([]);\n    for (let j = 0; j < CELLS_PER_ROW; j++) {\n      cells[i].push(renderCell(year));\n      year++;\n    }\n  }\n\n  const arrowNavigationAttributes = useArrowNavigationGroup({ axis: 'grid' });\n\n  return (\n    <div {...arrowNavigationAttributes} className={classNames.gridContainer} role=\"grid\" aria-label={gridAriaLabel}>\n      {cells.map((cellRow: React.ReactNode[], index: number) => {\n        return (\n          <div key={'yearPickerRow_' + index + '_' + fromYear} role=\"row\" className={classNames.buttonRow}>\n            {cellRow}\n          </div>\n        );\n      })}\n    </div>\n  );\n};\nCalendarYearGrid.displayName = 'CalendarYearGrid';\n\nconst CalendarYearNavDirection = {\n  Previous: 0 as const,\n  Next: 1 as const,\n};\n\ninterface CalendarYearNavArrowProps extends CalendarYearHeaderProps {\n  direction: (typeof CalendarYearNavDirection)[keyof typeof CalendarYearNavDirection];\n}\n\nconst CalendarYearNavArrow: React.FunctionComponent<CalendarYearNavArrowProps> = props => {\n  const {\n    className,\n    strings = DefaultCalendarYearStrings,\n    direction,\n    onSelectPrev,\n    onSelectNext,\n    fromYear,\n    toYear,\n    maxYear,\n    minYear,\n    navigationIcons,\n  } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  const ariaLabel =\n    direction === CalendarYearNavDirection.Previous ? strings.prevRangeAriaLabel : strings.nextRangeAriaLabel;\n  const newRangeOffset = direction === CalendarYearNavDirection.Previous ? -CELL_COUNT : CELL_COUNT;\n  const newRange = { fromYear: fromYear + newRangeOffset, toYear: toYear + newRangeOffset };\n  const ariaLabelString = ariaLabel ? (typeof ariaLabel === 'string' ? ariaLabel : ariaLabel(newRange)) : undefined;\n  const disabled =\n    direction === CalendarYearNavDirection.Previous\n      ? minYear !== undefined && fromYear < minYear\n      : maxYear !== undefined && props.fromYear + CELL_COUNT > maxYear;\n\n  const onNavigate = () => {\n    direction === CalendarYearNavDirection.Previous ? onSelectPrev?.() : onSelectNext?.();\n  };\n\n  const onKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter) {\n      onNavigate();\n    }\n  };\n\n  return (\n    <button\n      className={mergeClasses(classNames.navigationButton, disabled && classNames.disabled)}\n      onClick={!disabled ? onNavigate : undefined}\n      onKeyDown={!disabled ? onKeyDown : undefined}\n      type=\"button\"\n      title={ariaLabelString}\n      disabled={disabled}\n    >\n      {direction === CalendarYearNavDirection.Previous ? navigationIcons.upNavigation : navigationIcons.downNavigation}\n    </button>\n  );\n};\nCalendarYearNavArrow.displayName = 'CalendarYearNavArrow';\n\nconst CalendarYearNav: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const { className } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  return (\n    <div className={classNames.navigationButtonsContainer}>\n      <CalendarYearNavArrow {...props} direction={CalendarYearNavDirection.Previous} />\n      <CalendarYearNavArrow {...props} direction={CalendarYearNavDirection.Next} />\n    </div>\n  );\n};\nCalendarYearNav.displayName = 'CalendarYearNav';\n\nconst CalendarYearTitle: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const {\n    className,\n    fromYear,\n    toYear,\n    strings = DefaultCalendarYearStrings,\n    animateBackwards,\n    animationDirection,\n  } = props;\n\n  const onHeaderSelect = () => {\n    props.onHeaderSelect?.(true);\n  };\n\n  const onHeaderKeyDown = (ev: React.KeyboardEvent<HTMLElement>) => {\n    if (ev.key === Enter || ev.key === Space) {\n      onHeaderSelect();\n    }\n  };\n\n  const onRenderYear = (year: number) => {\n    return props.onRenderYear?.(year) ?? year;\n  };\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!props.onHeaderSelect,\n    animateBackwards,\n    animationDirection,\n  });\n\n  if (props.onHeaderSelect) {\n    const rangeAriaLabel = strings.rangeAriaLabel;\n    const headerAriaLabelFormatString = strings.headerAriaLabelFormatString;\n    const currentDateRange = rangeAriaLabel\n      ? typeof rangeAriaLabel === 'string'\n        ? rangeAriaLabel\n        : rangeAriaLabel(props)\n      : undefined;\n\n    const ariaLabel = headerAriaLabelFormatString\n      ? headerAriaLabelFormatString.replace('{0}', currentDateRange ?? '')\n      : currentDateRange;\n\n    return (\n      <button\n        className={classNames.currentItemButton}\n        onClick={onHeaderSelect}\n        onKeyDown={onHeaderKeyDown}\n        aria-label={ariaLabel}\n        role=\"button\"\n        type=\"button\"\n      >\n        <span aria-live=\"assertive\" aria-atomic=\"true\">\n          {onRenderYear(fromYear)} - {onRenderYear(toYear)}\n        </span>\n      </button>\n    );\n  }\n\n  return (\n    <div className={classNames.current}>\n      {onRenderYear(fromYear)} - {onRenderYear(toYear)}\n    </div>\n  );\n};\nCalendarYearTitle.displayName = 'CalendarYearTitle';\n\nconst CalendarYearHeader: React.FunctionComponent<CalendarYearHeaderProps> = props => {\n  const { className, animateBackwards, animationDirection, onRenderTitle } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n    hasHeaderClickCallback: !!props.onHeaderSelect,\n    animateBackwards,\n    animationDirection,\n  });\n\n  return (\n    <div className={classNames.headerContainer}>\n      {onRenderTitle?.(props) ?? <CalendarYearTitle {...props} />}\n      <CalendarYearNav {...props} />\n    </div>\n  );\n};\nCalendarYearHeader.displayName = 'CalendarYearHeader';\n\nfunction useAnimateBackwards({ selectedYear, navigatedYear }: CalendarYearProps) {\n  const rangeYear = selectedYear || navigatedYear || new Date().getFullYear();\n  const fromYear = Math.floor(rangeYear / 10) * 10;\n\n  const previousFromYearRef = React.useRef<number | undefined>(fromYear);\n  React.useRef(() => {\n    previousFromYearRef.current = fromYear;\n  });\n  // eslint-disable-next-line react-hooks/refs\n  const previousFromYear = previousFromYearRef.current;\n\n  // eslint-disable-next-line react-hooks/refs\n  if (!previousFromYear || previousFromYear === fromYear) {\n    return undefined;\n  } else if (previousFromYear > fromYear) {\n    return true;\n  } else {\n    return false;\n  }\n}\n\nfunction useYearRangeState({ selectedYear, navigatedYear, onNavigateDate }: CalendarYearProps) {\n  const rangeYear = React.useMemo(() => {\n    return selectedYear || navigatedYear || Math.floor(new Date().getFullYear() / 10) * 10;\n  }, [navigatedYear, selectedYear]);\n\n  const [fromYear, setFromYear] = React.useState<number>(rangeYear);\n\n  const onNavNext = () => {\n    const newFromYear = fromYear + CELL_COUNT;\n    setFromYear(newFromYear);\n    onNavigateDate?.(newFromYear);\n  };\n\n  const onNavPrevious = () => {\n    const newFromYear = fromYear - CELL_COUNT;\n    setFromYear(newFromYear);\n    onNavigateDate?.(newFromYear);\n  };\n\n  React.useEffect(() => {\n    // eslint-disable-next-line react-hooks/set-state-in-effect\n    setFromYear(rangeYear);\n  }, [rangeYear]);\n\n  const toYear = fromYear + CELL_COUNT - 1;\n\n  return [fromYear, toYear, onNavNext, onNavPrevious] as const;\n}\n\n/**\n * @internal\n */\nexport const CalendarYear: React.FunctionComponent<CalendarYearProps> = props => {\n  const animateBackwards = useAnimateBackwards(props);\n  const [fromYear, toYear, onNavNext, onNavPrevious] = useYearRangeState(props);\n\n  const gridRef = React.useRef<CalendarYearGrid>(null);\n\n  React.useImperativeHandle(props.componentRef, () => ({\n    focus() {\n      gridRef.current?.focus?.();\n    },\n  }));\n\n  const { className } = props;\n\n  const classNames = useCalendarYearStyles_unstable({\n    className,\n  });\n\n  return (\n    <div className={classNames.root}>\n      <CalendarYearHeader\n        {...props}\n        fromYear={fromYear}\n        toYear={toYear}\n        onSelectPrev={onNavPrevious}\n        onSelectNext={onNavNext}\n        animateBackwards={animateBackwards}\n      />\n      <CalendarYearGrid\n        {...props}\n        fromYear={fromYear}\n        toYear={toYear}\n        animateBackwards={animateBackwards}\n        componentRef={gridRef}\n      />\n    </div>\n  );\n};\nCalendarYear.displayName = 'CalendarYear';\n"],"names":["React","Enter","Space","useArrowNavigationGroup","mergeClasses","useCalendarYearStyles_unstable","CELL_COUNT","CELLS_PER_ROW","DefaultCalendarYearStrings","prevRangeAriaLabel","undefined","nextRangeAriaLabel","CalendarYearGridCell","props","className","highlightCurrentYear","highlightSelectedYear","year","selected","disabled","componentRef","onSelectYear","onRenderYear","buttonRef","useRef","useImperativeHandle","focus","current","onClick","onKeyDown","ev","key","classNames","highlightCurrent","highlightSelected","button","itemButton","type","role","aria-selected","ref","displayName","CalendarYearGrid","fromYear","toYear","animationDirection","animateBackwards","minYear","maxYear","selectedYear","selectedCellRef","currentCellRef","renderCell","yearToRender","Date","getFullYear","value","gridAriaLabel","cells","i","push","j","arrowNavigationAttributes","axis","div","gridContainer","aria-label","map","cellRow","index","buttonRow","CalendarYearNavDirection","Previous","Next","CalendarYearNavArrow","strings","direction","onSelectPrev","onSelectNext","navigationIcons","ariaLabel","newRangeOffset","newRange","ariaLabelString","onNavigate","navigationButton","title","upNavigation","downNavigation","CalendarYearNav","navigationButtonsContainer","CalendarYearTitle","onHeaderSelect","onHeaderKeyDown","hasHeaderClickCallback","rangeAriaLabel","headerAriaLabelFormatString","currentDateRange","replace","currentItemButton","span","aria-live","aria-atomic","CalendarYearHeader","onRenderTitle","headerContainer","useAnimateBackwards","navigatedYear","rangeYear","Math","floor","previousFromYearRef","previousFromYear","useYearRangeState","onNavigateDate","useMemo","setFromYear","useState","onNavNext","newFromYear","onNavPrevious","useEffect","CalendarYear","gridRef","root"],"mappings":"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"}

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@fluentui/react-calendar-compat",
-  "version": "0.4.1",
+  "version": "0.4.2",
   "description": "Calendar compat component for Fluent UI v9",
   "main": "lib-commonjs/index.js",
   "module": "lib/index.js",
@@ -14,11 +14,11 @@
   "dependencies": {
     "@fluentui/keyboard-keys": "^9.0.8",
     "@fluentui/react-icons": "^2.0.245",
-    "@fluentui/react-jsx-runtime": "^9.4.2",
+    "@fluentui/react-jsx-runtime": "^9.4.3",
     "@fluentui/react-shared-contexts": "^9.26.2",
-    "@fluentui/react-tabster": "^9.26.14",
+    "@fluentui/react-tabster": "^9.26.15",
     "@fluentui/react-theme": "^9.2.1",
-    "@fluentui/react-utilities": "^9.26.3",
+    "@fluentui/react-utilities": "^9.26.4",
     "@griffel/react": "^1.5.32",
     "@swc/helpers": "^0.5.1"
   },