vuex-tstore/typings/store.d.ts

Provides a low-overhead TypeScript wrapper around Vuex that can trigger compilation errors and IntelliSense tips.

import { WatchOptions } from "vue";
import { ActionPayload, ActionTree, CommitOptions, DispatchOptions, GetterTree, Module, ModuleOptions, ModuleTree, MutationPayload, MutationTree, Store as VuexStore, StoreOptions, SubscribeActionOptions } from "vuex";
import { WrappedActions } from "./actions";
import { GetAccessors, WrappedGetters } from "./getters";
import { WrappedMutations } from "./mutations";
import { TState } from "./state";
export interface Options {
    state?: object;
    getters?: object;
    mutations?: object;
    actions?: object;
    namespaced?: boolean;
    modules?: {
        [key: string]: Options;
    };
}
/**
 * Creates a type-aware wrapper around a Vuex store.
 *
 * This class generates type-aware bindings to a wrapped Vuex store in order to
 * expose typing information to the store consumer via a series of Generics
 * which reference the configuration object. This means that this Store wrapper
 * enables IntelliSense (VSCode), Linters, and the TypeScript Compiler to be
 * able to validate that code is actually using the store correctly.
 *
 * ```typescript
 * import Store from 'vuex-tstore';
 *
 * const options = {
 *   state: () => ({ title: "Hello, world!" }),
 *   getters: {
 *     title: (state) => state.title
 *   },
 *   mutations: {
 *     resetTitle: (state) => { state.title = ''; },
 *     setTitle: (state, payload: { title: string }) => { state.title = title; }
 *   },
 *   actions: {
 *     resetTitle: async (context) => context.commit('resetTitle'),
 *     setTitle: (context, payload: { title: string }) => {
 *       setTimeout(() => context.commit('setTitle', payload), 1000);
 *     }
 *   }
 * };
 *
 * const store = new Store(options);
 *
 * store.getters.title; // "Hello, world!"
 * store.mutations.resetTitle(); // ""
 * store.mutations.setTitle({ title: "foo" }); // "foo"
 *
 * store.actions.resetTitle();
 * store.actions.setTitle({ title: "bar" });
 * ```
 */
export declare class Store<TModuleState, TRootState, TOptions extends Options, TWrappedMutations = WrappedMutations<TOptions extends {
    mutations?: infer T;
} ? T : undefined>, TWrappedActions = WrappedActions<TOptions extends {
    actions?: infer T;
} ? T : undefined>, TWrappedGetters = WrappedGetters<GetAccessors<TModuleState, TRootState, TOptions extends {
    getters?: infer T;
} ? T : undefined>>, TModuleList = ModuleList<TModuleState, TRootState, TOptions extends {
    modules?: infer T;
} ? T : undefined>> {
    /**
     * Read-only property that holds the getters for this store.
     */
    readonly getters: Readonly<TWrappedGetters>;
    /**
     * Read-only property that holds references to the store state.
     */
    readonly state: Readonly<TState<TOptions["state"]>>;
    /**
     * Read-only property that holds the mutations for this store.
     *
     * Every wrapped module can be executed with an attached function, and comes
     * with two options that may be executed from the wrapper:
     *
     * ```typescript
     * wrapper.mutations.myMutation(payload);
     * wrapper.mutations.myMutation.listen((payload) => {
     *   // Do things after the mutation is executed.
     * });
     * ```
     */
    readonly mutations: Readonly<TWrappedMutations>;
    /**
     * Read-only property that holds the actions for this store.
     *
     * Every wrapped action can be executed with an attached function, and comes
     * with two options that may be executed from the wrapper:
     *
     * ```typescript
     * wrapper.actions.myAction(payload);
     * wrapper.actions.myAction.before((payload) => {
     *   // Do things before the action is executed.
     * });
     * wrapper.actions.myAction.after((payload) => {
     *   // Do things after the action is executed.
     * });
     * ```
     */
    readonly actions: Readonly<TWrappedActions>;
    /**
     * Read-only property that holds the modules for this store.
     */
    readonly modules: TModuleList;
    /**
     * Read-only reference to the Vuex store.
     */
    readonly store: Readonly<VuexStore<TRootState>>;
    /**
     * Instantiates a new wrapper.
     *
     * @param options The options to use when constructing the Vuex Store.
     * @param store A pre-existing store to wrap.
     * @param name The module name to use for this object.
     */
    constructor(options?: TOptions & StoreOptions<TRootState>);
    constructor(options: TOptions & StoreOptions<TRootState>, store: VuexStore<TRootState>, name: string);
    commit(type: string, payload?: any, options?: CommitOptions): void;
    dispatch(type: string, payload?: any, options?: DispatchOptions): Promise<any>;
    registerModule<T>(path: string[] | string, module: Module<T, TRootState>, options?: ModuleOptions): void;
    unregisterModule(path: string | string[]): void;
    hotUpdate(options: {
        actions?: ActionTree<TRootState, TRootState>;
        mutations?: MutationTree<TRootState>;
        getters?: GetterTree<TRootState, TRootState>;
        modules?: ModuleTree<TRootState>;
    }): void;
    subscribe<P extends MutationPayload>(fn: (mutation: P, state: TRootState) => any): () => void;
    subscribeAction<P extends ActionPayload>(fn: SubscribeActionOptions<P, TRootState>): () => void;
    watch<TGetterFn extends (state: TRootState, getters: TWrappedGetters) => any, TCbFn extends (value: ReturnType<TGetterFn>, oldValue: ReturnType<TGetterFn>) => void>(getter: TGetterFn, cb: TCbFn, options?: WatchOptions): () => void;
}
declare type ModuleList<TModuleState, TRootState, TModules extends {
    [key: string]: Options;
}> = {
    [key in keyof TModules]: Store<TModuleState, TRootState, TModules[key]>;
};
export {};