@skbkontur/react-ui 0.0.0-aaf2aabecb → 0.0.0-b08da15166

package/lib/taskWithDelayAndMinimalDuration/taskWithDelayAndMinimalDuration.js

@@ -0,0 +1,76 @@
+import _extends from "@babel/runtime/helpers/esm/extends";
+export var TaskWithDelayAndMinimalDuration = function TaskWithDelayAndMinimalDuration(initialValues) {
+  var _this = this;
+
+  this.isTaskActive = false;
+
+  this.setTimeoutBeforeTaskStart = function () {
+    _this.timeoutBeforeTaskStart = setTimeout(function () {
+      _this.isTaskActive && _this.taskParams.taskStartCallback();
+
+      _this.clearTimeoutBeforeTaskStart();
+
+      _this.setTimeoutBeforeTaskStop();
+    }, _this.taskParams.delayBeforeTaskStart);
+  };
+
+  this.setTimeoutBeforeTaskStop = function () {
+    _this.timeoutBeforeTaskStop = setTimeout(function () {
+      !_this.isTaskActive && _this.taskParams.taskStopCallback();
+
+      _this.clearTimeoutBeforeTaskStop();
+    }, _this.taskParams.durationOfTask);
+  };
+
+  this.clearTimeoutBeforeTaskStart = function () {
+    _this.timeoutBeforeTaskStart && clearTimeout(_this.timeoutBeforeTaskStart);
+    _this.timeoutBeforeTaskStart = null;
+  };
+
+  this.clearTimeoutBeforeTaskStop = function () {
+    _this.timeoutBeforeTaskStop && clearTimeout(_this.timeoutBeforeTaskStop);
+    _this.timeoutBeforeTaskStop = null;
+  };
+
+  this.start = function () {
+    if (_this.isTaskActive) {
+      return;
+    }
+
+    _this.isTaskActive = true;
+
+    if (_this.timeoutBeforeTaskStart) {
+      _this.clearTimeoutBeforeTaskStart();
+    }
+
+    _this.setTimeoutBeforeTaskStart();
+  };
+
+  this.update = function (updateData) {
+    _this.taskParams = _extends({}, _this.taskParams, updateData);
+  };
+
+  this.stop = function () {
+    if (!_this.isTaskActive) {
+      return;
+    }
+
+    _this.isTaskActive = false;
+
+    if (!_this.timeoutBeforeTaskStart && !_this.timeoutBeforeTaskStop) {
+      _this.taskParams.taskStopCallback();
+    }
+
+    if (_this.timeoutBeforeTaskStart) {
+      _this.clearTimeoutBeforeTaskStart();
+    }
+  };
+
+  this.clearTask = function () {
+    _this.clearTimeoutBeforeTaskStart();
+
+    _this.clearTimeoutBeforeTaskStop();
+  };
+
+  this.taskParams = initialValues;
+};

