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) • 644 B
JavaScript
import n from"react";import{decodeState as a}from"../encodeState/encodeState.mjs";import{stateMap as i}from"../subscribers.mjs";import{filterUnknownParamsClient as f}from"../utils.mjs";import{hrefWithState as c}from"./hrefWithState.mjs";const m=/^[a-z][a-z\d+\-.]*:|^\/\//i;function u(e){return e.defaultPrevented||e.button!==0||e.metaKey||e.ctrlKey||e.shiftKey||e.altKey||!!e.currentTarget?.target}function l(e){return i.get(e)??a(f(e,window.location.search),e)}function s(e,r){return n.useCallback(t=>({href:t,onClick:o=>{if(m.test(t)||u(o))return;o.preventDefault();r(c(t,e,l(e),window.location.search))}}),[e,r])}export{s as useLinkProps};