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

machine.js

const INPUT = { INPUT: { actions: "input" } };
const CLOSE = { CLOSE: "closed" };
const SUGGEST = { SUGGEST: "suggesting" };
const NOTIFY = { NOTIFY: "notifying" };

const fetchMachine = Machine({
      initial: "closed",
      context: {
        suggestions: [],
        message: "Start typing to find address",
      },
      states: {
        closed: {
          entry: ["close", "onClose"],
          exit: ["onOpen", "open"],
          on: {
            AWAKE: [
              {
                target: "suggesting",
                cond: (c) => c.suggestions.length > 0,
              },
              {
                target: "notifying",
              },
            ],
          },
        },
        notifying: {
          entry: ["updateMessage", "showMessage"],
          on: {
            ...CLOSE,
            ...SUGGEST,
            ...NOTIFY,
            ...INPUT,
          },
        },
        suggesting: {
          entry: ["updateSuggestions", "renderSuggestions"],
          on: {
            ...CLOSE,
            ...SUGGEST,
            ...NOTIFY,
            ...INPUT,
            NEXT: { actions: "next" },
            PREVIOUS: { actions: "previous" },
            SELECT: { actions: "select" },
          },
        },
      },
    });