@vitality-ds/tokens - npm Package Compare versions

Comparing version 4.0.1-alpha.0 to 4.0.1-alpha.2

dist/Font/types.d.ts

@@ -65,21 +65,42 @@ import { BaseToken, Platforms } from "../types";
 };
-export declare type FontSizePlatformValues = {
-    web: string;
-    reactNative: number;
-};
-export declare type ThemeFontStylesType<T extends Platforms> = {
+export declare type ThemeFontStylesType = {
     FontFamilies: {
-        [key in FontStyleKeys | "default"]: string;
+        web: {
+            [key in FontStyleKeys | "default"]: string;
+        };
+        reactNative: {
+            [key in RnFontStyleKeys | "default"]: string;
+        };
     };
     FontSizes: {
-        [key in FontStyleKeys]: FontSizePlatformValues[T];
+        web: {
+            [key in FontStyleKeys]: string;
+        };
+        reactNative: {
+            [key in RnFontStyleKeys]: string;
+        };
     };
     FontWeights: {
-        [key in FontStyleKeys]: number;
+        web: {
+            [key in FontStyleKeys]: number;
+        };
+        reactNative: {
+            [key in RnFontStyleKeys]: number;
+        };
     };
     LetterSpacings: {
-        [key in FontStyleKeys]: number;
+        web: {
+            [key in FontStyleKeys]: number;
+        };
+        reactNative: {
+            [key in RnFontStyleKeys]: number;
+        };
     };
     LineHeights: {
-        [key in FontStyleKeys]: number;
+        web: {
+            [key in FontStyleKeys]: number;
+        };
+        reactNative: {
+            [key in RnFontStyleKeys]: number;
+        };
     };
@@ -86,0 +107,0 @@ };

dist/Theme/getters/getFonts.d.ts

 import { Platforms } from "../../types";
 declare const _default: <T extends Platforms>(platform: T) => {
-    display100: string;
-    display200: string;
-    display300: string;
-    display400: string;
-    display500: string;
-    display600: string;
-    display700: string;
-    display800: string;
-    display900: string;
-    body: string;
-    caption: string;
-    pageTitle: string;
-    sectionTitle: string;
-    sectionSubtitle: string;
-    button: string;
-    textInput: string;
-    default: string;
-};
+    web: {
+        display100: string;
+        display200: string;
+        display300: string;
+        display400: string;
+        display500: string;
+        display600: string;
+        display700: string;
+        display800: string;
+        display900: string;
+        body: string;
+        caption: string;
+        pageTitle: string;
+        sectionTitle: string;
+        sectionSubtitle: string;
+        button: string;
+        textInput: string;
+        default: string;
+    };
+    reactNative: {
+        display100: string;
+        display200: string;
+        display300: string;
+        display400: string;
+        display500: string;
+        display600: string;
+        display700: string;
+        display800: string;
+        display900: string;
+        body: string;
+        caption: string;
+        pageTitle: string;
+        sectionTitle: string;
+        sectionSubtitle: string;
+        button: string;
+        microcopy: string;
+        navTitle: string;
+        navTitleCompacted: string;
+        default: string;
+    };
+}[T];
 export default _default;
 //# sourceMappingURL=getFonts.d.ts.map

