@semcore/animation - npm Package Compare versions

Comparing version 1.10.0 to 1.10.1

CHANGELOG.md

@@ -5,2 +5,8 @@ # Changelog
 
+## [1.10.1] - 2023-04-03
+
+### Fixed
+
+- Nested animation might take initial keyframe from animated parent component in some cases.
+
 ## [1.10.0] - 2023-03-27
@@ -7,0 +13,0 @@

lib/cjs/Animation.js

 "use strict";
 
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,50 +9,28 @@ value: true
 exports["default"] = exports.animationContext = void 0;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _classCallCheck2 = _interopRequireDefault(require("@babel/runtime/helpers/classCallCheck"));
-
 var _createClass2 = _interopRequireDefault(require("@babel/runtime/helpers/createClass"));
-
 var _assertThisInitialized2 = _interopRequireDefault(require("@babel/runtime/helpers/assertThisInitialized"));
-
 var _inherits2 = _interopRequireDefault(require("@babel/runtime/helpers/inherits"));
-
 var _createSuper2 = _interopRequireDefault(require("@babel/runtime/helpers/createSuper"));
-
 var _defineProperty2 = _interopRequireDefault(require("@babel/runtime/helpers/defineProperty"));
-
 var _core = _interopRequireWildcard(require("@semcore/core"));
-
 var _react = _interopRequireDefault(require("react"));
-
 var _flexBox = require("@semcore/flex-box");
-
 var _contextEnhance = _interopRequireDefault(require("@semcore/utils/lib/enhances/contextEnhance"));
-
 /*__reshadow-styles__:"./style/animate.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_core.sstyled.insert(
-/*__inner_css_start__*/
-".___SAnimation_oqoor_gg_{animation-fill-mode:both;animation-timing-function:var(--timingFunction_oqoor);animation-duration:var(--durationFinalize_oqoor);animation-delay:var(--delayFinalize_oqoor);animation-name:var(--keyframesFinalize_oqoor)}.___SAnimation_oqoor_gg_.__visible_oqoor_gg_{animation-duration:var(--durationInitialize_oqoor);animation-delay:var(--delayInitialize_oqoor);animation-name:var(--keyframesInitialize_oqoor)}@media (prefers-reduced-motion){.___SAnimation_oqoor_gg_,.___SAnimation_oqoor_gg_.__visible_oqoor_gg_{animation-timing-function:step-end;animation-iteration-count:1}}"
-/*__inner_css_end__*/
-, "oqoor_gg_")
-/*__reshadow_css_end__*/
-, {
-  "__SAnimation": "___SAnimation_oqoor_gg_",
-  "--timingFunction": "--timingFunction_oqoor",
-  "--durationFinalize": "--durationFinalize_oqoor",
-  "--delayFinalize": "--delayFinalize_oqoor",
-  "--keyframesFinalize": "--keyframesFinalize_oqoor",
-  "_visible": "__visible_oqoor_gg_",
-  "--durationInitialize": "--durationInitialize_oqoor",
-  "--delayInitialize": "--delayInitialize_oqoor",
-  "--keyframesInitialize": "--keyframesInitialize_oqoor"
+var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/".___SAnimation_qssnj_gg_{animation-fill-mode:both;animation-timing-function:var(--timingFunction_qssnj);animation-duration:var(--durationFinalize_qssnj);animation-delay:var(--delayFinalize_qssnj);animation-name:var(--keyframesFinalize_qssnj)}.___SAnimation_qssnj_gg_.__visible_qssnj_gg_{animation-duration:var(--durationInitialize_qssnj);animation-delay:var(--delayInitialize_qssnj);animation-name:var(--keyframesInitialize_qssnj)}@media (prefers-reduced-motion){.___SAnimation_qssnj_gg_,.___SAnimation_qssnj_gg_.__visible_qssnj_gg_{animation-timing-function:step-end;animation-iteration-count:1}}" /*__inner_css_end__*/, "qssnj_gg_") /*__reshadow_css_end__*/, {
+  "__SAnimation": "___SAnimation_qssnj_gg_",
+  "--timingFunction": "--timingFunction_qssnj",
+  "--durationFinalize": "--durationFinalize_qssnj",
+  "--delayFinalize": "--delayFinalize_qssnj",
+  "--keyframesFinalize": "--keyframesFinalize_qssnj",
+  "_visible": "__visible_qssnj_gg_",
+  "--durationInitialize": "--durationInitialize_qssnj",
+  "--delayInitialize": "--delayInitialize_qssnj",
+  "--keyframesInitialize": "--keyframesInitialize_qssnj"
 });
-
 function propToArray(prop) {
   return Array.isArray(prop) ? prop : [prop, prop];
 }
