@ovotech/element-native 4.4.9 → 5.0.0-canary-bcb1788-338

package/dist/components/Grid/Col.d.ts

@@ -5,569 +5,567 @@ declare const Col: import("react").ForwardRefExoticComponent<Omit<Omit<{
     [x: symbol]: any;
 } & {
     theme?: {
-        core: {
-            color: {
-                brand: {
-                    midnight: string;
-                    midnightTint: string;
-                    forest: string;
-                    forestTint: string;
-                    ovo: string;
-                    ovoTint: string;
-                    leaf: string;
-                    leafTint: string;
-                    energised: string;
-                    energisedTint: string;
-                    offwhite: string;
-                    white: string;
-                    black: string;
-                };
-                neutral: {
-                    darkest: string;
-                    darker: string;
-                    dark: string;
-                    base: string;
-                    light: string;
-                    lighter: string;
-                    lightest: string;
-                };
-                red: {
-                    darkest: string;
-                    darker: string;
-                    dark: string;
-                    base: string;
-                    light: string;
-                    lighter: string;
-                    lightest: string;
-                };
-                orange: {
-                    darkest: string;
-                    darker: string;
-                    dark: string;
-                    base: string;
-                    light: string;
-                    lighter: string;
-                    lightest: string;
-                };
-                yellow: {
-                    darkest: string;
-                    darker: string;
-                    dark: string;
-                    base: string;
-                    light: string;
-                    lighter: string;
-                    lightest: string;
-                };
-                green: {
-                    darkest: string;
-                    darker: string;
-                    dark: string;
-                    base: string;
-                    light: string;
-                    lighter: string;
-                    lightest: string;
-                };
-                blue: {
-                    darkest: string;
-                    darker: string;
+        color: {
+            neutral: {
+                "20": string;
+                "30": string;
+                "40": string;
+                "50": string;
+                "60": string;
+                "70": string;
+                "80": string;
+                white: string;
+                black: string;
+            };
+            red: {
+                "20": string;
+                "30": string;
+                "40": string;
+                "50": string;
+                "60": string;
+                "70": string;
+                "80": string;
+            };
+            orange: {
+                "20": string;
+                "30": string;
+                "40": string;
+                "50": string;
+                "60": string;
+                "70": string;
+            };
+            yellow: {
+                "70": string;
+                "80": string;
+            };
+            green: {
+                "20": string;
+                "30": string;
+                "40": string;
+                "50": string;
+                "60": string;
+                "70": string;
+                "80": string;
+                "90": string;
+            };
+            blue: {
+                "20": string;
+                "30": string;
+                "40": string;
+                "50": string;
+                "60": string;
+                "70": string;
+            };
+            outline: {
+                outer: string;
+                inner: string;
+            };
+            alert: {
+                success: string;
+                successTint: string;
+                warning: string;
+                warningTint: string;
+                error: string;
+                errorTint: string;
+                info: string;
+                infoTint: string;
+                neutral: string;
+                neutralTint: string;
+                border: string;
+            };
+            input: {
+                borderDim: string;
+            };
+            brand: {
+                brand: string;
+                dark: string;
+                dim: string;
+                bold: string;
+                bright: string;
+                gradientFrom: string;
+                gradientTo: string;
+                onBrand: string;
+                onBrandVariant: string;
+                fixed: {
+                    brand: string;
                     dark: string;
-                    base: string;
-                    light: string;
-                    lighter: string;
-                    lightest: string;
+                    dim: string;
+                    bold: string;
+                    bright: string;
+                    onBrand: string;
+                    onBrandVariant: string;
                 };
             };
-            fontFamily: {
-                mono: {
-                    native: string;
-                    web: string;
-                };
-                heading: {
-                    native: string;
-                    web: string;
-                };
-                body: {
-                    native: string;
-                    web: string;
-                };
-                bodyBold: {
-                    native: string;
-                    web: string;
+            surface: {
+                surface: string;
+                bright: string;
+                dim: string;
+                onSurface: string;
+                onSurfaceVariant: string;
+                border: string;
+                borderDim: string;
+                link: string;
+                electricity: string;
+                gas: string;
+                fadeFrom: string;
+                fadeTo: string;
+            };
+        };
+        transition: {
+            duration: {
+                fast: number;
+                medium: number;
+                slow: number;
+            };
+        };
+        unit: {
+            "0": number;
+            "25": number;
+            "50": number;
+            "100": number;
+            "200": number;
+            "300": number;
+            "350": number;
+            "400": number;
+            "450": number;
+            "500": number;
+            "550": number;
+            "600": number;
+            "700": number;
+            "800": number;
+            "900": number;
+            "1000": number;
+            "1100": number;
+            "1200": number;
+            "1300": number;
+            "1400": number;
+            "1500": number;
+            "1600": number;
+            "1800": number;
+            "2000": number;
+            "2400": number;
+            "3000": number;
+            "3500": number;
+        };
+        border: {
+            radius: {
+                xs: number;
+                sm: number;
+                md: number;
+                lg: number;
+                xl: number;
+                "2xl": number;
+                "3xl": number;
+            };
+            width: {
+                sm: number;
+                md: number;
+                lg: number;
+            };
+        };
+        breakpoint: {
+            small: number;
+            medium: number;
+            large: number;
+        };
+        native: {
+            font: {
+                family: {
+                    black: string;
+                    book: string;
+                    bold: string;
                 };
             };
-            fontWeight: {
-                book: number;
-                bold: number;
-                black: number;
+        };
+        web: {
+            font: {
+                family: string;
             };
-            fontSize: {
-                display0: {
-                    small: number;
-                    large: number;
+        };
+        font: {
+            letterSpacing: {
+                d1: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                display1: {
-                    small: number;
-                    large: number;
+                d2: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                display2: {
-                    small: number;
-                    large: number;
+                d3: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                display3: {
-                    small: number;
-                    large: number;
+                d4: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                heading1: {
-                    small: number;
-                    large: number;
+                "4xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                heading2: {
-                    small: number;
-                    large: number;
+                "3xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                heading3: {
-                    small: number;
-                    large: number;
+                "2xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                heading4: {
-                    small: number;
-                    large: number;
+                xl: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                lead: {
-                    small: number;
-                    large: number;
+                lg: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                body: {
-                    small: number;
-                    large: number;
+                md: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                small: {
-                    small: number;
-                    large: number;
+                sm: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                label: {
-                    small: number;
-                    large: number;
+                xs: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
             };
-            letterSpacing: {
-                base: number;
-                compressed: number;
-                extraCompressed: number;
-            };
             lineHeight: {
-                display0: {
-                    small: number;
-                    large: number;
-                };
-                display1: {
-                    small: number;
-                    large: number;
+                d1: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                display2: {
-                    small: number;
-                    large: number;
+                d2: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                display3: {
-                    small: number;
-                    large: number;
+                d3: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                heading1: {
-                    small: number;
-                    large: number;
+                d4: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                heading2: {
-                    small: number;
-                    large: number;
+                "4xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                heading3: {
-                    small: number;
-                    large: number;
+                "3xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                heading4: {
-                    small: number;
-                    large: number;
+                "2xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                lead: {
-                    small: number;
-                    large: number;
+                xl: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                body: {
-                    small: number;
-                    large: number;
+                lg: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                small: {
-                    small: number;
-                    large: number;
+                md: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                label: {
-                    small: number;
-                    large: number;
+                sm: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-            };
-            borderWidth: {
-                small: number;
-                medium: number;
-                large: number;
-            };
-            breakpoint: {
-                small: number;
-                medium: number;
-                large: number;
-            };
-            mediaQuery: {
-                small: number;
-                medium: number;
-                large: number;
-            };
-            customMediaQuery: {
-                'small-and-up': number;
-                'medium-and-up': number;
-                'large-and-up': number;
-            };
-            opacity: {
-                solid: number;
-                translucent: number;
-                transparent: number;
-            };
-            radius: {
-                small: number;
-                medium: number;
-                large: number;
-                max: number;
-            };
-            space: {
-                '0': number;
-                '1': number;
-                '2': number;
-                '3': number;
-                '4': number;
-                '5': number;
-                '6': number;
-                '7': number;
-                '8': number;
-                '9': number;
-                '10': number;
-                '11': number;
-                '12': number;
-                '13': number;
-                '14': number;
-                '15': number;
-            };
-            transition: {
-                slow: number;
-                medium: number;
-                fast: number;
-            };
-        };
-        semantic: {
-            border: {
-                graphic: string;
-                differentiated: string;
-                functional: string;
-            };
-            branded: {
-                surface: string;
-                message: string;
-                heading: string;
-            };
-            neutral: {
-                surface: string;
-                message: string;
-                surfaceEmphasis: string;
-                messageOnEmphasis: string;
-                border: string;
-            };
-            success: {
-                surface: string;
-                message: string;
-                surfaceEmphasis: string;
-                messageOnEmphasis: string;
-                border: string;
-            };
-            warning: {
-                surface: string;
-                message: string;
-                surfaceEmphasis: string;
-                messageOnEmphasis: string;
-                border: string;
-            };
-            error: {
-                surface: string;
-                message: string;
-                surfaceEmphasis: string;
-                messageOnEmphasis: string;
-                border: string;
-            };
-            info: {
-                surface: string;
-                message: string;
-                surfaceEmphasis: string;
-                messageOnEmphasis: string;
-                border: string;
-            };
-            data: {
-                branded: {
-                    '1': string;
-                    '2': string;
-                    '3': string;
-                    '4': string;
-                };
-                electric: {
-                    '1': string;
-                    '2': string;
-                    '3': string;
-                    '4': string;
-                };
-                gas: {
-                    '1': string;
-                    '2': string;
-                    '3': string;
-                    '4': string;
+                xs: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
             };
-            focus: {
-                outline: string;
-                hover: string;
-                surface: string;
-            };
-            inverted: {
-                surface: string;
-                surfaceAlt: string;
-                border: string;
-                borderAlt: string;
-                message: {
-                    branded: string;
-                    base: string;
-                    secondary: string;
-                    link: string;
+            paragraphSpace: {
+                d1: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-            };
-            message: {
-                base: string;
-                secondary: string;
-                link: string;
-                error: string;
-                branded: string;
-            };
-            surface: {
-                base: string;
-                cutout: string;
-                elevated: string;
-            };
-        };
-        component: {
-            badge: {
-                variants: {
-                    neutral: {
-                        background: string;
-                        foreground: string;
+                d2: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
                     };
-                    red: {
-                        background: string;
-                        foreground: string;
+                };
+                d3: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
                     };
-                    orange: {
-                        background: string;
-                        foreground: string;
+                };
+                d4: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
                     };
-                    yellow: {
-                        background: string;
-                        foreground: string;
+                };
+                "4xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
                     };
-                    green: {
-                        background: string;
-                        foreground: string;
+                };
+                "3xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
                     };
-                    blue: {
-                        background: string;
-                        foreground: string;
+                };
+                "2xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
                     };
                 };
-            };
-            cta: {
-                primary: {
-                    message: string;
-                    surface: string;
-                    messageHover: string;
-                    surfaceHover: string;
-                    messageFocused: string;
-                    surfaceFocused: string;
-                    outlineFocused: string;
-                    backgroundFocused: string;
-                    messageInverted: string;
-                    surfaceInverted: string;
-                };
-                secondary: {
-                    message: string;
-                    surface: string;
-                    messageHover: string;
-                    surfaceHover: string;
-                    messageFocused: string;
-                    surfaceFocused: string;
-                    outlineFocused: string;
-                    backgroundFocused: string;
-                    messageInverted: string;
-                    surfaceInverted: string;
-                };
-                destructive: {
-                    message: string;
-                    surface: string;
-                    messageHover: string;
-                    surfaceHover: string;
-                    messageFocused: string;
-                    surfaceFocused: string;
-                    outlineFocused: string;
-                    backgroundFocused: string;
-                    messageInverted: string;
-                    surfaceInverted: string;
+                xl: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-            };
-            display0: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
+                lg: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                fontSize: {
-                    small: number;
-                    large: number;
+                md: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-            };
-            display1: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
+                sm: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                fontSize: {
-                    small: number;
-                    large: number;
+                xs: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
             };
-            display2: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
+            size: {
+                d1: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                fontSize: {
-                    small: number;
-                    large: number;
+                d2: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-            };
-            display3: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
+                d3: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                fontSize: {
-                    small: number;
-                    large: number;
+                d4: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-            };
-            heading1: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
+                "4xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                fontSize: {
-                    small: number;
-                    large: number;
+                "3xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-            };
-            heading2: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
+                "2xl": {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                fontSize: {
-                    small: number;
-                    large: number;
+                xl: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-            };
-            heading3: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
+                lg: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                fontSize: {
-                    small: number;
-                    large: number;
+                md: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-            };
-            heading4: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
+                sm: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
-                fontSize: {
-                    small: number;
-                    large: number;
+                xs: {
+                    mediaQuery: {
+                        sm: number;
+                        lg: number;
+                    };
                 };
             };
-            lead: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
-                };
-                fontSize: {
-                    small: number;
-                    large: number;
-                };
+            weight: {
+                book: number;
+                bold: number;
+                black: number;
             };
-            body: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
-                };
-                fontSize: {
-                    small: number;
-                    large: number;
+        };
+        mediaQuery: {
+            small: number;
+            medium: number;
+            large: number;
+        };
+        customMediaQuery: {
+            "small-and-up": number;
+            "medium-and-up": number;
+            "large-and-up": number;
+        };
+        opacity: {
+            solid: number;
+            translucent: number;
+            transparent: number;
+        };
+        space: {
+            "0": number;
+            "25": number;
+            "50": number;
+            "100": number;
+            "200": number;
+            "300": number;
+            "350": number;
+            "400": number;
+            "450": number;
+            "500": number;
+            "550": number;
+            "600": number;
+            "700": number;
+            "800": number;
+            "900": number;
+            "1000": number;
+            "1100": number;
+            "1200": number;
+            "1300": number;
+            "1400": number;
+            "1500": number;
+            "1600": number;
+            "1800": number;
+            "2000": number;
+            "2400": number;
+            "3000": number;
+            "3500": number;
+            base: number;
+        };
+        button: {
+            color: {
+                focus: {
+                    blue: string;
+                    white: string;
                 };
             };
-            small: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
-                };
-                fontSize: {
-                    small: number;
-                    large: number;
+            surface: {
+                color: {
+                    fg: string;
+                    bg: string;
+                    bgVariant: string;
+                    bgHover: string;
+                    fgInverted: string;
+                    bgInverted: string;
+                    bgInvertedHover: string;
                 };
             };
-            label: {
-                fontFamily: string;
-                fontWeight: number;
-                lineHeight: {
-                    small: number;
-                    large: number;
-                };
-                fontSize: {
-                    small: number;
-                    large: number;
+            destructive: {
+                color: {
+                    fg: string;
+                    bg: string;
+                    bgHover: string;
                 };
             };
         };
+        input: {
+            color: {
+                label: string;
+                border: string;
+                borderError: string;
+                hint: string;
+                selected: string;
+                selectedTint: string;
+            };
+        };
     } | undefined;
 } & {
     as?: string | import("react").ComponentType<any> | undefined;