@skbkontur/react-ui 0.0.0-0b8a8f7a39 → 0.0.0-0dca6f33be

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

@@ -1 +1 @@
-{"version":3,"sources":["Gapped.tsx"],"names":["React","PropTypes","CommonWrapper","is8pxTheme","ThemeContext","Gapped","theme","render","props","vertical","renderVertical","renderHorizontal","getGapValue","propsGap","gap","undefined","subsequentItemStyle","paddingTop","isFirst","children","Children","map","child","style","verticalAlign","wrap","itemStyle","display","marginLeft","marginTop","rootStyle","contStyle","whiteSpace","toArray","index","Component","__KONTUR_REACT_UI__","propTypes","number","bool","oneOf","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport PropTypes from 'prop-types';\r\n\r\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\r\nimport { is8pxTheme } from '../../lib/theming/ThemeHelpers';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\r\n\r\nexport interface GappedProps extends CommonProps {\r\n  /**\r\n   * Расстояние между элементами в пикселях\r\n   * @default 8\r\n   */\r\n  gap?: number;\r\n  /**\r\n   * Вертикальное выравнивание\r\n   * @default \"baseline\"\r\n   */\r\n  verticalAlign: 'top' | 'middle' | 'baseline' | 'bottom';\r\n  /**\r\n   * Расположение элементов по вертикали\r\n   * @default false\r\n   */\r\n  vertical: boolean;\r\n  /**\r\n   * Перенос элементов на новую строку при горизонтальном расположении\r\n   * @default false\r\n   */\r\n  wrap: boolean;\r\n  children: React.ReactNode;\r\n}\r\n\r\n/**\r\n * Контейнер, расстояние между элементами в котором равно `gap`.\r\n */\r\nexport class Gapped extends React.Component<GappedProps> {\r\n  public static __KONTUR_REACT_UI__ = 'Gapped';\r\n\r\n  public static propTypes = {\r\n    /**\r\n     * Расстояние между элементами.\r\n     */\r\n    gap: PropTypes.number,\r\n\r\n    /**\r\n     * Располагать элементы вертикально.\r\n     */\r\n    vertical: PropTypes.bool,\r\n\r\n    /**\r\n     * Вертикальное выравнивание элементов.\r\n     */\r\n    verticalAlign: PropTypes.oneOf(['top', 'middle', 'baseline', 'bottom']),\r\n  };\r\n\r\n  private theme!: Theme;\r\n\r\n  public static defaultProps = {\r\n    wrap: false,\r\n    vertical: false,\r\n    verticalAlign: 'baseline',\r\n  };\r\n\r\n  public render() {\r\n    return (\r\n      <ThemeContext.Consumer>\r\n        {theme => {\r\n          this.theme = theme;\r\n          return (\r\n            <CommonWrapper {...this.props}>\r\n              {this.props.vertical ? this.renderVertical() : this.renderHorizontal()}\r\n            </CommonWrapper>\r\n          );\r\n        }}\r\n      </ThemeContext.Consumer>\r\n    );\r\n  }\r\n\r\n  private getGapValue() {\r\n    // DEPRECATED remove in 4.0\r\n    const { gap: propsGap } = this.props;\r\n    if (propsGap !== undefined && propsGap !== null) {\r\n      return propsGap;\r\n    } else {\r\n      const gap = is8pxTheme(this.theme) ? 8 : 10;\r\n      return gap;\r\n    }\r\n  }\r\n\r\n  private renderVertical() {\r\n    const subsequentItemStyle: React.CSSProperties = {\r\n      paddingTop: this.getGapValue(),\r\n    };\r\n    let isFirst = true;\r\n    const children = React.Children.map(this.props.children, child => {\r\n      if (!child) {\r\n        return child;\r\n      }\r\n      const style = isFirst ? undefined : subsequentItemStyle;\r\n\r\n      isFirst = false;\r\n\r\n      return <div style={style}>{child}</div>;\r\n    });\r\n\r\n    return <div>{children}</div>;\r\n  }\r\n\r\n  private renderHorizontal() {\r\n    const { children, verticalAlign, wrap } = this.props;\r\n    const gap = this.getGapValue();\r\n    const itemStyle: React.CSSProperties = {\r\n      display: 'inline-block',\r\n      verticalAlign,\r\n      ...(wrap ? { marginLeft: gap, marginTop: gap } : {}),\r\n    };\r\n    const rootStyle: React.CSSProperties = wrap ? { paddingTop: 1 } : {};\r\n    const contStyle: React.CSSProperties = wrap ? { marginTop: -gap - 1, marginLeft: -gap } : { whiteSpace: 'nowrap' };\r\n\r\n    return (\r\n      <div style={rootStyle}>\r\n        <div style={contStyle}>\r\n          {React.Children.toArray(children).map((child, index) => {\r\n            const marginLeft = index === 0 ? undefined : gap;\r\n            return (\r\n              <span key={index} style={{ marginLeft, ...itemStyle }}>\r\n                {child}\r\n              </span>\r\n            );\r\n          })}\r\n        </div>\r\n      </div>\r\n    );\r\n  }\r\n}\r\n"]}
+{"version":3,"sources":["Gapped.tsx"],"names":["React","PropTypes","isNonNullable","CommonWrapper","rootNode","createPropsGetter","GappedDataTids","vertical","horizontal","Gapped","getProps","defaultProps","render","setRootNode","props","renderVertical","renderHorizontal","getGapValue","propsGap","gap","subsequentItemStyle","paddingTop","children","Children","toArray","filter","filterChildren","map","child","index","style","undefined","verticalAlign","wrap","itemStyle","display","marginLeft","marginTop","rootStyle","contStyle","whiteSpace","Boolean","Component","__KONTUR_REACT_UI__","propTypes","number","bool","oneOf"],"mappings":"2JAAA,OAAOA,KAAP,MAAkB,OAAlB;AACA,OAAOC,SAAP,MAAsB,YAAtB;;AAEA,SAASC,aAAT,QAA8B,iBAA9B;AACA,SAASC,aAAT,QAA2C,8BAA3C;AACA,SAASC,QAAT,QAAuC,oBAAvC;AACA,SAASC,iBAAT,QAAkC,6BAAlC;;;;;;;;;;;;;;;;;;;;;;;;;;AA0BA,OAAO,IAAMC,cAAc,GAAG;AAC5BC,EAAAA,QAAQ,EAAE,kBADkB;AAE5BC,EAAAA,UAAU,EAAE,oBAFgB,EAAvB;;;;;;;;;AAWP,OAJA;AACA;AACA,GAEA,IAAaC,MAAb,GADCL,QACD;;;;;;;;;;;;;;;;;;;;;;;;;;AA4BUM,IAAAA,QA5BV,GA4BqBL,iBAAiB,CAACI,MAAM,CAACE,YAAR,CA5BtC;;AA8BSC,EAAAA,MA9BT,GA8BE,kBAAgB;AACd;AACE,0BAAC,aAAD,aAAe,WAAW,EAAE,KAAKC,WAAjC,IAAkD,KAAKC,KAAvD;AACG,WAAKJ,QAAL,GAAgBH,QAAhB,GAA2B,KAAKQ,cAAL,EAA3B,GAAmD,KAAKC,gBAAL,EADtD,CADF;;;AAKD,GApCH;;AAsCUC,EAAAA,WAtCV,GAsCE,uBAAsB;AACpB;AACA,QAAaC,QAAb,GAA0B,KAAKJ,KAA/B,CAAQK,GAAR;AACA,QAAIjB,aAAa,CAACgB,QAAD,CAAjB,EAA6B;AAC3B,aAAOA,QAAP;AACD;;AAED,WAAO,CAAP;AACD,GA9CH;;AAgDUH,EAAAA,cAhDV,GAgDE,0BAAyB;AACvB,QAAMK,mBAAwC,GAAG;AAC/CC,MAAAA,UAAU,EAAE,KAAKJ,WAAL,EADmC,EAAjD;;AAGA,QAAMK,QAAQ,GAAGtB,KAAK,CAACuB,QAAN,CAAeC,OAAf,CAAuB,KAAKV,KAAL,CAAWQ,QAAlC;AACdG,IAAAA,MADc,CACP,KAAKC,cADE;AAEdC,IAAAA,GAFc,CAEV,UAACC,KAAD,EAAQC,KAAR,EAAkB;AACrB,UAAMC,KAAK,GAAGD,KAAK,KAAK,CAAV,GAAcE,SAAd,GAA0BX,mBAAxC;AACA;AACE,qCAAK,KAAK,EAAEU,KAAZ,EAAmB,GAAG,EAAED,KAAxB;AACGD,QAAAA,KADH,CADF;;;AAKD,KATc,CAAjB;;AAWA,wBAAO,6BAAK,YAAUtB,cAAc,CAACC,QAA9B,IAAyCe,QAAzC,CAAP;AACD,GAhEH;;AAkEUN,EAAAA,gBAlEV,GAkEE,4BAA2B;AACzB,sBAAoC,KAAKF,KAAzC,CAAQQ,QAAR,eAAQA,QAAR,CAAkBU,aAAlB,eAAkBA,aAAlB;AACA,QAAMC,IAAI,GAAG,KAAKvB,QAAL,GAAgBuB,IAA7B;AACA,QAAMd,GAAG,GAAG,KAAKF,WAAL,EAAZ;AACA,QAAMiB,SAA8B;AAClCC,MAAAA,OAAO,EAAE,cADyB;AAElCH,MAAAA,aAAa,EAAbA,aAFkC;AAG9BC,IAAAA,IAAI,GAAG,EAAEG,UAAU,EAAEjB,GAAd,EAAmBkB,SAAS,EAAElB,GAA9B,EAAH,GAAyC,EAHf,CAApC;;AAKA,QAAMmB,SAA8B,GAAGL,IAAI,GAAG,EAAEZ,UAAU,EAAE,CAAd,EAAH,GAAuB,EAAlE;AACA,QAAMkB,SAA8B,GAAGN,IAAI,GAAG,EAAEI,SAAS,EAAE,CAAClB,GAAD,GAAO,CAApB,EAAuBiB,UAAU,EAAE,CAACjB,GAApC,EAAH,GAA+C,EAAEqB,UAAU,EAAE,QAAd,EAA1F;;AAEA;AACE,mCAAK,YAAUlC,cAAc,CAACE,UAA9B,EAA0C,KAAK,EAAE8B,SAAjD;AACE,mCAAK,KAAK,EAAEC,SAAZ;AACGvC,MAAAA,KAAK,CAACuB,QAAN,CAAeC,OAAf,CAAuBF,QAAvB;AACEG,MAAAA,MADF,CACS,KAAKC,cADd;AAEEC,MAAAA,GAFF,CAEM,UAACC,KAAD,EAAQC,KAAR,EAAkB;AACrB,YAAMO,UAAU,GAAGP,KAAK,KAAK,CAAV,GAAcE,SAAd,GAA0BZ,GAA7C;AACA;AACE,wCAAM,GAAG,EAAEU,KAAX,EAAkB,KAAK,aAAIO,UAAU,EAAVA,UAAJ,IAAmBF,SAAnB,CAAvB;AACGN,UAAAA,KADH,CADF;;;AAKD,OATF,CADH,CADF,CADF;;;;AAgBD,GA9FH;;AAgGUF,EAAAA,cAhGV,GAgGE,wBAAuBE,KAAvB,EAAwD;AACtD,WAAOa,OAAO,CAACb,KAAD,CAAP,IAAkB,OAAOA,KAAP,KAAiB,QAA1C;AACD,GAlGH,iBAA4B5B,KAAK,CAAC0C,SAAlC,WACgBC,mBADhB,GACsC,QADtC,UAGgBC,SAHhB,GAG4B,EACxB;AACJ;AACA,KACIzB,GAAG,EAAElB,SAAS,CAAC4C,MAJS,EAMxB;AACJ;AACA,KACItC,QAAQ,EAAEN,SAAS,CAAC6C,IATI,EAWxB;AACJ;AACA,KACId,aAAa,EAAE/B,SAAS,CAAC8C,KAAV,CAAgB,CAAC,KAAD,EAAQ,QAAR,EAAkB,UAAlB,EAA8B,QAA9B,CAAhB,CAdS,EAH5B,UAsBgBpC,YAtBhB,GAsB6C,EACzCsB,IAAI,EAAE,KADmC,EAEzC1B,QAAQ,EAAE,KAF+B,EAGzCyB,aAAa,EAAE,UAH0B,EAtB7C","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\n\nimport { isNonNullable } from '../../lib/utils';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nexport interface GappedProps extends CommonProps {\n  /**\n   * Расстояние между элементами в пикселях\n   * @default 8\n   */\n  gap?: number;\n  /**\n   * Вертикальное выравнивание\n   * @default \"baseline\"\n   */\n  verticalAlign?: 'top' | 'middle' | 'baseline' | 'bottom';\n  /**\n   * Расположение элементов по вертикали\n   * @default false\n   */\n  vertical?: boolean;\n  /**\n   * Перенос элементов на новую строку при горизонтальном расположении\n   * @default false\n   */\n  wrap?: boolean;\n  children: React.ReactNode;\n}\n\nexport const GappedDataTids = {\n  vertical: 'Gapped__vertical',\n  horizontal: 'Gapped__horizontal',\n} as const;\n\ntype DefaultProps = Required<Pick<GappedProps, 'wrap' | 'vertical' | 'verticalAlign'>>;\n\n/**\n * Контейнер, расстояние между элементами в котором равно `gap`.\n */\n@rootNode\nexport class Gapped extends React.Component<GappedProps> {\n  public static __KONTUR_REACT_UI__ = 'Gapped';\n\n  public static propTypes = {\n    /**\n     * Расстояние между элементами.\n     */\n    gap: PropTypes.number,\n\n    /**\n     * Располагать элементы вертикально.\n     */\n    vertical: PropTypes.bool,\n\n    /**\n     * Вертикальное выравнивание элементов.\n     */\n    verticalAlign: PropTypes.oneOf(['top', 'middle', 'baseline', 'bottom']),\n  };\n\n  private setRootNode!: TSetRootNode;\n\n  public static defaultProps: DefaultProps = {\n    wrap: false,\n    vertical: false,\n    verticalAlign: 'baseline',\n  };\n\n  private getProps = createPropsGetter(Gapped.defaultProps);\n\n  public render() {\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        {this.getProps().vertical ? this.renderVertical() : this.renderHorizontal()}\n      </CommonWrapper>\n    );\n  }\n\n  private getGapValue() {\n    // DEPRECATED remove in 4.0\n    const { gap: propsGap } = this.props;\n    if (isNonNullable(propsGap)) {\n      return propsGap;\n    }\n\n    return 8;\n  }\n\n  private renderVertical() {\n    const subsequentItemStyle: React.CSSProperties = {\n      paddingTop: this.getGapValue(),\n    };\n    const children = React.Children.toArray(this.props.children)\n      .filter(this.filterChildren)\n      .map((child, index) => {\n        const style = index === 0 ? undefined : subsequentItemStyle;\n        return (\n          <div style={style} key={index}>\n            {child}\n          </div>\n        );\n      });\n\n    return <div data-tid={GappedDataTids.vertical}>{children}</div>;\n  }\n\n  private renderHorizontal() {\n    const { children, verticalAlign } = this.props;\n    const wrap = this.getProps().wrap;\n    const gap = this.getGapValue();\n    const itemStyle: React.CSSProperties = {\n      display: 'inline-block',\n      verticalAlign,\n      ...(wrap ? { marginLeft: gap, marginTop: gap } : {}),\n    };\n    const rootStyle: React.CSSProperties = wrap ? { paddingTop: 1 } : {};\n    const contStyle: React.CSSProperties = wrap ? { marginTop: -gap - 1, marginLeft: -gap } : { whiteSpace: 'nowrap' };\n\n    return (\n      <div data-tid={GappedDataTids.horizontal} style={rootStyle}>\n        <div style={contStyle}>\n          {React.Children.toArray(children)\n            .filter(this.filterChildren)\n            .map((child, index) => {\n              const marginLeft = index === 0 ? undefined : gap;\n              return (\n                <span key={index} style={{ marginLeft, ...itemStyle }}>\n                  {child}\n                </span>\n              );\n            })}\n        </div>\n      </div>\n    );\n  }\n\n  private filterChildren(child: React.ReactNode): boolean {\n    return Boolean(child) || typeof child === 'number';\n  }\n}\n"]}

