@bitrise/bitkit-v2 0.3.152 → 0.3.153

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,35 @@
1
+ declare const dialogSlotRecipe: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "label" | "title" | "trigger" | "positioner" | "closeTrigger" | "description" | "backdrop" | "scrollBody" | "scrollButton" | "scrollGradient", {
2
+ scrollBehavior: {
3
+ inside: {
4
+ body: {
5
+ overflowY: "auto";
6
+ _last: {
7
+ paddingBlockEnd: number;
8
+ };
9
+ };
10
+ content: {
11
+ maxHeight: "calc(100dvh - 96px)";
12
+ overflow: "hidden";
13
+ };
14
+ };
15
+ outside: {};
16
+ };
17
+ size: {
18
+ lg: {
19
+ content: {
20
+ width: string;
21
+ };
22
+ };
23
+ md: {
24
+ content: {
25
+ width: string;
26
+ };
27
+ };
28
+ sm: {
29
+ content: {
30
+ width: string;
31
+ };
32
+ };
33
+ };
34
+ }>;
35
+ export default dialogSlotRecipe;
@@ -0,0 +1,171 @@
1
+ import { dialogAnatomy as o } from "@chakra-ui/react/anatomy";
2
+ import { defineSlotRecipe as t } from "@chakra-ui/react/styled-system";
3
+ import { rem as e } from "../themeUtils.js";
4
+ const a = t({
5
+ className: "dialog",
6
+ slots: [...o.keys(), "label", "scrollBody", "scrollButton", "scrollGradient"],
7
+ base: {
8
+ backdrop: {
9
+ background: "utilities/overlay",
10
+ position: "fixed",
11
+ inset: "0",
12
+ zIndex: "dialogOverlay",
13
+ _open: {
14
+ animationStyle: "fade-in",
15
+ animationDuration: "moderate"
16
+ },
17
+ _closed: {
18
+ animationStyle: "fade-out",
19
+ animationDuration: "moderate"
20
+ }
21
+ },
22
+ positioner: {
23
+ alignItems: "center",
24
+ display: "flex",
25
+ height: "100dvh",
26
+ justifyContent: "center",
27
+ left: "0",
28
+ position: "fixed",
29
+ top: "0",
30
+ width: "100dvw",
31
+ zIndex: "dialog"
32
+ },
33
+ content: {
34
+ background: "background/primary",
35
+ borderRadius: "8",
36
+ boxShadow: "elevation/lg",
37
+ display: "flex",
38
+ flexDirection: "column",
39
+ outline: "none",
40
+ position: "relative",
41
+ _open: {
42
+ animationStyle: "scale-fade-in",
43
+ animationDuration: "moderate"
44
+ },
45
+ _closed: {
46
+ animationStyle: "scale-fade-out",
47
+ animationDuration: "faster"
48
+ }
49
+ },
50
+ header: {
51
+ display: "flex",
52
+ flexDirection: "column",
53
+ gap: "16",
54
+ paddingBlock: "24",
55
+ paddingInline: "32",
56
+ position: "relative"
57
+ },
58
+ title: {
59
+ color: "text/primary",
60
+ paddingInlineEnd: "48",
61
+ textStyle: "comp/dialog/title"
62
+ },
63
+ description: {
64
+ color: "text/body",
65
+ textStyle: "body/lg/regular"
66
+ },
67
+ label: {
68
+ color: "text/secondary",
69
+ textStyle: "comp/dialog/label"
70
+ },
71
+ body: {
72
+ display: "flex",
73
+ flex: "1",
74
+ flexDirection: "column",
75
+ gap: "24",
76
+ paddingInline: "32",
77
+ _last: {
78
+ paddingBlockEnd: "48"
79
+ }
80
+ },
81
+ scrollBody: {
82
+ display: "flex",
83
+ flexDirection: "column",
84
+ minHeight: 0,
85
+ position: "relative",
86
+ _last: {
87
+ paddingBlockEnd: "48"
88
+ }
89
+ },
90
+ footer: {
91
+ alignItems: "center",
92
+ display: "flex",
93
+ gap: "16",
94
+ justifyContent: "flex-end",
95
+ paddingBlockEnd: "32",
96
+ paddingBlockStart: "24",
97
+ paddingInline: "32"
98
+ },
99
+ closeTrigger: {
100
+ insetEnd: "24",
101
+ position: "absolute",
102
+ top: "24"
103
+ },
104
+ scrollButton: {
105
+ alignItems: "center",
106
+ alignSelf: "center",
107
+ background: "background/primary",
108
+ borderColor: "border/minimal",
109
+ borderRadius: "100%",
110
+ borderWidth: "1px",
111
+ bottom: "16",
112
+ boxShadow: "elevation/lg",
113
+ cursor: "pointer",
114
+ display: "flex",
115
+ height: "32",
116
+ justifyContent: "center",
117
+ position: "absolute",
118
+ width: "32"
119
+ },
120
+ scrollGradient: {
121
+ background: "linear-gradient(0deg, white 0%, rgba(255, 255, 255, 0) 100%)",
122
+ bottom: "0",
123
+ height: "32",
124
+ pointerEvents: "none",
125
+ position: "absolute",
126
+ width: "100%"
127
+ }
128
+ },
129
+ variants: {
130
+ scrollBehavior: {
131
+ inside: {
132
+ body: {
133
+ overflowY: "auto",
134
+ _last: {
135
+ paddingBlockEnd: 0
136
+ // override base _last: scrollBody slot handles padding instead
137
+ }
138
+ },
139
+ content: {
140
+ maxHeight: "calc(100dvh - 96px)",
141
+ overflow: "hidden"
142
+ }
143
+ },
144
+ outside: {}
145
+ },
146
+ size: {
147
+ lg: {
148
+ content: {
149
+ width: e(800)
150
+ }
151
+ },
152
+ md: {
153
+ content: {
154
+ width: e(640)
155
+ }
156
+ },
157
+ sm: {
158
+ content: {
159
+ width: e(480)
160
+ }
161
+ }
162
+ }
163
+ },
164
+ defaultVariants: {
165
+ scrollBehavior: "outside",
166
+ size: "md"
167
+ }
168
+ });
169
+ export {
170
+ a as default
171
+ };
@@ -1,4 +1,5 @@
1
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">>;
2
3
  actionBar: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "separator" | "positioner" | "selectionTrigger" | "closeTrigger", {
3
4
  size: {
4
5
  md: {
@@ -24,6 +25,70 @@ declare const slotRecipes: {
24
25
  };
25
26
  };
26
27
  }>;
28
+ alert: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "description" | "indicator", {
29
+ variant: {
30
+ ai: {
31
+ root: {
32
+ border: "1px solid transparent";
33
+ background: "{colors.status.ai.bg} padding-box, {colors.status.ai.border} border-box";
34
+ color: "status/ai/text";
35
+ };
36
+ indicator: {
37
+ color: "status/ai/icon";
38
+ };
39
+ };
40
+ critical: {
41
+ root: {
42
+ backgroundColor: "status/critical/bg";
43
+ borderColor: "status/critical/border";
44
+ color: "status/critical/text";
45
+ };
46
+ indicator: {
47
+ color: "status/critical/icon";
48
+ };
49
+ };
50
+ info: {
51
+ root: {
52
+ backgroundColor: "status/info/bg";
53
+ borderColor: "status/info/border";
54
+ color: "status/info/text";
55
+ };
56
+ indicator: {
57
+ color: "status/info/icon";
58
+ };
59
+ };
60
+ progress: {
61
+ root: {
62
+ backgroundColor: "status/progress/bg";
63
+ borderColor: "status/progress/border";
64
+ color: "status/progress/text";
65
+ };
66
+ indicator: {
67
+ color: "status/progress/icon";
68
+ };
69
+ };
70
+ success: {
71
+ root: {
72
+ backgroundColor: "status/success/bg";
73
+ borderColor: "status/success/border";
74
+ color: "status/success/text";
75
+ };
76
+ indicator: {
77
+ color: "status/success/icon";
78
+ };
79
+ };
80
+ warning: {
81
+ root: {
82
+ backgroundColor: "status/warning/bg";
83
+ borderColor: "status/warning/border";
84
+ color: "status/warning/text";
85
+ };
86
+ indicator: {
87
+ color: "status/warning/icon";
88
+ };
89
+ };
90
+ };
91
+ }>;
27
92
  avatar: import('@chakra-ui/react').SlotRecipeDefinition<"image" | "badge" | "icon" | "root" | "fallback" | "badgeContainer", {
28
93
  size: {
29
94
  '24': {
@@ -218,6 +283,46 @@ declare const slotRecipes: {
218
283
  };
219
284
  };
220
285
  }>;
286
+ checkbox: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "indicator" | "group" | "control", {
287
+ size: {
288
+ md: {
289
+ control: {
290
+ width: "20";
291
+ height: "20";
292
+ '& > svg': {
293
+ width: "20";
294
+ height: "20";
295
+ };
296
+ };
297
+ label: {
298
+ textStyle: "body/md/regular";
299
+ };
300
+ };
301
+ lg: {
302
+ control: {
303
+ width: "24";
304
+ height: "24";
305
+ '& > svg': {
306
+ width: "24";
307
+ height: "24";
308
+ };
309
+ };
310
+ label: {
311
+ textStyle: "body/lg/regular";
312
+ };
313
+ };
314
+ };
315
+ }>;
316
+ combobox: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "input" | "label" | "root" | "item" | "itemIndicator" | "trigger" | "positioner" | "list" | "clearTrigger" | "control" | "itemText" | "itemGroup" | "itemGroupLabel" | "indicatorGroup" | "empty" | "emptyHelperText", {
317
+ size: {
318
+ md: {
319
+ input: import('@chakra-ui/react').SystemStyleObject;
320
+ };
321
+ lg: {
322
+ input: import('@chakra-ui/react').SystemStyleObject;
323
+ };
324
+ };
325
+ }>;
221
326
  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", {
222
327
  layout: {
223
328
  '1-month': {
@@ -283,43 +388,37 @@ declare const slotRecipes: {
283
388
  };
284
389
  };
285
390
  }>;
286
- checkbox: import('@chakra-ui/react').SlotRecipeDefinition<"label" | "root" | "indicator" | "group" | "control", {
287
- size: {
288
- md: {
289
- control: {
290
- width: "20";
291
- height: "20";
292
- '& > svg': {
293
- width: "20";
294
- height: "20";
391
+ dialog: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "body" | "footer" | "header" | "label" | "title" | "trigger" | "positioner" | "closeTrigger" | "description" | "backdrop" | "scrollBody" | "scrollButton" | "scrollGradient", {
392
+ scrollBehavior: {
393
+ inside: {
394
+ body: {
395
+ overflowY: "auto";
396
+ _last: {
397
+ paddingBlockEnd: number;
295
398
  };
296
399
  };
297
- label: {
298
- textStyle: "body/md/regular";
400
+ content: {
401
+ maxHeight: "calc(100dvh - 96px)";
402
+ overflow: "hidden";
299
403
  };
300
404
  };
405
+ outside: {};
406
+ };
407
+ size: {
301
408
  lg: {
302
- control: {
303
- width: "24";
304
- height: "24";
305
- '& > svg': {
306
- width: "24";
307
- height: "24";
308
- };
309
- };
310
- label: {
311
- textStyle: "body/lg/regular";
409
+ content: {
410
+ width: string;
312
411
  };
313
412
  };
314
- };
315
- }>;
316
- combobox: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "input" | "label" | "root" | "item" | "itemIndicator" | "trigger" | "positioner" | "list" | "clearTrigger" | "control" | "itemText" | "itemGroup" | "itemGroupLabel" | "indicatorGroup" | "empty" | "emptyHelperText", {
317
- size: {
318
413
  md: {
319
- input: import('@chakra-ui/react').SystemStyleObject;
414
+ content: {
415
+ width: string;
416
+ };
320
417
  };
321
- lg: {
322
- input: import('@chakra-ui/react').SystemStyleObject;
418
+ sm: {
419
+ content: {
420
+ width: string;
421
+ };
323
422
  };
324
423
  };
325
424
  }>;
@@ -362,6 +461,25 @@ declare const slotRecipes: {
362
461
  }>;
363
462
  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">>;
364
463
  fieldset: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "legend" | "root" | "helperText" | "errorText", import('@chakra-ui/react').SlotRecipeVariantRecord<"content" | "legend" | "root" | "helperText" | "errorText">>;
464
+ menu: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "separator" | "item" | "itemIndicator" | "trigger" | "arrow" | "arrowTip" | "positioner" | "indicator" | "itemText" | "itemGroup" | "itemGroupLabel" | "contextTrigger" | "triggerItem" | "itemCommand" | "itemHelper", {
465
+ size: {
466
+ lg: {
467
+ item: {
468
+ paddingY: "12";
469
+ textStyle: "body/lg/regular";
470
+ };
471
+ };
472
+ md: {
473
+ item: {
474
+ _icon: {
475
+ marginTop: "2";
476
+ };
477
+ paddingY: "8";
478
+ textStyle: "body/md/regular";
479
+ };
480
+ };
481
+ };
482
+ }>;
365
483
  nativeSelect: import('@chakra-ui/react').SlotRecipeDefinition<"field" | "root" | "indicator" | "statusIcon", {
366
484
  size: {
367
485
  md: {
@@ -380,70 +498,6 @@ declare const slotRecipes: {
380
498
  };
381
499
  };
382
500
  }>;
383
- alert: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "title" | "root" | "description" | "indicator", {
384
- variant: {
385
- ai: {
386
- root: {
387
- border: "1px solid transparent";
388
- background: "{colors.status.ai.bg} padding-box, {colors.status.ai.border} border-box";
389
- color: "status/ai/text";
390
- };
391
- indicator: {
392
- color: "status/ai/icon";
393
- };
394
- };
395
- critical: {
396
- root: {
397
- backgroundColor: "status/critical/bg";
398
- borderColor: "status/critical/border";
399
- color: "status/critical/text";
400
- };
401
- indicator: {
402
- color: "status/critical/icon";
403
- };
404
- };
405
- info: {
406
- root: {
407
- backgroundColor: "status/info/bg";
408
- borderColor: "status/info/border";
409
- color: "status/info/text";
410
- };
411
- indicator: {
412
- color: "status/info/icon";
413
- };
414
- };
415
- progress: {
416
- root: {
417
- backgroundColor: "status/progress/bg";
418
- borderColor: "status/progress/border";
419
- color: "status/progress/text";
420
- };
421
- indicator: {
422
- color: "status/progress/icon";
423
- };
424
- };
425
- success: {
426
- root: {
427
- backgroundColor: "status/success/bg";
428
- borderColor: "status/success/border";
429
- color: "status/success/text";
430
- };
431
- indicator: {
432
- color: "status/success/icon";
433
- };
434
- };
435
- warning: {
436
- root: {
437
- backgroundColor: "status/warning/bg";
438
- borderColor: "status/warning/border";
439
- color: "status/warning/text";
440
- };
441
- indicator: {
442
- color: "status/warning/icon";
443
- };
444
- };
445
- };
446
- }>;
447
501
  numberInput: import('@chakra-ui/react').SlotRecipeDefinition<"input" | "label" | "root" | "control" | "valueText" | "incrementTrigger" | "decrementTrigger" | "scrubber", {
448
502
  size: {
449
503
  md: {
@@ -703,25 +757,5 @@ declare const slotRecipes: {
703
757
  };
704
758
  };
705
759
  }>;
706
- 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">>;
707
- menu: import('@chakra-ui/react').SlotRecipeDefinition<"content" | "separator" | "item" | "itemIndicator" | "trigger" | "arrow" | "arrowTip" | "positioner" | "indicator" | "itemText" | "itemGroup" | "itemGroupLabel" | "contextTrigger" | "triggerItem" | "itemCommand" | "itemHelper", {
708
- size: {
709
- lg: {
710
- item: {
711
- paddingY: "12";
712
- textStyle: "body/lg/regular";
713
- };
714
- };
715
- md: {
716
- item: {
717
- _icon: {
718
- marginTop: "2";
719
- };
720
- paddingY: "8";
721
- textStyle: "body/md/regular";
722
- };
723
- };
724
- };
725
- }>;
726
760
  };
727
761
  export default slotRecipes;
@@ -8,48 +8,50 @@ import m from "./Checkbox.recipe.js";
8
8
  import c from "./Combobox.recipe.js";
9
9
  import l from "./DatePicker.recipe.js";
10
10
  import a from "./DatePickerSelect.recipe.js";
11
- import S from "./EmptyState.recipe.js";
12
- import f from "./ExpandableCard.recipe.js";
13
- import R from "./Field.recipe.js";
14
- import d from "./Fieldset.recipe.js";
15
- import b from "./Menu.recipe.js";
16
- import n from "./NativeSelect.recipe.js";
17
- import s from "./NumberInput.recipe.js";
18
- import u from "./RadioGroup.recipe.js";
19
- import x from "./SegmentGroup.recipe.js";
11
+ import S from "./Dialog.recipe.js";
12
+ import f from "./EmptyState.recipe.js";
13
+ import R from "./ExpandableCard.recipe.js";
14
+ import d from "./Field.recipe.js";
15
+ import b from "./Fieldset.recipe.js";
16
+ import n from "./Menu.recipe.js";
17
+ import s from "./NativeSelect.recipe.js";
18
+ import u from "./NumberInput.recipe.js";
19
+ import x from "./RadioGroup.recipe.js";
20
+ import g from "./SegmentGroup.recipe.js";
20
21
  import { selectSlotRecipe as k } from "./Select.recipe.js";
21
- import g from "./Switch.recipe.js";
22
- import h from "./Table.recipe.js";
23
- import v from "./Tabs.recipe.js";
24
- import G from "./Tag.recipe.js";
25
- import P from "./Tooltip.recipe.js";
26
- const Y = {
22
+ import h from "./Switch.recipe.js";
23
+ import v from "./Table.recipe.js";
24
+ import G from "./Tabs.recipe.js";
25
+ import P from "./Tag.recipe.js";
26
+ import w from "./Tooltip.recipe.js";
27
+ const _ = {
28
+ accordion: e,
27
29
  actionBar: o,
30
+ alert: t,
28
31
  avatar: r,
29
32
  breadcrumb: i,
30
33
  card: p,
31
- datePicker: l,
32
- datePickerSelect: a,
33
34
  checkbox: m,
34
35
  combobox: c,
35
- emptyState: S,
36
- expandableCard: f,
37
- field: R,
38
- fieldset: d,
39
- nativeSelect: n,
40
- alert: t,
41
- numberInput: s,
42
- radioGroup: u,
43
- segmentGroup: x,
36
+ datePicker: l,
37
+ datePickerSelect: a,
38
+ dialog: S,
39
+ emptyState: f,
40
+ expandableCard: R,
41
+ field: d,
42
+ fieldset: b,
43
+ menu: n,
44
+ nativeSelect: s,
45
+ numberInput: u,
46
+ radioGroup: x,
47
+ segmentGroup: g,
44
48
  select: k,
45
- switch: g,
46
- table: h,
47
- tabs: v,
48
- tag: G,
49
- tooltip: P,
50
- accordion: e,
51
- menu: b
49
+ switch: h,
50
+ table: v,
51
+ tabs: G,
52
+ tag: P,
53
+ tooltip: w
52
54
  };
53
55
  export {
54
- Y as default
56
+ _ as default
55
57
  };
package/package.json CHANGED
@@ -1,7 +1,7 @@
1
1
  {
2
2
  "name": "@bitrise/bitkit-v2",
3
3
  "private": false,
4
- "version": "0.3.152",
4
+ "version": "0.3.153",
5
5
  "description": "Bitrise Design System Components built with Chakra UI V3",
6
6
  "keywords": [
7
7
  "react",