Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
react-singleton-hook
Advanced tools
react-singleton-hook - npm Package Compare versions
Comparing version 4.0.0 to 4.0.1
@@ -13,6 +13,5 @@ (function (global, factory) { | ||
| function _extends() { | ||
| _extends = Object.assign || function (target) { | ||
| _extends = Object.assign ? Object.assign.bind() : function (target) { | ||
| for (var i = 1; i < arguments.length; i++) { | ||
| var source = arguments[i]; | ||
| for (var key in source) { | ||
@@ -24,6 +23,4 @@ if (Object.prototype.hasOwnProperty.call(source, key)) { | ||
| } | ||
| return target; | ||
| }; | ||
| return _extends.apply(this, arguments); | ||
@@ -34,12 +31,11 @@ } | ||
| var initValue = _ref.initValue, | ||
| useHookBody = _ref.useHookBody, | ||
| applyStateChange = _ref.applyStateChange; | ||
| useHookBody = _ref.useHookBody, | ||
| applyStateChange = _ref.applyStateChange; | ||
| var lastState = React.useRef(initValue); | ||
| if (typeof useHookBody !== 'function') { | ||
| throw new Error("function expected as hook body parameter. got " + typeof useHookBody); | ||
| } | ||
| var val = useHookBody(); | ||
| var val = useHookBody(); //useLayoutEffect is safe from SSR perspective because SingleItemContainer should never be rendered on server | ||
| //useLayoutEffect is safe from SSR perspective because SingleItemContainer should never be rendered on server | ||
| React.useLayoutEffect(function () { | ||
@@ -75,4 +71,4 @@ if (lastState.current !== val) { | ||
| // from https://github.com/purposeindustries/window-or-global/blob/master/lib/index.js | ||
| // avoid direct usage of 'window' because `window is not defined` error might happen in babel-node | ||
| var globalObject = typeof self === 'object' && self.self === self && self || typeof global === 'object' && global.global === global && global || this; | ||
@@ -99,3 +95,2 @@ var batch = function batch(cb) { | ||
| var renderedContainers = []; | ||
| var notifyContainersAsync = function notifyContainersAsync() { | ||
@@ -106,23 +101,18 @@ renderedContainers.forEach(function (updateRenderedHooks) { | ||
| }; | ||
| var SingletonHooksContainer = function SingletonHooksContainer(_ref) { | ||
| var automaticContainerInternalUseOnly = _ref.automaticContainerInternalUseOnly; | ||
| var _useState = React.useState([]), | ||
| hooks = _useState[0], | ||
| setHooks = _useState[1]; | ||
| hooks = _useState[0], | ||
| setHooks = _useState[1]; | ||
| var currentHooksRef = React.useRef(); | ||
| currentHooksRef.current = hooks; // if there was no automaticRender, and this one is not automatic as well | ||
| currentHooksRef.current = hooks; | ||
| // if there was no automaticRender, and this one is not automatic as well | ||
| if (!automaticContainerInternalUseOnly && automaticRender === false) { | ||
| manualRender = true; | ||
| } | ||
| React.useEffect(function () { | ||
| var mounted = true; | ||
| function updateRenderedHooks() { | ||
| if (!mounted) return; | ||
| if (renderedContainers[0] !== updateRenderedHooks) { | ||
@@ -132,3 +122,2 @@ if (!automaticContainerInternalUseOnly && automaticRender === true) { | ||
| } | ||
| setHooks(function (_) { | ||
@@ -139,6 +128,4 @@ return []; | ||
| } | ||
| setHooks([].concat(workingSet)); | ||
| } | ||
| renderedContainers.push(updateRenderedHooks); | ||
@@ -148,7 +135,5 @@ notifyContainersAsync(); | ||
| mounted = false; | ||
| if (currentHooksRef.current.length > 0) { | ||
| warning('SingletonHooksContainer is unmounted, but it has active singleton hooks. ' + 'They will be reevaluated once SingletonHooksContainer is mounted again'); | ||
| } | ||
| renderedContainers.splice(renderedContainers.indexOf(updateRenderedHooks), 1); | ||
@@ -160,3 +145,3 @@ notifyContainersAsync(); | ||
| var hook = _ref2.hook, | ||
| key = _ref2.key; | ||
| key = _ref2.key; | ||
| return /*#__PURE__*/React__default["default"].createElement(SingleItemContainer, _extends({}, hook, { | ||
@@ -172,4 +157,5 @@ key: key | ||
| key: key | ||
| }); // no container and and no previous manually rendered containers | ||
| }); | ||
| // no container and no previous manually rendered containers | ||
| if (renderedContainers.length === 0 && manualRender === false) { | ||
@@ -179,3 +165,2 @@ automaticRender = true; | ||
| } | ||
| notifyContainersAsync(); | ||
@@ -194,3 +179,2 @@ return function () { | ||
| } | ||
| var mounted = false; | ||
@@ -202,5 +186,4 @@ var removeHook = undefined; | ||
| var _options = options, | ||
| _options$unmountIfNoC = _options.unmountIfNoConsumers, | ||
| unmountIfNoConsumers = _options$unmountIfNoC === void 0 ? false : _options$unmountIfNoC; | ||
| _options$unmountIfNoC = _options.unmountIfNoConsumers, | ||
| unmountIfNoConsumers = _options$unmountIfNoC === void 0 ? false : _options$unmountIfNoC; | ||
| var applyStateChange = function applyStateChange(newState) { | ||
@@ -214,3 +197,2 @@ lastKnownState = newState; | ||
| }; | ||
| var stateInitializer = function stateInitializer() { | ||
@@ -221,11 +203,8 @@ if (!initStateCalculated) { | ||
| } | ||
| return lastKnownState; | ||
| }; | ||
| return function () { | ||
| var _useState = React.useState(stateInitializer), | ||
| state = _useState[0], | ||
| setState = _useState[1]; | ||
| state = _useState[0], | ||
| setState = _useState[1]; | ||
| React.useEffect(function () { | ||
@@ -240,12 +219,8 @@ if (!mounted) { | ||
| } | ||
| consumers.push(setState); | ||
| if (lastKnownState !== state) { | ||
| setState(lastKnownState); | ||
| } | ||
| return function () { | ||
| consumers.splice(consumers.indexOf(setState), 1); | ||
| if (consumers.length === 0 && unmountIfNoConsumers) { | ||
@@ -255,3 +230,5 @@ removeHook(); | ||
| } | ||
| }; // eslint-disable-next-line react-hooks/exhaustive-deps | ||
| }; | ||
| // eslint-disable-next-line react-hooks/exhaustive-deps | ||
| }, []); | ||
@@ -258,0 +235,0 @@ return state; |
@@ -1,1 +0,1 @@ | ||
| !function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","react-dom"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).ReactSingletonHook={},e.React,e.ReactDOM)}(this,(function(e,n,t){"use strict";function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=o(n);function u(){return(u=Object.assign||function(e){for(var n=1;arguments.length>n;n++){var t=arguments[n];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])}return e}).apply(this,arguments)}var i,a=function(e){var t=e.useHookBody,o=e.applyStateChange,r=n.useRef(e.initValue);if("function"!=typeof t)throw Error("function expected as hook body parameter. got "+typeof t);var u=t();return n.useLayoutEffect((function(){r.current!==u&&(r.current=u,o(u))}),[o,u]),null};i=o(t).default.createRoot;var f=function(e){console&&console.warn&&console.warn(e)},l="object"==typeof self&&self.self===self&&self||"object"==typeof global&&global.global===global&&global||this,c=1,s=!1,d=!1,p=[],g=[],y=function(){g.forEach((function(e){return e()}))},m=function(e){var t=e.automaticContainerInternalUseOnly,o=n.useState([]),i=o[0],l=o[1],c=n.useRef();return c.current=i,t||!1!==s||(d=!0),n.useEffect((function(){var e=!0;function n(){if(e)return g[0]!==n?(t||!0!==s||f("SingletonHooksContainer is mounted after some singleton hook has been used.Your SingletonHooksContainer will not be used in favor of internal one."),void l((function(e){return[]}))):void l([].concat(p))}return g.push(n),y(),function(){e=!1,c.current.length>0&&f("SingletonHooksContainer is unmounted, but it has active singleton hooks. They will be reevaluated once SingletonHooksContainer is mounted again"),g.splice(g.indexOf(n),1),y()}}),[t]),r.default.createElement(r.default.Fragment,null,i.map((function(e){return r.default.createElement(a,u({},e.hook,{key:e.key}))})))},h=function(e){var n=c++;return p.push({hook:e,key:n}),0===g.length&&!1===d&&(s=!0,function(e){if(l.document&&l.document.createElement){var n=l.document.createElement("div");i(n).render(r.default.createElement(e,{automaticContainerInternalUseOnly:!0}))}else f("Can not mount SingletonHooksContainer on server side. Did you manage to run useEffect on server? Please mount SingletonHooksContainer into your components tree manually.")}(m)),y(),function(){p.splice(p.findIndex((function(e){return e.key===n})),1),y()}},v=function(e,o,r){void 0===r&&(r={});var u=!1,i=void 0,a=!1,f=void 0,l=[],c=r.unmountIfNoConsumers,s=void 0!==c&&c,d=function(e){f=e,t.unstable_batchedUpdates((function(){return l.forEach((function(n){return n(e)}))}))},p=function(){return a||(f="function"==typeof e?e():e,a=!0),f};return function(){var t=n.useState(p),r=t[0],a=t[1];return n.useEffect((function(){return u||(u=!0,i=h({initValue:e,useHookBody:o,applyStateChange:d})),l.push(a),f!==r&&a(f),function(){l.splice(l.indexOf(a),1),0===l.length&&s&&(i(),u=!1)}}),[]),r}},k={singletonHook:v,SingletonHooksContainer:m};e.SingletonHooksContainer=m,e.default=k,e.singletonHook=v,Object.defineProperty(e,"__esModule",{value:!0})})); | ||
| !function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("react-dom")):"function"==typeof define&&define.amd?define(["exports","react","react-dom"],n):n((e="undefined"!=typeof globalThis?globalThis:e||self).ReactSingletonHook={},e.React,e.ReactDOM)}(this,(function(e,n,t){"use strict";function o(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var r=o(n);function u(){return(u=Object.assign?Object.assign.bind():function(e){for(var n=1;arguments.length>n;n++){var t=arguments[n];for(var o in t)Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o])}return e}).apply(this,arguments)}var i,a=function(e){var t=e.useHookBody,o=e.applyStateChange,r=n.useRef(e.initValue);if("function"!=typeof t)throw Error("function expected as hook body parameter. got "+typeof t);var u=t();return n.useLayoutEffect((function(){r.current!==u&&(r.current=u,o(u))}),[o,u]),null};i=o(t).default.createRoot;var f=function(e){console&&console.warn&&console.warn(e)},l="object"==typeof self&&self.self===self&&self||"object"==typeof global&&global.global===global&&global||this,c=1,s=!1,d=!1,p=[],g=[],y=function(){g.forEach((function(e){return e()}))},m=function(e){var t=e.automaticContainerInternalUseOnly,o=n.useState([]),i=o[0],l=o[1],c=n.useRef();return c.current=i,t||!1!==s||(d=!0),n.useEffect((function(){var e=!0;function n(){if(e)return g[0]!==n?(t||!0!==s||f("SingletonHooksContainer is mounted after some singleton hook has been used.Your SingletonHooksContainer will not be used in favor of internal one."),void l((function(e){return[]}))):void l([].concat(p))}return g.push(n),y(),function(){e=!1,c.current.length>0&&f("SingletonHooksContainer is unmounted, but it has active singleton hooks. They will be reevaluated once SingletonHooksContainer is mounted again"),g.splice(g.indexOf(n),1),y()}}),[t]),r.default.createElement(r.default.Fragment,null,i.map((function(e){return r.default.createElement(a,u({},e.hook,{key:e.key}))})))},h=function(e){var n=c++;return p.push({hook:e,key:n}),0===g.length&&!1===d&&(s=!0,function(e){if(l.document&&l.document.createElement){var n=l.document.createElement("div");i(n).render(r.default.createElement(e,{automaticContainerInternalUseOnly:!0}))}else f("Can not mount SingletonHooksContainer on server side. Did you manage to run useEffect on server? Please mount SingletonHooksContainer into your components tree manually.")}(m)),y(),function(){p.splice(p.findIndex((function(e){return e.key===n})),1),y()}},v=function(e,o,r){void 0===r&&(r={});var u=!1,i=void 0,a=!1,f=void 0,l=[],c=r.unmountIfNoConsumers,s=void 0!==c&&c,d=function(e){f=e,t.unstable_batchedUpdates((function(){return l.forEach((function(n){return n(e)}))}))},p=function(){return a||(f="function"==typeof e?e():e,a=!0),f};return function(){var t=n.useState(p),r=t[0],a=t[1];return n.useEffect((function(){return u||(u=!0,i=h({initValue:e,useHookBody:o,applyStateChange:d})),l.push(a),f!==r&&a(f),function(){l.splice(l.indexOf(a),1),0===l.length&&s&&(i(),u=!1)}}),[]),r}},b={singletonHook:v,SingletonHooksContainer:m};e.SingletonHooksContainer=m,e.default=b,e.singletonHook=v,Object.defineProperty(e,"__esModule",{value:!0})})); |
| import { useLayoutEffect, useRef } from 'react'; | ||
| export var SingleItemContainer = function SingleItemContainer(_ref) { | ||
| var initValue = _ref.initValue, | ||
| useHookBody = _ref.useHookBody, | ||
| applyStateChange = _ref.applyStateChange; | ||
| useHookBody = _ref.useHookBody, | ||
| applyStateChange = _ref.applyStateChange; | ||
| var lastState = useRef(initValue); | ||
| if (typeof useHookBody !== 'function') { | ||
| throw new Error("function expected as hook body parameter. got " + typeof useHookBody); | ||
| } | ||
| var val = useHookBody(); | ||
| var val = useHookBody(); //useLayoutEffect is safe from SSR perspective because SingleItemContainer should never be rendered on server | ||
| //useLayoutEffect is safe from SSR perspective because SingleItemContainer should never be rendered on server | ||
| useLayoutEffect(function () { | ||
@@ -15,0 +14,0 @@ if (lastState.current !== val) { |
@@ -1,3 +0,2 @@ | ||
| 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 _extends() { _extends = Object.assign ? Object.assign.bind() : 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); } | ||
| import React, { useState, useEffect, useRef } from 'react'; | ||
@@ -12,3 +11,2 @@ import { SingleItemContainer } from './SingleItemContainer'; | ||
| var renderedContainers = []; | ||
| var notifyContainersAsync = function notifyContainersAsync() { | ||
@@ -19,23 +17,18 @@ renderedContainers.forEach(function (updateRenderedHooks) { | ||
| }; | ||
| export var SingletonHooksContainer = function SingletonHooksContainer(_ref) { | ||
| var automaticContainerInternalUseOnly = _ref.automaticContainerInternalUseOnly; | ||
| var _useState = useState([]), | ||
| hooks = _useState[0], | ||
| setHooks = _useState[1]; | ||
| hooks = _useState[0], | ||
| setHooks = _useState[1]; | ||
| var currentHooksRef = useRef(); | ||
| currentHooksRef.current = hooks; // if there was no automaticRender, and this one is not automatic as well | ||
| currentHooksRef.current = hooks; | ||
| // if there was no automaticRender, and this one is not automatic as well | ||
| if (!automaticContainerInternalUseOnly && automaticRender === false) { | ||
| manualRender = true; | ||
| } | ||
| useEffect(function () { | ||
| var mounted = true; | ||
| function updateRenderedHooks() { | ||
| if (!mounted) return; | ||
| if (renderedContainers[0] !== updateRenderedHooks) { | ||
@@ -45,3 +38,2 @@ if (!automaticContainerInternalUseOnly && automaticRender === true) { | ||
| } | ||
| setHooks(function (_) { | ||
@@ -52,6 +44,4 @@ return []; | ||
| } | ||
| setHooks([].concat(workingSet)); | ||
| } | ||
| renderedContainers.push(updateRenderedHooks); | ||
@@ -61,7 +51,5 @@ notifyContainersAsync(); | ||
| mounted = false; | ||
| if (currentHooksRef.current.length > 0) { | ||
| warning('SingletonHooksContainer is unmounted, but it has active singleton hooks. ' + 'They will be reevaluated once SingletonHooksContainer is mounted again'); | ||
| } | ||
| renderedContainers.splice(renderedContainers.indexOf(updateRenderedHooks), 1); | ||
@@ -73,3 +61,3 @@ notifyContainersAsync(); | ||
| var hook = _ref2.hook, | ||
| key = _ref2.key; | ||
| key = _ref2.key; | ||
| return /*#__PURE__*/React.createElement(SingleItemContainer, _extends({}, hook, { | ||
@@ -85,4 +73,5 @@ key: key | ||
| key: key | ||
| }); // no container and and no previous manually rendered containers | ||
| }); | ||
| // no container and no previous manually rendered containers | ||
| if (renderedContainers.length === 0 && manualRender === false) { | ||
@@ -92,3 +81,2 @@ automaticRender = true; | ||
| } | ||
| notifyContainersAsync(); | ||
@@ -95,0 +83,0 @@ return function () { |
@@ -8,3 +8,2 @@ import { useEffect, useState } from 'react'; | ||
| } | ||
| var mounted = false; | ||
@@ -16,5 +15,4 @@ var removeHook = undefined; | ||
| var _options = options, | ||
| _options$unmountIfNoC = _options.unmountIfNoConsumers, | ||
| unmountIfNoConsumers = _options$unmountIfNoC === void 0 ? false : _options$unmountIfNoC; | ||
| _options$unmountIfNoC = _options.unmountIfNoConsumers, | ||
| unmountIfNoConsumers = _options$unmountIfNoC === void 0 ? false : _options$unmountIfNoC; | ||
| var applyStateChange = function applyStateChange(newState) { | ||
@@ -28,3 +26,2 @@ lastKnownState = newState; | ||
| }; | ||
| var stateInitializer = function stateInitializer() { | ||
@@ -35,11 +32,8 @@ if (!initStateCalculated) { | ||
| } | ||
| return lastKnownState; | ||
| }; | ||
| return function () { | ||
| var _useState = useState(stateInitializer), | ||
| state = _useState[0], | ||
| setState = _useState[1]; | ||
| state = _useState[0], | ||
| setState = _useState[1]; | ||
| useEffect(function () { | ||
@@ -54,12 +48,8 @@ if (!mounted) { | ||
| } | ||
| consumers.push(setState); | ||
| if (lastKnownState !== state) { | ||
| setState(lastKnownState); | ||
| } | ||
| return function () { | ||
| consumers.splice(consumers.indexOf(setState), 1); | ||
| if (consumers.length === 0 && unmountIfNoConsumers) { | ||
@@ -69,3 +59,5 @@ removeHook(); | ||
| } | ||
| }; // eslint-disable-next-line react-hooks/exhaustive-deps | ||
| }; | ||
| // eslint-disable-next-line react-hooks/exhaustive-deps | ||
| }, []); | ||
@@ -72,0 +64,0 @@ return state; |
| import React from 'react'; | ||
| import { createRoot } from 'react-dom/client'; | ||
| import { unstable_batchedUpdates } from 'react-dom'; | ||
| import { warning } from './warning'; // from https://github.com/purposeindustries/window-or-global/blob/master/lib/index.js | ||
| import { warning } from './warning'; | ||
| // from https://github.com/purposeindustries/window-or-global/blob/master/lib/index.js | ||
| // avoid direct usage of 'window' because `window is not defined` error might happen in babel-node | ||
| var globalObject = typeof self === 'object' && self.self === self && self || typeof global === 'object' && global.global === global && global || this; | ||
@@ -8,0 +9,0 @@ export var batch = function batch(cb) { |
@@ -5,17 +5,14 @@ "use strict"; | ||
| exports.SingleItemContainer = void 0; | ||
| var _react = require("react"); | ||
| var SingleItemContainer = function SingleItemContainer(_ref) { | ||
| var initValue = _ref.initValue, | ||
| useHookBody = _ref.useHookBody, | ||
| applyStateChange = _ref.applyStateChange; | ||
| useHookBody = _ref.useHookBody, | ||
| applyStateChange = _ref.applyStateChange; | ||
| var lastState = (0, _react.useRef)(initValue); | ||
| if (typeof useHookBody !== 'function') { | ||
| throw new Error("function expected as hook body parameter. got " + typeof useHookBody); | ||
| } | ||
| var val = useHookBody(); | ||
| var val = useHookBody(); //useLayoutEffect is safe from SSR perspective because SingleItemContainer should never be rendered on server | ||
| //useLayoutEffect is safe from SSR perspective because SingleItemContainer should never be rendered on server | ||
| (0, _react.useLayoutEffect)(function () { | ||
@@ -29,3 +26,2 @@ if (lastState.current !== val) { | ||
| }; | ||
| exports.SingleItemContainer = SingleItemContainer; |
@@ -5,17 +5,9 @@ "use strict"; | ||
| exports.resetLocalStateForTests = exports.addHook = exports.SingletonHooksContainer = void 0; | ||
| var _react = _interopRequireWildcard(require("react")); | ||
| var _SingleItemContainer = require("./SingleItemContainer"); | ||
| var _env = require("../utils/env"); | ||
| var _warning = require("../utils/warning"); | ||
| 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; } | ||
| 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 _extends() { _extends = Object.assign ? Object.assign.bind() : 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 nextKey = 1; | ||
@@ -26,3 +18,2 @@ var automaticRender = false; | ||
| var renderedContainers = []; | ||
| var notifyContainersAsync = function notifyContainersAsync() { | ||
@@ -33,23 +24,18 @@ renderedContainers.forEach(function (updateRenderedHooks) { | ||
| }; | ||
| var SingletonHooksContainer = function SingletonHooksContainer(_ref) { | ||
| var automaticContainerInternalUseOnly = _ref.automaticContainerInternalUseOnly; | ||
| var _useState = (0, _react.useState)([]), | ||
| hooks = _useState[0], | ||
| setHooks = _useState[1]; | ||
| hooks = _useState[0], | ||
| setHooks = _useState[1]; | ||
| var currentHooksRef = (0, _react.useRef)(); | ||
| currentHooksRef.current = hooks; // if there was no automaticRender, and this one is not automatic as well | ||
| currentHooksRef.current = hooks; | ||
| // if there was no automaticRender, and this one is not automatic as well | ||
| if (!automaticContainerInternalUseOnly && automaticRender === false) { | ||
| manualRender = true; | ||
| } | ||
| (0, _react.useEffect)(function () { | ||
| var mounted = true; | ||
| function updateRenderedHooks() { | ||
| if (!mounted) return; | ||
| if (renderedContainers[0] !== updateRenderedHooks) { | ||
@@ -59,3 +45,2 @@ if (!automaticContainerInternalUseOnly && automaticRender === true) { | ||
| } | ||
| setHooks(function (_) { | ||
@@ -66,6 +51,4 @@ return []; | ||
| } | ||
| setHooks([].concat(workingSet)); | ||
| } | ||
| renderedContainers.push(updateRenderedHooks); | ||
@@ -75,7 +58,5 @@ notifyContainersAsync(); | ||
| mounted = false; | ||
| if (currentHooksRef.current.length > 0) { | ||
| (0, _warning.warning)('SingletonHooksContainer is unmounted, but it has active singleton hooks. ' + 'They will be reevaluated once SingletonHooksContainer is mounted again'); | ||
| } | ||
| renderedContainers.splice(renderedContainers.indexOf(updateRenderedHooks), 1); | ||
@@ -87,3 +68,3 @@ notifyContainersAsync(); | ||
| var hook = _ref2.hook, | ||
| key = _ref2.key; | ||
| key = _ref2.key; | ||
| return /*#__PURE__*/_react["default"].createElement(_SingleItemContainer.SingleItemContainer, _extends({}, hook, { | ||
@@ -94,5 +75,3 @@ key: key | ||
| }; | ||
| exports.SingletonHooksContainer = SingletonHooksContainer; | ||
| var addHook = function addHook(hook) { | ||
@@ -103,4 +82,5 @@ var key = nextKey++; | ||
| key: key | ||
| }); // no container and and no previous manually rendered containers | ||
| }); | ||
| // no container and no previous manually rendered containers | ||
| if (renderedContainers.length === 0 && manualRender === false) { | ||
@@ -110,3 +90,2 @@ automaticRender = true; | ||
| } | ||
| notifyContainersAsync(); | ||
@@ -120,5 +99,3 @@ return function () { | ||
| }; | ||
| exports.addHook = addHook; | ||
| var resetLocalStateForTests = function resetLocalStateForTests() { | ||
@@ -130,3 +107,2 @@ automaticRender = false; | ||
| }; | ||
| exports.resetLocalStateForTests = resetLocalStateForTests; |
@@ -5,9 +5,5 @@ "use strict"; | ||
| exports["default"] = void 0; | ||
| var _singletonHook = require("./singletonHook"); | ||
| exports.singletonHook = _singletonHook.singletonHook; | ||
| var _SingletonHooksContainer = require("./components/SingletonHooksContainer"); | ||
| exports.SingletonHooksContainer = _SingletonHooksContainer.SingletonHooksContainer; | ||
@@ -14,0 +10,0 @@ var ReactSingletonHook = { |
@@ -5,9 +5,5 @@ "use strict"; | ||
| exports.singletonHook = void 0; | ||
| var _react = require("react"); | ||
| var _SingletonHooksContainer = require("./components/SingletonHooksContainer"); | ||
| var _env = require("./utils/env"); | ||
| var singletonHook = function singletonHook(initValue, useHookBody, options) { | ||
@@ -17,3 +13,2 @@ if (options === void 0) { | ||
| } | ||
| var mounted = false; | ||
@@ -25,5 +20,4 @@ var removeHook = undefined; | ||
| var _options = options, | ||
| _options$unmountIfNoC = _options.unmountIfNoConsumers, | ||
| unmountIfNoConsumers = _options$unmountIfNoC === void 0 ? false : _options$unmountIfNoC; | ||
| _options$unmountIfNoC = _options.unmountIfNoConsumers, | ||
| unmountIfNoConsumers = _options$unmountIfNoC === void 0 ? false : _options$unmountIfNoC; | ||
| var applyStateChange = function applyStateChange(newState) { | ||
@@ -37,3 +31,2 @@ lastKnownState = newState; | ||
| }; | ||
| var stateInitializer = function stateInitializer() { | ||
@@ -44,11 +37,8 @@ if (!initStateCalculated) { | ||
| } | ||
| return lastKnownState; | ||
| }; | ||
| return function () { | ||
| var _useState = (0, _react.useState)(stateInitializer), | ||
| state = _useState[0], | ||
| setState = _useState[1]; | ||
| state = _useState[0], | ||
| setState = _useState[1]; | ||
| (0, _react.useEffect)(function () { | ||
@@ -63,12 +53,8 @@ if (!mounted) { | ||
| } | ||
| consumers.push(setState); | ||
| if (lastKnownState !== state) { | ||
| setState(lastKnownState); | ||
| } | ||
| return function () { | ||
| consumers.splice(consumers.indexOf(setState), 1); | ||
| if (consumers.length === 0 && unmountIfNoConsumers) { | ||
@@ -78,3 +64,5 @@ removeHook(); | ||
| } | ||
| }; // eslint-disable-next-line react-hooks/exhaustive-deps | ||
| }; | ||
| // eslint-disable-next-line react-hooks/exhaustive-deps | ||
| }, []); | ||
@@ -84,3 +72,2 @@ return state; | ||
| }; | ||
| exports.singletonHook = singletonHook; |
@@ -5,23 +5,14 @@ "use strict"; | ||
| exports.mount = exports.batch = void 0; | ||
| var _react = _interopRequireDefault(require("react")); | ||
| var _client = require("react-dom/client"); | ||
| var _reactDom = require("react-dom"); | ||
| var _warning = require("./warning"); | ||
| function _interopRequireDefault(obj) { return obj && obj.__esModule ? obj : { "default": obj }; } | ||
| // from https://github.com/purposeindustries/window-or-global/blob/master/lib/index.js | ||
| // avoid direct usage of 'window' because `window is not defined` error might happen in babel-node | ||
| var globalObject = typeof self === 'object' && self.self === self && self || typeof global === 'object' && global.global === global && global || void 0; | ||
| var batch = function batch(cb) { | ||
| return (0, _reactDom.unstable_batchedUpdates)(cb); | ||
| }; | ||
| exports.batch = batch; | ||
| var mount = function mount(C) { | ||
@@ -38,3 +29,2 @@ if (globalObject.document && globalObject.document.createElement) { | ||
| }; | ||
| exports.mount = mount; |
@@ -5,18 +5,13 @@ "use strict"; | ||
| exports.mount = exports.batch = void 0; | ||
| var _reactNative = require("react-native"); | ||
| var _warning = require("./warning"); | ||
| /* eslint-disable import/no-unresolved */ | ||
| /* eslint-disable import/no-unresolved */ | ||
| var batch = function batch(cb) { | ||
| return (0, _reactNative.unstable_batchedUpdates)(cb); | ||
| }; | ||
| exports.batch = batch; | ||
| var mount = function mount(C) { | ||
| (0, _warning.warning)('Can not mount SingletonHooksContainer with react native.' + 'Please mount SingletonHooksContainer into your components tree manually.'); | ||
| }; | ||
| exports.mount = mount; |
@@ -5,3 +5,2 @@ "use strict"; | ||
| exports.warning = void 0; | ||
| var warning = function warning(message) { | ||
@@ -12,3 +11,2 @@ if (console && console.warn) { | ||
| }; | ||
| exports.warning = warning; |
| { | ||
| "name": "react-singleton-hook", | ||
| "version": "4.0.0", | ||
| "version": "4.0.1", | ||
| "description": "Share custom hook state across all components", | ||
@@ -51,34 +51,35 @@ "keywords": [ | ||
| "devDependencies": { | ||
| "@babel/cli": "^7.17.6", | ||
| "@babel/core": "^7.17.9", | ||
| "@babel/eslint-parser": "^7.17.0", | ||
| "@babel/plugin-proposal-object-rest-spread": "^7.17.3", | ||
| "@babel/plugin-transform-object-assign": "^7.16.7", | ||
| "@babel/plugin-transform-react-display-name": "^7.16.7", | ||
| "@babel/plugin-transform-react-jsx": "^7.17.3", | ||
| "@babel/preset-env": "^7.16.11", | ||
| "@babel/cli": "^7.19.3", | ||
| "@babel/core": "^7.20.2", | ||
| "@babel/eslint-parser": "^7.19.1", | ||
| "@babel/plugin-proposal-object-rest-spread": "^7.20.2", | ||
| "@babel/plugin-transform-object-assign": "^7.18.6", | ||
| "@babel/plugin-transform-react-display-name": "^7.18.6", | ||
| "@babel/plugin-transform-react-jsx": "^7.19.0", | ||
| "@babel/preset-env": "^7.20.2", | ||
| "@rollup/plugin-commonjs": "^21.0.3", | ||
| "@rollup/plugin-node-resolve": "^13.2.0", | ||
| "@rollup/plugin-replace": "^4.0.0", | ||
| "@testing-library/jest-dom": "^5.16.4", | ||
| "@testing-library/jest-native": "^4.0.4", | ||
| "@testing-library/react": "^13.0.1", | ||
| "@testing-library/react-hooks": "^8.0.0", | ||
| "@testing-library/react-native": "^9.1.0", | ||
| "babel-jest": "^27.5.1", | ||
| "@testing-library/jest-dom": "^5.16.5", | ||
| "@testing-library/jest-native": "^5.2.0", | ||
| "@testing-library/react": "^13.4.0", | ||
| "@testing-library/react-hooks": "^8.0.1", | ||
| "@testing-library/react-native": "^11.4.0", | ||
| "babel-jest": "^29.3.1", | ||
| "cross-env": "^7.0.3", | ||
| "es3ify": "^0.2.2", | ||
| "eslint": "^8.13.0", | ||
| "eslint": "^8.27.0", | ||
| "eslint-plugin-import": "^2.26.0", | ||
| "eslint-plugin-react": "^7.29.4", | ||
| "eslint-plugin-react-hooks": "^4.4.0", | ||
| "glob": "^8.0.1", | ||
| "jest": "^27.5.1", | ||
| "metro-babel-register": "^0.70.1", | ||
| "metro-react-native-babel-preset": "^0.70.1", | ||
| "npm-check-updates": "^12.5.9", | ||
| "eslint-plugin-react": "^7.31.10", | ||
| "eslint-plugin-react-hooks": "^4.6.0", | ||
| "glob": "^8.0.3", | ||
| "jest": "^29.3.1", | ||
| "jest-environment-jsdom": "^29.3.1", | ||
| "metro-babel-register": "^0.73.3", | ||
| "metro-react-native-babel-preset": "^0.73.3", | ||
| "npm-check-updates": "^16.3.18", | ||
| "react": "^18.0.0", | ||
| "react-dom": "^18.0.0", | ||
| "react-native": "^0.68.0", | ||
| "react-test-renderer": "^18.0.0", | ||
| "react-native": "^0.70.5", | ||
| "react-test-renderer": "^18.2.0", | ||
| "rimraf": "^3.0.2", | ||
@@ -85,0 +86,0 @@ "rollup": "^2.70.1", |
@@ -29,4 +29,4 @@ React Singleton Hook | ||
| ### React 18 breaking change | ||
| `react-singleton-hook` version 4.0.0 starts using new React DOM API and is only compatible with react 18. | ||
| Please use 3.x.x if you have to stay on lover React versions. | ||
| `react-singleton-hook` version 4.0.0 starts using new React DOM API and is only compatible with React 18. | ||
| Please use 3.4.0 if you have to stay on lower React versions. | ||
@@ -33,0 +33,0 @@ ## What is a singleton hook |
@@ -67,3 +67,3 @@ import React, { useState, useEffect, useRef } from 'react'; | ||
| // no container and and no previous manually rendered containers | ||
| // no container and no previous manually rendered containers | ||
| if (renderedContainers.length === 0 && manualRender === false) { | ||
@@ -70,0 +70,0 @@ automaticRender = true; |
New alerts
License Policy Violation
LicenseThis 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
LicenseThis 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
- increased by0.14%
51966
- Lines of code
- increased by1.67%
852
Worsened metrics
- Dev dependency count
- increased by2.78%
37
No dependency changes