@skbkontur/react-ui 0.0.0-e66a3400ba → 0.0.0-ea6161656e

package/components/Spinner/Spinner.md

@@ -0,0 +1,35 @@
+```jsx harmony
+import { Gapped, Spinner } from '@skbkontur/react-ui';
+
+const reactNodeCaption = (
+  <div>
+    <Spinner type="mini" caption={null} /> <span style={{ color: 'tomato', fontSize: '1.3em' }}>З</span>
+    агрузка
+  </div>
+);
+
+<Gapped>
+  <Spinner type="big" caption="big" />
+  <Spinner type="normal" caption="normal" />
+  <Spinner type="mini" caption="mini" />
+  <Spinner type="mini" dimmed caption="mini dimmed" />
+  <Spinner type="big" caption={reactNodeCaption} />
+  <Spinner type="big" caption="custom" width={8} color={'#538A1B'}/>
+</Gapped>;
+```
+
+#### Локали по умолчанию
+
+```typescript static
+interface SpinnerLocale {
+  loading?: React.ReactNode;
+}
+
+const ru_RU = {
+  loading: 'Загрузка',
+};
+
+const en_GB = {
+  loading: 'Loading',
+};
+```

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

@@ -0,0 +1,51 @@
+import _taggedTemplateLiteralLoose from "@babel/runtime/helpers/esm/taggedTemplateLiteralLoose";
+
+var _templateObject, _templateObject2, _templateObject3, _templateObject4, _templateObject5, _templateObject6, _templateObject7, _templateObject8, _templateObject9, _templateObject10, _templateObject11, _templateObject12, _templateObject13;
+
+import { memoizeStyle } from "../../../lib/theming/Emotion";
+import { getAnimationKeyframes } from "../../../lib/theming/AnimationKeyframes";
+import { isIE11 } from "../../../lib/client";
+export var getStyles = function getStyles(emotion) {
+  var AnimationKeyframes = getAnimationKeyframes(emotion);
+  return memoizeStyle({
+    circle: function circle(t) {
+      return emotion.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 emotion.css(_templateObject2 || (_templateObject2 = _taggedTemplateLiteralLoose(["\n        stroke: ", ";\n      "])), t.spinnerDimmedColor);
+    },
+    circleWithoutColorAnimation: function circleWithoutColorAnimation() {
+      return emotion.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 emotion.css(_templateObject4 || (_templateObject4 = _taggedTemplateLiteralLoose(["\n        color: ", ";\n      "])), t.spinnerCaptionColor);
+    },
+    inline: function inline() {
+      return emotion.css(_templateObject5 || (_templateObject5 = _taggedTemplateLiteralLoose(["\n        font-size: inherit;\n        line-height: inherit;\n      "])));
+    },
+    mini: function mini(t) {
+      return emotion.css(_templateObject6 || (_templateObject6 = _taggedTemplateLiteralLoose(["\n        margin-left: ", ";\n        font-size: ", ";\n        line-height: ", ";\n      "])), t.spinnerCaptionGapSmall, t.spinnerFontSizeSmall, t.spinnerLineHeightSmall);
+    },
+    small: function small(t) {
+      return emotion.css(_templateObject7 || (_templateObject7 = _taggedTemplateLiteralLoose(["\n        margin: ", ";\n        font-size: ", ";\n        line-height: ", ";\n      "])), t.spinnerCaptionMarginSmall, t.spinnerFontSizeSmall, t.spinnerLineHeightSmall);
+    },
+    normal: function normal(t) {
+      return emotion.css(_templateObject8 || (_templateObject8 = _taggedTemplateLiteralLoose(["\n        display: block;\n        font-size: ", ";\n        line-height: ", ";\n        margin-top: ", ";\n      "])), t.spinnerFontSizeMedium, t.spinnerLineHeightMedium, t.spinnerCaptionGapMedium);
+    },
+    medium: function medium(t) {
+      return emotion.css(_templateObject9 || (_templateObject9 = _taggedTemplateLiteralLoose(["\n        margin: ", ";\n        font-size: ", ";\n        line-height: ", ";\n      "])), t.spinnerCaptionMarginMedium, t.spinnerFontSizeMedium, t.spinnerLineHeightMedium);
+    },
+    big: function big(t) {
+      return emotion.css(_templateObject10 || (_templateObject10 = _taggedTemplateLiteralLoose(["\n        display: block;\n        font-size: ", ";\n        line-height: ", ";\n        margin-top: ", ";\n      "])), t.spinnerFontSizeLarge, t.spinnerLineHeightLarge, t.spinnerCaptionGapLarge);
+    },
+    large: function large(t) {
+      return emotion.css(_templateObject11 || (_templateObject11 = _taggedTemplateLiteralLoose(["\n        font-size: ", ";\n        line-height: ", ";\n        margin: ", ";\n      "])), t.spinnerFontSizeLarge, t.spinnerLineHeightLarge, t.spinnerCaptionMarginLarge);
+    },
+    spinner: function spinner() {
+      return emotion.css(_templateObject12 || (_templateObject12 = _taggedTemplateLiteralLoose(["\n        display: inline-block;\n        text-align: center;\n        line-height: normal;\n      "])));
+    },
+    inner: function inner() {
+      return emotion.css(_templateObject13 || (_templateObject13 = _taggedTemplateLiteralLoose(["\n        display: inline-block;\n      "])));
+    }
+  });
+};

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

