@100mslive/roomkit-react 0.1.8-alpha.0 → 0.1.9-alpha.0

package/dist/Modal/Dialog.d.ts

@@ -1,7 +1,8 @@
-/// <reference types="react" />
+import React, { ReactNode } from 'react';
+import { CSS } from '../Theme';
 export declare const Dialog: {
-    Root: import("@stitches/react/types/styled-component").StyledComponent<import("react").FC<import("@radix-ui/react-dialog").DialogProps>, {}, {}, import("@stitches/react/types/css-util").CSS<{}, {}, {}, {}>>;
-    Trigger: import("@stitches/react/types/styled-component").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTriggerProps & import("react").RefAttributes<HTMLButtonElement>>, {}, {
+    Root: import("@stitches/react/types/styled-component").StyledComponent<React.FC<import("@radix-ui/react-dialog").DialogProps>, {}, {}, import("@stitches/react/types/css-util").CSS<{}, {}, {}, {}>>;
+    Trigger: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTriggerProps & React.RefAttributes<HTMLButtonElement>>, {}, {
         allowMotion: string;
         sm: string;
         md: string;
@@ -440,7 +441,15 @@ export declare const Dialog: {
             };
         };
     }>>;
-    Overlay: import("@stitches/react/types/styled-component").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogOverlayProps & import("react").RefAttributes<HTMLDivElement>>, {}, {
+    Overlay: ({ css }: {
+        css?: CSS | undefined;
+    }) => React.JSX.Element;
+    Content: ({ children, props, css }: {
+        children: ReactNode;
+        props?: any;
+        css?: CSS | undefined;
+    }) => React.JSX.Element;
+    Title: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTitleProps & React.RefAttributes<HTMLHeadingElement>>, {}, {
         allowMotion: string;
         sm: string;
         md: string;
@@ -879,7 +888,7 @@ export declare const Dialog: {
             };
         };
     }>>;
-    Content: import("@stitches/react/types/styled-component").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogContentProps & import("react").RefAttributes<HTMLDivElement>>, {}, {
+    Description: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogDescriptionProps & React.RefAttributes<HTMLParagraphElement>>, {}, {
         allowMotion: string;
         sm: string;
         md: string;
@@ -1318,7 +1327,7 @@ export declare const Dialog: {
             };
         };
     }>>;
-    Title: import("@stitches/react/types/styled-component").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogTitleProps & import("react").RefAttributes<HTMLHeadingElement>>, {}, {
+    Close: import("@stitches/react/types/styled-component").StyledComponent<React.ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogCloseProps & React.RefAttributes<HTMLButtonElement>>, {}, {
         allowMotion: string;
         sm: string;
         md: string;
@@ -1757,15 +1766,11 @@ export declare const Dialog: {
             };
         };
     }>>;
-    Description: import("@stitches/react/types/styled-component").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogDescriptionProps & import("react").RefAttributes<HTMLParagraphElement>>, {}, {
-        allowMotion: string;
-        sm: string;
-        md: string;
-        lg: string;
-        xl: string;
-        '2xl': string;
-        ls: string;
-    }, import("@stitches/react/types/css-util").CSS<{
+    DefaultClose: (props: Omit<Omit<React.DetailedHTMLProps<React.ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
+        ref?: ((instance: HTMLButtonElement | null) => void) | React.RefObject<HTMLButtonElement> | null | undefined;
+    }, "css" | "active"> & import("@stitches/react/types/styled-component").TransformProps<{
+        active?: boolean | "true" | "false" | undefined;
+    }, {
         allowMotion: string;
         sm: string;
         md: string;
@@ -1773,1750 +1778,441 @@ export declare const Dialog: {
         xl: string;
         '2xl': string;
         ls: string;
-    }, {
-        colors: {
-            primary_default: string;
-            primary_bright: string;
-            primary_dim: string;
-            primary_disabled: string;
-            on_primary_high: string;
-            on_primary_medium: string;
-            on_primary_low: string;
-            secondary_default: string;
-            secondary_bright: string;
-            secondary_dim: string;
-            secondary_disabled: string;
-            on_secondary_high: string;
-            on_secondary_medium: string;
-            on_secondary_low: string;
-            background_default: string;
-            background_dim: string;
-            surface_default: string;
-            surface_bright: string;
-            surface_brighter: string;
-            surface_dim: string;
-            on_surface_high: string;
-            on_surface_medium: string;
-            on_surface_low: string;
-            border_default: string;
-            border_bright: string;
-            alert_success: string;
-            alert_warning: string;
-            alert_error_default: string;
-            alert_error_bright: string;
-            alert_error_brighter: string;
-            alert_error_dim: 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;
+    }> & {
+        css?: import("@stitches/react/types/css-util").CSS<{
+            allowMotion: 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";
+            '2xl': string;
+            ls: string;
+        }, {
+            colors: {
+                primary_default: string;
+                primary_bright: string;
+                primary_dim: string;
+                primary_disabled: string;
+                on_primary_high: string;
+                on_primary_medium: string;
+                on_primary_low: string;
+                secondary_default: string;
+                secondary_bright: string;
+                secondary_dim: string;
+                secondary_disabled: string;
+                on_secondary_high: string;
+                on_secondary_medium: string;
+                on_secondary_low: string;
+                background_default: string;
+                background_dim: string;
+                surface_default: string;
+                surface_bright: string;
+                surface_brighter: string;
+                surface_dim: string;
+                on_surface_high: string;
+                on_surface_medium: string;
+                on_surface_low: string;
+                border_default: string;
+                border_bright: string;
+                alert_success: string;
+                alert_warning: string;
+                alert_error_default: string;
+                alert_error_bright: string;
+                alert_error_brighter: string;
+                alert_error_dim: string;
             };
-        };
-        pl: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            paddingLeft: string | number | {
-                readonly [$$ScaleValue]: "space";
+            shadows: {
+                sm: string;
+                md: string;
             };
-        };
-        px: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            paddingLeft: string | number | {
-                readonly [$$ScaleValue]: "space";
+            fonts: {
+                sans: string;
             };
-            paddingRight: string | number | {
-                readonly [$$ScaleValue]: "space";
+            fontSizes: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+                tiny: string;
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
             };
-        };
-        py: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            paddingTop: string | number | {
-                readonly [$$ScaleValue]: "space";
+            fontWeights: {
+                semiBold: number;
+                medium: number;
+                regular: number;
             };
-            paddingBottom: string | number | {
-                readonly [$$ScaleValue]: "space";
+            lineHeights: {
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+                tiny: string;
+                xs: string;
+                sm: string;
+                md: string;
             };
-        };
-        m: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            margin: string | number | {
-                readonly [$$ScaleValue]: "space";
+            radii: {
+                '0': string;
+                '1': string;
+                '2': string;
+                '3': string;
+                '4': string;
+                round: string;
             };
-        };
-        mt: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            marginTop: string | number | {
-                readonly [$$ScaleValue]: "space";
+            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;
             };
-        };
-        mr: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            marginRight: string | number | {
-                readonly [$$ScaleValue]: "space";
+            borderWidths: {
+                light: string;
+                normal: string;
+                bold: string;
+                extrabold: string;
+                black: string;
             };
-        };
-        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";
-            };
-        };
-    }>>;
-    Close: import("@stitches/react/types/styled-component").StyledComponent<import("react").ForwardRefExoticComponent<import("@radix-ui/react-dialog").DialogCloseProps & import("react").RefAttributes<HTMLButtonElement>>, {}, {
-        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: {
-            primary_default: string;
-            primary_bright: string;
-            primary_dim: string;
-            primary_disabled: string;
-            on_primary_high: string;
-            on_primary_medium: string;
-            on_primary_low: string;
-            secondary_default: string;
-            secondary_bright: string;
-            secondary_dim: string;
-            secondary_disabled: string;
-            on_secondary_high: string;
-            on_secondary_medium: string;
-            on_secondary_low: string;
-            background_default: string;
-            background_dim: string;
-            surface_default: string;
-            surface_bright: string;
-            surface_brighter: string;
-            surface_dim: string;
-            on_surface_high: string;
-            on_surface_medium: string;
-            on_surface_low: string;
-            border_default: string;
-            border_bright: string;
-            alert_success: string;
-            alert_warning: string;
-            alert_error_default: string;
-            alert_error_bright: string;
-            alert_error_brighter: string;
-            alert_error_dim: 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";
-            };
-        };
-    }>>;
-    DefaultClose: (props: Omit<Omit<import("react").DetailedHTMLProps<import("react").ButtonHTMLAttributes<HTMLButtonElement>, HTMLButtonElement>, "ref"> & {
-        ref?: ((instance: HTMLButtonElement | null) => void) | import("react").RefObject<HTMLButtonElement> | null | undefined;
-    }, "css" | "active"> & import("@stitches/react/types/styled-component").TransformProps<{
-        active?: boolean | "true" | "false" | 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: {
-                primary_default: string;
-                primary_bright: string;
-                primary_dim: string;
-                primary_disabled: string;
-                on_primary_high: string;
-                on_primary_medium: string;
-                on_primary_low: string;
-                secondary_default: string;
-                secondary_bright: string;
-                secondary_dim: string;
-                secondary_disabled: string;
-                on_secondary_high: string;
-                on_secondary_medium: string;
-                on_secondary_low: string;
-                background_default: string;
-                background_dim: string;
-                surface_default: string;
-                surface_bright: string;
-                surface_brighter: string;
-                surface_dim: string;
-                on_surface_high: string;
-                on_surface_medium: string;
-                on_surface_low: string;
-                border_default: string;
-                border_bright: string;
-                alert_success: string;
-                alert_warning: string;
-                alert_error_default: string;
-                alert_error_bright: string;
-                alert_error_brighter: string;
-                alert_error_dim: 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;
-    }) => import("react").JSX.Element;
-    Portal: import("@stitches/react/types/styled-component").StyledComponent<import("react").FC<import("@radix-ui/react-dialog").DialogPortalProps>, {}, {
-        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: {
-            primary_default: string;
-            primary_bright: string;
-            primary_dim: string;
-            primary_disabled: string;
-            on_primary_high: string;
-            on_primary_medium: string;
-            on_primary_low: string;
-            secondary_default: string;
-            secondary_bright: string;
-            secondary_dim: string;
-            secondary_disabled: string;
-            on_secondary_high: string;
-            on_secondary_medium: string;
-            on_secondary_low: string;
-            background_default: string;
-            background_dim: string;
-            surface_default: string;
-            surface_bright: string;
-            surface_brighter: string;
-            surface_dim: string;
-            on_surface_high: string;
-            on_surface_medium: string;
-            on_surface_low: string;
-            border_default: string;
-            border_bright: string;
-            alert_success: string;
-            alert_warning: string;
-            alert_error_default: string;
-            alert_error_bright: string;
-            alert_error_brighter: string;
-            alert_error_dim: 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: {
+        }, {
+            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: {
+            c: (value: {
                 readonly [$$PropertyValue]: "color";
+            }) => {
+                color: {
+                    readonly [$$PropertyValue]: "color";
+                };
             };
-        };
-        r: (value: {
-            readonly [$$ScaleValue]: "radii";
-        }) => {
-            borderRadius: {
+            r: (value: {
                 readonly [$$ScaleValue]: "radii";
+            }) => {
+                borderRadius: {
+                    readonly [$$ScaleValue]: "radii";
+                };
             };
-        };
-        fs: (value: string | number | {
-            readonly [$$PropertyValue]: "fontSize";
-        }) => {
-            fontSize: string | number | {
+            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 | {
+            size: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                height: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                width: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        pr: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            paddingRight: string | number | {
+            w: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                width: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        pb: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            paddingBottom: string | number | {
+            h: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                height: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        pl: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            paddingLeft: string | number | {
+            p: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                padding: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        px: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            paddingLeft: string | number | {
+            pt: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-            paddingRight: string | number | {
+            pr: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        py: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            paddingTop: string | number | {
+            pb: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-            paddingBottom: string | number | {
+            pl: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        m: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            margin: string | number | {
+            px: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                paddingRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        mt: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            marginTop: string | number | {
+            py: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                paddingTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                paddingBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        mr: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            marginRight: string | number | {
+            m: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                margin: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        mb: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            marginBottom: string | number | {
+            mt: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                marginTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        ml: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            marginLeft: string | number | {
+            mr: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                marginRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        mx: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            marginLeft: string | number | {
+            mb: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                marginBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-            marginRight: string | number | {
+            ml: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                marginLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-        my: (value: string | number | {
-            readonly [$$ScaleValue]: "space";
-        }) => {
-            marginTop: string | number | {
+            mx: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                marginLeft: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                marginRight: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-            marginBottom: string | number | {
+            my: (value: string | number | {
                 readonly [$$ScaleValue]: "space";
+            }) => {
+                marginTop: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
+                marginBottom: string | number | {
+                    readonly [$$ScaleValue]: "space";
+                };
             };
-        };
-    }>>;
+        }> | undefined;
+    }) => React.JSX.Element;
+    Portal: ({ children, container }: {
+        children: ReactNode;
+        container?: HTMLElement | null | undefined;
+    }) => React.JSX.Element;
 };