refactor(types): mapState autocomplete

diff --git a/src/mapHelpers.ts b/src/mapHelpers.ts
index 4eaaffba4e967153ff16f5c5236d194f877382fd..f242d58f3f95476c069baccaeb49dec150c32234 100644 (file)
--- a/src/mapHelpers.ts
+++ b/src/mapHelpers.ts
@@ -83,65 +83,65 @@ type MapStateObjectReturn<
 /**
  * Allows using state and getters from one store without using the composition
  * API (`setup()`) by generating an object to be spread in the `computed` field
- * of a component.
+ * of a component. The values of the object are the state properties/getters
+ * while the keys are the names of the resulting computed properties.
  *
  * @example
  * ```js
  * export default {
  *   computed: {
  *     // other computed properties
- *     ...mapState(useCounterStore, ['count', 'double'])
+ *     // useCounterStore has a state property named `count` and a getter `double`
+ *     ...mapState(useCounterStore, { n: 'count', doubleN: 'double' })
  *   },
  *
  *   created() {
- *     this.count // 2
- *     this.double // 4
+ *     this.n // 2
+ *     this.doubleN // 4
  *   }
  * }
  * ```
  *
  * @param useStore - store to map from
- * @param keys - array of state properties or getters
+ * @param keyMapper - object of state properties or getters
  */
-export function mapState<Id extends string, S extends StateTree, G, A>(
+export function mapState<
+  Id extends string,
+  S extends StateTree,
+  G,
+  A,
+  KeyMapper extends Record<string, keyof S | keyof G>
+>(
   useStore: StoreDefinition<Id, S, G, A>,
-  keys: Array<keyof S | keyof G>
-): MapStateReturn<S, G>
+  keyMapper: KeyMapper
+): MapStateObjectReturn<S, G, KeyMapper>
 /**
  * Allows using state and getters from one store without using the composition
  * API (`setup()`) by generating an object to be spread in the `computed` field
- * of a component. The values of the object are the state properties/getters
- * while the keys are the names of the resulting computed properties.
+ * of a component.
  *
  * @example
  * ```js
  * export default {
  *   computed: {
  *     // other computed properties
- *     // useCounterStore has a state property named `count` and a getter `double`
- *     ...mapState(useCounterStore, { n: 'count', doubleN: 'double' })
+ *     ...mapState(useCounterStore, ['count', 'double'])
  *   },
  *
  *   created() {
- *     this.n // 2
- *     this.doubleN // 4
+ *     this.count // 2
+ *     this.double // 4
  *   }
  * }
  * ```
  *
  * @param useStore - store to map from
- * @param keyMapper - object of state properties or getters
+ * @param keys - array of state properties or getters
  */
-export function mapState<
-  Id extends string,
-  S extends StateTree,
-  G,
-  A,
-  KeyMapper extends Record<string, keyof S | keyof G>
->(
+export function mapState<Id extends string, S extends StateTree, G, A>(
   useStore: StoreDefinition<Id, S, G, A>,
-  keyMapper: KeyMapper
-): MapStateObjectReturn<S, G, KeyMapper>
+  keys: Array<keyof S | keyof G>
+): MapStateReturn<S, G>
 /**
  * Allows using state and getters from one store without using the composition
  * API (`setup()`) by generating an object to be spread in the `computed` field
@@ -162,10 +162,9 @@ export function mapState<
 ): MapStateReturn<S, G> | MapStateObjectReturn<S, G, KeyMapper> {
   return Array.isArray(keysOrMapper)
     ? keysOrMapper.reduce((reduced, key) => {
-        // @ts-ignore: sorry TS
         reduced[key] = function (this: Vue) {
           return getCachedStore(this, useStore)[key]
-        }
+        } as () => any
         return reduced
       }, {} as MapStateReturn<S, G>)
     : Object.keys(keysOrMapper).reduce((reduced, key: keyof KeyMapper) => {