@@ -0,0 +1 @@
+{"version":3,"sources":["Spinner.styles.ts"],"names":["memoizeStyle","getAnimationKeyframes","isIE11","getStyles","emotion","AnimationKeyframes","circle","t","css","spinnerColor","spinnerCircleOffset","spinnerCircleLength","spinnerCircleRotate","circleDimmedColor","spinnerDimmedColor","circleWithoutColorAnimation","captionColor","spinnerCaptionColor","inline","mini","spinnerCaptionGapSmall","spinnerFontSizeSmall","spinnerLineHeightSmall","small","spinnerCaptionMarginSmall","normal","spinnerFontSizeMedium","spinnerLineHeightMedium","spinnerCaptionGapMedium","medium","spinnerCaptionMarginMedium","big","spinnerFontSizeLarge","spinnerLineHeightLarge","spinnerCaptionGapLarge","large","spinnerCaptionMarginLarge","spinner","inner"],"mappings":"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","sourcesContent":["import type { Emotion } from '@emotion/css/create-instance';\n\nimport { memoizeStyle } from '../../lib/theming/Emotion';\nimport { Theme } from '../../lib/theming/Theme';\nimport { getAnimationKeyframes } from '../../lib/theming/AnimationKeyframes';\nimport { isIE11 } from '../../lib/client';\n\nexport const getStyles = (emotion: Emotion) => {\n  const AnimationKeyframes = getAnimationKeyframes(emotion);\n  return memoizeStyle({\n    circle(t: Theme) {\n      return emotion.css`\n        stroke: ${t.spinnerColor};\n\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    },\n    circleDimmedColor(t: Theme) {\n      return emotion.css`\n        stroke: ${t.spinnerDimmedColor};\n      `;\n    },\n    circleWithoutColorAnimation() {\n      return emotion.css`\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        `\n        }\n      `;\n    },\n\n    captionColor(t: Theme) {\n      return emotion.css`\n        color: ${t.spinnerCaptionColor};\n      `;\n    },\n\n    inline() {\n      return emotion.css`\n        font-size: inherit;\n        line-height: inherit;\n      `;\n    },\n\n    mini(t: Theme) {\n      return emotion.css`\n        margin-left: ${t.spinnerCaptionGapSmall};\n        font-size: ${t.spinnerFontSizeSmall};\n        line-height: ${t.spinnerLineHeightSmall};\n      `;\n    },\n\n    small(t: Theme) {\n      return emotion.css`\n        margin: ${t.spinnerCaptionMarginSmall};\n        font-size: ${t.spinnerFontSizeSmall};\n        line-height: ${t.spinnerLineHeightSmall};\n      `;\n    },\n\n    normal(t: Theme) {\n      return emotion.css`\n        display: block;\n        font-size: ${t.spinnerFontSizeMedium};\n        line-height: ${t.spinnerLineHeightMedium};\n        margin-top: ${t.spinnerCaptionGapMedium};\n      `;\n    },\n\n    medium(t: Theme) {\n      return emotion.css`\n        margin: ${t.spinnerCaptionMarginMedium};\n        font-size: ${t.spinnerFontSizeMedium};\n        line-height: ${t.spinnerLineHeightMedium};\n      `;\n    },\n\n    big(t: Theme) {\n      return emotion.css`\n        display: block;\n        font-size: ${t.spinnerFontSizeLarge};\n        line-height: ${t.spinnerLineHeightLarge};\n        margin-top: ${t.spinnerCaptionGapLarge};\n      `;\n    },\n\n    large(t: Theme) {\n      return emotion.css`\n        font-size: ${t.spinnerFontSizeLarge};\n        line-height: ${t.spinnerLineHeightLarge};\n        margin: ${t.spinnerCaptionMarginLarge};\n      `;\n    },\n\n    spinner() {\n      return emotion.css`\n        display: inline-block;\n        text-align: center;\n        line-height: normal;\n      `;\n    },\n\n    inner() {\n      return emotion.css`\n        display: inline-block;\n      `;\n    },\n  });\n};\n"]}

