@bitrise/bitkit-v2 0.3.475-beta.3012 → 0.3.475
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/dist/components/BitkitCalendar/BitkitCalendar.d.ts +0 -12
- package/dist/components/BitkitCalendar/BitkitCalendar.js +1 -7
- package/dist/components/BitkitCalendar/BitkitCalendar.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarContent.d.ts +1 -5
- package/dist/components/BitkitCalendar/components/CalendarContent.js +43 -60
- package/dist/components/BitkitCalendar/components/CalendarContent.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarMonth.d.ts +2 -4
- package/dist/components/BitkitCalendar/components/CalendarMonth.js +5 -15
- package/dist/components/BitkitCalendar/components/CalendarMonth.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarMonthSelect.d.ts +1 -2
- package/dist/components/BitkitCalendar/components/CalendarMonthSelect.js +2 -3
- package/dist/components/BitkitCalendar/components/CalendarMonthSelect.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarNextTrigger.d.ts +1 -3
- package/dist/components/BitkitCalendar/components/CalendarNextTrigger.js +3 -3
- package/dist/components/BitkitCalendar/components/CalendarNextTrigger.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarPrevTrigger.d.ts +1 -3
- package/dist/components/BitkitCalendar/components/CalendarPrevTrigger.js +3 -3
- package/dist/components/BitkitCalendar/components/CalendarPrevTrigger.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarSelect.d.ts +0 -1
- package/dist/components/BitkitCalendar/components/CalendarSelect.js +2 -4
- package/dist/components/BitkitCalendar/components/CalendarSelect.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarYearSelect.d.ts +1 -2
- package/dist/components/BitkitCalendar/components/CalendarYearSelect.js +2 -3
- package/dist/components/BitkitCalendar/components/CalendarYearSelect.js.map +1 -1
- package/dist/components/BitkitDatePicker/BitkitDatePicker.d.ts +0 -2
- package/dist/components/BitkitDatePicker/BitkitDatePicker.js +1 -2
- package/dist/components/BitkitDatePicker/BitkitDatePicker.js.map +1 -1
- package/dist/components/BitkitMarkdown/BitkitMarkdown.js +1 -1
- package/dist/components/BitkitNoteCard/BitkitNoteCard.js +1 -1
- package/dist/components/index.d.ts +0 -6
- package/dist/main.js +7 -8
- package/dist/theme/recipes/Spinner.recipe.d.ts +4 -4
- package/dist/theme/recipes/Spinner.recipe.js +4 -4
- package/dist/theme/recipes/Spinner.recipe.js.map +1 -1
- package/dist/theme/recipes/index.d.ts +4 -4
- package/dist/theme/semantic-tokens/index.d.ts +5 -0
- package/dist/theme/semantic-tokens/semanticColors.d.ts +5 -0
- package/dist/theme/semantic-tokens/semanticColors.js +1 -0
- package/dist/theme/semantic-tokens/semanticColors.js.map +1 -1
- package/dist/theme/slot-recipes/DatePicker.recipe.d.ts +0 -15
- package/dist/theme/slot-recipes/DatePicker.recipe.js +22 -72
- package/dist/theme/slot-recipes/DatePicker.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/DatePickerSelect.recipe.d.ts +0 -82
- package/dist/theme/slot-recipes/DatePickerSelect.recipe.js +10 -28
- package/dist/theme/slot-recipes/DatePickerSelect.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Menu.recipe.js +1 -6
- package/dist/theme/slot-recipes/Menu.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/NoteCard.recipe.d.ts +1 -1
- package/dist/theme/slot-recipes/NoteCard.recipe.js +1 -1
- package/dist/theme/slot-recipes/NoteCard.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/PageFooter.recipe.d.ts +5 -3
- package/dist/theme/slot-recipes/PageFooter.recipe.js +5 -3
- package/dist/theme/slot-recipes/PageFooter.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Tag.recipe.d.ts +1 -1
- package/dist/theme/slot-recipes/index.d.ts +7 -159
- package/dist/theme/slot-recipes/index.js +0 -4
- package/dist/theme/slot-recipes/index.js.map +1 -1
- package/dist/utilities/BitkitPortalContext.js +2 -3
- package/dist/utilities/BitkitPortalContext.js.map +1 -1
- package/docs/v1-to-v2-migration-guide.md +1 -48
- package/package.json +1 -1
- package/dist/components/BitkitFilter/BitkitFilter.context.d.ts +0 -65
- package/dist/components/BitkitFilter/BitkitFilter.context.js +0 -82
- package/dist/components/BitkitFilter/BitkitFilter.context.js.map +0 -1
- package/dist/components/BitkitFilter/BitkitFilter.d.ts +0 -55
- package/dist/components/BitkitFilter/BitkitFilter.js +0 -240
- package/dist/components/BitkitFilter/BitkitFilter.js.map +0 -1
- package/dist/components/BitkitFilter/BitkitFilter.utils.d.ts +0 -18
- package/dist/components/BitkitFilter/BitkitFilter.utils.js +0 -42
- package/dist/components/BitkitFilter/BitkitFilter.utils.js.map +0 -1
- package/dist/components/BitkitFilter/BitkitFilterAdd.d.ts +0 -18
- package/dist/components/BitkitFilter/BitkitFilterAdd.js +0 -188
- package/dist/components/BitkitFilter/BitkitFilterAdd.js.map +0 -1
- package/dist/components/BitkitFilter/BitkitFilterDateRange.d.ts +0 -26
- package/dist/components/BitkitFilter/BitkitFilterDateRange.js +0 -118
- package/dist/components/BitkitFilter/BitkitFilterDateRange.js.map +0 -1
- package/dist/components/BitkitFilter/BitkitFilterSearch.d.ts +0 -23
- package/dist/components/BitkitFilter/BitkitFilterSearch.js +0 -70
- package/dist/components/BitkitFilter/BitkitFilterSearch.js.map +0 -1
- package/dist/components/BitkitFilter/BitkitFilterSelect.d.ts +0 -61
- package/dist/components/BitkitFilter/BitkitFilterSelect.js +0 -140
- package/dist/components/BitkitFilter/BitkitFilterSelect.js.map +0 -1
- package/dist/components/BitkitFilter/BitkitFilterSwitch.d.ts +0 -28
- package/dist/components/BitkitFilter/BitkitFilterSwitch.js +0 -87
- package/dist/components/BitkitFilter/BitkitFilterSwitch.js.map +0 -1
- package/dist/components/BitkitFilter/components/FilterChip.d.ts +0 -23
- package/dist/components/BitkitFilter/components/FilterChip.js +0 -64
- package/dist/components/BitkitFilter/components/FilterChip.js.map +0 -1
- package/dist/components/BitkitFilter/components/FilterField.d.ts +0 -15
- package/dist/components/BitkitFilter/components/FilterField.js +0 -58
- package/dist/components/BitkitFilter/components/FilterField.js.map +0 -1
- package/dist/components/BitkitFilter/components/FilterPanel.d.ts +0 -42
- package/dist/components/BitkitFilter/components/FilterPanel.js +0 -126
- package/dist/components/BitkitFilter/components/FilterPanel.js.map +0 -1
- package/dist/components/BitkitFilter/components/FilterSearchInput.d.ts +0 -15
- package/dist/components/BitkitFilter/components/FilterSearchInput.js +0 -41
- package/dist/components/BitkitFilter/components/FilterSearchInput.js.map +0 -1
- package/dist/components/BitkitFilter/components/FilterSelectForm.d.ts +0 -39
- package/dist/components/BitkitFilter/components/FilterSelectForm.js +0 -278
- package/dist/components/BitkitFilter/components/FilterSelectForm.js.map +0 -1
- package/dist/theme/slot-recipes/Filter.recipe.d.ts +0 -37
- package/dist/theme/slot-recipes/Filter.recipe.js +0 -636
- package/dist/theme/slot-recipes/Filter.recipe.js.map +0 -1
- package/dist/theme/slot-recipes/Listbox.recipe.d.ts +0 -22
- package/dist/theme/slot-recipes/Listbox.recipe.js +0 -97
- package/dist/theme/slot-recipes/Listbox.recipe.js.map +0 -1
|
@@ -1,636 +0,0 @@
|
|
|
1
|
-
import { rem } from "../themeUtils.js";
|
|
2
|
-
import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
|
|
3
|
-
//#region lib/theme/slot-recipes/Filter.recipe.ts
|
|
4
|
-
var chipButton = {
|
|
5
|
-
alignItems: "center",
|
|
6
|
-
alignSelf: "stretch",
|
|
7
|
-
display: "flex",
|
|
8
|
-
_hover: {
|
|
9
|
-
background: "background/hover",
|
|
10
|
-
_active: { background: "background/active" }
|
|
11
|
-
},
|
|
12
|
-
_active: { background: "background/active" },
|
|
13
|
-
_disabled: {
|
|
14
|
-
cursor: "not-allowed",
|
|
15
|
-
"& :is(span, svg)": { color: "text/disabled" },
|
|
16
|
-
_hover: { background: "transparent" }
|
|
17
|
-
}
|
|
18
|
-
};
|
|
19
|
-
var wrapperFocusRing = {
|
|
20
|
-
outlineColor: "var(--focus-ring-color)",
|
|
21
|
-
outlineOffset: "var(--focus-ring-offset)",
|
|
22
|
-
outlineStyle: "var(--focus-ring-style)",
|
|
23
|
-
outlineWidth: "var(--focus-ring-width)"
|
|
24
|
-
};
|
|
25
|
-
var filterSlotRecipe = defineSlotRecipe({
|
|
26
|
-
className: "filter",
|
|
27
|
-
slots: [
|
|
28
|
-
"root",
|
|
29
|
-
"content",
|
|
30
|
-
"filters",
|
|
31
|
-
"icon",
|
|
32
|
-
"items",
|
|
33
|
-
"searchBlock",
|
|
34
|
-
"search",
|
|
35
|
-
"searchInput",
|
|
36
|
-
"switch",
|
|
37
|
-
"switchItem",
|
|
38
|
-
"switchItemText",
|
|
39
|
-
"chip",
|
|
40
|
-
"chipTrigger",
|
|
41
|
-
"chipLabel",
|
|
42
|
-
"chipValue",
|
|
43
|
-
"chipIcon",
|
|
44
|
-
"chipChevron",
|
|
45
|
-
"chipRemove",
|
|
46
|
-
"popoverContent",
|
|
47
|
-
"addMenu",
|
|
48
|
-
"addMenuItem",
|
|
49
|
-
"addMenuLabel",
|
|
50
|
-
"addMenuIcon",
|
|
51
|
-
"addSheetBackdrop",
|
|
52
|
-
"addSheetPositioner",
|
|
53
|
-
"addSheet",
|
|
54
|
-
"addSheetItem",
|
|
55
|
-
"addSheetItemReason",
|
|
56
|
-
"calendarFooter",
|
|
57
|
-
"popoverSearch",
|
|
58
|
-
"popoverBody",
|
|
59
|
-
"popoverFooter",
|
|
60
|
-
"popoverFooterStart",
|
|
61
|
-
"checkboxList",
|
|
62
|
-
"listHelperText",
|
|
63
|
-
"loading",
|
|
64
|
-
"pattern",
|
|
65
|
-
"patternResults",
|
|
66
|
-
"patternResultsLabel",
|
|
67
|
-
"mobileBar",
|
|
68
|
-
"mobileTrigger",
|
|
69
|
-
"mobileSearch",
|
|
70
|
-
"mobileSearchInput",
|
|
71
|
-
"mobileHeader",
|
|
72
|
-
"mobileTitle",
|
|
73
|
-
"mobilePanelHeader",
|
|
74
|
-
"mobilePanelOverline",
|
|
75
|
-
"mobilePanelTitle",
|
|
76
|
-
"mobileBody",
|
|
77
|
-
"mobileFooter",
|
|
78
|
-
"mobileListCheck",
|
|
79
|
-
"mobileListCheckbox",
|
|
80
|
-
"field",
|
|
81
|
-
"fieldLabel",
|
|
82
|
-
"fieldControl",
|
|
83
|
-
"fieldTrigger",
|
|
84
|
-
"fieldIcon",
|
|
85
|
-
"fieldValue",
|
|
86
|
-
"fieldChevron",
|
|
87
|
-
"fieldRemove"
|
|
88
|
-
],
|
|
89
|
-
base: {
|
|
90
|
-
root: {
|
|
91
|
-
background: "background/primary",
|
|
92
|
-
display: "flex",
|
|
93
|
-
justifyContent: "center",
|
|
94
|
-
paddingBlock: "12",
|
|
95
|
-
paddingInline: "16"
|
|
96
|
-
},
|
|
97
|
-
content: {
|
|
98
|
-
alignItems: "flex-start",
|
|
99
|
-
display: "flex",
|
|
100
|
-
flex: "1",
|
|
101
|
-
gap: "16",
|
|
102
|
-
minWidth: 0
|
|
103
|
-
},
|
|
104
|
-
filters: {
|
|
105
|
-
alignItems: "flex-start",
|
|
106
|
-
display: "flex",
|
|
107
|
-
flex: "1",
|
|
108
|
-
gap: "12",
|
|
109
|
-
minWidth: 0,
|
|
110
|
-
paddingBlock: "4"
|
|
111
|
-
},
|
|
112
|
-
icon: {
|
|
113
|
-
color: "icon/tertiary",
|
|
114
|
-
display: "flex",
|
|
115
|
-
flexShrink: 0,
|
|
116
|
-
padding: "4"
|
|
117
|
-
},
|
|
118
|
-
items: {
|
|
119
|
-
alignItems: "center",
|
|
120
|
-
display: "flex",
|
|
121
|
-
flex: "1",
|
|
122
|
-
flexWrap: "wrap",
|
|
123
|
-
gap: "12",
|
|
124
|
-
minWidth: 0
|
|
125
|
-
},
|
|
126
|
-
searchBlock: {
|
|
127
|
-
alignSelf: "stretch",
|
|
128
|
-
borderColor: "border/minimal",
|
|
129
|
-
borderInlineStartWidth: "1",
|
|
130
|
-
display: "flex",
|
|
131
|
-
flexShrink: 0,
|
|
132
|
-
paddingInlineStart: "16"
|
|
133
|
-
},
|
|
134
|
-
search: {
|
|
135
|
-
alignItems: "center",
|
|
136
|
-
background: "background/primary",
|
|
137
|
-
borderRadius: "4",
|
|
138
|
-
color: "icon/tertiary",
|
|
139
|
-
display: "flex",
|
|
140
|
-
gap: "8",
|
|
141
|
-
height: "40",
|
|
142
|
-
paddingInline: "8",
|
|
143
|
-
width: rem(148),
|
|
144
|
-
_hover: { background: "background/secondary" },
|
|
145
|
-
"&:has(input:focus-visible)": wrapperFocusRing
|
|
146
|
-
},
|
|
147
|
-
searchInput: {
|
|
148
|
-
background: "transparent",
|
|
149
|
-
color: "input/text/inputValue",
|
|
150
|
-
flex: "1",
|
|
151
|
-
minWidth: 0,
|
|
152
|
-
outline: "none",
|
|
153
|
-
textStyle: "body/md/regular",
|
|
154
|
-
_placeholder: { color: "input/text/placeholder" },
|
|
155
|
-
"&::-webkit-search-cancel-button": { appearance: "none" }
|
|
156
|
-
},
|
|
157
|
-
switch: {
|
|
158
|
-
background: "background/secondary",
|
|
159
|
-
borderRadius: "4",
|
|
160
|
-
display: "inline-flex",
|
|
161
|
-
flexShrink: 0,
|
|
162
|
-
position: "relative"
|
|
163
|
-
},
|
|
164
|
-
switchItem: {
|
|
165
|
-
alignItems: "center",
|
|
166
|
-
borderRadius: "4",
|
|
167
|
-
color: "text/secondary",
|
|
168
|
-
cursor: "pointer",
|
|
169
|
-
display: "flex",
|
|
170
|
-
gap: "4",
|
|
171
|
-
height: "32",
|
|
172
|
-
paddingInline: "8",
|
|
173
|
-
position: "relative",
|
|
174
|
-
textStyle: "body/md/regular",
|
|
175
|
-
whiteSpace: "nowrap",
|
|
176
|
-
"& svg:not([data-own-color])": { color: "icon/tertiary" },
|
|
177
|
-
_after: {
|
|
178
|
-
background: "border/regular",
|
|
179
|
-
content: "\"\"",
|
|
180
|
-
height: "16",
|
|
181
|
-
insetInlineEnd: 0,
|
|
182
|
-
position: "absolute",
|
|
183
|
-
top: "8",
|
|
184
|
-
width: "1"
|
|
185
|
-
},
|
|
186
|
-
"&:last-of-type, &[data-state=checked], &:hover, &:has(+ [data-state=checked]), &:has(+ :hover)": { _after: { display: "none" } },
|
|
187
|
-
"&:has(input:focus-visible)": wrapperFocusRing,
|
|
188
|
-
_hover: {
|
|
189
|
-
background: "background/hover",
|
|
190
|
-
color: "text/primary",
|
|
191
|
-
"& svg:not([data-own-color])": { color: "icon/secondary" },
|
|
192
|
-
_active: { background: "background/active" }
|
|
193
|
-
},
|
|
194
|
-
_active: {
|
|
195
|
-
background: "background/active",
|
|
196
|
-
color: "text/primary"
|
|
197
|
-
},
|
|
198
|
-
_checked: {
|
|
199
|
-
background: "background/primary",
|
|
200
|
-
boxShadow: "inset 0 0 0 1px var(--colors-border\\/strong)",
|
|
201
|
-
color: "text/primary",
|
|
202
|
-
"& svg:not([data-own-color])": { color: "icon/secondary" },
|
|
203
|
-
_hover: { background: "background/primary" }
|
|
204
|
-
},
|
|
205
|
-
"&:is([data-disabled], [data-readonly])": {
|
|
206
|
-
color: "text/disabled",
|
|
207
|
-
cursor: "not-allowed",
|
|
208
|
-
"& svg": { color: "icon/disabled" },
|
|
209
|
-
_hover: {
|
|
210
|
-
background: "transparent",
|
|
211
|
-
color: "text/disabled"
|
|
212
|
-
},
|
|
213
|
-
_checked: { _hover: { background: "background/primary" } }
|
|
214
|
-
}
|
|
215
|
-
},
|
|
216
|
-
switchItemText: { paddingInline: "4" },
|
|
217
|
-
chip: {
|
|
218
|
-
alignItems: "center",
|
|
219
|
-
background: "background/primary",
|
|
220
|
-
borderColor: "border/strong",
|
|
221
|
-
borderRadius: "4",
|
|
222
|
-
borderWidth: "1",
|
|
223
|
-
display: "inline-flex",
|
|
224
|
-
height: "32",
|
|
225
|
-
maxWidth: rem(320),
|
|
226
|
-
minWidth: 0,
|
|
227
|
-
overflow: "hidden",
|
|
228
|
-
textStyle: "body/md/regular",
|
|
229
|
-
"&:has(button:is(:disabled, [aria-disabled=true]))": { borderColor: "border/disabled" },
|
|
230
|
-
"&:has([aria-expanded=true])": {
|
|
231
|
-
boxShadow: "0 0 0 0.125rem var(--focus-ring-color)",
|
|
232
|
-
"& button, & button:hover": { background: "background/primary" }
|
|
233
|
-
},
|
|
234
|
-
"& [data-scope=date-picker]:is([data-part=root], [data-part=control])": {
|
|
235
|
-
alignSelf: "stretch",
|
|
236
|
-
flex: "1",
|
|
237
|
-
minWidth: 0
|
|
238
|
-
}
|
|
239
|
-
},
|
|
240
|
-
chipTrigger: {
|
|
241
|
-
...chipButton,
|
|
242
|
-
flex: "1",
|
|
243
|
-
gap: "4",
|
|
244
|
-
minWidth: 0,
|
|
245
|
-
paddingInlineEnd: "8",
|
|
246
|
-
paddingInlineStart: "12",
|
|
247
|
-
whiteSpace: "nowrap",
|
|
248
|
-
"&:has([data-chip-icon])": { paddingInlineStart: "8" },
|
|
249
|
-
"&:is(:hover, :active) [data-chip-icon]": { color: "icon/secondary" }
|
|
250
|
-
},
|
|
251
|
-
chipLabel: {
|
|
252
|
-
color: "text/secondary",
|
|
253
|
-
flexShrink: 0
|
|
254
|
-
},
|
|
255
|
-
chipValue: {
|
|
256
|
-
color: "text/body",
|
|
257
|
-
minWidth: 0,
|
|
258
|
-
truncate: true
|
|
259
|
-
},
|
|
260
|
-
chipIcon: {
|
|
261
|
-
color: "icon/tertiary",
|
|
262
|
-
flexShrink: 0,
|
|
263
|
-
marginInlineEnd: "4"
|
|
264
|
-
},
|
|
265
|
-
chipChevron: {
|
|
266
|
-
color: "icon/primary",
|
|
267
|
-
flexShrink: 0,
|
|
268
|
-
marginInlineStart: "8"
|
|
269
|
-
},
|
|
270
|
-
chipRemove: {
|
|
271
|
-
...chipButton,
|
|
272
|
-
color: "icon/primary",
|
|
273
|
-
flexShrink: 0,
|
|
274
|
-
paddingInlineEnd: "8",
|
|
275
|
-
paddingInlineStart: "4"
|
|
276
|
-
},
|
|
277
|
-
popoverContent: { width: rem(480) },
|
|
278
|
-
addMenu: {
|
|
279
|
-
background: "background/primary",
|
|
280
|
-
borderRadius: "8",
|
|
281
|
-
boxShadow: "elevation/lg",
|
|
282
|
-
display: "flex",
|
|
283
|
-
flexDirection: "column",
|
|
284
|
-
maxHeight: "var(--available-height)",
|
|
285
|
-
outline: "none",
|
|
286
|
-
overflowY: "auto",
|
|
287
|
-
paddingBlock: "8",
|
|
288
|
-
width: rem(240),
|
|
289
|
-
zIndex: "popover"
|
|
290
|
-
},
|
|
291
|
-
addMenuItem: {
|
|
292
|
-
alignItems: "center",
|
|
293
|
-
color: "text/body",
|
|
294
|
-
cursor: "pointer",
|
|
295
|
-
display: "flex",
|
|
296
|
-
gap: "4",
|
|
297
|
-
minHeight: "40",
|
|
298
|
-
paddingBlock: "8",
|
|
299
|
-
paddingInline: "16",
|
|
300
|
-
textStyle: "body/md/regular",
|
|
301
|
-
userSelect: "none",
|
|
302
|
-
_highlighted: {
|
|
303
|
-
background: "background/hover",
|
|
304
|
-
_active: { background: "background/active" }
|
|
305
|
-
},
|
|
306
|
-
_active: { background: "background/active" },
|
|
307
|
-
_disabled: {
|
|
308
|
-
color: "text/disabled",
|
|
309
|
-
cursor: "not-allowed",
|
|
310
|
-
_highlighted: { background: "transparent" },
|
|
311
|
-
"&[data-not-applicable]": {
|
|
312
|
-
color: "text/tertiary",
|
|
313
|
-
_highlighted: { background: "background/hover" }
|
|
314
|
-
}
|
|
315
|
-
},
|
|
316
|
-
"&:not([data-highlighted]) [data-add-chevron]": { visibility: "hidden" }
|
|
317
|
-
},
|
|
318
|
-
addMenuLabel: {
|
|
319
|
-
color: "text/tertiary",
|
|
320
|
-
paddingBlock: "8",
|
|
321
|
-
paddingInline: "16",
|
|
322
|
-
textStyle: "heading/h6"
|
|
323
|
-
},
|
|
324
|
-
addMenuIcon: {
|
|
325
|
-
color: "icon/tertiary",
|
|
326
|
-
flexShrink: 0,
|
|
327
|
-
marginInlineStart: "auto"
|
|
328
|
-
},
|
|
329
|
-
addSheetBackdrop: {
|
|
330
|
-
background: "utilities/overlay-light",
|
|
331
|
-
inset: 0,
|
|
332
|
-
position: "fixed",
|
|
333
|
-
zIndex: "calc({zIndex.dialogOverlay} + var(--layer-index, 0))"
|
|
334
|
-
},
|
|
335
|
-
addSheetPositioner: {
|
|
336
|
-
alignItems: "flex-end",
|
|
337
|
-
display: "flex",
|
|
338
|
-
inset: 0,
|
|
339
|
-
justifyContent: "stretch",
|
|
340
|
-
padding: "16",
|
|
341
|
-
position: "fixed",
|
|
342
|
-
zIndex: "calc({zIndex.dialog} + var(--layer-index, 0))"
|
|
343
|
-
},
|
|
344
|
-
addSheet: {
|
|
345
|
-
background: "background/primary",
|
|
346
|
-
borderRadius: "8",
|
|
347
|
-
boxShadow: "elevation/lg",
|
|
348
|
-
display: "flex",
|
|
349
|
-
flex: "1",
|
|
350
|
-
flexDirection: "column",
|
|
351
|
-
maxHeight: "80dvh",
|
|
352
|
-
outline: "none",
|
|
353
|
-
overflowY: "auto",
|
|
354
|
-
paddingBlock: "8"
|
|
355
|
-
},
|
|
356
|
-
addSheetItem: {
|
|
357
|
-
...chipButton,
|
|
358
|
-
alignSelf: "auto",
|
|
359
|
-
color: "text/body",
|
|
360
|
-
gap: "12",
|
|
361
|
-
minHeight: "48",
|
|
362
|
-
paddingBlock: "8",
|
|
363
|
-
paddingInline: "16",
|
|
364
|
-
textAlign: "start",
|
|
365
|
-
textStyle: "body/lg/regular",
|
|
366
|
-
_disabled: {
|
|
367
|
-
color: "text/disabled",
|
|
368
|
-
cursor: "not-allowed",
|
|
369
|
-
_hover: { background: "transparent" },
|
|
370
|
-
"&[data-not-applicable]": {
|
|
371
|
-
color: "text/tertiary",
|
|
372
|
-
"& :is(span, svg)": { color: "text/tertiary" }
|
|
373
|
-
}
|
|
374
|
-
}
|
|
375
|
-
},
|
|
376
|
-
addSheetItemReason: {
|
|
377
|
-
color: "text/tertiary",
|
|
378
|
-
textStyle: "body/sm/regular"
|
|
379
|
-
},
|
|
380
|
-
calendarFooter: {
|
|
381
|
-
alignItems: "center",
|
|
382
|
-
display: "flex",
|
|
383
|
-
gap: "8",
|
|
384
|
-
marginBlockStart: "24"
|
|
385
|
-
},
|
|
386
|
-
popoverSearch: {
|
|
387
|
-
flexShrink: 0,
|
|
388
|
-
paddingBlockEnd: "8",
|
|
389
|
-
paddingBlockStart: "8",
|
|
390
|
-
paddingInline: "12"
|
|
391
|
-
},
|
|
392
|
-
popoverBody: {
|
|
393
|
-
display: "flex",
|
|
394
|
-
flexDirection: "column",
|
|
395
|
-
minHeight: 0,
|
|
396
|
-
"& > *, & [data-scope=listbox]:is([data-part=root], [data-part=content])": { minHeight: 0 },
|
|
397
|
-
"& [data-scope=listbox][data-part=root]": {
|
|
398
|
-
display: "flex",
|
|
399
|
-
flexDirection: "column"
|
|
400
|
-
}
|
|
401
|
-
},
|
|
402
|
-
popoverFooter: {
|
|
403
|
-
alignItems: "center",
|
|
404
|
-
display: "flex",
|
|
405
|
-
gap: "8",
|
|
406
|
-
paddingBlockEnd: "16",
|
|
407
|
-
paddingBlockStart: "24",
|
|
408
|
-
paddingInlineEnd: "24",
|
|
409
|
-
paddingInlineStart: "16"
|
|
410
|
-
},
|
|
411
|
-
popoverFooterStart: { flex: "1" },
|
|
412
|
-
checkboxList: {
|
|
413
|
-
maxHeight: rem(200),
|
|
414
|
-
overflowY: "auto",
|
|
415
|
-
paddingBlockEnd: "16",
|
|
416
|
-
paddingBlockStart: "8",
|
|
417
|
-
paddingInline: "20"
|
|
418
|
-
},
|
|
419
|
-
listHelperText: {
|
|
420
|
-
color: "text/secondary",
|
|
421
|
-
textStyle: "body/sm/regular"
|
|
422
|
-
},
|
|
423
|
-
loading: {
|
|
424
|
-
paddingBlock: "8",
|
|
425
|
-
paddingInline: "16"
|
|
426
|
-
},
|
|
427
|
-
pattern: {
|
|
428
|
-
display: "flex",
|
|
429
|
-
flexDirection: "column",
|
|
430
|
-
gap: "24",
|
|
431
|
-
paddingBlockStart: "8",
|
|
432
|
-
paddingInline: "16"
|
|
433
|
-
},
|
|
434
|
-
patternResults: {
|
|
435
|
-
display: "flex",
|
|
436
|
-
flexDirection: "column",
|
|
437
|
-
gap: "8",
|
|
438
|
-
maxHeight: rem(176),
|
|
439
|
-
minHeight: 0,
|
|
440
|
-
overflowY: "auto"
|
|
441
|
-
},
|
|
442
|
-
patternResultsLabel: {
|
|
443
|
-
color: "text/primary",
|
|
444
|
-
textStyle: "comp/input/label"
|
|
445
|
-
},
|
|
446
|
-
mobileBar: {
|
|
447
|
-
alignItems: "center",
|
|
448
|
-
borderBlockEndWidth: "1",
|
|
449
|
-
borderColor: "border/minimal",
|
|
450
|
-
display: "flex",
|
|
451
|
-
gap: "12",
|
|
452
|
-
justifyContent: "space-between",
|
|
453
|
-
padding: "16"
|
|
454
|
-
},
|
|
455
|
-
mobileTrigger: {
|
|
456
|
-
...chipButton,
|
|
457
|
-
alignSelf: "auto",
|
|
458
|
-
background: "background/primary",
|
|
459
|
-
borderColor: "border/strong",
|
|
460
|
-
borderRadius: "4",
|
|
461
|
-
borderWidth: "1",
|
|
462
|
-
color: "text/primary",
|
|
463
|
-
gap: "8",
|
|
464
|
-
height: "32",
|
|
465
|
-
paddingInline: "8",
|
|
466
|
-
textStyle: "comp/button/sm",
|
|
467
|
-
_icon: { color: "icon/primary" },
|
|
468
|
-
_disabled: {
|
|
469
|
-
borderColor: "border/disabled",
|
|
470
|
-
color: "text/disabled",
|
|
471
|
-
_icon: { color: "icon/disabled" }
|
|
472
|
-
}
|
|
473
|
-
},
|
|
474
|
-
mobileSearch: {
|
|
475
|
-
alignItems: "center",
|
|
476
|
-
borderBlockEndWidth: "1",
|
|
477
|
-
borderColor: "border/minimal",
|
|
478
|
-
color: "icon/tertiary",
|
|
479
|
-
display: "flex",
|
|
480
|
-
gap: "12",
|
|
481
|
-
height: rem(56),
|
|
482
|
-
paddingInline: "16",
|
|
483
|
-
"&:has(input:focus-visible)": {
|
|
484
|
-
...wrapperFocusRing,
|
|
485
|
-
outlineOffset: "calc(var(--focus-ring-width) * -1)"
|
|
486
|
-
}
|
|
487
|
-
},
|
|
488
|
-
mobileSearchInput: {
|
|
489
|
-
background: "transparent",
|
|
490
|
-
color: "input/text/inputValue",
|
|
491
|
-
flex: "1",
|
|
492
|
-
minWidth: 0,
|
|
493
|
-
outline: "none",
|
|
494
|
-
textStyle: "body/lg/regular",
|
|
495
|
-
_placeholder: { color: "input/text/placeholder" },
|
|
496
|
-
"&::-webkit-search-cancel-button": { appearance: "none" }
|
|
497
|
-
},
|
|
498
|
-
mobileHeader: {
|
|
499
|
-
alignItems: "center",
|
|
500
|
-
borderBlockEndWidth: "1",
|
|
501
|
-
borderColor: "border/minimal",
|
|
502
|
-
display: "flex",
|
|
503
|
-
flexShrink: 0,
|
|
504
|
-
gap: "12",
|
|
505
|
-
paddingBlock: "16",
|
|
506
|
-
paddingInline: {
|
|
507
|
-
base: "16",
|
|
508
|
-
tablet: "24"
|
|
509
|
-
}
|
|
510
|
-
},
|
|
511
|
-
mobileTitle: {
|
|
512
|
-
color: "text/primary",
|
|
513
|
-
flex: "1",
|
|
514
|
-
textStyle: "heading/mobile/h2"
|
|
515
|
-
},
|
|
516
|
-
mobilePanelHeader: {
|
|
517
|
-
alignItems: "center",
|
|
518
|
-
borderBlockEndWidth: "1",
|
|
519
|
-
borderColor: "border/minimal",
|
|
520
|
-
display: "flex",
|
|
521
|
-
flexShrink: 0,
|
|
522
|
-
gap: "12",
|
|
523
|
-
paddingBlock: "12",
|
|
524
|
-
paddingInline: {
|
|
525
|
-
base: "16",
|
|
526
|
-
tablet: "24"
|
|
527
|
-
}
|
|
528
|
-
},
|
|
529
|
-
mobilePanelOverline: {
|
|
530
|
-
color: "text/tertiary",
|
|
531
|
-
textStyle: "heading/h6"
|
|
532
|
-
},
|
|
533
|
-
mobilePanelTitle: {
|
|
534
|
-
color: "text/primary",
|
|
535
|
-
textStyle: "heading/mobile/h3"
|
|
536
|
-
},
|
|
537
|
-
mobileBody: {
|
|
538
|
-
display: "flex",
|
|
539
|
-
flexDirection: "column",
|
|
540
|
-
gap: "16"
|
|
541
|
-
},
|
|
542
|
-
mobileFooter: {
|
|
543
|
-
display: "flex",
|
|
544
|
-
gap: "12",
|
|
545
|
-
"& > *": { flex: "1" }
|
|
546
|
-
},
|
|
547
|
-
mobileListCheck: {
|
|
548
|
-
color: "icon/interactive",
|
|
549
|
-
display: "flex",
|
|
550
|
-
flexShrink: 0,
|
|
551
|
-
"&[data-state=unchecked]": { visibility: "hidden" }
|
|
552
|
-
},
|
|
553
|
-
mobileListCheckbox: { flexShrink: 0 },
|
|
554
|
-
field: {
|
|
555
|
-
display: "flex",
|
|
556
|
-
flexDirection: "column",
|
|
557
|
-
gap: "8"
|
|
558
|
-
},
|
|
559
|
-
fieldLabel: {
|
|
560
|
-
color: "text/primary",
|
|
561
|
-
textStyle: "comp/input/label"
|
|
562
|
-
},
|
|
563
|
-
fieldControl: {
|
|
564
|
-
background: "background/primary",
|
|
565
|
-
borderColor: "border/strong",
|
|
566
|
-
borderRadius: "4",
|
|
567
|
-
borderWidth: "1",
|
|
568
|
-
display: "flex",
|
|
569
|
-
height: "48",
|
|
570
|
-
overflow: "hidden",
|
|
571
|
-
"&:has(button:is(:disabled, [aria-disabled=true]))": { borderColor: "border/disabled" }
|
|
572
|
-
},
|
|
573
|
-
fieldTrigger: {
|
|
574
|
-
...chipButton,
|
|
575
|
-
flex: "1",
|
|
576
|
-
gap: "8",
|
|
577
|
-
minWidth: 0,
|
|
578
|
-
paddingInline: "16",
|
|
579
|
-
textAlign: "start",
|
|
580
|
-
textStyle: "body/lg/regular"
|
|
581
|
-
},
|
|
582
|
-
fieldIcon: {
|
|
583
|
-
color: "icon/secondary",
|
|
584
|
-
flexShrink: 0
|
|
585
|
-
},
|
|
586
|
-
fieldValue: {
|
|
587
|
-
color: "text/body",
|
|
588
|
-
flex: "1",
|
|
589
|
-
minWidth: 0,
|
|
590
|
-
truncate: true
|
|
591
|
-
},
|
|
592
|
-
fieldChevron: {
|
|
593
|
-
color: "icon/primary",
|
|
594
|
-
flexShrink: 0
|
|
595
|
-
},
|
|
596
|
-
fieldRemove: {
|
|
597
|
-
...chipButton,
|
|
598
|
-
color: "icon/primary",
|
|
599
|
-
flexShrink: 0,
|
|
600
|
-
justifyContent: "center",
|
|
601
|
-
width: "48"
|
|
602
|
-
}
|
|
603
|
-
},
|
|
604
|
-
variants: {
|
|
605
|
-
pageLayout: {
|
|
606
|
-
capped: { root: {
|
|
607
|
-
borderBlockEndWidth: "1",
|
|
608
|
-
borderColor: "border/regular",
|
|
609
|
-
paddingInline: {
|
|
610
|
-
base: "16",
|
|
611
|
-
tablet: "32"
|
|
612
|
-
}
|
|
613
|
-
} },
|
|
614
|
-
full: { root: {
|
|
615
|
-
borderBlockEndWidth: "1",
|
|
616
|
-
borderColor: "border/regular",
|
|
617
|
-
paddingInlineEnd: {
|
|
618
|
-
base: "16",
|
|
619
|
-
tablet: "32"
|
|
620
|
-
},
|
|
621
|
-
paddingInlineStart: {
|
|
622
|
-
base: "16",
|
|
623
|
-
tablet: "24"
|
|
624
|
-
}
|
|
625
|
-
} }
|
|
626
|
-
},
|
|
627
|
-
contentAlign: {
|
|
628
|
-
center: {},
|
|
629
|
-
start: { root: { justifyContent: "flex-start" } }
|
|
630
|
-
}
|
|
631
|
-
}
|
|
632
|
-
});
|
|
633
|
-
//#endregion
|
|
634
|
-
export { filterSlotRecipe as default };
|
|
635
|
-
|
|
636
|
-
//# sourceMappingURL=Filter.recipe.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"Filter.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Filter.recipe.ts"],"sourcesContent":["import { defineSlotRecipe, type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst chipButton: SystemStyleObject = {\n alignItems: 'center',\n alignSelf: 'stretch',\n display: 'flex',\n _hover: {\n background: 'background/hover',\n _active: {\n background: 'background/active',\n },\n },\n _active: {\n background: 'background/active',\n },\n _disabled: {\n cursor: 'not-allowed',\n '& :is(span, svg)': {\n color: 'text/disabled',\n },\n _hover: {\n background: 'transparent',\n },\n },\n};\n\n// The keyboard focus ring for a wrapper whose input has no outline of its own. Chakra's `focusRing`\n// only fires on the focused element itself, so the global ring variables are applied directly.\nconst wrapperFocusRing: SystemStyleObject = {\n outlineColor: 'var(--focus-ring-color)',\n outlineOffset: 'var(--focus-ring-offset)',\n outlineStyle: 'var(--focus-ring-style)',\n outlineWidth: 'var(--focus-ring-width)',\n};\n\nconst filterSlotRecipe = defineSlotRecipe({\n className: 'filter',\n slots: [\n 'root',\n 'content',\n 'filters',\n 'icon',\n 'items',\n 'searchBlock',\n 'search',\n 'searchInput',\n 'switch',\n 'switchItem',\n 'switchItemText',\n 'chip',\n 'chipTrigger',\n 'chipLabel',\n 'chipValue',\n 'chipIcon',\n 'chipChevron',\n 'chipRemove',\n 'popoverContent',\n 'addMenu',\n 'addMenuItem',\n 'addMenuLabel',\n 'addMenuIcon',\n 'addSheetBackdrop',\n 'addSheetPositioner',\n 'addSheet',\n 'addSheetItem',\n 'addSheetItemReason',\n 'calendarFooter',\n 'popoverSearch',\n 'popoverBody',\n 'popoverFooter',\n 'popoverFooterStart',\n 'checkboxList',\n 'listHelperText',\n 'loading',\n 'pattern',\n 'patternResults',\n 'patternResultsLabel',\n 'mobileBar',\n 'mobileTrigger',\n 'mobileSearch',\n 'mobileSearchInput',\n 'mobileHeader',\n 'mobileTitle',\n 'mobilePanelHeader',\n 'mobilePanelOverline',\n 'mobilePanelTitle',\n 'mobileBody',\n 'mobileFooter',\n 'mobileListCheck',\n 'mobileListCheckbox',\n 'field',\n 'fieldLabel',\n 'fieldControl',\n 'fieldTrigger',\n 'fieldIcon',\n 'fieldValue',\n 'fieldChevron',\n 'fieldRemove',\n ],\n base: {\n root: {\n background: 'background/primary',\n display: 'flex',\n justifyContent: 'center',\n paddingBlock: '12',\n paddingInline: '16',\n },\n content: {\n alignItems: 'flex-start',\n display: 'flex',\n flex: '1',\n gap: '16',\n minWidth: 0,\n },\n filters: {\n alignItems: 'flex-start',\n display: 'flex',\n flex: '1',\n gap: '12',\n minWidth: 0,\n paddingBlock: '4',\n },\n icon: {\n color: 'icon/tertiary',\n // Flex, so the inline svg's line box adds no extra height.\n display: 'flex',\n flexShrink: 0,\n padding: '4',\n },\n items: {\n alignItems: 'center',\n display: 'flex',\n flex: '1',\n flexWrap: 'wrap',\n gap: '12',\n minWidth: 0,\n },\n searchBlock: {\n alignSelf: 'stretch',\n borderColor: 'border/minimal',\n borderInlineStartWidth: '1',\n display: 'flex',\n flexShrink: 0,\n paddingInlineStart: '16',\n },\n search: {\n alignItems: 'center',\n background: 'background/primary',\n borderRadius: '4',\n color: 'icon/tertiary',\n display: 'flex',\n gap: '8',\n height: '40',\n paddingInline: '8',\n width: rem(148),\n _hover: {\n background: 'background/secondary',\n },\n '&:has(input:focus-visible)': wrapperFocusRing,\n },\n searchInput: {\n background: 'transparent',\n color: 'input/text/inputValue',\n flex: '1',\n minWidth: 0,\n outline: 'none',\n textStyle: 'body/md/regular',\n _placeholder: {\n color: 'input/text/placeholder',\n },\n // The clear button replaces the native cancel glyph of `type=\"search\"`.\n '&::-webkit-search-cancel-button': {\n appearance: 'none',\n },\n },\n switch: {\n background: 'background/secondary',\n borderRadius: '4',\n display: 'inline-flex',\n flexShrink: 0,\n position: 'relative',\n },\n switchItem: {\n alignItems: 'center',\n borderRadius: '4',\n color: 'text/secondary',\n cursor: 'pointer',\n display: 'flex',\n gap: '4',\n height: '32',\n paddingInline: '8',\n position: 'relative',\n textStyle: 'body/md/regular',\n whiteSpace: 'nowrap',\n // An item's own `iconColor` is left alone, except when disabled.\n '& svg:not([data-own-color])': {\n color: 'icon/tertiary',\n },\n // Divider after an unselected item, hidden next to the selected or hovered one.\n _after: {\n background: 'border/regular',\n content: '\"\"',\n height: '16',\n insetInlineEnd: 0,\n position: 'absolute',\n top: '8',\n width: '1',\n },\n '&:last-of-type, &[data-state=checked], &:hover, &:has(+ [data-state=checked]), &:has(+ :hover)': {\n _after: {\n display: 'none',\n },\n },\n '&:has(input:focus-visible)': wrapperFocusRing,\n _hover: {\n background: 'background/hover',\n color: 'text/primary',\n '& svg:not([data-own-color])': {\n color: 'icon/secondary',\n },\n _active: {\n background: 'background/active',\n },\n },\n _active: {\n background: 'background/active',\n color: 'text/primary',\n },\n _checked: {\n background: 'background/primary',\n // Inset, so the selected item is no taller than the others.\n boxShadow: 'inset 0 0 0 1px var(--colors-border\\\\/strong)',\n color: 'text/primary',\n '& svg:not([data-own-color])': {\n color: 'icon/secondary',\n },\n _hover: {\n background: 'background/primary',\n },\n },\n // Read-only while the page loads, so the selected item keeps a focus handed to it; it looks disabled.\n '&:is([data-disabled], [data-readonly])': {\n color: 'text/disabled',\n cursor: 'not-allowed',\n '& svg': {\n color: 'icon/disabled',\n },\n _hover: {\n background: 'transparent',\n color: 'text/disabled',\n },\n _checked: {\n _hover: {\n background: 'background/primary',\n },\n },\n },\n },\n switchItemText: {\n paddingInline: '4',\n },\n chip: {\n alignItems: 'center',\n background: 'background/primary',\n borderColor: 'border/strong',\n borderRadius: '4',\n borderWidth: '1',\n display: 'inline-flex',\n height: '32',\n maxWidth: rem(320),\n minWidth: 0,\n overflow: 'hidden',\n textStyle: 'body/md/regular',\n '&:has(button:is(:disabled, [aria-disabled=true]))': {\n borderColor: 'border/disabled',\n },\n // The chip's popover is open: Zag marks the trigger inside it as expanded.\n '&:has([aria-expanded=true])': {\n boxShadow: '0 0 0 0.125rem var(--focus-ring-color)',\n // Figma's selected chip stays white, even under the pointer that just opened it.\n '& button, & button:hover': {\n background: 'background/primary',\n },\n },\n // The date chip's trigger sits inside the calendar's root and control divs; they stretch like a direct child would.\n '& [data-scope=date-picker]:is([data-part=root], [data-part=control])': {\n alignSelf: 'stretch',\n flex: '1',\n minWidth: 0,\n },\n },\n chipTrigger: {\n ...chipButton,\n flex: '1',\n gap: '4',\n minWidth: 0,\n paddingInlineEnd: '8',\n paddingInlineStart: '12',\n whiteSpace: 'nowrap',\n '&:has([data-chip-icon])': {\n paddingInlineStart: '8',\n },\n '&:is(:hover, :active) [data-chip-icon]': {\n color: 'icon/secondary',\n },\n },\n chipLabel: {\n color: 'text/secondary',\n flexShrink: 0,\n },\n chipValue: {\n color: 'text/body',\n minWidth: 0,\n truncate: true,\n },\n chipIcon: {\n color: 'icon/tertiary',\n flexShrink: 0,\n marginInlineEnd: '4',\n },\n chipChevron: {\n color: 'icon/primary',\n flexShrink: 0,\n marginInlineStart: '8',\n },\n chipRemove: {\n ...chipButton,\n color: 'icon/primary',\n flexShrink: 0,\n paddingInlineEnd: '8',\n paddingInlineStart: '4',\n },\n popoverContent: {\n width: rem(480),\n },\n addMenu: {\n background: 'background/primary',\n borderRadius: '8',\n boxShadow: 'elevation/lg',\n display: 'flex',\n flexDirection: 'column',\n maxHeight: 'var(--available-height)',\n outline: 'none',\n overflowY: 'auto',\n paddingBlock: '8',\n width: rem(240),\n zIndex: 'popover',\n },\n addMenuItem: {\n alignItems: 'center',\n color: 'text/body',\n cursor: 'pointer',\n display: 'flex',\n gap: '4',\n minHeight: '40',\n paddingBlock: '8',\n paddingInline: '16',\n textStyle: 'body/md/regular',\n userSelect: 'none',\n _highlighted: {\n background: 'background/hover',\n _active: {\n background: 'background/active',\n },\n },\n _active: {\n background: 'background/active',\n },\n _disabled: {\n color: 'text/disabled',\n cursor: 'not-allowed',\n _highlighted: {\n background: 'transparent',\n },\n // Not applicable yet: `aria-disabled` but reachable, so the keyboard highlight still shows.\n '&[data-not-applicable]': {\n color: 'text/tertiary',\n _highlighted: {\n background: 'background/hover',\n },\n },\n },\n // The chevron only shows on the row under the pointer or keyboard.\n '&:not([data-highlighted]) [data-add-chevron]': {\n visibility: 'hidden',\n },\n },\n addMenuLabel: {\n color: 'text/tertiary',\n paddingBlock: '8',\n paddingInline: '16',\n textStyle: 'heading/h6',\n },\n addMenuIcon: {\n color: 'icon/tertiary',\n flexShrink: 0,\n marginInlineStart: 'auto',\n },\n addSheetBackdrop: {\n background: 'utilities/overlay-light',\n inset: 0,\n position: 'fixed',\n zIndex: 'calc({zIndex.dialogOverlay} + var(--layer-index, 0))',\n },\n addSheetPositioner: {\n alignItems: 'flex-end',\n display: 'flex',\n inset: 0,\n justifyContent: 'stretch',\n padding: '16',\n position: 'fixed',\n zIndex: 'calc({zIndex.dialog} + var(--layer-index, 0))',\n },\n addSheet: {\n background: 'background/primary',\n borderRadius: '8',\n boxShadow: 'elevation/lg',\n display: 'flex',\n flex: '1',\n flexDirection: 'column',\n maxHeight: '80dvh',\n outline: 'none',\n overflowY: 'auto',\n paddingBlock: '8',\n },\n addSheetItem: {\n ...chipButton,\n alignSelf: 'auto',\n color: 'text/body',\n gap: '12',\n minHeight: '48',\n paddingBlock: '8',\n paddingInline: '16',\n textAlign: 'start',\n textStyle: 'body/lg/regular',\n _disabled: {\n color: 'text/disabled',\n cursor: 'not-allowed',\n _hover: {\n background: 'transparent',\n },\n '&[data-not-applicable]': {\n color: 'text/tertiary',\n '& :is(span, svg)': {\n color: 'text/tertiary',\n },\n },\n },\n },\n addSheetItemReason: {\n color: 'text/tertiary',\n textStyle: 'body/sm/regular',\n },\n calendarFooter: {\n alignItems: 'center',\n display: 'flex',\n gap: '8',\n marginBlockStart: '24',\n },\n popoverSearch: {\n flexShrink: 0,\n paddingBlockEnd: '8',\n paddingBlockStart: '8',\n paddingInline: '12',\n },\n // When the popover is capped by the space available, the list (or pattern results) gives way and\n // scrolls on its own, rather than running under the footer: every part may shrink below its content.\n popoverBody: {\n display: 'flex',\n flexDirection: 'column',\n minHeight: 0,\n '& > *, & [data-scope=listbox]:is([data-part=root], [data-part=content])': {\n minHeight: 0,\n },\n '& [data-scope=listbox][data-part=root]': {\n display: 'flex',\n flexDirection: 'column',\n },\n },\n popoverFooter: {\n alignItems: 'center',\n display: 'flex',\n gap: '8',\n paddingBlockEnd: '16',\n paddingBlockStart: '24',\n paddingInlineEnd: '24',\n paddingInlineStart: '16',\n },\n popoverFooterStart: {\n flex: '1',\n },\n checkboxList: {\n maxHeight: rem(200),\n overflowY: 'auto',\n paddingBlockEnd: '16',\n paddingBlockStart: '8',\n paddingInline: '20',\n },\n listHelperText: {\n color: 'text/secondary',\n textStyle: 'body/sm/regular',\n },\n loading: {\n paddingBlock: '8',\n paddingInline: '16',\n },\n pattern: {\n display: 'flex',\n flexDirection: 'column',\n gap: '24',\n paddingBlockStart: '8',\n paddingInline: '16',\n },\n patternResults: {\n display: 'flex',\n flexDirection: 'column',\n gap: '8',\n maxHeight: rem(176),\n minHeight: 0,\n overflowY: 'auto',\n },\n patternResultsLabel: {\n color: 'text/primary',\n textStyle: 'comp/input/label',\n },\n mobileBar: {\n alignItems: 'center',\n borderBlockEndWidth: '1',\n borderColor: 'border/minimal',\n display: 'flex',\n gap: '12',\n justifyContent: 'space-between',\n padding: '16',\n },\n mobileTrigger: {\n ...chipButton,\n alignSelf: 'auto',\n background: 'background/primary',\n borderColor: 'border/strong',\n borderRadius: '4',\n borderWidth: '1',\n color: 'text/primary',\n gap: '8',\n height: '32',\n paddingInline: '8',\n textStyle: 'comp/button/sm',\n _icon: {\n color: 'icon/primary',\n },\n _disabled: {\n borderColor: 'border/disabled',\n color: 'text/disabled',\n _icon: {\n color: 'icon/disabled',\n },\n },\n },\n mobileSearch: {\n alignItems: 'center',\n borderBlockEndWidth: '1',\n borderColor: 'border/minimal',\n color: 'icon/tertiary',\n display: 'flex',\n gap: '12',\n height: rem(56),\n paddingInline: '16',\n // Drawn inside, since the row runs edge to edge.\n '&:has(input:focus-visible)': {\n ...wrapperFocusRing,\n outlineOffset: 'calc(var(--focus-ring-width) * -1)',\n },\n },\n mobileSearchInput: {\n background: 'transparent',\n color: 'input/text/inputValue',\n flex: '1',\n minWidth: 0,\n outline: 'none',\n textStyle: 'body/lg/regular',\n _placeholder: {\n color: 'input/text/placeholder',\n },\n '&::-webkit-search-cancel-button': {\n appearance: 'none',\n },\n },\n mobileHeader: {\n alignItems: 'center',\n borderBlockEndWidth: '1',\n borderColor: 'border/minimal',\n display: 'flex',\n flexShrink: 0,\n gap: '12',\n // Matches the docked drawer's body and footer inset.\n paddingBlock: '16',\n paddingInline: { base: '16', tablet: '24' },\n },\n mobileTitle: {\n color: 'text/primary',\n flex: '1',\n textStyle: 'heading/mobile/h2',\n },\n mobilePanelHeader: {\n alignItems: 'center',\n borderBlockEndWidth: '1',\n borderColor: 'border/minimal',\n display: 'flex',\n flexShrink: 0,\n gap: '12',\n paddingBlock: '12',\n // Matches the docked drawer's footer inset.\n paddingInline: { base: '16', tablet: '24' },\n },\n mobilePanelOverline: {\n color: 'text/tertiary',\n textStyle: 'heading/h6',\n },\n mobilePanelTitle: {\n color: 'text/primary',\n textStyle: 'heading/mobile/h3',\n },\n // The docked drawer pads the body and footer itself.\n mobileBody: {\n display: 'flex',\n flexDirection: 'column',\n gap: '16',\n },\n mobileFooter: {\n display: 'flex',\n gap: '12',\n '& > *': {\n flex: '1',\n },\n },\n // Drawn in front of the label on mobile, with its column kept on unselected rows so the labels line up.\n mobileListCheck: {\n color: 'icon/interactive',\n display: 'flex',\n flexShrink: 0,\n '&[data-state=unchecked]': {\n visibility: 'hidden',\n },\n },\n mobileListCheckbox: {\n flexShrink: 0,\n },\n field: {\n display: 'flex',\n flexDirection: 'column',\n gap: '8',\n },\n fieldLabel: {\n color: 'text/primary',\n textStyle: 'comp/input/label',\n },\n fieldControl: {\n background: 'background/primary',\n borderColor: 'border/strong',\n borderRadius: '4',\n borderWidth: '1',\n display: 'flex',\n height: '48',\n overflow: 'hidden',\n '&:has(button:is(:disabled, [aria-disabled=true]))': {\n borderColor: 'border/disabled',\n },\n },\n fieldTrigger: {\n ...chipButton,\n flex: '1',\n gap: '8',\n minWidth: 0,\n paddingInline: '16',\n textAlign: 'start',\n textStyle: 'body/lg/regular',\n },\n fieldIcon: {\n color: 'icon/secondary',\n flexShrink: 0,\n },\n fieldValue: {\n color: 'text/body',\n flex: '1',\n minWidth: 0,\n truncate: true,\n },\n fieldChevron: {\n color: 'icon/primary',\n flexShrink: 0,\n },\n fieldRemove: {\n ...chipButton,\n color: 'icon/primary',\n flexShrink: 0,\n justifyContent: 'center',\n width: '48',\n },\n },\n variants: {\n // Under a page header: a bottom border and the page's inline padding. `capped` is the centred\n // column, `full` the full-width one, which starts at 24 like the default `BitkitPageHeader`.\n pageLayout: {\n capped: {\n root: {\n borderBlockEndWidth: '1',\n borderColor: 'border/regular',\n paddingInline: { base: '16', tablet: '32' },\n },\n },\n full: {\n root: {\n borderBlockEndWidth: '1',\n borderColor: 'border/regular',\n paddingInlineEnd: { base: '16', tablet: '32' },\n paddingInlineStart: { base: '16', tablet: '24' },\n },\n },\n },\n contentAlign: {\n center: {},\n start: {\n root: {\n justifyContent: 'flex-start',\n },\n },\n },\n },\n});\n\nexport default filterSlotRecipe;\n"],"mappings":";;;AAIA,IAAM,aAAgC;CACpC,YAAY;CACZ,WAAW;CACX,SAAS;CACT,QAAQ;EACN,YAAY;EACZ,SAAS,EACP,YAAY,oBACd;CACF;CACA,SAAS,EACP,YAAY,oBACd;CACA,WAAW;EACT,QAAQ;EACR,oBAAoB,EAClB,OAAO,gBACT;EACA,QAAQ,EACN,YAAY,cACd;CACF;AACF;AAIA,IAAM,mBAAsC;CAC1C,cAAc;CACd,eAAe;CACf,cAAc;CACd,cAAc;AAChB;AAEA,IAAM,mBAAmB,iBAAiB;CACxC,WAAW;CACX,OAAO;EACL;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;EACA;CACF;CACA,MAAM;EACJ,MAAM;GACJ,YAAY;GACZ,SAAS;GACT,gBAAgB;GAChB,cAAc;GACd,eAAe;EACjB;EACA,SAAS;GACP,YAAY;GACZ,SAAS;GACT,MAAM;GACN,KAAK;GACL,UAAU;EACZ;EACA,SAAS;GACP,YAAY;GACZ,SAAS;GACT,MAAM;GACN,KAAK;GACL,UAAU;GACV,cAAc;EAChB;EACA,MAAM;GACJ,OAAO;GAEP,SAAS;GACT,YAAY;GACZ,SAAS;EACX;EACA,OAAO;GACL,YAAY;GACZ,SAAS;GACT,MAAM;GACN,UAAU;GACV,KAAK;GACL,UAAU;EACZ;EACA,aAAa;GACX,WAAW;GACX,aAAa;GACb,wBAAwB;GACxB,SAAS;GACT,YAAY;GACZ,oBAAoB;EACtB;EACA,QAAQ;GACN,YAAY;GACZ,YAAY;GACZ,cAAc;GACd,OAAO;GACP,SAAS;GACT,KAAK;GACL,QAAQ;GACR,eAAe;GACf,OAAO,IAAI,GAAG;GACd,QAAQ,EACN,YAAY,uBACd;GACA,8BA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W;GACX,SAAS;GACT,WAAW;GACX,cAAc;EAChB;EACA,cAAc;GACZ,GAAG;GACH,WAAW;GACX,OAAO;GACP,KAAK;GACL,WAAW;GACX,cAAc;GACd,eAAe;GACf,WAAW;GACX,WAAW;GACX,WAAW;IACT,OAAO;IACP,QAAQ;IACR,QAAQ,EACN,YAAY,cACd;IACA,0BAA0B;KACxB,OAAO;KACP,oBAAoB,EAClB,OAAO,gBACT;IACF;GACF;EACF;EACA,oBAAoB;GAClB,OAAO;GACP,WAAW;EACb;EACA,gBAAgB;GACd,YAAY;GACZ,SAAS;GACT,KAAK;GACL,kBAAkB;EACpB;EACA,eAAe;GACb,YAAY;GACZ,iBAAiB;GACjB,mBAAmB;GACnB,eAAe;EACjB;EAGA,aAAa;GACX,SAAS;GACT,eAAe;GACf,WAAW;GACX,2EAA2E,EACzE,WAAW,EACb;GACA,0CAA0C;IACxC,SAAS;IACT,eAAe;GACjB;EACF;EACA,eAAe;GACb,YAAY;GACZ,SAAS;GACT,KAAK;GACL,iBAAiB;GACjB,mBAAmB;GACnB,kBAAkB;GAClB,oBAAoB;EACtB;EACA,oBAAoB,EAClB,MAAM,IACR;EACA,cAAc;GACZ,WAAW,IAAI,GAAG;GAClB,WAAW;GACX,iBAAiB;GACjB,mBAAmB;GACnB,eAAe;EACjB;EACA,gBAAgB;GACd,OAAO;GACP,WAAW;EACb;EACA,SAAS;GACP,cAAc;GACd,eAAe;EACjB;EACA,SAAS;GACP,SAAS;GACT,eAAe;GACf,KAAK;GACL,mBAAmB;GACnB,eAAe;EACjB;EACA,gBAAgB;GACd,SAAS;GACT,eAAe;GACf,KAAK;GACL,WAAW,IAAI,GAAG;GAClB,WAAW;GACX,WAAW;EACb;EACA,qBAAqB;GACnB,OAAO;GACP,WAAW;EACb;EACA,WAAW;GACT,YAAY;GACZ,qBAAqB;GACrB,aAAa;GACb,SAAS;GACT,KAAK;GACL,gBAAgB;GAChB,SAAS;EACX;EACA,eAAe;GACb,GAAG;GACH,WAAW;GACX,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,OAAO;GACP,KAAK;GACL,QAAQ;GACR,eAAe;GACf,WAAW;GACX,OAAO,EACL,OAAO,eACT;GACA,WAAW;IACT,aAAa;IACb,OAAO;IACP,OAAO,EACL,OAAO,gBACT;GACF;EACF;EACA,cAAc;GACZ,YAAY;GACZ,qBAAqB;GACrB,aAAa;GACb,OAAO;GACP,SAAS;GACT,KAAK;GACL,QAAQ,IAAI,EAAE;GACd,eAAe;GAEf,8BAA8B;IAC5B,GAAG;IACH,eAAe;GACjB;EACF;EACA,mBAAmB;GACjB,YAAY;GACZ,OAAO;GACP,MAAM;GACN,UAAU;GACV,SAAS;GACT,WAAW;GACX,cAAc,EACZ,OAAO,yBACT;GACA,mCAAmC,EACjC,YAAY,OACd;EACF;EACA,cAAc;GACZ,YAAY;GACZ,qBAAqB;GACrB,aAAa;GACb,SAAS;GACT,YAAY;GACZ,KAAK;GAEL,cAAc;GACd,eAAe;IAAE,MAAM;IAAM,QAAQ;GAAK;EAC5C;EACA,aAAa;GACX,OAAO;GACP,MAAM;GACN,WAAW;EACb;EACA,mBAAmB;GACjB,YAAY;GACZ,qBAAqB;GACrB,aAAa;GACb,SAAS;GACT,YAAY;GACZ,KAAK;GACL,cAAc;GAEd,eAAe;IAAE,MAAM;IAAM,QAAQ;GAAK;EAC5C;EACA,qBAAqB;GACnB,OAAO;GACP,WAAW;EACb;EACA,kBAAkB;GAChB,OAAO;GACP,WAAW;EACb;EAEA,YAAY;GACV,SAAS;GACT,eAAe;GACf,KAAK;EACP;EACA,cAAc;GACZ,SAAS;GACT,KAAK;GACL,SAAS,EACP,MAAM,IACR;EACF;EAEA,iBAAiB;GACf,OAAO;GACP,SAAS;GACT,YAAY;GACZ,2BAA2B,EACzB,YAAY,SACd;EACF;EACA,oBAAoB,EAClB,YAAY,EACd;EACA,OAAO;GACL,SAAS;GACT,eAAe;GACf,KAAK;EACP;EACA,YAAY;GACV,OAAO;GACP,WAAW;EACb;EACA,cAAc;GACZ,YAAY;GACZ,aAAa;GACb,cAAc;GACd,aAAa;GACb,SAAS;GACT,QAAQ;GACR,UAAU;GACV,qDAAqD,EACnD,aAAa,kBACf;EACF;EACA,cAAc;GACZ,GAAG;GACH,MAAM;GACN,KAAK;GACL,UAAU;GACV,eAAe;GACf,WAAW;GACX,WAAW;EACb;EACA,WAAW;GACT,OAAO;GACP,YAAY;EACd;EACA,YAAY;GACV,OAAO;GACP,MAAM;GACN,UAAU;GACV,UAAU;EACZ;EACA,cAAc;GACZ,OAAO;GACP,YAAY;EACd;EACA,aAAa;GACX,GAAG;GACH,OAAO;GACP,YAAY;GACZ,gBAAgB;GAChB,OAAO;EACT;CACF;CACA,UAAU;EAGR,YAAY;GACV,QAAQ,EACN,MAAM;IACJ,qBAAqB;IACrB,aAAa;IACb,eAAe;KAAE,MAAM;KAAM,QAAQ;IAAK;GAC5C,EACF;GACA,MAAM,EACJ,MAAM;IACJ,qBAAqB;IACrB,aAAa;IACb,kBAAkB;KAAE,MAAM;KAAM,QAAQ;IAAK;IAC7C,oBAAoB;KAAE,MAAM;KAAM,QAAQ;IAAK;GACjD,EACF;EACF;EACA,cAAc;GACZ,QAAQ,CAAC;GACT,OAAO,EACL,MAAM,EACJ,gBAAgB,aAClB,EACF;EACF;CACF;AACF,CAAC"}
|