package/lib/taskWithDelayAndMinimalDuration/taskWithDelayAndMinimalDuration.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":["taskWithDelayAndMinimalDuration.ts"],"names":["TaskWithDelayAndMinimalDuration","initialValues","isTaskActive","setTimeoutBeforeTaskStart","timeoutBeforeTaskStart","setTimeout","taskParams","taskStartCallback","clearTimeoutBeforeTaskStart","setTimeoutBeforeTaskStop","delayBeforeTaskStart","timeoutBeforeTaskStop","taskStopCallback","clearTimeoutBeforeTaskStop","durationOfTask","clearTimeout","start","update","updateData","stop","clearTask"],"mappings":";;;;;;;;;AASA,WAAaA,+BAAb;;;;;;AAME,yCAAYC,aAAZ,EAAiE,uBAFzDC,YAEyD,GAF1C,KAE0C;;;;AAIzDC,EAAAA,yBAJyD,GAI7B,YAAM;AACxC,IAAA,KAAI,CAACC,sBAAL,GAA8BC,UAAU,CAAC,YAAM;AAC7C,MAAA,KAAI,CAACH,YAAL,IAAqB,KAAI,CAACI,UAAL,CAAgBC,iBAAhB,EAArB;AACA,MAAA,KAAI,CAACC,2BAAL;AACA,MAAA,KAAI,CAACC,wBAAL;AACD,KAJuC,EAIrC,KAAI,CAACH,UAAL,CAAgBI,oBAJqB,CAAxC;AAKD,GAVgE;;AAYzDD,EAAAA,wBAZyD,GAY9B,YAAM;AACvC,IAAA,KAAI,CAACE,qBAAL,GAA6BN,UAAU,CAAC,YAAM;AAC5C,OAAC,KAAI,CAACH,YAAN,IAAsB,KAAI,CAACI,UAAL,CAAgBM,gBAAhB,EAAtB;AACA,MAAA,KAAI,CAACC,0BAAL;AACD,KAHsC,EAGpC,KAAI,CAACP,UAAL,CAAgBQ,cAHoB,CAAvC;AAID,GAjBgE;;AAmBzDN,EAAAA,2BAnByD,GAmB3B,YAAM;AAC1C,IAAA,KAAI,CAACJ,sBAAL,IAA+BW,YAAY,CAAC,KAAI,CAACX,sBAAN,CAA3C;AACA,IAAA,KAAI,CAACA,sBAAL,GAA8B,IAA9B;AACD,GAtBgE;;AAwBzDS,EAAAA,0BAxByD,GAwB5B,YAAM;AACzC,IAAA,KAAI,CAACF,qBAAL,IAA8BI,YAAY,CAAC,KAAI,CAACJ,qBAAN,CAA1C;AACA,IAAA,KAAI,CAACA,qBAAL,GAA6B,IAA7B;AACD,GA3BgE;;AA6B1DK,EAAAA,KA7B0D,GA6BlD,YAAM;AACnB,QAAI,KAAI,CAACd,YAAT,EAAuB;AACrB;AACD;;AAED,IAAA,KAAI,CAACA,YAAL,GAAoB,IAApB;;AAEA,QAAI,KAAI,CAACE,sBAAT,EAAiC;AAC/B,MAAA,KAAI,CAACI,2BAAL;AACD;;AAED,IAAA,KAAI,CAACL,yBAAL;AACD,GAzCgE;;AA2C1Dc,EAAAA,MA3C0D,GA2CjD,UAACC,UAAD,EAA+D;AAC7E,IAAA,KAAI,CAACZ,UAAL,gBAAuB,KAAI,CAACA,UAA5B,EAA2CY,UAA3C;AACD,GA7CgE;;AA+C1DC,EAAAA,IA/C0D,GA+CnD,YAAM;AAClB,QAAI,CAAC,KAAI,CAACjB,YAAV,EAAwB;AACtB;AACD;;AAED,IAAA,KAAI,CAACA,YAAL,GAAoB,KAApB;;AAEA,QAAI,CAAC,KAAI,CAACE,sBAAN,IAAgC,CAAC,KAAI,CAACO,qBAA1C,EAAiE;AAC/D,MAAA,KAAI,CAACL,UAAL,CAAgBM,gBAAhB;AACD;;AAED,QAAI,KAAI,CAACR,sBAAT,EAAiC;AAC/B,MAAA,KAAI,CAACI,2BAAL;AACD;AACF,GA7DgE;;AA+D1DY,EAAAA,SA/D0D,GA+D9C,YAAM;AACvB,IAAA,KAAI,CAACZ,2BAAL;AACA,IAAA,KAAI,CAACK,0BAAL;AACD,GAlEgE,CAC/D,KAAKP,UAAL,GAAkBL,aAAlB,CACD,CARH","sourcesContent":["import { Nullable } from '../typings/utility-types';\n\nexport interface TaskWithDelayAndMinimalDurationProps {\n  delayBeforeTaskStart: number;\n  durationOfTask: number;\n  taskStartCallback: () => void;\n  taskStopCallback: () => void;\n}\n\nexport class TaskWithDelayAndMinimalDuration {\n  private timeoutBeforeTaskStart: Nullable<NodeJS.Timeout>;\n  private timeoutBeforeTaskStop: Nullable<NodeJS.Timeout>;\n  private taskParams: TaskWithDelayAndMinimalDurationProps;\n  private isTaskActive = false;\n\n  constructor(initialValues: TaskWithDelayAndMinimalDurationProps) {\n    this.taskParams = initialValues;\n  }\n\n  private setTimeoutBeforeTaskStart = () => {\n    this.timeoutBeforeTaskStart = setTimeout(() => {\n      this.isTaskActive && this.taskParams.taskStartCallback();\n      this.clearTimeoutBeforeTaskStart();\n      this.setTimeoutBeforeTaskStop();\n    }, this.taskParams.delayBeforeTaskStart);\n  };\n\n  private setTimeoutBeforeTaskStop = () => {\n    this.timeoutBeforeTaskStop = setTimeout(() => {\n      !this.isTaskActive && this.taskParams.taskStopCallback();\n      this.clearTimeoutBeforeTaskStop();\n    }, this.taskParams.durationOfTask);\n  };\n\n  private clearTimeoutBeforeTaskStart = () => {\n    this.timeoutBeforeTaskStart && clearTimeout(this.timeoutBeforeTaskStart);\n    this.timeoutBeforeTaskStart = null;\n  };\n\n  private clearTimeoutBeforeTaskStop = () => {\n    this.timeoutBeforeTaskStop && clearTimeout(this.timeoutBeforeTaskStop);\n    this.timeoutBeforeTaskStop = null;\n  };\n\n  public start = () => {\n    if (this.isTaskActive) {\n      return;\n    }\n\n    this.isTaskActive = true;\n\n    if (this.timeoutBeforeTaskStart) {\n      this.clearTimeoutBeforeTaskStart();\n    }\n\n    this.setTimeoutBeforeTaskStart();\n  };\n\n  public update = (updateData: Partial<TaskWithDelayAndMinimalDurationProps>) => {\n    this.taskParams = { ...this.taskParams, ...updateData };\n  };\n\n  public stop = () => {\n    if (!this.isTaskActive) {\n      return;\n    }\n\n    this.isTaskActive = false;\n\n    if (!this.timeoutBeforeTaskStart && !this.timeoutBeforeTaskStop) {\n      this.taskParams.taskStopCallback();\n    }\n\n    if (this.timeoutBeforeTaskStart) {\n      this.clearTimeoutBeforeTaskStart();\n    }\n  };\n\n  public clearTask = () => {\n    this.clearTimeoutBeforeTaskStart();\n    this.clearTimeoutBeforeTaskStop();\n  };\n}\n"]}

package/lib/taskWithDelayAndMinimalDuration.d.ts

@@ -0,0 +1,21 @@
+export interface TaskWithDelayAndMinimalDurationProps {
+    delayBeforeTaskStart: number;
+    durationOfTask: number;
+    taskStartCallback: () => void;
+    taskStopCallback: () => void;
+}
+export declare class TaskWithDelayAndMinimalDuration {
+    private timeoutBeforeTaskStart;
+    private timeoutBeforeTaskStop;
+    private taskParams;
+    private isTaskActive;
+    constructor(initialValues: TaskWithDelayAndMinimalDurationProps);
+    private setTimeoutBeforeTaskStart;
+    private setTimeoutBeforeTaskStop;
+    private clearTimeoutBeforeTaskStart;
+    private clearTimeoutBeforeTaskStop;
+    start: () => void;
+    update: (updateData: Partial<TaskWithDelayAndMinimalDurationProps>) => void;
+    stop: () => void;
+    clearTask: () => void;
+}

package/lib/theming/AnimationKeyframes/AnimationKeyframes.js

@@ -1,83 +1,25 @@
 import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
 
