fix(hooks): improve vuex interface again

Author: u3u

package.json

@@ -12,8 +12,7 @@
   "module": "esm/index.js",
   "files": [
     "lib/",
-    "esm/",
-    "types/"
+    "esm/"
   ],
   "scripts": {
     "test": "jest",

src/helpers/vuex.ts renamed to src/helpers/vuex/index.ts

@@ -1,13 +1,7 @@
-import { computed, Wrapper } from 'vue-function-api';
-import {
-  useState,
-  useGetters,
-  mapState,
-  mapGetters,
-  mapMutations,
-  mapActions,
-} from 'vuex';
-import { getRuntimeVM } from '../util/runtime';
+import { computed } from 'vue-function-api';
+import { mapState, mapGetters, mapMutations, mapActions } from 'vuex';
+import { useState, useGetters, useMutations, useActions } from './interface';
+import { getRuntimeVM } from '../../util/runtime';
 
 export enum Helper {
   State,
@@ -16,7 +10,9 @@ export enum Helper {
   Actions,
 }
 
-function handleComputed(mappedFn: Function): Wrapper<any> {
+type Helpers = useState | useGetters | useMutations | useActions;
+
+function handleComputed(mappedFn: Function) {
   // TypeError: Cannot read property '_modulesNamespaceMap' of undefined
   // You must get `runtimeVM` in real time in the calculation properties.
   return computed(() => mappedFn.call(getRuntimeVM()));
@@ -33,12 +29,6 @@ const helpers = {
   [Helper.Actions]: { fn: mapActions, handler: handleMethods },
 };
 
-export type Helpers =
-  | typeof useState
-  | typeof useGetters
-  | typeof mapMutations
-  | typeof mapActions;
-
 export default function createVuexHelper<T extends Helpers>(h: Helper) {
   const helper = helpers[h];
 
@@ -53,3 +43,5 @@ export default function createVuexHelper<T extends Helpers>(h: Helper) {
     return dictionary;
   }) as T;
 }
+
+export * from './interface';

src/helpers/vuex/interface.ts

@@ -0,0 +1,62 @@
+import Vue from 'vue';
+import { Dispatch, Commit } from 'vuex';
+import { Wrapper } from 'vue-function-api';
+
+type Dictionary<T> = { [key: string]: T };
+type Computed = Wrapper<any>;
+type MutationMethod = (...args: any[]) => void;
+type ActionMethod = (...args: any[]) => Promise<any>;
+type CustomVue = Vue & Dictionary<any>;
+
+interface Mapper<R> {
+  (map: string[]): Dictionary<R>;
+  (map: Dictionary<string>): Dictionary<R>;
+}
+
+interface MapperWithNamespace<R> {
+  (namespace: string, map: string[]): Dictionary<R>;
+  (namespace: string, map: Dictionary<string>): Dictionary<R>;
+}
+
+interface FunctionMapper<F, R> {
+  (
+    map: Dictionary<(this: CustomVue, fn: F, ...args: any[]) => any>,
+  ): Dictionary<R>;
+}
+
+interface FunctionMapperWithNamespace<F, R> {
+  (
+    namespace: string,
+    map: Dictionary<(this: CustomVue, fn: F, ...args: any[]) => any>,
+  ): Dictionary<R>;
+}
+
+interface MapperForState {
+  <S>(
+    map: Dictionary<(this: CustomVue, state: S, getters: any) => any>,
+  ): Dictionary<Computed>;
+}
+
+interface MapperForStateWithNamespace {
+  <S>(
+    namespace: string,
+    map: Dictionary<(this: CustomVue, state: S, getters: any) => any>,
+  ): Dictionary<Computed>;
+}
+
+export type useState = Mapper<Computed> &
+  MapperWithNamespace<Computed> &
+  MapperForState &
+  MapperForStateWithNamespace;
+
+export type useGetters = Mapper<Computed> & MapperWithNamespace<Computed>;
+
+export type useMutations = Mapper<MutationMethod> &
+  MapperWithNamespace<MutationMethod> &
+  FunctionMapper<Commit, MutationMethod> &
+  FunctionMapperWithNamespace<Commit, MutationMethod>;
+
+export type useActions = Mapper<ActionMethod> &
+  MapperWithNamespace<ActionMethod> &
+  FunctionMapper<Dispatch, ActionMethod> &
+  FunctionMapperWithNamespace<Dispatch, ActionMethod>;

src/useActions.ts

@@ -1,4 +1,3 @@
-import { mapActions } from 'vuex';
-import createVuexHelper, { Helper } from './helpers/vuex';
+import createVuexHelper, { Helper, useActions } from './helpers/vuex';
 
-export default createVuexHelper<typeof mapActions>(Helper.Actions);
+export default createVuexHelper<useActions>(Helper.Actions);

src/useGetters.ts

@@ -1,4 +1,3 @@
-import { useGetters } from 'vuex';
-import createVuexHelper, { Helper } from './helpers/vuex';
+import createVuexHelper, { Helper, useGetters } from './helpers/vuex';
 
-export default createVuexHelper<typeof useGetters>(Helper.Getters);
+export default createVuexHelper<useGetters>(Helper.Getters);

src/useMutations.ts

@@ -1,4 +1,3 @@
-import { mapMutations } from 'vuex';
-import createVuexHelper, { Helper } from './helpers/vuex';
+import createVuexHelper, { Helper, useMutations } from './helpers/vuex';
 
-export default createVuexHelper<typeof mapMutations>(Helper.Mutations);
+export default createVuexHelper<useMutations>(Helper.Mutations);

src/useState.ts

@@ -1,4 +1,3 @@
-import { useState } from 'vuex';
-import createVuexHelper, { Helper } from './helpers/vuex';
+import createVuexHelper, { Helper, useState } from './helpers/vuex';
 
-export default createVuexHelper<typeof useState>(Helper.State);
+export default createVuexHelper<useState>(Helper.State);