dist/Theme/getters/getFontSizes.d.ts

 import { Platforms } from "../../types";
 declare const _default: <T extends Platforms>(platform: T) => {
-    display100: import("../../Font/types").FontSizePlatformValues[T];
-    display200: import("../../Font/types").FontSizePlatformValues[T];
-    display300: import("../../Font/types").FontSizePlatformValues[T];
-    display400: import("../../Font/types").FontSizePlatformValues[T];
-    display500: import("../../Font/types").FontSizePlatformValues[T];
-    display600: import("../../Font/types").FontSizePlatformValues[T];
-    display700: import("../../Font/types").FontSizePlatformValues[T];
-    display800: import("../../Font/types").FontSizePlatformValues[T];
-    display900: import("../../Font/types").FontSizePlatformValues[T];
-    body: import("../../Font/types").FontSizePlatformValues[T];
-    caption: import("../../Font/types").FontSizePlatformValues[T];
-    pageTitle: import("../../Font/types").FontSizePlatformValues[T];
-    sectionTitle: import("../../Font/types").FontSizePlatformValues[T];
-    sectionSubtitle: import("../../Font/types").FontSizePlatformValues[T];
-    button: import("../../Font/types").FontSizePlatformValues[T];
-    textInput: import("../../Font/types").FontSizePlatformValues[T];
-};
+    web: {
+        display100: string;
+        display200: string;
+        display300: string;
+        display400: string;
+        display500: string;
+        display600: string;
+        display700: string;
+        display800: string;
+        display900: string;
+        body: string;
+        caption: string;
+        pageTitle: string;
+        sectionTitle: string;
+        sectionSubtitle: string;
+        button: string;
+        textInput: string;
+    };
+    reactNative: {
+        display100: string;
+        display200: string;
+        display300: string;
+        display400: string;
+        display500: string;
+        display600: string;
+        display700: string;
+        display800: string;
+        display900: string;
+        body: string;
+        caption: string;
+        pageTitle: string;
+        sectionTitle: string;
+        sectionSubtitle: string;
+        button: string;
+        microcopy: string;
+        navTitle: string;
+        navTitleCompacted: string;
+    };
+}[T];
 export default _default;
 //# sourceMappingURL=getFontSizes.d.ts.map

dist/Theme/getters/getFontWeights.d.ts

 import { Platforms } from "../../types";
 declare const _default: <T extends Platforms>(platform: T) => {
-    display100: number;
-    display200: number;
-    display300: number;
-    display400: number;
-    display500: number;
-    display600: number;
-    display700: number;
-    display800: number;
-    display900: number;
-    body: number;
-    caption: number;
-    pageTitle: number;
-    sectionTitle: number;
-    sectionSubtitle: number;
-    button: number;
-    textInput: number;
-};
+    web: {
+        display100: number;
+        display200: number;
+        display300: number;
+        display400: number;
+        display500: number;
+        display600: number;
+        display700: number;
+        display800: number;
+        display900: number;
+        body: number;
+        caption: number;
+        pageTitle: number;
+        sectionTitle: number;
+        sectionSubtitle: number;
+        button: number;
+        textInput: number;
+    };
+    reactNative: {
+        display100: number;
+        display200: number;
+        display300: number;
+        display400: number;
+        display500: number;
+        display600: number;
+        display700: number;
+        display800: number;
+        display900: number;
+        body: number;
+        caption: number;
+        pageTitle: number;
+        sectionTitle: number;
+        sectionSubtitle: number;
+        button: number;
+        microcopy: number;
+        navTitle: number;
+        navTitleCompacted: number;
+    };
+}[T];
 export default _default;
 //# sourceMappingURL=getFontWeights.d.ts.map

dist/Theme/getters/getLetterSpacings.d.ts

 import { Platforms } from "../../types";
 declare const _default: <T extends Platforms>(platform: T) => {
-    display100: number;
-    display200: number;
-    display300: number;
-    display400: number;
-    display500: number;
-    display600: number;
-    display700: number;
-    display800: number;
-    display900: number;
-    body: number;
-    caption: number;
-    pageTitle: number;
-    sectionTitle: number;
-    sectionSubtitle: number;
-    button: number;
-    textInput: number;
-};
+    web: {
+        display100: number;
+        display200: number;
+        display300: number;
+        display400: number;
+        display500: number;
+        display600: number;
+        display700: number;
+        display800: number;
+        display900: number;
+        body: number;
+        caption: number;
+        pageTitle: number;
+        sectionTitle: number;
+        sectionSubtitle: number;
+        button: number;
+        textInput: number;
+    };
+    reactNative: {
+        display100: number;
+        display200: number;
+        display300: number;
+        display400: number;
+        display500: number;
+        display600: number;
+        display700: number;
+        display800: number;
+        display900: number;
+        body: number;
+        caption: number;
+        pageTitle: number;
+        sectionTitle: number;
+        sectionSubtitle: number;
+        button: number;
+        microcopy: number;
+        navTitle: number;
+        navTitleCompacted: number;
+    };
+}[T];
 export default _default;
 //# sourceMappingURL=getLetterSpacings.d.ts.map

