@hashicorp/design-system-tokens 1.0.0 → 1.1.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/CHANGELOG.md CHANGED
@@ -1,11 +1,25 @@
1
1
  # @hashicorp/design-system-tokens
2
2
 
3
+ ## 1.1.0
4
+
5
+ ### Minor Changes
6
+
7
+ - [#584](https://github.com/hashicorp/design-system/pull/584) [`258c06d9`](https://github.com/hashicorp/design-system/commit/258c06d952d41696bb8c5b4bab19eb46e4612cdc) Thanks [@didoo](https://github.com/didoo)! - added specific design tokens for the `RadioCard` component
8
+
9
+ ## 1.0.1
10
+
11
+ ### Patch Changes
12
+
13
+ - [#555](https://github.com/hashicorp/design-system/pull/555) [`0b245333`](https://github.com/hashicorp/design-system/commit/0b24533369ccc2d02aa5c6c8b8ba4f722e07d236) Thanks [@didoo](https://github.com/didoo)! - Added design tokens for `code-200` and `code-300` typographic styles
14
+
3
15
  ## 1.0.0
4
16
 
5
17
  ### Major Changes
6
18
 
7
19
  This release signifies the first major release of the HashiCorp Design System. Moving forward we expect to respect [SemVer](https://semver.org/) as we make additional changes to the design system.
8
20
 
21
+ **Note:** Even though this is a major version bump, there should not be any breaking changes from the last minor releases.
22
+
9
23
  ### Minor Changes
10
24
 
11
25
  - added specific design tokens for the `form controls` components
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Sat, 16 Jul 2022 14:15:33 GMT
3
+ * Generated on Thu, 01 Sep 2022 22:06:03 GMT
4
4
  */
5
5
 
6
6
  .hds-font-family-sans-display { font-family: var(--token-typography-font-stack-display); }
@@ -19,3 +19,5 @@
19
19
  .hds-typography-body-200 { font-family: var(--token-typography-body-200-font-family); font-size: var(--token-typography-body-200-font-size); line-height: var(--token-typography-body-200-line-height); margin: 0; padding: 0; }
20
20
  .hds-typography-body-100 { font-family: var(--token-typography-body-100-font-family); font-size: var(--token-typography-body-100-font-size); line-height: var(--token-typography-body-100-line-height); margin: 0; padding: 0; }
21
21
  .hds-typography-code-100 { font-family: var(--token-typography-code-100-font-family); font-size: var(--token-typography-code-100-font-size); line-height: var(--token-typography-code-100-line-height); margin: 0; padding: 0; }
22
+ .hds-typography-code-200 { font-family: var(--token-typography-code-200-font-family); font-size: var(--token-typography-code-200-font-size); line-height: var(--token-typography-code-200-line-height); margin: 0; padding: 0; }
23
+ .hds-typography-code-300 { font-family: var(--token-typography-code-300-font-family); font-size: var(--token-typography-code-300-font-size); line-height: var(--token-typography-code-300-line-height); margin: 0; padding: 0; }
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 19 Jul 2022 13:53:00 GMT
3
+ * Generated on Wed, 28 Sep 2022 11:15:46 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -215,6 +215,12 @@
215
215
  --token-form-radio-background-image-size: 12px;
216
216
  --token-form-radio-background-image-data-url: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e"); /* notice: the 'dot' color is hardcoded here! */
217
217
  --token-form-radio-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e"); /* notice: the 'dot' color is hardcoded here! */
218
+ --token-form-radiocard-group-gap: 16px;
219
+ --token-form-radiocard-border-width: 1px;
220
+ --token-form-radiocard-border-radius: 6px;
221
+ --token-form-radiocard-content-padding: 24px;
222
+ --token-form-radiocard-control-padding: 8px;
223
+ --token-form-radiocard-transition-duration: 0.2s;
218
224
  --token-form-select-background-image-size: 16px;
219
225
  --token-form-select-background-image-position-right-x: 7px;
220
226
  --token-form-select-background-image-position-top-y: 9px;
@@ -274,4 +280,10 @@
274
280
  --token-typography-code-100-font-family: ui-monospace, Menlo, Consolas, monospace;
275
281
  --token-typography-code-100-font-size: 0.8125rem; /* 13px/0.8125rem */
276
282
  --token-typography-code-100-line-height: 1.23; /* 16px */
283
+ --token-typography-code-200-font-family: ui-monospace, Menlo, Consolas, monospace;
284
+ --token-typography-code-200-font-size: 0.875rem; /* 14px/0.875rem */
285
+ --token-typography-code-200-line-height: 1.125; /* 18px */
286
+ --token-typography-code-300-font-family: ui-monospace, Menlo, Consolas, monospace;
287
+ --token-typography-code-300-font-size: 1rem; /* 16px/1rem */
288
+ --token-typography-code-300-line-height: 1.25; /* 20px */
277
289
  }
@@ -4596,6 +4596,128 @@
4596
4596
  "data-url-disabled"
4597
4597
  ]
4598
4598
  },