-
 var makeAnimationContextValue = function makeAnimationContextValue() {
@@ -83,21 +59,13 @@ var context = {
 };
-
 var animationContext = /*#__PURE__*/_react["default"].createContext(null);
-
 exports.animationContext = animationContext;
-
 var Animation = /*#__PURE__*/function (_Component) {
   (0, _inherits2["default"])(Animation, _Component);
-
   var _super = (0, _createSuper2["default"])(Animation);
-
   function Animation() {
     var _this;
-
     (0, _classCallCheck2["default"])(this, Animation);
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _super.call.apply(_super, [this].concat(args));
@@ -112,4 +80,4 @@ (0, _defineProperty2["default"])((0, _assertThisInitialized2["default"])(_this), "state", {
       var _this$asProps = _this.asProps,
-          animationsDisabled = _this$asProps.animationsDisabled,
-          parentAnimationContext = _this$asProps.parentAnimationContext;
+        animationsDisabled = _this$asProps.animationsDisabled,
+        parentAnimationContext = _this$asProps.parentAnimationContext;
       var duration = animationsDisabled ? [0, 0] : propToArray(_this.asProps.duration);
@@ -123,3 +91,2 @@ var animationContext = parentAnimationContext !== null && parentAnimationContext !== void 0 ? parentAnimationContext : _this.animationContext;
       event.stopPropagation();
-
       if (!_this.asProps.visible && !_this.props.preserveNode) {
@@ -130,3 +97,2 @@ _this.setState({
       }
-
       var parentAnimationContext = _this.asProps.parentAnimationContext;
@@ -140,3 +106,2 @@ var animationContext = parentAnimationContext !== null && parentAnimationContext !== void 0 ? parentAnimationContext : _this.animationContext;
   }
-
   (0, _createClass2["default"])(Animation, [{
@@ -146,12 +111,11 @@ key: "render",
       var _ref = this.asProps,
-          _ref2;
-
+        _ref2;
       var SAnimation = _flexBox.Box;
       var _this$asProps2 = this.asProps,
-          styles = _this$asProps2.styles,
-          keyframes = _this$asProps2.keyframes,
-          initialAnimation = _this$asProps2.initialAnimation,
-          timingFunction = _this$asProps2.timingFunction,
-          animationsDisabled = _this$asProps2.animationsDisabled,
-          parentAnimationContext = _this$asProps2.parentAnimationContext;
+        styles = _this$asProps2.styles,
+        keyframes = _this$asProps2.keyframes,
+        initialAnimation = _this$asProps2.initialAnimation,
+        timingFunction = _this$asProps2.timingFunction,
+        animationsDisabled = _this$asProps2.animationsDisabled,
+        parentAnimationContext = _this$asProps2.parentAnimationContext;
       var animationContextValue = parentAnimationContext !== null && parentAnimationContext !== void 0 ? parentAnimationContext : this.animationContext;
@@ -161,4 +125,4 @@ var duration = animationsDisabled ? [0, 0] : propToArray(this.asProps.duration);
       var _this$state = this.state,
-          render = _this$state.render,
-          wasInvisible = _this$state.wasInvisible;
+        render = _this$state.render,
+        wasInvisible = _this$state.wasInvisible;
       if (!render) return null;
@@ -175,3 +139,3 @@ return /*#__PURE__*/_react["default"].createElement(animationContext.Provider, {
         "timingFunction": timingFunction,
-        "keyframesInitialize": wasInvisible || initialAnimation ? keyframes[0] : undefined,
+        "keyframesInitialize": wasInvisible || initialAnimation ? keyframes[0] : "totally-no-animations",
         "keyframesFinalize": keyframes[1]
@@ -184,3 +148,2 @@ }, _ref))))));
       var wasInvisible = state.wasInvisible || !props.visible;
-
       if (props.visible || props.preserveNode || state.wasInvisible !== wasInvisible) {
@@ -192,3 +155,2 @@ return {
       }
-
       return state;
@@ -199,3 +161,2 @@ }
 }(_core.Component);
-
 (0, _defineProperty2["default"])(Animation, "displayName", 'Animation');
@@ -213,6 +174,4 @@ (0, _defineProperty2["default"])(Animation, "style", style);
 (0, _defineProperty2["default"])(Animation, "enhance", [(0, _contextEnhance["default"])(animationContext, 'parentAnimationContext')]);
-
 var _default = (0, _core["default"])(Animation);
-
 exports["default"] = _default;
 //# sourceMappingURL=Animation.js.map

lib/cjs/Collapse.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 Object.defineProperty(exports, "__esModule", {
@@ -11,71 +9,51 @@ value: true
 exports["default"] = void 0;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _core = require("@semcore/core");
-
 var _react = _interopRequireWildcard(require("react"));
-
 var _Animation = _interopRequireDefault(require("./Animation"));
-
 var _excluded = ["onAnimationStart", "onAnimationEnd", "overflowHidden"];
-
 /*__reshadow-styles__:"./style/keyframes.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_core.sstyled.insert(
-/*__inner_css_start__*/
-"@keyframes collapse-enter_8srcg{0%{overflow:hidden;height:0}to{height:var(--height_8srcg)}}@keyframes collapse-exit_8srcg{0%{height:var(--height_8srcg)}to{height:0}}@keyframes fade-in-out-enter_8srcg{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_8srcg{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_8srcg{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_8srcg{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_8srcg{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_8srcg{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_8srcg{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_8srcg{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_8srcg{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_8srcg{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_8srcg{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_8srcg{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_8srcg{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_8srcg{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_8srcg{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_8srcg{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_8srcg{0%{transform:var(--transformStart_8srcg)}to{transform:var(--transformEnd_8srcg)}}@keyframes transform-exit_8srcg{0%{transform:var(--transformEnd_8srcg)}to{transform:var(--transformStart_8srcg)}}"
-/*__inner_css_end__*/
-, "8srcg_gg_")
-/*__reshadow_css_end__*/
-, {
-  "@collapse-enter": "collapse-enter_8srcg",
-  "--height": "--height_8srcg",
-  "@collapse-exit": "collapse-exit_8srcg",
-  "@fade-in-out-enter": "fade-in-out-enter_8srcg",
-  "@fade-in-out-exit": "fade-in-out-exit_8srcg",
-  "@opacity-in": "opacity-in_8srcg",
-  "@opacity-out": "opacity-out_8srcg",
-  "@scale-left-in": "scale-left-in_8srcg",
-  "@scale-right-in": "scale-right-in_8srcg",
-  "@scale-top-in": "scale-top-in_8srcg",
-  "@scale-bottom-in": "scale-bottom-in_8srcg",
-  "@scale-left-out": "scale-left-out_8srcg",
-  "@scale-right-out": "scale-right-out_8srcg",
-  "@scale-top-out": "scale-top-out_8srcg",
-  "@scale-bottom-out": "scale-bottom-out_8srcg",
-  "@slide-top-in": "slide-top-in_8srcg",
-  "@slide-top-out": "slide-top-out_8srcg",
-  "@slide-bottom-in": "slide-bottom-in_8srcg",
-  "@slide-bottom-out": "slide-bottom-out_8srcg",
-  "@slide-left-in": "slide-left-in_8srcg",
-  "@slide-left-out": "slide-left-out_8srcg",
-  "@slide-right-in": "slide-right-in_8srcg",
-  "@slide-right-out": "slide-right-out_8srcg",
-  "@transform-enter": "transform-enter_8srcg",
-  "--transformStart": "--transformStart_8srcg",
-  "--transformEnd": "--transformEnd_8srcg",
-  "@transform-exit": "transform-exit_8srcg"
+var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/"@keyframes collapse-enter_111fj{0%{overflow:hidden;height:0}to{height:var(--height_111fj)}}@keyframes collapse-exit_111fj{0%{height:var(--height_111fj)}to{height:0}}@keyframes fade-in-out-enter_111fj{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_111fj{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_111fj{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_111fj{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_111fj{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_111fj{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_111fj{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_111fj{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_111fj{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_111fj{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_111fj{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_111fj{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_111fj{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_111fj{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_111fj{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_111fj{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_111fj{0%{transform:var(--transformStart_111fj)}to{transform:var(--transformEnd_111fj)}}@keyframes transform-exit_111fj{0%{transform:var(--transformEnd_111fj)}to{transform:var(--transformStart_111fj)}}" /*__inner_css_end__*/, "111fj_gg_") /*__reshadow_css_end__*/, {
+  "@collapse-enter": "collapse-enter_111fj",
+  "--height": "--height_111fj",
+  "@collapse-exit": "collapse-exit_111fj",
+  "@fade-in-out-enter": "fade-in-out-enter_111fj",
+  "@fade-in-out-exit": "fade-in-out-exit_111fj",
+  "@opacity-in": "opacity-in_111fj",
+  "@opacity-out": "opacity-out_111fj",
+  "@scale-left-in": "scale-left-in_111fj",
+  "@scale-right-in": "scale-right-in_111fj",
+  "@scale-top-in": "scale-top-in_111fj",
+  "@scale-bottom-in": "scale-bottom-in_111fj",
+  "@scale-left-out": "scale-left-out_111fj",
+  "@scale-right-out": "scale-right-out_111fj",
+  "@scale-top-out": "scale-top-out_111fj",
+  "@scale-bottom-out": "scale-bottom-out_111fj",
+  "@slide-top-in": "slide-top-in_111fj",
+  "@slide-top-out": "slide-top-out_111fj",
+  "@slide-bottom-in": "slide-bottom-in_111fj",
+  "@slide-bottom-out": "slide-bottom-out_111fj",
+  "@slide-left-in": "slide-left-in_111fj",
+  "@slide-left-out": "slide-left-out_111fj",
+  "@slide-right-in": "slide-right-in_111fj",
+  "@slide-right-out": "slide-right-out_111fj",
+  "@transform-enter": "transform-enter_111fj",
+  "--transformStart": "--transformStart_111fj",
+  "--transformEnd": "--transformEnd_111fj",
+  "@transform-exit": "transform-exit_111fj"
 });
-
 function Collapse(_ref2, ref) {
   var _ref;
-
   var onAnimationStart = _ref2.onAnimationStart,
-      onAnimationEnd = _ref2.onAnimationEnd,
-      _ref2$overflowHidden = _ref2.overflowHidden,
-      overflowHidden = _ref2$overflowHidden === void 0 ? true : _ref2$overflowHidden,
-      props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
+    onAnimationEnd = _ref2.onAnimationEnd,
+    _ref2$overflowHidden = _ref2.overflowHidden,
+    overflowHidden = _ref2$overflowHidden === void 0 ? true : _ref2$overflowHidden,
+    props = (0, _objectWithoutProperties2["default"])(_ref2, _excluded);
   var SCollapse = _Animation["default"];
-
   var _useState = (0, _react.useState)('auto'),
-      _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
-      height = _useState2[0],
-      setHeightVar = _useState2[1];
-
+    _useState2 = (0, _slicedToArray2["default"])(_useState, 2),
+    height = _useState2[0],
+    setHeightVar = _useState2[1];
   var overflowRef = (0, _react.useRef)('initial');
@@ -85,3 +63,2 @@ var handlerAnimationStart = (0, _react.useCallback)(function (e) {
     if (onAnimationStart) onAnimationStart(e);
-
     if (overflowHidden) {
@@ -91,3 +68,2 @@ overflowRef.current = window.getComputedStyle(e.currentTarget).overflow;
     }
-
     setHeightVar(e.currentTarget.scrollHeight + 'px');
@@ -98,3 +74,2 @@ }, []);
     if (onAnimationEnd) onAnimationEnd(e);
-
     if (overflowHidden) {
@@ -109,3 +84,2 @@ // The timeout is needed because the overflow is first set, and then the node is removed via setState inside the animation
     }
-
     setHeightVar('auto');
@@ -122,8 +96,5 @@ }, []);
 }
-
 Collapse.displayName = 'Collapse';
-
 var _default = (0, _core.createBaseComponent)(Collapse);
-
 exports["default"] = _default;
 //# sourceMappingURL=Collapse.js.map

lib/cjs/FadeInOut.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -9,53 +8,38 @@ value: true
 exports["default"] = void 0;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _core = require("@semcore/core");
-
 var _react = _interopRequireDefault(require("react"));
-
 var _Animation = _interopRequireDefault(require("./Animation"));
-
 /*__reshadow-styles__:"./style/keyframes.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_core.sstyled.insert(
-/*__inner_css_start__*/
-"@keyframes collapse-enter_8srcg{0%{overflow:hidden;height:0}to{height:var(--height_8srcg)}}@keyframes collapse-exit_8srcg{0%{height:var(--height_8srcg)}to{height:0}}@keyframes fade-in-out-enter_8srcg{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_8srcg{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_8srcg{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_8srcg{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_8srcg{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_8srcg{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_8srcg{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_8srcg{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_8srcg{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_8srcg{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_8srcg{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_8srcg{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_8srcg{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_8srcg{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_8srcg{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_8srcg{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_8srcg{0%{transform:var(--transformStart_8srcg)}to{transform:var(--transformEnd_8srcg)}}@keyframes transform-exit_8srcg{0%{transform:var(--transformEnd_8srcg)}to{transform:var(--transformStart_8srcg)}}"
-/*__inner_css_end__*/
-, "8srcg_gg_")
-/*__reshadow_css_end__*/
-, {
-  "@collapse-enter": "collapse-enter_8srcg",
-  "--height": "--height_8srcg",
-  "@collapse-exit": "collapse-exit_8srcg",
-  "@fade-in-out-enter": "fade-in-out-enter_8srcg",
-  "@fade-in-out-exit": "fade-in-out-exit_8srcg",
-  "@opacity-in": "opacity-in_8srcg",
-  "@opacity-out": "opacity-out_8srcg",
-  "@scale-left-in": "scale-left-in_8srcg",
-  "@scale-right-in": "scale-right-in_8srcg",
-  "@scale-top-in": "scale-top-in_8srcg",
-  "@scale-bottom-in": "scale-bottom-in_8srcg",
-  "@scale-left-out": "scale-left-out_8srcg",
-  "@scale-right-out": "scale-right-out_8srcg",
-  "@scale-top-out": "scale-top-out_8srcg",
-  "@scale-bottom-out": "scale-bottom-out_8srcg",
-  "@slide-top-in": "slide-top-in_8srcg",
-  "@slide-top-out": "slide-top-out_8srcg",
-  "@slide-bottom-in": "slide-bottom-in_8srcg",
-  "@slide-bottom-out": "slide-bottom-out_8srcg",
-  "@slide-left-in": "slide-left-in_8srcg",
-  "@slide-left-out": "slide-left-out_8srcg",
-  "@slide-right-in": "slide-right-in_8srcg",
-  "@slide-right-out": "slide-right-out_8srcg",
-  "@transform-enter": "transform-enter_8srcg",
-  "--transformStart": "--transformStart_8srcg",
-  "--transformEnd": "--transformEnd_8srcg",
-  "@transform-exit": "transform-exit_8srcg"
+var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/"@keyframes collapse-enter_111fj{0%{overflow:hidden;height:0}to{height:var(--height_111fj)}}@keyframes collapse-exit_111fj{0%{height:var(--height_111fj)}to{height:0}}@keyframes fade-in-out-enter_111fj{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_111fj{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_111fj{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_111fj{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_111fj{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_111fj{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_111fj{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_111fj{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_111fj{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_111fj{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_111fj{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_111fj{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_111fj{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_111fj{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_111fj{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_111fj{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_111fj{0%{transform:var(--transformStart_111fj)}to{transform:var(--transformEnd_111fj)}}@keyframes transform-exit_111fj{0%{transform:var(--transformEnd_111fj)}to{transform:var(--transformStart_111fj)}}" /*__inner_css_end__*/, "111fj_gg_") /*__reshadow_css_end__*/, {
+  "@collapse-enter": "collapse-enter_111fj",
+  "--height": "--height_111fj",
+  "@collapse-exit": "collapse-exit_111fj",
+  "@fade-in-out-enter": "fade-in-out-enter_111fj",
+  "@fade-in-out-exit": "fade-in-out-exit_111fj",
+  "@opacity-in": "opacity-in_111fj",
+  "@opacity-out": "opacity-out_111fj",
+  "@scale-left-in": "scale-left-in_111fj",
+  "@scale-right-in": "scale-right-in_111fj",
+  "@scale-top-in": "scale-top-in_111fj",
+  "@scale-bottom-in": "scale-bottom-in_111fj",
+  "@scale-left-out": "scale-left-out_111fj",
+  "@scale-right-out": "scale-right-out_111fj",
+  "@scale-top-out": "scale-top-out_111fj",
+  "@scale-bottom-out": "scale-bottom-out_111fj",
+  "@slide-top-in": "slide-top-in_111fj",
+  "@slide-top-out": "slide-top-out_111fj",
+  "@slide-bottom-in": "slide-bottom-in_111fj",
+  "@slide-bottom-out": "slide-bottom-out_111fj",
+  "@slide-left-in": "slide-left-in_111fj",
+  "@slide-left-out": "slide-left-out_111fj",
+  "@slide-right-in": "slide-right-in_111fj",
+  "@slide-right-out": "slide-right-out_111fj",
+  "@transform-enter": "transform-enter_111fj",
+  "--transformStart": "--transformStart_111fj",
+  "--transformEnd": "--transformEnd_111fj",
+  "@transform-exit": "transform-exit_111fj"
 });
