@bitrise/bitkit-v2 0.3.441 → 0.3.443

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.
Files changed (18) hide show
  1. package/dist/components/BitkitMarkdown/BitkitMarkdown.js +2 -8
  2. package/dist/components/BitkitMarkdown/BitkitMarkdown.js.map +1 -1
  3. package/dist/components/BitkitTabs/BitkitTabs.d.ts +22 -0
  4. package/dist/components/BitkitTabs/BitkitTabs.js +66 -40
  5. package/dist/components/BitkitTabs/BitkitTabs.js.map +1 -1
  6. package/dist/components/index.d.ts +1 -1
  7. package/dist/theme/slot-recipes/SettingsCard.recipe.d.ts +1 -1
  8. package/dist/theme/slot-recipes/SettingsCard.recipe.js +1 -1
  9. package/dist/theme/slot-recipes/SettingsCard.recipe.js.map +1 -1
  10. package/dist/theme/slot-recipes/Tabs.recipe.d.ts +94 -6
  11. package/dist/theme/slot-recipes/Tabs.recipe.js +214 -131
  12. package/dist/theme/slot-recipes/Tabs.recipe.js.map +1 -1
  13. package/dist/theme/slot-recipes/index.d.ts +95 -7
  14. package/dist/utilities/getTextContent.d.ts +3 -0
  15. package/dist/utilities/getTextContent.js +14 -0
  16. package/dist/utilities/getTextContent.js.map +1 -0
  17. package/docs/v1-to-v2-migration-guide.md +20 -0
  18. package/package.json +1 -1
package/dist/theme/slot-recipes/Tabs.recipe.d.ts CHANGED
@@ -4,24 +4,38 @@ declare const tabsSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"c
4
4
  list: {
5
5
  borderBlockEnd: "1px solid";
6
6
  borderColor: "border/regular";
7
+ '&:not([data-overflowing]) > .chakra-tabs__list > .chakra-tabs__trigger': {
8
+ flex: {
9
+ baseOnly: "1";
10
+ };
11
+ justifyContent: {
12
+ baseOnly: "center";
13
+ };
14
+ };
7
15
  };
8
16
  trigger: {
9
17
  bottom: "-1px";
10
18
  display: "flex";
11
19
  alignItems: "center";
12
- gap: "8";
20
+ gap: "12";
13
21
  paddingBlockStart: "12";
14
22
  paddingBlockEnd: `${number}rem`;
15
23
  borderBlockEnd: "2px solid transparent";
16
24
  _selected: {
17
25
  color: "text/primary";
26
+ _hover: {
27
+ '--tabs-icon-color': string;
28
+ };
29
+ '--tabs-icon-color': string;
18
30
  };
19
31
  _hover: {
20
32
  borderColor: "border/hover";
21
33
  color: "text/primary";
34
+ '--tabs-icon-color': string;
22
35
  };
23
36
  _disabled: {
24
37
  color: "text/disabled";
38
+ '--tabs-icon-color': string;
25
39
  };
26
40
  };
27
41
  moreTrigger: {
@@ -33,7 +47,6 @@ declare const tabsSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"c
33
47
  borderBlockEnd: "2px solid transparent";
34
48
  _hover: {
35
49
  backgroundColor: "background/hover";
36
- color: "text/primary";
37
50
  };
38
51
  _open: {
39
52
  backgroundColor: "background/active";
@@ -43,23 +56,85 @@ declare const tabsSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"c
43
56
  };
44
57
  contained: {
45
58
  trigger: {
59
+ display: "flex";
60
+ alignItems: "flex-start";
61
+ gap: "16";
46
62
  paddingBlockStart: `${number}rem`;
47
63
  paddingBlockEnd: "12";
48
64
  backgroundColor: "background/tertiary";
49
65
  borderBlockStart: "2px solid transparent";
66
+ _after: {
67
+ content: "\"\"";
68
+ position: "absolute";
69
+ insetBlock: number;
70
+ insetInlineEnd: number;
71
+ width: "1";
72
+ backgroundColor: "border/regular";
73
+ };
74
+ '&:last-of-type': {
75
+ _after: {
76
+ display: "none";
77
+ };
78
+ };
50
79
  _hover: {
51
80
  backgroundColor: "background/active";
81
+ _after: {
82
+ backgroundColor: "border/strong";
83
+ };
84
+ _active: {
85
+ backgroundColor: string;
86
+ color: string;
87
+ _after: {
88
+ backgroundColor: string;
89
+ };
90
+ '--tabs-icon-color': string;
91
+ };
92
+ '--tabs-icon-color': string;
93
+ };
94
+ _active: {
95
+ backgroundColor: string;
96
+ color: string;
97
+ _after: {
98
+ backgroundColor: string;
99
+ };
100
+ '--tabs-icon-color': string;
52
101
  };
53
102
  _disabled: {
54
103
  backgroundColor: "color/neutral/moderate";
55
104
  color: "text/on-disabled";
105
+ _after: {
106
+ backgroundColor: "border/strong";
107
+ };
108
+ '--tabs-icon-color': string;
56
109
  };
57
110
  _selected: {
58
- backgroundColor: "background/primary";
59
- color: "text/selected";
111
+ _after: {
112
+ display: "none";
113
+ };
60
114
  _hover: {
61
- backgroundColor: "background/primary";
115
+ _active: {
116
+ backgroundColor: string;
117
+ color: string;
118
+ '--tabs-icon-color': string;
119
+ };
120
+ backgroundColor: string;
121
+ color: string;
122
+ '--tabs-icon-color': string;
123
+ };
124
+ _active: {
125
+ backgroundColor: string;
126
+ color: string;
127
+ '--tabs-icon-color': string;
128
+ };
129
+ _focusVisible: {
130
+ _after: {
131
+ display: "block";
132
+ backgroundColor: "border/strong";
133
+ };
62
134
  };
135
+ backgroundColor: string;
136
+ color: string;
137
+ '--tabs-icon-color': string;
63
138
  };
64
139
  };
65
140
  moreTrigger: {
@@ -76,6 +151,11 @@ declare const tabsSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"c
76
151
  color: "text/primary";
77
152
  };
78
153
  };
154
+ contentGroup: {
155
+ backgroundColor: "background/primary";
156
+ borderRadius: "4";
157
+ borderStartStartRadius: number;
158
+ };
79
159
  };
