YoltraYoltra
TSPy

createYoltra

function
react/src/createYoltra.tsx:85
signature
createYoltra<RM>(cfg): Yoltra<keyof RM & string, StateFromReducers<RM>, EMFromReducersStrict<RM>>

One-call setup: create a store and its fully-typed React hooks together.

Type parameters

NameTypeDescription
RMextends ReducersMapAnyReducers map; state shape and event map are inferred from it.

Parameters

cfg — object with:

NameTypeDescription
dedupWindowMs?number
devtools?{ allowReplay?: boolean }
effects?EffectSpec<DeepReadonly<StateFromReducers<RM>>, EMFromReducersStrict<RM>>[]
middleware?MiddlewareFunction<DeepReadonly<StateFromReducers<RM>>, EMFromReducersStrict<RM>>[]
namestring
onEffectError?(error: unknown, event: EventUnion<EMFromReducersStrict<RM>>) => void
reducerRM

Returns

Yoltra<keyof RM & string, StateFromReducers<RM>, EMFromReducersStrict<RM>> — The store, an optional StoreProvider, the raw StoreContext, and the full set of typed hooks (useAtomicProp, useAtomicProps, useEmit, useEvent, useSelector, useStore, shallowEqual).

Example

example
export const { store, useAtomicProp, useEmit } = createYoltra({
  name: 'App',
  reducer: {
    counter: {
      state: { value: 0 },
      events: [['ui', 'increment']],
      reducer: (s, e) => (e.type === 'increment' ? { value: s.value + e.payload } : s),
    },
  },
});

function Counter() {
  const value = useAtomicProp({ reducer: 'counter', property: 'value' });
  const emit = useEmit();
  return <button onClick={() => emit('ui', 'increment', 1)}>{value}</button>;
}