What problem does it solve? Setting up Redux-style state management in a Svelte 5 app involves tricky lifecycle concerns: initializing the store in the root layout, starting sagas at the right time, binding selector readables in templates, and avoiding context errors from calling selectors in event handlers. This Skill provides the exact patterns and rules for integrating the Themis Store class into Svelte components correctly. ## Core Features & Use Cases - Root layout bootstrap: Initialize the Store with store.init() in +layout.svelte and register its disposer with onDestroy to prevent leaked saga tasks on hot reload. - Saga lifecycle management: Start app sagas explicitly via store.runSaga(sagaFn) from onMount or imperatively, with mount-scoped cancellation. - Component state patterns: Create selector readables at component init, bind them in templates with $selector$ syntax, and dispatch actions through the configured Store instance in handlers. - Use Case: You are building a SvelteKit feature that fetches and displays items. Use this Skill to set up the store in the root layout, start the fetch saga on mount, bind selectItems() and selectIsLoading() readables in the component, and dispatch removeItem(id) from a delete handler without hitting getContext() errors. ## Quick Start Ask the AI to wire the Themis Store into your Svelte 5 root layout and components, including store initialization, saga startup, and selector binding in templates.
