@bitrise/bitkit-v2 0.3.480-beta.3052 → 0.3.481-beta.3055
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 +12 -0
- package/dist/components/BitkitCalendar/BitkitCalendar.js +7 -1
- package/dist/components/BitkitCalendar/BitkitCalendar.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarContent.d.ts +5 -1
- package/dist/components/BitkitCalendar/components/CalendarContent.js +60 -43
- package/dist/components/BitkitCalendar/components/CalendarContent.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarMonth.d.ts +4 -2
- package/dist/components/BitkitCalendar/components/CalendarMonth.js +15 -5
- package/dist/components/BitkitCalendar/components/CalendarMonth.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarMonthSelect.d.ts +2 -1
- package/dist/components/BitkitCalendar/components/CalendarMonthSelect.js +3 -2
- package/dist/components/BitkitCalendar/components/CalendarMonthSelect.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarNextTrigger.d.ts +3 -1
- 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 +3 -1
- 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 +1 -0
- package/dist/components/BitkitCalendar/components/CalendarSelect.js +5 -3
- package/dist/components/BitkitCalendar/components/CalendarSelect.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarTrigger.js +1 -0
- package/dist/components/BitkitCalendar/components/CalendarTrigger.js.map +1 -1
- package/dist/components/BitkitCalendar/components/CalendarYearSelect.d.ts +2 -1
- package/dist/components/BitkitCalendar/components/CalendarYearSelect.js +3 -2
- package/dist/components/BitkitCalendar/components/CalendarYearSelect.js.map +1 -1
- package/dist/components/BitkitDatePicker/BitkitDatePicker.d.ts +2 -0
- package/dist/components/BitkitDatePicker/BitkitDatePicker.js +2 -1
- package/dist/components/BitkitDatePicker/BitkitDatePicker.js.map +1 -1
- package/dist/components/BitkitFilter/BitkitFilter.context.d.ts +65 -0
- package/dist/components/BitkitFilter/BitkitFilter.context.js +82 -0
- package/dist/components/BitkitFilter/BitkitFilter.context.js.map +1 -0
- package/dist/components/BitkitFilter/BitkitFilter.d.ts +55 -0
- package/dist/components/BitkitFilter/BitkitFilter.js +247 -0
- package/dist/components/BitkitFilter/BitkitFilter.js.map +1 -0
- package/dist/components/BitkitFilter/BitkitFilter.utils.d.ts +18 -0
- package/dist/components/BitkitFilter/BitkitFilter.utils.js +42 -0
- package/dist/components/BitkitFilter/BitkitFilter.utils.js.map +1 -0
- package/dist/components/BitkitFilter/BitkitFilterAdd.d.ts +18 -0
- package/dist/components/BitkitFilter/BitkitFilterAdd.js +200 -0
- package/dist/components/BitkitFilter/BitkitFilterAdd.js.map +1 -0
- package/dist/components/BitkitFilter/BitkitFilterDateRange.d.ts +26 -0
- package/dist/components/BitkitFilter/BitkitFilterDateRange.js +118 -0
- package/dist/components/BitkitFilter/BitkitFilterDateRange.js.map +1 -0
- package/dist/components/BitkitFilter/BitkitFilterSearch.d.ts +23 -0
- package/dist/components/BitkitFilter/BitkitFilterSearch.js +72 -0
- package/dist/components/BitkitFilter/BitkitFilterSearch.js.map +1 -0
- package/dist/components/BitkitFilter/BitkitFilterSelect.d.ts +61 -0
- package/dist/components/BitkitFilter/BitkitFilterSelect.js +149 -0
- package/dist/components/BitkitFilter/BitkitFilterSelect.js.map +1 -0
- package/dist/components/BitkitFilter/BitkitFilterSwitch.d.ts +28 -0
- package/dist/components/BitkitFilter/BitkitFilterSwitch.js +87 -0
- package/dist/components/BitkitFilter/BitkitFilterSwitch.js.map +1 -0
- package/dist/components/BitkitFilter/components/FilterChip.d.ts +23 -0
- package/dist/components/BitkitFilter/components/FilterChip.js +66 -0
- package/dist/components/BitkitFilter/components/FilterChip.js.map +1 -0
- package/dist/components/BitkitFilter/components/FilterField.d.ts +15 -0
- package/dist/components/BitkitFilter/components/FilterField.js +60 -0
- package/dist/components/BitkitFilter/components/FilterField.js.map +1 -0
- package/dist/components/BitkitFilter/components/FilterPanel.d.ts +42 -0
- package/dist/components/BitkitFilter/components/FilterPanel.js +126 -0
- package/dist/components/BitkitFilter/components/FilterPanel.js.map +1 -0
- package/dist/components/BitkitFilter/components/FilterSearchInput.d.ts +15 -0
- package/dist/components/BitkitFilter/components/FilterSearchInput.js +41 -0
- package/dist/components/BitkitFilter/components/FilterSearchInput.js.map +1 -0
- package/dist/components/BitkitFilter/components/FilterSelectForm.d.ts +45 -0
- package/dist/components/BitkitFilter/components/FilterSelectForm.js +324 -0
- package/dist/components/BitkitFilter/components/FilterSelectForm.js.map +1 -0
- package/dist/components/BitkitLabelTooltip/BitkitLabelTooltip.d.ts +4 -3
- package/dist/components/BitkitLabelTooltip/BitkitLabelTooltip.js +3 -2
- package/dist/components/BitkitLabelTooltip/BitkitLabelTooltip.js.map +1 -1
- package/dist/components/BitkitMarkdown/BitkitMarkdown.js +1 -1
- package/dist/components/BitkitNoteCard/BitkitNoteCard.js +1 -1
- package/dist/components/BitkitPageSidebar/BitkitPageSidebar.js +1 -1
- package/dist/components/index.d.ts +6 -1
- package/dist/main.js +8 -9
- package/dist/theme/recipes/index.d.ts +525 -0
- package/dist/theme/recipes/index.js +1 -3
- package/dist/theme/recipes/index.js.map +1 -1
- package/dist/theme/slot-recipes/DatePicker.recipe.d.ts +15 -0
- package/dist/theme/slot-recipes/DatePicker.recipe.js +72 -22
- package/dist/theme/slot-recipes/DatePicker.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/DatePickerSelect.recipe.d.ts +85 -0
- package/dist/theme/slot-recipes/DatePickerSelect.recipe.js +35 -10
- package/dist/theme/slot-recipes/DatePickerSelect.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Filter.recipe.d.ts +37 -0
- package/dist/theme/slot-recipes/Filter.recipe.js +649 -0
- package/dist/theme/slot-recipes/Filter.recipe.js.map +1 -0
- package/dist/theme/slot-recipes/Listbox.recipe.d.ts +22 -0
- package/dist/theme/slot-recipes/Listbox.recipe.js +92 -0
- package/dist/theme/slot-recipes/Listbox.recipe.js.map +1 -0
- package/dist/theme/slot-recipes/Menu.recipe.js +6 -1
- package/dist/theme/slot-recipes/Menu.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/SegmentGroup.recipe.d.ts +7 -5
- package/dist/theme/slot-recipes/SegmentGroup.recipe.js +7 -6
- package/dist/theme/slot-recipes/SegmentGroup.recipe.js.map +1 -1
- package/dist/theme/slot-recipes/Tag.recipe.d.ts +1 -1
- package/dist/theme/slot-recipes/index.d.ts +165 -7
- package/dist/theme/slot-recipes/index.js +4 -2
- package/dist/theme/slot-recipes/index.js.map +1 -1
- package/dist/theme/themeUtils.d.ts +0 -6
- package/dist/theme/themeUtils.js +1 -7
- package/dist/theme/themeUtils.js.map +1 -1
- package/dist/utilities/BitkitPortalContext.js +3 -2
- package/dist/utilities/BitkitPortalContext.js.map +1 -1
- package/docs/v1-to-v2-migration-guide.md +48 -1
- package/package.json +1 -1
- package/dist/components/BitkitUIHeader/BitkitUIHeader.d.ts +0 -37
- package/dist/components/BitkitUIHeader/BitkitUIHeader.js +0 -112
- package/dist/components/BitkitUIHeader/BitkitUIHeader.js.map +0 -1
- package/dist/components/BitkitUIHeader/BitriseLogo.d.ts +0 -10
- package/dist/components/BitkitUIHeader/BitriseLogo.js +0 -86
- package/dist/components/BitkitUIHeader/BitriseLogo.js.map +0 -1
- package/dist/components/BitkitUIHeader/UIHeaderAccount.d.ts +0 -23
- package/dist/components/BitkitUIHeader/UIHeaderAccount.js +0 -40
- package/dist/components/BitkitUIHeader/UIHeaderAccount.js.map +0 -1
- package/dist/components/BitkitUIHeader/UIHeaderButton.d.ts +0 -32
- package/dist/components/BitkitUIHeader/UIHeaderButton.js +0 -41
- package/dist/components/BitkitUIHeader/UIHeaderButton.js.map +0 -1
- package/dist/components/BitkitUIHeader/UIHeaderContext.d.ts +0 -13
- package/dist/components/BitkitUIHeader/UIHeaderContext.js +0 -11
- package/dist/components/BitkitUIHeader/UIHeaderContext.js.map +0 -1
- package/dist/components/BitkitUIHeader/UIHeaderControl.d.ts +0 -65
- package/dist/components/BitkitUIHeader/UIHeaderControl.js +0 -71
- package/dist/components/BitkitUIHeader/UIHeaderControl.js.map +0 -1
- package/dist/components/BitkitUIHeader/UIHeaderNavButton.d.ts +0 -20
- package/dist/components/BitkitUIHeader/UIHeaderNavButton.js +0 -46
- package/dist/components/BitkitUIHeader/UIHeaderNavButton.js.map +0 -1
- package/dist/components/BitkitUIHeader/UIHeaderSearch.d.ts +0 -32
- package/dist/components/BitkitUIHeader/UIHeaderSearch.js +0 -116
- package/dist/components/BitkitUIHeader/UIHeaderSearch.js.map +0 -1
- package/dist/components/BitkitUIHeader/uiHeaderPart.d.ts +0 -9
- package/dist/components/BitkitUIHeader/uiHeaderPart.js +0 -13
- package/dist/components/BitkitUIHeader/uiHeaderPart.js.map +0 -1
- package/dist/theme/recipes/UIHeaderButton.recipe.js +0 -103
- package/dist/theme/recipes/UIHeaderButton.recipe.js.map +0 -1
- package/dist/theme/slot-recipes/UIHeader.recipe.d.ts +0 -4
- package/dist/theme/slot-recipes/UIHeader.recipe.js +0 -238
- package/dist/theme/slot-recipes/UIHeader.recipe.js.map +0 -1
|
@@ -1,238 +0,0 @@
|
|
|
1
|
-
import { colorVar, rem } from "../themeUtils.js";
|
|
2
|
-
import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
|
|
3
|
-
var uiHeaderHeight = rem(48);
|
|
4
|
-
var SEARCH_FIELD_WIDTH = rem(240);
|
|
5
|
-
var SEARCH_FIELD_TINT = colorVar("color/white/20");
|
|
6
|
-
var controlBase = {
|
|
7
|
-
background: "sys/ui/header/control/bg",
|
|
8
|
-
_hover: {
|
|
9
|
-
background: "sys/ui/header/control/bg-hover",
|
|
10
|
-
_active: { background: "sys/ui/header/control/bg-active" }
|
|
11
|
-
},
|
|
12
|
-
_active: { background: "sys/ui/header/control/bg-active" },
|
|
13
|
-
_selected: {
|
|
14
|
-
background: "sys/ui/header/control/bg-selected",
|
|
15
|
-
_hover: {
|
|
16
|
-
background: "sys/ui/header/control/bg-selected-hover",
|
|
17
|
-
_active: { background: "sys/ui/header/control/bg-active" }
|
|
18
|
-
},
|
|
19
|
-
_active: { background: "sys/ui/header/control/bg-active" }
|
|
20
|
-
},
|
|
21
|
-
alignItems: "center",
|
|
22
|
-
borderRadius: 0,
|
|
23
|
-
color: "icon/on-color",
|
|
24
|
-
cursor: "pointer",
|
|
25
|
-
display: "flex",
|
|
26
|
-
flexShrink: 0,
|
|
27
|
-
height: uiHeaderHeight,
|
|
28
|
-
justifyContent: "center",
|
|
29
|
-
position: "relative",
|
|
30
|
-
textDecoration: "none",
|
|
31
|
-
_focusVisible: { outlineOffset: "calc(var(--focus-ring-width) * -1)" }
|
|
32
|
-
};
|
|
33
|
-
var uiHeaderSlotRecipe = defineSlotRecipe({
|
|
34
|
-
className: "ui-header",
|
|
35
|
-
slots: [
|
|
36
|
-
"accountAvatar",
|
|
37
|
-
"accountIcon",
|
|
38
|
-
"actions",
|
|
39
|
-
"badge",
|
|
40
|
-
"banner",
|
|
41
|
-
"bar",
|
|
42
|
-
"control",
|
|
43
|
-
"indicator",
|
|
44
|
-
"leading",
|
|
45
|
-
"logoBlock",
|
|
46
|
-
"logoLink",
|
|
47
|
-
"navButton",
|
|
48
|
-
"navButtonBadge",
|
|
49
|
-
"navButtonIcon",
|
|
50
|
-
"root",
|
|
51
|
-
"search",
|
|
52
|
-
"searchButton",
|
|
53
|
-
"searchClear",
|
|
54
|
-
"searchField",
|
|
55
|
-
"searchIcon",
|
|
56
|
-
"searchInput",
|
|
57
|
-
"spacer"
|
|
58
|
-
],
|
|
59
|
-
base: {
|
|
60
|
-
root: {
|
|
61
|
-
background: "sys/ui/header/bg",
|
|
62
|
-
color: "text/on-color",
|
|
63
|
-
display: "flex",
|
|
64
|
-
flexDirection: "column",
|
|
65
|
-
width: "full"
|
|
66
|
-
},
|
|
67
|
-
bar: {
|
|
68
|
-
alignItems: "center",
|
|
69
|
-
display: "flex",
|
|
70
|
-
flexShrink: 0,
|
|
71
|
-
height: uiHeaderHeight,
|
|
72
|
-
position: "relative",
|
|
73
|
-
tablet: { paddingInlineStart: "20" }
|
|
74
|
-
},
|
|
75
|
-
leading: {
|
|
76
|
-
display: "flex",
|
|
77
|
-
flexShrink: 0,
|
|
78
|
-
tablet: { display: "none" }
|
|
79
|
-
},
|
|
80
|
-
spacer: {
|
|
81
|
-
flexShrink: 1,
|
|
82
|
-
width: "48",
|
|
83
|
-
tablet: { display: "none" }
|
|
84
|
-
},
|
|
85
|
-
logoBlock: {
|
|
86
|
-
alignItems: "center",
|
|
87
|
-
display: "flex",
|
|
88
|
-
flex: 1,
|
|
89
|
-
justifyContent: "center",
|
|
90
|
-
minWidth: 0,
|
|
91
|
-
tablet: { flex: "none" }
|
|
92
|
-
},
|
|
93
|
-
logoLink: {
|
|
94
|
-
borderRadius: "4",
|
|
95
|
-
color: "text/on-color",
|
|
96
|
-
display: "flex",
|
|
97
|
-
marginBlockEnd: rem(3)
|
|
98
|
-
},
|
|
99
|
-
actions: {
|
|
100
|
-
alignItems: "center",
|
|
101
|
-
display: "flex",
|
|
102
|
-
flexShrink: 0,
|
|
103
|
-
marginInlineStart: "auto",
|
|
104
|
-
tablet: { paddingInlineEnd: "32" }
|
|
105
|
-
},
|
|
106
|
-
banner: { width: "full" },
|
|
107
|
-
control: {
|
|
108
|
-
...controlBase,
|
|
109
|
-
width: "48"
|
|
110
|
-
},
|
|
111
|
-
accountAvatar: {
|
|
112
|
-
borderRadius: "full",
|
|
113
|
-
display: "none",
|
|
114
|
-
overflow: "hidden",
|
|
115
|
-
tablet: { display: "inline-flex" }
|
|
116
|
-
},
|
|
117
|
-
accountIcon: {
|
|
118
|
-
display: "block",
|
|
119
|
-
tablet: { display: "none" }
|
|
120
|
-
},
|
|
121
|
-
navButton: {
|
|
122
|
-
...controlBase,
|
|
123
|
-
paddingBlock: "8",
|
|
124
|
-
paddingInlineEnd: "8",
|
|
125
|
-
paddingInlineStart: "12"
|
|
126
|
-
},
|
|
127
|
-
navButtonBadge: {
|
|
128
|
-
alignItems: "flex-start",
|
|
129
|
-
background: "sys/ui/header/bg",
|
|
130
|
-
borderStartStartRadius: "2",
|
|
131
|
-
color: "icon/on-color",
|
|
132
|
-
display: "flex",
|
|
133
|
-
height: "12",
|
|
134
|
-
insetBlockEnd: "8",
|
|
135
|
-
insetInlineEnd: "8",
|
|
136
|
-
overflow: "hidden",
|
|
137
|
-
pointerEvents: "none",
|
|
138
|
-
position: "absolute",
|
|
139
|
-
width: "16"
|
|
140
|
-
},
|
|
141
|
-
navButtonIcon: {
|
|
142
|
-
flexShrink: 0,
|
|
143
|
-
marginBlockStart: rem(-1),
|
|
144
|
-
marginInlineStart: "1"
|
|
145
|
-
},
|
|
146
|
-
badge: {
|
|
147
|
-
background: "sys/ui/header/badge/red",
|
|
148
|
-
borderRadius: "full",
|
|
149
|
-
height: "8",
|
|
150
|
-
insetBlockStart: "12",
|
|
151
|
-
insetInlineStart: rem(28),
|
|
152
|
-
pointerEvents: "none",
|
|
153
|
-
position: "absolute",
|
|
154
|
-
width: "8",
|
|
155
|
-
"&[data-pulse]": { _after: {
|
|
156
|
-
animation: "ping",
|
|
157
|
-
background: "sys/ui/header/badge/red",
|
|
158
|
-
borderRadius: "full",
|
|
159
|
-
content: "\"\"",
|
|
160
|
-
inset: 0,
|
|
161
|
-
opacity: .5,
|
|
162
|
-
position: "absolute",
|
|
163
|
-
_motionReduce: { animation: "none" }
|
|
164
|
-
} }
|
|
165
|
-
},
|
|
166
|
-
indicator: {
|
|
167
|
-
background: "sys/ui/header/control/indicator",
|
|
168
|
-
height: "4",
|
|
169
|
-
insetBlockEnd: 0,
|
|
170
|
-
insetInline: 0,
|
|
171
|
-
pointerEvents: "none",
|
|
172
|
-
position: "absolute"
|
|
173
|
-
},
|
|
174
|
-
search: {
|
|
175
|
-
display: "flex",
|
|
176
|
-
flexShrink: 0,
|
|
177
|
-
position: "relative"
|
|
178
|
-
},
|
|
179
|
-
searchField: {
|
|
180
|
-
alignItems: "center",
|
|
181
|
-
backgroundColor: "sys/ui/header/bg",
|
|
182
|
-
backgroundImage: `linear-gradient(0deg, ${SEARCH_FIELD_TINT} 0%, ${SEARCH_FIELD_TINT} 100%)`,
|
|
183
|
-
borderColor: "border/strong",
|
|
184
|
-
borderRadius: "4",
|
|
185
|
-
borderStyle: "solid",
|
|
186
|
-
borderWidth: "1",
|
|
187
|
-
display: "none",
|
|
188
|
-
gap: "8",
|
|
189
|
-
height: "40",
|
|
190
|
-
insetBlockStart: "4",
|
|
191
|
-
insetInlineEnd: 0,
|
|
192
|
-
opacity: 0,
|
|
193
|
-
paddingInlineEnd: "12",
|
|
194
|
-
paddingInlineStart: "8",
|
|
195
|
-
position: "absolute",
|
|
196
|
-
transitionDuration: "fast",
|
|
197
|
-
transitionProperty: "opacity, visibility",
|
|
198
|
-
transitionTimingFunction: "ease-out",
|
|
199
|
-
visibility: "hidden",
|
|
200
|
-
width: SEARCH_FIELD_WIDTH,
|
|
201
|
-
"&:has(input:focus-visible)": { boxShadow: "0 0 0 var(--focus-ring-width) var(--focus-ring-color) inset" },
|
|
202
|
-
_open: {
|
|
203
|
-
opacity: 1,
|
|
204
|
-
visibility: "visible"
|
|
205
|
-
},
|
|
206
|
-
_motionReduce: { transitionProperty: "none" },
|
|
207
|
-
tablet: { display: "flex" }
|
|
208
|
-
},
|
|
209
|
-
searchButton: { tablet: { _open: { visibility: "hidden" } } },
|
|
210
|
-
searchClear: {
|
|
211
|
-
color: "icon/on-color",
|
|
212
|
-
flexShrink: 0
|
|
213
|
-
},
|
|
214
|
-
searchIcon: {
|
|
215
|
-
color: "icon/on-color",
|
|
216
|
-
flexShrink: 0
|
|
217
|
-
},
|
|
218
|
-
searchInput: {
|
|
219
|
-
background: "transparent",
|
|
220
|
-
borderWidth: 0,
|
|
221
|
-
color: "text/on-color",
|
|
222
|
-
flex: 1,
|
|
223
|
-
focusVisibleRing: "none",
|
|
224
|
-
minWidth: 0,
|
|
225
|
-
padding: 0,
|
|
226
|
-
textStyle: "body/lg/regular",
|
|
227
|
-
"&::-webkit-search-cancel-button": { display: "none" },
|
|
228
|
-
_placeholder: {
|
|
229
|
-
color: "text/on-color",
|
|
230
|
-
opacity: .6
|
|
231
|
-
}
|
|
232
|
-
}
|
|
233
|
-
}
|
|
234
|
-
});
|
|
235
|
-
//#endregion
|
|
236
|
-
export { uiHeaderSlotRecipe as default, uiHeaderHeight };
|
|
237
|
-
|
|
238
|
-
//# sourceMappingURL=UIHeader.recipe.js.map
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
{"version":3,"file":"UIHeader.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/UIHeader.recipe.ts"],"sourcesContent":["import { defineSlotRecipe, type SystemStyleObject } from '@chakra-ui/react/styled-system';\n\nimport { colorVar, rem } from '../themeUtils';\n\nexport const uiHeaderHeightPx = 48;\nexport const uiHeaderHeight = rem(uiHeaderHeightPx);\n\nconst SEARCH_FIELD_WIDTH = rem(240);\n\nconst SEARCH_FIELD_TINT = colorVar('color/white/20');\n\nconst controlStates: SystemStyleObject = {\n background: 'sys/ui/header/control/bg',\n _hover: {\n background: 'sys/ui/header/control/bg-hover',\n _active: {\n background: 'sys/ui/header/control/bg-active',\n },\n },\n _active: {\n background: 'sys/ui/header/control/bg-active',\n },\n _selected: {\n background: 'sys/ui/header/control/bg-selected',\n _hover: {\n background: 'sys/ui/header/control/bg-selected-hover',\n _active: {\n background: 'sys/ui/header/control/bg-active',\n },\n },\n _active: {\n background: 'sys/ui/header/control/bg-active',\n },\n },\n};\n\nconst controlBase: SystemStyleObject = {\n ...controlStates,\n alignItems: 'center',\n borderRadius: 0,\n color: 'icon/on-color',\n cursor: 'pointer',\n display: 'flex',\n flexShrink: 0,\n height: uiHeaderHeight,\n justifyContent: 'center',\n position: 'relative',\n textDecoration: 'none',\n _focusVisible: {\n outlineOffset: 'calc(var(--focus-ring-width) * -1)',\n },\n};\n\nconst uiHeaderSlotRecipe = defineSlotRecipe({\n className: 'ui-header',\n slots: [\n 'accountAvatar',\n 'accountIcon',\n 'actions',\n 'badge',\n 'banner',\n 'bar',\n 'control',\n 'indicator',\n 'leading',\n 'logoBlock',\n 'logoLink',\n 'navButton',\n 'navButtonBadge',\n 'navButtonIcon',\n 'root',\n 'search',\n 'searchButton',\n 'searchClear',\n 'searchField',\n 'searchIcon',\n 'searchInput',\n 'spacer',\n ],\n base: {\n root: {\n background: 'sys/ui/header/bg',\n color: 'text/on-color',\n display: 'flex',\n flexDirection: 'column',\n width: 'full',\n },\n bar: {\n alignItems: 'center',\n display: 'flex',\n flexShrink: 0,\n height: uiHeaderHeight,\n position: 'relative',\n tablet: {\n paddingInlineStart: '20',\n },\n },\n leading: {\n display: 'flex',\n flexShrink: 0,\n tablet: {\n display: 'none',\n },\n },\n spacer: {\n flexShrink: 1,\n width: '48',\n tablet: {\n display: 'none',\n },\n },\n logoBlock: {\n alignItems: 'center',\n display: 'flex',\n flex: 1,\n justifyContent: 'center',\n minWidth: 0,\n tablet: {\n flex: 'none',\n },\n },\n logoLink: {\n borderRadius: '4',\n color: 'text/on-color',\n display: 'flex',\n marginBlockEnd: rem(3),\n },\n actions: {\n alignItems: 'center',\n display: 'flex',\n flexShrink: 0,\n marginInlineStart: 'auto',\n tablet: {\n paddingInlineEnd: '32',\n },\n },\n banner: {\n width: 'full',\n },\n control: {\n ...controlBase,\n width: '48',\n },\n accountAvatar: {\n borderRadius: 'full',\n display: 'none',\n overflow: 'hidden',\n tablet: {\n display: 'inline-flex',\n },\n },\n accountIcon: {\n display: 'block',\n tablet: {\n display: 'none',\n },\n },\n navButton: {\n ...controlBase,\n paddingBlock: '8',\n paddingInlineEnd: '8',\n paddingInlineStart: '12',\n },\n navButtonBadge: {\n alignItems: 'flex-start',\n background: 'sys/ui/header/bg',\n borderStartStartRadius: '2',\n color: 'icon/on-color',\n display: 'flex',\n height: '12',\n insetBlockEnd: '8',\n insetInlineEnd: '8',\n overflow: 'hidden',\n pointerEvents: 'none',\n position: 'absolute',\n width: '16',\n },\n navButtonIcon: {\n flexShrink: 0,\n marginBlockStart: rem(-1),\n marginInlineStart: '1',\n },\n badge: {\n background: 'sys/ui/header/badge/red',\n borderRadius: 'full',\n height: '8',\n insetBlockStart: '12',\n insetInlineStart: rem(28),\n pointerEvents: 'none',\n position: 'absolute',\n width: '8',\n '&[data-pulse]': {\n _after: {\n animation: 'ping',\n background: 'sys/ui/header/badge/red',\n borderRadius: 'full',\n content: '\"\"',\n inset: 0,\n opacity: 0.5,\n position: 'absolute',\n _motionReduce: {\n animation: 'none',\n },\n },\n },\n },\n indicator: {\n background: 'sys/ui/header/control/indicator',\n height: '4',\n insetBlockEnd: 0,\n insetInline: 0,\n pointerEvents: 'none',\n position: 'absolute',\n },\n search: {\n display: 'flex',\n flexShrink: 0,\n position: 'relative',\n },\n searchField: {\n alignItems: 'center',\n backgroundColor: 'sys/ui/header/bg',\n backgroundImage: `linear-gradient(0deg, ${SEARCH_FIELD_TINT} 0%, ${SEARCH_FIELD_TINT} 100%)`,\n borderColor: 'border/strong',\n borderRadius: '4',\n borderStyle: 'solid',\n borderWidth: '1',\n display: 'none',\n gap: '8',\n height: '40',\n insetBlockStart: '4',\n insetInlineEnd: 0,\n opacity: 0,\n paddingInlineEnd: '12',\n paddingInlineStart: '8',\n position: 'absolute',\n transitionDuration: 'fast',\n // `visibility` is what takes the closed field out of hit-testing, the tab order and the\n // accessibility tree in one go. Transitioning it keeps the field visible for the whole fade\n // and flips it at the end, which `opacity` alone could not do.\n transitionProperty: 'opacity, visibility',\n transitionTimingFunction: 'ease-out',\n visibility: 'hidden',\n width: SEARCH_FIELD_WIDTH,\n '&:has(input:focus-visible)': {\n boxShadow: '0 0 0 var(--focus-ring-width) var(--focus-ring-color) inset',\n },\n _open: {\n opacity: 1,\n visibility: 'visible',\n },\n _motionReduce: {\n transitionProperty: 'none',\n },\n tablet: {\n display: 'flex',\n },\n },\n searchButton: {\n tablet: {\n _open: {\n visibility: 'hidden',\n },\n },\n },\n searchClear: {\n color: 'icon/on-color',\n flexShrink: 0,\n },\n searchIcon: {\n color: 'icon/on-color',\n flexShrink: 0,\n },\n searchInput: {\n background: 'transparent',\n borderWidth: 0,\n color: 'text/on-color',\n flex: 1,\n focusVisibleRing: 'none',\n minWidth: 0,\n padding: 0,\n textStyle: 'body/lg/regular',\n '&::-webkit-search-cancel-button': { display: 'none' },\n _placeholder: {\n color: 'text/on-color',\n opacity: 0.6,\n },\n },\n },\n});\n\nexport default uiHeaderSlotRecipe;\n"],"mappings":"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"}
|