@skbkontur/react-ui 5.4.7-1b16b.0 → 5.4.7-7ccf0.0

package/cjs/components/GlobalLoader/GlobalLoaderView.js

@@ -0,0 +1,84 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard").default;exports.__esModule = true;exports.GlobalLoaderView = void 0;var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _objectWithoutPropertiesLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutPropertiesLoose"));var _react = _interopRequireWildcard(require("react"));
+
+var _renderEnvironment = require("../../lib/renderEnvironment");
+var _ZIndex = require("../../internal/ZIndex");
+var _ThemeContext = require("../../lib/theming/ThemeContext");
+
+var _CommonWrapper = require("../../internal/CommonWrapper");
+
+var _GlobalLoaderView = require("./GlobalLoaderView.styles");
+var _useParams = require("./useParams");var _excluded = ["expectedResponseTime", "delayBeforeHide", "status", "disableAnimations"];
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+var GlobalLoaderView = exports.GlobalLoaderView = function GlobalLoaderView(_ref)
+
+
+
+
+
+{var expectedResponseTime = _ref.expectedResponseTime,delayBeforeHide = _ref.delayBeforeHide,status = _ref.status,disableAnimations = _ref.disableAnimations,rest = (0, _objectWithoutPropertiesLoose2.default)(_ref, _excluded);
+  var ref = (0, _react.useRef)(null);
+  var theme = (0, _react.useContext)(_ThemeContext.ThemeContext);
+  var _useEmotion = (0, _renderEnvironment.useEmotion)(),cx = _useEmotion.cx;
+  var styles = (0, _renderEnvironment.useStyles)(_GlobalLoaderView.getStyles);
+  var animations = (0, _renderEnvironment.useStyles)(_GlobalLoaderView.getAnimations);
+  var _useGlobalLoaderWidth = (0, _useParams.useGlobalLoaderWidth)(status, ref),width = _useGlobalLoaderWidth.width,startWidth = _useGlobalLoaderWidth.startWidth,fullWidth = _useGlobalLoaderWidth.fullWidth;
+  var _useGlobalLoaderPosit = (0, _useParams.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.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({}, rest, { "data-status": status }), /*#__PURE__*/
+    _react.default.createElement(_ZIndex.ZIndex, { priority: "GlobalLoader", className: styles.outer(theme) }, /*#__PURE__*/
+    _react.default.createElement("div", { ref: ref, className: cx(styles.inner(theme), getAnimationClass(status)) })
+    )
+    ));
+
+};

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

