state-in-url
Version:
Store state in URL as in object, types and structure are preserved, with TS validation. Same API as React.useState, wthout any hasssle or boilerplate. Next.js@14-15, react-router@6-7, and remix@2.
2 lines (1 loc) • 998 B
JavaScript
;var b=require("react");var e=require("../subscribers.js");var M=require("../useIsomorphicLayoutEffect.js");var i=require("../utils.js");function g(s){return s&&s.__esModule?s:{default:s}}var a=g(b);function v(s,c){const t=a.default.useRef(s);const[l,o]=a.default.useState(()=>{if(i.isSSR){return c?c?.():t.current}const r=e.stateMap.get(t.current);if(!r){const u=c?.()||t.current;e.stateMap.set(t.current,u);return u}else{return r}});const d=a.default.useCallback(r=>{const u=e.stateMap.get(t.current);const n=typeof r==="function";const f=n?r(u,s):{...u,...r};if(i.isEqual(u,f))return void 0;e.stateMap.set(t.current,f);e.subscribers.get(t.current).forEach(S=>S())},[]);M.useIsomorphicLayoutEffect(()=>{const r=()=>{o(e.stateMap.get(t.current)||t.current)};const u=e.subscribers.add(t.current,r);o(n=>e.stateMap.get(t.current)??n);return u},[]);const p=a.default.useCallback(()=>e.stateMap.get(t.current)||t.current,[]);return{state:l,getState:p,setState:d}}exports.useSharedState=v;