@sk-web-gui/core 1.0.2 → 1.0.3

package/dist/types/theme.d.ts

@@ -0,0 +1,1719 @@
+import { screens } from "@sk-web-gui/theme/dist/types/units";
+export declare let fontSize: {
+    tiny: string;
+    xs: string;
+    xl: (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    '2xl': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    '3xl': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    '4xl': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    '5xl': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-1': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-1-lg': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-1-md': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-1-sm': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-2': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-2-lg': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-2-md': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-2-sm': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-3': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-3-lg': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-3-md': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'display-3-sm': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    h1: (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h1-lg': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h1-md': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h1-sm': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    h2: (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h2-lg': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h2-md': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h2-sm': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    h3: (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h3-lg': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h3-md': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h3-sm': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    h4: (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h4-lg': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h4-md': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'h4-sm': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'label-large': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'label-medium': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'label-small': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'input-large': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'input-medium': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    'input-small': (string | {
+        lineHeight: string;
+        fontWeight: number;
+    })[];
+    lead: string[];
+    base: string[];
+    large: string[];
+    small: string[];
+};
+export declare namespace fontFamily {
+    let DEFAULT: string[];
+    let sans: string[];
+    let header: string[];
+    let display: string[];
+}
+export { screens };
+export declare let borderRadius: {
+    base: string;
+    DEFAULT: string;
+    full: string;
+    none: string;
+    circular: string;
+    'circular-lg': string;
+    'circular-md': string;
+    'circular-sm': string;
+    button: string;
+    'button-lg': string;
+    'button-md': string;
+    'button-sm': string;
+    cards: string;
+    'cards-lg': string;
+    'cards-md': string;
+    'cards-sm': string;
+    utility: string;
+    'utility-lg': string;
+    'utility-md': string;
+    'utility-sm': string;
+    groups: string;
+    'groups-lg': string;
+    'groups-md': string;
+    'groups-sm': string;
+    0: string;
+    2: string;
+    4: string;
+    6: string;
+    8: string;
+    10: string;
+    12: string;
+    14: string;
+    16: string;
+    18: string;
+    20: string;
+    24: string;
+    32: string;
+    40: string;
+    48: string;
+    56: string;
+    64: string;
+    72: string;
+    80: string;
+};
+export declare namespace extend {
+    export let backgroundPosition: {};
+    export let boxShadow: {
+        100: string[];
+        200: string[];
+    };
+    export let ringColor: {
+        primitives: {
+            gray: {
+                lightest: string;
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+                darkest: string;
+            };
+            overlay: {
+                darken: {
+                    1: string;
+                    2: string;
+                    3: string;
+                    4: string;
+                    5: string;
+                    6: string;
+                    7: string;
+                    8: string;
+                    9: string;
+                    10: string;
+                };
+                lighten: {
+                    1: string;
+                    2: string;
+                    3: string;
+                    4: string;
+                    5: string;
+                    6: string;
+                    7: string;
+                    8: string;
+                    9: string;
+                    10: string;
+                };
+            };
+            blue: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            green: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            purple: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            pink: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            orange: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            red: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+        };
+        body: string;
+        black: string;
+        white: string;
+        ring: string;
+        primary: {
+            DEFAULT: string;
+            surface: {
+                DEFAULT: string;
+                hover: string;
+                disabled: string;
+            };
+            lightest: string;
+            50: string;
+            100: string;
+            200: string;
+            300: string;
+            400: string;
+            500: string;
+            600: string;
+            700: string;
+            800: string;
+            900: string;
+            darkest: string;
+        };
+        secondary: {
+            DEFAULT: string;
+            outline: {
+                DEFAULT: string;
+                hover: string;
+            };
+            surface: {
+                DEFAULT: string;
+                hover: string;
+                disabled: string;
+            };
+            lightest: string;
+            50: string;
+            100: string;
+            200: string;
+            300: string;
+            400: string;
+            500: string;
+            600: string;
+            700: string;
+            800: string;
+            900: string;
+            darkest: string;
+        };
+        tertiary: {
+            surface: {
+                DEFAULT: string;
+                hover: string;
+                disabled: string;
+            };
+        };
+        dark: {
+            DEFAULT: string;
+            primary: string;
+            secondary: string;
+            disabled: string;
+            placeholder: string;
+            ghost: string;
+        };
+        light: {
+            DEFAULT: string;
+            primary: string;
+            secondary: string;
+            disabled: string;
+            placeholder: string;
+            ghost: string;
+        };
+        divider: string;
+        background: {
+            DEFAULT: string;
+            content: string;
+            100: string;
+            200: string;
+            'color-mixin': {
+                1: string;
+                2: string;
+            };
+        };
+        vattjom: {
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        gronsta: {
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        juniskar: {
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        bjornstigen: {
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        error: {
+            DEFAULT: string;
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        warning: {
+            DEFAULT: string;
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        info: {
+            DEFAULT: string;
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        success: {
+            DEFAULT: string;
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        inverted: {
+            body: string;
+            black: string;
+            white: string;
+            ring: string;
+            primary: {
+                DEFAULT: string;
+                surface: {
+                    DEFAULT: string;
+                    hover: string;
+                    disabled: string;
+                };
+                lightest: string;
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+                darkest: string;
+            };
+            secondary: {
+                DEFAULT: string;
+                outline: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                surface: {
+                    DEFAULT: string;
+                    hover: string;
+                    disabled: string;
+                };
+                lightest: string;
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+                darkest: string;
+            };
+            tertiary: {
+                surface: {
+                    DEFAULT: string;
+                    hover: string;
+                    disabled: string;
+                };
+            };
+            dark: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+                disabled: string;
+                placeholder: string;
+                ghost: string;
+            };
+            light: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+                disabled: string;
+                placeholder: string;
+                ghost: string;
+            };
+            divider: string;
+            background: {
+                DEFAULT: string;
+                content: string;
+                100: string;
+                200: string;
+                'color-mixin': {
+                    1: string;
+                    2: string;
+                };
+            };
+            vattjom: {
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            gronsta: {
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            juniskar: {
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            bjornstigen: {
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            error: {
+                DEFAULT: string;
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            warning: {
+                DEFAULT: string;
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            info: {
+                DEFAULT: string;
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            success: {
+                DEFAULT: string;
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+        };
+        DEFAULT: string;
+    };
+    export namespace ringOffsetWidth {
+        let DEFAULT_1: string;
+        export { DEFAULT_1 as DEFAULT };
+    }
+    export let ringWidth: {
+        DEFAULT: string;
+        0: string;
+    };
+    export namespace ringOpacity {
+        let DEFAULT_2: number;
+        export { DEFAULT_2 as DEFAULT };
+    }
+    export let colors: {
+        current: string;
+        gray: {
+            lightest: string;
+            50: string;
+            100: string;
+            200: string;
+            300: string;
+            400: string;
+            500: string;
+            600: string;
+            700: string;
+            800: string;
+            900: string;
+            darkest: string;
+            DEFAULT: string;
+            stroke: string;
+            middle: string;
+            light: string;
+            lighter: string;
+        };
+        hover: string;
+        background: {
+            one: string;
+            two: string;
+            DEFAULT: string;
+            content: string;
+            100: string;
+            200: string;
+            'color-mixin': {
+                1: string;
+                2: string;
+            };
+        };
+        primitives: {
+            gray: {
+                lightest: string;
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+                darkest: string;
+            };
+            overlay: {
+                darken: {
+                    1: string;
+                    2: string;
+                    3: string;
+                    4: string;
+                    5: string;
+                    6: string;
+                    7: string;
+                    8: string;
+                    9: string;
+                    10: string;
+                };
+                lighten: {
+                    1: string;
+                    2: string;
+                    3: string;
+                    4: string;
+                    5: string;
+                    6: string;
+                    7: string;
+                    8: string;
+                    9: string;
+                    10: string;
+                };
+            };
+            blue: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            green: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            purple: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            pink: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            orange: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+            red: {
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+            };
+        };
+        body: string;
+        black: string;
+        white: string;
+        ring: string;
+        primary: {
+            DEFAULT: string;
+            surface: {
+                DEFAULT: string;
+                hover: string;
+                disabled: string;
+            };
+            lightest: string;
+            50: string;
+            100: string;
+            200: string;
+            300: string;
+            400: string;
+            500: string;
+            600: string;
+            700: string;
+            800: string;
+            900: string;
+            darkest: string;
+        };
+        secondary: {
+            DEFAULT: string;
+            outline: {
+                DEFAULT: string;
+                hover: string;
+            };
+            surface: {
+                DEFAULT: string;
+                hover: string;
+                disabled: string;
+            };
+            lightest: string;
+            50: string;
+            100: string;
+            200: string;
+            300: string;
+            400: string;
+            500: string;
+            600: string;
+            700: string;
+            800: string;
+            900: string;
+            darkest: string;
+        };
+        tertiary: {
+            surface: {
+                DEFAULT: string;
+                hover: string;
+                disabled: string;
+            };
+        };
+        dark: {
+            DEFAULT: string;
+            primary: string;
+            secondary: string;
+            disabled: string;
+            placeholder: string;
+            ghost: string;
+        };
+        light: {
+            DEFAULT: string;
+            primary: string;
+            secondary: string;
+            disabled: string;
+            placeholder: string;
+            ghost: string;
+        };
+        divider: string;
+        vattjom: {
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        gronsta: {
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        juniskar: {
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        bjornstigen: {
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        error: {
+            DEFAULT: string;
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        warning: {
+            DEFAULT: string;
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        info: {
+            DEFAULT: string;
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        success: {
+            DEFAULT: string;
+            background: {
+                100: string;
+                200: string;
+                300: string;
+            };
+            surface: {
+                primary: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                accent: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+            };
+            text: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+            };
+        };
+        inverted: {
+            body: string;
+            black: string;
+            white: string;
+            ring: string;
+            primary: {
+                DEFAULT: string;
+                surface: {
+                    DEFAULT: string;
+                    hover: string;
+                    disabled: string;
+                };
+                lightest: string;
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+                darkest: string;
+            };
+            secondary: {
+                DEFAULT: string;
+                outline: {
+                    DEFAULT: string;
+                    hover: string;
+                };
+                surface: {
+                    DEFAULT: string;
+                    hover: string;
+                    disabled: string;
+                };
+                lightest: string;
+                50: string;
+                100: string;
+                200: string;
+                300: string;
+                400: string;
+                500: string;
+                600: string;
+                700: string;
+                800: string;
+                900: string;
+                darkest: string;
+            };
+            tertiary: {
+                surface: {
+                    DEFAULT: string;
+                    hover: string;
+                    disabled: string;
+                };
+            };
+            dark: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+                disabled: string;
+                placeholder: string;
+                ghost: string;
+            };
+            light: {
+                DEFAULT: string;
+                primary: string;
+                secondary: string;
+                disabled: string;
+                placeholder: string;
+                ghost: string;
+            };
+            divider: string;
+            background: {
+                DEFAULT: string;
+                content: string;
+                100: string;
+                200: string;
+                'color-mixin': {
+                    1: string;
+                    2: string;
+                };
+            };
+            vattjom: {
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            gronsta: {
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            juniskar: {
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            bjornstigen: {
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            error: {
+                DEFAULT: string;
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            warning: {
+                DEFAULT: string;
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            info: {
+                DEFAULT: string;
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+            success: {
+                DEFAULT: string;
+                background: {
+                    100: string;
+                    200: string;
+                    300: string;
+                };
+                surface: {
+                    primary: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                    accent: {
+                        DEFAULT: string;
+                        hover: string;
+                    };
+                };
+                text: {
+                    DEFAULT: string;
+                    primary: string;
+                    secondary: string;
+                };
+            };
+        };
+    };
+    export namespace cursor {
+        let base: string;
+    }
+    export let spacing: {
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        0: string;
+        2: string;
+        4: string;
+        6: string;
+        8: string;
+        10: string;
+        12: string;
+        14: string;
+        16: string;
+        18: string;
+        20: string;
+        24: string;
+        32: string;
+        40: string;
+        48: string;
+        56: string;
+        64: string;
+        72: string;
+        80: string;
+    };
+    export namespace maxWidth {
+        let content: string;
+    }
+    let borderRadius_1: {
+        base: string;
+        DEFAULT: string;
+        full: string;
+        none: string;
+        circular: string;
+        'circular-lg': string;
+        'circular-md': string;
+        'circular-sm': string;
+        button: string;
+        'button-lg': string;
+        'button-md': string;
+        'button-sm': string;
+        cards: string;
+        'cards-lg': string;
+        'cards-md': string;
+        'cards-sm': string;
+        utility: string;
+        'utility-lg': string;
+        'utility-md': string;
+        'utility-sm': string;
+        groups: string;
+        'groups-lg': string;
+        'groups-md': string;
+        'groups-sm': string;
+        0: string;
+        2: string;
+        4: string;
+        6: string;
+        8: string;
+        10: string;
+        12: string;
+        14: string;
+        16: string;
+        18: string;
+        20: string;
+        24: string;
+        32: string;
+        40: string;
+        48: string;
+        56: string;
+        64: string;
+        72: string;
+        80: string;
+    };
+    export { borderRadius_1 as borderRadius };
+    export let lineHeight: {
+        xs: string;
+        xl: string;
+        '2xl': string;
+        '3xl': string;
+        '4xl': string;
+        '5xl': string;
+        'display-1': string;
+        'display-1-lg': string;
+        'display-1-md': string;
+        'display-1-sm': string;
+        'display-2': string;
+        'display-2-lg': string;
+        'display-2-md': string;
+        'display-2-sm': string;
+        'display-3': string;
+        'display-3-lg': string;
+        'display-3-md': string;
+        'display-3-sm': string;
+        h1: string;
+        'h1-lg': string;
+        'h1-md': string;
+        'h1-sm': string;
+        h2: string;
+        'h2-lg': string;
+        'h2-md': string;
+        'h2-sm': string;
+        h3: string;
+        'h3-lg': string;
+        'h3-md': string;
+        'h3-sm': string;
+        h4: string;
+        'h4-lg': string;
+        'h4-md': string;
+        'h4-sm': string;
+        'label-large': string;
+        'label-medium': string;
+        'label-small': string;
+        'input-large': string;
+        'input-medium': string;
+        'input-small': string;
+        lead: string;
+        base: string;
+        large: string;
+        small: string;
+    };
+    export let opacity: {
+        15: string;
+    };
+    export let borderWidth: {
+        DEFAULT: string;
+        1: string;
+        2: string;
+    };
+    export namespace backgroundColor {
+        let base_1: ({ opacityValue }: {
+            opacityValue: any;
+        }) => string;
+        export { base_1 as base };
+        export let fill: ({ opacityValue }: {
+            opacityValue: any;
+        }) => string;
+    }
+    export namespace textColor {
+        let foreground: ({ opacityValue }: {
+            opacityValue: any;
+        }) => string;
+        let muted: ({ opacityValue }: {
+            opacityValue: any;
+        }) => string;
+    }
+    export namespace zIndex {
+        export let hide: number;
+        export let none: number;
+        let base_2: number;
+        export { base_2 as base };
+        export let docked: number;
+        export let dropdown: number;
+        export let sticky: number;
+        export let banner: number;
+        export let overlay: number;
+        export let modal: number;
+        export let popover: number;
+        export let skipLink: number;
+        export let toast: number;
+        export let tooltip: number;
+    }
+    export let keyframes: {
+        'reset-overflow': {
+            'from, to': {
+                overflow: string;
+            };
+        };
+    };
+    export let animation: {
+        'reset-overflow': string;
+    };
+}