@metamask/design-system-twrnc-preset 0.1.0

package/dist/typography.mjs

@@ -0,0 +1,112 @@
+import { typography } from "@metamask/design-tokens";
+export const typographyTailwindConfig = {
+    fontSize: {
+        'display-lg': [
+            typography.sDisplayLG.fontSize.toString(),
+            {
+                lineHeight: `${typography.sDisplayLG.lineHeight}px`,
+                letterSpacing: `${typography.sDisplayLG.letterSpacing}`,
+                fontWeight: typography.sDisplayLG.fontWeight,
+            },
+        ],
+        'display-md': [
+            typography.sDisplayMD.fontSize.toString(),
+            {
+                lineHeight: `${typography.sDisplayMD.lineHeight}px`,
+                letterSpacing: `${typography.sDisplayMD.letterSpacing}`,
+                fontWeight: typography.sDisplayMD.fontWeight,
+            },
+        ],
+        'heading-lg': [
+            typography.sHeadingLG.fontSize.toString(),
+            {
+                lineHeight: `${typography.sHeadingLG.lineHeight}px`,
+                letterSpacing: `${typography.sHeadingLG.letterSpacing}`,
+                fontWeight: typography.sHeadingLG.fontWeight,
+            },
+        ],
+        'heading-md': [
+            typography.sHeadingMD.fontSize.toString(),
+            {
+                lineHeight: `${typography.sHeadingMD.lineHeight}px`,
+                letterSpacing: `${typography.sHeadingMD.letterSpacing}`,
+                fontWeight: typography.sHeadingMD.fontWeight,
+            },
+        ],
+        'heading-sm': [
+            typography.sHeadingSM.fontSize.toString(),
+            {
+                lineHeight: `${typography.sHeadingSM.lineHeight}px`,
+                letterSpacing: `${typography.sHeadingSM.letterSpacing}`,
+                fontWeight: typography.sHeadingSM.fontWeight,
+            },
+        ],
+        'body-lg': [
+            typography.sBodyLGMedium.fontSize.toString(),
+            {
+                lineHeight: `${typography.sBodyLGMedium.lineHeight}px`,
+                letterSpacing: `${typography.sBodyLGMedium.letterSpacing}`,
+                fontWeight: typography.sBodyLGMedium.fontWeight,
+            },
+        ],
+        'body-md': [
+            typography.sBodyMD.fontSize.toString(),
+            {
+                lineHeight: `${typography.sBodyMD.lineHeight}px`,
+                letterSpacing: `${typography.sBodyMD.letterSpacing}`,
+                fontWeight: typography.sBodyMD.fontWeight,
+            },
+        ],
+        'body-sm': [
+            typography.sBodySM.fontSize.toString(),
+            {
+                lineHeight: `${typography.sBodySM.lineHeight}px`,
+                letterSpacing: `${typography.sBodySM.letterSpacing}`,
+                fontWeight: typography.sBodySM.fontWeight,
+            },
+        ],
+        'body-xs': [
+            typography.sBodyXS.fontSize.toString(),
+            {
+                lineHeight: `${typography.sBodyXS.lineHeight}px`,
+                letterSpacing: `${typography.sBodyXS.letterSpacing}`,
+                fontWeight: typography.sBodyXS.fontWeight,
+            },
+        ],
+    },
+    fontFamily: {
+        'default-regular': 'Geist-Regular',
+        'default-regular-italic': 'Geist-RegularItalic',
+        'default-medium': 'Geist-Medium',
+        'default-medium-italic': 'Geist-MediumItalic',
+        'default-bold': 'Geist-Bold',
+        'default-bold-italic': 'Geist-BoldItalic',
+        'accent-regular': 'MMSans-Regular',
+        'accent-medium': 'MMSans-Medium',
+        'accent-bold': 'MMSans-Bold',
+        'hero-regular': 'MMPoly-Regular',
+    },
+    letterSpacing: {
+        'display-lg': `${typography.sDisplayLG.letterSpacing}`,
+        'display-md': `${typography.sDisplayMD.letterSpacing}`,
+        'heading-lg': `${typography.sHeadingLG.letterSpacing}`,
+        'heading-md': `${typography.sHeadingMD.letterSpacing}`,
+        'heading-sm': `${typography.sHeadingSM.letterSpacing}`,
+        'body-lg': `${typography.sBodyLGMedium.letterSpacing}`,
+        'body-md': `${typography.sBodyMD.letterSpacing}`,
+        'body-sm': `${typography.sBodySM.letterSpacing}`,
+        'body-xs': `${typography.sBodyXS.letterSpacing}`,
+    },
+    lineHeight: {
+        'display-lg': `${typography.sDisplayLG.lineHeight}px`,
+        'display-md': `${typography.sDisplayMD.lineHeight}px`,
+        'heading-lg': `${typography.sHeadingLG.lineHeight}px`,
+        'heading-md': `${typography.sHeadingMD.lineHeight}px`,
+        'heading-sm': `${typography.sHeadingSM.lineHeight}px`,
+        'body-lg': `${typography.sBodyLGMedium.lineHeight}px`,
+        'body-md': `${typography.sBodyMD.lineHeight}px`,
+        'body-sm': `${typography.sBodySM.lineHeight}px`,
+        'body-xs': `${typography.sBodyXS.lineHeight}px`,
+    },
+};
+//# sourceMappingURL=typography.mjs.map

