@skbkontur/react-ui 0.0.0-d09e1235b2 → 0.0.0-d4e280859d

package/components/Gapped/Gapped.md

@@ -0,0 +1,44 @@
+### Вывод элементов с горизонтальным расположением
+
+```jsx harmony
+import { Button } from '@skbkontur/react-ui';
+
+<Gapped gap={20}>
+  <Button use="primary">Сохранить</Button>
+  <Button>Отмена</Button>
+</Gapped>;
+```
+
+### Вертикальное расположение
+
+```jsx harmony
+import { Checkbox } from '@skbkontur/react-ui';
+
+<Gapped vertical gap={20}>
+  <Checkbox checked>Write todos</Checkbox>
+  <Checkbox initialIndeterminate>Work in progress</Checkbox>
+  <Checkbox>Make things done</Checkbox>
+</Gapped>;
+```
+
+### Wrap
+По умолчанию `Gapped` выстраивает элементы в одну строчку, но с помощью свойства `wrap` можно включить перенос элементов на новую строку.
+При этом между строчками будет отступ равный значению свойста `gap`
+В таком случае из-за особенности верстки `Gapped` может перекрывать элементы расположенные сверху-слева.
+
+```jsx harmony
+import { Button, Checkbox, Toggle } from '@skbkontur/react-ui';
+
+<>
+  {"U Can't Touch This! => "}
+  <Toggle />
+
+  <div style={{ paddingTop: '10px', position: 'relative', width: '250px' }}>
+    <Gapped wrap gap={50}>
+      <Button use="primary">Сохранить</Button>
+      <Button>Отмена</Button>
+      <Checkbox>Я не робот</Checkbox>
+    </Gapped>
+  </div>
+</>;
+```

package/components/Gapped/__docs__/Gapped.mdx

@@ -0,0 +1,24 @@
+import * as GappedStories from './Gapped.docs.stories.tsx';
+import { Primary, ArgTypes, Stories, Description } from '@storybook/blocks';
+import { Meta } from '../../../.storybook/Meta';
+
+<Meta of={GappedStories} />
+
+# Gapped
+
+<Description />
+
+## Базовый пример
+
+<Primary />
+
+## Пропы
+
+<details>
+  <summary>Открыть таблицу с пропами</summary>
+  <ArgTypes />
+</details>
+
+## Примеры использования
+
+<Stories title="" includePrimary={false} />

package/components/Gapped/index/index.js

@@ -0,0 +1 @@
+export * from "../Gapped";

package/components/Gapped/index/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":[],"sources":["index.tsx"],"sourcesContent":["export * from './Gapped';\n"],"mappings":"AAAA,cAAc,UAAU","ignoreList":[]}

package/components/Gapped/index/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/Gapped/index.js",
+  "module": "index",
+  "types": "../index.d.ts",
+  "sideEffects": false
+}

package/components/Gapped/index.d.ts

@@ -1 +1 @@
-export { default, GappedProps } from './Gapped';
+export * from './Gapped';

package/components/Gapped/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../cjs/components/Gapped/index.js",
+  "module": "index",
+  "types": "index.d.ts",
+  "sideEffects": false
+}

package/components/GlobalLoader/GlobalLoader/GlobalLoader.js