-
 function FadeInOut(props, ref) {
   var _ref;
-
   return _ref = (0, _core.sstyled)(style), /*#__PURE__*/_react["default"].createElement(_Animation["default"], _ref.cn("Animation", (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
@@ -67,8 +51,5 @@ "ref": ref
 }
-
 FadeInOut.displayName = 'FadeInOut';
-
 var _default = (0, _core.createBaseComponent)(FadeInOut);
-
 exports["default"] = _default;
 //# sourceMappingURL=FadeInOut.js.map

lib/cjs/index.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 var _interopRequireWildcard = require("@babel/runtime/helpers/interopRequireWildcard");
-
 Object.defineProperty(exports, "__esModule", {
@@ -52,14 +50,8 @@ value: true
 });
-
 var _Animation = _interopRequireWildcard(require("./Animation"));
-
 var _Transform = _interopRequireDefault(require("./Transform"));
-
 var _FadeInOut = _interopRequireDefault(require("./FadeInOut"));
-
 var _Collapse = _interopRequireDefault(require("./Collapse"));
-
 var _Scale = _interopRequireDefault(require("./Scale"));
-
 var _Slide = _interopRequireDefault(require("./Slide"));
 //# sourceMappingURL=index.js.map

lib/cjs/Scale.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -9,62 +8,44 @@ value: true
 exports["default"] = void 0;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _slicedToArray2 = _interopRequireDefault(require("@babel/runtime/helpers/slicedToArray"));
-
 var _core = require("@semcore/core");
-
 var _react = _interopRequireDefault(require("react"));
-
 var _Animation = _interopRequireDefault(require("./Animation"));
-
 var _ref2 = require("@semcore/utils/lib/ref");
-
 /*__reshadow-styles__:"./style/keyframes.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_core.sstyled.insert(
-/*__inner_css_start__*/
-"@keyframes collapse-enter_8srcg{0%{overflow:hidden;height:0}to{height:var(--height_8srcg)}}@keyframes collapse-exit_8srcg{0%{height:var(--height_8srcg)}to{height:0}}@keyframes fade-in-out-enter_8srcg{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_8srcg{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_8srcg{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_8srcg{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_8srcg{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_8srcg{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_8srcg{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_8srcg{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_8srcg{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_8srcg{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_8srcg{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_8srcg{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_8srcg{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_8srcg{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_8srcg{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_8srcg{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_8srcg{0%{transform:var(--transformStart_8srcg)}to{transform:var(--transformEnd_8srcg)}}@keyframes transform-exit_8srcg{0%{transform:var(--transformEnd_8srcg)}to{transform:var(--transformStart_8srcg)}}"
-/*__inner_css_end__*/
-, "8srcg_gg_")
-/*__reshadow_css_end__*/
-, {
-  "@collapse-enter": "collapse-enter_8srcg",
-  "--height": "--height_8srcg",
-  "@collapse-exit": "collapse-exit_8srcg",
-  "@fade-in-out-enter": "fade-in-out-enter_8srcg",
-  "@fade-in-out-exit": "fade-in-out-exit_8srcg",
-  "@opacity-in": "opacity-in_8srcg",
-  "@opacity-out": "opacity-out_8srcg",
-  "@scale-left-in": "scale-left-in_8srcg",
-  "@scale-right-in": "scale-right-in_8srcg",
-  "@scale-top-in": "scale-top-in_8srcg",
-  "@scale-bottom-in": "scale-bottom-in_8srcg",
-  "@scale-left-out": "scale-left-out_8srcg",
-  "@scale-right-out": "scale-right-out_8srcg",
-  "@scale-top-out": "scale-top-out_8srcg",
-  "@scale-bottom-out": "scale-bottom-out_8srcg",
-  "@slide-top-in": "slide-top-in_8srcg",
-  "@slide-top-out": "slide-top-out_8srcg",
-  "@slide-bottom-in": "slide-bottom-in_8srcg",
-  "@slide-bottom-out": "slide-bottom-out_8srcg",
-  "@slide-left-in": "slide-left-in_8srcg",
-  "@slide-left-out": "slide-left-out_8srcg",
-  "@slide-right-in": "slide-right-in_8srcg",
-  "@slide-right-out": "slide-right-out_8srcg",
-  "@transform-enter": "transform-enter_8srcg",
-  "--transformStart": "--transformStart_8srcg",
-  "--transformEnd": "--transformEnd_8srcg",
-  "@transform-exit": "transform-exit_8srcg"
+var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/"@keyframes collapse-enter_111fj{0%{overflow:hidden;height:0}to{height:var(--height_111fj)}}@keyframes collapse-exit_111fj{0%{height:var(--height_111fj)}to{height:0}}@keyframes fade-in-out-enter_111fj{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_111fj{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_111fj{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_111fj{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_111fj{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_111fj{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_111fj{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_111fj{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_111fj{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_111fj{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_111fj{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_111fj{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_111fj{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_111fj{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_111fj{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_111fj{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_111fj{0%{transform:var(--transformStart_111fj)}to{transform:var(--transformEnd_111fj)}}@keyframes transform-exit_111fj{0%{transform:var(--transformEnd_111fj)}to{transform:var(--transformStart_111fj)}}" /*__inner_css_end__*/, "111fj_gg_") /*__reshadow_css_end__*/, {
+  "@collapse-enter": "collapse-enter_111fj",
+  "--height": "--height_111fj",
+  "@collapse-exit": "collapse-exit_111fj",
+  "@fade-in-out-enter": "fade-in-out-enter_111fj",
+  "@fade-in-out-exit": "fade-in-out-exit_111fj",
+  "@opacity-in": "opacity-in_111fj",
+  "@opacity-out": "opacity-out_111fj",
+  "@scale-left-in": "scale-left-in_111fj",
+  "@scale-right-in": "scale-right-in_111fj",
+  "@scale-top-in": "scale-top-in_111fj",
+  "@scale-bottom-in": "scale-bottom-in_111fj",
+  "@scale-left-out": "scale-left-out_111fj",
+  "@scale-right-out": "scale-right-out_111fj",
+  "@scale-top-out": "scale-top-out_111fj",
+  "@scale-bottom-out": "scale-bottom-out_111fj",
+  "@slide-top-in": "slide-top-in_111fj",
+  "@slide-top-out": "slide-top-out_111fj",
+  "@slide-bottom-in": "slide-bottom-in_111fj",
+  "@slide-bottom-out": "slide-bottom-out_111fj",
+  "@slide-left-in": "slide-left-in_111fj",
+  "@slide-left-out": "slide-left-out_111fj",
+  "@slide-right-in": "slide-right-in_111fj",
+  "@slide-right-out": "slide-right-out_111fj",
+  "@transform-enter": "transform-enter_111fj",
+  "--transformStart": "--transformStart_111fj",
+  "--transformEnd": "--transformEnd_111fj",
+  "@transform-exit": "transform-exit_111fj"
 });
-
 function Scale(props, ref) {
   var _ref;
-
   var _React$useState = _react["default"].useState(props.placement),
-      _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
-      placement = _React$useState2[0],
-      setPlacement = _React$useState2[1];
-
+    _React$useState2 = (0, _slicedToArray2["default"])(_React$useState, 2),
+    placement = _React$useState2[0],
+    setPlacement = _React$useState2[1];
   var keyframesKey = _react["default"].useMemo(function () {
@@ -77,7 +58,4 @@ if (placement.startsWith('left')) return 'scale-left';
   }, [placement]);
-
   var popperCheckRef = _react["default"].useRef();
-
   var forkedRef = (0, _ref2.useForkRef)(ref, popperCheckRef);
-
   _react["default"].useEffect(function () {
@@ -94,3 +72,2 @@ if (placement && placement !== 'auto') return;
   }, [props.visible]);
-
   return _ref = (0, _core.sstyled)(style), /*#__PURE__*/_react["default"].createElement(_Animation["default"], _ref.cn("Animation", (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
@@ -102,8 +79,5 @@ "ref": forkedRef
 }
-
 Scale.displayName = 'Scale';
-
 var _default = (0, _core.createBaseComponent)(Scale);
-
 exports["default"] = _default;
 //# sourceMappingURL=Scale.js.map

lib/cjs/Slide.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -9,53 +8,38 @@ value: true
 exports["default"] = void 0;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _core = require("@semcore/core");
-
 var _react = _interopRequireDefault(require("react"));
-
 var _Animation = _interopRequireDefault(require("./Animation"));
-
 /*__reshadow-styles__:"./style/keyframes.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_core.sstyled.insert(
-/*__inner_css_start__*/
-"@keyframes collapse-enter_8srcg{0%{overflow:hidden;height:0}to{height:var(--height_8srcg)}}@keyframes collapse-exit_8srcg{0%{height:var(--height_8srcg)}to{height:0}}@keyframes fade-in-out-enter_8srcg{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_8srcg{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_8srcg{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_8srcg{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_8srcg{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_8srcg{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_8srcg{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_8srcg{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_8srcg{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_8srcg{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_8srcg{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_8srcg{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_8srcg{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_8srcg{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_8srcg{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_8srcg{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_8srcg{0%{transform:var(--transformStart_8srcg)}to{transform:var(--transformEnd_8srcg)}}@keyframes transform-exit_8srcg{0%{transform:var(--transformEnd_8srcg)}to{transform:var(--transformStart_8srcg)}}"
-/*__inner_css_end__*/
-, "8srcg_gg_")
-/*__reshadow_css_end__*/
-, {
-  "@collapse-enter": "collapse-enter_8srcg",
-  "--height": "--height_8srcg",
-  "@collapse-exit": "collapse-exit_8srcg",
-  "@fade-in-out-enter": "fade-in-out-enter_8srcg",
-  "@fade-in-out-exit": "fade-in-out-exit_8srcg",
-  "@opacity-in": "opacity-in_8srcg",
-  "@opacity-out": "opacity-out_8srcg",
-  "@scale-left-in": "scale-left-in_8srcg",
-  "@scale-right-in": "scale-right-in_8srcg",
-  "@scale-top-in": "scale-top-in_8srcg",
-  "@scale-bottom-in": "scale-bottom-in_8srcg",
-  "@scale-left-out": "scale-left-out_8srcg",
-  "@scale-right-out": "scale-right-out_8srcg",
-  "@scale-top-out": "scale-top-out_8srcg",
-  "@scale-bottom-out": "scale-bottom-out_8srcg",
-  "@slide-top-in": "slide-top-in_8srcg",
-  "@slide-top-out": "slide-top-out_8srcg",
-  "@slide-bottom-in": "slide-bottom-in_8srcg",
-  "@slide-bottom-out": "slide-bottom-out_8srcg",
-  "@slide-left-in": "slide-left-in_8srcg",
-  "@slide-left-out": "slide-left-out_8srcg",
-  "@slide-right-in": "slide-right-in_8srcg",
-  "@slide-right-out": "slide-right-out_8srcg",
-  "@transform-enter": "transform-enter_8srcg",
-  "--transformStart": "--transformStart_8srcg",
-  "--transformEnd": "--transformEnd_8srcg",
-  "@transform-exit": "transform-exit_8srcg"
+var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/"@keyframes collapse-enter_111fj{0%{overflow:hidden;height:0}to{height:var(--height_111fj)}}@keyframes collapse-exit_111fj{0%{height:var(--height_111fj)}to{height:0}}@keyframes fade-in-out-enter_111fj{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_111fj{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_111fj{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_111fj{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_111fj{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_111fj{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_111fj{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_111fj{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_111fj{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_111fj{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_111fj{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_111fj{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_111fj{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_111fj{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_111fj{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_111fj{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_111fj{0%{transform:var(--transformStart_111fj)}to{transform:var(--transformEnd_111fj)}}@keyframes transform-exit_111fj{0%{transform:var(--transformEnd_111fj)}to{transform:var(--transformStart_111fj)}}" /*__inner_css_end__*/, "111fj_gg_") /*__reshadow_css_end__*/, {
+  "@collapse-enter": "collapse-enter_111fj",
+  "--height": "--height_111fj",
+  "@collapse-exit": "collapse-exit_111fj",
+  "@fade-in-out-enter": "fade-in-out-enter_111fj",
+  "@fade-in-out-exit": "fade-in-out-exit_111fj",
+  "@opacity-in": "opacity-in_111fj",
+  "@opacity-out": "opacity-out_111fj",
+  "@scale-left-in": "scale-left-in_111fj",
+  "@scale-right-in": "scale-right-in_111fj",
+  "@scale-top-in": "scale-top-in_111fj",
+  "@scale-bottom-in": "scale-bottom-in_111fj",
+  "@scale-left-out": "scale-left-out_111fj",
+  "@scale-right-out": "scale-right-out_111fj",
+  "@scale-top-out": "scale-top-out_111fj",
+  "@scale-bottom-out": "scale-bottom-out_111fj",
+  "@slide-top-in": "slide-top-in_111fj",
+  "@slide-top-out": "slide-top-out_111fj",
+  "@slide-bottom-in": "slide-bottom-in_111fj",
+  "@slide-bottom-out": "slide-bottom-out_111fj",
+  "@slide-left-in": "slide-left-in_111fj",
+  "@slide-left-out": "slide-left-out_111fj",
+  "@slide-right-in": "slide-right-in_111fj",
+  "@slide-right-out": "slide-right-out_111fj",
+  "@transform-enter": "transform-enter_111fj",
+  "--transformStart": "--transformStart_111fj",
+  "--transformEnd": "--transformEnd_111fj",
+  "@transform-exit": "transform-exit_111fj"
 });
-
 function Slide(props, ref) {
   var _ref;
-
   return _ref = (0, _core.sstyled)(style), /*#__PURE__*/_react["default"].createElement(_Animation["default"], _ref.cn("Animation", (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
@@ -67,8 +51,5 @@ "ref": ref
 }
-
 Slide.displayName = 'Slide';
-
 var _default = (0, _core.createBaseComponent)(Slide);
-
 exports["default"] = _default;
 //# sourceMappingURL=Slide.js.map

lib/cjs/Transform.js

 "use strict";
 
 var _interopRequireDefault = require("@babel/runtime/helpers/interopRequireDefault");
-
 Object.defineProperty(exports, "__esModule", {
@@ -9,60 +8,43 @@ value: true
 exports["default"] = void 0;
-
 var _objectSpread2 = _interopRequireDefault(require("@babel/runtime/helpers/objectSpread2"));
-
 var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
-
 var _core = require("@semcore/core");
-
 var _react = _interopRequireDefault(require("react"));
-
 var _Animation = _interopRequireDefault(require("./Animation"));
-
 var _excluded = ["transform"];
-
 /*__reshadow-styles__:"./style/keyframes.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_core.sstyled.insert(
-/*__inner_css_start__*/
-"@keyframes collapse-enter_8srcg{0%{overflow:hidden;height:0}to{height:var(--height_8srcg)}}@keyframes collapse-exit_8srcg{0%{height:var(--height_8srcg)}to{height:0}}@keyframes fade-in-out-enter_8srcg{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_8srcg{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_8srcg{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_8srcg{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_8srcg{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_8srcg{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_8srcg{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_8srcg{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_8srcg{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_8srcg{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_8srcg{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_8srcg{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_8srcg{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_8srcg{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_8srcg{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_8srcg{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_8srcg{0%{transform:var(--transformStart_8srcg)}to{transform:var(--transformEnd_8srcg)}}@keyframes transform-exit_8srcg{0%{transform:var(--transformEnd_8srcg)}to{transform:var(--transformStart_8srcg)}}"
-/*__inner_css_end__*/
-, "8srcg_gg_")
-/*__reshadow_css_end__*/
-, {
-  "@collapse-enter": "collapse-enter_8srcg",
-  "--height": "--height_8srcg",
-  "@collapse-exit": "collapse-exit_8srcg",
-  "@fade-in-out-enter": "fade-in-out-enter_8srcg",
-  "@fade-in-out-exit": "fade-in-out-exit_8srcg",
-  "@opacity-in": "opacity-in_8srcg",
-  "@opacity-out": "opacity-out_8srcg",
-  "@scale-left-in": "scale-left-in_8srcg",
-  "@scale-right-in": "scale-right-in_8srcg",
-  "@scale-top-in": "scale-top-in_8srcg",
-  "@scale-bottom-in": "scale-bottom-in_8srcg",
-  "@scale-left-out": "scale-left-out_8srcg",
-  "@scale-right-out": "scale-right-out_8srcg",
-  "@scale-top-out": "scale-top-out_8srcg",
-  "@scale-bottom-out": "scale-bottom-out_8srcg",
-  "@slide-top-in": "slide-top-in_8srcg",
-  "@slide-top-out": "slide-top-out_8srcg",
-  "@slide-bottom-in": "slide-bottom-in_8srcg",
-  "@slide-bottom-out": "slide-bottom-out_8srcg",
-  "@slide-left-in": "slide-left-in_8srcg",
-  "@slide-left-out": "slide-left-out_8srcg",
-  "@slide-right-in": "slide-right-in_8srcg",
-  "@slide-right-out": "slide-right-out_8srcg",
-  "@transform-enter": "transform-enter_8srcg",
-  "--transformStart": "--transformStart_8srcg",
-  "--transformEnd": "--transformEnd_8srcg",
-  "@transform-exit": "transform-exit_8srcg"
+var style = ( /*__reshadow_css_start__*/_core.sstyled.insert( /*__inner_css_start__*/"@keyframes collapse-enter_111fj{0%{overflow:hidden;height:0}to{height:var(--height_111fj)}}@keyframes collapse-exit_111fj{0%{height:var(--height_111fj)}to{height:0}}@keyframes fade-in-out-enter_111fj{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_111fj{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_111fj{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_111fj{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_111fj{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_111fj{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_111fj{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_111fj{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_111fj{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_111fj{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_111fj{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_111fj{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_111fj{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_111fj{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_111fj{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_111fj{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_111fj{0%{transform:var(--transformStart_111fj)}to{transform:var(--transformEnd_111fj)}}@keyframes transform-exit_111fj{0%{transform:var(--transformEnd_111fj)}to{transform:var(--transformStart_111fj)}}" /*__inner_css_end__*/, "111fj_gg_") /*__reshadow_css_end__*/, {
+  "@collapse-enter": "collapse-enter_111fj",
+  "--height": "--height_111fj",
+  "@collapse-exit": "collapse-exit_111fj",
+  "@fade-in-out-enter": "fade-in-out-enter_111fj",
+  "@fade-in-out-exit": "fade-in-out-exit_111fj",
+  "@opacity-in": "opacity-in_111fj",
+  "@opacity-out": "opacity-out_111fj",
+  "@scale-left-in": "scale-left-in_111fj",
+  "@scale-right-in": "scale-right-in_111fj",
+  "@scale-top-in": "scale-top-in_111fj",
+  "@scale-bottom-in": "scale-bottom-in_111fj",
+  "@scale-left-out": "scale-left-out_111fj",
+  "@scale-right-out": "scale-right-out_111fj",
+  "@scale-top-out": "scale-top-out_111fj",
+  "@scale-bottom-out": "scale-bottom-out_111fj",
+  "@slide-top-in": "slide-top-in_111fj",
+  "@slide-top-out": "slide-top-out_111fj",
+  "@slide-bottom-in": "slide-bottom-in_111fj",
+  "@slide-bottom-out": "slide-bottom-out_111fj",
+  "@slide-left-in": "slide-left-in_111fj",
+  "@slide-left-out": "slide-left-out_111fj",
+  "@slide-right-in": "slide-right-in_111fj",
+  "@slide-right-out": "slide-right-out_111fj",
+  "@transform-enter": "transform-enter_111fj",
+  "--transformStart": "--transformStart_111fj",
+  "--transformEnd": "--transformEnd_111fj",
+  "@transform-exit": "transform-exit_111fj"
 });
-
 function Transform(props, ref) {
   var _ref;
-
   var _props$transform = props.transform,
-      transform = _props$transform === void 0 ? [] : _props$transform,
-      other = (0, _objectWithoutProperties2["default"])(props, _excluded);
+    transform = _props$transform === void 0 ? [] : _props$transform,
+    other = (0, _objectWithoutProperties2["default"])(props, _excluded);
   return _ref = (0, _core.sstyled)(style), /*#__PURE__*/_react["default"].createElement(_Animation["default"], _ref.cn("Animation", (0, _objectSpread2["default"])((0, _objectSpread2["default"])({
@@ -76,8 +58,5 @@ "ref": ref
 }
-
 Transform.displayName = 'Transform';
-
 var _default = (0, _core.createBaseComponent)(Transform);
-
 exports["default"] = _default;
 //# sourceMappingURL=Transform.js.map

lib/es6/Animation.js

@@ -14,28 +14,17 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import contextEnhance from '@semcore/utils/lib/enhances/contextEnhance';
-
 /*__reshadow-styles__:"./style/animate.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_sstyled.insert(
-/*__inner_css_start__*/
-".___SAnimation_oqoor_gg_{animation-fill-mode:both;animation-timing-function:var(--timingFunction_oqoor);animation-duration:var(--durationFinalize_oqoor);animation-delay:var(--delayFinalize_oqoor);animation-name:var(--keyframesFinalize_oqoor)}.___SAnimation_oqoor_gg_.__visible_oqoor_gg_{animation-duration:var(--durationInitialize_oqoor);animation-delay:var(--delayInitialize_oqoor);animation-name:var(--keyframesInitialize_oqoor)}@media (prefers-reduced-motion){.___SAnimation_oqoor_gg_,.___SAnimation_oqoor_gg_.__visible_oqoor_gg_{animation-timing-function:step-end;animation-iteration-count:1}}"
-/*__inner_css_end__*/
-, "oqoor_gg_")
-/*__reshadow_css_end__*/
-, {
-  "__SAnimation": "___SAnimation_oqoor_gg_",
-  "--timingFunction": "--timingFunction_oqoor",
-  "--durationFinalize": "--durationFinalize_oqoor",
-  "--delayFinalize": "--delayFinalize_oqoor",
-  "--keyframesFinalize": "--keyframesFinalize_oqoor",
-  "_visible": "__visible_oqoor_gg_",
-  "--durationInitialize": "--durationInitialize_oqoor",
-  "--delayInitialize": "--delayInitialize_oqoor",
-  "--keyframesInitialize": "--keyframesInitialize_oqoor"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/".___SAnimation_qssnj_gg_{animation-fill-mode:both;animation-timing-function:var(--timingFunction_qssnj);animation-duration:var(--durationFinalize_qssnj);animation-delay:var(--delayFinalize_qssnj);animation-name:var(--keyframesFinalize_qssnj)}.___SAnimation_qssnj_gg_.__visible_qssnj_gg_{animation-duration:var(--durationInitialize_qssnj);animation-delay:var(--delayInitialize_qssnj);animation-name:var(--keyframesInitialize_qssnj)}@media (prefers-reduced-motion){.___SAnimation_qssnj_gg_,.___SAnimation_qssnj_gg_.__visible_qssnj_gg_{animation-timing-function:step-end;animation-iteration-count:1}}" /*__inner_css_end__*/, "qssnj_gg_") /*__reshadow_css_end__*/, {
+  "__SAnimation": "___SAnimation_qssnj_gg_",
+  "--timingFunction": "--timingFunction_qssnj",
+  "--durationFinalize": "--durationFinalize_qssnj",
+  "--delayFinalize": "--delayFinalize_qssnj",
+  "--keyframesFinalize": "--keyframesFinalize_qssnj",
+  "_visible": "__visible_qssnj_gg_",
+  "--durationInitialize": "--durationInitialize_qssnj",
+  "--delayInitialize": "--delayInitialize_qssnj",
+  "--keyframesInitialize": "--keyframesInitialize_qssnj"
 });
-
 function propToArray(prop) {
   return Array.isArray(prop) ? prop : [prop, prop];
 }
-
 var makeAnimationContextValue = function makeAnimationContextValue() {
@@ -64,21 +53,13 @@ var context = {
 };
-
 export var animationContext = /*#__PURE__*/React.createContext(null);
-
 var Animation = /*#__PURE__*/function (_Component) {
   _inherits(Animation, _Component);
-
   var _super = _createSuper(Animation);
-
   function Animation() {
     var _this;
-
     _classCallCheck(this, Animation);
-
     for (var _len = arguments.length, args = new Array(_len), _key = 0; _key < _len; _key++) {
       args[_key] = arguments[_key];
     }
-
     _this = _super.call.apply(_super, [this].concat(args));
-
     _defineProperty(_assertThisInitialized(_this), "state", {
@@ -89,9 +70,7 @@ animationRunning: false,
     });
-
     _defineProperty(_assertThisInitialized(_this), "animationContext", makeAnimationContextValue());
-
     _defineProperty(_assertThisInitialized(_this), "onAnimationStart", function () {
       var _this$asProps = _this.asProps,
-          animationsDisabled = _this$asProps.animationsDisabled,
-          parentAnimationContext = _this$asProps.parentAnimationContext;
+        animationsDisabled = _this$asProps.animationsDisabled,
+        parentAnimationContext = _this$asProps.parentAnimationContext;
       var duration = animationsDisabled ? [0, 0] : propToArray(_this.asProps.duration);
@@ -103,6 +82,4 @@ var animationContext = parentAnimationContext !== null && parentAnimationContext !== void 0 ? parentAnimationContext : _this.animationContext;
     });
-
     _defineProperty(_assertThisInitialized(_this), "onAnimationEnd", function (event) {
       event.stopPropagation();
-
       if (!_this.asProps.visible && !_this.props.preserveNode) {
@@ -113,3 +90,2 @@ _this.setState({
       }
-
       var parentAnimationContext = _this.asProps.parentAnimationContext;
@@ -121,6 +97,4 @@ var animationContext = parentAnimationContext !== null && parentAnimationContext !== void 0 ? parentAnimationContext : _this.animationContext;
     });
-
     return _this;
   }
-
   _createClass(Animation, [{
@@ -130,12 +104,11 @@ key: "render",
       var _ref = this.asProps,
-          _ref2;
-
+        _ref2;
       var SAnimation = Box;
       var _this$asProps2 = this.asProps,
-          styles = _this$asProps2.styles,
-          keyframes = _this$asProps2.keyframes,
-          initialAnimation = _this$asProps2.initialAnimation,
-          timingFunction = _this$asProps2.timingFunction,
-          animationsDisabled = _this$asProps2.animationsDisabled,
-          parentAnimationContext = _this$asProps2.parentAnimationContext;
+        styles = _this$asProps2.styles,
+        keyframes = _this$asProps2.keyframes,
+        initialAnimation = _this$asProps2.initialAnimation,
+        timingFunction = _this$asProps2.timingFunction,
+        animationsDisabled = _this$asProps2.animationsDisabled,
+        parentAnimationContext = _this$asProps2.parentAnimationContext;
       var animationContextValue = parentAnimationContext !== null && parentAnimationContext !== void 0 ? parentAnimationContext : this.animationContext;
@@ -145,4 +118,4 @@ var duration = animationsDisabled ? [0, 0] : propToArray(this.asProps.duration);
       var _this$state = this.state,
-          render = _this$state.render,
-          wasInvisible = _this$state.wasInvisible;
+        render = _this$state.render,
+        wasInvisible = _this$state.wasInvisible;
       if (!render) return null;
@@ -159,3 +132,3 @@ return /*#__PURE__*/React.createElement(animationContext.Provider, {
         "timingFunction": timingFunction,
-        "keyframesInitialize": wasInvisible || initialAnimation ? keyframes[0] : undefined,
+        "keyframesInitialize": wasInvisible || initialAnimation ? keyframes[0] : "totally-no-animations",
         "keyframesFinalize": keyframes[1]
@@ -168,3 +141,2 @@ }, _ref))))));
       var wasInvisible = state.wasInvisible || !props.visible;
-
       if (props.visible || props.preserveNode || state.wasInvisible !== wasInvisible) {
@@ -176,14 +148,9 @@ return {
       }
-
       return state;
     }
   }]);
-
   return Animation;
 }(Component);
-
 _defineProperty(Animation, "displayName", 'Animation');
-
 _defineProperty(Animation, "style", style);
-
 _defineProperty(Animation, "defaultProps", {
@@ -198,6 +165,4 @@ visible: false,
 });
-
 _defineProperty(Animation, "enhance", [contextEnhance(animationContext, 'parentAnimationContext')]);
-
 export default createComponent(Animation);
 //# sourceMappingURL=Animation.js.map

lib/es6/Collapse.js

@@ -9,58 +9,44 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import Animation from './Animation';
-
 /*__reshadow-styles__:"./style/keyframes.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_sstyled.insert(
-/*__inner_css_start__*/
-"@keyframes collapse-enter_8srcg{0%{overflow:hidden;height:0}to{height:var(--height_8srcg)}}@keyframes collapse-exit_8srcg{0%{height:var(--height_8srcg)}to{height:0}}@keyframes fade-in-out-enter_8srcg{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_8srcg{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_8srcg{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_8srcg{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_8srcg{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_8srcg{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_8srcg{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_8srcg{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_8srcg{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_8srcg{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_8srcg{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_8srcg{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_8srcg{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_8srcg{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_8srcg{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_8srcg{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_8srcg{0%{transform:var(--transformStart_8srcg)}to{transform:var(--transformEnd_8srcg)}}@keyframes transform-exit_8srcg{0%{transform:var(--transformEnd_8srcg)}to{transform:var(--transformStart_8srcg)}}"
-/*__inner_css_end__*/
-, "8srcg_gg_")
-/*__reshadow_css_end__*/
-, {
-  "@collapse-enter": "collapse-enter_8srcg",
-  "--height": "--height_8srcg",
-  "@collapse-exit": "collapse-exit_8srcg",
-  "@fade-in-out-enter": "fade-in-out-enter_8srcg",
-  "@fade-in-out-exit": "fade-in-out-exit_8srcg",
-  "@opacity-in": "opacity-in_8srcg",
-  "@opacity-out": "opacity-out_8srcg",
-  "@scale-left-in": "scale-left-in_8srcg",
-  "@scale-right-in": "scale-right-in_8srcg",
-  "@scale-top-in": "scale-top-in_8srcg",
-  "@scale-bottom-in": "scale-bottom-in_8srcg",
-  "@scale-left-out": "scale-left-out_8srcg",
-  "@scale-right-out": "scale-right-out_8srcg",
-  "@scale-top-out": "scale-top-out_8srcg",
-  "@scale-bottom-out": "scale-bottom-out_8srcg",
-  "@slide-top-in": "slide-top-in_8srcg",
-  "@slide-top-out": "slide-top-out_8srcg",
-  "@slide-bottom-in": "slide-bottom-in_8srcg",
-  "@slide-bottom-out": "slide-bottom-out_8srcg",
-  "@slide-left-in": "slide-left-in_8srcg",
-  "@slide-left-out": "slide-left-out_8srcg",
-  "@slide-right-in": "slide-right-in_8srcg",
-  "@slide-right-out": "slide-right-out_8srcg",
-  "@transform-enter": "transform-enter_8srcg",
-  "--transformStart": "--transformStart_8srcg",
-  "--transformEnd": "--transformEnd_8srcg",
-  "@transform-exit": "transform-exit_8srcg"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/"@keyframes collapse-enter_111fj{0%{overflow:hidden;height:0}to{height:var(--height_111fj)}}@keyframes collapse-exit_111fj{0%{height:var(--height_111fj)}to{height:0}}@keyframes fade-in-out-enter_111fj{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_111fj{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_111fj{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_111fj{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_111fj{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_111fj{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_111fj{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_111fj{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_111fj{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_111fj{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_111fj{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_111fj{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_111fj{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_111fj{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_111fj{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_111fj{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_111fj{0%{transform:var(--transformStart_111fj)}to{transform:var(--transformEnd_111fj)}}@keyframes transform-exit_111fj{0%{transform:var(--transformEnd_111fj)}to{transform:var(--transformStart_111fj)}}" /*__inner_css_end__*/, "111fj_gg_") /*__reshadow_css_end__*/, {
+  "@collapse-enter": "collapse-enter_111fj",
+  "--height": "--height_111fj",
+  "@collapse-exit": "collapse-exit_111fj",
+  "@fade-in-out-enter": "fade-in-out-enter_111fj",
+  "@fade-in-out-exit": "fade-in-out-exit_111fj",
+  "@opacity-in": "opacity-in_111fj",
+  "@opacity-out": "opacity-out_111fj",
+  "@scale-left-in": "scale-left-in_111fj",
+  "@scale-right-in": "scale-right-in_111fj",
+  "@scale-top-in": "scale-top-in_111fj",
+  "@scale-bottom-in": "scale-bottom-in_111fj",
+  "@scale-left-out": "scale-left-out_111fj",
+  "@scale-right-out": "scale-right-out_111fj",
+  "@scale-top-out": "scale-top-out_111fj",
+  "@scale-bottom-out": "scale-bottom-out_111fj",
+  "@slide-top-in": "slide-top-in_111fj",
+  "@slide-top-out": "slide-top-out_111fj",
+  "@slide-bottom-in": "slide-bottom-in_111fj",
+  "@slide-bottom-out": "slide-bottom-out_111fj",
+  "@slide-left-in": "slide-left-in_111fj",
+  "@slide-left-out": "slide-left-out_111fj",
+  "@slide-right-in": "slide-right-in_111fj",
+  "@slide-right-out": "slide-right-out_111fj",
+  "@transform-enter": "transform-enter_111fj",
+  "--transformStart": "--transformStart_111fj",
+  "--transformEnd": "--transformEnd_111fj",
+  "@transform-exit": "transform-exit_111fj"
 });
-
 function Collapse(_ref2, ref) {
   var _ref;
-
   var onAnimationStart = _ref2.onAnimationStart,
-      onAnimationEnd = _ref2.onAnimationEnd,
-      _ref2$overflowHidden = _ref2.overflowHidden,
-      overflowHidden = _ref2$overflowHidden === void 0 ? true : _ref2$overflowHidden,
-      props = _objectWithoutProperties(_ref2, _excluded);
-
+    onAnimationEnd = _ref2.onAnimationEnd,
+    _ref2$overflowHidden = _ref2.overflowHidden,
+    overflowHidden = _ref2$overflowHidden === void 0 ? true : _ref2$overflowHidden,
+    props = _objectWithoutProperties(_ref2, _excluded);
   var SCollapse = Animation;
-
   var _useState = useState('auto'),
-      _useState2 = _slicedToArray(_useState, 2),
-      height = _useState2[0],
-      setHeightVar = _useState2[1];
-
+    _useState2 = _slicedToArray(_useState, 2),
+    height = _useState2[0],
+    setHeightVar = _useState2[1];
   var overflowRef = useRef('initial');
@@ -70,3 +56,2 @@ var handlerAnimationStart = useCallback(function (e) {
     if (onAnimationStart) onAnimationStart(e);
-
     if (overflowHidden) {
@@ -76,3 +61,2 @@ overflowRef.current = window.getComputedStyle(e.currentTarget).overflow;
     }
-
     setHeightVar(e.currentTarget.scrollHeight + 'px');
@@ -83,3 +67,2 @@ }, []);
     if (onAnimationEnd) onAnimationEnd(e);
-
     if (overflowHidden) {
@@ -94,3 +77,2 @@ // The timeout is needed because the overflow is first set, and then the node is removed via setState inside the animation
     }
-
     setHeightVar('auto');
@@ -107,5 +89,4 @@ }, []);
 }
-
 Collapse.displayName = 'Collapse';
 export default createBaseComponent(Collapse);
 //# sourceMappingURL=Collapse.js.map

lib/es6/FadeInOut.js

@@ -6,45 +6,34 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import Animation from './Animation';
-
 /*__reshadow-styles__:"./style/keyframes.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_sstyled.insert(
-/*__inner_css_start__*/
-"@keyframes collapse-enter_8srcg{0%{overflow:hidden;height:0}to{height:var(--height_8srcg)}}@keyframes collapse-exit_8srcg{0%{height:var(--height_8srcg)}to{height:0}}@keyframes fade-in-out-enter_8srcg{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_8srcg{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_8srcg{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_8srcg{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_8srcg{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_8srcg{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_8srcg{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_8srcg{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_8srcg{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_8srcg{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_8srcg{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_8srcg{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_8srcg{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_8srcg{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_8srcg{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_8srcg{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_8srcg{0%{transform:var(--transformStart_8srcg)}to{transform:var(--transformEnd_8srcg)}}@keyframes transform-exit_8srcg{0%{transform:var(--transformEnd_8srcg)}to{transform:var(--transformStart_8srcg)}}"
-/*__inner_css_end__*/
-, "8srcg_gg_")
-/*__reshadow_css_end__*/
-, {
-  "@collapse-enter": "collapse-enter_8srcg",
-  "--height": "--height_8srcg",
-  "@collapse-exit": "collapse-exit_8srcg",
-  "@fade-in-out-enter": "fade-in-out-enter_8srcg",
-  "@fade-in-out-exit": "fade-in-out-exit_8srcg",
-  "@opacity-in": "opacity-in_8srcg",
-  "@opacity-out": "opacity-out_8srcg",
-  "@scale-left-in": "scale-left-in_8srcg",
-  "@scale-right-in": "scale-right-in_8srcg",
-  "@scale-top-in": "scale-top-in_8srcg",
-  "@scale-bottom-in": "scale-bottom-in_8srcg",
-  "@scale-left-out": "scale-left-out_8srcg",
-  "@scale-right-out": "scale-right-out_8srcg",
-  "@scale-top-out": "scale-top-out_8srcg",
-  "@scale-bottom-out": "scale-bottom-out_8srcg",
-  "@slide-top-in": "slide-top-in_8srcg",
-  "@slide-top-out": "slide-top-out_8srcg",
-  "@slide-bottom-in": "slide-bottom-in_8srcg",
-  "@slide-bottom-out": "slide-bottom-out_8srcg",
-  "@slide-left-in": "slide-left-in_8srcg",
-  "@slide-left-out": "slide-left-out_8srcg",
-  "@slide-right-in": "slide-right-in_8srcg",
-  "@slide-right-out": "slide-right-out_8srcg",
-  "@transform-enter": "transform-enter_8srcg",
-  "--transformStart": "--transformStart_8srcg",
-  "--transformEnd": "--transformEnd_8srcg",
-  "@transform-exit": "transform-exit_8srcg"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/"@keyframes collapse-enter_111fj{0%{overflow:hidden;height:0}to{height:var(--height_111fj)}}@keyframes collapse-exit_111fj{0%{height:var(--height_111fj)}to{height:0}}@keyframes fade-in-out-enter_111fj{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_111fj{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_111fj{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_111fj{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_111fj{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_111fj{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_111fj{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_111fj{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_111fj{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_111fj{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_111fj{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_111fj{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_111fj{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_111fj{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_111fj{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_111fj{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_111fj{0%{transform:var(--transformStart_111fj)}to{transform:var(--transformEnd_111fj)}}@keyframes transform-exit_111fj{0%{transform:var(--transformEnd_111fj)}to{transform:var(--transformStart_111fj)}}" /*__inner_css_end__*/, "111fj_gg_") /*__reshadow_css_end__*/, {
+  "@collapse-enter": "collapse-enter_111fj",
+  "--height": "--height_111fj",
+  "@collapse-exit": "collapse-exit_111fj",
+  "@fade-in-out-enter": "fade-in-out-enter_111fj",
+  "@fade-in-out-exit": "fade-in-out-exit_111fj",
+  "@opacity-in": "opacity-in_111fj",
+  "@opacity-out": "opacity-out_111fj",
+  "@scale-left-in": "scale-left-in_111fj",
+  "@scale-right-in": "scale-right-in_111fj",
+  "@scale-top-in": "scale-top-in_111fj",
+  "@scale-bottom-in": "scale-bottom-in_111fj",
+  "@scale-left-out": "scale-left-out_111fj",
+  "@scale-right-out": "scale-right-out_111fj",
+  "@scale-top-out": "scale-top-out_111fj",
+  "@scale-bottom-out": "scale-bottom-out_111fj",
+  "@slide-top-in": "slide-top-in_111fj",
+  "@slide-top-out": "slide-top-out_111fj",
+  "@slide-bottom-in": "slide-bottom-in_111fj",
+  "@slide-bottom-out": "slide-bottom-out_111fj",
+  "@slide-left-in": "slide-left-in_111fj",
+  "@slide-left-out": "slide-left-out_111fj",
+  "@slide-right-in": "slide-right-in_111fj",
+  "@slide-right-out": "slide-right-out_111fj",
+  "@transform-enter": "transform-enter_111fj",
+  "--transformStart": "--transformStart_111fj",
+  "--transformEnd": "--transformEnd_111fj",
+  "@transform-exit": "transform-exit_111fj"
 });
-
 function FadeInOut(props, ref) {
   var _ref;
-
   return _ref = sstyled(style), /*#__PURE__*/React.createElement(Animation, _ref.cn("Animation", _objectSpread(_objectSpread({
@@ -56,5 +45,4 @@ "ref": ref
 }
-
 FadeInOut.displayName = 'FadeInOut';
 export default createBaseComponent(FadeInOut);
 //# sourceMappingURL=FadeInOut.js.map

lib/es6/Scale.js

@@ -7,51 +7,39 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import Animation from './Animation';
-
 /*__reshadow-styles__:"./style/keyframes.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_sstyled.insert(
-/*__inner_css_start__*/
-"@keyframes collapse-enter_8srcg{0%{overflow:hidden;height:0}to{height:var(--height_8srcg)}}@keyframes collapse-exit_8srcg{0%{height:var(--height_8srcg)}to{height:0}}@keyframes fade-in-out-enter_8srcg{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_8srcg{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_8srcg{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_8srcg{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_8srcg{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_8srcg{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_8srcg{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_8srcg{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_8srcg{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_8srcg{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_8srcg{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_8srcg{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_8srcg{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_8srcg{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_8srcg{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_8srcg{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_8srcg{0%{transform:var(--transformStart_8srcg)}to{transform:var(--transformEnd_8srcg)}}@keyframes transform-exit_8srcg{0%{transform:var(--transformEnd_8srcg)}to{transform:var(--transformStart_8srcg)}}"
-/*__inner_css_end__*/
-, "8srcg_gg_")
-/*__reshadow_css_end__*/
-, {
-  "@collapse-enter": "collapse-enter_8srcg",
-  "--height": "--height_8srcg",
-  "@collapse-exit": "collapse-exit_8srcg",
-  "@fade-in-out-enter": "fade-in-out-enter_8srcg",
-  "@fade-in-out-exit": "fade-in-out-exit_8srcg",
-  "@opacity-in": "opacity-in_8srcg",
-  "@opacity-out": "opacity-out_8srcg",
-  "@scale-left-in": "scale-left-in_8srcg",
-  "@scale-right-in": "scale-right-in_8srcg",
-  "@scale-top-in": "scale-top-in_8srcg",
-  "@scale-bottom-in": "scale-bottom-in_8srcg",
-  "@scale-left-out": "scale-left-out_8srcg",
-  "@scale-right-out": "scale-right-out_8srcg",
-  "@scale-top-out": "scale-top-out_8srcg",
-  "@scale-bottom-out": "scale-bottom-out_8srcg",
-  "@slide-top-in": "slide-top-in_8srcg",
-  "@slide-top-out": "slide-top-out_8srcg",
-  "@slide-bottom-in": "slide-bottom-in_8srcg",
-  "@slide-bottom-out": "slide-bottom-out_8srcg",
-  "@slide-left-in": "slide-left-in_8srcg",
-  "@slide-left-out": "slide-left-out_8srcg",
-  "@slide-right-in": "slide-right-in_8srcg",
-  "@slide-right-out": "slide-right-out_8srcg",
-  "@transform-enter": "transform-enter_8srcg",
-  "--transformStart": "--transformStart_8srcg",
-  "--transformEnd": "--transformEnd_8srcg",
-  "@transform-exit": "transform-exit_8srcg"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/"@keyframes collapse-enter_111fj{0%{overflow:hidden;height:0}to{height:var(--height_111fj)}}@keyframes collapse-exit_111fj{0%{height:var(--height_111fj)}to{height:0}}@keyframes fade-in-out-enter_111fj{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_111fj{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_111fj{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_111fj{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_111fj{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_111fj{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_111fj{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_111fj{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_111fj{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_111fj{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_111fj{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_111fj{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_111fj{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_111fj{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_111fj{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_111fj{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_111fj{0%{transform:var(--transformStart_111fj)}to{transform:var(--transformEnd_111fj)}}@keyframes transform-exit_111fj{0%{transform:var(--transformEnd_111fj)}to{transform:var(--transformStart_111fj)}}" /*__inner_css_end__*/, "111fj_gg_") /*__reshadow_css_end__*/, {
+  "@collapse-enter": "collapse-enter_111fj",
+  "--height": "--height_111fj",
+  "@collapse-exit": "collapse-exit_111fj",
+  "@fade-in-out-enter": "fade-in-out-enter_111fj",
+  "@fade-in-out-exit": "fade-in-out-exit_111fj",
+  "@opacity-in": "opacity-in_111fj",
+  "@opacity-out": "opacity-out_111fj",
+  "@scale-left-in": "scale-left-in_111fj",
+  "@scale-right-in": "scale-right-in_111fj",
+  "@scale-top-in": "scale-top-in_111fj",
+  "@scale-bottom-in": "scale-bottom-in_111fj",
+  "@scale-left-out": "scale-left-out_111fj",
+  "@scale-right-out": "scale-right-out_111fj",
+  "@scale-top-out": "scale-top-out_111fj",
+  "@scale-bottom-out": "scale-bottom-out_111fj",
+  "@slide-top-in": "slide-top-in_111fj",
+  "@slide-top-out": "slide-top-out_111fj",
+  "@slide-bottom-in": "slide-bottom-in_111fj",
+  "@slide-bottom-out": "slide-bottom-out_111fj",
+  "@slide-left-in": "slide-left-in_111fj",
+  "@slide-left-out": "slide-left-out_111fj",
+  "@slide-right-in": "slide-right-in_111fj",
+  "@slide-right-out": "slide-right-out_111fj",
+  "@transform-enter": "transform-enter_111fj",
+  "--transformStart": "--transformStart_111fj",
+  "--transformEnd": "--transformEnd_111fj",
+  "@transform-exit": "transform-exit_111fj"
 });
 import { useForkRef } from '@semcore/utils/lib/ref';
-
 function Scale(props, ref) {
   var _ref;
-
   var _React$useState = React.useState(props.placement),
-      _React$useState2 = _slicedToArray(_React$useState, 2),
-      placement = _React$useState2[0],
-      setPlacement = _React$useState2[1];
-
+    _React$useState2 = _slicedToArray(_React$useState, 2),
+    placement = _React$useState2[0],
+    setPlacement = _React$useState2[1];
   var keyframesKey = React.useMemo(function () {
@@ -83,5 +71,4 @@ if (placement.startsWith('left')) return 'scale-left';
 }
-
 Scale.displayName = 'Scale';
 export default createBaseComponent(Scale);
 //# sourceMappingURL=Scale.js.map

lib/es6/Slide.js

@@ -6,45 +6,34 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import Animation from './Animation';
-
 /*__reshadow-styles__:"./style/keyframes.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_sstyled.insert(
-/*__inner_css_start__*/
-"@keyframes collapse-enter_8srcg{0%{overflow:hidden;height:0}to{height:var(--height_8srcg)}}@keyframes collapse-exit_8srcg{0%{height:var(--height_8srcg)}to{height:0}}@keyframes fade-in-out-enter_8srcg{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_8srcg{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_8srcg{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_8srcg{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_8srcg{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_8srcg{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_8srcg{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_8srcg{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_8srcg{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_8srcg{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_8srcg{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_8srcg{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_8srcg{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_8srcg{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_8srcg{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_8srcg{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_8srcg{0%{transform:var(--transformStart_8srcg)}to{transform:var(--transformEnd_8srcg)}}@keyframes transform-exit_8srcg{0%{transform:var(--transformEnd_8srcg)}to{transform:var(--transformStart_8srcg)}}"
-/*__inner_css_end__*/
-, "8srcg_gg_")
-/*__reshadow_css_end__*/
-, {
-  "@collapse-enter": "collapse-enter_8srcg",
-  "--height": "--height_8srcg",
-  "@collapse-exit": "collapse-exit_8srcg",
-  "@fade-in-out-enter": "fade-in-out-enter_8srcg",
-  "@fade-in-out-exit": "fade-in-out-exit_8srcg",
-  "@opacity-in": "opacity-in_8srcg",
-  "@opacity-out": "opacity-out_8srcg",
-  "@scale-left-in": "scale-left-in_8srcg",
-  "@scale-right-in": "scale-right-in_8srcg",
-  "@scale-top-in": "scale-top-in_8srcg",
-  "@scale-bottom-in": "scale-bottom-in_8srcg",
-  "@scale-left-out": "scale-left-out_8srcg",
-  "@scale-right-out": "scale-right-out_8srcg",
-  "@scale-top-out": "scale-top-out_8srcg",
-  "@scale-bottom-out": "scale-bottom-out_8srcg",
-  "@slide-top-in": "slide-top-in_8srcg",
-  "@slide-top-out": "slide-top-out_8srcg",
-  "@slide-bottom-in": "slide-bottom-in_8srcg",
-  "@slide-bottom-out": "slide-bottom-out_8srcg",
-  "@slide-left-in": "slide-left-in_8srcg",
-  "@slide-left-out": "slide-left-out_8srcg",
-  "@slide-right-in": "slide-right-in_8srcg",
-  "@slide-right-out": "slide-right-out_8srcg",
-  "@transform-enter": "transform-enter_8srcg",
-  "--transformStart": "--transformStart_8srcg",
-  "--transformEnd": "--transformEnd_8srcg",
-  "@transform-exit": "transform-exit_8srcg"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/"@keyframes collapse-enter_111fj{0%{overflow:hidden;height:0}to{height:var(--height_111fj)}}@keyframes collapse-exit_111fj{0%{height:var(--height_111fj)}to{height:0}}@keyframes fade-in-out-enter_111fj{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_111fj{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_111fj{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_111fj{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_111fj{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_111fj{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_111fj{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_111fj{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_111fj{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_111fj{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_111fj{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_111fj{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_111fj{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_111fj{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_111fj{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_111fj{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_111fj{0%{transform:var(--transformStart_111fj)}to{transform:var(--transformEnd_111fj)}}@keyframes transform-exit_111fj{0%{transform:var(--transformEnd_111fj)}to{transform:var(--transformStart_111fj)}}" /*__inner_css_end__*/, "111fj_gg_") /*__reshadow_css_end__*/, {
+  "@collapse-enter": "collapse-enter_111fj",
+  "--height": "--height_111fj",
+  "@collapse-exit": "collapse-exit_111fj",
+  "@fade-in-out-enter": "fade-in-out-enter_111fj",
+  "@fade-in-out-exit": "fade-in-out-exit_111fj",
+  "@opacity-in": "opacity-in_111fj",
+  "@opacity-out": "opacity-out_111fj",
+  "@scale-left-in": "scale-left-in_111fj",
+  "@scale-right-in": "scale-right-in_111fj",
+  "@scale-top-in": "scale-top-in_111fj",
+  "@scale-bottom-in": "scale-bottom-in_111fj",
+  "@scale-left-out": "scale-left-out_111fj",
+  "@scale-right-out": "scale-right-out_111fj",
+  "@scale-top-out": "scale-top-out_111fj",
+  "@scale-bottom-out": "scale-bottom-out_111fj",
+  "@slide-top-in": "slide-top-in_111fj",
+  "@slide-top-out": "slide-top-out_111fj",
+  "@slide-bottom-in": "slide-bottom-in_111fj",
+  "@slide-bottom-out": "slide-bottom-out_111fj",
+  "@slide-left-in": "slide-left-in_111fj",
+  "@slide-left-out": "slide-left-out_111fj",
+  "@slide-right-in": "slide-right-in_111fj",
+  "@slide-right-out": "slide-right-out_111fj",
+  "@transform-enter": "transform-enter_111fj",
+  "--transformStart": "--transformStart_111fj",
+  "--transformEnd": "--transformEnd_111fj",
+  "@transform-exit": "transform-exit_111fj"
 });
-
 function Slide(props, ref) {
   var _ref;
-
   return _ref = sstyled(style), /*#__PURE__*/React.createElement(Animation, _ref.cn("Animation", _objectSpread(_objectSpread({
@@ -56,5 +45,4 @@ "ref": ref
 }
-
 Slide.displayName = 'Slide';
 export default createBaseComponent(Slide);
 //# sourceMappingURL=Slide.js.map

lib/es6/Transform.js

@@ -8,49 +8,37 @@ import _objectSpread from "@babel/runtime/helpers/objectSpread2";
 import Animation from './Animation';
-
 /*__reshadow-styles__:"./style/keyframes.shadow.css"*/
-var style = (
-/*__reshadow_css_start__*/
-_sstyled.insert(
-/*__inner_css_start__*/
-"@keyframes collapse-enter_8srcg{0%{overflow:hidden;height:0}to{height:var(--height_8srcg)}}@keyframes collapse-exit_8srcg{0%{height:var(--height_8srcg)}to{height:0}}@keyframes fade-in-out-enter_8srcg{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_8srcg{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_8srcg{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_8srcg{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_8srcg{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_8srcg{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_8srcg{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_8srcg{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_8srcg{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_8srcg{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_8srcg{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_8srcg{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_8srcg{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_8srcg{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_8srcg{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_8srcg{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_8srcg{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_8srcg{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_8srcg{0%{transform:var(--transformStart_8srcg)}to{transform:var(--transformEnd_8srcg)}}@keyframes transform-exit_8srcg{0%{transform:var(--transformEnd_8srcg)}to{transform:var(--transformStart_8srcg)}}"
-/*__inner_css_end__*/
-, "8srcg_gg_")
-/*__reshadow_css_end__*/
-, {
-  "@collapse-enter": "collapse-enter_8srcg",
-  "--height": "--height_8srcg",
-  "@collapse-exit": "collapse-exit_8srcg",
-  "@fade-in-out-enter": "fade-in-out-enter_8srcg",
-  "@fade-in-out-exit": "fade-in-out-exit_8srcg",
-  "@opacity-in": "opacity-in_8srcg",
-  "@opacity-out": "opacity-out_8srcg",
-  "@scale-left-in": "scale-left-in_8srcg",
-  "@scale-right-in": "scale-right-in_8srcg",
-  "@scale-top-in": "scale-top-in_8srcg",
-  "@scale-bottom-in": "scale-bottom-in_8srcg",
-  "@scale-left-out": "scale-left-out_8srcg",
-  "@scale-right-out": "scale-right-out_8srcg",
-  "@scale-top-out": "scale-top-out_8srcg",
-  "@scale-bottom-out": "scale-bottom-out_8srcg",
-  "@slide-top-in": "slide-top-in_8srcg",
-  "@slide-top-out": "slide-top-out_8srcg",
-  "@slide-bottom-in": "slide-bottom-in_8srcg",
-  "@slide-bottom-out": "slide-bottom-out_8srcg",
-  "@slide-left-in": "slide-left-in_8srcg",
-  "@slide-left-out": "slide-left-out_8srcg",
-  "@slide-right-in": "slide-right-in_8srcg",
-  "@slide-right-out": "slide-right-out_8srcg",
-  "@transform-enter": "transform-enter_8srcg",
-  "--transformStart": "--transformStart_8srcg",
-  "--transformEnd": "--transformEnd_8srcg",
-  "@transform-exit": "transform-exit_8srcg"
+var style = ( /*__reshadow_css_start__*/_sstyled.insert( /*__inner_css_start__*/"@keyframes collapse-enter_111fj{0%{overflow:hidden;height:0}to{height:var(--height_111fj)}}@keyframes collapse-exit_111fj{0%{height:var(--height_111fj)}to{height:0}}@keyframes fade-in-out-enter_111fj{0%{opacity:0}to{opacity:1}}@keyframes fade-in-out-exit_111fj{0%{opacity:1}to{opacity:0}}@keyframes opacity-in_111fj{0%{opacity:0}to{opacity:1}}@keyframes opacity-out_111fj{0%{opacity:1}to{opacity:0}}@keyframes scale-left-in_111fj{0%{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-in_111fj{0%{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}to{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-in_111fj{0%{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-in_111fj{0%{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}to{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-left-out_111fj{to{opacity:0;transform:translateX(20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-right-out_111fj{to{opacity:0;transform:translateX(-20px) scaleX(.9);pointer-events:none}0%{opacity:1;transform:translateX(0) scaleX(1);pointer-events:all}}@keyframes scale-top-out_111fj{to{opacity:0;transform:translateY(20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes scale-bottom-out_111fj{to{opacity:0;transform:translateY(-20px) scaleY(.9);pointer-events:none}0%{opacity:1;transform:translateY(0) scaleY(1);pointer-events:all}}@keyframes slide-top-in_111fj{0%{opacity:0;transform:translateY(-100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-top-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(-100px)}}@keyframes slide-bottom-in_111fj{0%{opacity:0;transform:translateY(100px)}to{opacity:1;transform:translateY(0)}}@keyframes slide-bottom-out_111fj{0%{opacity:1;transform:translateY(0)}to{opacity:0;transform:translateY(100px)}}@keyframes slide-left-in_111fj{0%{opacity:0;transform:translateX(-100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-left-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(-100px)}}@keyframes slide-right-in_111fj{0%{opacity:0;transform:translateX(100px)}to{opacity:1;transform:translateX(0)}}@keyframes slide-right-out_111fj{0%{opacity:1;transform:translateX(0)}to{opacity:0;transform:translateX(100px)}}@keyframes transform-enter_111fj{0%{transform:var(--transformStart_111fj)}to{transform:var(--transformEnd_111fj)}}@keyframes transform-exit_111fj{0%{transform:var(--transformEnd_111fj)}to{transform:var(--transformStart_111fj)}}" /*__inner_css_end__*/, "111fj_gg_") /*__reshadow_css_end__*/, {
+  "@collapse-enter": "collapse-enter_111fj",
+  "--height": "--height_111fj",
+  "@collapse-exit": "collapse-exit_111fj",
+  "@fade-in-out-enter": "fade-in-out-enter_111fj",
+  "@fade-in-out-exit": "fade-in-out-exit_111fj",
+  "@opacity-in": "opacity-in_111fj",
+  "@opacity-out": "opacity-out_111fj",
+  "@scale-left-in": "scale-left-in_111fj",
+  "@scale-right-in": "scale-right-in_111fj",
+  "@scale-top-in": "scale-top-in_111fj",
+  "@scale-bottom-in": "scale-bottom-in_111fj",
+  "@scale-left-out": "scale-left-out_111fj",
+  "@scale-right-out": "scale-right-out_111fj",
+  "@scale-top-out": "scale-top-out_111fj",
+  "@scale-bottom-out": "scale-bottom-out_111fj",
+  "@slide-top-in": "slide-top-in_111fj",
+  "@slide-top-out": "slide-top-out_111fj",
+  "@slide-bottom-in": "slide-bottom-in_111fj",
+  "@slide-bottom-out": "slide-bottom-out_111fj",
+  "@slide-left-in": "slide-left-in_111fj",
+  "@slide-left-out": "slide-left-out_111fj",
+  "@slide-right-in": "slide-right-in_111fj",
+  "@slide-right-out": "slide-right-out_111fj",
+  "@transform-enter": "transform-enter_111fj",
+  "--transformStart": "--transformStart_111fj",
+  "--transformEnd": "--transformEnd_111fj",
+  "@transform-exit": "transform-exit_111fj"
 });
-
 function Transform(props, ref) {
   var _ref;
-
   var _props$transform = props.transform,
-      transform = _props$transform === void 0 ? [] : _props$transform,
-      other = _objectWithoutProperties(props, _excluded);
-
+    transform = _props$transform === void 0 ? [] : _props$transform,
+    other = _objectWithoutProperties(props, _excluded);
   return _ref = sstyled(style), /*#__PURE__*/React.createElement(Animation, _ref.cn("Animation", _objectSpread(_objectSpread({
@@ -64,5 +52,4 @@ "ref": ref
 }
-
 Transform.displayName = 'Transform';
 export default createBaseComponent(Transform);
 //# sourceMappingURL=Transform.js.map

package.json

 {
   "name": "@semcore/animation",
   "description": "Semrush Animation Component",
-  "version": "1.10.0",
+  "version": "1.10.1",
   "main": "lib/cjs/index.js",
@@ -6,0 +6,0 @@ "module": "lib/es6/index.js",

New alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Fixed alerts

Long strings

Supply chain risk

Contains long string literals, which may be a sign of obfuscated or packed code.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

149443

increased by6.16%

Worsened metrics

Lines of code

1728

decreased by-5.26%

No dependency changes