@rango-dev/ui 0.15.1-next.2 → 0.15.1-next.21

package/dist/widget/ui/src/theme.d.ts

@@ -1,5 +1,150 @@
 /// <reference types="react" />
-import { DefaultThemeMap } from '@stitches/react/types/config';
+import type { DefaultThemeMap } from '@stitches/react/types/config';
+export declare const theme: {
+    colors: {
+        primary500: string;
+        primary600: string;
+        secondary100: string;
+        secondary200: string;
+        secondary300: string;
+        secondary400: string;
+        secondary500: string;
+        secondary600: string;
+        secondary700: string;
+        secondary800: string;
+        secondary900: string;
+        neutral100: string;
+        neutral200: string;
+        neutral300: string;
+        neutral400: string;
+        neutral500: string;
+        neutral600: string;
+        neutral700: string;
+        neutral800: string;
+        neutral900: string;
+        error100: string;
+        error300: string;
+        error500: string;
+        error600: string;
+        error700: string;
+        warning100: string;
+        warning300: string;
+        warning500: string;
+        warning600: string;
+        warning700: string;
+        info100: string;
+        info300: string;
+        info500: string;
+        info600: string;
+        info700: string;
+        success100: string;
+        success300: string;
+        success500: string;
+        success600: string;
+        success700: string;
+        background: string;
+        foreground: string;
+    };
+    space: {
+        0: string;
+        5: string;
+        10: string;
+        15: string;
+        20: string;
+        25: string;
+        30: string;
+        40: string;
+        46: string;
+        50: string;
+        60: string;
+        70: string;
+        80: string;
+        90: string;
+        100: string;
+        2: string;
+        4: string;
+        6: string;
+        8: string;
+        12: string;
+        16: string;
+        24: string;
+        28: string;
+        32: string;
+    };
+    radii: {
+        xs: string;
+        sm: string;
+        xm: string;
+        md: string;
+        xl: string;
+        lg: string;
+        primary: string;
+        secondary: string;
+    };
+    fontSizes: {
+        10: string;
+        12: string;
+        14: string;
+        16: string;
+        18: string;
+        20: string;
+        22: string;
+        24: string;
+        28: string;
+        32: string;
+        36: string;
+        40: string;
+        48: string;
+    };
+    fonts: {
+        primary: string;
+        widget: string;
+    };
+    fontWeights: {
+        regular: number;
+        medium: number;
+        semiBold: number;
+        bold: number;
+    };
+    lineHeights: {
+        12: string;
+        16: string;
+        20: string;
+        24: string;
+        26: string;
+        28: string;
+        30: string;
+        36: string;
+        40: string;
+        44: string;
+        52: string;
+        64: string;
+    };
+    letterSpacings: {};
+    sizes: {
+        4: string;
+        6: string;
+        8: string;
+        12: string;
+        16: string;
+        18: string;
+        20: string;
+        24: string;
+        28: string;
+        32: string;
+        36: string;
+        40: string;
+        45: string;
+        48: string;
+    };
+    borderWidths: {};
+    borderStyles: {};
+    shadows: {
+        s: string;
+    };
+    zIndices: {};
+    transitions: {};
+};
 export declare const styled: <Type extends import("react").ComponentType<any> | import("@stitches/react/types/util").Function | keyof JSX.IntrinsicElements, Composers extends (string | import("react").ComponentType<any> | import("@stitches/react/types/util").Function | {
     [name: string]: unknown;
 })[], CSS = import("@stitches/react/types/css-util").CSS<{
@@ -8,17 +153,17 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
     lg: string;
 }, {
     colors: {
-        primary: string;
-        primary100: string;
-        primary200: string;
-        primary300: string;
-        primary400: string;
         primary500: string;
         primary600: string;
-        primary700: string;
-        primary800: string;
-        primary900: string;
-        surface: string;
+        secondary100: string;
+        secondary200: string;
+        secondary300: string;
+        secondary400: string;
+        secondary500: string;
+        secondary600: string;
+        secondary700: string;
+        secondary800: string;
+        secondary900: string;
         neutral100: string;
         neutral200: string;
         neutral300: string;
@@ -28,39 +173,65 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         neutral700: string;
         neutral800: string;
         neutral900: string;
-        background: string;
-        foreground: string;
-        success: string;
-        success100: string;
-        success300: string;
-        success500: string;
-        success700: string;
-        warning: string;
-        warning100: string;
-        warning300: string;
-        warning500: string;
-        warning700: string;
-        error: string;
         error100: string;
         error300: string;
         error500: string;
+        error600: string;
         error700: string;
-        white: string;
+        warning100: string;
+        warning300: string;
+        warning500: string;
+        warning600: string;
+        warning700: string;
+        info100: string;
+        info300: string;
+        info500: string;
+        info600: string;
+        info700: string;
+        success100: string;
+        success300: string;
+        success500: string;
+        success600: string;
+        success700: string;
+        background: string;
+        foreground: string;
     };
     space: {
+        0: string;
+        5: string;
+        10: string;
+        15: string;
+        20: string;
+        25: string;
+        30: string;
+        40: string;
+        46: string;
+        50: string;
+        60: string;
+        70: string;
+        80: string;
+        90: string;
+        100: string;
         2: string;
         4: string;
         6: string;
         8: string;
-        10: string;
         12: string;
         16: string;
-        20: string;
         24: string;
         28: string;
-        30: string;
         32: string;
     };
+    radii: {
+        xs: string;
+        sm: string;
+        xm: string;
+        md: string;
+        xl: string;
+        lg: string;
+        primary: string;
+        secondary: string;
+    };
     fontSizes: {
         10: string;
         12: string;
@@ -68,20 +239,38 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         16: string;
         18: string;
         20: string;
+        22: string;
         24: string;
+        28: string;
         32: string;
         36: string;
         40: string;
         48: string;
     };
-    fonts: {};
+    fonts: {
+        primary: string;
+        widget: string;
+    };
     fontWeights: {
-        400: string;
-        500: string;
-        600: string;
-        700: string;
+        regular: number;
+        medium: number;
+        semiBold: number;
+        bold: number;
+    };
+    lineHeights: {
+        12: string;
+        16: string;
+        20: string;
+        24: string;
+        26: string;
+        28: string;
+        30: string;
+        36: string;
+        40: string;
+        44: string;
+        52: string;
+        64: string;
     };
-    lineHeights: {};
     letterSpacings: {};
     sizes: {
         4: string;
@@ -89,20 +278,18 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         8: string;
         12: string;
         16: string;
+        18: string;
         20: string;
         24: string;
         28: string;
         32: string;
         36: string;
         40: string;
+        45: string;
         48: string;
     };
     borderWidths: {};
     borderStyles: {};
-    radii: {
-        5: string;
-        10: string;
-    };
     shadows: {
         s: string;
     };
@@ -129,17 +316,17 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
     lg: string;
 }, {
     colors: {
-        primary: string;
-        primary100: string;
-        primary200: string;
-        primary300: string;
-        primary400: string;
         primary500: string;
         primary600: string;
-        primary700: string;
-        primary800: string;
-        primary900: string;
-        surface: string;
+        secondary100: string;
+        secondary200: string;
+        secondary300: string;
+        secondary400: string;
+        secondary500: string;
+        secondary600: string;
+        secondary700: string;
+        secondary800: string;
+        secondary900: string;
         neutral100: string;
         neutral200: string;
         neutral300: string;
@@ -149,39 +336,65 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         neutral700: string;
         neutral800: string;
         neutral900: string;
-        background: string;
-        foreground: string;
-        success: string;
-        success100: string;
-        success300: string;
-        success500: string;
-        success700: string;
-        warning: string;
-        warning100: string;
-        warning300: string;
-        warning500: string;
-        warning700: string;
-        error: string;
         error100: string;
         error300: string;
         error500: string;
+        error600: string;
         error700: string;
-        white: string;
+        warning100: string;
+        warning300: string;
+        warning500: string;
+        warning600: string;
+        warning700: string;
+        info100: string;
+        info300: string;
+        info500: string;
+        info600: string;
+        info700: string;
+        success100: string;
+        success300: string;
+        success500: string;
+        success600: string;
+        success700: string;
+        background: string;
+        foreground: string;
     };
     space: {
+        0: string;
+        5: string;
+        10: string;
+        15: string;
+        20: string;
+        25: string;
+        30: string;
+        40: string;
+        46: string;
+        50: string;
+        60: string;
+        70: string;
+        80: string;
+        90: string;
+        100: string;
         2: string;
         4: string;
         6: string;
         8: string;
-        10: string;
         12: string;
         16: string;
-        20: string;
         24: string;
         28: string;
-        30: string;
         32: string;
     };
+    radii: {
+        xs: string;
+        sm: string;
+        xm: string;
+        md: string;
+        xl: string;
+        lg: string;
+        primary: string;
+        secondary: string;
+    };
     fontSizes: {
         10: string;
         12: string;
@@ -189,20 +402,38 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         16: string;
         18: string;
         20: string;
+        22: string;
         24: string;
+        28: string;
         32: string;
         36: string;
         40: string;
         48: string;
     };
-    fonts: {};
+    fonts: {
+        primary: string;
+        widget: string;
+    };
     fontWeights: {
-        400: string;
-        500: string;
-        600: string;
-        700: string;
+        regular: number;
+        medium: number;
+        semiBold: number;
+        bold: number;
+    };
+    lineHeights: {
+        12: string;
+        16: string;
+        20: string;
+        24: string;
+        26: string;
+        28: string;
+        30: string;
+        36: string;
+        40: string;
+        44: string;
+        52: string;
+        64: string;
     };
-    lineHeights: {};
     letterSpacings: {};
     sizes: {
         4: string;
@@ -210,20 +441,18 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         8: string;
         12: string;
         16: string;
+        18: string;
         20: string;
         24: string;
         28: string;
         32: string;
         36: string;
         40: string;
+        45: string;
         48: string;
     };
     borderWidths: {};
     borderStyles: {};
-    radii: {
-        5: string;
-        10: string;
-    };
     shadows: {
         s: string;
     };
@@ -237,17 +466,17 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
     lg: string;
 }, {
     colors: {
-        primary: string;
-        primary100: string;
-        primary200: string;
-        primary300: string;
-        primary400: string;
         primary500: string;
         primary600: string;
-        primary700: string;
-        primary800: string;
-        primary900: string;
-        surface: string;
+        secondary100: string;
+        secondary200: string;
+        secondary300: string;
+        secondary400: string;
+        secondary500: string;
+        secondary600: string;
+        secondary700: string;
+        secondary800: string;
+        secondary900: string;
         neutral100: string;
         neutral200: string;
         neutral300: string;
@@ -257,39 +486,65 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         neutral700: string;
         neutral800: string;
         neutral900: string;
-        background: string;
-        foreground: string;
-        success: string;
-        success100: string;
-        success300: string;
-        success500: string;
-        success700: string;
-        warning: string;
-        warning100: string;
-        warning300: string;
-        warning500: string;
-        warning700: string;
-        error: string;
         error100: string;
         error300: string;
         error500: string;
+        error600: string;
         error700: string;
-        white: string;
+        warning100: string;
+        warning300: string;
+        warning500: string;
+        warning600: string;
+        warning700: string;
+        info100: string;
+        info300: string;
+        info500: string;
+        info600: string;
+        info700: string;
+        success100: string;
+        success300: string;
+        success500: string;
+        success600: string;
+        success700: string;
+        background: string;
+        foreground: string;
     };
     space: {
+        0: string;
+        5: string;
+        10: string;
+        15: string;
+        20: string;
+        25: string;
+        30: string;
+        40: string;
+        46: string;
+        50: string;
+        60: string;
+        70: string;
+        80: string;
+        90: string;
+        100: string;
         2: string;
         4: string;
         6: string;
         8: string;
-        10: string;
         12: string;
         16: string;
-        20: string;
         24: string;
         28: string;
-        30: string;
         32: string;
     };
+    radii: {
+        xs: string;
+        sm: string;
+        xm: string;
+        md: string;
+        xl: string;
+        lg: string;
+        primary: string;
+        secondary: string;
+    };
     fontSizes: {
         10: string;
         12: string;
@@ -297,20 +552,38 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         16: string;
         18: string;
         20: string;
+        22: string;
         24: string;
+        28: string;
         32: string;
         36: string;
         40: string;
         48: string;
     };
-    fonts: {};
+    fonts: {
+        primary: string;
+        widget: string;
+    };
     fontWeights: {
-        400: string;
-        500: string;
-        600: string;
-        700: string;
+        regular: number;
+        medium: number;
+        semiBold: number;
+        bold: number;
+    };
+    lineHeights: {
+        12: string;
+        16: string;
+        20: string;
+        24: string;
+        26: string;
+        28: string;
+        30: string;
+        36: string;
+        40: string;
+        44: string;
+        52: string;
+        64: string;
     };
-    lineHeights: {};
     letterSpacings: {};
     sizes: {
         4: string;
@@ -318,20 +591,18 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         8: string;
         12: string;
         16: string;
+        18: string;
         20: string;
         24: string;
         28: string;
         32: string;
         36: string;
         40: string;
+        45: string;
         48: string;
     };
     borderWidths: {};
     borderStyles: {};
-    radii: {
-        5: string;
-        10: string;
-    };
     shadows: {
         s: string;
     };
@@ -354,17 +625,17 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
     lg: string;
 }, CSS>, createTheme: <Argument0 extends string | ({
     colors?: {
-        primary?: string | number | boolean | undefined;
-        primary100?: string | number | boolean | undefined;
-        primary200?: string | number | boolean | undefined;
-        primary300?: string | number | boolean | undefined;
-        primary400?: string | number | boolean | undefined;
         primary500?: string | number | boolean | undefined;
         primary600?: string | number | boolean | undefined;
-        primary700?: string | number | boolean | undefined;
-        primary800?: string | number | boolean | undefined;
-        primary900?: string | number | boolean | undefined;
-        surface?: string | number | boolean | undefined;
+        secondary100?: string | number | boolean | undefined;
+        secondary200?: string | number | boolean | undefined;
+        secondary300?: string | number | boolean | undefined;
+        secondary400?: string | number | boolean | undefined;
+        secondary500?: string | number | boolean | undefined;
+        secondary600?: string | number | boolean | undefined;
+        secondary700?: string | number | boolean | undefined;
+        secondary800?: string | number | boolean | undefined;
+        secondary900?: string | number | boolean | undefined;
         neutral100?: string | number | boolean | undefined;
         neutral200?: string | number | boolean | undefined;
         neutral300?: string | number | boolean | undefined;
@@ -374,39 +645,65 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         neutral700?: string | number | boolean | undefined;
         neutral800?: string | number | boolean | undefined;
         neutral900?: string | number | boolean | undefined;
-        background?: string | number | boolean | undefined;
-        foreground?: string | number | boolean | undefined;
-        success?: string | number | boolean | undefined;
-        success100?: string | number | boolean | undefined;
-        success300?: string | number | boolean | undefined;
-        success500?: string | number | boolean | undefined;
-        success700?: string | number | boolean | undefined;
-        warning?: string | number | boolean | undefined;
-        warning100?: string | number | boolean | undefined;
-        warning300?: string | number | boolean | undefined;
-        warning500?: string | number | boolean | undefined;
-        warning700?: string | number | boolean | undefined;
-        error?: string | number | boolean | undefined;
         error100?: string | number | boolean | undefined;
         error300?: string | number | boolean | undefined;
         error500?: string | number | boolean | undefined;
+        error600?: string | number | boolean | undefined;
         error700?: string | number | boolean | undefined;
-        white?: string | number | boolean | undefined;
+        warning100?: string | number | boolean | undefined;
+        warning300?: string | number | boolean | undefined;
+        warning500?: string | number | boolean | undefined;
+        warning600?: string | number | boolean | undefined;
+        warning700?: string | number | boolean | undefined;
+        info100?: string | number | boolean | undefined;
+        info300?: string | number | boolean | undefined;
+        info500?: string | number | boolean | undefined;
+        info600?: string | number | boolean | undefined;
+        info700?: string | number | boolean | undefined;
+        success100?: string | number | boolean | undefined;
+        success300?: string | number | boolean | undefined;
+        success500?: string | number | boolean | undefined;
+        success600?: string | number | boolean | undefined;
+        success700?: string | number | boolean | undefined;
+        background?: string | number | boolean | undefined;
+        foreground?: string | number | boolean | undefined;
     } | undefined;
     space?: {
+        0?: string | number | boolean | undefined;
+        5?: string | number | boolean | undefined;
+        10?: string | number | boolean | undefined;
+        15?: string | number | boolean | undefined;
+        20?: string | number | boolean | undefined;
+        25?: string | number | boolean | undefined;
+        30?: string | number | boolean | undefined;
+        40?: string | number | boolean | undefined;
+        46?: string | number | boolean | undefined;
+        50?: string | number | boolean | undefined;
+        60?: string | number | boolean | undefined;
+        70?: string | number | boolean | undefined;
+        80?: string | number | boolean | undefined;
+        90?: string | number | boolean | undefined;
+        100?: string | number | boolean | undefined;
         2?: string | number | boolean | undefined;
         4?: string | number | boolean | undefined;
         6?: string | number | boolean | undefined;
         8?: string | number | boolean | undefined;
-        10?: string | number | boolean | undefined;
         12?: string | number | boolean | undefined;
         16?: string | number | boolean | undefined;
-        20?: string | number | boolean | undefined;
         24?: string | number | boolean | undefined;
         28?: string | number | boolean | undefined;
-        30?: string | number | boolean | undefined;
         32?: string | number | boolean | undefined;
     } | undefined;
+    radii?: {
+        xs?: string | number | boolean | undefined;
+        sm?: string | number | boolean | undefined;
+        xm?: string | number | boolean | undefined;
+        md?: string | number | boolean | undefined;
+        xl?: string | number | boolean | undefined;
+        lg?: string | number | boolean | undefined;
+        primary?: string | number | boolean | undefined;
+        secondary?: string | number | boolean | undefined;
+    } | undefined;
     fontSizes?: {
         10?: string | number | boolean | undefined;
         12?: string | number | boolean | undefined;
@@ -414,20 +711,38 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         16?: string | number | boolean | undefined;
         18?: string | number | boolean | undefined;
         20?: string | number | boolean | undefined;
+        22?: string | number | boolean | undefined;
         24?: string | number | boolean | undefined;
+        28?: string | number | boolean | undefined;
         32?: string | number | boolean | undefined;
         36?: string | number | boolean | undefined;
         40?: string | number | boolean | undefined;
         48?: string | number | boolean | undefined;
     } | undefined;
-    fonts?: {} | undefined;
+    fonts?: {
+        primary?: string | number | boolean | undefined;
+        widget?: string | number | boolean | undefined;
+    } | undefined;
     fontWeights?: {
-        400?: string | number | boolean | undefined;
-        500?: string | number | boolean | undefined;
-        600?: string | number | boolean | undefined;
-        700?: string | number | boolean | undefined;
+        regular?: string | number | boolean | undefined;
+        medium?: string | number | boolean | undefined;
+        semiBold?: string | number | boolean | undefined;
+        bold?: string | number | boolean | undefined;
+    } | undefined;
+    lineHeights?: {
+        12?: string | number | boolean | undefined;
+        16?: string | number | boolean | undefined;
+        20?: string | number | boolean | undefined;
+        24?: string | number | boolean | undefined;
+        26?: string | number | boolean | undefined;
+        28?: string | number | boolean | undefined;
+        30?: string | number | boolean | undefined;
+        36?: string | number | boolean | undefined;
+        40?: string | number | boolean | undefined;
+        44?: string | number | boolean | undefined;
+        52?: string | number | boolean | undefined;
+        64?: string | number | boolean | undefined;
     } | undefined;
-    lineHeights?: {} | undefined;
     letterSpacings?: {} | undefined;
     sizes?: {
         4?: string | number | boolean | undefined;
@@ -435,20 +750,18 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         8?: string | number | boolean | undefined;
         12?: string | number | boolean | undefined;
         16?: string | number | boolean | undefined;
+        18?: string | number | boolean | undefined;
         20?: string | number | boolean | undefined;
         24?: string | number | boolean | undefined;
         28?: string | number | boolean | undefined;
         32?: string | number | boolean | undefined;
         36?: string | number | boolean | undefined;
         40?: string | number | boolean | undefined;
+        45?: string | number | boolean | undefined;
         48?: string | number | boolean | undefined;
     } | undefined;
     borderWidths?: {} | undefined;
     borderStyles?: {} | undefined;
-    radii?: {
-        5?: string | number | boolean | undefined;
-        10?: string | number | boolean | undefined;
-    } | undefined;
     shadows?: {
         s?: string | number | boolean | undefined;
     } | undefined;
@@ -461,17 +774,17 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
     };
 }), Argument1 extends string | ({
     colors?: {
-        primary?: string | number | boolean | undefined;
-        primary100?: string | number | boolean | undefined;
-        primary200?: string | number | boolean | undefined;
-        primary300?: string | number | boolean | undefined;
-        primary400?: string | number | boolean | undefined;
         primary500?: string | number | boolean | undefined;
         primary600?: string | number | boolean | undefined;
-        primary700?: string | number | boolean | undefined;
-        primary800?: string | number | boolean | undefined;
-        primary900?: string | number | boolean | undefined;
-        surface?: string | number | boolean | undefined;
+        secondary100?: string | number | boolean | undefined;
+        secondary200?: string | number | boolean | undefined;
+        secondary300?: string | number | boolean | undefined;
+        secondary400?: string | number | boolean | undefined;
+        secondary500?: string | number | boolean | undefined;
+        secondary600?: string | number | boolean | undefined;
+        secondary700?: string | number | boolean | undefined;
+        secondary800?: string | number | boolean | undefined;
+        secondary900?: string | number | boolean | undefined;
         neutral100?: string | number | boolean | undefined;
         neutral200?: string | number | boolean | undefined;
         neutral300?: string | number | boolean | undefined;
@@ -481,39 +794,65 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         neutral700?: string | number | boolean | undefined;
         neutral800?: string | number | boolean | undefined;
         neutral900?: string | number | boolean | undefined;
-        background?: string | number | boolean | undefined;
-        foreground?: string | number | boolean | undefined;
-        success?: string | number | boolean | undefined;
-        success100?: string | number | boolean | undefined;
-        success300?: string | number | boolean | undefined;
-        success500?: string | number | boolean | undefined;
-        success700?: string | number | boolean | undefined;
-        warning?: string | number | boolean | undefined;
-        warning100?: string | number | boolean | undefined;
-        warning300?: string | number | boolean | undefined;
-        warning500?: string | number | boolean | undefined;
-        warning700?: string | number | boolean | undefined;
-        error?: string | number | boolean | undefined;
         error100?: string | number | boolean | undefined;
         error300?: string | number | boolean | undefined;
         error500?: string | number | boolean | undefined;
+        error600?: string | number | boolean | undefined;
         error700?: string | number | boolean | undefined;
-        white?: string | number | boolean | undefined;
+        warning100?: string | number | boolean | undefined;
+        warning300?: string | number | boolean | undefined;
+        warning500?: string | number | boolean | undefined;
+        warning600?: string | number | boolean | undefined;
+        warning700?: string | number | boolean | undefined;
+        info100?: string | number | boolean | undefined;
+        info300?: string | number | boolean | undefined;
+        info500?: string | number | boolean | undefined;
+        info600?: string | number | boolean | undefined;
+        info700?: string | number | boolean | undefined;
+        success100?: string | number | boolean | undefined;
+        success300?: string | number | boolean | undefined;
+        success500?: string | number | boolean | undefined;
+        success600?: string | number | boolean | undefined;
+        success700?: string | number | boolean | undefined;
+        background?: string | number | boolean | undefined;
+        foreground?: string | number | boolean | undefined;
     } | undefined;
     space?: {
+        0?: string | number | boolean | undefined;
+        5?: string | number | boolean | undefined;
+        10?: string | number | boolean | undefined;
+        15?: string | number | boolean | undefined;
+        20?: string | number | boolean | undefined;
+        25?: string | number | boolean | undefined;
+        30?: string | number | boolean | undefined;
+        40?: string | number | boolean | undefined;
+        46?: string | number | boolean | undefined;
+        50?: string | number | boolean | undefined;
+        60?: string | number | boolean | undefined;
+        70?: string | number | boolean | undefined;
+        80?: string | number | boolean | undefined;
+        90?: string | number | boolean | undefined;
+        100?: string | number | boolean | undefined;
         2?: string | number | boolean | undefined;
         4?: string | number | boolean | undefined;
         6?: string | number | boolean | undefined;
         8?: string | number | boolean | undefined;
-        10?: string | number | boolean | undefined;
         12?: string | number | boolean | undefined;
         16?: string | number | boolean | undefined;
-        20?: string | number | boolean | undefined;
         24?: string | number | boolean | undefined;
         28?: string | number | boolean | undefined;
-        30?: string | number | boolean | undefined;
         32?: string | number | boolean | undefined;
     } | undefined;
+    radii?: {
+        xs?: string | number | boolean | undefined;
+        sm?: string | number | boolean | undefined;
+        xm?: string | number | boolean | undefined;
+        md?: string | number | boolean | undefined;
+        xl?: string | number | boolean | undefined;
+        lg?: string | number | boolean | undefined;
+        primary?: string | number | boolean | undefined;
+        secondary?: string | number | boolean | undefined;
+    } | undefined;
     fontSizes?: {
         10?: string | number | boolean | undefined;
         12?: string | number | boolean | undefined;
@@ -521,20 +860,38 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         16?: string | number | boolean | undefined;
         18?: string | number | boolean | undefined;
         20?: string | number | boolean | undefined;
+        22?: string | number | boolean | undefined;
         24?: string | number | boolean | undefined;
+        28?: string | number | boolean | undefined;
         32?: string | number | boolean | undefined;
         36?: string | number | boolean | undefined;
         40?: string | number | boolean | undefined;
         48?: string | number | boolean | undefined;
     } | undefined;
-    fonts?: {} | undefined;
+    fonts?: {
+        primary?: string | number | boolean | undefined;
+        widget?: string | number | boolean | undefined;
+    } | undefined;
     fontWeights?: {
-        400?: string | number | boolean | undefined;
-        500?: string | number | boolean | undefined;
-        600?: string | number | boolean | undefined;
-        700?: string | number | boolean | undefined;
+        regular?: string | number | boolean | undefined;
+        medium?: string | number | boolean | undefined;
+        semiBold?: string | number | boolean | undefined;
+        bold?: string | number | boolean | undefined;
+    } | undefined;
+    lineHeights?: {
+        12?: string | number | boolean | undefined;
+        16?: string | number | boolean | undefined;
+        20?: string | number | boolean | undefined;
+        24?: string | number | boolean | undefined;
+        26?: string | number | boolean | undefined;
+        28?: string | number | boolean | undefined;
+        30?: string | number | boolean | undefined;
+        36?: string | number | boolean | undefined;
+        40?: string | number | boolean | undefined;
+        44?: string | number | boolean | undefined;
+        52?: string | number | boolean | undefined;
+        64?: string | number | boolean | undefined;
     } | undefined;
-    lineHeights?: {} | undefined;
     letterSpacings?: {} | undefined;
     sizes?: {
         4?: string | number | boolean | undefined;
@@ -542,20 +899,18 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         8?: string | number | boolean | undefined;
         12?: string | number | boolean | undefined;
         16?: string | number | boolean | undefined;
+        18?: string | number | boolean | undefined;
         20?: string | number | boolean | undefined;
         24?: string | number | boolean | undefined;
         28?: string | number | boolean | undefined;
         32?: string | number | boolean | undefined;
         36?: string | number | boolean | undefined;
         40?: string | number | boolean | undefined;
+        45?: string | number | boolean | undefined;
         48?: string | number | boolean | undefined;
     } | undefined;
     borderWidths?: {} | undefined;
     borderStyles?: {} | undefined;
-    radii?: {
-        5?: string | number | boolean | undefined;
-        10?: string | number | boolean | undefined;
-    } | undefined;
     shadows?: {
         s?: string | number | boolean | undefined;
     } | undefined;
@@ -576,17 +931,17 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         lg: string;
     }, {
         colors: {
-            primary: string;
-            primary100: string;
-            primary200: string;
-            primary300: string;
-            primary400: string;
             primary500: string;
             primary600: string;
-            primary700: string;
-            primary800: string;
-            primary900: string;
-            surface: string;
+            secondary100: string;
+            secondary200: string;
+            secondary300: string;
+            secondary400: string;
+            secondary500: string;
+            secondary600: string;
+            secondary700: string;
+            secondary800: string;
+            secondary900: string;
             neutral100: string;
             neutral200: string;
             neutral300: string;
@@ -596,39 +951,65 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
             neutral700: string;
             neutral800: string;
             neutral900: string;
-            background: string;
-            foreground: string;
-            success: string;
-            success100: string;
-            success300: string;
-            success500: string;
-            success700: string;
-            warning: string;
-            warning100: string;
-            warning300: string;
-            warning500: string;
-            warning700: string;
-            error: string;
             error100: string;
             error300: string;
             error500: string;
+            error600: string;
             error700: string;
-            white: string;
+            warning100: string;
+            warning300: string;
+            warning500: string;
+            warning600: string;
+            warning700: string;
+            info100: string;
+            info300: string;
+            info500: string;
+            info600: string;
+            info700: string;
+            success100: string;
+            success300: string;
+            success500: string;
+            success600: string;
+            success700: string;
+            background: string;
+            foreground: string;
         };
         space: {
+            0: string;
+            5: string;
+            10: string;
+            15: string;
+            20: string;
+            25: string;
+            30: string;
+            40: string;
+            46: string;
+            50: string;
+            60: string;
+            70: string;
+            80: string;
+            90: string;
+            100: string;
             2: string;
             4: string;
             6: string;
             8: string;
-            10: string;
             12: string;
             16: string;
-            20: string;
             24: string;
             28: string;
-            30: string;
             32: string;
         };
+        radii: {
+            xs: string;
+            sm: string;
+            xm: string;
+            md: string;
+            xl: string;
+            lg: string;
+            primary: string;
+            secondary: string;
+        };
         fontSizes: {
             10: string;
             12: string;
@@ -636,20 +1017,38 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
             16: string;
             18: string;
             20: string;
+            22: string;
             24: string;
+            28: string;
             32: string;
             36: string;
             40: string;
             48: string;
         };
-        fonts: {};
+        fonts: {
+            primary: string;
+            widget: string;
+        };
         fontWeights: {
-            400: string;
-            500: string;
-            600: string;
-            700: string;
+            regular: number;
+            medium: number;
+            semiBold: number;
+            bold: number;
+        };
+        lineHeights: {
+            12: string;
+            16: string;
+            20: string;
+            24: string;
+            26: string;
+            28: string;
+            30: string;
+            36: string;
+            40: string;
+            44: string;
+            52: string;
+            64: string;
         };
-        lineHeights: {};
         letterSpacings: {};
         sizes: {
             4: string;
@@ -657,20 +1056,18 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
             8: string;
             12: string;
             16: string;
+            18: string;
             20: string;
             24: string;
             28: string;
             32: string;
             36: string;
             40: string;
+            45: string;
             48: string;
         };
         borderWidths: {};
         borderStyles: {};
-        radii: {
-            5: string;
-            10: string;
-        };
         shadows: {
             s: string;
         };
@@ -692,17 +1089,17 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         lg: string;
     }, {
         colors: {
-            primary: string;
-            primary100: string;
-            primary200: string;
-            primary300: string;
-            primary400: string;
             primary500: string;
             primary600: string;
-            primary700: string;
-            primary800: string;
-            primary900: string;
-            surface: string;
+            secondary100: string;
+            secondary200: string;
+            secondary300: string;
+            secondary400: string;
+            secondary500: string;
+            secondary600: string;
+            secondary700: string;
+            secondary800: string;
+            secondary900: string;
             neutral100: string;
             neutral200: string;
             neutral300: string;
@@ -712,39 +1109,65 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
             neutral700: string;
             neutral800: string;
             neutral900: string;
-            background: string;
-            foreground: string;
-            success: string;
-            success100: string;
-            success300: string;
-            success500: string;
-            success700: string;
-            warning: string;
-            warning100: string;
-            warning300: string;
-            warning500: string;
-            warning700: string;
-            error: string;
             error100: string;
             error300: string;
             error500: string;
+            error600: string;
             error700: string;
-            white: string;
+            warning100: string;
+            warning300: string;
+            warning500: string;
+            warning600: string;
+            warning700: string;
+            info100: string;
+            info300: string;
+            info500: string;
+            info600: string;
+            info700: string;
+            success100: string;
+            success300: string;
+            success500: string;
+            success600: string;
+            success700: string;
+            background: string;
+            foreground: string;
         };
         space: {
+            0: string;
+            5: string;
+            10: string;
+            15: string;
+            20: string;
+            25: string;
+            30: string;
+            40: string;
+            46: string;
+            50: string;
+            60: string;
+            70: string;
+            80: string;
+            90: string;
+            100: string;
             2: string;
             4: string;
             6: string;
             8: string;
-            10: string;
             12: string;
             16: string;
-            20: string;
             24: string;
             28: string;
-            30: string;
             32: string;
         };
+        radii: {
+            xs: string;
+            sm: string;
+            xm: string;
+            md: string;
+            xl: string;
+            lg: string;
+            primary: string;
+            secondary: string;
+        };
         fontSizes: {
             10: string;
             12: string;
@@ -752,20 +1175,38 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
             16: string;
             18: string;
             20: string;
+            22: string;
             24: string;
+            28: string;
             32: string;
             36: string;
             40: string;
             48: string;
         };
-        fonts: {};
+        fonts: {
+            primary: string;
+            widget: string;
+        };
         fontWeights: {
-            400: string;
-            500: string;
-            600: string;
-            700: string;
+            regular: number;
+            medium: number;
+            semiBold: number;
+            bold: number;
+        };
+        lineHeights: {
+            12: string;
+            16: string;
+            20: string;
+            24: string;
+            26: string;
+            28: string;
+            30: string;
+            36: string;
+            40: string;
+            44: string;
+            52: string;
+            64: string;
         };
-        lineHeights: {};
         letterSpacings: {};
         sizes: {
             4: string;
@@ -773,20 +1214,18 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
             8: string;
             12: string;
             16: string;
+            18: string;
             20: string;
             24: string;
             28: string;
             32: string;
             36: string;
             40: string;
+            45: string;
             48: string;
         };
         borderWidths: {};
         borderStyles: {};
-        radii: {
-            5: string;
-            10: string;
-        };
         shadows: {
             s: string;
         };
@@ -799,17 +1238,17 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
     lg: string;
 }, {
     colors: {
-        primary: string;
-        primary100: string;
-        primary200: string;
-        primary300: string;
-        primary400: string;
         primary500: string;
         primary600: string;
-        primary700: string;
-        primary800: string;
-        primary900: string;
-        surface: string;
+        secondary100: string;
+        secondary200: string;
+        secondary300: string;
+        secondary400: string;
+        secondary500: string;
+        secondary600: string;
+        secondary700: string;
+        secondary800: string;
+        secondary900: string;
         neutral100: string;
         neutral200: string;
         neutral300: string;
@@ -819,39 +1258,65 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         neutral700: string;
         neutral800: string;
         neutral900: string;
-        background: string;
-        foreground: string;
-        success: string;
-        success100: string;
-        success300: string;
-        success500: string;
-        success700: string;
-        warning: string;
-        warning100: string;
-        warning300: string;
-        warning500: string;
-        warning700: string;
-        error: string;
         error100: string;
         error300: string;
         error500: string;
+        error600: string;
         error700: string;
-        white: string;
+        warning100: string;
+        warning300: string;
+        warning500: string;
+        warning600: string;
+        warning700: string;
+        info100: string;
+        info300: string;
+        info500: string;
+        info600: string;
+        info700: string;
+        success100: string;
+        success300: string;
+        success500: string;
+        success600: string;
+        success700: string;
+        background: string;
+        foreground: string;
     };
     space: {
+        0: string;
+        5: string;
+        10: string;
+        15: string;
+        20: string;
+        25: string;
+        30: string;
+        40: string;
+        46: string;
+        50: string;
+        60: string;
+        70: string;
+        80: string;
+        90: string;
+        100: string;
         2: string;
         4: string;
         6: string;
         8: string;
-        10: string;
         12: string;
         16: string;
-        20: string;
         24: string;
         28: string;
-        30: string;
         32: string;
     };
+    radii: {
+        xs: string;
+        sm: string;
+        xm: string;
+        md: string;
+        xl: string;
+        lg: string;
+        primary: string;
+        secondary: string;
+    };
     fontSizes: {
         10: string;
         12: string;
@@ -859,20 +1324,38 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         16: string;
         18: string;
         20: string;
+        22: string;
         24: string;
+        28: string;
         32: string;
         36: string;
         40: string;
         48: string;
     };
-    fonts: {};
+    fonts: {
+        primary: string;
+        widget: string;
+    };
     fontWeights: {
-        400: string;
-        500: string;
-        600: string;
-        700: string;
+        regular: number;
+        medium: number;
+        semiBold: number;
+        bold: number;
+    };
+    lineHeights: {
+        12: string;
+        16: string;
+        20: string;
+        24: string;
+        26: string;
+        28: string;
+        30: string;
+        36: string;
+        40: string;
+        44: string;
+        52: string;
+        64: string;
     };
-    lineHeights: {};
     letterSpacings: {};
     sizes: {
         4: string;
@@ -880,20 +1363,18 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
         8: string;
         12: string;
         16: string;
+        18: string;
         20: string;
         24: string;
         28: string;
         32: string;
         36: string;
         40: string;
+        45: string;
         48: string;
     };
     borderWidths: {};
     borderStyles: {};
-    radii: {
-        5: string;
-        10: string;
-    };
     shadows: {
         s: string;
     };
@@ -908,17 +1389,17 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
     };
     theme: {
         colors: {
-            primary: string;
-            primary100: string;
-            primary200: string;
-            primary300: string;
-            primary400: string;
             primary500: string;
             primary600: string;
-            primary700: string;
-            primary800: string;
-            primary900: string;
-            surface: string;
+            secondary100: string;
+            secondary200: string;
+            secondary300: string;
+            secondary400: string;
+            secondary500: string;
+            secondary600: string;
+            secondary700: string;
+            secondary800: string;
+            secondary900: string;
             neutral100: string;
             neutral200: string;
             neutral300: string;
@@ -928,39 +1409,65 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
             neutral700: string;
             neutral800: string;
             neutral900: string;
-            background: string;
-            foreground: string;
-            success: string;
-            success100: string;
-            success300: string;
-            success500: string;
-            success700: string;
-            warning: string;
-            warning100: string;
-            warning300: string;
-            warning500: string;
-            warning700: string;
-            error: string;
             error100: string;
             error300: string;
             error500: string;
+            error600: string;
             error700: string;
-            white: string;
+            warning100: string;
+            warning300: string;
+            warning500: string;
+            warning600: string;
+            warning700: string;
+            info100: string;
+            info300: string;
+            info500: string;
+            info600: string;
+            info700: string;
+            success100: string;
+            success300: string;
+            success500: string;
+            success600: string;
+            success700: string;
+            background: string;
+            foreground: string;
         };
         space: {
+            0: string;
+            5: string;
+            10: string;
+            15: string;
+            20: string;
+            25: string;
+            30: string;
+            40: string;
+            46: string;
+            50: string;
+            60: string;
+            70: string;
+            80: string;
+            90: string;
+            100: string;
             2: string;
             4: string;
             6: string;
             8: string;
-            10: string;
             12: string;
             16: string;
-            20: string;
             24: string;
             28: string;
-            30: string;
             32: string;
         };
+        radii: {
+            xs: string;
+            sm: string;
+            xm: string;
+            md: string;
+            xl: string;
+            lg: string;
+            primary: string;
+            secondary: string;
+        };
         fontSizes: {
             10: string;
             12: string;
@@ -968,20 +1475,38 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
             16: string;
             18: string;
             20: string;
+            22: string;
             24: string;
+            28: string;
             32: string;
             36: string;
             40: string;
             48: string;
         };
-        fonts: {};
+        fonts: {
+            primary: string;
+            widget: string;
+        };
         fontWeights: {
-            400: string;
-            500: string;
-            600: string;
-            700: string;
+            regular: number;
+            medium: number;
+            semiBold: number;
+            bold: number;
+        };
+        lineHeights: {
+            12: string;
+            16: string;
+            20: string;
+            24: string;
+            26: string;
+            28: string;
+            30: string;
+            36: string;
+            40: string;
+            44: string;
+            52: string;
+            64: string;
         };
-        lineHeights: {};
         letterSpacings: {};
         sizes: {
             4: string;
@@ -989,20 +1514,18 @@ export declare const styled: <Type extends import("react").ComponentType<any> |
             8: string;
             12: string;
             16: string;
+            18: string;
             20: string;
             24: string;
             28: string;
             32: string;
             36: string;
             40: string;
+            45: string;
             48: string;
         };
         borderWidths: {};
         borderStyles: {};
-        radii: {
-            5: string;
-            10: string;
-        };
         shadows: {
             s: string;
         };
@@ -1021,7 +1544,9 @@ export declare const darkTheme: string & {
     selector: string;
 } & import("@stitches/react/types/stitches").ThemeTokens<{
     colors: {
-        surface: string;
+        secondary400: string;
+        secondary500: string;
+        secondary600: string;
         neutral900: string;
         neutral800: string;
         neutral700: string;
@@ -1031,8 +1556,10 @@ export declare const darkTheme: string & {
         neutral300: string;
         neutral200: string;
         neutral100: string;
-        foreground: string;
+        error500: string;
+        warning500: string;
         background: string;
+        foreground: string;
     };
     shadows: {
         s: string;