-function _templateObject6() {
-  var data = _taggedTemplateLiteralLoose(["\n        100%, 0% { stroke: ", "; }\n        40% { stroke: ", "; }\n        66% { stroke: ", "; }\n        80%, 90% { stroke: ", "; }\n      "]);
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6;
 
-  _templateObject6 = function _templateObject6() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject5() {
-  var data = _taggedTemplateLiteralLoose(["\n        100% { transform: rotate(360deg); }\n      "]);
-
-  _templateObject5 = function _templateObject5() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject4() {
-  var data = _taggedTemplateLiteralLoose(["\n        0% { stroke-dasharray: 62.5%, 168.75%; }\n        50% {  stroke-dasharray: 187.5%, 43.75%; }\n        100% { stroke-dasharray: 62.5%, 168.75%; }\n      "]);
-
-  _templateObject4 = function _templateObject4() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject3() {
-  var data = _taggedTemplateLiteralLoose(["\n        0% { stroke-dashoffset: 0; }\n        100% { stroke-dashoffset: -231.25%; }\n      "]);
-
-  _templateObject3 = function _templateObject3() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject2() {
-  var data = _taggedTemplateLiteralLoose(["\n        0% { stroke-dasharray: 10, 96; }\n        50% { stroke-dasharray: 50, 56; }\n        100% { stroke-dasharray: 10, 96;}\n      "]);
-
-  _templateObject2 = function _templateObject2() {
-    return data;
-  };
-
-  return data;
-}
-
-function _templateObject() {
-  var data = _taggedTemplateLiteralLoose(["\n        0% { stroke-dashoffset: 10; }\n        100% { stroke-dashoffset: 116; }\n      "]);
-
-  _templateObject = function _templateObject() {
-    return data;
-  };
-
-  return data;
-}
-
-import { keyframes } from "..\\Emotion";
+import { keyframes } from "../Emotion";
 export var AnimationKeyframes = {
   spinnerCloudOffset: function spinnerCloudOffset(t) {
-    return keyframes(_templateObject());
+    return keyframes(_templateObject || (_templateObject = _taggedTemplateLiteralLoose(["\n        0% { stroke-dashoffset: 10; }\n        100% { stroke-dashoffset: 116; }\n      "])));
   },
   spinnerCloudLength: function spinnerCloudLength(t) {
-    return keyframes(_templateObject2());
+    return keyframes(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n        0% { stroke-dasharray: 10, 96; }\n        50% { stroke-dasharray: 50, 56; }\n        100% { stroke-dasharray: 10, 96;}\n      "])));
   },
   spinnerCircleOffset: function spinnerCircleOffset(t) {
-    return keyframes(_templateObject3());
+    return keyframes(_templateObject3 || (_templateObject3 = _taggedTemplateLiteralLoose(["\n        0% { stroke-dashoffset: 231.25%; }\n        100% { stroke-dashoffset: 0%; }\n      "])));
   },
   spinnerCircleLength: function spinnerCircleLength(t) {
-    return keyframes(_templateObject4());
+    return keyframes(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n        0% { stroke-dasharray: 62.5%, 168.75%; }\n        50% {  stroke-dasharray: 187.5%, 43.75%; }\n        100% { stroke-dasharray: 62.5%, 168.75%; }\n      "])));
   },
   spinnerCircleRotate: function spinnerCircleRotate(t) {
-    return keyframes(_templateObject5());
+    return keyframes(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n        100% { transform: rotate(360deg); }\n      "])));
   },
   spinnerColor: function spinnerColor(t) {
-    return keyframes(_templateObject6(), t.red, t.yellow, t.green, t.brand);
+    return keyframes(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n        100%, 0% { stroke: ", "; }\n        40% { stroke: ", "; }\n        66% { stroke: ", "; }\n        80%, 90% { stroke: ", "; }\n      "])), t.red, t.yellow, t.green, t.brand);
   }
 };

package/lib/theming/AnimationKeyframes/AnimationKeyframes.js.map

@@ -1 +1 @@
-{"version":3,"sources":["AnimationKeyframes.ts"],"names":["keyframes","AnimationKeyframes","spinnerCloudOffset","t","spinnerCloudLength","spinnerCircleOffset","spinnerCircleLength","spinnerCircleRotate","spinnerColor","red","yellow","green","brand"],"mappings":"8nDAAA,SAASA,SAAT,QAA0B,WAA1B;;;AAGA,OAAO,IAAMC,kBAAkB,GAAG;AAChCC,EAAAA,kBADgC,8BACbC,CADa,EACH;AAC3B,WAAOH,SAAP;;;;AAID,GAN+B;;AAQhCI,EAAAA,kBARgC,8BAQbD,CARa,EAQH;AAC3B,WAAOH,SAAP;;;;;AAKD,GAd+B;AAehCK,EAAAA,mBAfgC,+BAeZF,CAfY,EAeF;AAC5B,WAAOH,SAAP;;;;AAID,GApB+B;AAqBhCM,EAAAA,mBArBgC,+BAqBZH,CArBY,EAqBF;AAC5B,WAAOH,SAAP;;;;;AAKD,GA3B+B;AA4BhCO,EAAAA,mBA5BgC,+BA4BZJ,CA5BY,EA4BF;AAC5B,WAAOH,SAAP;;;AAGD,GAhC+B;AAiChCQ,EAAAA,YAjCgC,wBAiCnBL,CAjCmB,EAiCT;AACrB,WAAOH,SAAP;AACyBG,IAAAA,CAAC,CAACM,GAD3B;AAEoBN,IAAAA,CAAC,CAACO,MAFtB;AAGoBP,IAAAA,CAAC,CAACQ,KAHtB;AAIyBR,IAAAA,CAAC,CAACS,KAJ3B;;AAMD,GAxC+B,EAA3B","sourcesContent":["import { keyframes } from './Emotion';\r\nimport { Theme } from './Theme';\r\n\r\nexport const AnimationKeyframes = {\r\n  spinnerCloudOffset(t: Theme) {\r\n    return keyframes`\r\n        0% { stroke-dashoffset: 10; }\r\n        100% { stroke-dashoffset: 116; }\r\n      `;\r\n  },\r\n\r\n  spinnerCloudLength(t: Theme) {\r\n    return keyframes`\r\n        0% { stroke-dasharray: 10, 96; }\r\n        50% { stroke-dasharray: 50, 56; }\r\n        100% { stroke-dasharray: 10, 96;}\r\n      `;\r\n  },\r\n  spinnerCircleOffset(t: Theme) {\r\n    return keyframes`\r\n        0% { stroke-dashoffset: 0; }\r\n        100% { stroke-dashoffset: -231.25%; }\r\n      `;\r\n  },\r\n  spinnerCircleLength(t: Theme) {\r\n    return keyframes`\r\n        0% { stroke-dasharray: 62.5%, 168.75%; }\r\n        50% {  stroke-dasharray: 187.5%, 43.75%; }\r\n        100% { stroke-dasharray: 62.5%, 168.75%; }\r\n      `;\r\n  },\r\n  spinnerCircleRotate(t: Theme) {\r\n    return keyframes`\r\n        100% { transform: rotate(360deg); }\r\n      `;\r\n  },\r\n  spinnerColor(t: Theme) {\r\n    return keyframes`\r\n        100%, 0% { stroke: ${t.red}; }\r\n        40% { stroke: ${t.yellow}; }\r\n        66% { stroke: ${t.green}; }\r\n        80%, 90% { stroke: ${t.brand}; }\r\n      `;\r\n  },\r\n};\r\n"]}
+{"version":3,"sources":["AnimationKeyframes.ts"],"names":["keyframes","AnimationKeyframes","spinnerCloudOffset","t","spinnerCloudLength","spinnerCircleOffset","spinnerCircleLength","spinnerCircleRotate","spinnerColor","red","yellow","green","brand"],"mappings":"8MAAA,SAASA,SAAT,QAA0B,WAA1B;;;AAGA,OAAO,IAAMC,kBAAkB,GAAG;AAChCC,EAAAA,kBADgC,8BACbC,CADa,EACH;AAC3B,WAAOH,SAAP;;;;AAID,GAN+B;;AAQhCI,EAAAA,kBARgC,8BAQbD,CARa,EAQH;AAC3B,WAAOH,SAAP;;;;;AAKD,GAd+B;AAehCK,EAAAA,mBAfgC,+BAeZF,CAfY,EAeF;AAC5B,WAAOH,SAAP;;;;AAID,GApB+B;AAqBhCM,EAAAA,mBArBgC,+BAqBZH,CArBY,EAqBF;AAC5B,WAAOH,SAAP;;;;;AAKD,GA3B+B;AA4BhCO,EAAAA,mBA5BgC,+BA4BZJ,CA5BY,EA4BF;AAC5B,WAAOH,SAAP;;;AAGD,GAhC+B;AAiChCQ,EAAAA,YAjCgC,wBAiCnBL,CAjCmB,EAiCT;AACrB,WAAOH,SAAP;AACyBG,IAAAA,CAAC,CAACM,GAD3B;AAEoBN,IAAAA,CAAC,CAACO,MAFtB;AAGoBP,IAAAA,CAAC,CAACQ,KAHtB;AAIyBR,IAAAA,CAAC,CAACS,KAJ3B;;AAMD,GAxC+B,EAA3B","sourcesContent":["import { keyframes } from './Emotion';\nimport { Theme } from './Theme';\n\nexport const AnimationKeyframes = {\n  spinnerCloudOffset(t: Theme) {\n    return keyframes`\n        0% { stroke-dashoffset: 10; }\n        100% { stroke-dashoffset: 116; }\n      `;\n  },\n\n  spinnerCloudLength(t: Theme) {\n    return keyframes`\n        0% { stroke-dasharray: 10, 96; }\n        50% { stroke-dasharray: 50, 56; }\n        100% { stroke-dasharray: 10, 96;}\n      `;\n  },\n  spinnerCircleOffset(t: Theme) {\n    return keyframes`\n        0% { stroke-dashoffset: 231.25%; }\n        100% { stroke-dashoffset: 0%; }\n      `;\n  },\n  spinnerCircleLength(t: Theme) {\n    return keyframes`\n        0% { stroke-dasharray: 62.5%, 168.75%; }\n        50% {  stroke-dasharray: 187.5%, 43.75%; }\n        100% { stroke-dasharray: 62.5%, 168.75%; }\n      `;\n  },\n  spinnerCircleRotate(t: Theme) {\n    return keyframes`\n        100% { transform: rotate(360deg); }\n      `;\n  },\n  spinnerColor(t: Theme) {\n    return keyframes`\n        100%, 0% { stroke: ${t.red}; }\n        40% { stroke: ${t.yellow}; }\n        66% { stroke: ${t.green}; }\n        80%, 90% { stroke: ${t.brand}; }\n      `;\n  },\n};\n"]}

package/lib/theming/AnimationKeyframes/package.json

@@ -1,6 +1,6 @@
 {
-  "main": "..\\..\\..\\cjs\\lib\\theming\\AnimationKeyframes.js",
+  "main": "../../../cjs/lib/theming/AnimationKeyframes.js",
   "module": "AnimationKeyframes",
-  "types": "..\\AnimationKeyframes.d.ts",
+  "types": "../AnimationKeyframes.d.ts",
   "sideEffects": false
 }

package/lib/theming/AnimationKeyframes.d.ts

@@ -1,8 +1,9 @@
+import { Theme } from './Theme';
 export declare const AnimationKeyframes: {
-    spinnerCloudOffset(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../../internal/themes/FlatTheme").FlatTheme>): string;
-    spinnerCloudLength(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../../internal/themes/FlatTheme").FlatTheme>): string;
-    spinnerCircleOffset(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../../internal/themes/FlatTheme").FlatTheme>): string;
-    spinnerCircleLength(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../../internal/themes/FlatTheme").FlatTheme>): string;
-    spinnerCircleRotate(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../../internal/themes/FlatTheme").FlatTheme>): string;
-    spinnerColor(t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../../internal/themes/FlatTheme").FlatTheme>): string;
+    spinnerCloudOffset(t: Theme): string;
+    spinnerCloudLength(t: Theme): string;
+    spinnerCircleOffset(t: Theme): string;
+    spinnerCircleLength(t: Theme): string;
+    spinnerCircleRotate(t: Theme): string;
+    spinnerColor(t: Theme): string;
 };

package/lib/theming/Emotion/Emotion.js

@@ -1,11 +1,13 @@
-import createEmotion from 'create-emotion';
+import _extends from "@babel/runtime/helpers/esm/extends";
+import createEmotion from '@emotion/css/create-instance';
 import extraScopePlugin from 'stylis-plugin-extra-scope';
-import { Upgrade } from "..\\..\\Upgrades";
-var PREFIX = 'react-ui';
-var scope = new Array(Upgrade.getSpecificityLevel()).fill("." + PREFIX).join('');
+import { Upgrade } from "../../Upgrades";
+var REACT_UI_PREFIX = Upgrade.getSpecificityClassName();
+var scope = new Array(Upgrade.getSpecificityLevel()).fill("." + REACT_UI_PREFIX).join('');
 
 var _createEmotion = createEmotion({
-  key: PREFIX,
+  key: REACT_UI_PREFIX,
+  prepend: true,
   stylisPlugins: scope ? [extraScopePlugin(scope)] : undefined
 }),
     flush = _createEmotion.flush,
@@ -20,12 +22,9 @@ var _createEmotion = createEmotion({
     cache = _createEmotion.cache;
 
 export { flush, hydrate, cx, merge, getRegisteredStyles, injectGlobal, keyframes, css, sheet, cache };
-export var cssName = function cssName(className) {
-  return "." + className;
-};
 
 function isZeroArgs(fn) {
-  return fn.length == 0;
+  return fn.length === 0;
 }
 
 var memoize = function memoize(fn) {
@@ -44,7 +43,10 @@ var memoize = function memoize(fn) {
 
   var cache = new WeakMap();
   return function (arg) {
-    if (!cache.has(arg)) cache.set(arg, fn(arg));
+    if (!cache.has(arg)) {
+      cache.set(arg, fn(arg));
+    }
+
     return cache.get(arg);
   };
 };
@@ -54,4 +56,17 @@ export var memoizeStyle = function memoizeStyle(styles) {
     return styles[className] = memoize(styles[className]);
   });
   return styles;
+};
+export var prefix = function prefix(component, app) {
+  if (app === void 0) {
+    app = REACT_UI_PREFIX;
+  }
+
+  return function (classes) {
+    return Object.keys(classes).reduce(function (acc, key) {
+      var _extends2;
+
+      return _extends({}, acc, (_extends2 = {}, _extends2[key] = app + "-" + component + "-" + classes[key], _extends2));
+    }, {});
+  };
 };

package/lib/theming/Emotion/Emotion.js.map

@@ -1 +1 @@
-{"version":3,"sources":["Emotion.ts"],"names":["createEmotion","extraScopePlugin","Upgrade","PREFIX","scope","Array","getSpecificityLevel","fill","join","key","stylisPlugins","undefined","flush","hydrate","cx","merge","getRegisteredStyles","injectGlobal","keyframes","css","sheet","cache","cssName","className","isZeroArgs","fn","length","memoize","isCalled","result","WeakMap","arg","has","set","get","memoizeStyle","styles","Object","keys","forEach"],"mappings":"AAAA,OAAOA,aAAP,MAA0B,gBAA1B;AACA,OAAOC,gBAAP,MAA6B,2BAA7B;;AAEA,SAASC,OAAT,QAAwB,aAAxB;;;;AAIA,IAAMC,MAAM,GAAG,UAAf;;AAEA,IAAMC,KAAK,GAAG,IAAIC,KAAJ,CAAUH,OAAO,CAACI,mBAAR,EAAV,EAAyCC,IAAzC,OAAkDJ,MAAlD,EAA4DK,IAA5D,CAAiE,EAAjE,CAAd,C;;;;;;;;;;;;;AAaIR,aAAa,CAAC;AAChBS,EAAAA,GAAG,EAAEN,MADW;AAEhBO,EAAAA,aAAa,EAAEN,KAAK,GAAG,CAACH,gBAAgB,CAACG,KAAD,CAAjB,CAAH,GAA+BO,SAFnC,EAAD,C,CAVfC,K,kBAAAA,K,CACAC,O,kBAAAA,O,CACAC,E,kBAAAA,E,CACAC,K,kBAAAA,K,CACAC,mB,kBAAAA,mB,CACAC,Y,kBAAAA,Y,CACAC,S,kBAAAA,S,CACAC,G,kBAAAA,G,CACAC,K,kBAAAA,K,CACAC,K,kBAAAA,K;;;AAMF,OAAO,IAAMC,OAAO,GAAG,SAAVA,OAAU,CAACC,SAAD,gBAAmCA,SAAnC,EAAhB;;AAEP,SAASC,UAAT,CAAwDC,EAAxD,EAAyF;AACvF,SAAOA,EAAE,CAACC,MAAH,IAAa,CAApB;AACD;;AAED,IAAMC,OAAO,GAAG,SAAVA,OAAU,CAAsBF,EAAtB,EAAuF;AACrG,MAAID,UAAU,CAACC,EAAD,CAAd,EAAoB;AAClB,QAAIG,QAAQ,GAAG,KAAf;AACA,QAAIC,MAAJ;AACA,WAAO,YAAM;AACX,UAAI,CAACD,QAAL,EAAe;AACbA,QAAAA,QAAQ,GAAG,IAAX;AACAC,QAAAA,MAAM,GAAGJ,EAAE,EAAX;AACD;AACD,aAAOI,MAAP;AACD,KAND;AAOD;;AAED,MAAMR,KAAK,GAAG,IAAIS,OAAJ,EAAd;AACA,SAAO,UAACC,GAAD,EAAY;AACjB,QAAI,CAACV,KAAK,CAACW,GAAN,CAAUD,GAAV,CAAL,EAAqBV,KAAK,CAACY,GAAN,CAAUF,GAAV,EAAeN,EAAE,CAACM,GAAD,CAAjB;AACrB,WAAOV,KAAK,CAACa,GAAN,CAAUH,GAAV,CAAP;AACD,GAHD;AAID,CAlBD;;AAoBA,OAAO,IAAMI,YAAY,GAAG,SAAfA,YAAe;AAC1BC,MAD0B;AAEpB;AACNC,EAAAA,MAAM,CAACC,IAAP,CAAYF,MAAZ,EAAoBG,OAApB,CAA4B,UAAAhB,SAAS,UAAKa,MAAM,CAACb,SAAD,CAAN,GAA+BI,OAAO,CAACS,MAAM,CAACb,SAAD,CAAP,CAA3C,EAArC;AACA,SAAOa,MAAP;AACD,CALM","sourcesContent":["import createEmotion from 'create-emotion';\r\nimport extraScopePlugin from 'stylis-plugin-extra-scope';\r\n\r\nimport { Upgrade } from '../Upgrades';\r\n\r\nimport { Theme } from './Theme';\r\n\r\nconst PREFIX = 'react-ui';\r\n\r\nconst scope = new Array(Upgrade.getSpecificityLevel()).fill(`.${PREFIX}`).join('');\r\n\r\nexport const {\r\n  flush,\r\n  hydrate,\r\n  cx,\r\n  merge,\r\n  getRegisteredStyles,\r\n  injectGlobal,\r\n  keyframes,\r\n  css,\r\n  sheet,\r\n  cache,\r\n} = createEmotion({\r\n  key: PREFIX,\r\n  stylisPlugins: scope ? [extraScopePlugin(scope)] : undefined,\r\n});\r\n\r\nexport const cssName = (className: string): string => `.${className}`;\r\n\r\nfunction isZeroArgs<R, T extends (...args: any[]) => R>(fn: T | Function): fn is () => R {\r\n  return fn.length == 0;\r\n}\r\n\r\nconst memoize = <A extends object, R>(fn: (() => R) | ((arg: A) => R)): (() => R) | ((arg: A) => R) => {\r\n  if (isZeroArgs(fn)) {\r\n    let isCalled = false;\r\n    let result: R;\r\n    return () => {\r\n      if (!isCalled) {\r\n        isCalled = true;\r\n        result = fn();\r\n      }\r\n      return result;\r\n    };\r\n  }\r\n\r\n  const cache = new WeakMap();\r\n  return (arg: A) => {\r\n    if (!cache.has(arg)) cache.set(arg, fn(arg));\r\n    return cache.get(arg);\r\n  };\r\n};\r\n\r\nexport const memoizeStyle = <S extends { [className: string]: (() => string) | ((t: Theme) => string) }>(\r\n  styles: S,\r\n): S => {\r\n  Object.keys(styles).forEach(className => (styles[className as keyof S] = memoize(styles[className]) as S[keyof S]));\r\n  return styles;\r\n};\r\n"]}
+{"version":3,"sources":["Emotion.ts"],"names":["createEmotion","extraScopePlugin","Upgrade","REACT_UI_PREFIX","getSpecificityClassName","scope","Array","getSpecificityLevel","fill","join","key","prepend","stylisPlugins","undefined","flush","hydrate","cx","merge","getRegisteredStyles","injectGlobal","keyframes","css","sheet","cache","isZeroArgs","fn","length","memoize","isCalled","result","WeakMap","arg","has","set","get","memoizeStyle","styles","Object","keys","forEach","className","prefix","component","app","classes","reduce","acc"],"mappings":"0DAAA,OAAOA,aAAP,MAA0B,8BAA1B;AACA,OAAOC,gBAAP,MAA6B,2BAA7B;;AAEA,SAASC,OAAT,QAAwB,aAAxB;;;;AAIA,IAAMC,eAAe,GAAGD,OAAO,CAACE,uBAAR,EAAxB;;AAEA,IAAMC,KAAK,GAAG,IAAIC,KAAJ,CAAUJ,OAAO,CAACK,mBAAR,EAAV,EAAyCC,IAAzC,OAAkDL,eAAlD,EAAqEM,IAArE,CAA0E,EAA1E,CAAd;;AAEO;AACLT,aAAa,CAAC;AACZU,EAAAA,GAAG,EAAEP,eADO;AAEZQ,EAAAA,OAAO,EAAE,IAFG;AAGZC,EAAAA,aAAa,EAAEP,KAAK,GAAG,CAACJ,gBAAgB,CAACI,KAAD,CAAjB,CAAH,GAA+BQ,SAHvC,EAAD,CADR,CAAQC,KAAR,kBAAQA,KAAR,CAAeC,OAAf,kBAAeA,OAAf,CAAwBC,EAAxB,kBAAwBA,EAAxB,CAA4BC,KAA5B,kBAA4BA,KAA5B,CAAmCC,mBAAnC,kBAAmCA,mBAAnC,CAAwDC,YAAxD,kBAAwDA,YAAxD,CAAsEC,SAAtE,kBAAsEA,SAAtE,CAAiFC,GAAjF,kBAAiFA,GAAjF,CAAsFC,KAAtF,kBAAsFA,KAAtF,CAA6FC,KAA7F,kBAA6FA,KAA7F,C;;;AAOP,SAASC,UAAT,CAAwDC,EAAxD,EAAyF;AACvF,SAAOA,EAAE,CAACC,MAAH,KAAc,CAArB;AACD;;AAED,IAAMC,OAAO,GAAG,SAAVA,OAAU,CAAsBF,EAAtB,EAAuF;AACrG,MAAID,UAAU,CAACC,EAAD,CAAd,EAAoB;AAClB,QAAIG,QAAQ,GAAG,KAAf;AACA,QAAIC,MAAJ;AACA,WAAO,YAAM;AACX,UAAI,CAACD,QAAL,EAAe;AACbA,QAAAA,QAAQ,GAAG,IAAX;AACAC,QAAAA,MAAM,GAAGJ,EAAE,EAAX;AACD;AACD,aAAOI,MAAP;AACD,KAND;AAOD;;AAED,MAAMN,KAAK,GAAG,IAAIO,OAAJ,EAAd;AACA,SAAO,UAACC,GAAD,EAAY;AACjB,QAAI,CAACR,KAAK,CAACS,GAAN,CAAUD,GAAV,CAAL,EAAqB;AACnBR,MAAAA,KAAK,CAACU,GAAN,CAAUF,GAAV,EAAeN,EAAE,CAACM,GAAD,CAAjB;AACD;;AAED,WAAOR,KAAK,CAACW,GAAN,CAAUH,GAAV,CAAP;AACD,GAND;AAOD,CArBD;;AAuBA,OAAO,IAAMI,YAAY,GAAG,SAAfA,YAAe;AAC1BC,MAD0B;AAEpB;AACNC,EAAAA,MAAM,CAACC,IAAP,CAAYF,MAAZ,EAAoBG,OAApB,CAA4B,UAACC,SAAD,UAAgBJ,MAAM,CAACI,SAAD,CAAN,GAA+Bb,OAAO,CAACS,MAAM,CAACI,SAAD,CAAP,CAAtD,EAA5B;AACA,SAAOJ,MAAP;AACD,CALM;;AAOP,OAAO,IAAMK,MAAM;AACjB,SADWA,MACX,CAACC,SAAD,EAAoBC,GAApB,OAAoBA,GAApB,cAAoBA,GAApB,GAA0BxC,eAA1B;AACA,cAAmCyC,OAAnC;AACEP,QAAAA,MAAM,CAACC,IAAP,CAAYM,OAAZ,EAAqBC,MAArB,CAA4B,UAACC,GAAD,EAAMpC,GAAN,EAAc;AACxC,8BAAYoC,GAAZ,6BAAkBpC,GAAlB,IAA2BiC,GAA3B,SAAkCD,SAAlC,SAA+CE,OAAO,CAAClC,GAAD,CAAtD;AACD,SAFD,EAEG,EAFH,CADF,GADA,GADK","sourcesContent":["import createEmotion from '@emotion/css/create-instance';\nimport extraScopePlugin from 'stylis-plugin-extra-scope';\n\nimport { Upgrade } from '../Upgrades';\n\nimport { Theme } from './Theme';\n\nconst REACT_UI_PREFIX = Upgrade.getSpecificityClassName();\n\nconst scope = new Array(Upgrade.getSpecificityLevel()).fill(`.${REACT_UI_PREFIX}`).join('');\n\nexport const { flush, hydrate, cx, merge, getRegisteredStyles, injectGlobal, keyframes, css, sheet, cache } =\n  createEmotion({\n    key: REACT_UI_PREFIX,\n    prepend: true,\n    stylisPlugins: scope ? [extraScopePlugin(scope)] : undefined,\n  });\n\nfunction isZeroArgs<R, T extends (...args: any[]) => R>(fn: T | Function): fn is () => R {\n  return fn.length === 0;\n}\n\nconst memoize = <A extends object, R>(fn: (() => R) | ((arg: A) => R)): (() => R) | ((arg: A) => R) => {\n  if (isZeroArgs(fn)) {\n    let isCalled = false;\n    let result: R;\n    return () => {\n      if (!isCalled) {\n        isCalled = true;\n        result = fn();\n      }\n      return result;\n    };\n  }\n\n  const cache = new WeakMap();\n  return (arg: A) => {\n    if (!cache.has(arg)) {\n      cache.set(arg, fn(arg));\n    }\n\n    return cache.get(arg);\n  };\n};\n\nexport const memoizeStyle = <S extends { [className: string]: (() => string) | ((t: Theme) => string) }>(\n  styles: S,\n): S => {\n  Object.keys(styles).forEach((className) => (styles[className as keyof S] = memoize(styles[className]) as S[keyof S]));\n  return styles;\n};\n\nexport const prefix =\n  (component: string, app = REACT_UI_PREFIX) =>\n  <T extends Record<string, string>>(classes: T): T =>\n    Object.keys(classes).reduce((acc, key) => {\n      return { ...acc, [key]: `${app}-${component}-${classes[key]}` };\n    }, {} as T);\n"]}

package/lib/theming/Emotion/package.json

@@ -1,6 +1,6 @@
 {
-  "main": "..\\..\\..\\cjs\\lib\\theming\\Emotion.js",
+  "main": "../../../cjs/lib/theming/Emotion.js",
   "module": "Emotion",
-  "types": "..\\Emotion.d.ts",
+  "types": "../Emotion.d.ts",
   "sideEffects": false
 }

package/lib/theming/Emotion.d.ts

@@ -1,14 +1,15 @@
-export declare const flush: () => void, hydrate: (ids: string[]) => void, cx: (...classNames: import("create-emotion").ClassNamesArg[]) => string, merge: (className: string) => string, getRegisteredStyles: (registeredStyles: string[], className: string) => string, injectGlobal: {
-    (template: TemplateStringsArray, ...args: import("create-emotion").Interpolation<undefined>[]): void;
-    (...args: import("create-emotion").Interpolation<undefined>[]): void;
+import { Theme } from './Theme';
+export declare const flush: () => void, hydrate: (ids: string[]) => void, cx: (...classNames: import("@emotion/css/create-instance").ClassNamesArg[]) => string, merge: (className: string) => string, getRegisteredStyles: (registeredStyles: string[], className: string) => string, injectGlobal: {
+    (template: TemplateStringsArray, ...args: import("@emotion/css/create-instance").CSSInterpolation[]): void;
+    (...args: import("@emotion/css/create-instance").CSSInterpolation[]): void;
 }, keyframes: {
-    (template: TemplateStringsArray, ...args: import("create-emotion").Interpolation<undefined>[]): string;
-    (...args: import("create-emotion").Interpolation<undefined>[]): string;
+    (template: TemplateStringsArray, ...args: import("@emotion/css/create-instance").CSSInterpolation[]): string;
+    (...args: import("@emotion/css/create-instance").CSSInterpolation[]): string;
 }, css: {
-    (template: TemplateStringsArray, ...args: import("create-emotion").Interpolation<undefined>[]): string;
-    (...args: import("create-emotion").Interpolation<undefined>[]): string;
-}, sheet: import("create-emotion").StyleSheet, cache: import("create-emotion").EmotionCache;
-export declare const cssName: (className: string) => string;
+    (template: TemplateStringsArray, ...args: import("@emotion/css/create-instance").CSSInterpolation[]): string;
+    (...args: import("@emotion/css/create-instance").CSSInterpolation[]): string;
+}, sheet: import("@emotion/css/create-instance").CSSStyleSheet, cache: import("@emotion/css/create-instance").EmotionCache;
 export declare const memoizeStyle: <S extends {
-    [className: string]: (() => string) | ((t: Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme> | Readonly<typeof import("../../internal/themes/FlatTheme").FlatTheme>) => string);
+    [className: string]: (() => string) | ((t: Theme) => string);
 }>(styles: S) => S;
+export declare const prefix: (component: string, app?: string) => <T extends Record<string, string>>(classes: T) => T;

package/lib/theming/Theme/Theme.js

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

package/lib/theming/Theme/package.json

@@ -1,6 +1,6 @@
 {
-  "main": "..\\..\\..\\cjs\\lib\\theming\\Theme.js",
+  "main": "../../../cjs/lib/theming/Theme.js",
   "module": "Theme",
-  "types": "..\\Theme.d.ts",
+  "types": "../Theme.d.ts",
   "sideEffects": false
 }

package/lib/theming/Theme.d.ts

@@ -1,4 +1,3 @@
 import { DefaultThemeInternal } from '../../internal/themes/DefaultTheme';
-import { FlatThemeInternal } from '../../internal/themes/FlatTheme';
-export declare type Theme = Readonly<typeof DefaultThemeInternal | typeof FlatThemeInternal>;
+export declare type Theme = Readonly<typeof DefaultThemeInternal>;
 export declare type ThemeIn = Partial<typeof DefaultThemeInternal>;

package/lib/theming/ThemeContext/ThemeContext.js

@@ -1,3 +1,4 @@
 import React from 'react';
-import { DEFAULT_THEME } from "..\\themes\\DefaultTheme";
-export var ThemeContext = React.createContext(DEFAULT_THEME);
+import { DEFAULT_THEME } from "../themes/DefaultTheme";
+export var ThemeContext = /*#__PURE__*/React.createContext(DEFAULT_THEME);
+ThemeContext.displayName = 'ThemeContext';

package/lib/theming/ThemeContext/ThemeContext.js.map

@@ -1 +1 @@
-{"version":3,"sources":["ThemeContext.ts"],"names":["React","DEFAULT_THEME","ThemeContext","createContext"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,aAAT,QAA8B,uBAA9B;;AAEA,OAAO,IAAMC,YAAY,GAAGF,KAAK,CAACG,aAAN,CAAoBF,aAApB,CAArB","sourcesContent":["import React from 'react';\r\n\r\nimport { DEFAULT_THEME } from './themes/DefaultTheme';\r\n\r\nexport const ThemeContext = React.createContext(DEFAULT_THEME);\r\n"]}
+{"version":3,"sources":["ThemeContext.ts"],"names":["React","DEFAULT_THEME","ThemeContext","createContext","displayName"],"mappings":"AAAA,OAAOA,KAAP,MAAkB,OAAlB;;AAEA,SAASC,aAAT,QAA8B,uBAA9B;;AAEA,OAAO,IAAMC,YAAY,gBAAGF,KAAK,CAACG,aAAN,CAAoBF,aAApB,CAArB;;AAEPC,YAAY,CAACE,WAAb,GAA2B,cAA3B","sourcesContent":["import React from 'react';\n\nimport { DEFAULT_THEME } from './themes/DefaultTheme';\n\nexport const ThemeContext = React.createContext(DEFAULT_THEME);\n\nThemeContext.displayName = 'ThemeContext';\n"]}

package/lib/theming/ThemeContext/package.json

@@ -1,6 +1,6 @@
 {
-  "main": "..\\..\\..\\cjs\\lib\\theming\\ThemeContext.js",
+  "main": "../../../cjs/lib/theming/ThemeContext.js",
   "module": "ThemeContext",
-  "types": "..\\ThemeContext.d.ts",
+  "types": "../ThemeContext.d.ts",
   "sideEffects": false
 }

package/lib/theming/ThemeContext.d.ts

@@ -1,2 +1,2 @@
 import React from 'react';
-export declare const ThemeContext: React.Context<Readonly<Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>> | Readonly<Readonly<typeof import("../../internal/themes/FlatTheme").FlatTheme>>>;
+export declare const ThemeContext: React.Context<Readonly<Readonly<typeof import("../../internal/themes/DefaultTheme").DefaultTheme>>>;