◎
Selector-first
Sélectionnez un objet contenant uniquement les valeurs nécessaires. Kerros compare ses champs de premier niveau avec Object.is.
Kerros
Un état qui suit l'arbre de composants
Transformez n'importe quel Hook React en Store centré sur les sélecteurs. Chaque Provider forme une frontière stable et seuls les composants dont la sélection change sont rendus à nouveau.
Collez dans votre Coding Agent pour installer le paquet et le Skill
Installe @violetflux/kerros avec le gestionnaire de paquets du projet, puis exécute npx skills add violetflux/kerros --skill kerros --agent '*' -y afin d'installer le Skill Kerros pour tous les Coding Agents compatibles.
createStore · Provider · selector
Partager un état en trois étapes
Passez un Hook ordinaire à createStore, montez son Provider, puis sélectionnez uniquement les valeurs nécessaires.
import { createStore } from '@violetflux/kerros'
import { useState } from 'react'
const [useCounter, CounterProvider] = createStore(() => {
const [count, setCount] = useState(0)
return { count, setCount }
})
function Counter() {
const { count, setCount } = useCounter(s => ({
count: s.count,
setCount: s.setCount,
}))
return <button onClick={() => setCount(count + 1)}>{count}</button>
}
<CounterProvider>
<Counter />
</CounterProvider>⌁
Natif aux Hooks
Un Store est un Hook React nommé ordinaire. Continuez à utiliser useState, useReducer et vos Hooks SDK.
◇
Composable
Imbriquez les Providers pour créer des dépendances explicites et unidirectionnelles entre Stores.
↗
React 17–19
Le shim external-store officiel privilégie l'implémentation native de React lorsqu'elle est disponible.