Huge News!Announcing our $40M Series B led by Abstract Ventures.Learn More →
react-hooks-combine
Advanced tools
react-hooks-combine - npm Package Compare versions
Comparing version 1.7.0 to 1.7.1
@@ -0,1 +1,4 @@ | ||
| # 1.7.1 | ||
| - Update internals and README.md | ||
| # 1.7.0 | ||
@@ -2,0 +5,0 @@ - Export #pipe function to create custom hook based on hooks collection to replace combine in case if it's necessary |
@@ -1,2 +0,2 @@ | ||
| "use strict";function _interopDefault(e){return e&&"object"==typeof e&&"default"in e?e.default:e}Object.defineProperty(exports,"__esModule",{value:!0});var React=require("react"),React__default=_interopDefault(React);function _typeof(e){return(_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(e){return typeof e}:function(e){return e&&"function"==typeof Symbol&&e.constructor===Symbol&&e!==Symbol.prototype?"symbol":typeof e})(e)}function _defineProperty(e,t,r){return t in e?Object.defineProperty(e,t,{value:r,enumerable:!0,configurable:!0,writable:!0}):e[t]=r,e}function _extends(){return(_extends=Object.assign||function(e){for(var t=1;t<arguments.length;t++){var r=arguments[t];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(e[n]=r[n])}return e}).apply(this,arguments)}function ownKeys(t,e){var r=Object.keys(t);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(t);e&&(n=n.filter(function(e){return Object.getOwnPropertyDescriptor(t,e).enumerable})),r.push.apply(r,n)}return r}function _objectSpread2(t){for(var e=1;e<arguments.length;e++){var r=null!=arguments[e]?arguments[e]:{};e%2?ownKeys(r,!0).forEach(function(e){_defineProperty(t,e,r[e])}):Object.getOwnPropertyDescriptors?Object.defineProperties(t,Object.getOwnPropertyDescriptors(r)):ownKeys(r).forEach(function(e){Object.defineProperty(t,e,Object.getOwnPropertyDescriptor(r,e))})}return t}function _slicedToArray(e,t){return _arrayWithHoles(e)||_iterableToArrayLimit(e,t)||_nonIterableRest()}function _toConsumableArray(e){return _arrayWithoutHoles(e)||_iterableToArray(e)||_nonIterableSpread()}function _arrayWithoutHoles(e){if(Array.isArray(e)){for(var t=0,r=new Array(e.length);t<e.length;t++)r[t]=e[t];return r}}function _arrayWithHoles(e){if(Array.isArray(e))return e}function _iterableToArray(e){if(Symbol.iterator in Object(e)||"[object Arguments]"===Object.prototype.toString.call(e))return Array.from(e)}function _iterableToArrayLimit(e,t){var r=[],n=!0,o=!1,a=void 0;try{for(var i,c=e[Symbol.iterator]();!(n=(i=c.next()).done)&&(r.push(i.value),!t||r.length!==t);n=!0);}catch(e){o=!0,a=e}finally{try{n||null==c.return||c.return()}finally{if(o)throw a}}return r}function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}var baseToString=Object.prototype.toString,getInternalCtor=function(e){return baseToString.call(e).slice(8,-1)},isFunction=function(e){return"Function"===getInternalCtor(e)},isObject=function(e){return"Object"===getInternalCtor(e)},isNotFunction=function(e){return!isFunction(e)},isPromiseLike=function(e){return e&&("Promise"===getInternalCtor(e)||isFunction(e.then)&&isFunction(e.catch))},isCombineConfigMode=function(e){return isObject(e[0])},unwindLoop=function(e,t){var r=Function,n=Object.entries(t).map(function(e){var t=_slicedToArray(e,1)[0];return"box.".concat(t," = useCustomHook(fns.").concat(t,", deps, state, props);")}).join("\n");return new r("useCustomHook","fns","deps","state","props","\n const box = {};\n ".concat(n,"\n return box\n ")).bind(null,e,t)},prop=function(e,t){if(null==e)return e;var r=e,n=t.split("."),o=!0,a=!1,i=void 0;try{for(var c,u=n[Symbol.iterator]();!(o=(c=u.next()).done);o=!0){var f=c.value;if(!(r=r&&r[f]))return}}catch(e){a=!0,i=e}finally{try{o||null==u.return||u.return()}finally{if(a)throw i}}return r},getDeps=function(t,e){return Array.isArray(e)?e.map(function(e){return prop(t,e)}):e},defaultProps=function(e,t){if("object"!==_typeof(e))throw Error("defaultProps expects object, got a ".concat(getInternalCtor(e)));return t.defaultProps=e,t},identity=function(e){return e},iteratee=function(e,t){return t(e)},enchance=function(e){for(var t=arguments.length,r=new Array(1<t?t-1:0),n=1;n<t;n++)r[n-1]=arguments[n];return r.reduce(iteratee,e)},merge=function(e,t){return _objectSpread2({},e,{},t)},mapBody=function(e,t){return"\n const result".concat(t," = funcs[").concat(t,"](state").concat(t,", props, ref);\n const state").concat(t+1," = merge(result").concat(t,", state").concat(t,");\n")},hookBuilder=function(e){var t=e.findIndex(isNotFunction);if(-1!==t)throw Error("\n Expected function,\n got a: ".concat(_typeof(e[t]),"\n on index: ").concat(t,"\n "));var r=Function,n=e.map(mapBody).join("\n");return new r("funcs","merge","props","ref","\n const state0 = {};\n ".concat(n,"\n return state").concat(e.length,";\n ")).bind(null,e,merge)},combineFromConfig=function(e,t){var r=_objectSpread2({hooks:[],hocs:[],forwardRef:!1,transformProps:identity,transformPropsBefore:identity},e),n=r.hooks,o=r.hocs,a=r.forwardRef,i=r.defaultProps,c=r.transformProps,u=r.transformPropsBefore,f=hookBuilder(n),s=a?React.forwardRef:identity,p=s(t),l=s(function(e,t){var r,n=u(e),o=_objectSpread2({},n,{},f(n,t));return a&&(r=t),React__default.createElement(p,_extends({},c(o),{ref:r}))});return i&&defaultProps(i,l),enchance.apply(void 0,[l].concat(_toConsumableArray(o)))},combine=function(){for(var e=arguments.length,r=new Array(e),t=0;t<e;t++)r[t]=arguments[t];return function(e){var t=isCombineConfigMode(r)?combineFromConfig(r[0],e):combineFromConfig({hooks:r},e);return t.displayName="".concat(e.displayName||e.name,"Hooked"),t}},withImperativeHandle=function(o,a){return function(e,t,r){var n=getDeps(_objectSpread2({},e,{},t),a);React.useImperativeHandle(r,function(){return o(e,t)},n)}},withCallbacks=function(e,r){var n=unwindLoop(function(e,t,r,n){var o=isFunction(e)?e:e.func,a=getDeps(_objectSpread2({},r,{},n),e.deps||t);return React.useCallback(o(r,n),a)},e);return function(e,t){return n(r,e,t)}},withCallback=function(n,o,a){return function(e,t){var r=getDeps(_objectSpread2({},e,{},t),a);return _defineProperty({},n,React.useCallback(o(e,t),r))}},createWithEffect=function(i){return function(o,a){return function(t,r){var e=getDeps(_objectSpread2({},t,{},r),a),n=React.useRef({state:t,props:r});i(function(){var e=o(t,r,n.current);return n.current={state:t,props:r},e},e)}}},withEffect=createWithEffect(React.useEffect),withLayoutEffect=createWithEffect(React.useLayoutEffect),withStateHandlers=function(r,i){var o=isFunction(r)?function(e,t){return function(){return r(e,t)}}:function(){return r},u=new WeakMap;return function(e,t){var r=_slicedToArray(React.useState(o(e,t)),2),a=r[0],c=r[1];u.has(c)||function(){var r={state:a,props:t,actionHandlers:{}};u.set(c,r);for(var e=function(){var e=_slicedToArray(o[n],2),t=e[0],i=e[1];r.actionHandlers[t]=function(){for(var e=u.get(c),t=e.state,r=e.props,n=arguments.length,o=new Array(n),a=0;a<n;a++)o[a]=arguments[a];!function(e){var t=u.get(c),o=t.state;if(Object.entries(e).some(function(e){var t=_slicedToArray(e,2),r=t[0],n=t[1];return o[r]!==n})){var r=_objectSpread2({},o,{},e);t.state=r,c(r)}}(i({args:o,state:t,props:r}))}},n=0,o=Object.entries(i);n<o.length;n++)e()}();var n=u.get(c);return n.state=a,n.props=t,_objectSpread2({},a,{},n.actionHandlers)}},withAsyncEffect=function(e){var t=_objectSpread2({dataName:"data",errorName:"error",loadingName:"loading"},e),u=t.asyncAction,f=t.disposeAction,s=t.dataName,p=t.loadingName,l=t.errorName,d=t.deps;return function(r,n){var e,o=React.useRef({state:r,props:n}),a=React.useRef(!1),t=_slicedToArray(React.useState((_defineProperty(e={},p,!0),_defineProperty(e,s,null),_defineProperty(e,l,null),e)),2),i=t[0],c=t[1];return React.useEffect(function(){var e;a.current&&c((_defineProperty(e={},p,!0),_defineProperty(e,s,i[s]),_defineProperty(e,l,null),e));a.current=!0;var t=u(r,n,o.current);if(o.current={state:r,props:n},!isPromiseLike(t))throw Error("withAsyncEffect expects Promise, got a: ".concat(getInternalCtor(t)));return t.then(function(e){var t;c((_defineProperty(t={},p,!1),_defineProperty(t,s,e),_defineProperty(t,l,null),t))},function(e){var t;c((_defineProperty(t={},p,!1),_defineProperty(t,s,i[s]),_defineProperty(t,l,e),t))}),f},getDeps(_objectSpread2({},r,{},n),d)),i}},withDebugValue=function(n,o){return function(e,t){var r=n(e,t);React.useDebugValue(r,o)}},withMemos=function(e,r){var n=unwindLoop(function(e,t,r,n){var o=isFunction(e)?e:e.func,a=getDeps(_objectSpread2({},r,{},n),e.deps||t);return React.useMemo(function(){return o(r,n)},a)},e);return function(e,t){return n(r,e,t)}},withMemo=function(n,o,a){return function(e,t){var r=React.useMemo(function(){return o(e,t)},getDeps(_objectSpread2({},e,{},t),a));return _defineProperty({},n,r)}},withContext=function(t,r,e){var n=2<arguments.length&&void 0!==e?e:identity;return function(){var e=React.useContext(r);return _defineProperty({},t,n(e))}},withReducer=function(e){var t=_objectSpread2({dispatchName:"dispatch"},e),o=t.reducer,a=t.stateName,i=t.dispatchName,c=t.initialState,u=t.init;return function(){var e,t=_slicedToArray(React.useReducer(o,c,u),2),r=t[0],n=t[1];return _defineProperty(e={},a,r),_defineProperty(e,i,n),e}},withState=function(i,c,r){var u=isFunction(r)?function(e,t){return function(){return r(e,t)}}:function(){return r};return function(e,t){var r,n=_slicedToArray(React.useState(u(e,t)),2),o=n[0],a=n[1];return _defineProperty(r={},i,o),_defineProperty(r,c,a),r}},withRef=function(t,r){return function(){var e=React.useRef(r);return _defineProperty({},t,e)}};exports.combine=combine,exports.defaultProps=defaultProps,exports.enchance=enchance,exports.pipe=hookBuilder,exports.withAsyncEffect=withAsyncEffect,exports.withCallback=withCallback,exports.withCallbacks=withCallbacks,exports.withContext=withContext,exports.withDebugValue=withDebugValue,exports.withEffect=withEffect,exports.withImperativeHandle=withImperativeHandle,exports.withLayoutEffect=withLayoutEffect,exports.withMemo=withMemo,exports.withMemos=withMemos,exports.withReducer=withReducer,exports.withRef=withRef,exports.withState=withState,exports.withStateHandlers=withStateHandlers; | ||
| "use strict";function _interopDefault(t){return t&&"object"==typeof t&&"default"in t?t.default:t}Object.defineProperty(exports,"__esModule",{value:!0});var React=require("react"),React__default=_interopDefault(React);function _typeof(t){return(_typeof="function"==typeof Symbol&&"symbol"==typeof Symbol.iterator?function(t){return typeof t}:function(t){return t&&"function"==typeof Symbol&&t.constructor===Symbol&&t!==Symbol.prototype?"symbol":typeof t})(t)}function _defineProperty(t,e,r){return e in t?Object.defineProperty(t,e,{value:r,enumerable:!0,configurable:!0,writable:!0}):t[e]=r,t}function _extends(){return(_extends=Object.assign||function(t){for(var e=1;e<arguments.length;e++){var r=arguments[e];for(var n in r)Object.prototype.hasOwnProperty.call(r,n)&&(t[n]=r[n])}return t}).apply(this,arguments)}function ownKeys(e,t){var r=Object.keys(e);if(Object.getOwnPropertySymbols){var n=Object.getOwnPropertySymbols(e);t&&(n=n.filter(function(t){return Object.getOwnPropertyDescriptor(e,t).enumerable})),r.push.apply(r,n)}return r}function _objectSpread2(e){for(var t=1;t<arguments.length;t++){var r=null!=arguments[t]?arguments[t]:{};t%2?ownKeys(Object(r),!0).forEach(function(t){_defineProperty(e,t,r[t])}):Object.getOwnPropertyDescriptors?Object.defineProperties(e,Object.getOwnPropertyDescriptors(r)):ownKeys(Object(r)).forEach(function(t){Object.defineProperty(e,t,Object.getOwnPropertyDescriptor(r,t))})}return e}function _slicedToArray(t,e){return _arrayWithHoles(t)||_iterableToArrayLimit(t,e)||_nonIterableRest()}function _toConsumableArray(t){return _arrayWithoutHoles(t)||_iterableToArray(t)||_nonIterableSpread()}function _arrayWithoutHoles(t){if(Array.isArray(t)){for(var e=0,r=new Array(t.length);e<t.length;e++)r[e]=t[e];return r}}function _arrayWithHoles(t){if(Array.isArray(t))return t}function _iterableToArray(t){if(Symbol.iterator in Object(t)||"[object Arguments]"===Object.prototype.toString.call(t))return Array.from(t)}function _iterableToArrayLimit(t,e){if(Symbol.iterator in Object(t)||"[object Arguments]"===Object.prototype.toString.call(t)){var r=[],n=!0,o=!1,a=void 0;try{for(var i,c=t[Symbol.iterator]();!(n=(i=c.next()).done)&&(r.push(i.value),!e||r.length!==e);n=!0);}catch(t){o=!0,a=t}finally{try{n||null==c.return||c.return()}finally{if(o)throw a}}return r}}function _nonIterableSpread(){throw new TypeError("Invalid attempt to spread non-iterable instance")}function _nonIterableRest(){throw new TypeError("Invalid attempt to destructure non-iterable instance")}var baseToString=Object.prototype.toString,getInternalCtor=function(t){return baseToString.call(t).slice(8,-1)},isFunction=function(t){return"Function"===getInternalCtor(t)},isObject=function(t){return"Object"===getInternalCtor(t)},isNotFunction=function(t){return!isFunction(t)},isPromiseLike=function(t){return t&&("Promise"===getInternalCtor(t)||isFunction(t.then)&&isFunction(t.catch))},isCombineConfigMode=function(t){return isObject(t[0])},unwindLoop=function(t,e){var r=Function,n=Object.entries(e).map(function(t){var e=_slicedToArray(t,1)[0];return"box.".concat(e," = useCustomHook(fns.").concat(e,", deps, state, props);")}).join("\n");return new r("useCustomHook","fns","deps","state","props","\n const box = {};\n ".concat(n,"\n return box\n ")).bind(null,t,e)},prop=function(t,e){if(null==t)return t;var r=t,n=e.split("."),o=!0,a=!1,i=void 0;try{for(var c,u=n[Symbol.iterator]();!(o=(c=u.next()).done);o=!0){var f=c.value;if(!(r=r&&r[f]))return}}catch(t){a=!0,i=t}finally{try{o||null==u.return||u.return()}finally{if(a)throw i}}return r},getDeps=function(e,t){return Array.isArray(t)?t.map(function(t){return prop(e,t)}):t},defaultProps=function(t,e){if("object"!==_typeof(t))throw Error("defaultProps expects object, got a ".concat(getInternalCtor(t)));return e.defaultProps=t,e},identity=function(t){return t},iteratee=function(t,e){return e(t)},enchance=function(t){for(var e=arguments.length,r=new Array(1<e?e-1:0),n=1;n<e;n++)r[n-1]=arguments[n];return r.reduce(iteratee,t)},merge=function(t,e){return _objectSpread2({},t,{},e)},mapBody=function(t,e){return"\n const result".concat(e," = funcs[").concat(e,"](state").concat(e,", props, ref);\n const state").concat(e+1," = merge(result").concat(e,", state").concat(e,");\n")},hookBuilder=function(t){var e=t.findIndex(isNotFunction);if(-1!==e)throw Error("\n Expected function,\n got a: ".concat(_typeof(t[e]),"\n on index: ").concat(e,"\n "));var r=Function,n=t.map(mapBody).join("\n");return new r("funcs","merge","props","ref","\n const state0 = {};\n ".concat(n,"\n return state").concat(t.length,";\n ")).bind(null,t,merge)},combineFromConfig=function(t,e){var r=_objectSpread2({hooks:[],hocs:[],forwardRef:!1,transformProps:identity,transformPropsBefore:identity},t),n=r.hooks,o=r.hocs,a=r.forwardRef,i=r.defaultProps,c=r.transformProps,u=r.transformPropsBefore,f=hookBuilder(n),s=a?React.forwardRef:identity,p=s(e),l=s(function(t,e){var r,n=u(t),o=_objectSpread2({},n,{},f(n,e));return a&&(r=e),React__default.createElement(p,_extends({},c(o),{ref:r}))});return i&&defaultProps(i,l),enchance.apply(void 0,[l].concat(_toConsumableArray(o)))},combine=function(){for(var t=arguments.length,r=new Array(t),e=0;e<t;e++)r[e]=arguments[e];return function(t){var e=isCombineConfigMode(r)?combineFromConfig(r[0],t):combineFromConfig({hooks:r},t);return e.displayName="".concat(t.displayName||t.name,"Hooked"),e}},withImperativeHandle=function(o,a){return function(t,e,r){var n=getDeps(_objectSpread2({},t,{},e),a);React.useImperativeHandle(r,function(){return o(t,e)},n)}},withCallbacks=function(t,r){var n=unwindLoop(function(t,e,r,n){var o=isFunction(t)?t:t.func,a=getDeps(_objectSpread2({},r,{},n),t.deps||e);return React.useCallback(o(r,n),a)},t);return function(t,e){return n(r,t,e)}},withCallback=function(n,o,a){return function(t,e){var r=getDeps(_objectSpread2({},t,{},e),a);return _defineProperty({},n,React.useCallback(o(t,e),r))}},createWithEffect=function(i){return function(o,a){return function(e,r){var t=getDeps(_objectSpread2({},e,{},r),a),n=React.useRef({state:e,props:r});i(function(){var t=o(e,r,n.current);return n.current={state:e,props:r},t},t)}}},withEffect=createWithEffect(React.useEffect),withLayoutEffect=createWithEffect(React.useLayoutEffect),withStateHandlers=function(r,i){var o=isFunction(r)?function(t,e){return function(){return r(t,e)}}:function(){return r},u=new WeakMap;return function(t,e){var r=_slicedToArray(React.useState(o(t,e)),2),a=r[0],c=r[1];u.has(c)||function(){var r={state:a,props:e,actionHandlers:{}};u.set(c,r);for(var t=function(){var t=_slicedToArray(o[n],2),e=t[0],i=t[1];r.actionHandlers[e]=function(){for(var t=u.get(c),e=t.state,r=t.props,n=arguments.length,o=new Array(n),a=0;a<n;a++)o[a]=arguments[a];!function(t){var e=u.get(c),o=e.state;if(Object.entries(t).some(function(t){var e=_slicedToArray(t,2),r=e[0],n=e[1];return o[r]!==n})){var r=_objectSpread2({},o,{},t);e.state=r,c(r)}}(i({args:o,state:e,props:r}))}},n=0,o=Object.entries(i);n<o.length;n++)t()}();var n=u.get(c);return n.state=a,n.props=e,_objectSpread2({},a,{},n.actionHandlers)}},withAsyncEffect=function(t){var e=_objectSpread2({dataName:"data",errorName:"error",loadingName:"loading"},t),u=e.asyncAction,f=e.disposeAction,s=e.dataName,p=e.loadingName,l=e.errorName,d=e.deps;return function(r,n){var t,o=React.useRef({state:r,props:n}),a=React.useRef(!1),e=_slicedToArray(React.useState((_defineProperty(t={},p,!0),_defineProperty(t,s,null),_defineProperty(t,l,null),t)),2),i=e[0],c=e[1];return React.useEffect(function(){var t;a.current&&c((_defineProperty(t={},p,!0),_defineProperty(t,s,i[s]),_defineProperty(t,l,null),t));a.current=!0;var e=u(r,n,o.current);if(o.current={state:r,props:n},!isPromiseLike(e))throw Error("withAsyncEffect expects Promise, got a: ".concat(getInternalCtor(e)));return e.then(function(t){var e;c((_defineProperty(e={},p,!1),_defineProperty(e,s,t),_defineProperty(e,l,null),e))},function(t){var e;c((_defineProperty(e={},p,!1),_defineProperty(e,s,i[s]),_defineProperty(e,l,t),e))}),f},getDeps(_objectSpread2({},r,{},n),d)),i}},withDebugValue=function(n,o){return function(t,e){var r=n(t,e);React.useDebugValue(r,o)}},withMemos=function(t,r){var n=unwindLoop(function(t,e,r,n){var o=isFunction(t)?t:t.func,a=getDeps(_objectSpread2({},r,{},n),t.deps||e);return React.useMemo(function(){return o(r,n)},a)},t);return function(t,e){return n(r,t,e)}},withMemo=function(n,o,a){return function(t,e){var r=React.useMemo(function(){return o(t,e)},getDeps(_objectSpread2({},t,{},e),a));return _defineProperty({},n,r)}},withContext=function(e,r,t){var n=2<arguments.length&&void 0!==t?t:identity;return function(){var t=React.useContext(r);return _defineProperty({},e,n(t))}},withReducer=function(t){var e=_objectSpread2({dispatchName:"dispatch"},t),o=e.reducer,a=e.stateName,i=e.dispatchName,c=e.initialState,u=e.init;return function(){var t,e=_slicedToArray(React.useReducer(o,c,u),2),r=e[0],n=e[1];return _defineProperty(t={},a,r),_defineProperty(t,i,n),t}},withState=function(i,c,r){var u=isFunction(r)?function(t,e){return function(){return r(t,e)}}:function(){return r};return function(t,e){var r,n=_slicedToArray(React.useState(u(t,e)),2),o=n[0],a=n[1];return _defineProperty(r={},i,o),_defineProperty(r,c,a),r}},withRef=function(e,r){return function(){var t=React.useRef(r);return _defineProperty({},e,t)}};exports.combine=combine,exports.defaultProps=defaultProps,exports.enchance=enchance,exports.pipe=hookBuilder,exports.withAsyncEffect=withAsyncEffect,exports.withCallback=withCallback,exports.withCallbacks=withCallbacks,exports.withContext=withContext,exports.withDebugValue=withDebugValue,exports.withEffect=withEffect,exports.withImperativeHandle=withImperativeHandle,exports.withLayoutEffect=withLayoutEffect,exports.withMemo=withMemo,exports.withMemos=withMemos,exports.withReducer=withReducer,exports.withRef=withRef,exports.withState=withState,exports.withStateHandlers=withStateHandlers; | ||
| //# sourceMappingURL=index.js.map |
| { | ||
| "version": "1.7.0", | ||
| "version": "1.7.1", | ||
| "name": "react-hooks-combine", | ||
@@ -4,0 +4,0 @@ "description": "React hooks powered, recompose like utility belt for ladies and gentlemen.", |
@@ -32,4 +32,82 @@ # React hooks combine | ||
| ```javascript | ||
| import React from 'react' | ||
| import { withState, pipe, withCallbacks } from 'react-hooks-combine' | ||
| const useCount = pipe( | ||
| withState('count', 'setCount', 0), | ||
| // try to not forget about dependencies since it's hooks, not a hocs | ||
| withCallbacks({ | ||
| increment: ({ count, setCount }) => () => setCount(count + 1), | ||
| decrement: ({ count, setCount }) => () => setCount(count - 1), | ||
| }) | ||
| ) | ||
| function Counter() { | ||
| const { count, increment, decrement } = useCount() | ||
| return ( | ||
| <div> | ||
| <button onClick={decrement}>-1</button> | ||
| {count} | ||
| <button onClick={increment}>+1</button> | ||
| </div> | ||
| ) | ||
| } | ||
| export default Counter | ||
| ``` | ||
| __OR__ | ||
| ```javascript | ||
| import { pipe, withAsyncEffect, withCallbacks } from 'react-hooks-combine' | ||
| const useCurrentUser = pipe( | ||
| withContext('repository', RepositoryContext), | ||
| withAsyncEffect({ | ||
| deps: [], | ||
| dataName: 'details', | ||
| loadingName: 'loading', | ||
| async asyncAction({ repository } /* state */, props) { | ||
| const { userRepository } = repository | ||
| const details = await userRepository.getCurrentUser() | ||
| return details | ||
| } | ||
| }), | ||
| // check withCallbacks section for syntax | ||
| withCallbacks({ | ||
| onDelete: () => () => { | ||
| ... | ||
| }, | ||
| onUpdate: { | ||
| deps: [...], | ||
| func: () => () => {}, | ||
| }, | ||
| }, [...]), | ||
| ) | ||
| export const UserView = (props) => { | ||
| // useCurrentUser is a custom hook | ||
| // and returns object which contains properties: | ||
| // details, onDelete, onUpdate, loading, repository | ||
| // details contains info that comes from some external source by async request | ||
| const user = useCurrentUser(props) | ||
| return ( | ||
| <div> | ||
| <h2>Hello {user.details.firstName</h2> | ||
| ... | ||
| <button click={user.onUpdate}>Update</button> | ||
| <button click={user.onDelete}>Delete</button> | ||
| </div> | ||
| ) | ||
| } | ||
| ``` | ||
| __OR__ | ||
| ```javascript | ||
| // component.jsx | ||
@@ -36,0 +114,0 @@ import React from 'react' |
Sorry, the diff of this file is not supported yet
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 by5.18%
39794
- Number of lines in readme file
- increased by50%
234
No dependency changes