4599
+ {
4600
+ "value": "16px",
4601
+ "type": "size",
4602
+ "original": {
4603
+ "value": "16",
4604
+ "type": "size"
4605
+ },
4606
+ "name": "token-form-radiocard-group-gap",
4607
+ "attributes": {
4608
+ "category": "form",
4609
+ "type": "radiocard-group",
4610
+ "item": "gap"
4611
+ },
4612
+ "path": [
4613
+ "form",
4614
+ "radiocard-group",
4615
+ "gap"
4616
+ ]
4617
+ },
4618
+ {
4619
+ "value": "1px",
4620
+ "type": "size",
4621
+ "original": {
4622
+ "value": "1",
4623
+ "type": "size"
4624
+ },
4625
+ "name": "token-form-radiocard-border-width",
4626
+ "attributes": {
4627
+ "category": "form",
4628
+ "type": "radiocard",
4629
+ "item": "border",
4630
+ "subitem": "width"
4631
+ },
4632
+ "path": [
4633
+ "form",
4634
+ "radiocard",
4635
+ "border",
4636
+ "width"
4637
+ ]
4638
+ },
4639
+ {
4640
+ "value": "6px",
4641
+ "type": "size",
4642
+ "original": {
4643
+ "value": "6",
4644
+ "type": "size"
4645
+ },
4646
+ "name": "token-form-radiocard-border-radius",
4647
+ "attributes": {
4648
+ "category": "form",
4649
+ "type": "radiocard",
4650
+ "item": "border",
4651
+ "subitem": "radius"
4652
+ },
4653
+ "path": [
4654
+ "form",
4655
+ "radiocard",
4656
+ "border",
4657
+ "radius"
4658
+ ]
4659
+ },
4660
+ {
4661
+ "value": "24px",
4662
+ "type": "size",
4663
+ "original": {
4664
+ "value": "24",
4665
+ "type": "size"
4666
+ },
4667
+ "name": "token-form-radiocard-content-padding",
4668
+ "attributes": {
4669
+ "category": "form",
4670
+ "type": "radiocard",
4671
+ "item": "content-padding"
4672
+ },
4673
+ "path": [
4674
+ "form",
4675
+ "radiocard",
4676
+ "content-padding"
4677
+ ]
4678
+ },
4679
+ {
4680
+ "value": "8px",
4681
+ "type": "size",
4682
+ "original": {
4683
+ "value": "8",
4684
+ "type": "size"
4685
+ },
4686
+ "name": "token-form-radiocard-control-padding",
4687
+ "attributes": {
4688
+ "category": "form",
4689
+ "type": "radiocard",
4690
+ "item": "control-padding"
4691
+ },
4692
+ "path": [
4693
+ "form",
4694
+ "radiocard",
4695
+ "control-padding"
4696
+ ]
4697
+ },
4698
+ {
4699
+ "value": "0.2s",
4700
+ "type": "time",
4701
+ "unit": "s",
4702
+ "original": {
4703
+ "value": "0.2",
4704
+ "type": "time",
4705
+ "unit": "s"
4706
+ },
4707
+ "name": "token-form-radiocard-transition-duration",
4708
+ "attributes": {
4709
+ "category": "form",
4710
+ "type": "radiocard",
4711
+ "item": "transition",
4712
+ "subitem": "duration"
4713
+ },
4714
+ "path": [
4715
+ "form",
4716
+ "radiocard",
4717
+ "transition",
4718
+ "duration"
4719
+ ]
4720
+ },
4599
4721
  {
4600
4722
  "value": "16px",
4601
4723
  "type": "size",
@@ -5748,5 +5870,119 @@
5748
5870
  "code-100",
5749
5871
  "line-height"
5750
5872
  ]