@@ -0,0 +1,210 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+var _class, _GlobalLoader;
+import React from 'react';
+import debounce from 'lodash.debounce';
+import { isTestEnv } from "../../../lib/currentEnvironment";
+import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { rootNode } from "../../../lib/rootNode";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
+import { GlobalLoaderView } from "../GlobalLoaderView";
+export var GlobalLoaderDataTids = {
+  root: 'GlobalLoader'
+};
+var currentGlobalLoader;
+
+/**
+ * Глобальный лоадер `GlobalLoader` — это универсальный индикатор обмена данными с сервером.
+ * Он появляется у верхней границы экрана и выглядит как тоненькая полоска, окрашенная в фирменный цвет продукта.
+ *
+ * `GlobalLoader` может быть только один в приложении. Поэтому, каждый новый экземпляр компонента "убивает" предыдущий экземпляр, и начинает перехватывать статические методы.
+ *
+ * Предполагается монтирование компонента в единственном месте. И управление им через статические методы, либо через пропы.
+ *
+ * `GlobalLoader` работает в двух режимах:
+ * * как прогресс-бар, примерно показывает ход получения данных от сервера.
+ * * как спиннер, когда есть проблемы с соединением.
+ */
+export var GlobalLoader = rootNode(_class = (_GlobalLoader = /*#__PURE__*/function (_React$Component) {
+  function GlobalLoader(props) {
+    var _this;
+    _this = _React$Component.call(this, props) || this;
+    _this.getProps = createPropsGetter(GlobalLoader.defaultProps);
+    _this.startTask = debounce(function () {
+      _this.setState({
+        visible: true
+      });
+      _this.props.onStart == null || _this.props.onStart();
+    }, _this.getProps().delayBeforeShow);
+    _this.stopTask = debounce(function () {
+      _this.setState({
+        visible: false,
+        successAnimationInProgress: false,
+        started: false
+      });
+      _this.props.onDone == null || _this.props.onDone();
+    }, _this.getProps().delayBeforeHide);
+    _this.resumeTaskAfterSuccessAnimation = debounce(function () {
+      _this.setActive();
+    }, _this.getProps().delayBeforeHide);
+    _this.setActive = function () {
+      _this.startTask.cancel();
+      if (_this.state.successAnimationInProgress) {
+        _this.resumeTaskAfterSuccessAnimation();
+      } else {
+        _this.setState({
+          visible: false,
+          done: false,
+          rejected: false,
+          accept: false,
+          started: true
+        });
+        if (_this.getProps().rejected) {
+          _this.setReject(true);
+        } else {
+          _this.stopTask.cancel();
+          _this.startTask();
+        }
+      }
+    };
+    _this.setDone = function () {
+      if (!_this.state.started) {
+        return;
+      }
+      _this.setState({
+        done: true,
+        successAnimationInProgress: true
+      });
+      _this.startTask.cancel();
+      _this.resumeTaskAfterSuccessAnimation.cancel();
+      _this.stopTask();
+    };
+    _this.setReject = function (reject) {
+      if (!_this.state.visible && (_this.state.started || _this.getProps().active)) {
+        _this.setState({
+          visible: true
+        });
+      }
+      _this.startTask.cancel();
+      _this.stopTask.cancel();
+      if (reject) {
+        _this.props.onReject == null || _this.props.onReject();
+      } else if (_this.state.rejected) {
+        _this.setState({
+          accept: true
+        });
+        _this.props.onAccept == null || _this.props.onAccept();
+      }
+      _this.setState({
+        rejected: reject
+      });
+    };
+    _this.kill = function () {
+      _this.stopTask.cancel();
+      _this.startTask.cancel();
+      _this.resumeTaskAfterSuccessAnimation.cancel();
+      _this.setState({
+        dead: true
+      });
+    };
+    _this.state = {
+      started: false,
+      visible: false,
+      done: false,
+      rejected: false,
+      accept: false,
+      dead: false,
+      successAnimationInProgress: false,
+      expectedResponseTime: _this.getProps().expectedResponseTime
+    };
+    return _this;
+  }
+  _inheritsLoose(GlobalLoader, _React$Component);
+  var _proto = GlobalLoader.prototype;
+  _proto.componentDidMount = function componentDidMount() {
+    var _currentGlobalLoader;
+    (_currentGlobalLoader = currentGlobalLoader) == null || _currentGlobalLoader.kill(); // eslint-disable-next-line @typescript-eslint/no-this-alias
+    currentGlobalLoader = this;
+    var _this$getProps = this.getProps(),
+      active = _this$getProps.active,
+      rejected = _this$getProps.rejected;
+    if (active) {
+      this.setActive();
+    }
+    if (rejected) {
+      this.setReject(true);
+    }
+  };
+  _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
+    var _this$getProps2 = this.getProps(),
+      expectedResponseTime = _this$getProps2.expectedResponseTime,
+      rejected = _this$getProps2.rejected,
+      active = _this$getProps2.active;
+    if (expectedResponseTime !== prevProps.expectedResponseTime) {
+      this.setState({
+        expectedResponseTime: expectedResponseTime
+      });
+    }
+    if (rejected !== prevProps.rejected) {
+      this.setReject(rejected);
+    }
+    if (active !== prevProps.active) {
+      if (active) {
+        this.setActive();
+      } else {
+        this.setDone();
+      }
+    }
+  };
+  _proto.render = function render() {
+    var status = 'standard';
+    if (this.state.done) {
+      status = 'success';
+    } else if (this.state.rejected) {
+      status = 'error';
+    } else if (this.state.accept) {
+      status = 'accept';
+    }
+    var _this$getProps3 = this.getProps(),
+      delayBeforeHide = _this$getProps3.delayBeforeHide,
+      disableAnimations = _this$getProps3.disableAnimations;
+    return !this.state.dead && this.state.visible && /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+      rootNodeRef: this.setRootNode
+    }, this.props), /*#__PURE__*/React.createElement(GlobalLoaderView, {
+      expectedResponseTime: this.state.expectedResponseTime,
+      delayBeforeHide: delayBeforeHide,
+      status: status,
+      "data-tid": GlobalLoaderDataTids.root,
+      disableAnimations: disableAnimations
+    }));
+  } /**
+    * Запускает анимацию лоадера <br />
+    * Равносильно установке пропа `active = true`
+    *
+    * @public
+    */;
+  _proto.updateExpectedResponseTime = function updateExpectedResponseTime(expectedResponseTime) {
+    this.setState({
+      expectedResponseTime: expectedResponseTime
+    });
+  };
+  return GlobalLoader;
+}(React.Component), _GlobalLoader.__KONTUR_REACT_UI__ = 'GlobalLoader', _GlobalLoader.displayName = 'GlobalLoader', _GlobalLoader.defaultProps = {
+  expectedResponseTime: 1000,
+  delayBeforeShow: 1000,
+  delayBeforeHide: 1000,
+  rejected: false,
+  active: false,
+  disableAnimations: isTestEnv
+}, _GlobalLoader.start = function (expectedResponseTime) {
+  currentGlobalLoader.setActive();
+  if (typeof expectedResponseTime === 'number') {
+    currentGlobalLoader.updateExpectedResponseTime(expectedResponseTime);
+  }
+}, _GlobalLoader.done = function () {
+  currentGlobalLoader.setDone();
+}, _GlobalLoader.reject = function () {
+  currentGlobalLoader.setReject(true);
+}, _GlobalLoader.accept = function () {
+  currentGlobalLoader.setReject(false);
+}, _GlobalLoader)) || _class;

