Agent Skills: Global Store with Subscriptions

Global Store with Subscriptions

Instructions for implementing a small store and wiring components to it.

When to Use

Use this when multiple components need shared state without implicit reactivity by default.

Steps

1. Implement a store with getState, setState, and subscribe.
2. In components, call handle.onBeforeMount() to subscribe once.
3. On store updates, call handle.update() from the subscription.
4. Keep mutations behind store commands to avoid stale views.

Arguments

• stateShape - description of the state object (defaults to {})
• storeFile - path to the store module (defaults to src/store.ts)
• featureName - feature identifier for naming (defaults to App)

Examples

Example 1 usage pattern:

Create a counter store and a component that reads getState() during render.

Example 2 usage pattern:

Expose a setState command and update UI through subscriptions only.

Output

Example output:

Created: src/store.ts
Updated: src/counter.ts
Notes: handle.onBeforeMount() subscribes once and updates explicitly.

Present Results to User

Summarize store API, subscription wiring, and files changed.