dist/Theme/getters/getLineHeights.d.ts

 import { Platforms } from "../../types";
 declare const _default: <T extends Platforms>(platform: T) => {
-    display100: number;
-    display200: number;
-    display300: number;
-    display400: number;
-    display500: number;
-    display600: number;
-    display700: number;
-    display800: number;
-    display900: number;
-    body: number;
-    caption: number;
-    pageTitle: number;
-    sectionTitle: number;
-    sectionSubtitle: number;
-    button: number;
-    textInput: number;
-};
+    web: {
+        display100: number;
+        display200: number;
+        display300: number;
+        display400: number;
+        display500: number;
+        display600: number;
+        display700: number;
+        display800: number;
+        display900: number;
+        body: number;
+        caption: number;
+        pageTitle: number;
+        sectionTitle: number;
+        sectionSubtitle: number;
+        button: number;
+        textInput: number;
+    };
+    reactNative: {
+        display100: number;
+        display200: number;
+        display300: number;
+        display400: number;
+        display500: number;
+        display600: number;
+        display700: number;
+        display800: number;
+        display900: number;
+        body: number;
+        caption: number;
+        pageTitle: number;
+        sectionTitle: number;
+        sectionSubtitle: number;
+        button: number;
+        microcopy: number;
+        navTitle: number;
+        navTitleCompacted: number;
+    };
+}[T];
 export default _default;
 //# sourceMappingURL=getLineHeights.d.ts.map

dist/Theme/getters/getTheme.d.ts

