react-in-viewport - npm Package Compare versions

Comparing version 1.0.0-alpha.20 to 1.0.0-alpha.21

dist/__tests__/index.js

@@ -9,8 +9,12 @@ "use strict";
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+var _jsxRuntime = require("react/jsx-runtime");
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
 var DemoClass = /*#__PURE__*/function (_PureComponent) {
@@ -27,10 +31,12 @@ _inheritsLoose(DemoClass, _PureComponent);
     var inViewport = this.props.inViewport;
-    return /*#__PURE__*/_react["default"].createElement("div", {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       style: {
         width: '400px',
         height: '300px'
-      }
-    }, /*#__PURE__*/_react["default"].createElement("span", {
-      className: "content"
-    }, inViewport ? 'in viewport' : 'not in viewport'));
+      },
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        className: "content",
+        children: inViewport ? 'in viewport' : 'not in viewport'
+      })
+    });
   };
@@ -44,15 +50,14 @@
     var TestNode = (0, _index.handleViewport)(DemoClass);
-    var tree = (0, _enzyme.mount)( /*#__PURE__*/_react["default"].createElement(TestNode, null));
+    var tree = (0, _enzyme.mount)( /*#__PURE__*/(0, _jsxRuntime.jsx)(TestNode, {}));
     expect(tree.find('.content').text()).toEqual('not in viewport');
-  });
-  it.skip('scroll render', function () {
-    // until jsdom support observer
-    jest.useFakeTimers();
-    var TestNode = (0, _index.handleViewport)(DemoClass);
-    var tree = (0, _enzyme.mount)( /*#__PURE__*/_react["default"].createElement(TestNode, null));
-    global.document.scrollTop = 200;
-    jest.runOnlyPendingTimers();
-    tree.update();
-    expect(tree.find('.content').text()).toEqual('in viewport');
-  });
+  }); // it.skip('scroll render', () => {
+  //   // until jsdom support observer
+  //   jest.useFakeTimers();
+  //   const TestNode = handleViewport(DemoClass);
+  //   const tree = mount(<TestNode />);
+  //   global.document.scrollTop = 200;
+  //   jest.runOnlyPendingTimers();
+  //   tree.update();
+  //   expect(tree.find('.content').text()).toEqual('in viewport');
+  // });
 });

dist/es/lib/constants.js

 "use strict";
 
 exports.__esModule = true;
-exports.defaultProps = exports.noop = exports.defaultConfig = exports.defaultOptions = void 0;
+exports.noop = exports.defaultProps = exports.defaultOptions = exports.defaultConfig = void 0;
 var defaultOptions = {};
@@ -6,0 +6,0 @@ exports.defaultOptions = defaultOptions;

dist/es/lib/handleViewport.js

@@ -6,3 +6,3 @@ "use strict";
 
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 
@@ -15,10 +15,8 @@ var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
+var _jsxRuntime = require("react/jsx-runtime");
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+var _excluded = ["onEnterViewport", "onLeaveViewport"];
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { default: obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj.default = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { default: obj }; }
 
-function _objectWithoutProperties(source, excluded) { if (source == null) return {}; var target = _objectWithoutPropertiesLoose(source, excluded); var key, i; if (Object.getOwnPropertySymbols) { var sourceSymbolKeys = Object.getOwnPropertySymbols(source); for (i = 0; i < sourceSymbolKeys.length; i++) { key = sourceSymbolKeys[i]; if (excluded.indexOf(key) >= 0) continue; if (!Object.prototype.propertyIsEnumerable.call(source, key)) continue; target[key] = source[key]; } } return target; }
-
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -28,8 +26,2 @@
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 var isFunctionalComponent = Component => {
@@ -42,15 +34,3 @@ return typeof Component === 'function' && !(Component.prototype && Component.prototype.render);
 };
-/**
- * @template P
- * @param {ReactNode} TargetComponent
- * @param {IntersectionObserverInit} [options = defaultOptions]
- * @param {Object} [config = defaultConfig]
- * @param {boolean} [config.disconnectOnLeave = false]
- * @returns {ComponentType<P & {
-      onEnterViewport?: VoidFunction
-      onLeaveViewport?: VoidFunction
-    }>}
- */
 
