@bitrise/bitkit-v2 0.3.466 → 0.3.467
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.
|
@@ -1,6 +1,12 @@
|
|
|
1
1
|
declare const drawerSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "title" | "trigger" | "positioner" | "closeTrigger" | "description" | "backdrop", {
|
|
2
2
|
variant: {
|
|
3
3
|
docked: {
|
|
4
|
+
body: {
|
|
5
|
+
padding: {
|
|
6
|
+
base: "16";
|
|
7
|
+
tablet: "24";
|
|
8
|
+
};
|
|
9
|
+
};
|
|
4
10
|
closeTrigger: {
|
|
5
11
|
insetEnd: `${number}rem`;
|
|
6
12
|
top: "12";
|
|
@@ -11,14 +17,38 @@ declare const drawerSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<
|
|
|
11
17
|
tablet: `${number}rem`;
|
|
12
18
|
};
|
|
13
19
|
};
|
|
20
|
+
footer: {
|
|
21
|
+
paddingInline: {
|
|
22
|
+
base: "16";
|
|
23
|
+
tablet: "24";
|
|
24
|
+
};
|
|
25
|
+
};
|
|
26
|
+
header: {
|
|
27
|
+
paddingInline: {
|
|
28
|
+
base: "16";
|
|
29
|
+
tablet: "24";
|
|
30
|
+
};
|
|
31
|
+
'& :has(> [role=tablist])': {
|
|
32
|
+
marginInline: {
|
|
33
|
+
base: "-8";
|
|
34
|
+
tablet: "-16";
|
|
35
|
+
};
|
|
36
|
+
};
|
|
37
|
+
};
|
|
14
38
|
};
|
|
15
39
|
floating: {
|
|
16
40
|
body: {
|
|
41
|
+
paddingBlockStart: "8";
|
|
17
42
|
paddingInline: "24";
|
|
43
|
+
'.chakra-drawer__header:has([role=tablist]) ~ &': {
|
|
44
|
+
paddingBlockStart: "24";
|
|
45
|
+
};
|
|
18
46
|
};
|
|
19
47
|
closeTrigger: {
|
|
20
|
-
|
|
21
|
-
|
|
48
|
+
height: "32";
|
|
49
|
+
insetEnd: "20";
|
|
50
|
+
top: "20";
|
|
51
|
+
width: "32";
|
|
22
52
|
};
|
|
23
53
|
positioner: {
|
|
24
54
|
padding: "32";
|
|
@@ -27,11 +57,15 @@ declare const drawerSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<
|
|
|
27
57
|
borderRadius: "12";
|
|
28
58
|
boxShadow: "elevation/lg";
|
|
29
59
|
maxWidth: `${number}rem`;
|
|
60
|
+
minWidth: `min(100%, ${number}rem)`;
|
|
30
61
|
};
|
|
31
62
|
header: {
|
|
32
63
|
paddingBlockEnd: "16";
|
|
33
64
|
paddingBlockStart: "24";
|
|
34
65
|
paddingInline: "24";
|
|
66
|
+
'& :has(> [role=tablist])': {
|
|
67
|
+
marginInline: "-16";
|
|
68
|
+
};
|
|
35
69
|
};
|
|
36
70
|
footer: {
|
|
37
71
|
borderBlockStartColor: "transparent";
|
|
@@ -42,9 +76,16 @@ declare const drawerSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<
|
|
|
42
76
|
};
|
|
43
77
|
title: {
|
|
44
78
|
color: "text/primary";
|
|
45
|
-
textStyle: "heading/
|
|
79
|
+
textStyle: "heading/h3";
|
|
46
80
|
};
|
|
47
81
|
};
|
|
48
82
|
};
|
|
83
|
+
size: {
|
|
84
|
+
xxs: {};
|
|
85
|
+
xs: {};
|
|
86
|
+
sm: {};
|
|
87
|
+
md: {};
|
|
88
|
+
lg: {};
|
|
89
|
+
};
|
|
49
90
|
}>;
|
|
50
91
|
export default drawerSlotRecipe;
|
|
@@ -56,7 +56,8 @@ var drawerSlotRecipe = defineSlotRecipe({
|
|
|
56
56
|
header: {
|
|
57
57
|
paddingBlockEnd: "8",
|
|
58
58
|
paddingBlockStart: "24",
|
|
59
|
-
paddingInline: "24"
|
|
59
|
+
paddingInline: "24",
|
|
60
|
+
"&:has([role=tablist])": { paddingBlockEnd: 0 }
|
|
60
61
|
},
|
|
61
62
|
body: {
|
|
62
63
|
flex: "1",
|
|
@@ -70,6 +71,7 @@ var drawerSlotRecipe = defineSlotRecipe({
|
|
|
70
71
|
title: {
|
|
71
72
|
color: "text/tertiary",
|
|
72
73
|
flex: "1",
|
|
74
|
+
paddingInlineEnd: "48",
|
|
73
75
|
textStyle: "heading/h6"
|
|
74
76
|
},
|
|
75
77
|
description: {},
|
|
@@ -87,47 +89,109 @@ var drawerSlotRecipe = defineSlotRecipe({
|
|
|
87
89
|
_active: { backgroundColor: "color/neutral/moderate" }
|
|
88
90
|
}
|
|
89
91
|
},
|
|
90
|
-
variants: {
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
borderBlockStartColor: "transparent",
|
|
120
|
-
borderBlockStartWidth: 0,
|
|
121
|
-
paddingBlockEnd: "24",
|
|
122
|
-
paddingBlockStart: "32",
|
|
123
|
-
paddingInline: "24"
|
|
92
|
+
variants: {
|
|
93
|
+
variant: {
|
|
94
|
+
docked: {
|
|
95
|
+
body: { padding: {
|
|
96
|
+
base: "16",
|
|
97
|
+
tablet: "24"
|
|
98
|
+
} },
|
|
99
|
+
closeTrigger: {
|
|
100
|
+
insetEnd: rem(18),
|
|
101
|
+
top: "12"
|
|
102
|
+
},
|
|
103
|
+
content: { width: {
|
|
104
|
+
base: "100vw",
|
|
105
|
+
tablet: rem(320)
|
|
106
|
+
} },
|
|
107
|
+
footer: { paddingInline: {
|
|
108
|
+
base: "16",
|
|
109
|
+
tablet: "24"
|
|
110
|
+
} },
|
|
111
|
+
header: {
|
|
112
|
+
paddingInline: {
|
|
113
|
+
base: "16",
|
|
114
|
+
tablet: "24"
|
|
115
|
+
},
|
|
116
|
+
"& :has(> [role=tablist])": { marginInline: {
|
|
117
|
+
base: "-8",
|
|
118
|
+
tablet: "-16"
|
|
119
|
+
} }
|
|
120
|
+
}
|
|
124
121
|
},
|
|
125
|
-
|
|
126
|
-
|
|
127
|
-
|
|
122
|
+
floating: {
|
|
123
|
+
body: {
|
|
124
|
+
paddingBlockStart: "8",
|
|
125
|
+
paddingInline: "24",
|
|
126
|
+
".chakra-drawer__header:has([role=tablist]) ~ &": { paddingBlockStart: "24" }
|
|
127
|
+
},
|
|
128
|
+
closeTrigger: {
|
|
129
|
+
height: "32",
|
|
130
|
+
insetEnd: "20",
|
|
131
|
+
top: "20",
|
|
132
|
+
width: "32"
|
|
133
|
+
},
|
|
134
|
+
positioner: { padding: "32" },
|
|
135
|
+
content: {
|
|
136
|
+
borderRadius: "12",
|
|
137
|
+
boxShadow: "elevation/lg",
|
|
138
|
+
maxWidth: rem(700),
|
|
139
|
+
minWidth: `min(100%, ${rem(480)})`
|
|
140
|
+
},
|
|
141
|
+
header: {
|
|
142
|
+
paddingBlockEnd: "16",
|
|
143
|
+
paddingBlockStart: "24",
|
|
144
|
+
paddingInline: "24",
|
|
145
|
+
"& :has(> [role=tablist])": { marginInline: "-16" }
|
|
146
|
+
},
|
|
147
|
+
footer: {
|
|
148
|
+
borderBlockStartColor: "transparent",
|
|
149
|
+
borderBlockStartWidth: 0,
|
|
150
|
+
paddingBlockEnd: "24",
|
|
151
|
+
paddingBlockStart: "32",
|
|
152
|
+
paddingInline: "24"
|
|
153
|
+
},
|
|
154
|
+
title: {
|
|
155
|
+
color: "text/primary",
|
|
156
|
+
textStyle: "heading/h3"
|
|
157
|
+
}
|
|
128
158
|
}
|
|
159
|
+
},
|
|
160
|
+
size: {
|
|
161
|
+
xxs: {},
|
|
162
|
+
xs: {},
|
|
163
|
+
sm: {},
|
|
164
|
+
md: {},
|
|
165
|
+
lg: {}
|
|
129
166
|
}
|
|
130
|
-
}
|
|
167
|
+
},
|
|
168
|
+
compoundVariants: [...[
|
|
169
|
+
["xxs", 320],
|
|
170
|
+
["xs", 360],
|
|
171
|
+
["sm", 480],
|
|
172
|
+
["md", 640],
|
|
173
|
+
["lg", 800]
|
|
174
|
+
].map(([size, width]) => ({
|
|
175
|
+
css: { content: { width: {
|
|
176
|
+
base: "100vw",
|
|
177
|
+
tablet: rem(width)
|
|
178
|
+
} } },
|
|
179
|
+
size,
|
|
180
|
+
variant: "docked"
|
|
181
|
+
})), ...[
|
|
182
|
+
["xxs", 480],
|
|
183
|
+
["xs", 480],
|
|
184
|
+
["sm", 480],
|
|
185
|
+
["md", 640],
|
|
186
|
+
["lg", 800]
|
|
187
|
+
].map(([size, width]) => ({
|
|
188
|
+
css: { content: {
|
|
189
|
+
maxWidth: "100%",
|
|
190
|
+
width: rem(width)
|
|
191
|
+
} },
|
|
192
|
+
size,
|
|
193
|
+
variant: "floating"
|
|
194
|
+
}))],
|
|
131
195
|
defaultVariants: { variant: "docked" }
|
|
132
196
|
});
|
|
133
197
|
//#endregion
|
|
@@ -1 +1 @@
|
|
|
1
|
-
{"version":3,"file":"Drawer.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Drawer.recipe.ts"],"sourcesContent":["import { drawerAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst drawerSlotRecipe = defineSlotRecipe({\n className: 'drawer',\n slots: drawerAnatomy.keys(),\n base: {\n backdrop: {\n background: 'utilities/overlay-light',\n inset: 0,\n position: 'fixed',\n zIndex: 'calc({zIndex.dialogOverlay} + var(--layer-index, 0))',\n _open: {\n animationName: 'fade-in',\n animationDuration: 'slow',\n },\n _closed: {\n animationName: 'fade-out',\n animationDuration: 'moderate',\n },\n },\n positioner: {\n alignItems: 'stretch',\n display: 'flex',\n inset: 0,\n justifyContent: 'flex-end',\n overscrollBehaviorY: 'none',\n position: 'fixed',\n zIndex: 'calc({zIndex.dialog} + var(--layer-index, 0))',\n },\n content: {\n background: 'background/primary',\n display: 'flex',\n flexDirection: 'column',\n maxHeight: '100dvh',\n outline: 'none',\n position: 'relative',\n _open: {\n animationDuration: 'slowest',\n animationName: {\n base: 'slide-from-right-full, fade-in',\n _rtl: 'slide-from-left-full, fade-in',\n },\n animationTimingFunction: 'ease-in-smooth',\n },\n _closed: {\n animationDuration: 'slower',\n animationName: {\n base: 'slide-to-right-full, fade-out',\n _rtl: 'slide-to-left-full, fade-out',\n },\n animationTimingFunction: 'ease-in-smooth',\n },\n },\n header: {\n paddingBlockEnd: '8',\n paddingBlockStart: '24',\n paddingInline: '24',\n },\n body: {\n flex: '1',\n overflow: 'auto',\n },\n footer: {\n borderBlockStartColor: 'border/regular',\n borderBlockStartWidth: '1',\n paddingBlock: '12',\n },\n title: {\n color: 'text/tertiary',\n flex: '1',\n textStyle: 'heading/h6',\n },\n description: {},\n closeTrigger: {\n alignItems: 'center',\n borderRadius: '4',\n color: 'icon/primary',\n cursor: 'pointer',\n display: 'inline-flex',\n height: '40',\n justifyContent: 'center',\n position: 'absolute',\n width: '40',\n _hover: {\n backgroundColor: 'color/neutral/subtle',\n },\n _active: {\n backgroundColor: 'color/neutral/moderate',\n },\n },\n },\n variants: {\n variant: {\n docked: {\n closeTrigger: {\n insetEnd: rem(18),\n top: '12',\n },\n content: {\n width: { base: '100vw', tablet: rem(320) },\n },\n },\n floating: {\n body: {\n paddingInline: '24',\n },\n closeTrigger: {\n insetEnd: '
|
|
1
|
+
{"version":3,"file":"Drawer.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Drawer.recipe.ts"],"sourcesContent":["import { drawerAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst drawerSlotRecipe = defineSlotRecipe({\n className: 'drawer',\n slots: drawerAnatomy.keys(),\n base: {\n backdrop: {\n background: 'utilities/overlay-light',\n inset: 0,\n position: 'fixed',\n zIndex: 'calc({zIndex.dialogOverlay} + var(--layer-index, 0))',\n _open: {\n animationName: 'fade-in',\n animationDuration: 'slow',\n },\n _closed: {\n animationName: 'fade-out',\n animationDuration: 'moderate',\n },\n },\n positioner: {\n alignItems: 'stretch',\n display: 'flex',\n inset: 0,\n justifyContent: 'flex-end',\n overscrollBehaviorY: 'none',\n position: 'fixed',\n zIndex: 'calc({zIndex.dialog} + var(--layer-index, 0))',\n },\n content: {\n background: 'background/primary',\n display: 'flex',\n flexDirection: 'column',\n maxHeight: '100dvh',\n outline: 'none',\n position: 'relative',\n _open: {\n animationDuration: 'slowest',\n animationName: {\n base: 'slide-from-right-full, fade-in',\n _rtl: 'slide-from-left-full, fade-in',\n },\n animationTimingFunction: 'ease-in-smooth',\n },\n _closed: {\n animationDuration: 'slower',\n animationName: {\n base: 'slide-to-right-full, fade-out',\n _rtl: 'slide-to-left-full, fade-out',\n },\n animationTimingFunction: 'ease-in-smooth',\n },\n },\n header: {\n paddingBlockEnd: '8',\n paddingBlockStart: '24',\n paddingInline: '24',\n // A tab list in the header closes it off with its own baseline.\n '&:has([role=tablist])': {\n paddingBlockEnd: 0,\n },\n },\n body: {\n flex: '1',\n overflow: 'auto',\n },\n footer: {\n borderBlockStartColor: 'border/regular',\n borderBlockStartWidth: '1',\n paddingBlock: '12',\n },\n title: {\n color: 'text/tertiary',\n flex: '1',\n // The close button is absolutely positioned, so the title keeps clear of it.\n paddingInlineEnd: '48',\n textStyle: 'heading/h6',\n },\n description: {},\n closeTrigger: {\n alignItems: 'center',\n borderRadius: '4',\n color: 'icon/primary',\n cursor: 'pointer',\n display: 'inline-flex',\n height: '40',\n justifyContent: 'center',\n position: 'absolute',\n width: '40',\n _hover: {\n backgroundColor: 'color/neutral/subtle',\n },\n _active: {\n backgroundColor: 'color/neutral/moderate',\n },\n },\n },\n variants: {\n variant: {\n // One inline padding for header, body and footer, so their content lines up: 16 on mobile, 24 from tablet.\n docked: {\n body: {\n padding: { base: '16', tablet: '24' },\n },\n closeTrigger: {\n insetEnd: rem(18),\n top: '12',\n },\n content: {\n width: { base: '100vw', tablet: rem(320) },\n },\n footer: {\n paddingInline: { base: '16', tablet: '24' },\n },\n header: {\n paddingInline: { base: '16', tablet: '24' },\n // Tabs sit 8px from the edge, so their baseline runs nearly full width.\n '& :has(> [role=tablist])': {\n marginInline: { base: '-8', tablet: '-16' },\n },\n },\n },\n floating: {\n body: {\n paddingBlockStart: '8',\n paddingInline: '24',\n '.chakra-drawer__header:has([role=tablist]) ~ &': {\n paddingBlockStart: '24',\n },\n },\n closeTrigger: {\n height: '32',\n insetEnd: '20',\n top: '20',\n width: '32',\n },\n positioner: {\n padding: '32',\n },\n content: {\n borderRadius: '12',\n boxShadow: 'elevation/lg',\n maxWidth: rem(700),\n // 480 is the floating drawer's smallest step; on narrow screens it gives way to the viewport.\n minWidth: `min(100%, ${rem(480)})`,\n },\n header: {\n paddingBlockEnd: '16',\n paddingBlockStart: '24',\n paddingInline: '24',\n '& :has(> [role=tablist])': {\n marginInline: '-16',\n },\n },\n footer: {\n borderBlockStartColor: 'transparent',\n borderBlockStartWidth: 0,\n paddingBlockEnd: '24',\n paddingBlockStart: '32',\n paddingInline: '24',\n },\n title: {\n color: 'text/primary',\n textStyle: 'heading/h3',\n },\n },\n },\n // Fixed widths from tablet up; below that the docked drawer is full width. The floating drawer starts at sm\n // (480) and, without a size, sizes to its content between 480 and 700.\n size: {\n xxs: {},\n xs: {},\n sm: {},\n md: {},\n lg: {},\n },\n },\n compoundVariants: [\n ...(\n [\n ['xxs', 320],\n ['xs', 360],\n ['sm', 480],\n ['md', 640],\n ['lg', 800],\n ] as const\n ).map(([size, width]) => ({\n css: { content: { width: { base: '100vw', tablet: rem(width) } } },\n size,\n variant: 'docked' as const,\n })),\n // The floating drawer's scale starts at 480, so the docked-only xxs and xs steps map to it there.\n ...(\n [\n ['xxs', 480],\n ['xs', 480],\n ['sm', 480],\n ['md', 640],\n ['lg', 800],\n ] as const\n ).map(([size, width]) => ({\n css: { content: { maxWidth: '100%', width: rem(width) } },\n size,\n variant: 'floating' as const,\n })),\n ],\n defaultVariants: {\n variant: 'docked',\n },\n});\n\nexport default drawerSlotRecipe;\n"],"mappings":"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"}
|
|
@@ -892,6 +892,12 @@ declare const slotRecipes: {
|
|
|
892
892
|
drawer: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "title" | "trigger" | "positioner" | "closeTrigger" | "description" | "backdrop", {
|
|
893
893
|
variant: {
|
|
894
894
|
docked: {
|
|
895
|
+
body: {
|
|
896
|
+
padding: {
|
|
897
|
+
base: "16";
|
|
898
|
+
tablet: "24";
|
|
899
|
+
};
|
|
900
|
+
};
|
|
895
901
|
closeTrigger: {
|
|
896
902
|
insetEnd: `${number}rem`;
|
|
897
903
|
top: "12";
|
|
@@ -902,14 +908,38 @@ declare const slotRecipes: {
|
|
|
902
908
|
tablet: `${number}rem`;
|
|
903
909
|
};
|
|
904
910
|
};
|
|
911
|
+
footer: {
|
|
912
|
+
paddingInline: {
|
|
913
|
+
base: "16";
|
|
914
|
+
tablet: "24";
|
|
915
|
+
};
|
|
916
|
+
};
|
|
917
|
+
header: {
|
|
918
|
+
paddingInline: {
|
|
919
|
+
base: "16";
|
|
920
|
+
tablet: "24";
|
|
921
|
+
};
|
|
922
|
+
'& :has(> [role=tablist])': {
|
|
923
|
+
marginInline: {
|
|
924
|
+
base: "-8";
|
|
925
|
+
tablet: "-16";
|
|
926
|
+
};
|
|
927
|
+
};
|
|
928
|
+
};
|
|
905
929
|
};
|
|
906
930
|
floating: {
|
|
907
931
|
body: {
|
|
932
|
+
paddingBlockStart: "8";
|
|
908
933
|
paddingInline: "24";
|
|
934
|
+
'.chakra-drawer__header:has([role=tablist]) ~ &': {
|
|
935
|
+
paddingBlockStart: "24";
|
|
936
|
+
};
|
|
909
937
|
};
|
|
910
938
|
closeTrigger: {
|
|
911
|
-
|
|
912
|
-
|
|
939
|
+
height: "32";
|
|
940
|
+
insetEnd: "20";
|
|
941
|
+
top: "20";
|
|
942
|
+
width: "32";
|
|
913
943
|
};
|
|
914
944
|
positioner: {
|
|
915
945
|
padding: "32";
|
|
@@ -918,11 +948,15 @@ declare const slotRecipes: {
|
|
|
918
948
|
borderRadius: "12";
|
|
919
949
|
boxShadow: "elevation/lg";
|
|
920
950
|
maxWidth: `${number}rem`;
|
|
951
|
+
minWidth: `min(100%, ${number}rem)`;
|
|
921
952
|
};
|
|
922
953
|
header: {
|
|
923
954
|
paddingBlockEnd: "16";
|
|
924
955
|
paddingBlockStart: "24";
|
|
925
956
|
paddingInline: "24";
|
|
957
|
+
'& :has(> [role=tablist])': {
|
|
958
|
+
marginInline: "-16";
|
|
959
|
+
};
|
|
926
960
|
};
|
|
927
961
|
footer: {
|
|
928
962
|
borderBlockStartColor: "transparent";
|
|
@@ -933,10 +967,17 @@ declare const slotRecipes: {
|
|
|
933
967
|
};
|
|
934
968
|
title: {
|
|
935
969
|
color: "text/primary";
|
|
936
|
-
textStyle: "heading/
|
|
970
|
+
textStyle: "heading/h3";
|
|
937
971
|
};
|
|
938
972
|
};
|
|
939
973
|
};
|
|
974
|
+
size: {
|
|
975
|
+
xxs: {};
|
|
976
|
+
xs: {};
|
|
977
|
+
sm: {};
|
|
978
|
+
md: {};
|
|
979
|
+
lg: {};
|
|
980
|
+
};
|
|
940
981
|
}>;
|
|
941
982
|
emptyState: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "indicator" | "description", {
|
|
942
983
|
colorVariant: {
|