5873
+ },
5874
+ {
5875
+ "value": "ui-monospace, Menlo, Consolas, monospace",
5876
+ "original": {
5877
+ "value": "{typography.font-stack.code.value}"
5878
+ },
5879
+ "name": "token-typography-code-200-font-family",
5880
+ "attributes": {
5881
+ "category": "typography",
5882
+ "type": "code-200",
5883
+ "item": "font-family"
5884
+ },
5885
+ "path": [
5886
+ "typography",
5887
+ "code-200",
5888
+ "font-family"
5889
+ ]
5890
+ },
5891
+ {
5892
+ "value": "0.875rem",
5893
+ "type": "font-size",
5894
+ "comment": "14px/0.875rem",
5895
+ "original": {
5896
+ "value": "14",
5897
+ "type": "font-size",
5898
+ "comment": "14px/0.875rem"
5899
+ },
5900
+ "name": "token-typography-code-200-font-size",
5901
+ "attributes": {
5902
+ "category": "typography",
5903
+ "type": "code-200",
5904
+ "item": "font-size"
5905
+ },
5906
+ "path": [
5907
+ "typography",
5908
+ "code-200",
5909
+ "font-size"
5910
+ ]
5911
+ },
5912
+ {
5913
+ "value": "1.125",
5914
+ "comment": "18px",
5915
+ "original": {
5916
+ "value": "1.125",
5917
+ "comment": "18px"
5918
+ },
5919
+ "name": "token-typography-code-200-line-height",
5920
+ "attributes": {
5921
+ "category": "typography",
5922
+ "type": "code-200",
5923
+ "item": "line-height"
5924
+ },
5925
+ "path": [
5926
+ "typography",
5927
+ "code-200",
5928
+ "line-height"
5929
+ ]
5930
+ },
5931
+ {
5932
+ "value": "ui-monospace, Menlo, Consolas, monospace",
5933
+ "original": {
5934
+ "value": "{typography.font-stack.code.value}"
5935
+ },
5936
+ "name": "token-typography-code-300-font-family",
5937
+ "attributes": {
5938
+ "category": "typography",
5939
+ "type": "code-300",
5940
+ "item": "font-family"
5941
+ },
5942
+ "path": [
5943
+ "typography",
5944
+ "code-300",
5945
+ "font-family"
5946
+ ]
5947
+ },
5948
+ {
5949
+ "value": "1rem",
5950
+ "type": "font-size",
5951
+ "comment": "16px/1rem",
5952
+ "original": {
5953
+ "value": "16",
5954
+ "type": "font-size",
5955
+ "comment": "16px/1rem"
5956
+ },
5957
+ "name": "token-typography-code-300-font-size",
5958
+ "attributes": {
5959
+ "category": "typography",
5960
+ "type": "code-300",
5961
+ "item": "font-size"
5962
+ },
5963
+ "path": [
5964
+ "typography",
5965
+ "code-300",
5966
+ "font-size"
5967
+ ]
5968
+ },
5969
+ {
5970
+ "value": "1.25",
5971
+ "comment": "20px",
5972
+ "original": {
5973
+ "value": "1.25",
5974
+ "comment": "20px"
5975
+ },
5976
+ "name": "token-typography-code-300-line-height",
5977
+ "attributes": {
5978
+ "category": "typography",
5979
+ "type": "code-300",
5980
+ "item": "line-height"
5981
+ },
5982
+ "path": [
5983
+ "typography",
5984
+ "code-300",
5985
+ "line-height"
5986
+ ]
5751
5987
  }
