@bitrise/bitkit-v2 0.3.180 → 0.3.181

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.
@@ -0,0 +1,1322 @@
1
+ declare const slotRecipes: {
2
+ accordion: import('@chakra-ui/react').SlotRecipeDefinition<"icon" | "suffix" | "root" | "item" | "itemTrigger" | "itemContent" | "itemIndicator" | "itemBody" | "secdText", import('@chakra-ui/react').SlotRecipeVariantRecord<"icon" | "suffix" | "root" | "item" | "itemTrigger" | "itemContent" | "itemIndicator" | "itemBody" | "secdText">>;
3
+ actionBar: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "separator" | "positioner" | "selectionTrigger" | "closeTrigger", {
4
+ size: {
5
+ md: {
6
+ content: {
7
+ padding: "12";
8
+ paddingInlineStart: "16";
9
+ gap: "12";
10
+ };
11
+ };
12
+ sm: {
13
+ content: {
14
+ padding: "8";
15
+ paddingInlineStart: "12";
16
+ gap: "8";
17
+ };
18
+ };
19
+ xs: {
20
+ content: {
21
+ padding: "8";
22
+ paddingInlineStart: "12";
23
+ gap: "8";
24
+ };
25
+ };
26
+ };
27
+ }>;
28
+ alert: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "description" | "indicator", {
29
+ variant: {
30
+ [k: string]: {
31
+ indicator: {
32
+ color: string;
33
+ };
34
+ root: {
35
+ color: string;
36
+ border: string;
37
+ background: string;
38
+ } | {
39
+ color: string;
40
+ backgroundColor: string;
41
+ borderColor: string;
42
+ } | {
43
+ color: string;
44
+ backgroundColor: string;
45
+ borderColor: string;
46
+ } | {
47
+ color: string;
48
+ backgroundColor: string;
49
+ borderColor: string;
50
+ } | {
51
+ color: string;
52
+ backgroundColor: string;
53
+ borderColor: string;
54
+ } | {
55
+ color: string;
56
+ backgroundColor: string;
57
+ borderColor: string;
58
+ };
59
+ };
60
+ };
61
+ }>;
62
+ avatar: import('@chakra-ui/react').SlotRecipeDefinition<"image" | "badge" | "icon" | "root" | "fallback" | "badgeContainer", {
63
+ size: {
64
+ '24': {
65
+ root: {
66
+ width: number;
67
+ height: number;
68
+ borderRadius: number;
69
+ };
70
+ image: {
71
+ borderRadius: number;
72
+ };
73
+ fallback: {
74
+ textStyle: "comp/avatar/24";
75
+ borderRadius: number;
76
+ };
77
+ icon: {
78
+ width: number;
79
+ height: number;
80
+ };
81
+ badgeContainer: {
82
+ display: "none";
83
+ };
84
+ };
85
+ '32': {
86
+ root: {
87
+ width: number;
88
+ height: number;
89
+ borderRadius: number;
90
+ };
91
+ image: {
92
+ borderRadius: number;
93
+ };
94
+ fallback: {
95
+ textStyle: "comp/avatar/32";
96
+ borderRadius: number;
97
+ };
98
+ icon: {
99
+ width: number;
100
+ height: number;
101
+ };
102
+ badgeContainer: {
103
+ width: number;
104
+ height: number;
105
+ bottom: number;
106
+ right: number;
107
+ borderRadius: number;
108
+ };
109
+ };
110
+ '40': {
111
+ root: {
112
+ width: number;
113
+ height: number;
114
+ borderRadius: number;
115
+ };
116
+ image: {
117
+ borderRadius: number;
118
+ };
119
+ fallback: {
120
+ textStyle: "comp/avatar/40";
121
+ borderRadius: number;
122
+ };
123
+ icon: {
124
+ width: number;
125
+ height: number;
126
+ };
127
+ badgeContainer: {
128
+ width: number;
129
+ height: number;
130
+ bottom: number;
131
+ right: number;
132
+ borderRadius: number;
133
+ };
134
+ };
135
+ '48': {
136
+ root: {
137
+ width: number;
138
+ height: number;
139
+ borderRadius: "10";
140
+ };
141
+ image: {
142
+ borderRadius: "10";
143
+ };
144
+ fallback: {
145
+ textStyle: "comp/avatar/48";
146
+ borderRadius: "10";
147
+ };
148
+ icon: {
149
+ width: number;
150
+ height: number;
151
+ };
152
+ badgeContainer: {
153
+ width: number;
154
+ height: number;
155
+ bottom: number;
156
+ right: number;
157
+ borderRadius: "50%";
158
+ };
159
+ };
160
+ '64': {
161
+ root: {
162
+ width: number;
163
+ height: number;
164
+ borderRadius: number;
165
+ };
166
+ image: {
167
+ borderRadius: number;
168
+ };
169
+ fallback: {
170
+ textStyle: "comp/avatar/64";
171
+ borderRadius: number;
172
+ };
173
+ icon: {
174
+ width: number;
175
+ height: number;
176
+ };
177
+ badgeContainer: {
178
+ width: number;
179
+ height: number;
180
+ bottom: number;
181
+ right: number;
182
+ borderRadius: "50%";
183
+ };
184
+ };
185
+ '128': {
186
+ root: {
187
+ width: number;
188
+ height: number;
189
+ borderRadius: number;
190
+ };
191
+ image: {
192
+ borderRadius: number;
193
+ };
194
+ fallback: {
195
+ textStyle: "comp/avatar/128";
196
+ borderRadius: number;
197
+ };
198
+ icon: {
199
+ width: number;
200
+ height: number;
201
+ };
202
+ badgeContainer: {
203
+ display: "none";
204
+ };
205
+ };
206
+ };
207
+ variant: {
208
+ circle: {
209
+ root: {
210
+ borderRadius: "50%";
211
+ };
212
+ image: {
213
+ borderRadius: "50%";
214
+ };
215
+ fallback: {
216
+ borderRadius: "50%";
217
+ };
218
+ };
219
+ rounded: {};
220
+ };
221
+ }>;
222
+ breadcrumb: import('@chakra-ui/react').SlotRecipeDefinition<"link" | "separator" | "ellipsis" | "list" | "root" | "item" | "currentLink", import('@chakra-ui/react').SlotRecipeVariantRecord<"link" | "separator" | "ellipsis" | "list" | "root" | "item" | "currentLink">>;
223
+ card: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "root" | "description", {
224
+ elevation: {
225
+ true: {
226
+ root: {
227
+ borderColor: "border/minimal";
228
+ boxShadow: "elevation/sm";
229
+ };
230
+ };
231
+ false: {
232
+ root: {
233
+ borderColor: "border/regular";
234
+ };
235
+ };
236
+ };
237
+ paddingSize: {
238
+ sm: {
239
+ body: {
240
+ padding: "16";
241
+ };
242
+ };
243
+ md: {
244
+ body: {
245
+ paddingInline: "24";
246
+ paddingBlock: "16";
247
+ };
248
+ };
249
+ lg: {
250
+ body: {
251
+ padding: "24";
252
+ };
253
+ };
254
+ };
255
+ }>;
256
+ checkbox: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "indicator" | "group" | "control", {
257
+ size: {
258
+ md: {
259
+ control: {
260
+ width: "20";
261
+ height: "20";
262
+ '& > svg': {
263
+ width: "20";
264
+ height: "20";
265
+ };
266
+ };
267
+ label: {
268
+ textStyle: "body/md/regular";
269
+ };
270
+ };
271
+ lg: {
272
+ control: {
273
+ width: "24";
274
+ height: "24";
275
+ '& > svg': {
276
+ width: "24";
277
+ height: "24";
278
+ };
279
+ };
280
+ label: {
281
+ textStyle: "body/lg/regular";
282
+ };
283
+ };
284
+ };
285
+ }>;
286
+ codeSnippet: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "copyButton" | "showMoreContainer" | "showMoreGradient" | "showMoreButton", {
287
+ variant: {
288
+ inline: {
289
+ root: {
290
+ alignItems: "center";
291
+ borderRadius: "2";
292
+ color: "text/body";
293
+ display: "inline-flex";
294
+ paddingBlock: "2";
295
+ paddingInline: "6";
296
+ whiteSpace: "nowrap";
297
+ };
298
+ };
299
+ single: {
300
+ root: {
301
+ alignItems: "center";
302
+ borderRadius: "4";
303
+ display: "flex";
304
+ height: "40";
305
+ isolation: "isolate";
306
+ overflow: "hidden";
307
+ whiteSpace: "nowrap";
308
+ };
309
+ content: {
310
+ alignItems: "center";
311
+ display: "flex";
312
+ height: "40";
313
+ overflow: "hidden";
314
+ paddingInlineStart: "16";
315
+ position: "relative";
316
+ _after: {
317
+ background: "linear-gradient(to left, var(--colors-background-secondary), transparent)";
318
+ content: "\"\"";
319
+ height: "40";
320
+ pointerEvents: "none";
321
+ position: "absolute";
322
+ right: "0";
323
+ top: "0";
324
+ width: "8";
325
+ };
326
+ };
327
+ copyButton: {
328
+ flexShrink: "0";
329
+ padding: "12";
330
+ };
331
+ };
332
+ multi: {
333
+ root: {
334
+ borderRadius: "4";
335
+ display: "flex";
336
+ flexDirection: "column";
337
+ padding: "16";
338
+ position: "relative";
339
+ };
340
+ content: {
341
+ color: "text/body";
342
+ overflowY: "auto";
343
+ transition: "max-height 0.3s ease";
344
+ whiteSpace: "pre-wrap";
345
+ };
346
+ copyButton: {
347
+ borderRadius: "4";
348
+ overflow: "hidden";
349
+ padding: "8";
350
+ position: "absolute";
351
+ right: number;
352
+ top: number;
353
+ };
354
+ showMoreContainer: {
355
+ alignItems: "center";
356
+ display: "flex";
357
+ justifyContent: "flex-end";
358
+ };
359
+ showMoreGradient: {
360
+ background: "linear-gradient(to top, var(--colors-background-secondary) 33%, transparent)";
361
+ borderBottomRadius: "4";
362
+ bottom: number;
363
+ height: "40";
364
+ left: number;
365
+ pointerEvents: "none";
366
+ position: "absolute";
367
+ right: number;
368
+ };
369
+ showMoreButton: {
370
+ alignItems: "center";
371
+ background: "background/secondary";
372
+ borderRadius: "4";
373
+ color: "text/secondary";
374
+ cursor: "pointer";
375
+ display: "flex";
376
+ gap: "4";
377
+ justifyContent: "center";
378
+ minWidth: "64";
379
+ paddingBlock: "8";
380
+ paddingInline: "12";
381
+ position: "relative";
382
+ textStyle: "comp/button/md";
383
+ _hover: {
384
+ background: "background/hover";
385
+ color: "text/primary";
386
+ _active: {
387
+ background: "background/active";
388
+ color: "text/primary";
389
+ overflow: "hidden";
390
+ };
391
+ };
392
+ _active: {
393
+ background: "background/active";
394
+ color: "text/primary";
395
+ overflow: "hidden";
396
+ };
397
+ _focusVisible: {
398
+ outlineOffset: "-3px";
399
+ };
400
+ };
401
+ };
402
+ };
403
+ size: {
404
+ md: {
405
+ root: {
406
+ textStyle: "code/md";
407
+ };
408
+ content: {
409
+ textStyle: "code/md";
410
+ };
411
+ };
412
+ lg: {
413
+ root: {
414
+ textStyle: "code/lg";
415
+ };
416
+ content: {
417
+ textStyle: "code/lg";
418
+ };
419
+ };
420
+ };
421
+ interactive: {
422
+ true: {};
423
+ false: {};
424
+ };
425
+ hasShowMore: {
426
+ true: {};
427
+ false: {};
428
+ };
429
+ isExpanded: {
430
+ true: {};
431
+ false: {};
432
+ };
433
+ }>;
434
+ collapsible: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "trigger" | "indicator", import('@chakra-ui/react').SlotRecipeVariantRecord<"content" | "root" | "trigger" | "indicator">>;
435
+ combobox: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "input" | "label" | "list" | "root" | "item" | "itemIndicator" | "trigger" | "positioner" | "clearTrigger" | "control" | "itemText" | "itemGroup" | "itemGroupLabel" | "indicatorGroup" | "empty" | "emptyHelperText", {
436
+ size: {
437
+ md: {
438
+ input: import('@chakra-ui/react').SystemStyleObject;
439
+ };
440
+ lg: {
441
+ input: import('@chakra-ui/react').SystemStyleObject;
442
+ };
443
+ };
444
+ }>;
445
+ datePicker: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "input" | "label" | "table" | "view" | "root" | "trigger" | "positioner" | "clearTrigger" | "control" | "monthSelect" | "nextTrigger" | "presetTrigger" | "prevTrigger" | "rangeText" | "tableBody" | "tableCell" | "tableCellTrigger" | "tableHead" | "tableHeader" | "tableRow" | "viewControl" | "viewTrigger" | "yearSelect" | "valueText" | "months", {
446
+ layout: {
447
+ '1-month': {
448
+ content: {
449
+ width: "17.5rem";
450
+ };
451
+ };
452
+ '2-month': {
453
+ content: {
454
+ width: "38.5rem";
455
+ };
456
+ };
457
+ };
458
+ showOutsideDays: {
459
+ false: {
460
+ tableCellTrigger: {
461
+ '&[data-outside-range]': {
462
+ visibility: "hidden";
463
+ };
464
+ };
465
+ };
466
+ true: {
467
+ tableCellTrigger: {
468
+ '&[data-outside-range]': {
469
+ visibility: "visible";
470
+ };
471
+ };
472
+ };
473
+ };
474
+ device: {
475
+ mobile: {
476
+ content: {
477
+ boxShadow: "none";
478
+ paddingBlock: "16";
479
+ paddingInline: "16";
480
+ };
481
+ };
482
+ };
483
+ }>;
484
+ datePickerSelect: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "label" | "list" | "root" | "item" | "itemIndicator" | "trigger" | "positioner" | "indicator" | "clearTrigger" | "control" | "valueText" | "itemText" | "itemGroup" | "itemGroupLabel" | "indicatorGroup", {
485
+ size: {
486
+ md: {
487
+ trigger: {
488
+ paddingBlock: "6";
489
+ textStyle?: "body/md/regular" | undefined;
490
+ };
491
+ indicator: {
492
+ _icon: {
493
+ width: "16";
494
+ height: "16";
495
+ };
496
+ };
497
+ searchInput?: {
498
+ paddingBlock: "12";
499
+ textStyle: "body/md/regular";
500
+ '--input-height': string;
501
+ } | undefined;
502
+ createItem?: {
503
+ color: "text/primary";
504
+ paddingBlock: "16";
505
+ textStyle: "body/md/regular";
506
+ } | undefined;
507
+ };
508
+ };
509
+ }>;
510
+ dialog: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "label" | "title" | "trigger" | "positioner" | "closeTrigger" | "description" | "backdrop" | "scrollBody" | "scrollButton" | "scrollGradient", {
511
+ scrollBehavior: {
512
+ inside: {
513
+ body: {
514
+ overflowY: "auto";
515
+ _last: {
516
+ paddingBlockEnd: number;
517
+ };
518
+ };
519
+ content: {
520
+ maxHeight: "calc(100dvh - 96px)";
521
+ overflow: "hidden";
522
+ };
523
+ };
524
+ outside: {};
525
+ };
526
+ size: {
527
+ lg: {
528
+ content: {
529
+ width: string;
530
+ };
531
+ };
532
+ md: {
533
+ content: {
534
+ width: string;
535
+ };
536
+ };
537
+ sm: {
538
+ content: {
539
+ width: string;
540
+ };
541
+ };
542
+ };
543
+ }>;
544
+ emptyState: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "description" | "indicator", {
545
+ colorScheme: {
546
+ white: {
547
+ root: {
548
+ backgroundColor: "background/primary";
549
+ };
550
+ };
551
+ grey: {
552
+ root: {
553
+ backgroundColor: "background/secondary";
554
+ };
555
+ };
556
+ };
557
+ }>;
558
+ expandableCard: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "icon" | "suffix" | "collapsible" | "root" | "secdText" | "description", {
559
+ size: {
560
+ md: {
561
+ header: {
562
+ textStyle: "body/md/regular";
563
+ paddingX: "16";
564
+ paddingY: "12";
565
+ };
566
+ secdText: {
567
+ textStyle: "body/sm/regular";
568
+ };
569
+ };
570
+ lg: {
571
+ header: {
572
+ textStyle: "body/lg/regular";
573
+ padding: "16";
574
+ };
575
+ secdText: {
576
+ textStyle: "body/md/regular";
577
+ };
578
+ };
579
+ };
580
+ }>;
581
+ field: import('@chakra-ui/react').SlotRecipeDefinition<"input" | "label" | "select" | "textarea" | "root" | "helperText" | "errorText" | "requiredIndicator", import('@chakra-ui/react').SlotRecipeVariantRecord<"input" | "label" | "select" | "textarea" | "root" | "helperText" | "errorText" | "requiredIndicator">>;
582
+ groupHeading: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "separator" | "icon" | "root" | "titleBlock", import('@chakra-ui/react').SlotRecipeVariantRecord<"label" | "separator" | "icon" | "root" | "titleBlock">>;
583
+ fieldset: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "legend" | "root" | "helperText" | "errorText", import('@chakra-ui/react').SlotRecipeVariantRecord<"content" | "legend" | "root" | "helperText" | "errorText">>;
584
+ fileUpload: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "item" | "itemContent" | "trigger" | "clearTrigger" | "itemGroup" | "dropzone" | "itemDeleteTrigger" | "itemName" | "itemPreview" | "itemPreviewImage" | "itemSizeText" | "dropzoneContent" | "fileText", {
585
+ variant: {
586
+ image: {
587
+ root: {
588
+ height: string;
589
+ };
590
+ };
591
+ };
592
+ }>;
593
+ imageCropper: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "image" | "root" | "viewport" | "selection" | "handle", import('@chakra-ui/react').SlotRecipeVariantRecord<"grid" | "image" | "root" | "viewport" | "selection" | "handle">>;
594
+ inlineLoading: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root", {
595
+ size: {
596
+ sm: {
597
+ label: {
598
+ textStyle: "body/sm/regular";
599
+ };
600
+ };
601
+ md: {
602
+ label: {
603
+ textStyle: "body/md/regular";
604
+ };
605
+ };
606
+ lg: {
607
+ label: {
608
+ textStyle: "body/lg/regular";
609
+ };
610
+ };
611
+ };
612
+ status: {
613
+ error: {
614
+ root: {
615
+ color: "text/body";
616
+ };
617
+ };
618
+ loading: {
619
+ root: {
620
+ color: "text/secondary";
621
+ };
622
+ };
623
+ success: {
624
+ root: {
625
+ color: "text/body";
626
+ };
627
+ };
628
+ };
629
+ }>;
630
+ list: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "item" | "indicator", {
631
+ size: {
632
+ lg: {
633
+ item: {
634
+ textStyle: "body/lg/regular";
635
+ };
636
+ indicator: {
637
+ height: "24";
638
+ width: "24";
639
+ };
640
+ };
641
+ md: {
642
+ item: {
643
+ textStyle: "body/md/regular";
644
+ };
645
+ indicator: {
646
+ height: "20";
647
+ width: "20";
648
+ };
649
+ };
650
+ };
651
+ }>;
652
+ markdown: import('@chakra-ui/react').SlotRecipeDefinition<"blockquote" | "root", {
653
+ size: {
654
+ sm: {
655
+ root: {
656
+ textStyle: "body/sm/regular";
657
+ };
658
+ };
659
+ md: {
660
+ root: {
661
+ textStyle: "body/md/regular";
662
+ };
663
+ };
664
+ lg: {
665
+ root: {
666
+ textStyle: "body/lg/regular";
667
+ };
668
+ };
669
+ };
670
+ }>;
671
+ markdownCard: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "title" | "root" | "description" | "iconBar" | "gradient" | "footerButtons", {
672
+ status: {
673
+ info: {
674
+ iconBar: {
675
+ backgroundColor: "background/secondary";
676
+ borderColor: "border/regular";
677
+ color: "icon/secondary";
678
+ };
679
+ root: {
680
+ borderColor: "border/regular";
681
+ };
682
+ };
683
+ success: {
684
+ iconBar: {
685
+ backgroundColor: "status/success/bg";
686
+ borderColor: "status/success/border";
687
+ color: "status/success/icon";
688
+ };
689
+ root: {
690
+ borderColor: "status/success/border";
691
+ };
692
+ };
693
+ warning: {
694
+ iconBar: {
695
+ backgroundColor: "status/warning/bg";
696
+ borderColor: "status/warning/border";
697
+ color: "status/warning/icon";
698
+ };
699
+ root: {
700
+ borderColor: "status/warning/border";
701
+ };
702
+ };
703
+ critical: {
704
+ iconBar: {
705
+ backgroundColor: "status/critical/bg";
706
+ borderColor: "status/critical/border";
707
+ color: "status/critical/icon";
708
+ };
709
+ root: {
710
+ borderColor: "status/critical/border";
711
+ };
712
+ };
713
+ };
714
+ }>;
715
+ menu: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "separator" | "item" | "itemIndicator" | "trigger" | "arrow" | "arrowTip" | "positioner" | "indicator" | "itemText" | "itemGroup" | "itemGroupLabel" | "contextTrigger" | "triggerItem" | "itemCommand" | "itemHelper", {
716
+ size: {
717
+ lg: {
718
+ item: {
719
+ paddingY: "12";
720
+ textStyle: "body/lg/regular";
721
+ };
722
+ };
723
+ md: {
724
+ item: {
725
+ _icon: {
726
+ marginTop: "2";
727
+ };
728
+ paddingY: "8";
729
+ textStyle: "body/md/regular";
730
+ };
731
+ };
732
+ };
733
+ }>;
734
+ nativeSelect: import('@chakra-ui/react').SlotRecipeDefinition<"field" | "root" | "indicator" | "statusIcon", {
735
+ size: {
736
+ md: {
737
+ field: {
738
+ paddingInline: string;
739
+ paddingBlock: string;
740
+ textStyle: "body/md/regular";
741
+ };
742
+ };
743
+ lg: {
744
+ field: {
745
+ paddingInline: string;
746
+ paddingBlock: string;
747
+ textStyle: "body/lg/regular";
748
+ };
749
+ };
750
+ };
751
+ }>;
752
+ numberInput: import('@chakra-ui/react').SlotRecipeDefinition<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", {
753
+ size: {
754
+ md: {
755
+ input: import('@chakra-ui/react').SystemStyleObject | undefined;
756
+ control: {
757
+ '--stepper-width': string;
758
+ };
759
+ };
760
+ lg: {
761
+ input: import('@chakra-ui/react').SystemStyleObject | undefined;
762
+ control: {
763
+ '--stepper-width': string;
764
+ };
765
+ };
766
+ };
767
+ }>;
768
+ paginationLoadMore: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "counter", {
769
+ size: {
770
+ md: {
771
+ root: {
772
+ gap: "24";
773
+ minHeight: string;
774
+ };
775
+ counter: {
776
+ textStyle: "body/md/regular";
777
+ '&:has(+ *)': {
778
+ paddingInlineEnd: "24";
779
+ };
780
+ };
781
+ };
782
+ sm: {
783
+ root: {
784
+ gap: "16";
785
+ minHeight: "48";
786
+ };
787
+ counter: {
788
+ textStyle: "body/md/regular";
789
+ '&:has(+ *)': {
790
+ paddingInlineEnd: "16";
791
+ };
792
+ };
793
+ };
794
+ xs: {
795
+ root: {
796
+ gap: "12";
797
+ minHeight: "32";
798
+ };
799
+ counter: {
800
+ textStyle: "body/sm/regular";
801
+ '&:has(+ *)': {
802
+ paddingInlineEnd: "12";
803
+ };
804
+ };
805
+ };
806
+ };
807
+ }>;
808
+ radioGroup: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "item" | "itemIndicator" | "indicator" | "itemText" | "itemControl" | "itemAddon", {
809
+ orientation: {
810
+ horizontal: {
811
+ root: {
812
+ flexDirection: "row";
813
+ gap: "24";
814
+ };
815
+ };
816
+ vertical: {
817
+ root: {
818
+ alignItems: "flex-start";
819
+ flexDirection: "column";
820
+ gap: "12";
821
+ };
822
+ };
823
+ };
824
+ size: {
825
+ md: {
826
+ itemControl: {
827
+ width: "20";
828
+ height: "20";
829
+ };
830
+ itemText: {
831
+ textStyle: "body/md/regular";
832
+ };
833
+ };
834
+ lg: {
835
+ itemControl: {
836
+ width: "24";
837
+ height: "24";
838
+ };
839
+ itemText: {
840
+ textStyle: "body/lg/regular";
841
+ };
842
+ };
843
+ };
844
+ }>;
845
+ ribbon: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "textBlock", import('@chakra-ui/react').SlotRecipeVariantRecord<"content" | "root" | "textBlock">>;
846
+ sectionHeading: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "icon" | "root" | "helperText" | "titleBlock" | "contentBlock" | "helperBlock", import('@chakra-ui/react').SlotRecipeVariantRecord<"label" | "icon" | "root" | "helperText" | "titleBlock" | "contentBlock" | "helperBlock">>;
847
+ segmentGroup: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "item" | "indicator" | "itemText" | "itemControl", {
848
+ fullWidth: {
849
+ true: {
850
+ root: {
851
+ display: "flex";
852
+ width: "100%";
853
+ };
854
+ item: {
855
+ flex: "1";
856
+ };
857
+ };
858
+ };
859
+ size: {
860
+ lg: {
861
+ item: {
862
+ paddingBlock: "12";
863
+ textStyle: "body/lg/regular";
864
+ };
865
+ };
866
+ md: {
867
+ item: {
868
+ paddingBlock: "8";
869
+ };
870
+ };
871
+ sm: {
872
+ item: {
873
+ paddingBlock: "6";
874
+ };
875
+ };
876
+ };
877
+ }>;
878
+ select: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "label" | "list" | "root" | "item" | "itemIndicator" | "trigger" | "positioner" | "indicator" | "clearTrigger" | "control" | "valueText" | "itemText" | "itemGroup" | "itemGroupLabel" | "indicatorGroup" | "searchInputGroup" | "searchInput" | "createItemContainer" | "createItem", {
879
+ size: {
880
+ lg: Record<string, import('@chakra-ui/react').SystemStyleObject>;
881
+ md: {
882
+ searchInput: {
883
+ paddingBlock: "12";
884
+ textStyle: "body/md/regular";
885
+ '--input-height': string;
886
+ };
887
+ createItem: {
888
+ color: "text/primary";
889
+ paddingBlock: "16";
890
+ textStyle: "body/md/regular";
891
+ };
892
+ trigger: {
893
+ textStyle: "body/md/regular";
894
+ paddingBlock: string;
895
+ };
896
+ };
897
+ };
898
+ }>;
899
+ splitButton: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "trigger" | "action", {
900
+ variant: {
901
+ primary: {
902
+ trigger: {
903
+ borderWidth: "0";
904
+ borderInlineStartWidth: string;
905
+ borderInlineStartColor: "border/on-contrast";
906
+ _hover: {
907
+ borderInlineStartColor: "border/on-contrast";
908
+ _active: {
909
+ borderInlineStartColor: "border/on-contrast";
910
+ };
911
+ };
912
+ _active: {
913
+ borderInlineStartColor: "border/on-contrast";
914
+ };
915
+ _disabled: {
916
+ borderInlineStartColor: "border/on-contrast";
917
+ };
918
+ _open: {
919
+ backgroundColor: "button/primary/bg-active";
920
+ };
921
+ };
922
+ };
923
+ secondary: {
924
+ trigger: {
925
+ _open: {
926
+ backgroundColor: "button/secondary/bg-active";
927
+ borderColor: "button/secondary/border-active";
928
+ color: "button/secondary/fg-active";
929
+ };
930
+ };
931
+ };
932
+ };
933
+ }>;
934
+ switch: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "indicator" | "control" | "thumb", {
935
+ size: {
936
+ sm: {
937
+ root: {
938
+ '--switch-width': string;
939
+ '--switch-height': string;
940
+ '--switch-indicator-font-size': string;
941
+ };
942
+ control: {
943
+ borderRadius: "8";
944
+ };
945
+ label: {
946
+ textStyle: "body/sm/regular";
947
+ };
948
+ };
949
+ md: {
950
+ root: {
951
+ '--switch-width': string;
952
+ '--switch-height': string;
953
+ '--switch-indicator-font-size': string;
954
+ };
955
+ control: {
956
+ borderRadius: "12";
957
+ };
958
+ label: {
959
+ textStyle: "body/lg/regular";
960
+ };
961
+ };
962
+ };
963
+ }>;
964
+ table: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "caption" | "footer" | "header" | "cell" | "row" | "root" | "columnHeader", {
965
+ variant: {
966
+ default: {
967
+ root: {
968
+ borderColor: "border/minimal";
969
+ borderRadius: "4";
970
+ borderStyle: "solid";
971
+ borderWidth: "1px";
972
+ overflow: "hidden";
973
+ };
974
+ header: {
975
+ '& :where(th)': {
976
+ backgroundColor: "background/tertiary";
977
+ };
978
+ };
979
+ columnHeader: {
980
+ borderBottomColor: "border/minimal";
981
+ paddingBlock: "12";
982
+ paddingInline: "16";
983
+ };
984
+ cell: {
985
+ borderBottomColor: "border/minimal";
986
+ paddingInline: "16";
987
+ };
988
+ footer: {
989
+ borderTopColor: "border/minimal";
990
+ };
991
+ };
992
+ borderless: {
993
+ columnHeader: {
994
+ borderBottomColor: "border/regular";
995
+ padding: "12";
996
+ };
997
+ cell: {
998
+ borderBottomColor: "border/regular";
999
+ paddingInline: "12";
1000
+ };
1001
+ footer: {
1002
+ borderTopColor: "border/regular";
1003
+ };
1004
+ };
1005
+ };
1006
+ layout: {
1007
+ table: {
1008
+ root: {
1009
+ borderCollapse: "separate";
1010
+ borderSpacing: "0";
1011
+ };
1012
+ caption: {
1013
+ marginBlockEnd: "24";
1014
+ };
1015
+ columnHeader: {
1016
+ borderBottomStyle: "solid";
1017
+ borderBottomWidth: "1px";
1018
+ color: "text/primary";
1019
+ fontWeight: "bold";
1020
+ textAlign: "start";
1021
+ textStyle: "heading/h5";
1022
+ verticalAlign: "middle";
1023
+ };
1024
+ cell: {
1025
+ borderBottomStyle: "solid";
1026
+ borderBottomWidth: "1px";
1027
+ paddingBlock: "20";
1028
+ verticalAlign: "middle";
1029
+ };
1030
+ body: {
1031
+ '& :where(tr)': {
1032
+ _hover: {
1033
+ backgroundColor: "background/hover";
1034
+ };
1035
+ };
1036
+ '& :where(tr:last-child) td': {
1037
+ borderBottomWidth: "0";
1038
+ };
1039
+ };
1040
+ };
1041
+ stacked: {
1042
+ root: {
1043
+ display: "block";
1044
+ };
1045
+ caption: {
1046
+ display: "block";
1047
+ padding: "16";
1048
+ backgroundColor: "background/tertiary";
1049
+ borderBottomColor: "border/minimal";
1050
+ borderBottomStyle: "solid";
1051
+ borderBottomWidth: "1px";
1052
+ };
1053
+ header: {
1054
+ borderWidth: "0";
1055
+ clip: "rect(0, 0, 0, 0)";
1056
+ height: "1";
1057
+ margin: "-1px";
1058
+ overflow: "hidden";
1059
+ padding: number;
1060
+ position: "absolute";
1061
+ whiteSpace: "nowrap";
1062
+ width: "1";
1063
+ };
1064
+ body: {
1065
+ display: "block";
1066
+ };
1067
+ row: {
1068
+ borderBottomColor: "border/minimal";
1069
+ borderBottomStyle: "solid";
1070
+ borderBottomWidth: "1px";
1071
+ display: "block";
1072
+ paddingBlock: "12";
1073
+ '&:last-child': {
1074
+ borderBottomWidth: "0";
1075
+ };
1076
+ };
1077
+ cell: {
1078
+ alignItems: "center";
1079
+ display: "flex";
1080
+ minHeight: "48";
1081
+ paddingInline: "16";
1082
+ _before: {
1083
+ alignSelf: "center";
1084
+ color: "text/primary";
1085
+ content: "attr(data-label)";
1086
+ flexShrink: number;
1087
+ fontWeight: "semibold";
1088
+ paddingInlineEnd: "16";
1089
+ width: "96";
1090
+ };
1091
+ };
1092
+ footer: {
1093
+ display: "block";
1094
+ };
1095
+ };
1096
+ };
1097
+ }>;
1098
+ tabs: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "list" | "root" | "trigger" | "indicator" | "contentGroup", {
1099
+ variant: {
1100
+ line: {
1101
+ list: {
1102
+ borderBlockEnd: "1px solid";
1103
+ borderColor: "border/regular";
1104
+ };
1105
+ trigger: {
1106
+ bottom: "-1px";
1107
+ display: "flex";
1108
+ alignItems: "center";
1109
+ gap: "8";
1110
+ color: "text/secondary";
1111
+ paddingBlockStart: "12";
1112
+ paddingBlockEnd: string;
1113
+ borderBlockEnd: "2px solid transparent";
1114
+ _selected: {
1115
+ color: "text/primary";
1116
+ };
1117
+ _hover: {
1118
+ borderColor: "border/hover";
1119
+ color: "text/primary";
1120
+ };
1121
+ _disabled: {
1122
+ color: "text/disabled";
1123
+ };
1124
+ };
1125
+ };
1126
+ contained: {
1127
+ trigger: {
1128
+ paddingBlockStart: string;
1129
+ paddingBlockEnd: "12";
1130
+ backgroundColor: "background/tertiary";
1131
+ color: "text/secondary";
1132
+ borderBlockStart: "2px solid transparent";
1133
+ _hover: {
1134
+ backgroundColor: "background/active";
1135
+ };
1136
+ _disabled: {
1137
+ backgroundColor: "sys/neutral/moderate";
1138
+ color: "text/on-disabled";
1139
+ };
1140
+ _selected: {
1141
+ backgroundColor: "background/primary";
1142
+ color: "text/selected";
1143
+ _hover: {
1144
+ backgroundColor: "background/primary";
1145
+ };
1146
+ };
1147
+ };
1148
+ };
1149
+ };
1150
+ }>;
1151
+ tag: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "closeTrigger" | "startElement" | "endElement", {
1152
+ disabled: {
1153
+ true: {
1154
+ root: {
1155
+ backgroundColor: "background/disabled";
1156
+ borderColor: "border/disabled";
1157
+ color: "text/on-disabled";
1158
+ };
1159
+ };
1160
+ false: {};
1161
+ };
1162
+ size: {
1163
+ sm: {
1164
+ root: {
1165
+ height: "24";
1166
+ paddingInline: "4";
1167
+ '&:has(button)': {
1168
+ paddingInlineEnd: "1";
1169
+ };
1170
+ };
1171
+ label: {
1172
+ paddingInline: "4";
1173
+ textStyle: "comp/tag/sm";
1174
+ };
1175
+ endElement: {
1176
+ width: "20";
1177
+ height: "20";
1178
+ };
1179
+ };
1180
+ md: {
1181
+ root: {
1182
+ height: "32";
1183
+ paddingInline: "6";
1184
+ '&:has(button)': {
1185
+ paddingInlineEnd: string;
1186
+ };
1187
+ };
1188
+ startElement: {
1189
+ marginInlineEnd: "-2px";
1190
+ };
1191
+ label: {
1192
+ paddingInline: "6";
1193
+ textStyle: "comp/tag/md";
1194
+ };
1195
+ };
1196
+ };
1197
+ }>;
1198
+ tagsInput: import('@chakra-ui/react').SlotRecipeDefinition<"input" | "label" | "root" | "item" | "clearTrigger" | "control" | "itemText" | "itemDeleteTrigger" | "itemPreview" | "itemInput" | "tagsBlock" | "suffixBlock", {
1199
+ size: {
1200
+ md: {
1201
+ control: {
1202
+ paddingInline: "8";
1203
+ };
1204
+ tagsBlock: {
1205
+ paddingBlock: "8";
1206
+ };
1207
+ suffixBlock: {
1208
+ height: "40";
1209
+ };
1210
+ input: {
1211
+ height: "24";
1212
+ textStyle: "body/md/regular";
1213
+ };
1214
+ };
1215
+ lg: {
1216
+ control: {
1217
+ paddingInlineStart: "12";
1218
+ paddingInlineEnd: "8";
1219
+ };
1220
+ tagsBlock: {
1221
+ paddingBlock: "12";
1222
+ };
1223
+ suffixBlock: {
1224
+ height: "48";
1225
+ };
1226
+ input: {
1227
+ textStyle: "body/lg/regular";
1228
+ };
1229
+ };
1230
+ };
1231
+ }>;
1232
+ toast: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "icon" | "root" | "closeTrigger" | "description" | "indicator" | "timestamp" | "actionTrigger", {
1233
+ variant: {
1234
+ [k: string]: {
1235
+ icon: {
1236
+ color: string;
1237
+ };
1238
+ root: {
1239
+ color: string;
1240
+ border: string;
1241
+ background: string;
1242
+ } | {
1243
+ color: string;
1244
+ backgroundColor: string;
1245
+ borderColor: string;
1246
+ } | {
1247
+ color: string;
1248
+ backgroundColor: string;
1249
+ borderColor: string;
1250
+ } | {
1251
+ color: string;
1252
+ backgroundColor: string;
1253
+ borderColor: string;
1254
+ } | {
1255
+ color: string;
1256
+ backgroundColor: string;
1257
+ borderColor: string;
1258
+ } | {
1259
+ color: string;
1260
+ backgroundColor: string;
1261
+ borderColor: string;
1262
+ };
1263
+ };
1264
+ };
1265
+ }>;
1266
+ tooltip: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "trigger" | "arrow" | "arrowTip" | "positioner", {
1267
+ variant: {
1268
+ dark: {
1269
+ content: {
1270
+ '--tooltip-bg': "colors.background.contrast";
1271
+ color: "text/on-contrast";
1272
+ };
1273
+ };
1274
+ light: {
1275
+ content: {
1276
+ '--tooltip-bg': "colors.background.tertiary";
1277
+ color: "text/primary";
1278
+ };
1279
+ };
1280
+ };
1281
+ paddingSize: {
1282
+ sm: {
1283
+ content: {
1284
+ paddingInline: "8";
1285
+ paddingBlock: "4";
1286
+ borderRadius: "4";
1287
+ };
1288
+ };
1289
+ md: {
1290
+ content: {
1291
+ paddingInline: "12";
1292
+ paddingBlock: "8";
1293
+ borderRadius: "8";
1294
+ };
1295
+ };
1296
+ lg: {
1297
+ content: {
1298
+ padding: "16";
1299
+ borderRadius: "8";
1300
+ };
1301
+ };
1302
+ };
1303
+ textStyle: {
1304
+ 'sm/regular': {
1305
+ content: {
1306
+ textStyle: "body/sm/regular";
1307
+ };
1308
+ };
1309
+ 'sm/semibold': {
1310
+ content: {
1311
+ textStyle: "body/sm/semibold";
1312
+ };
1313
+ };
1314
+ 'md/regular': {
1315
+ content: {
1316
+ textStyle: "body/md/regular";
1317
+ };
1318
+ };
1319
+ };
1320
+ }>;
1321
+ };
1322
+ export default slotRecipes;