@@ -218,92 +218,203 @@ import { Platforms } from "../../types";
     fonts: {
-        display100: string;
-        display200: string;
-        display300: string;
-        display400: string;
-        display500: string;
-        display600: string;
-        display700: string;
-        display800: string;
-        display900: string;
-        body: string;
-        caption: string;
-        pageTitle: string;
-        sectionTitle: string;
-        sectionSubtitle: string;
-        button: string;
-        textInput: string;
-        default: string;
-    };
+        web: {
+            display100: string;
+            display200: string;
+            display300: string;
+            display400: string;
+            display500: string;
+            display600: string;
+            display700: string;
+            display800: string;
+            display900: string;
+            body: string;
+            caption: string;
+            pageTitle: string;
+            sectionTitle: string;
+            sectionSubtitle: string;
+            button: string;
+            textInput: string;
+            default: string;
+        };
+        reactNative: {
+            display100: string;
+            display200: string;
+            display300: string;
+            display400: string;
+            display500: string;
+            display600: string;
+            display700: string;
+            display800: string;
+            display900: string;
+            body: string;
+            caption: string;
+            pageTitle: string;
+            sectionTitle: string;
+            sectionSubtitle: string;
+            button: string;
+            microcopy: string;
+            navTitle: string;
+            navTitleCompacted: string;
+            default: string;
+        };
+    }[T];
     fontSizes: {
-        display100: import("../..").FontSizePlatformValues[T];
-        display200: import("../..").FontSizePlatformValues[T];
-        display300: import("../..").FontSizePlatformValues[T];
-        display400: import("../..").FontSizePlatformValues[T];
-        display500: import("../..").FontSizePlatformValues[T];
-        display600: import("../..").FontSizePlatformValues[T];
-        display700: import("../..").FontSizePlatformValues[T];
-        display800: import("../..").FontSizePlatformValues[T];
-        display900: import("../..").FontSizePlatformValues[T];
-        body: import("../..").FontSizePlatformValues[T];
-        caption: import("../..").FontSizePlatformValues[T];
-        pageTitle: import("../..").FontSizePlatformValues[T];
-        sectionTitle: import("../..").FontSizePlatformValues[T];
-        sectionSubtitle: import("../..").FontSizePlatformValues[T];
-        button: import("../..").FontSizePlatformValues[T];
-        textInput: import("../..").FontSizePlatformValues[T];
-    };
+        web: {
+            display100: string;
+            display200: string;
+            display300: string;
+            display400: string;
+            display500: string;
+            display600: string;
+            display700: string;
+            display800: string;
+            display900: string;
+            body: string;
+            caption: string;
+            pageTitle: string;
+            sectionTitle: string;
+            sectionSubtitle: string;
+            button: string;
+            textInput: string;
+        };
+        reactNative: {
+            display100: string;
+            display200: string;
+            display300: string;
+            display400: string;
+            display500: string;
+            display600: string;
+            display700: string;
+            display800: string;
+            display900: string;
+            body: string;
+            caption: string;
+            pageTitle: string;
+            sectionTitle: string;
+            sectionSubtitle: string;
+            button: string;
+            microcopy: string;
+            navTitle: string;
+            navTitleCompacted: string;
+        };
+    }[T];
     fontWeights: {
-        display100: number;
-        display200: number;
-        display300: number;
-        display400: number;
-        display500: number;
-        display600: number;
-        display700: number;
-        display800: number;
-        display900: number;
-        body: number;
-        caption: number;
-        pageTitle: number;
-        sectionTitle: number;
-        sectionSubtitle: number;
-        button: number;
-        textInput: number;
-    };
+        web: {
+            display100: number;
+            display200: number;
+            display300: number;
+            display400: number;
+            display500: number;
+            display600: number;
+            display700: number;
+            display800: number;
+            display900: number;
+            body: number;
+            caption: number;
+            pageTitle: number;
+            sectionTitle: number;
+            sectionSubtitle: number;
+            button: number;
+            textInput: number;
+        };
+        reactNative: {
+            display100: number;
+            display200: number;
+            display300: number;
+            display400: number;
+            display500: number;
+            display600: number;
+            display700: number;
+            display800: number;
+            display900: number;
+            body: number;
+            caption: number;
+            pageTitle: number;
+            sectionTitle: number;
+            sectionSubtitle: number;
+            button: number;
+            microcopy: number;
+            navTitle: number;
+            navTitleCompacted: number;
+        };
+    }[T];
     letterSpacings: {
-        display100: number;
-        display200: number;
-        display300: number;
-        display400: number;
-        display500: number;
-        display600: number;
-        display700: number;
-        display800: number;
-        display900: number;
-        body: number;
-        caption: number;
-        pageTitle: number;
-        sectionTitle: number;
-        sectionSubtitle: number;
-        button: number;
-        textInput: number;
-    };
+        web: {
+            display100: number;
+            display200: number;
+            display300: number;
+            display400: number;
+            display500: number;
+            display600: number;
+            display700: number;
+            display800: number;
+            display900: number;
+            body: number;
+            caption: number;
+            pageTitle: number;
+            sectionTitle: number;
+            sectionSubtitle: number;
+            button: number;
+            textInput: number;
+        };
+        reactNative: {
+            display100: number;
+            display200: number;
+            display300: number;
+            display400: number;
+            display500: number;
+            display600: number;
+            display700: number;
+            display800: number;
+            display900: number;
+            body: number;
+            caption: number;
+            pageTitle: number;
+            sectionTitle: number;
+            sectionSubtitle: number;
+            button: number;
+            microcopy: number;
+            navTitle: number;
+            navTitleCompacted: number;
+        };
+    }[T];
     lineHeights: {
-        display100: number;
-        display200: number;
-        display300: number;
-        display400: number;
-        display500: number;
-        display600: number;
-        display700: number;
-        display800: number;
-        display900: number;
-        body: number;
-        caption: number;
-        pageTitle: number;
-        sectionTitle: number;
-        sectionSubtitle: number;
-        button: number;
-        textInput: number;
-    };
+        web: {
+            display100: number;
+            display200: number;
+            display300: number;
+            display400: number;
+            display500: number;
+            display600: number;
+            display700: number;
+            display800: number;
+            display900: number;
+            body: number;
+            caption: number;
+            pageTitle: number;
+            sectionTitle: number;
+            sectionSubtitle: number;
+            button: number;
+            textInput: number;
+        };
+        reactNative: {
+            display100: number;
+            display200: number;
+            display300: number;
+            display400: number;
+            display500: number;
+            display600: number;
+            display700: number;
+            display800: number;
+            display900: number;
+            body: number;
+            caption: number;
+            pageTitle: number;
+            sectionTitle: number;
+            sectionSubtitle: number;
+            button: number;
+            microcopy: number;
+            navTitle: number;
+            navTitleCompacted: number;
+        };
+    }[T];
     radii: import("../..").ThemeRadiiType<T>;
