@guardian/stand 0.0.10 → 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 (37) hide show
  1. package/dist/components/button/Button.cjs +11 -2
  2. package/dist/components/button/Button.js +9 -4
  3. package/dist/components/button/styles.cjs +11 -1
  4. package/dist/components/button/styles.js +11 -1
  5. package/dist/components/icon-button/IconButton.cjs +45 -0
  6. package/dist/components/icon-button/IconButton.js +26 -0
  7. package/dist/components/icon-button/styles.cjs +9 -0
  8. package/dist/components/icon-button/styles.js +6 -0
  9. package/dist/components/icon-link-button/IconLinkButton.cjs +47 -0
  10. package/dist/components/icon-link-button/IconLinkButton.js +23 -0
  11. package/dist/components/icon-link-button/styles.cjs +9 -0
  12. package/dist/components/icon-link-button/styles.js +6 -0
  13. package/dist/components/link-button/LinkButton.cjs +8 -2
  14. package/dist/components/link-button/LinkButton.js +7 -5
  15. package/dist/icon-button.cjs +7 -0
  16. package/dist/icon-button.js +1 -0
  17. package/dist/icon-link-button.cjs +7 -0
  18. package/dist/icon-link-button.js +1 -0
  19. package/dist/styleD/build/css/component/button.css +64 -0
  20. package/dist/styleD/build/typescript/component/button.cjs +208 -16
  21. package/dist/styleD/build/typescript/component/button.js +208 -16
  22. package/dist/types/components/button/Button.d.ts +1 -1
  23. package/dist/types/components/button/styles.d.ts +1 -1
  24. package/dist/types/components/button/types.d.ts +5 -0
  25. package/dist/types/components/icon-button/IconButton.d.ts +2 -0
  26. package/dist/types/components/icon-button/styles.d.ts +522 -0
  27. package/dist/types/components/icon-button/types.d.ts +26 -0
  28. package/dist/types/components/icon-link-button/IconLinkButton.d.ts +2 -0
  29. package/dist/types/components/icon-link-button/styles.d.ts +522 -0
  30. package/dist/types/components/icon-link-button/types.d.ts +26 -0
  31. package/dist/types/components/link-button/LinkButton.d.ts +1 -1
  32. package/dist/types/components/link-button/styles.d.ts +193 -1
  33. package/dist/types/components/link-button/types.d.ts +5 -0
  34. package/dist/types/icon-button.d.ts +20 -0
  35. package/dist/types/icon-link-button.d.ts +20 -0
  36. package/dist/types/styleD/build/typescript/component/button.d.ts +192 -0
  37. package/package.json +17 -1
package/dist/types/styleD/build/typescript/component/button.d.ts CHANGED
@@ -46,12 +46,24 @@ export declare const componentButton: {
46
46
  right: string;
47
47
  bottom: string;
48
48
  left: string;
49
+ withIcon: {
50
+ iconLeft: {
51
+ left: string;
52
+ };
53
+ };
49
54
  };
50
55
  typography: {
51
56
  font: string;
52
57
  letterSpacing: string;
53
58
  fontWidth: number;
54
59
  };
60
+ icon: {
61
+ size: string;
62
+ gap: string;
63
+ };
64
+ iconButton: {
65
+ width: string;
66
+ };
55
67
  };
56
68
  sm: {
57
69
  height: string;
@@ -60,12 +72,24 @@ export declare const componentButton: {
60
72
  right: string;
61
73
  bottom: string;
62
74
  left: string;
75
+ withIcon: {
76
+ iconLeft: {
77
+ left: string;
78
+ };
79
+ };
63
80
  };
64
81
  typography: {
65
82
  font: string;
66
83
  letterSpacing: string;
67
84
  fontWidth: number;
68
85
  };
86
+ icon: {
87
+ size: string;
88
+ gap: string;
89
+ };
90
+ iconButton: {
91
+ width: string;
92
+ };
69
93
  };
70
94
  md: {
71
95
  height: string;
@@ -74,12 +98,24 @@ export declare const componentButton: {
74
98
  right: string;
75
99
  bottom: string;
76
100
  left: string;
101
+ withIcon: {
102
+ iconLeft: {
103
+ left: string;
104
+ };
105
+ };
77
106
  };
78
107
  typography: {
79
108
  font: string;
80
109
  letterSpacing: string;
81
110
  fontWidth: number;
82
111
  };
112
+ icon: {
113
+ size: string;
114
+ gap: string;
115
+ };
116
+ iconButton: {
117
+ width: string;
118
+ };
83
119
  };
