import { Theme as MuiTheme, ThemeOptions as MuiThemeOptions } from "@material-ui/core/styles";
import * as PasteLight from "@twilio-paste/design-tokens";
import * as PasteDark from "@twilio-paste/design-tokens/dist/themes/dark/tokens.common";
import { AvatarThemeProps } from "./Avatar/Avatar";
import { BadgeThemeProps } from "./Badge/Badge.definitions";
import { ButtonThemeProps } from "./Button";
import { CSSProps } from "./CSSProps";
import { CircularProgressThemeProps } from "./CircularProgress";
import { CountrySelectorThemeProps, UserCardThemeProps, MenuThemeProps } from "../internal-flex-commons/src";
import { DialerThemeProps } from "./Dialer/Dialer";
import { DialpadThemeProps } from "./Dialpad/Dialpad";
import { FiltersListThemeProps } from "./FiltersList/FiltersList";
import { SidePanelThemeProps } from "./SidePanel/SidePanel";
import { TabsThemeProps } from "./Tabs/Tabs";
import { TranscriptMessageIconProps } from "./channel/TranscriptMessageBubble/TranscriptMessageBubble.definitions";
import { ChatTheme } from "./channel/theme";
import { FormComponentsThemeProps } from "./formitems/theme";
export { withTheme } from "@emotion/react";
export declare const styled: import("@emotion/styled").CreateStyled;
export type PropsWithTheme<P> = ThemeProps & P;
/**
 * Baseplate colors for a theme
 * @category Theme
 * @ignore
 * @interface CoreThemeBaseplates
 * @property {string} base1 base1
 * @property {string} base2 base2
 * @property {string} base3 base3
 * @property {string} base4 base4
 * @property {string} base5 base5
 * @property {string} base6 base6
 * @property {string} base7 base7
 * @property {string} base8 base8
 * @property {string} base9 base9
 * @property {string} base10 base10
 * @property {string} base11 base11
 */
export interface CoreThemeBaseplates {
    base1: string;
    base2: string;
    base3: string;
    base4: string;
    base5: string;
    base6: string;
    base7: string;
    base8: string;
    base9: string;
    base10: string;
    base11: string;
}
/**
 * Core theme colors
 * Extends {@link CoreThemeBaseplates}
 * @typedef Theme.CoreThemeColors
 * @property {string} defaultButtonColor - The default button color
 * @property {string} lightTextColor - The color for the light texts
 * @property {string} darkTextColor - The color for the dark texts
 * @property {string} buttonHoverColor - The color for the buttons hover state
 * @property {string} tabSelectedColor - The color for the selected tabs
 * @property {string} connectingColor - The color for the connecting copy
 * @property {string} disconnectedColor - The color for the disconnected copy
 * @property {string} notificationBackgroundColorInformation - The color for the information notifications background
 * @property {string} notificationBackgroundColorSuccess - The color for the success notifications background
 * @property {string} notificationBackgroundColorError - The color for the error notifications background
 * @property {string} notificationIconColorWarning - The color for the icons in the warning notifications
 * @property {string} notificationBackgroundColorWarning - The color for the warning notifications background
 * @property {string} notificationIconColorError - The color for the icons in the error notifications
 * @property {string} userAvailableColor - The color for available users
 * @property {string} userUnavailableColor - The color for unavailable users
 * @property {string} errorColor - Error color
 * @property {string} errorGlow - Error glow
 * @property {string} circularProgressColor - Color of the circular progress bar
 * @property {string} disabledColor - Color the disabled elements
 * @property {string} focusColor - Color for the focused elements
 * @property {string} focusGlow - Color of the glow for the focused elements
 */
export interface CoreThemeColors extends CoreThemeBaseplates {
    defaultButtonColor: string;
    lightTextColor: string;
    darkTextColor: string;
    buttonHoverColor: string;
    tabSelectedColor: string;
    connectingColor: string;
    disconnectedColor: string;
    notificationBackgroundColorInformation: string;
    notificationBackgroundColorSuccess: string;
    notificationBackgroundColorError: string;
    notificationBackgroundColorWarning: string;
    notificationIconColorError: string;
    notificationIconColorWarning: string;
    userAvailableColor: string;
    userUnavailableColor: string;
    errorColor: string;
    errorGlow: string;
    disabledColor: string;
    focusColor: string;
    focusGlow: string;
}
/**
 * @typedef ThemeProps
 * @property {Theme} [theme]
 * @private
 */
