Sinai
Type safe state management inspired by Vuex.
This library includes many type level hacks. Use at your own risk and do not use if you are unsure about the mechanism under the hood.
If you search a production ready state management solution, take a look vuex-smart-module
Requirements
- Vue >= 2.5
- TypeScript >= 2.8
Examples
import { store as createStore, module, Getters, Mutations, Actions } from 'sinai'
// Declare the module state and its initial value
class CounterState {
count = 0
}
// Declare getters
class CounterGetters extends Getters<CounterState>() {
get half () {
return this.state.count / 2
}
}
// Declare mutations
class CounterMutations extends Mutations<CounterState>() {
inc () {
this.state.count += 1
}
dec () {
this.state.count -= 1
}
}
// Declare actions
class CounterActions extends Actions<CounterState, CounterGetters, CounterMutations>() {
asyncInc (ms: number) {
console.log('count: ' + this.state.count)
console.log('half: ' + this.getters.half)
return new Promise(resolve => {
setTimeout(() => {
this.mutations.inc()
resolve()
}, ms)
})
}
}
// Create module by composing state/getters/mutations/actions
const counter = module({
state: CounterState,
getters: CounterGetters,
mutations: CounterMutations,
actions: CounterActions
})
// Create root module
const root = module().child('counter', counter)
// Create store
const store = createStore(root, {
strict: process.env.NODE_ENV !== 'production'
})
// These will be all type checked
console.log(store.state.counter.count)
console.log(store.getters.counter.half)
store.actions.counter.asyncInc(1000)
store.mutations.counter.inc()
For other examples, see tests.
License
MIT
[...snip...]
[...snip...]
3 Nov 4, 2019
36 May 5, 2021
7 Mar 29, 2022
42 Aug 10, 2022
64 Nov 11, 2022
3 Jul 30, 2020
2 Oct 12, 2021
0 Dec 30, 2021
4 Jan 17, 2022
27.9k Dec 30, 2022
42 Feb 18, 2022
24 May 5, 2021
11 Jan 22, 2021
149 Nov 24, 2022
466 Dec 30, 2022
4 Jul 2, 2022
138 Sep 21, 2022
49 Apr 28, 2022