Generated by XState Viz: https://xstate.js.org/viz

machine.js

const postCardMachine = Machine({
  id: "postCard",
  type: "parallel",
  states: {
    publishing: {
      initial: "placeholder",
      states: {
        operation: {
          initial: "listing",
          states: {
            listing: {
              on: { MANIPULATE: "manipulation" },
              initial: "expanded",
              states: {
                expanded: {
                  on: { SHRINK: "shrinked" },
                  initial: "pending",
                  states: {
                    pending: {
                      on: { PUBLISH: "published", DRAFT: "draft" },
                    },
                    published: {
                      on: { DRAFT: "draft" },
                    },
                    draft: {
                      on: {
                        PUBLISH: "published",
                      },
                    },
                  },
                },
                shrinked: {
                  on: { EXPAND: "expanded" },
                  initial: "pending",
                  states: {
                    pending: {
                      on: { PUBLISH: "published", DRAFT: "draft" },
                    },
                    published: {
                      on: { DRAFT: "draft" },
                    },
                    draft: {
                      on: {
                        PUBLISH: "published",
                      },
                    },
                  },
                },
              },
            },
            manipulation: {
              on: { LIST: "listing" },
            },
          },
        },
        placeholder: {
          on: {
            OPERATION: "operation",
          },
        },
      },
    },
  },
})