5752
5988
  ]
@@ -4550,6 +4550,128 @@
4550
4550
  "data-url-disabled"
4551
4551
  ]
4552
4552
  },
4553
+ {
4554
+ "value": "16px",
4555
+ "type": "size",
4556
+ "original": {
4557
+ "value": "16",
4558
+ "type": "size"
4559
+ },
4560
+ "name": "token-form-radiocard-group-gap",
4561
+ "attributes": {
4562
+ "category": "form",
4563
+ "type": "radiocard-group",
4564
+ "item": "gap"
4565
+ },
4566
+ "path": [
4567
+ "form",
4568
+ "radiocard-group",
4569
+ "gap"
4570
+ ]
4571
+ },
4572
+ {
4573
+ "value": "1px",
4574
+ "type": "size",
4575
+ "original": {
4576
+ "value": "1",
4577
+ "type": "size"
4578
+ },
4579
+ "name": "token-form-radiocard-border-width",
4580
+ "attributes": {
4581
+ "category": "form",
4582
+ "type": "radiocard",
4583
+ "item": "border",
4584
+ "subitem": "width"
4585
+ },
4586
+ "path": [
4587
+ "form",
4588
+ "radiocard",
4589
+ "border",
4590
+ "width"
4591
+ ]
4592
+ },
4593
+ {
4594
+ "value": "6px",
4595
+ "type": "size",
4596
+ "original": {
4597
+ "value": "6",
4598
+ "type": "size"
4599
+ },
4600
+ "name": "token-form-radiocard-border-radius",
4601
+ "attributes": {
4602
+ "category": "form",
4603
+ "type": "radiocard",
4604
+ "item": "border",
4605
+ "subitem": "radius"
4606
+ },
4607
+ "path": [
4608
+ "form",
4609
+ "radiocard",
4610
+ "border",
4611
+ "radius"
4612
+ ]
4613
+ },
4614
+ {
4615
+ "value": "24px",
4616
+ "type": "size",
4617
+ "original": {
4618
+ "value": "24",
4619
+ "type": "size"
4620
+ },
4621
+ "name": "token-form-radiocard-content-padding",
4622
+ "attributes": {
4623
+ "category": "form",
4624
+ "type": "radiocard",
4625
+ "item": "content-padding"
4626
+ },
4627
+ "path": [
4628
+ "form",
4629
+ "radiocard",
4630
+ "content-padding"
4631
+ ]
4632
+ },
4633
+ {
4634
+ "value": "8px",
4635
+ "type": "size",
4636
+ "original": {
4637
+ "value": "8",
4638
+ "type": "size"
4639
+ },
4640
+ "name": "token-form-radiocard-control-padding",
4641
+ "attributes": {
4642
+ "category": "form",
4643
+ "type": "radiocard",
4644
+ "item": "control-padding"
4645
+ },
4646
+ "path": [
4647
+ "form",
4648
+ "radiocard",
4649
+ "control-padding"
4650
+ ]
4651
+ },
4652
+ {
4653
+ "value": "0.2s",
4654
+ "type": "time",
4655
+ "unit": "s",
4656
+ "original": {
4657
+ "value": "0.2",
4658
+ "type": "time",
4659
+ "unit": "s"
4660
+ },
4661
+ "name": "token-form-radiocard-transition-duration",
4662
+ "attributes": {
4663
+ "category": "form",
4664
+ "type": "radiocard",
4665
+ "item": "transition",
4666
+ "subitem": "duration"
4667
+ },
4668
+ "path": [
4669
+ "form",
4670
+ "radiocard",
4671
+ "transition",
4672
+ "duration"
4673
+ ]
4674
+ },
4553
4675
  {
4554
4676
  "value": "16px",
4555
4677
  "type": "size",
@@ -5702,5 +5824,119 @@
5702
5824
  "code-100",
5703
5825
  "line-height"
5704
5826
  ]
