@studio-lumio/hooks
Version:
a compilation of react hooks we use to make our magic
3 lines (2 loc) • 16.7 kB
JavaScript
!function(e,n){"object"==typeof exports&&"undefined"!=typeof module?n(exports,require("react"),require("@studio-freight/tempus"),require("js-cookie")):"function"==typeof define&&define.amd?define(["exports","react","@studio-freight/tempus","js-cookie"],n):n((e||self).hooks={},e.react,e.tempus,e.jsCookie)}(this,function(e,n,t,r){function u(e){return e&&"object"==typeof e&&"default"in e?e:{default:e}}var o=/*#__PURE__*/u(r);function i(){var e=n.useState(!1),t=e[0],r=e[1];return n.useEffect(function(){r(!0)},[]),t}var c="undefined"!=typeof window?n.useLayoutEffect:n.useEffect;function a(e){return e?e.getBoundingClientRect():{bottom:0,height:0,left:0,right:0,top:0,width:0}}function s(e,t,r,u){var o=n.useRef(t);c(function(){o.current=t},[t]),n.useEffect(function(){var n,t=null!=(n=null==r?void 0:r.current)?n:window;if(t&&t.addEventListener){var i=function(e){return o.current(e)};return t.addEventListener(e,i,u),function(){t.removeEventListener(e,i,u)}}},[e,r,u])}var f=function(e){var t=n.useRef(e),r=n.useRef(),u=n.useRef(!1),o=n.useRef(!1),i=n.useState(0)[1];u.current&&(o.current=!0),n.useEffect(function(){return u.current||(r.current=t.current(),u.current=!0),i(function(e){return e+1}),function(){o.current&&r.current&&r.current()}},[])};function d(){var e=n.useRef(!0);return e.current?(e.current=!1,!0):e.current}var l=function(e){var t=n.useRef(e);t.current=e,f(function(){return function(){return t.current()}})};e.useCookie=function(e){var t=n.useState(function(){return o.default.get(e)||null}),r=t[1];return[t[0],n.useCallback(function(n,t){o.default.set(e,n,t),r(n)},[e]),n.useCallback(function(){o.default.remove(e),r(null)},[e])]},e.useCopyToClipboard=function(){var e=n.useState(null),t=e[1];return[e[0],function(e,n){try{var r;return null!=(r=navigator)&&r.clipboard?Promise.resolve(function(r,u){try{var o=Promise.resolve(navigator.clipboard.writeText(e)).then(function(){return t(e),n(),!0})}catch(e){return u(e)}return o&&o.then?o.then(void 0,u):o}(0,function(e){return console.warn("Copy failed",e),t(null),!1})):(console.warn("Clipboard not supported"),Promise.resolve(!1))}catch(e){return Promise.reject(e)}}]},e.useDebounce=function(e,t){var r=n.useState(e),u=r[0],o=r[1];return n.useEffect(function(){var n=setTimeout(function(){return o(e)},t||500);return function(){clearTimeout(n)}},[e,t]),u},e.useDebounceFn=function(e,t){var r=n.useRef(null),u=n.useRef(e);return n.useEffect(function(){u.current=e},[e]),function(){var e=arguments;r.current&&clearTimeout(r.current),r.current=setTimeout(function(){u.current.apply(u,[].slice.call(e))},t)}},e.useDebug=function(){var e=i();return n.useMemo(function(){return e&&(window.location.href.includes("#debug")||"development"===process.env.NODE_ENV)&&!window.location.href.includes("#production")},[e])},e.useDocumentReadyState=function(){var e=n.useState(function(){return"undefined"!=typeof document?document.readyState:"loading"}),t=e[0],r=e[1];return n.useEffect(function(){if("undefined"!=typeof document)return r(document.readyState),document.addEventListener("readystatechange",e,!1),function(){return document.removeEventListener("readystatechange",e,!1)};function e(){r(document.readyState)}},[]),t},e.useDocumentTitle=function(e){n.useEffect(function(){document.title=e},[e])},e.useEffectOnce=f,e.useEventListener=s,e.useFavicon=function(e){n.useEffect(function(){var n=document.querySelector("link[rel*='icon']")||document.createElement("link");n.type="image/x-icon",n.rel="shortcut icon",n.href=e,document.getElementsByTagName("head")[0].appendChild(n)},[e])},e.useFirstMountState=d,e.useFoucFix=function(){return n.useEffect(function(){console.debug("WARNING: Still using FOUC temp fix on route change. Has the Next.js bug not been fixed? See https://github.com/vercel/next.js/issues/17464");var e=Array.from(document.querySelectorAll('link[rel="stylesheet"][data-n-p]')).map(function(e){return{element:e,href:e.getAttribute("href")}});e.forEach(function(e){return e.element.removeAttribute("data-n-p")});var n=[],t=new MutationObserver(function(t){t.filter(function(e){var n=e.target;return"STYLE"===n.nodeName&&n.hasAttribute("data-n-href")}).map(function(e){var n=e.target;return{element:n,href:n.getAttribute("data-n-href")}}).forEach(function(e){var t=e.element,r=e.href;n.includes(r)?t.remove():(t.setAttribute("data-fouc-fix-n-href",r),t.removeAttribute("data-n-href"),n.push(r))}),e=e.reduce(function(e,t){var r=t.element;return n.includes(t.href)?r.remove():e.push(t),e},[])});return t.observe(document.head,{subtree:!0,attributeFilter:["media"]}),function(){return t.disconnect()}},[])},e.useFrame=function(e,r){void 0===r&&(r=0),n.useEffect(function(){if(e)return t.raf.add(e,r),function(){return t.raf.remove(e)}},[e,r])},e.useHover=function(){var e=n.useState(!1),t=e[0],r=e[1],u=n.useRef(null);return n.useEffect(function(){var e=u.current;if(e){var n=function(){r(!0)},t=function(){r(!1)};return e.addEventListener("mouseenter",n),e.addEventListener("mouseleave",t),function(){e.removeEventListener("mouseenter",n),e.removeEventListener("mouseleave",t)}}},[]),[u,t]},e.useIOSToolbarState=function(){var e=n.useState(),t=e[0],r=e[1];return n.useEffect(function(){var e=window.navigator?window.navigator.userAgent:"",n=e.match(/iPad/i)||e.match(/iPhone/i),t=e.match(/WebKit/i),u=n&&t&&!e.match(/CriOS/i),o=window.innerHeight;function i(){var e=window.innerHeight;r(!(e-50>o))}if(u){if(!("standalone"in window.navigator)||!window.navigator.standalone)return document.addEventListener("scroll",i),function(){document.removeEventListener("scroll",i)};r(!1)}},[]),{isVisible:t}},e.useIdle=function(e){void 0===e&&(e=6e4);var t=n.useState(!1),r=t[0],u=t[1];return n.useEffect(function(){var n,t,r,o=function(){u(!0)},i=(t=function(){u(!1),window.clearTimeout(n),n=window.setTimeout(o,e)},r=0,function(){var e=Date.now();e-r>=500&&(t(),r=e)}),c=function(){document.hidden||i()};return n=window.setTimeout(o,e),window.addEventListener("mousemove",i),window.addEventListener("mousedown",i),window.addEventListener("resize",i),window.addEventListener("keydown",i),window.addEventListener("touchstart",i),window.addEventListener("wheel",i),document.addEventListener("visibilitychange",c),function(){window.removeEventListener("mousemove",i),window.removeEventListener("mousedown",i),window.removeEventListener("resize",i),window.removeEventListener("keydown",i),window.removeEventListener("touchstart",i),window.removeEventListener("wheel",i),document.removeEventListener("visibilitychange",c),window.clearTimeout(n)}},[e]),r},e.useIntersectionObserver=function(e,t){var r=void 0===e?{}:e,u=r.root,o=void 0===u?null:u,i=r.rootMargin,c=void 0===i?"0px":i,a=r.threshold,s=void 0===a?0:a,f=r.once,d=void 0!==f&&f,l=r.lazy,v=void 0!==l&&l,m=r.callback,w=void 0===m?function(){}:m;void 0===t&&(t=[]);var h=n.useRef(),E=n.useState(),p=E[0],y=E[1],g=n.useState(null),b=g[0],L=g[1];n.useEffect(function(){if(b){var e=new IntersectionObserver(function(n){var t=n[0];v?h.current=t:y(t),w(t),d&&t.isIntersecting&&e.disconnect()},{root:o,rootMargin:c,threshold:s});return e.observe(b),function(){e.disconnect()}}},[b,o,c,s,v,d].concat(t));var S=n.useCallback(function(){return h.current},[]);return[L,v?S:p]},e.useInterval=function(e,t){var r=n.useRef(e);c(function(){r.current=e},[e]),n.useEffect(function(){if(t||0===t){var e=setInterval(function(){return r.current()},t);return function(){return clearInterval(e)}}},[t])},e.useIsClient=i,e.useIsMounted=function(){var e=n.useRef(!1),t=n.useCallback(function(){return e.current},[]);return n.useEffect(function(){return e.current=!0,function(){e.current=!1}},[]),t},e.useIsTouchDevice=function(){var e=n.useState(!1),t=e[0],r=e[1],u=n.useCallback(function(){var e=!1;if("maxTouchPoints"in navigator)e=navigator.maxTouchPoints>0;else{var n=window.matchMedia("(pointer:coarse)");if(n&&"(pointer:coarse)"===n.media)e=!!n.matches;else{var t=window.navigator.userAgent;e=/\b(BlackBerry|webOS|iPhone|IEMobile)\b/i.test(t)||/\b(Android|Windows Phone|iPad|iPod)\b/i.test(t)}}r(!!e)},[]),o=n.useCallback(function(){u()},[u]);return n.useEffect(function(){return o(),window.addEventListener("resize",o,{passive:!0}),function(){window.removeEventListener("resize",o)}},[o]),t},e.useIsVisible=function(e){var t=e.root,r=void 0===t?null:t,u=e.rootMargin,o=void 0===u?"0px":u,i=e.threshold,c=void 0===i?1:i,a=e.once,s=void 0!==a&&a,f=n.useRef(null),d=n.useRef(null),l=n.useState(!1),v=l[0],m=l[1],w=n.useCallback(function(e){d.current||(d.current=e)},[]),h=n.useCallback(function(e){0!==e.length&&m(e[0].isIntersecting)},[]);return n.useEffect(function(){return d.current&&(f.current=new IntersectionObserver(h,{root:r,rootMargin:o,threshold:c}),f.current.observe(d.current)),function(){f.current&&f.current.disconnect()}},[h]),n.useEffect(function(){s&&v&&f.current.disconnect()},[v]),{setRef:w,inView:v}},e.useIsomorphicLayoutEffect=c,e.useKeySequence=function(e){var n,t,r,u,o,i=e.sequence,c=e.callback;return t=(n={eventType:"keydown",keystrokeDelay:1e3})&&n.eventType||"keydown",r=n&&n.keystrokeDelay||1e3,u=[],o=Date.now(),document.addEventListener(t,function(e){var n=e.key.toLowerCase(),t=Date.now();t-o>r&&(u=[]),u.push(n),o=t,i===u.join("")&&c()}),null},e.useLazyState=function(e,t){var r=n.useRef(e);return n.useEffect(function(){t(e,e)},[e,t]),[n.useCallback(function(){return r.current},[]),function(e){if("function"==typeof e){var n=e(r.current);return t(n,r.current),void(r.current=n)}e!==r.current&&(t(e,r.current),r.current=e)}]},e.useList=function(e){void 0===e&&(e=[]);var t=n.useState(e),r=t[1];return[t[0],{set:n.useCallback(function(e){r(e)},[]),push:n.useCallback(function(e){r(function(n){return[].concat(n,[e])})},[]),removeAt:n.useCallback(function(e){r(function(n){return[].concat(n.slice(0,e),n.slice(e+1))})},[]),insertAt:n.useCallback(function(e,n){r(function(t){return[].concat(t.slice(0,e),[n],t.slice(e))})},[]),updateAt:n.useCallback(function(e,n){r(function(t){return t.map(function(t,r){return r===e?n:t})})},[]),clear:n.useCallback(function(){return r([])},[])}]},e.useLocalStorage=function(e,t){var r=n.useState(function(){if("undefined"==typeof window)return t;try{var n=window.localStorage.getItem(e);return n?JSON.parse(n):t}catch(e){return console.log(e),t}}),u=r[0],o=r[1];return[u,function(n){try{var t=n instanceof Function?n(u):n;o(t),"undefined"!=typeof window&&window.localStorage.setItem(e,JSON.stringify(t))}catch(e){console.log(e)}},function(){try{"undefined"!=typeof window&&window.localStorage.removeItem(e)}catch(e){console.log(e)}}]},e.useMediaQuery=function(e){var t=i(),r=n.useMemo(function(){if(t)try{return window.matchMedia(e)}catch(e){"production"!==process.env.NODE_ENV&&console.error(e)}return null},[e,t]),u=n.useState(void 0),o=u[0],c=u[1],a=n.useCallback(function(e){c(e.matches)},[]);return n.useEffect(function(){if(r)return a(r),r.addEventListener("change",a,{passive:!0}),function(){r.removeEventListener("change",a)}},[r,a,t]),o},e.useObjectFit=function(e,t,r,u,o){void 0===e&&(e=1),void 0===t&&(t=1),void 0===r&&(r=1),void 0===u&&(u=1),void 0===o&&(o="cover");var i=n.useMemo(function(){if(!(e&&t&&r&&u))return[1,1];var n,i=e/t,c=r/u;if("contain"===o)n=i>c?t*c:e;else{if("cover"!==o)return[1,1];n=i>c?e:t*c}return[e/n,t/(n/c)]},[e,t,u,r,o]);return[1/i[0],1/i[1]]},e.useOnClickOutside=function(e,n,t){void 0===t&&(t="mousedown"),s(t,function(t){var r=null==e?void 0:e.current;r&&!r.contains(t.target)&&n(t)})},e.useOrientation=function(){var e=n.useState({angle:0,type:"landscape-primary"}),t=e[0],r=e[1];return n.useLayoutEffect(function(){var e,n=function(){var e=window.screen.orientation;r({angle:e.angle,type:e.type})},t=function(){r({type:"UNKNOWN",angle:window.orientation})};return null!=(e=window.screen)&&e.orientation?(n(),window.screen.orientation.addEventListener("change",n)):(t(),window.addEventListener("orientationchange",t)),function(){var e;null!=(e=window.screen)&&e.orientation?window.screen.orientation.removeEventListener("change",n):window.removeEventListener("orientationchange",t)}},[]),t},e.usePageLeave=function(e,t){void 0===t&&(t=[]),n.useEffect(function(){if(e){var n=function(n){var t=(n=n||window.event).relatedTarget||n.toElement;t&&"HTML"!==t.nodeName||e()};return function(e){e&&e.addEventListener&&e.addEventListener.apply(e,[].slice.call(arguments,1))}(document,"mouseout",n),function(){!function(e){e&&e.removeEventListener&&e.removeEventListener.apply(e,[].slice.call(arguments,1))}(document,"mouseout",n)}}},t)},e.usePageVisibility=function(){var e=n.useState(!document.hidden),t=e[0],r=e[1];return n.useEffect(function(){var e=function(){r(!document.hidden)};return document.addEventListener("visibilitychange",e),function(){document.removeEventListener("visibilitychange",e)}},[]),t},e.useRealViewport=function(){var e=n.useCallback(function(){document.documentElement.style.setProperty("--vw",.01*document.documentElement.clientWidth+"px"),document.documentElement.style.setProperty("--dvh",.01*window.innerHeight+"px"),document.documentElement.style.setProperty("--svh",.01*document.documentElement.clientHeight+"px"),document.documentElement.style.setProperty("--lvh","1vh")},[]);return n.useLayoutEffect(function(){return window.addEventListener("resize",e,!1),e(),function(){window.removeEventListener("resize",e,!1)}},[e]),null},e.useRect=function(e){var t=n.useState(a(e?e.current:null)),r=t[0],u=t[1],o=n.useCallback(function(){e.current&&u(a(e.current))},[e]);return n.useLayoutEffect(function(){var n=e.current;if(n){if(o(),"function"==typeof ResizeObserver){var t=new ResizeObserver(function(){return o()});return t.observe(n),function(){t&&(t.disconnect(),t=null)}}return window.addEventListener("resize",o),function(){window.removeEventListener("resize",o)}}},[e.current]),r},e.useResizeObserver=function(e){var t=void 0===e?{}:e,r=t.lazy,u=void 0!==r&&r,o=t.debounce,i=void 0===o?500:o,c=t.box,a=void 0===c?"border-box":c,s=t.callback,f=void 0===s?function(){}:s,d=n.useRef(null),l=n.useState(null),v=l[0],m=l[1],w=n.useState(null),h=w[0],E=w[1],p=n.useRef(!1),y=n.useMemo(function(){return e=m,n=i,t=null,r=null,o=function(){var o=[].slice.call(arguments);if(!n)return e.apply(this,o);var i=this;return u(),r=function(){e.apply(i,o)},void(t=setTimeout(function(){t=null;var e=r;return r=null,e&&e()},n))},o.cancel=u=function(){t&&(clearTimeout(t),r=null,t=null)},o.flush=function(){var e=r;u(),e&&e()},o;var e,n,t,r,u,o},[i]),g=n.useCallback(function(e){var n=e[0];d.current=n,f(n),u||(p.current?m(n):y(n)),p.current=!1},[u,y,f]);n.useEffect(function(){if(h){p.current=!0;var e=new ResizeObserver(g);return e.observe(h,{box:a}),function(){e.disconnect(),y.cancel()}}},[h,i,a,g,y]);var b=n.useCallback(function(){return d.current},[]);return[E,u?b:v]},e.useScript=function(e){n.useEffect(function(){var n=document.createElement("script");return n.src=e,n.async=!0,document.body.appendChild(n),function(){document.body.removeChild(n)}},[e])},e.useSessionStorage=function(e,t){var r=n.useState(function(){if("undefined"==typeof window)return t;try{var n=window.sessionStorage.getItem(e);return n?JSON.parse(n):t}catch(e){return console.log(e),t}}),u=r[0],o=r[1];return[u,function(n){try{var t=n instanceof Function?n(u):n;o(t),"undefined"!=typeof window&&window.sessionStorage.setItem(e,JSON.stringify(t))}catch(e){console.log(e)}},function(){try{"undefined"!=typeof window&&window.sessionStorage.removeItem(e)}catch(e){console.log(e)}}]},e.useSlots=function(e,t){void 0===e&&(e=[]),void 0===t&&(t=[]);var r=n.useMemo(function(){return t&&[t].flat()},[t]),u=n.useMemo(function(){return e&&[e].flat()},[e]);return n.useMemo(function(){if(r&&u){var n=u.map(function(e){var n;return null==(n=r.find(function(n){return n.type===e}))?void 0:n.props.children});return e[0]?n:n[0]}},[r,u])},e.useThrottle=function(e,t){void 0===t&&(t=200);var r=n.useState(e),u=r[0],o=r[1],i=n.useRef(),c=n.useRef(null),a=n.useRef(0);return n.useEffect(function(){i.current?(c.current=e,a.current=!0):(o(e),i.current=setTimeout(function e(){a.current?(a.current=!1,o(c.current),i.current=setTimeout(e,t)):i.current=void 0},t))},[e]),l(function(){i.current&&clearTimeout(i.current)}),u},e.useTimeout=function(e,t,r){void 0===r&&(r=[]);var u=n.useRef(e);n.useEffect(function(){u.current=e},[e]),n.useEffect(function(){var e=setTimeout(function(){return u.current()},t);return function(){clearTimeout(e)}},[t].concat(r))},e.useUnmount=l,e.useUpdateEffect=function(e,t){var r=d();n.useEffect(function(){if(!r)return e()},t)},e.useWindowSize=function(){var e=n.useState({width:0,height:0}),t=e[0],r=e[1],u=function(){r({width:window.innerWidth,height:window.innerHeight})};return s("resize",u),c(function(){u()},[]),t}});
//# sourceMappingURL=hooks.umd.js.map