> ## Documentation Index
> Fetch the complete documentation index at: https://stackrlabs.mintlify.site/llms.txt
> Use this file to discover all available pages before exploring further.

# Almost Micro-Rollup

> Packaging state machines inside the rollup and other things

### State Machines

State machines are simple units that can be used to model the state of a system. They are composed of states, events, and transitions. A state machine can be in one state at a time,
and can transition to another state when an event is triggered. The state machine can also have actions that are executed when a transition occurs.

Stackr-JS provides a simple state machine implementation that takes in the Rollup state and STF

<Warning>All of this should go outside the `state.ts` file</Warning>

**example**

```ts theme={null}
import { StateMachine } from "@stackr/stackr-js/execution";
import * as genesisState from "../genesis-state.json";

const counterFsm = new StateMachine({
  state: new CounterRollup(genesisState.state),
  stf: counterSTF,
});
```

### Genesis State

The genesis state is the initial state of the state machine.
It is the state that is used to initialize the state machine. It is also the state that is used to initialize the state of the rollup.

You need to set the genesis state inside `genesis-state.json` file.

The format is

`{ "state" : WHATEVER_YOU_WANT_AS_JSON }`

example

<CodeGroup>
  ```json counter  theme={null}
  { "state": 0 }
  ```

  ```json amm theme={null}
  {
    "state": [
      {
        "owner": "Alice",
        "quantityA": 10,
        "quantityB": 0
      },
      {
        "owner": "Bob",
        "quantityA": 20,
        "quantityB": 10
      },
      {
        "owner": "Charlie",
        "quantityA": 200,
        "quantityB": 0
      }
    ]
  }
  ```

  ```json chess theme={null}
  { "state": "rnbqkbnr/pppppppp/8/8/8/8/PPPPPPPP/RNBQKBNR w KQkq - 0 1" }
  ```
</CodeGroup>

### Input type schema

The user-input type schema is the schema that is used to validate the user input. It is used to validate the user input before it is applied to the state machine.

<Info>
  This is what the user/ another entity send to the **app** or **rollup**. This
  is NOT what is applied to the State transition function.
</Info>

You can define to get a custom input from the user using this schema -> optionally process it or add more items -> create an object for **ActionInput** for the state machine

To define a user input type schema, there are some special things to take care of since Stackr creates **EIP-712** typed data field for the same

Example, for a chess game you can define something like

```ts theme={null}
const actionSchemaType = {
  move: "String",
};
```

Or for a counter you can define something like

```ts theme={null}
const actionSchemaType = {
  type: "String",
};
```

or for a AMM you can define something like

```ts theme={null}
const actionSchemaType = {
  type: "String",
  owner: "String",
  quantityA: "Number",
  quantityB: "Number",
};
```

#### Notice the types

<Warning>
  These are not TypeScript interfaces, these are actual Objects hence the way
  the type is passed on is inside quotes.
</Warning>

#### Supported user input types

These are same as solidity types

```ts internal stackr-js theme={null}
export type PrimitiveType = "String" | "Uint" | "Bool" | "Address" | "Bytes";
export type SchemaType =
  | PrimitiveType
  | { [key: string]: SchemaType }
  | SchemaType[];
```

So you can define both simple and complex input schema

<CodeGroup>
  ```ts simple theme={null}
  const actionSchemaType = {
    type: "String",
    owner: "String",
    quantityA: "Number",
    quantityB: "Number",
  };
  ```

  ```ts nested theme={null}
  const actionSchemaType = {
    type: "String",
    owner: "String",
    quantityA: "Number",
    quantityB: "Number",
    nested: {
      type: "String",
      owner: "String",
      quantityA: "Number",
      quantityB: "Number",
    },
    array: [
      {
        type: "String",
        owner: "String",
        quantityA: "Number",
        quantityB: "Number",
      },
    ],
  };
  ```
</CodeGroup>

<Info>
  Stackr Converts these to EIP-712 typed data fields and expects user signatures
  on it
</Info>

You can now generate an `ActionSchema` from this

```ts theme={null}
import { ActionSchema } from "@stackr/stackr-js";

const userInputSchema = new ActionSchema("update-move", actionSchemaType);
```

This `userInputSchema` can be used to create instances of user Actions