@skbkontur/react-ui 4.9.2 → 4.10.0-theme2022.4

package/components/Loader/Loader.d.ts

@@ -1,117 +1,117 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { AnyObject } from '../../lib/utils';
-import { SpinnerProps } from '../Spinner';
-import { CommonProps } from '../../internal/CommonWrapper';
-export interface LoaderProps extends CommonProps {
-    children?: React.ReactNode;
-    /**
-     * Флаг переключения состояния лоадера
-     * @default false
-     */
-    active?: boolean;
-    /**
-     * Подпись под спиннером
-     */
-    caption?: SpinnerProps['caption'];
-    /**
-     * Компонент заменяющий спиннер.
-     */
-    component?: React.ReactNode;
-    /**
-     * Размер спиннера и текста
-     *
-     * @default normal
-     */
-    type?: 'mini' | 'normal' | 'big';
-    /**
-     * Время в миллисекундах для показа вуали без спиннера.
-     * @default 300
-     */
-    delayBeforeSpinnerShow?: number;
-    /**
-     * Минимальное время в миллисекундах для показа спиннера
-     * @default 1000
-     */
-    minimalDelayBeforeSpinnerHide?: number;
-}
-export interface LoaderState {
-    isStickySpinner: boolean;
-    isSpinnerVisible: boolean;
-    isLoaderActive: boolean;
-    spinnerStyle?: AnyObject;
-}
-export declare const LoaderDataTids: {
-    readonly veil: "Loader__Veil";
-    readonly spinner: "Loader__Spinner";
-};
-declare type DefaultProps = Required<Pick<LoaderProps, 'type' | 'active' | 'delayBeforeSpinnerShow' | 'minimalDelayBeforeSpinnerHide'>>;
-/**
- * Компонент `Loader` принимает внутрь себя контент, поверх которого в активном состоянии `Loader`'а будет отрисован спиннер
- *
- * Если вам нужен только сам спиннер без дополнительнго функционала - используйте компонент [Spinner](https://tech.skbkontur.ru/react-ui/#/Components/Spinner)
- */
-export declare class Loader extends React.Component<LoaderProps, LoaderState> {
-    static __KONTUR_REACT_UI__: string;
-    static defaultProps: DefaultProps;
-    private getProps;
-    static propTypes: {
-        /**
-         * показываем лоадер или нет
-         */
-        active: PropTypes.Requireable<boolean>;
-        /**
-         * Текст рядом с лоадером.
-         *
-         * @default  "Загрузка"
-         */
-        caption: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        component: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        /**
-         * Класс для обертки
-         */
-        className: PropTypes.Requireable<string>;
-        /**
-         * Тип спиннера: mini, normal, big
-         *
-         * @default  normal
-         *
-         * Spinner.types - все доступные типы
-         */
-        type: PropTypes.Requireable<string>;
-        /**
-         * Время в миллисекундах для показа вуали без спиннера.
-         * @default 300
-         */
-        delayBeforeSpinnerShow: PropTypes.Requireable<number>;
-        /**
-         * Минимальное время в миллисекундах для показа спиннера
-         * @default 1000
-         */
-        minimalDelayBeforeSpinnerHide: PropTypes.Requireable<number>;
-    };
-    private theme;
-    private setRootNode;
-    private spinnerContainerNode;
-    private childrenContainerNode;
-    private spinnerNode;
-    private layoutEvents;
-    private spinnerTask;
-    private childrenObserver;
-    constructor(props: LoaderProps);
-    componentDidMount(): void;
-    componentDidUpdate(prevProps: Readonly<LoaderProps>, prevState: Readonly<LoaderState>): void;
-    componentWillUnmount(): void;
-    static getDerivedStateFromProps(props: LoaderProps, state: LoaderState): Partial<LoaderState>;
-    render(): JSX.Element;
-    private renderMain;
-    private childrenRef;
-    private spinnerRef;
-    private renderSpinner;
-    private checkSpinnerPosition;
-    private disableChildrenFocus;
-    private enableChildrenFocus;
-    private makeObservable;
-    private makeUnobservable;
-}
-export {};
+import React from 'react';
+import PropTypes from 'prop-types';
+import { AnyObject } from '../../lib/utils';
+import { SpinnerProps } from '../Spinner';
+import { CommonProps } from '../../internal/CommonWrapper';
+export interface LoaderProps extends CommonProps {
+    children?: React.ReactNode;
+    /**
+     * Флаг переключения состояния лоадера
+     * @default false
+     */
+    active?: boolean;
+    /**
+     * Подпись под спиннером
+     */
+    caption?: SpinnerProps['caption'];
+    /**
+     * Компонент заменяющий спиннер.
+     */
+    component?: React.ReactNode;
+    /**
+     * Размер спиннера и текста
+     *
+     * @default normal
+     */
+    type?: 'mini' | 'normal' | 'big';
+    /**
+     * Время в миллисекундах для показа вуали без спиннера.
+     * @default 300
+     */
+    delayBeforeSpinnerShow?: number;
+    /**
+     * Минимальное время в миллисекундах для показа спиннера
+     * @default 1000
+     */
+    minimalDelayBeforeSpinnerHide?: number;
+}
+export interface LoaderState {
+    isStickySpinner: boolean;
+    isSpinnerVisible: boolean;
+    isLoaderActive: boolean;
+    spinnerStyle?: AnyObject;
+}
+export declare const LoaderDataTids: {
+    readonly veil: "Loader__Veil";
+    readonly spinner: "Loader__Spinner";
+};
+declare type DefaultProps = Required<Pick<LoaderProps, 'type' | 'active' | 'delayBeforeSpinnerShow' | 'minimalDelayBeforeSpinnerHide'>>;
+/**
+ * Компонент `Loader` принимает внутрь себя контент, поверх которого в активном состоянии `Loader`'а будет отрисован спиннер
+ *
+ * Если вам нужен только сам спиннер без дополнительнго функционала - используйте компонент [Spinner](https://tech.skbkontur.ru/react-ui/#/Components/Spinner)
+ */
+export declare class Loader extends React.Component<LoaderProps, LoaderState> {
+    static __KONTUR_REACT_UI__: string;
+    static defaultProps: DefaultProps;
+    private getProps;
+    static propTypes: {
+        /**
+         * показываем лоадер или нет
+         */
+        active: PropTypes.Requireable<boolean>;
+        /**
+         * Текст рядом с лоадером.
+         *
+         * @default  "Загрузка"
+         */
+        caption: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        component: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        /**
+         * Класс для обертки
+         */
+        className: PropTypes.Requireable<string>;
+        /**
+         * Тип спиннера: mini, normal, big
+         *
+         * @default  normal
+         *
+         * Spinner.types - все доступные типы
+         */
+        type: PropTypes.Requireable<string>;
+        /**
+         * Время в миллисекундах для показа вуали без спиннера.
+         * @default 300
+         */
+        delayBeforeSpinnerShow: PropTypes.Requireable<number>;
+        /**
+         * Минимальное время в миллисекундах для показа спиннера
+         * @default 1000
+         */
+        minimalDelayBeforeSpinnerHide: PropTypes.Requireable<number>;
+    };
+    private theme;
+    private setRootNode;
+    private spinnerContainerNode;
+    private childrenContainerNode;
+    private spinnerNode;
+    private layoutEvents;
+    private spinnerTask;
+    private childrenObserver;
+    constructor(props: LoaderProps);
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: Readonly<LoaderProps>, prevState: Readonly<LoaderState>): void;
+    componentWillUnmount(): void;
+    static getDerivedStateFromProps(props: LoaderProps, state: LoaderState): Partial<LoaderState>;
+    render(): JSX.Element;
+    private renderMain;
+    private childrenRef;
+    private spinnerRef;
+    private renderSpinner;
+    private checkSpinnerPosition;
+    private disableChildrenFocus;
+    private enableChildrenFocus;
+    private makeObservable;
+    private makeUnobservable;
+}
+export {};

