@autoguru/overdrive 4.9.0 → 4.9.2

package/dist/themes/flat_red/index.d.ts

@@ -1,8 +1,266 @@
 declare const _default: {
     name: string;
     themeRef: string;
-    tokens: import("../tokens").Tokens;
-    vars: import("@vanilla-extract/private").MapLeafNodes<import("../tokens").Tokens, import("@vanilla-extract/private").CSSVarFunction>;
+    vars: import("@vanilla-extract/private").MapLeafNodes<{
+        mode: string;
+        body: {
+            backgroundColour: string;
+            colour: string;
+        };
+        contentWidth: {
+            small: string;
+            large: string;
+            medium: string;
+        };
+        space: {
+            '1': string;
+            '2': string;
+            '3': string;
+            '4': string;
+            '5': string;
+            '6': string;
+            '7': string;
+            '8': string;
+            '9': string;
+            none: string;
+        };
+        colours: {
+            gamut: {
+                white: string;
+                red900: string;
+                red800: string;
+                red700: string;
+                red600: string;
+                red500: string;
+                red400: string;
+                red300: string;
+                red200: string;
+                red100: string;
+                gray900: string;
+                gray800: string;
+                gray700: string;
+                gray600: string;
+                gray500: string;
+                gray400: string;
+                gray300: string;
+                gray200: string;
+                gray100: string;
+                green900: string;
+                green800: string;
+                green700: string;
+                green600: string;
+                green500: string;
+                green400: string;
+                green300: string;
+                green200: string;
+                green100: string;
+                blue900: string;
+                blue800: string;
+                blue700: string;
+                blue600: string;
+                blue500: string;
+                blue400: string;
+                blue300: string;
+                blue200: string;
+                blue100: string;
+                yellow900: string;
+                yellow800: string;
+                yellow700: string;
+                yellow600: string;
+                yellow500: string;
+                yellow400: string;
+                yellow300: string;
+                yellow200: string;
+                yellow100: string;
+            };
+            foreground: {
+                body: string;
+                link: string;
+            };
+            background: {
+                body: string;
+                light: string;
+                neutral: string;
+                neutralDark: string;
+            };
+            intent: {
+                primary: {
+                    background: {
+                        standard: string;
+                        mild: string;
+                        strong: string;
+                    };
+                    foreground: string;
+                    border: string;
+                };
+                secondary: {
+                    background: {
+                        standard: string;
+                        mild: string;
+                        strong: string;
+                    };
+                    foreground: string;
+                    border: string;
+                };
+                shine: {
+                    background: {
+                        standard: string;
+                        mild: string;
+                        strong: string;
+                    };
+                    foreground: string;
+                    border: string;
+                };
+                danger: {
+                    background: {
+                        standard: string;
+                        mild: string;
+                        strong: string;
+                    };
+                    foreground: string;
+                    border: string;
+                };
+                warning: {
+                    background: {
+                        standard: string;
+                        mild: string;
+                        strong: string;
+                    };
+                    foreground: string;
+                    border: string;
+                };
+                neutral: {
+                    background: {
+                        standard: string;
+                        mild: string;
+                        strong: string;
+                    };
+                    foreground: string;
+                    border: string;
+                };
+                success: {
+                    background: {
+                        standard: string;
+                        mild: string;
+                        strong: string;
+                    };
+                    foreground: string;
+                    border: string;
+                };
+                information: {
+                    background: {
+                        standard: string;
+                        mild: string;
+                        strong: string;
+                    };
+                    foreground: string;
+                    border: string;
+                };
+            };
+        };
+        elevation: {
+            none: string;
+            '1': string;
+            '2': string;
+            '3': string;
+            '4': string;
+            '5': string;
+        };
+        border: {
+            width: {
+                none: string;
+                '1': string;
+                '2': string;
+                '3': string;
+            };
+            colours: {
+                light: string;
+                gray: string;
+                dark: string;
+            };
+            radius: {
+                none: string;
+                pill: string;
+                full: string;
+                '1': string;
+                min: string;
+            };
+        };
+        typography: {
+            size: {
+                '1': {
+                    fontSize: string;
+                    lineHeight: string;
+                };
+                '2': {
+                    fontSize: string;
+                    lineHeight: string;
+                };
+                '3': {
+                    fontSize: string;
+                    lineHeight: string;
+                };
+                '4': {
+                    fontSize: string;
+                    lineHeight: string;
+                };
+                '5': {
+                    fontSize: string;
+                    lineHeight: string;
+                };
+                '6': {
+                    fontSize: string;
+                    lineHeight: string;
+                };
+                '7': {
+                    fontSize: string;
+                    lineHeight: string;
+                };
+                '8': {
+                    fontSize: string;
+                    lineHeight: string;
+                };
+                '9': {
+                    fontSize: string;
+                    lineHeight: string;
+                };
+            };
+            colour: {
+                primary: string;
+                secondary: string;
+                shine: string;
+                link: string;
+                dark: string;
+                white: string;
+                muted: string;
+                neutral: string;
+                light: string;
+                danger: string;
+                warning: string;
+                success: string;
+                information: string;
+            };
+            fontWeight: {
+                normal: string;
+                semiBold: string;
+                bold: string;
+            };
+        };
+        animation: {
+            easing: {
+                standard: string;
+                decelerate: string;
+                accelerate: string;
+            };
+        };
+        icon: {
+            size: {
+                small: string;
+                medium: string;
+                large: string;
+            };
+        };
+    }, import("@vanilla-extract/private").CSSVarFunction>;
 };
 export default _default;
 //# sourceMappingURL=index.d.ts.map

