gd-design-library 1.0.2 → 1.2.0

package/hooks/useTheme/NoOpTheme.d.ts

@@ -0,0 +1,4050 @@
+import { ITheme } from './useTheme.types';
+export declare class NoOpTheme implements ITheme {
+    theme: {
+        separator: {
+            default: {
+                alignItems: string;
+                justifyItems: string;
+                gap: string | number;
+            };
+            horizontal: {
+                width: string;
+                display: string;
+                flexDirection: import('../../types').FlexDirection;
+            };
+            vertical: {
+                height: string;
+                display: string;
+                flexDirection: import('../../types').FlexDirection;
+            };
+            line: {
+                default: {};
+                horizontal: {
+                    width: string;
+                };
+                vertical: {
+                    height: string;
+                };
+            };
+            label: {
+                default: {};
+                attrs: {
+                    xs: {
+                        $variant: import('../../types').TypographyVariant;
+                        $as: import('../../types').TypographyVariant;
+                    };
+                    sm: {
+                        $variant: import('../../types').TypographyVariant;
+                        $as: import('../../types').TypographyVariant;
+                    };
+                    md: {
+                        $variant: import('../../types').TypographyVariant;
+                        $as: import('../../types').TypographyVariant;
+                    };
+                    lg: {
+                        $variant: import('../../types').TypographyVariant;
+                        $as: import('../../types').TypographyVariant;
+                    };
+                    xl: {
+                        $variant: import('../../types').TypographyVariant;
+                        $as: import('../../types').TypographyVariant;
+                    };
+                    xxl: {
+                        $variant: import('../../types').TypographyVariant;
+                        $as: import('../../types').TypographyVariant;
+                    };
+                };
+            };
+        };
+        draganddrop: {
+            default: {
+                position: string;
+            };
+            dragAndDropArea: {
+                default: {
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    border: (theme: Record<symbol, unknown>) => string;
+                    borderRadius: (theme: Record<symbol, unknown>) => string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    '&:hover': {
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                        border: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                disabled: {
+                    '&, &:hover': {
+                        cursor: string;
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                error: {
+                    border: (theme: Record<symbol, unknown>) => string;
+                };
+                loading: {
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    cursor: string;
+                };
+            };
+            dragOverContent: {
+                default: {
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    width: string;
+                    height: string;
+                    display: string;
+                    justifyContent: string;
+                    alignItems: string;
+                    border: (theme: Record<symbol, unknown>) => string;
+                    borderRadius: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            uploadIcon: {
+                default: {
+                    name: string;
+                    width: number;
+                    height: number;
+                };
+                disabled: {
+                    fill: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            contentTypography: {
+                default: {
+                    margin: (theme: Record<symbol, unknown>) => string;
+                };
+                disabled: {
+                    color: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+        };
+        avatar: {
+            default: {
+                borderRadius: string;
+                position: string;
+                width: number;
+                height: number;
+            };
+            imageWrapper: {
+                default: {
+                    borderRadius: string;
+                    overflow: string;
+                    height: string;
+                    width: string;
+                    alignContent: string;
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            badge: {
+                default: {
+                    position: string;
+                    borderRadius: string;
+                    width: number;
+                    height: number;
+                    border: string;
+                    top: number;
+                    right: number;
+                };
+                size: {
+                    xs: {
+                        width: number;
+                        height: number;
+                        border: string;
+                        top: number;
+                        right: number;
+                    };
+                    sm: {
+                        width: number;
+                        height: number;
+                        border: string;
+                        top: number;
+                        right: number;
+                    };
+                    md: {
+                        width: number;
+                        height: number;
+                        border: string;
+                        top: number;
+                        right: number;
+                    };
+                    lg: {
+                        width: number;
+                        height: number;
+                        border: string;
+                        top: number;
+                        right: number;
+                    };
+                    xl: {
+                        width: number;
+                        height: number;
+                        border: string;
+                        top: number;
+                        right: number;
+                    };
+                };
+            };
+            fallbackText: {
+                default: {
+                    overflow: string;
+                    textOverflow: string;
+                    whiteSpace: string;
+                };
+                attrs: {
+                    default: {
+                        variant: import('../../types').TypographyVariant;
+                        align: import('../../types').TextAlign;
+                    };
+                    size: {
+                        xs: {
+                            variant: import('../../types').TypographyVariant;
+                        };
+                        sm: {
+                            variant: import('../../types').TypographyVariant;
+                        };
+                        md: {
+                            variant: import('../../types').TypographyVariant;
+                        };
+                        lg: {
+                            variant: import('../../types').TypographyVariant;
+                        };
+                        xl: {
+                            variant: import('../../types').TypographyVariant;
+                        };
+                    };
+                };
+            };
+            size: {
+                xs: {
+                    width: number;
+                    height: number;
+                };
+                sm: {
+                    width: number;
+                    height: number;
+                };
+                md: {
+                    width: number;
+                    height: number;
+                };
+                lg: {
+                    width: number;
+                    height: number;
+                };
+                xl: {
+                    width: number;
+                    height: number;
+                };
+            };
+        };
+        chatbubble: {
+            default: {
+                display: string;
+                flexDirection: import('../../types').FlexDirection;
+                gap: (theme: Record<symbol, unknown>) => string;
+                clear: string;
+                margin: (theme: Record<symbol, unknown>) => string;
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+            };
+            question: {
+                default: {
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    float: string;
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                };
+                xs: {
+                    maxWidth: string;
+                };
+                sm: {
+                    maxWidth: string;
+                };
+                md: {
+                    maxWidth: string;
+                };
+                lg: {
+                    maxWidth: string;
+                };
+            };
+            answer: {
+                default: {
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    width: string;
+                };
+            };
+            pending: {};
+            fulfilled: {};
+            rejected: {};
+            content: {
+                default: {
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    display: string;
+                    flexDirection: import('../../types').FlexDirection;
+                };
+                pending: {
+                    alignItems: string;
+                };
+                fulfilled: {};
+                rejected: {};
+            };
+            actions: {
+                display: string;
+                flexDirection: import('../../types').FlexDirection;
+            };
+            loader: {
+                props: {
+                    name: string;
+                    size: string;
+                    withWrapper: boolean;
+                };
+            };
+        };
+        draganddropfiles: {
+            default: {};
+        };
+        searchModal: {
+            default: {};
+            wrapper: {
+                padding: (theme: Record<symbol, unknown>) => string;
+                overflowY: string;
+            };
+            input: {
+                default: {
+                    '& input[type="search"]': {
+                        padding: (theme: Record<symbol, unknown>) => string;
+                        height: string;
+                        fontSize: (theme: Record<symbol, unknown>) => string;
+                        '&::placeholder': {
+                            color: (theme: Record<symbol, unknown>) => string;
+                        };
+                        '&::-webkit-search-cancel-button': {
+                            appearance: string;
+                        };
+                        '&::-ms-clear': {
+                            display: string;
+                        };
+                    };
+                };
+                endIcon: {
+                    margin: (theme: Record<symbol, unknown>) => string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    cursor: string;
+                };
+                icons: {
+                    close: {
+                        name: string;
+                        width: number;
+                        height: number;
+                    };
+                };
+            };
+            loader: {
+                default: {
+                    display: string;
+                    flexDirection: import('../../types').FlexDirection;
+                    gap: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            items: {
+                default: {
+                    display: string;
+                    flexDirection: import('../../types').FlexDirection;
+                };
+                newSearchBtn: {
+                    styles: {
+                        textAlign: string;
+                        color: (theme: Record<symbol, unknown>) => string;
+                        padding: (theme: Record<symbol, unknown>) => string;
+                        fontSize: (theme: Record<symbol, unknown>) => string;
+                        fontWeight: (theme: Record<symbol, unknown>) => string;
+                        lineHeight: (theme: Record<symbol, unknown>) => string;
+                        '.gd-button__content': {
+                            justifyContent: string;
+                        };
+                    };
+                    attrs: {
+                        variant: import('../../types').ButtonVariant;
+                    };
+                };
+                noResult: {
+                    display: string;
+                    flexDirection: import('../../types').FlexDirection;
+                    alignItems: string;
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                    lineHeight: (theme: Record<symbol, unknown>) => string;
+                };
+                groupTitle: {
+                    textAlign: string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                    lineHeight: (theme: Record<symbol, unknown>) => string;
+                };
+                item: {
+                    styles: {
+                        textAlign: string;
+                        gap: (theme: Record<symbol, unknown>) => string;
+                        padding: (theme: Record<symbol, unknown>) => string;
+                        color: (theme: Record<symbol, unknown>) => string;
+                        '.gd-button__content': {
+                            display: string;
+                        };
+                        fontSize: (theme: Record<symbol, unknown>) => string;
+                        fontWeight: (theme: Record<symbol, unknown>) => string;
+                        lineHeight: (theme: Record<symbol, unknown>) => string;
+                    };
+                    attrs: {
+                        variant: import('../../types').ButtonVariant;
+                    };
+                };
+                itemRow: {
+                    alignItems: string;
+                    justifyContent: string;
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    flexWrap: string;
+                };
+                itemColumn: {
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    minWidth: number;
+                    flexWrap: string;
+                };
+                itemContent: {
+                    default: {};
+                    title: {
+                        flex: number;
+                        minWidth: number;
+                        whiteSpace: string;
+                        textOverflow: string;
+                        overflow: string;
+                    };
+                    description: {
+                        flex: number;
+                        minWidth: number;
+                        whiteSpace: string;
+                        textOverflow: string;
+                        overflow: string;
+                        color: (theme: Record<symbol, unknown>) => string;
+                    };
+                    date: {
+                        flex: string;
+                        whiteSpace: string;
+                        color: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                icons: {
+                    newChat: {
+                        width: number;
+                        height: number;
+                        name: string;
+                    };
+                    noResults: {
+                        width: number;
+                        height: number;
+                        name: string;
+                    };
+                    item: {
+                        width: number;
+                        height: number;
+                    };
+                };
+            };
+        };
+        inputfile: {
+            default: {
+                overflow: string;
+                position: string;
+            };
+            input: {
+                opacity: number;
+                inset: number;
+                width: string;
+                height: string;
+                position: string;
+                zIndex: (theme: Record<symbol, unknown>) => string;
+            };
+        };
+        carousel: {
+            default: {};
+            container: {
+                default: {
+                    position: string;
+                    overflow: string;
+                    width: string;
+                    display: string;
+                    zIndex: (theme: Record<symbol, unknown>) => string;
+                    gap: string;
+                };
+                variant: {
+                    cards: {
+                        gap: string;
+                    };
+                    single: {
+                        '.embla__slide': {
+                            padding: number;
+                        };
+                    };
+                };
+                layout: {
+                    horizontal: {
+                        flexDirection: string;
+                    };
+                    vertical: {
+                        flexDirection: string;
+                        height: string;
+                    };
+                };
+            };
+            contentContainer: {
+                flexDirection: string;
+                height: string;
+                width: string;
+                position: string;
+                justifyContent: string;
+                alignItems: string;
+                zIndex: string;
+            };
+            carouselViewport: {
+                overflow: string;
+            };
+            carouselViewportSlideWrapper: {
+                display: string;
+            };
+            carouselSlide: {
+                flex: (theme: Record<symbol, unknown>) => string;
+                width: string;
+                padding: (theme: Record<symbol, unknown>) => string;
+                '& img': {
+                    width: string;
+                    height: string;
+                    objectFit: string;
+                    borderRadius: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            footer: {
+                display: string;
+                justifyContent: string;
+                alignItems: string;
+            };
+            footerControls: {
+                display: string;
+            };
+            contentSlide: {
+                display: string;
+                paddingLeft: (theme: Record<symbol, unknown>) => string;
+                '&:first-of-type': {
+                    paddingLeft: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            carouselControlsWrapper: {
+                position: string;
+            };
+            carouselControls: {
+                display: string;
+                justifyContent: string;
+                alignItems: string;
+                position: string;
+                top: string;
+                left: (theme: Record<symbol, unknown>) => string;
+                transform: string;
+                width: string;
+                padding: string;
+                zIndex: (theme: Record<symbol, unknown>) => string;
+            };
+            carouselDots: {
+                display: string;
+                justifyContent: string;
+                gap: string;
+                marginTop: string;
+            };
+            carouselDot: {
+                default: {
+                    width: string;
+                    height: string;
+                    border: string;
+                    cursor: string;
+                    transition: string;
+                };
+                active: {
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    width: string;
+                    '&:hover': {};
+                };
+                nonActive: {
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    '&:hover': {};
+                };
+            };
+            carouselThumbs: {
+                default: {
+                    display: string;
+                    justifyContent: string;
+                    gap: string;
+                };
+                vertical: {
+                    flexDirection: import('../../types').FlexDirection;
+                    flex: string;
+                    overflowX: string;
+                    alignItems: string;
+                };
+                horizontal: {
+                    overflowX: string;
+                };
+            };
+            carouselThumbsViewport: {
+                default: {
+                    overflow: string;
+                };
+                vertical: {
+                    maxHeight: string;
+                };
+                horizontal: {
+                    width: string;
+                };
+            };
+            carouselThumbsWrapper: {
+                default: {};
+                vertical: {
+                    display: string;
+                    height: string;
+                };
+                horizontal: {
+                    display: string;
+                };
+            };
+            carouselThumb: {
+                default: {
+                    minWidth: string;
+                    minHeight: string;
+                    border: string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    background: string;
+                    cursor: string;
+                    opacity: number;
+                    transition: string;
+                    '&:hover': {
+                        opacity: number;
+                    };
+                };
+                active: {
+                    opacity: number;
+                };
+                vertical: {
+                    height: string;
+                };
+                horizontal: {
+                    marginLeft: string;
+                };
+            };
+            controlsButton: {
+                default: {
+                    width: (theme: Record<symbol, unknown>) => string;
+                    height: (theme: Record<symbol, unknown>) => string;
+                };
+                attrs: {
+                    variant: import('../../types').ButtonVariant;
+                    isIcon: boolean;
+                };
+            };
+            icons: {
+                base: {
+                    width: number;
+                    height: number;
+                };
+                controlLeft: {
+                    name: string;
+                };
+                controlRight: {
+                    name: string;
+                };
+            };
+        };
+        progressbar: {
+            styledProgressBar: {
+                default: {
+                    width: string;
+                    display: string;
+                };
+            };
+            styledTrack: {
+                default: {
+                    position: string;
+                    width: string;
+                    height: (theme: Record<symbol, unknown>) => string;
+                    overflow: string;
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            styledDeterminateFill: {
+                default: {
+                    display: string;
+                    alignItems: string;
+                    justifyContent: string;
+                    paddingRight: (theme: Record<symbol, unknown>) => string;
+                    whiteSpace: string;
+                    height: string;
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    transition: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            styledIndeterminateFill: {
+                default: {
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    width: string;
+                    height: string;
+                };
+            };
+            styledIndeterminateFillAnimations: {
+                animationName: string;
+                animationProps: string;
+            };
+            styledPercentLabel: {
+                default: {
+                    display: string;
+                    alignItems: string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                    height: string;
+                    userSelect: string;
+                };
+            };
+        };
+        card: {
+            default: {};
+            title: {
+                default: (theme: Record<symbol, unknown>) => {
+                    margin: string;
+                    padding: string;
+                };
+                vertical: {
+                    default: {};
+                    sm: {};
+                };
+                horizontal: {
+                    default: {};
+                    sm: {};
+                };
+            };
+            description: {
+                default: (theme: Record<symbol, unknown>) => {
+                    margin: string;
+                    padding: string;
+                };
+                vertical: {
+                    default: {};
+                    sm: {};
+                };
+                horizontal: {
+                    default: {};
+                    sm: {};
+                };
+            };
+            rating: {
+                default: (theme: Record<symbol, unknown>) => {
+                    display: string;
+                    alignItems: string;
+                    gap: string;
+                };
+                vertical: {
+                    default: (theme: Record<symbol, unknown>) => {
+                        color: string;
+                        fontSize: string;
+                        fontWeight: string;
+                        lineHeight: string;
+                    };
+                    sm: (theme: Record<symbol, unknown>) => {
+                        color: string;
+                        flexDirection: string;
+                        fontSize: string;
+                        fontWeight: string;
+                        lineHeight: string;
+                    };
+                };
+                horizontal: {
+                    default: (theme: Record<symbol, unknown>) => {
+                        color: string;
+                        fontSize: string;
+                        fontWeight: string;
+                        lineHeight: string;
+                    };
+                    sm: (theme: Record<symbol, unknown>) => {
+                        color: string;
+                        flexDirection: string;
+                        fontSize: string;
+                        fontWeight: string;
+                        lineHeight: string;
+                    };
+                };
+            };
+            button: {
+                default: {
+                    display: string;
+                };
+                vertical: {
+                    default: {};
+                    sm: {};
+                };
+                horizontal: {
+                    default: {};
+                    sm: {};
+                };
+            };
+            image: {
+                default: {};
+                vertical: {
+                    default: {};
+                    sm: {};
+                };
+                horizontal: {
+                    default: {};
+                    sm: {};
+                };
+            };
+            counter: {
+                default: {};
+                vertical: {
+                    default: {};
+                    sm: {};
+                };
+                horizontal: {
+                    default: {};
+                    sm: {};
+                };
+            };
+            price: {
+                default: {
+                    display: string;
+                };
+                vertical: {
+                    default: {};
+                    sm: (theme: Record<symbol, unknown>) => {
+                        '& > div > *': {
+                            fontSize: string;
+                            fontWeight: string;
+                            lineHeight: string;
+                            marginTop: string;
+                            marginBottom: string;
+                        };
+                    };
+                };
+                horizontal: {
+                    default: {};
+                    sm: (theme: Record<symbol, unknown>) => {
+                        '& > div > *': {
+                            fontSize: string;
+                            fontWeight: string;
+                            lineHeight: string;
+                            marginTop: string;
+                            marginBottom: string;
+                        };
+                    };
+                };
+            };
+        };
+        counter: {
+            default: {
+                display: string;
+                width: string;
+                '& input': {
+                    width: string;
+                    textAlign: import('../../types').TextAlign;
+                };
+            };
+            navButton: {
+                default: {
+                    padding: string | number;
+                    borderWidth: (theme: Record<symbol, unknown>) => string;
+                    '&:disabled': {
+                        opacity: number;
+                        backgroundColor: string;
+                        borderWidth: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                attrs: {
+                    variant: import('../../types').ButtonVariant;
+                    isIcon: boolean;
+                };
+            };
+            icons: {
+                plus: {
+                    name: string;
+                    width: number;
+                    height: number;
+                };
+                minus: {
+                    name: string;
+                    width: number;
+                    height: number;
+                };
+            };
+        };
+        name: string;
+        spacing: {
+            none: number;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            xxl: string;
+        };
+        space: {
+            '0': string;
+            '050': string;
+            '100': string;
+            '150': string;
+            '200': string;
+            '300': string;
+            '400': string;
+            '500': string;
+            '600': string;
+            '700': string;
+            '800': string;
+            '900': string;
+            '1000': string;
+        };
+        scale: {
+            '050': string;
+            '100': string;
+            '200': string;
+            '300': string;
+            '400': string;
+            '500': string;
+        };
+        reset: {};
+        typography: {
+            base: {
+                fontFamily: (theme: Record<symbol, unknown>) => string;
+            };
+            span: {
+                fontSize: string;
+                fontWeight: string;
+                lineHeight: string;
+            };
+            h1: {
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+                marginTop: (theme: Record<symbol, unknown>) => string;
+                marginBottom: (theme: Record<symbol, unknown>) => string;
+            };
+            h2: {
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+                marginTop: (theme: Record<symbol, unknown>) => string;
+                marginBottom: (theme: Record<symbol, unknown>) => string;
+            };
+            h3: {
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+                marginTop: (theme: Record<symbol, unknown>) => string;
+                marginBottom: (theme: Record<symbol, unknown>) => string;
+            };
+            h4: {
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+                marginTop: (theme: Record<symbol, unknown>) => string;
+                marginBottom: (theme: Record<symbol, unknown>) => string;
+            };
+            h5: {
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+                marginTop: (theme: Record<symbol, unknown>) => string;
+                marginBottom: (theme: Record<symbol, unknown>) => string;
+            };
+            h6: {
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+                marginTop: (theme: Record<symbol, unknown>) => string;
+                marginBottom: (theme: Record<symbol, unknown>) => string;
+            };
+            strong: {
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+            };
+            i: {
+                fontStyle: string;
+            };
+            p: {
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+            };
+            small: {
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+            };
+            caption: {
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+            };
+            header: {
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+            };
+            code: {
+                fontFamily: (theme: Record<symbol, unknown>) => string;
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+            };
+            kbd: {
+                fontFamily: (theme: Record<symbol, unknown>) => string;
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+            };
+            div: {
+                xs: {
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    lineHeight: (theme: Record<symbol, unknown>) => string;
+                };
+                sm: {
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    lineHeight: (theme: Record<symbol, unknown>) => string;
+                };
+                md: {
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    lineHeight: (theme: Record<symbol, unknown>) => string;
+                };
+                lg: {
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    lineHeight: (theme: Record<symbol, unknown>) => string;
+                };
+                xl: {
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    lineHeight: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            styleVariant: {
+                light: {
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                };
+                normal: {
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                };
+                semibold: {
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                };
+                bold: {
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                };
+                italic: {
+                    fontStyle: string;
+                };
+                small: {
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                };
+                uppercase: {
+                    textTransform: string;
+                };
+                lowercase: {
+                    textTransform: string;
+                };
+                underline: {
+                    textDecoration: string;
+                };
+                strike: {
+                    textDecoration: string;
+                };
+            };
+        };
+        button: {
+            default: {
+                border: number;
+                outline: number;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                padding: (theme: Record<symbol, unknown>) => string;
+                display: string;
+                alignItems: string;
+                gap: (theme: Record<symbol, unknown>) => string;
+                transition: (theme: Record<symbol, unknown>) => string;
+                cursor: string;
+                '&:focus-visible': (theme: Record<symbol, unknown>) => {
+                    position: string;
+                    '&::after': {
+                        content: string;
+                        position: string;
+                        top: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                        right: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                        bottom: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                        left: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                        border: string;
+                        borderRadius: `${number}px` | `${number}rem` | `${number}%` | `${number}em` | undefined;
+                    };
+                };
+                '&:disabled, &:disabled *': {
+                    cursor: string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            attrs: {
+                rounded: string;
+            };
+            icon: {
+                padding: (theme: Record<symbol, unknown>) => string;
+                '& span': {
+                    display: string;
+                    justifyContent: string;
+                    alignItems: string;
+                };
+            };
+            content: {
+                default: {
+                    display: string;
+                    justifyContent: string;
+                    alignItems: string;
+                    width: string;
+                    minWidth: string;
+                };
+            };
+            fullWidth: {
+                width: string;
+            };
+            startIcon: {
+                default: {};
+            };
+            endIcon: {
+                default: {};
+            };
+            primary: {
+                color: (theme: Record<symbol, unknown>) => string;
+                background: (theme: Record<symbol, unknown>) => string;
+                '&:hover, &.hover': {
+                    background: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:active, &.active': {
+                    background: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:disabled, &.disabled': {
+                    background: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            secondary: {
+                color: (theme: Record<symbol, unknown>) => string;
+                background: (theme: Record<symbol, unknown>) => string;
+                '&:hover, &.hover': {
+                    background: (theme: Record<symbol, unknown>) => string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:active, &.active': {
+                    color: (theme: Record<symbol, unknown>) => string;
+                    background: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:disabled, &.disabled': {
+                    background: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            tertiary: {
+                background: string;
+                color: (theme: Record<symbol, unknown>) => string;
+                '&:hover, &.hover': {
+                    background: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:active, &.active': {
+                    background: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:disabled, &.disabled': {
+                    background: string;
+                };
+            };
+            outlined: {
+                background: string;
+                color: (theme: Record<symbol, unknown>) => string;
+                border: (theme: Record<symbol, unknown>) => string;
+                '&:hover, &.hover': {
+                    background: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:active, &.active': {
+                    color: (theme: Record<symbol, unknown>) => string;
+                    background: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:disabled, &.disabled': {
+                    background: string;
+                    borderColor: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            text: {
+                background: string;
+                color: (theme: Record<symbol, unknown>) => string;
+                '&:hover, &.hover': {
+                    color: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:active, &.active': {
+                    color: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            inherit: {
+                fontWeight: string;
+                '&:not(:disabled):active, &.active': {
+                    transform: string;
+                };
+                '&:hover, &.hover': {};
+                '&:disabled, &.disabled': {};
+            };
+        };
+        input: {
+            wrapper: {
+                default: {
+                    boxSizing: string;
+                    display: string;
+                    alignSelf: string;
+                    alignItems: string;
+                    borderRadius: number;
+                    position: string;
+                };
+                withGap: {
+                    flexDirection: import('../../types').FlexDirection;
+                    alignItems: string;
+                    gap: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            input: {
+                default: {
+                    borderRadius: number;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    outline: string;
+                    position: string;
+                    cursor: string;
+                    border: number;
+                    backgroundColor: string;
+                    '&::placeholder': {
+                        color: (theme: Record<symbol, unknown>) => string;
+                    };
+                    '&:not([type="radio"], [type="checkbox"], [type="range"])': {
+                        height: string;
+                        width: string;
+                        zIndex: (theme: Record<symbol, unknown>) => string;
+                    };
+                    '&[type="number"]': {
+                        appearance: string;
+                        '&::-webkit-outer-spin-button, &::-webkit-inner-spin-button': {
+                            appearance: string;
+                            margin: number;
+                        };
+                    };
+                    '&[readonly], &:disabled': {
+                        color: (theme: Record<symbol, unknown>) => string;
+                        cursor: string;
+                    };
+                    '&[type="checkbox"]': {
+                        cursor: string;
+                        appearance: string;
+                        height: string;
+                        width: string;
+                        backgroundColor: string;
+                        border: string;
+                        backgroundImage: string;
+                        '&:focus-visible': (theme: Record<symbol, unknown>) => {
+                            position: string;
+                            '&::after': {
+                                content: string;
+                                position: string;
+                                top: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                                right: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                                bottom: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                                left: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                                border: string;
+                                borderRadius: `${number}px` | `${number}rem` | `${number}%` | `${number}em` | undefined;
+                            };
+                        };
+                    };
+                    '&[type="checkbox"]:not(:checked)': {
+                        '&[readonly], &:disabled': {
+                            opacity: number;
+                        };
+                    };
+                    '&[type="checkbox"]:checked': {
+                        backgroundRepeat: string;
+                        backgroundPosition: string;
+                        backgroundSize: string;
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                        border: string;
+                        backgroundImage: string;
+                        '&[readonly], &:disabled': {
+                            backgroundImage: string;
+                        };
+                    };
+                    '&[type="radio"]': {
+                        cursor: string;
+                        appearance: string;
+                        height: string;
+                        width: string;
+                        border: string;
+                        backgroundImage: string;
+                        '&:focus-visible': {
+                            position: string;
+                            '&::after': {
+                                content: string;
+                                position: string;
+                                top: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                                right: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                                bottom: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                                left: `${number}px` | `${number}rem` | `${number}%` | `${number}em`;
+                                border: string;
+                                borderRadius: `${number}px` | `${number}rem` | `${number}%` | `${number}em` | undefined;
+                            };
+                        };
+                        '&[readonly], &:disabled': {
+                            opacity: number;
+                        };
+                    };
+                    '&[type="radio"]:checked': {
+                        backgroundImage: string;
+                    };
+                };
+                defaultInteraction: {
+                    "&:focus-visible ~ .Input__outline": {
+                        position: string;
+                        top: number;
+                        left: number;
+                        bottom: number;
+                        width: string;
+                        outline: string;
+                        outlineOffset: string;
+                    };
+                };
+                mouseInteraction: {};
+                primary: {
+                    "& + .Input__border": (theme: Record<symbol, unknown>) => {
+                        position: string;
+                        top: number;
+                        left: number;
+                        width: string;
+                        height: string;
+                        border: string;
+                    };
+                };
+                success: {
+                    "& + .Input__border": (theme: Record<symbol, unknown>) => {
+                        position: string;
+                        top: number;
+                        left: number;
+                        width: string;
+                        height: string;
+                        border: string;
+                    };
+                };
+                warning: {
+                    "& + .Input__border": (theme: Record<symbol, unknown>) => {
+                        position: string;
+                        top: number;
+                        left: number;
+                        width: string;
+                        height: string;
+                        border: string;
+                    };
+                };
+                error: {
+                    "& + .Input__border": (theme: Record<symbol, unknown>) => {
+                        position: string;
+                        top: number;
+                        left: number;
+                        width: string;
+                        height: string;
+                        border: string;
+                    };
+                };
+            };
+            helper: {
+                default: {
+                    sm: {
+                        fontSize: (theme: Record<symbol, unknown>) => string;
+                        fontWeight: (theme: Record<symbol, unknown>) => string;
+                        lineHeight: (theme: Record<symbol, unknown>) => string;
+                    };
+                    md: {
+                        color: (theme: Record<symbol, unknown>) => string;
+                        fontSize: (theme: Record<symbol, unknown>) => string;
+                        fontWeight: (theme: Record<symbol, unknown>) => string;
+                        lineHeight: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                primary: {
+                    sm: {
+                        color: (theme: Record<symbol, unknown>) => string;
+                    };
+                    md: {};
+                };
+                success: {
+                    sm: {
+                        color: (theme: Record<symbol, unknown>) => string;
+                    };
+                    md: {};
+                };
+                warning: {
+                    sm: {
+                        color: (theme: Record<symbol, unknown>) => string;
+                    };
+                    md: {};
+                };
+                error: {
+                    sm: {
+                        color: (theme: Record<symbol, unknown>) => string;
+                    };
+                    md: {};
+                };
+            };
+            adornment: {
+                default: {
+                    display: string;
+                    alignItems: string;
+                    position: string;
+                    zIndex: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+        };
+        label: {
+            default: {
+                cursor: string;
+                display: string;
+            };
+        };
+        flexContainer: {
+            default: {
+                display: string;
+                width: string;
+                margin: string;
+                flexDirection: import('../../types').FlexDirection;
+            };
+        };
+        link: {
+            default: {
+                fontFamily: (theme: Record<symbol, unknown>) => string;
+                fontSize: string;
+                fontWeight: string;
+                lineHeight: string;
+                color: (theme: Record<symbol, unknown>) => string;
+                position: string;
+                '&:visited': {
+                    color: (theme: Record<symbol, unknown>) => string;
+                    '&::after': {
+                        borderBottom: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                '&:focus, &:active, &:focus-visible': {
+                    outline: (theme: Record<symbol, unknown>) => string;
+                };
+                "&.Link--disabled": {
+                    color: (theme: Record<symbol, unknown>) => string;
+                    cursor: import('../../types').Cursors;
+                    textDecoration: string;
+                    backgroundColor: string;
+                    '&::after': {
+                        borderBottomColor: string;
+                    };
+                };
+            };
+            primary: {
+                '&::after': {
+                    content: string;
+                    position: string;
+                    right: (theme: Record<symbol, unknown>) => string;
+                    bottom: (theme: Record<symbol, unknown>) => string;
+                    left: (theme: Record<symbol, unknown>) => string;
+                    borderBottom: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:hover': {
+                    backgroundColor: string;
+                    '&::after': {
+                        borderBottomColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+            };
+            secondary: {
+                '&::after': {
+                    content: string;
+                    position: string;
+                    right: (theme: Record<symbol, unknown>) => string;
+                    bottom: (theme: Record<symbol, unknown>) => string;
+                    left: (theme: Record<symbol, unknown>) => string;
+                    borderBottom: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:hover': {
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    '&::after': {
+                        borderBottomColor: string;
+                    };
+                };
+            };
+            inverted: {
+                '&::after': {
+                    content: string;
+                    position: string;
+                    right: (theme: Record<symbol, unknown>) => string;
+                    bottom: (theme: Record<symbol, unknown>) => string;
+                    left: (theme: Record<symbol, unknown>) => string;
+                    borderBottom: (theme: Record<symbol, unknown>) => string;
+                };
+                '&:hover': {
+                    backgroundColor: string;
+                    '&::after': {
+                        borderBottomColor: string;
+                    };
+                };
+            };
+            inherit: {
+                color: string;
+            };
+        };
+        form: {
+            default: {};
+        };
+        wrapper: {
+            default: {
+                justifyContent: string;
+                alignItems: string;
+                backdropFilter: string;
+                backgroundColor: string;
+            };
+            inline: {
+                display: string;
+            };
+            section: {
+                display: string;
+                top: number;
+                left: number;
+                width: string;
+                height: string;
+                position: string;
+                zIndex: (theme: Record<symbol, unknown>) => string;
+            };
+            fullPage: {
+                display: string;
+                position: string;
+                top: number;
+                left: number;
+                width: string;
+                height: string;
+                zIndex: (theme: Record<symbol, unknown>) => string;
+            };
+        };
+        loader: {
+            default: {
+                display: string;
+            };
+            attrs: {
+                rounded: string;
+            };
+            inline: {};
+            section: {};
+            fullPage: {};
+            circle: {
+                default: {
+                    border: (theme: Record<symbol, unknown>) => string;
+                    borderTop: (theme: Record<symbol, unknown>) => string;
+                    borderRadius: (theme: Record<symbol, unknown>) => string;
+                };
+                xs: {
+                    borderWidth: string;
+                    width: string;
+                    height: string;
+                    minWidth: string;
+                    minHeight: string;
+                };
+                sm: {
+                    borderWidth: string;
+                    width: string;
+                    height: string;
+                    maxWidth: string;
+                    maxHeight: string;
+                };
+                md: {
+                    borderWidth: string;
+                    width: string;
+                    height: string;
+                    maxWidth: string;
+                    maxHeight: string;
+                };
+                lg: {
+                    borderWidth: string;
+                    width: string;
+                    height: string;
+                    maxWidth: string;
+                    maxHeight: string;
+                };
+                xl: {
+                    borderWidth: string;
+                    width: string;
+                    height: string;
+                    maxWidth: string;
+                    maxHeight: string;
+                };
+            };
+            dots: {
+                default: {
+                    display: string;
+                    justifyContent: string;
+                    alignItems: string;
+                };
+                xs: {
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    '.dot': {
+                        background: (theme: Record<symbol, unknown>) => string;
+                        width: string;
+                        height: string;
+                        '&:nth-of-type(1)': {
+                            animationDelay: string;
+                        };
+                        '&:nth-of-type(2)': {
+                            animationDelay: string;
+                        };
+                    };
+                };
+                sm: {
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    '.dot': {
+                        background: (theme: Record<symbol, unknown>) => string;
+                        width: string;
+                        height: string;
+                        '&:nth-of-type(1)': {
+                            animationDelay: string;
+                        };
+                        '&:nth-of-type(2)': {
+                            animationDelay: string;
+                        };
+                    };
+                };
+                md: {
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    '.dot': {
+                        background: (theme: Record<symbol, unknown>) => string;
+                        width: string;
+                        height: string;
+                        '&:nth-of-type(1)': {
+                            animationDelay: string;
+                        };
+                        '&:nth-of-type(2)': {
+                            animationDelay: string;
+                        };
+                    };
+                };
+                lg: {
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    '.dot': {
+                        background: (theme: Record<symbol, unknown>) => string;
+                        width: string;
+                        height: string;
+                        '&:nth-of-type(1)': {
+                            animationDelay: string;
+                        };
+                        '&:nth-of-type(2)': {
+                            animationDelay: string;
+                        };
+                    };
+                };
+                xl: {
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    '.dot': {
+                        background: (theme: Record<symbol, unknown>) => string;
+                        width: string;
+                        height: string;
+                        '&:nth-of-type(1)': {
+                            animationDelay: string;
+                        };
+                        '&:nth-of-type(2)': {
+                            animationDelay: string;
+                        };
+                    };
+                };
+            };
+            animation: {
+                circle: {
+                    name: string;
+                };
+                dots: {
+                    name: string;
+                };
+            };
+        };
+        display: {
+            flex: string;
+            inlineFlex: string;
+            grid: string;
+            block: string;
+            inline: string;
+            inlineBlock: string;
+            none: string;
+        };
+        cursors: {
+            default: string;
+            pointer: string;
+            text: string;
+            move: string;
+            wait: string;
+            crosshair: string;
+            notAllowed: string;
+            grab: string;
+            grabbing: string;
+            help: string;
+            progress: string;
+            alias: string;
+            zoomIn: string;
+            zoomOut: string;
+            inherit: string;
+        };
+        values: {
+            borderThin: string;
+            borderMedium: string;
+            borderThick: string;
+            borderNone: number;
+            border: {
+                radius: {
+                    none: string;
+                };
+            };
+            screenSmall: string;
+            screenMedium: string;
+            screenLarge: string;
+            screenXLarge: string;
+            responsiveSmall: string;
+            responsiveMedium: string;
+            responsiveLarge: string;
+            responsiveXLarge: string;
+            zIndex: {
+                snackbar: (theme: Record<symbol, unknown>) => string;
+            };
+            transitions: {
+                stepper: {
+                    separator: string;
+                    stepIcon: string;
+                };
+                button: {
+                    default: string;
+                };
+                scroll: {
+                    scrollbar: string;
+                    thumb: string;
+                };
+                rating: {
+                    label: string;
+                };
+                progressbar: {
+                    styledDeterminateFill: string;
+                };
+                accordion: {
+                    toggle: string;
+                    icon: string;
+                };
+                select: {
+                    arrowIconWrapper: string;
+                };
+                tabs: {
+                    label: string;
+                };
+                chat: {
+                    sidebar: string;
+                    sidebarWrapper: string;
+                };
+            };
+            transform: {
+                rotateUp: string;
+                rotateReset: string;
+            };
+            separator: {
+                thickness: {
+                    xs: string;
+                    sm: string;
+                    md: string;
+                    lg: string;
+                    xl: string;
+                    xxl: string;
+                };
+            };
+        };
+        flexAlignItems: {
+            start: string;
+            center: string;
+            end: string;
+            baseline: string;
+            stretch: string;
+        };
+        textarea: {
+            default: {
+                width: string;
+            };
+            outlined: {
+                primary: {
+                    '&:hover': {};
+                    '&:active': {};
+                    '&:focus': {};
+                    '&:disabled': {};
+                    '&:read-only': {};
+                };
+                secondary: {
+                    '&:hover': {};
+                    '&:active': {};
+                    '&:focus': {};
+                    '&:disabled': {};
+                    '&:read-only': {};
+                };
+                success: {
+                    '&:hover': {};
+                    '&:active': {};
+                    '&:focus': {};
+                    '&:disabled': {};
+                    '&:read-only': {};
+                };
+                warning: {
+                    '&:hover': {};
+                    '&:active': {};
+                    '&:focus': {};
+                    '&:disabled': {};
+                    '&:read-only': {};
+                };
+                error: {
+                    '&:hover': {};
+                    '&:active': {};
+                    '&:focus': {};
+                    '&:disabled': {};
+                    '&:read-only': {};
+                };
+            };
+            contained: {};
+            text: {};
+        };
+        image: {
+            default: {
+                width: string;
+                height: string;
+                transition: string;
+            };
+            wrapper: {
+                position: "relative";
+                display: string;
+                flexDirection: import('../../types').FlexDirection;
+                alignItems: string;
+            };
+            placeholder: {
+                position: string;
+                top: number;
+                left: number;
+                width: string;
+                height: string;
+                display: string;
+                alignItems: string;
+                justifyContent: string;
+                background: (theme: Record<symbol, unknown>) => string;
+            };
+            caption: {
+                marginTop: (theme: Record<symbol, unknown>) => string;
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                color: (theme: Record<symbol, unknown>) => string;
+                textAlign: import('../../types').TextAlign;
+            };
+        };
+        row: {
+            default: {
+                display: string;
+            };
+        };
+        switchToggle: {
+            default: {
+                display: string;
+                position: string;
+                padding: (theme: Record<symbol, unknown>) => string;
+                border: (theme: Record<symbol, unknown>) => string;
+            };
+            disabled: {};
+        };
+        column: {
+            default: {
+                maxWidth: string;
+                display: string;
+            };
+        };
+        tooltip: {
+            default: {
+                position: string;
+                display: string;
+                whiteSpace: string;
+                color: (theme: Record<symbol, unknown>) => string;
+                backgroundColor: (theme: Record<symbol, unknown>) => string;
+                padding: (theme: Record<symbol, unknown>) => string;
+                zIndex: (theme: Record<symbol, unknown>) => string;
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                lineHeight: (theme: Record<symbol, unknown>) => string;
+                '&::after': {
+                    position: string;
+                    content: string;
+                    border: string;
+                };
+                '&.tooltip-bottom': {
+                    transform: string;
+                    '&::after': {
+                        top: number;
+                        left: string;
+                        borderLeftColor: (theme: Record<symbol, unknown>) => string;
+                        borderTopColor: (theme: Record<symbol, unknown>) => string;
+                        transform: string;
+                    };
+                };
+                '&.tooltip-top': {
+                    transform: string;
+                    '&::after': {
+                        bottom: number;
+                        left: string;
+                        borderRightColor: (theme: Record<symbol, unknown>) => string;
+                        borderBottomColor: (theme: Record<symbol, unknown>) => string;
+                        transform: string;
+                    };
+                };
+                '&.tooltip-left': {
+                    transform: string;
+                    '&::after': {
+                        right: number;
+                        top: string;
+                        borderRightColor: (theme: Record<symbol, unknown>) => string;
+                        borderTopColor: (theme: Record<symbol, unknown>) => string;
+                        transform: string;
+                    };
+                };
+                '&.tooltip-right': {
+                    transform: string;
+                    '&::after': {
+                        left: number;
+                        top: string;
+                        borderLeftColor: (theme: Record<symbol, unknown>) => string;
+                        borderBottomColor: (theme: Record<symbol, unknown>) => string;
+                        transform: string;
+                    };
+                };
+            };
+            wrapper: {
+                default: {
+                    display: string;
+                    position: string;
+                };
+            };
+        };
+        animations: {
+            spinKeyframes: {
+                '0%': {
+                    transform: string;
+                };
+                '100%': {
+                    transform: string;
+                };
+            };
+            bounceKeyframes: {
+                '0%, 80%, 100%': {
+                    transform: string;
+                };
+                '40%': {
+                    transform: string;
+                };
+            };
+            slideIn: {
+                '0%': {
+                    transform: string;
+                    opacity: number;
+                };
+                '100%': {
+                    transform: string;
+                    opacity: number;
+                };
+            };
+            slideOut: {
+                '0%': {
+                    transform: string;
+                    opacity: number;
+                };
+                '100%': {
+                    transform: string;
+                    opacity: number;
+                };
+            };
+            blinkKeyframes: {
+                '0%': {
+                    opacity: number;
+                };
+                '50%': {
+                    opacity: number;
+                };
+                '100%': {
+                    opacity: number;
+                };
+            };
+            progressIndeterminate: {
+                '0%': {
+                    transform: string;
+                };
+                '50%': {
+                    transform: string;
+                };
+                '100%': {
+                    transform: string;
+                };
+            };
+        };
+        modal: {
+            header: {
+                default: {
+                    display: string;
+                    alignItems: string;
+                    justifyContent: string;
+                    padding: string;
+                    borderBottom: (theme: Record<symbol, unknown>) => string;
+                };
+                withTitle: {
+                    justifyContent: string;
+                };
+            };
+            title: {
+                default: {
+                    display: string;
+                    alignItems: string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    margin: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            body: {
+                default: {
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                    overflowY: string;
+                };
+            };
+            content: {
+                default: {
+                    background: (theme: Record<symbol, unknown>) => string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    borderRadius: (theme: Record<symbol, unknown>) => string;
+                    boxShadow: (theme: Record<symbol, unknown>) => string;
+                    position: string;
+                    display: string;
+                    flexDirection: string;
+                    width: string;
+                    maxWidth: string;
+                    maxHeight: string;
+                    '@media (max-width: 768px)': {
+                        maxWidth: string;
+                        width: string;
+                        height: string;
+                    };
+                };
+            };
+            footer: {
+                default: {
+                    display: string;
+                    justifyContent: string;
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    borderTop: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            closeButton: {
+                default: {
+                    background: (theme: Record<symbol, unknown>) => string;
+                    border: string;
+                    cursor: string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            overlay: {
+                default: {
+                    position: string;
+                    top: number;
+                    left: number;
+                    width: string;
+                    height: string;
+                    background: (theme: Record<symbol, unknown>) => string;
+                    display: string;
+                    alignItems: string;
+                    justifyContent: string;
+                    zIndex: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            icons: {
+                close: {
+                    name: string;
+                    fill: string;
+                    width: number;
+                    height: number;
+                };
+            };
+        };
+        snackbar: {
+            title: {
+                attrs: {
+                    as: string;
+                    align: string;
+                    variant: string;
+                    styleVariant: string;
+                    color: string;
+                };
+            };
+            description: {
+                attrs: {
+                    as: string;
+                    align: string;
+                    variant: string;
+                    styleVariant: string;
+                    color: string;
+                };
+            };
+            container: {
+                default: {
+                    position: string;
+                    display: string;
+                    flexDirection: string;
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    boxSizing: string;
+                    maxHeight: (theme: Record<symbol, unknown>) => string;
+                    overflowY: string;
+                    overflowX: string;
+                    scrollbarWidth: string;
+                    scrollbarColor: (theme: Record<symbol, unknown>) => string;
+                    zIndex: (theme: Record<symbol, unknown>) => string;
+                    '&::-webkit-scrollbar': {
+                        width: (theme: Record<symbol, unknown>) => string;
+                        background: (theme: Record<symbol, unknown>) => string;
+                    };
+                    '&::-webkit-scrollbar-thumb': {
+                        background: (theme: Record<symbol, unknown>) => string;
+                        borderRadius: (theme: Record<symbol, unknown>) => string;
+                    };
+                    '&::-webkit-scrollbar-track': {
+                        background: (theme: Record<symbol, unknown>) => string;
+                    };
+                    '&:hover::-webkit-scrollbar-thumb': {
+                        background: string;
+                    };
+                    '&.scrolling::-webkit-scrollbar-thumb': {
+                        background: string;
+                    };
+                };
+            };
+            snackbar: {
+                default: {
+                    position: string;
+                    boxShadow: (theme: Record<symbol, unknown>) => string;
+                    width: string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    display: string;
+                    flexDirection: string;
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                };
+                background: {
+                    default: (theme: Record<symbol, unknown>) => string;
+                    variants: {
+                        success: (theme: Record<symbol, unknown>) => string;
+                        error: (theme: Record<symbol, unknown>) => string;
+                        warning: (theme: Record<symbol, unknown>) => string;
+                        info: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                animation: {
+                    closeEffect: string;
+                    openEffect: string;
+                };
+            };
+            positions: {
+                'top-left': {
+                    top: number;
+                    left: number;
+                    alignItems: string;
+                };
+                'top-center': {
+                    top: (theme: Record<symbol, unknown>) => string;
+                    left: string;
+                    transform: string;
+                    alignItems: string;
+                };
+                'top-right': {
+                    top: (theme: Record<symbol, unknown>) => string;
+                    right: (theme: Record<symbol, unknown>) => string;
+                    alignItems: string;
+                };
+                'bottom-left': {
+                    bottom: (theme: Record<symbol, unknown>) => string;
+                    left: (theme: Record<symbol, unknown>) => string;
+                    alignItems: string;
+                    flexDirection: string;
+                };
+                'bottom-center': {
+                    bottom: (theme: Record<symbol, unknown>) => string;
+                    left: string;
+                    transform: string;
+                    alignItems: string;
+                    flexDirection: string;
+                };
+                'bottom-right': {
+                    bottom: (theme: Record<symbol, unknown>) => string;
+                    right: (theme: Record<symbol, unknown>) => string;
+                    alignItems: string;
+                    flexDirection: string;
+                };
+            };
+            closeButton: {
+                position: string;
+                top: (theme: Record<symbol, unknown>) => string;
+                right: (theme: Record<symbol, unknown>) => string;
+                background: (theme: Record<symbol, unknown>) => string;
+                border: number;
+                cursor: string;
+                padding: number;
+                width: number;
+                height: number;
+            };
+            icons: {
+                close: {
+                    name: string;
+                    width: number;
+                    height: number;
+                };
+                success: {
+                    name: string;
+                    fill: string;
+                    width: number;
+                    height: number;
+                };
+                error: {
+                    name: string;
+                    fill: string;
+                    width: number;
+                    height: number;
+                };
+                warning: {
+                    name: string;
+                    fill: string;
+                    width: number;
+                    height: number;
+                };
+                info: {
+                    name: string;
+                    fill: string;
+                    width: number;
+                    height: number;
+                };
+            };
+            snackbarBody: {
+                display: string;
+                alignItems: string;
+                gap: (theme: Record<symbol, unknown>) => string;
+            };
+            snackbarContent: {
+                display: string;
+                flexDirection: string;
+                alignItems: string;
+                gap: string | number;
+                flex: number;
+            };
+            actionsContainer: {
+                paddingTop: string | number;
+            };
+        };
+        skeleton: {
+            default: {
+                display: string;
+                position: string;
+                backgroundColor: (theme: Record<symbol, unknown>) => string;
+                alignItems: string;
+                justifyContent: string;
+                width: string;
+                height: string;
+                overflow: string;
+                '&:empty::before': {
+                    content: string;
+                };
+            };
+            rounded: {
+                borderRadius: (theme: Record<symbol, unknown>) => string;
+            };
+            rectangular: {
+                borderRadius: (theme: Record<symbol, unknown>) => string;
+            };
+            circular: {
+                borderRadius: (theme: Record<symbol, unknown>) => string;
+            };
+            cards: {
+                search: {
+                    default: {};
+                    container: {
+                        padding: (theme: Record<symbol, unknown>) => string;
+                        boxSizing: string;
+                        flexWrap: string;
+                        flexDirection: string;
+                    };
+                    header: {
+                        width: string;
+                        marginBottom: (theme: Record<symbol, unknown>) => string;
+                    };
+                    row: {
+                        width: string;
+                        marginBottom: (theme: Record<symbol, unknown>) => string;
+                        gap: (theme: Record<symbol, unknown>) => string;
+                    };
+                    columnImage: {
+                        default: {
+                            flex: number;
+                        };
+                        image: {
+                            width: string;
+                            height: string;
+                        };
+                    };
+                    columnText: {
+                        default: {
+                            flex: number;
+                        };
+                        description: {
+                            width: string;
+                            height: (theme: Record<symbol, unknown>) => string;
+                            marginBottom: (theme: Record<symbol, unknown>) => string;
+                        };
+                        price: {
+                            width: string;
+                            height: (theme: Record<symbol, unknown>) => string;
+                            marginBottom: (theme: Record<symbol, unknown>) => string;
+                        };
+                    };
+                };
+            };
+        };
+        list: {
+            wrapper: {
+                default: {
+                    listStyle: string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    margin: (theme: Record<symbol, unknown>) => string;
+                };
+                "ordered-circle": {
+                    counterReset: string;
+                    paddingLeft: (theme: Record<symbol, unknown>) => string;
+                };
+                "ordered-square": {
+                    counterReset: string;
+                    paddingLeft: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            item: {
+                default: {
+                    display: string;
+                    alignItems: string;
+                    flexDirection: string;
+                    margin: (theme: Record<symbol, unknown>) => string;
+                    '&:first-of-type': {
+                        margin: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                "ordered-circle": {
+                    '&::before': (theme: Record<symbol, unknown>) => {
+                        content: string;
+                        counterIncrement: string;
+                        background: string;
+                        fontFamily: string;
+                        fontSize: string;
+                        fontWeight: string;
+                        width: string;
+                        height: string;
+                        color: string;
+                        display: string;
+                        alignItems: string;
+                        justifyContent: string;
+                        marginRight: string;
+                        borderRadius: string;
+                    };
+                };
+                "ordered-square": {
+                    '&::before': (theme: Record<symbol, unknown>) => {
+                        content: string;
+                        counterIncrement: string;
+                        background: string;
+                        fontFamily: string;
+                        fontSize: string;
+                        fontWeight: string;
+                        width: string;
+                        height: string;
+                        color: string;
+                        display: string;
+                        alignItems: string;
+                        justifyContent: string;
+                        marginRight: string;
+                    };
+                };
+                "unordered-check": (theme: Record<symbol, unknown>) => {
+                    counterReset: string;
+                    paddingLeft: string;
+                    "& .List__bulletPoint": {
+                        marginRight: string;
+                        color: string;
+                    };
+                };
+                "unordered-dot": (theme: Record<symbol, unknown>) => {
+                    counterReset: string;
+                    paddingLeft: string;
+                    "& .List__bulletPoint": {
+                        marginRight: string;
+                        color: string;
+                    };
+                };
+            };
+            icons: {
+                bulletDot: {
+                    name: string;
+                    width: number;
+                    height: number;
+                };
+                bulletCheck: {
+                    name: string;
+                };
+            };
+        };
+        select: {
+            default: {
+                display: string;
+                position: string;
+            };
+            initiatorWrapper: {
+                '& > *': {
+                    width: string;
+                };
+                '.gd-button__content': {
+                    whiteSpace: string;
+                    overflow: string;
+                    textOverflow: string;
+                    display: string;
+                };
+            };
+            dropdown: {
+                position: string;
+                textAlign: string;
+                background: (theme: Record<symbol, unknown>) => string;
+                boxShadow: (theme: Record<symbol, unknown>) => string;
+                fontFamily: (theme: Record<symbol, unknown>) => string;
+                fontSize: (theme: Record<symbol, unknown>) => string;
+                fontWeight: (theme: Record<symbol, unknown>) => string;
+                listStyleType: string;
+                margin: (theme: Record<symbol, unknown>) => string;
+                padding: (theme: Record<symbol, unknown>) => string;
+                zIndex: (theme: Record<symbol, unknown>) => string;
+                overflowY: string;
+            };
+            button: {
+                default: {
+                    border: (theme: Record<symbol, unknown>) => string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    width: string;
+                    display: string;
+                    flexDirection: string;
+                    justifyContent: string;
+                    alignItems: string;
+                    textAlign: import('../../types').TextAlign;
+                    '.gd-button__content': {
+                        justifyContent: string;
+                    };
+                };
+                attrs: {
+                    variant: import('../../types').ButtonVariant;
+                };
+            };
+            item: {
+                default: {
+                    cursor: import('../../types').Cursors;
+                    padding: string | number;
+                    '&:hover, &.active': {
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                disabled: {
+                    opacity: number;
+                    cursor: import('../../types').Cursors;
+                    pointerEvents: string;
+                };
+            };
+            arrowIconWrapper: {
+                default: {
+                    transition: (theme: Record<symbol, unknown>) => string;
+                };
+                transform: {
+                    open: {
+                        transform: string;
+                    };
+                    close: {
+                        transform: string;
+                    };
+                };
+            };
+            icons: {
+                arrowIcon: {
+                    name: string;
+                    fill: string;
+                    width: number;
+                    height: number;
+                };
+            };
+            adornment: {
+                default: {
+                    display: string;
+                    alignItems: string;
+                    flexDirection: import('../../types').FlexDirection;
+                    position: string;
+                    zIndex: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+        };
+        search: {
+            default: {};
+            input: {
+                default: {
+                    width: string;
+                    boxSizing: string;
+                };
+            };
+            dropdownHeader: {
+                row: {};
+                link: {
+                    default: {};
+                    typography: {};
+                };
+                icon: {};
+            };
+            renderer: {
+                row: {
+                    width: string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                };
+                link: {
+                    display: string;
+                    alignItems: string;
+                    '&:after': {
+                        borderBottom: string;
+                    };
+                    '& svg': {
+                        marginLeft: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                linkIcon: {
+                    fill: (theme: Record<symbol, unknown>) => string;
+                    name: string;
+                    width: number;
+                    height: number;
+                };
+            };
+        };
+        breadcrumbs: {
+            default: {
+                display: string;
+                alignItems: string;
+                gap: (theme: Record<symbol, unknown>) => string;
+            };
+            bordered: {
+                padding: (theme: Record<symbol, unknown>) => string;
+                border: (theme: Record<symbol, unknown>) => string;
+            };
+            item: {
+                default: {};
+                itemStart: {
+                    color: (theme: Record<symbol, unknown>) => string;
+                };
+                itemEnd: {
+                    color: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            separator: {
+                default: {
+                    display: string;
+                    alignItems: string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+        };
+        scroll: {
+            container: {
+                default: {
+                    position: string;
+                    display: string;
+                    overflow: string;
+                    isolation: string;
+                    maxBlockSize: string;
+                    '&::-webkit-scrollbar, &::-webkit-scrollbar-thumb': {
+                        background: string;
+                        width: string;
+                        height: string;
+                    };
+                };
+            };
+            content: {
+                default: {
+                    position: string;
+                    zIndex: (theme: Record<symbol, unknown>) => string;
+                    flex: number;
+                    flexBasis: string;
+                    height: string;
+                };
+            };
+            scrollbars: {
+                default: {
+                    position: string;
+                    top: string;
+                    left: string;
+                    zIndex: (theme: Record<symbol, unknown>) => string;
+                    minWidth: string;
+                    minHeight: string;
+                    maxWidth: string;
+                    maxHeight: string;
+                    float: string;
+                    marginRight: string;
+                    marginInlineStart: string;
+                    marginInlineEnd: string;
+                    pointerEvents: string;
+                };
+            };
+            scrollbar: {
+                default: {
+                    position: string;
+                    pointerEvents: string;
+                    opacity: number;
+                    transition: (theme: Record<symbol, unknown>) => string;
+                    '&:hover': {
+                        opacity: number;
+                    };
+                };
+                vertical: {
+                    right: number;
+                    bottom: string;
+                    top: number;
+                    width: string;
+                };
+                horizontal: {
+                    left: number;
+                    bottom: number;
+                    right: string;
+                    height: string;
+                };
+                autoHide: {
+                    opacity: number;
+                    transition: string;
+                };
+                autoHideScrolling: {
+                    opacity: number;
+                    '&:hover': {
+                        opacity: number;
+                    };
+                };
+            };
+            thumb: {
+                default: {
+                    position: string;
+                    cursor: string;
+                    pointerEvents: string;
+                    background: (theme: Record<symbol, unknown>) => string;
+                    backgroundClip: string;
+                    boxSizing: string;
+                };
+                vertical: {
+                    right: number;
+                    bottom: number;
+                    top: number;
+                    width: string;
+                    minHeight: (theme: Record<symbol, unknown>) => string;
+                    transition: (theme: Record<symbol, unknown>) => string;
+                };
+                horizontal: {
+                    left: number;
+                    right: number;
+                    bottom: number;
+                    height: string;
+                    minWidth: (theme: Record<symbol, unknown>) => string;
+                    transition: (theme: Record<symbol, unknown>) => string;
+                };
+                autoHide: {
+                    opacity: number;
+                    transition: string;
+                };
+                autoHideScrolling: {
+                    opacity: number;
+                };
+            };
+        };
+        icon: {
+            size: {
+                xs: {
+                    width: number;
+                    height: number;
+                };
+                sm: {
+                    width: number;
+                    height: number;
+                };
+                md: {
+                    width: number;
+                    height: number;
+                };
+                lg: {
+                    width: number;
+                    height: number;
+                };
+                xl: {
+                    width: number;
+                    height: number;
+                };
+                xxl: {
+                    width: number;
+                    height: number;
+                };
+            };
+        };
+        tabs: {
+            default: {
+                display: string;
+                flexDirection: string;
+                width: string;
+            };
+            header: {
+                default: {
+                    display: string;
+                    flexDirection: string;
+                    position: string;
+                    overflow: string;
+                    '&::after': {
+                        content: string;
+                        position: string;
+                        width: string;
+                        bottom: number;
+                        zIndex: (theme: Record<symbol, unknown>) => number;
+                        borderBottom: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+            };
+            label: {
+                default: {
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                    transition: (theme: Record<symbol, unknown>) => string;
+                    borderBottom: (theme: Record<symbol, unknown>) => string;
+                    whiteSpace: string;
+                    flex: number;
+                    '&:hover': {
+                        ".Tabs__noticeCounter": {
+                            backgroundColor: (theme: Record<symbol, unknown>) => string;
+                        };
+                    };
+                };
+                active: {
+                    borderBottomColor: (theme: Record<symbol, unknown>) => string;
+                };
+                disabled: {
+                    default: {
+                        '&:hover': {
+                            ".Tabs__noticeCounter": {
+                                backgroundColor: (theme: Record<symbol, unknown>) => string;
+                            };
+                        };
+                        ".Tabs__noticeCounter": {
+                            color: (theme: Record<symbol, unknown>) => string;
+                        };
+                        borderBottom: (theme: Record<symbol, unknown>) => string;
+                    };
+                    active: {
+                        borderBottomWidth: string;
+                        borderBottomColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+            };
+            panelsWrapper: {
+                default: {};
+            };
+            panel: {
+                default: {};
+            };
+            noticeCounter: {
+                default: {
+                    display: string;
+                    alignItems: string;
+                    justifyContent: string;
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    borderRadius: (theme: Record<symbol, unknown>) => string;
+                };
+                active: {
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                };
+                disabled: {
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            tabButton: {
+                default: {
+                    width: string;
+                };
+            };
+        };
+        stepper: {
+            default: {
+                display: string;
+                flexDirection: string;
+                justifyContent: string;
+                width: string;
+            };
+            separator: {
+                default: {
+                    width: string;
+                    position: string;
+                    zIndex: (theme: Record<symbol, unknown>) => number;
+                    top: string;
+                    marginLeft: string;
+                    marginRight: string;
+                    transition: (theme: Record<symbol, unknown>) => string;
+                    borderTop: (theme: Record<symbol, unknown>) => string;
+                };
+                active: {};
+                complete: {
+                    borderTopColor: (theme: Record<symbol, unknown>) => string;
+                };
+                inactive: {};
+            };
+            step: {
+                default: {
+                    display: string;
+                    flexDirection: string;
+                    alignItems: string;
+                    justifyContent: string;
+                    minWidth: string;
+                };
+                active: {};
+                inactive: {};
+                complete: {
+                    cursor: import('../../types').Cursors;
+                };
+            };
+            stepIcon: {
+                default: {
+                    width: number;
+                    height: number;
+                    display: string;
+                    alignItems: string;
+                    justifyContent: string;
+                    borderRadius: (theme: Record<symbol, unknown>) => string;
+                    border: (theme: Record<symbol, unknown>) => string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    transition: (theme: Record<symbol, unknown>) => string;
+                    colors: (theme: Record<symbol, unknown>) => string;
+                };
+                active: {
+                    default: {
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                        borderColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                    success: {};
+                    error: {
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                        borderColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                inactive: {
+                    default: {
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                    success: {};
+                    error: {};
+                };
+                complete: {
+                    default: {
+                        fontWeight: (theme: Record<symbol, unknown>) => string;
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                    success: {};
+                    error: {
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                        borderColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                success: {
+                    default: {};
+                    success: {};
+                    error: {};
+                };
+            };
+            stepLabel: {
+                default: {
+                    marginTop: (theme: Record<symbol, unknown>) => string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    colors: (theme: Record<symbol, unknown>) => string;
+                };
+                active: {};
+                inactive: {};
+                complete: {};
+                error: {};
+                success: {};
+            };
+            icons: {
+                active: {
+                    name: string;
+                    fill: string;
+                };
+                inactive: {
+                    name: string;
+                    fill: string;
+                };
+                complete: {
+                    name: string;
+                    fill: string;
+                };
+                error: {
+                    name: string;
+                    fill: string;
+                };
+                errorActive: {
+                    name: string;
+                    fill: string;
+                };
+            };
+        };
+        colors: {
+            transparent: string;
+            bg: {
+                default: string;
+                surface: string;
+                input: {
+                    default: string;
+                    disabled: string;
+                };
+                fill: {
+                    disabled: string;
+                    hover: string;
+                    primary: string;
+                    secondary: string;
+                    error: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                        };
+                    };
+                    success: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                        };
+                    };
+                    warning: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                        };
+                    };
+                    info: {
+                        primary: {
+                            default: string;
+                            hover: string;
+                        };
+                        secondary: {
+                            default: string;
+                            hover: string;
+                        };
+                    };
+                    tooltip: {
+                        default: string;
+                    };
+                    input: {
+                        default: string;
+                        disabled: string;
+                    };
+                };
+                toast: {
+                    success: string;
+                    error: string;
+                    warning: string;
+                    info: string;
+                };
+            };
+            primary: {
+                default: string;
+                'default.80': string;
+                'default.10': string;
+            };
+            secondary: {
+                default: string;
+                'default.80': string;
+                'default.10': string;
+            };
+            status: {
+                red: string;
+                'red.80': string;
+                'red.20': string;
+                'red.10': string;
+                green: string;
+                'green.80': string;
+                'green.20': string;
+                'green.10': string;
+                blue: string;
+                'blue.80': string;
+                'blue.20': string;
+                'blue.10': string;
+                orange: string;
+                'orange.80': string;
+                'orange.20': string;
+                'orange.10': string;
+            };
+            border: {
+                default: string;
+                disabled: string;
+                primary: string;
+                secondary: string;
+                error: string;
+                success: string;
+                info: string;
+                warning: string;
+                focus: string;
+                white: string;
+                black: string;
+            };
+            text: {
+                secondary: string;
+                default: string;
+                active: string;
+                disabled: string;
+                title: string;
+                caption: string;
+                error: string;
+                success: string;
+                info: string;
+                black: string;
+                white: string;
+                link: {
+                    default: string;
+                    hover: string;
+                };
+                warning: string;
+                primary: string;
+            };
+            icon: {
+                default: string;
+                disabled: string;
+                primary: string;
+                secondary: string;
+                success: string;
+                info: string;
+                warning: string;
+                error: string;
+                link: {
+                    default: string;
+                    hover: string;
+                };
+                white: string;
+                black: string;
+            };
+            neutral: {
+                default: string;
+                '10': string;
+                '20': string;
+                '30': string;
+                '40': string;
+                '50': string;
+                '60': string;
+                '70': string;
+                '80': string;
+                '90': string;
+                '100': string;
+                white: string;
+                black: string;
+                'grey.100': string;
+                'grey.90': string;
+                'grey.80': string;
+                'grey.60': string;
+                'grey.40': string;
+                'grey.30': string;
+                'grey.10': string;
+            };
+            yellow: {
+                '5': string;
+                '10': string;
+                '20': string;
+                '30': string;
+                '40': string;
+                '50': string;
+                '60': string;
+                '70': string;
+                '80': string;
+                '90': string;
+                '100': string;
+            };
+            orange: {
+                '5': string;
+                '10': string;
+                '20': string;
+                '30': string;
+                '40': string;
+                '50': string;
+                '60': string;
+                '70': string;
+                '80': string;
+                '90': string;
+                '95': string;
+            };
+            red: {
+                '5': string;
+                '10': string;
+                '20': string;
+                '30': string;
+                '40': string;
+                '50': string;
+                '60': string;
+                '70': string;
+                '80': string;
+                '90': string;
+                '95': string;
+            };
+            pink: {
+                '5': string;
+                '10': string;
+                '20': string;
+                '30': string;
+                '40': string;
+                '50': string;
+                '60': string;
+                '70': string;
+                '80': string;
+                '90': string;
+                '95': string;
+            };
+            purple: {
+                '5': string;
+                '10': string;
+                '20': string;
+                '30': string;
+                '40': string;
+                '50': string;
+                '60': string;
+                '70': string;
+                '80': string;
+                '90': string;
+                '95': string;
+            };
+            blue: {
+                '5': string;
+                '10': string;
+                '20': string;
+                '30': string;
+                '40': string;
+                '50': string;
+                '60': string;
+                '70': string;
+                '80': string;
+                '90': string;
+                '95': string;
+            };
+            lightBlue: {
+                '5': string;
+                '10': string;
+                '20': string;
+                '30': string;
+                '40': string;
+                '50': string;
+                '60': string;
+                '70': string;
+                '80': string;
+                '90': string;
+                '95': string;
+            };
+            teal: {
+                '5': string;
+                '10': string;
+                '20': string;
+                '30': string;
+                '40': string;
+                '50': string;
+                '60': string;
+                '70': string;
+                '80': string;
+                '90': string;
+                '95': string;
+            };
+            green: {
+                '5': string;
+                '10': string;
+                '20': string;
+                '30': string;
+                '40': string;
+                '50': string;
+                '60': string;
+                '70': string;
+                '80': string;
+                '90': string;
+                '95': string;
+            };
+        };
+        menu: {
+            wrapper: {
+                default: {};
+            };
+            content: {
+                default: {
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    position: string;
+                    overflow: string;
+                    boxShadow: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+        };
+        price: {
+            default: {
+                display: string;
+                alignItems: string;
+                gap: (theme: Record<symbol, unknown>) => string;
+            };
+            currentPrice: {
+                default: {
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                    lineHeight: (theme: Record<symbol, unknown>) => string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            oldPrice: {
+                default: {
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                    lineHeight: (theme: Record<symbol, unknown>) => string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+        };
+        header: {
+            container: {
+                fontFamily: (theme: Record<symbol, unknown>) => string;
+                alignItems: string;
+                backgroundColor: (theme: Record<symbol, unknown>) => string;
+                maxWidth: string;
+            };
+            topBannerRow: {
+                width: string;
+                backgroundColor: (theme: Record<symbol, unknown>) => string;
+                color: (theme: Record<symbol, unknown>) => string;
+            };
+            searchColumn: {
+                default: {
+                    flexDirection: string;
+                    justifyContent: string;
+                    '& a': {
+                        margin: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+            };
+            navigationRow: {
+                default: {
+                    width: string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    alignItems: string;
+                };
+            };
+            actionsColumn: {
+                default: {
+                    flexDirection: string;
+                    '& > button': {
+                        margin: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+            };
+            menuRow: {
+                default: {
+                    width: string;
+                    justifyContent: string;
+                };
+                column: {
+                    flexDirection: string;
+                    '& a': {
+                        margin: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+            };
+            children: {
+                default: {
+                    margin: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            mobile: {
+                openedDropdownWrapper: {
+                    position: string;
+                    top: (theme: Record<symbol, unknown>) => string;
+                    left: (theme: Record<symbol, unknown>) => string;
+                    zIndex: (theme: Record<symbol, unknown>) => string;
+                    background: (theme: Record<symbol, unknown>) => string;
+                    width: string;
+                    height: string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    overflowY: string;
+                };
+                closeMenuIconWrapper: {
+                    width: string;
+                    height: string;
+                    display: string;
+                    justifyContent: string;
+                    alignItems: string;
+                };
+                openMenuIconWrapper: {
+                    width: string;
+                    height: string;
+                    display: string;
+                    justifyContent: string;
+                    alignItems: string;
+                };
+                menuWrapper: {
+                    margin: (theme: Record<symbol, unknown>) => string;
+                    borderTop: (theme: Record<symbol, unknown>) => string;
+                };
+                menuItemWrapper: {
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    borderBottom: (theme: Record<symbol, unknown>) => string;
+                    cursor: string;
+                };
+            };
+            icons: {
+                close: {
+                    name: string;
+                    width: number;
+                    height: number;
+                };
+                right: {
+                    name: string;
+                    width: number;
+                    height: number;
+                };
+                menu: {
+                    name: string;
+                    width: number;
+                    height: number;
+                };
+            };
+        };
+        rating: {
+            default: {
+                display: string;
+                gap: number;
+                position: string;
+                overflow: string;
+            };
+            progress: {
+                default: {
+                    position: string;
+                    display: string;
+                    overflow: string;
+                    left: number;
+                    svg: {
+                        flexShrink: number;
+                        flexGrow: number;
+                    };
+                };
+            };
+            radioInput: {
+                default: {
+                    display: string;
+                };
+            };
+            label: {
+                default: {
+                    cursor: string;
+                };
+                active: {
+                    '&:hover': {
+                        transform: string;
+                        transition: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                readOnly: {
+                    cursor: string;
+                };
+            };
+            size: {
+                sm: {
+                    width: number;
+                    height: number;
+                };
+                md: {
+                    width: number;
+                    height: number;
+                };
+                lg: {
+                    width: number;
+                    height: number;
+                };
+                xl: {
+                    width: number;
+                    height: number;
+                };
+            };
+            icons: {
+                rateActive: {
+                    name: string;
+                    fill: string;
+                };
+                rateInactive: {
+                    name: string;
+                    fill: string;
+                };
+            };
+        };
+        accordion: {
+            header: {
+                default: {
+                    width: string;
+                    textAlign: string;
+                    cursor: string;
+                    border: string;
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    paddingTop: (theme: Record<symbol, unknown>) => string;
+                    paddingBottom: (theme: Record<symbol, unknown>) => string;
+                    display: string;
+                    alignItems: string;
+                    justifyContent: string;
+                    ':first-of-type': {
+                        flex: string;
+                    };
+                };
+            };
+            content: {
+                default: {
+                    overflow: string;
+                    transition: (theme: Record<symbol, unknown>) => string;
+                    height: string;
+                };
+                opened: {
+                    paddingTop: (theme: Record<symbol, unknown>) => string;
+                    paddingBottom: (theme: Record<symbol, unknown>) => string;
+                };
+                closed: {
+                    maxHeight: (theme: Record<symbol, unknown>) => string;
+                    paddingTop: (theme: Record<symbol, unknown>) => string;
+                    paddingBottom: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            item: {
+                default: {
+                    position: string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    '&::after': {
+                        content: string;
+                        position: string;
+                        bottom: (theme: Record<symbol, unknown>) => string;
+                        left: (theme: Record<symbol, unknown>) => string;
+                        right: (theme: Record<symbol, unknown>) => string;
+                        height: string;
+                        width: string;
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+            };
+            itemNoSeparator: {
+                default: {
+                    position: string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            icon: {
+                default: {
+                    transition: (theme: Record<symbol, unknown>) => string;
+                };
+                opened: {
+                    transform: (theme: Record<symbol, unknown>) => string;
+                };
+                closed: {
+                    transform: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+        };
+        inlineNotification: {
+            default: {
+                wrapper: {
+                    display: string;
+                    alignItems: string;
+                    gap: (theme: Record<symbol, unknown>) => string;
+                    width: string;
+                };
+                content: {
+                    flex: number;
+                    fontFamily: (theme: Record<symbol, unknown>) => string;
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    lineHeight: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            success: {
+                wrapper: {};
+                content: {};
+                icon: {
+                    name: string;
+                    fill: string;
+                };
+            };
+            warning: {
+                wrapper: {};
+                content: {};
+                icon: {
+                    name: string;
+                    fill: string;
+                };
+            };
+            error: {
+                wrapper: {};
+                content: {};
+                icon: {
+                    name: string;
+                    fill: string;
+                };
+            };
+            info: {
+                wrapper: {};
+                content: {};
+                icon: {
+                    name: string;
+                    fill: string;
+                };
+            };
+            basic: {
+                wrapper: {
+                    border: (theme: Record<symbol, unknown>) => string;
+                    boxShadow: (theme: Record<symbol, unknown>) => string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                };
+                content: {
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                };
+                icon: {
+                    name: string;
+                };
+            };
+        };
+        switchToken: {
+            default: {
+                position: string;
+                display: string;
+                width: string;
+                height: string;
+                flexShrink: number;
+                borderRadius: string;
+            };
+            label: {
+                right: {
+                    order: number;
+                };
+            };
+            wrapper: {
+                default: {
+                    display: string;
+                    gap: string | number;
+                    justifyContent: string;
+                    cursor: string;
+                };
+                disabled: {
+                    cursor: string;
+                    opacity: string;
+                };
+            };
+            slider: {
+                default: {
+                    position: string;
+                    left: number;
+                    right: number;
+                    top: number;
+                    bottom: number;
+                    transition: string;
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    borderRadius: string;
+                    '&::before': {
+                        position: string;
+                        content: string;
+                        borderRadius: string;
+                        width: string;
+                        height: string;
+                        left: string;
+                        bottom: string;
+                        transition: string;
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                checked: {
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    '&::before': {
+                        transform: string;
+                    };
+                };
+            };
+            checkbox: {
+                border: number;
+                clip: string;
+                height: string;
+                margin: string;
+                overflow: string;
+                padding: number;
+                position: string;
+                whiteSpace: string;
+                width: string;
+            };
+        };
+        chat: {
+            wrapper: {
+                default: {
+                    display: string;
+                    position: string;
+                    height: string;
+                    width: string;
+                    overflow: string;
+                };
+            };
+            content: {
+                default: {
+                    boxSizing: string;
+                    position: string;
+                    width: string;
+                    height: string;
+                    display: string;
+                    flexDirection: string;
+                    justifyContent: string;
+                    alignItems: string;
+                    paddingBottom: string | number;
+                    gap: string | number;
+                    minHeight: number;
+                    margin: string;
+                };
+                md: {
+                    paddingLeft: string;
+                    paddingRight: string;
+                };
+                mdXl: {
+                    maxWidth: string;
+                };
+                xl: {
+                    maxWidth: string;
+                };
+            };
+            mainHeader: {
+                minHeight: string;
+                height: string;
+                display: string;
+                overflow: string;
+                alignItems: string;
+                padding: string;
+                borderBottom: string;
+                borderColor: (theme: Record<symbol, unknown>) => string;
+            };
+            body: {
+                display: string;
+                flex: number;
+                flexDirection: string;
+            };
+            sidebar: {
+                default: {
+                    overflow: string;
+                    borderRight: string;
+                    position: string;
+                    transition: (theme: Record<symbol, unknown>) => string;
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    borderColor: (theme: Record<symbol, unknown>) => string;
+                    display: string;
+                    flexDirection: string;
+                    minHeight: string;
+                    transform: string;
+                    pointerEvents: string;
+                };
+                open: {
+                    width: string;
+                };
+                close: {
+                    width: number;
+                    transform: string;
+                    pointerEvents: string;
+                };
+            };
+            sidebarMinified: {
+                default: {
+                    overflow: string;
+                    borderRight: string;
+                    position: string;
+                    transition: (theme: Record<symbol, unknown>) => string;
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    borderColor: (theme: Record<symbol, unknown>) => string;
+                    display: string;
+                    flexDirection: string;
+                    minHeight: string;
+                    transform: string;
+                    pointerEvents: string;
+                    opacity: number;
+                };
+                open: {};
+                close: {
+                    opacity: number;
+                    width: number;
+                    transform: string;
+                    pointerEvents: string;
+                };
+            };
+            sidebarWrapper: {
+                default: {
+                    transition: (theme: Record<symbol, unknown>) => string;
+                };
+                open: {
+                    opacity: number;
+                    pointerEvents: string;
+                };
+                close: {
+                    opacity: number;
+                    pointerEvents: string;
+                };
+                md: (theme: Record<symbol, unknown>) => {
+                    position: string;
+                    display: string;
+                    flexDirection: string;
+                    left: number;
+                    top: number;
+                    right: number;
+                    bottom: number;
+                    backgroundColor: string;
+                    zIndex: string;
+                };
+            };
+            sidebarContentWrapper: {};
+            sidebarHeader: {
+                minHeight: string;
+                height: string;
+                display: string;
+                overflow: string;
+                alignItems: string;
+                padding: string;
+                borderBottom: string;
+                borderColor: (theme: Record<symbol, unknown>) => string;
+            };
+            toggleButton: {
+                default: {
+                    height: string;
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    transform: string;
+                    '&:hover': {
+                        backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+                attrs: {
+                    variant: string;
+                };
+                open: {
+                    transform: string;
+                };
+            };
+            toggleIcon: {
+                name: string;
+                fill: string;
+                width: number;
+                height: number;
+            };
+        };
+        slider: {
+            default: {
+                position: string;
+                display: string;
+                inlineSize: string;
+                color: (theme: Record<symbol, unknown>) => string;
+                cursor: string;
+                WebkitAppearance: string;
+                appearance: string;
+                padding: string;
+                backgroundColor: (theme: Record<symbol, unknown>) => string;
+                outline: string;
+                '&[disabled]': {
+                    opacity: string;
+                    cursor: string;
+                };
+                '&::-webkit-slider-thumb': (theme: Record<symbol, unknown>) => {
+                    isolation: string;
+                    appearance: string;
+                    backgroundColor: string;
+                    borderRadius: string;
+                    blockSize: string;
+                    inlineSize: string;
+                    boxSizing: string;
+                    border: string;
+                    marginTop: string;
+                };
+                '&::-webkit-slider-runnable-track': (theme: Record<symbol, unknown>) => {
+                    blockSize: string;
+                    borderRadius: string;
+                    backgroundRepeat: string;
+                    backgroundColor: string;
+                    backgroundImage: string;
+                    backgroundPositionX: string;
+                    backgroundSize: string;
+                };
+                '&::-moz-range-thumb': (theme: Record<symbol, unknown>) => {
+                    isolation: string;
+                    appearance: string;
+                    backgroundColor: string;
+                    borderRadius: string;
+                    blockSize: string;
+                    inlineSize: string;
+                    boxSizing: string;
+                    border: string;
+                    marginTop: string;
+                };
+                '&::-moz-range-track': (theme: Record<symbol, unknown>) => {
+                    blockSize: string;
+                    borderRadius: string;
+                    backgroundRepeat: string;
+                    backgroundColor: string;
+                    backgroundImage: string;
+                    backgroundPositionX: string;
+                    backgroundSize: string;
+                };
+            };
+        };
+        radiogroup: {
+            input: {
+                position: string;
+                opacity: number;
+                pointerEvents: string;
+            };
+            default: {
+                margin: (theme: Record<symbol, unknown>) => string;
+                padding: (theme: Record<symbol, unknown>) => string;
+                border: number;
+            };
+            label: {
+                default: {
+                    display: string;
+                    padding: (theme: Record<symbol, unknown>) => string;
+                    fontSize: (theme: Record<symbol, unknown>) => string;
+                    fontWeight: (theme: Record<symbol, unknown>) => string;
+                    cursor: string;
+                    color: (theme: Record<symbol, unknown>) => string;
+                    width: string;
+                    height: string;
+                    alignContent: import('../../types').TextAlign;
+                    textAlign: import('../../types').TextAlign;
+                };
+                disabled: {};
+                selected: {};
+                hover: {
+                    '&:hover': {
+                        color: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+            };
+            item: {
+                default: {
+                    position: string;
+                    cursor: string;
+                    border: (theme: Record<symbol, unknown>) => string;
+                    '&:focus-within': {
+                        outline: (theme: Record<symbol, unknown>) => string;
+                        outlineOffset: string;
+                    };
+                };
+                disabled: {
+                    cursor: string;
+                    backgroundColor: (theme: Record<symbol, unknown>) => string;
+                    '&::after': {
+                        content: string;
+                        position: string;
+                        top: (theme: Record<symbol, unknown>) => string;
+                        left: (theme: Record<symbol, unknown>) => string;
+                        width: string;
+                        height: string;
+                        background: string;
+                    };
+                };
+                selected: {
+                    boxShadow: (theme: Record<symbol, unknown>) => string;
+                    border: (theme: Record<symbol, unknown>) => string;
+                };
+                hover: {
+                    '&:hover': {
+                        border: (theme: Record<symbol, unknown>) => string;
+                    };
+                };
+            };
+            layouts: {
+                column: {
+                    display: string;
+                    flexDirection: import('../../types').FlexDirection;
+                };
+                row: {
+                    display: string;
+                    flexDirection: import('../../types').FlexDirection;
+                };
+                grid: {
+                    display: string;
+                };
+            };
+        };
+        font: {
+            family: string;
+            'family.code': string;
+            weight: {
+                light: number;
+                normal: number;
+                medium: number;
+                bold: number;
+            };
+            size: {
+                xs: string;
+                sm: string;
+                md: string;
+                lg: string;
+                xl: string;
+                h1: string;
+                h2: string;
+                h3: string;
+                h4: string;
+                h5: string;
+                h6: string;
+                p: string;
+                small: string;
+                caption: string;
+                header: string;
+                code: string;
+                kbd: string;
+                sub: string;
+                sup: string;
+            };
+            line: {
+                height: {
+                    xs: string;
+                    sm: string;
+                    md: string;
+                    lg: string;
+                    xl: string;
+                    h1: string;
+                    h2: string;
+                    h3: string;
+                    h4: string;
+                    h5: string;
+                    h6: string;
+                    p: string;
+                    small: string;
+                    caption: string;
+                    header: string;
+                    code: string;
+                    kbd: string;
+                    sub: string;
+                    sup: string;
+                };
+            };
+        };
+        radius: {
+            none: string;
+            default: string;
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            round: string;
+        };
+        shadows: {
+            box: {
+                '1': string;
+                '2': string;
+                '3': string;
+                '4': string;
+                '5': string;
+            };
+            modal: {
+                default: string;
+                content: string;
+            };
+            snackbar: {
+                default: string;
+            };
+            inlineNotification: {
+                default: string;
+            };
+        };
+        breakpoints: {
+            xs: string;
+            sm: string;
+            md: string;
+            lg: string;
+            xl: string;
+            xxl: string;
+        };
+        box: {
+            default: {
+                display: string;
+                '&:focus-visible': (theme: Record<symbol, unknown>) => {
+                    outline: string;
+                    '&:hover': {
+                        boxShadow: string;
+                    };
+                };
+            };
+            shadowHover: {
+                '&:hover': {
+                    boxShadow: (theme: Record<symbol, unknown>) => string;
+                };
+            };
+            vertical: {
+                default: {
+                    flexDirection: string;
+                };
+                bordered: (theme: Record<symbol, unknown>) => {
+                    border: string;
+                };
+                highlighted: (theme: Record<symbol, unknown>) => {
+                    '&:not(:focus-visible):hover': {
+                        outline: string;
+                    };
+                };
+            };
+            horizontal: {
+                default: {
+                    flexDirection: string;
+                };
+                bordered: (theme: Record<symbol, unknown>) => {
+                    border: string;
+                };
+                highlighted: (theme: Record<symbol, unknown>) => {
+                    '&:not(:focus-visible):hover': {
+                        outline: string;
+                    };
+                };
+            };
+        };
+        zIndex: {
+            zero: number;
+            negative: number;
+            first: number;
+            low: number;
+            medium: number;
+            high: number;
+            top: number;
+        };
+    };
+    setTheme(): void;
+    addTheme(): void;
+}
+/**
+ * Create a no-op theme instance
+ */
+export declare const noOpTheme: NoOpTheme;