🍵 Tiny, easy and powerful React state management
One this breaking change for this version: Remove confusing reset feature
https://github.com/teafuljs/teaful/pull/44
Reset
function is removed. It's not responsibility of the library. In this way:
Pros:
Cons:
The user will be responsible for controlling the reset. That is, save the value in memory.
Example:
const [value, setValue] = useStore.value()
const lastValue = useRef(value)
// After some changes, is possible to reset with:
setValue(lastValue.current)
Another example:
const initialStore = { count: 0 }
export const { getStore } = createStore(initialStore)
const [,setStore] = getStore()
export const reset = () => setStore(initialStore)
import { reset } from './store'
function ResetStore() {
return <button onClick={reset}>Reset store</button>
}
Full Changelog: https://github.com/teafuljs/teaful/compare/0.7.2...0.8.0
Full Changelog: https://github.com/teafuljs/teaful/compare/0.7.1...0.7.2
Full Changelog: https://github.com/teafuljs/teaful/compare/0.7.0...0.7.1
~Fragstore~ is renamed to Teaful
yarn add teaful
We are taking advantage of the fact that we are in an early stage (0.x) to evolve quickly the library trying to make everything more and more tiny, easy and powerful.
Sorry for the breaking changes and if you have any questions you can write inside GitHub Discussions.
The library is becoming more and more stable and we will make less breaking changes, and from version 1.0 onwards we will follow the semantic version 100%.
🚨 I have to announce that after having changed the name of the library from
fragmented-store
tofragstore
, we are forced to change it again to avoid problems with a company called fragstore that we didn't know about.We have not changed the name for this version as it already has some breaking changes. But we will change it for the next version and it will be the only breaking change for the future 0.7 version.
We will make it so that when installing the latest
fragstore
package in npm it will make a warning saying so, but I prefer to announce it.👉 Subscribe to this discussion to find out about the name change.
<Store store={initialStore} callbacks={{ cart: onCartUpdate }}>
</Store>
store
variable inside createStore
:const { useStore, getStore } = createStore(initialStore)
// Or if you need it to loading dynamically use the getStore helper:
const [, setStore] = getStore()
setStore(store => ({ ...store, ...initialStore }))
callback
inside createStore
:const { useStore, getStore } = createStore(initialStore, onStoreUpdate)
function onStoreUpdate({ path, ...rest }) {
if(path.startsWith('cart')) onCartUpdate(...rest)
}
// Or if you want the event to be cleared when the component unmounts, use useStore:
const [cart, setCart] = useStore.cart(initialCartValue, onCartUpdate)
Provider
to Store
because after the reimplementation it is no longer mandatory to use it because it is no longer a provider, it only makes sense to redefine the store and callbacks. In the future, it will surely have more features.