@semcore/animation - npm Package Compare versions

Comparing version 1.1.2 to 1.1.3

CHANGELOG.md

@@ -5,2 +5,8 @@ # Changelog
 
+## [1.1.3] - 2020-12-03
+
+### Fixed
+
+- Fixed a bug in determining the height in `Collapse`.
+
 ## [1.1.2] - 2020-10-29
@@ -7,0 +13,0 @@

lib/cjs/Animation.js

@@ -40,9 +40,9 @@ "use strict";
 /*__inner_css_start__*/
-".___SAnimation_ctwo5_gg_{-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;-webkit-animation-duration:var(--sl8dr_0);animation-duration:var(--sl8dr_0);-webkit-animation-delay:var(--sl8dr_1);animation-delay:var(--sl8dr_1);-webkit-animation-name:var(--sl8dr_2);animation-name:var(--sl8dr_2)}.___SAnimation_ctwo5_gg_.__visible_ctwo5_gg_{-webkit-animation-duration:var(--sl8dr_3);animation-duration:var(--sl8dr_3);-webkit-animation-delay:var(--sl8dr_4);animation-delay:var(--sl8dr_4);-webkit-animation-name:var(--sl8dr_5);animation-name:var(--sl8dr_5)}"
+".___SAnimation_mt9ol_gg_{-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;-webkit-animation-duration:var(--sl8dr_0);animation-duration:var(--sl8dr_0);-webkit-animation-delay:var(--sl8dr_1);animation-delay:var(--sl8dr_1);-webkit-animation-name:var(--sl8dr_2);animation-name:var(--sl8dr_2)}.___SAnimation_mt9ol_gg_.__visible_mt9ol_gg_{-webkit-animation-duration:var(--sl8dr_3);animation-duration:var(--sl8dr_3);-webkit-animation-delay:var(--sl8dr_4);animation-delay:var(--sl8dr_4);-webkit-animation-name:var(--sl8dr_5);animation-name:var(--sl8dr_5)}"
 /*__inner_css_end__*/
-, "nt7k0w_gg_")
+, "18h0vrt_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SAnimation": "___SAnimation_ctwo5_gg_",
-  "_visible": "__visible_ctwo5_gg_"
+  "__SAnimation": "___SAnimation_mt9ol_gg_",
+  "_visible": "__visible_mt9ol_gg_"
 })]);
@@ -49,0 +49,0 @@

lib/cjs/Collapse.js

@@ -14,2 +14,4 @@ "use strict";
 
+var _objectWithoutProperties2 = _interopRequireDefault(require("@babel/runtime/helpers/objectWithoutProperties"));
+
 var _react = _interopRequireWildcard(require("react"));
@@ -25,12 +27,15 @@
 /*__inner_css_start__*/
-"@-webkit-keyframes _enter_1170a_gg_{0%{overflow:hidden;height:0}to{height:var(--2sogeq_0)}}@keyframes _enter_1170a_gg_{0%{overflow:hidden;height:0}to{height:var(--2sogeq_0)}}@-webkit-keyframes _exit_1170a_gg_{0%{height:var(--2sogeq_0)}to{overflow:hidden;height:0}}@keyframes _exit_1170a_gg_{0%{height:var(--2sogeq_0)}to{overflow:hidden;height:0}}"
+"@-webkit-keyframes _enter_49v8u_gg_{0%{overflow:hidden;height:0}to{height:var(--2sogeq_0)}}@keyframes _enter_49v8u_gg_{0%{overflow:hidden;height:0}to{height:var(--2sogeq_0)}}@-webkit-keyframes _exit_49v8u_gg_{0%{height:var(--2sogeq_0)}to{overflow:hidden;height:0}}@keyframes _exit_49v8u_gg_{0%{height:var(--2sogeq_0)}to{overflow:hidden;height:0}}"
 /*__inner_css_end__*/
-, "19sbv45_gg_")
+, "1iw7i2t_gg_")
 /*__reshadow_css_end__*/
 , {
-  "enter": "_enter_1170a_gg_",
-  "exit": "_exit_1170a_gg_"
+  "enter": "_enter_49v8u_gg_",
+  "exit": "_exit_49v8u_gg_"
 })]);
 
