stateful-params/dist/index.mjs

A lightweight and intuitive React hook for managing URL query parameters with ease. Stateful-params enables seamless CRUD operations on URL query parameters while keeping your UI in sync with the URL state. Perfect for building dynamic, stateful, and shar

import{useState as r,useEffect as e}from"react";var n=function(n){void 0===n&&(n={});var t=n.method,a=void 0===t?"push":t,i=n.deleteFalseValues,o=void 0===i||i,c=r((function(){return new URLSearchParams(window.location.search)})),s=c[0],u=c[1];e((function(){var r=function(){var r=new URLSearchParams(window.location.search);u(r)};return window.addEventListener("popstate",r),function(){return window.removeEventListener("popstate",r)}}),[]);var f=function(r){var e=r.toString();if(e!==s.toString()){var n=new URL(window.location.href);n.search=e,"replace"===a?window.history.replaceState(null,"",n):window.history.pushState(null,"",n),u(r)}};return{set:function(r){for(var e=new URLSearchParams(s.toString()),n=function(r,n){null==n||o&&!n?e.delete(r):Array.isArray(n)?(e.delete(r),n.forEach((function(n){return e.append(r,String(n))}))):e.set(r,String(n))},t=0,a=Object.entries(r);t<a.length;t++){var i=a[t];n(i[0],i[1])}return f(e),Object.fromEntries(e.entries())},append:function(r){for(var e=new URLSearchParams(s.toString()),n=function(r,n){Array.isArray(n)?n.forEach((function(n){return e.append(r,String(n))})):e.append(r,String(n))},t=0,a=Object.entries(r);t<a.length;t++){var i=a[t];n(i[0],i[1])}return f(e),Object.fromEntries(e.entries())},deleteParam:function(r){var e=new URLSearchParams(s.toString());return Array.isArray(r)?r.forEach((function(r){return e.delete(r)})):e.delete(r),f(e),Object.fromEntries(e.entries())},clear:function(){var r=new URLSearchParams;return f(r),Object.fromEntries(r.entries())},get:function(r){return s.get(r)},searchParams:Object.fromEntries(s.entries())}};export{n as useStatefulParams};
//# sourceMappingURL=index.mjs.map