nuqs-svelte/dist/use-query-state.svelte.d.ts

Svelte adaptation of the `nuqs` library for managing URL query strings as state.

import type { Parser } from "./parsers";
import type { Options } from "./types";
export interface UseQueryStateOptions<T> extends Parser<T>, Options {
}
export type UseQueryStateReturn<Parsed, Default> = {
    current: Default extends undefined ? Parsed | null : Parsed;
    set: (value: null | Parsed | ((old: Default extends Parsed ? Parsed : Parsed | null) => Parsed | null), options?: Options) => Promise<URLSearchParams>;
};
/**
 * Svelte state hook synchronized with a URL query string in SvelteKit
 *
 * This variant is used when providing a default value. This will make
 * the returned state non-nullable when the query is not present in the URL.
 * (the default value will be returned instead).
 *
 * _Note: the URL will **not** be updated with the default value if the query
 * is missing._
 *
 * Setting the value to `null` will clear the query in the URL, and return
 * the default value as state.
 *
 * Example usage:
 * ```svelte
 * <script lang="ts">
 *   const count = useQueryState(
 *     'count',
 *     parseAsInteger.defaultValue(0)
 *   )
 *
 *   const increment = () => count.current = (count.current ?? 0) + 1
 *   const decrement = () => count.current = (count.current ?? 0) - 1
 *   // Clears the query key from the URL and `count` equals 0
 *   const clearCountQuery = () => count.current = null
 * </script>
 * ```
 * @param key The URL query string key to bind to
 * @param options - Parser (defines the state data type), default value and optional history mode.
 */
export declare function useQueryState<T>(key: string, options: UseQueryStateOptions<T> & {
    defaultValue: T;
}): UseQueryStateReturn<NonNullable<ReturnType<typeof options.parse>>, typeof options.defaultValue>;
/**
 * Svelte state hook synchronized with a URL query string in SvelteKit
 *
 * If the query is missing in the URL, the state will be `null`.
 *
 * Example usage:
 * ```svete
 * <script lang="ts">
 *   // Blog posts filtering by tag
 *   const tag = useQueryState('tag')
 *   const filteredPosts = posts.filter(post => tag ? post.tag === tag.current : true)
 *   const clearTag = () => tag.current = null
 * </script>
 * ```
 * @param key The URL query string key to bind to
 * @param options - Parser (defines the state data type), and optional history mode.
 */
export declare function useQueryState<T>(key: string, options: UseQueryStateOptions<T>): UseQueryStateReturn<NonNullable<ReturnType<typeof options.parse>>, undefined>;
/**
 * Default type string, limited options & default value
 */
export declare function useQueryState(key: string, options: Options & {
    defaultValue: string;
}): UseQueryStateReturn<string, typeof options.defaultValue>;
/**
 * Svelte state hook synchronized with a URL query string in SvelteKit
 *
 * If the query is missing in the URL, the state will be `null`.
 *
 * Note: by default the state type is a `string`. To use different types,
 * check out the `parseAsXYZ` helpers:
 * ```svelte
 * <script lang="ts">
 *   const date = useQueryState(
 *     'date',
 *     parseAsIsoDateTime.withDefault(new Date('2021-01-01'))
 *   )
 *
 *   const setToNow = () => date.current = new Date();
 *   const addOneHour = () => {
 *     date.current = new Date(date.current.valueOf() + 3600_000));
 *   }
 * </script>
 * ```
 * @param key The URL query string key to bind to
 * @param options - Parser (defines the state data type), and optional history mode.
 */
export declare function useQueryState(key: string, options: Pick<UseQueryStateOptions<string>, keyof Options>): UseQueryStateReturn<string, undefined>;
/**
 * Svelte state hook synchronized with a URL query string in SvelteKit
 *
 * If the query is missing in the URL, the state will be `null`.
 *
 * Note: by default the state type is a `string`. To use different types,
 * check out the `parseAsXYZ` helpers:
 * ```svelte
 * <script lang="ts">
 *   const date = useQueryState(
 *     'date',
 *     parseAsIsoDateTime.withDefault(new Date('2021-01-01'))
 *   )
 *
 *   const setToNow = () => date.current = new Date();
 *   const addOneHour = () => {
 *     date.current = new Date(date.current.valueOf() + 3600_000);
 *   }
 * </script>
 * ```
 * @param key The URL query string key to bind to
 */
export declare function useQueryState(key: string): UseQueryStateReturn<string, undefined>;