react-magic-search-params
Version:
#️⃣ A React Hook for advanced, typed management of URL search parameters, providing built-in TypeScript autocomplete.
47 lines (46 loc) • 2.07 kB
TypeScript
declare type CommonParams = {
page?: number;
page_size?: number;
};
declare type MergeParams<M, O> = {
[K in keyof M]: M[K];
} & {
[K in keyof O]?: O[K];
};
/**
* Interface for the configuration object that the hook receives
*/
export interface UseMagicSearchParamsOptions<M extends Record<string, unknown>, O extends Record<string, unknown>> {
mandatory: M;
optional?: O;
defaultParams?: Partial<MergeParams<M, O>>;
forceParams?: Partial<MergeParams<M, O>>;
arraySerialization?: 'csv' | 'repeat' | 'brackets';
omitParamsByValues?: Array<'all' | 'default' | 'unknown' | 'none' | 'void '>;
}
/**
Generic hook to handle search parameters in the URL
@param mandatory - Mandatory parameters (e.g., page=1, page_size=10, etc.)
@param optional - Optional parameters (e.g., order, search, etc.)
@param defaultParams - Default parameters sent in the URL on initialization
@param forceParams - Parameters forced into the URL regardless of user input
@param omitParamsByValues - Parameters omitted if they have specific values
*/
export declare const useMagicSearchParams: <M extends Record<string, unknown> & CommonParams, O extends Record<string, unknown>>({ mandatory, optional, defaultParams, arraySerialization, forceParams, omitParamsByValues }: UseMagicSearchParamsOptions<M, O>) => {
searchParams: URLSearchParams;
updateParams: ({ newParams, keepParams }?: {
newParams?: Partial<MergeParams<M, O>> | undefined;
keepParams?: Partial<Record<keyof M | keyof O, boolean>> | undefined;
}) => void;
clearParams: ({ keepMandatoryParams }?: {
keepMandatoryParams?: boolean | undefined;
}) => void;
getParams: ({ convert }?: {
convert?: boolean | undefined;
}) => MergeParams<M, O>;
getParam: <T extends boolean>(key: keyof M | keyof O, options?: {
convert: T;
} | undefined) => T extends true ? string[] : string;
onChange: (paramName: keyof M | keyof O, callbacks: Array<() => void>) => void;
};
export {};