package/dist/typography.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.mjs","sourceRoot":"","sources":["../src/typography.ts"],"names":[],"mappings":"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","sourcesContent":["import { typography } from '@metamask/design-tokens';\n\nimport type { TypographyTailwindConfigProps } from './typography.types';\n\nexport const typographyTailwindConfig: TypographyTailwindConfigProps = {\n  fontSize: {\n    'display-lg': [\n      typography.sDisplayLG.fontSize.toString(),\n      {\n        lineHeight: `${typography.sDisplayLG.lineHeight as number}px`,\n        letterSpacing: `${typography.sDisplayLG.letterSpacing as number}`,\n        fontWeight: typography.sDisplayLG.fontWeight,\n      },\n    ],\n    'display-md': [\n      typography.sDisplayMD.fontSize.toString(),\n      {\n        lineHeight: `${typography.sDisplayMD.lineHeight as number}px`,\n        letterSpacing: `${typography.sDisplayMD.letterSpacing as number}`,\n        fontWeight: typography.sDisplayMD.fontWeight,\n      },\n    ],\n    'heading-lg': [\n      typography.sHeadingLG.fontSize.toString(),\n      {\n        lineHeight: `${typography.sHeadingLG.lineHeight as number}px`,\n        letterSpacing: `${typography.sHeadingLG.letterSpacing as number}`,\n        fontWeight: typography.sHeadingLG.fontWeight,\n      },\n    ],\n    'heading-md': [\n      typography.sHeadingMD.fontSize.toString(),\n      {\n        lineHeight: `${typography.sHeadingMD.lineHeight as number}px`,\n        letterSpacing: `${typography.sHeadingMD.letterSpacing as number}`,\n        fontWeight: typography.sHeadingMD.fontWeight,\n      },\n    ],\n    'heading-sm': [\n      typography.sHeadingSM.fontSize.toString(),\n      {\n        lineHeight: `${typography.sHeadingSM.lineHeight as number}px`,\n        letterSpacing: `${typography.sHeadingSM.letterSpacing as number}`,\n        fontWeight: typography.sHeadingSM.fontWeight,\n      },\n    ],\n    'body-lg': [\n      typography.sBodyLGMedium.fontSize.toString(),\n      {\n        lineHeight: `${typography.sBodyLGMedium.lineHeight as number}px`,\n        letterSpacing: `${typography.sBodyLGMedium.letterSpacing as number}`,\n        fontWeight: typography.sBodyLGMedium.fontWeight,\n      },\n    ],\n    'body-md': [\n      typography.sBodyMD.fontSize.toString(),\n      {\n        lineHeight: `${typography.sBodyMD.lineHeight as number}px`,\n        letterSpacing: `${typography.sBodyMD.letterSpacing as number}`,\n        fontWeight: typography.sBodyMD.fontWeight,\n      },\n    ],\n    'body-sm': [\n      typography.sBodySM.fontSize.toString(),\n      {\n        lineHeight: `${typography.sBodySM.lineHeight as number}px`,\n        letterSpacing: `${typography.sBodySM.letterSpacing as number}`,\n        fontWeight: typography.sBodySM.fontWeight,\n      },\n    ],\n    'body-xs': [\n      typography.sBodyXS.fontSize.toString(),\n      {\n        lineHeight: `${typography.sBodyXS.lineHeight as number}px`,\n        letterSpacing: `${typography.sBodyXS.letterSpacing as number}`,\n        fontWeight: typography.sBodyXS.fontWeight,\n      },\n    ],\n  },\n  fontFamily: {\n    'default-regular': 'Geist-Regular',\n    'default-regular-italic': 'Geist-RegularItalic',\n    'default-medium': 'Geist-Medium',\n    'default-medium-italic': 'Geist-MediumItalic',\n    'default-bold': 'Geist-Bold',\n    'default-bold-italic': 'Geist-BoldItalic',\n    'accent-regular': 'MMSans-Regular',\n    'accent-medium': 'MMSans-Medium',\n    'accent-bold': 'MMSans-Bold',\n    'hero-regular': 'MMPoly-Regular',\n  },\n  letterSpacing: {\n    'display-lg': `${typography.sDisplayLG.letterSpacing as number}`,\n    'display-md': `${typography.sDisplayMD.letterSpacing as number}`,\n    'heading-lg': `${typography.sHeadingLG.letterSpacing as number}`,\n    'heading-md': `${typography.sHeadingMD.letterSpacing as number}`,\n    'heading-sm': `${typography.sHeadingSM.letterSpacing as number}`,\n    'body-lg': `${typography.sBodyLGMedium.letterSpacing as number}`,\n    'body-md': `${typography.sBodyMD.letterSpacing as number}`,\n    'body-sm': `${typography.sBodySM.letterSpacing as number}`,\n    'body-xs': `${typography.sBodyXS.letterSpacing as number}`,\n  },\n  lineHeight: {\n    'display-lg': `${typography.sDisplayLG.lineHeight as number}px`,\n    'display-md': `${typography.sDisplayMD.lineHeight as number}px`,\n    'heading-lg': `${typography.sHeadingLG.lineHeight as number}px`,\n    'heading-md': `${typography.sHeadingMD.lineHeight as number}px`,\n    'heading-sm': `${typography.sHeadingSM.lineHeight as number}px`,\n    'body-lg': `${typography.sBodyLGMedium.lineHeight as number}px`,\n    'body-md': `${typography.sBodyMD.lineHeight as number}px`,\n    'body-sm': `${typography.sBodySM.lineHeight as number}px`,\n    'body-xs': `${typography.sBodyXS.lineHeight as number}px`,\n  },\n};\n"]}