package/dist/themes/flat_red/index.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/themes/flat_red/index.ts"],"names":[],"mappings":";;;;;;AAKA,wBAKE"}
+{"version":3,"file":"index.d.ts","sourceRoot":"","sources":["../../../lib/themes/flat_red/index.ts"],"names":[],"mappings":";;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;AAIA,wBAIE"}

package/dist/themes/flat_red/index.js

@@ -1,9 +1,7 @@
-import { vars } from '../base/vars.css';
-import { tokens } from './tokens';
+import { themeContractVars } from '../theme.css';
 import { themeRef } from './vars.css';
 export default {
     name: 'flatRedTheme',
     themeRef,
-    tokens,
-    vars,
+    vars: themeContractVars,
 };

package/dist/themes/flat_red/tokens.d.ts

@@ -1,3 +1,2 @@
-import { Tokens } from '../tokens';
-export declare const tokens: Tokens;
+export declare const tokens: any;
 //# sourceMappingURL=tokens.d.ts.map

package/dist/themes/flat_red/tokens.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../../lib/themes/flat_red/tokens.ts"],"names":[],"mappings":"AAEA,OAAO,EAAa,MAAM,EAAE,MAAM,WAAW,CAAC;AAmE9C,eAAO,MAAM,MAAM,EAAE,MA+HpB,CAAC"}
+{"version":3,"file":"tokens.d.ts","sourceRoot":"","sources":["../../../lib/themes/flat_red/tokens.ts"],"names":[],"mappings":"AAsEA,eAAO,MAAM,MAAM,KA4CI,CAAC"}

package/dist/themes/flat_red/tokens.js

@@ -1,3 +1,4 @@
+import deepmerge from 'deepmerge';
 import { tokens as baseTokens } from '../base/tokens';
 import { buildColourGamut } from '../makeTheme';
 const colours = {
@@ -57,25 +58,15 @@ const colours = {
         100: '#ffc8ba',
     },
 };
-const white = '#fff';
 const flatElevation = '0 0 0 0 rgba(0, 0, 0, 0.0)';
