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({
    initial: "idle",
    context: {
      direction: "ltr",
      activationMode: "automatic",
      activeTabId: "",
      focusedTabId: "",
      tablistId: "",
      indicatorRect: { left: 0, right: 0, width: 0, height: 0 },
      measuredRect: false,
    },
    on: {
      SET_DOC: {
        actions: "setOwnerDocument",
      },
    },
    states: {
      idle: {
        always: { actions: "setActiveTabRect" },
        on: {
          TAB_FOCUS: { target: "focused", actions: "setFocusedId" },
          TAB_CLICK: {
            target: "focused",
            actions: ["setFocusedId", "setActiveId", "setActiveTabRect"],
          },
        },
      },
      focused: {
        on: {
          TAB_CLICK: {
            target: "focused",
            actions: ["setFocusedId", "setActiveId", "setActiveTabRect"],
          },
          TABLIST_ARROW_LEFT: [
            { cond: "isRtl", actions: "focusNextTab" },
            { actions: "focusPrevTab" },
          ],
          TABLIST_ARROW_RIGHT: [
            { cond: "isRtl", actions: "focusPrevTab" },
            { actions: "focusNextTab" },
          ],
          TABLIST_HOME: [
            { cond: "isRtl", actions: "focusLastTab" },
            { actions: "focusFirstTab" },
          ],
          TABLIST_END: [
            { cond: "isRtl", actions: "focusFirstTab" },
            { actions: "focusLastTab" },
          ],
          TABLIST_ENTER: {
            cond: "notShouldSelectionFollowFocus",
            actions: ["setActiveId", "setActiveTabRect"],
          },
          TAB_FOCUS: [
            {
              cond: "shouldSelectionFollowFocus",
              actions: ["setFocusedId", "setActiveId", "setActiveTabRect"],
            },
            { actions: "setFocusedId" },
          ],
          TAB_BLUR: {
            target: "idle",
            actions: "resetFocusedId",
          },
        },
      },
    },
  },);