@metamask-previews/design-system-react 0.6.1-preview.ab80aae → 0.6.1-preview.abc15cd
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.
- package/dist/components/AvatarGroup/AvatarGroup.d.cts +5 -5
- package/dist/components/AvatarGroup/AvatarGroup.d.cts.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.d.mts +5 -5
- package/dist/components/AvatarGroup/AvatarGroup.d.mts.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.types.cjs.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.types.d.cts +5 -5
- package/dist/components/AvatarGroup/AvatarGroup.types.d.cts.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.types.d.mts +5 -5
- package/dist/components/AvatarGroup/AvatarGroup.types.d.mts.map +1 -1
- package/dist/components/AvatarGroup/AvatarGroup.types.mjs.map +1 -1
- package/dist/components/Button/Button.types.cjs.map +1 -1
- package/dist/components/Button/Button.types.d.cts +3 -3
- package/dist/components/Button/Button.types.d.cts.map +1 -1
- package/dist/components/Button/Button.types.d.mts +3 -3
- package/dist/components/Button/Button.types.d.mts.map +1 -1
- package/dist/components/Button/Button.types.mjs.map +1 -1
- package/dist/components/ButtonIcon/ButtonIcon.constants.d.cts +4 -3
- package/dist/components/ButtonIcon/ButtonIcon.constants.d.cts.map +1 -1
- package/dist/components/ButtonIcon/ButtonIcon.constants.d.mts +4 -3
- package/dist/components/ButtonIcon/ButtonIcon.constants.d.mts.map +1 -1
- package/dist/types/index.cjs +385 -274
- package/dist/types/index.cjs.map +1 -1
- package/dist/types/index.d.cts +261 -291
- package/dist/types/index.d.cts.map +1 -1
- package/dist/types/index.d.mts +261 -291
- package/dist/types/index.d.mts.map +1 -1
- package/dist/types/index.mjs +385 -261
- package/dist/types/index.mjs.map +1 -1
- package/package.json +3 -3
package/dist/types/index.mjs
CHANGED
|
@@ -1,25 +1,29 @@
|
|
|
1
|
-
|
|
1
|
+
/**
|
|
2
|
+
* AvatarBase - size
|
|
3
|
+
*/
|
|
4
|
+
export var AvatarBaseSize;
|
|
5
|
+
(function (AvatarBaseSize) {
|
|
2
6
|
/**
|
|
3
7
|
* Represents an extra small avatar size (16px).
|
|
4
8
|
*/
|
|
5
|
-
Xs
|
|
9
|
+
AvatarBaseSize["Xs"] = "xs";
|
|
6
10
|
/**
|
|
7
11
|
* Represents a small avatar size (24px).
|
|
8
12
|
*/
|
|
9
|
-
Sm
|
|
13
|
+
AvatarBaseSize["Sm"] = "sm";
|
|
10
14
|
/**
|
|
11
15
|
* Represents a medium avatar size (32px).
|
|
12
16
|
*/
|
|
13
|
-
Md
|
|
17
|
+
AvatarBaseSize["Md"] = "md";
|
|
14
18
|
/**
|
|
15
19
|
* Represents a large avatar size (40px).
|
|
16
20
|
*/
|
|
17
|
-
Lg
|
|
21
|
+
AvatarBaseSize["Lg"] = "lg";
|
|
18
22
|
/**
|
|
19
23
|
* Represents an extra large avatar size (48px).
|
|
20
24
|
*/
|
|
21
|
-
Xl
|
|
22
|
-
};
|
|
25
|
+
AvatarBaseSize["Xl"] = "xl";
|
|
26
|
+
})(AvatarBaseSize || (AvatarBaseSize = {}));
|
|
23
27
|
export { AvatarBaseSize as AvatarAccountSize };
|
|
24
28
|
export { AvatarBaseSize as AvatarFaviconSize };
|
|
25
29
|
export { AvatarBaseSize as AvatarGroupSize };
|
|
@@ -27,427 +31,547 @@ export { AvatarBaseSize as AvatarIconSize };
|
|
|
27
31
|
export { AvatarBaseSize as AvatarNetworkSize };
|
|
28
32
|
export { AvatarBaseSize as AvatarTokenSize };
|
|
29
33
|
export { AvatarBaseSize as AvatarSize };
|
|
30
|
-
|
|
34
|
+
/**
|
|
35
|
+
* Avatar - shape
|
|
36
|
+
*/
|
|
37
|
+
export var AvatarShape;
|
|
38
|
+
(function (AvatarShape) {
|
|
31
39
|
/**
|
|
32
40
|
* Represents a circular Avatar.
|
|
33
41
|
*/
|
|
34
|
-
Circle
|
|
42
|
+
AvatarShape["Circle"] = "circle";
|
|
35
43
|
/**
|
|
36
44
|
* Represents a squared Avatar
|
|
37
45
|
*/
|
|
38
|
-
Square
|
|
39
|
-
};
|
|
46
|
+
AvatarShape["Square"] = "square";
|
|
47
|
+
})(AvatarShape || (AvatarShape = {}));
|
|
40
48
|
export { AvatarShape as AvatarBaseShape };
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
44
|
-
|
|
45
|
-
|
|
46
|
-
|
|
47
|
-
|
|
48
|
-
|
|
49
|
-
|
|
50
|
-
|
|
51
|
-
|
|
52
|
-
|
|
53
|
-
export
|
|
54
|
-
|
|
55
|
-
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
59
|
-
|
|
49
|
+
/**
|
|
50
|
+
* AvatarAccount - variant
|
|
51
|
+
*/
|
|
52
|
+
export var AvatarAccountVariant;
|
|
53
|
+
(function (AvatarAccountVariant) {
|
|
54
|
+
AvatarAccountVariant["Blockies"] = "blockies";
|
|
55
|
+
AvatarAccountVariant["Jazzicon"] = "jazzicon";
|
|
56
|
+
AvatarAccountVariant["Maskicon"] = "maskicon";
|
|
57
|
+
})(AvatarAccountVariant || (AvatarAccountVariant = {}));
|
|
58
|
+
/**
|
|
59
|
+
* AvatarIcon - severity
|
|
60
|
+
*/
|
|
61
|
+
export var AvatarIconSeverity;
|
|
62
|
+
(function (AvatarIconSeverity) {
|
|
63
|
+
AvatarIconSeverity["Neutral"] = "neutral";
|
|
64
|
+
AvatarIconSeverity["Info"] = "info";
|
|
65
|
+
AvatarIconSeverity["Success"] = "success";
|
|
66
|
+
// eslint-disable-next-line @typescript-eslint/no-shadow
|
|
67
|
+
AvatarIconSeverity["Error"] = "error";
|
|
68
|
+
AvatarIconSeverity["Warning"] = "warning";
|
|
69
|
+
})(AvatarIconSeverity || (AvatarIconSeverity = {}));
|
|
70
|
+
/**
|
|
71
|
+
* AvatarGroup - variant
|
|
72
|
+
*/
|
|
73
|
+
export var AvatarGroupVariant;
|
|
74
|
+
(function (AvatarGroupVariant) {
|
|
75
|
+
AvatarGroupVariant["Account"] = "Account";
|
|
76
|
+
AvatarGroupVariant["Favicon"] = "Favicon";
|
|
77
|
+
AvatarGroupVariant["Network"] = "Network";
|
|
78
|
+
AvatarGroupVariant["Token"] = "Token";
|
|
79
|
+
})(AvatarGroupVariant || (AvatarGroupVariant = {}));
|
|
80
|
+
/**
|
|
81
|
+
* BadgeCount - size
|
|
82
|
+
*/
|
|
83
|
+
export var BadgeCountSize;
|
|
84
|
+
(function (BadgeCountSize) {
|
|
60
85
|
/**
|
|
61
86
|
* Represents a medium badge count (14px height).
|
|
62
87
|
*/
|
|
63
|
-
Md
|
|
88
|
+
BadgeCountSize["Md"] = "md";
|
|
64
89
|
/**
|
|
65
90
|
* Represents a large badge count (20px height).
|
|
66
91
|
*/
|
|
67
|
-
Lg
|
|
68
|
-
};
|
|
69
|
-
|
|
70
|
-
|
|
71
|
-
|
|
72
|
-
|
|
73
|
-
|
|
74
|
-
|
|
75
|
-
|
|
76
|
-
|
|
92
|
+
BadgeCountSize["Lg"] = "lg";
|
|
93
|
+
})(BadgeCountSize || (BadgeCountSize = {}));
|
|
94
|
+
/**
|
|
95
|
+
* BadgeStatus - status
|
|
96
|
+
*/
|
|
97
|
+
export var BadgeStatusStatus;
|
|
98
|
+
(function (BadgeStatusStatus) {
|
|
99
|
+
BadgeStatusStatus["Active"] = "active";
|
|
100
|
+
BadgeStatusStatus["Inactive"] = "inactive";
|
|
101
|
+
BadgeStatusStatus["Disconnected"] = "disconnected";
|
|
102
|
+
BadgeStatusStatus["New"] = "new";
|
|
103
|
+
BadgeStatusStatus["Attention"] = "attention";
|
|
104
|
+
})(BadgeStatusStatus || (BadgeStatusStatus = {}));
|
|
105
|
+
/**
|
|
106
|
+
* BadgeStatus - size
|
|
107
|
+
*/
|
|
108
|
+
export var BadgeStatusSize;
|
|
109
|
+
(function (BadgeStatusSize) {
|
|
77
110
|
/**
|
|
78
111
|
* Represents a medium badge status size (8px).
|
|
79
112
|
*/
|
|
80
|
-
Md
|
|
113
|
+
BadgeStatusSize["Md"] = "md";
|
|
81
114
|
/**
|
|
82
115
|
* Represents a large avatar size (10px).
|
|
83
116
|
*/
|
|
84
|
-
Lg
|
|
85
|
-
};
|
|
86
|
-
|
|
87
|
-
|
|
88
|
-
|
|
89
|
-
|
|
90
|
-
|
|
91
|
-
|
|
92
|
-
|
|
93
|
-
|
|
94
|
-
|
|
95
|
-
|
|
96
|
-
|
|
97
|
-
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
|
|
102
|
-
|
|
103
|
-
|
|
104
|
-
|
|
105
|
-
|
|
106
|
-
|
|
107
|
-
export
|
|
108
|
-
|
|
109
|
-
|
|
110
|
-
|
|
111
|
-
|
|
112
|
-
|
|
113
|
-
};
|
|
114
|
-
|
|
115
|
-
|
|
116
|
-
|
|
117
|
-
|
|
118
|
-
|
|
119
|
-
|
|
120
|
-
|
|
121
|
-
|
|
122
|
-
|
|
117
|
+
BadgeStatusSize["Lg"] = "lg";
|
|
118
|
+
})(BadgeStatusSize || (BadgeStatusSize = {}));
|
|
119
|
+
/**
|
|
120
|
+
* BadgeWrapper - positionAnchorShape
|
|
121
|
+
*/
|
|
122
|
+
export var BadgeWrapperPositionAnchorShape;
|
|
123
|
+
(function (BadgeWrapperPositionAnchorShape) {
|
|
124
|
+
BadgeWrapperPositionAnchorShape["Rectangular"] = "Rectangular";
|
|
125
|
+
BadgeWrapperPositionAnchorShape["Circular"] = "Circular";
|
|
126
|
+
})(BadgeWrapperPositionAnchorShape || (BadgeWrapperPositionAnchorShape = {}));
|
|
127
|
+
/**
|
|
128
|
+
* BadgeWrapper - position.
|
|
129
|
+
*/
|
|
130
|
+
export var BadgeWrapperPosition;
|
|
131
|
+
(function (BadgeWrapperPosition) {
|
|
132
|
+
BadgeWrapperPosition["TopRight"] = "TopRight";
|
|
133
|
+
BadgeWrapperPosition["BottomRight"] = "BottomRight";
|
|
134
|
+
BadgeWrapperPosition["BottomLeft"] = "BottomLeft";
|
|
135
|
+
BadgeWrapperPosition["TopLeft"] = "TopLeft";
|
|
136
|
+
})(BadgeWrapperPosition || (BadgeWrapperPosition = {}));
|
|
137
|
+
/**
|
|
138
|
+
* Box - flexDirection
|
|
139
|
+
*/
|
|
140
|
+
export var BoxFlexDirection;
|
|
141
|
+
(function (BoxFlexDirection) {
|
|
142
|
+
BoxFlexDirection["Row"] = "flex-row";
|
|
143
|
+
BoxFlexDirection["RowReverse"] = "flex-row-reverse";
|
|
144
|
+
BoxFlexDirection["Column"] = "flex-col";
|
|
145
|
+
BoxFlexDirection["ColumnReverse"] = "flex-col-reverse";
|
|
146
|
+
})(BoxFlexDirection || (BoxFlexDirection = {}));
|
|
147
|
+
/**
|
|
148
|
+
* Box - flexWrap
|
|
149
|
+
*/
|
|
150
|
+
export var BoxFlexWrap;
|
|
151
|
+
(function (BoxFlexWrap) {
|
|
152
|
+
BoxFlexWrap["NoWrap"] = "flex-nowrap";
|
|
153
|
+
BoxFlexWrap["Wrap"] = "flex-wrap";
|
|
154
|
+
BoxFlexWrap["WrapReverse"] = "flex-wrap-reverse";
|
|
155
|
+
})(BoxFlexWrap || (BoxFlexWrap = {}));
|
|
156
|
+
/**
|
|
157
|
+
* Box - alignItems
|
|
158
|
+
*/
|
|
159
|
+
export var BoxAlignItems;
|
|
160
|
+
(function (BoxAlignItems) {
|
|
161
|
+
BoxAlignItems["Start"] = "items-start";
|
|
162
|
+
BoxAlignItems["Center"] = "items-center";
|
|
163
|
+
BoxAlignItems["End"] = "items-end";
|
|
164
|
+
BoxAlignItems["Stretch"] = "items-stretch";
|
|
165
|
+
BoxAlignItems["Baseline"] = "items-baseline";
|
|
166
|
+
})(BoxAlignItems || (BoxAlignItems = {}));
|
|
167
|
+
/**
|
|
168
|
+
* Box - justifyContent
|
|
169
|
+
*/
|
|
170
|
+
export var BoxJustifyContent;
|
|
171
|
+
(function (BoxJustifyContent) {
|
|
172
|
+
BoxJustifyContent["Start"] = "justify-start";
|
|
173
|
+
BoxJustifyContent["Center"] = "justify-center";
|
|
174
|
+
BoxJustifyContent["End"] = "justify-end";
|
|
175
|
+
BoxJustifyContent["Between"] = "justify-between";
|
|
176
|
+
BoxJustifyContent["Around"] = "justify-around";
|
|
177
|
+
BoxJustifyContent["Evenly"] = "justify-evenly";
|
|
178
|
+
})(BoxJustifyContent || (BoxJustifyContent = {}));
|
|
179
|
+
/**
|
|
180
|
+
* Box - backgroundColor
|
|
181
|
+
*/
|
|
182
|
+
export var BoxBackgroundColor;
|
|
183
|
+
(function (BoxBackgroundColor) {
|
|
123
184
|
/** Default background color */
|
|
124
|
-
BackgroundDefault
|
|
185
|
+
BoxBackgroundColor["BackgroundDefault"] = "bg-default";
|
|
125
186
|
/** Alternative background color */
|
|
126
|
-
BackgroundAlternative
|
|
187
|
+
BoxBackgroundColor["BackgroundAlternative"] = "bg-alternative";
|
|
127
188
|
/** Section background color */
|
|
128
|
-
BackgroundSection
|
|
189
|
+
BoxBackgroundColor["BackgroundSection"] = "bg-section";
|
|
129
190
|
/** Subsection background color */
|
|
130
|
-
BackgroundSubsection
|
|
191
|
+
BoxBackgroundColor["BackgroundSubsection"] = "bg-subsection";
|
|
131
192
|
/** Muted background color */
|
|
132
|
-
BackgroundMuted
|
|
193
|
+
BoxBackgroundColor["BackgroundMuted"] = "bg-muted";
|
|
133
194
|
/** Primary default background color */
|
|
134
|
-
PrimaryDefault
|
|
195
|
+
BoxBackgroundColor["PrimaryDefault"] = "bg-primary-default";
|
|
135
196
|
/** Primary alternative background color */
|
|
136
|
-
PrimaryAlternative
|
|
197
|
+
BoxBackgroundColor["PrimaryAlternative"] = "bg-primary-alternative";
|
|
137
198
|
/** Primary muted background color */
|
|
138
|
-
PrimaryMuted
|
|
199
|
+
BoxBackgroundColor["PrimaryMuted"] = "bg-primary-muted";
|
|
139
200
|
/** Primary inverse background color */
|
|
140
|
-
PrimaryInverse
|
|
201
|
+
BoxBackgroundColor["PrimaryInverse"] = "bg-primary-inverse";
|
|
141
202
|
/** Error default background color */
|
|
142
|
-
ErrorDefault
|
|
203
|
+
BoxBackgroundColor["ErrorDefault"] = "bg-error-default";
|
|
143
204
|
/** Error alternative background color */
|
|
144
|
-
ErrorAlternative
|
|
205
|
+
BoxBackgroundColor["ErrorAlternative"] = "bg-error-alternative";
|
|
145
206
|
/** Error muted background color */
|
|
146
|
-
ErrorMuted
|
|
207
|
+
BoxBackgroundColor["ErrorMuted"] = "bg-error-muted";
|
|
147
208
|
/** Error inverse background color */
|
|
148
|
-
ErrorInverse
|
|
209
|
+
BoxBackgroundColor["ErrorInverse"] = "bg-error-inverse";
|
|
149
210
|
/** Warning default background color */
|
|
150
|
-
WarningDefault
|
|
211
|
+
BoxBackgroundColor["WarningDefault"] = "bg-warning-default";
|
|
151
212
|
/** Warning alternative background color */
|
|
152
|
-
WarningAlternative
|
|
213
|
+
BoxBackgroundColor["WarningAlternative"] = "bg-warning-alternative";
|
|
153
214
|
/** Warning muted background color */
|
|
154
|
-
WarningMuted
|
|
215
|
+
BoxBackgroundColor["WarningMuted"] = "bg-warning-muted";
|
|
155
216
|
/** Warning inverse background color */
|
|
156
|
-
WarningInverse
|
|
217
|
+
BoxBackgroundColor["WarningInverse"] = "bg-warning-inverse";
|
|
157
218
|
/** Success default background color */
|
|
158
|
-
SuccessDefault
|
|
219
|
+
BoxBackgroundColor["SuccessDefault"] = "bg-success-default";
|
|
159
220
|
/** Success alternative background color */
|
|
160
|
-
SuccessAlternative
|
|
221
|
+
BoxBackgroundColor["SuccessAlternative"] = "bg-success-alternative";
|
|
161
222
|
/** Success muted background color */
|
|
162
|
-
SuccessMuted
|
|
223
|
+
BoxBackgroundColor["SuccessMuted"] = "bg-success-muted";
|
|
163
224
|
/** Success inverse background color */
|
|
164
|
-
SuccessInverse
|
|
225
|
+
BoxBackgroundColor["SuccessInverse"] = "bg-success-inverse";
|
|
165
226
|
/** Info default background color */
|
|
166
|
-
InfoDefault
|
|
227
|
+
BoxBackgroundColor["InfoDefault"] = "bg-info-default";
|
|
167
228
|
/** Info muted background color */
|
|
168
|
-
InfoMuted
|
|
229
|
+
BoxBackgroundColor["InfoMuted"] = "bg-info-muted";
|
|
169
230
|
/** Info inverse background color */
|
|
170
|
-
InfoInverse
|
|
231
|
+
BoxBackgroundColor["InfoInverse"] = "bg-info-inverse";
|
|
171
232
|
/** Flask default background color */
|
|
172
|
-
FlaskDefault
|
|
233
|
+
BoxBackgroundColor["FlaskDefault"] = "bg-flask-default";
|
|
173
234
|
/** Flask inverse background color */
|
|
174
|
-
FlaskInverse
|
|
235
|
+
BoxBackgroundColor["FlaskInverse"] = "bg-flask-inverse";
|
|
175
236
|
/** Overlay alternative background color */
|
|
176
|
-
OverlayAlternative
|
|
237
|
+
BoxBackgroundColor["OverlayAlternative"] = "bg-overlay-alternative";
|
|
177
238
|
/** Overlay default background color */
|
|
178
|
-
OverlayDefault
|
|
239
|
+
BoxBackgroundColor["OverlayDefault"] = "bg-overlay-default";
|
|
179
240
|
/** Overlay inverse background color */
|
|
180
|
-
OverlayInverse
|
|
241
|
+
BoxBackgroundColor["OverlayInverse"] = "bg-overlay-inverse";
|
|
181
242
|
/** Transparent background color */
|
|
182
|
-
Transparent
|
|
183
|
-
};
|
|
184
|
-
|
|
243
|
+
BoxBackgroundColor["Transparent"] = "bg-transparent";
|
|
244
|
+
})(BoxBackgroundColor || (BoxBackgroundColor = {}));
|
|
245
|
+
/**
|
|
246
|
+
* Box - borderColor
|
|
247
|
+
*/
|
|
248
|
+
export var BoxBorderColor;
|
|
249
|
+
(function (BoxBorderColor) {
|
|
185
250
|
/** Background default for cut out effect */
|
|
186
|
-
BackgroundDefault
|
|
251
|
+
BoxBorderColor["BackgroundDefault"] = "border-background-default";
|
|
187
252
|
/** Default border color */
|
|
188
|
-
BorderDefault
|
|
253
|
+
BoxBorderColor["BorderDefault"] = "border-default";
|
|
189
254
|
/** Muted border color */
|
|
190
|
-
BorderMuted
|
|
255
|
+
BoxBorderColor["BorderMuted"] = "border-muted";
|
|
191
256
|
/** Primary default border color */
|
|
192
|
-
PrimaryDefault
|
|
257
|
+
BoxBorderColor["PrimaryDefault"] = "border-primary-default";
|
|
193
258
|
/** Primary alternative border color */
|
|
194
|
-
PrimaryAlternative
|
|
259
|
+
BoxBorderColor["PrimaryAlternative"] = "border-primary-alternative";
|
|
195
260
|
/** Primary muted border color */
|
|
196
|
-
PrimaryMuted
|
|
261
|
+
BoxBorderColor["PrimaryMuted"] = "border-primary-muted";
|
|
197
262
|
/** Primary inverse border color */
|
|
198
|
-
PrimaryInverse
|
|
263
|
+
BoxBorderColor["PrimaryInverse"] = "border-primary-inverse";
|
|
199
264
|
/** Error default border color */
|
|
200
|
-
ErrorDefault
|
|
265
|
+
BoxBorderColor["ErrorDefault"] = "border-error-default";
|
|
201
266
|
/** Error alternative border color */
|
|
202
|
-
ErrorAlternative
|
|
267
|
+
BoxBorderColor["ErrorAlternative"] = "border-error-alternative";
|
|
203
268
|
/** Error muted border color */
|
|
204
|
-
ErrorMuted
|
|
269
|
+
BoxBorderColor["ErrorMuted"] = "border-error-muted";
|
|
205
270
|
/** Error inverse border color */
|
|
206
|
-
ErrorInverse
|
|
271
|
+
BoxBorderColor["ErrorInverse"] = "border-error-inverse";
|
|
207
272
|
/** Warning default border color */
|
|
208
|
-
WarningDefault
|
|
273
|
+
BoxBorderColor["WarningDefault"] = "border-warning-default";
|
|
209
274
|
/** Warning alternative border color */
|
|
210
|
-
WarningAlternative
|
|
275
|
+
BoxBorderColor["WarningAlternative"] = "border-warning-alternative";
|
|
211
276
|
/** Warning muted border color */
|
|
212
|
-
WarningMuted
|
|
277
|
+
BoxBorderColor["WarningMuted"] = "border-warning-muted";
|
|
213
278
|
/** Warning inverse border color */
|
|
214
|
-
WarningInverse
|
|
279
|
+
BoxBorderColor["WarningInverse"] = "border-warning-inverse";
|
|
215
280
|
/** Success default border color */
|
|
216
|
-
SuccessDefault
|
|
281
|
+
BoxBorderColor["SuccessDefault"] = "border-success-default";
|
|
217
282
|
/** Success alternative border color */
|
|
218
|
-
SuccessAlternative
|
|
283
|
+
BoxBorderColor["SuccessAlternative"] = "border-success-alternative";
|
|
219
284
|
/** Success muted border color */
|
|
220
|
-
SuccessMuted
|
|
285
|
+
BoxBorderColor["SuccessMuted"] = "border-success-muted";
|
|
221
286
|
/** Success inverse border color */
|
|
222
|
-
SuccessInverse
|
|
287
|
+
BoxBorderColor["SuccessInverse"] = "border-success-inverse";
|
|
223
288
|
/** Info default border color */
|
|
224
|
-
InfoDefault
|
|
289
|
+
BoxBorderColor["InfoDefault"] = "border-info-default";
|
|
225
290
|
/** Info alternative border color */
|
|
226
|
-
InfoAlternative
|
|
291
|
+
BoxBorderColor["InfoAlternative"] = "border-info-alternative";
|
|
227
292
|
/** Info muted border color */
|
|
228
|
-
InfoMuted
|
|
293
|
+
BoxBorderColor["InfoMuted"] = "border-info-muted";
|
|
229
294
|
/** Info inverse border color */
|
|
230
|
-
InfoInverse
|
|
295
|
+
BoxBorderColor["InfoInverse"] = "border-info-inverse";
|
|
231
296
|
/** Flask default border color */
|
|
232
|
-
FlaskDefault
|
|
297
|
+
BoxBorderColor["FlaskDefault"] = "border-flask-default";
|
|
233
298
|
/** Flask inverse border color */
|
|
234
|
-
FlaskInverse
|
|
299
|
+
BoxBorderColor["FlaskInverse"] = "border-flask-inverse";
|
|
235
300
|
/** Overlay alternative border color */
|
|
236
|
-
OverlayAlternative
|
|
301
|
+
BoxBorderColor["OverlayAlternative"] = "border-overlay-alternative";
|
|
237
302
|
/** Overlay default border color */
|
|
238
|
-
OverlayDefault
|
|
303
|
+
BoxBorderColor["OverlayDefault"] = "border-overlay-default";
|
|
239
304
|
/** Overlay inverse border color */
|
|
240
|
-
OverlayInverse
|
|
305
|
+
BoxBorderColor["OverlayInverse"] = "border-overlay-inverse";
|
|
241
306
|
/** Transparent border color */
|
|
242
|
-
Transparent
|
|
243
|
-
};
|
|
244
|
-
|
|
307
|
+
BoxBorderColor["Transparent"] = "border-transparent";
|
|
308
|
+
})(BoxBorderColor || (BoxBorderColor = {}));
|
|
309
|
+
/**
|
|
310
|
+
* ButtonBase - size
|
|
311
|
+
*/
|
|
312
|
+
export var ButtonBaseSize;
|
|
313
|
+
(function (ButtonBaseSize) {
|
|
245
314
|
/**
|
|
246
315
|
* Represents a small button size (32px).
|
|
247
316
|
*/
|
|
248
|
-
Sm
|
|
317
|
+
ButtonBaseSize["Sm"] = "sm";
|
|
249
318
|
/**
|
|
250
319
|
* Represents a medium button size (40px).
|
|
251
320
|
*/
|
|
252
|
-
Md
|
|
321
|
+
ButtonBaseSize["Md"] = "md";
|
|
253
322
|
/**
|
|
254
323
|
* Represents a large button size (48px).
|
|
255
324
|
*/
|
|
256
|
-
Lg
|
|
257
|
-
};
|
|
325
|
+
ButtonBaseSize["Lg"] = "lg";
|
|
326
|
+
})(ButtonBaseSize || (ButtonBaseSize = {}));
|
|
258
327
|
export { ButtonBaseSize as ButtonPrimarySize };
|
|
259
328
|
export { ButtonBaseSize as ButtonSecondarySize };
|
|
260
329
|
export { ButtonBaseSize as ButtonTertiarySize };
|
|
261
330
|
export { ButtonBaseSize as ButtonHeroSize };
|
|
262
331
|
export { ButtonBaseSize as ButtonSize };
|
|
263
|
-
|
|
332
|
+
/**
|
|
333
|
+
* Button - variant
|
|
334
|
+
*/
|
|
335
|
+
export var ButtonVariant;
|
|
336
|
+
(function (ButtonVariant) {
|
|
264
337
|
/**
|
|
265
338
|
* Primary button variant - used for primary actions
|
|
266
339
|
*/
|
|
267
|
-
Primary
|
|
340
|
+
ButtonVariant["Primary"] = "primary";
|
|
268
341
|
/**
|
|
269
342
|
* Secondary button variant - used for secondary actions
|
|
270
343
|
*/
|
|
271
|
-
Secondary
|
|
344
|
+
ButtonVariant["Secondary"] = "secondary";
|
|
272
345
|
/**
|
|
273
346
|
* Tertiary button variant - used for tertiary-like actions
|
|
274
347
|
*/
|
|
275
|
-
Tertiary
|
|
276
|
-
};
|
|
277
|
-
|
|
348
|
+
ButtonVariant["Tertiary"] = "tertiary";
|
|
349
|
+
})(ButtonVariant || (ButtonVariant = {}));
|
|
350
|
+
/**
|
|
351
|
+
* ButtonIcon - size
|
|
352
|
+
*/
|
|
353
|
+
export var ButtonIconSize;
|
|
354
|
+
(function (ButtonIconSize) {
|
|
278
355
|
/**
|
|
279
356
|
* Represents a small button size (24px).
|
|
280
357
|
*/
|
|
281
|
-
Sm
|
|
358
|
+
ButtonIconSize["Sm"] = "sm";
|
|
282
359
|
/**
|
|
283
360
|
* Represents a medium button size (32px).
|
|
284
361
|
*/
|
|
285
|
-
Md
|
|
362
|
+
ButtonIconSize["Md"] = "md";
|
|
286
363
|
/**
|
|
287
364
|
* Represents a large button size (40px).
|
|
288
365
|
*/
|
|
289
|
-
Lg
|
|
290
|
-
};
|
|
291
|
-
|
|
366
|
+
ButtonIconSize["Lg"] = "lg";
|
|
367
|
+
})(ButtonIconSize || (ButtonIconSize = {}));
|
|
368
|
+
/**
|
|
369
|
+
* Text - variant
|
|
370
|
+
*/
|
|
371
|
+
export var TextVariant;
|
|
372
|
+
(function (TextVariant) {
|
|
292
373
|
// Display Sizes
|
|
293
|
-
DisplayLg
|
|
294
|
-
DisplayMd
|
|
374
|
+
TextVariant["DisplayLg"] = "display-lg";
|
|
375
|
+
TextVariant["DisplayMd"] = "display-md";
|
|
295
376
|
// Heading Sizes
|
|
296
|
-
HeadingLg
|
|
297
|
-
HeadingMd
|
|
298
|
-
HeadingSm
|
|
377
|
+
TextVariant["HeadingLg"] = "heading-lg";
|
|
378
|
+
TextVariant["HeadingMd"] = "heading-md";
|
|
379
|
+
TextVariant["HeadingSm"] = "heading-sm";
|
|
299
380
|
// Font Sizes
|
|
300
|
-
BodyLg
|
|
301
|
-
BodyMd
|
|
302
|
-
BodySm
|
|
303
|
-
BodyXs
|
|
381
|
+
TextVariant["BodyLg"] = "body-lg";
|
|
382
|
+
TextVariant["BodyMd"] = "body-md";
|
|
383
|
+
TextVariant["BodySm"] = "body-sm";
|
|
384
|
+
TextVariant["BodyXs"] = "body-xs";
|
|
304
385
|
// Special Typography Variants
|
|
305
|
-
PageHeading
|
|
306
|
-
SectionHeading
|
|
307
|
-
ButtonLabelMd
|
|
308
|
-
ButtonLabelLg
|
|
309
|
-
AmountDisplayLg
|
|
310
|
-
};
|
|
311
|
-
|
|
386
|
+
TextVariant["PageHeading"] = "page-heading";
|
|
387
|
+
TextVariant["SectionHeading"] = "section-heading";
|
|
388
|
+
TextVariant["ButtonLabelMd"] = "button-label-md";
|
|
389
|
+
TextVariant["ButtonLabelLg"] = "button-label-lg";
|
|
390
|
+
TextVariant["AmountDisplayLg"] = "amount-display-lg";
|
|
391
|
+
})(TextVariant || (TextVariant = {}));
|
|
392
|
+
/**
|
|
393
|
+
* Text - color
|
|
394
|
+
*/
|
|
395
|
+
export var TextColor;
|
|
396
|
+
(function (TextColor) {
|
|
312
397
|
/** For default neutral text. */
|
|
313
|
-
TextDefault
|
|
398
|
+
TextColor["TextDefault"] = "text-default";
|
|
314
399
|
/** For softer contrast neutral text */
|
|
315
|
-
TextAlternative
|
|
400
|
+
TextColor["TextAlternative"] = "text-alternative";
|
|
316
401
|
/** For the softest contrast neutral text (not accessible) */
|
|
317
|
-
TextMuted
|
|
402
|
+
TextColor["TextMuted"] = "text-muted";
|
|
318
403
|
/** For elements used on top of overlay/alternative. Used for text, icon or border */
|
|
319
|
-
OverlayInverse
|
|
404
|
+
TextColor["OverlayInverse"] = "text-overlay-inverse";
|
|
320
405
|
/** For interactive, active, and selected semantics. Used for text, background, icon or border */
|
|
321
|
-
PrimaryDefault
|
|
406
|
+
TextColor["PrimaryDefault"] = "text-primary-default";
|
|
322
407
|
/** For primary text in a hover state. */
|
|
323
|
-
PrimaryDefaultHover
|
|
408
|
+
TextColor["PrimaryDefaultHover"] = "text-primary-default-hover";
|
|
324
409
|
/** For primary text in a pressed state. */
|
|
325
|
-
PrimaryDefaultPressed
|
|
410
|
+
TextColor["PrimaryDefaultPressed"] = "text-primary-default-pressed";
|
|
326
411
|
/** For elements used on top of primary/default. Used for text, icon or border */
|
|
327
|
-
PrimaryInverse
|
|
412
|
+
TextColor["PrimaryInverse"] = "text-primary-inverse";
|
|
328
413
|
/** For the critical alert semantic elements. Used for text, background, icon or border */
|
|
329
|
-
ErrorDefault
|
|
414
|
+
TextColor["ErrorDefault"] = "text-error-default";
|
|
330
415
|
/** For critical alert text in a hover state. */
|
|
331
|
-
ErrorDefaultHover
|
|
416
|
+
TextColor["ErrorDefaultHover"] = "text-error-default-hover";
|
|
332
417
|
/** For critical alert text in a pressed state. */
|
|
333
|
-
ErrorDefaultPressed
|
|
418
|
+
TextColor["ErrorDefaultPressed"] = "text-error-default-pressed";
|
|
334
419
|
/** For the stronger contrast error semantic elements. */
|
|
335
|
-
ErrorAlternative
|
|
420
|
+
TextColor["ErrorAlternative"] = "text-error-alternative";
|
|
336
421
|
/** For elements used on top of error/default. Used for text, icon or border */
|
|
337
|
-
ErrorInverse
|
|
422
|
+
TextColor["ErrorInverse"] = "text-error-inverse";
|
|
338
423
|
/** For the positive semantic elements. Used for text, background, icon or border */
|
|
339
|
-
SuccessDefault
|
|
424
|
+
TextColor["SuccessDefault"] = "text-success-default";
|
|
340
425
|
/** For positive text in a hover state. */
|
|
341
|
-
SuccessDefaultHover
|
|
426
|
+
TextColor["SuccessDefaultHover"] = "text-success-default-hover";
|
|
342
427
|
/** For positive text in a pressed state. */
|
|
343
|
-
SuccessDefaultPressed
|
|
428
|
+
TextColor["SuccessDefaultPressed"] = "text-success-default-pressed";
|
|
344
429
|
/** For elements used on top of success/default. Used for text, icon or border */
|
|
345
|
-
SuccessInverse
|
|
430
|
+
TextColor["SuccessInverse"] = "text-success-inverse";
|
|
346
431
|
/** For the caution alert semantic elements. Used for text, background, icon or border */
|
|
347
|
-
WarningDefault
|
|
432
|
+
TextColor["WarningDefault"] = "text-warning-default";
|
|
348
433
|
/** For caution text in a hover state. */
|
|
349
|
-
WarningDefaultHover
|
|
434
|
+
TextColor["WarningDefaultHover"] = "text-warning-default-hover";
|
|
350
435
|
/** For caution text in a pressed state. */
|
|
351
|
-
WarningDefaultPressed
|
|
436
|
+
TextColor["WarningDefaultPressed"] = "text-warning-default-pressed";
|
|
352
437
|
/** For elements used on top of warning/default. Used for text, icon or border */
|
|
353
|
-
WarningInverse
|
|
438
|
+
TextColor["WarningInverse"] = "text-warning-inverse";
|
|
354
439
|
/** For informational read-only elements. Used for text, background, icon or border */
|
|
355
|
-
InfoDefault
|
|
440
|
+
TextColor["InfoDefault"] = "text-info-default";
|
|
356
441
|
/** For elements used on top of info/default. Used for text, icon or border */
|
|
357
|
-
InfoInverse
|
|
442
|
+
TextColor["InfoInverse"] = "text-info-inverse";
|
|
358
443
|
/** Inherit the color of the parent element */
|
|
359
|
-
Inherit
|
|
444
|
+
TextColor["Inherit"] = "text-inherit";
|
|
360
445
|
/** Make the text color transparent */
|
|
361
|
-
Transparent
|
|
362
|
-
};
|
|
363
|
-
|
|
364
|
-
|
|
365
|
-
|
|
366
|
-
|
|
367
|
-
|
|
368
|
-
|
|
369
|
-
|
|
446
|
+
TextColor["Transparent"] = "text-transparent";
|
|
447
|
+
})(TextColor || (TextColor = {}));
|
|
448
|
+
/**
|
|
449
|
+
* Text - textAlign
|
|
450
|
+
*/
|
|
451
|
+
export var TextAlign;
|
|
452
|
+
(function (TextAlign) {
|
|
453
|
+
TextAlign["Left"] = "text-left";
|
|
454
|
+
TextAlign["Center"] = "text-center";
|
|
455
|
+
TextAlign["Right"] = "text-right";
|
|
456
|
+
TextAlign["Justify"] = "text-justify";
|
|
457
|
+
})(TextAlign || (TextAlign = {}));
|
|
458
|
+
/**
|
|
459
|
+
* Text - fontWeight
|
|
460
|
+
*/
|
|
461
|
+
export var FontWeight;
|
|
462
|
+
(function (FontWeight) {
|
|
370
463
|
/**
|
|
371
464
|
* Weight - 700
|
|
372
465
|
*/
|
|
373
|
-
Bold
|
|
466
|
+
FontWeight["Bold"] = "font-bold";
|
|
374
467
|
/**
|
|
375
468
|
* Weight - 500
|
|
376
469
|
*/
|
|
377
|
-
Medium
|
|
470
|
+
FontWeight["Medium"] = "font-medium";
|
|
378
471
|
/**
|
|
379
472
|
* Weight - 400
|
|
380
473
|
*/
|
|
381
|
-
Regular
|
|
382
|
-
};
|
|
383
|
-
|
|
384
|
-
|
|
385
|
-
|
|
386
|
-
|
|
387
|
-
|
|
388
|
-
|
|
389
|
-
|
|
390
|
-
Normal
|
|
391
|
-
};
|
|
392
|
-
|
|
393
|
-
|
|
394
|
-
|
|
395
|
-
|
|
396
|
-
|
|
397
|
-
|
|
398
|
-
|
|
399
|
-
|
|
400
|
-
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
export
|
|
404
|
-
|
|
405
|
-
|
|
406
|
-
|
|
407
|
-
|
|
408
|
-
|
|
409
|
-
|
|
474
|
+
FontWeight["Regular"] = "font-regular";
|
|
475
|
+
})(FontWeight || (FontWeight = {}));
|
|
476
|
+
/**
|
|
477
|
+
* Text - overflowWrap
|
|
478
|
+
*/
|
|
479
|
+
export var OverflowWrap;
|
|
480
|
+
(function (OverflowWrap) {
|
|
481
|
+
OverflowWrap["BreakWord"] = "break-words";
|
|
482
|
+
OverflowWrap["Anywhere"] = "break-all";
|
|
483
|
+
OverflowWrap["Normal"] = "break-normal";
|
|
484
|
+
})(OverflowWrap || (OverflowWrap = {}));
|
|
485
|
+
/**
|
|
486
|
+
* Text - fontStyle
|
|
487
|
+
*/
|
|
488
|
+
export var FontStyle;
|
|
489
|
+
(function (FontStyle) {
|
|
490
|
+
FontStyle["Italic"] = "italic";
|
|
491
|
+
FontStyle["Normal"] = "not-italic";
|
|
492
|
+
})(FontStyle || (FontStyle = {}));
|
|
493
|
+
/**
|
|
494
|
+
* Text - textTransform
|
|
495
|
+
*/
|
|
496
|
+
export var TextTransform;
|
|
497
|
+
(function (TextTransform) {
|
|
498
|
+
// eslint-disable-next-line @typescript-eslint/no-shadow
|
|
499
|
+
TextTransform["Uppercase"] = "uppercase";
|
|
500
|
+
// eslint-disable-next-line @typescript-eslint/no-shadow
|
|
501
|
+
TextTransform["Lowercase"] = "lowercase";
|
|
502
|
+
// eslint-disable-next-line @typescript-eslint/no-shadow
|
|
503
|
+
TextTransform["Capitalize"] = "capitalize";
|
|
504
|
+
TextTransform["Normal"] = "normal-case";
|
|
505
|
+
})(TextTransform || (TextTransform = {}));
|
|
506
|
+
/**
|
|
507
|
+
* Text - fontFamily
|
|
508
|
+
*/
|
|
509
|
+
export var FontFamily;
|
|
510
|
+
(function (FontFamily) {
|
|
511
|
+
FontFamily["Default"] = "font-default";
|
|
512
|
+
FontFamily["Accent"] = "font-accent";
|
|
513
|
+
FontFamily["Hero"] = "font-hero";
|
|
514
|
+
})(FontFamily || (FontFamily = {}));
|
|
515
|
+
/**
|
|
516
|
+
* TextButton - size
|
|
517
|
+
*/
|
|
518
|
+
export var TextButtonSize;
|
|
519
|
+
(function (TextButtonSize) {
|
|
520
|
+
TextButtonSize["BodyLg"] = "body-lg";
|
|
521
|
+
TextButtonSize["BodyMd"] = "body-md";
|
|
522
|
+
TextButtonSize["BodySm"] = "body-sm";
|
|
523
|
+
TextButtonSize["BodyXs"] = "body-xs";
|
|
524
|
+
})(TextButtonSize || (TextButtonSize = {}));
|
|
525
|
+
/**
|
|
526
|
+
* Icon - size
|
|
527
|
+
*/
|
|
528
|
+
export var IconSize;
|
|
529
|
+
(function (IconSize) {
|
|
410
530
|
/** Extra small - 12px */
|
|
411
|
-
Xs
|
|
531
|
+
IconSize["Xs"] = "xs";
|
|
412
532
|
/** Small - 16px */
|
|
413
|
-
Sm
|
|
533
|
+
IconSize["Sm"] = "sm";
|
|
414
534
|
/** Medium - 20px (Default) */
|
|
415
|
-
Md
|
|
535
|
+
IconSize["Md"] = "md";
|
|
416
536
|
/** Large - 24px */
|
|
417
|
-
Lg
|
|
537
|
+
IconSize["Lg"] = "lg";
|
|
418
538
|
/** Extra large - 32px */
|
|
419
|
-
Xl
|
|
420
|
-
};
|
|
421
|
-
|
|
539
|
+
IconSize["Xl"] = "xl";
|
|
540
|
+
})(IconSize || (IconSize = {}));
|
|
541
|
+
/**
|
|
542
|
+
* Icon - color
|
|
543
|
+
*/
|
|
544
|
+
export var IconColor;
|
|
545
|
+
(function (IconColor) {
|
|
422
546
|
/** For default neutral icons */
|
|
423
|
-
IconDefault
|
|
547
|
+
IconColor["IconDefault"] = "text-icon-default";
|
|
424
548
|
/** For softer neutral icons */
|
|
425
|
-
IconAlternative
|
|
549
|
+
IconColor["IconAlternative"] = "text-icon-alternative";
|
|
426
550
|
/** For the weakest contrast neutral icons (not accessible) */
|
|
427
|
-
IconMuted
|
|
551
|
+
IconColor["IconMuted"] = "text-icon-muted";
|
|
428
552
|
/** For elements used on top of overlay/alternative. Used for text, icon or border */
|
|
429
|
-
OverlayInverse
|
|
553
|
+
IconColor["OverlayInverse"] = "text-overlay-inverse";
|
|
430
554
|
/** For interactive, active, and selected semantics. Used for text, background, icon or border */
|
|
431
|
-
PrimaryDefault
|
|
555
|
+
IconColor["PrimaryDefault"] = "text-primary-default";
|
|
432
556
|
/** For elements used on top of primary/default. Used for text, icon or border */
|
|
433
|
-
PrimaryInverse
|
|
557
|
+
IconColor["PrimaryInverse"] = "text-primary-inverse";
|
|
434
558
|
/** For the critical alert semantic elements. Used for text, background, icon or border */
|
|
435
|
-
ErrorDefault
|
|
559
|
+
IconColor["ErrorDefault"] = "text-error-default";
|
|
436
560
|
/** For elements used on top of error/default. Used for text, icon or border */
|
|
437
|
-
ErrorInverse
|
|
561
|
+
IconColor["ErrorInverse"] = "text-error-inverse";
|
|
438
562
|
/** For the positive semantic elements. Used for text, background, icon or border */
|
|
439
|
-
SuccessDefault
|
|
563
|
+
IconColor["SuccessDefault"] = "text-success-default";
|
|
440
564
|
/** For elements used on top of success/default. Used for text, icon or border */
|
|
441
|
-
SuccessInverse
|
|
565
|
+
IconColor["SuccessInverse"] = "text-success-inverse";
|
|
442
566
|
/** For the caution alert semantic elements. Used for text, background, icon or border */
|
|
443
|
-
WarningDefault
|
|
567
|
+
IconColor["WarningDefault"] = "text-warning-default";
|
|
444
568
|
/** For elements used on top of warning/default. Used for text, icon or border */
|
|
445
|
-
WarningInverse
|
|
569
|
+
IconColor["WarningInverse"] = "text-warning-inverse";
|
|
446
570
|
/** For informational read-only elements. Used for text, background, icon or border */
|
|
447
|
-
InfoDefault
|
|
571
|
+
IconColor["InfoDefault"] = "text-info-default";
|
|
448
572
|
/** For elements used on top of info/default. Used for text, icon or border */
|
|
449
|
-
InfoInverse
|
|
450
|
-
};
|
|
573
|
+
IconColor["InfoInverse"] = "text-info-inverse";
|
|
574
|
+
})(IconColor || (IconColor = {}));
|
|
451
575
|
/**
|
|
452
576
|
* Autogenerated from the generate-icon-script.ts script.
|
|
453
577
|
* Please do not edit this enum directly.
|