@telia/teddy 0.0.9 → 0.0.11

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 (73) hide show
  1. package/dist/assets/badge.css +1 -1
  2. package/dist/assets/heading.css +1 -1
  3. package/dist/assets/main.css +1 -1
  4. package/dist/assets/navigation-menu.css +1 -1
  5. package/dist/assets/radio-group.css +1 -1
  6. package/dist/badge-DscsRVHR.js +1825 -0
  7. package/dist/components/accordion/accordion.d.ts +1 -1
  8. package/dist/components/accordion/accordion.js +3 -3
  9. package/dist/components/accordion/index.js +1 -1
  10. package/dist/components/badge/badge.js +3 -3
  11. package/dist/components/badge/index.js +1 -1
  12. package/dist/components/box/box.js +8 -8
  13. package/dist/components/button/button.d.ts +2 -1
  14. package/dist/components/button/button.js +59 -60
  15. package/dist/components/card/card.js +3 -3
  16. package/dist/components/card/index.js +1 -1
  17. package/dist/components/flex/flex.js +1 -1
  18. package/dist/components/grid/grid.js +6 -6
  19. package/dist/components/heading/heading.d.ts +9 -36
  20. package/dist/components/heading/heading.js +36 -37
  21. package/dist/components/index.d.ts +2 -0
  22. package/dist/components/index.js +35 -33
  23. package/dist/components/modal/index.d.ts +2 -0
  24. package/dist/components/modal/index.js +4 -0
  25. package/dist/components/modal/modal.d.ts +76 -0
  26. package/dist/components/modal/modal.js +28 -0
  27. package/dist/components/navigation-menu/index.js +1 -1
  28. package/dist/components/navigation-menu/navigation-menu.d.ts +2 -0
  29. package/dist/components/navigation-menu/navigation-menu.js +8 -1032
  30. package/dist/components/notification/index.d.ts +2 -0
  31. package/dist/components/notification/index.js +4 -0
  32. package/dist/components/notification/notification.d.ts +59 -0
  33. package/dist/components/notification/notification.js +27 -0
  34. package/dist/components/radio-group/index.js +1 -1
  35. package/dist/components/radio-group/radio-group.js +1 -1
  36. package/dist/components/text-field/text-field.js +15 -15
  37. package/dist/components/toggle/index.js +1 -1
  38. package/dist/components/toggle/toggle.d.ts +1 -1
  39. package/dist/components/toggle/toggle.js +3 -3
  40. package/dist/{index-0Eg2mucA.js → index-FPIZOCcD.js} +80 -80
  41. package/dist/main.js +51 -49
  42. package/dist/navigation-menu-DKuyW8zE.js +1036 -0
  43. package/dist/{radio-group-BR5SMJXJ.js → radio-group-B--zT3OL.js} +8 -8
  44. package/dist/tokens/breakpoint/variables.json.d.ts +11 -0
  45. package/dist/utils/component-props-as.d.ts +5 -0
  46. package/dist/utils/component-props-as.js +1 -0
  47. package/dist/utils/layout/align.d.ts +46 -0
  48. package/dist/utils/layout/align.js +31 -0
  49. package/dist/utils/layout/flex.d.ts +294 -0
  50. package/dist/utils/layout/flex.js +60 -0
  51. package/dist/utils/layout/gap.d.ts +340 -0
  52. package/dist/utils/layout/gap.js +21 -0
  53. package/dist/utils/layout/grid.d.ts +313 -0
  54. package/dist/utils/layout/grid.js +116 -0
  55. package/dist/utils/layout/height.d.ts +118 -0
  56. package/dist/utils/layout/height.js +50 -0
  57. package/dist/utils/layout/index.d.ts +70 -0
  58. package/dist/utils/layout/index.js +71 -0
  59. package/dist/utils/layout/justify.d.ts +39 -0
  60. package/dist/utils/layout/justify.js +16 -0
  61. package/dist/utils/layout/margin.d.ts +478 -0
  62. package/dist/utils/layout/margin.js +32 -0
  63. package/dist/utils/layout/padding.d.ts +478 -0
  64. package/dist/utils/layout/padding.js +32 -0
  65. package/dist/utils/layout/util.d.ts +82 -0
  66. package/dist/utils/layout/util.js +32 -0
  67. package/dist/utils/layout/width.d.ts +69 -0
  68. package/dist/utils/layout/width.js +25 -0
  69. package/package.json +5 -1
  70. package/dist/badge-9vHb0-Jo.js +0 -721
  71. package/dist/tokens/spacing/variables.json.d.ts +0 -34
  72. package/dist/utils/layout.d.ts +0 -150
  73. package/dist/utils/layout.js +0 -221
