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.

Live examplePublic package · Solid reactivity
state.counter.value0
createMemo(() => value * 2)0
Recent events

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.

counter.ts · the running example
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.