@foxford/ui 2.4.3 → 2.5.0-beta-e62c2f8-20230622

package/dts/index.d.ts

@@ -1,14 +1,14 @@
 /// <reference types="react" />
 import * as styled_components from 'styled-components';
 import { DefaultTheme, FlattenSimpleInterpolation, CSSObject, SimpleInterpolation, css } from 'styled-components';
-import * as react from 'react';
-import { PureComponent, Component } from 'react';
 import { Link, NavLink } from 'react-router-dom';
-import { ResponsiveProperty as ResponsiveProperty$1, ResponsiveNamedProperty as ResponsiveNamedProperty$1 } from 'mixins/responsive-property';
-import { BaseProps as BaseProps$1, Nullable as Nullable$1, FontWeight as FontWeight$1 } from 'shared/interfaces';
 import { Display as Display$1 } from 'mixins/display';
+import { ResponsiveNamedProperty as ResponsiveNamedProperty$1, ResponsiveProperty as ResponsiveProperty$1 } from 'mixins/responsive-property';
 import { Color as Color$1 } from 'mixins/color';
 import { Anchor as Anchor$1 } from 'components/Anchor';
+import { BaseProps as BaseProps$1, Nullable as Nullable$1, FontWeight as FontWeight$1 } from 'shared/interfaces';
+import * as react from 'react';
+import { Component, PureComponent } from 'react';
 import { Classes } from 'react-modal';
 import * as rc_scrollbars_lib_Scrollbars_types from 'rc-scrollbars/lib/Scrollbars/types';
 import * as rc_scrollbars from 'rc-scrollbars';
@@ -206,7 +206,8 @@ declare enum ColorNames {
     grey = "grey",
     darkgrey = "darkgrey",
     lightgrey = "lightgrey",
-    superlightgrey = "superlightgrey"
+    superlightgrey = "superlightgrey",
+    transparent = "rgba(0,0,0,0)"
 }
 
 declare type ColorPropsProperties = 'color' | 'fontColor' | `${string}Color` | `color${string}`;
@@ -575,181 +576,6 @@ declare namespace ActionBtn {
     var displayName: string;
 }
 