-function Collapse(props, ref) {
+function Collapse(_ref, ref) {
+  var onAnimationStart = _ref.onAnimationStart,
+      onAnimationEnd = _ref.onAnimationEnd,
+      props = (0, _objectWithoutProperties2["default"])(_ref, ["onAnimationStart", "onAnimationEnd"]);
   var SCollapse = _Animation["default"];
@@ -44,7 +49,9 @@
   var handlerAnimationStart = (0, _react.useCallback)(function (e) {
-    e.target.style.overflow = 'hidden';
+    if (onAnimationStart) onAnimationStart(e);
+    e.currentTarget.style.overflow = 'hidden';
     setHeightVar(e.target.scrollHeight + 'px');
   }, []);
   var handlerAnimationEnd = (0, _react.useCallback)(function (e) {
-    e.target.style.overflow = 'initial';
+    if (onAnimationEnd) onAnimationEnd(e);
+    e.currentTarget.style.overflow = 'initial';
     setHeightVar('auto');
@@ -51,0 +58,0 @@ }, []);

lib/cjs/FadeInOut.js

@@ -20,9 +20,9 @@ "use strict";
 /*__inner_css_start__*/
-"@-webkit-keyframes _enter_hxke8_gg_{0%{opacity:0}to{opacity:1}}@keyframes _enter_hxke8_gg_{0%{opacity:0}to{opacity:1}}@-webkit-keyframes _exit_hxke8_gg_{0%{opacity:1}to{opacity:0}}@keyframes _exit_hxke8_gg_{0%{opacity:1}to{opacity:0}}"
+"@-webkit-keyframes _enter_a7d5y_gg_{0%{opacity:0}to{opacity:1}}@keyframes _enter_a7d5y_gg_{0%{opacity:0}to{opacity:1}}@-webkit-keyframes _exit_a7d5y_gg_{0%{opacity:1}to{opacity:0}}@keyframes _exit_a7d5y_gg_{0%{opacity:1}to{opacity:0}}"
 /*__inner_css_end__*/
-, "1eo2phh_gg_")
+, "1qhkz7p_gg_")
 /*__reshadow_css_end__*/
 , {
-  "enter": "_enter_hxke8_gg_",
-  "exit": "_exit_hxke8_gg_"
+  "enter": "_enter_a7d5y_gg_",
+  "exit": "_exit_a7d5y_gg_"
 })]);
@@ -29,0 +29,0 @@

lib/cjs/Transform.js

@@ -22,9 +22,9 @@ "use strict";
 /*__inner_css_start__*/
-"@-webkit-keyframes _enter_1iptj_gg_{0%{transform:var(--1fnsxx1_0)}to{transform:var(--1fnsxx1_1)}}@keyframes _enter_1iptj_gg_{0%{transform:var(--1fnsxx1_0)}to{transform:var(--1fnsxx1_1)}}@-webkit-keyframes _exit_1iptj_gg_{0%{transform:var(--1fnsxx1_1)}to{transform:var(--1fnsxx1_0)}}@keyframes _exit_1iptj_gg_{0%{transform:var(--1fnsxx1_1)}to{transform:var(--1fnsxx1_0)}}"
+"@-webkit-keyframes _enter_199xi_gg_{0%{transform:var(--1fnsxx1_0)}to{transform:var(--1fnsxx1_1)}}@keyframes _enter_199xi_gg_{0%{transform:var(--1fnsxx1_0)}to{transform:var(--1fnsxx1_1)}}@-webkit-keyframes _exit_199xi_gg_{0%{transform:var(--1fnsxx1_1)}to{transform:var(--1fnsxx1_0)}}@keyframes _exit_199xi_gg_{0%{transform:var(--1fnsxx1_1)}to{transform:var(--1fnsxx1_0)}}"
 /*__inner_css_end__*/
-, "15kruit_gg_")
+, "m2ne2t_gg_")
 /*__reshadow_css_end__*/
 , {
-  "enter": "_enter_1iptj_gg_",
-  "exit": "_exit_1iptj_gg_"
+  "enter": "_enter_199xi_gg_",
+  "exit": "_exit_199xi_gg_"
 })]);
@@ -31,0 +31,0 @@

lib/es6/Animation.js