84
120
  lg: {
85
121
  height: string;
@@ -88,12 +124,24 @@ export declare const componentButton: {
88
124
  right: string;
89
125
  bottom: string;
90
126
  left: string;
127
+ withIcon: {
128
+ iconLeft: {
129
+ left: string;
130
+ };
131
+ };
91
132
  };
92
133
  typography: {
93
134
  font: string;
94
135
  letterSpacing: string;
95
136
  fontWidth: number;
96
137
  };
138
+ icon: {
139
+ size: string;
140
+ gap: string;
141
+ };
142
+ iconButton: {
143
+ width: string;
144
+ };
97
145
  };
98
146
  };
99
147
  'emphasised-secondary': {
@@ -123,12 +171,24 @@ export declare const componentButton: {
123
171
  right: string;
124
172
  bottom: string;
125
173
  left: string;
174
+ withIcon: {
175
+ iconLeft: {
176
+ left: string;
177
+ };
178
+ };
126
179
  };
127
180
  typography: {
128
181
  font: string;
129
182
  letterSpacing: string;
130
183
  fontWidth: number;
131
184
  };
185
+ icon: {
186
+ size: string;
187
+ gap: string;
188
+ };
189
+ iconButton: {
190
+ width: string;
191
+ };
132
192
  };
133
193
  sm: {
134
194
  height: string;
@@ -137,12 +197,24 @@ export declare const componentButton: {
137
197
  right: string;
138
198
  bottom: string;
139
199
  left: string;
200
+ withIcon: {
201
+ iconLeft: {
202
+ left: string;
203
+ };
204
+ };
140
205
  };
141
206
  typography: {
142
207
  font: string;
143
208
  letterSpacing: string;
144
209
  fontWidth: number;
145
210
  };
211
+ icon: {
212
+ size: string;
213
+ gap: string;
214
+ };
215
+ iconButton: {
216
+ width: string;
217
+ };
146
218
  };
147
219
  md: {
148
220
  height: string;
@@ -151,12 +223,24 @@ export declare const componentButton: {
151
223
  right: string;
152
224
  bottom: string;
153
225
  left: string;
226
+ withIcon: {
227
+ iconLeft: {
228
+ left: string;
229
+ };
230
+ };
154
231
  };
155
232
  typography: {
156
233
  font: string;
157
234
  letterSpacing: string;
158
235
  fontWidth: number;
159
236
  };
237
+ icon: {
238
+ size: string;
239
+ gap: string;
240
+ };
241
+ iconButton: {
242
+ width: string;
243
+ };
160
244
  };
161
245
  lg: {
162
246
  height: string;
@@ -165,12 +249,24 @@ export declare const componentButton: {
165
249
  right: string;
166
250
  bottom: string;
167
251
  left: string;
252
+ withIcon: {
253
+ iconLeft: {
254
+ left: string;
255
+ };
256
+ };
168
257
  };
169
258
  typography: {
170
259
  font: string;
171
260
  letterSpacing: string;
172
261
  fontWidth: number;
173
262
  };
263
+ icon: {
264
+ size: string;
265
+ gap: string;
266
+ };
267
+ iconButton: {
268
+ width: string;
269
+ };
174
270
  };
175
271
  };
176
272
  'neutral-primary': {
@@ -200,12 +296,24 @@ export declare const componentButton: {
200
296
  right: string;
201
297
  bottom: string;
202
298
  left: string;
299
+ withIcon: {
300
+ iconLeft: {
301
+ left: string;
302
+ };
303
+ };
203
304
  };
204
305
  typography: {
205
306
  font: string;
206
307
  letterSpacing: string;
207
308
  fontWidth: number;
208
309
  };
310
+ icon: {
311
+ size: string;
312
+ gap: string;
313
+ };
314
+ iconButton: {
315
+ width: string;
316
+ };
209
317
  };
210
318
  sm: {
211
319
  height: string;
@@ -214,12 +322,24 @@ export declare const componentButton: {
214
322
  right: string;
215
323
  bottom: string;
216
324
  left: string;
325
+ withIcon: {
326
+ iconLeft: {
327
+ left: string;
328
+ };
329
+ };
217
330
  };
218
331
  typography: {
219
332
  font: string;
220
333
  letterSpacing: string;
221
334
  fontWidth: number;
222
335
  };
336
+ icon: {
337
+ size: string;
338
+ gap: string;
339
+ };
340
+ iconButton: {
341
+ width: string;
342
+ };
223
343
  };
224
344
  md: {
225
345
  height: string;
@@ -228,12 +348,24 @@ export declare const componentButton: {
228
348
  right: string;
229
349
  bottom: string;
230
350
  left: string;
351
+ withIcon: {
352
+ iconLeft: {
353
+ left: string;
354
+ };
355
+ };
231
356
  };
232
357
  typography: {
233
358
  font: string;
234
359
  letterSpacing: string;
235
360
  fontWidth: number;
236
361
  };
362
+ icon: {
363
+ size: string;
364
+ gap: string;
365
+ };
366
+ iconButton: {
367
+ width: string;
368
+ };
237
369
  };
