@fullcalendar/theme-forma 7.0.0-beta.5
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/LICENSE.md +22 -0
- package/README.md +45 -0
- package/cjs/index.cjs +330 -0
- package/esm/index.d.ts +6 -0
- package/esm/index.js +326 -0
- package/global.js +339 -0
- package/global.min.js +6 -0
- package/package.json +55 -0
- package/palettes/blue.css +59 -0
- package/palettes/green.css +59 -0
- package/palettes/purple.css +59 -0
- package/palettes/red.css +59 -0
- package/theme.css +954 -0
- package/theme.min.css +1 -0
- package/theme.styles.js +30 -0
package/LICENSE.md
ADDED
|
@@ -0,0 +1,22 @@
|
|
|
1
|
+
MIT License
|
|
2
|
+
|
|
3
|
+
Copyright (c) 2025 Adam Shaw
|
|
4
|
+
|
|
5
|
+
Permission is hereby granted, free of charge, to any person obtaining
|
|
6
|
+
a copy of this software and associated documentation files (the
|
|
7
|
+
"Software"), to deal in the Software without restriction, including
|
|
8
|
+
without limitation the rights to use, copy, modify, merge, publish,
|
|
9
|
+
distribute, sublicense, and/or sell copies of the Software, and to
|
|
10
|
+
permit persons to whom the Software is furnished to do so, subject to
|
|
11
|
+
the following conditions:
|
|
12
|
+
|
|
13
|
+
The above copyright notice and this permission notice shall be
|
|
14
|
+
included in all copies or substantial portions of the Software.
|
|
15
|
+
|
|
16
|
+
THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
|
|
17
|
+
EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
|
|
18
|
+
MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
|
|
19
|
+
NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
|
|
20
|
+
LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
|
|
21
|
+
OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
|
|
22
|
+
WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
|
package/README.md
ADDED
|
@@ -0,0 +1,45 @@
|
|
|
1
|
+
|
|
2
|
+
# FullCalendar Forma Theme
|
|
3
|
+
|
|
4
|
+
Display an event calendar with a [Fluent UI](https://developer.microsoft.com/en-us/fluentui#/) inspired theme.
|
|
5
|
+
|
|
6
|
+
## Installation
|
|
7
|
+
|
|
8
|
+
Install FullCalendar's core, the theme, and any other plugins you plan to use:
|
|
9
|
+
|
|
10
|
+
```sh
|
|
11
|
+
npm install @fullcalendar/core @fullcalendar/theme-forma @fullcalendar/daygrid
|
|
12
|
+
```
|
|
13
|
+
|
|
14
|
+
## Usage
|
|
15
|
+
|
|
16
|
+
Instantiate a Calendar with the necessary plugin:
|
|
17
|
+
|
|
18
|
+
```js
|
|
19
|
+
import { Calendar } from '@fullcalendar/core'
|
|
20
|
+
import formaThemePlugin from '@fullcalendar/theme-forma'
|
|
21
|
+
import dayGridPlugin from '@fullcalendar/daygrid'
|
|
22
|
+
|
|
23
|
+
import '@fullcalendar/core/skeleton.css'
|
|
24
|
+
import '@fullcalendar/theme-forma/theme.css'
|
|
25
|
+
import '@fullcalendar/theme-forma/palettes/blue.css'
|
|
26
|
+
|
|
27
|
+
const calendarEl = document.getElementById('calendar')
|
|
28
|
+
const calendar = new Calendar(calendarEl, {
|
|
29
|
+
plugins: [formaThemePlugin, dayGridPlugin],
|
|
30
|
+
initialView: 'dayGridMonth',
|
|
31
|
+
events: [
|
|
32
|
+
{ title: 'Meeting', start: new Date() }
|
|
33
|
+
]
|
|
34
|
+
})
|
|
35
|
+
|
|
36
|
+
calendar.render()
|
|
37
|
+
```
|
|
38
|
+
|
|
39
|
+
## Colors
|
|
40
|
+
|
|
41
|
+
Future docs will explain how to customize this theme's colors, as well as light/dark mode.
|
|
42
|
+
|
|
43
|
+
## React/Vue/Angular Usage
|
|
44
|
+
|
|
45
|
+
Future docs will explain how to use this theme with various front-end frameworks.
|
package/cjs/index.cjs
ADDED
|
@@ -0,0 +1,330 @@
|
|
|
1
|
+
'use strict';
|
|
2
|
+
|
|
3
|
+
Object.defineProperty(exports, '__esModule', { value: true });
|
|
4
|
+
|
|
5
|
+
var preact = require('@fullcalendar/core/preact');
|
|
6
|
+
var core = require('@fullcalendar/core');
|
|
7
|
+
|
|
8
|
+
// usually 11px font / 12px line-height
|
|
9
|
+
const xxsTextClass = "fc-forma-vQz";
|
|
10
|
+
// outline
|
|
11
|
+
const outlineWidthClass = "fc-forma-0Bj";
|
|
12
|
+
const outlineWidthFocusClass = "fc-forma-uqo";
|
|
13
|
+
const outlineOffsetClass = "fc-forma-3Xj";
|
|
14
|
+
const outlineInsetClass = "fc-forma-fFh";
|
|
15
|
+
const primaryOutlineColorClass = "fc-forma-Fmy";
|
|
16
|
+
const primaryOutlineFocusClass = `${outlineWidthFocusClass} ${primaryOutlineColorClass}`;
|
|
17
|
+
// neutral buttons
|
|
18
|
+
const strongSolidPressableClass = core.joinClassNames("fc-forma-mr2", "fc-forma-n9b", "fc-forma-lrK");
|
|
19
|
+
const mutedPressableClass = `fc-forma-Wv4 fc-forma-mcn fc-forma-0sn ${primaryOutlineFocusClass}`;
|
|
20
|
+
const mutedHoverClass = "fc-forma-ShG";
|
|
21
|
+
const mutedHoverPressableClass = `${mutedHoverClass} fc-forma-nge fc-forma-rKU`;
|
|
22
|
+
const mutedHoverButtonClass = `${mutedHoverPressableClass} fc-forma-wsy fc-forma-d0j ${primaryOutlineFocusClass}`;
|
|
23
|
+
// controls
|
|
24
|
+
const unselectedPressableClass = mutedHoverPressableClass;
|
|
25
|
+
const unselectedButtonClass = `${unselectedPressableClass} fc-forma-wsy fc-forma-d0j ${primaryOutlineFocusClass}`;
|
|
26
|
+
const selectedButtonClass = `fc-forma-Wv4 fc-forma-wsy fc-forma-BST ${primaryOutlineFocusClass} fc-forma-07j`;
|
|
27
|
+
// primary
|
|
28
|
+
const primaryClass = "fc-forma-7I6 fc-forma-TSf";
|
|
29
|
+
const primaryPressableClass = `${primaryClass} fc-forma-2Qu fc-forma-lgp fc-forma-PQx`;
|
|
30
|
+
const primaryButtonClass = `${primaryPressableClass} fc-forma-wsy fc-forma-d0j ${primaryOutlineFocusClass} ${outlineOffsetClass}`;
|
|
31
|
+
// secondary
|
|
32
|
+
const secondaryButtonClass = `${mutedHoverPressableClass} fc-forma-wsy fc-forma-tfB fc-forma-cBw ${primaryOutlineFocusClass}`;
|
|
33
|
+
const secondaryButtonIconClass = "fc-forma-XUJ";
|
|
34
|
+
// event content
|
|
35
|
+
const eventMutedBgClass = "fc-forma-i6P";
|
|
36
|
+
const eventMutedPressableClass = core.joinClassNames(eventMutedBgClass, "fc-forma-SWh", "fc-forma-RHy");
|
|
37
|
+
const eventFaintBgClass = "fc-forma-lrD";
|
|
38
|
+
const eventFaintPressableClass = core.joinClassNames(eventFaintBgClass, "fc-forma-rom", "fc-forma-DUE");
|
|
39
|
+
// interactive neutral foregrounds
|
|
40
|
+
const mutedFgPressableGroupClass = "fc-forma-V1v fc-forma-sS4 fc-forma-Di9";
|
|
41
|
+
// transparent resizer for mouse
|
|
42
|
+
const blockPointerResizerClass = "fc-forma-1EY fc-forma-pps fc-forma-vs6";
|
|
43
|
+
const rowPointerResizerClass = `${blockPointerResizerClass} fc-forma-AWB fc-forma-hza`;
|
|
44
|
+
const columnPointerResizerClass = `${blockPointerResizerClass} fc-forma-MaV fc-forma-uuA`;
|
|
45
|
+
// circle resizer for touch
|
|
46
|
+
const blockTouchResizerClass = "fc-forma-1EY fc-forma-3wQ fc-forma-wsy fc-forma-lNM fc-forma-AAA fc-forma-RJG";
|
|
47
|
+
const rowTouchResizerClass = `${blockTouchResizerClass} fc-forma-ERR fc-forma-Dq8`;
|
|
48
|
+
const columnTouchResizerClass = `${blockTouchResizerClass} fc-forma-1V6 fc-forma-F99`;
|
|
49
|
+
const tallDayCellBottomClass = "fc-forma-jgW";
|
|
50
|
+
const getShortDayCellBottomClass = (data) => core.joinClassNames(!data.isNarrow && "fc-forma-toR");
|
|
51
|
+
const getSlotClass = (data) => core.joinClassNames("fc-forma-wsy fc-forma-tfB", data.isMinor && "fc-forma-TN2");
|
|
52
|
+
const dayRowCommonClasses = {
|
|
53
|
+
/* Day Row > List-Item Event
|
|
54
|
+
----------------------------------------------------------------------------------------------- */
|
|
55
|
+
listItemEventClass: (data) => core.joinClassNames("fc-forma-Ika fc-forma-7A6 fc-forma-Fvv", data.isNarrow ? "fc-forma-148" : "fc-forma-cKZ", data.isSelected
|
|
56
|
+
? "fc-forma-Wv4"
|
|
57
|
+
: data.isInteractive
|
|
58
|
+
? mutedHoverPressableClass
|
|
59
|
+
: mutedHoverClass),
|
|
60
|
+
listItemEventBeforeClass: (data) => core.joinClassNames("fc-forma-5JF fc-forma-lNM fc-forma-AAA", data.isNarrow ? "fc-forma-Jzj" : "fc-forma-Wga"),
|
|
61
|
+
listItemEventInnerClass: (data) => (data.isNarrow
|
|
62
|
+
? `fc-forma-z5u ${xxsTextClass}`
|
|
63
|
+
: "fc-forma-2rx fc-forma-a3B"),
|
|
64
|
+
listItemEventTimeClass: (data) => core.joinClassNames(data.isNarrow ? "fc-forma-a7i" : "fc-forma-C2j", "fc-forma-TZ4 fc-forma-pKG fc-forma-1Zl"),
|
|
65
|
+
listItemEventTitleClass: (data) => core.joinClassNames(data.isNarrow ? "fc-forma-oQ2" : "fc-forma-aCI", "fc-forma-DIS fc-forma-TZ4 fc-forma-pKG fc-forma-OLq"),
|
|
66
|
+
/* Day Row > Row Event
|
|
67
|
+
----------------------------------------------------------------------------------------------- */
|
|
68
|
+
rowEventClass: (data) => core.joinClassNames(data.isEnd && (data.isNarrow ? "fc-forma-9hC" : "fc-forma-3e1")),
|
|
69
|
+
rowEventInnerClass: (data) => data.isNarrow ? "fc-forma-z5u" : "fc-forma-2rx",
|
|
70
|
+
/* Day Row > More-Link
|
|
71
|
+
----------------------------------------------------------------------------------------------- */
|
|
72
|
+
rowMoreLinkClass: (data) => core.joinClassNames("fc-forma-Ika fc-forma-wsy fc-forma-Fvv", data.isNarrow
|
|
73
|
+
? "fc-forma-148 fc-forma-Baf"
|
|
74
|
+
: "fc-forma-cKZ fc-forma-d0j fc-forma-sI7", mutedHoverPressableClass),
|
|
75
|
+
rowMoreLinkInnerClass: (data) => (data.isNarrow
|
|
76
|
+
? `fc-forma-oQ2 fc-forma-z5u ${xxsTextClass}`
|
|
77
|
+
: "fc-forma-aCI fc-forma-2rx fc-forma-a3B"),
|
|
78
|
+
};
|
|
79
|
+
var index = core.createPlugin({
|
|
80
|
+
name: "@fullcalendar/theme-forma",
|
|
81
|
+
optionDefaults: {
|
|
82
|
+
className: "fc-forma-RJG fc-forma-wsy fc-forma-tfB fc-forma-Fvv fc-forma-eSM fc-forma-pKG fc-forma-R1q",
|
|
83
|
+
/* Toolbar
|
|
84
|
+
--------------------------------------------------------------------------------------------- */
|
|
85
|
+
headerToolbarClass: "fc-forma-zi1 fc-forma-tfB",
|
|
86
|
+
footerToolbarClass: "fc-forma-ku3 fc-forma-tfB",
|
|
87
|
+
toolbarClass: "fc-forma-IJJ fc-forma-dl1 fc-forma-1sP fc-forma-dNl fc-forma-XpK fc-forma-N2M fc-forma-wwb",
|
|
88
|
+
toolbarSectionClass: "fc-forma-yi0 fc-forma-dl1 fc-forma-1sP fc-forma-XpK fc-forma-wwb",
|
|
89
|
+
toolbarTitleClass: "fc-forma-2rA",
|
|
90
|
+
buttonGroupClass: "fc-forma-dl1 fc-forma-1sP fc-forma-XpK",
|
|
91
|
+
buttonClass: (data) => core.joinClassNames("fc-forma-bCs fc-forma-End fc-forma-Fvv fc-forma-dl1 fc-forma-1sP fc-forma-XpK fc-forma-9yp fc-forma-Z9U", data.isIconOnly ? "fc-forma-Nca" : "fc-forma-Apf", data.isIconOnly
|
|
92
|
+
? mutedHoverButtonClass
|
|
93
|
+
: data.inSelectGroup
|
|
94
|
+
? data.isSelected
|
|
95
|
+
? selectedButtonClass
|
|
96
|
+
: unselectedButtonClass
|
|
97
|
+
: data.isPrimary
|
|
98
|
+
? primaryButtonClass
|
|
99
|
+
: secondaryButtonClass),
|
|
100
|
+
buttons: {
|
|
101
|
+
prev: {
|
|
102
|
+
iconContent: () => chevronDown(core.joinClassNames(secondaryButtonIconClass, "fc-forma-z44 fc-forma-keW"))
|
|
103
|
+
},
|
|
104
|
+
next: {
|
|
105
|
+
iconContent: () => chevronDown(core.joinClassNames(secondaryButtonIconClass, "fc-forma-KxI fc-forma-ZW3"))
|
|
106
|
+
},
|
|
107
|
+
prevYear: {
|
|
108
|
+
iconContent: () => chevronDoubleLeft(core.joinClassNames(secondaryButtonIconClass, "fc-forma-asP"))
|
|
109
|
+
},
|
|
110
|
+
nextYear: {
|
|
111
|
+
iconContent: () => chevronDoubleLeft(core.joinClassNames(secondaryButtonIconClass, "fc-forma-jmT fc-forma-jY6"))
|
|
112
|
+
},
|
|
113
|
+
},
|
|
114
|
+
/* Abstract Event
|
|
115
|
+
--------------------------------------------------------------------------------------------- */
|
|
116
|
+
eventShortHeight: 50,
|
|
117
|
+
eventColor: "var(--fc-forma-event)",
|
|
118
|
+
eventContrastColor: "var(--fc-forma-event-contrast)",
|
|
119
|
+
eventClass: (data) => core.joinClassNames(data.isSelected
|
|
120
|
+
? core.joinClassNames(outlineWidthClass, data.isDragging && "fc-forma-1kP")
|
|
121
|
+
: outlineWidthFocusClass, primaryOutlineColorClass),
|
|
122
|
+
/* Background Event
|
|
123
|
+
--------------------------------------------------------------------------------------------- */
|
|
124
|
+
backgroundEventColor: "var(--fc-forma-background-event)",
|
|
125
|
+
backgroundEventClass: "fc-forma-AhZ",
|
|
126
|
+
backgroundEventTitleClass: (data) => core.joinClassNames("fc-forma-lMo fc-forma-L1Y", data.isNarrow
|
|
127
|
+
? `fc-forma-iS4 ${xxsTextClass}`
|
|
128
|
+
: "fc-forma-3N5 fc-forma-a3B"),
|
|
129
|
+
/* List-Item Event
|
|
130
|
+
--------------------------------------------------------------------------------------------- */
|
|
131
|
+
listItemEventClass: "fc-forma-XpK",
|
|
132
|
+
listItemEventInnerClass: "fc-forma-dl1 fc-forma-1sP fc-forma-XpK",
|
|
133
|
+
/* Block Event
|
|
134
|
+
--------------------------------------------------------------------------------------------- */
|
|
135
|
+
blockEventClass: (data) => core.joinClassNames("fc-forma-bCs fc-forma-eYX fc-forma-lNM fc-forma-vwH", data.isInteractive
|
|
136
|
+
? eventMutedPressableClass
|
|
137
|
+
: eventMutedBgClass, (data.isDragging && !data.isSelected) && "fc-forma-iTG", outlineOffsetClass),
|
|
138
|
+
blockEventTimeClass: "fc-forma-TZ4 fc-forma-pKG fc-forma-1Zl",
|
|
139
|
+
blockEventTitleClass: "fc-forma-TZ4 fc-forma-pKG fc-forma-OLq",
|
|
140
|
+
/* Row Event
|
|
141
|
+
--------------------------------------------------------------------------------------------- */
|
|
142
|
+
rowEventClass: (data) => core.joinClassNames("fc-forma-Ika fc-forma-530 fc-forma-2dx fc-forma-XpK", data.isStart && "fc-forma-riO fc-forma-kmj", data.isEnd && "fc-forma-ZNR fc-forma-9wT fc-forma-Skl"),
|
|
143
|
+
rowEventBeforeClass: (data) => core.joinClassNames(data.isStartResizable ? core.joinClassNames(data.isSelected ? rowTouchResizerClass : rowPointerResizerClass, "fc-forma-0fm") : (!data.isStart && !data.isNarrow) && core.joinClassNames(`fc-forma-Wga fc-forma-3wQ fc-forma-u78 fc-forma-8UH fc-forma-MlZ`, "fc-forma-QX7 fc-forma-vk6")),
|
|
144
|
+
rowEventAfterClass: (data) => core.joinClassNames(data.isEndResizable ? core.joinClassNames(data.isSelected ? rowTouchResizerClass : rowPointerResizerClass, "fc-forma-Tuc") : (!data.isEnd && !data.isNarrow) && core.joinClassNames(`fc-forma-KYn fc-forma-3wQ fc-forma-u78 fc-forma-lzW fc-forma-MlZ`, "fc-forma-ABq fc-forma-qIw")),
|
|
145
|
+
rowEventInnerClass: (data) => core.joinClassNames("fc-forma-dl1 fc-forma-1sP fc-forma-XpK", data.isNarrow ? xxsTextClass : "fc-forma-a3B"),
|
|
146
|
+
rowEventTimeClass: (data) => core.joinClassNames("fc-forma-1OT", data.isNarrow ? "fc-forma-a7i" : "fc-forma-C2j"),
|
|
147
|
+
rowEventTitleClass: (data) => (data.isNarrow ? "fc-forma-oQ2" : "fc-forma-aCI"),
|
|
148
|
+
/* Column Event
|
|
149
|
+
--------------------------------------------------------------------------------------------- */
|
|
150
|
+
columnEventClass: (data) => core.joinClassNames("fc-forma-riO fc-forma-ZNR fc-forma-9wT fc-forma-A3h fc-forma-c3P", data.isStart && "fc-forma-jVY fc-forma-Qex fc-forma-Z7Q", data.isEnd && "fc-forma-Ika fc-forma-K3J fc-forma-wZV fc-forma-2qh"),
|
|
151
|
+
columnEventBeforeClass: (data) => core.joinClassNames(data.isStartResizable && core.joinClassNames(data.isSelected ? columnTouchResizerClass : columnPointerResizerClass, "fc-forma-YDC")),
|
|
152
|
+
columnEventAfterClass: (data) => core.joinClassNames(data.isEndResizable && core.joinClassNames(data.isSelected ? columnTouchResizerClass : columnPointerResizerClass, "fc-forma-fJL")),
|
|
153
|
+
columnEventInnerClass: (data) => core.joinClassNames("fc-forma-dl1", data.isShort
|
|
154
|
+
? "fc-forma-1sP fc-forma-XpK fc-forma-iS4 fc-forma-NWN"
|
|
155
|
+
: core.joinClassNames("fc-forma-sgX", data.isNarrow ? "fc-forma-oQ2" : "fc-forma-aCI")),
|
|
156
|
+
columnEventTimeClass: (data) => core.joinClassNames(!data.isShort && (data.isNarrow ? "fc-forma-166" : "fc-forma-4dx"), xxsTextClass),
|
|
157
|
+
columnEventTitleClass: (data) => core.joinClassNames(!data.isShort && (data.isNarrow ? "fc-forma-2rx" : "fc-forma-Jhn"), (data.isShort || data.isNarrow) ? xxsTextClass : "fc-forma-a3B"),
|
|
158
|
+
/* More-Link
|
|
159
|
+
--------------------------------------------------------------------------------------------- */
|
|
160
|
+
moreLinkClass: `${outlineWidthFocusClass} ${primaryOutlineColorClass}`,
|
|
161
|
+
moreLinkInnerClass: "fc-forma-TZ4 fc-forma-pKG",
|
|
162
|
+
columnMoreLinkClass: `fc-forma-Ika fc-forma-wsy fc-forma-d0j fc-forma-4MR fc-forma-Fvv ${strongSolidPressableClass} fc-forma-vwH fc-forma-A3h fc-forma-c3P ${outlineOffsetClass}`,
|
|
163
|
+
columnMoreLinkInnerClass: (data) => (data.isNarrow
|
|
164
|
+
? `fc-forma-KUX ${xxsTextClass}`
|
|
165
|
+
: "fc-forma-iS4 fc-forma-a3B"),
|
|
166
|
+
/* Day Header
|
|
167
|
+
--------------------------------------------------------------------------------------------- */
|
|
168
|
+
dayHeaderAlign: (data) => data.isNarrow ? "center" : "start",
|
|
169
|
+
dayHeaderClass: (data) => core.joinClassNames("fc-forma-E9P", data.isToday && !data.level && "fc-forma-eYX", data.isDisabled && "fc-forma-zNL", data.inPopover
|
|
170
|
+
? "fc-forma-zi1 fc-forma-tfB fc-forma-zNL"
|
|
171
|
+
: core.joinClassNames(data.isMajor ? "fc-forma-wsy fc-forma-BST" :
|
|
172
|
+
!data.isNarrow && "fc-forma-wsy fc-forma-tfB")),
|
|
173
|
+
dayHeaderInnerClass: (data) => core.joinClassNames("fc-forma-3N5 fc-forma-dl1 fc-forma-sgX", data.isToday && data.level && "fc-forma-eYX", data.hasNavLink && `${mutedHoverPressableClass} ${outlineInsetClass}`),
|
|
174
|
+
dayHeaderContent: (data) => (preact.createElement(preact.Fragment, null,
|
|
175
|
+
data.isToday && (preact.createElement("div", { className: "fc-forma-1EY fc-forma-n9G fc-forma-MaV fc-forma-tb8 fc-forma-Baf fc-forma-3Lc" })),
|
|
176
|
+
data.dayNumberText && (preact.createElement("div", { className: core.joinClassNames(data.isToday && "fc-forma-DIS", data.isNarrow ? "fc-forma-3zw" : "fc-forma-9ZS") }, data.dayNumberText)),
|
|
177
|
+
data.weekdayText && (preact.createElement("div", { className: "fc-forma-a3B" }, data.weekdayText)))),
|
|
178
|
+
/* Day Cell
|
|
179
|
+
--------------------------------------------------------------------------------------------- */
|
|
180
|
+
dayCellClass: (data) => core.joinClassNames("fc-forma-wsy", data.isMajor ? "fc-forma-BST" : "fc-forma-tfB", ((data.isOther || data.isDisabled) && !data.options.businessHours) && "fc-forma-zNL"),
|
|
181
|
+
dayCellTopClass: (data) => core.joinClassNames(data.isNarrow ? "fc-forma-toR" : "fc-forma-84e", "fc-forma-dl1 fc-forma-1sP", ((data.isOther || data.isDisabled) && data.options.businessHours) && "fc-forma-cOV"),
|
|
182
|
+
dayCellTopInnerClass: (data) => core.joinClassNames("fc-forma-dl1 fc-forma-1sP fc-forma-XpK fc-forma-E9P fc-forma-TZ4", data.isNarrow
|
|
183
|
+
? `fc-forma-SEP fc-forma-oM6 ${xxsTextClass}`
|
|
184
|
+
: "fc-forma-V9v fc-forma-TFV fc-forma-9yp", data.isToday
|
|
185
|
+
? core.joinClassNames("fc-forma-AAA", data.isNarrow ? "fc-forma-qvL" : "fc-forma-Wga", data.text === data.dayNumberText
|
|
186
|
+
? (data.isNarrow ? "fc-forma-79F" : "fc-forma-ilz")
|
|
187
|
+
: (data.isNarrow ? "fc-forma-aCI" : "fc-forma-Nca"), data.hasNavLink
|
|
188
|
+
? core.joinClassNames(primaryPressableClass, outlineOffsetClass)
|
|
189
|
+
: primaryClass)
|
|
190
|
+
: core.joinClassNames("fc-forma-Skl", data.isNarrow ? "fc-forma-aCI" : "fc-forma-Nca", data.hasNavLink && mutedHoverPressableClass), data.monthText && "fc-forma-DIS"),
|
|
191
|
+
dayCellInnerClass: (data) => core.joinClassNames(data.inPopover && "fc-forma-3N5"),
|
|
192
|
+
/* Popover
|
|
193
|
+
--------------------------------------------------------------------------------------------- */
|
|
194
|
+
dayPopoverFormat: { day: "numeric", weekday: "long" },
|
|
195
|
+
popoverClass: "fc-forma-wsy fc-forma-tfB fc-forma-RJG fc-forma-tkw fc-forma-aNc fc-forma-R1q",
|
|
196
|
+
popoverCloseClass: `fc-forma-bCs fc-forma-1EY fc-forma-ZnE fc-forma-SyR fc-forma-iS4 fc-forma-Fvv ${mutedHoverPressableClass} ${outlineWidthFocusClass} ${primaryOutlineColorClass} fc-forma-Z9U`,
|
|
197
|
+
popoverCloseContent: () => dismiss(`fc-forma-XUJ ${mutedFgPressableGroupClass}`),
|
|
198
|
+
/* Lane
|
|
199
|
+
--------------------------------------------------------------------------------------------- */
|
|
200
|
+
dayLaneClass: (data) => core.joinClassNames("fc-forma-wsy", data.isMajor ? "fc-forma-BST" : "fc-forma-tfB", data.isDisabled && "fc-forma-zNL"),
|
|
201
|
+
dayLaneInnerClass: (data) => (data.isStack
|
|
202
|
+
? "fc-forma-gMS"
|
|
203
|
+
: data.isNarrow ? "fc-forma-148" : "fc-forma-Jzj fc-forma-B3G"),
|
|
204
|
+
slotLaneClass: getSlotClass,
|
|
205
|
+
/* List Day
|
|
206
|
+
--------------------------------------------------------------------------------------------- */
|
|
207
|
+
listDayClass: "fc-forma-iCr fc-forma-tfB fc-forma-dl1 fc-forma-1sP fc-forma-EF4",
|
|
208
|
+
listDayHeaderClass: (data) => core.joinClassNames("fc-forma-yi0 fc-forma-vVE fc-forma-aHX fc-forma-IJJ fc-forma-dl1 fc-forma-sgX fc-forma-EF4", data.isToday && "fc-forma-iSi fc-forma-Baf"),
|
|
209
|
+
listDayHeaderInnerClass: (data) => core.joinClassNames("fc-forma-cJ3", !data.level
|
|
210
|
+
? core.joinClassNames("fc-forma-9ZS", data.isToday && "fc-forma-DIS")
|
|
211
|
+
: "fc-forma-a3B", data.hasNavLink && "fc-forma-Eu0"),
|
|
212
|
+
listDayEventsClass: "fc-forma-1El fc-forma-2KU fc-forma-lqx fc-forma-Pms",
|
|
213
|
+
/* Single Month (in Multi-Month)
|
|
214
|
+
--------------------------------------------------------------------------------------------- */
|
|
215
|
+
singleMonthClass: "fc-forma-jD5",
|
|
216
|
+
singleMonthHeaderClass: (data) => core.joinClassNames(data.colCount > 1 ? "fc-forma-cM0" : "fc-forma-dl6", data.isSticky && "fc-forma-zi1 fc-forma-tfB fc-forma-RJG", "fc-forma-XpK"),
|
|
217
|
+
singleMonthHeaderInnerClass: (data) => core.joinClassNames("fc-forma-aCI fc-forma-Fvv fc-forma-DIS", data.hasNavLink && mutedHoverPressableClass, data.isNarrow ? "fc-forma-1Po" : "fc-forma-9ZS"),
|
|
218
|
+
/* Misc Table
|
|
219
|
+
--------------------------------------------------------------------------------------------- */
|
|
220
|
+
tableHeaderClass: (data) => data.isSticky && "fc-forma-RJG",
|
|
221
|
+
fillerClass: "fc-forma-wsy fc-forma-tfB fc-forma-lMo",
|
|
222
|
+
dayNarrowWidth: 100,
|
|
223
|
+
dayHeaderRowClass: "fc-forma-wsy fc-forma-tfB",
|
|
224
|
+
dayRowClass: "fc-forma-wsy fc-forma-tfB",
|
|
225
|
+
slotHeaderRowClass: "fc-forma-wsy fc-forma-tfB",
|
|
226
|
+
slotHeaderClass: getSlotClass,
|
|
227
|
+
/* Misc Content
|
|
228
|
+
--------------------------------------------------------------------------------------------- */
|
|
229
|
+
navLinkClass: `${outlineWidthFocusClass} ${primaryOutlineColorClass}`,
|
|
230
|
+
inlineWeekNumberClass: (data) => core.joinClassNames("fc-forma-1EY fc-forma-iD1 fc-forma-TZ4 fc-forma-kmj", data.isNarrow
|
|
231
|
+
? `fc-forma-2ik fc-forma-SEP fc-forma-KUX ${xxsTextClass}`
|
|
232
|
+
: "fc-forma-ZnE fc-forma-iS4 fc-forma-a3B", data.hasNavLink
|
|
233
|
+
? mutedPressableClass
|
|
234
|
+
: "fc-forma-Wv4"),
|
|
235
|
+
nonBusinessClass: "fc-forma-zNL",
|
|
236
|
+
highlightClass: "fc-forma-rRL",
|
|
237
|
+
nowIndicatorLineClass: "fc-forma-CH7 fc-forma-qQW fc-forma-Baf",
|
|
238
|
+
nowIndicatorDotClass: "fc-forma-aAW fc-forma-Vpk fc-forma-Baf fc-forma-63n fc-forma-AAA fc-forma-GBJ fc-forma-c3P",
|
|
239
|
+
/* Resource Day Header
|
|
240
|
+
--------------------------------------------------------------------------------------------- */
|
|
241
|
+
resourceDayHeaderClass: (data) => core.joinClassNames("fc-forma-wsy", data.isMajor ? "fc-forma-BST" : "fc-forma-tfB"),
|
|
242
|
+
resourceDayHeaderInnerClass: (data) => core.joinClassNames("fc-forma-3N5 fc-forma-dl1 fc-forma-sgX", data.isNarrow ? "fc-forma-a3B" : "fc-forma-9yp"),
|
|
243
|
+
/* Resource Data Grid
|
|
244
|
+
--------------------------------------------------------------------------------------------- */
|
|
245
|
+
resourceColumnHeaderClass: "fc-forma-wsy fc-forma-tfB fc-forma-E9P",
|
|
246
|
+
resourceColumnHeaderInnerClass: "fc-forma-3N5 fc-forma-9yp",
|
|
247
|
+
resourceColumnResizerClass: "fc-forma-1EY fc-forma-AWB fc-forma-4Tv fc-forma-dnf",
|
|
248
|
+
resourceGroupHeaderClass: "fc-forma-wsy fc-forma-tfB fc-forma-Wv4",
|
|
249
|
+
resourceGroupHeaderInnerClass: "fc-forma-3N5 fc-forma-9yp",
|
|
250
|
+
resourceCellClass: "fc-forma-wsy fc-forma-tfB",
|
|
251
|
+
resourceCellInnerClass: "fc-forma-3N5 fc-forma-9yp",
|
|
252
|
+
resourceIndentClass: "fc-forma-Wga fc-forma-p9t fc-forma-E9P",
|
|
253
|
+
resourceExpanderClass: `fc-forma-bCs fc-forma-KUX fc-forma-Fvv ${mutedHoverPressableClass} ${outlineWidthFocusClass} ${primaryOutlineColorClass}`,
|
|
254
|
+
resourceExpanderContent: (data) => chevronDown(core.joinClassNames(`fc-forma-vnf ${mutedFgPressableGroupClass}`, !data.isExpanded && "fc-forma-KxI fc-forma-ZW3")),
|
|
255
|
+
resourceHeaderRowClass: "fc-forma-wsy fc-forma-tfB",
|
|
256
|
+
resourceRowClass: "fc-forma-wsy fc-forma-tfB",
|
|
257
|
+
resourceColumnDividerClass: "fc-forma-1Wx fc-forma-tfB fc-forma-a7i fc-forma-Wv4",
|
|
258
|
+
/* Timeline Lane
|
|
259
|
+
--------------------------------------------------------------------------------------------- */
|
|
260
|
+
resourceGroupLaneClass: "fc-forma-wsy fc-forma-tfB fc-forma-Wv4",
|
|
261
|
+
resourceLaneClass: "fc-forma-wsy fc-forma-tfB",
|
|
262
|
+
resourceLaneBottomClass: (data) => data.options.eventOverlap && "fc-forma-vYi",
|
|
263
|
+
timelineBottomClass: "fc-forma-vYi",
|
|
264
|
+
},
|
|
265
|
+
views: {
|
|
266
|
+
dayGrid: Object.assign(Object.assign({}, dayRowCommonClasses), { dayHeaderDividerClass: "fc-forma-zi1 fc-forma-tfB", dayCellBottomClass: getShortDayCellBottomClass, backgroundEventInnerClass: "fc-forma-dl1 fc-forma-1sP fc-forma-LMv" }),
|
|
267
|
+
dayGridMonth: {
|
|
268
|
+
dayHeaderFormat: { weekday: "long" },
|
|
269
|
+
},
|
|
270
|
+
multiMonth: Object.assign(Object.assign({}, dayRowCommonClasses), { dayHeaderDividerClass: (data) => data.isSticky && "fc-forma-zi1 fc-forma-tfB", dayCellBottomClass: getShortDayCellBottomClass, dayHeaderInnerClass: (data) => data.isNarrow && "fc-forma-V1v", tableBodyClass: "fc-forma-wsy fc-forma-tfB fc-forma-Fvv fc-forma-pKG" }),
|
|
271
|
+
timeGrid: Object.assign(Object.assign({}, dayRowCommonClasses), { dayHeaderDividerClass: "fc-forma-zi1 fc-forma-tfB", dayCellBottomClass: tallDayCellBottomClass, dayHeaderAlign: "start",
|
|
272
|
+
/* TimeGrid > Week Number Header
|
|
273
|
+
------------------------------------------------------------------------------------------- */
|
|
274
|
+
weekNumberHeaderClass: "fc-forma-RNn fc-forma-LMv", weekNumberHeaderInnerClass: (data) => core.joinClassNames("fc-forma-gMS fc-forma-iS4 fc-forma-Fvv fc-forma-a3B", data.hasNavLink && mutedHoverPressableClass),
|
|
275
|
+
/* TimeGrid > All-Day Header
|
|
276
|
+
------------------------------------------------------------------------------------------- */
|
|
277
|
+
allDayHeaderClass: "fc-forma-XpK fc-forma-LMv", allDayHeaderInnerClass: (data) => core.joinClassNames("fc-forma-3N5 fc-forma-jm6 fc-forma-2HE", data.isNarrow ? xxsTextClass : "fc-forma-a3B"), allDayDividerClass: "fc-forma-zi1 fc-forma-tfB",
|
|
278
|
+
/* TimeGrid > Slot Header
|
|
279
|
+
------------------------------------------------------------------------------------------- */
|
|
280
|
+
slotHeaderClass: "fc-forma-LMv", slotHeaderInnerClass: (data) => core.joinClassNames("fc-forma-3N5", data.isNarrow ? xxsTextClass : "fc-forma-a3B"), slotHeaderDividerClass: "fc-forma-USt fc-forma-tfB" }),
|
|
281
|
+
list: {
|
|
282
|
+
/* List-View > List-Item Event
|
|
283
|
+
------------------------------------------------------------------------------------------- */
|
|
284
|
+
listItemEventClass: (data) => core.joinClassNames("fc-forma-bCs fc-forma-riO fc-forma-lNM fc-forma-IJJ fc-forma-Fvv", data.isInteractive
|
|
285
|
+
? eventFaintPressableClass
|
|
286
|
+
: eventFaintBgClass),
|
|
287
|
+
listItemEventInnerClass: "fc-forma-tgZ fc-forma-9yp",
|
|
288
|
+
listItemEventTimeClass: "fc-forma-yi0 fc-forma-roZ fc-forma-aHX fc-forma-TZ4 fc-forma-pKG fc-forma-IPx",
|
|
289
|
+
listItemEventTitleClass: (data) => core.joinClassNames("fc-forma-1El fc-forma-2KU fc-forma-TZ4 fc-forma-pKG fc-forma-C8a", data.event.url && "fc-forma-Ogp"),
|
|
290
|
+
/* No-Events Screen
|
|
291
|
+
------------------------------------------------------------------------------------------- */
|
|
292
|
+
noEventsClass: "fc-forma-1El fc-forma-dl1 fc-forma-sgX fc-forma-XpK fc-forma-E9P",
|
|
293
|
+
noEventsInnerClass: "fc-forma-P9h",
|
|
294
|
+
},
|
|
295
|
+
timeline: {
|
|
296
|
+
/* Timeline > Row Event
|
|
297
|
+
------------------------------------------------------------------------------------------- */
|
|
298
|
+
rowEventClass: (data) => data.isEnd && "fc-forma-9hC",
|
|
299
|
+
rowEventInnerClass: (data) => (data.options.eventOverlap
|
|
300
|
+
? "fc-forma-s0x"
|
|
301
|
+
: "fc-forma-dl6"),
|
|
302
|
+
/* Timeline > More-Link
|
|
303
|
+
------------------------------------------------------------------------------------------- */
|
|
304
|
+
rowMoreLinkClass: `fc-forma-9hC fc-forma-Ika fc-forma-Fvv fc-forma-wsy fc-forma-d0j fc-forma-4MR ${strongSolidPressableClass} fc-forma-vwH`,
|
|
305
|
+
rowMoreLinkInnerClass: "fc-forma-aCI fc-forma-s0x fc-forma-a3B",
|
|
306
|
+
/* Timeline > Slot Header
|
|
307
|
+
------------------------------------------------------------------------------------------- */
|
|
308
|
+
slotHeaderAlign: (data) => data.isTime ? "start" : "center",
|
|
309
|
+
slotHeaderClass: "fc-forma-E9P",
|
|
310
|
+
slotHeaderInnerClass: (data) => core.joinClassNames("fc-forma-3N5 fc-forma-9yp", data.hasNavLink && "fc-forma-Eu0"),
|
|
311
|
+
slotHeaderDividerClass: "fc-forma-zi1 fc-forma-tfB",
|
|
312
|
+
},
|
|
313
|
+
},
|
|
314
|
+
});
|
|
315
|
+
/* SVGs
|
|
316
|
+
------------------------------------------------------------------------------------------------- */
|
|
317
|
+
function chevronDown(className) {
|
|
318
|
+
return preact.createElement("svg", { className: className, xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor" },
|
|
319
|
+
preact.createElement("path", { d: "M15.8527 7.64582C16.0484 7.84073 16.0489 8.15731 15.854 8.35292L10.389 13.8374C10.1741 14.0531 9.82477 14.0531 9.60982 13.8374L4.14484 8.35292C3.94993 8.15731 3.95049 7.84073 4.1461 7.64582C4.34171 7.4509 4.65829 7.45147 4.85321 7.64708L9.99942 12.8117L15.1456 7.64708C15.3406 7.45147 15.6571 7.4509 15.8527 7.64582Z" }));
|
|
320
|
+
}
|
|
321
|
+
function chevronDoubleLeft(className) {
|
|
322
|
+
return preact.createElement("svg", { className: className, xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor" },
|
|
323
|
+
preact.createElement("path", { d: "M11.3544 15.8527C11.1594 16.0484 10.8429 16.0489 10.6472 15.854L5.16276 10.389C4.94705 10.1741 4.94705 9.82477 5.16276 9.60982L10.6472 4.14484C10.8429 3.94993 11.1594 3.95049 11.3544 4.1461C11.5493 4.34171 11.5487 4.65829 11.3531 4.85321L6.18851 9.99942L11.3531 15.1456C11.5487 15.3406 11.5493 15.6571 11.3544 15.8527ZM15.3534 15.8527C15.1585 16.0484 14.8419 16.0489 14.6463 15.854L9.16178 10.389C8.94607 10.1741 8.94607 9.82477 9.16178 9.60982L14.6463 4.14484C14.8419 3.94993 15.1585 3.95049 15.3534 4.1461C15.5483 4.34171 15.5477 4.65829 15.3521 4.85321L10.1875 9.99942L15.3521 15.1456C15.5477 15.3406 15.5483 15.6571 15.3534 15.8527Z" }));
|
|
324
|
+
}
|
|
325
|
+
function dismiss(className) {
|
|
326
|
+
return preact.createElement("svg", { className: className, xmlns: "http://www.w3.org/2000/svg", width: "20", height: "20", viewBox: "0 0 20 20", fill: "currentColor" },
|
|
327
|
+
preact.createElement("path", { d: "M4.08859 4.21569L4.14645 4.14645C4.32001 3.97288 4.58944 3.9536 4.78431 4.08859L4.85355 4.14645L10 9.293L15.1464 4.14645C15.32 3.97288 15.5894 3.9536 15.7843 4.08859L15.8536 4.14645C16.0271 4.32001 16.0464 4.58944 15.9114 4.78431L15.8536 4.85355L10.707 10L15.8536 15.1464C16.0271 15.32 16.0464 15.5894 15.9114 15.7843L15.8536 15.8536C15.68 16.0271 15.4106 16.0464 15.2157 15.9114L15.1464 15.8536L10 10.707L4.85355 15.8536C4.67999 16.0271 4.41056 16.0464 4.21569 15.9114L4.14645 15.8536C3.97288 15.68 3.9536 15.4106 4.08859 15.2157L4.14645 15.1464L9.293 10L4.14645 4.85355C3.97288 4.67999 3.9536 4.41056 4.08859 4.21569L4.14645 4.14645L4.08859 4.21569Z" }));
|
|
328
|
+
}
|
|
329
|
+
|
|
330
|
+
exports["default"] = index;
|