https://github.com/marshalyuan/east-store
east-store is a state manager with easiest api that based hooks and immer.
https://github.com/marshalyuan/east-store
immer react-hooks state-management
Last synced: 5 months ago
JSON representation
east-store is a state manager with easiest api that based hooks and immer.
- Host: GitHub
- URL: https://github.com/marshalyuan/east-store
- Owner: marshalYuan
- License: mit
- Created: 2019-11-11T07:21:16.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2025-06-24T09:26:50.000Z (12 months ago)
- Last Synced: 2025-08-18T10:53:21.974Z (10 months ago)
- Topics: immer, react-hooks, state-management
- Language: TypeScript
- Size: 2.3 MB
- Stars: 20
- Watchers: 2
- Forks: 3
- Open Issues: 18
-
Metadata Files:
- Readme: README.md
- License: LICENSE
Awesome Lists containing this project
README
# east-store
> east-store is a state manager with easiest api that based hooks and immer.
[](http://npm.im/east-store)
[](http://opensource.org/licenses/MIT)
# install
```
npm install east-store
```
# features
- easy usage, just one api `createStore`
- immutale data based immer
- friendly typescript support, no need more type declarations
- use react-hooks, why not?
# usage
```typescript
import { createStore } from 'east-store'
const AtomicStore = createStore(0, {
increase: () => count => count + 1,
decrease: n => count => count - n
})
const Counter: React.FC = () => {
const [count, action] = AtomicStore.useStore()
const handleDecrease = () => {
action.decrease(3)
}
return (
{count}
increase
decrease
)
}
```
Of course, you can use object as initial state
```typescript
const amy = {
name: 'Amy',
total: 130,
score: { math: 60, english: 70 }
}
const buildStudentStore = (student: typeof amy) =>
createStore(student, {
modify: (subject: 'math' | 'english', score: number) => student => {
student.score[subject] = score
student.total = student.score.math + student.score.english
}
})
const amyScore = buildStudentStore(amy)
const [state, actions] = amyScore.useStore()
```
So, async operation is also supported
```typescript
async function fetchCount(): number {
return await fetch('/path')
}
const AtomicStore = createStore(0, {
increase: () => count => count + 1,
getRemote: () => async (_) => {
return await fetchCount()
}
})
```
# Api
```typescript
createStore(initial, actions, options)
```
| | des | type |
|---------|-------------------|----------------------------------------------------------------------------------------------------|
| initial | initial state | primitive type
object
Map, Set |
| actions | actions for state | `(payload) => (state) => void | state` |
| options | other options | `persist: boolean or Storage`, default false
set true if you want this state been persisted
and set custom storage implementation with `set, get` is also valid
* persistence means shared |
```typescript
useStore(selector?, compareFn?)
```
| | des | type |
|---------|-------------------|----------------------------------------------------------------------------------------------------|
| selector | selector function | `(state) => state.items` |
| compareFn | compare function,default shallow | `(prev, curr) => boolean` |