@@ -0,0 +1 @@
+{"version":3,"names":["_react","_interopRequireWildcard","require","_renderEnvironment","_ZIndex","_ThemeContext","_CommonWrapper","_GlobalLoaderView","_useParams","_excluded","GlobalLoaderView","exports","_ref","expectedResponseTime","delayBeforeHide","status","disableAnimations","rest","_objectWithoutPropertiesLoose2","default","ref","useRef","theme","useContext","ThemeContext","_useEmotion","useEmotion","cx","styles","useStyles","getStyles","animations","getAnimations","_useGlobalLoaderWidth","useGlobalLoaderWidth","width","startWidth","fullWidth","_useGlobalLoaderPosit","useGlobalLoaderPosition","left","getAnimationClass","successAnimation","acceptAnimation","slowAcceptAnimation","errorAnimation","standardAnimation","successWithoutAnimation","acceptWithoutAnimation","errorWithoutAnimation","standardWithoutAnimation","createElement","CommonWrapper","_extends2","ZIndex","priority","className","outer","inner"],"sources":["GlobalLoaderView.tsx"],"sourcesContent":["import React, { useContext, useRef } from 'react';\n\nimport { useEmotion, useStyles } from '../../lib/renderEnvironment';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { ThemeContext } from '../../lib/theming/ThemeContext';\nimport type { CommonProps } from '../../internal/CommonWrapper';\nimport { CommonWrapper } from '../../internal/CommonWrapper';\n\nimport { getAnimations, getStyles } 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 { cx } = useEmotion();\n  const styles = useStyles(getStyles);\n  const animations = useStyles(getAnimations);\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/cjs/components/GlobalLoader/GlobalLoaderView.styles.d.ts

@@ -0,0 +1,17 @@
+import type { Emotion } from '@emotion/css/create-instance';
+import type { Theme } from '../../lib/theming/Theme';
+export declare const getStyles: import("../../lib/theming/Emotion").StylesGetter<{
+    outer(t: Theme): string;
+    inner(t: Theme): string;
+    standardWithoutAnimation(): string;
+    successWithoutAnimation(): string;
+    errorWithoutAnimation(): string;
+}>;
+export declare const getAnimations: (emotion: Emotion) => {
+    successAnimation(delayBeforeHide: number, width: number, left: number): string;
+    errorAnimation(t: Theme): string;
+    standardAnimation(t: Theme, expectedTime: number): string;
+    acceptAnimation(t: Theme, startWidth: number, expectedTime: number, width: number, left: number): string;
+    slowAcceptAnimation(t: Theme, startWidth: number, width: number, left: number): string;
+    acceptWithoutAnimation(startWidth: number): string;
+};

package/cjs/components/GlobalLoader/GlobalLoaderView.styles.js

@@ -0,0 +1,197 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getStyles = exports.getAnimations = void 0;var _taggedTemplateLiteralLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/taggedTemplateLiteralLoose"));
+
+var _Emotion = require("../../lib/theming/Emotion");var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13, _templateObject14, _templateObject15;
+
+
+var getStyles = exports.getStyles = (0, _Emotion.memoizeGetStyles)(function (_ref) {var css = _ref.css;return {
+    outer: function outer(t) {
+      return css(_templateObject || (_templateObject = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: ", ";\n      height: ", ";\n      background-color: ", ";\n      position: ", ";\n      left: ", ";\n      top: ", ";\n      right: ", ";\n      bottom: ", ";\n      overflow: hidden;\n    "])),
+      t.globalLoaderWidth,
+      t.globalLoaderHeight,
+      t.globalLoaderBackgroundColor,
+      t.globalLoaderPosition,
+      t.globalLoaderLeft,
+      t.globalLoaderTop,
+      t.globalLoaderRight,
+      t.globalLoaderBottom);
+
+
+    },
+    inner: function inner(t) {
+      return css(_templateObject2 || (_templateObject2 = (0, _taggedTemplateLiteralLoose2.default)(["\n      background-color: ", ";\n      width: 0;\n      height: ", ";\n      position: absolute;\n      left: 0;\n      overflow: hidden;\n    "])),
+      t.globalLoaderColor,
+
+      t.globalLoaderHeight);
+
+
+
+
+    },
+    standardWithoutAnimation: function standardWithoutAnimation() {
+      return css(_templateObject3 || (_templateObject3 = (0, _taggedTemplateLiteralLoose2.default)(["\n      left: 0;\n      width: 90%;\n    "])));
+
+
+
+    },
+    successWithoutAnimation: function successWithoutAnimation() {
+      return css(_templateObject4 || (_templateObject4 = (0, _taggedTemplateLiteralLoose2.default)(["\n      left: 0;\n      width: 100%;\n    "])));
+
+
+
+    },
+    errorWithoutAnimation: function errorWithoutAnimation() {
+      return css(_templateObject5 || (_templateObject5 = (0, _taggedTemplateLiteralLoose2.default)(["\n      left: 40%;\n      width: 20%;\n    "])));
+
+
+
+    }
+  };});
+
+var moveToRightAnimation = function moveToRightAnimation(_ref2) {var keyframes = _ref2.keyframes;return keyframes(_templateObject6 || (_templateObject6 = (0, _taggedTemplateLiteralLoose2.default)(["\n  0% {\n    left: 0;\n    width: 100%;\n  }\n  50% {\n    left: 50%;\n    width: 50%;\n  }\n  100% {\n    left: 99%;\n    width: 1%\n  }\n"])));};
+
+
+
+
+
+
+
+
+
+
+
+
+
+var spinnerAnimation = function spinnerAnimation(_ref3) {var keyframes = _ref3.keyframes;return keyframes(_templateObject7 || (_templateObject7 = (0, _taggedTemplateLiteralLoose2.default)(["\n  0% {\n    transform: translateX(50%) scaleX(.005);\n    animation-timing-function: cubic-bezier(.895,.03,.685,.22);\n  }\n  50% {\n    transform: translateX(0) scaleX(.35);\n    animation-timing-function: cubic-bezier(.165,.84,.44,1);\n  }\n  100% {\n    transform: translateX(-50%) scaleX(.005);\n  }\n"])));};
+
+
+
+
+
+
+
+
+
+
+
+
+var linearProgressAnimation = function linearProgressAnimation(_ref4) {var keyframes = _ref4.keyframes;return keyframes(_templateObject8 || (_templateObject8 = (0, _taggedTemplateLiteralLoose2.default)(["\n  from { width: 0; }\n  to { width: 80% }\n"])));};
+
+
+
+var slowProgressAnimation = function slowProgressAnimation(_ref5) {var keyframes = _ref5.keyframes;return keyframes(_templateObject9 || (_templateObject9 = (0, _taggedTemplateLiteralLoose2.default)(["\n  from { width: 80%; }\n  to { width: 90% }\n"])));};
+
+
+
+
+var getAnimations = exports.getAnimations = function getAnimations(emotion) {return {
+    successAnimation: function successAnimation(delayBeforeHide, width, left) {
+      return emotion.css(_templateObject10 || (_templateObject10 = (0, _taggedTemplateLiteralLoose2.default)(["\n      animation: successAnimation;\n      animation-duration: ", "ms;\n      @keyframes successAnimation {\n        0% {\n          width: ", "px;\n          left: ", "px;\n          opacity: 1;\n        }\n        20% {\n          width: 100%;\n          left: 0;\n          opacity: 1;\n        }\n        80% {\n          width: 100%;\n          left: 0;\n          opacity: 1;\n        }\n        100% {\n          width: 100%;\n          opacity: 0;\n        }\n      }\n    "])),
+
+      delayBeforeHide,
+
+
+      width,
+      left);
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+    },
+    errorAnimation: function errorAnimation(t) {
+      var transitionDuration = parseInt(t.globalLoaderTransitionToSpinnerDuration);
+      var spinnerAnimationDuration = parseInt(t.globalLoaderSpinnerAnimationDuration);
+
+      return emotion.css(_templateObject11 || (_templateObject11 = (0, _taggedTemplateLiteralLoose2.default)(["\n      left: 0;\n      width: 100%;\n      animation:\n        ", " ", "ms linear,\n        ", "ms ", " ", "ms infinite alternate;\n    "])),
+
+
+
+      moveToRightAnimation(emotion), transitionDuration,
+      spinnerAnimationDuration, spinnerAnimation(emotion), transitionDuration);
+
+    },
+    standardAnimation: function standardAnimation(t, expectedTime) {
+      var slowProgressAnimationTime = parseInt(t.globalLoaderSlowAnimationDuration);
+      return emotion.css(_templateObject12 || (_templateObject12 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: 90%;\n      animation:\n        ", " ", "ms cubic-bezier(0, 0.4, 0.4, 1),\n        ", "ms ", " ", "ms linear;\n    "])),
+
+
+      linearProgressAnimation(emotion), expectedTime,
+      slowProgressAnimationTime, slowProgressAnimation(emotion), expectedTime);
+
+    },
+    acceptAnimation: function acceptAnimation(t, startWidth, expectedTime, width, left) {
+      var transitionTime = parseInt(t.globalLoaderTransitionFromSpinnerDuration);
+      var slowProgressAnimationTime = parseInt(t.globalLoaderSlowAnimationDuration);
+      return emotion.css(_templateObject13 || (_templateObject13 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: 90%;\n      animation:\n        transitionAnimation ", "ms linear,\n        ", "ms acceptAnimation ", "ms cubic-bezier(0, 0.4, 0.4, 1),\n        ", "ms ", " ", "ms linear;\n      @keyframes transitionAnimation {\n        from {\n          width: ", "px;\n          left: ", "px;\n        }\n        to {\n          width: ", "px;\n          left: 0;\n        }\n      }\n      @keyframes acceptAnimation {\n        from {\n          width: ", "px;\n        }\n        to {\n          width: 80%;\n        }\n      }\n    "])),
+
+
+      transitionTime,
+      expectedTime, transitionTime,
+      slowProgressAnimationTime, slowProgressAnimation(emotion), expectedTime + transitionTime,
+
+
+      width,
+      left,
+
+
+      startWidth,
+
+
+
+
+
+      startWidth);
+
+
+
+
+
+
+    },
+    slowAcceptAnimation: function slowAcceptAnimation(t, startWidth, width, left) {
+      var transitionTime = parseInt(t.globalLoaderTransitionFromSpinnerDuration);
+      var slowProgressAnimationTime = parseInt(t.globalLoaderSlowAnimationDuration);
+      return emotion.css(_templateObject14 || (_templateObject14 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: 90%;\n      animation:\n        transitionAnimation ", "ms linear,\n        ", "ms acceptAnimation ", "ms linear;\n      @keyframes transitionAnimation {\n        from {\n          width: ", "px;\n          left: ", "px;\n        }\n        to {\n          width: ", "px;\n          left: 0;\n        }\n      }\n      @keyframes acceptAnimation {\n        from {\n          width: ", "px;\n        }\n        to {\n          width: 90%;\n        }\n      }\n    "])),
+
+
+      transitionTime,
+      slowProgressAnimationTime, transitionTime,
+
+
+      width,
+      left,
+
+
+      startWidth,
+
+
+
+
+
+      startWidth);
+
+
+
+
+
+
+    },
+    acceptWithoutAnimation: function acceptWithoutAnimation(startWidth) {
+      return emotion.css(_templateObject15 || (_templateObject15 = (0, _taggedTemplateLiteralLoose2.default)(["\n      width: ", "px;\n    "])),
+      startWidth);
+
+    }
+  };};

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

@@ -0,0 +1 @@
+{"version":3,"names":["_Emotion","require","_templateObject","_templateObject2","_templateObject3","_templateObject4","_templateObject5","_templateObject6","_templateObject7","_templateObject8","_templateObject9","_templateObject10","_templateObject11","_templateObject12","_templateObject13","_templateObject14","_templateObject15","getStyles","exports","memoizeGetStyles","_ref","css","outer","t","_taggedTemplateLiteralLoose2","default","globalLoaderWidth","globalLoaderHeight","globalLoaderBackgroundColor","globalLoaderPosition","globalLoaderLeft","globalLoaderTop","globalLoaderRight","globalLoaderBottom","inner","globalLoaderColor","standardWithoutAnimation","successWithoutAnimation","errorWithoutAnimation","moveToRightAnimation","_ref2","keyframes","spinnerAnimation","_ref3","linearProgressAnimation","_ref4","slowProgressAnimation","_ref5","getAnimations","emotion","successAnimation","delayBeforeHide","width","left","errorAnimation","transitionDuration","parseInt","globalLoaderTransitionToSpinnerDuration","spinnerAnimationDuration","globalLoaderSpinnerAnimationDuration","standardAnimation","expectedTime","slowProgressAnimationTime","globalLoaderSlowAnimationDuration","acceptAnimation","startWidth","transitionTime","globalLoaderTransitionFromSpinnerDuration","slowAcceptAnimation","acceptWithoutAnimation"],"sources":["GlobalLoaderView.styles.ts"],"sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeGetStyles } from '../../lib/theming/Emotion';\nimport type { Theme } from '../../lib/theming/Theme';\n\nexport const getStyles = memoizeGetStyles(({ css }: Emotion) => ({\n  outer(t: Theme) {\n    return css`\n      width: ${t.globalLoaderWidth};\n      height: ${t.globalLoaderHeight};\n      background-color: ${t.globalLoaderBackgroundColor};\n      position: ${t.globalLoaderPosition};\n      left: ${t.globalLoaderLeft};\n      top: ${t.globalLoaderTop};\n      right: ${t.globalLoaderRight};\n      bottom: ${t.globalLoaderBottom};\n      overflow: hidden;\n    `;\n  },\n  inner(t: Theme) {\n    return css`\n      background-color: ${t.globalLoaderColor};\n      width: 0;\n      height: ${t.globalLoaderHeight};\n      position: absolute;\n      left: 0;\n      overflow: hidden;\n    `;\n  },\n  standardWithoutAnimation() {\n    return css`\n      left: 0;\n      width: 90%;\n    `;\n  },\n  successWithoutAnimation() {\n    return css`\n      left: 0;\n      width: 100%;\n    `;\n  },\n  errorWithoutAnimation() {\n    return css`\n      left: 40%;\n      width: 20%;\n    `;\n  },\n}));\n\nconst moveToRightAnimation = ({ keyframes }: Emotion) => keyframes`\n  0% {\n    left: 0;\n    width: 100%;\n  }\n  50% {\n    left: 50%;\n    width: 50%;\n  }\n  100% {\n    left: 99%;\n    width: 1%\n  }\n`;\nconst spinnerAnimation = ({ keyframes }: Emotion) => keyframes`\n  0% {\n    transform: translateX(50%) scaleX(.005);\n    animation-timing-function: cubic-bezier(.895,.03,.685,.22);\n  }\n  50% {\n    transform: translateX(0) scaleX(.35);\n    animation-timing-function: cubic-bezier(.165,.84,.44,1);\n  }\n  100% {\n    transform: translateX(-50%) scaleX(.005);\n  }\n`;\nconst linearProgressAnimation = ({ keyframes }: Emotion) => keyframes`\n  from { width: 0; }\n  to { width: 80% }\n`;\nconst slowProgressAnimation = ({ keyframes }: Emotion) => keyframes`\n  from { width: 80%; }\n  to { width: 90% }\n`;\n\nexport const getAnimations = (emotion: Emotion) => ({\n  successAnimation(delayBeforeHide: number, width: number, left: number) {\n    return emotion.css`\n      animation: successAnimation;\n      animation-duration: ${delayBeforeHide}ms;\n      @keyframes successAnimation {\n        0% {\n          width: ${width}px;\n          left: ${left}px;\n          opacity: 1;\n        }\n        20% {\n          width: 100%;\n          left: 0;\n          opacity: 1;\n        }\n        80% {\n          width: 100%;\n          left: 0;\n          opacity: 1;\n        }\n        100% {\n          width: 100%;\n          opacity: 0;\n        }\n      }\n    `;\n  },\n  errorAnimation(t: Theme) {\n    const transitionDuration = parseInt(t.globalLoaderTransitionToSpinnerDuration);\n    const spinnerAnimationDuration = parseInt(t.globalLoaderSpinnerAnimationDuration);\n\n    return emotion.css`\n      left: 0;\n      width: 100%;\n      animation:\n        ${moveToRightAnimation(emotion)} ${transitionDuration}ms linear,\n        ${spinnerAnimationDuration}ms ${spinnerAnimation(emotion)} ${transitionDuration}ms infinite alternate;\n    `;\n  },\n  standardAnimation(t: Theme, expectedTime: number) {\n    const slowProgressAnimationTime = parseInt(t.globalLoaderSlowAnimationDuration);\n    return emotion.css`\n      width: 90%;\n      animation:\n        ${linearProgressAnimation(emotion)} ${expectedTime}ms cubic-bezier(0, 0.4, 0.4, 1),\n        ${slowProgressAnimationTime}ms ${slowProgressAnimation(emotion)} ${expectedTime}ms linear;\n    `;\n  },\n  acceptAnimation(t: Theme, startWidth: number, expectedTime: number, width: number, left: number) {\n    const transitionTime = parseInt(t.globalLoaderTransitionFromSpinnerDuration);\n    const slowProgressAnimationTime = parseInt(t.globalLoaderSlowAnimationDuration);\n    return emotion.css`\n      width: 90%;\n      animation:\n        transitionAnimation ${transitionTime}ms linear,\n        ${expectedTime}ms acceptAnimation ${transitionTime}ms cubic-bezier(0, 0.4, 0.4, 1),\n        ${slowProgressAnimationTime}ms ${slowProgressAnimation(emotion)} ${expectedTime + transitionTime}ms linear;\n      @keyframes transitionAnimation {\n        from {\n          width: ${width}px;\n          left: ${left}px;\n        }\n        to {\n          width: ${startWidth}px;\n          left: 0;\n        }\n      }\n      @keyframes acceptAnimation {\n        from {\n          width: ${startWidth}px;\n        }\n        to {\n          width: 80%;\n        }\n      }\n    `;\n  },\n  slowAcceptAnimation(t: Theme, startWidth: number, width: number, left: number) {\n    const transitionTime = parseInt(t.globalLoaderTransitionFromSpinnerDuration);\n    const slowProgressAnimationTime = parseInt(t.globalLoaderSlowAnimationDuration);\n    return emotion.css`\n      width: 90%;\n      animation:\n        transitionAnimation ${transitionTime}ms linear,\n        ${slowProgressAnimationTime}ms acceptAnimation ${transitionTime}ms linear;\n      @keyframes transitionAnimation {\n        from {\n          width: ${width}px;\n          left: ${left}px;\n        }\n        to {\n          width: ${startWidth}px;\n          left: 0;\n        }\n      }\n      @keyframes acceptAnimation {\n        from {\n          width: ${startWidth}px;\n        }\n        to {\n          width: 90%;\n        }\n      }\n    `;\n  },\n  acceptWithoutAnimation(startWidth: number) {\n    return emotion.css`\n      width: ${startWidth}px;\n    `;\n  },\n});\n"],"mappings":"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","ignoreList":[]}

package/cjs/components/GlobalLoader/index.d.ts

@@ -0,0 +1 @@
+export * from './GlobalLoader';

package/cjs/components/GlobalLoader/index.js

@@ -0,0 +1 @@
+"use strict";exports.__esModule = true;var _GlobalLoader = require("./GlobalLoader");Object.keys(_GlobalLoader).forEach(function (key) {if (key === "default" || key === "__esModule") return;if (key in exports && exports[key] === _GlobalLoader[key]) return;exports[key] = _GlobalLoader[key];});

package/cjs/components/GlobalLoader/index.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_GlobalLoader","require","Object","keys","forEach","key","exports"],"sources":["index.tsx"],"sourcesContent":["export * from './GlobalLoader';\n"],"mappings":"uCAAA,IAAAA,aAAA,GAAAC,OAAA,mBAAAC,MAAA,CAAAC,IAAA,CAAAH,aAAA,EAAAI,OAAA,WAAAC,GAAA,OAAAA,GAAA,kBAAAA,GAAA,8BAAAA,GAAA,IAAAC,OAAA,IAAAA,OAAA,CAAAD,GAAA,MAAAL,aAAA,CAAAK,GAAA,UAAAC,OAAA,CAAAD,GAAA,IAAAL,aAAA,CAAAK,GAAA","ignoreList":[]}

package/cjs/components/GlobalLoader/useParams.d.ts

@@ -0,0 +1,22 @@
+import type { GlobalLoaderViewProps, GlobalLoaderViewRef } from './GlobalLoaderView';
+/**
+ * Вычисляет положение `GlobalLoader`
+ *
+ * @param ref - ref `GlobalLoader`
+ * @returns - возвращает положение полоски `GlobalLoader`
+ */
+export declare const useGlobalLoaderPosition: (ref: GlobalLoaderViewRef["refObject"]) => {
+    left: number;
+};
+/**
+ * Вычисляет ширину `GlobalLoader`
+ *
+ * @param status - статус `GlobalLoader`
+ * @param ref - ref `GlobalLoader`
+ * @returns - возвращает ширину полоски `GlobalLoader`
+ */
+export declare const useGlobalLoaderWidth: (status: GlobalLoaderViewProps["status"], ref: GlobalLoaderViewRef["refObject"]) => {
+    width: number;
+    startWidth: number;
+    fullWidth: number;
+};

package/cjs/components/GlobalLoader/useParams.js

@@ -0,0 +1,45 @@
+"use strict";exports.__esModule = true;exports.useGlobalLoaderWidth = exports.useGlobalLoaderPosition = void 0;var _react = require("react");
+
+var _getDOMRect3 = require("../../lib/dom/getDOMRect");
+
+
+
+/**
+ * Вычисляет положение `GlobalLoader`
+ *
+ * @param ref - ref `GlobalLoader`
+ * @returns - возвращает положение полоски `GlobalLoader`
+ */
+
+var useGlobalLoaderPosition = exports.useGlobalLoaderPosition = function useGlobalLoaderPosition(ref) {
+  var _getDOMRect = (0, _getDOMRect3.getDOMRect)(ref),left = _getDOMRect.left;
+  return { left: left };
+};
+
+/**
+ * Вычисляет ширину `GlobalLoader`
+ *
+ * @param status - статус `GlobalLoader`
+ * @param ref - ref `GlobalLoader`
+ * @returns - возвращает ширину полоски `GlobalLoader`
+ */
+
+var useGlobalLoaderWidth = exports.useGlobalLoaderWidth = function useGlobalLoaderWidth(
+status,
+ref)
+{var _ref$current;
+  var _getDOMRect2 = (0, _getDOMRect3.getDOMRect)(ref),width = _getDOMRect2.width;
+  var _useState = (0, _react.useState)(0),startWidth = _useState[0],setStartWidth = _useState[1];
+  var fullWidth = ((_ref$current = ref.current) == null || (_ref$current = _ref$current.parentElement) == null ? void 0 : _ref$current.offsetWidth) || 0;
+  (0, _react.useEffect)(function () {
+    if (status === 'error') {
+      setStartWidth(width);
+    } else if (status === 'accept') {
+      setStartWidth(startWidth);
+    } else {
+      setStartWidth(0);
+    }
+  }, [status]);
+
+  return { width: width, startWidth: startWidth, fullWidth: fullWidth };
+};

package/cjs/components/GlobalLoader/useParams.js.map

@@ -0,0 +1 @@
+{"version":3,"names":["_react","require","_getDOMRect3","useGlobalLoaderPosition","exports","ref","_getDOMRect","getDOMRect","left","useGlobalLoaderWidth","status","_ref$current","_getDOMRect2","width","_useState","useState","startWidth","setStartWidth","fullWidth","current","parentElement","offsetWidth","useEffect"],"sources":["useParams.ts"],"sourcesContent":["import { useEffect, useState } from 'react';\n\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\n\nimport type { GlobalLoaderViewProps, GlobalLoaderViewRef } from './GlobalLoaderView';\n\n/**\n * Вычисляет положение `GlobalLoader`\n *\n * @param ref - ref `GlobalLoader`\n * @returns - возвращает положение полоски `GlobalLoader`\n */\n\nexport const useGlobalLoaderPosition = (ref: GlobalLoaderViewRef['refObject']) => {\n  const { left } = getDOMRect(ref);\n  return { left };\n};\n\n/**\n * Вычисляет ширину `GlobalLoader`\n *\n * @param status - статус `GlobalLoader`\n * @param ref - ref `GlobalLoader`\n * @returns - возвращает ширину полоски `GlobalLoader`\n */\n\nexport const useGlobalLoaderWidth = (\n  status: GlobalLoaderViewProps['status'],\n  ref: GlobalLoaderViewRef['refObject'],\n) => {\n  const { width } = getDOMRect(ref);\n  const [startWidth, setStartWidth] = useState(0);\n  const fullWidth = ref.current?.parentElement?.offsetWidth || 0;\n  useEffect(() => {\n    if (status === 'error') {\n      setStartWidth(width);\n    } else if (status === 'accept') {\n      setStartWidth(startWidth);\n    } else {\n      setStartWidth(0);\n    }\n  }, [status]);\n\n  return { width, startWidth, fullWidth };\n};\n"],"mappings":"+GAAA,IAAAA,MAAA,GAAAC,OAAA;;AAEA,IAAAC,YAAA,GAAAD,OAAA;;;;AAIA;AACA;AACA;AACA;AACA;AACA;;AAEO,IAAME,uBAAuB,GAAAC,OAAA,CAAAD,uBAAA,GAAG,SAA1BA,uBAAuBA,CAAIE,GAAqC,EAAK;EAChF,IAAAC,WAAA,GAAiB,IAAAC,uBAAU,EAACF,GAAG,CAAC,CAAxBG,IAAI,GAAAF,WAAA,CAAJE,IAAI;EACZ,OAAO,EAAEA,IAAI,EAAJA,IAAI,CAAC,CAAC;AACjB,CAAC;;AAED;AACA;AACA;AACA;AACA;AACA;AACA;;AAEO,IAAMC,oBAAoB,GAAAL,OAAA,CAAAK,oBAAA,GAAG,SAAvBA,oBAAoBA;AAC/BC,MAAuC;AACvCL,GAAqC;AAClC,KAAAM,YAAA;EACH,IAAAC,YAAA,GAAkB,IAAAL,uBAAU,EAACF,GAAG,CAAC,CAAzBQ,KAAK,GAAAD,YAAA,CAALC,KAAK;EACb,IAAAC,SAAA,GAAoC,IAAAC,eAAQ,EAAC,CAAC,CAAC,CAAxCC,UAAU,GAAAF,SAAA,IAAEG,aAAa,GAAAH,SAAA;EAChC,IAAMI,SAAS,GAAG,EAAAP,YAAA,GAAAN,GAAG,CAACc,OAAO,cAAAR,YAAA,GAAXA,YAAA,CAAaS,aAAa,qBAA1BT,YAAA,CAA4BU,WAAW,KAAI,CAAC;EAC9D,IAAAC,gBAAS,EAAC,YAAM;IACd,IAAIZ,MAAM,KAAK,OAAO,EAAE;MACtBO,aAAa,CAACJ,KAAK,CAAC;IACtB,CAAC,MAAM,IAAIH,MAAM,KAAK,QAAQ,EAAE;MAC9BO,aAAa,CAACD,UAAU,CAAC;IAC3B,CAAC,MAAM;MACLC,aAAa,CAAC,CAAC,CAAC;IAClB;EACF,CAAC,EAAE,CAACP,MAAM,CAAC,CAAC;;EAEZ,OAAO,EAAEG,KAAK,EAALA,KAAK,EAAEG,UAAU,EAAVA,UAAU,EAAEE,SAAS,EAATA,SAAS,CAAC,CAAC;AACzC,CAAC","ignoreList":[]}

package/cjs/components/Group/Group.d.ts

@@ -0,0 +1,28 @@
+import React from 'react';
+import type { CommonProps } from '../../internal/CommonWrapper';
+import type { TGetRootNode } from '../../lib/rootNode';
+export interface GroupProps extends CommonProps {
+    /** Задает длину компонента Group. */
+    width?: React.CSSProperties['width'];
+}
+export declare const getButtonCorners: (isFirstChild: boolean, isLastChild: boolean) => React.CSSProperties;
+export declare const GroupDataTids: {
+    readonly root: "Group__root";
+};
+/**
+ *  Компонент `Group` используется для создания логически сгруппированных элементов, выровненных по горизонтали.
+ *
+ *  Длина контейнера настраивается с помощью пропа `width`.
+ */
+export declare class Group extends React.Component<GroupProps> {
+    static __KONTUR_REACT_UI__: string;
+    static displayName: string;
+    getRootNode: TGetRootNode;
+    private setRootNode;
+    private emotion;
+    private cx;
+    private styles;
+    render(): React.JSX.Element;
+    private renderChild;
+    private renderWrappedChildren;
+}

package/cjs/components/Group/Group.js

@@ -0,0 +1,206 @@
+"use strict";var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault").default;exports.__esModule = true;exports.getButtonCorners = exports.GroupDataTids = exports.Group = void 0;var _inheritsLoose2 = _interopRequireDefault(require("@babel/runtime/helpers/inheritsLoose"));var _extends2 = _interopRequireDefault(require("@babel/runtime/helpers/extends"));var _react = _interopRequireDefault(require("react"));
+
+
+
+var _CommonWrapper = require("../../internal/CommonWrapper");
+
+var _rootNode = require("../../lib/rootNode");
+var _utils = require("../../lib/utils");
+
+
+
+
+
+
+
+
+
+
+
+
+var _renderEnvironment = require("../../lib/renderEnvironment");
+
+var _Group2 = require("./Group.styles");var _class, _Group;
+
+
+
+
+
+
+
+
+
+
+
+var getFirstChild = function getFirstChild(children) {
+  if (!Array.isArray(children)) {
+    return children;
+  }
+
+  return children == null ? void 0 : children[0];
+};
+
+var getLastChild = function getLastChild(children) {
+  if (!Array.isArray(children)) {
+    return children;
+  }
+
+  var numberOfChildren = _react.default.Children.count(children);
+
+  return children == null ? void 0 : children[numberOfChildren - 1];
+};
+
+var getButtonCorners = exports.getButtonCorners = function getButtonCorners(isFirstChild, isLastChild) {
+  if (isFirstChild && isLastChild) {
+    return {};
+  }
+
+  if (isFirstChild) {
+    return {
+      borderTopRightRadius: 0,
+      borderBottomRightRadius: 0
+    };
+  }
+
+  if (isLastChild) {
+    return {
+      borderTopLeftRadius: 0,
+      borderBottomLeftRadius: 0
+    };
+  }
+
+  return {
+    borderRadius: 0
+  };
+};
+
+var tryPassCorners = function tryPassCorners(child, isFirstChild, isLastChild) {
+  var corners = getButtonCorners(isFirstChild, isLastChild);
+
+  if (
+  (0, _utils.isButton)(child) ||
+  (0, _utils.isInput)(child) ||
+  (0, _utils.isFxInput)(child) ||
+  (0, _utils.isAutocomplete)(child) ||
+  (0, _utils.isPasswordInput)(child) ||
+  (0, _utils.isCurrencyInput)(child) ||
+  (0, _utils.isSelect)(child) ||
+  (0, _utils.isDropdown)(child) ||
+  (0, _utils.isDropdownMenu)(child))
+  {
+    return /*#__PURE__*/_react.default.cloneElement(child, { corners: (0, _extends2.default)({}, corners, child.props.corners) });
+  }
+
+  return child;
+};
+
+var hasWidthInPercent = function hasWidthInPercent(child) {return String(child.props.width).includes('%');};
+
+var GroupDataTids = exports.GroupDataTids = {
+  root: 'Group__root'
+};
+
+/**
+ *  Компонент `Group` используется для создания логически сгруппированных элементов, выровненных по горизонтали.
+ *
+ *  Длина контейнера настраивается с помощью пропа `width`.
+ */var
+
+
+Group = exports.Group = (0, _renderEnvironment.withRenderEnvironment)(_class = (0, _rootNode.rootNode)(_class = (_Group = /*#__PURE__*/function (_React$Component) {function Group() {var _this;for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {args[_key] = arguments[_key];}_this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;_this.
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+
+    renderChild = function (
+    child,
+    isFirstChild,
+    isLastChild,
+    isWidthInPercent) {var _this$cx, _this$cx2;return /*#__PURE__*/(
+
+        _react.default.createElement("div", {
+          className: _this.cx((_this$cx = {}, _this$cx[
+          _this.styles.fixed()] = !isWidthInPercent, _this$cx[
+          _this.styles.stretch()] = isWidthInPercent, _this$cx)
+          ) }, /*#__PURE__*/
+
+        _react.default.createElement("div", {
+          className: _this.cx((_this$cx2 = {}, _this$cx2[
+          _this.styles.item()] = true, _this$cx2[
+          _this.styles.itemFirst()] = isFirstChild, _this$cx2)
+          ) },
+
+        tryPassCorners(child, isFirstChild, isLastChild)
+        )
+        ));};return _this;}(0, _inheritsLoose2.default)(Group, _React$Component);var _proto = Group.prototype;_proto.render = function render() {var _this2 = this;var style = { width: this.props.width };var childrenArray = _react.default.Children.toArray(this.props.children);var firstChild = getFirstChild(childrenArray);var lastChild = getLastChild(childrenArray);this.styles = (0, _Group2.getStyles)(this.emotion);return /*#__PURE__*/_react.default.createElement(_CommonWrapper.CommonWrapper, (0, _extends2.default)({ rootNodeRef: this.setRootNode }, this.props), /*#__PURE__*/_react.default.createElement("span", { "data-tid": GroupDataTids.root, className: this.styles.root(), style: style }, _react.default.Children.map(childrenArray, function (child) {if (!child || ! /*#__PURE__*/_react.default.isValidElement(child)) {return null;}var isFirstChild = child === firstChild;var isLastChild = child === lastChild;if ((0, _utils.isHint)(child) || (0, _utils.isTooltip)(child)) {return _this2.renderWrappedChildren(child, isFirstChild, isLastChild);}return _this2.renderChild(child, isFirstChild, isLastChild, hasWidthInPercent(child));})));};_proto.
+
+
+  renderWrappedChildren = function renderWrappedChildren(
+  parent,
+  isParentFirst,
+  isParentLast)
+  {var _this3 = this,_this$cx3;
+    var shouldStretchParent = false;
+    var nestedChildren = _react.default.Children.toArray(parent.props.children);
+
+    var modifiedChildren = nestedChildren.map(function (nestedChild, index) {
+      if (!nestedChild || ! /*#__PURE__*/_react.default.isValidElement(nestedChild)) {
+        return null;
+      }
+
+      var isFirstChild = isParentFirst && index === 0;
+      var isLastChild = isParentLast && index === nestedChildren.length - 1;
+      if (hasWidthInPercent(nestedChild)) {
+        shouldStretchParent = true;
+      }
+
+      return _this3.renderChild(nestedChild, isFirstChild, isLastChild, hasWidthInPercent(nestedChild));
+    });
+
+    var wrappedChildren = /*#__PURE__*/
+    _react.default.createElement("div", { className: this.cx(this.styles.wrappedChildren(), (_this$cx3 = {}, _this$cx3[this.styles.stretch()] = shouldStretchParent, _this$cx3)) },
+    modifiedChildren
+    );
+
+
+    return /*#__PURE__*/_react.default.cloneElement(parent, {
+      children: wrappedChildren
+    });
+  };return Group;}(_react.default.Component), _Group.__KONTUR_REACT_UI__ = 'Group', _Group.displayName = 'Group', _Group)) || _class) || _class;