UNPKG

@wethegit/react-hooks

Version:

A collection of helpers for use in React projects.

2 lines (1 loc) 4.15 kB
"use strict";Object.defineProperty(exports,Symbol.toStringTag,{value:"Module"});const s=require("react"),v=require("react/jsx-runtime");var p=(e=>(e.ENTERED="entered",e.EXITED="exited",e.EXITING="exiting",e.ENTERING="entering",e.MOUNTED="mounted",e))(p||{});function h({initial:e=!1,duration:t=300,isVisible:c=!1}){const u=s.useRef(e),[r,n]=s.useState(u.current?"entered":"exited"),d=typeof t=="number"?t:t.enter,f=typeof t=="number"?t:t.exit,i=s.useRef(void 0);return s.useEffect(()=>{clearTimeout(i.current),r==="mounted"?i.current=setTimeout(()=>{n("entering")},100):r==="entering"?i.current=setTimeout(()=>{n("entered")},d):r==="exiting"&&(i.current=setTimeout(()=>{n("exited")},f))},[d,f,r]),s.useEffect(()=>{if(u.current){u.current=!1;return}n(o=>{if(c){if(o==="exited"||o==="exiting")return"mounted"}else if(o!=="exited"&&o!=="exiting")return"exiting";return o})},[c]),{render:r!=="exited",animate:r==="entering"||r==="entered",currentDuration:r==="entering"?d:f,state:r}}var g=(e=>(e.Idle="idle",e.Pending="pending",e.Success="success",e.Error="error",e))(g||{});function y(e,t=!1){const[c,u]=s.useState("idle"),[r,n]=s.useState(null),[d,f]=s.useState(null),i=s.useCallback(()=>{u("pending"),e().then(o=>{n(o),u("success")}).catch(o=>{f(o),u("error")})},[e]);return s.useEffect(()=>{t||i()},[t,i]),{run:i,data:r,status:c,error:d}}function x(e=0,t=!1,c=!1){const[u,r]=s.useState(!1),[n,d]=s.useState(),f=s.useMemo(()=>typeof e=="number"?{threshold:e}:e,[e]),i=s.useCallback(([l],S)=>{const m=l.isIntersecting||c&&l.boundingClientRect.top<0;r(m),t&&m&&S.unobserve(l.target)},[t,c]),o=s.useMemo(()=>{if(typeof IntersectionObserver=="function")return new IntersectionObserver(i,f)},[f,i]);return s.useEffect(()=>{if(!(!n||!o))return o.observe(n),()=>{o&&o.unobserve(n)}},[o,n]),[d,u,n]}function b(e){const[t,c]=s.useState(null);return s.useEffect(()=>{const u=window.matchMedia(e),r=()=>{c(u.matches)};return u.addEventListener("change",r),r(),()=>{u.removeEventListener("change",r)}},[e]),t}function a(e,t){const[c,u]=s.useState(null),r=s.useCallback(n=>{window.localStorage.setItem(e,JSON.stringify(n)),u(n)},[e]);return s.useEffect(()=>{const n=window.matchMedia(t),d=n.matches;d?r(d):u(i=>{if(i===null){const o=localStorage.getItem(e);return o===null?d:JSON.parse(o)}return i});const f=i=>{r(i.matches)};return n.addEventListener("change",f),()=>{n.removeEventListener("change",f)}},[t,e,r]),[c,r]}function M(e,t){const c=s.useMemo(()=>`use-local-storage:${e}`,[e]),[u,r]=s.useState(null);return s.useEffect(()=>{if(u===null){const n=window.localStorage.getItem(c);if(n===null){r(t);return}r(JSON.parse(n))}window.localStorage.setItem(c,JSON.stringify(u))},[t,c,u]),[u,r]}function P(e){const t=()=>{if(!window)return;const c=document.body.getAttribute("style");c&&document.body.setAttribute("style",c.replace("overflow: hidden;",""))};s.useEffect(()=>(e?document.body.style.overflow="hidden":t(),()=>t()),[e])}const E=s.createContext({});function R({children:e,globalClassNames:t}){const[c,u]=a("user-prefs:prefers-color-scheme","(prefers-color-scheme: dark)"),[r,n]=a("user-prefs:prefers-reduced-data","(prefers-reduced-data: reduce)"),[d,f]=a("user-prefs:prefers-reduced-motion","(prefers-reduced-motion: reduce)");return s.useEffect(()=>{document.body.classList[d?"add":"remove"](t?.prefersReducedMotion||"is-reduced-motion")},[t?.prefersReducedMotion,d]),s.useEffect(()=>{document.body.classList[r?"add":"remove"](t?.prefersReducedData||"is-reduced-data")},[t?.prefersReducedData,r]),s.useEffect(()=>{document.body.classList[c?"add":"remove"](t?.prefersDarkColorScheme||"is-dark-color-scheme")},[t?.prefersDarkColorScheme,c]),v.jsx(E.Provider,{value:{prefersDarkColorScheme:c,setPrefersDarkColorScheme:u,prefersReducedData:r,setPrefersReducedData:n,prefersReducedMotion:d,setPrefersReducedMotion:f},children:e})}function w(){return s.useContext(E)}exports.AnimatePresenceState=p;exports.Status=g;exports.UserPreferencesProvider=R;exports.useAnimatePresence=h;exports.useAsync=y;exports.useInView=x;exports.useMediaQuery=b;exports.usePersistedMediaQuery=a;exports.usePersistedState=M;exports.usePreventScroll=P;exports.useUserPrefs=w;