package/components/GlobalLoader/GlobalLoader/GlobalLoader.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","debounce","isTestEnv","CommonWrapper","rootNode","createPropsGetter","GlobalLoaderView","GlobalLoaderDataTids","root","currentGlobalLoader","GlobalLoader","_class","_GlobalLoader","_React$Component","props","_this","call","getProps","defaultProps","startTask","setState","visible","onStart","delayBeforeShow","stopTask","successAnimationInProgress","started","onDone","delayBeforeHide","resumeTaskAfterSuccessAnimation","setActive","cancel","state","done","rejected","accept","setReject","setDone","reject","active","onReject","onAccept","kill","dead","expectedResponseTime","_inheritsLoose","_proto","prototype","componentDidMount","_currentGlobalLoader","_this$getProps","componentDidUpdate","prevProps","_this$getProps2","render","status","_this$getProps3","disableAnimations","createElement","_extends","rootNodeRef","setRootNode","updateExpectedResponseTime","Component","__KONTUR_REACT_UI__","displayName","start"],"sources":["GlobalLoader.tsx"],"sourcesContent":["import React from 'react';\nimport debounce from 'lodash.debounce';\n\nimport { isTestEnv } from '../../lib/currentEnvironment';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { GlobalLoaderView, GlobalLoaderViewProps } from './GlobalLoaderView';\n\nexport interface GlobalLoaderProps {\n  /** Устанавливает задержку в миллисекундах до появления лоадера. */\n  delayBeforeShow?: number;\n\n  /** Устанавливает задержку в миллисекундах до исчезновения лоадера. */\n  delayBeforeHide?: number;\n\n  /** Устанавливает ожидаемое время(ms) ответа сервера. */\n  expectedResponseTime?: number;\n\n  /** Определяет, нужно ли показывать анимацию лоадера в виде спиннера. */\n  rejected?: boolean;\n\n  /** Определяет, показывать ли лоадер. */\n  active?: boolean;\n\n  /** Отключает анимацию. */\n  disableAnimations?: boolean;\n\n  /** Задает коллбек, вызывающийся после появления лоадера. */\n  onStart?(): void;\n\n  /** Задает коллбек, вызывающийся после исчезновения лоадера. */\n  onDone?(): void;\n\n  /** Задает коллбек, вызывающийся после вызова GlobalLoader.reject(). Или после установки пропа rejected = true. */\n  onReject?(): void;\n\n  /** Задает коллбек, вызывающийся после вызова GlobalLoader.accept() или установки пропа rejected = false. */\n  onAccept?(): void;\n}\nexport interface GlobalLoaderState {\n  visible: boolean;\n  done: boolean;\n  rejected: boolean;\n  accept: boolean;\n  dead: boolean;\n  successAnimationInProgress: boolean;\n  expectedResponseTime: number;\n  started: boolean;\n}\n\nexport const GlobalLoaderDataTids = {\n  root: 'GlobalLoader',\n} as const;\n\ntype DefaultProps = Required<\n  Pick<\n    GlobalLoaderProps,\n    'expectedResponseTime' | 'delayBeforeShow' | 'delayBeforeHide' | 'rejected' | 'active' | 'disableAnimations'\n  >\n>;\n\nlet currentGlobalLoader: GlobalLoader;\n\n/**\n * Глобальный лоадер `GlobalLoader` — это универсальный индикатор обмена данными с сервером.\n * Он появляется у верхней границы экрана и выглядит как тоненькая полоска, окрашенная в фирменный цвет продукта.\n *\n * `GlobalLoader` может быть только один в приложении. Поэтому, каждый новый экземпляр компонента \"убивает\" предыдущий экземпляр, и начинает перехватывать статические методы.\n *\n * Предполагается монтирование компонента в единственном месте. И управление им через статические методы, либо через пропы.\n *\n * `GlobalLoader` работает в двух режимах:\n * * как прогресс-бар, примерно показывает ход получения данных от сервера.\n * * как спиннер, когда есть проблемы с соединением.\n */\n@rootNode\nexport class GlobalLoader extends React.Component<GlobalLoaderProps, GlobalLoaderState> {\n  public static __KONTUR_REACT_UI__ = 'GlobalLoader';\n  public static displayName = 'GlobalLoader';\n\n  private setRootNode!: TSetRootNode;\n  private getProps = createPropsGetter(GlobalLoader.defaultProps);\n\n  private readonly startTask = debounce(() => {\n    this.setState({ visible: true });\n    this.props.onStart?.();\n  }, this.getProps().delayBeforeShow);\n\n  private readonly stopTask = debounce(() => {\n    this.setState({ visible: false, successAnimationInProgress: false, started: false });\n    this.props.onDone?.();\n  }, this.getProps().delayBeforeHide);\n\n  private readonly resumeTaskAfterSuccessAnimation = debounce(() => {\n    this.setActive();\n  }, this.getProps().delayBeforeHide);\n\n  public static defaultProps: DefaultProps = {\n    expectedResponseTime: 1000,\n    delayBeforeShow: 1000,\n    delayBeforeHide: 1000,\n    rejected: false,\n    active: false,\n    disableAnimations: isTestEnv,\n  };\n\n  constructor(props: GlobalLoaderProps) {\n    super(props);\n    this.state = {\n      started: false,\n      visible: false,\n      done: false,\n      rejected: false,\n      accept: false,\n      dead: false,\n      successAnimationInProgress: false,\n      expectedResponseTime: this.getProps().expectedResponseTime,\n    };\n  }\n  componentDidMount() {\n    currentGlobalLoader?.kill();\n    // eslint-disable-next-line @typescript-eslint/no-this-alias\n    currentGlobalLoader = this;\n    const { active, rejected } = this.getProps();\n    if (active) {\n      this.setActive();\n    }\n    if (rejected) {\n      this.setReject(true);\n    }\n  }\n\n  componentDidUpdate(prevProps: Readonly<GlobalLoaderProps>) {\n    const { expectedResponseTime, rejected, active } = this.getProps();\n    if (expectedResponseTime !== prevProps.expectedResponseTime) {\n      this.setState({ expectedResponseTime });\n    }\n    if (rejected !== prevProps.rejected) {\n      this.setReject(rejected);\n    }\n    if (active !== prevProps.active) {\n      if (active) {\n        this.setActive();\n      } else {\n        this.setDone();\n      }\n    }\n  }\n\n  public render() {\n    let status: GlobalLoaderViewProps['status'] = 'standard';\n\n    if (this.state.done) {\n      status = 'success';\n    } else if (this.state.rejected) {\n      status = 'error';\n    } else if (this.state.accept) {\n      status = 'accept';\n    }\n    const { delayBeforeHide, disableAnimations } = this.getProps();\n    return (\n      !this.state.dead &&\n      this.state.visible && (\n        <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n          <GlobalLoaderView\n            expectedResponseTime={this.state.expectedResponseTime}\n            delayBeforeHide={delayBeforeHide}\n            status={status}\n            data-tid={GlobalLoaderDataTids.root}\n            disableAnimations={disableAnimations}\n          />\n        </CommonWrapper>\n      )\n    );\n  }\n\n  /**\n   * Запускает анимацию лоадера <br />\n   * Равносильно установке пропа `active = true`\n   *\n   * @public\n   */\n  public static start = (expectedResponseTime?: number) => {\n    currentGlobalLoader.setActive();\n    if (typeof expectedResponseTime === 'number') {\n      currentGlobalLoader.updateExpectedResponseTime(expectedResponseTime);\n    }\n  };\n\n  /**\n   * Показывает анимацию успешного завершения загрузки <br />\n   * Равносильно установке пропа `active = false`\n   *\n   * @public\n   */\n  public static done = () => {\n    currentGlobalLoader.setDone();\n  };\n\n  /**\n   * Переключает анимацию лоадера в состояние спиннера <br />\n   * Равносильно установке пропа `rejected = true`\n   *\n   * @public\n   */\n  public static reject = () => {\n    currentGlobalLoader.setReject(true);\n  };\n\n  /**\n   * Возвращает лоадер из состояния спиннера в обычное и продолжает анимацию с того места, на котором она была прерван <br />\n   * Равносильно установке пропа `rejected = false`\n   *\n   * @public\n   */\n  public static accept = () => {\n    currentGlobalLoader.setReject(false);\n  };\n\n  public setActive = () => {\n    this.startTask.cancel();\n    if (this.state.successAnimationInProgress) {\n      this.resumeTaskAfterSuccessAnimation();\n    } else {\n      this.setState({ visible: false, done: false, rejected: false, accept: false, started: true });\n      if (this.getProps().rejected) {\n        this.setReject(true);\n      } else {\n        this.stopTask.cancel();\n        this.startTask();\n      }\n    }\n  };\n\n  public setDone = () => {\n    if (!this.state.started) {\n      return;\n    }\n    this.setState({ done: true, successAnimationInProgress: true });\n    this.startTask.cancel();\n    this.resumeTaskAfterSuccessAnimation.cancel();\n    this.stopTask();\n  };\n\n  public setReject = (reject: boolean) => {\n    if (!this.state.visible && (this.state.started || this.getProps().active)) {\n      this.setState({ visible: true });\n    }\n    this.startTask.cancel();\n    this.stopTask.cancel();\n    if (reject) {\n      this.props.onReject?.();\n    } else if (this.state.rejected) {\n      this.setState({ accept: true });\n      this.props.onAccept?.();\n    }\n    this.setState({ rejected: reject });\n  };\n\n  public updateExpectedResponseTime(expectedResponseTime: number) {\n    this.setState({ expectedResponseTime });\n  }\n\n  public kill = () => {\n    this.stopTask.cancel();\n    this.startTask.cancel();\n    this.resumeTaskAfterSuccessAnimation.cancel();\n    this.setState({\n      dead: true,\n    });\n  };\n}\n"],"mappings":"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","ignoreList":[]}

package/components/GlobalLoader/GlobalLoader/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/GlobalLoader/GlobalLoader.js",
+  "module": "GlobalLoader",
+  "types": "../GlobalLoader.d.ts",
+  "sideEffects": false
+}

package/components/GlobalLoader/GlobalLoader.d.ts

@@ -0,0 +1,97 @@
+import React from 'react';
+export interface GlobalLoaderProps {
+    /** Устанавливает задержку в миллисекундах до появления лоадера. */
+    delayBeforeShow?: number;
+    /** Устанавливает задержку в миллисекундах до исчезновения лоадера. */
+    delayBeforeHide?: number;
+    /** Устанавливает ожидаемое время(ms) ответа сервера. */
+    expectedResponseTime?: number;
+    /** Определяет, нужно ли показывать анимацию лоадера в виде спиннера. */
+    rejected?: boolean;
+    /** Определяет, показывать ли лоадер. */
+    active?: boolean;
+    /** Отключает анимацию. */
+    disableAnimations?: boolean;
+    /** Задает коллбек, вызывающийся после появления лоадера. */
+    onStart?(): void;
+    /** Задает коллбек, вызывающийся после исчезновения лоадера. */
+    onDone?(): void;
+    /** Задает коллбек, вызывающийся после вызова GlobalLoader.reject(). Или после установки пропа rejected = true. */
+    onReject?(): void;
+    /** Задает коллбек, вызывающийся после вызова GlobalLoader.accept() или установки пропа rejected = false. */
+    onAccept?(): void;
+}
+export interface GlobalLoaderState {
+    visible: boolean;
+    done: boolean;
+    rejected: boolean;
+    accept: boolean;
+    dead: boolean;
+    successAnimationInProgress: boolean;
+    expectedResponseTime: number;
+    started: boolean;
+}
+export declare const GlobalLoaderDataTids: {
+    readonly root: "GlobalLoader";
+};
+type DefaultProps = Required<Pick<GlobalLoaderProps, 'expectedResponseTime' | 'delayBeforeShow' | 'delayBeforeHide' | 'rejected' | 'active' | 'disableAnimations'>>;
+/**
+ * Глобальный лоадер `GlobalLoader` — это универсальный индикатор обмена данными с сервером.
+ * Он появляется у верхней границы экрана и выглядит как тоненькая полоска, окрашенная в фирменный цвет продукта.
+ *
+ * `GlobalLoader` может быть только один в приложении. Поэтому, каждый новый экземпляр компонента "убивает" предыдущий экземпляр, и начинает перехватывать статические методы.
+ *
+ * Предполагается монтирование компонента в единственном месте. И управление им через статические методы, либо через пропы.
+ *
+ * `GlobalLoader` работает в двух режимах:
+ * * как прогресс-бар, примерно показывает ход получения данных от сервера.
+ * * как спиннер, когда есть проблемы с соединением.
+ */
+export declare class GlobalLoader extends React.Component<GlobalLoaderProps, GlobalLoaderState> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    private setRootNode;
+    private getProps;
+    private readonly startTask;
+    private readonly stopTask;
+    private readonly resumeTaskAfterSuccessAnimation;
+    static defaultProps: DefaultProps;
+    constructor(props: GlobalLoaderProps);
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: Readonly<GlobalLoaderProps>): void;
+    render(): false | React.JSX.Element;
+    /**
+     * Запускает анимацию лоадера <br />
+     * Равносильно установке пропа `active = true`
+     *
+     * @public
+     */
+    static start: (expectedResponseTime?: number) => void;
+    /**
+     * Показывает анимацию успешного завершения загрузки <br />
+     * Равносильно установке пропа `active = false`
+     *
+     * @public
+     */
+    static done: () => void;
+    /**
+     * Переключает анимацию лоадера в состояние спиннера <br />
+     * Равносильно установке пропа `rejected = true`
+     *
+     * @public
+     */
+    static reject: () => void;
+    /**
+     * Возвращает лоадер из состояния спиннера в обычное и продолжает анимацию с того места, на котором она была прерван <br />
+     * Равносильно установке пропа `rejected = false`
+     *
+     * @public
+     */
+    static accept: () => void;
+    setActive: () => void;
+    setDone: () => void;
+    setReject: (reject: boolean) => void;
+    updateExpectedResponseTime(expectedResponseTime: number): void;
+    kill: () => void;
+}
+export {};