80
160
  canvas: {
81
161
  list: {
@@ -87,7 +167,7 @@ declare const tabsSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"c
87
167
  height: "40";
88
168
  display: "flex";
89
169
  alignItems: "center";
90
- gap: "8";
170
+ gap: "4";
91
171
  textStyle: "body/md/regular";
92
172
  backgroundColor: "background/secondary";
93
173
  paddingInline: "12";
@@ -131,6 +211,7 @@ declare const tabsSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"c
131
211
  backgroundColor: "color/neutral/moderate";
132
212
  color: "text/on-disabled";
133
213
  };
214
+ '--tabs-icon-color': string;
134
215
  };
135
216
  };
136
217
  moreTrigger: {
@@ -154,7 +235,14 @@ declare const tabsSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"c
154
235
  boxShadow: "inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)";
155
236
  };
156
237
  };
238
+ contentGroup: {
239
+ backgroundColor: "background/primary";
240
+ };
157
241
  };
158
242
  };
243
+ size: {
244
+ lg: {};
245
+ md: {};
246
+ };
159
247
  }>;
160
248
  export default tabsSlotRecipe;
package/dist/theme/slot-recipes/Tabs.recipe.js CHANGED
@@ -2,6 +2,18 @@ import { rem } from "../themeUtils.js";
2
2
  import { defineSlotRecipe } from "@chakra-ui/react/styled-system";
3
3
  import { tabsAnatomy } from "@chakra-ui/react/anatomy";
4
4
  //#region lib/theme/slot-recipes/Tabs.recipe.ts