package/components/Spinner/Spinner.styles/package.json

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

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

@@ -0,0 +1,17 @@
+import type { Emotion } from '@emotion/css/create-instance';
+import { Theme } from '../../lib/theming/Theme';
+export declare const getStyles: (emotion: Emotion) => {
+    circle(t: Theme): string;
+    circleDimmedColor(t: Theme): string;
+    circleWithoutColorAnimation(): string;
+    captionColor(t: Theme): string;
+    inline(): string;
+    mini(t: Theme): string;
+    small(t: Theme): string;
+    normal(t: Theme): string;
+    medium(t: Theme): string;
+    big(t: Theme): string;
+    large(t: Theme): string;
+    spinner(): string;
+    inner(): string;
+};

package/components/Spinner/SpinnerFallbackAnimation/SpinnerFallbackAnimation.js

@@ -0,0 +1,176 @@
+/* eslint-disable no-useless-constructor */
+import { globalObject } from '@skbkontur/global-object';
+import { ColorFactory } from "../../../lib/styles/ColorFactory";
+export var SpinnerFallbackAnimationRunner = function SpinnerFallbackAnimationRunner(animations, FPS) {
+  var _this = this;
+
+  this.interval = null;
+
+  this.start = function () {
+    _this.animations.forEach(function (animation) {
+      return animation.start();
+    });
+
+    _this.interval = rafInterval(function () {
+      _this.animations.forEach(function (animation) {
+        return animation.step();
+      });
+    }, _this.FPS);
+  };
+
+  this.stop = function () {
+    if (_this.interval) {
+      _this.interval.clear();
+
+      _this.animations.forEach(function (animation) {
+        return animation.finish();
+      });
+    }
+  };
+
+  this.animations = animations;
+  this.FPS = FPS;
+  this.start();
+};
+
+var rafInterval = function rafInterval(fn, delay) {
+  var lastcall = 0;
+  var cleared = false;
+  var rafId = 0;
+
+  var interval = function interval() {
+    if (cleared) {
+      return;
+    }
+
+    var timestamp = new Date().getTime();
+
+    if (!lastcall) {
+      lastcall = timestamp;
+    }
+
+    if (timestamp - lastcall > delay) {
+      fn();
+      lastcall = timestamp;
+    }
+
+    if (globalObject.requestAnimationFrame) {
+      rafId = globalObject.requestAnimationFrame(interval);
+    }
+  };
+
+  interval();
+  return {
+    clear: function clear() {
+      cleared = true;
+      globalObject.cancelAnimationFrame == null ? void 0 : globalObject.cancelAnimationFrame(rafId);
+    }
+  };
+};
+
+var Animation = function Animation(duration, onProgress, onFinish) {
+  var _this2 = this;
+
+  this.startTime = 0;
+  this.isFinished = false;
+
+  this.step = function () {
+    if (_this2.isFinished) {
+      return;
+    }
+
+    var timestamp = new Date().getTime();
+
+    if (!_this2.startTime) {
+      _this2.startTime = timestamp;
+    }
+
+    var progress = (timestamp - _this2.startTime) / _this2.duration;
+
+    _this2.onProgress(progress);
+
+    if (progress >= 1) {
+      _this2.finish();
+    }
+  };
+
+  this.reset = function () {
+    _this2.startTime = 0;
+    _this2.isFinished = false;
+  };
+
+  this.finish = function () {
+    _this2.isFinished = true;
+    _this2.onFinish && _this2.onFinish(_this2);
+  };
+
+  this.start = function () {
+    if (!_this2.isFinished) {
+      _this2.step();
+    }
+  };
+
+  this.duration = duration;
+  this.onProgress = onProgress;
+  this.onFinish = onFinish;
+};
+
+export var createOffsetAnimation = function createOffsetAnimation(from, to, duration, setStyleProperty, units) {
+  if (units === void 0) {
+    units = '';
+  }
+
+  return new Animation(duration, function (progress) {
+    var current = from + (to - from) * progress;
+    setStyleProperty('stroke-dashoffset', "" + current + units);
+  }, function (animation) {
+    animation.reset();
+  });
+};
+export var createLengthAnimation = function createLengthAnimation(from, to, duration, setStyleProperty, units) {
+  if (units === void 0) {
+    units = '';
+  }
+
+  var reverse = false;
+  return new Animation(duration, function (progress) {
+    var p = reverse ? 1 - progress : progress;
+    var current = [from[0] + (to[0] - from[0]) * p, from[1] + (to[1] - from[1]) * p];
+    setStyleProperty('stroke-dasharray', "" + current[0] + units + " " + current[1] + units);
+  }, function (animation) {
+    reverse = !reverse;
+    animation.reset();
+  });
+};
+export var createColorAnimation = function createColorAnimation(colors, duration, setStyleProperty) {
+  var rgbColors = colors.map(function (color) {
+    return ColorFactory.create(color).rgb;
+  });
+  var currentIndex = 0;
+  var nextIndex = 1;
+  return new Animation(duration, function (progress) {
+    var from = rgbColors[currentIndex];
+    var to = rgbColors[nextIndex];
+
+    if (from && to) {
+      var current = [Math.round(from[0] + (to[0] - from[0]) * progress), Math.round(from[1] + (to[1] - from[1]) * progress), Math.round(from[2] + (to[2] - from[2]) * progress)];
+      setStyleProperty('stroke', "rgb(" + current + ")");
+    }
+  }, function (animation) {
+    animation.reset();
+    currentIndex = nextIndex;
+    nextIndex = (nextIndex + 1) % colors.length;
+  });
+};
+export var createRotationAnimation = function createRotationAnimation(from, to, duration, setStyleProperty, units) {
+  if (units === void 0) {
+    units = 'deg';
+  }
+
+  return new Animation(duration, function (progress) {
+    var current = Math.round(from + (to - from) * progress);
+    setStyleProperty('transform', "rotate(" + current + units + ")");
+  }, function (animation) {
+    animation.reset();
+  });
+};

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

