xstate/

1# <%= _.startCase(name) %> Machine
2
3TODO: Explain machine purpose

1import { assign, ImmerUpdateEvent } from "@xstate/immer";
2import { createMachine } from "xstate";
3
4export interface <%= _.upperFirst(_.camelCase(name)) %>Context {
5  value: number;
6}
7
8export type <%= _.upperFirst(_.camelCase(name)) %>State = {
9  context: <%= _.upperFirst(_.camelCase(name)) %>Context;
10};
11
12type SetEvent = ImmerUpdateEvent<"SET", number>;
13
14const increase = assign((ctx: <%= _.upperFirst(_.camelCase(name)) %>Context) => void (ctx.value += 1));
15const decrease = assign((ctx: <%= _.upperFirst(_.camelCase(name)) %>Context) => void (ctx.value -= 1));
16const set = assign(
17  (ctx: <%= _.upperFirst(_.camelCase(name)) %>Context, { input }: SetEvent) => void (ctx.value = input)
18);
19const reset = assign((ctx: <%= _.upperFirst(_.camelCase(name)) %>Context) => void (ctx.value = 0));
20
21export const <%= _.camelCase(name) %>Machine = createMachine({
22  initial: "active",
23  states: {
24    active: {
25      on: {
26        INCREASE: { actions: increase },
27        DECREASE: { actions: decrease },
28        SET: { actions: set },
29        RESET: { actions: reset },
30      },
31    },
32  },
33});