Skip to content

Commit aa19228

Browse files
nkrantzkodiakhq[bot]
nkrantz
and
kodiakhq[bot]
authored
feat(design-tokens): add spacing tokens up to 310 (#4139)
Co-authored-by: kodiakhq[bot] <49736102+kodiakhq[bot]@users.noreply.github.com>
1 parent aa41c6f commit aa19228

File tree

23 files changed

+256
-162
lines changed

23 files changed

+256
-162
lines changed

‎.changeset/shy-readers-scream.md‎

Lines changed: 6 additions & 0 deletions
Original file line numberDiff line numberDiff line change
@@ -0,0 +1,6 @@
1+
---
2+
"@twilio-paste/design-tokens": minor
3+
"@twilio-paste/core": minor
4+
---
5+
6+
[Design Tokens] add new spacing tokens up to space-310

‎packages/paste-core/components/anchor/type-docs.json‎

Lines changed: 16 additions & 16 deletions
Original file line numberDiff line numberDiff line change
@@ -374,7 +374,7 @@
374374
"externalProp": true
375375
},
376376
"columnGap": {
377-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
377+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
378378
"defaultValue": null,
379379
"required": false,
380380
"externalProp": false,
@@ -543,49 +543,49 @@
543543
"externalProp": true
544544
},
545545
"margin": {
546-
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 28 more ... | { ...; }",
546+
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 39 more ... | { ...; }",
547547
"defaultValue": null,
548548
"required": false,
549549
"externalProp": false,
550550
"description": "Responsive prop of Space tokens for the CSS `margin` property"
551551
},
552552
"marginBottom": {
553-
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 28 more ... | { ...; }",
553+
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 39 more ... | { ...; }",
554554
"defaultValue": null,
555555
"required": false,
556556
"externalProp": false,
557557
"description": "Responsive prop of Space tokens for the CSS `margin-bottom` property"
558558
},
559559
"marginLeft": {
560-
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 28 more ... | { ...; }",
560+
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 39 more ... | { ...; }",
561561
"defaultValue": null,
562562
"required": false,
563563
"externalProp": false,
564564
"description": "Responsive prop of Space tokens for the CSS `margin-left` property"
565565
},
566566
"marginRight": {
567-
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 28 more ... | { ...; }",
567+
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 39 more ... | { ...; }",
568568
"defaultValue": null,
569569
"required": false,
570570
"externalProp": false,
571571
"description": "Responsive prop of Space tokens for the CSS `margin-right` property"
572572
},
573573
"marginTop": {
574-
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 28 more ... | { ...; }",
574+
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 39 more ... | { ...; }",
575575
"defaultValue": null,
576576
"required": false,
577577
"externalProp": false,
578578
"description": "Responsive prop of Space tokens for the CSS `margin-top` property"
579579
},
580580
"marginX": {
581-
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 28 more ... | { ...; }",
581+
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 39 more ... | { ...; }",
582582
"defaultValue": null,
583583
"required": false,
584584
"externalProp": false,
585585
"description": "Responsive prop of Space tokens for the CSS `margin-left` and `margin-right` properties"
586586
},
587587
"marginY": {
588-
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 28 more ... | { ...; }",
588+
"type": "\"auto\" | \"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | ... 39 more ... | { ...; }",
589589
"defaultValue": null,
590590
"required": false,
591591
"externalProp": false,
@@ -1622,49 +1622,49 @@
16221622
"externalProp": false
16231623
},
16241624
"padding": {
1625-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1625+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
16261626
"defaultValue": null,
16271627
"required": false,
16281628
"externalProp": false,
16291629
"description": "Responsive prop of Space tokens for the CSS `padding` property"
16301630
},
16311631
"paddingBottom": {
1632-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1632+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
16331633
"defaultValue": null,
16341634
"required": false,
16351635
"externalProp": false,
16361636
"description": "Responsive prop of Space tokens for the CSS `padding-bottom` property"
16371637
},
16381638
"paddingLeft": {
1639-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1639+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
16401640
"defaultValue": null,
16411641
"required": false,
16421642
"externalProp": false,
16431643
"description": "Responsive prop of Space tokens for the CSS `padding-left` property"
16441644
},
16451645
"paddingRight": {
1646-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1646+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
16471647
"defaultValue": null,
16481648
"required": false,
16491649
"externalProp": false,
16501650
"description": "Responsive prop of Space tokens for the CSS `padding-right` property"
16511651
},
16521652
"paddingTop": {
1653-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1653+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
16541654
"defaultValue": null,
16551655
"required": false,
16561656
"externalProp": false,
16571657
"description": "Responsive prop of Space tokens for the CSS `padding-top` property"
16581658
},
16591659
"paddingX": {
1660-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1660+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
16611661
"defaultValue": null,
16621662
"required": false,
16631663
"externalProp": false,
16641664
"description": "Responsive prop of Space tokens for the CSS `padding-left` and `padding-right` properties"
16651665
},
16661666
"paddingY": {
1667-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1667+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
16681668
"defaultValue": null,
16691669
"required": false,
16701670
"externalProp": false,
@@ -1732,7 +1732,7 @@
17321732
"externalProp": true
17331733
},
17341734
"rowGap": {
1735-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1735+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
17361736
"defaultValue": null,
17371737
"required": false,
17381738
"externalProp": false

‎packages/paste-core/components/callout/type-docs.json‎

Lines changed: 1 addition & 1 deletion
Original file line numberDiff line numberDiff line change
@@ -516,7 +516,7 @@
516516
"externalProp": true
517517
},
518518
"marginY": {
519-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 28 more ... | \"auto\"",
519+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 39 more ... | \"auto\"",
520520
"defaultValue": "null",
521521
"required": false,
522522
"externalProp": false

‎packages/paste-core/components/card/type-docs.json‎

Lines changed: 7 additions & 7 deletions
Original file line numberDiff line numberDiff line change
@@ -1474,49 +1474,49 @@
14741474
"externalProp": true
14751475
},
14761476
"padding": {
1477-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1477+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
14781478
"defaultValue": null,
14791479
"required": false,
14801480
"externalProp": false,
14811481
"description": "Responsive prop of Space tokens for the CSS `padding` property"
14821482
},
14831483
"paddingBottom": {
1484-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1484+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
14851485
"defaultValue": null,
14861486
"required": false,
14871487
"externalProp": false,
14881488
"description": "Responsive prop of Space tokens for the CSS `padding-bottom` property"
14891489
},
14901490
"paddingLeft": {
1491-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1491+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
14921492
"defaultValue": null,
14931493
"required": false,
14941494
"externalProp": false,
14951495
"description": "Responsive prop of Space tokens for the CSS `padding-left` property"
14961496
},
14971497
"paddingRight": {
1498-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1498+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
14991499
"defaultValue": null,
15001500
"required": false,
15011501
"externalProp": false,
15021502
"description": "Responsive prop of Space tokens for the CSS `padding-right` property"
15031503
},
15041504
"paddingTop": {
1505-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1505+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
15061506
"defaultValue": null,
15071507
"required": false,
15081508
"externalProp": false,
15091509
"description": "Responsive prop of Space tokens for the CSS `padding-top` property"
15101510
},
15111511
"paddingX": {
1512-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1512+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
15131513
"defaultValue": null,
15141514
"required": false,
15151515
"externalProp": false,
15161516
"description": "Responsive prop of Space tokens for the CSS `padding-left` and `padding-right` properties"
15171517
},
15181518
"paddingY": {
1519-
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 27 more ... | { ...; }",
1519+
"type": "\"space0\" | \"space10\" | \"space20\" | \"space30\" | \"space40\" | \"space50\" | \"space60\" | \"space70\" | \"space80\" | \"space90\" | \"space100\" | \"space110\" | \"space120\" | \"space130\" | \"space140\" | ... 38 more ... | { ...; }",
15201520
"defaultValue": null,
15211521
"required": false,
15221522
"externalProp": false,

0 commit comments

Comments
 (0)