@@ -0,0 +1 @@
+{"version":3,"sources":["SpinnerFallbackAnimation.ts"],"names":["globalObject","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 { globalObject } from '@skbkontur/global-object';\n\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    if (globalObject.requestAnimationFrame) {\n      rafId = globalObject.requestAnimationFrame(interval);\n    }\n  };\n  interval();\n\n  return {\n    clear: () => {\n      cleared = true;\n      globalObject.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/package.json

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

package/components/Spinner/SpinnerFallbackAnimation.d.ts

@@ -0,0 +1,25 @@
+export declare class SpinnerFallbackAnimationRunner {
+    private animations;
+    private FPS;
+    private interval;
+    constructor(animations: Animation[], FPS: number);
+    start: () => void;
+    stop: () => void;
+}
+declare class Animation {
+    private duration;
+    private onProgress;
+    private onFinish?;
+    private startTime;
+    private isFinished;
+    constructor(duration: number, onProgress: (progress: number) => void, onFinish?: ((animation: Animation) => void) | undefined);
+    step: () => void;
+    reset: () => void;
+    finish: () => void;
+    start: () => void;
+}
+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

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

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

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

package/components/Spinner/index/package.json

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

package/components/Spinner/index.d.ts

@@ -1 +1 @@
-export { default, SpinnerProps, SpinnerType } from './Spinner';
+export * from './Spinner';

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

@@ -0,0 +1,8 @@
+import { LocaleHelper } from "../../../../lib/locale/LocaleHelper";
+import { componentsLocales as en_GB } from "../locales/en";
+import { componentsLocales as ru_RU } from "../locales/ru";
+export * from "../types";
+export var SpinnerLocaleHelper = new LocaleHelper({
+  ru_RU: ru_RU,
+  en_GB: en_GB
+});

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

@@ -0,0 +1 @@
+{"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/index/package.json

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

package/components/Spinner/locale/index.d.ts

@@ -1,4 +1,4 @@
-import { LocaleHelper } from '../../LocaleProvider/LocaleHelper';
-import { SpinnerLocale } from './types';
-export * from './types';
-export declare const SpinnerLocaleHelper: LocaleHelper<SpinnerLocale>;
+import { LocaleHelper } from '../../../lib/locale/LocaleHelper';
+import { SpinnerLocale } from './types';
+export * from './types';
+export declare const SpinnerLocaleHelper: LocaleHelper<SpinnerLocale>;

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

@@ -0,0 +1,3 @@
+export var componentsLocales = {
+  loading: 'Loading'
+};

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

@@ -0,0 +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';\n\nexport const componentsLocales: SpinnerLocale = {\n  loading: 'Loading',\n};\n"]}

package/components/Spinner/locale/locales/en/package.json

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

package/components/Spinner/locale/locales/en.d.ts

@@ -1,3 +1,2 @@
-import { SpinnerLocale } from '../types';
-declare const componentsLocales: SpinnerLocale;
-export default componentsLocales;
+import { SpinnerLocale } from '../types';
+export declare const componentsLocales: SpinnerLocale;

package/components/Spinner/locale/locales/ru/package.json

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

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

@@ -0,0 +1,3 @@
+export var componentsLocales = {
+  loading: 'Загрузка'
+};

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

@@ -0,0 +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';\n\nexport const componentsLocales: SpinnerLocale = {\n  loading: 'Загрузка',\n};\n"]}

package/components/Spinner/locale/locales/ru.d.ts

@@ -1,3 +1,2 @@
-import { SpinnerLocale } from '../types';
-declare const componentsLocales: SpinnerLocale;
-export default componentsLocales;
+import { SpinnerLocale } from '../types';
+export declare const componentsLocales: SpinnerLocale;

package/components/Spinner/locale/package.json

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

package/components/Spinner/locale/types/package.json

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

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

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

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

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","sourcesContent":[]}

package/components/Spinner/locale/types.d.ts

@@ -1,4 +1,4 @@
-import * as React from 'react';
-export interface SpinnerLocale {
-    loading: React.ReactNode;
-}
+import React from 'react';
+export interface SpinnerLocale {
+    loading: React.ReactNode;
+}

package/components/Spinner/package.json

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