-
 function handleViewport(TargetComponent, options, config) {
@@ -66,3 +46,3 @@ if (options === void 0) {
   var ForwardedRefComponent = /*#__PURE__*/(0, _react.forwardRef)((props, ref) => {
-    var refProps = _objectSpread({
+    var refProps = _extends({
       forwardedRef: ref
@@ -73,6 +53,6 @@ }, isReactComponent(TargetComponent) && !isFunctionalComponent(TargetComponent) ? {
 
-    return /*#__PURE__*/_react.default.createElement(TargetComponent, _extends({}, props, refProps));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(TargetComponent, _extends({}, props, refProps));
   });
 
-  var InViewport = (_ref) => {
+  var InViewport = _ref => {
     var {
@@ -82,3 +62,3 @@ onEnterViewport = _constants.noop,
     } = _ref,
-        restProps = _objectWithoutProperties(_ref, ["onEnterViewport", "onLeaveViewport"]);
+        restProps = _objectWithoutPropertiesLoose(_ref, _excluded);
 
@@ -94,3 +74,3 @@ var node = (0, _react.useRef)();
     });
-    return /*#__PURE__*/_react.default.createElement(ForwardedRefComponent, _extends({}, restProps, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(ForwardedRefComponent, _extends({}, restProps, {
       inViewport: inViewport,
@@ -97,0 +77,0 @@ enterCount: enterCount,

dist/es/lib/useInViewport.js

@@ -12,19 +12,2 @@ "use strict";
 
-// React hooks
-// eslint-disable-next-line no-unused-vars
-
-/**
- *
- * @param {MutableRefObject} target
- * @param {IntersectionObserverInit} [options = defaultOptions]
- * @param {Object} [config = defaultConfig]
- * @param {boolean} [config.disconnectOnLeave = false]
- * @param {Object} [props = defaultProps]
- * @param {VoidFunction} [props.onEnterViewport = noop]
- * @param {VoidFunction} [props.onLeaveViewport = noop]
- * @returns {Object} returnObject
- * @returns {boolean} returnObject.inViewport
- * @returns {number} returnObject.enterCount
- * @returns {number} returnObject.leaveCount
- */
 var useInViewport = function useInViewport(target, options, config, props) {
@@ -97,3 +80,3 @@ if (options === void 0) {
       intersected.current = true;
-      onEnterViewport && onEnterViewport();
+      onEnterViewport == null ? void 0 : onEnterViewport();
       enterCountRef.current += 1;
@@ -108,3 +91,3 @@ inViewportRef.current = isInViewport;
       intersected.current = false;
-      onLeaveViewport && onLeaveViewport();
+      onLeaveViewport == null ? void 0 : onLeaveViewport();
 
@@ -128,3 +111,2 @@ if (config.disconnectOnLeave && observer.current) {
     if (!observerRef) {
-      // $FlowFixMe
       observer.current = new IntersectionObserver(handleIntersection, options);
@@ -131,0 +113,0 @@ return observer.current;

dist/lib/constants.js

 "use strict";
 
 exports.__esModule = true;
-exports.defaultProps = exports.noop = exports.defaultConfig = exports.defaultOptions = void 0;
+exports.noop = exports.defaultProps = exports.defaultOptions = exports.defaultConfig = void 0;
 var defaultOptions = {};
@@ -6,0 +6,0 @@ exports.defaultOptions = defaultOptions;

dist/lib/handleViewport.js

@@ -6,3 +6,3 @@ "use strict";
 
-var _react = _interopRequireWildcard(require("react"));
+var _react = require("react");
 
@@ -15,7 +15,7 @@ var _hoistNonReactStatics = _interopRequireDefault(require("hoist-non-react-statics"));
 
-function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
+var _jsxRuntime = require("react/jsx-runtime");
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+var _excluded = ["onEnterViewport", "onLeaveViewport"];
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
@@ -26,8 +26,2 @@ function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 var isFunctionalComponent = function isFunctionalComponent(Component) {
@@ -40,15 +34,3 @@ return typeof Component === 'function' && !(Component.prototype && Component.prototype.render);
 };
-/**
- * @template P
- * @param {ReactNode} TargetComponent
- * @param {IntersectionObserverInit} [options = defaultOptions]
- * @param {Object} [config = defaultConfig]
- * @param {boolean} [config.disconnectOnLeave = false]
- * @returns {ComponentType<P & {
-      onEnterViewport?: VoidFunction
-      onLeaveViewport?: VoidFunction
-    }>}
- */
 
-
 function handleViewport(TargetComponent, options, config) {
@@ -64,3 +46,3 @@ if (options === void 0) {
   var ForwardedRefComponent = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-    var refProps = _objectSpread({
+    var refProps = _extends({
       forwardedRef: ref
@@ -71,3 +53,3 @@ }, isReactComponent(TargetComponent) && !isFunctionalComponent(TargetComponent) ? {
 
-    return /*#__PURE__*/_react["default"].createElement(TargetComponent, _extends({}, props, refProps));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(TargetComponent, _extends({}, props, refProps));
   });
@@ -80,3 +62,3 @@
         onLeaveViewport = _ref$onLeaveViewport === void 0 ? _constants.noop : _ref$onLeaveViewport,
-        restProps = _objectWithoutPropertiesLoose(_ref, ["onEnterViewport", "onLeaveViewport"]);
+        restProps = _objectWithoutPropertiesLoose(_ref, _excluded);
 
@@ -93,3 +75,3 @@ var node = (0, _react.useRef)();
 
-    return /*#__PURE__*/_react["default"].createElement(ForwardedRefComponent, _extends({}, restProps, {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(ForwardedRefComponent, _extends({}, restProps, {
       inViewport: inViewport,
@@ -96,0 +78,0 @@ enterCount: enterCount,

dist/lib/useInViewport.js

@@ -12,19 +12,2 @@ "use strict";
 
-// React hooks
-// eslint-disable-next-line no-unused-vars
-
-/**
- *
- * @param {MutableRefObject} target
- * @param {IntersectionObserverInit} [options = defaultOptions]
- * @param {Object} [config = defaultConfig]
- * @param {boolean} [config.disconnectOnLeave = false]
- * @param {Object} [props = defaultProps]
- * @param {VoidFunction} [props.onEnterViewport = noop]
- * @param {VoidFunction} [props.onLeaveViewport = noop]
- * @returns {Object} returnObject
- * @returns {boolean} returnObject.inViewport
- * @returns {number} returnObject.enterCount
- * @returns {number} returnObject.leaveCount
- */
 var useInViewport = function useInViewport(target, options, config, props) {
@@ -93,3 +76,3 @@ if (options === void 0) {
       intersected.current = true;
-      onEnterViewport && onEnterViewport();
+      onEnterViewport == null ? void 0 : onEnterViewport();
       enterCountRef.current += 1;
@@ -104,3 +87,3 @@ inViewportRef.current = isInViewport;
       intersected.current = false;
-      onLeaveViewport && onLeaveViewport();
+      onLeaveViewport == null ? void 0 : onLeaveViewport();
 
@@ -122,3 +105,2 @@ if (config.disconnectOnLeave && observer.current) {
     if (!observerRef) {
-      // $FlowFixMe
       observer.current = new IntersectionObserver(handleIntersection, options);
@@ -125,0 +107,0 @@ return observer.current;

dist/next/lib/handleViewport.js

@@ -0,1 +1,3 @@
+var _excluded = ["onEnterViewport", "onLeaveViewport"];
+
 function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -5,14 +7,7 @@
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
-// HOC for handleViewport
-// eslint-disable-next-line no-unused-vars
-import React, { useRef, forwardRef, ReactNode, ComponentType } from 'react';
+import { useRef, forwardRef } from 'react';
 import hoistNonReactStatic from 'hoist-non-react-statics';
 import useInViewport from './useInViewport';
 import { noop, defaultOptions, defaultConfig } from './constants';
+import { jsx as _jsx } from "react/jsx-runtime";
 
@@ -26,15 +21,3 @@ var isFunctionalComponent = function isFunctionalComponent(Component) {
 };
-/**
- * @template P
- * @param {ReactNode} TargetComponent
- * @param {IntersectionObserverInit} [options = defaultOptions]
- * @param {Object} [config = defaultConfig]
- * @param {boolean} [config.disconnectOnLeave = false]
- * @returns {ComponentType<P & {
-      onEnterViewport?: VoidFunction
-      onLeaveViewport?: VoidFunction
-    }>}
- */
 
-
 function handleViewport(TargetComponent, options, config) {
@@ -50,3 +33,3 @@ if (options === void 0) {
   var ForwardedRefComponent = /*#__PURE__*/forwardRef(function (props, ref) {
-    var refProps = _objectSpread({
+    var refProps = _extends({
       forwardedRef: ref
@@ -57,3 +40,3 @@ }, isReactComponent(TargetComponent) && !isFunctionalComponent(TargetComponent) ? {
 
-    return /*#__PURE__*/React.createElement(TargetComponent, _extends({}, props, refProps));
+    return /*#__PURE__*/_jsx(TargetComponent, _extends({}, props, refProps));
   });
@@ -66,3 +49,3 @@
         onLeaveViewport = _ref$onLeaveViewport === void 0 ? noop : _ref$onLeaveViewport,
-        restProps = _objectWithoutPropertiesLoose(_ref, ["onEnterViewport", "onLeaveViewport"]);
+        restProps = _objectWithoutPropertiesLoose(_ref, _excluded);
 
@@ -79,3 +62,3 @@ var node = useRef();
 
-    return /*#__PURE__*/React.createElement(ForwardedRefComponent, _extends({}, restProps, {
+    return /*#__PURE__*/_jsx(ForwardedRefComponent, _extends({}, restProps, {
       inViewport: inViewport,
@@ -82,0 +65,0 @@ enterCount: enterCount,

dist/next/lib/useInViewport.js

@@ -1,20 +0,4 @@
-// React hooks
-// eslint-disable-next-line no-unused-vars
-import { useEffect, useRef, useState, MutableRefObject } from 'react';
+import { useEffect, useRef, useState } from 'react';
 import { findDOMNode } from 'react-dom';
 import { defaultOptions, defaultConfig, defaultProps } from './constants';
-/**
- *
- * @param {MutableRefObject} target
- * @param {IntersectionObserverInit} [options = defaultOptions]
- * @param {Object} [config = defaultConfig]
- * @param {boolean} [config.disconnectOnLeave = false]
- * @param {Object} [props = defaultProps]
- * @param {VoidFunction} [props.onEnterViewport = noop]
- * @param {VoidFunction} [props.onLeaveViewport = noop]
- * @returns {Object} returnObject
- * @returns {boolean} returnObject.inViewport
- * @returns {number} returnObject.enterCount
- * @returns {number} returnObject.leaveCount
- */
 
@@ -84,3 +68,3 @@ var useInViewport = function useInViewport(target, options, config, props) {
       intersected.current = true;
-      onEnterViewport && onEnterViewport();
+      onEnterViewport == null ? void 0 : onEnterViewport();
       enterCountRef.current += 1;
@@ -95,3 +79,3 @@ inViewportRef.current = isInViewport;
       intersected.current = false;
-      onLeaveViewport && onLeaveViewport();
+      onLeaveViewport == null ? void 0 : onLeaveViewport();
 
@@ -113,3 +97,2 @@ if (config.disconnectOnLeave && observer.current) {
     if (!observerRef) {
-      // $FlowFixMe
       observer.current = new IntersectionObserver(handleIntersection, options);
@@ -116,0 +99,0 @@ return observer.current;

dist/stories/common/constants.js

 "use strict";
 
 exports.__esModule = true;
-exports.LOADED = exports.LOADING = exports.INIT = exports.ERROR = void 0;
+exports.LOADING = exports.LOADED = exports.INIT = exports.ERROR = void 0;
 var ERROR = -1;
@@ -6,0 +6,0 @@ exports.ERROR = ERROR;

dist/stories/common/Iframe.js

@@ -12,10 +12,16 @@ "use strict";
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
+
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
+
 var Iframe = /*#__PURE__*/function (_PureComponent) {
@@ -49,4 +55,3 @@ _inheritsLoose(Iframe, _PureComponent);
         src = _this$props.src,
-        ratio = _this$props.ratio,
-        forwardedRef = _this$props.forwardedRef;
+        ratio = _this$props.ratio;
     var Component = this.state.loaded ? 'iframe' : 'div';
@@ -57,3 +62,3 @@ var props = this.state.loaded ? {
     } : {};
-    return /*#__PURE__*/_react["default"].createElement(_reactAspectRatio["default"], {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactAspectRatio["default"], {
       ratio: ratio,
@@ -63,4 +68,5 @@ style: {
         backgroundColor: 'rgba(0,0,0,.12)'
-      }
-    }, /*#__PURE__*/_react["default"].createElement(Component, props));
+      },
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, _extends({}, props))
+    });
   };
@@ -67,0 +73,0 @@

dist/stories/common/IframeFunctional.js

@@ -12,8 +12,12 @@ "use strict";
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
+
 var IframeFunctional = function IframeFunctional(props) {
@@ -39,3 +43,3 @@ var inViewport = props.inViewport,
   } : {};
-  return /*#__PURE__*/_react["default"].createElement(_reactAspectRatio["default"], {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactAspectRatio["default"], {
     ratio: ratio,
@@ -46,4 +50,5 @@ style: {
     },
-    ref: forwardedRef
-  }, /*#__PURE__*/_react["default"].createElement(Component, componentProps));
+    ref: forwardedRef,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)(Component, _extends({}, componentProps))
+  });
 };
@@ -50,0 +55,0 @@

dist/stories/common/Image.js

@@ -14,14 +14,14 @@ "use strict";
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _assertThisInitialized(self) { if (self === void 0) { throw new ReferenceError("this hasn't been initialised - super() hasn't been called"); } return self; }
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
 
-function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
 var DUMMY_IMAGE_SRC = 'https://www.gstatic.com/psa/static/1.gif';
@@ -38,3 +38,3 @@
 
-    _defineProperty(_assertThisInitialized(_this), "loadImage", function (src) {
+    _this.loadImage = function (src) {
       var img = new Image(); // eslint-disable-line
@@ -55,5 +55,5 @@
       img.src = src;
-    });
+    };
 
-    _defineProperty(_assertThisInitialized(_this), "getBackgroundColor", function () {
+    _this.getBackgroundColor = function () {
       var status = _this.state.status;
@@ -72,3 +72,3 @@
       }
-    });
+    };
 
@@ -97,4 +97,3 @@ _this.state = {
   _proto.render = function render() {
-    var status = this.state.status;
-    return /*#__PURE__*/_react["default"].createElement(_reactAspectRatio["default"], {
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactAspectRatio["default"], {
       ratio: this.props.ratio,
@@ -106,7 +105,8 @@ style: {
         backgroundColor: this.getBackgroundColor()
-      }
-    }, /*#__PURE__*/_react["default"].createElement("img", {
-      src: this.state.src,
-      alt: "demo"
-    }));
+      },
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+        src: this.state.src,
+        alt: "demo"
+      })
+    });
   };
@@ -113,0 +113,0 @@

dist/stories/common/ImageFunctional.js

@@ -14,7 +14,9 @@ "use strict";
 
+var _jsxRuntime = require("react/jsx-runtime");
+
 function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
@@ -71,3 +73,3 @@ var DUMMY_IMAGE_SRC = 'https://www.gstatic.com/psa/static/1.gif';
 
-  return /*#__PURE__*/_react["default"].createElement(_reactAspectRatio["default"], {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(_reactAspectRatio["default"], {
     ratio: ratio,
@@ -80,7 +82,8 @@ style: {
     },
-    ref: forwardedRef
-  }, /*#__PURE__*/_react["default"].createElement("img", {
-    src: src,
-    alt: "demo"
-  }));
+    ref: forwardedRef,
+    children: /*#__PURE__*/(0, _jsxRuntime.jsx)("img", {
+      src: src,
+      alt: "demo"
+    })
+  });
 };
@@ -87,0 +90,0 @@

dist/stories/common/Section.js

@@ -10,13 +10,13 @@ "use strict";
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+var _jsxRuntime = require("react/jsx-runtime");
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
-function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
 
-function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
+function _extends() { _extends = Object.assign || function (target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i]; for (var key in source) { if (Object.prototype.hasOwnProperty.call(source, key)) { target[key] = source[key]; } } } return target; }; return _extends.apply(this, arguments); }
 
-function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
+function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; _setPrototypeOf(subClass, superClass); }
 
-function _inheritsLoose(subClass, superClass) { subClass.prototype = Object.create(superClass.prototype); subClass.prototype.constructor = subClass; subClass.__proto__ = superClass; }
+function _setPrototypeOf(o, p) { _setPrototypeOf = Object.setPrototypeOf || function _setPrototypeOf(o, p) { o.__proto__ = p; return o; }; return _setPrototypeOf(o, p); }
 
@@ -44,3 +44,3 @@ var MySectionBlock = /*#__PURE__*/function (_PureComponent) {
     if (inViewport && enterCount === 1) {
-      return _objectSpread(_objectSpread({}, basicStyle), {}, {
+      return _extends({}, basicStyle, {
         WebkitTransition: 'opacity 1s ease-in-out'
@@ -51,3 +51,3 @@ });
     if (!inViewport && enterCount < 1) {
-      return _objectSpread(_objectSpread({}, basicStyle), {}, {
+      return _extends({}, basicStyle, {
         WebkitTransition: 'none',
@@ -65,8 +65,18 @@ opacity: '0'
         leaveCount = _this$props2.leaveCount;
-    return /*#__PURE__*/_react["default"].createElement("section", null, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "card",
-      style: this.getStyle()
-    }, /*#__PURE__*/_react["default"].createElement("div", {
-      className: "card__conent"
-    }, /*#__PURE__*/_react["default"].createElement("h3", null, "Hello"), /*#__PURE__*/_react["default"].createElement("p", null, "Enter viewport: " + enterCount + " times"), /*#__PURE__*/_react["default"].createElement("p", null, "Leave viewport: " + leaveCount + " times"))));
+    return /*#__PURE__*/(0, _jsxRuntime.jsx)("section", {
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+        className: "card",
+        style: this.getStyle(),
+        children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+          className: "card__conent",
+          children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("h3", {
+            children: "Hello"
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+            children: "Enter viewport: " + enterCount + " times"
+          }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+            children: "Leave viewport: " + leaveCount + " times"
+          })]
+        })
+      })
+    });
   };
@@ -73,0 +83,0 @@

dist/stories/common/themeComponent.js

 "use strict";
 
 exports.__esModule = true;
-exports.Spacer = exports.Block = exports.Card = exports.PageTitle = void 0;
+exports.Spacer = exports.PageTitle = exports.Card = exports.Block = void 0;
 
 var _react = _interopRequireWildcard(require("react"));
 
-function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
+var _jsxRuntime = require("react/jsx-runtime");
 
-function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+function _getRequireWildcardCache(nodeInterop) { if (typeof WeakMap !== "function") return null; var cacheBabelInterop = new WeakMap(); var cacheNodeInterop = new WeakMap(); return (_getRequireWildcardCache = function _getRequireWildcardCache(nodeInterop) { return nodeInterop ? cacheNodeInterop : cacheBabelInterop; })(nodeInterop); }
 
+function _interopRequireWildcard(obj, nodeInterop) { if (!nodeInterop && obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(nodeInterop); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (key !== "default" && Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
+
 var PageTitle = /*#__PURE__*/(0, _react.memo)(function (_ref) {
@@ -17,18 +19,23 @@ var _ref$title = _ref.title,
       description = _ref$description === void 0 ? 'Wrapper component to detect if the component is in viewport using Intersection Observer API' : _ref$description;
-  return /*#__PURE__*/_react["default"].createElement("div", {
-    className: "page__title"
-  }, /*#__PURE__*/_react["default"].createElement("h1", {
-    className: "page__title-main"
-  }, title, /*#__PURE__*/_react["default"].createElement("a", {
-    className: "github mui-icon",
-    href: "https://github.com/roderickhsiao/react-in-viewport",
-    target: "_blank",
-    rel: "noopener noreferrer"
-  }, /*#__PURE__*/_react["default"].createElement("span", {
-    style: {
-      visibility: 'hidden'
-    }
-  }, "Github"))), /*#__PURE__*/_react["default"].createElement("p", {
-    className: "page__title-desc"
-  }, description));
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
+    className: "page__title",
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsxs)("h1", {
+      className: "page__title-main",
+      children: [title, /*#__PURE__*/(0, _jsxRuntime.jsx)("a", {
+        className: "github mui-icon",
+        href: "https://github.com/roderickhsiao/react-in-viewport",
+        target: "_blank",
+        rel: "noopener noreferrer",
+        children: /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+          style: {
+            visibility: 'hidden'
+          },
+          children: "Github"
+        })
+      })]
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("p", {
+      className: "page__title-desc",
+      children: description
+    })]
+  });
 });
@@ -41,12 +48,16 @@ exports.PageTitle = PageTitle;
       forwardedRef = _ref2.forwardedRef;
-  return /*#__PURE__*/_react["default"].createElement("div", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsxs)("div", {
     className: "card",
-    ref: forwardedRef
-  }, /*#__PURE__*/_react["default"].createElement("div", {
-    className: "card__head"
-  }, /*#__PURE__*/_react["default"].createElement("h3", {
-    className: "card__title"
-  }, titleText)), /*#__PURE__*/_react["default"].createElement("div", {
-    className: "card__conent"
-  }, contentNode));
+    ref: forwardedRef,
+    children: [/*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "card__head",
+      children: /*#__PURE__*/(0, _jsxRuntime.jsx)("h3", {
+        className: "card__title",
+        children: titleText
+      })
+    }), /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
+      className: "card__conent",
+      children: contentNode
+    })]
+  });
 });
@@ -63,6 +74,5 @@ exports.Card = Card;
   var text = inViewport ? 'In viewport' : 'Not in viewport';
-  return /*#__PURE__*/_react["default"].createElement(Card, {
-    className: "viewport-block",
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)(Card, {
     titleText: text,
-    contentNode: /*#__PURE__*/_react["default"].createElement("div", {
+    contentNode: /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
       ref: forwardedRef,
@@ -84,11 +94,15 @@ title: "Enter viewport " + enterCount + " times, leave viewport " + leaveCount + " times",
 var Spacer = function Spacer() {
-  return /*#__PURE__*/_react["default"].createElement("div", {
+  return /*#__PURE__*/(0, _jsxRuntime.jsx)("div", {
     style: {
       height: '100vh',
       padding: '20px'
-    }
-  }, /*#__PURE__*/_react["default"].createElement("p", null, "Scroll down to make component in viewport", ' ', /*#__PURE__*/_react["default"].createElement("span", {
-    role: "img",
-    "aria-label": "down"
-  }, "\uD83D\uDC47"), ' '));
+    },
+    children: /*#__PURE__*/(0, _jsxRuntime.jsxs)("p", {
+      children: ["Scroll down to make component in viewport", ' ', /*#__PURE__*/(0, _jsxRuntime.jsx)("span", {
+        role: "img",
+        "aria-label": "down",
+        children: "\uD83D\uDC47"
+      }), ' ']
+    })
+  });
 };
@@ -95,0 +109,0 @@

dist/types/index.d.ts

@@ -1,5 +0,5 @@
-export const customProps: string[];
+import handleViewport from './lib/handleViewport';
+export declare const customProps: string[];
 export default handleViewport;
-export { default as handleViewport } from "./lib/handleViewport";
-export { default as useInViewport } from "./lib/useInViewport";
-import handleViewport from "./lib/handleViewport";
+export { default as handleViewport } from './lib/handleViewport';
+export { default as useInViewport } from './lib/useInViewport';

dist/types/lib/constants.d.ts

@@ -1,9 +0,5 @@
-export const defaultOptions: {};
-export namespace defaultConfig {
-    const disconnectOnLeave: boolean;
-}
-export function noop(): void;
-export namespace defaultProps {
-    export { noop as onEnterViewport };
-    export { noop as onLeaveViewport };
-}
+import type { Config, Props, Options } from './types';
+export declare const defaultOptions: Options;
+export declare const defaultConfig: Config;
+export declare const noop: () => void;
+export declare const defaultProps: Props;

dist/types/lib/handleViewport.d.ts

@@ -0,20 +1,4 @@
+/// <reference types="react" />
+import type { Config, Options } from './types';
+declare function handleViewport(TargetComponent: React.ElementType, options?: Options, config?: Config): any;
 export default handleViewport;
-/**
- * @template P
- * @param {ReactNode} TargetComponent
- * @param {IntersectionObserverInit} [options = defaultOptions]
- * @param {Object} [config = defaultConfig]
- * @param {boolean} [config.disconnectOnLeave = false]
- * @returns {ComponentType<P & {
-      onEnterViewport?: VoidFunction
-      onLeaveViewport?: VoidFunction
-    }>}
- */
-declare function handleViewport<P>(TargetComponent: ReactNode, options?: IntersectionObserverInit, config?: {
-    disconnectOnLeave?: boolean;
-}): ComponentType<P & {
-    onEnterViewport?: VoidFunction;
-    onLeaveViewport?: VoidFunction;
-}>;
-import { ReactNode } from "react";
-import { ComponentType } from "react";

dist/types/lib/useInViewport.d.ts

@@ -0,22 +1,8 @@
+import React from 'react';
+import type { Config, Props, Options } from './types';
+declare const useInViewport: (target: React.MutableRefObject<HTMLElement>, options?: Options, config?: Config, props?: Props) => {
+    inViewport: boolean;
+    enterCount: number;
+    leaveCount: number;
+};
 export default useInViewport;
-/**
- *
- * @param {MutableRefObject} target
- * @param {IntersectionObserverInit} [options = defaultOptions]
- * @param {Object} [config = defaultConfig]
- * @param {boolean} [config.disconnectOnLeave = false]
- * @param {Object} [props = defaultProps]
- * @param {VoidFunction} [props.onEnterViewport = noop]
- * @param {VoidFunction} [props.onLeaveViewport = noop]
- * @returns {Object} returnObject
- * @returns {boolean} returnObject.inViewport
- * @returns {number} returnObject.enterCount
- * @returns {number} returnObject.leaveCount
- */
-declare function useInViewport(target: MutableRefObject<any>, options?: IntersectionObserverInit, config?: {
-    disconnectOnLeave?: boolean;
-}, props?: {
-    onEnterViewport?: VoidFunction;
-    onLeaveViewport?: VoidFunction;
-}): any;
-import { MutableRefObject } from "react";

dist/umd/lib/constants.js

@@ -17,3 +17,3 @@ (function (global, factory) {
   _exports.__esModule = true;
-  _exports.defaultProps = _exports.noop = _exports.defaultConfig = _exports.defaultOptions = void 0;
+  _exports.noop = _exports.defaultProps = _exports.defaultOptions = _exports.defaultConfig = void 0;
   var defaultOptions = {};
@@ -20,0 +20,0 @@ _exports.defaultOptions = defaultOptions;

dist/umd/lib/handleViewport.js

 (function (global, factory) {
   if (typeof define === "function" && define.amd) {
-    define(["exports", "react", "hoist-non-react-statics", "./useInViewport", "./constants"], factory);
+    define(["exports", "react", "hoist-non-react-statics", "./useInViewport", "./constants", "react/jsx-runtime"], factory);
   } else if (typeof exports !== "undefined") {
-    factory(exports, require("react"), require("hoist-non-react-statics"), require("./useInViewport"), require("./constants"));
+    factory(exports, require("react"), require("hoist-non-react-statics"), require("./useInViewport"), require("./constants"), require("react/jsx-runtime"));
   } else {
@@ -10,6 +10,6 @@ var mod = {
     };
-    factory(mod.exports, global.react, global.hoistNonReactStatics, global.useInViewport, global.constants);
+    factory(mod.exports, global.react, global.hoistNonReactStatics, global.useInViewport, global.constants, global.jsxRuntime);
     global.handleViewport = mod.exports;
   }
-})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _react, _hoistNonReactStatics, _useInViewport2, _constants) {
+})(typeof globalThis !== "undefined" ? globalThis : typeof self !== "undefined" ? self : this, function (_exports, _react, _hoistNonReactStatics, _useInViewport2, _constants, _jsxRuntime) {
   "use strict";
@@ -19,12 +19,8 @@
   _exports["default"] = void 0;
-  _react = _interopRequireWildcard(_react);
   _hoistNonReactStatics = _interopRequireDefault(_hoistNonReactStatics);
   _useInViewport2 = _interopRequireDefault(_useInViewport2);
+  var _excluded = ["onEnterViewport", "onLeaveViewport"];
 
   function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; }
 
-  function _getRequireWildcardCache() { if (typeof WeakMap !== "function") return null; var cache = new WeakMap(); _getRequireWildcardCache = function _getRequireWildcardCache() { return cache; }; return cache; }
-
-  function _interopRequireWildcard(obj) { if (obj && obj.__esModule) { return obj; } if (obj === null || typeof obj !== "object" && typeof obj !== "function") { return { "default": obj }; } var cache = _getRequireWildcardCache(); if (cache && cache.has(obj)) { return cache.get(obj); } var newObj = {}; var hasPropertyDescriptor = Object.defineProperty && Object.getOwnPropertyDescriptor; for (var key in obj) { if (Object.prototype.hasOwnProperty.call(obj, key)) { var desc = hasPropertyDescriptor ? Object.getOwnPropertyDescriptor(obj, key) : null; if (desc && (desc.get || desc.set)) { Object.defineProperty(newObj, key, desc); } else { newObj[key] = obj[key]; } } } newObj["default"] = obj; if (cache) { cache.set(obj, newObj); } return newObj; }
-
   function _objectWithoutPropertiesLoose(source, excluded) { if (source == null) return {}; var target = {}; var sourceKeys = Object.keys(source); var key, i; for (i = 0; i < sourceKeys.length; i++) { key = sourceKeys[i]; if (excluded.indexOf(key) >= 0) continue; target[key] = source[key]; } return target; }
@@ -34,8 +30,2 @@
 
-  function ownKeys(object, enumerableOnly) { var keys = Object.keys(object); if (Object.getOwnPropertySymbols) { var symbols = Object.getOwnPropertySymbols(object); if (enumerableOnly) symbols = symbols.filter(function (sym) { return Object.getOwnPropertyDescriptor(object, sym).enumerable; }); keys.push.apply(keys, symbols); } return keys; }
-
-  function _objectSpread(target) { for (var i = 1; i < arguments.length; i++) { var source = arguments[i] != null ? arguments[i] : {}; if (i % 2) { ownKeys(Object(source), true).forEach(function (key) { _defineProperty(target, key, source[key]); }); } else if (Object.getOwnPropertyDescriptors) { Object.defineProperties(target, Object.getOwnPropertyDescriptors(source)); } else { ownKeys(Object(source)).forEach(function (key) { Object.defineProperty(target, key, Object.getOwnPropertyDescriptor(source, key)); }); } } return target; }
-
-  function _defineProperty(obj, key, value) { if (key in obj) { Object.defineProperty(obj, key, { value: value, enumerable: true, configurable: true, writable: true }); } else { obj[key] = value; } return obj; }
-
   var isFunctionalComponent = function isFunctionalComponent(Component) {
@@ -48,15 +38,3 @@ return typeof Component === 'function' && !(Component.prototype && Component.prototype.render);
   };
-  /**
-   * @template P
-   * @param {ReactNode} TargetComponent
-   * @param {IntersectionObserverInit} [options = defaultOptions]
-   * @param {Object} [config = defaultConfig]
-   * @param {boolean} [config.disconnectOnLeave = false]
-   * @returns {ComponentType<P & {
-        onEnterViewport?: VoidFunction
-        onLeaveViewport?: VoidFunction
-      }>}
-   */
 
-
   function handleViewport(TargetComponent, options, config) {
@@ -72,3 +50,3 @@ if (options === void 0) {
     var ForwardedRefComponent = /*#__PURE__*/(0, _react.forwardRef)(function (props, ref) {
-      var refProps = _objectSpread({
+      var refProps = _extends({
         forwardedRef: ref
@@ -79,3 +57,3 @@ }, isReactComponent(TargetComponent) && !isFunctionalComponent(TargetComponent) ? {
 
-      return /*#__PURE__*/_react["default"].createElement(TargetComponent, _extends({}, props, refProps));
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(TargetComponent, _extends({}, props, refProps));
     });
@@ -88,3 +66,3 @@
           onLeaveViewport = _ref$onLeaveViewport === void 0 ? _constants.noop : _ref$onLeaveViewport,
-          restProps = _objectWithoutPropertiesLoose(_ref, ["onEnterViewport", "onLeaveViewport"]);
+          restProps = _objectWithoutPropertiesLoose(_ref, _excluded);
 
@@ -101,3 +79,3 @@ var node = (0, _react.useRef)();
 
-      return /*#__PURE__*/_react["default"].createElement(ForwardedRefComponent, _extends({}, restProps, {
+      return /*#__PURE__*/(0, _jsxRuntime.jsx)(ForwardedRefComponent, _extends({}, restProps, {
         inViewport: inViewport,
@@ -104,0 +82,0 @@ enterCount: enterCount,

dist/umd/lib/useInViewport.js

@@ -19,19 +19,2 @@ (function (global, factory) {
 
-  // React hooks
-  // eslint-disable-next-line no-unused-vars
-
-  /**
-   *
-   * @param {MutableRefObject} target
-   * @param {IntersectionObserverInit} [options = defaultOptions]
-   * @param {Object} [config = defaultConfig]
-   * @param {boolean} [config.disconnectOnLeave = false]
-   * @param {Object} [props = defaultProps]
-   * @param {VoidFunction} [props.onEnterViewport = noop]
-   * @param {VoidFunction} [props.onLeaveViewport = noop]
-   * @returns {Object} returnObject
-   * @returns {boolean} returnObject.inViewport
-   * @returns {number} returnObject.enterCount
-   * @returns {number} returnObject.leaveCount
-   */
   var useInViewport = function useInViewport(target, options, config, props) {
@@ -100,3 +83,3 @@ if (options === void 0) {
         intersected.current = true;
-        onEnterViewport && onEnterViewport();
+        onEnterViewport == null ? void 0 : onEnterViewport();
         enterCountRef.current += 1;
@@ -111,3 +94,3 @@ inViewportRef.current = isInViewport;
         intersected.current = false;
-        onLeaveViewport && onLeaveViewport();
+        onLeaveViewport == null ? void 0 : onLeaveViewport();
 
@@ -129,3 +112,2 @@ if (config.disconnectOnLeave && observer.current) {
       if (!observerRef) {
-        // $FlowFixMe
         observer.current = new IntersectionObserver(handleIntersection, options);
@@ -132,0 +114,0 @@ return observer.current;

package.json

 {
   "name": "react-in-viewport",
-  "version": "1.0.0-alpha.20",
+  "version": "1.0.0-alpha.21",
   "description": "Track React component in viewport using Intersection Observer API",
@@ -21,3 +21,2 @@ "author": "Roderick Hsiao <[e-mail]>",
     "bundlesize": "bundlesize",
-    "flow": "flow src",
     "lint": "eslint src",
@@ -37,12 +36,13 @@ "lintfix": "eslint src --fix",
     "@babel/core": "^7.2.2",
-    "@babel/plugin-proposal-class-properties": "^7.3.0",
-    "@babel/plugin-proposal-object-rest-spread": "^7.4.3",
-    "@babel/plugin-transform-flow-strip-types": "^7.2.3",
-    "@babel/plugin-transform-spread": "^7.2.2",
     "@babel/preset-env": "^7.3.1",
-    "@babel/preset-flow": "^7.0.0",
     "@babel/preset-react": "^7.0.0",
-    "@emotion/core": "^10.0.7",
-    "@storybook/addon-actions": "^5.0.0",
-    "@storybook/react": "^5.0.0",
+    "@babel/preset-typescript": "^7.16.7",
+    "@storybook/addon-actions": "^6.0.0",
+    "@storybook/addon-docs": "^6.4.19",
+    "@storybook/addon-essentials": "^6.4.19",
+    "@storybook/react": "^6.0.0",
+    "@types/jest": "^25.0.0",
+    "@typescript-eslint/eslint-plugin": "^5.17.0",
+    "@typescript-eslint/parser": "^5.17.0",
+    "add": "^2.0.6",
     "babel-eslint": "^10.0.1",
@@ -54,22 +54,22 @@ "babel-loader": "^8.0.5",
     "enzyme-adapter-react-16": "^1.15.5",
-    "eslint": "^6.8.0",
-    "eslint-config-airbnb": "^18.0.1",
+    "eslint": "^8.0.0",
+    "eslint-config-airbnb": "^19.0.0",
+    "eslint-config-airbnb-typescript": "^16.1.4",
     "eslint-plugin-babel": "^5.3.0",
-    "eslint-plugin-flowtype": "^4.0.0",
     "eslint-plugin-import": "^2.0.0",
     "eslint-plugin-jsx-a11y": "^6.1.2",
     "eslint-plugin-react": "^7.0.0",
-    "flow-bin": "^0.119.0",
     "git-url-parse": "^11.1.2",
-    "intersection-observer": "^0.7.0",
+    "intersection-observer": "^0.12.0",
     "jest": "^25.1.0",
     "jest-cli": "^25.1.0",
     "jest-junit": "^10.0.0",
-    "react": "^16.0.0",
+    "react": "^17.0.0",
     "react-aspect-ratio": "^1.0.3",
-    "react-dom": "^16.0.0",
+    "react-dom": "^17.0.0",
     "react-storybook-addon-chapters": "^3.1.3",
-    "react-test-renderer": "^16.0.0",
+    "react-test-renderer": "^17.0.0",
     "storybook-addon-jsx": "^7.0.0",
-    "typescript": "^4.3.2"
+    "typescript": "^4.3.2",
+    "yarn": "^1.22.18"
   },
@@ -81,2 +81,4 @@ "peerDependencies": {
   "dependencies": {
+    "@babel/plugin-transform-flow-strip-types": "^7.2.3",
+    "@babel/preset-flow": "^7.0.0",
     "hoist-non-react-statics": "^3.0.0"
@@ -83,0 +85,0 @@ },

tsconfig.json

 {
   "include": [
-    "src/**/*.js"
+    "src/**/*",
   ],
@@ -8,14 +8,12 @@ "compilerOptions": {
     "declaration": true,
-    "emitDeclarationOnly": true,
-    "module": "commonjs",
+    "esModuleInterop": true,
+    "isolatedModules": true,
+    "jsx": "react-jsx",
+    "module": "ESNext",
+    "moduleResolution": "node",
+    "noEmit": false,
     "outDir": "dist/types",
-    "target": "ES6",
-    "types": []
-  },
-  "exclude": [
-    "./node_modules",
-    "./src/__tests__",
-    "./src/setupTests.js",
-    "./src/stories",
-  ]
-}
+    "skipLibCheck": true,
+    "target": "ESNext",
+  }
+}

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

93185

increased by1.54%

Number of package files

49

increased by36.11%

Lines of code

1731

increased by3.53%

Worsened metrics

Dependency count

5

increased by66.67%

Dev dependency count

39

increased by2.63%

Dependency changes

• + Added@babel/plugin-transform-flow-strip-types@^7.2.3

• + Added@babel/preset-flow@^7.0.0

• + Added@ampproject/remapping@2.3.0(transitive)

• + Added@babel/code-frame@7.26.2(transitive)

• + Added@babel/compat-data@7.26.5(transitive)

• + Added@babel/core@7.26.0(transitive)

• + Added@babel/generator@7.26.5(transitive)

• + Added@babel/helper-compilation-targets@7.26.5(transitive)

• + Added@babel/helper-module-imports@7.25.9(transitive)

• + Added@babel/helper-module-transforms@7.26.0(transitive)

• + Added@babel/helper-plugin-utils@7.26.5(transitive)

• + Added@babel/helper-string-parser@7.25.9(transitive)

• + Added@babel/helper-validator-identifier@7.25.9(transitive)

• + Added@babel/helper-validator-option@7.25.9(transitive)

• + Added@babel/helpers@7.26.0(transitive)

• + Added@babel/parser@7.26.5(transitive)

• + Added@babel/plugin-syntax-flow@7.26.0(transitive)

• + Added@babel/plugin-transform-flow-strip-types@7.26.5(transitive)

• + Added@babel/preset-flow@7.25.9(transitive)

• + Added@babel/template@7.25.9(transitive)

• + Added@babel/traverse@7.26.5(transitive)

• + Added@babel/types@7.26.5(transitive)

• + Added@jridgewell/gen-mapping@0.3.8(transitive)

• + Added@jridgewell/resolve-uri@3.1.2(transitive)

• + Added@jridgewell/set-array@1.2.1(transitive)

• + Added@jridgewell/sourcemap-codec@1.5.0(transitive)

• + Added@jridgewell/trace-mapping@0.3.25(transitive)

• + Addedbrowserslist@4.24.4(transitive)

• + Addedcaniuse-lite@1.0.30001692(transitive)

• + Addedconvert-source-map@2.0.0(transitive)

• + Addeddebug@4.4.0(transitive)

• + Addedelectron-to-chromium@1.5.82(transitive)

• + Addedescalade@3.2.0(transitive)

• + Addedgensync@1.0.0-beta.2(transitive)

• + Addedglobals@11.12.0(transitive)

• + Addedjsesc@3.1.0(transitive)

• + Addedjson5@2.2.3(transitive)

• + Addedlru-cache@5.1.1(transitive)

• + Addedms@2.1.3(transitive)

• + Addednode-releases@2.0.19(transitive)

• + Addedpicocolors@1.1.1(transitive)

• + Addedsemver@6.3.1(transitive)

• + Addedupdate-browserslist-db@1.1.2(transitive)

• + Addedyallist@3.1.1(transitive)