feat: add createMapper convenience utility

[danielroe]

resolves #260

🔥 Notable changes

This PR adds a convenience helper function to allow you to easily map the accessor state/methods into your component.

import Vue from 'vue'

// Nuxt
import { accessorType } from '~/store'
const mapper = createMapper(accessorType)
// Vue
import { accessor } from './src/store'
const mapper = createMapper(accessor)

export default Vue.extend({
  computed: {
    // Direct mapping to a property
    ...mapper('name'),
    // or array of properties
    ...mapper(['name', 'email']),
    // or submodules
    ...mapper('submodule', ['name', 'email']),
  },
  methods: {
    // All your methods should be included in the methods object,
    // whether they are mutations, actions (or even a method returned
    // by a getter or stored in state)
    ...mapper('resetName'),
    resetEmail() {
      // You can access directly off your component instance
      console.log(this.name, this.email)
      this.resetName()
    },
  },
})

[vercel]

This pull request is being automatically deployed with Vercel (learn more).
To see the status of your deployment, click below or on the icon next to each commit.

🔍 Inspect: https://vercel.com/danielroe/nuxt-typed-vuex/2pbMXckQsBB4CYnDJX6imWLExqi4
✅ Preview: https://nuxt-typed-vuex-git-feat-mapper-danielroe.vercel.app

[codecov]

Codecov Report

Merging #264 (ecdd99f) into main (0572a30) will not change coverage.
The diff coverage is 100.00%.

@@            Coverage Diff            @@
##              main      #264   +/-   ##
=========================================
  Coverage   100.00%   100.00%           
=========================================
  Files            9        10    +1     
  Lines           99       117   +18     
  Branches        20        28    +8     
=========================================
+ Hits            99       117   +18     

Impacted Files	Coverage Δ
packages/typed-vuex/src/accessor.ts	100.00% <100.00%> (ø)
packages/typed-vuex/src/utils.ts	100.00% <100.00%> (ø)

---

Continue to review full report at Codecov.

Legend - Click here to learn more
Δ = absolute <relative> (impact), ø = not affected, ? = missing data
Powered by Codecov. Last update 0572a30...ecdd99f. Read the comment docs.

[RomainBillot]

Freaking insane ! Thanks ❤️

[MateiNenciu]

Great feature, but can this be extend to allow us to rename the props names? Like vuex does with mapGetters, etc ?

[danielroe]

Go for it - raise an issue with an example of what you mean 😊

[omnichronous]

This looks very cool, but I don't understand where to import createMapper from - it's not exported in node_modules/typed-vuex/lib/index.d.ts?

[danielroe]

I think it seems to be: https://unpkg.com/browse/[email protected]/dist/index.d.ts.

Are you on v0.3.0+?

[omnichronous]

My bad, I was using an older version, thank you!

I also want to second MateiNenciu's feature request, but I'll follow your suggestion to open a new issue for it.