package/components/GlobalLoader/GlobalLoader.md

@@ -0,0 +1,97 @@
+Индикатор обмена данными с сервером.
+
+Глобальный Лоадер может быть только один в приложении. Поэтому, каждый новый экземпляр компонента
+"убивает" предыдущий
+экземпляр, и начинает перехватывать статические методы.
+
+Предполагается монтирование компонента в единственном месте. И управление им через статические методы, либо через пропы.
+
+### Все статические методы
+```jsx harmony
+import { Button, Gapped } from '@skbkontur/react-ui';
+
+<Gapped>
+  <Button onClick={GlobalLoader.start} use="primary">start</Button>
+  <Button onClick={GlobalLoader.done} use="success">done</Button>
+  <Button onClick={GlobalLoader.reject} use="danger">reject</Button>
+  <Button onClick={GlobalLoader.accept} use="pay">accept</Button>
+</Gapped>
+```
+
+### Монтирование и кастомизация
+```jsx harmony
+import { Button, Toggle, Gapped, GlobalLoader, ThemeContext, ThemeFactory } from '@skbkontur/react-ui';
+
+const myTheme = ThemeFactory.create({ globalLoaderColor: 'red' });
+
+const [manually, setManually] = React.useState(false);
+const [active, setActive] = React.useState(false);
+const [error, setError] = React.useState(false);
+
+const reset = () => {
+  if (manually) {
+    setManually(false);
+    setError(false);
+    setActive(false);
+  } else {
+    setManually(true);
+  }
+}
+
+<Gapped vertical>
+  <Toggle checked={manually} onValueChange={reset}>
+    Управление пропами
+  </Toggle>
+  <Toggle checked={active} onValueChange={setActive} disabled={!manually}>
+    <code>active</code>
+  </Toggle>
+  <Toggle checked={error} onValueChange={setError} disabled={!manually}>
+    <code>rejected</code>
+  </Toggle>
+
+  <ThemeContext.Provider value={myTheme}>
+    <GlobalLoader expectedResponseTime={2000} delayBeforeShow={1000} active={active} rejected={error}
+      onStart={() => console.log('start')}
+      onDone={() => console.log('done')}
+      onReject={() => console.log('reject')}
+      onAccept={() => console.log('accept')}
+    />
+  </ThemeContext.Provider>
+
+</Gapped>
+```
+
+
+### Статические методы в модалке
+```jsx harmony
+import { Button, Gapped, Modal } from '@skbkontur/react-ui';
+
+const [opened, setOpened] = React.useState(false);
+
+function renderModal() {
+  return (
+    <Modal onClose={close}>
+      <Modal.Header>Заголовок</Modal.Header>
+      <Modal.Body>
+        <Gapped>
+          <Button onClick={GlobalLoader.start} use="primary">start</Button>
+          <Button onClick={GlobalLoader.done} use="success">done</Button>
+        </Gapped>
+      </Modal.Body>
+    </Modal>
+  );
+}
+
+function open() {
+  setOpened(true);
+}
+
+function close() {
+  setOpened(false);
+}
+
+<div>
+  {opened && renderModal()}
+  <Button onClick={open}>Открыть</Button>
+</div>;
+```

