Ultra lightweight state management for your Stimulus powered web applications.
- Create and manage global state with ease. π
- Share state between different controllers effortlessly using a unified, atomic
Store
class. π - 1.04KB Minified and Brotlied πͺΆ
Install with npm:
npm install stimulus-store
Install with yarn:
yarn add stimulus-store
If you prefer not to use a build system, you can load stimulus-store
in a <script>
tag and it will be globally available through the window.StimulusStore
object.
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script src="https://unpkg.com/stimulus/dist/stimulus.umd.js"></script>
<script src="https://unpkg.com/stimulus-store/dist/bundle.umd.js"></script>
<script>
(() => {
const application = Stimulus.Application.start();
const helloStore = StimulusStore.createStore({
name: "helloStore",
type: String,
initialValue: "Hello World!",
});
application.register(
"hello",
class extends Stimulus.Controller {
static stores = [helloStore];
connect() {
StimulusStore.useStore(this);
this.element.innerHtml = `<p>${this.helloStoreValue}</p>`;
}
}
);
})();
</script>
</head>
<body>
<div data-controller="hello">β¦</div>
</body>
</html>
complete documentation on Stimulus Store, including guides, API details, and more can be found on www.stimulus-store.com.
Thanks goes to these wonderful people (emoji key):
Tomas Caraccia π» |
Omar Luq π» |
|||||
Add your contributions |
This project follows the all-contributors specification. Contributions of any kind welcome!
This project is licensed under the MIT License - see the LICENSE.md file for details.