package/dist/utils/layout/padding.d.ts ADDED
@@ -0,0 +1,478 @@
1
+ import { Responsive } from './util';
2
+
3
+ export declare const paddingValues: readonly [{
4
+ readonly key: "0";
5
+ readonly value: "var(--teddy-spacing-0)";
6
+ }, {
7
+ readonly key: "10";
8
+ readonly value: "var(--teddy-spacing-10)";
9
+ }, {
10
+ readonly key: "25";
11
+ readonly value: "var(--teddy-spacing-25)";
12
+ }, {
13
+ readonly key: "50";
14
+ readonly value: "var(--teddy-spacing-50)";
15
+ }, {
16
+ readonly key: "100";
17
+ readonly value: "var(--teddy-spacing-100)";
18
+ }, {
19
+ readonly key: "150";
20
+ readonly value: "var(--teddy-spacing-150)";
21
+ }, {
22
+ readonly key: "200";
23
+ readonly value: "var(--teddy-spacing-200)";
24
+ }, {
25
+ readonly key: "250";
26
+ readonly value: "var(--teddy-spacing-250)";
27
+ }, {
28
+ readonly key: "300";
29
+ readonly value: "var(--teddy-spacing-300)";
30
+ }, {
31
+ readonly key: "400";
32
+ readonly value: "var(--teddy-spacing-400)";
33
+ }, {
34
+ readonly key: "600";
35
+ readonly value: "var(--teddy-spacing-600)";
36
+ }, {
37
+ readonly key: "800";
38
+ readonly value: "var(--teddy-spacing-800)";
39
+ }, {
40
+ readonly key: "1000";
41
+ readonly value: "var(--teddy-spacing-1000)";
42
+ }, {
43
+ readonly key: "1200";
44
+ readonly value: "var(--teddy-spacing-1200)";
45
+ }, {
46
+ readonly key: "1600";
47
+ readonly value: "var(--teddy-spacing-1600)";
48
+ }, {
49
+ readonly key: "gutter-sm";
50
+ readonly value: "var(--teddy-spacing-gutter-sm)";
51
+ }, {
52
+ readonly key: "gutter-md";
53
+ readonly value: "var(--teddy-spacing-gutter-md)";
54
+ }, {
55
+ readonly key: "gutter-lg";
56
+ readonly value: "var(--teddy-spacing-gutter-lg)";
57
+ }, {
58
+ readonly key: "gutter-xl";
59
+ readonly value: "var(--teddy-spacing-gutter-xl)";
60
+ }, {
61
+ readonly key: "page-padding-sm";
62
+ readonly value: "var(--teddy-spacing-page-padding-sm)";
63
+ }, {
64
+ readonly key: "page-padding-md";
65
+ readonly value: "var(--teddy-spacing-page-padding-md)";
66
+ }, {
67
+ readonly key: "page-padding-lg";
68
+ readonly value: "var(--teddy-spacing-page-padding-lg)";
69
+ }, {
70
+ readonly key: "page-padding-xl";
71
+ readonly value: "var(--teddy-spacing-page-padding-xl)";
72
+ }, {
73
+ readonly key: "auto";
74
+ readonly value: "auto";
75
+ }];
76
+ export type PaddingProps = {
77
+ /**
78
+ * The padding of the element.
79
+ */
80
+ p?: Responsive<(typeof paddingValues)[number]['key']>;
81
+ /**
82
+ * The padding-top of the element.
83
+ */
84
+ pt?: Responsive<(typeof paddingValues)[number]['key']>;
85
+ /**
86
+ * The padding-bottom of the element.
87
+ */
88
+ pb?: Responsive<(typeof paddingValues)[number]['key']>;
89
+ /**
90
+ * The padding-right of the element.
91
+ */
92
+ pr?: Responsive<(typeof paddingValues)[number]['key']>;
93
+ /**
94
+ * The padding-left of the element.s
95
+ */
96
+ pl?: Responsive<(typeof paddingValues)[number]['key']>;
97
+ };
98
+ export declare const paddings: readonly [{
99
+ readonly key: "p";
100
+ readonly className: "teddy-p";
101
+ readonly values: readonly [{
102
+ readonly key: "0";
103
+ readonly value: "var(--teddy-spacing-0)";
104
+ }, {
105
+ readonly key: "10";
106
+ readonly value: "var(--teddy-spacing-10)";
107
+ }, {
108
+ readonly key: "25";
109
+ readonly value: "var(--teddy-spacing-25)";
110
+ }, {
111
+ readonly key: "50";
112
+ readonly value: "var(--teddy-spacing-50)";
113
+ }, {
114
+ readonly key: "100";
115
+ readonly value: "var(--teddy-spacing-100)";
116
+ }, {
117
+ readonly key: "150";
118
+ readonly value: "var(--teddy-spacing-150)";
119
+ }, {
120
+ readonly key: "200";
121
+ readonly value: "var(--teddy-spacing-200)";
122
+ }, {
123
+ readonly key: "250";
124
+ readonly value: "var(--teddy-spacing-250)";
125
+ }, {
126
+ readonly key: "300";
127
+ readonly value: "var(--teddy-spacing-300)";
128
+ }, {
129
+ readonly key: "400";
130
+ readonly value: "var(--teddy-spacing-400)";
131
+ }, {
132
+ readonly key: "600";
133
+ readonly value: "var(--teddy-spacing-600)";
134
+ }, {
135
+ readonly key: "800";
136
+ readonly value: "var(--teddy-spacing-800)";
137
+ }, {
138
+ readonly key: "1000";
139
+ readonly value: "var(--teddy-spacing-1000)";
140
+ }, {
141
+ readonly key: "1200";
142
+ readonly value: "var(--teddy-spacing-1200)";
143
+ }, {
144
+ readonly key: "1600";
145
+ readonly value: "var(--teddy-spacing-1600)";
146
+ }, {
147
+ readonly key: "gutter-sm";
148
+ readonly value: "var(--teddy-spacing-gutter-sm)";
149
+ }, {
150
+ readonly key: "gutter-md";
151
+ readonly value: "var(--teddy-spacing-gutter-md)";
152
+ }, {
153
+ readonly key: "gutter-lg";
154
+ readonly value: "var(--teddy-spacing-gutter-lg)";
155
+ }, {
156
+ readonly key: "gutter-xl";
157
+ readonly value: "var(--teddy-spacing-gutter-xl)";
158
+ }, {
159
+ readonly key: "page-padding-sm";
160
+ readonly value: "var(--teddy-spacing-page-padding-sm)";
161
+ }, {
162
+ readonly key: "page-padding-md";
163
+ readonly value: "var(--teddy-spacing-page-padding-md)";
164
+ }, {
165
+ readonly key: "page-padding-lg";
166
+ readonly value: "var(--teddy-spacing-page-padding-lg)";
167
+ }, {
168
+ readonly key: "page-padding-xl";
169
+ readonly value: "var(--teddy-spacing-page-padding-xl)";
170
+ }, {
171
+ readonly key: "auto";
172
+ readonly value: "auto";
173
+ }];
174
+ }, {
175
+ readonly key: "pt";
176
+ readonly className: "teddy-pt";
177
+ readonly values: readonly [{
178
+ readonly key: "0";
179
+ readonly value: "var(--teddy-spacing-0)";
180
+ }, {
181
+ readonly key: "10";
182
+ readonly value: "var(--teddy-spacing-10)";
183
+ }, {
184
+ readonly key: "25";
185
+ readonly value: "var(--teddy-spacing-25)";
186
+ }, {
187
+ readonly key: "50";
188
+ readonly value: "var(--teddy-spacing-50)";
189
+ }, {
190
+ readonly key: "100";
191
+ readonly value: "var(--teddy-spacing-100)";
192
+ }, {
193
+ readonly key: "150";
194
+ readonly value: "var(--teddy-spacing-150)";
195
+ }, {
196
+ readonly key: "200";
197
+ readonly value: "var(--teddy-spacing-200)";
198
+ }, {
199
+ readonly key: "250";
200
+ readonly value: "var(--teddy-spacing-250)";
201
+ }, {
202
+ readonly key: "300";
203
+ readonly value: "var(--teddy-spacing-300)";
204
+ }, {
205
+ readonly key: "400";
206
+ readonly value: "var(--teddy-spacing-400)";
207
+ }, {
208
+ readonly key: "600";
209
+ readonly value: "var(--teddy-spacing-600)";
210
+ }, {
211
+ readonly key: "800";
212
+ readonly value: "var(--teddy-spacing-800)";
213
+ }, {
214
+ readonly key: "1000";
215
+ readonly value: "var(--teddy-spacing-1000)";
216
+ }, {
217
+ readonly key: "1200";
218
+ readonly value: "var(--teddy-spacing-1200)";
219
+ }, {
220
+ readonly key: "1600";
221
+ readonly value: "var(--teddy-spacing-1600)";
222
+ }, {
223
+ readonly key: "gutter-sm";
224
+ readonly value: "var(--teddy-spacing-gutter-sm)";
225
+ }, {
226
+ readonly key: "gutter-md";
227
+ readonly value: "var(--teddy-spacing-gutter-md)";
228
+ }, {
229
+ readonly key: "gutter-lg";
230
+ readonly value: "var(--teddy-spacing-gutter-lg)";
231
+ }, {
232
+ readonly key: "gutter-xl";
233
+ readonly value: "var(--teddy-spacing-gutter-xl)";
234
+ }, {
235
+ readonly key: "page-padding-sm";
236
+ readonly value: "var(--teddy-spacing-page-padding-sm)";
237
+ }, {
238
+ readonly key: "page-padding-md";
239
+ readonly value: "var(--teddy-spacing-page-padding-md)";
240
+ }, {
241
+ readonly key: "page-padding-lg";
242
+ readonly value: "var(--teddy-spacing-page-padding-lg)";
243
+ }, {
244
+ readonly key: "page-padding-xl";
245
+ readonly value: "var(--teddy-spacing-page-padding-xl)";
246
+ }, {
247
+ readonly key: "auto";
248
+ readonly value: "auto";
249
+ }];
250
+ }, {
251
+ readonly key: "pb";
252
+ readonly className: "teddy-pb";
253
+ readonly values: readonly [{
254
+ readonly key: "0";
255
+ readonly value: "var(--teddy-spacing-0)";
256
+ }, {
257
+ readonly key: "10";
258
+ readonly value: "var(--teddy-spacing-10)";
259
+ }, {
260
+ readonly key: "25";
261
+ readonly value: "var(--teddy-spacing-25)";
262
+ }, {
263
+ readonly key: "50";
264
+ readonly value: "var(--teddy-spacing-50)";
265
+ }, {
266
+ readonly key: "100";
267
+ readonly value: "var(--teddy-spacing-100)";
268
+ }, {
269
+ readonly key: "150";
270
+ readonly value: "var(--teddy-spacing-150)";
271
+ }, {
272
+ readonly key: "200";
273
+ readonly value: "var(--teddy-spacing-200)";
274
+ }, {
275
+ readonly key: "250";
276
+ readonly value: "var(--teddy-spacing-250)";
277
+ }, {
278
+ readonly key: "300";
279
+ readonly value: "var(--teddy-spacing-300)";
280
+ }, {
281
+ readonly key: "400";
282
+ readonly value: "var(--teddy-spacing-400)";
283
+ }, {
284
+ readonly key: "600";
285
+ readonly value: "var(--teddy-spacing-600)";
286
+ }, {
287
+ readonly key: "800";
288
+ readonly value: "var(--teddy-spacing-800)";
289
+ }, {
290
+ readonly key: "1000";
291
+ readonly value: "var(--teddy-spacing-1000)";
292
+ }, {
293
+ readonly key: "1200";
294
+ readonly value: "var(--teddy-spacing-1200)";
295
+ }, {
296
+ readonly key: "1600";
297
+ readonly value: "var(--teddy-spacing-1600)";
298
+ }, {
299
+ readonly key: "gutter-sm";
300
+ readonly value: "var(--teddy-spacing-gutter-sm)";
301
+ }, {
302
+ readonly key: "gutter-md";
303
+ readonly value: "var(--teddy-spacing-gutter-md)";
304
+ }, {
305
+ readonly key: "gutter-lg";
306
+ readonly value: "var(--teddy-spacing-gutter-lg)";
307
+ }, {
308
+ readonly key: "gutter-xl";
309
+ readonly value: "var(--teddy-spacing-gutter-xl)";
310
+ }, {
311
+ readonly key: "page-padding-sm";
312
+ readonly value: "var(--teddy-spacing-page-padding-sm)";
313
+ }, {
314
+ readonly key: "page-padding-md";
315
+ readonly value: "var(--teddy-spacing-page-padding-md)";
316
+ }, {
317
+ readonly key: "page-padding-lg";
318
+ readonly value: "var(--teddy-spacing-page-padding-lg)";
319
+ }, {
320
+ readonly key: "page-padding-xl";
321
+ readonly value: "var(--teddy-spacing-page-padding-xl)";
322
+ }, {
323
+ readonly key: "auto";
324
+ readonly value: "auto";
325
+ }];
326
+ }, {
327
+ readonly key: "pl";
328
+ readonly className: "teddy-pl";
329
+ readonly values: readonly [{
330
+ readonly key: "0";
331
+ readonly value: "var(--teddy-spacing-0)";
332
+ }, {
333
+ readonly key: "10";
334
+ readonly value: "var(--teddy-spacing-10)";
335
+ }, {
336
+ readonly key: "25";
337
+ readonly value: "var(--teddy-spacing-25)";
338
+ }, {
339
+ readonly key: "50";
340
+ readonly value: "var(--teddy-spacing-50)";
341
+ }, {
342
+ readonly key: "100";
343
+ readonly value: "var(--teddy-spacing-100)";
344
+ }, {
345
+ readonly key: "150";
346
+ readonly value: "var(--teddy-spacing-150)";
347
+ }, {
348
+ readonly key: "200";
349
+ readonly value: "var(--teddy-spacing-200)";
350
+ }, {
351
+ readonly key: "250";
352
+ readonly value: "var(--teddy-spacing-250)";
353
+ }, {
354
+ readonly key: "300";
355
+ readonly value: "var(--teddy-spacing-300)";
356
+ }, {
357
+ readonly key: "400";
358
+ readonly value: "var(--teddy-spacing-400)";
359
+ }, {
360
+ readonly key: "600";
361
+ readonly value: "var(--teddy-spacing-600)";
362
+ }, {
363
+ readonly key: "800";
364
+ readonly value: "var(--teddy-spacing-800)";
365
+ }, {
366
+ readonly key: "1000";
367
+ readonly value: "var(--teddy-spacing-1000)";
368
+ }, {
369
+ readonly key: "1200";
370
+ readonly value: "var(--teddy-spacing-1200)";
371
+ }, {
372
+ readonly key: "1600";
373
+ readonly value: "var(--teddy-spacing-1600)";
374
+ }, {
375
+ readonly key: "gutter-sm";
376
+ readonly value: "var(--teddy-spacing-gutter-sm)";
377
+ }, {
378
+ readonly key: "gutter-md";
379
+ readonly value: "var(--teddy-spacing-gutter-md)";
380
+ }, {
381
+ readonly key: "gutter-lg";
382
+ readonly value: "var(--teddy-spacing-gutter-lg)";
383
+ }, {
384
+ readonly key: "gutter-xl";
385
+ readonly value: "var(--teddy-spacing-gutter-xl)";
386
+ }, {
387
+ readonly key: "page-padding-sm";
388
+ readonly value: "var(--teddy-spacing-page-padding-sm)";
389
+ }, {
390
+ readonly key: "page-padding-md";
391
+ readonly value: "var(--teddy-spacing-page-padding-md)";
392
+ }, {
393
+ readonly key: "page-padding-lg";
394
+ readonly value: "var(--teddy-spacing-page-padding-lg)";
395
+ }, {
396
+ readonly key: "page-padding-xl";
397
+ readonly value: "var(--teddy-spacing-page-padding-xl)";
398
+ }, {
399
+ readonly key: "auto";
400
+ readonly value: "auto";
401
+ }];
402
+ }, {
403
+ readonly key: "pr";
404
+ readonly className: "teddy-pr";
405
+ readonly values: readonly [{
406
+ readonly key: "0";
407
+ readonly value: "var(--teddy-spacing-0)";
408
+ }, {
409
+ readonly key: "10";
410
+ readonly value: "var(--teddy-spacing-10)";
411
+ }, {
412
+ readonly key: "25";
413
+ readonly value: "var(--teddy-spacing-25)";
414
+ }, {
415
+ readonly key: "50";
416
+ readonly value: "var(--teddy-spacing-50)";
417
+ }, {
418
+ readonly key: "100";
419
+ readonly value: "var(--teddy-spacing-100)";
420
+ }, {
421
+ readonly key: "150";
422
+ readonly value: "var(--teddy-spacing-150)";
423
+ }, {
424
+ readonly key: "200";
425
+ readonly value: "var(--teddy-spacing-200)";
426
+ }, {
427
+ readonly key: "250";
428
+ readonly value: "var(--teddy-spacing-250)";
429
+ }, {
430
+ readonly key: "300";
431
+ readonly value: "var(--teddy-spacing-300)";
432
+ }, {
433
+ readonly key: "400";
434
+ readonly value: "var(--teddy-spacing-400)";
435
+ }, {
436
+ readonly key: "600";
437
+ readonly value: "var(--teddy-spacing-600)";
438
+ }, {
439
+ readonly key: "800";
440
+ readonly value: "var(--teddy-spacing-800)";
441
+ }, {
442
+ readonly key: "1000";
443
+ readonly value: "var(--teddy-spacing-1000)";
444
+ }, {
445
+ readonly key: "1200";
446
+ readonly value: "var(--teddy-spacing-1200)";
447
+ }, {
448
+ readonly key: "1600";
449
+ readonly value: "var(--teddy-spacing-1600)";
450
+ }, {
451
+ readonly key: "gutter-sm";
452
+ readonly value: "var(--teddy-spacing-gutter-sm)";
453
+ }, {
454
+ readonly key: "gutter-md";
455
+ readonly value: "var(--teddy-spacing-gutter-md)";
456
+ }, {
457
+ readonly key: "gutter-lg";
458
+ readonly value: "var(--teddy-spacing-gutter-lg)";
459
+ }, {
460
+ readonly key: "gutter-xl";
461
+ readonly value: "var(--teddy-spacing-gutter-xl)";
462
+ }, {
463
+ readonly key: "page-padding-sm";
464
+ readonly value: "var(--teddy-spacing-page-padding-sm)";
465
+ }, {
466
+ readonly key: "page-padding-md";
467
+ readonly value: "var(--teddy-spacing-page-padding-md)";
468
+ }, {
469
+ readonly key: "page-padding-lg";
470
+ readonly value: "var(--teddy-spacing-page-padding-lg)";
471
+ }, {
472
+ readonly key: "page-padding-xl";
473
+ readonly value: "var(--teddy-spacing-page-padding-xl)";
474
+ }, {
475
+ readonly key: "auto";
476
+ readonly value: "auto";
477
+ }];
478
+ }];
package/dist/utils/layout/padding.js ADDED
@@ -0,0 +1,32 @@
1
+ import { spacingValues as a } from "./util.js";
2
+ const e = [...a, { key: "auto", value: "auto" }], l = [
3
+ {
4
+ key: "p",
5
+ className: "teddy-p",
6
+ values: e
7
+ },
8
+ {
9
+ key: "pt",
10
+ className: "teddy-pt",
11
+ values: e
12
+ },
13
+ {
14
+ key: "pb",
15
+ className: "teddy-pb",
16
+ values: e
17
+ },
18
+ {
19
+ key: "pl",
20
+ className: "teddy-pl",
21
+ values: e
22
+ },
23
+ {
24
+ key: "pr",
25
+ className: "teddy-pr",
26
+ values: e
27
+ }
28
+ ];
29
+ export {
30
+ e as paddingValues,
31
+ l as paddings
32
+ };
package/dist/utils/layout/util.d.ts ADDED
@@ -0,0 +1,82 @@
1
+ import { breakpoint } from '../../tokens/breakpoint/variables.json';
2
+
3
+ export declare const spacingValues: readonly [{
4
+ readonly key: "0";
5
+ readonly value: "var(--teddy-spacing-0)";
6
+ }, {
7
+ readonly key: "10";
8
+ readonly value: "var(--teddy-spacing-10)";
9
+ }, {
10
+ readonly key: "25";
11
+ readonly value: "var(--teddy-spacing-25)";
12
+ }, {
13
+ readonly key: "50";
14
+ readonly value: "var(--teddy-spacing-50)";
15
+ }, {
16
+ readonly key: "100";
17
+ readonly value: "var(--teddy-spacing-100)";
18
+ }, {
19
+ readonly key: "150";
20
+ readonly value: "var(--teddy-spacing-150)";
21
+ }, {
22
+ readonly key: "200";
23
+ readonly value: "var(--teddy-spacing-200)";
24
+ }, {
25
+ readonly key: "250";
26
+ readonly value: "var(--teddy-spacing-250)";
27
+ }, {
28
+ readonly key: "300";
29
+ readonly value: "var(--teddy-spacing-300)";
30
+ }, {
31
+ readonly key: "400";
32
+ readonly value: "var(--teddy-spacing-400)";
33
+ }, {
34
+ readonly key: "600";
35
+ readonly value: "var(--teddy-spacing-600)";
36
+ }, {
37
+ readonly key: "800";
38
+ readonly value: "var(--teddy-spacing-800)";
39
+ }, {
40
+ readonly key: "1000";
41
+ readonly value: "var(--teddy-spacing-1000)";
42
+ }, {
43
+ readonly key: "1200";
44
+ readonly value: "var(--teddy-spacing-1200)";
45
+ }, {
46
+ readonly key: "1600";
47
+ readonly value: "var(--teddy-spacing-1600)";
48
+ }, {
49
+ readonly key: "gutter-sm";
50
+ readonly value: "var(--teddy-spacing-gutter-sm)";
51
+ }, {
52
+ readonly key: "gutter-md";
53
+ readonly value: "var(--teddy-spacing-gutter-md)";
54
+ }, {
55
+ readonly key: "gutter-lg";
56
+ readonly value: "var(--teddy-spacing-gutter-lg)";
57
+ }, {
58
+ readonly key: "gutter-xl";
59
+ readonly value: "var(--teddy-spacing-gutter-xl)";
60
+ }, {
61
+ readonly key: "page-padding-sm";
62
+ readonly value: "var(--teddy-spacing-page-padding-sm)";
63
+ }, {
64
+ readonly key: "page-padding-md";
65
+ readonly value: "var(--teddy-spacing-page-padding-md)";
66
+ }, {
67
+ readonly key: "page-padding-lg";
68
+ readonly value: "var(--teddy-spacing-page-padding-lg)";
69
+ }, {
70
+ readonly key: "page-padding-xl";
71
+ readonly value: "var(--teddy-spacing-page-padding-xl)";
72
+ }];
73
+ export type Breakpoint = keyof typeof breakpoint;
74
+ type AnyCssValue = string & NonNullable<unknown>;
75
+ export type Responsive<T> = {
76
+ [key in Breakpoint]?: T | AnyCssValue;
77
+ } | (T | AnyCssValue);
78
+ export declare const numberIterator: {
79
+ key: "10" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "11" | "12";
80
+ value: "10" | "1" | "2" | "3" | "4" | "5" | "6" | "7" | "8" | "9" | "11" | "12";
81
+ }[];
82
+ export {};
package/dist/utils/layout/util.js ADDED
@@ -0,0 +1,32 @@
1
+ const a = [
2
+ { key: "0", value: "var(--teddy-spacing-0)" },
3
+ { key: "10", value: "var(--teddy-spacing-10)" },
4
+ { key: "25", value: "var(--teddy-spacing-25)" },
5
+ { key: "50", value: "var(--teddy-spacing-50)" },
6
+ { key: "100", value: "var(--teddy-spacing-100)" },
7
+ { key: "150", value: "var(--teddy-spacing-150)" },
8
+ { key: "200", value: "var(--teddy-spacing-200)" },
9
+ { key: "250", value: "var(--teddy-spacing-250)" },
10
+ { key: "300", value: "var(--teddy-spacing-300)" },
11
+ { key: "400", value: "var(--teddy-spacing-400)" },
12
+ { key: "600", value: "var(--teddy-spacing-600)" },
13
+ { key: "800", value: "var(--teddy-spacing-800)" },
14
+ { key: "1000", value: "var(--teddy-spacing-1000)" },
15
+ { key: "1200", value: "var(--teddy-spacing-1200)" },
16
+ { key: "1600", value: "var(--teddy-spacing-1600)" },
17
+ { key: "gutter-sm", value: "var(--teddy-spacing-gutter-sm)" },
18
+ { key: "gutter-md", value: "var(--teddy-spacing-gutter-md)" },
19
+ { key: "gutter-lg", value: "var(--teddy-spacing-gutter-lg)" },
20
+ { key: "gutter-xl", value: "var(--teddy-spacing-gutter-xl)" },
21
+ { key: "page-padding-sm", value: "var(--teddy-spacing-page-padding-sm)" },
22
+ { key: "page-padding-md", value: "var(--teddy-spacing-page-padding-md)" },
23
+ { key: "page-padding-lg", value: "var(--teddy-spacing-page-padding-lg)" },
24
+ { key: "page-padding-xl", value: "var(--teddy-spacing-page-padding-xl)" }
25
+ ], d = ["1", "2", "3", "4", "5", "6", "7", "8", "9", "10", "11", "12"].map((e) => ({
26
+ key: e,
27
+ value: e
28
+ }));
29
+ export {
30
+ d as numberIterator,
31
+ a as spacingValues
32
+ };
package/dist/utils/layout/width.d.ts ADDED
@@ -0,0 +1,69 @@
1
+ import { Responsive } from './util';
2
+
3
+ export declare const widthValues: readonly [{
4
+ readonly key: "auto";
5
+ readonly value: "auto";
6
+ }, {
7
+ readonly key: "100%";
8
+ readonly value: "100%";
9
+ }, {
10
+ readonly key: "50%";
11
+ readonly value: "50%";
12
+ }];
13
+ export type WidthProps = {
14
+ /**
15
+ * Static width.
16
+ * @see https://developer.mozilla.org/en-US/docs/Web/CSS/width
17
+ */
18
+ width?: Responsive<(typeof widthValues)[number]['key']>;
19
+ /**
20
+ * Min width.
21
+ * @see https://developer.mozilla.org/en-US/docs/Web/CSS/min-width
22
+ */
23
+ minWidth?: Responsive<(typeof widthValues)[number]['key']>;
24
+ /**
25
+ * Max width.
26
+ * @see https://developer.mozilla.org/en-US/docs/Web/CSS/max-width
27
+ */
28
+ maxWidth?: Responsive<(typeof widthValues)[number]['key']>;
29
+ };
30
+ export declare const widths: readonly [{
31
+ readonly key: "width";
32
+ readonly className: "teddy-w";
33
+ readonly values: readonly [{
34
+ readonly key: "auto";
35
+ readonly value: "auto";
36
+ }, {
37
+ readonly key: "100%";
38
+ readonly value: "100%";
39
+ }, {
40
+ readonly key: "50%";
41
+ readonly value: "50%";
42
+ }];
43
+ }, {
44
+ readonly key: "minWidth";
45
+ readonly className: "teddy-min-w";
46
+ readonly values: readonly [{
47
+ readonly key: "auto";
48
+ readonly value: "auto";
49
+ }, {
50
+ readonly key: "100%";
51
+ readonly value: "100%";
52
+ }, {
53
+ readonly key: "50%";
54
+ readonly value: "50%";
55
+ }];
56
+ }, {
57
+ readonly key: "maxWidth";
58
+ readonly className: "teddy-max-w";
59
+ readonly values: readonly [{
60
+ readonly key: "auto";
61
+ readonly value: "auto";
62
+ }, {
63
+ readonly key: "100%";
64
+ readonly value: "100%";
65
+ }, {
66
+ readonly key: "50%";
67
+ readonly value: "50%";
68
+ }];
69
+ }];