@bitrise/bitkit-v2 0.3.200 → 0.3.202

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 (33) hide show
  1. package/dist/components/BitkitCodeSnippet/BitkitCodeSnippet.js +11 -4
  2. package/dist/components/BitkitCodeSnippet/BitkitCodeSnippet.js.map +1 -1
  3. package/dist/components/BitkitCombobox/BitkitCombobox.d.ts +6 -4
  4. package/dist/components/BitkitCombobox/BitkitCombobox.js +13 -14
  5. package/dist/components/BitkitCombobox/BitkitCombobox.js.map +1 -1
  6. package/dist/components/BitkitMultiselect/BitkitMultiselect.d.ts +19 -0
  7. package/dist/components/BitkitMultiselect/BitkitMultiselect.js +184 -0
  8. package/dist/components/BitkitMultiselect/BitkitMultiselect.js.map +1 -0
  9. package/dist/components/BitkitSelect/BitkitSelect.d.ts +2 -3
  10. package/dist/components/BitkitSelect/BitkitSelect.js +12 -6
  11. package/dist/components/BitkitSelect/BitkitSelect.js.map +1 -1
  12. package/dist/components/BitkitSelectMenu/BitkitSelectMenu.d.ts +18 -7
  13. package/dist/components/BitkitSelectMenu/BitkitSelectMenu.js +155 -61
  14. package/dist/components/BitkitSelectMenu/BitkitSelectMenu.js.map +1 -1
  15. package/dist/components/index.d.ts +1 -0
  16. package/dist/main.js +3 -2
  17. package/dist/theme/slot-recipes/CodeSnippet.recipe.d.ts +6 -1
  18. package/dist/theme/slot-recipes/CodeSnippet.recipe.js +9 -3
  19. package/dist/theme/slot-recipes/CodeSnippet.recipe.js.map +1 -1
  20. package/dist/theme/slot-recipes/Combobox.recipe.d.ts +1 -1
  21. package/dist/theme/slot-recipes/Multiselect.recipe.d.ts +48 -0
  22. package/dist/theme/slot-recipes/Multiselect.recipe.js +150 -0
  23. package/dist/theme/slot-recipes/Multiselect.recipe.js.map +1 -0
  24. package/dist/theme/slot-recipes/Select.recipe.js +191 -18
  25. package/dist/theme/slot-recipes/Select.recipe.js.map +1 -1
  26. package/dist/theme/slot-recipes/Sidebar.recipe.d.ts +1 -1
  27. package/dist/theme/slot-recipes/TagsInput.recipe.d.ts +1 -1
  28. package/dist/theme/slot-recipes/index.js +2 -0
  29. package/dist/theme/slot-recipes/index.js.map +1 -1
  30. package/package.json +1 -1
  31. package/dist/theme/slot-recipes/DatePickerSelect.recipe.d.ts +0 -27
  32. package/dist/theme/slot-recipes/Select.recipe.d.ts +0 -21
  33. package/dist/theme/slot-recipes/index.d.ts +0 -2039
