State that speaks Solid.
Typed events. Explicit transitions. Fine-grained reactivity. Solux brings a Flux-style event flow to your SolidJS application.
A small, explicit event flow
Create an event, describe how a slice handles it, then dispatch it to a store. Read state directly in Solid JSX or derive a value with createMemo. Solux uses Solid’s store machinery: reactive property reads remain the unit of tracking.
Use it when a dashboard, editor, or application needs named events and shared state transitions. For local UI state, Solid’s own signals and stores may be all you need.
Dispatch an event to see it here.
From event to state
Handlers synchronously update state with mutable-style syntax through Solid’s produce. Subscriptions receive the state and event after the handler runs, including events that do not change state.
import { combineSlices, configureStore, createEvent, createSlice } from "@carere/solux";
export const increment = createEvent<number>("counter/increment");
export const reset = createEvent("counter/reset");
export function createCounterStore() {
const counter = createSlice({
initialState: { value: 0 },
handlers: (builder) =>
builder
.addHandler(increment, (state, { payload }) => {
state.value += payload;
})
.addHandler(reset, (state) => {
state.value = 0;
}),
});
return configureStore({ rootSlice: combineSlices({ counter }) });
}
Read with the version in mind
The interactive examples run against this workspace’s public @carere/solux package. Lifecycle and DevTools pages distinguish the new guarantees from the published 4.0.1 behavior.