export interface ThemeProps {
    theme?: Theme;
}
type ExtraBackgroundColors = {
    colorBackgroundSuccessStrong: string;
    colorBackgroundSuccessStronger: string;
    colorBackgroundSuccessWeak: string;
    colorBackgroundWarningWeak: string;
    colorBackgroundErrorWeak: string;
};
type ExtraBoxShadows = {
    shadowBorderDecorative40Weaker: string;
    shadowBorderInverseNewWeaker: string;
};
interface LightTokens {
    backgroundColors: Record<keyof typeof PasteLight["backgroundColors"], string> & ExtraBackgroundColors;
    textColors: Record<keyof typeof PasteLight["textColors"], string>;
    borderColors: Record<keyof typeof PasteLight["borderColors"], string>;
    boxShadows: Record<keyof typeof PasteLight["boxShadows"], string> & ExtraBoxShadows;
    borderWidths: Record<keyof typeof PasteLight["borderWidths"], string | 0>;
    radii: Record<keyof typeof PasteLight["radii"], string | 0>;
    fontSizes: Record<keyof typeof PasteLight["fontSizes"], string>;
    fontWeights: Record<keyof typeof PasteLight["fontWeights"], number>;
    lineHeights: Record<keyof typeof PasteLight["lineHeights"], string | 0>;
    sizings: Record<keyof typeof PasteLight["sizings"], string | 0>;
    spacings: Record<keyof typeof PasteLight["spacings"], string | 0>;
    fonts: Record<keyof typeof PasteLight["fonts"], string>;
    custom?: Record<string, unknown>;
}
interface DarkTokens {
    backgroundColors: Record<keyof typeof PasteDark["backgroundColors"], string> & ExtraBackgroundColors;
    textColors: Record<keyof typeof PasteDark["textColors"], string>;
    borderColors: Record<keyof typeof PasteDark["borderColors"], string>;
    boxShadows: Record<keyof typeof PasteDark["boxShadows"], string> & ExtraBoxShadows;
    borderWidths: Record<keyof typeof PasteDark["borderWidths"], string | 0>;
    radii: Record<keyof typeof PasteDark["radii"], string | 0>;
    fontSizes: Record<keyof typeof PasteDark["fontSizes"], string>;
    fontWeights: Record<keyof typeof PasteDark["fontWeights"], number>;
    lineHeights: Record<keyof typeof PasteDark["lineHeights"], string | 0>;
    sizings: Record<keyof typeof PasteDark["sizings"], string | 0>;
    spacings: Record<keyof typeof PasteDark["spacings"], string | 0>;
    fonts: Record<keyof typeof PasteDark["fonts"], string>;
    custom?: Record<string, unknown>;
}
export type Tokens = LightTokens | DarkTokens;
/**
 * @category Theme
 * @interface Theme
 * @property {ChatTheme} Chat - Chat components theme properties
 * @property {Theme.SidePanelThemeProps} SidePanel components theme properties
 * @property {Theme.BadgeThemeProps} Badge components theme properties
 * @property {Theme.FormComponentsThemeProps} FormComponents - FormComponents theme properties
 * @property {Theme.ButtonThemeProps} Button - Button theme properties
 * @property {Theme.MenuThemeProps} Menu - Menu theme properties
 * @property {object} Progress - Container for the Circular progress bar theme properties
 * @property {Theme.CircularProgressThemeProps} Progress.Circular - Circular progress bar theme properties
 * @property {Theme.DialpadThemeProps} Dialpad - Dialpad theme properties
 * @property {Theme.DialerThemeProps} Dialer - Dialer theme properties
 * @property {Theme.AvatarThemeProps} Avatar - Avatar theme properties
 * @property {Theme.TabsThemeProps} Tabs - Tabs theme properties
 * @property {Theme.UserCardThemeProps} UserCard - UserCard theme properties
 * @property {Theme.SidePanelThemeProps} SidePanel - SidePanel theme properties
 * @property {Theme.FiltersListThemeProps} FilterList - FilterList theme properties
 * @property {Theme.BadgeThemeProps} Badge - Badge theme properties
 * @property {Theme.CountrySelectorThemeProps} CountrySelector - CountrySelector theme properties
 * @property {object} IconContainer - Container for icons rendered in the Transcript
 * @property {object} EmailPauseSection - wrapper container for disabling the paused email task canvas
 * @property {object} TranscriptMessage - Custom styling to be applied to the ChatBubble paste component
 */
export interface Theme extends MuiThemeOptions {
    tokens: Tokens;
    isLight?: boolean;
    FormComponents: FormComponentsThemeProps;
    Button: ButtonThemeProps;
    Menu: MenuThemeProps;
    Dialpad: DialpadThemeProps;
    Dialer: DialerThemeProps;
    Avatar: AvatarThemeProps;
    Tabs: TabsThemeProps;
    UserCard: UserCardThemeProps;
    Chat: ChatTheme;
    Progress: {
        Circular: CircularProgressThemeProps;
    };
    SidePanel: SidePanelThemeProps;
    FilterList: FiltersListThemeProps;
    Badge: BadgeThemeProps;
    CountrySelector: CountrySelectorThemeProps;
    DataTable: {
        Header: {
            root: CSSProps;
            clickable: CSSProps;
            withSubHeader: CSSProps;
        };
        SubHeader: {
            root: CSSProps;
            clickable: CSSProps;
        };
    };
    IconContainer: {
        VirtualAgent: TranscriptMessageIconProps;
        Customer: TranscriptMessageIconProps;
        TranscriptListItem: TranscriptMessageIconProps;
    };
    EmailPauseSection: {
        Wrapper: CSSProps;
    };
    TranscriptMessage: {
        ChatMessage: {
            variants: {
                inbound: {
                    ChatBubble: CSSProps;
                };
                outbound: {
                    ChatBubble: CSSProps;
                };
            };
        };
    };
}
export interface ThemeSupport {
    theme?: Theme;
    className?: string;
}
export declare const getBackgroundWithHoverCSS: (background: string | number, lightHover: boolean, noHoverSelector?: boolean, disabled?: boolean) => string;
export type ExtendedMuiTheme = Theme & MuiTheme;
/**
 * Use to convert style objects to style strings
 * @private
 * */
export declare const styleObjectToString: (style: Record<string, any> | string) => string;
/**
 * Use to convert root style objects to strings.
 *
 * In some situations, we apply customers styles not only to a component, but to a whole document style tag (ie. iframes, external popup windows).
 * Customers are used to provide css rules directly, without providing a selector.
 * If they do so, however, for these components, their style won't work - ie. <style>background:red;</style>.
 * With the following script, we take those (and only those) properties that don't have a selector, and we group them under a generic 'body' selector.
 *
 * @private
 * */
export declare const rootStyleObjectToString: (style: Record<string, any> | string) => string;