react-magma-dom 7.0.0-next.0 → 7.0.0

package/dist/theme/GlobalStyles/index.d.ts

@@ -1,2 +1,4 @@
 import * as React from 'react';
+import { ThemeInterface } from '../magma';
+export declare function getGlobalLinkColor(theme: ThemeInterface, isInverse: boolean, state: 'default' | 'hover' | 'focus'): string;
 export declare const GlobalStyles: React.FunctionComponent;

package/dist/theme/ThemeContext.d.ts

@@ -1,675 +1,3 @@
 import * as React from 'react';
-export declare const ThemeContext: React.Context<{
-    bodyFont: string;
-    bodyExpressiveFont: string;
-    bodyNarrativeFont: string;
-    borderRadius: string;
-    borderRadiusSmall: string;
-    colors: {
-        focus: string;
-        focusInverse: string;
-        border: string;
-        borderInverse: string;
-        aiColors: {
-            variantA: {
-                right: string;
-                left: string;
-                hover: string;
-                pressed: string;
-            };
-            variantB: {
-                right: string;
-                left: string;
-                hover: string;
-                pressed: string;
-            };
-        };
-        dataVizBlue200: string;
-        dataVizBlue400: string;
-        dataVizBlue500: string;
-        dataVizBlue700: string;
-        dataVizPink200: string;
-        dataVizPink400: string;
-        dataVizPink500: string;
-        dataVizPink700: string;
-        dataVizGreen200: string;
-        dataVizGreen400: string;
-        dataVizGreen500: string;
-        dataVizGreen700: string;
-        dataVizOrange200: string;
-        dataVizOrange400: string;
-        dataVizOrange500: string;
-        dataVizOrange700: string;
-        dataVizPurple200: string;
-        dataVizPurple400: string;
-        dataVizPurple500: string;
-        dataVizPurple700: string;
-        dataVizTeal200: string;
-        dataVizTeal400: string;
-        dataVizTeal500: string;
-        dataVizTeal700: string;
-        success100: string;
-        success200: string;
-        success300: string;
-        success400: string;
-        success500: string;
-        success600: string;
-        success700: string;
-        warning100: string;
-        warning200: string;
-        warning300: string;
-        warning400: string;
-        warning500: string;
-        warning600: string;
-        warning700: string;
-        danger100: string;
-        danger200: string;
-        danger300: string;
-        danger400: string;
-        danger500: string;
-        danger600: string;
-        danger700: string;
-        info100: string;
-        info200: string;
-        info300: string;
-        info400: string;
-        info500: string;
-        info600: string;
-        info700: string;
-        neutral100: string;
-        neutral200: string;
-        neutral300: string;
-        neutral400: string;
-        neutral500: string;
-        neutral600: string;
-        neutral700: string;
-        neutral800: string;
-        neutral900: string;
-        tertiary500: string;
-        tertiary600: string;
-        tertiary700: string;
-        secondary500: string;
-        secondary600: string;
-        secondary700: string;
-        primary100: string;
-        primary200: string;
-        primary300: string;
-        primary400: string;
-        primary500: string;
-        primary600: string;
-        primary700: string;
-        primary: string;
-        secondary: string;
-        tertiary: string;
-        neutral: string;
-        info: string;
-        danger: string;
-        warning: string;
-        success: string;
-    };
-    headingFont: string;
-    headingExpressiveFont: string;
-    headingNarrativeFont: string;
-    direction: string;
-    spacingMultiplier: number;
-    transitions: import("./components/transition").ThemeTransitions;
-    breakpoints: {
-        xs: number;
-        small: number;
-        medium: number;
-        large: number;
-        xl: number;
-    };
-    spaceScale: {
-        spacing01: string;
-        spacing02: string;
-        spacing03: string;
-        spacing04: string;
-        spacing05: string;
-        spacing06: string;
-        spacing07: string;
-        spacing08: string;
-        spacing09: string;
-        spacing10: string;
-        spacing11: string;
-        spacing12: string;
-        spacing13: string;
-        spacing14: string;
-    };
-    iconSizes: {
-        xSmall: number;
-        small: number;
-        medium: number;
-        large: number;
-        xLarge: number;
-    };
-    typeScale: {
-        size01: {
-            fontSize: string;
-            letterSpacing: string;
-            lineHeight: string;
-        };
-        size02: {
-            fontSize: string;
-            letterSpacing: string;
-            lineHeight: string;
-        };
-        size03: {
-            fontSize: string;
-            letterSpacing: string;
-            lineHeight: string;
-        };
-        size04: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size05: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size06: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size07: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size08: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size09: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size10: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size11: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size12: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size13: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size14: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size15: {
-            fontSize: string;
-            lineHeight: string;
-        };
-        size16: {
-            fontSize: string;
-            lineHeight: string;
-        };
-    };
-    typographyVisualStyles: {
-        headingXLarge: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingLarge: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingMedium: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingSmall: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingXSmall: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        heading2XSmall: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        bodyLarge: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-        };
-        bodyMedium: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-        };
-        bodySmall: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-        };
-        bodyXSmall: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-        };
-    };
-    typographyExpressiveVisualStyles: {
-        heading2XLarge: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingXLarge: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingLarge: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingMedium: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingSmall: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingXSmall: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        heading2XSmall: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        bodyLarge: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-        };
-        bodyMedium: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-        };
-        bodySmall: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-        };
-        bodyXSmall: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-        };
-    };
-    typographyNarrativeVisualStyles: {
-        headingXLarge: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingLarge: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingMedium: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingSmall: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        headingXSmall: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        heading2XSmall: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            fontWeight: number;
-        };
-        bodyLarge: {
-            mobile: {
-                fontSize: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                lineHeight: string;
-            };
-        };
-        bodyMedium: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-        };
-        bodySmall: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-        };
-        bodyXSmall: {
-            mobile: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-            desktop: {
-                fontSize: string;
-                letterSpacing: string;
-                lineHeight: string;
-            };
-        };
-    };
-    appBar: {
-        backgroundColor: string;
-        height: string;
-        padding: string;
-        textColor: string;
-        compact: {
-            height: string;
-            padding: string;
-        };
-        inverse: {
-            backgroundColor: string;
-            textColor: string;
-        };
-    };
-    combobox: {
-        menu: {
-            maxHeight: string;
-        };
-    };
-    modal: {
-        width: {
-            small: string;
-            medium: string;
-            large: string;
-        };
-    };
-    drawer: {
-        default: {
-            maxWidth: string;
-            minHeight: string;
-            margin: string;
-            borderRadius: string;
-            top: string;
-            right: string;
-            bottom: string;
-            left: string;
-            position: string;
-        };
-        right: {
-            left: string;
-            height: string;
-            width: string;
-            position: string;
-        };
-        left: {
-            right: string;
-            height: string;
-            width: string;
-        };
-        top: {
-            bottom: string;
-            height: string;
-        };
-        bottom: {
-            top: string;
-            height: string;
-            position: string;
-        };
-    };
-    dropdown: {
-        content: {
-            maxHeight: string;
-        };
-    };
-    iterableColors: string[];
-    chartColors: string[];
-    chartColorsInverse: string[];
-    tabs: {
-        approxTabSize: {
-            horizontal: number;
-            vertical: number;
-        };
-    };
-    select: {
-        menu: {
-            maxHeight: string;
-        };
-    };
-    tag: {
-        border: string;
-        display: string;
-        alignItems: string;
-        justifyContent: string;
-    };
-    tooltip: {
-        arrowSize: string;
-        arrowSizeDoubled: string;
-        backgroundColor: string;
-        fontWeight: number;
-        maxWidth: string;
-        textColor: string;
-        typeScale: {
-            fontSize: string;
-            letterSpacing: string;
-            lineHeight: string;
-        };
-        zIndex: number;
-        inverse: {
-            backgroundColor: string;
-            textColor: string;
-        };
-    };
-}>;
+import { ThemeInterface } from './magma';
+export declare const ThemeContext: React.Context<ThemeInterface>;