'use client';
import { useSearchParams as useNextSearchParams } from 'next/navigation.js';
import qs from 'qs';
import React, { createContext, useContext } from 'react';
const initialContext = {
    searchParams: {},
    stringifyParams: ()=>''
};
const Context = /*#__PURE__*/ createContext(initialContext);
// TODO: abstract the `next/navigation` dependency out from this provider so that it can be used in other contexts
export const SearchParamsProvider = ({ children })=>{
    const nextSearchParams = useNextSearchParams();
    const searchString = nextSearchParams.toString();
    const initialParams = qs.parse(searchString, {
        depth: 10,
        ignoreQueryPrefix: true
    });
    const [searchParams, setSearchParams] = React.useState(initialParams);
    const stringifyParams = React.useCallback(({ params, replace = false })=>{
        return qs.stringify({
            ...replace ? {} : searchParams,
            ...params
        }, {
            addQueryPrefix: true
        });
    }, [
        searchParams
    ]);
    React.useEffect(()=>{
        const newSearchParams = qs.parse(searchString, {
            depth: 10,
            ignoreQueryPrefix: true
        });
        setSearchParams(newSearchParams);
    }, [
        searchString
    ]);
    return /*#__PURE__*/ React.createElement(Context.Provider, {
        value: {
            searchParams,
            stringifyParams
        }
    }, children);
};
export const useSearchParams = ()=>useContext(Context);

//# sourceMappingURL=index.js.map