-declare enum CurrencyCodes {
-    ALL = "ALL",
-    AFN = "AFN",
-    ARS = "ARS",
-    AWG = "AWG",
-    AUD = "AUD",
-    AZN = "AZN",
-    BSD = "BSD",
-    BBD = "BBD",
-    BYR = "BYR",
-    BZD = "BZD",
-    BMD = "BMD",
-    BOB = "BOB",
-    BAM = "BAM",
-    BWP = "BWP",
-    BGN = "BGN",
-    BRL = "BRL",
-    BND = "BND",
-    KHR = "KHR",
-    CAD = "CAD",
-    KYD = "KYD",
-    CLP = "CLP",
-    CNY = "CNY",
-    COP = "COP",
-    CRC = "CRC",
-    HRK = "HRK",
-    CUP = "CUP",
-    CZK = "CZK",
-    DKK = "DKK",
-    DOP = "DOP",
-    XCD = "XCD",
-    EGP = "EGP",
-    SVC = "SVC",
-    EEK = "EEK",
-    EUR = "EUR",
-    FKP = "FKP",
-    FJD = "FJD",
-    FRF = "FRF",
-    GHC = "GHC",
-    GIP = "GIP",
-    GTQ = "GTQ",
-    GGP = "GGP",
-    GYD = "GYD",
-    HNL = "HNL",
-    HKD = "HKD",
-    HUF = "HUF",
-    ISK = "ISK",
-    INR = "INR",
-    IDR = "IDR",
-    IRR = "IRR",
-    IMP = "IMP",
-    ILS = "ILS",
-    JMD = "JMD",
-    JPY = "JPY",
-    JEP = "JEP",
-    KZT = "KZT",
-    KGS = "KGS",
-    LAK = "LAK",
-    LVL = "LVL",
-    LBP = "LBP",
-    LRD = "LRD",
-    LTL = "LTL",
-    MKD = "MKD",
-    MYR = "MYR",
-    MUR = "MUR",
-    MXN = "MXN",
-    MNT = "MNT",
-    MZN = "MZN",
-    NAD = "NAD",
-    NPR = "NPR",
-    ANG = "ANG",
-    NZD = "NZD",
-    NIO = "NIO",
-    NGN = "NGN",
-    KPW = "KPW",
-    NOK = "NOK",
-    OMR = "OMR",
-    PKR = "PKR",
-    PAB = "PAB",
-    PYG = "PYG",
-    PEN = "PEN",
-    PHP = "PHP",
-    PLN = "PLN",
-    QAR = "QAR",
-    RON = "RON",
-    RUR = "RUR",
-    RUB = "RUB",
-    SHP = "SHP",
-    SAR = "SAR",
-    RSD = "RSD",
-    SCR = "SCR",
-    SGD = "SGD",
-    SBD = "SBD",
-    SOS = "SOS",
-    ZAR = "ZAR",
-    KRW = "KRW",
-    LKR = "LKR",
-    SEK = "SEK",
-    CHF = "CHF",
-    SRD = "SRD",
-    SYP = "SYP",
-    TWD = "TWD",
-    THB = "THB",
-    TTD = "TTD",
-    TRY = "TRY",
-    TRL = "TRL",
-    TVD = "TVD",
-    UAH = "UAH",
-    GBP = "GBP",
-    USD = "USD",
-    UYU = "UYU",
-    UZS = "UZS",
-    VEF = "VEF",
-    VND = "VND",
-    YER = "YER",
-    ZWD = "ZWD"
-}
-declare const CURRENCY_MAP: Readonly<Record<CurrencyCodes, string>>;
-
-interface AmountProps extends BaseProps, Color, ResponsiveNamedProperty<'size'>, Display {
-    /**
-     * Value for amount
-     */
-    value?: number;
-    /**
-     * Digits after point
-     */
-    digitsAfterPoint?: number;
-    /**
-     * Show zero minor part
-     */
-    showZeroMinorPart?: boolean;
-    /**
-     * Separator of major and minor part of amount
-     */
-    separator?: string;
-    /**
-     * International code of currency.
-     */
-    currency?: keyof typeof CurrencyCodes | string;
-    /**
-     * Use Header component for display amount
-     */
-    isHeader?: boolean;
-    /**
-     * Amount is not valid and will be crossed out with ```text-decoration: line-through```
-     */
-    crossedOut?: boolean;
-    /**
-     * If need only currency symbol
-     */
-    onlyCurrency?: boolean;
-}
-/**
- * Расширен:
- * - [`BaseProps`](#/Миксины)
- * - [`Color`](#/Миксины)
- * - [`ResponsiveNamedProperty<'size'>`](#/Миксины)
- */
-declare class Amount extends PureComponent<AmountProps> {
-    static displayName: string;
-    static defaultProps: {
-        isHeader: boolean;
-        showZeroMinorPart: boolean;
-        crossedOut: boolean;
-        digitsAfterPoint: number;
-        separator: string;
-        onlyCurrency: boolean;
-    };
-    static getCurrencySymbol(currencyCode: keyof typeof CurrencyCodes | string): any;
-    renderMinorPart(minorPart: string): JSX.Element | null;
-    renderCurrencySymbol: (currencySymbol: string) => JSX.Element;
-    render(): JSX.Element;
-}
-
 interface AnchorProps extends BaseProps, Color, ResponsiveNamedProperty<'size'>, Display {
     /**
      * Custom CSS class name
@@ -812,74 +638,82 @@ declare namespace Anchor {
     };
 }
 
-declare type ArrowStaticSize = 'l' | 'm' | 'xs';
-declare type ArrowSize = ArrowStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
-interface ArrowProps extends BaseProps$1 {
-    /** Square shape */
-    square?: boolean;
-    /** Used on colored background */
-    onColored?: boolean;
-    /** Size of button */
-    size?: ArrowSize;
-    /** Arrow points top */
-    top?: boolean;
-    /** Arrow points right */
-    right?: boolean;
-    /** Arrow points bottom */
-    bottom?: boolean;
-    /** Arrow points left */
-    left?: boolean;
-    /** Inverted colors */
-    inverse?: boolean;
-    /** Outlined appearance */
-    outline?: boolean;
+declare type ButtonStaticSize = 'l' | 'm' | 's' | 'xs';
+declare type ButtonSize = ButtonStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
+interface ButtonProps extends BaseProps$1, Display$1, Color$1, Color$1<'fontColor'>, ResponsiveNamedProperty$1<'padding'>, ResponsiveNamedProperty$1<'paddingTop'>, ResponsiveNamedProperty$1<'paddingRight'>, ResponsiveNamedProperty$1<'paddingBottom'>, ResponsiveNamedProperty$1<'paddingLeft'>, ResponsiveNamedProperty$1<'margin'>, ResponsiveNamedProperty$1<'marginTop'>, ResponsiveNamedProperty$1<'marginRight'>, ResponsiveNamedProperty$1<'marginBottom'>, ResponsiveNamedProperty$1<'marginLeft'>, ResponsiveNamedProperty$1<'fontSize'>, ResponsiveNamedProperty$1<'fluid', boolean>, ResponsiveNamedProperty$1<'width', 'auto' | 'l' | 'm' | 's' | 'xs' | number>, ResponsiveNamedProperty$1<'height', 'l' | 'm' | 's' | 'xs' | number> {
+    /** Root node polymorphic type */
+    as?: 'div' | 'span' | 'a' | 'button' | typeof Link | typeof Anchor$1;
+    /** Button size */
+    size?: ButtonSize;
+    /** Button type attribute */
+    type?: 'button' | 'submit' | 'reset';
+    /** Button icons */
+    icon?: JSX.Element | [Nullable$1<JSX.Element>, Nullable$1<JSX.Element>];
+    /** Button success state */
+    success?: boolean;
+    /** Loading state */
+    loading?: boolean;
     /** Button disabled */
     disabled?: boolean;
-    /** Click handler */
-    onClick?(event: React.MouseEvent<HTMLButtonElement>): void;
-}
-
-/**
- * Button with arrow icon
- */
-declare const Arrow: react.ForwardRefExoticComponent<ArrowProps & react.RefAttributes<HTMLButtonElement>>;
-
-interface AvatarProps extends BaseProps, Color {
+    /** Rounded border radius */
+    rounded?: boolean;
+    /** Rounded shape button */
+    round?: boolean;
+    /** Anchor target attribute  */
+    target?: string;
+    /** Anchor rel attribute */
+    rel?: string;
+    /** Auto-generate rel. You must specify domain inside theme */
+    autoRel?: boolean;
+    /** Anchor href attribute */
+    href?: string;
+    /** React router Link to prop */
+    to?: string;
     /**
-     * Children react node
+     * Indicates if there should not be any margin
+     * between this button and the previous one
      */
-    children?: React.ReactNode;
-    /** Title for avatar. Example user name. */
-    title?: string;
-    /** Image source */
-    src?: string;
-    /** Size of avatar */
-    size?: 'l' | 'm' | 'sm' | 's' | 'xs' | number;
-    /** Shadow of avatar */
-    shadow?: boolean;
-    /** Make ref func */
-    ref?: React.LegacyRef<HTMLDivElement>;
-    /**
-     * Generate color by title automatically
-     *
-     * `Performance Info`: Each render of component call getAvatarColor function on received title
-     */
-    autoColor?: boolean;
+    noSpacing?: boolean;
+    /** Outline appearance */
+    outline?: boolean;
+    /** Content font weight */
+    fontWeight?: FontWeight$1;
+    /** Associated form */
+    form?: string;
+    /** @preset {Default} Primary appearance */
+    primary?: boolean;
+    /** @preset {Default} Secondary appearance */
+    secondary?: boolean;
+    /** @preset {Default} Inverted colors */
+    inverted?: boolean;
+    /** @preset {Brand} Base appearance */
+    base?: boolean;
+    /** @preset {Brand} Clear appearance */
+    clear?: boolean;
+    /** @preset {Brand} Black colors appearance  */
+    black?: boolean;
+    /** @preset {Brand} Red colors appearance */
+    danger?: boolean;
+    /** @preset {Brand} Modifies appearance on colored background */
+    onColored?: boolean;
+    /** @deprecated Use outline */
+    basic?: boolean;
+    /** @deprecated Use children */
+    content?: React.ReactNode;
+    /** @deprecated Use ref */
+    innerRef?: React.LegacyRef<HTMLElement>;
+    /** Component's children */
+    children?: React.ReactNode | React.ReactNode[];
+    onClick?: (evt: React.SyntheticEvent<HTMLElement>) => void;
+    onClickCapture?: (evt: React.SyntheticEvent<HTMLElement>) => void;
+    onMouseEnter?: (evt: React.SyntheticEvent<HTMLElement>) => void;
+    onMouseLeave?: (evt: React.SyntheticEvent<HTMLElement>) => void;
 }
+
 /**
- * Расширен:
- * - [`BaseProps`](#/Миксины)
- * - [`Color`](#/Миксины)
+ * Main button
  */
-declare class Avatar extends PureComponent<AvatarProps> {
-    static defaultProps: {
-        size: string;
-        autoColor: boolean;
-    };
-    static displayName: string;
-    getAvatarText(): string;
-    render(): JSX.Element;
-}
+declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLElement>>;
 
 declare enum H {
     h1 = 0,
@@ -991,103 +825,315 @@ declare namespace Text {
     var displayName: string;
 }
 
-interface BadgeProps extends BaseProps, Color, Display {
+declare type AlertType = 'warning' | 'error' | 'info' | 'success';
+interface AlertProps extends BaseProps {
     /**
      * Children react node
      */
     children?: React.ReactNode;
+    clear?: boolean;
+    closeToast?(): void;
     content?: string | React.ReactNode;
+    /** Icon name (for inner Icon component) */
+    customIcon?: keyof typeof IconNames;
+    image?: React.ReactNode;
+    isCompact?: boolean;
+    link?: {
+        content: string | React.ReactNode;
+        onClick(): void;
+    };
+    linkProps?: AnchorProps;
+    noIcon?: boolean;
+    onClickCancelTimer?(): void;
+    primaryAction?: {
+        content: string | React.ReactNode;
+        onClick(): void;
+    };
+    primaryActionProps?: ButtonProps;
+    secondaryAction?: {
+        content: string | React.ReactNode;
+        onClick(): void;
+    };
+    secondaryActionProps?: ButtonProps;
     textProps?: TextProps;
-    /** Make badge round */
-    round?: string;
+    timer?: number;
+    title?: string;
+    titleProps?: TextProps;
+    type: AlertType;
 }
 /**
  * Расширен:
  * - [`BaseProps`](#/Миксины)
- * - [`Color`](#/Миксины)
- * - [`Display`](#/Миксины)
  */
-declare function Badge({ children, content, className, textProps, round, display, ...restProps }: BadgeProps): JSX.Element;
-declare namespace Badge {
+declare function Alert({ primaryAction, primaryActionProps, secondaryAction, secondaryActionProps, children, className, clear, content, customIcon, image, isCompact, link, linkProps, noIcon, onClickCancelTimer, closeToast, style, textProps, timer, title, titleProps, type, }: AlertProps): JSX.Element;
+declare namespace Alert {
     var displayName: string;
 }
 
-declare type ButtonStaticSize = 'l' | 'm' | 's' | 'xs';
-declare type ButtonSize = ButtonStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
-interface ButtonProps extends BaseProps$1, Display$1, Color$1, Color$1<'fontColor'>, ResponsiveNamedProperty$1<'padding'>, ResponsiveNamedProperty$1<'paddingTop'>, ResponsiveNamedProperty$1<'paddingRight'>, ResponsiveNamedProperty$1<'paddingBottom'>, ResponsiveNamedProperty$1<'paddingLeft'>, ResponsiveNamedProperty$1<'margin'>, ResponsiveNamedProperty$1<'marginTop'>, ResponsiveNamedProperty$1<'marginRight'>, ResponsiveNamedProperty$1<'marginBottom'>, ResponsiveNamedProperty$1<'marginLeft'>, ResponsiveNamedProperty$1<'fontSize'>, ResponsiveNamedProperty$1<'fluid', boolean>, ResponsiveNamedProperty$1<'width', 'auto' | 'l' | 'm' | 's' | 'xs' | number>, ResponsiveNamedProperty$1<'height', 'l' | 'm' | 's' | 'xs' | number> {
-    /** Root node polymorphic type */
-    as?: 'div' | 'span' | 'a' | 'button' | typeof Link | typeof Anchor$1;
-    /** Button size */
-    size?: ButtonSize;
-    /** Button type attribute */
-    type?: 'button' | 'submit' | 'reset';
-    /** Button icons */
-    icon?: JSX.Element | [Nullable$1<JSX.Element>, Nullable$1<JSX.Element>];
-    /** Button success state */
-    success?: boolean;
-    /** Loading state */
-    loading?: boolean;
+declare enum CurrencyCodes {
+    ALL = "ALL",
+    AFN = "AFN",
+    ARS = "ARS",
+    AWG = "AWG",
+    AUD = "AUD",
+    AZN = "AZN",
+    BSD = "BSD",
+    BBD = "BBD",
+    BYR = "BYR",
+    BZD = "BZD",
+    BMD = "BMD",
+    BOB = "BOB",
+    BAM = "BAM",
+    BWP = "BWP",
+    BGN = "BGN",
+    BRL = "BRL",
+    BND = "BND",
+    KHR = "KHR",
+    CAD = "CAD",
+    KYD = "KYD",
+    CLP = "CLP",
+    CNY = "CNY",
+    COP = "COP",
+    CRC = "CRC",
+    HRK = "HRK",
+    CUP = "CUP",
+    CZK = "CZK",
+    DKK = "DKK",
+    DOP = "DOP",
+    XCD = "XCD",
+    EGP = "EGP",
+    SVC = "SVC",
+    EEK = "EEK",
+    EUR = "EUR",
+    FKP = "FKP",
+    FJD = "FJD",
+    FRF = "FRF",
+    GHC = "GHC",
+    GIP = "GIP",
+    GTQ = "GTQ",
+    GGP = "GGP",
+    GYD = "GYD",
+    HNL = "HNL",
+    HKD = "HKD",
+    HUF = "HUF",
+    ISK = "ISK",
+    INR = "INR",
+    IDR = "IDR",
+    IRR = "IRR",
+    IMP = "IMP",
+    ILS = "ILS",
+    JMD = "JMD",
+    JPY = "JPY",
+    JEP = "JEP",
+    KZT = "KZT",
+    KGS = "KGS",
+    LAK = "LAK",
+    LVL = "LVL",
+    LBP = "LBP",
+    LRD = "LRD",
+    LTL = "LTL",
+    MKD = "MKD",
+    MYR = "MYR",
+    MUR = "MUR",
+    MXN = "MXN",
+    MNT = "MNT",
+    MZN = "MZN",
+    NAD = "NAD",
+    NPR = "NPR",
+    ANG = "ANG",
+    NZD = "NZD",
+    NIO = "NIO",
+    NGN = "NGN",
+    KPW = "KPW",
+    NOK = "NOK",
+    OMR = "OMR",
+    PKR = "PKR",
+    PAB = "PAB",
+    PYG = "PYG",
+    PEN = "PEN",
+    PHP = "PHP",
+    PLN = "PLN",
+    QAR = "QAR",
+    RON = "RON",
+    RUR = "RUR",
+    RUB = "RUB",
+    SHP = "SHP",
+    SAR = "SAR",
+    RSD = "RSD",
+    SCR = "SCR",
+    SGD = "SGD",
+    SBD = "SBD",
+    SOS = "SOS",
+    ZAR = "ZAR",
+    KRW = "KRW",
+    LKR = "LKR",
+    SEK = "SEK",
+    CHF = "CHF",
+    SRD = "SRD",
+    SYP = "SYP",
+    TWD = "TWD",
+    THB = "THB",
+    TTD = "TTD",
+    TRY = "TRY",
+    TRL = "TRL",
+    TVD = "TVD",
+    UAH = "UAH",
+    GBP = "GBP",
+    USD = "USD",
+    UYU = "UYU",
+    UZS = "UZS",
+    VEF = "VEF",
+    VND = "VND",
+    YER = "YER",
+    ZWD = "ZWD"
+}
+declare const CURRENCY_MAP: Readonly<Record<CurrencyCodes, string>>;
+
+interface AmountProps extends BaseProps, Color, ResponsiveNamedProperty<'size'>, Display {
+    /**
+     * Value for amount
+     */
+    value?: number;
+    /**
+     * Digits after point
+     */
+    digitsAfterPoint?: number;
+    /**
+     * Show zero minor part
+     */
+    showZeroMinorPart?: boolean;
+    /**
+     * Separator of major and minor part of amount
+     */
+    separator?: string;
+    /**
+     * International code of currency.
+     */
+    currency?: keyof typeof CurrencyCodes | string;
+    /**
+     * Use Header component for display amount
+     */
+    isHeader?: boolean;
+    /**
+     * Amount is not valid and will be crossed out with ```text-decoration: line-through```
+     */
+    crossedOut?: boolean;
+    /**
+     * If need only currency symbol
+     */
+    onlyCurrency?: boolean;
+}
+/**
+ * Расширен:
+ * - [`BaseProps`](#/Миксины)
+ * - [`Color`](#/Миксины)
+ * - [`ResponsiveNamedProperty<'size'>`](#/Миксины)
+ */
+declare class Amount extends PureComponent<AmountProps> {
+    static displayName: string;
+    static defaultProps: {
+        isHeader: boolean;
+        showZeroMinorPart: boolean;
+        crossedOut: boolean;
+        digitsAfterPoint: number;
+        separator: string;
+        onlyCurrency: boolean;
+    };
+    static getCurrencySymbol(currencyCode: keyof typeof CurrencyCodes | string): any;
+    renderMinorPart(minorPart: string): JSX.Element | null;
+    renderCurrencySymbol: (currencySymbol: string) => JSX.Element;
+    render(): JSX.Element;
+}
+
+declare type ArrowStaticSize = 'l' | 'm' | 'xs';
+declare type ArrowSize = ArrowStaticSize | ResponsiveProperty$1<`${number}rem` | number>;
+interface ArrowProps extends BaseProps$1 {
+    /** Square shape */
+    square?: boolean;
+    /** Used on colored background */
+    onColored?: boolean;
+    /** Size of button */
+    size?: ArrowSize;
+    /** Arrow points top */
+    top?: boolean;
+    /** Arrow points right */
+    right?: boolean;
+    /** Arrow points bottom */
+    bottom?: boolean;
+    /** Arrow points left */
+    left?: boolean;
+    /** Inverted colors */
+    inverse?: boolean;
+    /** Outlined appearance */
+    outline?: boolean;
     /** Button disabled */
     disabled?: boolean;
-    /** Rounded border radius */
-    rounded?: boolean;
-    /** Rounded shape button */
-    round?: boolean;
-    /** Anchor target attribute  */
-    target?: string;
-    /** Anchor rel attribute */
-    rel?: string;
-    /** Auto-generate rel. You must specify domain inside theme */
-    autoRel?: boolean;
-    /** Anchor href attribute */
-    href?: string;
-    /** React router Link to prop */
-    to?: string;
+    /** Click handler */
+    onClick?(event: React.MouseEvent<HTMLButtonElement>): void;
+}
+
+/**
+ * Button with arrow icon
+ */
+declare const Arrow: react.ForwardRefExoticComponent<ArrowProps & react.RefAttributes<HTMLButtonElement>>;
+
+interface AvatarProps extends BaseProps, Color {
     /**
-     * Indicates if there should not be any margin
-     * between this button and the previous one
+     * Children react node
      */
-    noSpacing?: boolean;
-    /** Outline appearance */
-    outline?: boolean;
-    /** Content font weight */
-    fontWeight?: FontWeight$1;
-    /** Associated form */
-    form?: string;
-    /** @preset {Default} Primary appearance */
-    primary?: boolean;
-    /** @preset {Default} Secondary appearance */
-    secondary?: boolean;
-    /** @preset {Default} Inverted colors */
-    inverted?: boolean;
-    /** @preset {Brand} Base appearance */
-    base?: boolean;
-    /** @preset {Brand} Clear appearance */
-    clear?: boolean;
-    /** @preset {Brand} Black colors appearance  */
-    black?: boolean;
-    /** @preset {Brand} Red colors appearance */
-    danger?: boolean;
-    /** @preset {Brand} Modifies appearance on colored background */
-    onColored?: boolean;
-    /** @deprecated Use outline */
-    basic?: boolean;
-    /** @deprecated Use children */
-    content?: React.ReactNode;
-    /** @deprecated Use ref */
-    innerRef?: React.LegacyRef<HTMLElement>;
-    /** Component's children */
-    children?: React.ReactNode | React.ReactNode[];
-    onClick?: (evt: React.SyntheticEvent<HTMLElement>) => void;
-    onClickCapture?: (evt: React.SyntheticEvent<HTMLElement>) => void;
-    onMouseEnter?: (evt: React.SyntheticEvent<HTMLElement>) => void;
-    onMouseLeave?: (evt: React.SyntheticEvent<HTMLElement>) => void;
+    children?: React.ReactNode;
+    /** Title for avatar. Example user name. */
+    title?: string;
+    /** Image source */
+    src?: string;
+    /** Size of avatar */
+    size?: 'l' | 'm' | 'sm' | 's' | 'xs' | number;
+    /** Shadow of avatar */
+    shadow?: boolean;
+    /** Make ref func */
+    ref?: React.LegacyRef<HTMLDivElement>;
+    /**
+     * Generate color by title automatically
+     *
+     * `Performance Info`: Each render of component call getAvatarColor function on received title
+     */
+    autoColor?: boolean;
+}
+/**
+ * Расширен:
+ * - [`BaseProps`](#/Миксины)
+ * - [`Color`](#/Миксины)
+ */
+declare class Avatar extends PureComponent<AvatarProps> {
+    static defaultProps: {
+        size: string;
+        autoColor: boolean;
+    };
+    static displayName: string;
+    getAvatarText(): string;
+    render(): JSX.Element;
 }
 
+interface BadgeProps extends BaseProps, Color, Display {
+    /**
+     * Children react node
+     */
+    children?: React.ReactNode;
+    content?: string | React.ReactNode;
+    textProps?: TextProps;
+    /** Make badge round */
+    round?: string;
+}
 /**
- * Main button
+ * Расширен:
+ * - [`BaseProps`](#/Миксины)
+ * - [`Color`](#/Миксины)
+ * - [`Display`](#/Миксины)
  */
-declare const Button: react.ForwardRefExoticComponent<ButtonProps & react.RefAttributes<HTMLElement>>;
+declare function Badge({ children, content, className, textProps, round, display, ...restProps }: BadgeProps): JSX.Element;
+declare namespace Badge {
+    var displayName: string;
+}
 
 interface ContainerProps extends BaseProps, Display, Color {
     /**
@@ -2501,4 +2547,4 @@ declare namespace Select {
     var displayName: string;
 }
 
-export { ActionBtn, Amount, Anchor, Arrow, Avatar, Badge, BaseProps, Button, COUNTRY_DATA, CURRENCY_MAP, Checkbox, ColorNames, ComponentContext, Container, ContextMenu, CurrencyCodes, DEFAULT_MASK, FontWeight, HEX, INITIAL_MASK, Icon, Input, InputField, Modal, Nullable, Paper, Progress, RGB, RGBA, Radio, withThemeScrollable as Scrollable, Section, Select, Separator, Spacer, Spinner, Switcher, Tabs, Tag, Text, Textarea, ThemeMode, ThemeName, ThemePreset, ThemeProvider, Tooltip, adultDarkTheme, adultLightTheme, babyDarkTheme, babyLightTheme, baseInputStyle, buildMediaQuery, color, defaultIcons, desktopFirst, mobileFirst, motherDarkTheme, motherLightTheme, property, responsiveNamedProperty, responsiveProperty, screenL, screenM, screenMaxL, screenMaxM, screenMaxS, screenMaxXl, screenMaxXs, screenMaxXxs, screenMinL, screenMinM, screenMinS, screenMinXl, screenMinXs, screenRetina, screenS, screenXl, screenXs, teenDarkTheme, teenLightTheme, defaultTheme as theme, vAlign };
+export { ActionBtn, Alert, Amount, Anchor, Arrow, Avatar, Badge, BaseProps, Button, COUNTRY_DATA, CURRENCY_MAP, Checkbox, ColorNames, ComponentContext, Container, ContextMenu, CurrencyCodes, DEFAULT_MASK, FontWeight, HEX, INITIAL_MASK, Icon, Input, InputField, Modal, Nullable, Paper, Progress, RGB, RGBA, Radio, withThemeScrollable as Scrollable, Section, Select, Separator, Spacer, Spinner, Switcher, Tabs, Tag, Text, Textarea, ThemeMode, ThemeName, ThemePreset, ThemeProvider, Tooltip, adultDarkTheme, adultLightTheme, babyDarkTheme, babyLightTheme, baseInputStyle, buildMediaQuery, color, defaultIcons, desktopFirst, mobileFirst, motherDarkTheme, motherLightTheme, property, responsiveNamedProperty, responsiveProperty, screenL, screenM, screenMaxL, screenMaxM, screenMaxS, screenMaxXl, screenMaxXs, screenMaxXxs, screenMinL, screenMinM, screenMinS, screenMinXl, screenMinXs, screenRetina, screenS, screenXl, screenXs, teenDarkTheme, teenLightTheme, defaultTheme as theme, vAlign };