package/components/Gapped/Gapped.d.ts

@@ -11,19 +11,24 @@ export interface GappedProps extends CommonProps {
      * Вертикальное выравнивание
      * @default "baseline"
      */
-    verticalAlign: 'top' | 'middle' | 'baseline' | 'bottom';
+    verticalAlign?: 'top' | 'middle' | 'baseline' | 'bottom';
     /**
      * Расположение элементов по вертикали
      * @default false
      */
-    vertical: boolean;
+    vertical?: boolean;
     /**
      * Перенос элементов на новую строку при горизонтальном расположении
      * @default false
      */
-    wrap: boolean;
+    wrap?: boolean;
     children: React.ReactNode;
 }
+export declare const GappedDataTids: {
+    readonly vertical: "Gapped__vertical";
+    readonly horizontal: "Gapped__horizontal";
+};
+declare type DefaultProps = Required<Pick<GappedProps, 'wrap' | 'vertical' | 'verticalAlign'>>;
 /**
  * Контейнер, расстояние между элементами в котором равно `gap`.
  */
@@ -43,14 +48,13 @@ export declare class Gapped extends React.Component<GappedProps> {
          */
         verticalAlign: PropTypes.Requireable<string>;
     };
-    private theme;
-    static defaultProps: {
-        wrap: boolean;
-        vertical: boolean;
-        verticalAlign: string;
-    };
+    private setRootNode;
+    static defaultProps: DefaultProps;
+    private getProps;
     render(): JSX.Element;
     private getGapValue;
     private renderVertical;
     private renderHorizontal;