package/components/GlobalLoader/GlobalLoaderView/GlobalLoaderView.js

@@ -0,0 +1,67 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _objectWithoutPropertiesLoose from "@babel/runtime/helpers/esm/objectWithoutPropertiesLoose";
+var _excluded = ["expectedResponseTime", "delayBeforeHide", "status", "disableAnimations"];
+import React, { useContext, useRef } from 'react';
+import { cx } from "../../../lib/theming/Emotion";
+import { ZIndex } from "../../../internal/ZIndex";
+import { ThemeContext } from "../../../lib/theming/ThemeContext";
+import { CommonWrapper } from "../../../internal/CommonWrapper";
+import { animations, styles } from "../GlobalLoaderView.styles";
+import { useGlobalLoaderPosition, useGlobalLoaderWidth } from "../useParams";
+export var GlobalLoaderView = function GlobalLoaderView(_ref) {
+  var expectedResponseTime = _ref.expectedResponseTime,
+    delayBeforeHide = _ref.delayBeforeHide,
+    status = _ref.status,
+    disableAnimations = _ref.disableAnimations,
+    rest = _objectWithoutPropertiesLoose(_ref, _excluded);
+  var ref = useRef(null);
+  var theme = useContext(ThemeContext);
+  var _useGlobalLoaderWidth = useGlobalLoaderWidth(status, ref),
+    width = _useGlobalLoaderWidth.width,
+    startWidth = _useGlobalLoaderWidth.startWidth,
+    fullWidth = _useGlobalLoaderWidth.fullWidth;
+  var _useGlobalLoaderPosit = useGlobalLoaderPosition(ref),
+    left = _useGlobalLoaderPosit.left;
+  var getAnimationClass = function getAnimationClass(status) {
+    if (!disableAnimations) {
+      switch (status) {
+        case 'success':
+          return animations.successAnimation(delayBeforeHide, width, left);
+        case 'accept':
+          if (startWidth < fullWidth * 0.8) {
+            return animations.acceptAnimation(theme, startWidth, expectedResponseTime, width, left);
+          }
+          return animations.slowAcceptAnimation(theme, startWidth, width, left);
+        case 'error':
+          return animations.errorAnimation(theme);
+        case 'standard':
+          return animations.standardAnimation(theme, expectedResponseTime);
+      }
+    }
+    if (disableAnimations) {
+      switch (status) {
+        case 'success':
+          return styles.successWithoutAnimation();
+        case 'accept':
+          return animations.acceptWithoutAnimation(startWidth);
+        case 'error':
+          return styles.errorWithoutAnimation();
+        case 'standard':
+          return styles.standardWithoutAnimation();
+      }
+    }
+  };
+  return /*#__PURE__*/(
+    React.createElement(CommonWrapper, _extends({}, rest, {
+      "data-status": status
+    }), /*#__PURE__*/
+    React.createElement(ZIndex, {
+      priority: "GlobalLoader",
+      className: styles.outer(theme)
+    }, /*#__PURE__*/
+    React.createElement("div", {
+      ref: ref,
+      className: cx(styles.inner(theme), getAnimationClass(status))
+    })))
+  );
+};

