@sendoutcards/quantum-design-ui 1.8.39-alpha.5 → 2.0.0-alpha.0

package/dist/src/theme/ThemeContext.d.ts

@@ -0,0 +1,1513 @@
+declare const ThemeContext: import("react").Context<{
+    mediaQueries: {
+        queries: {
+            xSmall: string;
+            small: string;
+            medium: string;
+            large: string;
+            xLarge: string;
+        };
+        rawValues: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+    };
+    hocs: {
+        colors: {
+            swatches: {
+                primaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                secondaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                success: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                danger: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                warning: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                accent: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                grayScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
+                blueScale: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                purpleScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
+            };
+            background: string;
+            foreground: string;
+        };
+        textColors: {
+            primaryBrand: string;
+            secondaryBrand: string;
+            primaryHeading: string | undefined;
+            primaryBody: string;
+            inverseHeading: string;
+            inverseBody: string;
+            accent: string;
+            success: string;
+            warning: string;
+            danger: string;
+            anchorBlue: string;
+        };
+        spacing: {
+            x0: string;
+            x_25: string;
+            x_5: string;
+            x_75: string;
+            x1: string;
+            x1_5: string;
+            x2: string;
+            x2_5: string;
+            x3: string;
+            x4: string;
+            x5: string;
+            x6: string;
+            x7: string;
+            x8: string;
+            x9: string;
+        };
+        borderRadius: {
+            none: string;
+            small: string;
+            medium: string;
+            default: string;
+            large: string;
+            circle: string;
+        };
+        shadows: {
+            light: string;
+            mediumLight: string;
+            mediumDark: string;
+            dark: string;
+            generate: (shadow: ("dark" | "mediumDark" | "mediumLight" | "light" | "xLight") | number[], color?: string, reverseOffset?: boolean) => string;
+        };
+        borders: {
+            thin: string;
+            default: string;
+            bold: string;
+        };
+    };
+    text: {
+        imports: {
+            body: string;
+            heading: string;
+        };
+        families: {
+            body: string;
+            heading: string;
+        };
+        types: {
+            heroTitle: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            title: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            subtitle: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            largeBody: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            body: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            caption: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            footnote: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+        };
+        colors: {
+            primaryBrand: string;
+            secondaryBrand: string;
+            primaryHeading: string | undefined;
+            primaryBody: string;
+            inverseHeading: string;
+            inverseBody: string;
+            accent: string;
+            success: string;
+            warning: string;
+            danger: string;
+            anchorBlue: string;
+        };
+        weights: {
+            thin: number;
+            regular: number;
+            semiBold: number;
+            bold: number;
+            extraBold: number;
+        };
+    };
+    spacing: {
+        x0: string;
+        x_25: string;
+        x_5: string;
+        x_75: string;
+        x1: string;
+        x1_5: string;
+        x2: string;
+        x2_5: string;
+        x3: string;
+        x4: string;
+        x5: string;
+        x6: string;
+        x7: string;
+        x8: string;
+        x9: string;
+    };
+    buttons: {
+        primary: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        secondary: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        warning: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        success: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        danger: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        shadow: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        accent: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        smoke: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        boxShadow: (shadow: ("dark" | "mediumDark" | "mediumLight" | "light" | "xLight") | number[], color?: string, reverseOffset?: boolean) => string;
+        borderSize: string;
+        outlinedBackgroundColor: string;
+        fontWeight: number;
+        sizes: {
+            xSmall: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            small: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            medium: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            large: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            xLarge: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+        };
+    };
+    inputs: {
+        checkbox: {
+            border: string;
+            borderRadius: string;
+            unCheckedBackgroundColor: string | undefined;
+            checkmarkColor: string;
+            labelColor: string;
+        };
+        text: {
+            borderRadius: string;
+            labelColor: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+            placeholderColor: string;
+            labelFontSize: string;
+            textFontSize: string;
+            borderWidth: string;
+            defaultFocusColor: string;
+        };
+        select: {
+            dropDownShadow: string;
+            dropDownBackgroundColor: string;
+            boxShadow: string;
+            borderRadius: string;
+        };
+        number: {
+            backgroundColor: string | undefined;
+            fontColor: string;
+            fontSize: string;
+            borderRadius: string;
+        };
+        backgroundColor: string;
+        fontSize: string;
+        fontColor: string;
+        fontFamily: string;
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            warning: string;
+            danger: string;
+            accent: string;
+            dark: string;
+            blue: string;
+        };
+    };
+    icons: {
+        sizes: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            default: string | undefined;
+            primaryBodyText: string;
+            primaryHeadingText: string | undefined;
+            inverseBodyText: string;
+            inverseHeadingText: string;
+            primaryBrand: string;
+            secondaryBrand: string;
+            warning: string;
+            danger: string;
+            success: string;
+            background: string;
+            accent: string;
+        };
+    };
+    card: {
+        backgroundColor: string;
+        borderRadius: string;
+        boxShadow: string;
+        defaultInset: string;
+    };
+    separator: {
+        border: string;
+        color: string | undefined;
+    };
+    loadingSpinner: {
+        size: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            warning: string;
+            danger: string;
+        };
+    };
+    animatedCheckmark: {
+        sizeMap: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            accent: string;
+        };
+        strokeWidth: {
+            small: number;
+            default: number;
+            large: number;
+        };
+        borderRadius: string;
+        checkmarkFilledColor: string;
+    };
+    avatar: {
+        borderWidth: string;
+        borderColor: string | undefined;
+        borderRadius: string;
+        boxShadow: string;
+        backgroundColor: string;
+        bubbleBackgroundColors: {
+            isActive: string;
+            default: string | undefined;
+        };
+        defaultBackgroundColors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            accent: string;
+            warning: string;
+            danger: string;
+        };
+        sizes: {
+            xSmall: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            small: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            medium: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            large: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            xLarge: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+        };
+    };
+    dialog: {
+        backgroundColor: string;
+        boxShadow: string;
+        defaultInset: string;
+    };
+    drawer: {
+        backgroundColor: string;
+        borderRadius: string;
+        boxShadow: string;
+        bottomDirectionShadow: string;
+        hoverBoxShadow: string;
+        hoverBottomDirectionShadow: string;
+        defaultInset: string;
+        tab: {
+            dark: {
+                backgroundColor: string | undefined;
+                arrowColor: string;
+            };
+            light: {
+                backgroundColor: string;
+                arrowColor: string | undefined;
+            };
+        };
+    };
+    sheet: {
+        mobileBorderRadius: string;
+        desktopBorderRadius: string;
+        backgroundColor: string;
+        boxShadow: string;
+    };
+    slider: {
+        backgroundColor: string;
+        borderRadius: string;
+        handleRadius: string;
+        handleColor: string;
+        handleShadow: string;
+    };
+    navigation: {
+        backgroundColor: string;
+        border: string;
+        borderColor: string | undefined;
+    };
+    toggle: {
+        isActiveColor: string;
+        isNotActiveColor: string | undefined;
+    };
+    tooltip: {
+        lightBackgroundColor: string;
+        darkBackgroundColor: string | undefined;
+        boxShadow: string;
+        borderColor: string;
+    };
+    colorPicker: {
+        backgroundColor: string;
+        borderColor: string;
+        boxShadow: string;
+        borderRadius: string;
+    };
+    sphere: import("./types").Sphere;
+    widget: import("./types").Widget;
+    colorOption: {
+        defaults: {
+            circleFill: string;
+            innerRing: string;
+            outerRing: string;
+        };
+    };
+}>;
+export declare const useTheme: () => {
+    mediaQueries: {
+        queries: {
+            xSmall: string;
+            small: string;
+            medium: string;
+            large: string;
+            xLarge: string;
+        };
+        rawValues: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+    };
+    hocs: {
+        colors: {
+            swatches: {
+                primaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                secondaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                success: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                danger: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                warning: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                accent: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                grayScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
+                blueScale: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                purpleScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
+            };
+            background: string;
+            foreground: string;
+        };
+        textColors: {
+            primaryBrand: string;
+            secondaryBrand: string;
+            primaryHeading: string | undefined;
+            primaryBody: string;
+            inverseHeading: string;
+            inverseBody: string;
+            accent: string;
+            success: string;
+            warning: string;
+            danger: string;
+            anchorBlue: string;
+        };
+        spacing: {
+            x0: string;
+            x_25: string;
+            x_5: string;
+            x_75: string;
+            x1: string;
+            x1_5: string;
+            x2: string;
+            x2_5: string;
+            x3: string;
+            x4: string;
+            x5: string;
+            x6: string;
+            x7: string;
+            x8: string;
+            x9: string;
+        };
+        borderRadius: {
+            none: string;
+            small: string;
+            medium: string;
+            default: string;
+            large: string;
+            circle: string;
+        };
+        shadows: {
+            light: string;
+            mediumLight: string;
+            mediumDark: string;
+            dark: string;
+            generate: (shadow: ("dark" | "mediumDark" | "mediumLight" | "light" | "xLight") | number[], color?: string, reverseOffset?: boolean) => string;
+        };
+        borders: {
+            thin: string;
+            default: string;
+            bold: string;
+        };
+    };
+    text: {
+        imports: {
+            body: string;
+            heading: string;
+        };
+        families: {
+            body: string;
+            heading: string;
+        };
+        types: {
+            heroTitle: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            title: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            subtitle: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            largeBody: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            body: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            caption: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            footnote: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+        };
+        colors: {
+            primaryBrand: string;
+            secondaryBrand: string;
+            primaryHeading: string | undefined;
+            primaryBody: string;
+            inverseHeading: string;
+            inverseBody: string;
+            accent: string;
+            success: string;
+            warning: string;
+            danger: string;
+            anchorBlue: string;
+        };
+        weights: {
+            thin: number;
+            regular: number;
+            semiBold: number;
+            bold: number;
+            extraBold: number;
+        };
+    };
+    spacing: {
+        x0: string;
+        x_25: string;
+        x_5: string;
+        x_75: string;
+        x1: string;
+        x1_5: string;
+        x2: string;
+        x2_5: string;
+        x3: string;
+        x4: string;
+        x5: string;
+        x6: string;
+        x7: string;
+        x8: string;
+        x9: string;
+    };
+    buttons: {
+        primary: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        secondary: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        warning: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        success: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        danger: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        shadow: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        accent: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        smoke: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        boxShadow: (shadow: ("dark" | "mediumDark" | "mediumLight" | "light" | "xLight") | number[], color?: string, reverseOffset?: boolean) => string;
+        borderSize: string;
+        outlinedBackgroundColor: string;
+        fontWeight: number;
+        sizes: {
+            xSmall: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            small: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            medium: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            large: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            xLarge: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+        };
+    };
+    inputs: {
+        checkbox: {
+            border: string;
+            borderRadius: string;
+            unCheckedBackgroundColor: string | undefined;
+            checkmarkColor: string;
+            labelColor: string;
+        };
+        text: {
+            borderRadius: string;
+            labelColor: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+            placeholderColor: string;
+            labelFontSize: string;
+            textFontSize: string;
+            borderWidth: string;
+            defaultFocusColor: string;
+        };
+        select: {
+            dropDownShadow: string;
+            dropDownBackgroundColor: string;
+            boxShadow: string;
+            borderRadius: string;
+        };
+        number: {
+            backgroundColor: string | undefined;
+            fontColor: string;
+            fontSize: string;
+            borderRadius: string;
+        };
+        backgroundColor: string;
+        fontSize: string;
+        fontColor: string;
+        fontFamily: string;
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            warning: string;
+            danger: string;
+            accent: string;
+            dark: string;
+            blue: string;
+        };
+    };
+    icons: {
+        sizes: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            default: string | undefined;
+            primaryBodyText: string;
+            primaryHeadingText: string | undefined;
+            inverseBodyText: string;
+            inverseHeadingText: string;
+            primaryBrand: string;
+            secondaryBrand: string;
+            warning: string;
+            danger: string;
+            success: string;
+            background: string;
+            accent: string;
+        };
+    };
+    card: {
+        backgroundColor: string;
+        borderRadius: string;
+        boxShadow: string;
+        defaultInset: string;
+    };
+    separator: {
+        border: string;
+        color: string | undefined;
+    };
+    loadingSpinner: {
+        size: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            warning: string;
+            danger: string;
+        };
+    };
+    animatedCheckmark: {
+        sizeMap: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            accent: string;
+        };
+        strokeWidth: {
+            small: number;
+            default: number;
+            large: number;
+        };
+        borderRadius: string;
+        checkmarkFilledColor: string;
+    };
+    avatar: {
+        borderWidth: string;
+        borderColor: string | undefined;
+        borderRadius: string;
+        boxShadow: string;
+        backgroundColor: string;
+        bubbleBackgroundColors: {
+            isActive: string;
+            default: string | undefined;
+        };
+        defaultBackgroundColors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            accent: string;
+            warning: string;
+            danger: string;
+        };
+        sizes: {
+            xSmall: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            small: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            medium: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            large: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            xLarge: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+        };
+    };
+    dialog: {
+        backgroundColor: string;
+        boxShadow: string;
+        defaultInset: string;
+    };
+    drawer: {
+        backgroundColor: string;
+        borderRadius: string;
+        boxShadow: string;
+        bottomDirectionShadow: string;
+        hoverBoxShadow: string;
+        hoverBottomDirectionShadow: string;
+        defaultInset: string;
+        tab: {
+            dark: {
+                backgroundColor: string | undefined;
+                arrowColor: string;
+            };
+            light: {
+                backgroundColor: string;
+                arrowColor: string | undefined;
+            };
+        };
+    };
+    sheet: {
+        mobileBorderRadius: string;
+        desktopBorderRadius: string;
+        backgroundColor: string;
+        boxShadow: string;
+    };
+    slider: {
+        backgroundColor: string;
+        borderRadius: string;
+        handleRadius: string;
+        handleColor: string;
+        handleShadow: string;
+    };
+    navigation: {
+        backgroundColor: string;
+        border: string;
+        borderColor: string | undefined;
+    };
+    toggle: {
+        isActiveColor: string;
+        isNotActiveColor: string | undefined;
+    };
+    tooltip: {
+        lightBackgroundColor: string;
+        darkBackgroundColor: string | undefined;
+        boxShadow: string;
+        borderColor: string;
+    };
+    colorPicker: {
+        backgroundColor: string;
+        borderColor: string;
+        boxShadow: string;
+        borderRadius: string;
+    };
+    sphere: import("./types").Sphere;
+    widget: import("./types").Widget;
+    colorOption: {
+        defaults: {
+            circleFill: string;
+            innerRing: string;
+            outerRing: string;
+        };
+    };
+};
+export { ThemeContext };
+export declare const ThemeProvider: import("react").Provider<{
+    mediaQueries: {
+        queries: {
+            xSmall: string;
+            small: string;
+            medium: string;
+            large: string;
+            xLarge: string;
+        };
+        rawValues: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+    };
+    hocs: {
+        colors: {
+            swatches: {
+                primaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                secondaryBrand: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                success: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                danger: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                warning: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                accent: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                grayScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
+                blueScale: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+                purpleScale: import("../helpers/theme-functions/computeColorSwatch").ColorSwatch;
+            };
+            background: string;
+            foreground: string;
+        };
+        textColors: {
+            primaryBrand: string;
+            secondaryBrand: string;
+            primaryHeading: string | undefined;
+            primaryBody: string;
+            inverseHeading: string;
+            inverseBody: string;
+            accent: string;
+            success: string;
+            warning: string;
+            danger: string;
+            anchorBlue: string;
+        };
+        spacing: {
+            x0: string;
+            x_25: string;
+            x_5: string;
+            x_75: string;
+            x1: string;
+            x1_5: string;
+            x2: string;
+            x2_5: string;
+            x3: string;
+            x4: string;
+            x5: string;
+            x6: string;
+            x7: string;
+            x8: string;
+            x9: string;
+        };
+        borderRadius: {
+            none: string;
+            small: string;
+            medium: string;
+            default: string;
+            large: string;
+            circle: string;
+        };
+        shadows: {
+            light: string;
+            mediumLight: string;
+            mediumDark: string;
+            dark: string;
+            generate: (shadow: ("dark" | "mediumDark" | "mediumLight" | "light" | "xLight") | number[], color?: string, reverseOffset?: boolean) => string;
+        };
+        borders: {
+            thin: string;
+            default: string;
+            bold: string;
+        };
+    };
+    text: {
+        imports: {
+            body: string;
+            heading: string;
+        };
+        families: {
+            body: string;
+            heading: string;
+        };
+        types: {
+            heroTitle: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            title: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            subtitle: {
+                color: string | undefined;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            largeBody: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            body: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            caption: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+            footnote: {
+                color: string;
+                size: string;
+                fontWeight: number;
+                lineHeight: string;
+                fontFamily: string;
+            };
+        };
+        colors: {
+            primaryBrand: string;
+            secondaryBrand: string;
+            primaryHeading: string | undefined;
+            primaryBody: string;
+            inverseHeading: string;
+            inverseBody: string;
+            accent: string;
+            success: string;
+            warning: string;
+            danger: string;
+            anchorBlue: string;
+        };
+        weights: {
+            thin: number;
+            regular: number;
+            semiBold: number;
+            bold: number;
+            extraBold: number;
+        };
+    };
+    spacing: {
+        x0: string;
+        x_25: string;
+        x_5: string;
+        x_75: string;
+        x1: string;
+        x1_5: string;
+        x2: string;
+        x2_5: string;
+        x3: string;
+        x4: string;
+        x5: string;
+        x6: string;
+        x7: string;
+        x8: string;
+        x9: string;
+    };
+    buttons: {
+        primary: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        secondary: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        warning: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        success: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        danger: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        shadow: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        accent: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        smoke: {
+            backgroundColor: string;
+            fontColor: string;
+            fontFamily: string;
+        };
+        boxShadow: (shadow: ("dark" | "mediumDark" | "mediumLight" | "light" | "xLight") | number[], color?: string, reverseOffset?: boolean) => string;
+        borderSize: string;
+        outlinedBackgroundColor: string;
+        fontWeight: number;
+        sizes: {
+            xSmall: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            small: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            medium: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            large: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+            xLarge: {
+                inset: string;
+                outlinedInset: {
+                    vertical: string;
+                    horizontal: string;
+                };
+                fontSize: string;
+                borderRadius: string;
+            };
+        };
+    };
+    inputs: {
+        checkbox: {
+            border: string;
+            borderRadius: string;
+            unCheckedBackgroundColor: string | undefined;
+            checkmarkColor: string;
+            labelColor: string;
+        };
+        text: {
+            borderRadius: string;
+            labelColor: Required<import("../helpers/theme-functions/computeColorSwatch").ColorSwatch>;
+            placeholderColor: string;
+            labelFontSize: string;
+            textFontSize: string;
+            borderWidth: string;
+            defaultFocusColor: string;
+        };
+        select: {
+            dropDownShadow: string;
+            dropDownBackgroundColor: string;
+            boxShadow: string;
+            borderRadius: string;
+        };
+        number: {
+            backgroundColor: string | undefined;
+            fontColor: string;
+            fontSize: string;
+            borderRadius: string;
+        };
+        backgroundColor: string;
+        fontSize: string;
+        fontColor: string;
+        fontFamily: string;
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            warning: string;
+            danger: string;
+            accent: string;
+            dark: string;
+            blue: string;
+        };
+    };
+    icons: {
+        sizes: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            default: string | undefined;
+            primaryBodyText: string;
+            primaryHeadingText: string | undefined;
+            inverseBodyText: string;
+            inverseHeadingText: string;
+            primaryBrand: string;
+            secondaryBrand: string;
+            warning: string;
+            danger: string;
+            success: string;
+            background: string;
+            accent: string;
+        };
+    };
+    card: {
+        backgroundColor: string;
+        borderRadius: string;
+        boxShadow: string;
+        defaultInset: string;
+    };
+    separator: {
+        border: string;
+        color: string | undefined;
+    };
+    loadingSpinner: {
+        size: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            warning: string;
+            danger: string;
+        };
+    };
+    animatedCheckmark: {
+        sizeMap: {
+            xSmall: number;
+            small: number;
+            medium: number;
+            large: number;
+            xLarge: number;
+        };
+        colors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            accent: string;
+        };
+        strokeWidth: {
+            small: number;
+            default: number;
+            large: number;
+        };
+        borderRadius: string;
+        checkmarkFilledColor: string;
+    };
+    avatar: {
+        borderWidth: string;
+        borderColor: string | undefined;
+        borderRadius: string;
+        boxShadow: string;
+        backgroundColor: string;
+        bubbleBackgroundColors: {
+            isActive: string;
+            default: string | undefined;
+        };
+        defaultBackgroundColors: {
+            primary: string;
+            secondary: string;
+            success: string;
+            accent: string;
+            warning: string;
+            danger: string;
+        };
+        sizes: {
+            xSmall: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            small: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            medium: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            large: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+            xLarge: {
+                avatarSize: number;
+                bubbleLeftPosition: number;
+                bubbleSize: number;
+            };
+        };
+    };
+    dialog: {
+        backgroundColor: string;
+        boxShadow: string;
+        defaultInset: string;
+    };
+    drawer: {
+        backgroundColor: string;
+        borderRadius: string;
+        boxShadow: string;
+        bottomDirectionShadow: string;
+        hoverBoxShadow: string;
+        hoverBottomDirectionShadow: string;
+        defaultInset: string;
+        tab: {
+            dark: {
+                backgroundColor: string | undefined;
+                arrowColor: string;
+            };
+            light: {
+                backgroundColor: string;
+                arrowColor: string | undefined;
+            };
+        };
+    };
+    sheet: {
+        mobileBorderRadius: string;
+        desktopBorderRadius: string;
+        backgroundColor: string;
+        boxShadow: string;
+    };
+    slider: {
+        backgroundColor: string;
+        borderRadius: string;
+        handleRadius: string;
+        handleColor: string;
+        handleShadow: string;
+    };
+    navigation: {
+        backgroundColor: string;
+        border: string;
+        borderColor: string | undefined;
+    };
+    toggle: {
+        isActiveColor: string;
+        isNotActiveColor: string | undefined;
+    };
+    tooltip: {
+        lightBackgroundColor: string;
+        darkBackgroundColor: string | undefined;
+        boxShadow: string;
+        borderColor: string;
+    };
+    colorPicker: {
+        backgroundColor: string;
+        borderColor: string;
+        boxShadow: string;
+        borderRadius: string;
+    };
+    sphere: import("./types").Sphere;
+    widget: import("./types").Widget;
+    colorOption: {
+        defaults: {
+            circleFill: string;
+            innerRing: string;
+            outerRing: string;
+        };
+    };
+}>;