5
+ var iconColor = (token) => ({ "--tabs-icon-color": `colors.${token}` });
6
+ var containedActive = {
7
+ ...iconColor("icon/secondary"),
8
+ backgroundColor: "background/primary",
9
+ color: "text/primary",
10
+ _after: { backgroundColor: "border/regular" }
11
+ };
12
+ var containedSelected = {
13
+ ...iconColor("icon/interactive"),
14
+ backgroundColor: "background/primary",
15
+ color: "text/primary"
16
+ };
5
17
  var tabsSlotRecipe = defineSlotRecipe({
6
18
  slots: [...tabsAnatomy.keys(), "moreTrigger"],
7
19
  className: "chakra-tabs",
@@ -9,6 +21,7 @@ var tabsSlotRecipe = defineSlotRecipe({
9
21
  list: { display: "flex" },
10
22
  trigger: {
11
23
  "--focus-ring-width": rem(2),
24
+ ...iconColor("icon/tertiary"),
12
25
  color: "text/secondary",
13
26
  cursor: "pointer",
14
27
  textStyle: "body/lg/semibold",
@@ -21,12 +34,10 @@ var tabsSlotRecipe = defineSlotRecipe({
21
34
  _selected: {
22
35
  zIndex: 1,
23
36
  borderColor: "border/selected",
24
- _hover: { borderColor: "border/selected" },
25
- "& > svg": { color: "icon/interactive" }
37
+ _hover: { borderColor: "border/selected" }
26
38
  }
27
39
  },
28
40
  content: { outline: "none" },
29
- contentGroup: { backgroundColor: "background/primary" },
30
41
  moreTrigger: {
31
42
  "--focus-ring-width": rem(2),
32
43
  position: "relative",
@@ -38,156 +49,228 @@ var tabsSlotRecipe = defineSlotRecipe({
38
49
  color: "text/secondary"
39
50
  }
40
51
  },
41
- variants: { variant: {
42
- line: {
43
- list: {
44
- borderBlockEnd: "1px solid",
45
- borderColor: "border/regular"
46
- },
47
- trigger: {
48
- bottom: "-1px",
49
- display: "flex",
50
- alignItems: "center",
51
- gap: "8",
52
- paddingBlockStart: "12",
53
- paddingBlockEnd: rem(9),
54
- borderBlockEnd: "2px solid transparent",
55
- _selected: { color: "text/primary" },
56
- _hover: {
57
- borderColor: "border/hover",
58
- color: "text/primary"
59
- },
60
- _disabled: { color: "text/disabled" }
61
- },
62
- moreTrigger: {
63
- bottom: "-1px",
64
- textStyle: "body/lg/semibold",
65
- paddingInline: "16",
66
- paddingBlockStart: "12",
67
- paddingBlockEnd: rem(9),
68
- borderBlockEnd: "2px solid transparent",
69
- _hover: {
70
- backgroundColor: "background/hover",
71
- color: "text/primary"
52
+ variants: {
53
+ variant: {
54
+ line: {
55
+ list: {
56
+ borderBlockEnd: "1px solid",
57
+ borderColor: "border/regular",
58
+ "&:not([data-overflowing]) > .chakra-tabs__list > .chakra-tabs__trigger": {
59
+ flex: { baseOnly: "1" },
60
+ justifyContent: { baseOnly: "center" }
61
+ }
72
62
  },
73
- _open: {
74
- backgroundColor: "background/active",
75
- color: "text/primary"
76
- }
77
- }
78
- },
79
- contained: {
80
- trigger: {
81
- paddingBlockStart: rem(10),
82
- paddingBlockEnd: "12",
83
- backgroundColor: "background/tertiary",
84
- borderBlockStart: "2px solid transparent",
85
- _hover: { backgroundColor: "background/active" },
86
- _disabled: {
87
- backgroundColor: "color/neutral/moderate",
88
- color: "text/on-disabled"
63
+ trigger: {
64
+ bottom: "-1px",
65
+ display: "flex",
66
+ alignItems: "center",
67
+ gap: "12",
68
+ paddingBlockStart: "12",
69
+ paddingBlockEnd: rem(9),
70
+ borderBlockEnd: "2px solid transparent",
71
+ _selected: {
72
+ ...iconColor("icon/interactive"),
73
+ color: "text/primary",
74
+ _hover: iconColor("icon/interactive")
75
+ },
76
+ _hover: {
77
+ ...iconColor("icon/secondary"),
78
+ borderColor: "border/hover",
79
+ color: "text/primary"
80
+ },
81
+ _disabled: {
82
+ ...iconColor("icon/disabled"),
83
+ color: "text/disabled"
84
+ }
89
85
  },
90
- _selected: {
91
- backgroundColor: "background/primary",
92
- color: "text/selected",
93
- _hover: { backgroundColor: "background/primary" }
86
+ moreTrigger: {
87
+ bottom: "-1px",
88
+ textStyle: "body/lg/semibold",
89
+ paddingInline: "16",
90
+ paddingBlockStart: "12",
91
+ paddingBlockEnd: rem(9),
92
+ borderBlockEnd: "2px solid transparent",
93
+ _hover: { backgroundColor: "background/hover" },
94
+ _open: {
95
+ backgroundColor: "background/active",
96
+ color: "text/primary"
97
+ }
94
98
  }
95
99
  },
96
- moreTrigger: {
97
- textStyle: "body/lg/regular",
98
- paddingInline: "16",
99
- paddingBlock: "12",
100
- backgroundColor: "background/tertiary",
101
- _hover: {
102
- backgroundColor: "background/active",
103
- color: "text/primary"
100
+ contained: {
101
+ trigger: {
102
+ display: "flex",
103
+ alignItems: "flex-start",
104
+ gap: "16",
105
+ paddingBlockStart: rem(10),
106
+ paddingBlockEnd: "12",
107
+ backgroundColor: "background/tertiary",
108
+ borderBlockStart: "2px solid transparent",
109
+ _after: {
110
+ content: "\"\"",
111
+ position: "absolute",
112
+ insetBlock: 0,
113
+ insetInlineEnd: 0,
114
+ width: "1",
115
+ backgroundColor: "border/regular"
116
+ },
117
+ "&:last-of-type": { _after: { display: "none" } },
118
+ _hover: {
119
+ ...iconColor("icon/secondary"),
120
+ backgroundColor: "background/active",
121
+ _after: { backgroundColor: "border/strong" },
122
+ _active: containedActive
123
+ },
124
+ _active: containedActive,
125
+ _disabled: {
126
+ ...iconColor("icon/on-disabled"),
127
+ backgroundColor: "color/neutral/moderate",
128
+ color: "text/on-disabled",
129
+ _after: { backgroundColor: "border/strong" }
130
+ },
131
+ _selected: {
132
+ ...containedSelected,
133
+ _after: { display: "none" },
134
+ _hover: {
135
+ ...containedSelected,
136
+ _active: containedSelected
137
+ },
138
+ _active: containedSelected,
139
+ _focusVisible: { _after: {
140
+ display: "block",
141
+ backgroundColor: "border/strong"
142
+ } }
143
+ }
104
144
  },
105
- _open: {
106
- backgroundColor: "background/active",
107
- color: "text/primary"
108
- }
109
- }
110
- },
111
- canvas: {
112
- list: {
113
- paddingInlineStart: "12",
114
- borderBlockEnd: "1px solid",
115
- borderColor: "border/regular"
116
- },
117
- trigger: {
118
- height: "40",
119
- display: "flex",
120
- alignItems: "center",
121
- gap: "8",
122
- textStyle: "body/md/regular",
123
- backgroundColor: "background/secondary",
124
- paddingInline: "12",
125
- paddingBlock: "8",
126
- borderBlockEnd: "1px solid",
127
- bottom: "-1px",
128
- borderInlineEnd: "1px solid",
129
- borderColor: "border/regular",
130
- "&:first-of-type": {
131
- borderInlineStartWidth: "1",
132
- borderInlineStartStyle: "solid"
145
+ moreTrigger: {
146
+ textStyle: "body/lg/regular",
147
+ paddingInline: "16",
148
+ paddingBlock: "12",
149
+ backgroundColor: "background/tertiary",
150
+ _hover: {
151
+ backgroundColor: "background/active",
152
+ color: "text/primary"
153
+ },
154
+ _open: {
155
+ backgroundColor: "background/active",
156
+ color: "text/primary"
157
+ }
133
158
  },
134
- _hover: {
159
+ contentGroup: {
135
160
  backgroundColor: "background/primary",
136
- color: "text/primary"
161
+ borderRadius: "4",
162
+ borderStartStartRadius: 0
163
+ }
164
+ },
165
+ canvas: {
166
+ list: {
167
+ paddingInlineStart: "12",
168
+ borderBlockEnd: "1px solid",
169
+ borderColor: "border/regular"
137
170
  },
138
- _selected: {
139
- zIndex: 1,
140
- backgroundColor: "background/primary",
141
- color: "text/primary",
171
+ trigger: {
172
+ height: "40",
173
+ display: "flex",
174
+ alignItems: "center",
175
+ gap: "4",
176
+ textStyle: "body/md/regular",
177
+ backgroundColor: "background/secondary",
178
+ paddingInline: "12",
179
+ paddingBlock: "8",
180
+ borderBlockEnd: "1px solid",
181
+ bottom: "-1px",
182
+ borderInlineEnd: "1px solid",
142
183
  borderColor: "border/regular",
143
- borderBlockEndColor: "border/minimal",
144
- _after: {
145
- content: "\"\"",
146
- position: "absolute",
147
- insetBlockStart: 0,
148
- insetInline: 0,
149
- height: "2",
150
- backgroundColor: "border/selected"
184
+ "&:first-of-type": {
185
+ borderInlineStartWidth: "1",
186
+ borderInlineStartStyle: "solid"
151
187
  },
152
188
  _hover: {
153
189
  backgroundColor: "background/primary",
190
+ color: "text/primary"
191
+ },
192
+ _selected: {
193
+ zIndex: 1,
194
+ backgroundColor: "background/primary",
195
+ color: "text/primary",
154
196
  borderColor: "border/regular",
155
- borderBlockEndColor: "border/minimal"
197
+ borderBlockEndColor: "border/minimal",
198
+ _after: {
199
+ content: "\"\"",
200
+ position: "absolute",
201
+ insetBlockStart: 0,
202
+ insetInline: 0,
203
+ height: "2",
204
+ backgroundColor: "border/selected"
205
+ },
206
+ _hover: {
207
+ backgroundColor: "background/primary",
208
+ borderColor: "border/regular",
209
+ borderBlockEndColor: "border/minimal"
210
+ }
211
+ },
212
+ _disabled: {
213
+ ...iconColor("icon/disabled"),
214
+ backgroundColor: "color/neutral/moderate",
215
+ color: "text/on-disabled",
216
+ _hover: {
217
+ backgroundColor: "color/neutral/moderate",
218
+ color: "text/on-disabled"
219
+ }
156
220
  }
157
221
  },
158
- _disabled: {
159
- backgroundColor: "color/neutral/moderate",
160
- color: "text/on-disabled",
222
+ moreTrigger: {
223
+ height: "40",
224
+ textStyle: "body/md/regular",
225
+ paddingInline: "12",
226
+ bottom: "-1px",
227
+ borderBlockEnd: "1px solid",
228
+ borderInlineEnd: "1px solid",
229
+ borderColor: "border/regular",
161
230
  _hover: {
162
- backgroundColor: "color/neutral/moderate",
163
- color: "text/on-disabled"
231
+ backgroundColor: "background/hover",
232
+ color: "text/primary"
233
+ },
234
+ _open: {
235
+ backgroundColor: "background/active",
236
+ color: "text/primary"
237
+ },
238
+ _focusVisible: {
239
+ outline: "none",
240
+ boxShadow: "inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)"
164
241
  }
165
- }
242
+ },
243
+ contentGroup: { backgroundColor: "background/primary" }
244
+ }
245
+ },
246
+ size: {
247
+ lg: {},
248
+ md: {}
249
+ }
250
+ },
251
+ compoundVariants: [{
252
+ variant: "line",
253
+ size: "md",
254
+ css: {
255
+ list: { paddingInline: "4" },
256
+ trigger: {
257
+ textStyle: "body/md/semibold",
258
+ paddingInline: "12",
259
+ paddingBlockStart: rem(10),
260
+ paddingBlockEnd: rem(7)
166
261
  },
167
262
  moreTrigger: {
168
- height: "40",
169
- textStyle: "body/md/regular",
263
+ textStyle: "body/md/semibold",
170
264
  paddingInline: "12",
171
- bottom: "-1px",
172
- borderBlockEnd: "1px solid",
173
- borderInlineEnd: "1px solid",
174
- borderColor: "border/regular",
175
- _hover: {
176
- backgroundColor: "background/hover",
177
- color: "text/primary"
178
- },
179
- _open: {
180
- backgroundColor: "background/active",
181
- color: "text/primary"
182
- },
183
- _focusVisible: {
184
- outline: "none",
185
- boxShadow: "inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)"
186
- }
265
+ paddingBlockStart: rem(10),
266
+ paddingBlockEnd: rem(7)
187
267
  }
188
268
  }
189
- } },
190
- defaultVariants: { variant: "line" }
269
+ }],
270
+ defaultVariants: {
271
+ size: "lg",
272
+ variant: "line"
273
+ }
191
274
  });
192
275
  //#endregion
193
276
  export { tabsSlotRecipe as default };
package/dist/theme/slot-recipes/Tabs.recipe.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"file":"Tabs.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Tabs.recipe.ts"],"sourcesContent":["import { tabsAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\nconst tabsSlotRecipe = defineSlotRecipe({\n // `moreTrigger` is a custom slot (not in the Chakra anatomy) for the overflow \"N more…\" button.\n slots: [...tabsAnatomy.keys(), 'moreTrigger'],\n className: 'chakra-tabs',\n base: {\n list: {\n display: 'flex',\n },\n trigger: {\n '--focus-ring-width': rem(2),\n color: 'text/secondary',\n cursor: 'pointer',\n textStyle: 'body/lg/semibold',\n paddingInline: '16',\n position: 'relative',\n textAlign: 'left',\n whiteSpace: 'nowrap',\n zIndex: 0,\n _disabled: {\n cursor: 'not-allowed',\n },\n _selected: {\n zIndex: 1,\n borderColor: 'border/selected',\n _hover: {\n borderColor: 'border/selected',\n },\n '& > svg': {\n color: 'icon/interactive',\n },\n },\n },\n content: {\n outline: 'none',\n },\n contentGroup: {\n backgroundColor: 'background/primary',\n },\n // Overflow \"N more…\" button — variant-specific look is layered on per variant below.\n moreTrigger: {\n '--focus-ring-width': rem(2),\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n flexShrink: 0,\n whiteSpace: 'nowrap',\n cursor: 'pointer',\n color: 'text/secondary',\n },\n },\n\n variants: {\n variant: {\n line: {\n list: {\n borderBlockEnd: '1px solid',\n borderColor: 'border/regular',\n },\n trigger: {\n bottom: '-1px',\n display: 'flex',\n alignItems: 'center',\n gap: '8',\n paddingBlockStart: '12',\n paddingBlockEnd: rem(9),\n borderBlockEnd: '2px solid transparent',\n _selected: {\n color: 'text/primary',\n },\n _hover: {\n borderColor: 'border/hover',\n color: 'text/primary',\n },\n _disabled: {\n color: 'text/disabled',\n },\n },\n moreTrigger: {\n bottom: '-1px',\n textStyle: 'body/lg/semibold',\n paddingInline: '16',\n paddingBlockStart: '12',\n paddingBlockEnd: rem(9),\n borderBlockEnd: '2px solid transparent',\n _hover: { backgroundColor: 'background/hover', color: 'text/primary' },\n _open: { backgroundColor: 'background/active', color: 'text/primary' },\n },\n },\n contained: {\n trigger: {\n paddingBlockStart: rem(10),\n paddingBlockEnd: '12',\n backgroundColor: 'background/tertiary',\n borderBlockStart: '2px solid transparent',\n _hover: {\n backgroundColor: 'background/active',\n },\n _disabled: {\n backgroundColor: 'color/neutral/moderate',\n color: 'text/on-disabled',\n },\n _selected: {\n backgroundColor: 'background/primary',\n color: 'text/selected',\n _hover: {\n backgroundColor: 'background/primary',\n },\n },\n },\n moreTrigger: {\n // Regular weight (not the semibold tabs use) and no top marker — per the contained \"more\" design.\n textStyle: 'body/lg/regular',\n paddingInline: '16',\n paddingBlock: '12',\n backgroundColor: 'background/tertiary',\n _hover: { backgroundColor: 'background/active', color: 'text/primary' },\n _open: { backgroundColor: 'background/active', color: 'text/primary' },\n },\n },\n // IDE-style canvas tabs: fixed-height, edge-to-edge segments separated by vertical\n // dividers, with the selection marker on top. Closable + status-dot live only here.\n canvas: {\n list: {\n // Small leading gap before the first tab.\n paddingInlineStart: '12',\n borderBlockEnd: '1px solid',\n borderColor: 'border/regular',\n },\n trigger: {\n height: '40',\n display: 'flex',\n alignItems: 'center',\n gap: '8',\n textStyle: 'body/md/regular',\n backgroundColor: 'background/secondary',\n paddingInline: '12',\n paddingBlock: '8',\n // Bottom divider; shifted down 1px so it sits exactly on the list's bottom border (no\n // double line). The selected tab paints this white to merge with the content panel below.\n borderBlockEnd: '1px solid',\n bottom: '-1px',\n // Vertical divider between segments.\n borderInlineEnd: '1px solid',\n borderColor: 'border/regular',\n // The first tab also needs a leading divider (the others get theirs from the previous tab's\n // end). Set width/style only so the color comes from `borderColor` (border/regular), not the\n // shorthand's currentColor.\n '&:first-of-type': {\n borderInlineStartWidth: '1',\n borderInlineStartStyle: 'solid',\n },\n // The leading icon inherits the trigger's text color (secondary → primary by state); no\n // explicit svg rule, so the close-button icon keeps its own color.\n _hover: {\n backgroundColor: 'background/primary',\n color: 'text/primary',\n },\n _selected: {\n zIndex: 1,\n backgroundColor: 'background/primary',\n color: 'text/primary',\n // Keep neutral side dividers; the selected tab keeps a subtle bottom border because the\n // panel below it is secondary grey (not white), so it shouldn't fully merge.\n borderColor: 'border/regular',\n borderBlockEndColor: 'border/minimal',\n // Selection marker: an overlay bar on top of the selected tab only — non-selected\n // tabs have no top border, and it adds no layout height so nothing shifts.\n _after: {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: 0,\n insetInline: 0,\n height: '2',\n backgroundColor: 'border/selected',\n },\n _hover: {\n backgroundColor: 'background/primary',\n borderColor: 'border/regular',\n borderBlockEndColor: 'border/minimal',\n },\n },\n _disabled: {\n backgroundColor: 'color/neutral/moderate',\n color: 'text/on-disabled',\n _hover: {\n backgroundColor: 'color/neutral/moderate',\n color: 'text/on-disabled',\n },\n },\n },\n moreTrigger: {\n height: '40',\n textStyle: 'body/md/regular',\n paddingInline: '12',\n bottom: '-1px',\n borderBlockEnd: '1px solid',\n borderInlineEnd: '1px solid',\n borderColor: 'border/regular',\n _hover: { backgroundColor: 'background/hover', color: 'text/primary' },\n _open: { backgroundColor: 'background/active', color: 'text/primary' },\n _focusVisible: { outline: 'none', boxShadow: 'inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)' },\n },\n },\n },\n },\n\n defaultVariants: {\n variant: 'line',\n },\n});\n\nexport default tabsSlotRecipe;\n"],"mappings":"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"}
1
+ {"version":3,"file":"Tabs.recipe.js","names":[],"sources":["../../../lib/theme/slot-recipes/Tabs.recipe.ts"],"sourcesContent":["import { tabsAnatomy } from '@chakra-ui/react/anatomy';\nimport { defineSlotRecipe } from '@chakra-ui/react/styled-system';\n\nimport { rem } from '../themeUtils';\n\n// The trigger's own icon reads this variable. An `_icon` rule would also recolour the canvas close\n// button and any icon inside a badge.\n// These helpers stay unannotated: spreading a `SystemStyleObject` into the recipe makes its inferred\n// type too large for the declaration build to emit (TS7056).\nconst iconColor = (token: string) => ({ '--tabs-icon-color': `colors.${token}` });\n\nconst containedActive = {\n ...iconColor('icon/secondary'),\n backgroundColor: 'background/primary',\n color: 'text/primary',\n _after: { backgroundColor: 'border/regular' },\n};\n\nconst containedSelected = {\n ...iconColor('icon/interactive'),\n backgroundColor: 'background/primary',\n color: 'text/primary',\n};\n\nconst tabsSlotRecipe = defineSlotRecipe({\n // `moreTrigger` is a custom slot (not in the Chakra anatomy) for the overflow \"N more…\" button.\n slots: [...tabsAnatomy.keys(), 'moreTrigger'],\n className: 'chakra-tabs',\n base: {\n list: {\n display: 'flex',\n },\n trigger: {\n '--focus-ring-width': rem(2),\n ...iconColor('icon/tertiary'),\n color: 'text/secondary',\n cursor: 'pointer',\n textStyle: 'body/lg/semibold',\n paddingInline: '16',\n position: 'relative',\n textAlign: 'left',\n whiteSpace: 'nowrap',\n zIndex: 0,\n _disabled: {\n cursor: 'not-allowed',\n },\n _selected: {\n zIndex: 1,\n borderColor: 'border/selected',\n _hover: {\n borderColor: 'border/selected',\n },\n },\n },\n content: {\n outline: 'none',\n },\n // Overflow \"N more…\" button — variant-specific look is layered on per variant below.\n moreTrigger: {\n '--focus-ring-width': rem(2),\n position: 'relative',\n display: 'flex',\n alignItems: 'center',\n flexShrink: 0,\n whiteSpace: 'nowrap',\n cursor: 'pointer',\n color: 'text/secondary',\n },\n },\n\n variants: {\n variant: {\n line: {\n list: {\n borderBlockEnd: '1px solid',\n borderColor: 'border/regular',\n // On mobile the tabs share the row, but only while all of them fit: once the \"more\" button\n // shows up they keep their content width, as they always do from tablet up.\n // Child combinators, because the inner tablist gets this slot's class too and never\n // carries the attribute.\n '&:not([data-overflowing]) > .chakra-tabs__list > .chakra-tabs__trigger': {\n flex: { baseOnly: '1' },\n justifyContent: { baseOnly: 'center' },\n },\n },\n trigger: {\n bottom: '-1px',\n display: 'flex',\n alignItems: 'center',\n gap: '12',\n paddingBlockStart: '12',\n paddingBlockEnd: rem(9),\n borderBlockEnd: '2px solid transparent',\n _selected: {\n ...iconColor('icon/interactive'),\n color: 'text/primary',\n _hover: iconColor('icon/interactive'),\n },\n _hover: {\n ...iconColor('icon/secondary'),\n borderColor: 'border/hover',\n color: 'text/primary',\n },\n _disabled: {\n ...iconColor('icon/disabled'),\n color: 'text/disabled',\n },\n },\n moreTrigger: {\n bottom: '-1px',\n textStyle: 'body/lg/semibold',\n paddingInline: '16',\n paddingBlockStart: '12',\n paddingBlockEnd: rem(9),\n borderBlockEnd: '2px solid transparent',\n _hover: { backgroundColor: 'background/hover' },\n _open: { backgroundColor: 'background/active', color: 'text/primary' },\n },\n },\n contained: {\n trigger: {\n display: 'flex',\n alignItems: 'flex-start',\n gap: '16',\n paddingBlockStart: rem(10),\n paddingBlockEnd: '12',\n backgroundColor: 'background/tertiary',\n borderBlockStart: '2px solid transparent',\n // Separator on the right edge. The last tab has none, and neither has the selected one,\n // which joins the panel below.\n _after: {\n content: '\"\"',\n position: 'absolute',\n insetBlock: 0,\n insetInlineEnd: 0,\n width: '1',\n backgroundColor: 'border/regular',\n },\n '&:last-of-type': {\n _after: { display: 'none' },\n },\n _hover: {\n ...iconColor('icon/secondary'),\n backgroundColor: 'background/active',\n _after: { backgroundColor: 'border/strong' },\n _active: containedActive,\n },\n _active: containedActive,\n _disabled: {\n ...iconColor('icon/on-disabled'),\n backgroundColor: 'color/neutral/moderate',\n color: 'text/on-disabled',\n _after: { backgroundColor: 'border/strong' },\n },\n _selected: {\n ...containedSelected,\n _after: { display: 'none' },\n _hover: { ...containedSelected, _active: containedSelected },\n _active: containedSelected,\n _focusVisible: {\n _after: { display: 'block', backgroundColor: 'border/strong' },\n },\n },\n },\n moreTrigger: {\n // Regular weight (not the semibold tabs use) and no top marker — per the contained \"more\" design.\n textStyle: 'body/lg/regular',\n paddingInline: '16',\n paddingBlock: '12',\n backgroundColor: 'background/tertiary',\n _hover: { backgroundColor: 'background/active', color: 'text/primary' },\n _open: { backgroundColor: 'background/active', color: 'text/primary' },\n },\n contentGroup: {\n backgroundColor: 'background/primary',\n borderRadius: '4',\n borderStartStartRadius: 0,\n },\n },\n // IDE-style canvas tabs: fixed-height, edge-to-edge segments separated by vertical\n // dividers, with the selection marker on top. Closable + status-dot live only here.\n canvas: {\n list: {\n // Small leading gap before the first tab.\n paddingInlineStart: '12',\n borderBlockEnd: '1px solid',\n borderColor: 'border/regular',\n },\n trigger: {\n height: '40',\n display: 'flex',\n alignItems: 'center',\n gap: '4',\n textStyle: 'body/md/regular',\n backgroundColor: 'background/secondary',\n paddingInline: '12',\n paddingBlock: '8',\n // Bottom divider; shifted down 1px so it sits exactly on the list's bottom border (no\n // double line). The selected tab paints this white to merge with the content panel below.\n borderBlockEnd: '1px solid',\n bottom: '-1px',\n // Vertical divider between segments.\n borderInlineEnd: '1px solid',\n borderColor: 'border/regular',\n // The first tab also needs a leading divider (the others get theirs from the previous tab's\n // end). Set width/style only so the color comes from `borderColor` (border/regular), not the\n // shorthand's currentColor.\n '&:first-of-type': {\n borderInlineStartWidth: '1',\n borderInlineStartStyle: 'solid',\n },\n _hover: {\n backgroundColor: 'background/primary',\n color: 'text/primary',\n },\n _selected: {\n zIndex: 1,\n backgroundColor: 'background/primary',\n color: 'text/primary',\n // Keep neutral side dividers; the selected tab keeps a subtle bottom border because the\n // panel below it is secondary grey (not white), so it shouldn't fully merge.\n borderColor: 'border/regular',\n borderBlockEndColor: 'border/minimal',\n // Selection marker: an overlay bar on top of the selected tab only — non-selected\n // tabs have no top border, and it adds no layout height so nothing shifts.\n _after: {\n content: '\"\"',\n position: 'absolute',\n insetBlockStart: 0,\n insetInline: 0,\n height: '2',\n backgroundColor: 'border/selected',\n },\n _hover: {\n backgroundColor: 'background/primary',\n borderColor: 'border/regular',\n borderBlockEndColor: 'border/minimal',\n },\n },\n _disabled: {\n ...iconColor('icon/disabled'),\n backgroundColor: 'color/neutral/moderate',\n color: 'text/on-disabled',\n _hover: {\n backgroundColor: 'color/neutral/moderate',\n color: 'text/on-disabled',\n },\n },\n },\n moreTrigger: {\n height: '40',\n textStyle: 'body/md/regular',\n paddingInline: '12',\n bottom: '-1px',\n borderBlockEnd: '1px solid',\n borderInlineEnd: '1px solid',\n borderColor: 'border/regular',\n _hover: { backgroundColor: 'background/hover', color: 'text/primary' },\n _open: { backgroundColor: 'background/active', color: 'text/primary' },\n _focusVisible: { outline: 'none', boxShadow: 'inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)' },\n },\n contentGroup: {\n backgroundColor: 'background/primary',\n },\n },\n },\n // Only the line variant comes in two sizes; contained and canvas have one each.\n size: {\n lg: {},\n md: {},\n },\n },\n\n compoundVariants: [\n {\n variant: 'line',\n size: 'md',\n css: {\n list: {\n paddingInline: '4',\n },\n trigger: {\n textStyle: 'body/md/semibold',\n paddingInline: '12',\n paddingBlockStart: rem(10),\n paddingBlockEnd: rem(7),\n },\n moreTrigger: {\n textStyle: 'body/md/semibold',\n paddingInline: '12',\n paddingBlockStart: rem(10),\n paddingBlockEnd: rem(7),\n },\n },\n },\n ],\n\n defaultVariants: {\n size: 'lg',\n variant: 'line',\n },\n});\n\nexport default tabsSlotRecipe;\n"],"mappings":"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"}