-export const tokens = {
-    ...baseTokens,
+export const tokens = deepmerge(baseTokens, {
     colours: {
         gamut: {
             ...buildColourGamut(colours),
-            white,
         },
         foreground: {
-            body: colours.gray['900'],
             link: colours.green['600'],
         },
-        background: {
-            body: white,
-            light: colours.gray['200'],
-            neutral: colours.gray['400'],
-            neutralDark: colours.gray['800'],
-        },
         intent: {
             primary: {
                 background: {
@@ -83,76 +74,18 @@ export const tokens = {
                     mild: colours.red['100'],
                     strong: colours.red['900'],
                 },
-                foreground: white,
                 border: colours.red['900'],
             },
             secondary: {
                 background: {
-                    standard: white,
-                    mild: white,
                     strong: colours.gray['100'],
                 },
                 foreground: colours.blue['800'],
                 border: colours.blue['300'],
             },
-            shine: {
-                background: {
-                    standard: colours.gray['200'],
-                    mild: colours.gray['100'],
-                    strong: colours.gray['300'],
-                },
-                foreground: colours.yellow['500'],
-                border: colours.gray['300'],
-            },
-            danger: {
-                background: {
-                    standard: colours.red['600'],
-                    mild: colours.red['100'],
-                    strong: colours.red['800'],
-                },
-                foreground: white,
-                border: colours.red['800'],
-            },
-            warning: {
-                background: {
-                    standard: colours.yellow['800'],
-                    mild: colours.yellow['100'],
-                    strong: colours.yellow['900'],
-                },
-                foreground: white,
-                border: colours.yellow['900'],
-            },
-            neutral: {
-                background: {
-                    standard: colours.gray['700'],
-                    mild: colours.gray['100'],
-                    strong: colours.gray['900'],
-                },
-                foreground: white,
-                border: colours.gray['900'],
-            },
-            success: {
-                background: {
-                    standard: colours.green['700'],
-                    mild: colours.green['100'],
-                    strong: colours.green['900'],
-                },
-                foreground: white,
-                border: colours.green['900'],
-            },
-            information: {
-                background: {
-                    standard: colours.blue['800'],
-                    mild: colours.blue['100'],
-                    strong: colours.blue['900'],
-                },
-                foreground: white,
-                border: colours.blue['900'],
-            },
         },
     },
     elevation: {
-        none: 'none',
         '1': flatElevation,
         '2': flatElevation,
         '3': flatElevation,
@@ -160,30 +93,14 @@ export const tokens = {
         '5': flatElevation,
     },
     border: {
-        width: {
-            none: '0',
-            '1': '1px',
-            '2': '2px',
-            '3': '4px',
-        },
-        colours: {
-            light: colours.gray['200'],
-            gray: colours.gray['300'],
-            dark: colours.gray['900'],
-        },
         radius: {
-            none: 'none',
-            pill: `${1e9}px`,
-            full: '50%',
             min: 'none',
             '1': 'none',
         },
     },
     typography: {
-        ...baseTokens.typography,
         colour: {
-            ...baseTokens.typography.colour,
             primary: colours.red['600'],
         },
     },
-};
+});

package/dist/themes/flat_red/vars.css.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"vars.css.d.ts","sourceRoot":"","sources":["../../../lib/themes/flat_red/vars.css.ts"],"names":[],"mappings":"AASA,eAAO,MAAM,QAAQ,QAAmD,CAAC"}
+{"version":3,"file":"vars.css.d.ts","sourceRoot":"","sources":["../../../lib/themes/flat_red/vars.css.ts"],"names":[],"mappings":"AAMA,eAAO,MAAM,QAAQ,EAAE,MAItB,CAAC"}

package/dist/themes/flat_red/vars.css.js

@@ -1,4 +1,4 @@
 import { createTheme } from '@vanilla-extract/css';
-import { vars as baseVars } from '../base/vars.css';
+import { themeContractVars } from '../theme.css';
 import { tokens } from './tokens';
-export const themeRef = createTheme(baseVars, tokens, 'flatRed');
+export const themeRef = createTheme(themeContractVars, tokens, 'flatRed');

package/dist/themes/makeTheme.d.ts

@@ -1,11 +1,7 @@
-import { BreakPoints, ColourGamut, ColourMap, Tokens } from './tokens';
+import { BreakPoints, ColourGamut, ColourMap } from './tokens';
 export declare const breakpoints: BreakPoints;
-export declare const makeRuntimeTokens: (tokens: Tokens, runtimeBreakpoints?: BreakPoints) => {
+export declare const makeRuntimeTokens: (runtimeBreakpoints?: BreakPoints) => {
     breakpoints: BreakPoints;
-    body: {
-        colour: string;
-        backgroundColour: string;
-    };
 };
 export declare type RuntimeTokens = ReturnType<typeof makeRuntimeTokens>;
 export declare const buildColourGamut: (colours: ColourMap) => Record<ColourGamut, string>;

package/dist/themes/makeTheme.d.ts.map

@@ -1 +1 @@
-{"version":3,"file":"makeTheme.d.ts","sourceRoot":"","sources":["../../lib/themes/makeTheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,EAAE,MAAM,UAAU,CAAC;AAEvE,eAAO,MAAM,WAAW,EAAE,WAKzB,CAAC;AAEF,eAAO,MAAM,iBAAiB,WACrB,MAAM,uBACM,WAAW;;;;;;CAO9B,CAAC;AAEH,oBAAY,aAAa,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAEjE,eAAO,MAAM,gBAAgB,YACnB,SAAS,KAChB,OAAO,WAAW,EAAE,MAAM,CAe3B,CAAC"}
+{"version":3,"file":"makeTheme.d.ts","sourceRoot":"","sources":["../../lib/themes/makeTheme.ts"],"names":[],"mappings":"AAAA,OAAO,EAAE,WAAW,EAAE,WAAW,EAAE,SAAS,EAAE,MAAM,UAAU,CAAC;AAE/D,eAAO,MAAM,WAAW,EAAE,WAKzB,CAAC;AAEF,eAAO,MAAM,iBAAiB,wBACT,WAAW;;CAG9B,CAAC;AAEH,oBAAY,aAAa,GAAG,UAAU,CAAC,OAAO,iBAAiB,CAAC,CAAC;AAEjE,eAAO,MAAM,gBAAgB,YACnB,SAAS,KAChB,OAAO,WAAW,EAAE,MAAM,CAe3B,CAAC"}

package/dist/themes/makeTheme.js

@@ -4,12 +4,8 @@ export const breakpoints = {
     desktop: '1024px',
     largeDesktop: '1440px',
 };
-export const makeRuntimeTokens = (tokens, runtimeBreakpoints = breakpoints) => ({
+export const makeRuntimeTokens = (runtimeBreakpoints = breakpoints) => ({
     breakpoints: runtimeBreakpoints,
-    body: {
-        colour: tokens.colours.foreground.body,
-        backgroundColour: tokens.colours.background.body,
-    },
 });
 export const buildColourGamut = (colours) => Object.entries(colours).reduce((result, [name, colourGrades]) => ({
     ...result,