5827
+ },
5828
+ {
5829
+ "value": "ui-monospace, Menlo, Consolas, monospace",
5830
+ "original": {
5831
+ "value": "{typography.font-stack.code.value}"
5832
+ },
5833
+ "name": "token-typography-code-200-font-family",
5834
+ "attributes": {
5835
+ "category": "typography",
5836
+ "type": "code-200",
5837
+ "item": "font-family"
5838
+ },
5839
+ "path": [
5840
+ "typography",
5841
+ "code-200",
5842
+ "font-family"
5843
+ ]
5844
+ },
5845
+ {
5846
+ "value": "0.875rem",
5847
+ "type": "font-size",
5848
+ "comment": "14px/0.875rem",
5849
+ "original": {
5850
+ "value": "14",
5851
+ "type": "font-size",
5852
+ "comment": "14px/0.875rem"
5853
+ },
5854
+ "name": "token-typography-code-200-font-size",
5855
+ "attributes": {
5856
+ "category": "typography",
5857
+ "type": "code-200",
5858
+ "item": "font-size"
5859
+ },
5860
+ "path": [
5861
+ "typography",
5862
+ "code-200",
5863
+ "font-size"
5864
+ ]
5865
+ },
5866
+ {
5867
+ "value": "1.125",
5868
+ "comment": "18px",
5869
+ "original": {
5870
+ "value": "1.125",
5871
+ "comment": "18px"
5872
+ },
5873
+ "name": "token-typography-code-200-line-height",
5874
+ "attributes": {
5875
+ "category": "typography",
5876
+ "type": "code-200",
5877
+ "item": "line-height"
5878
+ },
5879
+ "path": [
5880
+ "typography",
5881
+ "code-200",
5882
+ "line-height"
5883
+ ]
5884
+ },
5885
+ {
5886
+ "value": "ui-monospace, Menlo, Consolas, monospace",
5887
+ "original": {
5888
+ "value": "{typography.font-stack.code.value}"
5889
+ },
5890
+ "name": "token-typography-code-300-font-family",
5891
+ "attributes": {
5892
+ "category": "typography",
5893
+ "type": "code-300",
5894
+ "item": "font-family"
5895
+ },
5896
+ "path": [
5897
+ "typography",
5898
+ "code-300",
5899
+ "font-family"
5900
+ ]
5901
+ },
5902
+ {
5903
+ "value": "1rem",
5904
+ "type": "font-size",
5905
+ "comment": "16px/1rem",
5906
+ "original": {
5907
+ "value": "16",
5908
+ "type": "font-size",
5909
+ "comment": "16px/1rem"
5910
+ },
5911
+ "name": "token-typography-code-300-font-size",
5912
+ "attributes": {
5913
+ "category": "typography",
5914
+ "type": "code-300",
5915
+ "item": "font-size"
5916
+ },
5917
+ "path": [
5918
+ "typography",
5919
+ "code-300",
5920
+ "font-size"
5921
+ ]
5922
+ },
5923
+ {
5924
+ "value": "1.25",
5925
+ "comment": "20px",
5926
+ "original": {
5927
+ "value": "1.25",
5928
+ "comment": "20px"
5929
+ },
5930
+ "name": "token-typography-code-300-line-height",
5931
+ "attributes": {
5932
+ "category": "typography",
5933
+ "type": "code-300",
5934
+ "item": "line-height"
5935
+ },
5936
+ "path": [
5937
+ "typography",
5938
+ "code-300",
5939
+ "line-height"
5940
+ ]
5705
5941
  }
5706
5942
  ]
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Sat, 16 Jul 2022 14:15:33 GMT
3
+ * Generated on Thu, 01 Sep 2022 22:06:03 GMT
4
4
  */
