@ekwoka/alpine-history
Version:
Sync Component an Store values to the URL Search Params!!!
67 lines • 2.6 kB
TypeScript
import type { PluginCallback, InterceptorObject, Alpine } from 'alpinejs';
import { Encoding, PrimitivesToStrings } from './encoding.js';
export { base64, base64URL } from './encoding.js';
export type { Encoding, PrimitivesToStrings } from './encoding.js';
/**
* This is the InterceptorObject that is returned from the `query` function.
* When inside an Alpine Component or Store, these interceptors are initialized.
* This hooks up setter/getter methods to to replace the object itself
* and sync the query string params
*/
declare class QueryInterceptor<T> implements InterceptorObject<T> {
private Alpine;
private reactiveParams;
_x_interceptor: true;
private alias;
private encoder;
private method;
private show;
initialValue: T;
constructor(initialValue: T, Alpine: Pick<Alpine, 'effect'>, reactiveParams: Record<string, unknown>);
/**
* Self Initializing interceptor called by Alpine during component initialization
* @param {object} data The Alpine Data Object (component or store)
* @param {string} path dot notated path from the data root to the interceptor
* @returns {T} The value of the interceptor after initialization
*/
initialize(data: Record<string, unknown>, path: string): T;
/**
* Changes the keyname for using in the query string
* Keyname defaults to path to data
* @param {string} name Key alias
*/
as(name: string): this;
/**
* Transforms the value of the query param before it is set on the data
* @param {function} fn Transformer function
*/
into(fn: Transformer<T>): QueryInterceptor<T>;
/**
* Always show the initial value in the query string
*/
alwaysShow(): this;
/**
* Use pushState instead of replaceState
*/
usePush(): this;
/**
* Registers encoding and decoding functions to transform the value
* before it is set on the query string
*/
encoding(encoder: Encoding<T>): QueryInterceptor<T>;
}
export declare const query: PluginCallback;
export type Transformer<T> = (val: T | PrimitivesToStrings<T>) => T;
export default query;
declare module 'alpinejs' {
interface Alpine {
/**
* Sync a search param in the query string with the value in the Alpine Context
* @param initialValue Value when the query param is not present
* @returns {QueryInterceptor} Self initializing interceptor
*/
query: <T>(initialValue: T) => QueryInterceptor<T>;
}
}
export { observeHistory } from './history';
//# sourceMappingURL=index.d.ts.map