@metamask-previews/design-system-tailwind-preset 0.0.0-preview.fbd1fe9 → 0.2.0-preview.7df341a

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
@@ -7,4 +7,18 @@ and this project adheres to [Semantic Versioning](https://semver.org/spec/v2.0.0
7
7
 
8
8
  ## [Unreleased]
9
9
 
10
- [Unreleased]: https://github.com/MetaMask/metamask-design-system/
10
+ ## [0.2.0]
11
+
12
+ ### Changed
13
+
14
+ - Updated to use new font family configuration from @metamask/design-tokens@6.0.0 ([#499](https://github.com/MetaMask/metamask-design-system/pull/499)). Note: This includes breaking changes in the design-tokens package - see the [@metamask/design-tokens migration guide](../design-tokens/MIGRATION.md#from-version-510-to-600) for details.
15
+
16
+ ## [0.1.0]
17
+
18
+ ### Added
19
+
20
+ - Initial release.
21
+
22
+ [Unreleased]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-tailwind-preset@0.2.0...HEAD
23
+ [0.2.0]: https://github.com/MetaMask/metamask-design-system/compare/@metamask/design-system-tailwind-preset@0.1.0...@metamask/design-system-tailwind-preset@0.2.0
24
+ [0.1.0]: https://github.com/MetaMask/metamask-design-system/releases/tag/@metamask/design-system-tailwind-preset@0.1.0
@@ -23,31 +23,9 @@ exports.typography = {
23
23
  'l-body-xs': 'var(--typography-l-body-xs-font-size)',
24
24
  },
25
25
  fontFamily: {
26
- sans: [
27
- 'Euclid Circular B',
28
- 'Helvetica Neue',
29
- 'Helvetica',
30
- 'Arial',
31
- 'sans-serif',
32
- ],
33
- // small screen typography
34
- 's-display-md': 'var(--typography-s-display-md-font-family)',
35
- 's-heading-lg': 'var(--typography-s-heading-lg-font-family)',
36
- 's-heading-md': 'var(--typography-s-heading-md-font-family)',
37
- 's-heading-sm': 'var(--typography-s-heading-sm-font-family)',
38
- 's-body-lg': 'var(--typography-s-body-lg-regular-font-family)',
39
- 's-body-md': 'var(--typography-s-body-md-font-family)',
40
- 's-body-sm': 'var(--typography-s-body-sm-font-family)',
41
- 's-body-xs': 'var(--typography-s-body-xs-font-family)',
42
- // large screen typography
43
- 'l-display-md': 'var(--typography-l-display-md-font-family)',
44
- 'l-heading-lg': 'var(--typography-l-heading-lg-font-family)',
45
- 'l-heading-md': 'var(--typography-l-heading-md-font-family)',
46
- 'l-heading-sm': 'var(--typography-l-heading-sm-font-family)',
47
- 'l-body-lg': 'var(--typography-l-body-lg-medium-font-family)',
48
- 'l-body-md': 'var(--typography-l-body-md-font-family)',
49
- 'l-body-sm': 'var(--typography-l-body-sm-font-family)',
50
- 'l-body-xs': 'var(--typography-l-body-xs-font-family)',
26
+ default: 'var(--font-family-default)',
27
+ accent: 'var(--font-family-accent)',
28
+ hero: 'var(--font-family-hero)',
51
29
  },
52
30
  letterSpacing: {
53
31
  // small screen typography
@@ -70,24 +48,10 @@ exports.typography = {
70
48
  'l-body-xs': 'var(--typography-l-body-xs-letter-spacing)',
71
49
  },
72
50
  fontWeight: {
73
- // small screen typography
74
- 's-display-md': 'var(--typography-s-display-md-font-weight)',
75
- 's-heading-lg': 'var(--typography-s-heading-lg-font-weight)',
76
- 's-heading-md': 'var(--typography-s-heading-md-font-weight)',
77
- 's-heading-sm': 'var(--typography-s-heading-sm-font-weight)',
78
- 's-body-lg': 'var(--font-weight-regular)',
79
- 's-body-md': 'var(--typography-s-body-md-font-weight)',
80
- 's-body-sm': 'var(--typography-s-body-sm-font-weight)',
81
- 's-body-xs': 'var(--typography-s-body-xs-font-weight)',
82
- // large screen typography
83
- 'l-display-md': 'var(--typography-l-display-md-font-weight)',
84
- 'l-heading-lg': 'var(--typography-l-heading-lg-font-weight)',
85
- 'l-heading-md': 'var(--typography-l-heading-md-font-weight)',
86
- 'l-heading-sm': 'var(--typography-l-heading-sm-font-weight)',
87
- 'l-body-lg': 'var(--font-weight-regular)',
88
- 'l-body-md': 'var(--typography-l-body-md-font-weight)',
89
- 'l-body-sm': 'var(--typography-l-body-sm-font-weight)',
90
- 'l-body-xs': 'var(--typography-l-body-xs-font-weight)',
51
+ // agnostic weights
52
+ regular: 'var(--font-weight-regular)',
53
+ medium: 'var(--font-weight-medium)',
54
+ bold: 'var(--font-weight-bold)',
91
55
  },
92
56
  lineHeight: {
93
57
  // small screen typography
@@ -1 +1 @@
1
- {"version":3,"file":"typography.cjs","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"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","sourcesContent":["export const typography = {\n fontSize: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-font-size)',\n 's-heading-lg': 'var(--typography-s-heading-lg-font-size)',\n 's-heading-md': 'var(--typography-s-heading-md-font-size)',\n 's-heading-sm': 'var(--typography-s-heading-sm-font-size)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-font-size)',\n 's-body-md': 'var(--typography-s-body-md-font-size)',\n 's-body-sm': 'var(--typography-s-body-sm-font-size)',\n 's-body-xs': 'var(--typography-s-body-xs-font-size)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-font-size)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-font-size)',\n 'l-heading-md': 'var(--typography-l-heading-md-font-size)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-font-size)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-font-size)',\n 'l-body-md': 'var(--typography-l-body-md-font-size)',\n 'l-body-sm': 'var(--typography-l-body-sm-font-size)',\n 'l-body-xs': 'var(--typography-l-body-xs-font-size)',\n },\n fontFamily: {\n sans: [\n 'Euclid Circular B', // This should match @font-face set in tailwind.css\n 'Helvetica Neue',\n 'Helvetica',\n 'Arial',\n 'sans-serif',\n ],\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-font-family)',\n 's-heading-lg': 'var(--typography-s-heading-lg-font-family)',\n 's-heading-md': 'var(--typography-s-heading-md-font-family)',\n 's-heading-sm': 'var(--typography-s-heading-sm-font-family)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-font-family)',\n 's-body-md': 'var(--typography-s-body-md-font-family)',\n 's-body-sm': 'var(--typography-s-body-sm-font-family)',\n 's-body-xs': 'var(--typography-s-body-xs-font-family)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-font-family)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-font-family)',\n 'l-heading-md': 'var(--typography-l-heading-md-font-family)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-font-family)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-font-family)',\n 'l-body-md': 'var(--typography-l-body-md-font-family)',\n 'l-body-sm': 'var(--typography-l-body-sm-font-family)',\n 'l-body-xs': 'var(--typography-l-body-xs-font-family)',\n },\n letterSpacing: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-letter-spacing)',\n 's-heading-lg': 'var(--typography-s-heading-lg-letter-spacing)',\n 's-heading-md': 'var(--typography-s-heading-md-letter-spacing)',\n 's-heading-sm': 'var(--typography-s-heading-sm-letter-spacing)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-letter-spacing)',\n 's-body-md': 'var(--typography-s-body-md-letter-spacing)',\n 's-body-sm': 'var(--typography-s-body-sm-letter-spacing)',\n 's-body-xs': 'var(--typography-s-body-xs-letter-spacing)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-letter-spacing)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-letter-spacing)',\n 'l-heading-md': 'var(--typography-l-heading-md-letter-spacing)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-letter-spacing)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-letter-spacing)',\n 'l-body-md': 'var(--typography-l-body-md-letter-spacing)',\n 'l-body-sm': 'var(--typography-l-body-sm-letter-spacing)',\n 'l-body-xs': 'var(--typography-l-body-xs-letter-spacing)',\n },\n fontWeight: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-font-weight)',\n 's-heading-lg': 'var(--typography-s-heading-lg-font-weight)',\n 's-heading-md': 'var(--typography-s-heading-md-font-weight)',\n 's-heading-sm': 'var(--typography-s-heading-sm-font-weight)',\n 's-body-lg': 'var(--font-weight-regular)',\n 's-body-md': 'var(--typography-s-body-md-font-weight)',\n 's-body-sm': 'var(--typography-s-body-sm-font-weight)',\n 's-body-xs': 'var(--typography-s-body-xs-font-weight)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-font-weight)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-font-weight)',\n 'l-heading-md': 'var(--typography-l-heading-md-font-weight)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-font-weight)',\n 'l-body-lg': 'var(--font-weight-regular)',\n 'l-body-md': 'var(--typography-l-body-md-font-weight)',\n 'l-body-sm': 'var(--typography-l-body-sm-font-weight)',\n 'l-body-xs': 'var(--typography-l-body-xs-font-weight)',\n },\n lineHeight: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-line-height)',\n 's-heading-lg': 'var(--typography-s-heading-lg-line-height)',\n 's-heading-md': 'var(--typography-s-heading-md-line-height)',\n 's-heading-sm': 'var(--typography-s-heading-sm-line-height)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-line-height)',\n 's-body-md': 'var(--typography-s-body-md-line-height)',\n 's-body-sm': 'var(--typography-s-body-sm-line-height)',\n 's-body-xs': 'var(--typography-s-body-xs-line-height)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-line-height)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-line-height)',\n 'l-heading-md': 'var(--typography-l-heading-md-line-height)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-line-height)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-line-height)',\n 'l-body-md': 'var(--typography-l-body-md-line-height)',\n 'l-body-sm': 'var(--typography-l-body-sm-line-height)',\n 'l-body-xs': 'var(--typography-l-body-xs-line-height)',\n },\n};\n"]}
1
+ {"version":3,"file":"typography.cjs","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":";;;AAAa,QAAA,UAAU,GAAG;IACxB,QAAQ,EAAE;QACR,0BAA0B;QAC1B,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,WAAW,EAAE,+CAA+C;QAC5D,WAAW,EAAE,uCAAuC;QACpD,WAAW,EAAE,uCAAuC;QACpD,WAAW,EAAE,uCAAuC;QACpD,0BAA0B;QAC1B,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,WAAW,EAAE,8CAA8C;QAC3D,WAAW,EAAE,uCAAuC;QACpD,WAAW,EAAE,uCAAuC;QACpD,WAAW,EAAE,uCAAuC;KACrD;IACD,UAAU,EAAE;QACV,OAAO,EAAE,4BAA4B;QACrC,MAAM,EAAE,2BAA2B;QACnC,IAAI,EAAE,yBAAyB;KAChC;IACD,aAAa,EAAE;QACb,0BAA0B;QAC1B,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,WAAW,EAAE,oDAAoD;QACjE,WAAW,EAAE,4CAA4C;QACzD,WAAW,EAAE,4CAA4C;QACzD,WAAW,EAAE,4CAA4C;QACzD,0BAA0B;QAC1B,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,WAAW,EAAE,mDAAmD;QAChE,WAAW,EAAE,4CAA4C;QACzD,WAAW,EAAE,4CAA4C;QACzD,WAAW,EAAE,4CAA4C;KAC1D;IACD,UAAU,EAAE;QACV,mBAAmB;QACnB,OAAO,EAAE,4BAA4B;QACrC,MAAM,EAAE,2BAA2B;QACnC,IAAI,EAAE,yBAAyB;KAChC;IACD,UAAU,EAAE;QACV,0BAA0B;QAC1B,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,WAAW,EAAE,iDAAiD;QAC9D,WAAW,EAAE,yCAAyC;QACtD,WAAW,EAAE,yCAAyC;QACtD,WAAW,EAAE,yCAAyC;QACtD,0BAA0B;QAC1B,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,WAAW,EAAE,gDAAgD;QAC7D,WAAW,EAAE,yCAAyC;QACtD,WAAW,EAAE,yCAAyC;QACtD,WAAW,EAAE,yCAAyC;KACvD;CACF,CAAC","sourcesContent":["export const typography = {\n fontSize: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-font-size)',\n 's-heading-lg': 'var(--typography-s-heading-lg-font-size)',\n 's-heading-md': 'var(--typography-s-heading-md-font-size)',\n 's-heading-sm': 'var(--typography-s-heading-sm-font-size)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-font-size)',\n 's-body-md': 'var(--typography-s-body-md-font-size)',\n 's-body-sm': 'var(--typography-s-body-sm-font-size)',\n 's-body-xs': 'var(--typography-s-body-xs-font-size)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-font-size)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-font-size)',\n 'l-heading-md': 'var(--typography-l-heading-md-font-size)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-font-size)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-font-size)',\n 'l-body-md': 'var(--typography-l-body-md-font-size)',\n 'l-body-sm': 'var(--typography-l-body-sm-font-size)',\n 'l-body-xs': 'var(--typography-l-body-xs-font-size)',\n },\n fontFamily: {\n default: 'var(--font-family-default)',\n accent: 'var(--font-family-accent)',\n hero: 'var(--font-family-hero)',\n },\n letterSpacing: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-letter-spacing)',\n 's-heading-lg': 'var(--typography-s-heading-lg-letter-spacing)',\n 's-heading-md': 'var(--typography-s-heading-md-letter-spacing)',\n 's-heading-sm': 'var(--typography-s-heading-sm-letter-spacing)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-letter-spacing)',\n 's-body-md': 'var(--typography-s-body-md-letter-spacing)',\n 's-body-sm': 'var(--typography-s-body-sm-letter-spacing)',\n 's-body-xs': 'var(--typography-s-body-xs-letter-spacing)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-letter-spacing)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-letter-spacing)',\n 'l-heading-md': 'var(--typography-l-heading-md-letter-spacing)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-letter-spacing)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-letter-spacing)',\n 'l-body-md': 'var(--typography-l-body-md-letter-spacing)',\n 'l-body-sm': 'var(--typography-l-body-sm-letter-spacing)',\n 'l-body-xs': 'var(--typography-l-body-xs-letter-spacing)',\n },\n fontWeight: {\n // agnostic weights\n regular: 'var(--font-weight-regular)',\n medium: 'var(--font-weight-medium)',\n bold: 'var(--font-weight-bold)',\n },\n lineHeight: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-line-height)',\n 's-heading-lg': 'var(--typography-s-heading-lg-line-height)',\n 's-heading-md': 'var(--typography-s-heading-md-line-height)',\n 's-heading-sm': 'var(--typography-s-heading-sm-line-height)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-line-height)',\n 's-body-md': 'var(--typography-s-body-md-line-height)',\n 's-body-sm': 'var(--typography-s-body-sm-line-height)',\n 's-body-xs': 'var(--typography-s-body-xs-line-height)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-line-height)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-line-height)',\n 'l-heading-md': 'var(--typography-l-heading-md-line-height)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-line-height)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-line-height)',\n 'l-body-md': 'var(--typography-l-body-md-line-height)',\n 'l-body-sm': 'var(--typography-l-body-sm-line-height)',\n 'l-body-xs': 'var(--typography-l-body-xs-line-height)',\n },\n};\n"]}
@@ -18,23 +18,9 @@ export declare const typography: {
18
18
  'l-body-xs': string;
19
19
  };