238
370
  lg: {
239
371
  height: string;
@@ -242,12 +374,24 @@ export declare const componentButton: {
242
374
  right: string;
243
375
  bottom: string;
244
376
  left: string;
377
+ withIcon: {
378
+ iconLeft: {
379
+ left: string;
380
+ };
381
+ };
245
382
  };
246
383
  typography: {
247
384
  font: string;
248
385
  letterSpacing: string;
249
386
  fontWidth: number;
250
387
  };
388
+ icon: {
389
+ size: string;
390
+ gap: string;
391
+ };
392
+ iconButton: {
393
+ width: string;
394
+ };
251
395
  };
252
396
  };
253
397
  'neutral-secondary': {
@@ -277,12 +421,24 @@ export declare const componentButton: {
277
421
  right: string;
278
422
  bottom: string;
279
423
  left: string;
424
+ withIcon: {
425
+ iconLeft: {
426
+ left: string;
427
+ };
428
+ };
280
429
  };
281
430
  typography: {
282
431
  font: string;
283
432
  letterSpacing: string;
284
433
  fontWidth: number;
285
434
  };
435
+ icon: {
436
+ size: string;
437
+ gap: string;
438
+ };
439
+ iconButton: {
440
+ width: string;
441
+ };
286
442
  };
287
443
  sm: {
288
444
  height: string;
@@ -291,12 +447,24 @@ export declare const componentButton: {
291
447
  right: string;
292
448
  bottom: string;
293
449
  left: string;
450
+ withIcon: {
451
+ iconLeft: {
452
+ left: string;
453
+ };
454
+ };
294
455
  };
295
456
  typography: {
296
457
  font: string;
297
458
  letterSpacing: string;
298
459
  fontWidth: number;
299
460
  };
461
+ icon: {
462
+ size: string;
463
+ gap: string;
464
+ };
465
+ iconButton: {
466
+ width: string;
467
+ };
300
468
  };
301
469
  md: {
302
470
  height: string;
@@ -305,12 +473,24 @@ export declare const componentButton: {
305
473
  right: string;
306
474
  bottom: string;
307
475
  left: string;
476
+ withIcon: {
477
+ iconLeft: {
478
+ left: string;
479
+ };
480
+ };
308
481
  };
309
482
  typography: {
310
483
  font: string;
311
484
  letterSpacing: string;
312
485
  fontWidth: number;
313
486
  };
487
+ icon: {
488
+ size: string;
489
+ gap: string;
490
+ };
491
+ iconButton: {
492
+ width: string;
493
+ };
314
494
  };
315
495
  lg: {
316
496
  height: string;
@@ -319,12 +499,24 @@ export declare const componentButton: {
319
499
  right: string;
320
500
  bottom: string;
321
501
  left: string;
502
+ withIcon: {
503
+ iconLeft: {
504
+ left: string;
505
+ };
506
+ };
322
507
  };
323
508
  typography: {
324
509
  font: string;
325
510
  letterSpacing: string;
326
511
  fontWidth: number;
327
512
  };
513
+ icon: {
514
+ size: string;
515
+ gap: string;
516
+ };
517
+ iconButton: {
518
+ width: string;
519
+ };
328
520
  };
329
521
  };
330
522
  };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@guardian/stand",
3
- "version": "0.0.10",
3
+ "version": "0.0.11",
4
4
  "type": "module",
5
5
  "//exports": "Each component has its own entry point for optimal tree-shaking. Main entry point only includes design tokens and utilities. New components/foundations should follow the same pattern.",
6
6
  "exports": {
@@ -24,6 +24,16 @@
24
24
  "import": "./dist/link-button.js",
25
25
  "require": "./dist/link-button.cjs"
26
26
  },
27
+ "./icon-button": {
28
+ "types": "./dist/types/icon-button.d.ts",
29
+ "import": "./dist/icon-button.js",
30
+ "require": "./dist/icon-button.cjs"
31
+ },
32
+ "./icon-link-button": {
33
+ "types": "./dist/types/icon-link-button.d.ts",
34
+ "import": "./dist/icon-link-button.js",
35
+ "require": "./dist/icon-link-button.cjs"
36
+ },
27
37
  "./typography": {
28
38
  "types": "./dist/types/typography.d.ts",
29
39
  "import": "./dist/typography.js",
@@ -88,6 +98,12 @@
88
98
  "link-button": [
89
99
  "./dist/types/link-button.d.ts"
90
100
  ],
101
+ "icon-button": [
102
+ "./dist/types/icon-button.d.ts"
103
+ ],
104
+ "icon-link-button": [
105
+ "./dist/types/icon-link-button.d.ts"
106
+ ],
91
107
  "typography": [
92
108
  "./dist/types/typography.d.ts"
93
109
  ],