+    private filterChildren;
 }
+export {};

package/components/Gapped/Gapped.md

@@ -1,43 +1,43 @@
-Вывод элементов с горизонтальным расположением
-
-```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>;
-```
-
-По умолчанию `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>
-</>;
-```
+Вывод элементов с горизонтальным расположением
+
+```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>;
+```
+
+По умолчанию `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/index/index.js.map

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

package/components/GlobalLoader/GlobalLoader/GlobalLoader.js

@@ -0,0 +1,242 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+import _assertThisInitialized from "@babel/runtime/helpers/esm/assertThisInitialized";
+import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+
+var _class, _class2, _temp;
+
+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;
+export var GlobalLoader = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
+  _inheritsLoose(GlobalLoader, _React$Component);
+
+  function GlobalLoader(props) {
+    var _currentGlobalLoader;
+
+    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 ? void 0 : _this.props.onStart();
+    }, _this.getProps().delayBeforeShow);
+    _this.stopTask = debounce(function () {
+      _this.setState({
+        visible: false,
+        successAnimationInProgress: false,
+        started: false
+      });
+
+      _this.props.onDone == null ? void 0 : _this.props.onDone();
+    }, _this.getProps().delayBeforeHide);
+
+    _this.setActive = function () {
+      var _this$getProps = _this.getProps(),
+          delayBeforeHide = _this$getProps.delayBeforeHide,
+          rejected = _this$getProps.rejected;
+
+      _this.startTask.cancel();
+
+      if (_this.state.successAnimationInProgress) {
+        _this.successAnimationInProgressTimeout = setTimeout(function () {
+          _this.setActive();
+        }, delayBeforeHide);
+      } else {
+        _this.setState({
+          visible: false,
+          done: false,
+          rejected: false,
+          accept: false,
+          started: true
+        });
+
+        if (rejected) {
+          _this.setReject(true);
+        } else {
+          _this.stopTask.cancel();
+
+          _this.startTask();
+        }
+      }
+    };
+
+    _this.setDone = function () {
+      _this.setState({
+        done: true,
+        successAnimationInProgress: true
+      });
+
+      _this.startTask.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 ? void 0 : _this.props.onReject();
+      } else if (_this.state.rejected) {
+        _this.setState({
+          accept: true
+        });
+
+        _this.props.onAccept == null ? void 0 : _this.props.onAccept();
+      }
+
+      _this.setState({
+        rejected: reject
+      });
+    };
+
+    _this.kill = function () {
+      _this.stopTask.cancel();
+
+      _this.startTask.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
+    };
+    _this.successAnimationInProgressTimeout = null;
+    (_currentGlobalLoader = currentGlobalLoader) == null ? void 0 : _currentGlobalLoader.kill();
+    currentGlobalLoader = _assertThisInitialized(_this);
+    return _this;
+  }
+
+  var _proto = GlobalLoader.prototype;
+
+  _proto.componentDidMount = function componentDidMount() {
+    var _this$getProps2 = this.getProps(),
+        active = _this$getProps2.active,
+        rejected = _this$getProps2.rejected;
+
+    if (active) {
+      this.setActive();
+    }
+
+    if (rejected) {
+      this.setReject(true);
+    }
+  };
+
+  _proto.componentDidUpdate = function componentDidUpdate(prevProps) {
+    var _this$getProps3 = this.getProps(),
+        expectedResponseTime = _this$getProps3.expectedResponseTime,
+        rejected = _this$getProps3.rejected,
+        active = _this$getProps3.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.componentWillUnmount = function componentWillUnmount() {
+    this.successAnimationInProgressTimeout && clearTimeout(this.successAnimationInProgressTimeout);
+  };
+
+  _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$getProps4 = this.getProps(),
+        delayBeforeHide = _this$getProps4.delayBeforeHide,
+        disableAnimations = _this$getProps4.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), _class2.defaultProps = {
+  expectedResponseTime: 1000,
+  delayBeforeShow: 1000,
+  delayBeforeHide: 1000,
+  rejected: false,
+  active: false,
+  disableAnimations: isTestEnv
+}, _class2.start = function (expectedResponseTime) {
+  currentGlobalLoader.setActive();
+
+  if (typeof expectedResponseTime === 'number') {
+    currentGlobalLoader.updateExpectedResponseTime(expectedResponseTime);
+  }
+}, _class2.done = function () {
+  currentGlobalLoader.setDone();
+}, _class2.reject = function () {
+  currentGlobalLoader.setReject(true);
+}, _class2.accept = function () {
+  currentGlobalLoader.setReject(false);
+}, _temp)) || _class;

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

@@ -0,0 +1 @@
+{"version":3,"sources":["GlobalLoader.tsx"],"names":["React","debounce","isTestEnv","CommonWrapper","rootNode","createPropsGetter","GlobalLoaderView","GlobalLoaderDataTids","root","currentGlobalLoader","GlobalLoader","props","getProps","defaultProps","startTask","setState","visible","onStart","delayBeforeShow","stopTask","successAnimationInProgress","started","onDone","delayBeforeHide","setActive","rejected","cancel","state","successAnimationInProgressTimeout","setTimeout","done","accept","setReject","setDone","reject","active","onReject","onAccept","kill","dead","expectedResponseTime","componentDidMount","componentDidUpdate","prevProps","componentWillUnmount","clearTimeout","render","status","disableAnimations","setRootNode","updateExpectedResponseTime","Component","start"],"mappings":"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","sourcesContent":["import React from 'react';\nimport debounce from 'lodash.debounce';\n\nimport { Nullable } from '../../typings/utility-types';\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   * Время(ms) до появления лоадера\n   */\n  delayBeforeShow?: number;\n  /**\n   * Время(ms) до исчезновения лоадера\n   */\n  delayBeforeHide?: number;\n  /**\n   * Ожидаемое время(ms) ответа сервера\n   */\n  expectedResponseTime?: number;\n  /**\n   * Анимация лоадера в виде спиннера\n   */\n  rejected?: boolean;\n  /**\n   * Показывать лоадер\n   */\n  active?: boolean;\n  /**\n   * Не показывать анимацию\n   */\n  disableAnimations?: boolean;\n  /**\n   * Коллбек, вызывающийся после появления лоадера\n   */\n  onStart?(): void;\n  /**\n   * Коллбек, вызывающийся после исчезновения лоадера\n   */\n  onDone?(): void;\n  /**\n   * Коллбек, вызывающийся после вызова `GlobalLoader.reject()`.\n   * Или после установки пропа `rejected = true`\n   */\n  onReject?(): void;\n  /**\n   * Коллбек, вызывающийся после вызова `GlobalLoader.accept()`.\n   * Или после установки пропа `rejected = false`\n   */\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@rootNode\nexport class GlobalLoader extends React.Component<GlobalLoaderProps, GlobalLoaderState> {\n  private successAnimationInProgressTimeout: Nullable<NodeJS.Timeout>;\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  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    this.successAnimationInProgressTimeout = null;\n    currentGlobalLoader?.kill();\n    currentGlobalLoader = this;\n  }\n  componentDidMount() {\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  componentWillUnmount() {\n    this.successAnimationInProgressTimeout && clearTimeout(this.successAnimationInProgressTimeout);\n  }\n\n  public render() {\n    let status: GlobalLoaderViewProps['status'] = 'standard';\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    const { delayBeforeHide, rejected } = this.getProps();\n    this.startTask.cancel();\n    if (this.state.successAnimationInProgress) {\n      this.successAnimationInProgressTimeout = setTimeout(() => {\n        this.setActive();\n      }, delayBeforeHide);\n    } else {\n      this.setState({ visible: false, done: false, rejected: false, accept: false, started: true });\n      if (rejected) {\n        this.setReject(true);\n      } else {\n        this.stopTask.cancel();\n        this.startTask();\n      }\n    }\n  };\n\n  public setDone = () => {\n    this.setState({ done: true, successAnimationInProgress: true });\n    this.startTask.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.setState({\n      dead: true,\n    });\n  };\n}\n"]}

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,106 @@
+import React from 'react';
+export interface GlobalLoaderProps {
+    /**
+     * Время(ms) до появления лоадера
+     */
+    delayBeforeShow?: number;
+    /**
+     * Время(ms) до исчезновения лоадера
+     */
+    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";
+};
+declare type DefaultProps = Required<Pick<GlobalLoaderProps, 'expectedResponseTime' | 'delayBeforeShow' | 'delayBeforeHide' | 'rejected' | 'active' | 'disableAnimations'>>;
+export declare class GlobalLoader extends React.Component<GlobalLoaderProps, GlobalLoaderState> {
+    private successAnimationInProgressTimeout;
+    private setRootNode;
+    private getProps;
+    private readonly startTask;
+    private readonly stopTask;
+    static defaultProps: DefaultProps;
+    constructor(props: GlobalLoaderProps);
+    componentDidMount(): void;
+    componentDidUpdate(prevProps: Readonly<GlobalLoaderProps>): void;
+    componentWillUnmount(): void;
+    render(): false | JSX.Element;
+    /**
+     * Запускает анимацию лоадера <br />
+     * Равносильно установке пропа `active = true`
+     *
+     * @public
+     */
+    static start: (expectedResponseTime?: number | undefined) => 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 {};