baby-i-am-faded - npm Package Compare versions

Comparing version 1.0.3 to 2.0.1

dist/index.d.ts

@@ -40,4 +40,4 @@ import { Keyframes } from '@emotion/serialize';
     timingFunction?: string;
-    keyframes?: Keyframes;
+    keyframes?: any;
     iterationCount?: number;
-}): import("@emotion/utils").SerializedStyles;
+}): import("@emotion/react").SerializedStyles;

dist/index.js

@@ -37,8 +37,8 @@ "use strict";
 /** @jsx jsx */
-var core_1 = require("@emotion/core");
-var react_1 = __importStar(require("react"));
+var react_1 = require("@emotion/react");
+var react_2 = __importStar(require("react"));
 var react_intersection_observer_1 = require("react-intersection-observer");
 var react_is_1 = require("react-is");
 var support_1 = require("./support");
-exports.Faded = react_1.forwardRef(function (_a, ref1) {
+exports.Faded = react_2.forwardRef(function (_a, ref1) {
     var _b = _a.cascade, cascade = _b === void 0 ? false : _b, _c = _a.damping, damping = _c === void 0 ? 0.3 : _c, _d = _a.duration, duration = _d === void 0 ? 400 : _d, _e = _a.threshold, threshold = _e === void 0 ? 0.15 : _e, _f = _a.triggerOnce, triggerOnce = _f === void 0 ? false : _f, _g = _a.animation, animation = _g === void 0 ? support_1.fadeInUp : _g, _h = _a.whenInView, whenInView = _h === void 0 ? false : _h, _j = _a.delay, delay = _j === void 0 ? 0 : _j, children = _a.children, rest = __rest(_a, ["cascade", "damping", "duration", "threshold", "triggerOnce", "animation", "whenInView", "delay", "children"]);
@@ -51,3 +51,3 @@ function makeAnimated(_a) {
         if (react_is_1.isFragment(nodes)) {
-            return core_1.jsx('div', {
+            return react_1.jsx('div', {
                 css: getAnimationCss({ keyframes: animation, delay: delay }),
@@ -60,3 +60,3 @@ }, nodes);
             return words_1.map(function (word, index) {
-                return (core_1.jsx("span", { style: {
+                return (react_1.jsx("span", { style: {
                         display: 'inline-block',
@@ -72,5 +72,5 @@ whiteSpace: 'pre',
         }
-        return react_1.default.Children.map(nodes, function (node, index) {
+        return react_2.default.Children.map(nodes, function (node, index) {
             var _a, _b;
-            if (!react_1.isValidElement(node)) {
+            if (!react_2.isValidElement(node)) {
                 return node;
@@ -99,14 +99,14 @@ }
     if (whenInView) {
-        return (core_1.jsx(react_intersection_observer_1.InView, __assign({ threshold: threshold, triggerOnce: triggerOnce }, rest), function (_a) {
+        return (react_1.jsx(react_intersection_observer_1.InView, __assign({ threshold: threshold, triggerOnce: triggerOnce }, rest), function (_a) {
             var inView = _a.inView, ref = _a.ref, entry = _a.entry;
-            return (core_1.jsx("div", { ref: ref }, makeAnimated({ inView: inView, nodes: children })));
+            return (react_1.jsx("div", { ref: ref }, makeAnimated({ inView: inView, nodes: children })));
         }));
     }
-    return (core_1.jsx("div", __assign({ ref: ref1 }, rest), makeAnimated({ inView: true, nodes: children })));
+    return (react_1.jsx("div", __assign({ ref: ref1 }, rest), makeAnimated({ inView: true, nodes: children })));
 });
 function getAnimationCss(_a) {
     var _b = _a.duration, duration = _b === void 0 ? 1000 : _b, _c = _a.delay, delay = _c === void 0 ? 0 : _c, _d = _a.timingFunction, timingFunction = _d === void 0 ? 'ease' : _d, _e = _a.keyframes, keyframes = _e === void 0 ? support_1.fadeInUp : _e, _f = _a.iterationCount, iterationCount = _f === void 0 ? 1 : _f;
-    return core_1.css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n        animation-duration: ", "ms;\n        animation-timing-function: ", ";\n        animation-delay: ", "ms;\n        animation-name: ", ";\n        animation-direction: normal;\n        animation-fill-mode: both;\n        animation-iteration-count: ", ";\n    "], ["\n        animation-duration: ", "ms;\n        animation-timing-function: ", ";\n        animation-delay: ", "ms;\n        animation-name: ", ";\n        animation-direction: normal;\n        animation-fill-mode: both;\n        animation-iteration-count: ", ";\n    "])), duration, timingFunction, delay, keyframes, iterationCount);
+    return react_1.css(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n        animation-duration: ", "ms;\n        animation-timing-function: ", ";\n        animation-delay: ", "ms;\n        animation-name: ", ";\n        animation-direction: normal;\n        animation-fill-mode: both;\n        animation-iteration-count: ", ";\n    "], ["\n        animation-duration: ", "ms;\n        animation-timing-function: ", ";\n        animation-delay: ", "ms;\n        animation-name: ", ";\n        animation-direction: normal;\n        animation-fill-mode: both;\n        animation-iteration-count: ", ";\n    "])), duration, timingFunction, delay, keyframes, iterationCount);
 }
 exports.getAnimationCss = getAnimationCss;
 var templateObject_1;

dist/support.js

@@ -22,6 +22,6 @@ "use strict";
 /** @jsx jsx */
-var core_1 = require("@emotion/core");
-var react_1 = __importDefault(require("react"));
+var react_1 = require("@emotion/react");
+var react_2 = __importDefault(require("react"));
 exports.cloneElement = function (element, props) {
-    return core_1.jsx(element.type, __assign(__assign({ key: element.key, ref: element.ref }, element.props), props));
+    return react_1.jsx(element.type, __assign(__assign({ key: element.key, ref: element.ref }, element.props), props));
 };
@@ -33,4 +33,4 @@ function useCombinedRefs() {
     }
-    var targetRef = react_1.default.useRef();
-    react_1.default.useEffect(function () {
+    var targetRef = react_2.default.useRef();
+    react_2.default.useEffect(function () {
         refs.forEach(function (ref) {
@@ -50,3 +50,3 @@ if (!ref)
 exports.useCombinedRefs = useCombinedRefs;
-exports.fadeInUp = core_1.keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    from {\n        opacity: 0;\n        transform: translate3d(0px, -20px, 0px);\n    }\n    to {\n        opacity: 1;\n        transform: 'none';\n    }\n"], ["\n    from {\n        opacity: 0;\n        transform: translate3d(0px, -20px, 0px);\n    }\n    to {\n        opacity: 1;\n        transform: 'none';\n    }\n"])));
+exports.fadeInUp = react_1.keyframes(templateObject_1 || (templateObject_1 = __makeTemplateObject(["\n    from {\n        opacity: 0;\n        transform: translate3d(0px, -20px, 0px);\n    }\n    to {\n        opacity: 1;\n        transform: 'none';\n    }\n"], ["\n    from {\n        opacity: 0;\n        transform: translate3d(0px, -20px, 0px);\n    }\n    to {\n        opacity: 1;\n        transform: 'none';\n    }\n"])));
 var templateObject_1;

esm/index.d.ts

@@ -40,4 +40,4 @@ import { Keyframes } from '@emotion/serialize';
     timingFunction?: string;
-    keyframes?: Keyframes;
+    keyframes?: any;
     iterationCount?: number;
-}): import("@emotion/utils").SerializedStyles;
+}): import("@emotion/react").SerializedStyles;

esm/index.js

@@ -28,3 +28,3 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
 /** @jsx jsx */
-import { css, jsx } from '@emotion/core';
+import { css, jsx } from '@emotion/react';
 import React, { forwardRef, isValidElement } from 'react';
@@ -31,0 +31,0 @@ import { InView } from 'react-intersection-observer';

esm/support.js

@@ -17,3 +17,3 @@ var __makeTemplateObject = (this && this.__makeTemplateObject) || function (cooked, raw) {
 /** @jsx jsx */
-import { jsx, keyframes } from '@emotion/core';
+import { jsx, keyframes } from '@emotion/react';
 import React from 'react';
@@ -20,0 +20,0 @@ export var cloneElement = function (element, props) {

package.json

 {
     "name": "baby-i-am-faded",
     "_": "[bump if baby-i-am-faded]",
-    "version": "1.0.3",
+    "version": "2.0.1",
     "description": "",
@@ -35,4 +35,4 @@ "main": "dist/index.js",
         "@babel/core": "^7.9.0",
-        "@chakra-ui/core": "^0.7.0",
-        "@emotion/core": "^10.0.28",
+        "@chakra-ui/react": "latest",
+        "@emotion/react": "^11",
         "@storybook/addon-actions": "^5.3.17",
@@ -49,7 +49,6 @@ "@storybook/addon-links": "^5.3.17",
         "dotenv": "^8.2.0",
-        "emotion-theming": "^10.0.27",
         "mocha": "^6.1.4",
         "react": "^16.13.1",
         "react-dom": "^16.13.1",
-        "react-emotion-animations": "*",
+        "react-emotion-animations": "2.x.x",
         "sucrase": "^3.12.1",
@@ -60,10 +59,10 @@ "ts-loader": "^6.2.2",
     "peerDependencies": {
-        "@emotion/core": "*"
+        "@emotion/react": "*"
     },
     "dependencies": {
-        "@emotion/serialize": "^0.11.16",
-        "@emotion/styled": "^10.0.27",
-        "react-intersection-observer": "^8.26.1",
+        "@emotion/serialize": "^1.0.0",
+        "@emotion/styled": "^11",
+        "react-intersection-observer": "^8.31.0",
         "react-is": "^16.13.1"
     }
 }

src/support.ts

 /** @jsx jsx */
-import { jsx, keyframes } from '@emotion/core'
+import { jsx, keyframes } from '@emotion/react'
 import React from 'react'
@@ -4,0 +4,0 @@

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

Dev dependency count

21

decreased by-4.55%

Worsened metrics

Total package byte prevSize

26364

decreased by-0.08%

Dependency changes

• + Added@emotion/babel-plugin@11.13.5(transitive)

• + Added@emotion/cache@11.13.5(transitive)

• + Added@emotion/hash@0.9.2(transitive)

• + Added@emotion/is-prop-valid@1.3.1(transitive)

• + Added@emotion/memoize@0.9.0(transitive)

• + Added@emotion/react@11.13.5(transitive)

• + Added@emotion/serialize@1.3.3(transitive)

• + Added@emotion/sheet@1.4.0(transitive)

• + Added@emotion/styled@11.13.5(transitive)

• + Added@emotion/unitless@0.10.0(transitive)

• + Added@emotion/use-insertion-effect-with-fallbacks@1.1.0(transitive)

• + Added@emotion/utils@1.4.2(transitive)

• + Added@emotion/weak-memoize@0.4.0(transitive)

• + Addedbabel-plugin-macros@3.1.0(transitive)

• + Addedcosmiconfig@7.1.0(transitive)

• + Addedcsstype@3.1.3(transitive)

• + Addedescape-string-regexp@4.0.0(transitive)

• + Addedhoist-non-react-statics@3.3.2(transitive)

• + Addedstylis@4.2.0(transitive)

• - Removed@emotion/cache@10.0.29(transitive)

• - Removed@emotion/core@10.3.111.0.0(transitive)

• - Removed@emotion/css@10.0.27(transitive)

• - Removed@emotion/hash@0.8.0(transitive)

• - Removed@emotion/is-prop-valid@0.8.8(transitive)

• - Removed@emotion/memoize@0.7.4(transitive)

• - Removed@emotion/serialize@0.11.16(transitive)

• - Removed@emotion/sheet@0.9.4(transitive)

• - Removed@emotion/styled@10.3.0(transitive)

• - Removed@emotion/styled-base@10.3.0(transitive)

• - Removed@emotion/stylis@0.8.5(transitive)

• - Removed@emotion/unitless@0.7.5(transitive)

• - Removed@emotion/utils@0.11.3(transitive)

• - Removed@emotion/weak-memoize@0.2.5(transitive)

• - Removedbabel-plugin-emotion@10.2.2(transitive)

• - Removedbabel-plugin-macros@2.8.0(transitive)

• - Removedbabel-plugin-syntax-jsx@6.18.0(transitive)

• - Removedcosmiconfig@6.0.0(transitive)

• - Removedcsstype@2.6.21(transitive)

• - Removedescape-string-regexp@1.0.5(transitive)

• Updated@emotion/serialize@^1.0.0

• Updated@emotion/styled@^11

• Updatedreact-intersection-observer@^8.31.0