package/components/GlobalLoader/GlobalLoaderView/GlobalLoaderView.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["React","useContext","useRef","cx","ZIndex","ThemeContext","CommonWrapper","animations","styles","useGlobalLoaderPosition","useGlobalLoaderWidth","GlobalLoaderView","_ref","expectedResponseTime","delayBeforeHide","status","disableAnimations","rest","_objectWithoutPropertiesLoose","_excluded","ref","theme","_useGlobalLoaderWidth","width","startWidth","fullWidth","_useGlobalLoaderPosit","left","getAnimationClass","successAnimation","acceptAnimation","slowAcceptAnimation","errorAnimation","standardAnimation","successWithoutAnimation","acceptWithoutAnimation","errorWithoutAnimation","standardWithoutAnimation","createElement","_extends","priority","className","outer","inner"],"sources":["GlobalLoaderView.tsx"],"sourcesContent":["import React, { useContext, useRef } from 'react';\n\nimport { cx } from '../../lib/theming/Emotion';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\n\nimport { animations, styles } from './GlobalLoaderView.styles';\nimport { useGlobalLoaderPosition, useGlobalLoaderWidth } from './useParams';\n\nexport interface GlobalLoaderViewProps extends Pick<CommonProps, 'data-tid'> {\n  /** Устанавливает ожидаемое время(ms) ответа сервера. */\n  expectedResponseTime: number;\n\n  /** Устанавливает задержку в миллисекундах до исчезновения лоадера. */\n  delayBeforeHide: number;\n\n  /** Устанавливает статус операции. */\n  status?: 'success' | 'error' | 'standard' | 'accept';\n\n  /** Отключает анимацию. */\n  disableAnimations: boolean;\n}\n\nexport interface GlobalLoaderViewRef {\n  element: HTMLDivElement;\n  refObject: React.RefObject<GlobalLoaderViewRef['element']>;\n}\n\nexport const GlobalLoaderView = ({\n  expectedResponseTime,\n  delayBeforeHide,\n  status,\n  disableAnimations,\n  ...rest\n}: GlobalLoaderViewProps) => {\n  const ref = useRef<GlobalLoaderViewRef['element']>(null);\n  const theme = useContext(ThemeContext);\n  const { width, startWidth, fullWidth } = useGlobalLoaderWidth(status, ref);\n  const { left } = useGlobalLoaderPosition(ref);\n\n  const getAnimationClass = (status: GlobalLoaderViewProps['status']) => {\n    if (!disableAnimations) {\n      switch (status) {\n        case 'success':\n          return animations.successAnimation(delayBeforeHide, width, left);\n        case 'accept':\n          if (startWidth < fullWidth * 0.8) {\n            return animations.acceptAnimation(theme, startWidth, expectedResponseTime, width, left);\n          }\n          return animations.slowAcceptAnimation(theme, startWidth, width, left);\n        case 'error':\n          return animations.errorAnimation(theme);\n        case 'standard':\n          return animations.standardAnimation(theme, expectedResponseTime);\n      }\n    }\n\n    if (disableAnimations) {\n      switch (status) {\n        case 'success':\n          return styles.successWithoutAnimation();\n        case 'accept':\n          return animations.acceptWithoutAnimation(startWidth);\n        case 'error':\n          return styles.errorWithoutAnimation();\n        case 'standard':\n          return styles.standardWithoutAnimation();\n      }\n    }\n  };\n\n  return (\n    <CommonWrapper {...rest} data-status={status}>\n      <ZIndex priority=\"GlobalLoader\" className={styles.outer(theme)}>\n        <div ref={ref} className={cx(styles.inner(theme), getAnimationClass(status))} />\n      </ZIndex>\n    </CommonWrapper>\n  );\n};\n"],"mappings":"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","ignoreList":[]}

