@100mslive/roomkit-react 0.1.0

package/dist/Input/Input.d.ts

@@ -0,0 +1,2917 @@
+import React from 'react';
+import { CSS } from '@stitches/react';
+export declare const Input: import("@stitches/react/types/styled-component").StyledComponent<"input", {
+    error?: boolean | "true" | undefined;
+}, {
+    allowMotion: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+    '2xl': string;
+    ls: string;
+}, import("@stitches/react/types/css-util").CSS<{
+    allowMotion: string;
+    sm: string;
+    md: string;
+    lg: string;
+    xl: string;
+    '2xl': string;
+    ls: string;
+}, {
+    colors: {
+        bgPrimary: string;
+        bgSecondary: string;
+        bgTertiary: string;
+        surfaceLight: string;
+        surfaceLighter: string;
+        textPrimary: string;
+        textSecondary: string;
+        textDisabled: string;
+        textInvert: string;
+        textHighEmp: string;
+        textMedEmp: string;
+        iconBtn: string;
+        iconHoverBg: string;
+        transparentBg: string;
+        mainBg: string;
+        tileBg: string;
+        secondaryDisabled: string;
+        previewBg: string;
+        statsBg: string;
+        menuBg: string;
+        inputBg: string;
+        toastBg: string;
+        borderDefault: string;
+        backgroundDefault: string;
+        borderLighter: string;
+        white: string;
+        black: string;
+        transparent: string;
+        orange: string;
+        cyan: string;
+        tamarind: string;
+        yellow: string;
+        twinYellow: string;
+        green: string;
+        darkgreen: string;
+        purple: string;
+        borderLight: string;
+        borderAccent: string;
+        success: string;
+        error: string;
+        errorTint: string;
+        warning: string;
+        brandLight: string;
+        brandDefault: string;
+        brandDark: string;
+        brandDisabled: string;
+        grayLight: string;
+        grayDefault: string;
+        grayDark: string;
+        secondaryGray: string;
+        grayDisabled: string;
+        textAccentHigh: string;
+        textAccentMedium: string;
+        textAccentDisabled: string;
+        surfaceDefault: string;
+        surfaceDark: string;
+        backgroundDark: string;
+        backgroundDarker: string;
+        primaryLight: string;
+        primaryDefault: string;
+        primaryDark: string;
+        primaryDisabled: string;
+        secondaryLight: string;
+        secondaryDefault: string;
+        secondaryDark: string;
+        errorDefault: string;
+        errorLight: string;
+        errorDark: string;
+        errorDisabled: string;
+    };
+    shadows: {
+        sm: string;
+        md: string;
+    };
+    fonts: {
+        sans: string;
+    };
+    fontSizes: {
+        h1: string;
+        h2: string;
+        h3: string;
+        h4: string;
+        h5: string;
+        h6: string;
+        tiny: string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+    };
+    fontWeights: {
+        semiBold: number;
+        medium: number;
+        regular: number;
+    };
+    lineHeights: {
+        h1: string;
+        h2: string;
+        h3: string;
+        h4: string;
+        h5: string;
+        h6: string;
+        tiny: string;
+        xs: string;
+        sm: string;
+        md: string;
+    };
+    radii: {
+        '0': string;
+        '1': string;
+        '2': string;
+        '3': string;
+        '4': string;
+        round: string;
+    };
+    space: {
+        0: string;
+        xs: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        px: string;
+        1: string;
+        2: string;
+        3: string;
+        4: string;
+        5: string;
+        6: string;
+        7: string;
+        8: string;
+        9: string;
+        10: string;
+        11: string;
+        12: string;
+        13: string;
+        14: string;
+        15: string;
+        16: string;
+        17: string;
+        18: string;
+        19: string;
+        20: string;
+        24: string;
+        28: string;
+        32: string;
+        36: string;
+        40: string;
+        44: string;
+        48: string;
+        52: string;
+        56: string;
+        60: string;
+        64: string;
+        72: string;
+        80: string;
+        96: string;
+        100: string;
+    };
+    borderWidths: {
+        light: string;
+        normal: string;
+        bold: string;
+        extrabold: string;
+        black: string;
+    };
+}, {
+    width: string;
+    height: string;
+    minWidth: string;
+    maxWidth: string;
+    minHeight: string;
+    maxHeight: string;
+    flexBasis: string;
+    gridTemplateColumns: string;
+    gridTemplateRows: string;
+    blockSize: string;
+    minBlockSize: string;
+    maxBlockSize: string;
+    inlineSize: string;
+    minInlineSize: string;
+    maxInlineSize: string;
+    gap: "space";
+    gridGap: "space";
+    columnGap: "space";
+    gridColumnGap: "space";
+    rowGap: "space";
+    gridRowGap: "space";
+    inset: "space";
+    insetBlock: "space";
+    insetBlockEnd: "space";
+    insetBlockStart: "space";
+    insetInline: "space";
+    insetInlineEnd: "space";
+    insetInlineStart: "space";
+    margin: "space";
+    marginTop: "space";
+    marginRight: "space";
+    marginBottom: "space";
+    marginLeft: "space";
+    marginBlock: "space";
+    marginBlockEnd: "space";
+    marginBlockStart: "space";
+    marginInline: "space";
+    marginInlineEnd: "space";
+    marginInlineStart: "space";
+    padding: "space";
+    paddingTop: "space";
+    paddingRight: "space";
+    paddingBottom: "space";
+    paddingLeft: "space";
+    paddingBlock: "space";
+    paddingBlockEnd: "space";
+    paddingBlockStart: "space";
+    paddingInline: "space";
+    paddingInlineEnd: "space";
+    paddingInlineStart: "space";
+    scrollMargin: "space";
+    scrollMarginTop: "space";
+    scrollMarginRight: "space";
+    scrollMarginBottom: "space";
+    scrollMarginLeft: "space";
+    scrollMarginBlock: "space";
+    scrollMarginBlockEnd: "space";
+    scrollMarginBlockStart: "space";
+    scrollMarginInline: "space";
+    scrollMarginInlineEnd: "space";
+    scrollMarginInlineStart: "space";
+    scrollPadding: "space";
+    scrollPaddingTop: "space";
+    scrollPaddingRight: "space";
+    scrollPaddingBottom: "space";
+    scrollPaddingLeft: "space";
+    scrollPaddingBlock: "space";
+    scrollPaddingBlockEnd: "space";
+    scrollPaddingBlockStart: "space";
+    scrollPaddingInline: "space";
+    scrollPaddingInlineEnd: "space";
+    scrollPaddingInlineStart: "space";
+    top: "space";
+    right: "space";
+    bottom: "space";
+    left: "space";
+    fontSize: "fontSizes";
+    background: "colors";
+    backgroundColor: "colors";
+    backgroundImage: "colors";
+    borderImage: "colors";
+    border: "colors";
+    borderBlock: "colors";
+    borderBlockEnd: "colors";
+    borderBlockStart: "colors";
+    borderBottom: "colors";
+    borderBottomColor: "colors";
+    borderColor: "colors";
+    borderInline: "colors";
+    borderInlineEnd: "colors";
+    borderInlineStart: "colors";
+    borderLeft: "colors";
+    borderLeftColor: "colors";
+    borderRight: "colors";
+    borderRightColor: "colors";
+    borderTop: "colors";
+    borderTopColor: "colors";
+    caretColor: "colors";
+    color: "colors";
+    columnRuleColor: "colors";
+    outline: "colors";
+    outlineColor: "colors";
+    fill: "colors";
+    stroke: "colors";
+    textDecorationColor: "colors";
+    fontFamily: "fonts";
+    fontWeight: "fontWeights";
+    lineHeight: "lineHeights";
+    letterSpacing: "letterSpacings";
+    borderWidth: "borderWidths";
+    borderTopWidth: "borderWidths";
+    borderLeftWidth: "borderWidths";
+    borderRightWidth: "borderWidths";
+    borderBottomWidth: "borderWidths";
+    borderStyle: "borderStyles";
+    borderTopStyle: "borderStyles";
+    borderLeftStyle: "borderStyles";
+    borderRightStyle: "borderStyles";
+    borderBottomStyle: "borderStyles";
+    borderRadius: "radii";
+    borderTopLeftRadius: "radii";
+    borderTopRightRadius: "radii";
+    borderBottomRightRadius: "radii";
+    borderBottomLeftRadius: "radii";
+    boxShadow: "shadows";
+    textShadow: "shadows";
+    transition: "transitions";
+    zIndex: "zIndices";
+}, {
+    bg: (value: {
+        readonly [$$PropertyValue]: "backgroundColor";
+    }) => {
+        backgroundColor: {
+            readonly [$$PropertyValue]: "backgroundColor";
+        };
+    };
+    c: (value: {
+        readonly [$$PropertyValue]: "color";
+    }) => {
+        color: {
+            readonly [$$PropertyValue]: "color";
+        };
+    };
+    r: (value: {
+        readonly [$$ScaleValue]: "radii";
+    }) => {
+        borderRadius: {
+            readonly [$$ScaleValue]: "radii";
+        };
+    };
+    fs: (value: string | number | {
+        readonly [$$PropertyValue]: "fontSize";
+    }) => {
+        fontSize: string | number | {
+            readonly [$$PropertyValue]: "fontSize";
+        };
+    };
+    size: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        height: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+        width: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    w: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        width: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    h: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        height: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    p: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        padding: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    pt: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        paddingTop: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    pr: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        paddingRight: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    pb: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        paddingBottom: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    pl: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        paddingLeft: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    px: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        paddingLeft: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+        paddingRight: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    py: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        paddingTop: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+        paddingBottom: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    m: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        margin: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mt: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginTop: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mr: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginRight: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mb: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginBottom: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    ml: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginLeft: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    mx: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginLeft: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+        marginRight: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+    my: (value: string | number | {
+        readonly [$$ScaleValue]: "space";
+    }) => {
+        marginTop: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+        marginBottom: string | number | {
+            readonly [$$ScaleValue]: "space";
+        };
+    };
+}>>;
+export declare const PasswordInput: {
+    Root: import("@stitches/react/types/styled-component").StyledComponent<"div", {}, {
+        allowMotion: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        '2xl': string;
+        ls: string;
+    }, import("@stitches/react/types/css-util").CSS<{
+        allowMotion: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        '2xl': string;
+        ls: string;
+    }, {
+        colors: {
+            bgPrimary: string;
+            bgSecondary: string;
+            bgTertiary: string;
+            surfaceLight: string;
+            surfaceLighter: string;
+            textPrimary: string;
+            textSecondary: string;
+            textDisabled: string;
+            textInvert: string;
+            textHighEmp: string;
+            textMedEmp: string;
+            iconBtn: string;
+            iconHoverBg: string;
+            transparentBg: string;
+            mainBg: string;
+            tileBg: string;
+            secondaryDisabled: string;
+            previewBg: string;
+            statsBg: string;
+            menuBg: string;
+            inputBg: string;
+            toastBg: string;
+            borderDefault: string;
+            backgroundDefault: string;
+            borderLighter: string;
+            white: string;
+            black: string;
+            transparent: string;
+            orange: string;
+            cyan: string;
+            tamarind: string;
+            yellow: string;
+            twinYellow: string;
+            green: string;
+            darkgreen: string;
+            purple: string;
+            borderLight: string;
+            borderAccent: string;
+            success: string;
+            error: string;
+            errorTint: string;
+            warning: string;
+            brandLight: string;
+            brandDefault: string;
+            brandDark: string;
+            brandDisabled: string;
+            grayLight: string;
+            grayDefault: string;
+            grayDark: string;
+            secondaryGray: string;
+            grayDisabled: string;
+            textAccentHigh: string;
+            textAccentMedium: string;
+            textAccentDisabled: string;
+            surfaceDefault: string;
+            surfaceDark: string;
+            backgroundDark: string;
+            backgroundDarker: string;
+            primaryLight: string;
+            primaryDefault: string;
+            primaryDark: string;
+            primaryDisabled: string;
+            secondaryLight: string;
+            secondaryDefault: string;
+            secondaryDark: string;
+            errorDefault: string;
+            errorLight: string;
+            errorDark: string;
+            errorDisabled: string;
+        };
+        shadows: {
+            sm: string;
+            md: string;
+        };
+        fonts: {
+            sans: string;
+        };
+        fontSizes: {
+            h1: string;
+            h2: string;
+            h3: string;
+            h4: string;
+            h5: string;
+            h6: string;
+            tiny: string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+        };
+        fontWeights: {
+            semiBold: number;
+            medium: number;
+            regular: number;
+        };
+        lineHeights: {
+            h1: string;
+            h2: string;
+            h3: string;
+            h4: string;
+            h5: string;
+            h6: string;
+            tiny: string;
+            xs: string;
+            sm: string;
+            md: string;
+        };
+        radii: {
+            '0': string;
+            '1': string;
+            '2': string;
+            '3': string;
+            '4': string;
+            round: string;
+        };
+        space: {
+            0: string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            px: string;
+            1: string;
+            2: string;
+            3: string;
+            4: string;
+            5: string;
+            6: string;
+            7: string;
+            8: string;
+            9: string;
+            10: string;
+            11: string;
+            12: string;
+            13: string;
+            14: string;
+            15: string;
+            16: string;
+            17: string;
+            18: string;
+            19: string;
+            20: string;
+            24: string;
+            28: string;
+            32: string;
+            36: string;
+            40: string;
+            44: string;
+            48: string;
+            52: string;
+            56: string;
+            60: string;
+            64: string;
+            72: string;
+            80: string;
+            96: string;
+            100: string;
+        };
+        borderWidths: {
+            light: string;
+            normal: string;
+            bold: string;
+            extrabold: string;
+            black: string;
+        };
+    }, {
+        width: string;
+        height: string;
+        minWidth: string;
+        maxWidth: string;
+        minHeight: string;
+        maxHeight: string;
+        flexBasis: string;
+        gridTemplateColumns: string;
+        gridTemplateRows: string;
+        blockSize: string;
+        minBlockSize: string;
+        maxBlockSize: string;
+        inlineSize: string;
+        minInlineSize: string;
+        maxInlineSize: string;
+        gap: "space";
+        gridGap: "space";
+        columnGap: "space";
+        gridColumnGap: "space";
+        rowGap: "space";
+        gridRowGap: "space";
+        inset: "space";
+        insetBlock: "space";
+        insetBlockEnd: "space";
+        insetBlockStart: "space";
+        insetInline: "space";
+        insetInlineEnd: "space";
+        insetInlineStart: "space";
+        margin: "space";
+        marginTop: "space";
+        marginRight: "space";
+        marginBottom: "space";
+        marginLeft: "space";
+        marginBlock: "space";
+        marginBlockEnd: "space";
+        marginBlockStart: "space";
+        marginInline: "space";
+        marginInlineEnd: "space";
+        marginInlineStart: "space";
+        padding: "space";
+        paddingTop: "space";
+        paddingRight: "space";
+        paddingBottom: "space";
+        paddingLeft: "space";
+        paddingBlock: "space";
+        paddingBlockEnd: "space";
+        paddingBlockStart: "space";
+        paddingInline: "space";
+        paddingInlineEnd: "space";
+        paddingInlineStart: "space";
+        scrollMargin: "space";
+        scrollMarginTop: "space";
+        scrollMarginRight: "space";
+        scrollMarginBottom: "space";
+        scrollMarginLeft: "space";
+        scrollMarginBlock: "space";
+        scrollMarginBlockEnd: "space";
+        scrollMarginBlockStart: "space";
+        scrollMarginInline: "space";
+        scrollMarginInlineEnd: "space";
+        scrollMarginInlineStart: "space";
+        scrollPadding: "space";
+        scrollPaddingTop: "space";
+        scrollPaddingRight: "space";
+        scrollPaddingBottom: "space";
+        scrollPaddingLeft: "space";
+        scrollPaddingBlock: "space";
+        scrollPaddingBlockEnd: "space";
+        scrollPaddingBlockStart: "space";
+        scrollPaddingInline: "space";
+        scrollPaddingInlineEnd: "space";
+        scrollPaddingInlineStart: "space";
+        top: "space";
+        right: "space";
+        bottom: "space";
+        left: "space";
+        fontSize: "fontSizes";
+        background: "colors";
+        backgroundColor: "colors";
+        backgroundImage: "colors";
+        borderImage: "colors";
+        border: "colors";
+        borderBlock: "colors";
+        borderBlockEnd: "colors";
+        borderBlockStart: "colors";
+        borderBottom: "colors";
+        borderBottomColor: "colors";
+        borderColor: "colors";
+        borderInline: "colors";
+        borderInlineEnd: "colors";
+        borderInlineStart: "colors";
+        borderLeft: "colors";
+        borderLeftColor: "colors";
+        borderRight: "colors";
+        borderRightColor: "colors";
+        borderTop: "colors";
+        borderTopColor: "colors";
+        caretColor: "colors";
+        color: "colors";
+        columnRuleColor: "colors";
+        outline: "colors";
+        outlineColor: "colors";
+        fill: "colors";
+        stroke: "colors";
+        textDecorationColor: "colors";
+        fontFamily: "fonts";
+        fontWeight: "fontWeights";
+        lineHeight: "lineHeights";
+        letterSpacing: "letterSpacings";
+        borderWidth: "borderWidths";
+        borderTopWidth: "borderWidths";
+        borderLeftWidth: "borderWidths";
+        borderRightWidth: "borderWidths";
+        borderBottomWidth: "borderWidths";
+        borderStyle: "borderStyles";
+        borderTopStyle: "borderStyles";
+        borderLeftStyle: "borderStyles";
+        borderRightStyle: "borderStyles";
+        borderBottomStyle: "borderStyles";
+        borderRadius: "radii";
+        borderTopLeftRadius: "radii";
+        borderTopRightRadius: "radii";
+        borderBottomRightRadius: "radii";
+        borderBottomLeftRadius: "radii";
+        boxShadow: "shadows";
+        textShadow: "shadows";
+        transition: "transitions";
+        zIndex: "zIndices";
+    }, {
+        bg: (value: {
+            readonly [$$PropertyValue]: "backgroundColor";
+        }) => {
+            backgroundColor: {
+                readonly [$$PropertyValue]: "backgroundColor";
+            };
+        };
+        c: (value: {
+            readonly [$$PropertyValue]: "color";
+        }) => {
+            color: {
+                readonly [$$PropertyValue]: "color";
+            };
+        };
+        r: (value: {
+            readonly [$$ScaleValue]: "radii";
+        }) => {
+            borderRadius: {
+                readonly [$$ScaleValue]: "radii";
+            };
+        };
+        fs: (value: string | number | {
+            readonly [$$PropertyValue]: "fontSize";
+        }) => {
+            fontSize: string | number | {
+                readonly [$$PropertyValue]: "fontSize";
+            };
+        };
+        size: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            height: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+            width: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        w: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            width: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        h: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            height: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        p: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            padding: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        pt: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            paddingTop: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        pr: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            paddingRight: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        pb: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            paddingBottom: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        pl: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            paddingLeft: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        px: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            paddingLeft: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+            paddingRight: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        py: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            paddingTop: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+            paddingBottom: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        m: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            margin: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mt: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginTop: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mr: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginRight: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mb: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginBottom: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        ml: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginLeft: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        mx: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginLeft: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+            marginRight: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+        my: (value: string | number | {
+            readonly [$$ScaleValue]: "space";
+        }) => {
+            marginTop: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+            marginBottom: string | number | {
+                readonly [$$ScaleValue]: "space";
+            };
+        };
+    }>>;
+    Icons: React.ForwardRefExoticComponent<Omit<React.PropsWithChildren<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+    }, "direction" | "gap" | "css" | "justify" | "align"> & import("@stitches/react/types/styled-component").TransformProps<{
+        justify?: "center" | "start" | "end" | "between" | "around" | "evenly" | undefined;
+        align?: "center" | "start" | "end" | "baseline" | "strech" | undefined;
+        direction?: "row" | "column" | "rowReverse" | "columnReverse" | undefined;
+        gap?: "1" | "2" | "3" | "4" | 1 | 2 | 3 | 4 | undefined;
+    }, {
+        allowMotion: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        '2xl': string;
+        ls: string;
+    }> & {
+        css?: import("@stitches/react/types/css-util").CSS<{
+            allowMotion: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+            ls: string;
+        }, {
+            colors: {
+                bgPrimary: string;
+                bgSecondary: string;
+                bgTertiary: string;
+                surfaceLight: string;
+                surfaceLighter: string;
+                textPrimary: string;
+                textSecondary: string;
+                textDisabled: string;
+                textInvert: string;
+                textHighEmp: string;
+                textMedEmp: string;
+                iconBtn: string;
+                iconHoverBg: string;
+                transparentBg: string;
+                mainBg: string;
+                tileBg: string;
+                secondaryDisabled: string;
+                previewBg: string;
+                statsBg: string;
+                menuBg: string;
+                inputBg: string;
+                toastBg: string;
+                borderDefault: string;
+                backgroundDefault: string;
+                borderLighter: string;
+                white: string;
+                black: string;
+                transparent: string;
+                orange: string;
+                cyan: string;
+                tamarind: string;
+                yellow: string;
+                twinYellow: string;
+                green: string;
+                darkgreen: string;
+                purple: string;
+                borderLight: string;
+                borderAccent: string;
+                success: string;
+                error: string;
+                errorTint: string;
+                warning: string;
+                brandLight: string;
+                brandDefault: string;
+                brandDark: string;
+                brandDisabled: string;
+                grayLight: string;
+                grayDefault: string;
+                grayDark: string;
+                secondaryGray: string;
+                grayDisabled: string;
+                textAccentHigh: string;
+                textAccentMedium: string;
+                textAccentDisabled: string;
+                surfaceDefault: string;
+                surfaceDark: string;
+                backgroundDark: string;
+                backgroundDarker: string;
+                primaryLight: string;
+                primaryDefault: string;
+                primaryDark: string;
+                primaryDisabled: string;
+                secondaryLight: string;
+                secondaryDefault: string;
+                secondaryDark: string;
+                errorDefault: string;
+                errorLight: string;
+                errorDark: string;
+                errorDisabled: string;
+            };
+            shadows: {
+                sm: string;
+                md: string;
+            };
+            fonts: {
+                sans: string;
+            };
+            fontSizes: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+                tiny: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+            };
+            fontWeights: {
+                semiBold: number;
+                medium: number;
+                regular: number;
+            };
+            lineHeights: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+                tiny: string;
+                xs: string;
+                sm: string;
+                md: string;
+            };
+            radii: {
+                '0': string;
+                '1': string;
+                '2': string;
+                '3': string;
+                '4': string;
+                round: string;
+            };
+            space: {
+                0: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+                px: string;
+                1: string;
+                2: string;
+                3: string;
+                4: string;
+                5: string;
+                6: string;
+                7: string;
+                8: string;
+                9: string;
+                10: string;
+                11: string;
+                12: string;
+                13: string;
+                14: string;
+                15: string;
+                16: string;
+                17: string;
+                18: string;
+                19: string;
+                20: string;
+                24: string;
+                28: string;
+                32: string;
+                36: string;
+                40: string;
+                44: string;
+                48: string;
+                52: string;
+                56: string;
+                60: string;
+                64: string;
+                72: string;
+                80: string;
+                96: string;
+                100: string;
+            };
+            borderWidths: {
+                light: string;
+                normal: string;
+                bold: string;
+                extrabold: string;
+                black: string;
+            };
+        }, {
+            width: string;
+            height: string;
+            minWidth: string;
+            maxWidth: string;
+            minHeight: string;
+            maxHeight: string;
+            flexBasis: string;
+            gridTemplateColumns: string;
+            gridTemplateRows: string;
+            blockSize: string;
+            minBlockSize: string;
+            maxBlockSize: string;
+            inlineSize: string;
+            minInlineSize: string;
+            maxInlineSize: string;
+            gap: "space";
+            gridGap: "space";
+            columnGap: "space";
+            gridColumnGap: "space";
+            rowGap: "space";
+            gridRowGap: "space";
+            inset: "space";
+            insetBlock: "space";
+            insetBlockEnd: "space";
+            insetBlockStart: "space";
+            insetInline: "space";
+            insetInlineEnd: "space";
+            insetInlineStart: "space";
+            margin: "space";
+            marginTop: "space";
+            marginRight: "space";
+            marginBottom: "space";
+            marginLeft: "space";
+            marginBlock: "space";
+            marginBlockEnd: "space";
+            marginBlockStart: "space";
+            marginInline: "space";
+            marginInlineEnd: "space";
+            marginInlineStart: "space";
+            padding: "space";
+            paddingTop: "space";
+            paddingRight: "space";
+            paddingBottom: "space";
+            paddingLeft: "space";
+            paddingBlock: "space";
+            paddingBlockEnd: "space";
+            paddingBlockStart: "space";
+            paddingInline: "space";
+            paddingInlineEnd: "space";
+            paddingInlineStart: "space";
+            scrollMargin: "space";
+            scrollMarginTop: "space";
+            scrollMarginRight: "space";
+            scrollMarginBottom: "space";
+            scrollMarginLeft: "space";
+            scrollMarginBlock: "space";
+            scrollMarginBlockEnd: "space";
+            scrollMarginBlockStart: "space";
+            scrollMarginInline: "space";
+            scrollMarginInlineEnd: "space";
+            scrollMarginInlineStart: "space";
+            scrollPadding: "space";
+            scrollPaddingTop: "space";
+            scrollPaddingRight: "space";
+            scrollPaddingBottom: "space";
+            scrollPaddingLeft: "space";
+            scrollPaddingBlock: "space";
+            scrollPaddingBlockEnd: "space";
+            scrollPaddingBlockStart: "space";
+            scrollPaddingInline: "space";
+            scrollPaddingInlineEnd: "space";
+            scrollPaddingInlineStart: "space";
+            top: "space";
+            right: "space";
+            bottom: "space";
+            left: "space";
+            fontSize: "fontSizes";
+            background: "colors";
+            backgroundColor: "colors";
+            backgroundImage: "colors";
+            borderImage: "colors";
+            border: "colors";
+            borderBlock: "colors";
+            borderBlockEnd: "colors";
+            borderBlockStart: "colors";
+            borderBottom: "colors";
+            borderBottomColor: "colors";
+            borderColor: "colors";
+            borderInline: "colors";
+            borderInlineEnd: "colors";
+            borderInlineStart: "colors";
+            borderLeft: "colors";
+            borderLeftColor: "colors";
+            borderRight: "colors";
+            borderRightColor: "colors";
+            borderTop: "colors";
+            borderTopColor: "colors";
+            caretColor: "colors";
+            color: "colors";
+            columnRuleColor: "colors";
+            outline: "colors";
+            outlineColor: "colors";
+            fill: "colors";
+            stroke: "colors";
+            textDecorationColor: "colors";
+            fontFamily: "fonts";
+            fontWeight: "fontWeights";
+            lineHeight: "lineHeights";
+            letterSpacing: "letterSpacings";
+            borderWidth: "borderWidths";
+            borderTopWidth: "borderWidths";
+            borderLeftWidth: "borderWidths";
+            borderRightWidth: "borderWidths";
+            borderBottomWidth: "borderWidths";
+            borderStyle: "borderStyles";
+            borderTopStyle: "borderStyles";
+            borderLeftStyle: "borderStyles";
+            borderRightStyle: "borderStyles";
+            borderBottomStyle: "borderStyles";
+            borderRadius: "radii";
+            borderTopLeftRadius: "radii";
+            borderTopRightRadius: "radii";
+            borderBottomRightRadius: "radii";
+            borderBottomLeftRadius: "radii";
+            boxShadow: "shadows";
+            textShadow: "shadows";
+            transition: "transitions";
+            zIndex: "zIndices";
+        }, {
+            bg: (value: {
+                readonly [$$PropertyValue]: "backgroundColor";
+            }) => {
+                backgroundColor: {
+                    readonly [$$PropertyValue]: "backgroundColor";
+                };
+            };
+            c: (value: {
+                readonly [$$PropertyValue]: "color";
+            }) => {
+                color: {
+                    readonly [$$PropertyValue]: "color";
+                };
+            };
+            r: (value: {
+                readonly [$$ScaleValue]: "radii";
+            }) => {
+                borderRadius: {
+                    readonly [$$ScaleValue]: "radii";
+                };
+            };
+            fs: (value: string | number | {
+                readonly [$$PropertyValue]: "fontSize";
+            }) => {
+                fontSize: string | number | {
+                    readonly [$$PropertyValue]: "fontSize";
+                };
+            };
+            size: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                height: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                width: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            w: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                width: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            h: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                height: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            p: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                padding: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pt: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pr: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pb: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pl: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            px: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                paddingRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            py: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                paddingBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            m: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                margin: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mt: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mr: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mb: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            ml: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mx: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                marginRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            my: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                marginBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+        }> | undefined;
+    }>, "ref"> & React.RefAttributes<HTMLDivElement>>;
+    Input: React.FC<Omit<Omit<React.DetailedHTMLProps<React.InputHTMLAttributes<HTMLInputElement>, HTMLInputElement>, "ref"> & {
+        ref?: ((instance: HTMLInputElement | null) => void) | React.RefObject<HTMLInputElement> | null | undefined;
+    }, "error" | "css"> & import("@stitches/react/types/styled-component").TransformProps<{
+        error?: boolean | "true" | undefined;
+    }, {
+        allowMotion: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        '2xl': string;
+        ls: string;
+    }> & {
+        css?: import("@stitches/react/types/css-util").CSS<{
+            allowMotion: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+            ls: string;
+        }, {
+            colors: {
+                bgPrimary: string;
+                bgSecondary: string;
+                bgTertiary: string;
+                surfaceLight: string;
+                surfaceLighter: string;
+                textPrimary: string;
+                textSecondary: string;
+                textDisabled: string;
+                textInvert: string;
+                textHighEmp: string;
+                textMedEmp: string;
+                iconBtn: string;
+                iconHoverBg: string;
+                transparentBg: string;
+                mainBg: string;
+                tileBg: string;
+                secondaryDisabled: string;
+                previewBg: string;
+                statsBg: string;
+                menuBg: string;
+                inputBg: string;
+                toastBg: string;
+                borderDefault: string;
+                backgroundDefault: string;
+                borderLighter: string;
+                white: string;
+                black: string;
+                transparent: string;
+                orange: string;
+                cyan: string;
+                tamarind: string;
+                yellow: string;
+                twinYellow: string;
+                green: string;
+                darkgreen: string;
+                purple: string;
+                borderLight: string;
+                borderAccent: string;
+                success: string;
+                error: string;
+                errorTint: string;
+                warning: string;
+                brandLight: string;
+                brandDefault: string;
+                brandDark: string;
+                brandDisabled: string;
+                grayLight: string;
+                grayDefault: string;
+                grayDark: string;
+                secondaryGray: string;
+                grayDisabled: string;
+                textAccentHigh: string;
+                textAccentMedium: string;
+                textAccentDisabled: string;
+                surfaceDefault: string;
+                surfaceDark: string;
+                backgroundDark: string;
+                backgroundDarker: string;
+                primaryLight: string;
+                primaryDefault: string;
+                primaryDark: string;
+                primaryDisabled: string;
+                secondaryLight: string;
+                secondaryDefault: string;
+                secondaryDark: string;
+                errorDefault: string;
+                errorLight: string;
+                errorDark: string;
+                errorDisabled: string;
+            };
+            shadows: {
+                sm: string;
+                md: string;
+            };
+            fonts: {
+                sans: string;
+            };
+            fontSizes: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+                tiny: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+            };
+            fontWeights: {
+                semiBold: number;
+                medium: number;
+                regular: number;
+            };
+            lineHeights: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+                tiny: string;
+                xs: string;
+                sm: string;
+                md: string;
+            };
+            radii: {
+                '0': string;
+                '1': string;
+                '2': string;
+                '3': string;
+                '4': string;
+                round: string;
+            };
+            space: {
+                0: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+                px: string;
+                1: string;
+                2: string;
+                3: string;
+                4: string;
+                5: string;
+                6: string;
+                7: string;
+                8: string;
+                9: string;
+                10: string;
+                11: string;
+                12: string;
+                13: string;
+                14: string;
+                15: string;
+                16: string;
+                17: string;
+                18: string;
+                19: string;
+                20: string;
+                24: string;
+                28: string;
+                32: string;
+                36: string;
+                40: string;
+                44: string;
+                48: string;
+                52: string;
+                56: string;
+                60: string;
+                64: string;
+                72: string;
+                80: string;
+                96: string;
+                100: string;
+            };
+            borderWidths: {
+                light: string;
+                normal: string;
+                bold: string;
+                extrabold: string;
+                black: string;
+            };
+        }, {
+            width: string;
+            height: string;
+            minWidth: string;
+            maxWidth: string;
+            minHeight: string;
+            maxHeight: string;
+            flexBasis: string;
+            gridTemplateColumns: string;
+            gridTemplateRows: string;
+            blockSize: string;
+            minBlockSize: string;
+            maxBlockSize: string;
+            inlineSize: string;
+            minInlineSize: string;
+            maxInlineSize: string;
+            gap: "space";
+            gridGap: "space";
+            columnGap: "space";
+            gridColumnGap: "space";
+            rowGap: "space";
+            gridRowGap: "space";
+            inset: "space";
+            insetBlock: "space";
+            insetBlockEnd: "space";
+            insetBlockStart: "space";
+            insetInline: "space";
+            insetInlineEnd: "space";
+            insetInlineStart: "space";
+            margin: "space";
+            marginTop: "space";
+            marginRight: "space";
+            marginBottom: "space";
+            marginLeft: "space";
+            marginBlock: "space";
+            marginBlockEnd: "space";
+            marginBlockStart: "space";
+            marginInline: "space";
+            marginInlineEnd: "space";
+            marginInlineStart: "space";
+            padding: "space";
+            paddingTop: "space";
+            paddingRight: "space";
+            paddingBottom: "space";
+            paddingLeft: "space";
+            paddingBlock: "space";
+            paddingBlockEnd: "space";
+            paddingBlockStart: "space";
+            paddingInline: "space";
+            paddingInlineEnd: "space";
+            paddingInlineStart: "space";
+            scrollMargin: "space";
+            scrollMarginTop: "space";
+            scrollMarginRight: "space";
+            scrollMarginBottom: "space";
+            scrollMarginLeft: "space";
+            scrollMarginBlock: "space";
+            scrollMarginBlockEnd: "space";
+            scrollMarginBlockStart: "space";
+            scrollMarginInline: "space";
+            scrollMarginInlineEnd: "space";
+            scrollMarginInlineStart: "space";
+            scrollPadding: "space";
+            scrollPaddingTop: "space";
+            scrollPaddingRight: "space";
+            scrollPaddingBottom: "space";
+            scrollPaddingLeft: "space";
+            scrollPaddingBlock: "space";
+            scrollPaddingBlockEnd: "space";
+            scrollPaddingBlockStart: "space";
+            scrollPaddingInline: "space";
+            scrollPaddingInlineEnd: "space";
+            scrollPaddingInlineStart: "space";
+            top: "space";
+            right: "space";
+            bottom: "space";
+            left: "space";
+            fontSize: "fontSizes";
+            background: "colors";
+            backgroundColor: "colors";
+            backgroundImage: "colors";
+            borderImage: "colors";
+            border: "colors";
+            borderBlock: "colors";
+            borderBlockEnd: "colors";
+            borderBlockStart: "colors";
+            borderBottom: "colors";
+            borderBottomColor: "colors";
+            borderColor: "colors";
+            borderInline: "colors";
+            borderInlineEnd: "colors";
+            borderInlineStart: "colors";
+            borderLeft: "colors";
+            borderLeftColor: "colors";
+            borderRight: "colors";
+            borderRightColor: "colors";
+            borderTop: "colors";
+            borderTopColor: "colors";
+            caretColor: "colors";
+            color: "colors";
+            columnRuleColor: "colors";
+            outline: "colors";
+            outlineColor: "colors";
+            fill: "colors";
+            stroke: "colors";
+            textDecorationColor: "colors";
+            fontFamily: "fonts";
+            fontWeight: "fontWeights";
+            lineHeight: "lineHeights";
+            letterSpacing: "letterSpacings";
+            borderWidth: "borderWidths";
+            borderTopWidth: "borderWidths";
+            borderLeftWidth: "borderWidths";
+            borderRightWidth: "borderWidths";
+            borderBottomWidth: "borderWidths";
+            borderStyle: "borderStyles";
+            borderTopStyle: "borderStyles";
+            borderLeftStyle: "borderStyles";
+            borderRightStyle: "borderStyles";
+            borderBottomStyle: "borderStyles";
+            borderRadius: "radii";
+            borderTopLeftRadius: "radii";
+            borderTopRightRadius: "radii";
+            borderBottomRightRadius: "radii";
+            borderBottomLeftRadius: "radii";
+            boxShadow: "shadows";
+            textShadow: "shadows";
+            transition: "transitions";
+            zIndex: "zIndices";
+        }, {
+            bg: (value: {
+                readonly [$$PropertyValue]: "backgroundColor";
+            }) => {
+                backgroundColor: {
+                    readonly [$$PropertyValue]: "backgroundColor";
+                };
+            };
+            c: (value: {
+                readonly [$$PropertyValue]: "color";
+            }) => {
+                color: {
+                    readonly [$$PropertyValue]: "color";
+                };
+            };
+            r: (value: {
+                readonly [$$ScaleValue]: "radii";
+            }) => {
+                borderRadius: {
+                    readonly [$$ScaleValue]: "radii";
+                };
+            };
+            fs: (value: string | number | {
+                readonly [$$PropertyValue]: "fontSize";
+            }) => {
+                fontSize: string | number | {
+                    readonly [$$PropertyValue]: "fontSize";
+                };
+            };
+            size: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                height: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                width: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            w: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                width: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            h: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                height: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            p: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                padding: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pt: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pr: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pb: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pl: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            px: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                paddingRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            py: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                paddingBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            m: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                margin: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mt: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mr: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mb: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            ml: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mx: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                marginRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            my: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                marginBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+        }> | undefined;
+    } & {
+        showPassword?: boolean | undefined;
+        css?: CSS<{
+            media: {};
+            theme: {};
+            themeMap: {};
+            utils: {};
+        }> | undefined;
+    }>;
+    ShowIcon: React.FC<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+    }, "direction" | "gap" | "css" | "justify" | "align"> & import("@stitches/react/types/styled-component").TransformProps<{
+        justify?: "center" | "start" | "end" | "between" | "around" | "evenly" | undefined;
+        align?: "center" | "start" | "end" | "baseline" | "strech" | undefined;
+        direction?: "row" | "column" | "rowReverse" | "columnReverse" | undefined;
+        gap?: "1" | "2" | "3" | "4" | 1 | 2 | 3 | 4 | undefined;
+    }, {
+        allowMotion: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        '2xl': string;
+        ls: string;
+    }> & {
+        css?: import("@stitches/react/types/css-util").CSS<{
+            allowMotion: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+            ls: string;
+        }, {
+            colors: {
+                bgPrimary: string;
+                bgSecondary: string;
+                bgTertiary: string;
+                surfaceLight: string;
+                surfaceLighter: string;
+                textPrimary: string;
+                textSecondary: string;
+                textDisabled: string;
+                textInvert: string;
+                textHighEmp: string;
+                textMedEmp: string;
+                iconBtn: string;
+                iconHoverBg: string;
+                transparentBg: string;
+                mainBg: string;
+                tileBg: string;
+                secondaryDisabled: string;
+                previewBg: string;
+                statsBg: string;
+                menuBg: string;
+                inputBg: string;
+                toastBg: string;
+                borderDefault: string;
+                backgroundDefault: string;
+                borderLighter: string;
+                white: string;
+                black: string;
+                transparent: string;
+                orange: string;
+                cyan: string;
+                tamarind: string;
+                yellow: string;
+                twinYellow: string;
+                green: string;
+                darkgreen: string;
+                purple: string;
+                borderLight: string;
+                borderAccent: string;
+                success: string;
+                error: string;
+                errorTint: string;
+                warning: string;
+                brandLight: string;
+                brandDefault: string;
+                brandDark: string;
+                brandDisabled: string;
+                grayLight: string;
+                grayDefault: string;
+                grayDark: string;
+                secondaryGray: string;
+                grayDisabled: string;
+                textAccentHigh: string;
+                textAccentMedium: string;
+                textAccentDisabled: string;
+                surfaceDefault: string;
+                surfaceDark: string;
+                backgroundDark: string;
+                backgroundDarker: string;
+                primaryLight: string;
+                primaryDefault: string;
+                primaryDark: string;
+                primaryDisabled: string;
+                secondaryLight: string;
+                secondaryDefault: string;
+                secondaryDark: string;
+                errorDefault: string;
+                errorLight: string;
+                errorDark: string;
+                errorDisabled: string;
+            };
+            shadows: {
+                sm: string;
+                md: string;
+            };
+            fonts: {
+                sans: string;
+            };
+            fontSizes: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+                tiny: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+            };
+            fontWeights: {
+                semiBold: number;
+                medium: number;
+                regular: number;
+            };
+            lineHeights: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+                tiny: string;
+                xs: string;
+                sm: string;
+                md: string;
+            };
+            radii: {
+                '0': string;
+                '1': string;
+                '2': string;
+                '3': string;
+                '4': string;
+                round: string;
+            };
+            space: {
+                0: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+                px: string;
+                1: string;
+                2: string;
+                3: string;
+                4: string;
+                5: string;
+                6: string;
+                7: string;
+                8: string;
+                9: string;
+                10: string;
+                11: string;
+                12: string;
+                13: string;
+                14: string;
+                15: string;
+                16: string;
+                17: string;
+                18: string;
+                19: string;
+                20: string;
+                24: string;
+                28: string;
+                32: string;
+                36: string;
+                40: string;
+                44: string;
+                48: string;
+                52: string;
+                56: string;
+                60: string;
+                64: string;
+                72: string;
+                80: string;
+                96: string;
+                100: string;
+            };
+            borderWidths: {
+                light: string;
+                normal: string;
+                bold: string;
+                extrabold: string;
+                black: string;
+            };
+        }, {
+            width: string;
+            height: string;
+            minWidth: string;
+            maxWidth: string;
+            minHeight: string;
+            maxHeight: string;
+            flexBasis: string;
+            gridTemplateColumns: string;
+            gridTemplateRows: string;
+            blockSize: string;
+            minBlockSize: string;
+            maxBlockSize: string;
+            inlineSize: string;
+            minInlineSize: string;
+            maxInlineSize: string;
+            gap: "space";
+            gridGap: "space";
+            columnGap: "space";
+            gridColumnGap: "space";
+            rowGap: "space";
+            gridRowGap: "space";
+            inset: "space";
+            insetBlock: "space";
+            insetBlockEnd: "space";
+            insetBlockStart: "space";
+            insetInline: "space";
+            insetInlineEnd: "space";
+            insetInlineStart: "space";
+            margin: "space";
+            marginTop: "space";
+            marginRight: "space";
+            marginBottom: "space";
+            marginLeft: "space";
+            marginBlock: "space";
+            marginBlockEnd: "space";
+            marginBlockStart: "space";
+            marginInline: "space";
+            marginInlineEnd: "space";
+            marginInlineStart: "space";
+            padding: "space";
+            paddingTop: "space";
+            paddingRight: "space";
+            paddingBottom: "space";
+            paddingLeft: "space";
+            paddingBlock: "space";
+            paddingBlockEnd: "space";
+            paddingBlockStart: "space";
+            paddingInline: "space";
+            paddingInlineEnd: "space";
+            paddingInlineStart: "space";
+            scrollMargin: "space";
+            scrollMarginTop: "space";
+            scrollMarginRight: "space";
+            scrollMarginBottom: "space";
+            scrollMarginLeft: "space";
+            scrollMarginBlock: "space";
+            scrollMarginBlockEnd: "space";
+            scrollMarginBlockStart: "space";
+            scrollMarginInline: "space";
+            scrollMarginInlineEnd: "space";
+            scrollMarginInlineStart: "space";
+            scrollPadding: "space";
+            scrollPaddingTop: "space";
+            scrollPaddingRight: "space";
+            scrollPaddingBottom: "space";
+            scrollPaddingLeft: "space";
+            scrollPaddingBlock: "space";
+            scrollPaddingBlockEnd: "space";
+            scrollPaddingBlockStart: "space";
+            scrollPaddingInline: "space";
+            scrollPaddingInlineEnd: "space";
+            scrollPaddingInlineStart: "space";
+            top: "space";
+            right: "space";
+            bottom: "space";
+            left: "space";
+            fontSize: "fontSizes";
+            background: "colors";
+            backgroundColor: "colors";
+            backgroundImage: "colors";
+            borderImage: "colors";
+            border: "colors";
+            borderBlock: "colors";
+            borderBlockEnd: "colors";
+            borderBlockStart: "colors";
+            borderBottom: "colors";
+            borderBottomColor: "colors";
+            borderColor: "colors";
+            borderInline: "colors";
+            borderInlineEnd: "colors";
+            borderInlineStart: "colors";
+            borderLeft: "colors";
+            borderLeftColor: "colors";
+            borderRight: "colors";
+            borderRightColor: "colors";
+            borderTop: "colors";
+            borderTopColor: "colors";
+            caretColor: "colors";
+            color: "colors";
+            columnRuleColor: "colors";
+            outline: "colors";
+            outlineColor: "colors";
+            fill: "colors";
+            stroke: "colors";
+            textDecorationColor: "colors";
+            fontFamily: "fonts";
+            fontWeight: "fontWeights";
+            lineHeight: "lineHeights";
+            letterSpacing: "letterSpacings";
+            borderWidth: "borderWidths";
+            borderTopWidth: "borderWidths";
+            borderLeftWidth: "borderWidths";
+            borderRightWidth: "borderWidths";
+            borderBottomWidth: "borderWidths";
+            borderStyle: "borderStyles";
+            borderTopStyle: "borderStyles";
+            borderLeftStyle: "borderStyles";
+            borderRightStyle: "borderStyles";
+            borderBottomStyle: "borderStyles";
+            borderRadius: "radii";
+            borderTopLeftRadius: "radii";
+            borderTopRightRadius: "radii";
+            borderBottomRightRadius: "radii";
+            borderBottomLeftRadius: "radii";
+            boxShadow: "shadows";
+            textShadow: "shadows";
+            transition: "transitions";
+            zIndex: "zIndices";
+        }, {
+            bg: (value: {
+                readonly [$$PropertyValue]: "backgroundColor";
+            }) => {
+                backgroundColor: {
+                    readonly [$$PropertyValue]: "backgroundColor";
+                };
+            };
+            c: (value: {
+                readonly [$$PropertyValue]: "color";
+            }) => {
+                color: {
+                    readonly [$$PropertyValue]: "color";
+                };
+            };
+            r: (value: {
+                readonly [$$ScaleValue]: "radii";
+            }) => {
+                borderRadius: {
+                    readonly [$$ScaleValue]: "radii";
+                };
+            };
+            fs: (value: string | number | {
+                readonly [$$PropertyValue]: "fontSize";
+            }) => {
+                fontSize: string | number | {
+                    readonly [$$PropertyValue]: "fontSize";
+                };
+            };
+            size: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                height: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                width: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            w: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                width: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            h: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                height: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            p: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                padding: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pt: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pr: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pb: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pl: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            px: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                paddingRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            py: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                paddingBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            m: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                margin: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mt: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mr: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mb: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            ml: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mx: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                marginRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            my: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                marginBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+        }> | undefined;
+    } & {
+        showPassword?: boolean | undefined;
+        css?: CSS<{
+            media: {};
+            theme: {};
+            themeMap: {};
+            utils: {};
+        }> | undefined;
+    }>;
+    CopyIcon: React.FC<Omit<Omit<React.DetailedHTMLProps<React.HTMLAttributes<HTMLDivElement>, HTMLDivElement>, "ref"> & {
+        ref?: ((instance: HTMLDivElement | null) => void) | React.RefObject<HTMLDivElement> | null | undefined;
+    }, "direction" | "gap" | "css" | "justify" | "align"> & import("@stitches/react/types/styled-component").TransformProps<{
+        justify?: "center" | "start" | "end" | "between" | "around" | "evenly" | undefined;
+        align?: "center" | "start" | "end" | "baseline" | "strech" | undefined;
+        direction?: "row" | "column" | "rowReverse" | "columnReverse" | undefined;
+        gap?: "1" | "2" | "3" | "4" | 1 | 2 | 3 | 4 | undefined;
+    }, {
+        allowMotion: string;
+        sm: string;
+        md: string;
+        lg: string;
+        xl: string;
+        '2xl': string;
+        ls: string;
+    }> & {
+        css?: import("@stitches/react/types/css-util").CSS<{
+            allowMotion: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            '2xl': string;
+            ls: string;
+        }, {
+            colors: {
+                bgPrimary: string;
+                bgSecondary: string;
+                bgTertiary: string;
+                surfaceLight: string;
+                surfaceLighter: string;
+                textPrimary: string;
+                textSecondary: string;
+                textDisabled: string;
+                textInvert: string;
+                textHighEmp: string;
+                textMedEmp: string;
+                iconBtn: string;
+                iconHoverBg: string;
+                transparentBg: string;
+                mainBg: string;
+                tileBg: string;
+                secondaryDisabled: string;
+                previewBg: string;
+                statsBg: string;
+                menuBg: string;
+                inputBg: string;
+                toastBg: string;
+                borderDefault: string;
+                backgroundDefault: string;
+                borderLighter: string;
+                white: string;
+                black: string;
+                transparent: string;
+                orange: string;
+                cyan: string;
+                tamarind: string;
+                yellow: string;
+                twinYellow: string;
+                green: string;
+                darkgreen: string;
+                purple: string;
+                borderLight: string;
+                borderAccent: string;
+                success: string;
+                error: string;
+                errorTint: string;
+                warning: string;
+                brandLight: string;
+                brandDefault: string;
+                brandDark: string;
+                brandDisabled: string;
+                grayLight: string;
+                grayDefault: string;
+                grayDark: string;
+                secondaryGray: string;
+                grayDisabled: string;
+                textAccentHigh: string;
+                textAccentMedium: string;
+                textAccentDisabled: string;
+                surfaceDefault: string;
+                surfaceDark: string;
+                backgroundDark: string;
+                backgroundDarker: string;
+                primaryLight: string;
+                primaryDefault: string;
+                primaryDark: string;
+                primaryDisabled: string;
+                secondaryLight: string;
+                secondaryDefault: string;
+                secondaryDark: string;
+                errorDefault: string;
+                errorLight: string;
+                errorDark: string;
+                errorDisabled: string;
+            };
+            shadows: {
+                sm: string;
+                md: string;
+            };
+            fonts: {
+                sans: string;
+            };
+            fontSizes: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+                tiny: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+            };
+            fontWeights: {
+                semiBold: number;
+                medium: number;
+                regular: number;
+            };
+            lineHeights: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+                tiny: string;
+                xs: string;
+                sm: string;
+                md: string;
+            };
+            radii: {
+                '0': string;
+                '1': string;
+                '2': string;
+                '3': string;
+                '4': string;
+                round: string;
+            };
+            space: {
+                0: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+                px: string;
+                1: string;
+                2: string;
+                3: string;
+                4: string;
+                5: string;
+                6: string;
+                7: string;
+                8: string;
+                9: string;
+                10: string;
+                11: string;
+                12: string;
+                13: string;
+                14: string;
+                15: string;
+                16: string;
+                17: string;
+                18: string;
+                19: string;
+                20: string;
+                24: string;
+                28: string;
+                32: string;
+                36: string;
+                40: string;
+                44: string;
+                48: string;
+                52: string;
+                56: string;
+                60: string;
+                64: string;
+                72: string;
+                80: string;
+                96: string;
+                100: string;
+            };
+            borderWidths: {
+                light: string;
+                normal: string;
+                bold: string;
+                extrabold: string;
+                black: string;
+            };
+        }, {
+            width: string;
+            height: string;
+            minWidth: string;
+            maxWidth: string;
+            minHeight: string;
+            maxHeight: string;
+            flexBasis: string;
+            gridTemplateColumns: string;
+            gridTemplateRows: string;
+            blockSize: string;
+            minBlockSize: string;
+            maxBlockSize: string;
+            inlineSize: string;
+            minInlineSize: string;
+            maxInlineSize: string;
+            gap: "space";
+            gridGap: "space";
+            columnGap: "space";
+            gridColumnGap: "space";
+            rowGap: "space";
+            gridRowGap: "space";
+            inset: "space";
+            insetBlock: "space";
+            insetBlockEnd: "space";
+            insetBlockStart: "space";
+            insetInline: "space";
+            insetInlineEnd: "space";
+            insetInlineStart: "space";
+            margin: "space";
+            marginTop: "space";
+            marginRight: "space";
+            marginBottom: "space";
+            marginLeft: "space";
+            marginBlock: "space";
+            marginBlockEnd: "space";
+            marginBlockStart: "space";
+            marginInline: "space";
+            marginInlineEnd: "space";
+            marginInlineStart: "space";
+            padding: "space";
+            paddingTop: "space";
+            paddingRight: "space";
+            paddingBottom: "space";
+            paddingLeft: "space";
+            paddingBlock: "space";
+            paddingBlockEnd: "space";
+            paddingBlockStart: "space";
+            paddingInline: "space";
+            paddingInlineEnd: "space";
+            paddingInlineStart: "space";
+            scrollMargin: "space";
+            scrollMarginTop: "space";
+            scrollMarginRight: "space";
+            scrollMarginBottom: "space";
+            scrollMarginLeft: "space";
+            scrollMarginBlock: "space";
+            scrollMarginBlockEnd: "space";
+            scrollMarginBlockStart: "space";
+            scrollMarginInline: "space";
+            scrollMarginInlineEnd: "space";
+            scrollMarginInlineStart: "space";
+            scrollPadding: "space";
+            scrollPaddingTop: "space";
+            scrollPaddingRight: "space";
+            scrollPaddingBottom: "space";
+            scrollPaddingLeft: "space";
+            scrollPaddingBlock: "space";
+            scrollPaddingBlockEnd: "space";
+            scrollPaddingBlockStart: "space";
+            scrollPaddingInline: "space";
+            scrollPaddingInlineEnd: "space";
+            scrollPaddingInlineStart: "space";
+            top: "space";
+            right: "space";
+            bottom: "space";
+            left: "space";
+            fontSize: "fontSizes";
+            background: "colors";
+            backgroundColor: "colors";
+            backgroundImage: "colors";
+            borderImage: "colors";
+            border: "colors";
+            borderBlock: "colors";
+            borderBlockEnd: "colors";
+            borderBlockStart: "colors";
+            borderBottom: "colors";
+            borderBottomColor: "colors";
+            borderColor: "colors";
+            borderInline: "colors";
+            borderInlineEnd: "colors";
+            borderInlineStart: "colors";
+            borderLeft: "colors";
+            borderLeftColor: "colors";
+            borderRight: "colors";
+            borderRightColor: "colors";
+            borderTop: "colors";
+            borderTopColor: "colors";
+            caretColor: "colors";
+            color: "colors";
+            columnRuleColor: "colors";
+            outline: "colors";
+            outlineColor: "colors";
+            fill: "colors";
+            stroke: "colors";
+            textDecorationColor: "colors";
+            fontFamily: "fonts";
+            fontWeight: "fontWeights";
+            lineHeight: "lineHeights";
+            letterSpacing: "letterSpacings";
+            borderWidth: "borderWidths";
+            borderTopWidth: "borderWidths";
+            borderLeftWidth: "borderWidths";
+            borderRightWidth: "borderWidths";
+            borderBottomWidth: "borderWidths";
+            borderStyle: "borderStyles";
+            borderTopStyle: "borderStyles";
+            borderLeftStyle: "borderStyles";
+            borderRightStyle: "borderStyles";
+            borderBottomStyle: "borderStyles";
+            borderRadius: "radii";
+            borderTopLeftRadius: "radii";
+            borderTopRightRadius: "radii";
+            borderBottomRightRadius: "radii";
+            borderBottomLeftRadius: "radii";
+            boxShadow: "shadows";
+            textShadow: "shadows";
+            transition: "transitions";
+            zIndex: "zIndices";
+        }, {
+            bg: (value: {
+                readonly [$$PropertyValue]: "backgroundColor";
+            }) => {
+                backgroundColor: {
+                    readonly [$$PropertyValue]: "backgroundColor";
+                };
+            };
+            c: (value: {
+                readonly [$$PropertyValue]: "color";
+            }) => {
+                color: {
+                    readonly [$$PropertyValue]: "color";
+                };
+            };
+            r: (value: {
+                readonly [$$ScaleValue]: "radii";
+            }) => {
+                borderRadius: {
+                    readonly [$$ScaleValue]: "radii";
+                };
+            };
+            fs: (value: string | number | {
+                readonly [$$PropertyValue]: "fontSize";
+            }) => {
+                fontSize: string | number | {
+                    readonly [$$PropertyValue]: "fontSize";
+                };
+            };
+            size: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                height: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                width: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            w: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                width: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            h: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                height: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            p: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                padding: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pt: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pr: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pb: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            pl: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            px: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                paddingRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            py: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                paddingBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            m: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                margin: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mt: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mr: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mb: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            ml: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            mx: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                marginRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+            my: (value: string | number | {
+                readonly [$$ScaleValue]: "space";
+            }) => {
+                marginTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                marginBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+            };
+        }> | undefined;
+    }>;
+};