package/dist/theme/slot-recipes/index.d.ts DELETED
@@ -1,2039 +0,0 @@
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: number;
323
- top: number;
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" | "scrollBody" | "scrollGradient" | "scrollButton" | "backdrop", {
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
- variant: {
544
- overflowContent: {
545
- content: {
546
- maxHeight: "calc(100dvh - 48px)";
547
- overflow: "hidden";
548
- };
549
- header: {
550
- gap: "8";
551
- paddingBlockEnd: "8";
552
- paddingBlockStart: "16";
553
- paddingInline: "16";
554
- };
555
- title: {
556
- paddingInlineEnd: "32";
557
- textStyle: "heading/h4";
558
- };
559
- body: {
560
- overflowY: "auto";
561
- paddingBlockEnd: "8";
562
- paddingInline: "16";
563
- _last: {
564
- paddingBlockEnd: number;
565
- };
566
- };
567
- scrollBody: {
568
- _last: {
569
- paddingBlockEnd: "16";
570
- };
571
- };
572
- footer: {
573
- paddingBlockEnd: "16";
574
- paddingBlockStart: number;
575
- paddingInline: "16";
576
- };
577
- closeTrigger: {
578
- insetEnd: "12";
579
- top: "12";
580
- };
581
- scrollGradient: {
582
- bottom: "16";
583
- };
584
- scrollButton: {
585
- bottom: "8";
586
- };
587
- };
588
- };
589
- }>;
590
- draggableCard: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "handle", {
591
- isDragging: {
592
- true: {
593
- root: {
594
- borderColor: "border/strong";
595
- boxShadow: "elevation/lg";
596
- cursor: "grabbing";
597
- };
598
- handle: {
599
- color: "icon/secondary";
600
- };
601
- };
602
- };
603
- isDropTarget: {
604
- true: {
605
- root: {
606
- background: "background/secondary";
607
- borderColor: "border/strong";
608
- borderStyle: "dashed";
609
- boxShadow: "none";
610
- };
611
- handle: {
612
- visibility: "hidden";
613
- };
614
- content: {
615
- visibility: "hidden";
616
- };
617
- };
618
- };
619
- isFullCardDrag: {
620
- true: {
621
- root: {
622
- cursor: "grab";
623
- _hover: {
624
- borderColor: "border/regular";
625
- _active: {
626
- borderColor: "border/strong";
627
- };
628
- };
629
- _active: {
630
- borderColor: "border/strong";
631
- };
632
- };
633
- handle: {
634
- pointerEvents: "none";
635
- };
636
- content: {
637
- paddingInlineStart: number;
638
- };
639
- };
640
- false: {
641
- root: {
642
- _hover: {
643
- borderColor: "border/regular";
644
- };
645
- };
646
- handle: {
647
- appearance: "none";
648
- background: "transparent";
649
- border: "none";
650
- cursor: "grab";
651
- focusVisibleRing: "none";
652
- _focusVisible: {
653
- boxShadow: "inset 0 0 0 var(--focus-ring-width) var(--focus-ring-color)";
654
- };
655
- _hover: {
656
- background: "background/hover";
657
- color: "icon/secondary";
658
- _active: {
659
- background: "background/active";
660
- };
661
- };
662
- _active: {
663
- background: "background/active";
664
- };
665
- };
666
- content: {
667
- paddingInlineStart: "8";
668
- };
669
- };
670
- };
671
- }>;
672
- drawer: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "title" | "trigger" | "positioner" | "closeTrigger" | "description" | "backdrop", {
673
- variant: {
674
- docked: {
675
- closeTrigger: {
676
- insetEnd: string;
677
- top: "12";
678
- };
679
- content: {
680
- width: {
681
- base: "100vw";
682
- tablet: string;
683
- };
684
- };
685
- };
686
- floating: {
687
- body: {
688
- paddingInline: "24";
689
- };
690
- closeTrigger: {
691
- insetEnd: "24";
692
- top: "24";
693
- };
694
- positioner: {
695
- padding: "32";
696
- };
697
- content: {
698
- borderRadius: "12";
699
- boxShadow: "elevation/lg";
700
- maxWidth: string;
701
- };
702
- header: {
703
- paddingBlockEnd: "16";
704
- paddingBlockStart: "24";
705
- paddingInline: "24";
706
- };
707
- footer: {
708
- borderBlockStartColor: "transparent";
709
- borderBlockStartWidth: "0";
710
- paddingBlockEnd: "24";
711
- paddingBlockStart: "32";
712
- paddingInline: "24";
713
- };
714
- title: {
715
- color: "text/primary";
716
- textStyle: "comp/dialog/title";
717
- };
718
- };
719
- };
720
- }>;
721
- emptyState: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "description" | "indicator", {
722
- colorScheme: {
723
- white: {
724
- root: {
725
- backgroundColor: "background/primary";
726
- };
727
- };
728
- grey: {
729
- root: {
730
- backgroundColor: "background/secondary";
731
- };
732
- };
733
- };
734
- }>;
735
- expandableCard: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "icon" | "suffix" | "collapsible" | "root" | "secdText" | "description", {
736
- size: {
737
- md: {
738
- header: {
739
- textStyle: "body/md/regular";
740
- paddingX: "16";
741
- paddingY: "12";
742
- };
743
- secdText: {
744
- textStyle: "body/sm/regular";
745
- };
746
- };
747
- lg: {
748
- header: {
749
- textStyle: "body/lg/regular";
750
- padding: "16";
751
- };
752
- secdText: {
753
- textStyle: "body/md/regular";
754
- };
755
- };
756
- };
757
- }>;
758
- 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">>;
759
- groupHeading: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "separator" | "icon" | "root" | "titleBlock", import('@chakra-ui/react').SlotRecipeVariantRecord<"label" | "separator" | "icon" | "root" | "titleBlock">>;
760
- fieldset: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "legend" | "root" | "helperText" | "errorText", import('@chakra-ui/react').SlotRecipeVariantRecord<"content" | "legend" | "root" | "helperText" | "errorText">>;
761
- fileUpload: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "item" | "itemContent" | "trigger" | "clearTrigger" | "itemGroup" | "dropzone" | "itemDeleteTrigger" | "itemName" | "itemPreview" | "itemPreviewImage" | "itemSizeText" | "dropzoneContent" | "fileText", {
762
- variant: {
763
- image: {
764
- root: {
765
- height: string;
766
- };
767
- };
768
- };
769
- }>;
770
- imageCropper: import('@chakra-ui/react').SlotRecipeDefinition<"grid" | "image" | "root" | "handle" | "viewport" | "selection", import('@chakra-ui/react').SlotRecipeVariantRecord<"grid" | "image" | "root" | "handle" | "viewport" | "selection">>;
771
- inlineLoading: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root", {
772
- size: {
773
- sm: {
774
- label: {
775
- textStyle: "body/sm/regular";
776
- };
777
- };
778
- md: {
779
- label: {
780
- textStyle: "body/md/regular";
781
- };
782
- };
783
- lg: {
784
- label: {
785
- textStyle: "body/lg/regular";
786
- };
787
- };
788
- };
789
- status: {
790
- error: {
791
- root: {
792
- color: "text/body";
793
- };
794
- };
795
- loading: {
796
- root: {
797
- color: "text/secondary";
798
- };
799
- };
800
- success: {
801
- root: {
802
- color: "text/body";
803
- };
804
- };
805
- };
806
- }>;
807
- list: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "item" | "indicator", {
808
- size: {
809
- lg: {
810
- item: {
811
- textStyle: "body/lg/regular";
812
- };
813
- indicator: {
814
- height: "24";
815
- width: "24";
816
- };
817
- };
818
- md: {
819
- item: {
820
- textStyle: "body/md/regular";
821
- };
822
- indicator: {
823
- height: "20";
824
- width: "20";
825
- };
826
- };
827
- };
828
- }>;
829
- markdown: import('@chakra-ui/react').SlotRecipeDefinition<"blockquote" | "root", {
830
- size: {
831
- sm: {
832
- root: {
833
- textStyle: "body/sm/regular";
834
- };
835
- };
836
- md: {
837
- root: {
838
- textStyle: "body/md/regular";
839
- };
840
- };
841
- lg: {
842
- root: {
843
- textStyle: "body/lg/regular";
844
- };
845
- };
846
- };
847
- }>;
848
- markdownCard: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "title" | "root" | "description" | "iconBar" | "gradient" | "footerButtons", {
849
- status: {
850
- info: {
851
- iconBar: {
852
- backgroundColor: "background/secondary";
853
- borderColor: "border/regular";
854
- color: "icon/secondary";
855
- };
856
- root: {
857
- borderColor: "border/regular";
858
- };
859
- };
860
- success: {
861
- iconBar: {
862
- backgroundColor: "status/success/bg";
863
- borderColor: "status/success/border";
864
- color: "status/success/icon";
865
- };
866
- root: {
867
- borderColor: "status/success/border";
868
- };
869
- };
870
- warning: {
871
- iconBar: {
872
- backgroundColor: "status/warning/bg";
873
- borderColor: "status/warning/border";
874
- color: "status/warning/icon";
875
- };
876
- root: {
877
- borderColor: "status/warning/border";
878
- };
879
- };
880
- critical: {
881
- iconBar: {
882
- backgroundColor: "status/critical/bg";
883
- borderColor: "status/critical/border";
884
- color: "status/critical/icon";
885
- };
886
- root: {
887
- borderColor: "status/critical/border";
888
- };
889
- };
890
- };
891
- }>;
892
- menu: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "separator" | "item" | "itemIndicator" | "trigger" | "arrow" | "arrowTip" | "positioner" | "indicator" | "itemText" | "itemGroup" | "itemGroupLabel" | "contextTrigger" | "triggerItem" | "itemCommand" | "itemHelper", {
893
- size: {
894
- lg: {
895
- item: {
896
- paddingY: "12";
897
- textStyle: "body/lg/regular";
898
- };
899
- };
900
- md: {
901
- item: {
902
- _icon: {
903
- marginTop: "2";
904
- };
905
- paddingY: "8";
906
- textStyle: "body/md/regular";
907
- };
908
- };
909
- };
910
- }>;
911
- noteCard: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "iconBar" | "message" | "iconWrapper" | "messageBlock" | "messageSolo" | "actionArea", {
912
- status: {
913
- ai: {
914
- iconBar: {
915
- background: "{colors.ai.background.minimal-vertical}";
916
- color: string;
917
- };
918
- messageSolo: {
919
- color: string;
920
- };
921
- root: {
922
- backgroundColor: "transparent";
923
- border: "1px solid transparent";
924
- background: "linear-gradient({colors.background.primary}, {colors.background.primary}) padding-box, {colors.status.ai.border} border-box";
925
- };
926
- title: {
927
- color: string;
928
- };
929
- };
930
- critical: {
931
- iconBar: {
932
- backgroundColor: string;
933
- color: string;
934
- };
935
- messageSolo: {
936
- color: string;
937
- };
938
- root: {
939
- borderColor: string;
940
- };
941
- title: {
942
- color: string;
943
- };
944
- };
945
- info: {
946
- iconBar: {
947
- backgroundColor: string;
948
- color: string;
949
- };
950
- messageSolo: {
951
- color: string;
952
- };
953
- root: {
954
- borderColor: string;
955
- };
956
- title: {
957
- color: string;
958
- };
959
- };
960
- progress: {
961
- iconBar: {
962
- backgroundColor: string;
963
- color: string;
964
- };
965
- messageSolo: {
966
- color: string;
967
- };
968
- root: {
969
- borderColor: string;
970
- };
971
- title: {
972
- color: string;
973
- };
974
- };
975
- success: {
976
- iconBar: {
977
- backgroundColor: string;
978
- color: string;
979
- };
980
- messageSolo: {
981
- color: string;
982
- };
983
- root: {
984
- borderColor: string;
985
- };
986
- title: {
987
- color: string;
988
- };
989
- };
990
- warning: {
991
- iconBar: {
992
- backgroundColor: string;
993
- color: string;
994
- };
995
- messageSolo: {
996
- color: string;
997
- };
998
- root: {
999
- borderColor: string;
1000
- };
1001
- title: {
1002
- color: string;
1003
- };
1004
- };
1005
- };
1006
- }>;
1007
- nativeSelect: import('@chakra-ui/react').SlotRecipeDefinition<"field" | "root" | "indicator" | "statusIcon", {
1008
- size: {
1009
- md: {
1010
- field: {
1011
- paddingInline: string;
1012
- paddingBlock: string;
1013
- textStyle: "body/md/regular";
1014
- };
1015
- };
1016
- lg: {
1017
- field: {
1018
- paddingInline: string;
1019
- paddingBlock: string;
1020
- textStyle: "body/lg/regular";
1021
- };
1022
- };
1023
- };
1024
- }>;
1025
- numberInput: import('@chakra-ui/react').SlotRecipeDefinition<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", {
1026
- size: {
1027
- md: {
1028
- input: import('@chakra-ui/react').SystemStyleObject | undefined;
1029
- control: {
1030
- '--stepper-width': string;
1031
- };
1032
- };
1033
- lg: {
1034
- input: import('@chakra-ui/react').SystemStyleObject | undefined;
1035
- control: {
1036
- '--stepper-width': string;
1037
- };
1038
- };
1039
- };
1040
- }>;
1041
- overflowContent: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "action" | "preview", import('@chakra-ui/react').SlotRecipeVariantRecord<"root" | "action" | "preview">>;
1042
- pageFooter: import('@chakra-ui/react').SlotRecipeDefinition<"link" | "status" | "root" | "statusLabel" | "statusDot" | "copyright" | "copyrightText" | "links", {
1043
- colorScheme: {
1044
- gray: {
1045
- root: {
1046
- background: "background/secondary";
1047
- };
1048
- status: {
1049
- background: "background/tertiary";
1050
- };
1051
- };
1052
- white: {
1053
- root: {
1054
- background: "background/primary";
1055
- };
1056
- status: {
1057
- background: "background/secondary";
1058
- };
1059
- };
1060
- };
1061
- size: {
1062
- compact: {
1063
- root: {
1064
- height: {
1065
- tablet: "32";
1066
- };
1067
- };
1068
- };
1069
- default: {
1070
- root: {
1071
- height: {
1072
- tablet: "64";
1073
- };
1074
- };
1075
- };
1076
- };
1077
- variant: {
1078
- default: {
1079
- root: {
1080
- paddingInlineEnd: {
1081
- base: "16";
1082
- tablet: string;
1083
- };
1084
- position: {
1085
- tablet: "relative";
1086
- };
1087
- };
1088
- copyright: {
1089
- insetInlineStart: {
1090
- tablet: "50%";
1091
- };
1092
- position: {
1093
- tablet: "absolute";
1094
- };
1095
- top: {
1096
- tablet: "50%";
1097
- };
1098
- transform: {
1099
- tablet: "translate(-50%, -50%)";
1100
- };
1101
- };
1102
- links: {
1103
- borderBlockEnd: {
1104
- base: "1px solid {colors.border.minimal}";
1105
- tablet: "none";
1106
- };
1107
- borderBlockStart: {
1108
- base: "1px solid {colors.border.minimal}";
1109
- tablet: "none";
1110
- };
1111
- paddingBlock: {
1112
- base: "16";
1113
- tablet: "0";
1114
- };
1115
- };
1116
- };
1117
- public: {
1118
- root: {
1119
- paddingInlineEnd: {
1120
- base: "16";
1121
- tablet: "40";
1122
- };
1123
- };
1124
- links: {
1125
- borderBlockEnd: {
1126
- base: "1px solid {colors.border.minimal}";
1127
- tablet: "none";
1128
- };
1129
- paddingBlockEnd: {
1130
- base: "16";
1131
- tablet: "0";
1132
- };
1133
- };
1134
- };
1135
- };
1136
- }>;
1137
- pagination: import('@chakra-ui/react').SlotRecipeDefinition<"text" | "root" | "itemsBlock" | "itemsSelect" | "pageBlock" | "pageSelect", {
1138
- variant: {
1139
- card: {
1140
- root: {
1141
- paddingInline: "24";
1142
- paddingBlock: "8";
1143
- };
1144
- text: {
1145
- color: "text/tertiary";
1146
- };
1147
- };
1148
- page: {
1149
- root: {
1150
- paddingInline: "24";
1151
- paddingBlock: "16";
1152
- borderTopWidth: string;
1153
- borderTopStyle: "solid";
1154
- borderTopColor: "border/regular";
1155
- };
1156
- text: {
1157
- color: "text/secondary";
1158
- };
1159
- };
1160
- table: {
1161
- root: {
1162
- paddingInline: "16";
1163
- paddingBlock: "8";
1164
- };
1165
- text: {
1166
- color: "text/secondary";
1167
- };
1168
- };
1169
- };
1170
- }>;
1171
- paginationLoadMore: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "counter", {
1172
- size: {
1173
- md: {
1174
- root: {
1175
- gap: "24";
1176
- minHeight: string;
1177
- };
1178
- counter: {
1179
- textStyle: "body/md/regular";
1180
- '&:has(+ *)': {
1181
- paddingInlineEnd: "24";
1182
- };
1183
- };
1184
- };
1185
- sm: {
1186
- root: {
1187
- gap: "16";
1188
- minHeight: "48";
1189
- };
1190
- counter: {
1191
- textStyle: "body/md/regular";
1192
- '&:has(+ *)': {
1193
- paddingInlineEnd: "16";
1194
- };
1195
- };
1196
- };
1197
- xs: {
1198
- root: {
1199
- gap: "12";
1200
- minHeight: "32";
1201
- };
1202
- counter: {
1203
- textStyle: "body/sm/regular";
1204
- '&:has(+ *)': {
1205
- paddingInlineEnd: "12";
1206
- };
1207
- };
1208
- };
1209
- };
1210
- }>;
1211
- radioGroup: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "item" | "itemIndicator" | "indicator" | "itemText" | "itemControl" | "itemAddon", {
1212
- orientation: {
1213
- horizontal: {
1214
- root: {
1215
- flexDirection: "row";
1216
- gap: "24";
1217
- };
1218
- };
1219
- vertical: {
1220
- root: {
1221
- alignItems: "flex-start";
1222
- flexDirection: "column";
1223
- gap: "12";
1224
- };
1225
- };
1226
- };
1227
- size: {
1228
- md: {
1229
- itemControl: {
1230
- width: "20";
1231
- height: "20";
1232
- };
1233
- itemText: {
1234
- textStyle: "body/md/regular";
1235
- };
1236
- };
1237
- lg: {
1238
- itemControl: {
1239
- width: "24";
1240
- height: "24";
1241
- };
1242
- itemText: {
1243
- textStyle: "body/lg/regular";
1244
- };
1245
- };
1246
- };
1247
- }>;
1248
- ribbon: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "root" | "textBlock", import('@chakra-ui/react').SlotRecipeVariantRecord<"content" | "root" | "textBlock">>;
1249
- 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">>;
1250
- labeledData: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "value" | "root" | "limit" | "helpText", {
1251
- size: {
1252
- lg: {
1253
- label: {
1254
- color: "text/primary";
1255
- };
1256
- value: {
1257
- textStyle: "comp/data/sm";
1258
- };
1259
- limit: {
1260
- textStyle: "body/md/regular";
1261
- };
1262
- };
1263
- '2xl': {
1264
- label: {
1265
- color: "text/secondary";
1266
- };
1267
- value: {
1268
- textStyle: "comp/data/md";
1269
- };
1270
- limit: {
1271
- textStyle: "body/xl/regular";
1272
- };
1273
- };
1274
- '3xl': {
1275
- label: {
1276
- color: "text/secondary";
1277
- };
1278
- value: {
1279
- textStyle: "comp/data/lg";
1280
- };
1281
- limit: {
1282
- textStyle: "body/2xl/regular";
1283
- };
1284
- };
1285
- };
1286
- }>;
1287
- segmentGroup: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "item" | "indicator" | "itemText" | "itemControl", {
1288
- fullWidth: {
1289
- true: {
1290
- root: {
1291
- display: "flex";
1292
- width: "100%";
1293
- };
1294
- item: {
1295
- flex: "1";
1296
- };
1297
- };
1298
- };
1299
- size: {
1300
- lg: {
1301
- item: {
1302
- paddingBlock: "12";
1303
- textStyle: "body/lg/regular";
1304
- };
1305
- };
1306
- md: {
1307
- item: {
1308
- paddingBlock: "8";
1309
- };
1310
- };
1311
- sm: {
1312
- item: {
1313
- paddingBlock: "6";
1314
- };
1315
- };
1316
- };
1317
- }>;
1318
- sidebar: import('@chakra-ui/react').SlotRecipeDefinition<"footer" | "title" | "root" | "item" | "suffixIcon" | "divider" | "itemIcon" | "itemLabel" | "project" | "projectLabel" | "projectValue" | "selectionMarker" | "titleWithBack", {
1319
- selected: {
1320
- true: {
1321
- item: {
1322
- background: "background/selected";
1323
- _hover: {
1324
- background: "background/selected-hover";
1325
- };
1326
- };
1327
- itemIcon: {
1328
- color: "icon/interactive";
1329
- };
1330
- itemLabel: {
1331
- textStyle: "body/lg/semibold";
1332
- };
1333
- selectionMarker: {
1334
- display: "block";
1335
- };
1336
- };
1337
- };
1338
- }>;
1339
- 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", {
1340
- size: {
1341
- lg: Record<string, import('@chakra-ui/react').SystemStyleObject>;
1342
- md: {
1343
- searchInput: {
1344
- paddingBlock: "12";
1345
- textStyle: "body/md/regular";
1346
- '--input-height': string;
1347
- };
1348
- createItem: {
1349
- color: "text/primary";
1350
- paddingBlock: "16";
1351
- textStyle: "body/md/regular";
1352
- };
1353
- trigger: {
1354
- textStyle: "body/md/regular";
1355
- paddingBlock: string;
1356
- };
1357
- };
1358
- };
1359
- }>;
1360
- settingsCard: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "footer" | "root" | "statusIcon" | "statusText" | "contentBody" | "contentActions" | "statusRow" | "statusDescription" | "statusHelperText", import('@chakra-ui/react').SlotRecipeVariantRecord<"content" | "footer" | "root" | "statusIcon" | "statusText" | "contentBody" | "contentActions" | "statusRow" | "statusDescription" | "statusHelperText">>;
1361
- splitButton: import('@chakra-ui/react').SlotRecipeDefinition<"root" | "trigger" | "action", {
1362
- variant: {
1363
- primary: {
1364
- trigger: {
1365
- borderWidth: "0";
1366
- borderInlineStartWidth: string;
1367
- borderInlineStartColor: "border/on-contrast";
1368
- _hover: {
1369
- borderInlineStartColor: "border/on-contrast";
1370
- _active: {
1371
- borderInlineStartColor: "border/on-contrast";
1372
- };
1373
- };
1374
- _active: {
1375
- borderInlineStartColor: "border/on-contrast";
1376
- };
1377
- _disabled: {
1378
- borderInlineStartColor: "border/on-contrast";
1379
- };
1380
- _open: {
1381
- backgroundColor: "button/primary/bg-active";
1382
- };
1383
- };
1384
- };
1385
- secondary: {
1386
- trigger: {
1387
- _open: {
1388
- backgroundColor: "button/secondary/bg-active";
1389
- borderColor: "button/secondary/border-active";
1390
- color: "button/secondary/fg-active";
1391
- };
1392
- };
1393
- };
1394
- };
1395
- }>;
1396
- stat: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "value" | "root" | "helpText", {
1397
- size: {
1398
- lg: {
1399
- label: {
1400
- color: "text/primary";
1401
- };
1402
- value: {
1403
- textStyle: "comp/data/sm";
1404
- };
1405
- };
1406
- '2xl': {
1407
- label: {
1408
- color: "text/secondary";
1409
- };
1410
- value: {
1411
- textStyle: "comp/data/md";
1412
- };
1413
- };
1414
- '3xl': {
1415
- label: {
1416
- color: "text/secondary";
1417
- };
1418
- value: {
1419
- textStyle: "comp/data/lg";
1420
- };
1421
- };
1422
- };
1423
- variant: {
1424
- default: {};
1425
- compact: {
1426
- root: {
1427
- display: "inline-flex";
1428
- alignItems: "flex-end";
1429
- };
1430
- value: {
1431
- textStyle: "body/md/regular";
1432
- };
1433
- helpText: {
1434
- textStyle: "body/sm/regular";
1435
- };
1436
- };
1437
- };
1438
- }>;
1439
- stepsCard: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "footer" | "header" | "title" | "root" | "description" | "titleGroup", import('@chakra-ui/react').SlotRecipeVariantRecord<"body" | "footer" | "header" | "title" | "root" | "description" | "titleGroup">>;
1440
- steps: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "progress" | "title" | "separator" | "list" | "root" | "item" | "trigger" | "description" | "indicator" | "nextTrigger" | "prevTrigger", {
1441
- orientation: {
1442
- horizontal: {
1443
- list: {
1444
- flexDirection: "row";
1445
- alignItems: "center";
1446
- };
1447
- item: {
1448
- alignItems: "center";
1449
- borderTopWidth: "2px";
1450
- paddingBlock: "16";
1451
- paddingInlineEnd: "24";
1452
- "&[data-step-status=inProgress]": {
1453
- _before: {
1454
- content: "\"\"";
1455
- position: "absolute";
1456
- insetBlockStart: "-2px";
1457
- insetInlineStart: number;
1458
- width: "50%";
1459
- height: "2";
1460
- bg: "border/selected";
1461
- };
1462
- };
1463
- };
1464
- };
1465
- vertical: {
1466
- list: {
1467
- flexDirection: "column";
1468
- alignItems: "stretch";
1469
- };
1470
- item: {
1471
- alignItems: "flex-start";
1472
- borderInlineStartWidth: "2px";
1473
- paddingInlineStart: "12";
1474
- paddingInlineEnd: "24";
1475
- paddingBlockEnd: "24";
1476
- '&:last-of-type': {
1477
- paddingBlockEnd: number;
1478
- };
1479
- "&[data-step-status=inProgress]": {
1480
- _before: {
1481
- content: "\"\"";
1482
- position: "absolute";
1483
- insetBlockStart: number;
1484
- insetInlineStart: "-2px";
1485
- width: "2";
1486
- height: "50%";
1487
- bg: "border/selected";
1488
- };
1489
- };
1490
- };
1491
- trigger: {
1492
- flexDirection: "column";
1493
- alignItems: "flex-start";
1494
- gap: "2";
1495
- paddingBlockStart: "4";
1496
- };
1497
- };
1498
- };
1499
- }>;
1500
- switch: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "indicator" | "control" | "thumb", {
1501
- size: {
1502
- sm: {
1503
- root: {
1504
- '--switch-width': string;
1505
- '--switch-height': string;
1506
- '--switch-indicator-font-size': string;
1507
- };
1508
- control: {
1509
- borderRadius: "8";
1510
- };
1511
- label: {
1512
- textStyle: "body/sm/regular";
1513
- };
1514
- };
1515
- md: {
1516
- root: {
1517
- '--switch-width': string;
1518
- '--switch-height': string;
1519
- '--switch-indicator-font-size': string;
1520
- };
1521
- control: {
1522
- borderRadius: "12";
1523
- };
1524
- label: {
1525
- textStyle: "body/lg/regular";
1526
- };
1527
- };
1528
- };
1529
- }>;
1530
- table: import('@chakra-ui/react').SlotRecipeDefinition<"body" | "caption" | "footer" | "header" | "cell" | "row" | "root" | "columnHeader", {
1531
- variant: {
1532
- default: {
1533
- root: {
1534
- borderColor: "border/minimal";
1535
- borderRadius: "4";
1536
- borderStyle: "solid";
1537
- borderWidth: "1px";
1538
- overflow: "hidden";
1539
- };
1540
- header: {
1541
- '& :where(th)': {
1542
- backgroundColor: "background/tertiary";
1543
- };
1544
- };
1545
- columnHeader: {
1546
- borderBottomColor: "border/minimal";
1547
- paddingBlock: "12";
1548
- paddingInline: "16";
1549
- };
1550
- cell: {
1551
- borderBottomColor: "border/minimal";
1552
- paddingInline: "16";
1553
- };
1554
- footer: {
1555
- borderTopColor: "border/minimal";
1556
- };
1557
- };
1558
- borderless: {
1559
- columnHeader: {
1560
- borderBottomColor: "border/regular";
1561
- padding: "12";
1562
- };
1563
- cell: {
1564
- borderBottomColor: "border/regular";
1565
- paddingInline: "12";
1566
- };
1567
- footer: {
1568
- borderTopColor: "border/regular";
1569
- };
1570
- };
1571
- };
1572
- layout: {
1573
- table: {
1574
- root: {
1575
- borderCollapse: "separate";
1576
- borderSpacing: "0";
1577
- };
1578
- caption: {
1579
- marginBlockEnd: "24";
1580
- };
1581
- columnHeader: {
1582
- borderBottomStyle: "solid";
1583
- borderBottomWidth: "1px";
1584
- color: "text/primary";
1585
- fontWeight: "bold";
1586
- textAlign: "start";
1587
- textStyle: "heading/h5";
1588
- verticalAlign: "middle";
1589
- };
1590
- cell: {
1591
- borderBottomStyle: "solid";
1592
- borderBottomWidth: "1px";
1593
- paddingBlock: "20";
1594
- verticalAlign: "middle";
1595
- };
1596
- body: {
1597
- '& :where(tr)': {
1598
- _hover: {
1599
- backgroundColor: "background/hover";
1600
- };
1601
- };
1602
- '& :where(tr:last-child) td': {
1603
- borderBottomWidth: "0";
1604
- };
1605
- };
1606
- };
1607
- stacked: {
1608
- root: {
1609
- display: "block";
1610
- };
1611
- caption: {
1612
- display: "block";
1613
- padding: "16";
1614
- backgroundColor: "background/tertiary";
1615
- borderBottomColor: "border/minimal";
1616
- borderBottomStyle: "solid";
1617
- borderBottomWidth: "1px";
1618
- };
1619
- header: {
1620
- borderWidth: "0";
1621
- clip: "rect(0, 0, 0, 0)";
1622
- height: "1";
1623
- margin: "-1px";
1624
- overflow: "hidden";
1625
- padding: number;
1626
- position: "absolute";
1627
- whiteSpace: "nowrap";
1628
- width: "1";
1629
- };
1630
- body: {
1631
- display: "block";
1632
- };
1633
- row: {
1634
- borderBottomColor: "border/minimal";
1635
- borderBottomStyle: "solid";
1636
- borderBottomWidth: "1px";
1637
- display: "block";
1638
- paddingBlock: "12";
1639
- '&:last-child': {
1640
- borderBottomWidth: "0";
1641
- };
1642
- };
1643
- cell: {
1644
- alignItems: "center";
1645
- display: "flex";
1646
- minHeight: "48";
1647
- paddingInline: "16";
1648
- _before: {
1649
- alignSelf: "center";
1650
- color: "text/primary";
1651
- content: "attr(data-label)";
1652
- flexShrink: number;
1653
- fontWeight: "semibold";
1654
- paddingInlineEnd: "16";
1655
- width: "96";
1656
- };
1657
- };
1658
- footer: {
1659
- display: "block";
1660
- };
1661
- };
1662
- };
1663
- }>;
1664
- tabs: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "list" | "root" | "trigger" | "indicator" | "contentGroup", {
1665
- variant: {
1666
- line: {
1667
- list: {
1668
- borderBlockEnd: "1px solid";
1669
- borderColor: "border/regular";
1670
- };
1671
- trigger: {
1672
- bottom: "-1px";
1673
- display: "flex";
1674
- alignItems: "center";
1675
- gap: "8";
1676
- color: "text/secondary";
1677
- paddingBlockStart: "12";
1678
- paddingBlockEnd: string;
1679
- borderBlockEnd: "2px solid transparent";
1680
- _selected: {
1681
- color: "text/primary";
1682
- };
1683
- _hover: {
1684
- borderColor: "border/hover";
1685
- color: "text/primary";
1686
- };
1687
- _disabled: {
1688
- color: "text/disabled";
1689
- };
1690
- };
1691
- };
1692
- contained: {
1693
- trigger: {
1694
- paddingBlockStart: string;
1695
- paddingBlockEnd: "12";
1696
- backgroundColor: "background/tertiary";
1697
- color: "text/secondary";
1698
- borderBlockStart: "2px solid transparent";
1699
- _hover: {
1700
- backgroundColor: "background/active";
1701
- };
1702
- _disabled: {
1703
- backgroundColor: "sys/neutral/moderate";
1704
- color: "text/on-disabled";
1705
- };
1706
- _selected: {
1707
- backgroundColor: "background/primary";
1708
- color: "text/selected";
1709
- _hover: {
1710
- backgroundColor: "background/primary";
1711
- };
1712
- };
1713
- };
1714
- };
1715
- };
1716
- }>;
1717
- tag: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "closeTrigger" | "startElement" | "endElement", {
1718
- disabled: {
1719
- true: {
1720
- root: {
1721
- backgroundColor: "background/disabled";
1722
- borderColor: "border/disabled";
1723
- color: "text/on-disabled";
1724
- };
1725
- };
1726
- false: {};
1727
- };
1728
- size: {
1729
- sm: {
1730
- root: {
1731
- height: "24";
1732
- paddingInline: "4";
1733
- '&:has(button)': {
1734
- paddingInlineEnd: "1";
1735
- };
1736
- };
1737
- label: {
1738
- paddingInline: "4";
1739
- textStyle: "comp/tag/sm";
1740
- };
1741
- endElement: {
1742
- width: "20";
1743
- height: "20";
1744
- };
1745
- };
1746
- md: {
1747
- root: {
1748
- height: "32";
1749
- paddingInline: "6";
1750
- '&:has(button)': {
1751
- paddingInlineEnd: string;
1752
- };
1753
- };
1754
- startElement: {
1755
- marginInlineEnd: "-2px";
1756
- };
1757
- label: {
1758
- paddingInline: "6";
1759
- textStyle: "comp/tag/md";
1760
- };
1761
- };
1762
- };
1763
- }>;
1764
- tagsInput: import('@chakra-ui/react').SlotRecipeDefinition<"input" | "label" | "root" | "item" | "clearTrigger" | "control" | "itemText" | "itemDeleteTrigger" | "itemPreview" | "itemInput" | "tagsBlock" | "suffixBlock", {
1765
- size: {
1766
- md: {
1767
- control: {
1768
- paddingInline: "8";
1769
- };
1770
- tagsBlock: {
1771
- paddingBlock: "8";
1772
- };
1773
- suffixBlock: {
1774
- height: "40";
1775
- };
1776
- input: {
1777
- height: "24";
1778
- textStyle: "body/md/regular";
1779
- };
1780
- };
1781
- lg: {
1782
- control: {
1783
- paddingInlineStart: "12";
1784
- paddingInlineEnd: "8";
1785
- };
1786
- tagsBlock: {
1787
- paddingBlock: "12";
1788
- };
1789
- suffixBlock: {
1790
- height: "48";
1791
- };
1792
- input: {
1793
- textStyle: "body/lg/regular";
1794
- };
1795
- };
1796
- };
1797
- }>;
1798
- toast: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "icon" | "root" | "closeTrigger" | "description" | "indicator" | "timestamp" | "actionTrigger", {
1799
- variant: {
1800
- [k: string]: {
1801
- icon: {
1802
- color: string;
1803
- };
1804
- root: {
1805
- color: string;
1806
- border: string;
1807
- background: string;
1808
- } | {
1809
- color: string;
1810
- backgroundColor: string;
1811
- borderColor: string;
1812
- } | {
1813
- color: string;
1814
- backgroundColor: string;
1815
- borderColor: string;
1816
- } | {
1817
- color: string;
1818
- backgroundColor: string;
1819
- borderColor: string;
1820
- } | {
1821
- color: string;
1822
- backgroundColor: string;
1823
- borderColor: string;
1824
- } | {
1825
- color: string;
1826
- backgroundColor: string;
1827
- borderColor: string;
1828
- };
1829
- };
1830
- };
1831
- }>;
1832
- tooltip: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "trigger" | "arrow" | "arrowTip" | "positioner", {
1833
- variant: {
1834
- dark: {
1835
- content: {
1836
- '--tooltip-bg': "colors.background.contrast";
1837
- color: "text/on-contrast";
1838
- };
1839
- };
1840
- light: {
1841
- content: {
1842
- '--tooltip-bg': "colors.background.tertiary";
1843
- color: "text/primary";
1844
- };
1845
- };
1846
- };
1847
- paddingSize: {
1848
- sm: {
1849
- content: {
1850
- paddingInline: "8";
1851
- paddingBlock: "4";
1852
- borderRadius: "4";
1853
- };
1854
- };
1855
- md: {
1856
- content: {
1857
- paddingInline: "12";
1858
- paddingBlock: "8";
1859
- borderRadius: "8";
1860
- };
1861
- };
1862
- lg: {
1863
- content: {
1864
- padding: "16";
1865
- borderRadius: "8";
1866
- };
1867
- };
1868
- };
1869
- textStyle: {
1870
- 'sm/regular': {
1871
- content: {
1872
- textStyle: "body/sm/regular";
1873
- };
1874
- };
1875
- 'sm/semibold': {
1876
- content: {
1877
- textStyle: "body/sm/semibold";
1878
- };
1879
- };
1880
- 'md/regular': {
1881
- content: {
1882
- textStyle: "body/md/regular";
1883
- };
1884
- };
1885
- };
1886
- }>;
1887
- treeView: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "secondaryText" | "root" | "item" | "itemIndicator" | "tree" | "itemText" | "branch" | "branchContent" | "branchControl" | "branchIndentGuide" | "branchIndicator" | "branchText" | "branchTrigger" | "nodeCheckbox" | "nodeRenameInput" | "actionGroup" | "suffixGroup", {
1888
- variant: {
1889
- files: {
1890
- branchControl: {
1891
- borderRadius: "4";
1892
- paddingInlineEnd: "16";
1893
- '& > svg': {
1894
- marginBlockStart: "8";
1895
- };
1896
- '& > .badge': {
1897
- marginBlockStart: "6";
1898
- };
1899
- };
1900
- item: {
1901
- borderRadius: "4";
1902
- paddingInlineEnd: "16";
1903
- '& > svg': {
1904
- marginBlockStart: "8";
1905
- };
1906
- '& > .badge': {
1907
- marginBlockStart: "6";
1908
- };
1909
- };
1910
- branchIndicator: {
1911
- alignItems: "flex-start";
1912
- marginBlockStart: "8";
1913
- alignSelf: "stretch";
1914
- position: "relative";
1915
- _open: {
1916
- '&::after': {
1917
- content: "\"\"";
1918
- position: "absolute";
1919
- insetBlockStart: "16";
1920
- insetBlockEnd: number;
1921
- insetInlineStart: "50%";
1922
- width: "1";
1923
- background: "border/regular";
1924
- };
1925
- };
1926
- };
1927
- branchText: {
1928
- paddingBlock: "6";
1929
- };
1930
- itemText: {
1931
- paddingBlock: "6";
1932
- };
1933
- suffixGroup: {
1934
- height: string;
1935
- '& > span': {
1936
- marginBlockEnd: "-1";
1937
- };
1938
- };
1939
- branchIndentGuide: {
1940
- height: "100%";
1941
- width: "1";
1942
- background: "border/regular";
1943
- position: "absolute";
1944
- insetBlockStart: number;
1945
- '--tree-depth': "calc(var(--depth) - 1)";
1946
- '--tree-indentation-offset': "calc(var(--tree-indentation) * var(--tree-depth))";
1947
- '--tree-offset': "calc(var(--tree-padding-inline-start) + var(--tree-indentation-offset))";
1948
- '--tree-icon-offset': "calc(var(--tree-icon-size) * 0.5 * var(--depth))";
1949
- insetInlineStart: "calc(var(--tree-offset) + var(--tree-icon-offset))";
1950
- zIndex: number;
1951
- };
1952
- };
1953
- navigation: {
1954
- branchControl: {
1955
- borderRadius: number;
1956
- paddingInlineEnd: "16";
1957
- '&::before': {
1958
- content: "\"\"";
1959
- position: "absolute";
1960
- insetBlockStart: number;
1961
- insetInlineStart: "var(--tree-offset)";
1962
- insetInlineEnd: number;
1963
- height: "1";
1964
- background: "border/minimal";
1965
- };
1966
- _selected: {
1967
- '&::after': {
1968
- content: "\"\"";
1969
- position: "absolute";
1970
- insetBlock: number;
1971
- insetInlineEnd: number;
1972
- width: "4";
1973
- background: "border/selected";
1974
- borderRadius: "0 2px 2px 0";
1975
- };
1976
- };
1977
- };
1978
- item: {
1979
- borderRadius: number;
1980
- paddingInlineEnd: "16";
1981
- '&::before': {
1982
- content: "\"\"";
1983
- position: "absolute";
1984
- insetBlockStart: number;
1985
- insetInlineStart: "var(--tree-offset)";
1986
- insetInlineEnd: number;
1987
- height: "1";
1988
- background: "border/minimal";
1989
- };
1990
- '& > svg': {
1991
- marginBlockStart: string;
1992
- };
1993
- _selected: {
1994
- '&::after': {
1995
- content: "\"\"";
1996
- position: "absolute";
1997
- insetBlock: number;
1998
- insetInlineEnd: number;
1999
- width: "4";
2000
- background: "border/selected";
2001
- borderRadius: "0 2px 2px 0";
2002
- };
2003
- };
2004
- };
2005
- branchIndicator: {
2006
- marginBlockStart: "8";
2007
- transformOrigin: "center";
2008
- transitionDuration: "normal";
2009
- transitionProperty: "transform";
2010
- transitionTimingFunction: "default";
2011
- _open: {
2012
- transform: "rotate(90deg)";
2013
- };
2014
- };
2015
- branchText: {
2016
- paddingBlock: "8";
2017
- gap: "4";
2018
- _open: {
2019
- textStyle: "body/md/semibold";
2020
- color: "text/primary";
2021
- };
2022
- };
2023
- itemText: {
2024
- paddingBlock: "8";
2025
- };
2026
- suffixGroup: {
2027
- height: string;
2028
- '& > span': {
2029
- marginBlockEnd: "-1";
2030
- };
2031
- };
2032
- branchIndentGuide: {
2033
- display: "none";
2034
- };
2035
- };
2036
- };
2037
- }>;
2038
- };
2039
- export default slotRecipes;