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

machine.js

  // Available variables:
  // - Machine
  // - interpret
  // - assign
  // - send
  // - sendParent
  // - spawn
  // - raise
  // - actions
  // - XState (all XState exports)
  
  const fetchMachine = Machine({
    id: "table",
    type: "parallel",
    context: {
      rows: [],
      selectedIds: [],
      prevId: undefined,
      x1: undefined,
      y1: undefined,
      selectArea: undefined,
      delay: 0,
    },
    states: {
      state: {
        initial: "idle",
        states: {
          idle: {
            entry: send("reset", {
              delay: "CONFIG_DELAY"
            }),
            on: {
              click: [
                { actions: "ctrlShiftClick", cond: "isCtrlShiftClick" },
                { actions: "ctrlClick", cond: "isCtrlClick" },
                { actions: "shiftClick", cond: "isShiftClick" },
                { actions: "click" }
              ],
              mousedown: {
                target: "dragging",
                actions: "mousedown"
              },
              reset: {
                actions: ["reset", "redrawSelectArea"]
              }
            }
          },
          dragging: {
            on: {
              mousemove: {
                actions: ["mousemove", "redrawSelectArea"]
              },
              mouseup: "idle"
            }
          }
        }
      },
      selection: {
        initial: "unknown",
        on: {
          click: "selection",
          mouseup: "selection",
          mousemove: "selection"
        },
        states: {
          unknown: {
            on: {
              "": [
                {
                  target: "SINGLE_SELECTION",
                  cond: "hasSingleSelection"
                },
                {
                  target: "MULTI_SELECTION",
                  cond: "hasMultipleSelections"
                },
                {
                  target: "EMPTY_SELECTION",
                }
              ]
            }
          },
          SINGLE_SELECTION: {},
          MULTI_SELECTION: {},
          EMPTY_SELECTION: {}
        }
      }
    }
  }, {
    
    guards: {
      hasSingleSelection: ctx => true,
      hasMultipleSelections: ctx => true,
      isCtrlShiftClick: (_) => true,
      isCtrlClick: (_) => true,
      isShiftClick: (_) => true
    },
  });