package/dist/typography.types.cjs

@@ -0,0 +1,3 @@
+"use strict";
+Object.defineProperty(exports, "__esModule", { value: true });
+//# sourceMappingURL=typography.types.cjs.map

package/dist/typography.types.cjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.types.cjs","sourceRoot":"","sources":["../src/typography.types.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Different Typography variants to be used as twrnc classNames\n */\nexport type TypographyVariant =\n  | 'display-lg'\n  | 'display-md'\n  | 'heading-lg'\n  | 'heading-md'\n  | 'heading-sm'\n  | 'body-lg'\n  | 'body-md'\n  | 'body-sm'\n  | 'body-xs';\n\n/**\n * Different FontWeight and FontStyle to be used to calculate the FontFamily\n * in getFontFamilyFromWeightAndStyle\n */\nexport type FontWeight =\n  | '100'\n  | '200'\n  | '300'\n  | '400'\n  | '500'\n  | '600'\n  | '700'\n  | '800'\n  | '900'\n  | 'normal'\n  | 'bold';\nexport type FontStyle = 'normal' | 'italic';\n\n/**\n * Props for TypographyTailwindConfig\n *\n * @example\n * {\n *   fontSize: {\n *     'display-md': {\n *       fontFamily: 'Geist-Bold',\n *       fontSize: '32',\n *       fontWeight: '700',\n *       letterSpacing: '0',\n *       lineHeight: '40px',\n *     },\n *   },\n *   fontFamily: {\n *     sans: [\n *       'Geist',\n *       'Helvetica Neue',\n *       'Helvetica',\n *       'Arial',\n *       'sans-serif',\n *     ],\n *     'display-md': 'Geist',\n *   },\n *   letterSpacing: {\n *     'display-md': '0',\n *   },\n *   fontWeight: {\n *     'display-md': '400',\n *   },\n *   lineHeight: {\n *     'display-md': '40px',\n *   },\n * }\n */\nexport type TypographyTailwindConfigProps = {\n  fontSize: Record<\n    TypographyVariant,\n    [\n      string,\n      {\n        lineHeight: string; // Make sure to include units - \"40px\" instead of \"40\"\n        letterSpacing: string;\n        fontWeight: string;\n      },\n    ]\n  >;\n  fontFamily: {\n    'default-regular': string;\n    'default-regular-italic': string;\n    'default-medium': string;\n    'default-medium-italic': string;\n    'default-bold': string;\n    'default-bold-italic': string;\n    'accent-regular': string;\n    'accent-medium': string;\n    'accent-bold': string;\n    'hero-regular': string;\n  };\n  letterSpacing: Record<TypographyVariant, string>;\n  lineHeight: Record<TypographyVariant, string>; // Make sure to include units - \"40px\" instead of \"40\"\n};\n"]}

package/dist/typography.types.d.cts

@@ -0,0 +1,70 @@
+/**
+ * Different Typography variants to be used as twrnc classNames
+ */
+export type TypographyVariant = 'display-lg' | 'display-md' | 'heading-lg' | 'heading-md' | 'heading-sm' | 'body-lg' | 'body-md' | 'body-sm' | 'body-xs';
+/**
+ * Different FontWeight and FontStyle to be used to calculate the FontFamily
+ * in getFontFamilyFromWeightAndStyle
+ */
+export type FontWeight = '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900' | 'normal' | 'bold';
+export type FontStyle = 'normal' | 'italic';
+/**
+ * Props for TypographyTailwindConfig
+ *
+ * @example
+ * {
+ *   fontSize: {
+ *     'display-md': {
+ *       fontFamily: 'Geist-Bold',
+ *       fontSize: '32',
+ *       fontWeight: '700',
+ *       letterSpacing: '0',
+ *       lineHeight: '40px',
+ *     },
+ *   },
+ *   fontFamily: {
+ *     sans: [
+ *       'Geist',
+ *       'Helvetica Neue',
+ *       'Helvetica',
+ *       'Arial',
+ *       'sans-serif',
+ *     ],
+ *     'display-md': 'Geist',
+ *   },
+ *   letterSpacing: {
+ *     'display-md': '0',
+ *   },
+ *   fontWeight: {
+ *     'display-md': '400',
+ *   },
+ *   lineHeight: {
+ *     'display-md': '40px',
+ *   },
+ * }
+ */
+export type TypographyTailwindConfigProps = {
+    fontSize: Record<TypographyVariant, [
+        string,
+        {
+            lineHeight: string;
+            letterSpacing: string;
+            fontWeight: string;
+        }
+    ]>;
+    fontFamily: {
+        'default-regular': string;
+        'default-regular-italic': string;
+        'default-medium': string;
+        'default-medium-italic': string;
+        'default-bold': string;
+        'default-bold-italic': string;
+        'accent-regular': string;
+        'accent-medium': string;
+        'accent-bold': string;
+        'hero-regular': string;
+    };
+    letterSpacing: Record<TypographyVariant, string>;
+    lineHeight: Record<TypographyVariant, string>;
+};
+//# sourceMappingURL=typography.types.d.cts.map

package/dist/typography.types.d.cts.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.types.d.cts","sourceRoot":"","sources":["../src/typography.types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,MAAM,iBAAiB,GACzB,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,SAAS,GACT,SAAS,GACT,SAAS,GACT,SAAS,CAAC;AAEd;;;GAGG;AACH,MAAM,MAAM,UAAU,GAClB,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,QAAQ,GACR,MAAM,CAAC;AACX,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAE5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,MAAM,6BAA6B,GAAG;IAC1C,QAAQ,EAAE,MAAM,CACd,iBAAiB,EACjB;QACE,MAAM;QACN;YACE,UAAU,EAAE,MAAM,CAAC;YACnB,aAAa,EAAE,MAAM,CAAC;YACtB,UAAU,EAAE,MAAM,CAAC;SACpB;KACF,CACF,CAAC;IACF,UAAU,EAAE;QACV,iBAAiB,EAAE,MAAM,CAAC;QAC1B,wBAAwB,EAAE,MAAM,CAAC;QACjC,gBAAgB,EAAE,MAAM,CAAC;QACzB,uBAAuB,EAAE,MAAM,CAAC;QAChC,cAAc,EAAE,MAAM,CAAC;QACvB,qBAAqB,EAAE,MAAM,CAAC;QAC9B,gBAAgB,EAAE,MAAM,CAAC;QACzB,eAAe,EAAE,MAAM,CAAC;QACxB,aAAa,EAAE,MAAM,CAAC;QACtB,cAAc,EAAE,MAAM,CAAC;KACxB,CAAC;IACF,aAAa,EAAE,MAAM,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC;IACjD,UAAU,EAAE,MAAM,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC;CAC/C,CAAC"}

package/dist/typography.types.d.mts

@@ -0,0 +1,70 @@
+/**
+ * Different Typography variants to be used as twrnc classNames
+ */
+export type TypographyVariant = 'display-lg' | 'display-md' | 'heading-lg' | 'heading-md' | 'heading-sm' | 'body-lg' | 'body-md' | 'body-sm' | 'body-xs';
+/**
+ * Different FontWeight and FontStyle to be used to calculate the FontFamily
+ * in getFontFamilyFromWeightAndStyle
+ */
+export type FontWeight = '100' | '200' | '300' | '400' | '500' | '600' | '700' | '800' | '900' | 'normal' | 'bold';
+export type FontStyle = 'normal' | 'italic';
+/**
+ * Props for TypographyTailwindConfig
+ *
+ * @example
+ * {
+ *   fontSize: {
+ *     'display-md': {
+ *       fontFamily: 'Geist-Bold',
+ *       fontSize: '32',
+ *       fontWeight: '700',
+ *       letterSpacing: '0',
+ *       lineHeight: '40px',
+ *     },
+ *   },
+ *   fontFamily: {
+ *     sans: [
+ *       'Geist',
+ *       'Helvetica Neue',
+ *       'Helvetica',
+ *       'Arial',
+ *       'sans-serif',
+ *     ],
+ *     'display-md': 'Geist',
+ *   },
+ *   letterSpacing: {
+ *     'display-md': '0',
+ *   },
+ *   fontWeight: {
+ *     'display-md': '400',
+ *   },
+ *   lineHeight: {
+ *     'display-md': '40px',
+ *   },
+ * }
+ */
+export type TypographyTailwindConfigProps = {
+    fontSize: Record<TypographyVariant, [
+        string,
+        {
+            lineHeight: string;
+            letterSpacing: string;
+            fontWeight: string;
+        }
+    ]>;
+    fontFamily: {
+        'default-regular': string;
+        'default-regular-italic': string;
+        'default-medium': string;
+        'default-medium-italic': string;
+        'default-bold': string;
+        'default-bold-italic': string;
+        'accent-regular': string;
+        'accent-medium': string;
+        'accent-bold': string;
+        'hero-regular': string;
+    };
+    letterSpacing: Record<TypographyVariant, string>;
+    lineHeight: Record<TypographyVariant, string>;
+};
+//# sourceMappingURL=typography.types.d.mts.map

package/dist/typography.types.d.mts.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.types.d.mts","sourceRoot":"","sources":["../src/typography.types.ts"],"names":[],"mappings":"AAAA;;GAEG;AACH,MAAM,MAAM,iBAAiB,GACzB,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,YAAY,GACZ,SAAS,GACT,SAAS,GACT,SAAS,GACT,SAAS,CAAC;AAEd;;;GAGG;AACH,MAAM,MAAM,UAAU,GAClB,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,KAAK,GACL,QAAQ,GACR,MAAM,CAAC;AACX,MAAM,MAAM,SAAS,GAAG,QAAQ,GAAG,QAAQ,CAAC;AAE5C;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GAkCG;AACH,MAAM,MAAM,6BAA6B,GAAG;IAC1C,QAAQ,EAAE,MAAM,CACd,iBAAiB,EACjB;QACE,MAAM;QACN;YACE,UAAU,EAAE,MAAM,CAAC;YACnB,aAAa,EAAE,MAAM,CAAC;YACtB,UAAU,EAAE,MAAM,CAAC;SACpB;KACF,CACF,CAAC;IACF,UAAU,EAAE;QACV,iBAAiB,EAAE,MAAM,CAAC;QAC1B,wBAAwB,EAAE,MAAM,CAAC;QACjC,gBAAgB,EAAE,MAAM,CAAC;QACzB,uBAAuB,EAAE,MAAM,CAAC;QAChC,cAAc,EAAE,MAAM,CAAC;QACvB,qBAAqB,EAAE,MAAM,CAAC;QAC9B,gBAAgB,EAAE,MAAM,CAAC;QACzB,eAAe,EAAE,MAAM,CAAC;QACxB,aAAa,EAAE,MAAM,CAAC;QACtB,cAAc,EAAE,MAAM,CAAC;KACxB,CAAC;IACF,aAAa,EAAE,MAAM,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC;IACjD,UAAU,EAAE,MAAM,CAAC,iBAAiB,EAAE,MAAM,CAAC,CAAC;CAC/C,CAAC"}

package/dist/typography.types.mjs

@@ -0,0 +1,2 @@
+export {};
+//# sourceMappingURL=typography.types.mjs.map

package/dist/typography.types.mjs.map

@@ -0,0 +1 @@
+{"version":3,"file":"typography.types.mjs","sourceRoot":"","sources":["../src/typography.types.ts"],"names":[],"mappings":"","sourcesContent":["/**\n * Different Typography variants to be used as twrnc classNames\n */\nexport type TypographyVariant =\n  | 'display-lg'\n  | 'display-md'\n  | 'heading-lg'\n  | 'heading-md'\n  | 'heading-sm'\n  | 'body-lg'\n  | 'body-md'\n  | 'body-sm'\n  | 'body-xs';\n\n/**\n * Different FontWeight and FontStyle to be used to calculate the FontFamily\n * in getFontFamilyFromWeightAndStyle\n */\nexport type FontWeight =\n  | '100'\n  | '200'\n  | '300'\n  | '400'\n  | '500'\n  | '600'\n  | '700'\n  | '800'\n  | '900'\n  | 'normal'\n  | 'bold';\nexport type FontStyle = 'normal' | 'italic';\n\n/**\n * Props for TypographyTailwindConfig\n *\n * @example\n * {\n *   fontSize: {\n *     'display-md': {\n *       fontFamily: 'Geist-Bold',\n *       fontSize: '32',\n *       fontWeight: '700',\n *       letterSpacing: '0',\n *       lineHeight: '40px',\n *     },\n *   },\n *   fontFamily: {\n *     sans: [\n *       'Geist',\n *       'Helvetica Neue',\n *       'Helvetica',\n *       'Arial',\n *       'sans-serif',\n *     ],\n *     'display-md': 'Geist',\n *   },\n *   letterSpacing: {\n *     'display-md': '0',\n *   },\n *   fontWeight: {\n *     'display-md': '400',\n *   },\n *   lineHeight: {\n *     'display-md': '40px',\n *   },\n * }\n */\nexport type TypographyTailwindConfigProps = {\n  fontSize: Record<\n    TypographyVariant,\n    [\n      string,\n      {\n        lineHeight: string; // Make sure to include units - \"40px\" instead of \"40\"\n        letterSpacing: string;\n        fontWeight: string;\n      },\n    ]\n  >;\n  fontFamily: {\n    'default-regular': string;\n    'default-regular-italic': string;\n    'default-medium': string;\n    'default-medium-italic': string;\n    'default-bold': string;\n    'default-bold-italic': string;\n    'accent-regular': string;\n    'accent-medium': string;\n    'accent-bold': string;\n    'hero-regular': string;\n  };\n  letterSpacing: Record<TypographyVariant, string>;\n  lineHeight: Record<TypographyVariant, string>; // Make sure to include units - \"40px\" instead of \"40\"\n};\n"]}

package/package.json

@@ -0,0 +1,83 @@
+{
+  "name": "@metamask/design-system-twrnc-preset",
+  "version": "0.1.0",
+  "description": "Design System twrnc Preset",
+  "keywords": [
+    "MetaMask",
+    "Ethereum"
+  ],
+  "homepage": "https://github.com/MetaMask/metamask-design-system/tree/main/packages/design-system-twrnc-preset#readme",
+  "bugs": {
+    "url": "https://github.com/MetaMask/metamask-design-system/issues"
+  },
+  "repository": {
+    "type": "git",
+    "url": "https://github.com/MetaMask/metamask-design-system.git"
+  },
+  "license": "MIT",
+  "sideEffects": false,
+  "exports": {
+    ".": {
+      "import": {
+        "types": "./dist/index.d.mts",
+        "default": "./dist/index.mjs"
+      },
+      "require": {
+        "types": "./dist/index.d.cts",
+        "default": "./dist/index.cjs"
+      }
+    },
+    "./package.json": "./package.json"
+  },
+  "main": "./dist/index.cjs",
+  "types": "./dist/index.d.cts",
+  "files": [
+    "dist/"
+  ],
+  "scripts": {
+    "build": "ts-bridge --project tsconfig.build.json --verbose --clean --no-references",
+    "changelog:update": "../../scripts/update-changelog.sh @metamask/design-system-twrnc-preset",
+    "changelog:validate": "../../scripts/validate-changelog.sh @metamask/design-system-twrnc-preset",
+    "publish:preview": "yarn npm publish --tag preview",
+    "since-latest-release": "../../scripts/since-latest-release.sh",
+    "test": "NODE_OPTIONS=--experimental-vm-modules jest --reporters=jest-silent-reporter",
+    "test:clean": "NODE_OPTIONS=--experimental-vm-modules jest --clearCache",
+    "test:verbose": "NODE_OPTIONS=--experimental-vm-modules jest --verbose",
+    "test:watch": "NODE_OPTIONS=--experimental-vm-modules jest --watch"
+  },
+  "dependencies": {
+    "twrnc": "^4.5.1"
+  },
+  "devDependencies": {
+    "@babel/core": "^7.23.5",
+    "@babel/preset-env": "^7.26.0",
+    "@babel/preset-react": "^7.25.9",
+    "@babel/preset-typescript": "^7.23.3",
+    "@metamask/auto-changelog": "^5.0.2",
+    "@metamask/design-tokens": "^8.0.0",
+    "@testing-library/react-native": "^12.8.1",
+    "@ts-bridge/cli": "^0.6.3",
+    "@types/babel__preset-env": "^7",
+    "@types/jest": "^27.4.1",
+    "@types/react-test-renderer": "^18",
+    "babel-jest": "^29.7.0",
+    "deepmerge": "^4.2.2",
+    "jest": "^29.7.0",
+    "metro-react-native-babel-preset": "^0.77.0",
+    "react": "^18.2.0",
+    "react-test-renderer": "^18.3.1",
+    "ts-jest": "^29.2.5",
+    "typescript": "~5.2.2"
+  },
+  "peerDependencies": {
+    "@metamask/design-tokens": "^8.0.0",
+    "react": "^18.2.0"
+  },
+  "engines": {
+    "node": "^18.18 || >=20"
+  },
+  "publishConfig": {
+    "access": "public",
+    "registry": "https://registry.npmjs.org/"
+  }
+}