package/components/GlobalLoader/GlobalLoaderView/package.json

@@ -0,0 +1,6 @@
+{
+  "main": "../../../cjs/components/GlobalLoader/GlobalLoaderView.js",
+  "module": "GlobalLoaderView",
+  "types": "../GlobalLoaderView.d.ts",
+  "sideEffects": false
+}

package/components/GlobalLoader/GlobalLoaderView.d.ts

@@ -0,0 +1,17 @@
+import React from 'react';
+import { CommonProps } from '../../internal/CommonWrapper';
+export interface GlobalLoaderViewProps extends Pick<CommonProps, 'data-tid'> {
+    /** Устанавливает ожидаемое время(ms) ответа сервера. */
+    expectedResponseTime: number;
+    /** Устанавливает задержку в миллисекундах до исчезновения лоадера. */
+    delayBeforeHide: number;
+    /** Устанавливает статус операции. */
+    status?: 'success' | 'error' | 'standard' | 'accept';
+    /** Отключает анимацию. */
+    disableAnimations: boolean;
+}
+export interface GlobalLoaderViewRef {
+    element: HTMLDivElement;
+    refObject: React.RefObject<GlobalLoaderViewRef['element']>;
+}
+export declare const GlobalLoaderView: ({ expectedResponseTime, delayBeforeHide, status, disableAnimations, ...rest }: GlobalLoaderViewProps) => React.JSX.Element;