@fluentui/react-calendar-compat 0.3.2 → 0.3.4
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 +21 -2
- package/lib/components/Calendar/calendarNavigationIcons.js.map +1 -1
- package/lib/components/Calendar/useCalendarStyles.styles.raw.js +115 -0
- package/lib/components/Calendar/useCalendarStyles.styles.raw.js.map +1 -0
- package/lib/components/CalendarDay/CalendarDay.js.map +1 -1
- package/lib/components/CalendarDay/useCalendarDayStyles.styles.raw.js +142 -0
- package/lib/components/CalendarDay/useCalendarDayStyles.styles.raw.js.map +1 -0
- package/lib/components/CalendarDayGrid/useCalendarDayGridStyles.styles.raw.js +395 -0
- package/lib/components/CalendarDayGrid/useCalendarDayGridStyles.styles.raw.js.map +1 -0
- package/lib/components/CalendarDayGrid/useWeekCornerStyles.styles.raw.js +92 -0
- package/lib/components/CalendarDayGrid/useWeekCornerStyles.styles.raw.js.map +1 -0
- package/lib/components/CalendarMonth/useCalendarMonthStyles.styles.raw.js +9 -0
- package/lib/components/CalendarMonth/useCalendarMonthStyles.styles.raw.js.map +1 -0
- package/lib/components/CalendarPicker/useCalendarPickerStyles.styles.raw.js +291 -0
- package/lib/components/CalendarPicker/useCalendarPickerStyles.styles.raw.js.map +1 -0
- package/lib/components/CalendarYear/useCalendarYearStyles.styles.raw.js +9 -0
- package/lib/components/CalendarYear/useCalendarYearStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/Calendar/calendarNavigationIcons.js.map +1 -1
- package/lib-commonjs/components/Calendar/useCalendarStyles.styles.raw.js +127 -0
- package/lib-commonjs/components/Calendar/useCalendarStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/CalendarDay/CalendarDay.js.map +1 -1
- package/lib-commonjs/components/CalendarDay/useCalendarDayStyles.styles.raw.js +154 -0
- package/lib-commonjs/components/CalendarDay/useCalendarDayStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/CalendarDayGrid/useCalendarDayGridStyles.styles.raw.js +408 -0
- package/lib-commonjs/components/CalendarDayGrid/useCalendarDayGridStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/CalendarDayGrid/useWeekCornerStyles.styles.raw.js +106 -0
- package/lib-commonjs/components/CalendarDayGrid/useWeekCornerStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/CalendarMonth/useCalendarMonthStyles.styles.raw.js +15 -0
- package/lib-commonjs/components/CalendarMonth/useCalendarMonthStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/CalendarPicker/useCalendarPickerStyles.styles.raw.js +303 -0
- package/lib-commonjs/components/CalendarPicker/useCalendarPickerStyles.styles.raw.js.map +1 -0
- package/lib-commonjs/components/CalendarYear/useCalendarYearStyles.styles.raw.js +15 -0
- package/lib-commonjs/components/CalendarYear/useCalendarYearStyles.styles.raw.js.map +1 -0
- package/package.json +2 -2
@@ -0,0 +1,154 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
3
|
+
value: true
|
4
|
+
});
|
5
|
+
function _export(target, all) {
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
7
|
+
enumerable: true,
|
8
|
+
get: all[name]
|
9
|
+
});
|
10
|
+
}
|
11
|
+
_export(exports, {
|
12
|
+
calendarDayClassNames: function() {
|
13
|
+
return calendarDayClassNames;
|
14
|
+
},
|
15
|
+
useCalendarDayStyles_unstable: function() {
|
16
|
+
return useCalendarDayStyles_unstable;
|
17
|
+
}
|
18
|
+
});
|
19
|
+
const _reacttheme = require("@fluentui/react-theme");
|
20
|
+
const _react = require("@griffel/react");
|
21
|
+
const _animations = require("../../utils/animations");
|
22
|
+
const calendarDayClassNames = {
|
23
|
+
root: 'fui-CalendarDay',
|
24
|
+
header: 'fui-CalendarDay__header',
|
25
|
+
monthAndYear: 'fui-CalendarDay__monthAndYear',
|
26
|
+
monthComponents: 'fui-CalendarDay__monthComponents',
|
27
|
+
headerIconButton: 'fui-CalendarDay__headerIconButton',
|
28
|
+
disabledStyle: 'fui-CalendarDay__disabledStyle'
|
29
|
+
};
|
30
|
+
const useRootStyles = (0, _react.makeStyles)({
|
31
|
+
base: {
|
32
|
+
boxSizing: 'content-box',
|
33
|
+
padding: '12px',
|
34
|
+
width: '196px'
|
35
|
+
},
|
36
|
+
normalize: {
|
37
|
+
boxShadow: 'none',
|
38
|
+
boxSizing: 'border-box',
|
39
|
+
margin: '0',
|
40
|
+
padding: '0'
|
41
|
+
},
|
42
|
+
showWeekNumbers: {
|
43
|
+
width: '226px'
|
44
|
+
}
|
45
|
+
});
|
46
|
+
const useHeaderStyles = (0, _react.makeStyles)({
|
47
|
+
base: {
|
48
|
+
display: 'inline-flex',
|
49
|
+
height: '28px',
|
50
|
+
lineHeight: '44px',
|
51
|
+
position: 'relative',
|
52
|
+
width: '100%'
|
53
|
+
}
|
54
|
+
});
|
55
|
+
const useMonthAndYearStyles = (0, _react.makeStyles)({
|
56
|
+
base: {
|
57
|
+
alignItems: 'center',
|
58
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
59
|
+
..._react.shorthands.borderStyle('none'),
|
60
|
+
borderRadius: _reacttheme.tokens.borderRadiusMedium,
|
61
|
+
color: _reacttheme.tokens.colorNeutralForeground1,
|
62
|
+
display: 'inline-block',
|
63
|
+
flexGrow: 1,
|
64
|
+
fontFamily: 'inherit',
|
65
|
+
fontSize: _reacttheme.tokens.fontSizeBase300,
|
66
|
+
fontWeight: _reacttheme.tokens.fontWeightSemibold,
|
67
|
+
lineHeight: '28px',
|
68
|
+
overflow: 'hidden',
|
69
|
+
padding: '0 4px 0 10px',
|
70
|
+
textAlign: 'left',
|
71
|
+
textOverflow: 'ellipsis',
|
72
|
+
whiteSpace: 'nowrap'
|
73
|
+
},
|
74
|
+
animation: {
|
75
|
+
animationDuration: _animations.DURATION_2,
|
76
|
+
animationFillMode: 'both',
|
77
|
+
animationName: _animations.FADE_IN,
|
78
|
+
animationTimingFunction: _animations.EASING_FUNCTION_2
|
79
|
+
},
|
80
|
+
headerIsClickable: {
|
81
|
+
'&:hover': {
|
82
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundInvertedHover,
|
83
|
+
color: _reacttheme.tokens.colorBrandForegroundOnLightHover,
|
84
|
+
cursor: 'pointer',
|
85
|
+
outline: `1px solid ${_reacttheme.tokens.colorTransparentStroke}`
|
86
|
+
},
|
87
|
+
'&:hover:active': {
|
88
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundInvertedPressed,
|
89
|
+
color: _reacttheme.tokens.colorBrandForegroundOnLightPressed,
|
90
|
+
cursor: 'pointer',
|
91
|
+
outline: `1px solid ${_reacttheme.tokens.colorTransparentStroke}`
|
92
|
+
}
|
93
|
+
}
|
94
|
+
});
|
95
|
+
const useMonthComponentsStyles = (0, _react.makeStyles)({
|
96
|
+
base: {
|
97
|
+
alignSelf: 'flex-end',
|
98
|
+
display: 'inline-flex'
|
99
|
+
}
|
100
|
+
});
|
101
|
+
const useHeaderIconButtonStyles = (0, _react.makeStyles)({
|
102
|
+
base: {
|
103
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
104
|
+
..._react.shorthands.borderStyle('none'),
|
105
|
+
borderRadius: _reacttheme.tokens.borderRadiusMedium,
|
106
|
+
color: _reacttheme.tokens.colorNeutralForeground3,
|
107
|
+
display: 'block',
|
108
|
+
fontFamily: 'inherit',
|
109
|
+
fontSize: _reacttheme.tokens.fontSizeBase200,
|
110
|
+
height: '28px',
|
111
|
+
lineHeight: '28px',
|
112
|
+
overflow: 'visible',
|
113
|
+
padding: '0',
|
114
|
+
position: 'relative',
|
115
|
+
textAlign: 'center',
|
116
|
+
width: '28px',
|
117
|
+
'&:hover': {
|
118
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundInvertedHover,
|
119
|
+
color: _reacttheme.tokens.colorBrandForegroundOnLightHover,
|
120
|
+
cursor: 'pointer',
|
121
|
+
outline: `1px solid ${_reacttheme.tokens.colorTransparentStroke}`
|
122
|
+
},
|
123
|
+
'&:hover:active': {
|
124
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundInvertedPressed,
|
125
|
+
color: _reacttheme.tokens.colorBrandForegroundOnLightPressed
|
126
|
+
}
|
127
|
+
}
|
128
|
+
});
|
129
|
+
const useDisabledStyleStyles = (0, _react.makeStyles)({
|
130
|
+
base: {
|
131
|
+
'&, &:disabled, & button': {
|
132
|
+
color: _reacttheme.tokens.colorNeutralForegroundDisabled,
|
133
|
+
pointerEvents: 'none'
|
134
|
+
}
|
135
|
+
}
|
136
|
+
});
|
137
|
+
const useCalendarDayStyles_unstable = (props)=>{
|
138
|
+
'use no memo';
|
139
|
+
const rootStyles = useRootStyles();
|
140
|
+
const headerStyles = useHeaderStyles();
|
141
|
+
const monthAndYearStyles = useMonthAndYearStyles();
|
142
|
+
const monthComponentsStyles = useMonthComponentsStyles();
|
143
|
+
const headerIconButtonStyles = useHeaderIconButtonStyles();
|
144
|
+
const disabledStyleStyles = useDisabledStyleStyles();
|
145
|
+
const { className, headerIsClickable, showWeekNumbers } = props;
|
146
|
+
return {
|
147
|
+
root: (0, _react.mergeClasses)(calendarDayClassNames.root, rootStyles.normalize, rootStyles.base, showWeekNumbers && rootStyles.showWeekNumbers, className),
|
148
|
+
header: (0, _react.mergeClasses)(calendarDayClassNames.header, headerStyles.base),
|
149
|
+
monthAndYear: (0, _react.mergeClasses)(calendarDayClassNames.monthAndYear, monthAndYearStyles.base, monthAndYearStyles.animation, headerIsClickable && monthAndYearStyles.headerIsClickable),
|
150
|
+
monthComponents: (0, _react.mergeClasses)(calendarDayClassNames.monthComponents, monthComponentsStyles.base),
|
151
|
+
headerIconButton: (0, _react.mergeClasses)(calendarDayClassNames.headerIconButton, headerIconButtonStyles.base),
|
152
|
+
disabledStyle: (0, _react.mergeClasses)(calendarDayClassNames.disabledStyle, disabledStyleStyles.base)
|
153
|
+
};
|
154
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../src/components/CalendarDay/useCalendarDayStyles.styles.ts"],"sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport { DURATION_2, EASING_FUNCTION_2, FADE_IN } from '../../utils/animations';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { CalendarDayStyles, CalendarDayStyleProps } from './CalendarDay.types';\n\n/**\n * @internal\n */\nexport const calendarDayClassNames: SlotClassNames<CalendarDayStyles> = {\n root: 'fui-CalendarDay',\n header: 'fui-CalendarDay__header',\n monthAndYear: 'fui-CalendarDay__monthAndYear',\n monthComponents: 'fui-CalendarDay__monthComponents',\n headerIconButton: 'fui-CalendarDay__headerIconButton',\n disabledStyle: 'fui-CalendarDay__disabledStyle',\n};\n\nconst useRootStyles = makeStyles({\n base: {\n boxSizing: 'content-box',\n padding: '12px',\n width: '196px',\n },\n normalize: {\n boxShadow: 'none',\n boxSizing: 'border-box',\n margin: '0',\n padding: '0',\n },\n showWeekNumbers: {\n width: '226px',\n },\n});\n\nconst useHeaderStyles = makeStyles({\n base: {\n display: 'inline-flex',\n height: '28px',\n lineHeight: '44px',\n position: 'relative',\n width: '100%',\n },\n});\n\nconst useMonthAndYearStyles = makeStyles({\n base: {\n alignItems: 'center',\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderStyle('none'),\n borderRadius: tokens.borderRadiusMedium,\n color: tokens.colorNeutralForeground1,\n display: 'inline-block',\n flexGrow: 1,\n fontFamily: 'inherit',\n fontSize: tokens.fontSizeBase300,\n fontWeight: tokens.fontWeightSemibold,\n lineHeight: '28px',\n overflow: 'hidden',\n padding: '0 4px 0 10px',\n textAlign: 'left',\n textOverflow: 'ellipsis',\n whiteSpace: 'nowrap',\n },\n animation: {\n animationDuration: DURATION_2,\n animationFillMode: 'both',\n animationName: FADE_IN,\n animationTimingFunction: EASING_FUNCTION_2,\n },\n headerIsClickable: {\n '&:hover': {\n backgroundColor: tokens.colorBrandBackgroundInvertedHover,\n color: tokens.colorBrandForegroundOnLightHover,\n cursor: 'pointer',\n outline: `1px solid ${tokens.colorTransparentStroke}`,\n },\n '&:hover:active': {\n backgroundColor: tokens.colorBrandBackgroundInvertedPressed,\n color: tokens.colorBrandForegroundOnLightPressed,\n cursor: 'pointer',\n outline: `1px solid ${tokens.colorTransparentStroke}`,\n },\n },\n});\n\nconst useMonthComponentsStyles = makeStyles({\n base: {\n alignSelf: 'flex-end',\n display: 'inline-flex',\n },\n});\n\nconst useHeaderIconButtonStyles = makeStyles({\n base: {\n backgroundColor: tokens.colorTransparentBackground,\n ...shorthands.borderStyle('none'),\n borderRadius: tokens.borderRadiusMedium,\n color: tokens.colorNeutralForeground3,\n display: 'block',\n fontFamily: 'inherit',\n fontSize: tokens.fontSizeBase200,\n height: '28px',\n lineHeight: '28px',\n overflow: 'visible',\n padding: '0',\n position: 'relative',\n textAlign: 'center',\n width: '28px',\n\n '&:hover': {\n backgroundColor: tokens.colorBrandBackgroundInvertedHover,\n color: tokens.colorBrandForegroundOnLightHover,\n cursor: 'pointer',\n outline: `1px solid ${tokens.colorTransparentStroke}`,\n },\n '&:hover:active': {\n backgroundColor: tokens.colorBrandBackgroundInvertedPressed,\n color: tokens.colorBrandForegroundOnLightPressed,\n },\n },\n});\n\nconst useDisabledStyleStyles = makeStyles({\n base: {\n '&, &:disabled, & button': {\n color: tokens.colorNeutralForegroundDisabled,\n pointerEvents: 'none',\n },\n },\n});\n\n/**\n * @internal\n *\n * Apply styling to the CalendarDay slots based on the state\n */\nexport const useCalendarDayStyles_unstable = (props: CalendarDayStyleProps): CalendarDayStyles => {\n 'use no memo';\n\n const rootStyles = useRootStyles();\n const headerStyles = useHeaderStyles();\n const monthAndYearStyles = useMonthAndYearStyles();\n const monthComponentsStyles = useMonthComponentsStyles();\n const headerIconButtonStyles = useHeaderIconButtonStyles();\n const disabledStyleStyles = useDisabledStyleStyles();\n\n const { className, headerIsClickable, showWeekNumbers } = props;\n\n return {\n root: mergeClasses(\n calendarDayClassNames.root,\n rootStyles.normalize,\n rootStyles.base,\n showWeekNumbers && rootStyles.showWeekNumbers,\n className,\n ),\n header: mergeClasses(calendarDayClassNames.header, headerStyles.base),\n monthAndYear: mergeClasses(\n calendarDayClassNames.monthAndYear,\n monthAndYearStyles.base,\n monthAndYearStyles.animation,\n headerIsClickable && monthAndYearStyles.headerIsClickable,\n ),\n monthComponents: mergeClasses(calendarDayClassNames.monthComponents, monthComponentsStyles.base),\n headerIconButton: mergeClasses(calendarDayClassNames.headerIconButton, headerIconButtonStyles.base),\n disabledStyle: mergeClasses(calendarDayClassNames.disabledStyle, disabledStyleStyles.base),\n };\n};\n"],"names":["calendarDayClassNames","useCalendarDayStyles_unstable","root","header","monthAndYear","monthComponents","headerIconButton","disabledStyle","useRootStyles","makeStyles","base","boxSizing","padding","width","normalize","boxShadow","margin","showWeekNumbers","useHeaderStyles","display","height","lineHeight","position","useMonthAndYearStyles","alignItems","backgroundColor","tokens","colorTransparentBackground","shorthands","borderStyle","borderRadius","borderRadiusMedium","color","colorNeutralForeground1","flexGrow","fontFamily","fontSize","fontSizeBase300","fontWeight","fontWeightSemibold","overflow","textAlign","textOverflow","whiteSpace","animation","animationDuration","DURATION_2","animationFillMode","animationName","FADE_IN","animationTimingFunction","EASING_FUNCTION_2","headerIsClickable","colorBrandBackgroundInvertedHover","colorBrandForegroundOnLightHover","cursor","outline","colorTransparentStroke","colorBrandBackgroundInvertedPressed","colorBrandForegroundOnLightPressed","useMonthComponentsStyles","alignSelf","useHeaderIconButtonStyles","colorNeutralForeground3","fontSizeBase200","useDisabledStyleStyles","colorNeutralForegroundDisabled","pointerEvents","props","rootStyles","headerStyles","monthAndYearStyles","monthComponentsStyles","headerIconButtonStyles","disabledStyleStyles","className","mergeClasses"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|
@@ -0,0 +1,408 @@
|
|
1
|
+
"use strict";
|
2
|
+
Object.defineProperty(exports, "__esModule", {
|
3
|
+
value: true
|
4
|
+
});
|
5
|
+
function _export(target, all) {
|
6
|
+
for(var name in all)Object.defineProperty(target, name, {
|
7
|
+
enumerable: true,
|
8
|
+
get: all[name]
|
9
|
+
});
|
10
|
+
}
|
11
|
+
_export(exports, {
|
12
|
+
calendarDayGridClassNames: function() {
|
13
|
+
return calendarDayGridClassNames;
|
14
|
+
},
|
15
|
+
extraCalendarDayGridClassNames: function() {
|
16
|
+
return extraCalendarDayGridClassNames;
|
17
|
+
},
|
18
|
+
useCalendarDayGridStyles_unstable: function() {
|
19
|
+
return useCalendarDayGridStyles_unstable;
|
20
|
+
}
|
21
|
+
});
|
22
|
+
const _reacttheme = require("@fluentui/react-theme");
|
23
|
+
const _react = require("@griffel/react");
|
24
|
+
const _utils = require("../../utils");
|
25
|
+
const _Calendartypes = require("../Calendar/Calendar.types");
|
26
|
+
const _useWeekCornerStylesstyles = require("./useWeekCornerStyles.styles");
|
27
|
+
const _reacttabster = require("@fluentui/react-tabster");
|
28
|
+
const calendarDayGridClassNames = {
|
29
|
+
wrapper: 'fui-CalendarDayGrid__wrapper',
|
30
|
+
table: 'fui-CalendarDayGrid__table',
|
31
|
+
dayCell: 'fui-CalendarDayGrid__dayCell',
|
32
|
+
daySelected: 'fui-CalendarDayGrid__daySelected',
|
33
|
+
daySingleSelected: 'fui-CalendarDayGrid__daySingleSelected',
|
34
|
+
weekRow: 'fui-CalendarDayGrid__weekRow',
|
35
|
+
weekDayLabelCell: 'fui-CalendarDayGrid__weekDayLabelCell',
|
36
|
+
weekNumberCell: 'fui-CalendarDayGrid__weekNumberCell',
|
37
|
+
dayOutsideBounds: 'fui-CalendarDayGrid__dayOutsideBounds',
|
38
|
+
dayOutsideNavigatedMonth: 'fui-CalendarDayGrid__dayOutsideNavigatedMonth',
|
39
|
+
dayButton: 'fui-CalendarDayGrid__dayButton',
|
40
|
+
dayIsToday: 'fui-CalendarDayGrid__dayIsToday',
|
41
|
+
firstTransitionWeek: 'fui-CalendarDayGrid__firstTransitionWeek',
|
42
|
+
lastTransitionWeek: 'fui-CalendarDayGrid__lastTransitionWeek',
|
43
|
+
dayMarker: 'fui-CalendarDayGrid__dayMarker',
|
44
|
+
dayTodayMarker: 'fui-CalendarDayGrid__dayTodayMarker'
|
45
|
+
};
|
46
|
+
const extraCalendarDayGridClassNames = {
|
47
|
+
hoverStyle: 'fui-CalendarDayGrid__hoverStyle',
|
48
|
+
pressedStyle: 'fui-CalendarDayGrid__pressedStyle'
|
49
|
+
};
|
50
|
+
const useWrapperStyles = (0, _react.makeStyles)({
|
51
|
+
base: {
|
52
|
+
paddingBottom: '10px'
|
53
|
+
}
|
54
|
+
});
|
55
|
+
const useTableStyles = (0, _react.makeStyles)({
|
56
|
+
base: {
|
57
|
+
borderCollapse: 'collapse',
|
58
|
+
borderSpacing: 0,
|
59
|
+
fontSize: 'inherit',
|
60
|
+
marginTop: '4px',
|
61
|
+
paddingBottom: '10px',
|
62
|
+
position: 'relative',
|
63
|
+
tableLayout: 'fixed',
|
64
|
+
textAlign: 'center',
|
65
|
+
width: '196px'
|
66
|
+
},
|
67
|
+
showWeekNumbers: {
|
68
|
+
width: '226px'
|
69
|
+
}
|
70
|
+
});
|
71
|
+
const useDayCellStyles = (0, _react.makeStyles)({
|
72
|
+
base: {
|
73
|
+
color: _reacttheme.tokens.colorNeutralForeground1,
|
74
|
+
cursor: 'pointer',
|
75
|
+
fontSize: _reacttheme.tokens.fontSizeBase200,
|
76
|
+
fontWeight: _reacttheme.tokens.fontWeightRegular,
|
77
|
+
margin: '0',
|
78
|
+
padding: '2px',
|
79
|
+
position: 'relative',
|
80
|
+
'@media (forced-colors: active)': {
|
81
|
+
backgroundColor: 'Window',
|
82
|
+
color: 'WindowText'
|
83
|
+
},
|
84
|
+
[`&.${extraCalendarDayGridClassNames.hoverStyle}`]: {
|
85
|
+
color: _reacttheme.tokens.colorNeutralForeground1Static,
|
86
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundInvertedHover,
|
87
|
+
'@media (forced-colors: active)': {
|
88
|
+
outline: '1px solid Highlight',
|
89
|
+
zIndex: 3,
|
90
|
+
[`& .${calendarDayGridClassNames.dayTodayMarker}`]: {
|
91
|
+
backgroundColor: 'Highlight'
|
92
|
+
}
|
93
|
+
}
|
94
|
+
},
|
95
|
+
[`&.${extraCalendarDayGridClassNames.pressedStyle}`]: {
|
96
|
+
color: _reacttheme.tokens.colorNeutralForeground1Static,
|
97
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundInvertedPressed,
|
98
|
+
'@media (forced-colors: active)': {
|
99
|
+
backgroundColor: 'Window',
|
100
|
+
..._react.shorthands.borderColor('Highlight'),
|
101
|
+
color: 'Highlight'
|
102
|
+
}
|
103
|
+
}
|
104
|
+
},
|
105
|
+
focusIndicator: (0, _reacttabster.createFocusOutlineStyle)({
|
106
|
+
style: {
|
107
|
+
outlineWidth: _reacttheme.tokens.strokeWidthThick,
|
108
|
+
..._react.shorthands.borderWidth(_reacttheme.tokens.strokeWidthThick)
|
109
|
+
}
|
110
|
+
})
|
111
|
+
});
|
112
|
+
const useDaySelectedStyles = (0, _react.makeStyles)({
|
113
|
+
base: {
|
114
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundInvertedSelected,
|
115
|
+
color: _reacttheme.tokens.colorNeutralForeground1Static,
|
116
|
+
'@media (forced-colors: active)': {
|
117
|
+
backgroundColor: 'Highlight',
|
118
|
+
..._react.shorthands.borderColor('Highlight'),
|
119
|
+
color: 'HighlightText',
|
120
|
+
forcedColorAdjust: 'none'
|
121
|
+
},
|
122
|
+
[`&:hover, &.${extraCalendarDayGridClassNames.hoverStyle}, &.${extraCalendarDayGridClassNames.pressedStyle}`]: {
|
123
|
+
color: _reacttheme.tokens.colorNeutralForeground1Static,
|
124
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundInvertedSelected,
|
125
|
+
'@media (forced-colors: active)': {
|
126
|
+
backgroundColor: 'Highlight',
|
127
|
+
color: 'HighlightText'
|
128
|
+
}
|
129
|
+
},
|
130
|
+
[`& > .${calendarDayGridClassNames.dayMarker}`]: {
|
131
|
+
'@media (forced-colors: active)': {
|
132
|
+
backgroundColor: 'Window'
|
133
|
+
}
|
134
|
+
}
|
135
|
+
}
|
136
|
+
});
|
137
|
+
const useDaySingleSelectedStyles = (0, _react.makeStyles)({
|
138
|
+
base: {
|
139
|
+
color: _reacttheme.tokens.colorNeutralForeground1Static,
|
140
|
+
[`& > .${calendarDayGridClassNames.dayMarker}`]: {
|
141
|
+
'@media (forced-colors: active)': {
|
142
|
+
backgroundColor: 'Window'
|
143
|
+
}
|
144
|
+
},
|
145
|
+
[`& > .${calendarDayGridClassNames.dayButton}`]: {
|
146
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundInvertedSelected,
|
147
|
+
borderRadius: _reacttheme.tokens.borderRadiusMedium,
|
148
|
+
..._react.shorthands.border('1px', 'solid', _reacttheme.tokens.colorBrandStroke1),
|
149
|
+
'@media (forced-colors: active)': {
|
150
|
+
backgroundColor: 'Highlight',
|
151
|
+
..._react.shorthands.borderColor('Highlight'),
|
152
|
+
color: 'HighlightText',
|
153
|
+
forcedColorAdjust: 'none'
|
154
|
+
}
|
155
|
+
}
|
156
|
+
}
|
157
|
+
});
|
158
|
+
const useWeekRowStyles = (0, _react.makeStyles)({
|
159
|
+
base: {
|
160
|
+
position: 'relative',
|
161
|
+
':focus-within': {
|
162
|
+
zIndex: 1
|
163
|
+
}
|
164
|
+
},
|
165
|
+
animation: {
|
166
|
+
animationDuration: _utils.DURATION_3,
|
167
|
+
animationFillMode: 'both',
|
168
|
+
animationTimingFunction: _utils.EASING_FUNCTION_1
|
169
|
+
},
|
170
|
+
horizontalBackward: {
|
171
|
+
animationName: [
|
172
|
+
_utils.FADE_IN,
|
173
|
+
_utils.SLIDE_RIGHT_IN20
|
174
|
+
]
|
175
|
+
},
|
176
|
+
horizontalForward: {
|
177
|
+
animationName: [
|
178
|
+
_utils.FADE_IN,
|
179
|
+
_utils.SLIDE_LEFT_IN20
|
180
|
+
]
|
181
|
+
},
|
182
|
+
verticalBackward: {
|
183
|
+
animationName: [
|
184
|
+
_utils.FADE_IN,
|
185
|
+
_utils.SLIDE_DOWN_IN20
|
186
|
+
]
|
187
|
+
},
|
188
|
+
verticalForward: {
|
189
|
+
animationName: [
|
190
|
+
_utils.FADE_IN,
|
191
|
+
_utils.SLIDE_UP_IN20
|
192
|
+
]
|
193
|
+
}
|
194
|
+
});
|
195
|
+
const useWeekDayLabelCellStyles = (0, _react.makeStyles)({
|
196
|
+
base: {
|
197
|
+
userSelect: 'none',
|
198
|
+
animationDuration: _utils.DURATION_2,
|
199
|
+
animationFillMode: 'both',
|
200
|
+
animationName: _utils.FADE_IN,
|
201
|
+
animationTimingFunction: _utils.EASING_FUNCTION_2
|
202
|
+
}
|
203
|
+
});
|
204
|
+
const useWeekNumberCellStyles = (0, _react.makeStyles)({
|
205
|
+
base: {
|
206
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
207
|
+
borderRight: `1px solid ${_reacttheme.tokens.colorNeutralStroke2}`,
|
208
|
+
boxSizing: 'border-box',
|
209
|
+
color: _reacttheme.tokens.colorNeutralForeground4,
|
210
|
+
fontSize: _reacttheme.tokens.fontSizeBase200,
|
211
|
+
fontWeight: _reacttheme.tokens.fontWeightRegular,
|
212
|
+
height: '28px',
|
213
|
+
margin: '0',
|
214
|
+
padding: '0',
|
215
|
+
width: '28px'
|
216
|
+
}
|
217
|
+
});
|
218
|
+
const useDayOutsideBoundsStyles = (0, _react.makeStyles)({
|
219
|
+
base: {
|
220
|
+
[`&, &:disabled, & button, &.${extraCalendarDayGridClassNames.hoverStyle}` + `, &.${extraCalendarDayGridClassNames.pressedStyle}`]: {
|
221
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
222
|
+
color: _reacttheme.tokens.colorNeutralForegroundDisabled,
|
223
|
+
pointerEvents: 'none'
|
224
|
+
},
|
225
|
+
'@media (forced-colors: active)': {
|
226
|
+
color: 'GrayText'
|
227
|
+
}
|
228
|
+
}
|
229
|
+
});
|
230
|
+
const useDayOutsideNavigatedMonthStyles = (0, _react.makeStyles)({
|
231
|
+
lightenDaysOutsideNavigatedMonth: {
|
232
|
+
color: _reacttheme.tokens.colorNeutralForeground4,
|
233
|
+
fontWeight: _reacttheme.tokens.fontWeightRegular,
|
234
|
+
'@media (forced-colors: active)': {
|
235
|
+
color: 'GrayText'
|
236
|
+
}
|
237
|
+
}
|
238
|
+
});
|
239
|
+
const useDayButtonStyles = (0, _react.makeStyles)({
|
240
|
+
base: {
|
241
|
+
backgroundColor: _reacttheme.tokens.colorTransparentBackground,
|
242
|
+
border: 'none',
|
243
|
+
color: 'inherit',
|
244
|
+
cursor: 'pointer',
|
245
|
+
fontSize: _reacttheme.tokens.fontSizeBase200,
|
246
|
+
fontWeight: 'inherit',
|
247
|
+
height: '24px',
|
248
|
+
lineHeight: '24px',
|
249
|
+
overflow: 'visible',
|
250
|
+
padding: '0',
|
251
|
+
width: '24px',
|
252
|
+
'&span': {
|
253
|
+
height: 'inherit',
|
254
|
+
lineHeight: 'inherit'
|
255
|
+
},
|
256
|
+
':hover': {
|
257
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundInvertedHover,
|
258
|
+
borderRadius: _reacttheme.tokens.borderRadiusMedium
|
259
|
+
},
|
260
|
+
':active': {
|
261
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackgroundInvertedPressed
|
262
|
+
}
|
263
|
+
}
|
264
|
+
});
|
265
|
+
const useDayIsTodayStyles = (0, _react.makeStyles)({
|
266
|
+
base: {
|
267
|
+
display: 'flex',
|
268
|
+
justifyContent: 'center',
|
269
|
+
alignItems: 'center',
|
270
|
+
color: _reacttheme.tokens.colorNeutralForegroundOnBrand,
|
271
|
+
fontWeight: _reacttheme.tokens.fontWeightSemibold,
|
272
|
+
[`& > .${calendarDayGridClassNames.dayMarker}`]: {
|
273
|
+
backgroundColor: _reacttheme.tokens.colorNeutralForegroundOnBrand,
|
274
|
+
'@media (forced-colors: active)': {
|
275
|
+
backgroundColor: 'Window'
|
276
|
+
}
|
277
|
+
}
|
278
|
+
}
|
279
|
+
});
|
280
|
+
const useDayTodayMarkerStyles = (0, _react.makeStyles)({
|
281
|
+
base: {
|
282
|
+
display: 'flex',
|
283
|
+
justifyContent: 'center',
|
284
|
+
alignItems: 'center',
|
285
|
+
backgroundColor: _reacttheme.tokens.colorBrandBackground,
|
286
|
+
borderRadius: '100%',
|
287
|
+
width: '20px',
|
288
|
+
height: '20px',
|
289
|
+
lineHeight: '20px',
|
290
|
+
'@media (forced-colors: active)': {
|
291
|
+
backgroundColor: 'WindowText',
|
292
|
+
..._react.shorthands.borderColor('WindowText'),
|
293
|
+
color: 'Window',
|
294
|
+
forcedColorAdjust: 'none'
|
295
|
+
}
|
296
|
+
}
|
297
|
+
});
|
298
|
+
const useFirstTransitionWeekStyles = (0, _react.makeStyles)({
|
299
|
+
base: {
|
300
|
+
height: 0,
|
301
|
+
opacity: 0,
|
302
|
+
overflow: 'hidden',
|
303
|
+
position: 'absolute',
|
304
|
+
width: 0
|
305
|
+
},
|
306
|
+
verticalForward: {
|
307
|
+
animationDuration: _utils.DURATION_3,
|
308
|
+
animationFillMode: 'both',
|
309
|
+
animationName: [
|
310
|
+
_utils.FADE_OUT,
|
311
|
+
_utils.SLIDE_UP_OUT20,
|
312
|
+
_utils.TRANSITION_ROW_DISAPPEARANCE
|
313
|
+
],
|
314
|
+
animationTimingFunction: _utils.EASING_FUNCTION_1
|
315
|
+
}
|
316
|
+
});
|
317
|
+
const useLastTransitionWeekStyles = (0, _react.makeStyles)({
|
318
|
+
base: {
|
319
|
+
height: 0,
|
320
|
+
marginTop: '-28px',
|
321
|
+
opacity: 0,
|
322
|
+
overflow: 'hidden',
|
323
|
+
position: 'absolute',
|
324
|
+
width: 0
|
325
|
+
},
|
326
|
+
verticalBackward: {
|
327
|
+
animationDuration: _utils.DURATION_3,
|
328
|
+
animationFillMode: 'both',
|
329
|
+
animationName: [
|
330
|
+
_utils.FADE_OUT,
|
331
|
+
_utils.SLIDE_DOWN_OUT20,
|
332
|
+
_utils.TRANSITION_ROW_DISAPPEARANCE
|
333
|
+
],
|
334
|
+
animationTimingFunction: _utils.EASING_FUNCTION_1
|
335
|
+
}
|
336
|
+
});
|
337
|
+
const useDayMarkerStyles = (0, _react.makeStyles)({
|
338
|
+
base: {
|
339
|
+
backgroundColor: _reacttheme.tokens.colorBrandForeground2,
|
340
|
+
borderRadius: '100%',
|
341
|
+
bottom: '1px',
|
342
|
+
height: '4px',
|
343
|
+
left: 0,
|
344
|
+
margin: 'auto',
|
345
|
+
position: 'absolute',
|
346
|
+
right: 0,
|
347
|
+
width: '4px',
|
348
|
+
'@media (forced-colors: active)': {
|
349
|
+
backgroundColor: 'WindowText',
|
350
|
+
forcedColorAdjust: 'none'
|
351
|
+
}
|
352
|
+
}
|
353
|
+
});
|
354
|
+
const useCornerBorderAndRadiusStyles = (0, _react.makeStyles)({
|
355
|
+
corners: {
|
356
|
+
[`&.${_useWeekCornerStylesstyles.weekCornersClassNames.topRightCornerDate}`]: {
|
357
|
+
borderTopRightRadius: _reacttheme.tokens.borderRadiusMedium
|
358
|
+
},
|
359
|
+
[`&.${_useWeekCornerStylesstyles.weekCornersClassNames.topLeftCornerDate}`]: {
|
360
|
+
borderTopLeftRadius: _reacttheme.tokens.borderRadiusMedium
|
361
|
+
},
|
362
|
+
[`&.${_useWeekCornerStylesstyles.weekCornersClassNames.bottomRightCornerDate}`]: {
|
363
|
+
borderBottomRightRadius: _reacttheme.tokens.borderRadiusMedium
|
364
|
+
},
|
365
|
+
[`&.${_useWeekCornerStylesstyles.weekCornersClassNames.bottomLeftCornerDate}`]: {
|
366
|
+
borderBottomLeftRadius: _reacttheme.tokens.borderRadiusMedium
|
367
|
+
}
|
368
|
+
}
|
369
|
+
});
|
370
|
+
const useCalendarDayGridStyles_unstable = (props)=>{
|
371
|
+
'use no memo';
|
372
|
+
const wrapperStyles = useWrapperStyles();
|
373
|
+
const tableStyles = useTableStyles();
|
374
|
+
const dayCellStyles = useDayCellStyles();
|
375
|
+
const daySelectedStyles = useDaySelectedStyles();
|
376
|
+
const daySingleSelectedStyles = useDaySingleSelectedStyles();
|
377
|
+
const weekRowStyles = useWeekRowStyles();
|
378
|
+
const weekDayLabelCellStyles = useWeekDayLabelCellStyles();
|
379
|
+
const weekNumberCellStyles = useWeekNumberCellStyles();
|
380
|
+
const dayOutsideBoundsStyles = useDayOutsideBoundsStyles();
|
381
|
+
const dayOutsideNavigatedMonthStyles = useDayOutsideNavigatedMonthStyles();
|
382
|
+
const dayButtonStyles = useDayButtonStyles();
|
383
|
+
const dayIsTodayStyles = useDayIsTodayStyles();
|
384
|
+
const firstTransitionWeekStyles = useFirstTransitionWeekStyles();
|
385
|
+
const lastTransitionWeekStyles = useLastTransitionWeekStyles();
|
386
|
+
const dayMarkerStyles = useDayMarkerStyles();
|
387
|
+
const cornerBorderAndRadiusStyles = useCornerBorderAndRadiusStyles();
|
388
|
+
const dayTodayMarkerStyles = useDayTodayMarkerStyles();
|
389
|
+
const { animateBackwards, animationDirection, lightenDaysOutsideNavigatedMonth, showWeekNumbers } = props;
|
390
|
+
return {
|
391
|
+
wrapper: (0, _react.mergeClasses)(calendarDayGridClassNames.wrapper, wrapperStyles.base),
|
392
|
+
table: (0, _react.mergeClasses)(calendarDayGridClassNames.table, tableStyles.base, showWeekNumbers && tableStyles.showWeekNumbers),
|
393
|
+
dayCell: (0, _react.mergeClasses)(calendarDayGridClassNames.dayCell, dayCellStyles.base, dayCellStyles.focusIndicator, cornerBorderAndRadiusStyles.corners),
|
394
|
+
daySelected: (0, _react.mergeClasses)(calendarDayGridClassNames.daySelected, daySelectedStyles.base),
|
395
|
+
daySingleSelected: (0, _react.mergeClasses)(calendarDayGridClassNames.daySingleSelected, daySingleSelectedStyles.base),
|
396
|
+
weekRow: (0, _react.mergeClasses)(calendarDayGridClassNames.weekRow, weekRowStyles.base, animateBackwards !== undefined && weekRowStyles.animation, animateBackwards !== undefined && (animationDirection === _Calendartypes.AnimationDirection.Horizontal ? animateBackwards ? weekRowStyles.horizontalBackward : weekRowStyles.horizontalForward : animateBackwards ? weekRowStyles.verticalBackward : weekRowStyles.verticalForward)),
|
397
|
+
weekDayLabelCell: (0, _react.mergeClasses)(calendarDayGridClassNames.weekDayLabelCell, weekDayLabelCellStyles.base),
|
398
|
+
weekNumberCell: (0, _react.mergeClasses)(calendarDayGridClassNames.weekNumberCell, weekNumberCellStyles.base),
|
399
|
+
dayOutsideBounds: (0, _react.mergeClasses)(calendarDayGridClassNames.dayOutsideBounds, dayOutsideBoundsStyles.base),
|
400
|
+
dayOutsideNavigatedMonth: (0, _react.mergeClasses)(calendarDayGridClassNames.dayOutsideNavigatedMonth, lightenDaysOutsideNavigatedMonth && dayOutsideNavigatedMonthStyles.lightenDaysOutsideNavigatedMonth),
|
401
|
+
dayButton: (0, _react.mergeClasses)(calendarDayGridClassNames.dayButton, dayButtonStyles.base),
|
402
|
+
dayIsToday: (0, _react.mergeClasses)(calendarDayGridClassNames.dayIsToday, dayIsTodayStyles.base),
|
403
|
+
firstTransitionWeek: (0, _react.mergeClasses)(calendarDayGridClassNames.firstTransitionWeek, firstTransitionWeekStyles.base, animateBackwards !== undefined && animationDirection !== _Calendartypes.AnimationDirection.Horizontal && !animateBackwards && firstTransitionWeekStyles.verticalForward),
|
404
|
+
lastTransitionWeek: (0, _react.mergeClasses)(calendarDayGridClassNames.lastTransitionWeek, lastTransitionWeekStyles.base, animateBackwards !== undefined && animationDirection !== _Calendartypes.AnimationDirection.Horizontal && animateBackwards && lastTransitionWeekStyles.verticalBackward),
|
405
|
+
dayMarker: (0, _react.mergeClasses)(calendarDayGridClassNames.dayMarker, dayMarkerStyles.base),
|
406
|
+
dayTodayMarker: (0, _react.mergeClasses)(calendarDayGridClassNames.dayTodayMarker, dayTodayMarkerStyles.base)
|
407
|
+
};
|
408
|
+
};
|
@@ -0,0 +1 @@
|
|
1
|
+
{"version":3,"sources":["../src/components/CalendarDayGrid/useCalendarDayGridStyles.styles.ts"],"sourcesContent":["import { tokens } from '@fluentui/react-theme';\nimport { makeStyles, mergeClasses, shorthands } from '@griffel/react';\nimport {\n DURATION_2,\n DURATION_3,\n EASING_FUNCTION_1,\n EASING_FUNCTION_2,\n FADE_IN,\n FADE_OUT,\n SLIDE_DOWN_IN20,\n SLIDE_DOWN_OUT20,\n SLIDE_LEFT_IN20,\n SLIDE_RIGHT_IN20,\n SLIDE_UP_IN20,\n SLIDE_UP_OUT20,\n TRANSITION_ROW_DISAPPEARANCE,\n} from '../../utils';\nimport { AnimationDirection } from '../Calendar/Calendar.types';\nimport { weekCornersClassNames } from './useWeekCornerStyles.styles';\nimport { createFocusOutlineStyle } from '@fluentui/react-tabster';\nimport type { SlotClassNames } from '@fluentui/react-utilities';\nimport type { CalendarDayGridStyles, CalendarDayGridStyleProps } from './CalendarDayGrid.types';\n\n/**\n * @internal\n */\nexport const calendarDayGridClassNames: SlotClassNames<CalendarDayGridStyles> = {\n wrapper: 'fui-CalendarDayGrid__wrapper',\n table: 'fui-CalendarDayGrid__table',\n dayCell: 'fui-CalendarDayGrid__dayCell',\n daySelected: 'fui-CalendarDayGrid__daySelected',\n daySingleSelected: 'fui-CalendarDayGrid__daySingleSelected',\n weekRow: 'fui-CalendarDayGrid__weekRow',\n weekDayLabelCell: 'fui-CalendarDayGrid__weekDayLabelCell',\n weekNumberCell: 'fui-CalendarDayGrid__weekNumberCell',\n dayOutsideBounds: 'fui-CalendarDayGrid__dayOutsideBounds',\n dayOutsideNavigatedMonth: 'fui-CalendarDayGrid__dayOutsideNavigatedMonth',\n dayButton: 'fui-CalendarDayGrid__dayButton',\n dayIsToday: 'fui-CalendarDayGrid__dayIsToday',\n firstTransitionWeek: 'fui-CalendarDayGrid__firstTransitionWeek',\n lastTransitionWeek: 'fui-CalendarDayGrid__lastTransitionWeek',\n dayMarker: 'fui-CalendarDayGrid__dayMarker',\n dayTodayMarker: 'fui-CalendarDayGrid__dayTodayMarker',\n};\n\n/**\n * @internal\n */\nexport const extraCalendarDayGridClassNames = {\n hoverStyle: 'fui-CalendarDayGrid__hoverStyle',\n pressedStyle: 'fui-CalendarDayGrid__pressedStyle',\n};\n\nconst useWrapperStyles = makeStyles({\n base: {\n paddingBottom: '10px',\n },\n});\n\nconst useTableStyles = makeStyles({\n base: {\n borderCollapse: 'collapse',\n borderSpacing: 0,\n fontSize: 'inherit',\n marginTop: '4px',\n paddingBottom: '10px',\n position: 'relative',\n tableLayout: 'fixed',\n textAlign: 'center',\n width: '196px',\n },\n showWeekNumbers: {\n width: '226px',\n },\n});\n\nconst useDayCellStyles = makeStyles({\n base: {\n color: tokens.colorNeutralForeground1,\n cursor: 'pointer',\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n margin: '0',\n padding: '2px',\n position: 'relative',\n '@media (forced-colors: active)': {\n backgroundColor: 'Window',\n color: 'WindowText',\n },\n\n [`&.${extraCalendarDayGridClassNames.hoverStyle}`]: {\n color: tokens.colorNeutralForeground1Static,\n backgroundColor: tokens.colorBrandBackgroundInvertedHover,\n '@media (forced-colors: active)': {\n outline: '1px solid Highlight',\n zIndex: 3,\n [`& .${calendarDayGridClassNames.dayTodayMarker}`]: {\n backgroundColor: 'Highlight',\n },\n },\n },\n\n [`&.${extraCalendarDayGridClassNames.pressedStyle}`]: {\n color: tokens.colorNeutralForeground1Static,\n backgroundColor: tokens.colorBrandBackgroundInvertedPressed,\n '@media (forced-colors: active)': {\n backgroundColor: 'Window',\n ...shorthands.borderColor('Highlight'),\n color: 'Highlight',\n },\n },\n },\n focusIndicator: createFocusOutlineStyle({\n style: {\n outlineWidth: tokens.strokeWidthThick,\n ...shorthands.borderWidth(tokens.strokeWidthThick),\n },\n }),\n});\n\nconst useDaySelectedStyles = makeStyles({\n base: {\n backgroundColor: tokens.colorBrandBackgroundInvertedSelected,\n color: tokens.colorNeutralForeground1Static,\n\n '@media (forced-colors: active)': {\n backgroundColor: 'Highlight',\n ...shorthands.borderColor('Highlight'),\n color: 'HighlightText',\n forcedColorAdjust: 'none',\n },\n\n [`&:hover, &.${extraCalendarDayGridClassNames.hoverStyle}, &.${extraCalendarDayGridClassNames.pressedStyle}`]: {\n color: tokens.colorNeutralForeground1Static,\n backgroundColor: tokens.colorBrandBackgroundInvertedSelected,\n '@media (forced-colors: active)': {\n backgroundColor: 'Highlight',\n color: 'HighlightText',\n },\n },\n\n [`& > .${calendarDayGridClassNames.dayMarker}`]: {\n '@media (forced-colors: active)': {\n backgroundColor: 'Window',\n },\n },\n },\n});\n\nconst useDaySingleSelectedStyles = makeStyles({\n base: {\n color: tokens.colorNeutralForeground1Static,\n\n [`& > .${calendarDayGridClassNames.dayMarker}`]: {\n '@media (forced-colors: active)': {\n backgroundColor: 'Window',\n },\n },\n\n [`& > .${calendarDayGridClassNames.dayButton}`]: {\n backgroundColor: tokens.colorBrandBackgroundInvertedSelected,\n borderRadius: tokens.borderRadiusMedium,\n ...shorthands.border('1px', 'solid', tokens.colorBrandStroke1),\n '@media (forced-colors: active)': {\n backgroundColor: 'Highlight',\n ...shorthands.borderColor('Highlight'),\n color: 'HighlightText',\n forcedColorAdjust: 'none',\n },\n },\n },\n});\n\nconst useWeekRowStyles = makeStyles({\n base: {\n position: 'relative',\n ':focus-within': {\n zIndex: 1,\n },\n },\n animation: {\n animationDuration: DURATION_3,\n animationFillMode: 'both',\n animationTimingFunction: EASING_FUNCTION_1,\n },\n horizontalBackward: {\n animationName: [FADE_IN, SLIDE_RIGHT_IN20],\n },\n horizontalForward: {\n animationName: [FADE_IN, SLIDE_LEFT_IN20],\n },\n verticalBackward: {\n animationName: [FADE_IN, SLIDE_DOWN_IN20],\n },\n verticalForward: {\n animationName: [FADE_IN, SLIDE_UP_IN20],\n },\n});\n\nconst useWeekDayLabelCellStyles = makeStyles({\n base: {\n userSelect: 'none',\n animationDuration: DURATION_2,\n animationFillMode: 'both',\n animationName: FADE_IN,\n animationTimingFunction: EASING_FUNCTION_2,\n },\n});\n\nconst useWeekNumberCellStyles = makeStyles({\n base: {\n backgroundColor: tokens.colorTransparentBackground,\n borderRight: `1px solid ${tokens.colorNeutralStroke2}`,\n boxSizing: 'border-box',\n color: tokens.colorNeutralForeground4,\n fontSize: tokens.fontSizeBase200,\n fontWeight: tokens.fontWeightRegular,\n height: '28px',\n margin: '0',\n padding: '0',\n width: '28px',\n },\n});\n\nconst useDayOutsideBoundsStyles = makeStyles({\n base: {\n [`&, &:disabled, & button, &.${extraCalendarDayGridClassNames.hoverStyle}` +\n `, &.${extraCalendarDayGridClassNames.pressedStyle}`]: {\n backgroundColor: tokens.colorTransparentBackground,\n color: tokens.colorNeutralForegroundDisabled,\n pointerEvents: 'none',\n },\n '@media (forced-colors: active)': {\n color: 'GrayText',\n },\n },\n});\n\nconst useDayOutsideNavigatedMonthStyles = makeStyles({\n lightenDaysOutsideNavigatedMonth: {\n color: tokens.colorNeutralForeground4,\n fontWeight: tokens.fontWeightRegular,\n\n '@media (forced-colors: active)': {\n color: 'GrayText',\n },\n },\n});\n\nconst useDayButtonStyles = makeStyles({\n base: {\n backgroundColor: tokens.colorTransparentBackground,\n border: 'none',\n color: 'inherit',\n cursor: 'pointer',\n fontSize: tokens.fontSizeBase200,\n fontWeight: 'inherit',\n height: '24px',\n lineHeight: '24px',\n overflow: 'visible',\n padding: '0',\n width: '24px',\n\n '&span': {\n height: 'inherit',\n lineHeight: 'inherit',\n },\n ':hover': {\n backgroundColor: tokens.colorBrandBackgroundInvertedHover,\n borderRadius: tokens.borderRadiusMedium,\n },\n ':active': {\n backgroundColor: tokens.colorBrandBackgroundInvertedPressed,\n },\n },\n});\n\nconst useDayIsTodayStyles = makeStyles({\n base: {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n color: tokens.colorNeutralForegroundOnBrand,\n fontWeight: tokens.fontWeightSemibold,\n\n [`& > .${calendarDayGridClassNames.dayMarker}`]: {\n backgroundColor: tokens.colorNeutralForegroundOnBrand,\n '@media (forced-colors: active)': {\n backgroundColor: 'Window',\n },\n },\n },\n});\n\nconst useDayTodayMarkerStyles = makeStyles({\n base: {\n display: 'flex',\n justifyContent: 'center',\n alignItems: 'center',\n backgroundColor: tokens.colorBrandBackground,\n borderRadius: '100%',\n width: '20px',\n height: '20px',\n lineHeight: '20px',\n '@media (forced-colors: active)': {\n backgroundColor: 'WindowText',\n ...shorthands.borderColor('WindowText'),\n color: 'Window',\n forcedColorAdjust: 'none',\n },\n },\n});\n\nconst useFirstTransitionWeekStyles = makeStyles({\n base: {\n height: 0,\n opacity: 0,\n overflow: 'hidden',\n\n position: 'absolute',\n width: 0,\n },\n verticalForward: {\n animationDuration: DURATION_3,\n animationFillMode: 'both',\n animationName: [FADE_OUT, SLIDE_UP_OUT20, TRANSITION_ROW_DISAPPEARANCE],\n animationTimingFunction: EASING_FUNCTION_1,\n },\n});\n\nconst useLastTransitionWeekStyles = makeStyles({\n base: {\n height: 0,\n marginTop: '-28px',\n opacity: 0,\n overflow: 'hidden',\n position: 'absolute',\n width: 0,\n },\n verticalBackward: {\n animationDuration: DURATION_3,\n animationFillMode: 'both',\n animationName: [FADE_OUT, SLIDE_DOWN_OUT20, TRANSITION_ROW_DISAPPEARANCE],\n animationTimingFunction: EASING_FUNCTION_1,\n },\n});\n\nconst useDayMarkerStyles = makeStyles({\n base: {\n backgroundColor: tokens.colorBrandForeground2,\n borderRadius: '100%',\n bottom: '1px',\n height: '4px',\n left: 0,\n margin: 'auto',\n\n position: 'absolute',\n right: 0,\n width: '4px',\n\n '@media (forced-colors: active)': {\n backgroundColor: 'WindowText',\n forcedColorAdjust: 'none',\n },\n },\n});\n\nconst useCornerBorderAndRadiusStyles = makeStyles({\n corners: {\n [`&.${weekCornersClassNames.topRightCornerDate}`]: {\n borderTopRightRadius: tokens.borderRadiusMedium,\n },\n [`&.${weekCornersClassNames.topLeftCornerDate}`]: {\n borderTopLeftRadius: tokens.borderRadiusMedium,\n },\n [`&.${weekCornersClassNames.bottomRightCornerDate}`]: {\n borderBottomRightRadius: tokens.borderRadiusMedium,\n },\n [`&.${weekCornersClassNames.bottomLeftCornerDate}`]: {\n borderBottomLeftRadius: tokens.borderRadiusMedium,\n },\n },\n});\n\n/**\n * @internal\n *\n * Apply styling to the CalendarDayGrid slots based on the state\n */\nexport const useCalendarDayGridStyles_unstable = (props: CalendarDayGridStyleProps): CalendarDayGridStyles => {\n 'use no memo';\n\n const wrapperStyles = useWrapperStyles();\n const tableStyles = useTableStyles();\n const dayCellStyles = useDayCellStyles();\n const daySelectedStyles = useDaySelectedStyles();\n const daySingleSelectedStyles = useDaySingleSelectedStyles();\n const weekRowStyles = useWeekRowStyles();\n const weekDayLabelCellStyles = useWeekDayLabelCellStyles();\n const weekNumberCellStyles = useWeekNumberCellStyles();\n const dayOutsideBoundsStyles = useDayOutsideBoundsStyles();\n const dayOutsideNavigatedMonthStyles = useDayOutsideNavigatedMonthStyles();\n const dayButtonStyles = useDayButtonStyles();\n const dayIsTodayStyles = useDayIsTodayStyles();\n const firstTransitionWeekStyles = useFirstTransitionWeekStyles();\n const lastTransitionWeekStyles = useLastTransitionWeekStyles();\n const dayMarkerStyles = useDayMarkerStyles();\n const cornerBorderAndRadiusStyles = useCornerBorderAndRadiusStyles();\n const dayTodayMarkerStyles = useDayTodayMarkerStyles();\n\n const { animateBackwards, animationDirection, lightenDaysOutsideNavigatedMonth, showWeekNumbers } = props;\n\n return {\n wrapper: mergeClasses(calendarDayGridClassNames.wrapper, wrapperStyles.base),\n table: mergeClasses(\n calendarDayGridClassNames.table,\n tableStyles.base,\n showWeekNumbers && tableStyles.showWeekNumbers,\n ),\n dayCell: mergeClasses(\n calendarDayGridClassNames.dayCell,\n dayCellStyles.base,\n dayCellStyles.focusIndicator,\n cornerBorderAndRadiusStyles.corners,\n ),\n daySelected: mergeClasses(calendarDayGridClassNames.daySelected, daySelectedStyles.base),\n daySingleSelected: mergeClasses(calendarDayGridClassNames.daySingleSelected, daySingleSelectedStyles.base),\n weekRow: mergeClasses(\n calendarDayGridClassNames.weekRow,\n weekRowStyles.base,\n animateBackwards !== undefined && weekRowStyles.animation,\n animateBackwards !== undefined &&\n (animationDirection === AnimationDirection.Horizontal\n ? animateBackwards\n ? weekRowStyles.horizontalBackward\n : weekRowStyles.horizontalForward\n : animateBackwards\n ? weekRowStyles.verticalBackward\n : weekRowStyles.verticalForward),\n ),\n weekDayLabelCell: mergeClasses(calendarDayGridClassNames.weekDayLabelCell, weekDayLabelCellStyles.base),\n weekNumberCell: mergeClasses(calendarDayGridClassNames.weekNumberCell, weekNumberCellStyles.base),\n dayOutsideBounds: mergeClasses(calendarDayGridClassNames.dayOutsideBounds, dayOutsideBoundsStyles.base),\n dayOutsideNavigatedMonth: mergeClasses(\n calendarDayGridClassNames.dayOutsideNavigatedMonth,\n lightenDaysOutsideNavigatedMonth && dayOutsideNavigatedMonthStyles.lightenDaysOutsideNavigatedMonth,\n ),\n dayButton: mergeClasses(calendarDayGridClassNames.dayButton, dayButtonStyles.base),\n dayIsToday: mergeClasses(calendarDayGridClassNames.dayIsToday, dayIsTodayStyles.base),\n firstTransitionWeek: mergeClasses(\n calendarDayGridClassNames.firstTransitionWeek,\n firstTransitionWeekStyles.base,\n animateBackwards !== undefined &&\n animationDirection !== AnimationDirection.Horizontal &&\n !animateBackwards &&\n firstTransitionWeekStyles.verticalForward,\n ),\n lastTransitionWeek: mergeClasses(\n calendarDayGridClassNames.lastTransitionWeek,\n lastTransitionWeekStyles.base,\n animateBackwards !== undefined &&\n animationDirection !== AnimationDirection.Horizontal &&\n animateBackwards &&\n lastTransitionWeekStyles.verticalBackward,\n ),\n dayMarker: mergeClasses(calendarDayGridClassNames.dayMarker, dayMarkerStyles.base),\n dayTodayMarker: mergeClasses(calendarDayGridClassNames.dayTodayMarker, dayTodayMarkerStyles.base),\n };\n};\n"],"names":["calendarDayGridClassNames","extraCalendarDayGridClassNames","useCalendarDayGridStyles_unstable","wrapper","table","dayCell","daySelected","daySingleSelected","weekRow","weekDayLabelCell","weekNumberCell","dayOutsideBounds","dayOutsideNavigatedMonth","dayButton","dayIsToday","firstTransitionWeek","lastTransitionWeek","dayMarker","dayTodayMarker","hoverStyle","pressedStyle","useWrapperStyles","makeStyles","base","paddingBottom","useTableStyles","borderCollapse","borderSpacing","fontSize","marginTop","position","tableLayout","textAlign","width","showWeekNumbers","useDayCellStyles","color","tokens","colorNeutralForeground1","cursor","fontSizeBase200","fontWeight","fontWeightRegular","margin","padding","backgroundColor","colorNeutralForeground1Static","colorBrandBackgroundInvertedHover","outline","zIndex","colorBrandBackgroundInvertedPressed","shorthands","borderColor","focusIndicator","createFocusOutlineStyle","style","outlineWidth","strokeWidthThick","borderWidth","useDaySelectedStyles","colorBrandBackgroundInvertedSelected","forcedColorAdjust","useDaySingleSelectedStyles","borderRadius","borderRadiusMedium","border","colorBrandStroke1","useWeekRowStyles","animation","animationDuration","DURATION_3","animationFillMode","animationTimingFunction","EASING_FUNCTION_1","horizontalBackward","animationName","FADE_IN","SLIDE_RIGHT_IN20","horizontalForward","SLIDE_LEFT_IN20","verticalBackward","SLIDE_DOWN_IN20","verticalForward","SLIDE_UP_IN20","useWeekDayLabelCellStyles","userSelect","DURATION_2","EASING_FUNCTION_2","useWeekNumberCellStyles","colorTransparentBackground","borderRight","colorNeutralStroke2","boxSizing","colorNeutralForeground4","height","useDayOutsideBoundsStyles","colorNeutralForegroundDisabled","pointerEvents","useDayOutsideNavigatedMonthStyles","lightenDaysOutsideNavigatedMonth","useDayButtonStyles","lineHeight","overflow","useDayIsTodayStyles","display","justifyContent","alignItems","colorNeutralForegroundOnBrand","fontWeightSemibold","useDayTodayMarkerStyles","colorBrandBackground","useFirstTransitionWeekStyles","opacity","FADE_OUT","SLIDE_UP_OUT20","TRANSITION_ROW_DISAPPEARANCE","useLastTransitionWeekStyles","SLIDE_DOWN_OUT20","useDayMarkerStyles","colorBrandForeground2","bottom","left","right","useCornerBorderAndRadiusStyles","corners","weekCornersClassNames","topRightCornerDate","borderTopRightRadius","topLeftCornerDate","borderTopLeftRadius","bottomRightCornerDate","borderBottomRightRadius","bottomLeftCornerDate","borderBottomLeftRadius","props","wrapperStyles","tableStyles","dayCellStyles","daySelectedStyles","daySingleSelectedStyles","weekRowStyles","weekDayLabelCellStyles","weekNumberCellStyles","dayOutsideBoundsStyles","dayOutsideNavigatedMonthStyles","dayButtonStyles","dayIsTodayStyles","firstTransitionWeekStyles","lastTransitionWeekStyles","dayMarkerStyles","cornerBorderAndRadiusStyles","dayTodayMarkerStyles","animateBackwards","animationDirection","mergeClasses","undefined","AnimationDirection","Horizontal"],"rangeMappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;","mappings":"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"}
|