20
20
  fontFamily: {
21
- sans: string[];
22
- 's-display-md': string;
23
- 's-heading-lg': string;
24
- 's-heading-md': string;
25
- 's-heading-sm': string;
26
- 's-body-lg': string;
27
- 's-body-md': string;
28
- 's-body-sm': string;
29
- 's-body-xs': string;
30
- 'l-display-md': string;
31
- 'l-heading-lg': string;
32
- 'l-heading-md': string;
33
- 'l-heading-sm': string;
34
- 'l-body-lg': string;
35
- 'l-body-md': string;
36
- 'l-body-sm': string;
37
- 'l-body-xs': string;
21
+ default: string;
22
+ accent: string;
23
+ hero: string;
38
24
  };
39
25
  letterSpacing: {
40
26
  's-display-md': string;
@@ -55,22 +41,9 @@ export declare const typography: {
55
41
  'l-body-xs': string;
56
42
  };
57
43
  fontWeight: {
58
- 's-display-md': string;
59
- 's-heading-lg': string;
60
- 's-heading-md': string;
61
- 's-heading-sm': string;
62
- 's-body-lg': string;
63
- 's-body-md': string;
64
- 's-body-sm': string;
65
- 's-body-xs': string;
66
- 'l-display-md': string;
67
- 'l-heading-lg': string;
68
- 'l-heading-md': string;
69
- 'l-heading-sm': string;
70
- 'l-body-lg': string;
71
- 'l-body-md': string;
72
- 'l-body-sm': string;
73
- 'l-body-xs': string;
44
+ regular: string;
45
+ medium: string;
46
+ bold: string;
74
47
  };
75
48
  lineHeight: {
76
49
  's-display-md': string;
@@ -1 +1 @@
1
- {"version":3,"file":"typography.d.cts","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4GtB,CAAC"}
1
+ {"version":3,"file":"typography.d.cts","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwEtB,CAAC"}
@@ -18,23 +18,9 @@ export declare const typography: {
18
18
  'l-body-xs': string;
19
19
  };
20
20
  fontFamily: {
21
- sans: string[];
22
- 's-display-md': string;
23
- 's-heading-lg': string;
24
- 's-heading-md': string;
25
- 's-heading-sm': string;
26
- 's-body-lg': string;
27
- 's-body-md': string;
28
- 's-body-sm': string;
29
- 's-body-xs': string;
30
- 'l-display-md': string;
31
- 'l-heading-lg': string;
32
- 'l-heading-md': string;
33
- 'l-heading-sm': string;
34
- 'l-body-lg': string;
35
- 'l-body-md': string;
36
- 'l-body-sm': string;
37
- 'l-body-xs': string;
21
+ default: string;
22
+ accent: string;
23
+ hero: string;
38
24
  };
39
25
  letterSpacing: {
40
26
  's-display-md': string;
@@ -55,22 +41,9 @@ export declare const typography: {
55
41
  'l-body-xs': string;
56
42
  };
57
43
  fontWeight: {
58
- 's-display-md': string;
59
- 's-heading-lg': string;
60
- 's-heading-md': string;
61
- 's-heading-sm': string;
62
- 's-body-lg': string;
63
- 's-body-md': string;
64
- 's-body-sm': string;
65
- 's-body-xs': string;
66
- 'l-display-md': string;
67
- 'l-heading-lg': string;
68
- 'l-heading-md': string;
69
- 'l-heading-sm': string;
70
- 'l-body-lg': string;
71
- 'l-body-md': string;
72
- 'l-body-sm': string;
73
- 'l-body-xs': string;
44
+ regular: string;
45
+ medium: string;
46
+ bold: string;
74
47
  };
75
48
  lineHeight: {
76
49
  's-display-md': string;
@@ -1 +1 @@
1
- {"version":3,"file":"typography.d.mts","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CA4GtB,CAAC"}
1
+ {"version":3,"file":"typography.d.mts","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"AAAA,eAAO,MAAM,UAAU;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;CAwEtB,CAAC"}
@@ -20,31 +20,9 @@ export const typography = {
20
20
  'l-body-xs': 'var(--typography-l-body-xs-font-size)',
21
21
  },
22
22
  fontFamily: {
23
- sans: [
24
- 'Euclid Circular B',
25
- 'Helvetica Neue',
26
- 'Helvetica',
27
- 'Arial',
28
- 'sans-serif',
29
- ],
30
- // small screen typography
31
- 's-display-md': 'var(--typography-s-display-md-font-family)',
32
- 's-heading-lg': 'var(--typography-s-heading-lg-font-family)',
33
- 's-heading-md': 'var(--typography-s-heading-md-font-family)',
34
- 's-heading-sm': 'var(--typography-s-heading-sm-font-family)',
35
- 's-body-lg': 'var(--typography-s-body-lg-regular-font-family)',
36
- 's-body-md': 'var(--typography-s-body-md-font-family)',
37
- 's-body-sm': 'var(--typography-s-body-sm-font-family)',
38
- 's-body-xs': 'var(--typography-s-body-xs-font-family)',
39
- // large screen typography
40
- 'l-display-md': 'var(--typography-l-display-md-font-family)',
41
- 'l-heading-lg': 'var(--typography-l-heading-lg-font-family)',
42
- 'l-heading-md': 'var(--typography-l-heading-md-font-family)',
43
- 'l-heading-sm': 'var(--typography-l-heading-sm-font-family)',
44
- 'l-body-lg': 'var(--typography-l-body-lg-medium-font-family)',
45
- 'l-body-md': 'var(--typography-l-body-md-font-family)',
46
- 'l-body-sm': 'var(--typography-l-body-sm-font-family)',
47
- 'l-body-xs': 'var(--typography-l-body-xs-font-family)',
23
+ default: 'var(--font-family-default)',
24
+ accent: 'var(--font-family-accent)',
25
+ hero: 'var(--font-family-hero)',
48
26
  },
49
27
  letterSpacing: {
50
28
  // small screen typography
@@ -67,24 +45,10 @@ export const typography = {
67
45
  'l-body-xs': 'var(--typography-l-body-xs-letter-spacing)',
68
46
  },
69
47
  fontWeight: {
70
- // small screen typography
71
- 's-display-md': 'var(--typography-s-display-md-font-weight)',
72
- 's-heading-lg': 'var(--typography-s-heading-lg-font-weight)',
73
- 's-heading-md': 'var(--typography-s-heading-md-font-weight)',
74
- 's-heading-sm': 'var(--typography-s-heading-sm-font-weight)',
75
- 's-body-lg': 'var(--font-weight-regular)',
76
- 's-body-md': 'var(--typography-s-body-md-font-weight)',
77
- 's-body-sm': 'var(--typography-s-body-sm-font-weight)',
78
- 's-body-xs': 'var(--typography-s-body-xs-font-weight)',
79
- // large screen typography
80
- 'l-display-md': 'var(--typography-l-display-md-font-weight)',
81
- 'l-heading-lg': 'var(--typography-l-heading-lg-font-weight)',
82
- 'l-heading-md': 'var(--typography-l-heading-md-font-weight)',
83
- 'l-heading-sm': 'var(--typography-l-heading-sm-font-weight)',
84
- 'l-body-lg': 'var(--font-weight-regular)',
85
- 'l-body-md': 'var(--typography-l-body-md-font-weight)',
86
- 'l-body-sm': 'var(--typography-l-body-sm-font-weight)',
87
- 'l-body-xs': 'var(--typography-l-body-xs-font-weight)',
48
+ // agnostic weights
49
+ regular: 'var(--font-weight-regular)',
50
+ medium: 'var(--font-weight-medium)',
51
+ bold: 'var(--font-weight-bold)',
88
52
  },
89
53
  lineHeight: {
90
54
  // small screen typography
@@ -1 +1 @@
1
- {"version":3,"file":"typography.mjs","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"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","sourcesContent":["export const typography = {\n fontSize: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-font-size)',\n 's-heading-lg': 'var(--typography-s-heading-lg-font-size)',\n 's-heading-md': 'var(--typography-s-heading-md-font-size)',\n 's-heading-sm': 'var(--typography-s-heading-sm-font-size)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-font-size)',\n 's-body-md': 'var(--typography-s-body-md-font-size)',\n 's-body-sm': 'var(--typography-s-body-sm-font-size)',\n 's-body-xs': 'var(--typography-s-body-xs-font-size)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-font-size)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-font-size)',\n 'l-heading-md': 'var(--typography-l-heading-md-font-size)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-font-size)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-font-size)',\n 'l-body-md': 'var(--typography-l-body-md-font-size)',\n 'l-body-sm': 'var(--typography-l-body-sm-font-size)',\n 'l-body-xs': 'var(--typography-l-body-xs-font-size)',\n },\n fontFamily: {\n sans: [\n 'Euclid Circular B', // This should match @font-face set in tailwind.css\n 'Helvetica Neue',\n 'Helvetica',\n 'Arial',\n 'sans-serif',\n ],\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-font-family)',\n 's-heading-lg': 'var(--typography-s-heading-lg-font-family)',\n 's-heading-md': 'var(--typography-s-heading-md-font-family)',\n 's-heading-sm': 'var(--typography-s-heading-sm-font-family)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-font-family)',\n 's-body-md': 'var(--typography-s-body-md-font-family)',\n 's-body-sm': 'var(--typography-s-body-sm-font-family)',\n 's-body-xs': 'var(--typography-s-body-xs-font-family)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-font-family)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-font-family)',\n 'l-heading-md': 'var(--typography-l-heading-md-font-family)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-font-family)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-font-family)',\n 'l-body-md': 'var(--typography-l-body-md-font-family)',\n 'l-body-sm': 'var(--typography-l-body-sm-font-family)',\n 'l-body-xs': 'var(--typography-l-body-xs-font-family)',\n },\n letterSpacing: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-letter-spacing)',\n 's-heading-lg': 'var(--typography-s-heading-lg-letter-spacing)',\n 's-heading-md': 'var(--typography-s-heading-md-letter-spacing)',\n 's-heading-sm': 'var(--typography-s-heading-sm-letter-spacing)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-letter-spacing)',\n 's-body-md': 'var(--typography-s-body-md-letter-spacing)',\n 's-body-sm': 'var(--typography-s-body-sm-letter-spacing)',\n 's-body-xs': 'var(--typography-s-body-xs-letter-spacing)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-letter-spacing)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-letter-spacing)',\n 'l-heading-md': 'var(--typography-l-heading-md-letter-spacing)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-letter-spacing)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-letter-spacing)',\n 'l-body-md': 'var(--typography-l-body-md-letter-spacing)',\n 'l-body-sm': 'var(--typography-l-body-sm-letter-spacing)',\n 'l-body-xs': 'var(--typography-l-body-xs-letter-spacing)',\n },\n fontWeight: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-font-weight)',\n 's-heading-lg': 'var(--typography-s-heading-lg-font-weight)',\n 's-heading-md': 'var(--typography-s-heading-md-font-weight)',\n 's-heading-sm': 'var(--typography-s-heading-sm-font-weight)',\n 's-body-lg': 'var(--font-weight-regular)',\n 's-body-md': 'var(--typography-s-body-md-font-weight)',\n 's-body-sm': 'var(--typography-s-body-sm-font-weight)',\n 's-body-xs': 'var(--typography-s-body-xs-font-weight)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-font-weight)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-font-weight)',\n 'l-heading-md': 'var(--typography-l-heading-md-font-weight)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-font-weight)',\n 'l-body-lg': 'var(--font-weight-regular)',\n 'l-body-md': 'var(--typography-l-body-md-font-weight)',\n 'l-body-sm': 'var(--typography-l-body-sm-font-weight)',\n 'l-body-xs': 'var(--typography-l-body-xs-font-weight)',\n },\n lineHeight: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-line-height)',\n 's-heading-lg': 'var(--typography-s-heading-lg-line-height)',\n 's-heading-md': 'var(--typography-s-heading-md-line-height)',\n 's-heading-sm': 'var(--typography-s-heading-sm-line-height)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-line-height)',\n 's-body-md': 'var(--typography-s-body-md-line-height)',\n 's-body-sm': 'var(--typography-s-body-sm-line-height)',\n 's-body-xs': 'var(--typography-s-body-xs-line-height)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-line-height)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-line-height)',\n 'l-heading-md': 'var(--typography-l-heading-md-line-height)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-line-height)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-line-height)',\n 'l-body-md': 'var(--typography-l-body-md-line-height)',\n 'l-body-sm': 'var(--typography-l-body-sm-line-height)',\n 'l-body-xs': 'var(--typography-l-body-xs-line-height)',\n },\n};\n"]}
1
+ {"version":3,"file":"typography.mjs","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"AAAA,MAAM,CAAC,MAAM,UAAU,GAAG;IACxB,QAAQ,EAAE;QACR,0BAA0B;QAC1B,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,WAAW,EAAE,+CAA+C;QAC5D,WAAW,EAAE,uCAAuC;QACpD,WAAW,EAAE,uCAAuC;QACpD,WAAW,EAAE,uCAAuC;QACpD,0BAA0B;QAC1B,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,cAAc,EAAE,0CAA0C;QAC1D,WAAW,EAAE,8CAA8C;QAC3D,WAAW,EAAE,uCAAuC;QACpD,WAAW,EAAE,uCAAuC;QACpD,WAAW,EAAE,uCAAuC;KACrD;IACD,UAAU,EAAE;QACV,OAAO,EAAE,4BAA4B;QACrC,MAAM,EAAE,2BAA2B;QACnC,IAAI,EAAE,yBAAyB;KAChC;IACD,aAAa,EAAE;QACb,0BAA0B;QAC1B,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,WAAW,EAAE,oDAAoD;QACjE,WAAW,EAAE,4CAA4C;QACzD,WAAW,EAAE,4CAA4C;QACzD,WAAW,EAAE,4CAA4C;QACzD,0BAA0B;QAC1B,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,cAAc,EAAE,+CAA+C;QAC/D,WAAW,EAAE,mDAAmD;QAChE,WAAW,EAAE,4CAA4C;QACzD,WAAW,EAAE,4CAA4C;QACzD,WAAW,EAAE,4CAA4C;KAC1D;IACD,UAAU,EAAE;QACV,mBAAmB;QACnB,OAAO,EAAE,4BAA4B;QACrC,MAAM,EAAE,2BAA2B;QACnC,IAAI,EAAE,yBAAyB;KAChC;IACD,UAAU,EAAE;QACV,0BAA0B;QAC1B,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,WAAW,EAAE,iDAAiD;QAC9D,WAAW,EAAE,yCAAyC;QACtD,WAAW,EAAE,yCAAyC;QACtD,WAAW,EAAE,yCAAyC;QACtD,0BAA0B;QAC1B,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,cAAc,EAAE,4CAA4C;QAC5D,WAAW,EAAE,gDAAgD;QAC7D,WAAW,EAAE,yCAAyC;QACtD,WAAW,EAAE,yCAAyC;QACtD,WAAW,EAAE,yCAAyC;KACvD;CACF,CAAC","sourcesContent":["export const typography = {\n fontSize: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-font-size)',\n 's-heading-lg': 'var(--typography-s-heading-lg-font-size)',\n 's-heading-md': 'var(--typography-s-heading-md-font-size)',\n 's-heading-sm': 'var(--typography-s-heading-sm-font-size)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-font-size)',\n 's-body-md': 'var(--typography-s-body-md-font-size)',\n 's-body-sm': 'var(--typography-s-body-sm-font-size)',\n 's-body-xs': 'var(--typography-s-body-xs-font-size)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-font-size)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-font-size)',\n 'l-heading-md': 'var(--typography-l-heading-md-font-size)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-font-size)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-font-size)',\n 'l-body-md': 'var(--typography-l-body-md-font-size)',\n 'l-body-sm': 'var(--typography-l-body-sm-font-size)',\n 'l-body-xs': 'var(--typography-l-body-xs-font-size)',\n },\n fontFamily: {\n default: 'var(--font-family-default)',\n accent: 'var(--font-family-accent)',\n hero: 'var(--font-family-hero)',\n },\n letterSpacing: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-letter-spacing)',\n 's-heading-lg': 'var(--typography-s-heading-lg-letter-spacing)',\n 's-heading-md': 'var(--typography-s-heading-md-letter-spacing)',\n 's-heading-sm': 'var(--typography-s-heading-sm-letter-spacing)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-letter-spacing)',\n 's-body-md': 'var(--typography-s-body-md-letter-spacing)',\n 's-body-sm': 'var(--typography-s-body-sm-letter-spacing)',\n 's-body-xs': 'var(--typography-s-body-xs-letter-spacing)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-letter-spacing)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-letter-spacing)',\n 'l-heading-md': 'var(--typography-l-heading-md-letter-spacing)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-letter-spacing)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-letter-spacing)',\n 'l-body-md': 'var(--typography-l-body-md-letter-spacing)',\n 'l-body-sm': 'var(--typography-l-body-sm-letter-spacing)',\n 'l-body-xs': 'var(--typography-l-body-xs-letter-spacing)',\n },\n fontWeight: {\n // agnostic weights\n regular: 'var(--font-weight-regular)',\n medium: 'var(--font-weight-medium)',\n bold: 'var(--font-weight-bold)',\n },\n lineHeight: {\n // small screen typography\n 's-display-md': 'var(--typography-s-display-md-line-height)',\n 's-heading-lg': 'var(--typography-s-heading-lg-line-height)',\n 's-heading-md': 'var(--typography-s-heading-md-line-height)',\n 's-heading-sm': 'var(--typography-s-heading-sm-line-height)',\n 's-body-lg': 'var(--typography-s-body-lg-regular-line-height)',\n 's-body-md': 'var(--typography-s-body-md-line-height)',\n 's-body-sm': 'var(--typography-s-body-sm-line-height)',\n 's-body-xs': 'var(--typography-s-body-xs-line-height)',\n // large screen typography\n 'l-display-md': 'var(--typography-l-display-md-line-height)',\n 'l-heading-lg': 'var(--typography-l-heading-lg-line-height)',\n 'l-heading-md': 'var(--typography-l-heading-md-line-height)',\n 'l-heading-sm': 'var(--typography-l-heading-sm-line-height)',\n 'l-body-lg': 'var(--typography-l-body-lg-medium-line-height)',\n 'l-body-md': 'var(--typography-l-body-md-line-height)',\n 'l-body-sm': 'var(--typography-l-body-sm-line-height)',\n 'l-body-xs': 'var(--typography-l-body-xs-line-height)',\n },\n};\n"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@metamask-previews/design-system-tailwind-preset",
3
- "version": "0.0.0-preview.fbd1fe9",
3
+ "version": "0.2.0-preview.7df341a",
4
4
  "description": "Design System Tailwind CSS preset for MetaMask projects",
5
5
  "keywords": [
6
6
  "MetaMask",
@@ -57,7 +57,7 @@
57
57
  "typescript": "~5.2.2"
58
58
  },
59
59
  "peerDependencies": {
60
- "@metamask/design-tokens": "^5.0.0",
60
+ "@metamask/design-tokens": "^6.0.0",
61
61
  "tailwindcss": "^3.0.0"
62
62
  },
63
63
  "engines": {