@skbkontur/react-ui 0.0.0-80ce75eca6 → 0.0.0-8ea1692541

package/components/Spinner/Spinner.styles/Spinner.styles.js

@@ -1,112 +1,39 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 
-function _templateObject8() {
-  var data = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n    "]);
-
-  _templateObject8 = function _templateObject8() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject7() {
-  var data = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      text-align: center;\n    "]);
-
-  _templateObject7 = function _templateObject7() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject6() {
-  var data = _taggedTemplateLiteralLoose(["\n      display: block;\n      font-size: ", ";\n      line-height: ", ";\n      margin-top: ", ";\n    "]);
-
-  _templateObject6 = function _templateObject6() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject5() {
-  var data = _taggedTemplateLiteralLoose(["\n      display: block;\n      font-size: ", ";\n      line-height: ", ";\n      margin-top: ", ";\n    "]);
-
-  _templateObject5 = function _templateObject5() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject4() {
-  var data = _taggedTemplateLiteralLoose(["\n      margin-left: ", ";\n      font-size: ", ";\n      line-height: ", ";\n    "]);
-
-  _templateObject4 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3() {
-  var data = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteralLoose(["\n      stroke: ", ";\n\n      ", "\n    "]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n      stroke: ", ";\n\n      ", "\n    "]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10;
 
 import { css, memoizeStyle } from "../../../lib/theming/Emotion";
 import { AnimationKeyframes } from "../../../lib/theming/AnimationKeyframes";
 import { isIE11 } from "../../../lib/client";
-var styles = {
+export var styles = memoizeStyle({
   circle: function circle(t) {
-    return css(_templateObject(), t.spinnerColor, !isIE11 && "\n          animation: " + AnimationKeyframes.spinnerCircleOffset(t) + " 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n            " + AnimationKeyframes.spinnerCircleLength(t) + " 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n            " + AnimationKeyframes.spinnerCircleRotate(t) + " 2s linear infinite,\n            " + AnimationKeyframes.spinnerColor(t) + " 6s ease-in-out infinite;\n        ");
+    return css(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n      stroke: ", ";\n\n      ", "\n    "])), t.spinnerColor, !isIE11 && "\n          animation: " + AnimationKeyframes.spinnerCircleOffset() + " 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n            " + AnimationKeyframes.spinnerCircleLength() + " 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n            " + AnimationKeyframes.spinnerCircleRotate() + " 2s linear infinite,\n            " + AnimationKeyframes.spinnerColor(t) + " 6s ease-in-out infinite;\n        ");
+  },
+  circleDimmedColor: function circleDimmedColor(t) {
+    return css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n      stroke: ", ";\n    "])), t.spinnerDimmedColor);
   },
-  circleDimmed: function circleDimmed(t) {
-    return css(_templateObject2(), t.spinnerDimmedColor, !isIE11 && "\n          animation: " + AnimationKeyframes.spinnerCircleOffset(t) + " 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n          " + AnimationKeyframes.spinnerCircleLength(t) + " 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n          " + AnimationKeyframes.spinnerCircleRotate(t) + " 2s linear infinite;\n        ");
+  circleWithoutColorAnimation: function circleWithoutColorAnimation() {
+    return css(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n      ", "\n    "])), !isIE11 && "\n          animation: " + AnimationKeyframes.spinnerCircleOffset() + " 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n          " + AnimationKeyframes.spinnerCircleLength() + " 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n          " + AnimationKeyframes.spinnerCircleRotate() + " 2s linear infinite;\n        ");
   },
   captionColor: function captionColor(t) {
-    return css(_templateObject3(), t.spinnerCaptionColor);
+    return css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n      color: ", ";\n    "])), t.spinnerCaptionColor);
+  },
+  inline: function inline() {
+    return css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n      font-size: inherit;\n      line-height: inherit;\n    "])));
   },
   mini: function mini(t) {
-    return css(_templateObject4(), t.spinnerCaptionGapSmall, t.spinnerFontSizeSmall, t.spinnerLineHeightSmall);
+    return css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n      margin-left: ", ";\n      font-size: ", ";\n      line-height: ", ";\n    "])), t.spinnerCaptionGapSmall, t.spinnerFontSizeSmall, t.spinnerLineHeightSmall);
   },
   normal: function normal(t) {
-    return css(_templateObject5(), t.spinnerFontSizeMedium, t.spinnerLineHeightMedium, t.spinnerCaptionGapMedium);
+    return css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n      display: block;\n      font-size: ", ";\n      line-height: ", ";\n      margin-top: ", ";\n    "])), t.spinnerFontSizeMedium, t.spinnerLineHeightMedium, t.spinnerCaptionGapMedium);
   },
   big: function big(t) {
-    return css(_templateObject6(), t.spinnerFontSizeLarge, t.spinnerLineHeightLarge, t.spinnerCaptionGapLarge);
+    return css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n      display: block;\n      font-size: ", ";\n      line-height: ", ";\n      margin-top: ", ";\n    "])), t.spinnerFontSizeLarge, t.spinnerLineHeightLarge, t.spinnerCaptionGapLarge);
   },
   spinner: function spinner() {
-    return css(_templateObject7());
+    return css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n      text-align: center;\n      line-height: normal;\n    "])));
   },
   inner: function inner() {
-    return css(_templateObject8());
+    return css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n      display: inline-block;\n    "])));
   }
-};
-export var jsStyles = memoizeStyle(styles);
+});

package/components/Spinner/Spinner.styles/Spinner.styles.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Spinner.styles.ts"],"names":["css","memoizeStyle","AnimationKeyframes","isIE11","styles","circle","t","spinnerColor","spinnerCircleOffset","spinnerCircleLength","spinnerCircleRotate","circleDimmed","spinnerDimmedColor","captionColor","spinnerCaptionColor","mini","spinnerCaptionGapSmall","spinnerFontSizeSmall","spinnerLineHeightSmall","normal","spinnerFontSizeMedium","spinnerLineHeightMedium","spinnerCaptionGapMedium","big","spinnerFontSizeLarge","spinnerLineHeightLarge","spinnerCaptionGapLarge","spinner","inner","jsStyles"],"mappings":"svDAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,SAASC,kBAAT,QAAmC,sCAAnC;AACA,SAASC,MAAT,QAAuB,kBAAvB;;AAEA,IAAMC,MAAM,GAAG;AACbC,EAAAA,MADa,kBACNC,CADM,EACI;AACf,WAAON,GAAP;AACYM,IAAAA,CAAC,CAACC,YADd;;AAGI,KAACJ,MAAD;;AAEeD,IAAAA,kBAAkB,CAACM,mBAAnB,CAAuCF,CAAvC,CAFf;AAGMJ,IAAAA,kBAAkB,CAACO,mBAAnB,CAAuCH,CAAvC,CAHN;AAIMJ,IAAAA,kBAAkB,CAACQ,mBAAnB,CAAuCJ,CAAvC,CAJN;AAKMJ,IAAAA,kBAAkB,CAACK,YAAnB,CAAgCD,CAAhC,CALN,wCAHJ;;;AAWD,GAbY;AAcbK,EAAAA,YAda,wBAcAL,CAdA,EAcU;AACrB,WAAON,GAAP;AACYM,IAAAA,CAAC,CAACM,kBADd;;AAGI,KAACT,MAAD;;AAEeD,IAAAA,kBAAkB,CAACM,mBAAnB,CAAuCF,CAAvC,CAFf;AAGIJ,IAAAA,kBAAkB,CAACO,mBAAnB,CAAuCH,CAAvC,CAHJ;AAIIJ,IAAAA,kBAAkB,CAACQ,mBAAnB,CAAuCJ,CAAvC,CAJJ,mCAHJ;;;AAUD,GAzBY;;AA2BbO,EAAAA,YA3Ba,wBA2BAP,CA3BA,EA2BU;AACrB,WAAON,GAAP;AACWM,IAAAA,CAAC,CAACQ,mBADb;;AAGD,GA/BY;;AAiCbC,EAAAA,IAjCa,gBAiCRT,CAjCQ,EAiCE;AACb,WAAON,GAAP;AACiBM,IAAAA,CAAC,CAACU,sBADnB;AAEeV,IAAAA,CAAC,CAACW,oBAFjB;AAGiBX,IAAAA,CAAC,CAACY,sBAHnB;;AAKD,GAvCY;;AAyCbC,EAAAA,MAzCa,kBAyCNb,CAzCM,EAyCI;AACf,WAAON,GAAP;;AAEeM,IAAAA,CAAC,CAACc,qBAFjB;AAGiBd,IAAAA,CAAC,CAACe,uBAHnB;AAIgBf,IAAAA,CAAC,CAACgB,uBAJlB;;AAMD,GAhDY;;AAkDbC,EAAAA,GAlDa,eAkDTjB,CAlDS,EAkDC;AACZ,WAAON,GAAP;;AAEeM,IAAAA,CAAC,CAACkB,oBAFjB;AAGiBlB,IAAAA,CAAC,CAACmB,sBAHnB;AAIgBnB,IAAAA,CAAC,CAACoB,sBAJlB;;AAMD,GAzDY;;AA2DbC,EAAAA,OA3Da,qBA2DH;AACR,WAAO3B,GAAP;;;;AAID,GAhEY;;AAkEb4B,EAAAA,KAlEa,mBAkEL;AACN,WAAO5B,GAAP;;;AAGD,GAtEY,EAAf;;;AAyEA,OAAO,IAAM6B,QAAQ,GAAG5B,YAAY,CAACG,MAAD,CAA7B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\r\nimport { Theme } from '../../lib/theming/Theme';\r\nimport { AnimationKeyframes } from '../../lib/theming/AnimationKeyframes';\r\nimport { isIE11 } from '../../lib/client';\r\n\r\nconst styles = {\r\n  circle(t: Theme) {\r\n    return css`\r\n      stroke: ${t.spinnerColor};\r\n\r\n      ${!isIE11 &&\r\n        `\r\n          animation: ${AnimationKeyframes.spinnerCircleOffset(t)} 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\r\n            ${AnimationKeyframes.spinnerCircleLength(t)} 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\r\n            ${AnimationKeyframes.spinnerCircleRotate(t)} 2s linear infinite,\r\n            ${AnimationKeyframes.spinnerColor(t)} 6s ease-in-out infinite;\r\n        `}\r\n    `;\r\n  },\r\n  circleDimmed(t: Theme) {\r\n    return css`\r\n      stroke: ${t.spinnerDimmedColor};\r\n\r\n      ${!isIE11 &&\r\n        `\r\n          animation: ${AnimationKeyframes.spinnerCircleOffset(t)} 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\r\n          ${AnimationKeyframes.spinnerCircleLength(t)} 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\r\n          ${AnimationKeyframes.spinnerCircleRotate(t)} 2s linear infinite;\r\n        `}\r\n    `;\r\n  },\r\n\r\n  captionColor(t: Theme) {\r\n    return css`\r\n      color: ${t.spinnerCaptionColor};\r\n    `;\r\n  },\r\n\r\n  mini(t: Theme) {\r\n    return css`\r\n      margin-left: ${t.spinnerCaptionGapSmall};\r\n      font-size: ${t.spinnerFontSizeSmall};\r\n      line-height: ${t.spinnerLineHeightSmall};\r\n    `;\r\n  },\r\n\r\n  normal(t: Theme) {\r\n    return css`\r\n      display: block;\r\n      font-size: ${t.spinnerFontSizeMedium};\r\n      line-height: ${t.spinnerLineHeightMedium};\r\n      margin-top: ${t.spinnerCaptionGapMedium};\r\n    `;\r\n  },\r\n\r\n  big(t: Theme) {\r\n    return css`\r\n      display: block;\r\n      font-size: ${t.spinnerFontSizeLarge};\r\n      line-height: ${t.spinnerLineHeightLarge};\r\n      margin-top: ${t.spinnerCaptionGapLarge};\r\n    `;\r\n  },\r\n\r\n  spinner() {\r\n    return css`\r\n      display: inline-block;\r\n      text-align: center;\r\n    `;\r\n  },\r\n\r\n  inner() {\r\n    return css`\r\n      display: inline-block;\r\n    `;\r\n  },\r\n};\r\n\r\nexport const jsStyles = memoizeStyle(styles);\r\n"]}
+{"version":3,"sources":["Spinner.styles.ts"],"names":["css","memoizeStyle","AnimationKeyframes","isIE11","styles","circle","t","spinnerColor","spinnerCircleOffset","spinnerCircleLength","spinnerCircleRotate","circleDimmedColor","spinnerDimmedColor","circleWithoutColorAnimation","captionColor","spinnerCaptionColor","inline","mini","spinnerCaptionGapSmall","spinnerFontSizeSmall","spinnerLineHeightSmall","normal","spinnerFontSizeMedium","spinnerLineHeightMedium","spinnerCaptionGapMedium","big","spinnerFontSizeLarge","spinnerLineHeightLarge","spinnerCaptionGapLarge","spinner","inner"],"mappings":"uRAAA,SAASA,GAAT,EAAcC,YAAd,QAAkC,2BAAlC;;AAEA,SAASC,kBAAT,QAAmC,sCAAnC;AACA,SAASC,MAAT,QAAuB,kBAAvB;;AAEA,OAAO,IAAMC,MAAM,GAAGH,YAAY,CAAC;AACjCI,EAAAA,MADiC,kBAC1BC,CAD0B,EAChB;AACf,WAAON,GAAP;AACYM,IAAAA,CAAC,CAACC,YADd;;AAGI,KAACJ,MAAD;;AAEeD,IAAAA,kBAAkB,CAACM,mBAAnB,EAFf;AAGMN,IAAAA,kBAAkB,CAACO,mBAAnB,EAHN;AAIMP,IAAAA,kBAAkB,CAACQ,mBAAnB,EAJN;AAKMR,IAAAA,kBAAkB,CAACK,YAAnB,CAAgCD,CAAhC,CALN,wCAHJ;;;AAWD,GAbgC;AAcjCK,EAAAA,iBAdiC,6BAcfL,CAde,EAcL;AAC1B,WAAON,GAAP;AACYM,IAAAA,CAAC,CAACM,kBADd;;AAGD,GAlBgC;AAmBjCC,EAAAA,2BAnBiC,yCAmBH;AAC5B,WAAOb,GAAP;AACI,KAACG,MAAD;;AAEeD,IAAAA,kBAAkB,CAACM,mBAAnB,EAFf;AAGIN,IAAAA,kBAAkB,CAACO,mBAAnB,EAHJ;AAIIP,IAAAA,kBAAkB,CAACQ,mBAAnB,EAJJ,mCADJ;;;AAQD,GA5BgC;;AA8BjCI,EAAAA,YA9BiC,wBA8BpBR,CA9BoB,EA8BV;AACrB,WAAON,GAAP;AACWM,IAAAA,CAAC,CAACS,mBADb;;AAGD,GAlCgC;;AAoCjCC,EAAAA,MApCiC,oBAoCxB;AACP,WAAOhB,GAAP;;;;AAID,GAzCgC;;AA2CjCiB,EAAAA,IA3CiC,gBA2C5BX,CA3C4B,EA2ClB;AACb,WAAON,GAAP;AACiBM,IAAAA,CAAC,CAACY,sBADnB;AAEeZ,IAAAA,CAAC,CAACa,oBAFjB;AAGiBb,IAAAA,CAAC,CAACc,sBAHnB;;AAKD,GAjDgC;;AAmDjCC,EAAAA,MAnDiC,kBAmD1Bf,CAnD0B,EAmDhB;AACf,WAAON,GAAP;;AAEeM,IAAAA,CAAC,CAACgB,qBAFjB;AAGiBhB,IAAAA,CAAC,CAACiB,uBAHnB;AAIgBjB,IAAAA,CAAC,CAACkB,uBAJlB;;AAMD,GA1DgC;;AA4DjCC,EAAAA,GA5DiC,eA4D7BnB,CA5D6B,EA4DnB;AACZ,WAAON,GAAP;;AAEeM,IAAAA,CAAC,CAACoB,oBAFjB;AAGiBpB,IAAAA,CAAC,CAACqB,sBAHnB;AAIgBrB,IAAAA,CAAC,CAACsB,sBAJlB;;AAMD,GAnEgC;;AAqEjCC,EAAAA,OArEiC,qBAqEvB;AACR,WAAO7B,GAAP;;;;;AAKD,GA3EgC;;AA6EjC8B,EAAAA,KA7EiC,mBA6EzB;AACN,WAAO9B,GAAP;;;AAGD,GAjFgC,EAAD,CAA3B","sourcesContent":["import { css, memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { AnimationKeyframes } from '../../lib/theming/AnimationKeyframes';\nimport { isIE11 } from '../../lib/client';\n\nexport const styles = memoizeStyle({\n  circle(t: Theme) {\n    return css`\n      stroke: ${t.spinnerColor};\n\n      ${!isIE11 &&\n      `\n          animation: ${AnimationKeyframes.spinnerCircleOffset()} 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n            ${AnimationKeyframes.spinnerCircleLength()} 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n            ${AnimationKeyframes.spinnerCircleRotate()} 2s linear infinite,\n            ${AnimationKeyframes.spinnerColor(t)} 6s ease-in-out infinite;\n        `}\n    `;\n  },\n  circleDimmedColor(t: Theme) {\n    return css`\n      stroke: ${t.spinnerDimmedColor};\n    `;\n  },\n  circleWithoutColorAnimation() {\n    return css`\n      ${!isIE11 &&\n      `\n          animation: ${AnimationKeyframes.spinnerCircleOffset()} 1s cubic-bezier(0.5, 0.2, 0.5, 0.8) infinite,\n          ${AnimationKeyframes.spinnerCircleLength()} 2s cubic-bezier(0.36, 0.14, 0.38, 0.69) infinite,\n          ${AnimationKeyframes.spinnerCircleRotate()} 2s linear infinite;\n        `}\n    `;\n  },\n\n  captionColor(t: Theme) {\n    return css`\n      color: ${t.spinnerCaptionColor};\n    `;\n  },\n\n  inline() {\n    return css`\n      font-size: inherit;\n      line-height: inherit;\n    `;\n  },\n\n  mini(t: Theme) {\n    return css`\n      margin-left: ${t.spinnerCaptionGapSmall};\n      font-size: ${t.spinnerFontSizeSmall};\n      line-height: ${t.spinnerLineHeightSmall};\n    `;\n  },\n\n  normal(t: Theme) {\n    return css`\n      display: block;\n      font-size: ${t.spinnerFontSizeMedium};\n      line-height: ${t.spinnerLineHeightMedium};\n      margin-top: ${t.spinnerCaptionGapMedium};\n    `;\n  },\n\n  big(t: Theme) {\n    return css`\n      display: block;\n      font-size: ${t.spinnerFontSizeLarge};\n      line-height: ${t.spinnerLineHeightLarge};\n      margin-top: ${t.spinnerCaptionGapLarge};\n    `;\n  },\n\n  spinner() {\n    return css`\n      display: inline-block;\n      text-align: center;\n      line-height: normal;\n    `;\n  },\n\n  inner() {\n    return css`\n      display: inline-block;\n    `;\n  },\n});\n"]}

package/components/Spinner/Spinner.styles.d.ts

@@ -1,10 +1,13 @@
-export declare const jsStyles: {
-    circle(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    circleDimmed(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    captionColor(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    mini(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    normal(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
-    big(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>): string;
+import { Theme } from '../../lib/theming/Theme';
+export declare const styles: {
+    circle(t: Theme): string;
+    circleDimmedColor(t: Theme): string;
+    circleWithoutColorAnimation(): string;
+    captionColor(t: Theme): string;
+    inline(): string;
+    mini(t: Theme): string;
+    normal(t: Theme): string;
+    big(t: Theme): string;
     spinner(): string;
     inner(): string;
 };

package/components/Spinner/SpinnerFallbackAnimation/SpinnerFallbackAnimation.js

@@ -1,9 +1,8 @@
+/* eslint-disable no-useless-constructor */
 import { ColorFactory } from "../../../lib/styles/ColorFactory";
 export var SpinnerFallbackAnimationRunner = function SpinnerFallbackAnimationRunner(animations, FPS) {
   var _this = this;
 
-  this.animations = animations;
-  this.FPS = FPS;
   this.interval = null;
 
   this.start = function () {
@@ -28,6 +27,8 @@ export var SpinnerFallbackAnimationRunner = function SpinnerFallbackAnimationRun
     }
   };
 
+  this.animations = animations;
+  this.FPS = FPS;
   this.start();
 };
 
@@ -37,9 +38,15 @@ var rafInterval = function rafInterval(fn, delay) {
   var rafId = 0;
 
   var interval = function interval() {
-    if (cleared) return;
+    if (cleared) {
+      return;
+    }
+
     var timestamp = new Date().getTime();
-    if (!lastcall) lastcall = timestamp;
+
+    if (!lastcall) {
+      lastcall = timestamp;
+    }
 
     if (timestamp - lastcall > delay) {
       fn();
@@ -61,16 +68,20 @@ var rafInterval = function rafInterval(fn, delay) {
 var Animation = function Animation(duration, onProgress, onFinish) {
   var _this2 = this;
 
-  this.duration = duration;
-  this.onProgress = onProgress;
-  this.onFinish = onFinish;
   this.startTime = 0;
   this.isFinished = false;
 
   this.step = function () {
-    if (_this2.isFinished) return;
+    if (_this2.isFinished) {
+      return;
+    }
+
     var timestamp = new Date().getTime();
-    if (!_this2.startTime) _this2.startTime = timestamp;
+
+    if (!_this2.startTime) {
+      _this2.startTime = timestamp;
+    }
+
     var progress = (timestamp - _this2.startTime) / _this2.duration;
 
     _this2.onProgress(progress);
@@ -95,6 +106,10 @@ var Animation = function Animation(duration, onProgress, onFinish) {
       _this2.step();
     }
   };
+
+  this.duration = duration;
+  this.onProgress = onProgress;
+  this.onFinish = onFinish;
 };
 
 export var createOffsetAnimation = function createOffsetAnimation(from, to, duration, setStyleProperty, units) {

package/components/Spinner/SpinnerFallbackAnimation/SpinnerFallbackAnimation.js.map

@@ -1 +1 @@
-{"version":3,"sources":["SpinnerFallbackAnimation.ts"],"names":["ColorFactory","SpinnerFallbackAnimationRunner","animations","FPS","interval","start","forEach","animation","rafInterval","step","stop","clear","finish","fn","delay","lastcall","cleared","rafId","timestamp","Date","getTime","requestAnimationFrame","cancelAnimationFrame","Animation","duration","onProgress","onFinish","startTime","isFinished","progress","reset","createOffsetAnimation","from","to","setStyleProperty","units","current","createLengthAnimation","reverse","p","createColorAnimation","colors","rgbColors","map","color","create","rgb","currentIndex","nextIndex","Math","round","length","createRotationAnimation"],"mappings":"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","sourcesContent":["import { ColorFactory } from '../../lib/styles/ColorFactory';\r\n\r\nexport class SpinnerFallbackAnimationRunner {\r\n  private interval: ReturnType<typeof rafInterval> | null = null;\r\n\r\n  constructor(private animations: Animation[], private FPS: number) {\r\n    this.start();\r\n  }\r\n\r\n  public start = () => {\r\n    this.animations.forEach(animation => animation.start());\r\n    this.interval = rafInterval(() => {\r\n      this.animations.forEach(animation => animation.step());\r\n    }, this.FPS);\r\n  };\r\n\r\n  public stop = () => {\r\n    if (this.interval) {\r\n      this.interval.clear();\r\n      this.animations.forEach(animation => animation.finish());\r\n    }\r\n  };\r\n}\r\n\r\nconst rafInterval = (fn: () => void, delay: number) => {\r\n  let lastcall = 0;\r\n  let cleared = false;\r\n  let rafId = 0;\r\n\r\n  const interval = () => {\r\n    if (cleared) return;\r\n    const timestamp = new Date().getTime();\r\n    if (!lastcall) lastcall = timestamp;\r\n    if (timestamp - lastcall > delay) {\r\n      fn();\r\n      lastcall = timestamp;\r\n    }\r\n    rafId = requestAnimationFrame(interval);\r\n  };\r\n  interval();\r\n\r\n  return {\r\n    clear: () => {\r\n      cleared = true;\r\n      cancelAnimationFrame(rafId);\r\n    },\r\n  };\r\n};\r\n\r\nclass Animation {\r\n  private startTime = 0;\r\n  private isFinished = false;\r\n\r\n  constructor(\r\n    private duration: number,\r\n    private onProgress: (progress: number) => void,\r\n    private onFinish?: (animation: Animation) => void,\r\n  ) {}\r\n\r\n  public step = () => {\r\n    if (this.isFinished) return;\r\n    const timestamp = new Date().getTime();\r\n    if (!this.startTime) this.startTime = timestamp;\r\n    const progress = (timestamp - this.startTime) / this.duration;\r\n\r\n    this.onProgress(progress);\r\n\r\n    if (progress >= 1) {\r\n      this.finish();\r\n    }\r\n  };\r\n\r\n  public reset = () => {\r\n    this.startTime = 0;\r\n    this.isFinished = false;\r\n  };\r\n\r\n  public finish = () => {\r\n    this.isFinished = true;\r\n    this.onFinish && this.onFinish(this);\r\n  };\r\n\r\n  public start = () => {\r\n    if (!this.isFinished) {\r\n      this.step();\r\n    }\r\n  };\r\n}\r\n\r\nexport const createOffsetAnimation = (\r\n  from: number,\r\n  to: number,\r\n  duration: number,\r\n  setStyleProperty: CSSStyleDeclaration['setProperty'],\r\n  units = '',\r\n) => {\r\n  return new Animation(\r\n    duration,\r\n    progress => {\r\n      const current = from + (to - from) * progress;\r\n      setStyleProperty('stroke-dashoffset', `${current}${units}`);\r\n    },\r\n    animation => {\r\n      animation.reset();\r\n    },\r\n  );\r\n};\r\n\r\nexport const createLengthAnimation = (\r\n  from: number[],\r\n  to: number[],\r\n  duration: number,\r\n  setStyleProperty: CSSStyleDeclaration['setProperty'],\r\n  units = '',\r\n) => {\r\n  let reverse = false;\r\n  return new Animation(\r\n    duration,\r\n    progress => {\r\n      const p = reverse ? 1 - progress : progress;\r\n      const current = [from[0] + (to[0] - from[0]) * p, from[1] + (to[1] - from[1]) * p];\r\n      setStyleProperty('stroke-dasharray', `${current[0]}${units} ${current[1]}${units}`);\r\n    },\r\n    animation => {\r\n      reverse = !reverse;\r\n      animation.reset();\r\n    },\r\n  );\r\n};\r\n\r\nexport const createColorAnimation = (\r\n  colors: string[],\r\n  duration: number,\r\n  setStyleProperty: CSSStyleDeclaration['setProperty'],\r\n) => {\r\n  const rgbColors = colors.map(color => ColorFactory.create(color).rgb);\r\n  let currentIndex = 0;\r\n  let nextIndex = 1;\r\n\r\n  return new Animation(\r\n    duration,\r\n    progress => {\r\n      const from = rgbColors[currentIndex];\r\n      const to = rgbColors[nextIndex];\r\n      if (from && to) {\r\n        const current = [\r\n          Math.round(from[0] + (to[0] - from[0]) * progress),\r\n          Math.round(from[1] + (to[1] - from[1]) * progress),\r\n          Math.round(from[2] + (to[2] - from[2]) * progress),\r\n        ];\r\n        setStyleProperty('stroke', `rgb(${current})`);\r\n      }\r\n    },\r\n    animation => {\r\n      animation.reset();\r\n      currentIndex = nextIndex;\r\n      nextIndex = (nextIndex + 1) % colors.length;\r\n    },\r\n  );\r\n};\r\n\r\nexport const createRotationAnimation = (\r\n  from: number,\r\n  to: number,\r\n  duration: number,\r\n  setStyleProperty: CSSStyleDeclaration['setProperty'],\r\n  units = 'deg',\r\n) => {\r\n  return new Animation(\r\n    duration,\r\n    progress => {\r\n      const current = Math.round(from + (to - from) * progress);\r\n      setStyleProperty('transform', `rotate(${current}${units})`);\r\n    },\r\n    animation => {\r\n      animation.reset();\r\n    },\r\n  );\r\n};\r\n"]}
+{"version":3,"sources":["SpinnerFallbackAnimation.ts"],"names":["ColorFactory","SpinnerFallbackAnimationRunner","animations","FPS","interval","start","forEach","animation","rafInterval","step","stop","clear","finish","fn","delay","lastcall","cleared","rafId","timestamp","Date","getTime","requestAnimationFrame","cancelAnimationFrame","Animation","duration","onProgress","onFinish","startTime","isFinished","progress","reset","createOffsetAnimation","from","to","setStyleProperty","units","current","createLengthAnimation","reverse","p","createColorAnimation","colors","rgbColors","map","color","create","rgb","currentIndex","nextIndex","Math","round","length","createRotationAnimation"],"mappings":"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","sourcesContent":["/* eslint-disable no-useless-constructor */\nimport { ColorFactory } from '../../lib/styles/ColorFactory';\n\nexport class SpinnerFallbackAnimationRunner {\n  private interval: ReturnType<typeof rafInterval> | null = null;\n\n  constructor(private animations: Animation[], private FPS: number) {\n    this.start();\n  }\n\n  public start = () => {\n    this.animations.forEach((animation) => animation.start());\n    this.interval = rafInterval(() => {\n      this.animations.forEach((animation) => animation.step());\n    }, this.FPS);\n  };\n\n  public stop = () => {\n    if (this.interval) {\n      this.interval.clear();\n      this.animations.forEach((animation) => animation.finish());\n    }\n  };\n}\n\nconst rafInterval = (fn: () => void, delay: number) => {\n  let lastcall = 0;\n  let cleared = false;\n  let rafId = 0;\n\n  const interval = () => {\n    if (cleared) {\n      return;\n    }\n\n    const timestamp = new Date().getTime();\n    if (!lastcall) {\n      lastcall = timestamp;\n    }\n    if (timestamp - lastcall > delay) {\n      fn();\n      lastcall = timestamp;\n    }\n    rafId = requestAnimationFrame(interval);\n  };\n  interval();\n\n  return {\n    clear: () => {\n      cleared = true;\n      cancelAnimationFrame(rafId);\n    },\n  };\n};\n\nclass Animation {\n  private startTime = 0;\n  private isFinished = false;\n\n  constructor(\n    private duration: number,\n    private onProgress: (progress: number) => void,\n    private onFinish?: (animation: Animation) => void,\n  ) {}\n\n  public step = () => {\n    if (this.isFinished) {\n      return;\n    }\n\n    const timestamp = new Date().getTime();\n    if (!this.startTime) {\n      this.startTime = timestamp;\n    }\n    const progress = (timestamp - this.startTime) / this.duration;\n\n    this.onProgress(progress);\n\n    if (progress >= 1) {\n      this.finish();\n    }\n  };\n\n  public reset = () => {\n    this.startTime = 0;\n    this.isFinished = false;\n  };\n\n  public finish = () => {\n    this.isFinished = true;\n    this.onFinish && this.onFinish(this);\n  };\n\n  public start = () => {\n    if (!this.isFinished) {\n      this.step();\n    }\n  };\n}\n\nexport const createOffsetAnimation = (\n  from: number,\n  to: number,\n  duration: number,\n  setStyleProperty: CSSStyleDeclaration['setProperty'],\n  units = '',\n) => {\n  return new Animation(\n    duration,\n    (progress) => {\n      const current = from + (to - from) * progress;\n      setStyleProperty('stroke-dashoffset', `${current}${units}`);\n    },\n    (animation) => {\n      animation.reset();\n    },\n  );\n};\n\nexport const createLengthAnimation = (\n  from: number[],\n  to: number[],\n  duration: number,\n  setStyleProperty: CSSStyleDeclaration['setProperty'],\n  units = '',\n) => {\n  let reverse = false;\n  return new Animation(\n    duration,\n    (progress) => {\n      const p = reverse ? 1 - progress : progress;\n      const current = [from[0] + (to[0] - from[0]) * p, from[1] + (to[1] - from[1]) * p];\n      setStyleProperty('stroke-dasharray', `${current[0]}${units} ${current[1]}${units}`);\n    },\n    (animation) => {\n      reverse = !reverse;\n      animation.reset();\n    },\n  );\n};\n\nexport const createColorAnimation = (\n  colors: string[],\n  duration: number,\n  setStyleProperty: CSSStyleDeclaration['setProperty'],\n) => {\n  const rgbColors = colors.map((color) => ColorFactory.create(color).rgb);\n  let currentIndex = 0;\n  let nextIndex = 1;\n\n  return new Animation(\n    duration,\n    (progress) => {\n      const from = rgbColors[currentIndex];\n      const to = rgbColors[nextIndex];\n      if (from && to) {\n        const current = [\n          Math.round(from[0] + (to[0] - from[0]) * progress),\n          Math.round(from[1] + (to[1] - from[1]) * progress),\n          Math.round(from[2] + (to[2] - from[2]) * progress),\n        ];\n        setStyleProperty('stroke', `rgb(${current})`);\n      }\n    },\n    (animation) => {\n      animation.reset();\n      currentIndex = nextIndex;\n      nextIndex = (nextIndex + 1) % colors.length;\n    },\n  );\n};\n\nexport const createRotationAnimation = (\n  from: number,\n  to: number,\n  duration: number,\n  setStyleProperty: CSSStyleDeclaration['setProperty'],\n  units = 'deg',\n) => {\n  return new Animation(\n    duration,\n    (progress) => {\n      const current = Math.round(from + (to - from) * progress);\n      setStyleProperty('transform', `rotate(${current}${units})`);\n    },\n    (animation) => {\n      animation.reset();\n    },\n  );\n};\n"]}

package/components/Spinner/SpinnerFallbackAnimation.d.ts

@@ -18,8 +18,8 @@ declare class Animation {
     finish: () => void;
     start: () => void;
 }
-export declare const createOffsetAnimation: (from: number, to: number, duration: number, setStyleProperty: (propertyName: string, value: string | null, priority?: string | null | undefined) => void, units?: string) => Animation;
-export declare const createLengthAnimation: (from: number[], to: number[], duration: number, setStyleProperty: (propertyName: string, value: string | null, priority?: string | null | undefined) => void, units?: string) => Animation;
-export declare const createColorAnimation: (colors: string[], duration: number, setStyleProperty: (propertyName: string, value: string | null, priority?: string | null | undefined) => void) => Animation;
-export declare const createRotationAnimation: (from: number, to: number, duration: number, setStyleProperty: (propertyName: string, value: string | null, priority?: string | null | undefined) => void, units?: string) => Animation;
+export declare const createOffsetAnimation: (from: number, to: number, duration: number, setStyleProperty: CSSStyleDeclaration['setProperty'], units?: string) => Animation;
+export declare const createLengthAnimation: (from: number[], to: number[], duration: number, setStyleProperty: CSSStyleDeclaration['setProperty'], units?: string) => Animation;
+export declare const createColorAnimation: (colors: string[], duration: number, setStyleProperty: CSSStyleDeclaration['setProperty']) => Animation;
+export declare const createRotationAnimation: (from: number, to: number, duration: number, setStyleProperty: CSSStyleDeclaration['setProperty'], units?: string) => Animation;
 export {};

package/components/Spinner/index/index.js.map

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

package/components/Spinner/locale/index/index.js.map

@@ -1 +1 @@
-{"version":3,"sources":["index.ts"],"names":["LocaleHelper","componentsLocales","en_GB","ru_RU","SpinnerLocaleHelper"],"mappings":"AAAA,SAASA,YAAT,QAA6B,kCAA7B;;AAEA,SAAUC,iBAAiB,IAAIC,KAA/B,QAA4C,cAA5C;AACA,SAAUD,iBAAiB,IAAIE,KAA/B,QAA4C,cAA5C;;;AAGA,cAAc,SAAd;;AAEA,OAAO,IAAMC,mBAAmB,GAAG,IAAIJ,YAAJ,CAAgC;AACjEG,EAAAA,KAAK,EAALA,KADiE;AAEjED,EAAAA,KAAK,EAALA,KAFiE,EAAhC,CAA5B","sourcesContent":["import { LocaleHelper } from '../../../lib/locale/LocaleHelper';\r\n\r\nimport  { componentsLocales as en_GB } from './locales/en';\r\nimport  { componentsLocales as ru_RU } from './locales/ru';\r\nimport { SpinnerLocale } from './types';\r\n\r\nexport * from './types';\r\n\r\nexport const SpinnerLocaleHelper = new LocaleHelper<SpinnerLocale>({\r\n  ru_RU,\r\n  en_GB,\r\n});\r\n"]}
+{"version":3,"sources":["index.ts"],"names":["LocaleHelper","componentsLocales","en_GB","ru_RU","SpinnerLocaleHelper"],"mappings":"AAAA,SAASA,YAAT,QAA6B,kCAA7B;;AAEA,SAASC,iBAAiB,IAAIC,KAA9B,QAA2C,cAA3C;AACA,SAASD,iBAAiB,IAAIE,KAA9B,QAA2C,cAA3C;;;AAGA,cAAc,SAAd;;AAEA,OAAO,IAAMC,mBAAmB,GAAG,IAAIJ,YAAJ,CAAgC;AACjEG,EAAAA,KAAK,EAALA,KADiE;AAEjED,EAAAA,KAAK,EAALA,KAFiE,EAAhC,CAA5B","sourcesContent":["import { LocaleHelper } from '../../../lib/locale/LocaleHelper';\n\nimport { componentsLocales as en_GB } from './locales/en';\nimport { componentsLocales as ru_RU } from './locales/ru';\nimport { SpinnerLocale } from './types';\n\nexport * from './types';\n\nexport const SpinnerLocaleHelper = new LocaleHelper<SpinnerLocale>({\n  ru_RU,\n  en_GB,\n});\n"]}

package/components/Spinner/locale/locales/en/en.js.map

@@ -1 +1 @@
-{"version":3,"sources":["en.ts"],"names":["componentsLocales","loading"],"mappings":";;AAEA,OAAO,IAAMA,iBAAgC,GAAG;AAC9CC,EAAAA,OAAO,EAAE,SADqC,EAAzC","sourcesContent":["import { SpinnerLocale } from '../types';\r\n\r\nexport const componentsLocales: SpinnerLocale = {\r\n  loading: 'Loading',\r\n};\r\n"]}
+{"version":3,"sources":["en.ts"],"names":["componentsLocales","loading"],"mappings":";;AAEA,OAAO,IAAMA,iBAAgC,GAAG;AAC9CC,EAAAA,OAAO,EAAE,SADqC,EAAzC","sourcesContent":["import { SpinnerLocale } from '../types';\n\nexport const componentsLocales: SpinnerLocale = {\n  loading: 'Loading',\n};\n"]}

package/components/Spinner/locale/locales/ru/ru.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ru.ts"],"names":["componentsLocales","loading"],"mappings":";;AAEA,OAAO,IAAMA,iBAAgC,GAAG;AAC9CC,EAAAA,OAAO,EAAE,UADqC,EAAzC","sourcesContent":["import { SpinnerLocale } from '../types';\r\n\r\nexport const componentsLocales: SpinnerLocale = {\r\n  loading: 'Загрузка',\r\n};\r\n"]}
+{"version":3,"sources":["ru.ts"],"names":["componentsLocales","loading"],"mappings":";;AAEA,OAAO,IAAMA,iBAAgC,GAAG;AAC9CC,EAAAA,OAAO,EAAE,UADqC,EAAzC","sourcesContent":["import { SpinnerLocale } from '../types';\n\nexport const componentsLocales: SpinnerLocale = {\n  loading: 'Загрузка',\n};\n"]}

package/components/Spinner/locale/types/types.js

@@ -0,0 +1 @@
+export {};

package/components/Sticky/Sticky/Sticky.js

@@ -1,15 +1,25 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
 import _inheritsLoose from "@babel/runtime/helpers/esm/inheritsLoose";
+
+var _class, _class2, _temp;
+
 import React from 'react';
 import PropTypes from 'prop-types';
 import shallowEqual from 'shallowequal';
-import cn from 'classnames';
 import * as LayoutEvents from "../../../lib/LayoutEvents";
 import { isFunction } from "../../../lib/utils";
 import { ZIndex } from "../../../internal/ZIndex";
 import { CommonWrapper } from "../../../internal/CommonWrapper";
-import { jsStyles } from "../Sticky.styles";
+import { cx } from "../../../lib/theming/Emotion";
+import { rootNode } from "../../../lib/rootNode";
+import { getDOMRect } from "../../../lib/dom/getDOMRect";
+import { createPropsGetter } from "../../../lib/createPropsGetter";
+import { styles } from "../Sticky.styles";
 var MAX_REFLOW_RETRIES = 5;
-export var Sticky = /*#__PURE__*/function (_React$Component) {
+export var StickyDataTids = {
+  root: 'Spinner__root'
+};
+export var Sticky = rootNode(_class = (_temp = _class2 = /*#__PURE__*/function (_React$Component) {
   _inheritsLoose(Sticky, _React$Component);
 
   function Sticky() {
@@ -20,14 +30,13 @@ export var Sticky = /*#__PURE__*/function (_React$Component) {
     }
 
     _this = _React$Component.call.apply(_React$Component, [this].concat(args)) || this;
+    _this.getProps = createPropsGetter(Sticky.defaultProps);
     _this.state = {
       fixed: false,
       deltaHeight: 0,
       stopped: false,
       relativeTop: 0
     };
-    _this.wrapper = void 0;
-    _this.inner = void 0;
     _this.layoutSubscription = {
       remove: null
     };
@@ -55,24 +64,26 @@ export var Sticky = /*#__PURE__*/function (_React$Component) {
         return;
       }
 
-      var _this$wrapper$getBoun = _this.wrapper.getBoundingClientRect(),
-          top = _this$wrapper$getBoun.top,
-          bottom = _this$wrapper$getBoun.bottom,
-          left = _this$wrapper$getBoun.left;
+      var _getDOMRect = getDOMRect(_this.wrapper),
+          top = _getDOMRect.top,
+          bottom = _getDOMRect.bottom,
+          left = _getDOMRect.left;
 
-      var _this$inner$getBoundi = _this.inner.getBoundingClientRect(),
-          width = _this$inner$getBoundi.width,
-          height = _this$inner$getBoundi.height;
+      var _getDOMRect2 = getDOMRect(_this.inner),
+          width = _getDOMRect2.width,
+          height = _getDOMRect2.height;
 
       var _this$props = _this.props,
-          offset = _this$props.offset,
           getStop = _this$props.getStop,
           side = _this$props.side;
       var _this$state = _this.state,
           prevFixed = _this$state.fixed,
           _this$state$height = _this$state.height,
           prevHeight = _this$state$height === void 0 ? height : _this$state$height;
-      var fixed = side === 'top' ? top < offset : bottom > windowHeight - offset;
+
+      var offset = _this.getProps().offset;
+
+      var fixed = side === 'top' ? top < offset : Math.floor(bottom) > windowHeight - offset;
 
       _this.setState({
         fixed: fixed,
@@ -91,7 +102,7 @@ export var Sticky = /*#__PURE__*/function (_React$Component) {
 
         if (stop) {
           var deltaHeight = prevHeight - height;
-          var stopRect = stop.getBoundingClientRect();
+          var stopRect = getDOMRect(stop);
           var outerHeight = height + offset;
           var stopped = false;
           var relativeTop = 0;
@@ -142,12 +153,11 @@ export var Sticky = /*#__PURE__*/function (_React$Component) {
   };
 
   _proto.render = function render() {
-    var _cn;
+    var _cx;
 
     var children = this.props.children;
-    var _this$props2 = this.props,
-        side = _this$props2.side,
-        offset = _this$props2.offset;
+    var side = this.props.side;
+    var offset = this.getProps().offset;
     var _this$state2 = this.state,
         fixed = _this$state2.fixed,
         stopped = _this$state2.stopped,
@@ -173,17 +183,20 @@ export var Sticky = /*#__PURE__*/function (_React$Component) {
       children = children(fixed);
     }
 
-    return /*#__PURE__*/React.createElement(CommonWrapper, this.props, /*#__PURE__*/React.createElement("div", {
+    return /*#__PURE__*/React.createElement(CommonWrapper, _extends({
+      rootNodeRef: this.setRootNode
+    }, this.props), /*#__PURE__*/React.createElement("div", {
+      "data-tid": StickyDataTids.root,
       ref: this.refWrapper,
-      className: jsStyles.wrapper()
+      className: styles.wrapper()
     }, /*#__PURE__*/React.createElement(ZIndex, {
       priority: "Sticky",
       applyZIndex: fixed,
-      className: cn(jsStyles.inner(), (_cn = {}, _cn[jsStyles.fixed()] = fixed && !stopped, _cn[jsStyles.stopped()] = stopped, _cn)),
+      className: cx(styles.inner(), (_cx = {}, _cx[styles.fixed()] = fixed && !stopped, _cx[styles.stopped()] = stopped, _cx)),
       style: innerStyle,
       wrapperRef: this.refInner
     }, /*#__PURE__*/React.createElement("div", {
-      className: jsStyles.container()
+      className: styles.container()
     }, children)), fixed && !stopped ? /*#__PURE__*/React.createElement("div", {
       style: {
         width: width,
@@ -193,22 +206,19 @@ export var Sticky = /*#__PURE__*/function (_React$Component) {
   };
 
   return Sticky;
-}(React.Component);
-Sticky.__KONTUR_REACT_UI__ = 'Sticky';
-Sticky.propTypes = {
+}(React.Component), _class2.__KONTUR_REACT_UI__ = 'Sticky', _class2.propTypes = {
   children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),
 
-  /**
-  * Функция, которая возвращает DOM-элемент, который нельзя пересекать.
+  /**
+  * Функция, которая возвращает DOM-элемент, который нельзя пересекать.
   */
   getStop: PropTypes.func,
 
-  /**
-  * Отступ от границы в пикселях
+  /**
+  * Отступ от границы в пикселях
   */
   offset: PropTypes.number,
   side: PropTypes.oneOf(['top', 'bottom']).isRequired
-};
-Sticky.defaultProps = {
+}, _class2.defaultProps = {
   offset: 0
-};
+}, _temp)) || _class;

package/components/Sticky/Sticky/Sticky.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Sticky.tsx"],"names":["React","PropTypes","shallowEqual","cn","LayoutEvents","isFunction","ZIndex","CommonWrapper","jsStyles","MAX_REFLOW_RETRIES","Sticky","state","fixed","deltaHeight","stopped","relativeTop","wrapper","inner","layoutSubscription","remove","reflowCounter","refWrapper","ref","refInner","reflow","document","documentElement","Error","windowHeight","window","innerHeight","clientHeight","getBoundingClientRect","top","bottom","left","width","height","props","offset","getStop","side","prevFixed","prevHeight","setState","stop","stopRect","outerHeight","componentDidMount","addListener","componentWillUnmount","componentDidUpdate","prevProps","prevState","emit","render","children","innerStyle","container","Component","__KONTUR_REACT_UI__","propTypes","oneOfType","node","func","number","oneOf","isRequired","defaultProps"],"mappings":"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","sourcesContent":["import React from 'react';\r\nimport PropTypes from 'prop-types';\r\nimport shallowEqual from 'shallowequal';\r\nimport cn from 'classnames';\r\n\r\nimport * as LayoutEvents from '../../lib/LayoutEvents';\r\nimport { Nullable } from '../../typings/utility-types';\r\nimport { isFunction } from '../../lib/utils';\r\nimport { ZIndex } from '../../internal/ZIndex';\r\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\r\n\r\nimport { jsStyles } from './Sticky.styles';\r\n\r\nconst MAX_REFLOW_RETRIES = 5;\r\n\r\nexport interface StickyProps extends CommonProps {\r\n  side: 'top' | 'bottom';\r\n  /**\r\n   * Отступ в пикселях от края экрана, на сколько сдвигается элемент в залипшем состоянии\r\n   * @default 0\r\n   */\r\n  offset: number;\r\n  getStop?: () => Nullable<HTMLElement>;\r\n  children?: React.ReactNode | ((fixed: boolean) => React.ReactNode);\r\n}\r\n\r\nexport interface StickyState {\r\n  fixed: boolean;\r\n  deltaHeight: number;\r\n  height?: number;\r\n  width?: number;\r\n  left?: number;\r\n  stopped: boolean;\r\n  relativeTop: number;\r\n}\r\n\r\nexport class Sticky extends React.Component<StickyProps, StickyState> {\r\n  public static __KONTUR_REACT_UI__ = 'Sticky';\r\n\r\n  public static propTypes = {\r\n    children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\r\n\r\n    /**\r\n     * Функция, которая возвращает DOM-элемент, который нельзя пересекать.\r\n     */\r\n    getStop: PropTypes.func,\r\n\r\n    /**\r\n     * Отступ от границы в пикселях\r\n     */\r\n    offset: PropTypes.number,\r\n\r\n    side: PropTypes.oneOf(['top', 'bottom']).isRequired,\r\n  };\r\n\r\n  public static defaultProps = { offset: 0 };\r\n\r\n  public state: StickyState = {\r\n    fixed: false,\r\n    deltaHeight: 0,\r\n    stopped: false,\r\n    relativeTop: 0,\r\n  };\r\n\r\n  private wrapper: Nullable<HTMLElement>;\r\n  private inner: Nullable<HTMLElement>;\r\n  private layoutSubscription: { remove: Nullable<() => void> } = { remove: null };\r\n  private reflowCounter = 0;\r\n\r\n  public componentDidMount() {\r\n    this.reflow();\r\n\r\n    this.layoutSubscription = LayoutEvents.addListener(this.reflow);\r\n  }\r\n\r\n  public componentWillUnmount() {\r\n    if (this.layoutSubscription.remove) {\r\n      this.layoutSubscription.remove();\r\n    }\r\n  }\r\n\r\n  public componentDidUpdate(prevProps: StickyProps, prevState: StickyState) {\r\n    if (!shallowEqual(prevProps, this.props) || !shallowEqual(prevState, this.state)) {\r\n      if (this.reflowCounter < MAX_REFLOW_RETRIES) {\r\n        LayoutEvents.emit();\r\n        this.reflowCounter += 1;\r\n        return;\r\n      }\r\n    }\r\n    this.reflowCounter = 0;\r\n  }\r\n\r\n  public render() {\r\n    let { children } = this.props;\r\n    const { side, offset } = this.props;\r\n    const { fixed, stopped, relativeTop, deltaHeight, width, height, left } = this.state;\r\n    const innerStyle: React.CSSProperties = {};\r\n\r\n    if (fixed) {\r\n      if (stopped) {\r\n        innerStyle.top = relativeTop;\r\n        innerStyle[side === 'top' ? 'marginTop' : 'marginBottom'] = deltaHeight;\r\n      } else {\r\n        innerStyle.width = width;\r\n        innerStyle[side] = offset;\r\n        innerStyle.left = left;\r\n      }\r\n    }\r\n\r\n    if (isFunction(children)) {\r\n      children = children(fixed);\r\n    }\r\n\r\n    return (\r\n      <CommonWrapper {...this.props}>\r\n        <div ref={this.refWrapper} className={jsStyles.wrapper()}>\r\n          <ZIndex\r\n            priority=\"Sticky\"\r\n            applyZIndex={fixed}\r\n            className={cn(jsStyles.inner(), {\r\n              [jsStyles.fixed()]: fixed && !stopped,\r\n              [jsStyles.stopped()]: stopped,\r\n            })}\r\n            style={innerStyle}\r\n            wrapperRef={this.refInner}\r\n          >\r\n            <div className={jsStyles.container()}>{children}</div>\r\n          </ZIndex>\r\n          {fixed && !stopped ? <div style={{ width, height }} /> : null}\r\n        </div>\r\n      </CommonWrapper>\r\n    );\r\n  }\r\n\r\n  private refWrapper = (ref: Nullable<HTMLElement>) => (this.wrapper = ref);\r\n\r\n  private refInner = (ref: Nullable<HTMLElement>) => (this.inner = ref);\r\n\r\n  private reflow = () => {\r\n    const { documentElement } = document;\r\n\r\n    if (!documentElement) {\r\n      throw Error('There is no \"documentElement\" in document');\r\n    }\r\n\r\n    const windowHeight = window.innerHeight || documentElement.clientHeight;\r\n    if (!this.wrapper || !this.inner) {\r\n      return;\r\n    }\r\n    const { top, bottom, left } = this.wrapper.getBoundingClientRect();\r\n    const { width, height } = this.inner.getBoundingClientRect();\r\n    const { offset, getStop, side } = this.props;\r\n    const { fixed: prevFixed, height: prevHeight = height } = this.state;\r\n    const fixed = side === 'top' ? top < offset : bottom > windowHeight - offset;\r\n\r\n    this.setState({ fixed, left });\r\n\r\n    if (fixed && !prevFixed) {\r\n      this.setState({ width, height });\r\n    }\r\n\r\n    if (fixed) {\r\n      const stop = getStop && getStop();\r\n      if (stop) {\r\n        const deltaHeight = prevHeight - height;\r\n        const stopRect = stop.getBoundingClientRect();\r\n        const outerHeight = height + offset;\r\n        let stopped = false;\r\n        let relativeTop = 0;\r\n\r\n        if (side === 'top') {\r\n          stopped = stopRect.top - outerHeight < 0;\r\n          relativeTop = stopRect.top - prevHeight - top;\r\n        } else {\r\n          stopped = stopRect.bottom + outerHeight > windowHeight;\r\n          relativeTop = stopRect.bottom - top;\r\n        }\r\n\r\n        this.setState({ relativeTop, deltaHeight, stopped });\r\n      }\r\n    }\r\n  };\r\n}\r\n"]}
+{"version":3,"sources":["Sticky.tsx"],"names":["React","PropTypes","shallowEqual","LayoutEvents","isFunction","ZIndex","CommonWrapper","cx","rootNode","getDOMRect","createPropsGetter","styles","MAX_REFLOW_RETRIES","StickyDataTids","root","Sticky","getProps","defaultProps","state","fixed","deltaHeight","stopped","relativeTop","layoutSubscription","remove","reflowCounter","refWrapper","ref","wrapper","refInner","inner","reflow","document","documentElement","Error","windowHeight","window","innerHeight","clientHeight","top","bottom","left","width","height","props","getStop","side","prevFixed","prevHeight","offset","Math","floor","setState","stop","stopRect","outerHeight","componentDidMount","addListener","componentWillUnmount","componentDidUpdate","prevProps","prevState","emit","render","children","innerStyle","setRootNode","container","Component","__KONTUR_REACT_UI__","propTypes","oneOfType","node","func","number","oneOf","isRequired"],"mappings":"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","sourcesContent":["import React from 'react';\nimport PropTypes from 'prop-types';\nimport shallowEqual from 'shallowequal';\n\nimport * as LayoutEvents from '../../lib/LayoutEvents';\nimport { Nullable } from '../../typings/utility-types';\nimport { isFunction } from '../../lib/utils';\nimport { ZIndex } from '../../internal/ZIndex';\nimport { CommonWrapper, CommonProps } from '../../internal/CommonWrapper';\nimport { cx } from '../../lib/theming/Emotion';\nimport { rootNode, TSetRootNode } from '../../lib/rootNode';\nimport { getDOMRect } from '../../lib/dom/getDOMRect';\nimport { createPropsGetter } from '../../lib/createPropsGetter';\n\nimport { styles } from './Sticky.styles';\n\nconst MAX_REFLOW_RETRIES = 5;\n\nexport interface StickyProps extends CommonProps {\n  side: 'top' | 'bottom';\n  /**\n   * Отступ в пикселях от края экрана, на сколько сдвигается элемент в залипшем состоянии\n   * @default 0\n   */\n  offset?: number;\n  getStop?: () => Nullable<HTMLElement>;\n  children?: React.ReactNode | ((fixed: boolean) => React.ReactNode);\n}\n\nexport interface StickyState {\n  fixed: boolean;\n  deltaHeight: number;\n  height?: number;\n  width?: number;\n  left?: number;\n  stopped: boolean;\n  relativeTop: number;\n}\n\nexport const StickyDataTids = {\n  root: 'Spinner__root',\n} as const;\n\ntype DefaultProps = Required<Pick<StickyProps, 'offset'>>;\n\n@rootNode\nexport class Sticky extends React.Component<StickyProps, StickyState> {\n  public static __KONTUR_REACT_UI__ = 'Sticky';\n\n  public static propTypes = {\n    children: PropTypes.oneOfType([PropTypes.node, PropTypes.func]),\n\n    /**\n     * Функция, которая возвращает DOM-элемент, который нельзя пересекать.\n     */\n    getStop: PropTypes.func,\n\n    /**\n     * Отступ от границы в пикселях\n     */\n    offset: PropTypes.number,\n\n    side: PropTypes.oneOf(['top', 'bottom']).isRequired,\n  };\n\n  public static defaultProps: DefaultProps = { offset: 0 };\n\n  private getProps = createPropsGetter(Sticky.defaultProps);\n\n  public state: StickyState = {\n    fixed: false,\n    deltaHeight: 0,\n    stopped: false,\n    relativeTop: 0,\n  };\n\n  private wrapper: Nullable<HTMLElement>;\n  private inner: Nullable<HTMLElement>;\n  private layoutSubscription: { remove: Nullable<() => void> } = { remove: null };\n  private reflowCounter = 0;\n  private setRootNode!: TSetRootNode;\n\n  public componentDidMount() {\n    this.reflow();\n\n    this.layoutSubscription = LayoutEvents.addListener(this.reflow);\n  }\n\n  public componentWillUnmount() {\n    if (this.layoutSubscription.remove) {\n      this.layoutSubscription.remove();\n    }\n  }\n\n  public componentDidUpdate(prevProps: StickyProps, prevState: StickyState) {\n    if (!shallowEqual(prevProps, this.props) || !shallowEqual(prevState, this.state)) {\n      if (this.reflowCounter < MAX_REFLOW_RETRIES) {\n        LayoutEvents.emit();\n        this.reflowCounter += 1;\n        return;\n      }\n    }\n    this.reflowCounter = 0;\n  }\n\n  public render() {\n    let { children } = this.props;\n    const { side } = this.props;\n    const offset = this.getProps().offset;\n    const { fixed, stopped, relativeTop, deltaHeight, width, height, left } = this.state;\n    const innerStyle: React.CSSProperties = {};\n\n    if (fixed) {\n      if (stopped) {\n        innerStyle.top = relativeTop;\n        innerStyle[side === 'top' ? 'marginTop' : 'marginBottom'] = deltaHeight;\n      } else {\n        innerStyle.width = width;\n        innerStyle[side] = offset;\n        innerStyle.left = left;\n      }\n    }\n\n    if (isFunction(children)) {\n      children = children(fixed);\n    }\n\n    return (\n      <CommonWrapper rootNodeRef={this.setRootNode} {...this.props}>\n        <div data-tid={StickyDataTids.root} ref={this.refWrapper} className={styles.wrapper()}>\n          <ZIndex\n            priority=\"Sticky\"\n            applyZIndex={fixed}\n            className={cx(styles.inner(), {\n              [styles.fixed()]: fixed && !stopped,\n              [styles.stopped()]: stopped,\n            })}\n            style={innerStyle}\n            wrapperRef={this.refInner}\n          >\n            <div className={styles.container()}>{children}</div>\n          </ZIndex>\n          {fixed && !stopped ? <div style={{ width, height }} /> : null}\n        </div>\n      </CommonWrapper>\n    );\n  }\n\n  private refWrapper = (ref: Nullable<HTMLElement>) => (this.wrapper = ref);\n\n  private refInner = (ref: Nullable<HTMLElement>) => (this.inner = ref);\n\n  /**\n   * Пересчитать габариты и позицию залипшего элемента\n   *\n   * @public\n   */\n  public reflow = () => {\n    const { documentElement } = document;\n\n    if (!documentElement) {\n      throw Error('There is no \"documentElement\" in document');\n    }\n\n    const windowHeight = window.innerHeight || documentElement.clientHeight;\n    if (!this.wrapper || !this.inner) {\n      return;\n    }\n    const { top, bottom, left } = getDOMRect(this.wrapper);\n    const { width, height } = getDOMRect(this.inner);\n    const { getStop, side } = this.props;\n    const { fixed: prevFixed, height: prevHeight = height } = this.state;\n    const offset = this.getProps().offset;\n    const fixed = side === 'top' ? top < offset : Math.floor(bottom) > windowHeight - offset;\n\n    this.setState({ fixed, left });\n\n    if (fixed && !prevFixed) {\n      this.setState({ width, height });\n    }\n\n    if (fixed) {\n      const stop = getStop && getStop();\n      if (stop) {\n        const deltaHeight = prevHeight - height;\n        const stopRect = getDOMRect(stop);\n        const outerHeight = height + offset;\n        let stopped = false;\n        let relativeTop = 0;\n\n        if (side === 'top') {\n          stopped = stopRect.top - outerHeight < 0;\n          relativeTop = stopRect.top - prevHeight - top;\n        } else {\n          stopped = stopRect.bottom + outerHeight > windowHeight;\n          relativeTop = stopRect.bottom - top;\n        }\n\n        this.setState({ relativeTop, deltaHeight, stopped });\n      }\n    }\n  };\n}\n"]}

package/components/Sticky/Sticky.d.ts

@@ -8,7 +8,7 @@ export interface StickyProps extends CommonProps {
      * Отступ в пикселях от края экрана, на сколько сдвигается элемент в залипшем состоянии
      * @default 0
      */
-    offset: number;
+    offset?: number;
     getStop?: () => Nullable<HTMLElement>;
     children?: React.ReactNode | ((fixed: boolean) => React.ReactNode);
 }
@@ -21,6 +21,10 @@ export interface StickyState {
     stopped: boolean;
     relativeTop: number;
 }
+export declare const StickyDataTids: {
+    readonly root: "Spinner__root";
+};
+declare type DefaultProps = Required<Pick<StickyProps, 'offset'>>;
 export declare class Sticky extends React.Component<StickyProps, StickyState> {
     static __KONTUR_REACT_UI__: string;
     static propTypes: {
@@ -35,19 +39,25 @@ export declare class Sticky extends React.Component<StickyProps, StickyState> {
         offset: PropTypes.Requireable<number>;
         side: PropTypes.Validator<string>;
     };
-    static defaultProps: {
-        offset: number;
-    };
+    static defaultProps: DefaultProps;
+    private getProps;
     state: StickyState;
     private wrapper;
     private inner;
     private layoutSubscription;
     private reflowCounter;
+    private setRootNode;
     componentDidMount(): void;
     componentWillUnmount(): void;
     componentDidUpdate(prevProps: StickyProps, prevState: StickyState): void;
     render(): JSX.Element;
     private refWrapper;
     private refInner;
-    private reflow;
+    /**
+     * Пересчитать габариты и позицию залипшего элемента
+     *
+     * @public
+     */
+    reflow: () => void;
 }
+export {};