@kryptogo/kryptogokit-sdk-react/dist/src/components/common/Box/Box.d.ts

KryptogoKit offers a comprehensive web3 wallet solution with seamless KryptoGO Auth integration and multi-wallet connection support. Designed for users. Built for developers.

import { type ClassValue } from 'clsx';
import React from 'react';
type HTMLProperties<T = HTMLElement> = Omit<React.AllHTMLAttributes<T>, 'as' | 'className' | 'color' | 'height' | 'width'>;
export declare const Box: React.ForwardRefExoticComponent<{
    background?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | {
        base?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | undefined;
        hover?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | undefined;
        active?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | undefined;
    } | undefined;
    borderColor?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | {
        base?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | undefined;
        hover?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | undefined;
        active?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | undefined;
    } | undefined;
    boxShadow?: "connectButton" | "dialog" | "profileDetailsAction" | "selectedOption" | "selectedWallet" | "walletLogo" | {
        base?: "connectButton" | "dialog" | "profileDetailsAction" | "selectedOption" | "selectedWallet" | "walletLogo" | undefined;
        hover?: "connectButton" | "dialog" | "profileDetailsAction" | "selectedOption" | "selectedWallet" | "walletLogo" | undefined;
        active?: "connectButton" | "dialog" | "profileDetailsAction" | "selectedOption" | "selectedWallet" | "walletLogo" | undefined;
    } | undefined;
    color?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | {
        base?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | undefined;
        hover?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | undefined;
        active?: "accentColor" | "accentColorForeground" | "actionButtonBorder" | "actionButtonBorderMobile" | "actionButtonSecondaryBackground" | "backward" | "closeButton" | "closeButtonBackground" | "connectButtonBackground" | "connectButtonBackgroundError" | "connectButtonInnerBackground" | "connectButtonText" | "connectButtonTextError" | "connectionIndicator" | "downloadBottomCardBackground" | "downloadTopCardBackground" | "error" | "generalBorder" | "generalBorderDim" | "menuItemBackground" | "modalBackdrop" | "modalBackground" | "modalBorder" | "modalText" | "modalTextDim" | "modalTextSecondary" | "profileAction" | "profileActionHover" | "profileForeground" | "selectedOptionBorder" | "standby" | "success" | "secondary" | undefined;
    } | undefined;
} & {
    alignItems?: "center" | "stretch" | "flex-end" | "flex-start" | {
        smallScreen?: "center" | "stretch" | "flex-end" | "flex-start" | undefined;
        largeScreen?: "center" | "stretch" | "flex-end" | "flex-start" | undefined;
    } | undefined;
    display?: "none" | "flex" | "block" | "inline" | {
        smallScreen?: "none" | "flex" | "block" | "inline" | undefined;
        largeScreen?: "none" | "flex" | "block" | "inline" | undefined;
    } | undefined;
} & {
    readonly alignSelf?: "center" | "stretch" | "flex-end" | "flex-start" | undefined;
    readonly backgroundSize?: "cover" | undefined;
    readonly borderRadius?: "1" | "actionButton" | "connectButton" | "menuButton" | "modal" | "modalMobile" | "6" | "10" | "13" | "24" | "25%" | "full" | undefined;
    readonly borderStyle?: "solid" | undefined;
    readonly borderWidth?: "1" | "0" | "2" | "4" | undefined;
    readonly borderBottom?: "1" | "2" | undefined;
    readonly cursor?: "none" | "pointer" | undefined;
    readonly pointerEvents?: "none" | "all" | undefined;
    readonly minHeight?: "8" | "44" | "100" | undefined;
    readonly flexDirection?: "column" | "row" | undefined;
    readonly fontFamily?: "body" | undefined;
    readonly fontSize?: "10" | "13" | "12" | "14" | "16" | "18" | "20" | "23" | "27" | "32" | "40" | undefined;
    readonly fontWeight?: "medium" | "thin" | "bold" | "regular" | "semibold" | "heavy" | undefined;
    readonly gap?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    readonly height?: "1" | "2" | "24" | "full" | "4" | "8" | "44" | "12" | "16" | "20" | "32" | "40" | "28" | "30" | "34" | "36" | "48" | "54" | "60" | "80" | "200" | "max" | undefined;
    readonly justifyContent?: "center" | "space-around" | "space-between" | "stretch" | "flex-end" | "flex-start" | undefined;
    readonly textAlign?: "inherit" | "left" | "center" | undefined;
    readonly marginBottom?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    readonly marginLeft?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    readonly marginRight?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    readonly marginTop?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    readonly maxWidth?: "1" | "2" | "24" | "full" | "4" | "8" | "44" | "12" | "16" | "20" | "32" | "40" | "28" | "30" | "34" | "36" | "48" | "54" | "60" | "80" | "200" | "max" | undefined;
    readonly minWidth?: "1" | "2" | "24" | "full" | "4" | "8" | "44" | "12" | "16" | "20" | "32" | "40" | "28" | "30" | "34" | "36" | "48" | "54" | "60" | "80" | "200" | "max" | undefined;
    readonly overflow?: "hidden" | "auto" | undefined;
    readonly paddingBottom?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    readonly paddingLeft?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    readonly paddingRight?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    readonly paddingTop?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    readonly position?: "fixed" | "absolute" | "relative" | undefined;
    readonly WebkitUserSelect?: "none" | undefined;
    readonly right?: "0" | undefined;
    readonly transition?: "default" | "transform" | undefined;
    readonly userSelect?: "none" | undefined;
    readonly width?: "1" | "2" | "24" | "full" | "4" | "8" | "44" | "12" | "16" | "20" | "32" | "40" | "28" | "30" | "34" | "36" | "48" | "54" | "60" | "80" | "200" | "max" | undefined;
    readonly backdropFilter?: "modalOverlay" | undefined;
    margin?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    marginX?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    marginY?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    padding?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    paddingX?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
    paddingY?: "1" | "0" | "2" | "3" | "6" | "10" | "24" | "4" | "8" | "44" | "12" | "14" | "16" | "18" | "20" | "32" | "40" | "28" | "36" | "48" | "-1" | "5" | "64" | undefined;
} & {
    reset?: keyof JSX.IntrinsicElements;
} & HTMLProperties<HTMLElement> & {
    as?: React.ElementType;
    className?: ClassValue;
    testId?: string;
} & React.RefAttributes<HTMLElement>>;
export type BoxProps = Parameters<typeof Box>[0];
export {};