@@ -20,9 +20,9 @@ import _classCallCheck from "@babel/runtime/helpers/classCallCheck";
 /*__inner_css_start__*/
-".___SAnimation_ctwo5_gg_{-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;-webkit-animation-duration:var(--sl8dr_0);animation-duration:var(--sl8dr_0);-webkit-animation-delay:var(--sl8dr_1);animation-delay:var(--sl8dr_1);-webkit-animation-name:var(--sl8dr_2);animation-name:var(--sl8dr_2)}.___SAnimation_ctwo5_gg_.__visible_ctwo5_gg_{-webkit-animation-duration:var(--sl8dr_3);animation-duration:var(--sl8dr_3);-webkit-animation-delay:var(--sl8dr_4);animation-delay:var(--sl8dr_4);-webkit-animation-name:var(--sl8dr_5);animation-name:var(--sl8dr_5)}"
+".___SAnimation_mt9ol_gg_{-webkit-animation-fill-mode:both;animation-fill-mode:both;-webkit-animation-timing-function:ease-out;animation-timing-function:ease-out;-webkit-animation-duration:var(--sl8dr_0);animation-duration:var(--sl8dr_0);-webkit-animation-delay:var(--sl8dr_1);animation-delay:var(--sl8dr_1);-webkit-animation-name:var(--sl8dr_2);animation-name:var(--sl8dr_2)}.___SAnimation_mt9ol_gg_.__visible_mt9ol_gg_{-webkit-animation-duration:var(--sl8dr_3);animation-duration:var(--sl8dr_3);-webkit-animation-delay:var(--sl8dr_4);animation-delay:var(--sl8dr_4);-webkit-animation-name:var(--sl8dr_5);animation-name:var(--sl8dr_5)}"
 /*__inner_css_end__*/
-, "nt7k0w_gg_")
+, "18h0vrt_gg_")
 /*__reshadow_css_end__*/
 , {
-  "__SAnimation": "___SAnimation_ctwo5_gg_",
-  "_visible": "__visible_ctwo5_gg_"
+  "__SAnimation": "___SAnimation_mt9ol_gg_",
+  "_visible": "__visible_mt9ol_gg_"
 })]);
@@ -29,0 +29,0 @@

lib/es6/Collapse.js

 import _slicedToArray from "@babel/runtime/helpers/slicedToArray";
+import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 import React, { useCallback, useState } from 'react';
@@ -9,12 +10,16 @@ import { createBaseComponent, styled, set, create, css, map, __css__ } from '@semcore/core';
 /*__inner_css_start__*/
-"@-webkit-keyframes _enter_1170a_gg_{0%{overflow:hidden;height:0}to{height:var(--2sogeq_0)}}@keyframes _enter_1170a_gg_{0%{overflow:hidden;height:0}to{height:var(--2sogeq_0)}}@-webkit-keyframes _exit_1170a_gg_{0%{height:var(--2sogeq_0)}to{overflow:hidden;height:0}}@keyframes _exit_1170a_gg_{0%{height:var(--2sogeq_0)}to{overflow:hidden;height:0}}"
+"@-webkit-keyframes _enter_49v8u_gg_{0%{overflow:hidden;height:0}to{height:var(--2sogeq_0)}}@keyframes _enter_49v8u_gg_{0%{overflow:hidden;height:0}to{height:var(--2sogeq_0)}}@-webkit-keyframes _exit_49v8u_gg_{0%{height:var(--2sogeq_0)}to{overflow:hidden;height:0}}@keyframes _exit_49v8u_gg_{0%{height:var(--2sogeq_0)}to{overflow:hidden;height:0}}"
 /*__inner_css_end__*/
-, "19sbv45_gg_")
+, "1iw7i2t_gg_")
 /*__reshadow_css_end__*/
 , {
-  "enter": "_enter_1170a_gg_",
-  "exit": "_exit_1170a_gg_"
+  "enter": "_enter_49v8u_gg_",
+  "exit": "_exit_49v8u_gg_"
 })]);
 
