@gadeoli/rjs-hooks-library 0.2.0 → 0.2.2
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -1
- package/dist/cjs/index.js +1 -1
- package/dist/cjs/types/hooks/index.d.ts +1 -0
- package/dist/cjs/types/hooks/useGhostInFirstRender.d.ts +2 -0
- package/dist/cjs/types/hooks/useOnPressKey.types.d.ts +1 -1
- package/dist/esm/index.js +1 -1
- package/dist/esm/types/hooks/index.d.ts +1 -0
- package/dist/esm/types/hooks/useGhostInFirstRender.d.ts +2 -0
- package/dist/esm/types/hooks/useOnPressKey.types.d.ts +1 -1
- package/dist/index.d.ts +4 -2
- package/package.json +1 -1
package/README.md
CHANGED
|
@@ -13,6 +13,7 @@ Some (almost all) hooks has been copied from internet foruns. If necessary look
|
|
|
13
13
|
- useTimer (a count down minute / seconds)
|
|
14
14
|
- useClickOutside (An event handler to trigger an action by outside-click-element using ref)
|
|
15
15
|
- useOnPressKey (An event handler to trigger an action by key press using ref)
|
|
16
|
+
- useGhostInFirstRender (A negative boolean value that is setted positive after first render and a small delay)
|
|
16
17
|
|
|
17
18
|
## Use
|
|
18
19
|
|
|
@@ -39,4 +40,9 @@ useWindowSize
|
|
|
39
40
|
[useTimer](https://www.codegrepper.com/code-examples/javascript/time+counter+in+react+js)
|
|
40
41
|
useClickOutside
|
|
41
42
|
useOnPressKey
|
|
42
|
-
|
|
43
|
+
useGhostInFirstRender
|
|
44
|
+
some sources could be missing
|
|
45
|
+
|
|
46
|
+
|
|
47
|
+
## Changes
|
|
48
|
+
- useOnpressKey: added modifierKey support
|
package/dist/cjs/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
"use strict";var e=require("react"),t=require("@gadeoli/js-helpers-library"),n=function(){return n=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},n.apply(this,arguments)};function r(e,t,n,r){return new(n||(n=Promise))((function(o,u){function i(e){try{s(r.next(e))}catch(e){u(e)}}function c(e){try{s(r.throw(e))}catch(e){u(e)}}function s(e){var t;e.done?o(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(i,c)}s((r=r.apply(e,t||[])).next())}))}function o(e,t){var n,r,o,u={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]},i=Object.create(("function"==typeof Iterator?Iterator:Object).prototype);return i.next=c(0),i.throw=c(1),i.return=c(2),"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function c(c){return function(s){return function(c){if(n)throw new TypeError("Generator is already executing.");for(;i&&(i=0,c[0]&&(u=0)),u;)try{if(n=1,r&&(o=2&c[0]?r.return:c[0]?r.throw||((o=r.return)&&o.call(r),0):r.next)&&!(o=o.call(r,c[1])).done)return o;switch(r=0,o&&(c=[2&c[0],o.value]),c[0]){case 0:case 1:o=c;break;case 4:return u.label++,{value:c[1],done:!1};case 5:u.label++,r=c[1],c=[0];continue;case 7:c=u.ops.pop(),u.trys.pop();continue;default:if(!(o=u.trys,(o=o.length>0&&o[o.length-1])||6!==c[0]&&2!==c[0])){u=0;continue}if(3===c[0]&&(!o||c[1]>o[0]&&c[1]<o[3])){u.label=c[1];break}if(6===c[0]&&u.label<o[1]){u.label=o[1],o=c;break}if(o&&u.label<o[2]){u.label=o[2],u.ops.push(c);break}o[2]&&u.ops.pop(),u.trys.pop();continue}c=t.call(e,u)}catch(e){c=[6,e],r=0}finally{n=o=0}if(5&c[0])throw c[1];return{value:c[0]?c[1]:void 0,done:!0}}([c,s])}}}"function"==typeof SuppressedError&&SuppressedError;var u={width:1,height:1},i=function(e){return new Promise((function(t,n){var r=new Image;r.onload=function(){t(r)},r.onerror=r.onabort=function(){n(e)},r.src=e}))};exports.useElementSize=function(t,n){void 0===n&&(n=0);var r=e.useState({width:1,height:2,position:{x:1,y:1,left:1,right:1,top:1,bottom:1},screen:{width:1,height:1}}),o=r[0],u=r[1];return e.useEffect((function(){if(t.current){var e=function(){var e=t.current.getBoundingClientRect();u({width:Math.round(e.width),height:Math.round(e.height),position:{x:Math.round(e.x),y:Math.round(e.y),left:Math.round(e.left),right:Math.round(e.right),top:Math.round(e.top),bottom:Math.round(e.bottom)},screen:{width:Math.round(window.screen.width),height:Math.round(window.screen.height)}})};return window.addEventListener("resize",e),e(),function(){return window.removeEventListener("resize",e)}}}),[t,n]),o},exports.useHover=function(t){var n=e.useState(!1),r=n[0],o=n[1];return e.useEffect((function(){if(t&&t.current){var e=t.current,n=function(e){return o(!0)},r=function(e){return o(!1)};return e.addEventListener("mouseover",n),e.addEventListener("mouseout",r),function(){e.removeEventListener("mouseover",n),e.removeEventListener("mouseout",r)}}}),[t]),{show:r}},exports.useImagePreloader=function(t){var n=e.useState(!1),u=n[0],c=n[1];return e.useEffect((function(){var e=!1;return function(){r(this,void 0,void 0,(function(){var n,r,u,s;return o(this,(function(o){switch(o.label){case 0:if(e)return[2];for(n=[],r=0,u=t;r<u.length;r++)s=u[r],n.push(i(s));return[4,Promise.all(n)];case 1:return o.sent(),e?[2]:(c(!0),[2])}}))}))}(),function(){e=!0}}),[t]),{imagesPreloaded:u}},exports.useOnClickOutside=function(t,n){e.useEffect((function(){var e=function(e){t.current&&!t.current.contains(e.target)&&n(e)};return document.addEventListener("mousedown",e),document.addEventListener("touchstart",e),function(){document.removeEventListener("mousedown",e),document.removeEventListener("touchstart",e)}}),[t,n])},exports.useOnPressKey=function(t,n){e.useEffect((function(){var e=function(e){e.keyCode
|
|
1
|
+
"use strict";var e=require("react"),t=require("@gadeoli/js-helpers-library"),n=function(){return n=Object.assign||function(e){for(var t,n=1,r=arguments.length;n<r;n++)for(var o in t=arguments[n])Object.prototype.hasOwnProperty.call(t,o)&&(e[o]=t[o]);return e},n.apply(this,arguments)};function r(e,t,n,r){return new(n||(n=Promise))((function(o,u){function i(e){try{s(r.next(e))}catch(e){u(e)}}function c(e){try{s(r.throw(e))}catch(e){u(e)}}function s(e){var t;e.done?o(e.value):(t=e.value,t instanceof n?t:new n((function(e){e(t)}))).then(i,c)}s((r=r.apply(e,t||[])).next())}))}function o(e,t){var n,r,o,u={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]},i=Object.create(("function"==typeof Iterator?Iterator:Object).prototype);return i.next=c(0),i.throw=c(1),i.return=c(2),"function"==typeof Symbol&&(i[Symbol.iterator]=function(){return this}),i;function c(c){return function(s){return function(c){if(n)throw new TypeError("Generator is already executing.");for(;i&&(i=0,c[0]&&(u=0)),u;)try{if(n=1,r&&(o=2&c[0]?r.return:c[0]?r.throw||((o=r.return)&&o.call(r),0):r.next)&&!(o=o.call(r,c[1])).done)return o;switch(r=0,o&&(c=[2&c[0],o.value]),c[0]){case 0:case 1:o=c;break;case 4:return u.label++,{value:c[1],done:!1};case 5:u.label++,r=c[1],c=[0];continue;case 7:c=u.ops.pop(),u.trys.pop();continue;default:if(!(o=u.trys,(o=o.length>0&&o[o.length-1])||6!==c[0]&&2!==c[0])){u=0;continue}if(3===c[0]&&(!o||c[1]>o[0]&&c[1]<o[3])){u.label=c[1];break}if(6===c[0]&&u.label<o[1]){u.label=o[1],o=c;break}if(o&&u.label<o[2]){u.label=o[2],u.ops.push(c);break}o[2]&&u.ops.pop(),u.trys.pop();continue}c=t.call(e,u)}catch(e){c=[6,e],r=0}finally{n=o=0}if(5&c[0])throw c[1];return{value:c[0]?c[1]:void 0,done:!0}}([c,s])}}}"function"==typeof SuppressedError&&SuppressedError;var u={width:1,height:1},i=function(e){return new Promise((function(t,n){var r=new Image;r.onload=function(){t(r)},r.onerror=r.onabort=function(){n(e)},r.src=e}))};exports.useElementSize=function(t,n){void 0===n&&(n=0);var r=e.useState({width:1,height:2,position:{x:1,y:1,left:1,right:1,top:1,bottom:1},screen:{width:1,height:1}}),o=r[0],u=r[1];return e.useEffect((function(){if(t.current){var e=function(){var e=t.current.getBoundingClientRect();u({width:Math.round(e.width),height:Math.round(e.height),position:{x:Math.round(e.x),y:Math.round(e.y),left:Math.round(e.left),right:Math.round(e.right),top:Math.round(e.top),bottom:Math.round(e.bottom)},screen:{width:Math.round(window.screen.width),height:Math.round(window.screen.height)}})};return window.addEventListener("resize",e),e(),function(){return window.removeEventListener("resize",e)}}}),[t,n]),o},exports.useGhostInFirstRender=function(t){void 0===t&&(t=30);var n=e.useState(!1),r=n[0],o=n[1];return e.useEffect((function(){var e=setTimeout((function(){o(!0)}),t);return function(){return clearTimeout(e)}}),[t]),r},exports.useHover=function(t){var n=e.useState(!1),r=n[0],o=n[1];return e.useEffect((function(){if(t&&t.current){var e=t.current,n=function(e){return o(!0)},r=function(e){return o(!1)};return e.addEventListener("mouseover",n),e.addEventListener("mouseout",r),function(){e.removeEventListener("mouseover",n),e.removeEventListener("mouseout",r)}}}),[t]),{show:r}},exports.useImagePreloader=function(t){var n=e.useState(!1),u=n[0],c=n[1];return e.useEffect((function(){var e=!1;return function(){r(this,void 0,void 0,(function(){var n,r,u,s;return o(this,(function(o){switch(o.label){case 0:if(e)return[2];for(n=[],r=0,u=t;r<u.length;r++)s=u[r],n.push(i(s));return[4,Promise.all(n)];case 1:return o.sent(),e?[2]:(c(!0),[2])}}))}))}(),function(){e=!0}}),[t]),{imagesPreloaded:u}},exports.useOnClickOutside=function(t,n){e.useEffect((function(){var e=function(e){t.current&&!t.current.contains(e.target)&&n(e)};return document.addEventListener("mousedown",e),document.addEventListener("touchstart",e),function(){document.removeEventListener("mousedown",e),document.removeEventListener("touchstart",e)}}),[t,n])},exports.useOnPressKey=function(t,n,r){void 0===r&&(r=null),e.useEffect((function(){var e=function(e){e.keyCode!==t||r&&!e[r]||n()};return document.addEventListener("keydown",e),function(){return document.removeEventListener("keydown",e)}}),[n,t,r])},exports.usePersistedState=function(n,r){var o=e.useState((function(){var e=localStorage.getItem(n);return e?JSON.parse(e):r})),u=o[0],i=o[1];return e.useEffect((function(){localStorage.setItem(n,t.secureJSONStringify(u))}),[n,u]),[u,i]},exports.usePrevious=function(t){var n=e.useRef(null);return e.useEffect((function(){n.current=t})),n.current},exports.useTimer=function(t,n,r){void 0===t&&(t=0),void 0===n&&(n=0),void 0===r&&(r=1);var o=e.useState(t),u=o[0],i=o[1],c=e.useState(n),s=c[0],a=c[1];return e.useEffect((function(){i(t),a(n)}),[r]),e.useEffect((function(){})),e.useEffect((function(){var e=setInterval((function(){s>0&&a(s-1),0===s&&(0===u?clearInterval(e):(i(u-1),a(59)))}),1e3);return function(){clearInterval(e)}})),{minutes:u,seconds:s}},exports.useWindowSize=function(){var t=e.useState(n({},u)),r=t[0],o=t[1];return e.useEffect((function(){var e=function(){o({width:window.innerWidth,height:window.innerHeight})};return window.addEventListener("resize",e),e(),function(){return window.removeEventListener("resize",e)}}),[]),r};
|
|
@@ -7,3 +7,4 @@ export { default as useTimer } from "./useTimer";
|
|
|
7
7
|
export { default as useWindowSize } from "./useWindowSize";
|
|
8
8
|
export { default as useOnPressKey } from "./useOnPressKey";
|
|
9
9
|
export { default as useImagePreloader } from "./useImagePreloader";
|
|
10
|
+
export { default as useGhostInFirstRender } from "./useGhostInFirstRender";
|
package/dist/esm/index.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
import n,{useState as t,useEffect as e,useRef as r}from"react";import{secureJSONStringify as o}from"@gadeoli/js-helpers-library";var i=function(e,r){void 0===r&&(r=0);var o=t({width:1,height:2,position:{x:1,y:1,left:1,right:1,top:1,bottom:1},screen:{width:1,height:1}}),i=o[0],u=o[1];return n.useEffect((function(){if(e.current){var n=function(){var n=e.current.getBoundingClientRect();u({width:Math.round(n.width),height:Math.round(n.height),position:{x:Math.round(n.x),y:Math.round(n.y),left:Math.round(n.left),right:Math.round(n.right),top:Math.round(n.top),bottom:Math.round(n.bottom)},screen:{width:Math.round(window.screen.width),height:Math.round(window.screen.height)}})};return window.addEventListener("resize",n),n(),function(){return window.removeEventListener("resize",n)}}}),[e,r]),i},u=function(n){var r=t(!1),o=r[0],i=r[1];return e((function(){if(n&&n.current){var t=n.current,e=function(n){return i(!0)},r=function(n){return i(!1)};return t.addEventListener("mouseover",e),t.addEventListener("mouseout",r),function(){t.removeEventListener("mouseover",e),t.removeEventListener("mouseout",r)}}}),[n]),{show:o}},c=function(n,t){e((function(){var e=function(e){n.current&&!n.current.contains(e.target)&&t(e)};return document.addEventListener("mousedown",e),document.addEventListener("touchstart",e),function(){document.removeEventListener("mousedown",e),document.removeEventListener("touchstart",e)}}),[n,t])},a=function(n,r){var i=t((function(){var t=localStorage.getItem(n);return t?JSON.parse(t):r})),u=i[0],c=i[1];return e((function(){localStorage.setItem(n,o(u))}),[n,u]),[u,c]},f=function(n){var t=r(null);return e((function(){t.current=n})),t.current},s=function(n,r,o){void 0===n&&(n=0),void 0===r&&(r=0),void 0===o&&(o=1);var i=t(n),u=i[0],c=i[1],a=t(r),f=a[0],s=a[1];return e((function(){c(n),s(r)}),[o]),e((function(){})),e((function(){var n=setInterval((function(){f>0&&s(f-1),0===f&&(0===u?clearInterval(n):(c(u-1),s(59)))}),1e3);return function(){clearInterval(n)}})),{minutes:u,seconds:f}},d=function(){return d=Object.assign||function(n){for(var t,e=1,r=arguments.length;e<r;e++)for(var o in t=arguments[e])Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o]);return n},d.apply(this,arguments)};function
|
|
1
|
+
import n,{useState as t,useEffect as e,useRef as r}from"react";import{secureJSONStringify as o}from"@gadeoli/js-helpers-library";var i=function(e,r){void 0===r&&(r=0);var o=t({width:1,height:2,position:{x:1,y:1,left:1,right:1,top:1,bottom:1},screen:{width:1,height:1}}),i=o[0],u=o[1];return n.useEffect((function(){if(e.current){var n=function(){var n=e.current.getBoundingClientRect();u({width:Math.round(n.width),height:Math.round(n.height),position:{x:Math.round(n.x),y:Math.round(n.y),left:Math.round(n.left),right:Math.round(n.right),top:Math.round(n.top),bottom:Math.round(n.bottom)},screen:{width:Math.round(window.screen.width),height:Math.round(window.screen.height)}})};return window.addEventListener("resize",n),n(),function(){return window.removeEventListener("resize",n)}}}),[e,r]),i},u=function(n){var r=t(!1),o=r[0],i=r[1];return e((function(){if(n&&n.current){var t=n.current,e=function(n){return i(!0)},r=function(n){return i(!1)};return t.addEventListener("mouseover",e),t.addEventListener("mouseout",r),function(){t.removeEventListener("mouseover",e),t.removeEventListener("mouseout",r)}}}),[n]),{show:o}},c=function(n,t){e((function(){var e=function(e){n.current&&!n.current.contains(e.target)&&t(e)};return document.addEventListener("mousedown",e),document.addEventListener("touchstart",e),function(){document.removeEventListener("mousedown",e),document.removeEventListener("touchstart",e)}}),[n,t])},a=function(n,r){var i=t((function(){var t=localStorage.getItem(n);return t?JSON.parse(t):r})),u=i[0],c=i[1];return e((function(){localStorage.setItem(n,o(u))}),[n,u]),[u,c]},f=function(n){var t=r(null);return e((function(){t.current=n})),t.current},s=function(n,r,o){void 0===n&&(n=0),void 0===r&&(r=0),void 0===o&&(o=1);var i=t(n),u=i[0],c=i[1],a=t(r),f=a[0],s=a[1];return e((function(){c(n),s(r)}),[o]),e((function(){})),e((function(){var n=setInterval((function(){f>0&&s(f-1),0===f&&(0===u?clearInterval(n):(c(u-1),s(59)))}),1e3);return function(){clearInterval(n)}})),{minutes:u,seconds:f}},d=function(){return d=Object.assign||function(n){for(var t,e=1,r=arguments.length;e<r;e++)for(var o in t=arguments[e])Object.prototype.hasOwnProperty.call(t,o)&&(n[o]=t[o]);return n},d.apply(this,arguments)};function l(n,t,e,r){return new(e||(e=Promise))((function(o,i){function u(n){try{a(r.next(n))}catch(n){i(n)}}function c(n){try{a(r.throw(n))}catch(n){i(n)}}function a(n){var t;n.done?o(n.value):(t=n.value,t instanceof e?t:new e((function(n){n(t)}))).then(u,c)}a((r=r.apply(n,t||[])).next())}))}function h(n,t){var e,r,o,i={label:0,sent:function(){if(1&o[0])throw o[1];return o[1]},trys:[],ops:[]},u=Object.create(("function"==typeof Iterator?Iterator:Object).prototype);return u.next=c(0),u.throw=c(1),u.return=c(2),"function"==typeof Symbol&&(u[Symbol.iterator]=function(){return this}),u;function c(c){return function(a){return function(c){if(e)throw new TypeError("Generator is already executing.");for(;u&&(u=0,c[0]&&(i=0)),i;)try{if(e=1,r&&(o=2&c[0]?r.return:c[0]?r.throw||((o=r.return)&&o.call(r),0):r.next)&&!(o=o.call(r,c[1])).done)return o;switch(r=0,o&&(c=[2&c[0],o.value]),c[0]){case 0:case 1:o=c;break;case 4:return i.label++,{value:c[1],done:!1};case 5:i.label++,r=c[1],c=[0];continue;case 7:c=i.ops.pop(),i.trys.pop();continue;default:if(!(o=i.trys,(o=o.length>0&&o[o.length-1])||6!==c[0]&&2!==c[0])){i=0;continue}if(3===c[0]&&(!o||c[1]>o[0]&&c[1]<o[3])){i.label=c[1];break}if(6===c[0]&&i.label<o[1]){i.label=o[1],o=c;break}if(o&&i.label<o[2]){i.label=o[2],i.ops.push(c);break}o[2]&&i.ops.pop(),i.trys.pop();continue}c=t.call(n,i)}catch(n){c=[6,n],r=0}finally{e=o=0}if(5&c[0])throw c[1];return{value:c[0]?c[1]:void 0,done:!0}}([c,a])}}}"function"==typeof SuppressedError&&SuppressedError;var v={width:1,height:1},w=function(){var n=t(d({},v)),r=n[0],o=n[1];return e((function(){var n=function(){o({width:window.innerWidth,height:window.innerHeight})};return window.addEventListener("resize",n),n(),function(){return window.removeEventListener("resize",n)}}),[]),r},p=function(n,t,r){void 0===r&&(r=null),e((function(){var e=function(e){e.keyCode!==n||r&&!e[r]||t()};return document.addEventListener("keydown",e),function(){return document.removeEventListener("keydown",e)}}),[t,n,r])},m=function(n){return new Promise((function(t,e){var r=new Image;r.onload=function(){t(r)},r.onerror=r.onabort=function(){e(n)},r.src=n}))},g=function(n){var r=t(!1),o=r[0],i=r[1];return e((function(){var t=!1;return function(){l(this,void 0,void 0,(function(){var e,r,o,u;return h(this,(function(c){switch(c.label){case 0:if(t)return[2];for(e=[],r=0,o=n;r<o.length;r++)u=o[r],e.push(m(u));return[4,Promise.all(e)];case 1:return c.sent(),t?[2]:(i(!0),[2])}}))}))}(),function(){t=!0}}),[n]),{imagesPreloaded:o}},y=function(n){void 0===n&&(n=30);var r=t(!1),o=r[0],i=r[1];return e((function(){var t=setTimeout((function(){i(!0)}),n);return function(){return clearTimeout(t)}}),[n]),o};export{i as useElementSize,y as useGhostInFirstRender,u as useHover,g as useImagePreloader,c as useOnClickOutside,p as useOnPressKey,a as usePersistedState,f as usePrevious,s as useTimer,w as useWindowSize};
|
|
@@ -7,3 +7,4 @@ export { default as useTimer } from "./useTimer";
|
|
|
7
7
|
export { default as useWindowSize } from "./useWindowSize";
|
|
8
8
|
export { default as useOnPressKey } from "./useOnPressKey";
|
|
9
9
|
export { default as useImagePreloader } from "./useImagePreloader";
|
|
10
|
+
export { default as useGhostInFirstRender } from "./useGhostInFirstRender";
|
package/dist/index.d.ts
CHANGED
|
@@ -64,7 +64,7 @@ interface useWindowSizeProps {
|
|
|
64
64
|
declare const useWindowSize: useWindowSizeProps;
|
|
65
65
|
|
|
66
66
|
interface useOnPressKeyProps {
|
|
67
|
-
(keyAsc: number, action: any): void;
|
|
67
|
+
(keyAsc: number, action: any, modifierKey: string | null): void;
|
|
68
68
|
}
|
|
69
69
|
|
|
70
70
|
declare const useOnPressKey: useOnPressKeyProps;
|
|
@@ -75,4 +75,6 @@ interface useImagePreloaderProps {
|
|
|
75
75
|
|
|
76
76
|
declare const useImagePreloader: useImagePreloaderProps;
|
|
77
77
|
|
|
78
|
-
|
|
78
|
+
declare const useGhostInFirstRender: (delay?: number) => boolean;
|
|
79
|
+
|
|
80
|
+
export { useElementSize, useGhostInFirstRender, useHover, useImagePreloader, useOnClickOutside, useOnPressKey, usePersistedState, usePrevious, useTimer, useWindowSize };
|