5
5
 
6
6
  .hds-font-family-sans-display { font-family: var(--token-typography-font-stack-display); }
@@ -19,3 +19,5 @@
19
19
  .hds-typography-body-200 { font-family: var(--token-typography-body-200-font-family); font-size: var(--token-typography-body-200-font-size); line-height: var(--token-typography-body-200-line-height); margin: 0; padding: 0; }
20
20
  .hds-typography-body-100 { font-family: var(--token-typography-body-100-font-family); font-size: var(--token-typography-body-100-font-size); line-height: var(--token-typography-body-100-line-height); margin: 0; padding: 0; }
21
21
  .hds-typography-code-100 { font-family: var(--token-typography-code-100-font-family); font-size: var(--token-typography-code-100-font-size); line-height: var(--token-typography-code-100-line-height); margin: 0; padding: 0; }
22
+ .hds-typography-code-200 { font-family: var(--token-typography-code-200-font-family); font-size: var(--token-typography-code-200-font-size); line-height: var(--token-typography-code-200-line-height); margin: 0; padding: 0; }
23
+ .hds-typography-code-300 { font-family: var(--token-typography-code-300-font-family); font-size: var(--token-typography-code-300-font-size); line-height: var(--token-typography-code-300-line-height); margin: 0; padding: 0; }
@@ -1,6 +1,6 @@
1
1
  /**
2
2
  * Do not edit directly
3
- * Generated on Tue, 19 Jul 2022 13:53:00 GMT
3
+ * Generated on Wed, 28 Sep 2022 11:15:46 GMT
4
4
  */
5
5
 
6
6
  :root {
@@ -213,6 +213,12 @@
213
213
  --token-form-radio-background-image-size: 12px;
214
214
  --token-form-radio-background-image-data-url: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%23ffffff'/%3e%3c/svg%3e"); /* notice: the 'dot' color is hardcoded here! */
215
215
  --token-form-radio-background-image-data-url-disabled: url("data:image/svg+xml,%3csvg width='12' height='12' xmlns='http://www.w3.org/2000/svg'%3e%3ccircle cx='6' cy='6' r='2.5' fill='%238C909C'/%3e%3c/svg%3e"); /* notice: the 'dot' color is hardcoded here! */
216
+ --token-form-radiocard-group-gap: 16px;
217
+ --token-form-radiocard-border-width: 1px;
218
+ --token-form-radiocard-border-radius: 6px;
219
+ --token-form-radiocard-content-padding: 24px;
220
+ --token-form-radiocard-control-padding: 8px;
221
+ --token-form-radiocard-transition-duration: 0.2s;
216
222
  --token-form-select-background-image-size: 16px;
217
223
  --token-form-select-background-image-position-right-x: 7px;
218
224
  --token-form-select-background-image-position-top-y: 9px;
@@ -272,4 +278,10 @@
272
278
  --token-typography-code-100-font-family: ui-monospace, Menlo, Consolas, monospace;
273
279
  --token-typography-code-100-font-size: 0.8125rem; /* 13px/0.8125rem */
274
280
  --token-typography-code-100-line-height: 1.23; /* 16px */
281
+ --token-typography-code-200-font-family: ui-monospace, Menlo, Consolas, monospace;
282
+ --token-typography-code-200-font-size: 0.875rem; /* 14px/0.875rem */
283
+ --token-typography-code-200-line-height: 1.125; /* 18px */
284
+ --token-typography-code-300-font-family: ui-monospace, Menlo, Consolas, monospace;
285
+ --token-typography-code-300-font-size: 1rem; /* 16px/1rem */
286
+ --token-typography-code-300-line-height: 1.25; /* 20px */
275
287
  }
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@hashicorp/design-system-tokens",
3
- "version": "1.0.0",
3
+ "version": "1.1.0",
4
4
  "description": "HashiCorp Design Tokens",
5
5
  "keywords": [
6
6
  "hashicorp",