-function Collapse(props, ref) {
+function Collapse(_ref, ref) {
+  var onAnimationStart = _ref.onAnimationStart,
+      onAnimationEnd = _ref.onAnimationEnd,
+      props = _objectWithoutProperties(_ref, ["onAnimationStart", "onAnimationEnd"]);
+
   var SCollapse = Animation;
@@ -28,7 +33,9 @@
   var handlerAnimationStart = useCallback(function (e) {
-    e.target.style.overflow = 'hidden';
+    if (onAnimationStart) onAnimationStart(e);
+    e.currentTarget.style.overflow = 'hidden';
     setHeightVar(e.target.scrollHeight + 'px');
   }, []);
   var handlerAnimationEnd = useCallback(function (e) {
-    e.target.style.overflow = 'initial';
+    if (onAnimationEnd) onAnimationEnd(e);
+    e.currentTarget.style.overflow = 'initial';
     setHeightVar('auto');
@@ -35,0 +42,0 @@ }, []);

lib/es6/FadeInOut.js

@@ -8,9 +8,9 @@ import React from 'react';
 /*__inner_css_start__*/
-"@-webkit-keyframes _enter_hxke8_gg_{0%{opacity:0}to{opacity:1}}@keyframes _enter_hxke8_gg_{0%{opacity:0}to{opacity:1}}@-webkit-keyframes _exit_hxke8_gg_{0%{opacity:1}to{opacity:0}}@keyframes _exit_hxke8_gg_{0%{opacity:1}to{opacity:0}}"
+"@-webkit-keyframes _enter_a7d5y_gg_{0%{opacity:0}to{opacity:1}}@keyframes _enter_a7d5y_gg_{0%{opacity:0}to{opacity:1}}@-webkit-keyframes _exit_a7d5y_gg_{0%{opacity:1}to{opacity:0}}@keyframes _exit_a7d5y_gg_{0%{opacity:1}to{opacity:0}}"
 /*__inner_css_end__*/
-, "1eo2phh_gg_")
+, "1qhkz7p_gg_")
 /*__reshadow_css_end__*/
 , {
-  "enter": "_enter_hxke8_gg_",
-  "exit": "_exit_hxke8_gg_"
+  "enter": "_enter_a7d5y_gg_",
+  "exit": "_exit_a7d5y_gg_"
 })]);
@@ -17,0 +17,0 @@

lib/es6/Transform.js

@@ -9,9 +9,9 @@ import _objectWithoutProperties from "@babel/runtime/helpers/objectWithoutProperties";
 /*__inner_css_start__*/
-"@-webkit-keyframes _enter_1iptj_gg_{0%{transform:var(--1fnsxx1_0)}to{transform:var(--1fnsxx1_1)}}@keyframes _enter_1iptj_gg_{0%{transform:var(--1fnsxx1_0)}to{transform:var(--1fnsxx1_1)}}@-webkit-keyframes _exit_1iptj_gg_{0%{transform:var(--1fnsxx1_1)}to{transform:var(--1fnsxx1_0)}}@keyframes _exit_1iptj_gg_{0%{transform:var(--1fnsxx1_1)}to{transform:var(--1fnsxx1_0)}}"
+"@-webkit-keyframes _enter_199xi_gg_{0%{transform:var(--1fnsxx1_0)}to{transform:var(--1fnsxx1_1)}}@keyframes _enter_199xi_gg_{0%{transform:var(--1fnsxx1_0)}to{transform:var(--1fnsxx1_1)}}@-webkit-keyframes _exit_199xi_gg_{0%{transform:var(--1fnsxx1_1)}to{transform:var(--1fnsxx1_0)}}@keyframes _exit_199xi_gg_{0%{transform:var(--1fnsxx1_1)}to{transform:var(--1fnsxx1_0)}}"
 /*__inner_css_end__*/
-, "15kruit_gg_")
+, "m2ne2t_gg_")
 /*__reshadow_css_end__*/
 , {
-  "enter": "_enter_1iptj_gg_",
-  "exit": "_exit_1iptj_gg_"
+  "enter": "_enter_199xi_gg_",
+  "exit": "_exit_199xi_gg_"
 })]);
@@ -18,0 +18,0 @@

package.json

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

New alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Fixed alerts

License Policy Violation

License

This package is not allowed per your license policy. Review the package's license to ensure compliance.

Found 1 instance in 1 package

Improved metrics

Total package byte prevSize

55839

increased by3.29%

Lines of code

800

increased by1.91%

No dependency changes