@@ -310,0 +421,0 @@ shadows: import("../..").ThemeElevationType<T>;

package.json

 {
   "name": "@vitality-ds/tokens",
-  "version": "4.0.1-alpha.0",
+  "version": "4.0.1-alpha.2",
   "description": "Design Tokens for Vitality",
@@ -34,3 +34,3 @@ "main": "dist/index.js",
   },
-  "gitHead": "89e15dfefbb21d77299546bd3067d1ca2f8faf9a"
+  "gitHead": "3138900a95edfeb0644cf0db8190006bcbe2b09c"
 }

src/Font/types.ts

@@ -111,23 +111,43 @@ import { BaseToken, Platforms } from "../types";
 
-export type FontSizePlatformValues = {
-  web: string;
-  reactNative: number;
-};
-
-export type ThemeFontStylesType<T extends Platforms> = {
+export type ThemeFontStylesType = {
   FontFamilies: {
-    [key in FontStyleKeys | "default"]: string;
+    web: {
+      [key in FontStyleKeys | "default"]: string;
+    };
+    reactNative: {
+      [key in RnFontStyleKeys | "default"]: string;
+    };
   };
   FontSizes: {
-    [key in FontStyleKeys]: FontSizePlatformValues[T];
+    web: {
+      [key in FontStyleKeys]: string;
+    };
+    reactNative: {
+      [key in RnFontStyleKeys]: string;
+    };
   };
   FontWeights: {
-    [key in FontStyleKeys]: number;
+    web: {
+      [key in FontStyleKeys]: number;
+    };
+    reactNative: {
+      [key in RnFontStyleKeys]: number;
+    };
   };
   LetterSpacings: {
-    [key in FontStyleKeys]: number;
+    web: {
+      [key in FontStyleKeys]: number;
+    };
+    reactNative: {
+      [key in RnFontStyleKeys]: number;
+    };
   };
   LineHeights: {
-    [key in FontStyleKeys]: number;
+    web: {
+      [key in FontStyleKeys]: number;
+    };
+    reactNative: {
+      [key in RnFontStyleKeys]: number;
+    };
   };
 };

src/Theme/getters/getFonts.ts

@@ -32,2 +32,2 @@ import { FontFamilies } from "../../Font";
         : null,
-  }) as ThemeFontStylesType<T>["FontFamilies"];
+  }) as ThemeFontStylesType["FontFamilies"][T];

src/Theme/getters/getFontSizes.ts

@@ -25,2 +25,2 @@ import { FontSizeToken, ThemeFontStylesType } from "../../Font/types";
     getValue: getFontSizeValue,
-  }) as ThemeFontStylesType<T>["FontSizes"];
+  }) as ThemeFontStylesType["FontSizes"][T];

src/Theme/getters/getFontWeights.ts

@@ -25,2 +25,2 @@ import { FontStyleToken, ThemeFontStylesType } from "../../Font/types";
     getValue: getFontWeightValue,
-  }) as ThemeFontStylesType<T>["FontWeights"];
+  }) as ThemeFontStylesType["FontWeights"][T];

src/Theme/getters/getLetterSpacings.ts

@@ -25,2 +25,2 @@ import { FontSizeToken, ThemeFontStylesType } from "../../Font/types";
     getValue: getLetterSpacingValue,
-  }) as ThemeFontStylesType<T>["LetterSpacings"];
+  }) as ThemeFontStylesType["LetterSpacings"][T];

src/Theme/getters/getLineHeights.ts

@@ -25,2 +25,2 @@ import { FontSizeToken, ThemeFontStylesType } from "../../Font/types";
     getValue: getLineHeightValue,
-  }) as ThemeFontStylesType<T>["LineHeights"];
+  }) as ThemeFontStylesType["LineHeights"][T];

No alert changes

Improved metrics

Total package byte prevSize

590434

increased by1.21%

Lines of code

8712

increased by3.13%

No dependency changes