onecart-ui 0.2.8 → 0.3.0
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/index.js +112 -4789
- package/dist/index.js.map +1 -1
- package/dist/index.mobile.js +106 -208
- package/dist/index.mobile.js.map +1 -1
- package/icons/Icons.stories.js +1 -1
- package/package.json +20 -18
- package/tokens/tokens.scss +349 -0
- package/dist/Button/Button.mobile.d.ts +0 -4
- package/dist/Button/Button.types.d.ts +0 -43
- package/dist/Button/Button.web.d.ts +0 -4
- package/dist/Button/buttonStyles.d.ts +0 -12
- package/dist/Button/index.d.ts +0 -1
- package/dist/Button/index.mobile.d.ts +0 -1
- package/dist/Typography/Body/index.d.ts +0 -3
- package/dist/Typography/Display/index.d.ts +0 -3
- package/dist/Typography/Heading/index.d.ts +0 -3
- package/dist/Typography/Utility/index.d.ts +0 -3
- package/dist/Typography/index.d.ts +0 -4
- package/dist/components/Button.d.ts +0 -1
- package/dist/components/Icon.d.ts +0 -10
- package/dist/components/index.d.ts +0 -4
- package/dist/mobile/index.d.ts +0 -2
- package/dist/src/Button/Button.mobile.d.ts +0 -4
- package/dist/src/Button/Button.types.d.ts +0 -43
- package/dist/src/Button/Button.web.d.ts +0 -4
- package/dist/src/Button/buttonStyles.d.ts +0 -12
- package/dist/src/Button/index.d.ts +0 -2
- package/dist/src/Button/index.mobile.d.ts +0 -2
- package/dist/src/Typography/Body/Body.mobile.d.ts +0 -3
- package/dist/src/Typography/Body/Body.web.d.ts +0 -3
- package/dist/src/Typography/Body/index.d.ts +0 -1
- package/dist/src/Typography/Body/index.mobile.d.ts +0 -1
- package/dist/src/Typography/Display/Display.mobile.d.ts +0 -3
- package/dist/src/Typography/Display/Display.web.d.ts +0 -3
- package/dist/src/Typography/Display/index.d.ts +0 -1
- package/dist/src/Typography/Display/index.mobile.d.ts +0 -1
- package/dist/src/Typography/Heading/Heading.mobile.d.ts +0 -3
- package/dist/src/Typography/Heading/Heading.web.d.ts +0 -3
- package/dist/src/Typography/Heading/index.d.ts +0 -1
- package/dist/src/Typography/Heading/index.mobile.d.ts +0 -1
- package/dist/src/Typography/Typography.types.d.ts +0 -51
- package/dist/src/Typography/Utility/Utility.mobile.d.ts +0 -3
- package/dist/src/Typography/Utility/Utility.web.d.ts +0 -3
- package/dist/src/Typography/Utility/index.d.ts +0 -1
- package/dist/src/Typography/Utility/index.mobile.d.ts +0 -1
- package/dist/src/Typography/index.d.ts +0 -5
- package/dist/src/Typography/index.mobile.d.ts +0 -5
- package/dist/src/components/Button.d.ts +0 -1
- package/dist/src/components/Icon.d.ts +0 -10
- package/dist/src/components/index.d.ts +0 -2
- package/dist/src/index.d.ts +0 -2
- package/dist/src/styles/tokens/typography.d.ts +0 -138
- package/dist/src/theme/ThemeProvider.d.ts +0 -5
- package/dist/src/tokens/design-tokens.d.ts +0 -54
- package/dist/styles/tokens/typography.d.ts +0 -138
- package/dist/theme/ThemeProvider.d.ts +0 -5
- package/dist/tokens/design-tokens.d.ts +0 -54
- package/dist/types/Button.d.ts +0 -24
- package/dist/types/Typography.d.ts +0 -32
|
@@ -0,0 +1,349 @@
|
|
|
1
|
+
|
|
2
|
+
// File generated by the Figma Token Engine
|
|
3
|
+
// Do not edit directly
|
|
4
|
+
|
|
5
|
+
$border-radius-tooltip-default: 0.25rem;
|
|
6
|
+
$border-radius-popover-default: 0.5rem;
|
|
7
|
+
$border-radius-tag-sm: 0.25rem;
|
|
8
|
+
$border-radius-tag-xl: 62.4rem;
|
|
9
|
+
$border-radius-button-sm: 0.25rem;
|
|
10
|
+
$border-radius-button-full: 62.4rem;
|
|
11
|
+
$border-radius-input-sm: 0.25rem;
|
|
12
|
+
$border-radius-input-lg: 0.5rem;
|
|
13
|
+
$border-radius-card-sm: 0.25rem;
|
|
14
|
+
$border-radius-card-md: 0.5rem;
|
|
15
|
+
$border-radius-card-lg: 0.75rem;
|
|
16
|
+
$border-radius-modal-lg: 0.75rem;
|
|
17
|
+
$border-radius-modal-xl: 1rem;
|
|
18
|
+
$border-radius-none: 0;
|
|
19
|
+
$border-radius-xs: 0.25rem;
|
|
20
|
+
$border-radius-sm: 0.5rem;
|
|
21
|
+
$border-radius-md: 0.75rem;
|
|
22
|
+
$border-radius-lg: 1rem;
|
|
23
|
+
$border-radius-xl: 1.25rem;
|
|
24
|
+
$border-radius-2xl: 1.5rem;
|
|
25
|
+
$border-radius-3xl: 1.75rem;
|
|
26
|
+
$border-radius-full: 62.4rem;
|
|
27
|
+
$border-width-button-default: 0.0625rem;
|
|
28
|
+
$border-width-button-hover: 0.125rem;
|
|
29
|
+
$border-width-button-pressed: 0.125rem;
|
|
30
|
+
$border-width-input-default: 0.0625rem;
|
|
31
|
+
$border-width-input-focus: 0.125rem;
|
|
32
|
+
$border-width-input-error: 0.125rem;
|
|
33
|
+
$border-width-card-default: 0.0625rem;
|
|
34
|
+
$border-width-card-hover: 0.125rem;
|
|
35
|
+
$border-width-none: 0;
|
|
36
|
+
$border-width-xs: 0.0625rem;
|
|
37
|
+
$border-width-sm: 0.125rem;
|
|
38
|
+
$border-width-md: 0.25rem;
|
|
39
|
+
$border-green: #00df88;
|
|
40
|
+
$border-blue: #0053e2;
|
|
41
|
+
$border-yellow: #f4b400;
|
|
42
|
+
$border-red: #a90000;
|
|
43
|
+
$border-dark: #111;
|
|
44
|
+
$border-light: #e2e2e2;
|
|
45
|
+
$border-lighter: #f1f1f1;
|
|
46
|
+
$layout-spacing-inline-none: 0;
|
|
47
|
+
$layout-spacing-inline-3xs: 0.125rem;
|
|
48
|
+
$layout-spacing-inline-2xs: 0.25rem;
|
|
49
|
+
$layout-spacing-inline-xs: 0.5rem;
|
|
50
|
+
$layout-spacing-inline-sm: 0.75rem;
|
|
51
|
+
$layout-spacing-inline-md: 1rem;
|
|
52
|
+
$layout-spacing-inline-lg: 2rem;
|
|
53
|
+
$layout-spacing-inline-xl: 2.5rem;
|
|
54
|
+
$layout-spacing-inline-2xl: 5rem;
|
|
55
|
+
$layout-spacing-stack-none: 0;
|
|
56
|
+
$layout-spacing-stack-3xs: 0.125rem;
|
|
57
|
+
$layout-spacing-stack-2xs: 0.25rem;
|
|
58
|
+
$layout-spacing-stack-xs: 0.5rem;
|
|
59
|
+
$layout-spacing-stack-sm: 0.75rem;
|
|
60
|
+
$layout-spacing-stack-md: 1rem;
|
|
61
|
+
$layout-spacing-stack-lg: 2rem;
|
|
62
|
+
$layout-spacing-stack-xl: 2.5rem;
|
|
63
|
+
$layout-spacing-stack-2xl: 5rem;
|
|
64
|
+
$section-spacing-sm: 1.5rem;
|
|
65
|
+
$section-spacing-md: 1.75rem;
|
|
66
|
+
$section-spacing-lg: 2rem;
|
|
67
|
+
$section-spacing-xl: 2.5rem;
|
|
68
|
+
$section-spacing-2xl: 3.5rem;
|
|
69
|
+
$section-spacing-3xl: 5rem;
|
|
70
|
+
$component-card-sm: 0.75rem;
|
|
71
|
+
$component-card-md: 1.25rem;
|
|
72
|
+
$component-card-lg: 1.5rem;
|
|
73
|
+
$component-card-xl: 2rem;
|
|
74
|
+
$component-card-2xl: 2.5rem;
|
|
75
|
+
$component-modal-sm: 1.25rem;
|
|
76
|
+
$component-modal-md: 1.5rem;
|
|
77
|
+
$component-modal-lg: 1.75rem;
|
|
78
|
+
$space-0: 0;
|
|
79
|
+
$space-3xs: 0.125rem;
|
|
80
|
+
$space-2xs: 0.25rem;
|
|
81
|
+
$space-xs: 0.5rem;
|
|
82
|
+
$space-sm: 0.75rem;
|
|
83
|
+
$space-md: 1rem;
|
|
84
|
+
$space-lg: 1.25rem;
|
|
85
|
+
$space-xl: 1.5rem;
|
|
86
|
+
$space-2xl: 1.75rem;
|
|
87
|
+
$space-3xl: 2rem;
|
|
88
|
+
$space-4xl: 2.5rem;
|
|
89
|
+
$space-5xl: 3rem;
|
|
90
|
+
$space-6xl: 3.5rem;
|
|
91
|
+
$space-7xl: 4rem;
|
|
92
|
+
$space-8xl: 5rem;
|
|
93
|
+
$xs: 0.75rem;
|
|
94
|
+
$s: 1rem;
|
|
95
|
+
$md: 1.25rem;
|
|
96
|
+
$lg: 1.5rem;
|
|
97
|
+
$xl: 1.75rem;
|
|
98
|
+
$xxl: 2rem;
|
|
99
|
+
$background-yellow-light: #fff5d9;
|
|
100
|
+
$background-yellow-medium: #ffe7a5;
|
|
101
|
+
$background-blue-light: #e3ebff;
|
|
102
|
+
$background-blue-medium: #c3deff;
|
|
103
|
+
$background-green-light: #E5FCF3;
|
|
104
|
+
$background-green-medium: #ccf9e7;
|
|
105
|
+
$background-green-dark: #00df88;
|
|
106
|
+
$background-red-light: #feecec;
|
|
107
|
+
$background-red-medium: #fed8d8;
|
|
108
|
+
$background-white-light: #ffffff;
|
|
109
|
+
$background-neutral-dark: #111;
|
|
110
|
+
$background-neutral-grey: #e2e2e2;
|
|
111
|
+
$background-neutral-light: #f1f1f1;
|
|
112
|
+
$text-inverse: #ffffff;
|
|
113
|
+
$text-disabled: #ababab;
|
|
114
|
+
$text-placeholder: #919191;
|
|
115
|
+
$text-tertiary: #525252;
|
|
116
|
+
$text-body: #3b3b3b;
|
|
117
|
+
$text-header: #111;
|
|
118
|
+
$text-green: #00df88;
|
|
119
|
+
$text-blue: #0053e2;
|
|
120
|
+
$text-error: #a90000;
|
|
121
|
+
$text-yellow: #f4b400;
|
|
122
|
+
$feedback-alert-success: #00df88;
|
|
123
|
+
$feedback-alert-error: #a90000;
|
|
124
|
+
$feedback-alert-warning: #fff5d9;
|
|
125
|
+
$feedback-alert-neutral: #111;
|
|
126
|
+
$action-primary-default: #00df88;
|
|
127
|
+
$action-primary-hover: #4ce9ac;
|
|
128
|
+
$action-primary-active: #98f2cf;
|
|
129
|
+
$action-primary-disabled: #E5FCF3;
|
|
130
|
+
$action-secondary-default: #0053e2;
|
|
131
|
+
$action-secondary-hover: #254cac;
|
|
132
|
+
$action-secondary-active: #9ec1ff;
|
|
133
|
+
$action-secondary-disabled: #e3ebff;
|
|
134
|
+
$action-destructive-default: #d60000;
|
|
135
|
+
$action-destructive-hover: #a90000;
|
|
136
|
+
$action-destructive-active: #fed8d8;
|
|
137
|
+
$action-destructive-disable: #feecec;
|
|
138
|
+
$action-tertiary-default: #3b3b3b;
|
|
139
|
+
$action-tertiary-hover: #111;
|
|
140
|
+
$action-tertiary-active: #ababab;
|
|
141
|
+
$action-tertiary-disable: #f1f1f1;
|
|
142
|
+
$icon-yellow: #f4b400;
|
|
143
|
+
$icon-blue: #0053e2;
|
|
144
|
+
$icon-green: #00df88;
|
|
145
|
+
$icon-red: #a90000;
|
|
146
|
+
$icon-neutral: #111;
|
|
147
|
+
$icon-light: #e2e2e2;
|
|
148
|
+
$icon-lighter: #f1f1f1;
|
|
149
|
+
$green-10: #E5FCF3;
|
|
150
|
+
$green-20: #ccf9e7;
|
|
151
|
+
$green-30: #B2F5DB;
|
|
152
|
+
$green-40: #98f2cf;
|
|
153
|
+
$green-50: #81efc3;
|
|
154
|
+
$green-60: #66ecb8;
|
|
155
|
+
$green-70: #4ce9ac;
|
|
156
|
+
$green-80: #31e5a0;
|
|
157
|
+
$green-90: #1ae294;
|
|
158
|
+
$green-100: #00df88;
|
|
159
|
+
$neutral-10: #f1f1f1;
|
|
160
|
+
$neutral-20: #e2e2e2;
|
|
161
|
+
$neutral-30: #c6c6c6;
|
|
162
|
+
$neutral-40: #ababab;
|
|
163
|
+
$neutral-50: #919191;
|
|
164
|
+
$neutral-60: #6a6a6a;
|
|
165
|
+
$neutral-70: #525252;
|
|
166
|
+
$neutral-80: #3b3b3b;
|
|
167
|
+
$neutral-90: #262626;
|
|
168
|
+
$neutral-100: #111;
|
|
169
|
+
$blue-10: #e3ebff;
|
|
170
|
+
$blue-20: #c3deff;
|
|
171
|
+
$blue-30: #9ec1ff;
|
|
172
|
+
$blue-40: #5c83fd;
|
|
173
|
+
$blue-50: #446ef5;
|
|
174
|
+
$blue-60: #0053e2;
|
|
175
|
+
$blue-70: #254cac;
|
|
176
|
+
$blue-80: #14328d;
|
|
177
|
+
$blue-90: #0c285f;
|
|
178
|
+
$blue-100: #071e3c;
|
|
179
|
+
$red-10: #feecec;
|
|
180
|
+
$red-20: #fed8d8;
|
|
181
|
+
$red-30: #feb3b3;
|
|
182
|
+
$red-40: #fe8888;
|
|
183
|
+
$red-50: #fb5959;
|
|
184
|
+
$red-60: #d60000;
|
|
185
|
+
$red-70: #a90000;
|
|
186
|
+
$red-80: #820000;
|
|
187
|
+
$red-90: #550000;
|
|
188
|
+
$red-100: #3a0000;
|
|
189
|
+
$yellow-10: #fff5d9;
|
|
190
|
+
$yellow-20: #ffe7a5;
|
|
191
|
+
$yellow-30: #ffd86b;
|
|
192
|
+
$yellow-40: #ffce46;
|
|
193
|
+
$yellow-50: #ffc420;
|
|
194
|
+
$yellow-60: #f4b400;
|
|
195
|
+
$yellow-70: #dba200;
|
|
196
|
+
$yellow-80: #c69200;
|
|
197
|
+
$yellow-90: #b38400;
|
|
198
|
+
$yellow-100: #9a7100;
|
|
199
|
+
$white-10: #ffffff;
|
|
200
|
+
$display-2xl-font-family: 'Campton';
|
|
201
|
+
$display-2xl-font-weight: 500;
|
|
202
|
+
$display-2xl-line-height: 56px;
|
|
203
|
+
$display-2xl-font-size: 52px;
|
|
204
|
+
$display-2xl-letter-spacing: 0%;
|
|
205
|
+
$display-2xl-paragraph-indent: 0px;
|
|
206
|
+
$display-2xl-text-case: none;
|
|
207
|
+
$display-2xl-text-decoration: none;
|
|
208
|
+
$display-xl-font-family: 'Campton';
|
|
209
|
+
$display-xl-font-weight: 500;
|
|
210
|
+
$display-xl-line-height: 48px;
|
|
211
|
+
$display-xl-font-size: 44px;
|
|
212
|
+
$display-xl-letter-spacing: 0%;
|
|
213
|
+
$display-xl-paragraph-indent: 0px;
|
|
214
|
+
$display-xl-text-case: none;
|
|
215
|
+
$display-xl-text-decoration: none;
|
|
216
|
+
$heading-xl-font-family: 'Campton';
|
|
217
|
+
$heading-xl-font-weight: 600;
|
|
218
|
+
$heading-xl-line-height: 48px;
|
|
219
|
+
$heading-xl-font-size: 40px;
|
|
220
|
+
$heading-xl-letter-spacing: 0%;
|
|
221
|
+
$heading-xl-paragraph-indent: 0px;
|
|
222
|
+
$heading-xl-text-case: none;
|
|
223
|
+
$heading-xl-text-decoration: none;
|
|
224
|
+
$heading-lg-font-family: 'Campton';
|
|
225
|
+
$heading-lg-font-weight: 600;
|
|
226
|
+
$heading-lg-line-height: 44px;
|
|
227
|
+
$heading-lg-font-size: 36px;
|
|
228
|
+
$heading-lg-letter-spacing: 0%;
|
|
229
|
+
$heading-lg-paragraph-indent: 0px;
|
|
230
|
+
$heading-lg-text-case: none;
|
|
231
|
+
$heading-lg-text-decoration: none;
|
|
232
|
+
$heading-md-font-family: 'Campton';
|
|
233
|
+
$heading-md-font-weight: 600;
|
|
234
|
+
$heading-md-line-height: 40px;
|
|
235
|
+
$heading-md-font-size: 32px;
|
|
236
|
+
$heading-md-letter-spacing: 0%;
|
|
237
|
+
$heading-md-paragraph-indent: 0px;
|
|
238
|
+
$heading-md-text-case: none;
|
|
239
|
+
$heading-md-text-decoration: none;
|
|
240
|
+
$heading-sm-font-family: 'Campton';
|
|
241
|
+
$heading-sm-font-weight: 600;
|
|
242
|
+
$heading-sm-line-height: 36px;
|
|
243
|
+
$heading-sm-font-size: 28px;
|
|
244
|
+
$heading-sm-letter-spacing: 0%;
|
|
245
|
+
$heading-sm-paragraph-indent: 0px;
|
|
246
|
+
$heading-sm-text-case: none;
|
|
247
|
+
$heading-sm-text-decoration: none;
|
|
248
|
+
$heading-xs-font-family: 'Campton';
|
|
249
|
+
$heading-xs-font-weight: 600;
|
|
250
|
+
$heading-xs-line-height: 28px;
|
|
251
|
+
$heading-xs-font-size: 20px;
|
|
252
|
+
$heading-xs-letter-spacing: 0%;
|
|
253
|
+
$heading-xs-paragraph-indent: 0px;
|
|
254
|
+
$heading-xs-text-case: none;
|
|
255
|
+
$heading-xs-text-decoration: none;
|
|
256
|
+
$heading-2xs-font-family: 'Campton';
|
|
257
|
+
$heading-2xs-font-weight: 600;
|
|
258
|
+
$heading-2xs-line-height: 24px;
|
|
259
|
+
$heading-2xs-font-size: 18px;
|
|
260
|
+
$heading-2xs-letter-spacing: 0%;
|
|
261
|
+
$heading-2xs-paragraph-indent: 0px;
|
|
262
|
+
$heading-2xs-text-case: none;
|
|
263
|
+
$heading-2xs-text-decoration: none;
|
|
264
|
+
$body-xl-font-family: 'Campton';
|
|
265
|
+
$body-xl-font-weight: book;
|
|
266
|
+
$body-xl-line-height: 28px;
|
|
267
|
+
$body-xl-font-size: 18px;
|
|
268
|
+
$body-xl-letter-spacing: 0%;
|
|
269
|
+
$body-xl-paragraph-indent: 0px;
|
|
270
|
+
$body-xl-text-case: none;
|
|
271
|
+
$body-xl-text-decoration: none;
|
|
272
|
+
$body-lg-font-family: 'Campton';
|
|
273
|
+
$body-lg-font-weight: book;
|
|
274
|
+
$body-lg-line-height: 24px;
|
|
275
|
+
$body-lg-font-size: 16px;
|
|
276
|
+
$body-lg-letter-spacing: 0%;
|
|
277
|
+
$body-lg-paragraph-indent: 0px;
|
|
278
|
+
$body-lg-text-case: none;
|
|
279
|
+
$body-lg-text-decoration: none;
|
|
280
|
+
$body-md-font-family: 'Campton';
|
|
281
|
+
$body-md-font-weight: book;
|
|
282
|
+
$body-md-line-height: 20px;
|
|
283
|
+
$body-md-font-size: 14px;
|
|
284
|
+
$body-md-letter-spacing: 0%;
|
|
285
|
+
$body-md-paragraph-indent: 0px;
|
|
286
|
+
$body-md-text-case: none;
|
|
287
|
+
$body-md-text-decoration: none;
|
|
288
|
+
$body-sm-font-family: 'Campton';
|
|
289
|
+
$body-sm-font-weight: book;
|
|
290
|
+
$body-sm-line-height: 20px;
|
|
291
|
+
$body-sm-font-size: 12px;
|
|
292
|
+
$body-sm-letter-spacing: 0%;
|
|
293
|
+
$body-sm-paragraph-indent: 0px;
|
|
294
|
+
$body-sm-text-case: none;
|
|
295
|
+
$body-sm-text-decoration: none;
|
|
296
|
+
$utility-button-font-family: 'Campton';
|
|
297
|
+
$utility-button-font-weight: 500;
|
|
298
|
+
$utility-button-line-height: 16px;
|
|
299
|
+
$utility-button-font-size: 16px;
|
|
300
|
+
$utility-button-letter-spacing: 0%;
|
|
301
|
+
$utility-button-paragraph-indent: 0px;
|
|
302
|
+
$utility-button-text-case: none;
|
|
303
|
+
$utility-button-text-decoration: none;
|
|
304
|
+
$utility-link-font-family: 'Campton';
|
|
305
|
+
$utility-link-font-weight: 500;
|
|
306
|
+
$utility-link-line-height: 20px;
|
|
307
|
+
$utility-link-font-size: 14px;
|
|
308
|
+
$utility-link-letter-spacing: 0%;
|
|
309
|
+
$utility-link-paragraph-indent: 0px;
|
|
310
|
+
$utility-link-text-case: none;
|
|
311
|
+
$utility-link-text-decoration: underline;
|
|
312
|
+
$utility-caption-font-family: 'Campton';
|
|
313
|
+
$utility-caption-font-weight: book;
|
|
314
|
+
$utility-caption-line-height: 16px;
|
|
315
|
+
$utility-caption-font-size: 12px;
|
|
316
|
+
$utility-caption-letter-spacing: 0%;
|
|
317
|
+
$utility-caption-paragraph-indent: 0px;
|
|
318
|
+
$utility-caption-text-case: none;
|
|
319
|
+
$utility-caption-text-decoration: none;
|
|
320
|
+
$font-families-campton: 'Campton';
|
|
321
|
+
$line-height-6xl: 56px;
|
|
322
|
+
$line-height-5xl: 48px;
|
|
323
|
+
$line-height-4xl: 44px;
|
|
324
|
+
$line-height-3xl: 40px;
|
|
325
|
+
$line-height-2xl: 36px;
|
|
326
|
+
$line-height-xl: 32px;
|
|
327
|
+
$line-height-lg: 28px;
|
|
328
|
+
$line-height-md: 24px;
|
|
329
|
+
$line-height-s: 20px;
|
|
330
|
+
$line-height-xs: 16px;
|
|
331
|
+
$medium: 500;
|
|
332
|
+
$semi-bold: 600;
|
|
333
|
+
$book: book;
|
|
334
|
+
$font-size-2xs: 14px;
|
|
335
|
+
$font-size-3xs: 12px;
|
|
336
|
+
$font-size-xs: 16px;
|
|
337
|
+
$font-size-md: 18px;
|
|
338
|
+
$font-size-lg: 20px;
|
|
339
|
+
$font-size-xl: 28px;
|
|
340
|
+
$font-size-2xl: 32px;
|
|
341
|
+
$font-size-3xl: 36px;
|
|
342
|
+
$font-size-4xl: 40px;
|
|
343
|
+
$font-size-5xl: 44px;
|
|
344
|
+
$font-size-6xl: 52px;
|
|
345
|
+
$letter-spacing-0: 0%;
|
|
346
|
+
$text-case-none: none;
|
|
347
|
+
$text-decoration-none: none;
|
|
348
|
+
$text-decoration-underline: underline;
|
|
349
|
+
$paragraph-indent-0: 0px;
|
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
export type ButtonType = "primary" | "outline" | "ghost" | "destructive";
|
|
2
|
-
export type ButtonSize = "large" | "small" | "medium";
|
|
3
|
-
export type ButtonState = "default" | "hover" | "active" | "disabled";
|
|
4
|
-
export interface ButtonProps {
|
|
5
|
-
/** Visible text label (also used as accessible name fallback). */
|
|
6
|
-
label: string;
|
|
7
|
-
/** Visual variant; defaults to `primary`. */
|
|
8
|
-
type?: ButtonType;
|
|
9
|
-
/** Size scale; defaults to `large`. */
|
|
10
|
-
size?: ButtonSize;
|
|
11
|
-
/** Disables interaction and applies disabled styling. */
|
|
12
|
-
disabled?: boolean;
|
|
13
|
-
/** Icon name rendered to the left of label (ignored if `icon` provided). */
|
|
14
|
-
leftIcon?: string;
|
|
15
|
-
/** Icon name rendered to the right of label (ignored if `icon` provided). */
|
|
16
|
-
rightIcon?: string;
|
|
17
|
-
/** Single icon (icon‑only button); when set, label text is visually hidden. */
|
|
18
|
-
icon?: string;
|
|
19
|
-
/** Stretches button to width:100%. */
|
|
20
|
-
fullWidth?: boolean;
|
|
21
|
-
/** Underlines text for `ghost` variant when not disabled (default true). */
|
|
22
|
-
ghostUnderline?: boolean;
|
|
23
|
-
/** Explicit accessible label (overrides fallback to `label`). */
|
|
24
|
-
accessibilityLabel?: string;
|
|
25
|
-
/** Test identifier (data-testid on web). */
|
|
26
|
-
testID?: string;
|
|
27
|
-
/** Additional CSS class name for web implementation only. */
|
|
28
|
-
className?: string;
|
|
29
|
-
/** Style override: React.CSSProperties (web) or RN style object (mobile). */
|
|
30
|
-
style?: React.CSSProperties | Record<string, unknown>;
|
|
31
|
-
/** Web click handler; executes alongside `onPress` if both supplied. */
|
|
32
|
-
onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
33
|
-
/** Platform‑agnostic press handler (used by mobile; also invoked on web clicks). */
|
|
34
|
-
onPress?: () => void;
|
|
35
|
-
/** Mouse enter hook (web only). */
|
|
36
|
-
onMouseEnter?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
37
|
-
/** Mouse leave hook (web only). */
|
|
38
|
-
onMouseLeave?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
39
|
-
/** Mouse down hook (web only). */
|
|
40
|
-
onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
41
|
-
/** Mouse up hook (web only). */
|
|
42
|
-
onMouseUp?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
43
|
-
}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { ButtonState, ButtonType, ButtonSize } from "./Button.types";
|
|
2
|
-
import type { ViewStyle, TextStyle } from "react-native";
|
|
3
|
-
export interface ComputedButtonStyles {
|
|
4
|
-
base: React.CSSProperties;
|
|
5
|
-
text: React.CSSProperties;
|
|
6
|
-
}
|
|
7
|
-
export declare const computeWebButtonStyles: (type: ButtonType, state: ButtonState, size: ButtonSize, isIconOnly: boolean, fullWidth: boolean, hasBothIcons: boolean, overrides?: Partial<React.CSSProperties>) => ComputedButtonStyles;
|
|
8
|
-
export interface MobileButtonStyles {
|
|
9
|
-
container: ViewStyle;
|
|
10
|
-
label: TextStyle;
|
|
11
|
-
}
|
|
12
|
-
export declare const computeMobileButtonStyles: (type: ButtonType, state: ButtonState, size: ButtonSize, overrides?: Partial<ViewStyle>) => MobileButtonStyles;
|
package/dist/Button/index.d.ts
DELETED
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./Button.web";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./Button.mobile";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export { Button } from "../Button/Button.web";
|
package/dist/mobile/index.d.ts
DELETED
|
@@ -1,43 +0,0 @@
|
|
|
1
|
-
export type ButtonType = "primary" | "outline" | "ghost" | "destructive";
|
|
2
|
-
export type ButtonSize = "large" | "small" | "medium";
|
|
3
|
-
export type ButtonState = "default" | "hover" | "active" | "disabled";
|
|
4
|
-
export interface ButtonProps {
|
|
5
|
-
/** Visible text label (also used as accessible name fallback). */
|
|
6
|
-
label: string;
|
|
7
|
-
/** Visual variant; defaults to `primary`. */
|
|
8
|
-
type?: ButtonType;
|
|
9
|
-
/** Size scale; defaults to `large`. */
|
|
10
|
-
size?: ButtonSize;
|
|
11
|
-
/** Disables interaction and applies disabled styling. */
|
|
12
|
-
disabled?: boolean;
|
|
13
|
-
/** Icon name rendered to the left of label (ignored if `icon` provided). */
|
|
14
|
-
leftIcon?: string;
|
|
15
|
-
/** Icon name rendered to the right of label (ignored if `icon` provided). */
|
|
16
|
-
rightIcon?: string;
|
|
17
|
-
/** Single icon (icon‑only button); when set, label text is visually hidden. */
|
|
18
|
-
icon?: string;
|
|
19
|
-
/** Stretches button to width:100%. */
|
|
20
|
-
fullWidth?: boolean;
|
|
21
|
-
/** Underlines text for `ghost` variant when not disabled (default true). */
|
|
22
|
-
ghostUnderline?: boolean;
|
|
23
|
-
/** Explicit accessible label (overrides fallback to `label`). */
|
|
24
|
-
accessibilityLabel?: string;
|
|
25
|
-
/** Test identifier (data-testid on web). */
|
|
26
|
-
testID?: string;
|
|
27
|
-
/** Additional CSS class name for web implementation only. */
|
|
28
|
-
className?: string;
|
|
29
|
-
/** Style override: React.CSSProperties (web) or RN style object (mobile). */
|
|
30
|
-
style?: React.CSSProperties | Record<string, unknown>;
|
|
31
|
-
/** Web click handler; executes alongside `onPress` if both supplied. */
|
|
32
|
-
onClick?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
33
|
-
/** Platform‑agnostic press handler (used by mobile; also invoked on web clicks). */
|
|
34
|
-
onPress?: () => void;
|
|
35
|
-
/** Mouse enter hook (web only). */
|
|
36
|
-
onMouseEnter?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
37
|
-
/** Mouse leave hook (web only). */
|
|
38
|
-
onMouseLeave?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
39
|
-
/** Mouse down hook (web only). */
|
|
40
|
-
onMouseDown?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
41
|
-
/** Mouse up hook (web only). */
|
|
42
|
-
onMouseUp?: (e: React.MouseEvent<HTMLButtonElement>) => void;
|
|
43
|
-
}
|
|
@@ -1,12 +0,0 @@
|
|
|
1
|
-
import { ButtonState, ButtonType, ButtonSize } from "./Button.types";
|
|
2
|
-
import type { ViewStyle, TextStyle } from "react-native";
|
|
3
|
-
export interface ComputedButtonStyles {
|
|
4
|
-
base: React.CSSProperties;
|
|
5
|
-
text: React.CSSProperties;
|
|
6
|
-
}
|
|
7
|
-
export declare const computeWebButtonStyles: (type: ButtonType, state: ButtonState, size: ButtonSize, isIconOnly: boolean, fullWidth: boolean, hasBothIcons: boolean, overrides?: Partial<React.CSSProperties>) => ComputedButtonStyles;
|
|
8
|
-
export interface MobileButtonStyles {
|
|
9
|
-
container: ViewStyle;
|
|
10
|
-
label: TextStyle;
|
|
11
|
-
}
|
|
12
|
-
export declare const computeMobileButtonStyles: (type: ButtonType, state: ButtonState, size: ButtonSize, overrides?: Partial<ViewStyle>) => MobileButtonStyles;
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./Body.web";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./Body.mobile";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./Display.web";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./Display.mobile";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./Heading.web";
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./Heading.mobile";
|
|
@@ -1,51 +0,0 @@
|
|
|
1
|
-
import React from "react";
|
|
2
|
-
export type BodySize = "xl" | "lg" | "md" | "sm";
|
|
3
|
-
export interface BaseTypographyProps {
|
|
4
|
-
/** Horizontal text alignment */
|
|
5
|
-
align?: "left" | "center" | "right";
|
|
6
|
-
/** Text color override; falls back to token color when undefined */
|
|
7
|
-
color?: string;
|
|
8
|
-
/** Enables single-line truncation with ellipsis */
|
|
9
|
-
truncate?: boolean;
|
|
10
|
-
/** Number of lines to clamp; when provided applies multi-line ellipsis styles */
|
|
11
|
-
lineClamp?: number;
|
|
12
|
-
/** Optional CSS class name for styling adjustments */
|
|
13
|
-
className?: string;
|
|
14
|
-
/** Inline style overrides (React style object or arbitrary record) */
|
|
15
|
-
style?: React.CSSProperties | Record<string, unknown>;
|
|
16
|
-
/** Web click handler; executes alongside `onPress` if both supplied. */
|
|
17
|
-
onClick?: (e: React.MouseEvent<HTMLElement>) => void;
|
|
18
|
-
/** Platform‑agnostic press handler (used by mobile; also invoked on web clicks). */
|
|
19
|
-
onPress?: () => void;
|
|
20
|
-
/** Testing identifier exposed as data-testid */
|
|
21
|
-
testID?: string;
|
|
22
|
-
/** Inner content (string, nodes, or components) */
|
|
23
|
-
children?: React.ReactNode;
|
|
24
|
-
}
|
|
25
|
-
export interface BodyProps extends BaseTypographyProps {
|
|
26
|
-
/** Body size token (xl|lg|md|sm), default lg */
|
|
27
|
-
size?: BodySize;
|
|
28
|
-
/** Which HTML element to render, default p */
|
|
29
|
-
element?: keyof JSX.IntrinsicElements;
|
|
30
|
-
}
|
|
31
|
-
export type DisplaySize = "2xl" | "xl";
|
|
32
|
-
export interface DisplayProps extends BaseTypographyProps {
|
|
33
|
-
/** Display size (2xl|xl), default 2xl */
|
|
34
|
-
size?: DisplaySize;
|
|
35
|
-
/** HTML element to render (semantic override), default h1 */
|
|
36
|
-
element?: keyof JSX.IntrinsicElements;
|
|
37
|
-
}
|
|
38
|
-
export type HeadingSize = "xl" | "lg" | "md" | "sm" | "xs" | "2xs";
|
|
39
|
-
export interface HeadingProps extends BaseTypographyProps {
|
|
40
|
-
/** Heading size controlling typography scale */
|
|
41
|
-
size?: HeadingSize;
|
|
42
|
-
/** Overrides the default mapped heading element */
|
|
43
|
-
element?: keyof JSX.IntrinsicElements;
|
|
44
|
-
}
|
|
45
|
-
export type UtilityVariant = "button" | "link" | "caption";
|
|
46
|
-
export interface UtilityProps extends BaseTypographyProps {
|
|
47
|
-
/** Visual style preset (button|link|caption), default button */
|
|
48
|
-
variant?: UtilityVariant;
|
|
49
|
-
/** Override rendered element; link variant defaults to <a>, others span */
|
|
50
|
-
element?: keyof JSX.IntrinsicElements;
|
|
51
|
-
}
|
|
@@ -1 +0,0 @@
|
|
|
1
|
-
export * from "./Utility.web";
|