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

machine.js

const dragMachine = Machine(
  {
    key: 'ngx-drag-to-select',
    initial: 'clickMode',
    context: {
      shortcuts: {},
      selectWithShortcut: false,
      x1: 0,
      y1: 0,
      x2: 0,
      y2: 0,
      selectedDirectiveIds: []
    },
    states: {
      clickMode: {
        on: {
          click: [
            {
              actions: ['clickItemAppend'],
              cond: 'appendItem'
            },
            {
              actions: ['clickItem']
            }
          ]
        }
      },
      dragMode: {
        initial: 'idle',
        states: {
          idle: {
            on: {
              mousedown: {
                target: 'dragging',
                actions: ['clearSelection', 'startDrag']
              }
            }
          },
          dragging: {
            on: {
              mousemove: {
                actions: ['drag', 'drawSelectbox', 'updateSelectedItems']
              },
              mouseup: { target: 'idle', actions: ['resetDrag', 'drawSelectbox'] }
            }
          }
        }
      },
      selectMode: {
        on: {
          click: {
            actions: ['clickItemAppend']
          }
        }
      },
      shortcutMode: {
        on: {
          click: {
            actions: ['clickItemAppend'],
            cond: 'isShortcutPressed'
          }
        }
      },
      disabled: {}
    },
    on: {
      toggleDragMode: 'dragMode',
      toggleSelectMode: 'selectMode',
      toggleClickMode: 'clickMode',
      toggleSelectWithShortcut: 'shortcutMode',
      toggleDisabledMode: 'disabled',
      selectItems: {
        actions: 'selectItems'
      },
      clearAll: {
        actions: 'clearAll'
      }
    }
  })