@fluentui/react-calendar-compat 0.3.7 → 0.3.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/CHANGELOG.md +29 -2
- package/dist/index.d.ts +5 -5
- package/lib/components/Calendar/Calendar.types.js.map +1 -1
- package/lib/components/CalendarDay/CalendarDay.types.js.map +1 -1
- package/lib/components/CalendarDayGrid/CalendarDayGrid.js +1 -1
- package/lib/components/CalendarDayGrid/CalendarDayGrid.js.map +1 -1
- package/lib/components/CalendarDayGrid/CalendarDayGrid.types.js.map +1 -1
- package/lib/components/CalendarDayGrid/CalendarGridRow.js.map +1 -1
- package/lib/components/CalendarDayGrid/useWeekCornerStyles.styles.raw.js.map +1 -1
- package/lib/components/CalendarMonth/CalendarMonth.js +1 -1
- package/lib/components/CalendarMonth/CalendarMonth.js.map +1 -1
- package/lib/components/CalendarMonth/CalendarMonth.types.js.map +1 -1
- package/lib/components/CalendarYear/CalendarYear.js.map +1 -1
- package/lib/components/CalendarYear/CalendarYear.types.js.map +1 -1
- package/lib/utils/dateFormatting/dateFormatting.defaults.js.map +1 -1
- package/lib-commonjs/components/Calendar/Calendar.types.js.map +1 -1
- package/lib-commonjs/components/CalendarDay/CalendarDay.types.js.map +1 -1
- package/lib-commonjs/components/CalendarDayGrid/CalendarDayGrid.js +1 -1
- package/lib-commonjs/components/CalendarDayGrid/CalendarDayGrid.js.map +1 -1
- package/lib-commonjs/components/CalendarDayGrid/CalendarDayGrid.types.js.map +1 -1
- package/lib-commonjs/components/CalendarDayGrid/CalendarGridRow.js.map +1 -1
- package/lib-commonjs/components/CalendarDayGrid/useWeekCornerStyles.styles.raw.js.map +1 -1
- package/lib-commonjs/components/CalendarMonth/CalendarMonth.js +1 -1
- package/lib-commonjs/components/CalendarMonth/CalendarMonth.js.map +1 -1
- package/lib-commonjs/components/CalendarMonth/CalendarMonth.types.js.map +1 -1
- package/lib-commonjs/components/CalendarYear/CalendarYear.js.map +1 -1
- package/lib-commonjs/components/CalendarYear/CalendarYear.types.js.map +1 -1
- package/lib-commonjs/utils/dateFormatting/dateFormatting.defaults.js.map +1 -1
- package/package.json +9 -9
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/CalendarYear/CalendarYear.tsx"],"sourcesContent":["import * 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\n/* eslint-disable react-compiler/react-compiler */\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>;\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 // eslint-disable-next-line react-hooks/rules-of-hooks\n const selectedCellRef = React.useRef<CalendarYearGridCell>(null);\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const currentCellRef = React.useRef<CalendarYearGridCell>(null);\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\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 // eslint-disable-next-line react-hooks/rules-of-hooks\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 }: 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 setFromYear(year => year + CELL_COUNT);\n };\n\n const onNavPrevious = () => {\n setFromYear(year => year - CELL_COUNT);\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","useMemo","setFromYear","useState","onNavNext","onNavPrevious","useEffect","CalendarYear","gridRef","root"],"mappings":"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"}
|
|
1
|
+
{"version":3,"sources":["../src/components/CalendarYear/CalendarYear.tsx"],"sourcesContent":["import * 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\n/* eslint-disable react-compiler/react-compiler */\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 // eslint-disable-next-line react-hooks/rules-of-hooks\n const selectedCellRef = React.useRef<CalendarYearGridCell>(null);\n // eslint-disable-next-line react-hooks/rules-of-hooks\n const currentCellRef = React.useRef<CalendarYearGridCell>(null);\n\n // eslint-disable-next-line react-hooks/rules-of-hooks\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 // eslint-disable-next-line react-hooks/rules-of-hooks\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 }: 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 setFromYear(year => year + CELL_COUNT);\n };\n\n const onNavPrevious = () => {\n setFromYear(year => year - CELL_COUNT);\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","useMemo","setFromYear","useState","onNavNext","onNavPrevious","useEffect","CalendarYear","gridRef","root"],"mappings":"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"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/components/CalendarYear/CalendarYear.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { AnimationDirection } from '../Calendar/Calendar.types';\nimport type { CalendarNavigationIcons } from '../Calendar/calendarNavigationIcons';\nimport type { CalendarPickerStyleProps, CalendarPickerStyles } from '../CalendarPicker/CalendarPicker.types';\n\n/**\n * @internal\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport interface ICalendarYear {\n focus(): void;\n}\n\n/**\n * @internal\n */\nexport interface CalendarYearRange {\n fromYear: number;\n toYear: number;\n}\n\n/**\n * @internal\n */\nexport interface CalendarYearRangeToString {\n (range: CalendarYearRange): string;\n}\n\n/**\n * @internal\n */\nexport interface CalendarYearStrings {\n rangeAriaLabel?: string | CalendarYearRangeToString;\n prevRangeAriaLabel?: string | CalendarYearRangeToString;\n nextRangeAriaLabel?: string | CalendarYearRangeToString;\n headerAriaLabelFormatString?: string;\n}\n\n/**\n * @internal\n */\nexport interface CalendarYearProps {\n /**\n * Optional callback to access the ICalendarYear interface. Use this instead of ref for accessing\n * the public methods and properties of the component.\n */\n componentRef?: React.RefObject<ICalendarYear>;\n\n /**\n * Localized strings to use in the Calendar\n */\n strings?: CalendarYearStrings;\n\n /**\n * The currently selected year\n */\n selectedYear?: number;\n\n /**\n * The currently navigated year\n */\n navigatedYear?: number;\n\n /**\n * Callback action when a year is selected\n * @param year - The year the user selected\n */\n onSelectYear?: (year: number) => void;\n\n /**\n * Callback action when the header is selected\n */\n onHeaderSelect?: (focus: boolean) => void;\n\n /**\n * If set the Calendar will not allow navigation to or selection of a year earlier than this value.\n */\n minYear?: number;\n\n /**\n * If set the Calendar will not allow navigation to or selection of a year later than this value.\n */\n maxYear?: number;\n\n /**\n * Whether the year picker should highlight the current year\n * @default false\n */\n highlightCurrentYear?: boolean;\n\n /**\n * Whether the year picker should highlight the selected year\n * @default false\n */\n highlightSelectedYear?: boolean;\n\n /**\n * Accept custom classNames\n */\n className?: string;\n\n /**\n * Custom renderer for the title\n */\n onRenderTitle?: (props: CalendarYearHeaderProps) => React.ReactNode;\n\n /**\n * Custom renderer for the year\n */\n onRenderYear?: (year: number) => React.ReactNode;\n\n /**\n * The cardinal directions for animation to occur during transitions, either horizontal or veritcal\n */\n animationDirection?: AnimationDirection;\n\n /**\n * Custom navigation icons.\n */\n navigationIcons: CalendarNavigationIcons;\n}\n\n/**\n * @internal\n */\nexport interface CalendarYearStyleProps extends CalendarPickerStyleProps {}\n\n/**\n * @internal\n */\nexport interface CalendarYearStyles extends CalendarPickerStyles {}\n\n/**\n * @internal\n */\nexport interface CalendarYearHeaderProps extends CalendarYearProps, CalendarYearRange {\n /**\n * Callback action when the 'previous' navigation button is selected\n */\n onSelectPrev?: () => void;\n\n /**\n * Callback action when the 'next' navigation button is selected\n */\n onSelectNext?: () => void;\n\n /**\n * Whether title entering animation should be forwards or backwards\n */\n animateBackwards?: boolean;\n}\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}
|
|
1
|
+
{"version":3,"sources":["../src/components/CalendarYear/CalendarYear.types.ts"],"sourcesContent":["import * as React from 'react';\nimport { AnimationDirection } from '../Calendar/Calendar.types';\nimport type { CalendarNavigationIcons } from '../Calendar/calendarNavigationIcons';\nimport type { CalendarPickerStyleProps, CalendarPickerStyles } from '../CalendarPicker/CalendarPicker.types';\n\n/**\n * @internal\n */\n// eslint-disable-next-line @typescript-eslint/naming-convention\nexport interface ICalendarYear {\n focus(): void;\n}\n\n/**\n * @internal\n */\nexport interface CalendarYearRange {\n fromYear: number;\n toYear: number;\n}\n\n/**\n * @internal\n */\nexport interface CalendarYearRangeToString {\n (range: CalendarYearRange): string;\n}\n\n/**\n * @internal\n */\nexport interface CalendarYearStrings {\n rangeAriaLabel?: string | CalendarYearRangeToString;\n prevRangeAriaLabel?: string | CalendarYearRangeToString;\n nextRangeAriaLabel?: string | CalendarYearRangeToString;\n headerAriaLabelFormatString?: string;\n}\n\n/**\n * @internal\n */\nexport interface CalendarYearProps {\n /**\n * Optional callback to access the ICalendarYear interface. Use this instead of ref for accessing\n * the public methods and properties of the component.\n */\n componentRef?: React.RefObject<ICalendarYear | null>;\n\n /**\n * Localized strings to use in the Calendar\n */\n strings?: CalendarYearStrings;\n\n /**\n * The currently selected year\n */\n selectedYear?: number;\n\n /**\n * The currently navigated year\n */\n navigatedYear?: number;\n\n /**\n * Callback action when a year is selected\n * @param year - The year the user selected\n */\n onSelectYear?: (year: number) => void;\n\n /**\n * Callback action when the header is selected\n */\n onHeaderSelect?: (focus: boolean) => void;\n\n /**\n * If set the Calendar will not allow navigation to or selection of a year earlier than this value.\n */\n minYear?: number;\n\n /**\n * If set the Calendar will not allow navigation to or selection of a year later than this value.\n */\n maxYear?: number;\n\n /**\n * Whether the year picker should highlight the current year\n * @default false\n */\n highlightCurrentYear?: boolean;\n\n /**\n * Whether the year picker should highlight the selected year\n * @default false\n */\n highlightSelectedYear?: boolean;\n\n /**\n * Accept custom classNames\n */\n className?: string;\n\n /**\n * Custom renderer for the title\n */\n onRenderTitle?: (props: CalendarYearHeaderProps) => React.ReactNode;\n\n /**\n * Custom renderer for the year\n */\n onRenderYear?: (year: number) => React.ReactNode;\n\n /**\n * The cardinal directions for animation to occur during transitions, either horizontal or veritcal\n */\n animationDirection?: AnimationDirection;\n\n /**\n * Custom navigation icons.\n */\n navigationIcons: CalendarNavigationIcons;\n}\n\n/**\n * @internal\n */\nexport interface CalendarYearStyleProps extends CalendarPickerStyleProps {}\n\n/**\n * @internal\n */\nexport interface CalendarYearStyles extends CalendarPickerStyles {}\n\n/**\n * @internal\n */\nexport interface CalendarYearHeaderProps extends CalendarYearProps, CalendarYearRange {\n /**\n * Callback action when the 'previous' navigation button is selected\n */\n onSelectPrev?: () => void;\n\n /**\n * Callback action when the 'next' navigation button is selected\n */\n onSelectNext?: () => void;\n\n /**\n * Whether title entering animation should be forwards or backwards\n */\n animateBackwards?: boolean;\n}\n"],"names":["React"],"mappings":";;;;;iEAAuB,QAAQ"}
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"sources":["../src/utils/dateFormatting/dateFormatting.defaults.ts"],"sourcesContent":["import type { CalendarStrings, DateFormatting, DateGridStrings } from './dateFormatting.types';\n\n/**\n * Format date to a day string representation\n * @param date - input date to format\n */\nexport const formatDay = (date: Date) => date.getDate().toString();\n\n/**\n * Format date to a month-day-year string\n * @param date - input date to format\n * @param strings - localized strings\n */\nexport const formatMonthDayYear = (date: Date, strings: DateGridStrings) =>\n strings.months[date.getMonth()] + ' ' + date.getDate() + ', ' + date.getFullYear();\n\n/**\n * Format date to a month-year string\n * @param date - input date to format\n * @param strings - localized strings\n */\nexport const formatMonthYear = (date: Date, strings: DateGridStrings) =>\n strings.months[date.getMonth()] + ' ' + date.getFullYear();\n\n/**\n * Format date to a month string\n * @param date - input date to format\n * @param strings - localized strings\n */\nexport const formatMonth = (date: Date, strings: DateGridStrings) => strings.months[date.getMonth()];\n\n/**\n * Format date to a year string representation\n * @param date - input date to format\n */\nexport const formatYear = (date: Date) => date.getFullYear().toString();\n\nexport const DEFAULT_DATE_GRID_STRINGS: DateGridStrings = {\n months: [\n 'January',\n 'February',\n 'March',\n 'April',\n 'May',\n 'June',\n 'July',\n 'August',\n 'September',\n 'October',\n 'November',\n 'December',\n ],\n shortMonths: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],\n days: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],\n shortDays: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],\n};\n\nexport const DEFAULT_DATE_FORMATTING: DateFormatting = {\n formatDay,\n formatMonth,\n formatYear,\n formatMonthDayYear,\n formatMonthYear,\n};\n\nexport const DEFAULT_CALENDAR_STRINGS: CalendarStrings = {\n ...DEFAULT_DATE_GRID_STRINGS,\n\n goToToday: 'Go to today',\n weekNumberFormatString: 'Week number {0}',\n prevMonthAriaLabel: 'Previous month',\n nextMonthAriaLabel: 'Next month',\n prevYearAriaLabel: 'Previous year',\n nextYearAriaLabel: 'Next year',\n prevYearRangeAriaLabel: 'Previous year range',\n nextYearRangeAriaLabel: 'Next year range',\n closeButtonAriaLabel: 'Close',\n selectedDateFormatString: 'Selected date {0}',\n todayDateFormatString: \"Today's date {0}\",\n monthPickerHeaderAriaLabel: '{0}, change year',\n yearPickerHeaderAriaLabel: '{0}, change month',\n dayMarkedAriaLabel: 'marked',\n};\n"],"names":["formatDay","date","getDate","toString","formatMonthDayYear","strings","months","getMonth","getFullYear","formatMonthYear","formatMonth","formatYear","DEFAULT_DATE_GRID_STRINGS","shortMonths","days","shortDays","DEFAULT_DATE_FORMATTING","DEFAULT_CALENDAR_STRINGS","goToToday","weekNumberFormatString","prevMonthAriaLabel","nextMonthAriaLabel","prevYearAriaLabel","nextYearAriaLabel","prevYearRangeAriaLabel","nextYearRangeAriaLabel","closeButtonAriaLabel","selectedDateFormatString","todayDateFormatString","monthPickerHeaderAriaLabel","yearPickerHeaderAriaLabel","dayMarkedAriaLabel"],"mappings":"AAEA;;;CAGC,GACD;;;;;;;;;;;4BA2DaiB;;;2BARAD;;;6BApBAJ;;;aA/BAZ;;;eAuBAU;;;sBAhBAN;;;mBAQAK;;;IAcAE,UAAAA;;;;AA7BN,MAAMX,YAAY,CAACC,
|
|
1
|
+
{"version":3,"sources":["../src/utils/dateFormatting/dateFormatting.defaults.ts"],"sourcesContent":["import type { CalendarStrings, DateFormatting, DateGridStrings } from './dateFormatting.types';\n\n/**\n * Format date to a day string representation\n * @param date - input date to format\n */\nexport const formatDay = (date: Date): string => date.getDate().toString();\n\n/**\n * Format date to a month-day-year string\n * @param date - input date to format\n * @param strings - localized strings\n */\nexport const formatMonthDayYear = (date: Date, strings: DateGridStrings): string =>\n strings.months[date.getMonth()] + ' ' + date.getDate() + ', ' + date.getFullYear();\n\n/**\n * Format date to a month-year string\n * @param date - input date to format\n * @param strings - localized strings\n */\nexport const formatMonthYear = (date: Date, strings: DateGridStrings): string =>\n strings.months[date.getMonth()] + ' ' + date.getFullYear();\n\n/**\n * Format date to a month string\n * @param date - input date to format\n * @param strings - localized strings\n */\nexport const formatMonth = (date: Date, strings: DateGridStrings): string => strings.months[date.getMonth()];\n\n/**\n * Format date to a year string representation\n * @param date - input date to format\n */\nexport const formatYear = (date: Date): string => date.getFullYear().toString();\n\nexport const DEFAULT_DATE_GRID_STRINGS: DateGridStrings = {\n months: [\n 'January',\n 'February',\n 'March',\n 'April',\n 'May',\n 'June',\n 'July',\n 'August',\n 'September',\n 'October',\n 'November',\n 'December',\n ],\n shortMonths: ['Jan', 'Feb', 'Mar', 'Apr', 'May', 'Jun', 'Jul', 'Aug', 'Sep', 'Oct', 'Nov', 'Dec'],\n days: ['Sunday', 'Monday', 'Tuesday', 'Wednesday', 'Thursday', 'Friday', 'Saturday'],\n shortDays: ['S', 'M', 'T', 'W', 'T', 'F', 'S'],\n};\n\nexport const DEFAULT_DATE_FORMATTING: DateFormatting = {\n formatDay,\n formatMonth,\n formatYear,\n formatMonthDayYear,\n formatMonthYear,\n};\n\nexport const DEFAULT_CALENDAR_STRINGS: CalendarStrings = {\n ...DEFAULT_DATE_GRID_STRINGS,\n\n goToToday: 'Go to today',\n weekNumberFormatString: 'Week number {0}',\n prevMonthAriaLabel: 'Previous month',\n nextMonthAriaLabel: 'Next month',\n prevYearAriaLabel: 'Previous year',\n nextYearAriaLabel: 'Next year',\n prevYearRangeAriaLabel: 'Previous year range',\n nextYearRangeAriaLabel: 'Next year range',\n closeButtonAriaLabel: 'Close',\n selectedDateFormatString: 'Selected date {0}',\n todayDateFormatString: \"Today's date {0}\",\n monthPickerHeaderAriaLabel: '{0}, change year',\n yearPickerHeaderAriaLabel: '{0}, change month',\n dayMarkedAriaLabel: 'marked',\n};\n"],"names":["formatDay","date","getDate","toString","formatMonthDayYear","strings","months","getMonth","getFullYear","formatMonthYear","formatMonth","formatYear","DEFAULT_DATE_GRID_STRINGS","shortMonths","days","shortDays","DEFAULT_DATE_FORMATTING","DEFAULT_CALENDAR_STRINGS","goToToday","weekNumberFormatString","prevMonthAriaLabel","nextMonthAriaLabel","prevYearAriaLabel","nextYearAriaLabel","prevYearRangeAriaLabel","nextYearRangeAriaLabel","closeButtonAriaLabel","selectedDateFormatString","todayDateFormatString","monthPickerHeaderAriaLabel","yearPickerHeaderAriaLabel","dayMarkedAriaLabel"],"mappings":"AAEA;;;CAGC,GACD;;;;;;;;;;;4BA2DaiB;;;2BARAD;;;6BApBAJ;;;aA/BAZ;;;eAuBAU;;;sBAhBAN;;;mBAQAK;;;IAcAE,UAAAA;;;;AA7BN,MAAMX,YAAY,CAACC,OAAuBA,KAAKC,OAAO,GAAGC,QAAQ,GAAG;AAOpE,MAAMC,qBAAqB,CAACH,MAAYI,UAC7CA,QAAQC,MAAM,CAACL,KAAKM,QAAQ,GAAG,GAAG,MAAMN,KAAKC,OAAO,KAAK,OAAOD,KAAKO,WAAW,GAAG;AAO9E,MAAMC,kBAAkB,CAACR,MAAYI,UAC1CA,QAAQC,MAAM,CAACL,KAAKM,QAAQ,GAAG,GAAG,MAAMN,KAAKO,WAAW,GAAG;AAOtD,MAAME,cAAc,CAACT,MAAYI,UAAqCA,QAAQC,MAAM,CAACL,KAAKM,QAAQ,GAAG,CAAC;AAMtG,mBAAmB,CAACN,OAAuBA,KAAKO,WAAW,GAAGL,QAAQ,GAAG;AAEzE,MAAMS,4BAA6C;IACxDN,QAAQ;QACN;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;QACA;KACD;IACDO,aAAa;QAAC;QAAO;QAAO;QAAO;QAAO;QAAO;QAAO;QAAO;QAAO;QAAO;QAAO;QAAO;KAAM;IACjGC,MAAM;QAAC;QAAU;QAAU;QAAW;QAAa;QAAY;QAAU;KAAW;IACpFC,WAAW;QAAC;QAAK;QAAK;QAAK;QAAK;QAAK;QAAK;KAAI;AAChD,EAAE;AAEK,MAAMC,0BAA0C;IACrDhB;IACAU;IACAC;IACAP;IACAK;AACF,EAAE;AAEK,MAAMQ,2BAA4C;IACvD,GAAGL,yBAAyB;IAE5BM,WAAW;IACXC,wBAAwB;IACxBC,oBAAoB;IACpBC,oBAAoB;IACpBC,mBAAmB;IACnBC,mBAAmB;IACnBC,wBAAwB;IACxBC,wBAAwB;IACxBC,sBAAsB;IACtBC,0BAA0B;IAC1BC,uBAAuB;IACvBC,4BAA4B;IAC5BC,2BAA2B;IAC3BC,oBAAoB;AACtB,EAAE"}
|
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "@fluentui/react-calendar-compat",
|
|
3
|
-
"version": "0.3.
|
|
3
|
+
"version": "0.3.9",
|
|
4
4
|
"description": "Calendar compat component for Fluent UI v9",
|
|
5
5
|
"main": "lib-commonjs/index.js",
|
|
6
6
|
"module": "lib/index.js",
|
|
@@ -20,19 +20,19 @@
|
|
|
20
20
|
"dependencies": {
|
|
21
21
|
"@fluentui/keyboard-keys": "^9.0.8",
|
|
22
22
|
"@fluentui/react-icons": "^2.0.245",
|
|
23
|
-
"@fluentui/react-jsx-runtime": "^9.
|
|
24
|
-
"@fluentui/react-shared-contexts": "^9.
|
|
25
|
-
"@fluentui/react-tabster": "^9.26.
|
|
23
|
+
"@fluentui/react-jsx-runtime": "^9.2.0",
|
|
24
|
+
"@fluentui/react-shared-contexts": "^9.25.1",
|
|
25
|
+
"@fluentui/react-tabster": "^9.26.5",
|
|
26
26
|
"@fluentui/react-theme": "^9.2.0",
|
|
27
|
-
"@fluentui/react-utilities": "^9.
|
|
27
|
+
"@fluentui/react-utilities": "^9.24.1",
|
|
28
28
|
"@griffel/react": "^1.5.22",
|
|
29
29
|
"@swc/helpers": "^0.5.1"
|
|
30
30
|
},
|
|
31
31
|
"peerDependencies": {
|
|
32
|
-
"@types/react": ">=16.8.0 <
|
|
33
|
-
"@types/react-dom": ">=16.8.0 <
|
|
34
|
-
"react": ">=16.8.0 <
|
|
35
|
-
"react-dom": ">=16.8.0 <
|
|
32
|
+
"@types/react": ">=16.8.0 <20.0.0",
|
|
33
|
+
"@types/react-dom": ">=16.8.0 <20.0.0",
|
|
34
|
+
"react": ">=16.8.0 <20.0.0",
|
|
35
|
+
"react-dom": ">=16.8.0 <20.0.0"
|
|
36
36
|
},
|
|
37
37
|
"exports": {
|
|
38
38
|
".": {
|