package/components/Loader/Loader.styles/Loader.styles.js

@@ -5,7 +5,7 @@ var _templateObject, _templateObject2, _templateObject3, _templateObject4, _temp
 import { css, memoizeStyle } from "../../../lib/theming/Emotion";
 export var styles = memoizeStyle({
   active: function active(t) {
-    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      position: absolute;\n      bottom: 0;\n      left: 0;\n      right: 0;\n      top: 0;\n\n      background: ", ";\n    "])), t.loaderBg);
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      border-radius: ", ";\n      position: absolute;\n      bottom: 0;\n      left: 0;\n      right: 0;\n      top: 0;\n\n      background: ", ";\n    "])), t.loaderBorderRadius, t.loaderBg);
   },
   loader: function loader() {
     return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      box-sizing: border-box;\n      display: inline-block;\n      position: relative;\n      width: 100%;\n      z-index: inherit;\n    "])));

package/components/Loader/Loader.styles/Loader.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Loader.styles.ts"],"names":["css","memoizeStyle","styles","active","t","loaderBg","loader","spinnerContainer","spinnerContainerSticky","spinnerComponentWrapper"],"mappings":"4LAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;;AAGA,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;AACjCE,EAAAA,MADiC,kBAC1BC,CAD0B,EAChB;AACf,WAAOJ,GAAP;;;;;;;AAOgBI,IAAAA,CAAC,CAACC,QAPlB;;AASD,GAXgC;;AAajCC,EAAAA,MAbiC,oBAaxB;AACP,WAAON,GAAP;;;;;;;AAOD,GArBgC;;AAuBjCO,EAAAA,gBAvBiC,8BAuBd;AACjB,WAAOP,GAAP;;;;;;;;;;;;;;;;;;;AAmBD,GA3CgC;;AA6CjCQ,EAAAA,sBA7CiC,oCA6CR;AACvB,WAAOR,GAAP;;;AAGD,GAjDgC;;AAmDjCS,EAAAA,uBAnDiC,qCAmDP;AACxB,WAAOT,GAAP;;;AAGD,GAvDgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  active(t: Theme) {\n    return css`\n      position: absolute;\n      bottom: 0;\n      left: 0;\n      right: 0;\n      top: 0;\n\n      background: ${t.loaderBg};\n    `;\n  },\n\n  loader() {\n    return css`\n      box-sizing: border-box;\n      display: inline-block;\n      position: relative;\n      width: 100%;\n      z-index: inherit;\n    `;\n  },\n\n  spinnerContainer() {\n    return css`\n      display: block;\n      margin: auto;\n      text-align: center;\n\n      position: absolute;\n      bottom: 0;\n      left: 0;\n      right: 0;\n      top: 0;\n\n      &::before {\n        content: ' ';\n        display: inline-block;\n        height: 100%;\n        min-height: 100%;\n        vertical-align: middle;\n      }\n    `;\n  },\n\n  spinnerContainerSticky() {\n    return css`\n      position: fixed;\n    `;\n  },\n\n  spinnerComponentWrapper() {\n    return css`\n      display: inline-block;\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["Loader.styles.ts"],"names":["css","memoizeStyle","styles","active","t","loaderBorderRadius","loaderBg","loader","spinnerContainer","spinnerContainerSticky","spinnerComponentWrapper"],"mappings":"4LAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;;AAGA,OAAO,IAAMC,MAAM,GAAGD,YAAY,CAAC;AACjCE,EAAAA,MADiC,kBAC1BC,CAD0B,EAChB;AACf,WAAOJ,GAAP;AACmBI,IAAAA,CAAC,CAACC,kBADrB;;;;;;;AAQgBD,IAAAA,CAAC,CAACE,QARlB;;AAUD,GAZgC;;AAcjCC,EAAAA,MAdiC,oBAcxB;AACP,WAAOP,GAAP;;;;;;;AAOD,GAtBgC;;AAwBjCQ,EAAAA,gBAxBiC,8BAwBd;AACjB,WAAOR,GAAP;;;;;;;;;;;;;;;;;;;AAmBD,GA5CgC;;AA8CjCS,EAAAA,sBA9CiC,oCA8CR;AACvB,WAAOT,GAAP;;;AAGD,GAlDgC;;AAoDjCU,EAAAA,uBApDiC,qCAoDP;AACxB,WAAOV,GAAP;;;AAGD,GAxDgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\n\nexport const styles = memoizeStyle({\n  active(t: Theme) {\n    return css`\n      border-radius: ${t.loaderBorderRadius};\n      position: absolute;\n      bottom: 0;\n      left: 0;\n      right: 0;\n      top: 0;\n\n      background: ${t.loaderBg};\n    `;\n  },\n\n  loader() {\n    return css`\n      box-sizing: border-box;\n      display: inline-block;\n      position: relative;\n      width: 100%;\n      z-index: inherit;\n    `;\n  },\n\n  spinnerContainer() {\n    return css`\n      display: block;\n      margin: auto;\n      text-align: center;\n\n      position: absolute;\n      bottom: 0;\n      left: 0;\n      right: 0;\n      top: 0;\n\n      &::before {\n        content: ' ';\n        display: inline-block;\n        height: 100%;\n        min-height: 100%;\n        vertical-align: middle;\n      }\n    `;\n  },\n\n  spinnerContainerSticky() {\n    return css`\n      position: fixed;\n    `;\n  },\n\n  spinnerComponentWrapper() {\n    return css`\n      display: inline-block;\n    `;\n  },\n});\n"]}

package/components/Loader/Loader.styles.d.ts

@@ -1,8 +1,8 @@
-import { Theme } from '../../lib/theming/Theme';
-export declare const styles: {
-    active(t: Theme): string;
-    loader(): string;
-    spinnerContainer(): string;
-    spinnerContainerSticky(): string;
-    spinnerComponentWrapper(): string;
-};
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
+    active(t: Theme): string;
+    loader(): string;
+    spinnerContainer(): string;
+    spinnerContainerSticky(): string;
+    spinnerComponentWrapper(): string;
+};

package/components/Loader/index.d.ts

@@ -1 +1 @@
-export * from './Loader';
+export * from './Loader';

package/components/MenuHeader/MenuHeader.d.ts

@@ -1,23 +1,23 @@
-import React, { ReactNode } from 'react';
-import { CommonProps } from '../../internal/CommonWrapper';
-export interface MenuHeaderProps extends CommonProps {
-    _enableIconPadding?: boolean;
-    children: ReactNode;
-}
-export declare const MenuHeaderDataTids: {
-    readonly root: "MenuHeader__root";
-};
-/**
- * `Заголовок меню` используется для того, чтобы разделить `элементы меню` на категории в рамках одного меню.
- *
- * _Примечание_: `заголовок меню`, в отличие от `элемента меню` нельзя затаргетить с клавиатуры.
- *
- * Сущности в которых может быть использован `MenuHeader`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).
- */
-declare function MenuHeader({ _enableIconPadding, children, ...rest }: MenuHeaderProps): JSX.Element;
-declare namespace MenuHeader {
-    var __KONTUR_REACT_UI__: string;
-    var __MENU_HEADER__: boolean;
-}
-export { MenuHeader };
-export declare const isMenuHeader: (child: React.ReactNode) => child is React.ReactElement<MenuHeaderProps, string | React.JSXElementConstructor<any>>;
+import React, { ReactNode } from 'react';
+import { CommonProps } from '../../internal/CommonWrapper';
+export interface MenuHeaderProps extends CommonProps {
+    _enableIconPadding?: boolean;
+    children: ReactNode;
+}
+export declare const MenuHeaderDataTids: {
+    readonly root: "MenuHeader__root";
+};
+/**
+ * `Заголовок меню` используется для того, чтобы разделить `элементы меню` на категории в рамках одного меню.
+ *
+ * _Примечание_: `заголовок меню`, в отличие от `элемента меню` нельзя затаргетить с клавиатуры.
+ *
+ * Сущности в которых может быть использован `MenuHeader`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).
+ */
+declare function MenuHeader({ _enableIconPadding, children, ...rest }: MenuHeaderProps): JSX.Element;
+declare namespace MenuHeader {
+    var __KONTUR_REACT_UI__: string;
+    var __MENU_HEADER__: boolean;
+}
+export { MenuHeader };
+export declare const isMenuHeader: (child: React.ReactNode) => child is React.ReactElement<MenuHeaderProps, string | React.JSXElementConstructor<any>>;

package/components/MenuHeader/MenuHeader.styles.d.ts

@@ -1,5 +1,5 @@
-import { Theme } from '../../lib/theming/Theme';
-export declare const styles: {
-    root(t: Theme): string;
-    withLeftPadding(t: Theme): string;
-};
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
+    root(t: Theme): string;
+    withLeftPadding(t: Theme): string;
+};

package/components/MenuHeader/index.d.ts

@@ -1 +1 @@
-export * from './MenuHeader';
+export * from './MenuHeader';

package/components/MenuItem/MenuItem.d.ts

@@ -1,111 +1,111 @@
-import React from 'react';
-import PropTypes from 'prop-types';
-import { CommonProps } from '../../internal/CommonWrapper';
-export declare type MenuItemState = null | 'hover' | 'selected' | void;
-export interface MenuItemProps extends Omit<CommonProps, 'children'> {
-    /**
-     * @ignore
-     */
-    _enableIconPadding?: boolean;
-    /**
-     * Добавляет описание для элемента меню.
-     */
-    comment?: React.ReactNode;
-    /**
-     * Отключенное состояние.
-     */
-    disabled?: boolean;
-    /**
-     * Добавляет элементу меню иконку.
-     */
-    icon?: React.ReactElement<any>;
-    /**
-     * Меняет цвет текста на синий.
-     */
-    link?: boolean;
-    /**
-     * @ignore
-     */
-    loose?: boolean;
-    /**
-     * @ignore
-     */
-    state?: MenuItemState;
-    /**
-     * HTML-событие `onclick`.
-     */
-    onClick?: (event: React.SyntheticEvent<HTMLElement>) => void;
-    /**
-     * HTML-событие `mouseenter`.
-     */
-    onMouseEnter?: React.MouseEventHandler;
-    /**
-     * HTML-событие `mouseleave`.
-     */
-    onMouseLeave?: React.MouseEventHandler;
-    children?: React.ReactNode | ((state: MenuItemState) => React.ReactNode);
-    /**
-     * HTML-атрибут `target`.
-     */
-    target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];
-    /**
-     * HTML-атрибут `title`.
-     */
-    title?: React.AnchorHTMLAttributes<HTMLAnchorElement>['title'];
-    /**
-     * HTML-атрибут `href`.
-     */
-    href?: React.AnchorHTMLAttributes<HTMLAnchorElement>['href'];
-    /**
-     * HTML-атрибут `rel`.
-     *
-     * Для внешних ссылок аттрибут rel по умолчанию равен "noopener noreferrer"
-     */
-    rel?: React.AnchorHTMLAttributes<HTMLAnchorElement>['rel'];
-    /**
-     * Заменяет корневой элемент, на компонент переданный в проп.
-     *
-     * По умолчанию корневой элемент рендерится как `button`. <br />Если передан `href`, то вместо `button` рендерится `a`.
-     */
-    component?: React.ComponentType<any>;
-    isMobile?: boolean;
-}
-export declare const MenuItemDataTids: {
-    readonly root: "MenuItem__root";
-    readonly comment: "MenuItem__comment";
-};
-/**
- *
- * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.
- *
- * Сущности в которых может быть использован `MenuItem`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).
- */
-export declare class MenuItem extends React.Component<MenuItemProps> {
-    static __KONTUR_REACT_UI__: string;
-    static __MENU_ITEM__: boolean;
-    static propTypes: {
-        comment: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        disabled: PropTypes.Requireable<boolean>;
-        href: PropTypes.Requireable<string>;
-        icon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
-        loose: PropTypes.Requireable<boolean>;
-        state: PropTypes.Requireable<string>;
-        target: PropTypes.Requireable<string>;
-        onClick: PropTypes.Requireable<(...args: any[]) => any>;
-    };
-    state: {
-        iconOffsetTop: number;
-    };
-    private theme;
-    private mouseEntered;
-    private setRootNode;
-    private rootRef;
-    render(): JSX.Element;
-    componentDidMount(): void;
-    private renderMain;
-    private handleMouseEnterFix;
-    private handleMouseLeave;
-    private setRootRef;
-    private getComponent;
-}
-export declare const isMenuItem: (child: React.ReactNode) => child is React.ReactElement<any, string | React.JSXElementConstructor<any>>;
+import React from 'react';
+import PropTypes from 'prop-types';
+import { CommonProps } from '../../internal/CommonWrapper';
+export declare type MenuItemState = null | 'hover' | 'selected' | void;
+export interface MenuItemProps extends Omit<CommonProps, 'children'> {
+    /**
+     * @ignore
+     */
+    _enableIconPadding?: boolean;
+    /**
+     * Добавляет описание для элемента меню.
+     */
+    comment?: React.ReactNode;
+    /**
+     * Отключенное состояние.
+     */
+    disabled?: boolean;
+    /**
+     * Добавляет элементу меню иконку.
+     */
+    icon?: React.ReactElement<any>;
+    /**
+     * Меняет цвет текста на синий.
+     */
+    link?: boolean;
+    /**
+     * @ignore
+     */
+    loose?: boolean;
+    /**
+     * @ignore
+     */
+    state?: MenuItemState;
+    /**
+     * HTML-событие `onclick`.
+     */
+    onClick?: (event: React.SyntheticEvent<HTMLElement>) => void;
+    /**
+     * HTML-событие `mouseenter`.
+     */
+    onMouseEnter?: React.MouseEventHandler;
+    /**
+     * HTML-событие `mouseleave`.
+     */
+    onMouseLeave?: React.MouseEventHandler;
+    children?: React.ReactNode | ((state: MenuItemState) => React.ReactNode);
+    /**
+     * HTML-атрибут `target`.
+     */
+    target?: React.AnchorHTMLAttributes<HTMLAnchorElement>['target'];
+    /**
+     * HTML-атрибут `title`.
+     */
+    title?: React.AnchorHTMLAttributes<HTMLAnchorElement>['title'];
+    /**
+     * HTML-атрибут `href`.
+     */
+    href?: React.AnchorHTMLAttributes<HTMLAnchorElement>['href'];
+    /**
+     * HTML-атрибут `rel`.
+     *
+     * Для внешних ссылок аттрибут rel по умолчанию равен "noopener noreferrer"
+     */
+    rel?: React.AnchorHTMLAttributes<HTMLAnchorElement>['rel'];
+    /**
+     * Заменяет корневой элемент, на компонент переданный в проп.
+     *
+     * По умолчанию корневой элемент рендерится как `button`. <br />Если передан `href`, то вместо `button` рендерится `a`.
+     */
+    component?: React.ComponentType<any>;
+    isMobile?: boolean;
+}
+export declare const MenuItemDataTids: {
+    readonly root: "MenuItem__root";
+    readonly comment: "MenuItem__comment";
+};
+/**
+ *
+ * `MenuItem` - это вложенный компонент, задающий базовые стили для элемента меню и позволяющий навигироваться по элементам меню с помощью клавиатуры.
+ *
+ * Сущности в которых может быть использован `MenuItem`: [`DropdownMenu`](#/Components/DropdownMenu), [`Kebab`](#/Components/Kebab), [`TooltipMenu`](#/Components/TooltipMenu) и [`Select`](#/Components/Select).
+ */
+export declare class MenuItem extends React.Component<MenuItemProps> {
+    static __KONTUR_REACT_UI__: string;
+    static __MENU_ITEM__: boolean;
+    static propTypes: {
+        comment: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        disabled: PropTypes.Requireable<boolean>;
+        href: PropTypes.Requireable<string>;
+        icon: PropTypes.Requireable<PropTypes.ReactNodeLike>;
+        loose: PropTypes.Requireable<boolean>;
+        state: PropTypes.Requireable<string>;
+        target: PropTypes.Requireable<string>;
+        onClick: PropTypes.Requireable<(...args: any[]) => any>;
+    };
+    state: {
+        iconOffsetTop: number;
+    };
+    private theme;
+    private mouseEntered;
+    private setRootNode;
+    private rootRef;
+    render(): JSX.Element;
+    componentDidMount(): void;
+    private renderMain;
+    private handleMouseEnterFix;
+    private handleMouseLeave;
+    private setRootRef;
+    private getComponent;
+}
+export declare const isMenuItem: (child: React.ReactNode) => child is React.ReactElement<any, string | React.JSXElementConstructor<any>>;

package/components/MenuItem/MenuItem.styles/MenuItem.styles.js

@@ -10,7 +10,7 @@ export var styles = memoizeStyle({
     var legacyPaddingY = parseFloat(t.menuItemLegacyPaddingY);
     var paddingX = legacyPaddingX !== 0 ? parseFloat(t.menuItemPaddingX) + legacyPaddingX + "px" : t.menuItemPaddingX;
     var paddingY = legacyPaddingY !== 0 ? parseFloat(t.menuItemPaddingY) + legacyPaddingY + "px" : t.menuItemPaddingY;
-    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      ", ";\n\n      cursor: pointer;\n      display: block;\n      line-height: ", ";\n      font-size: ", ";\n      padding: ", " ", " ", " ", ";\n      position: relative;\n      text-decoration: none;\n      color: ", ";\n      border-radius: ", ";\n\n      button& {\n        min-width: 100%;\n      }\n    "])), resetButton(), t.menuItemLineHeight, t.menuItemFontSize, t.menuItemPaddingY, paddingX, paddingY, t.menuItemPaddingX, t.menuItemTextColor, t.menuItemBorderRadius);
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      ", ";\n\n      cursor: pointer;\n      display: block;\n      line-height: ", ";\n      font-size: ", ";\n      padding: ", " ", " ", " ", ";\n      position: relative;\n      text-decoration: none;\n      color: ", ";\n      border-radius: ", ";\n\n      button& {\n        min-width: 100%;\n      }\n\n      &:nth-last-of-type(n + 2) {\n        margin-bottom: ", ";\n      }\n    "])), resetButton(), t.menuItemLineHeight, t.menuItemFontSize, t.menuItemPaddingY, paddingX, paddingY, t.menuItemPaddingX, t.menuItemTextColor, t.menuItemBorderRadius, t.menuItemGap);
   },
   rootMobile: function rootMobile(t) {
     return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      font-size: ", ";\n      line-height: ", ";\n      padding: ", ";\n    "])), t.fontSizeMobile, t.lineHeightMobile, t.menuItemPaddingMobile);

package/components/MenuItem/MenuItem.styles/MenuItem.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["MenuItem.styles.ts"],"names":["css","memoizeStyle","resetButton","styles","root","t","legacyPaddingX","parseFloat","menuItemLegacyPaddingX","legacyPaddingY","menuItemLegacyPaddingY","paddingX","menuItemPaddingX","paddingY","menuItemPaddingY","menuItemLineHeight","menuItemFontSize","menuItemTextColor","menuItemBorderRadius","rootMobile","fontSizeMobile","lineHeightMobile","menuItemPaddingMobile","hover","menuItemHoverBg","menuItemHoverColor","selected","menuItemSelectedBg","disabled","menuItemDisabledColor","link","menuItemLinkColor","loose","withIcon","menuItemPaddingForIcon","comment","menuItemCommentColor","commentHover","menuItemCommentColorHover","icon","menuItemIconWidth","parseInt","menuItemIconLegacyMargin","menuItemIconLegacyShift","contentMobile"],"mappings":"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","sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    const legacyPaddingX = parseFloat(t.menuItemLegacyPaddingX);\n    const legacyPaddingY = parseFloat(t.menuItemLegacyPaddingY);\n\n    const paddingX = legacyPaddingX !== 0 ? `${parseFloat(t.menuItemPaddingX) + legacyPaddingX}px` : t.menuItemPaddingX;\n    const paddingY = legacyPaddingY !== 0 ? `${parseFloat(t.menuItemPaddingY) + legacyPaddingY}px` : t.menuItemPaddingY;\n\n    return css`\n      ${resetButton()};\n\n      cursor: pointer;\n      display: block;\n      line-height: ${t.menuItemLineHeight};\n      font-size: ${t.menuItemFontSize};\n      padding: ${t.menuItemPaddingY} ${paddingX} ${paddingY} ${t.menuItemPaddingX};\n      position: relative;\n      text-decoration: none;\n      color: ${t.menuItemTextColor};\n      border-radius: ${t.menuItemBorderRadius};\n\n      button& {\n        min-width: 100%;\n      }\n    `;\n  },\n\n  rootMobile(t: Theme) {\n    return css`\n      font-size: ${t.fontSizeMobile};\n      line-height: ${t.lineHeightMobile};\n      padding: ${t.menuItemPaddingMobile};\n    `;\n  },\n\n  hover(t: Theme) {\n    // Color with !important in purpose to override `a:hover`\n    return css`\n      background: ${t.menuItemHoverBg} !important;\n      color: ${t.menuItemHoverColor} !important;\n    `;\n  },\n  selected(t: Theme) {\n    return css`\n      background: ${t.menuItemSelectedBg} !important;\n    `;\n  },\n  disabled(t: Theme) {\n    return css`\n      background: transparent;\n      color: ${t.menuItemDisabledColor};\n      cursor: default;\n    `;\n  },\n  link(t: Theme) {\n    return css`\n      color: ${t.menuItemLinkColor};\n    `;\n  },\n  loose() {\n    return css`\n      padding-left: 15px;\n    `;\n  },\n  withIcon(t: Theme) {\n    return css`\n      padding-left: ${t.menuItemPaddingForIcon};\n    `;\n  },\n  comment(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColor};\n      white-space: normal;\n    `;\n  },\n  commentHover(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColorHover};\n      opacity: 0.6;\n    `;\n  },\n  icon(t: Theme) {\n    return css`\n      width: ${t.menuItemIconWidth};\n      display: inline-block;\n      position: absolute;\n      left: ${parseInt(t.menuItemPaddingX) + parseInt(t.menuItemIconLegacyMargin)}px;\n      transform: translateY(${t.menuItemIconLegacyShift});\n    `;\n  },\n  contentMobile() {\n    return css`\n      margin-left: 8px;\n    `;\n  },\n});\n"]}
+{"version":3,"sources":["MenuItem.styles.ts"],"names":["css","memoizeStyle","resetButton","styles","root","t","legacyPaddingX","parseFloat","menuItemLegacyPaddingX","legacyPaddingY","menuItemLegacyPaddingY","paddingX","menuItemPaddingX","paddingY","menuItemPaddingY","menuItemLineHeight","menuItemFontSize","menuItemTextColor","menuItemBorderRadius","menuItemGap","rootMobile","fontSizeMobile","lineHeightMobile","menuItemPaddingMobile","hover","menuItemHoverBg","menuItemHoverColor","selected","menuItemSelectedBg","disabled","menuItemDisabledColor","link","menuItemLinkColor","loose","withIcon","menuItemPaddingForIcon","comment","menuItemCommentColor","commentHover","menuItemCommentColorHover","icon","menuItemIconWidth","parseInt","menuItemIconLegacyMargin","menuItemIconLegacyShift","contentMobile"],"mappings":"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","sourcesContent":["import { Theme } from '../../lib/theming/Theme';\nimport { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { resetButton } from '../../lib/styles/Mixins';\n\nexport const styles = memoizeStyle({\n  root(t: Theme) {\n    const legacyPaddingX = parseFloat(t.menuItemLegacyPaddingX);\n    const legacyPaddingY = parseFloat(t.menuItemLegacyPaddingY);\n\n    const paddingX = legacyPaddingX !== 0 ? `${parseFloat(t.menuItemPaddingX) + legacyPaddingX}px` : t.menuItemPaddingX;\n    const paddingY = legacyPaddingY !== 0 ? `${parseFloat(t.menuItemPaddingY) + legacyPaddingY}px` : t.menuItemPaddingY;\n\n    return css`\n      ${resetButton()};\n\n      cursor: pointer;\n      display: block;\n      line-height: ${t.menuItemLineHeight};\n      font-size: ${t.menuItemFontSize};\n      padding: ${t.menuItemPaddingY} ${paddingX} ${paddingY} ${t.menuItemPaddingX};\n      position: relative;\n      text-decoration: none;\n      color: ${t.menuItemTextColor};\n      border-radius: ${t.menuItemBorderRadius};\n\n      button& {\n        min-width: 100%;\n      }\n\n      &:nth-last-of-type(n + 2) {\n        margin-bottom: ${t.menuItemGap};\n      }\n    `;\n  },\n\n  rootMobile(t: Theme) {\n    return css`\n      font-size: ${t.fontSizeMobile};\n      line-height: ${t.lineHeightMobile};\n      padding: ${t.menuItemPaddingMobile};\n    `;\n  },\n\n  hover(t: Theme) {\n    // Color with !important in purpose to override `a:hover`\n    return css`\n      background: ${t.menuItemHoverBg} !important;\n      color: ${t.menuItemHoverColor} !important;\n    `;\n  },\n  selected(t: Theme) {\n    return css`\n      background: ${t.menuItemSelectedBg} !important;\n    `;\n  },\n  disabled(t: Theme) {\n    return css`\n      background: transparent;\n      color: ${t.menuItemDisabledColor};\n      cursor: default;\n    `;\n  },\n  link(t: Theme) {\n    return css`\n      color: ${t.menuItemLinkColor};\n    `;\n  },\n  loose() {\n    return css`\n      padding-left: 15px;\n    `;\n  },\n  withIcon(t: Theme) {\n    return css`\n      padding-left: ${t.menuItemPaddingForIcon};\n    `;\n  },\n  comment(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColor};\n      white-space: normal;\n    `;\n  },\n  commentHover(t: Theme) {\n    return css`\n      color: ${t.menuItemCommentColorHover};\n      opacity: 0.6;\n    `;\n  },\n  icon(t: Theme) {\n    return css`\n      width: ${t.menuItemIconWidth};\n      display: inline-block;\n      position: absolute;\n      left: ${parseInt(t.menuItemPaddingX) + parseInt(t.menuItemIconLegacyMargin)}px;\n      transform: translateY(${t.menuItemIconLegacyShift});\n    `;\n  },\n  contentMobile() {\n    return css`\n      margin-left: 8px;\n    `;\n  },\n});\n"]}

package/components/MenuItem/MenuItem.styles.d.ts

@@ -1,15 +1,15 @@
-import { Theme } from '../../lib/theming/Theme';
-export declare const styles: {
-    root(t: Theme): string;
-    rootMobile(t: Theme): string;
-    hover(t: Theme): string;
-    selected(t: Theme): string;
-    disabled(t: Theme): string;
-    link(t: Theme): string;
-    loose(): string;
-    withIcon(t: Theme): string;
-    comment(t: Theme): string;
-    commentHover(t: Theme): string;
-    icon(t: Theme): string;
-    contentMobile(): string;
-};
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
+    root(t: Theme): string;
+    rootMobile(t: Theme): string;
+    hover(t: Theme): string;
+    selected(t: Theme): string;
+    disabled(t: Theme): string;
+    link(t: Theme): string;
+    loose(): string;
+    withIcon(t: Theme): string;
+    comment(t: Theme): string;
+    commentHover(t: Theme): string;
+    icon(t: Theme): string;
+    contentMobile(): string;
+};