Intermediate

// Hierarchical state structure: parent state contains substates
type ConnState = "Disconnected" | "Connected.Idle" | "Connected.Active"; // => Dot notation represents hierarchy
type ConnEvent = "connect" | "disconnect" | "activity" | "pause";
 
class Connection {
  private state: ConnState = "Disconnected"; // => Initial state: top-level
 
  handleEvent(event: ConnEvent): void {
    // Parent-level transition: applies regardless of substate
    if (event === "disconnect" && this.state.startsWith("Connected")) {
      this.state = "Disconnected"; // => Parent transition: Connected.* → Disconnected (any substate)
      return;
    }
    // Substate transitions within Connected
    if (this.state === "Disconnected" && event === "connect") {
      this.state = "Connected.Idle"; // => Transition: Disconnected → Connected.Idle (default substate)
    } else if (this.state === "Connected.Idle" && event === "activity") {
      this.state = "Connected.Active"; // => Substate transition: Idle → Active
    } else if (this.state === "Connected.Active" && event === "pause") {
      this.state = "Connected.Idle"; // => Substate transition: Active → Idle
    }
  }
 
  getState(): ConnState {
    return this.state;
  }
}
 
const conn = new Connection();
conn.handleEvent("connect");
console.log(conn.getState()); // => Output: Connected.Idle
conn.handleEvent("activity");
console.log(conn.getState()); // => Output: Connected.Active
conn.handleEvent("disconnect"); // => Parent transition fires from any substate
console.log(conn.getState()); // => Output: Disconnected

// Hierarchical FSM: Parent transitions apply to all substates
type State = "Disconnected" | "Connected.Idle" | "Connected.Active"; // => Dot notation for substates
// => Type system ensures only valid states used
type Event = "connect" | "disconnect" | "activity" | "pause"; // => Four events
// => Events trigger state transitions
 
class NetworkConnection {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: State = "Disconnected"; // => Initial: Disconnected
  // => FSM begins execution in Disconnected state
 
  getCurrentState(): State {
    // => Query method: read current FSM state
    return this.state; // => Returns current state
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    // Parent-level transition: disconnect from ANY Connected substate
    if (this.state.startsWith("Connected.") && event === "disconnect") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      // => Combined (state, event) guard
      // => Check if in ANY Connected substate
      this.state = "Disconnected"; // => Exit all substates to Disconnected
      console.log("Disconnected (from any substate)"); // => Output for verification
      // => Chained method calls or nested operations
      // => Debug/audit output
      // => Log for observability
      return; // => Parent transition handled
    }
 
    // Substate-specific transitions
    if (this.state === "Disconnected" && event === "connect") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      // => Combined (state, event) guard
      this.state = "Connected.Idle"; // => Enter parent state at default substate
      // => Parent: Connected, Substate: Idle
    } else if (this.state === "Connected.Idle" && event === "activity") {
      // => Logical AND: both conditions must be true
      this.state = "Connected.Active"; // => Idle → Active (within Connected)
    } else if (this.state === "Connected.Active" && event === "pause") {
      // => Logical AND: both conditions must be true
      this.state = "Connected.Idle"; // => Active → Idle (within Connected)
    } else {
      // => Fallback branch
      console.log(`Invalid transition: ${event} in ${this.state}`); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    }
  }
}
 
// Usage
const conn = new NetworkConnection(); // => state: "Disconnected"
conn.handleEvent("connect"); // => Disconnected → Connected.Idle
console.log(conn.getCurrentState()); // => Output: Connected.Idle
 
conn.handleEvent("activity"); // => Connected.Idle → Connected.Active
console.log(conn.getCurrentState()); // => Output: Connected.Active
 
conn.handleEvent("disconnect"); // => Parent transition: Any Connected → Disconnected
console.log(conn.getCurrentState()); // => Output: Disconnected

// Hierarchical states with entry/exit actions
type State = "Off" | "On.Starting" | "On.Running" | "On.Stopping"; // => Parent: On, Substates: Starting/Running/Stopping
// => Type system ensures only valid states used
type Event = "powerOn" | "started" | "stop" | "stopped" | "powerOff"; // => Five events
// => Events trigger state transitions
 
class Machine {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: State = "Off"; // => Initial: Off
  // => FSM begins execution in Off state
 
  getCurrentState(): State {
    // => Query method: read current FSM state
    return this.state; // => Returns state
  }
 
  private onEnterParent(): void {
    // => Extended state (data beyond FSM state)
    console.log("→ Entered On state (parent)"); // => Parent entry action
    // => Log for observability
    // => Example: Initialize resources
  }
 
  private onExitParent(): void {
    // => Extended state (data beyond FSM state)
    console.log("← Exited On state (parent)"); // => Parent exit action
    // => Log for observability
    // => Example: Release resources
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    if (this.state === "Off" && event === "powerOn") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      // => Combined (state, event) guard
      this.onEnterParent(); // => Entering parent state
      this.state = "On.Starting"; // => Enter at Starting substate
      console.log("  → Entered Starting substate"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (this.state === "On.Starting" && event === "started") {
      // => Logical AND: both conditions must be true
      console.log("  ← Exited Starting substate"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
      this.state = "On.Running"; // => Starting → Running (within On)
      console.log("  → Entered Running substate"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (this.state === "On.Running" && event === "stop") {
      // => Logical AND: both conditions must be true
      console.log("  ← Exited Running substate"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
      this.state = "On.Stopping"; // => Running → Stopping (within On)
      console.log("  → Entered Stopping substate"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (this.state === "On.Stopping" && event === "stopped") {
      // => Logical AND: both conditions must be true
      console.log("  ← Exited Stopping substate"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
      this.onExitParent(); // => Exiting parent state
      this.state = "Off"; // => Exit parent to Off
    } else if (this.state.startsWith("On.") && event === "powerOff") {
      // => Logical AND: both conditions must be true
      console.log("  ← Exited current substate (emergency)"); // => Output for verification
      // => Chained method calls or nested operations
      // => Debug/audit output
      // => Log for observability
      this.onExitParent(); // => Parent exit action
      this.state = "Off"; // => Emergency exit from any On substate
    }
  }
}
 
// Usage
const machine = new Machine(); // => state: "Off"
machine.handleEvent("powerOn"); // => Off → On.Starting (parent entry + substate entry)
// => Output: → Entered On state (parent)
// =>         → Entered Starting substate
 
machine.handleEvent("started"); // => On.Starting → On.Running (substate transition)
// => Output: ← Exited Starting substate
// =>         → Entered Running substate
 
machine.handleEvent("powerOff"); // => Emergency exit: any On substate → Off
// => Output: ← Exited current substate (emergency)
// =>         ← Exited On state (parent)

// Multi-level hierarchical FSM
type State = "Offline" | "Online.Guest" | "Online.Authenticated.Browsing" | "Online.Authenticated.Purchasing"; // => Three hierarchy levels
// => Type system ensures only valid states used
type Event = "connect" | "login" | "checkout" | "cancel" | "networkError"; // => Five events
// => Events trigger state transitions
 
class ShoppingApp {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: State = "Offline"; // => Initial: Offline
  // => FSM begins execution in Offline state
 
  getCurrentState(): State {
    // => Query method: read current FSM state
    return this.state; // => Returns state
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    // Level 1 parent transition: networkError exits ALL Online substates
    if (this.state.startsWith("Online.") && event === "networkError") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      // => Combined (state, event) guard
      // => Check if in any Online substate (any level deep)
      this.state = "Offline"; // => Exit all levels to Offline
      console.log("Network error: Offline"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
      return;
    }
 
    // Regular transitions
    if (this.state === "Offline" && event === "connect") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      // => Combined (state, event) guard
      this.state = "Online.Guest"; // => Enter Online parent at Guest substate
    } else if (this.state === "Online.Guest" && event === "login") {
      // => Logical AND: both conditions must be true
      this.state = "Online.Authenticated.Browsing"; // => Enter Authenticated parent at Browsing
      // => Now two levels deep: Online → Authenticated → Browsing
    } else if (this.state === "Online.Authenticated.Browsing" && event === "checkout") {
      // => Logical AND: both conditions must be true
      this.state = "Online.Authenticated.Purchasing"; // => Browsing → Purchasing (within Authenticated)
    } else if (this.state === "Online.Authenticated.Purchasing" && event === "cancel") {
      // => Logical AND: both conditions must be true
      this.state = "Online.Authenticated.Browsing"; // => Purchasing → Browsing
    } else {
      // => Fallback branch
      console.log(`Invalid transition: ${event} in ${this.state}`); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    }
  }
}
 
// Usage
const app = new ShoppingApp(); // => state: "Offline"
app.handleEvent("connect"); // => Offline → Online.Guest
console.log(app.getCurrentState()); // => Output: Online.Guest
 
app.handleEvent("login"); // => Online.Guest → Online.Authenticated.Browsing (two levels deep)
console.log(app.getCurrentState()); // => Output: Online.Authenticated.Browsing
 
app.handleEvent("checkout"); // => Browsing → Purchasing (within Authenticated)
console.log(app.getCurrentState()); // => Output: Online.Authenticated.Purchasing
 
app.handleEvent("networkError"); // => Parent transition: exits ALL levels to Offline
console.log(app.getCurrentState()); // => Output: Offline

// Hierarchical FSM with default substate entry
type State = "Stopped" | "Playing.Loading" | "Playing.Buffering" | "Playing.Active"; // => Parent: Playing
// => Type system ensures only valid states used
type Event = "play" | "loaded" | "buffered" | "pause"; // => Four events
// => Events trigger state transitions
 
interface StateConfig {
  // => Type declaration defines structure
  defaultSubstate?: State; // => Default substate when entering parent
}
 
class VideoPlayer {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: State = "Stopped"; // => Initial: Stopped
  // => FSM begins execution in Stopped state
  private readonly stateConfig: Record<string, StateConfig> = {
    // => State field: stores current FSM state privately
    // => Extended state (data beyond FSM state)
    // => Initialized alongside FSM state
    Playing: { defaultSubstate: "Playing.Loading" }, // => Playing defaults to Loading substate
  };
 
  getCurrentState(): State {
    // => Query method: read current FSM state
    return this.state; // => Returns state
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    if (this.state === "Stopped" && event === "play") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      // => Combined (state, event) guard
      const defaultSubstate = this.stateConfig["Playing"].defaultSubstate!; // => State variable initialization
      // => Initialize defaultSubstate
      this.state = defaultSubstate; // => Enter Playing at default substate (Loading)
      console.log(`Entered Playing at default: ${this.state}`); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (this.state === "Playing.Loading" && event === "loaded") {
      // => Logical AND: both conditions must be true
      this.state = "Playing.Buffering"; // => Loading → Buffering
    } else if (this.state === "Playing.Buffering" && event === "buffered") {
      // => Logical AND: both conditions must be true
      this.state = "Playing.Active"; // => Buffering → Active
    } else if (this.state.startsWith("Playing.") && event === "pause") {
      // => Logical AND: both conditions must be true
      this.state = "Stopped"; // => Exit Playing from any substate
    } else {
      // => Fallback branch
      console.log(`Invalid transition: ${event} in ${this.state}`); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    }
  }
}
 
// Usage
const player = new VideoPlayer(); // => state: "Stopped"
player.handleEvent("play"); // => Stopped → Playing.Loading (default substate)
// => Output: Entered Playing at default: Playing.Loading
 
console.log(player.getCurrentState()); // => Output: Playing.Loading
 
player.handleEvent("loaded"); // => Playing.Loading → Playing.Buffering
console.log(player.getCurrentState()); // => Output: Playing.Buffering

// Composite state: two concurrent regions tracked independently
type AudioRegion = "Muted" | "Playing"; // => Audio region: independent state
type VideoRegion = "Paused" | "Streaming"; // => Video region: independent state
type MediaEvent = "mute" | "unmute" | "play" | "pause";
 
class CompositeMediaSystem {
  private audio: AudioRegion = "Muted"; // => Region 1 initial state
  private video: VideoRegion = "Paused"; // => Region 2 initial state (independent of audio)
 
  handleEvent(event: MediaEvent): void {
    // Each event targets one region; the other region is unaffected
    if (event === "unmute")
      this.audio = "Playing"; // => Audio region: Muted → Playing
    else if (event === "mute")
      this.audio = "Muted"; // => Audio region: Playing → Muted
    else if (event === "play")
      this.video = "Streaming"; // => Video region: Paused → Streaming
    else if (event === "pause") this.video = "Paused"; // => Video region: Streaming → Paused
  }
 
  getState() {
    return { audio: this.audio, video: this.video };
  } // => Both regions active simultaneously
}
 
const media = new CompositeMediaSystem();
media.handleEvent("play");
console.log(media.getState()); // => Output: { audio: 'Muted', video: 'Streaming' }
media.handleEvent("unmute");
console.log(media.getState()); // => Output: { audio: 'Playing', video: 'Streaming' }

// Composite FSM: Two concurrent regions (Audio + Video)
type AudioState = "Muted" | "Playing"; // => Audio region states
// => Type system ensures only valid states used
type VideoState = "Paused" | "Streaming"; // => Video region states
// => Type system ensures only valid states used
type Event = "mute" | "unmute" | "play" | "pause"; // => Events target specific regions
// => Events trigger state transitions
 
class MediaPlayer {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private audioState: AudioState = "Muted"; // => Region 1: Audio
  // => Initialized alongside FSM state
  private videoState: VideoState = "Paused"; // => Region 2: Video
  // => Initialized alongside FSM state
 
  getCurrentState(): { audio: AudioState; video: VideoState } {
    // => Query method: read current FSM state
    return { audio: this.audioState, video: this.videoState }; // => Returns both region states
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    // Audio region transitions
    if (event === "unmute" && this.audioState === "Muted") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      this.audioState = "Playing"; // => Muted → Playing (audio region only)
    } else if (event === "mute" && this.audioState === "Playing") {
      // => Logical AND: both conditions must be true
      this.audioState = "Muted"; // => Playing → Muted (audio region only)
    }
    // Video region transitions
    else if (event === "play" && this.videoState === "Paused") {
      // => Alternative conditional branch
      // => Logical AND: both conditions must be true
      this.videoState = "Streaming"; // => Paused → Streaming (video region only)
    } else if (event === "pause" && this.videoState === "Streaming") {
      // => Logical AND: both conditions must be true
      this.videoState = "Paused"; // => Streaming → Paused (video region only)
    } else {
      // => Fallback branch
      console.log(`Invalid transition: ${event} in audio=${this.audioState}, video=${this.videoState}`); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    }
  }
}
 
// Usage
const player = new MediaPlayer(); // => audio: Muted, video: Paused
console.log(player.getCurrentState()); // => Output: { audio: 'Muted', video: 'Paused' }
 
player.handleEvent("play"); // => Video region: Paused → Streaming (audio unchanged)
console.log(player.getCurrentState()); // => Output: { audio: 'Muted', video: 'Streaming' }
 
player.handleEvent("unmute"); // => Audio region: Muted → Playing (video unchanged)
console.log(player.getCurrentState()); // => Output: { audio: 'Playing', video: 'Streaming' }
 
player.handleEvent("pause"); // => Video region: Streaming → Paused (audio unchanged)
console.log(player.getCurrentState()); // => Output: { audio: 'Playing', video: 'Paused' }

// Composite FSM with cross-region coordination
type PowerState = "On" | "Off"; // => Power region
// => Type system ensures only valid states used
type DisplayState = "Showing" | "Hidden"; // => Display region
// => Type system ensures only valid states used
type Event = "powerOn" | "powerOff" | "show" | "hide"; // => Events
// => Events trigger state transitions
 
class Device {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private powerState: PowerState = "Off"; // => Region 1: Power
  // => Initialized alongside FSM state
  private displayState: DisplayState = "Hidden"; // => Region 2: Display
  // => Initialized alongside FSM state
 
  getCurrentState(): { power: PowerState; display: DisplayState } {
    // => Query method: read current FSM state
    return { power: this.powerState, display: this.displayState }; // => Returns value to caller
    // => Return computed result
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    if (event === "powerOn" && this.powerState === "Off") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      this.powerState = "On"; // => Power: Off → On
      this.displayState = "Showing"; // => Cross-region: Force Display to Showing
      console.log("Power on: Display forced to Showing"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (event === "powerOff" && this.powerState === "On") {
      // => Logical AND: both conditions must be true
      this.powerState = "Off"; // => Power: On → Off
      this.displayState = "Hidden"; // => Cross-region: Force Display to Hidden
      console.log("Power off: Display forced to Hidden"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (event === "show" && this.powerState === "On" && this.displayState === "Hidden") {
      // => Logical AND: both conditions must be true
      this.displayState = "Showing"; // => Display: Hidden → Showing (only if powered on)
    } else if (event === "hide" && this.powerState === "On" && this.displayState === "Showing") {
      // => Logical AND: both conditions must be true
      this.displayState = "Hidden"; // => Display: Showing → Hidden (only if powered on)
    } else {
      // => Fallback branch
      console.log(`Invalid transition: ${event} in power=${this.powerState}, display=${this.displayState}`); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    }
  }
}
 
// Usage
const device = new Device(); // => power: Off, display: Hidden
console.log(device.getCurrentState()); // => Output: { power: 'Off', display: 'Hidden' }
 
device.handleEvent("powerOn"); // => Power On → forces Display to Showing
// => Output: Power on: Display forced to Showing
console.log(device.getCurrentState()); // => Output: { power: 'On', display: 'Showing' }
 
device.handleEvent("hide"); // => Display: Showing → Hidden (independent)
console.log(device.getCurrentState()); // => Output: { power: 'On', display: 'Hidden' }
 
device.handleEvent("powerOff"); // => Power Off → forces Display to Hidden
// => Output: Power off: Display forced to Hidden
console.log(device.getCurrentState()); // => Output: { power: 'Off', display: 'Hidden' }

// Composite FSM with join synchronization
type AuthState = "Unauthenticated" | "Authenticated"; // => Auth region
// => Type system ensures only valid states used
type DataState = "NotLoaded" | "Loaded"; // => Data region
// => Type system ensures only valid states used
type CombinedState = "NotReady" | "Ready"; // => Combined state after join
// => Type system ensures only valid states used
type Event = "login" | "loadData" | "logout" | "clearData"; // => Events
// => Events trigger state transitions
 
class Application {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private authState: AuthState = "Unauthenticated"; // => Region 1: Auth
  // => Initialized alongside FSM state
  private dataState: DataState = "NotLoaded"; // => Region 2: Data
  // => Initialized alongside FSM state
  private combinedState: CombinedState = "NotReady"; // => Derived state from regions
  // => Initialized alongside FSM state
 
  getCurrentState(): { auth: AuthState; data: DataState; combined: CombinedState } {
    // => Query method: read current FSM state
    return { auth: this.authState, data: this.dataState, combined: this.combinedState }; // => Returns value to caller
    // => Return computed result
  }
 
  private checkReadiness(): void {
    // => Extended state (data beyond FSM state)
    // Join condition: BOTH regions must be in specific states
    if (this.authState === "Authenticated" && this.dataState === "Loaded") {
      // => Conditional branch
      // => Logical AND: both conditions must be true
      // => Conditional check
      // => Branch execution based on condition
      this.combinedState = "Ready"; // => Join: Auth+Data ready → App ready
      console.log("Join: Application ready (auth + data complete)"); // => Output for verification
      // => Chained method calls or nested operations
      // => Debug/audit output
      // => Log for observability
    } else {
      // => Fallback branch
      this.combinedState = "NotReady"; // => Either region not ready → App not ready
    }
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    if (event === "login" && this.authState === "Unauthenticated") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      this.authState = "Authenticated"; // => Auth: Unauthenticated → Authenticated
      this.checkReadiness(); // => Check if join condition met
    } else if (event === "loadData" && this.dataState === "NotLoaded") {
      // => Logical AND: both conditions must be true
      this.dataState = "Loaded"; // => Data: NotLoaded → Loaded
      this.checkReadiness(); // => Check if join condition met
    } else if (event === "logout") {
      this.authState = "Unauthenticated"; // => Auth: reset
      this.checkReadiness(); // => Combined becomes NotReady
    } else if (event === "clearData") {
      this.dataState = "NotLoaded"; // => Data: reset
      this.checkReadiness(); // => Combined becomes NotReady
    }
  }
}
 
// Usage
const app = new Application(); // => auth: Unauthenticated, data: NotLoaded, combined: NotReady
console.log(app.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { auth: 'Unauthenticated', data: 'NotLoaded', combined: 'NotReady' }
 
app.handleEvent("login"); // => Auth ready, but data not ready yet
console.log(app.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { auth: 'Authenticated', data: 'NotLoaded', combined: 'NotReady' }
 
app.handleEvent("loadData"); // => Data ready → JOIN condition met!
// => Output: Join: Application ready (auth + data complete)
console.log(app.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { auth: 'Authenticated', data: 'Loaded', combined: 'Ready' }
 
app.handleEvent("logout"); // => Auth reset → Join broken
console.log(app.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { auth: 'Unauthenticated', data: 'Loaded', combined: 'NotReady' }

// Fork: Single state splits into concurrent regions
type SingleState = "Idle"; // => Initial single state
// => Type system ensures only valid states used
type WorkerAState = "ProcessingA" | "DoneA"; // => Region A after fork
// => Type system ensures only valid states used
type WorkerBState = "ProcessingB" | "DoneB"; // => Region B after fork
// => Type system ensures only valid states used
type Event = "start" | "completeA" | "completeB"; // => Events
// => Events trigger state transitions
 
class ParallelProcessor {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: "single" | "forked" = "single"; // => Mode: single state or forked regions
  // => FSM begins execution in single state
  private singleState: SingleState | null = "Idle"; // => State when in single mode
  // => Initialized alongside FSM state
  private workerA: WorkerAState | null = null; // => Region A (null when not forked)
  // => Initialized alongside FSM state
  private workerB: WorkerBState | null = null; // => Region B (null when not forked)
  // => Initialized alongside FSM state
 
  getCurrentState(): any {
    // => Query method: read current FSM state
    if (this.state === "single") {
      // => State-based guard condition
      // => Guard condition: check current state is single
      // => Only execute if condition true
      return { mode: "single", state: this.singleState }; // => Single state active
    } else {
      // => Fallback branch
      return { mode: "forked", workerA: this.workerA, workerB: this.workerB }; // => Both regions active
    }
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    if (event === "start" && this.state === "single" && this.singleState === "Idle") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      // => Combined (state, event) guard
      // FORK: Split into two concurrent regions
      this.state = "forked"; // => Enter forked mode
      this.singleState = null; // => Exit single state
      this.workerA = "ProcessingA"; // => Region A starts
      this.workerB = "ProcessingB"; // => Region B starts
      console.log("Fork: Idle → ProcessingA + ProcessingB (parallel)"); // => Output for verification
      // => Chained method calls or nested operations
      // => Debug/audit output
      // => Log for observability
    } else if (event === "completeA" && this.state === "forked" && this.workerA === "ProcessingA") {
      // => Logical AND: both conditions must be true
      this.workerA = "DoneA"; // => Region A completes
      console.log("Worker A completed"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
      this.checkCompletion(); // => Check if both regions done
    } else if (event === "completeB" && this.state === "forked" && this.workerB === "ProcessingB") {
      // => Logical AND: both conditions must be true
      this.workerB = "DoneB"; // => Region B completes
      console.log("Worker B completed"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
      this.checkCompletion(); // => Check if both regions done
    }
  }
 
  private checkCompletion(): void {
    // => Extended state (data beyond FSM state)
    if (this.workerA === "DoneA" && this.workerB === "DoneB") {
      // => Conditional branch
      // => Logical AND: both conditions must be true
      // => Conditional check
      // => Branch execution based on condition
      // JOIN: Both regions complete → merge back to single state
      this.state = "single"; // => Exit forked mode
      this.singleState = "Idle"; // => Return to Idle
      this.workerA = null; // => Clear region A
      this.workerB = null; // => Clear region B
      console.log("Join: Both workers done → Idle"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    }
  }
}
 
// Usage
const processor = new ParallelProcessor(); // => mode: single, state: Idle
console.log(processor.getCurrentState()); // => Output: { mode: 'single', state: 'Idle' }
 
processor.handleEvent("start"); // => Fork: Idle → ProcessingA + ProcessingB
// => Output: Fork: Idle → ProcessingA + ProcessingB (parallel)
console.log(processor.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { mode: 'forked', workerA: 'ProcessingA', workerB: 'ProcessingB' }
 
processor.handleEvent("completeA"); // => Worker A done (B still processing)
// => Output: Worker A completed
console.log(processor.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { mode: 'forked', workerA: 'DoneA', workerB: 'ProcessingB' }
 
processor.handleEvent("completeB"); // => Worker B done → JOIN back to Idle
// => Output: Worker B completed
// =>         Join: Both workers done → Idle
console.log(processor.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { mode: 'single', state: 'Idle' }

// Parallel regions: Connectivity + Authentication
type ConnectivityState = "Online" | "Offline"; // => Region 1
// => Type system ensures only valid states used
type AuthState = "LoggedOut" | "LoggedIn"; // => Region 2
// => Type system ensures only valid states used
type Event = "disconnect" | "reconnect" | "login" | "logout"; // => Events for both regions
// => Events trigger state transitions
 
class System {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private connectivity: ConnectivityState = "Online"; // => Region 1: Connectivity
  // => Initialized alongside FSM state
  private auth: AuthState = "LoggedOut"; // => Region 2: Authentication
  // => Initialized alongside FSM state
 
  getCurrentState(): { connectivity: ConnectivityState; auth: AuthState } {
    // => Query method: read current FSM state
    return { connectivity: this.connectivity, auth: this.auth }; // => Returns value to caller
    // => Return computed result
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    // Connectivity region
    if (event === "disconnect" && this.connectivity === "Online") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      this.connectivity = "Offline"; // => Online → Offline
    } else if (event === "reconnect" && this.connectivity === "Offline") {
      // => Logical AND: both conditions must be true
      this.connectivity = "Online"; // => Offline → Online
    }
    // Authentication region (independent of connectivity)
    else if (event === "login" && this.auth === "LoggedOut") {
      // => Alternative conditional branch
      // => Logical AND: both conditions must be true
      this.auth = "LoggedIn"; // => LoggedOut → LoggedIn
      // => Can login while Offline (credential caching)
    } else if (event === "logout" && this.auth === "LoggedIn") {
      // => Logical AND: both conditions must be true
      this.auth = "LoggedOut"; // => LoggedIn → LoggedOut
    }
  }
}
 
// Usage
const system = new System(); // => connectivity: Online, auth: LoggedOut
console.log(system.getCurrentState()); // => Output: { connectivity: 'Online', auth: 'LoggedOut' }
 
system.handleEvent("login"); // => Auth: LoggedOut → LoggedIn (connectivity unchanged)
console.log(system.getCurrentState()); // => Output: { connectivity: 'Online', auth: 'LoggedIn' }
 
system.handleEvent("disconnect"); // => Connectivity: Online → Offline (auth unchanged)
console.log(system.getCurrentState()); // => Output: { connectivity: 'Offline', auth: 'LoggedIn' }
// => Can be Offline + LoggedIn simultaneously

// Broadcast event affects multiple regions
type Region1State = "R1_Idle" | "R1_Active"; // => Region 1 states
// => Type system ensures only valid states used
type Region2State = "R2_Idle" | "R2_Active"; // => Region 2 states
// => Type system ensures only valid states used
type Event = "activate" | "deactivate" | "reset"; // => Events
// => Events trigger state transitions
 
class MultiRegionSystem {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private region1: Region1State = "R1_Idle"; // => Region 1
  // => Initialized alongside FSM state
  private region2: Region2State = "R2_Idle"; // => Region 2
  // => Initialized alongside FSM state
 
  getCurrentState(): { region1: Region1State; region2: Region2State } {
    // => Query method: read current FSM state
    return { region1: this.region1, region2: this.region2 }; // => Returns value to caller
    // => Return computed result
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    if (event === "activate") {
      // => Event type guard condition
      // => Event type check
      // Broadcast: activates BOTH regions
      if (this.region1 === "R1_Idle") {
        // => Conditional branch
        // => Conditional check
        // => Branch execution based on condition
        this.region1 = "R1_Active"; // => Region 1: Idle → Active
      }
      if (this.region2 === "R2_Idle") {
        // => Conditional branch
        // => Conditional check
        // => Branch execution based on condition
        this.region2 = "R2_Active"; // => Region 2: Idle → Active
      }
      console.log("Broadcast: activated both regions"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (event === "deactivate") {
      // Broadcast: deactivates BOTH regions
      if (this.region1 === "R1_Active") {
        // => Conditional branch
        // => Conditional check
        // => Branch execution based on condition
        this.region1 = "R1_Idle"; // => Region 1: Active → Idle
      }
      if (this.region2 === "R2_Active") {
        // => Conditional branch
        // => Conditional check
        // => Branch execution based on condition
        this.region2 = "R2_Idle"; // => Region 2: Active → Idle
      }
      console.log("Broadcast: deactivated both regions"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (event === "reset") {
      // => Accessor: provides controlled state access
      // Broadcast: resets ALL regions to initial states
      this.region1 = "R1_Idle"; // => Region 1 reset
      this.region2 = "R2_Idle"; // => Region 2 reset
      console.log("Broadcast: reset all regions"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    }
  }
}
 
// Usage
const multiSystem = new MultiRegionSystem(); // => both regions: Idle
console.log(multiSystem.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { region1: 'R1_Idle', region2: 'R2_Idle' }
 
multiSystem.handleEvent("activate"); // => Broadcast: both regions activate
// => Output: Broadcast: activated both regions
console.log(multiSystem.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { region1: 'R1_Active', region2: 'R2_Active' }
 
multiSystem.handleEvent("reset"); // => Broadcast: reset all regions
// => Output: Broadcast: reset all regions
console.log(multiSystem.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { region1: 'R1_Idle', region2: 'R2_Idle' }

// Conditionally activate parallel regions
type FeatureState = "Enabled" | "Disabled" | null; // => null = region not active
// => Type system ensures only valid states used
type Event = "enableFeatureA" | "enableFeatureB" | "disableFeatureA" | "disableFeatureB"; // => Type declaration defines structure
// => Defines event alphabet for FSM
// => Events trigger state transitions
 
class ConfigurableSystem {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private featureA: FeatureState = null; // => Region A: initially inactive
  // => Initialized alongside FSM state
  private featureB: FeatureState = null; // => Region B: initially inactive
  // => Initialized alongside FSM state
 
  getCurrentState(): { featureA: FeatureState; featureB: FeatureState } {
    // => Query method: read current FSM state
    return { featureA: this.featureA, featureB: this.featureB }; // => Returns value to caller
    // => Return computed result
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    if (event === "enableFeatureA") {
      // => Event type guard condition
      // => Event type check
      if (this.featureA === null) {
        // => Conditional branch
        // => Conditional check
        // => Branch execution based on condition
        this.featureA = "Disabled"; // => Activate region A at initial state
        console.log("Feature A region activated"); // => Output for verification
        // => Debug/audit output
        // => Log for observability
      }
      if (this.featureA === "Disabled") {
        // => Conditional branch
        // => Conditional check
        // => Branch execution based on condition
        this.featureA = "Enabled"; // => Disabled → Enabled
      }
    } else if (event === "disableFeatureA") {
      if (this.featureA === "Enabled") {
        // => Conditional branch
        // => Conditional check
        // => Branch execution based on condition
        this.featureA = "Disabled"; // => Enabled → Disabled
      }
    } else if (event === "enableFeatureB") {
      if (this.featureB === null) {
        // => Conditional branch
        // => Conditional check
        // => Branch execution based on condition
        this.featureB = "Disabled"; // => Activate region B
        console.log("Feature B region activated"); // => Output for verification
        // => Debug/audit output
        // => Log for observability
      }
      if (this.featureB === "Disabled") {
        // => Conditional branch
        // => Conditional check
        // => Branch execution based on condition
        this.featureB = "Enabled";
      }
    } else if (event === "disableFeatureB") {
      if (this.featureB === "Enabled") {
        // => Conditional branch
        // => Conditional check
        // => Branch execution based on condition
        this.featureB = "Disabled";
      }
    }
  }
}
 
// Usage
const configSystem = new ConfigurableSystem(); // => both regions: null (inactive)
console.log(configSystem.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { featureA: null, featureB: null }
 
configSystem.handleEvent("enableFeatureA"); // => Activate region A
// => Output: Feature A region activated
console.log(configSystem.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { featureA: 'Enabled', featureB: null }
 
configSystem.handleEvent("enableFeatureB"); // => Activate region B
// => Output: Feature B region activated
console.log(configSystem.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { featureA: 'Enabled', featureB: 'Enabled' }

// Error handling: isolated vs. propagating
type WorkerState = "Working" | "Error" | "Stopped"; // => Worker region states
// => Type system ensures only valid states used
type MonitorState = "Monitoring" | "AlertSent"; // => Monitor region states
// => Type system ensures only valid states used
type Event = "work" | "error" | "acknowledge" | "stop"; // => Events
// => Events trigger state transitions
 
class ResilientSystem {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private worker: WorkerState = "Stopped"; // => Region 1: Worker
  // => Initialized alongside FSM state
  private monitor: MonitorState = "Monitoring"; // => Region 2: Monitor
  // => Initialized alongside FSM state
 
  getCurrentState(): { worker: WorkerState; monitor: MonitorState } {
    // => Query method: read current FSM state
    return { worker: this.worker, monitor: this.monitor }; // => Returns value to caller
    // => Return computed result
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    if (event === "work" && this.worker === "Stopped") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      this.worker = "Working"; // => Worker starts
    } else if (event === "error" && this.worker === "Working") {
      // => Logical AND: both conditions must be true
      this.worker = "Error"; // => Worker errors
      this.monitor = "AlertSent"; // => Error propagates to Monitor region
      console.log("Error propagated: Worker → Monitor"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (event === "acknowledge" && this.monitor === "AlertSent") {
      // => Logical AND: both conditions must be true
      this.monitor = "Monitoring"; // => Monitor acknowledges alert
      // => Worker region unchanged (error persists)
    } else if (event === "stop") {
      this.worker = "Stopped"; // => Worker stops
      if (this.monitor === "AlertSent") {
        // => Conditional branch
        // => Conditional check
        // => Branch execution based on condition
        this.monitor = "Monitoring"; // => Monitor auto-clears alert on stop
        console.log("Monitor cleared on worker stop"); // => Output for verification
        // => Debug/audit output
        // => Log for observability
      }
    }
  }
}
 
// Usage
const resilientSys = new ResilientSystem(); // => worker: Stopped, monitor: Monitoring
console.log(resilientSys.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { worker: 'Stopped', monitor: 'Monitoring' }
 
resilientSys.handleEvent("work"); // => Worker: Stopped → Working
console.log(resilientSys.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { worker: 'Working', monitor: 'Monitoring' }
 
resilientSys.handleEvent("error"); // => Error propagates across regions
// => Output: Error propagated: Worker → Monitor
console.log(resilientSys.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { worker: 'Error', monitor: 'AlertSent' }
 
resilientSys.handleEvent("acknowledge"); // => Monitor clears, worker error persists
console.log(resilientSys.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { worker: 'Error', monitor: 'Monitoring' }
 
resilientSys.handleEvent("stop"); // => Worker stops, monitor clears
// => Output: Monitor cleared on worker stop
console.log(resilientSys.getCurrentState()); // => Output for verification
// => Chained method calls or nested operations
// => Query method: read current FSM state
// => Output: { worker: 'Stopped', monitor: 'Monitoring' }

// Shallow history: Remembers last immediate substate
type State = "Off" | "On.Low" | "On.Medium" | "On.High"; // => States with hierarchy
// => Type system ensures only valid states used
type Event = "powerOn" | "powerOff" | "resume" | "increase" | "decrease"; // => Events
// => Events trigger state transitions
 
class BrightnessControl {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: State = "Off"; // => Current state
  // => FSM begins execution in Off state
  private history: "On.Low" | "On.Medium" | "On.High" | null = null; // => Last On substate
  // => Initialized alongside FSM state
 
  getCurrentState(): State {
    // => Query method: read current FSM state
    return this.state; // => Returns value to caller
    // => Return current state value
  }
 
  private saveHistory(): void {
    // => Extended state (data beyond FSM state)
    if (this.state.startsWith("On.")) {
      // => State-based guard condition
      // => Chained method calls or nested operations
      // => Conditional check
      // => Branch execution based on condition
      this.history = this.state as any; // => Save current On substate
      console.log(`History saved: ${this.history}`); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    }
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    if (event === "powerOn" && this.state === "Off") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      // => Combined (state, event) guard
      this.state = "On.Low"; // => Default: enter at Low
      this.saveHistory();
    } else if (event === "powerOff" && this.state.startsWith("On.")) {
      // => Logical AND: both conditions must be true
      this.saveHistory(); // => Save before exiting
      this.state = "Off"; // => Exit to Off
    } else if (event === "resume" && this.state === "Off" && this.history) {
      // => Logical AND: both conditions must be true
      this.state = this.history; // => Restore last On substate from history
      console.log(`Resumed from history: ${this.state}`); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (event === "increase") {
      if (this.state === "On.Low")
        this.state = "On.Medium"; // => State-based guard condition
      // => Conditional check
      // => Branch execution based on condition
      else if (this.state === "On.Medium") this.state = "On.High"; // => Alternative conditional branch
      this.saveHistory();
    } else if (event === "decrease") {
      if (this.state === "On.High")
        this.state = "On.Medium"; // => State-based guard condition
      // => Conditional check
      // => Branch execution based on condition
      else if (this.state === "On.Medium") this.state = "On.Low"; // => Alternative conditional branch
      this.saveHistory();
    }
  }
}
 
// Usage
const brightness = new BrightnessControl(); // => state: Off, history: null
brightness.handleEvent("powerOn"); // => Off → On.Low
// => Output: History saved: On.Low
console.log(brightness.getCurrentState()); // => Output: On.Low
 
brightness.handleEvent("increase"); // => On.Low → On.Medium
// => Output: History saved: On.Medium
console.log(brightness.getCurrentState()); // => Output: On.Medium
 
brightness.handleEvent("increase"); // => On.Medium → On.High
// => Output: History saved: On.High
console.log(brightness.getCurrentState()); // => Output: On.High
 
brightness.handleEvent("powerOff"); // => On.High → Off (save High in history)
// => Output: History saved: On.High
console.log(brightness.getCurrentState()); // => Output: Off
 
brightness.handleEvent("resume"); // => Off → On.High (restore from history)
// => Output: Resumed from history: On.High
console.log(brightness.getCurrentState()); // => Output: On.High

// Deep history: Remembers full state hierarchy
type State = "Off" | "On.Playing.Song1" | "On.Playing.Song2" | "On.Paused"; // => Multi-level hierarchy
// => Type system ensures only valid states used
type Event = "powerOn" | "powerOff" | "resume" | "play" | "pause" | "nextSong"; // => Events
// => Events trigger state transitions
 
class MusicPlayer {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: State = "Off"; // => Current state
  // => FSM begins execution in Off state
  private deepHistory: Exclude<State, "Off"> | null = null; // => Full state path saved
  // => Initialized alongside FSM state
 
  getCurrentState(): State {
    // => Query method: read current FSM state
    return this.state; // => Returns value to caller
    // => Return current state value
  }
 
  private saveDeepHistory(): void {
    // => Extended state (data beyond FSM state)
    if (this.state !== "Off") {
      // => State-based guard condition
      // => Conditional check
      // => Branch execution based on condition
      this.deepHistory = this.state as any; // => Save complete state path
      console.log(`Deep history saved: ${this.deepHistory}`); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    }
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    if (event === "powerOn" && this.state === "Off") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      // => Combined (state, event) guard
      this.state = "On.Playing.Song1"; // => Default: enter at Song1
      this.saveDeepHistory();
    } else if (event === "powerOff" && this.state !== "Off") {
      // => Logical AND: both conditions must be true
      this.saveDeepHistory(); // => Save before exiting
      this.state = "Off"; // => State transition execution
      // => Transition: set state to Off
      // => State mutation (core FSM operation)
    } else if (event === "resume" && this.state === "Off" && this.deepHistory) {
      // => Logical AND: both conditions must be true
      this.state = this.deepHistory; // => Restore complete state path
      console.log(`Deep resume: ${this.state}`); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (event === "pause" && this.state.startsWith("On.Playing")) {
      // => Logical AND: both conditions must be true
      this.saveDeepHistory();
      this.state = "On.Paused"; // => Playing → Paused
    } else if (event === "play" && this.state === "On.Paused" && this.deepHistory?.startsWith("On.Playing")) {
      // => Logical AND: both conditions must be true
      this.state = this.deepHistory; // => Resume exact playing state
      console.log(`Resume play: ${this.state}`); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    } else if (event === "nextSong" && this.state === "On.Playing.Song1") {
      // => Logical AND: both conditions must be true
      this.state = "On.Playing.Song2"; // => State transition execution
      this.saveDeepHistory();
    }
  }
}
 
// Usage
const player = new MusicPlayer(); // => state: Off
player.handleEvent("powerOn"); // => Off → On.Playing.Song1
// => Output: Deep history saved: On.Playing.Song1
console.log(player.getCurrentState()); // => Output: On.Playing.Song1
 
player.handleEvent("nextSong"); // => Song1 → Song2
// => Output: Deep history saved: On.Playing.Song2
console.log(player.getCurrentState()); // => Output: On.Playing.Song2
 
player.handleEvent("pause"); // => Playing.Song2 → Paused
// => Output: Deep history saved: On.Playing.Song2
console.log(player.getCurrentState()); // => Output: On.Paused
 
player.handleEvent("play"); // => Paused → restore exact playing state (Song2)
// => Output: Resume play: On.Playing.Song2
console.log(player.getCurrentState()); // => Output: On.Playing.Song2
 
player.handleEvent("powerOff"); // => Save and power off
// => Output: Deep history saved: On.Playing.Song2
player.handleEvent("resume"); // => Resume full state path
// => Output: Deep resume: On.Playing.Song2
console.log(player.getCurrentState()); // => Output: On.Playing.Song2

// History with timeout: Expire after 5 seconds
type State = "Idle" | "Working" | "Paused"; // => States
// => Type system ensures only valid states used
type Event = "start" | "pause" | "resume"; // => Events
// => Events trigger state transitions
 
class TimedHistory {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: State = "Idle"; // => Current state
  // => FSM begins execution in Idle state
  private history: State | null = null; // => Saved state
  // => Initialized alongside FSM state
  private historyTimestamp: number | null = null; // => When history was saved
  // => Initialized alongside FSM state
  private readonly HISTORY_TIMEOUT = 5000; // => 5 seconds in milliseconds
  // => Initialized alongside FSM state
 
  getCurrentState(): State {
    // => Query method: read current FSM state
    return this.state; // => Returns value to caller
    // => Return current state value
  }
 
  private saveHistory(): void {
    // => Extended state (data beyond FSM state)
    this.history = this.state; // => Save state
    this.historyTimestamp = Date.now(); // => Save timestamp
    console.log(`History saved: ${this.history} at ${this.historyTimestamp}`); // => Output for verification
    // => Debug/audit output
    // => Log for observability
  }
 
  private isHistoryValid(): boolean {
    // => Extended state (data beyond FSM state)
    if (!this.history || !this.historyTimestamp) return false; // => Conditional branch
    // => Logical OR: either condition can be true
    // => Return computed result
    const elapsed = Date.now() - this.historyTimestamp; // => Time since save
    return elapsed < this.HISTORY_TIMEOUT; // => Valid if within timeout
  }
 
  handleEvent(event: Event): void {
    // => Event handler: main FSM dispatch method
    if (event === "start" && this.state === "Idle") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      // => Combined (state, event) guard
      this.state = "Working"; // => State transition execution
      // => Transition: set state to Working
      // => State mutation (core FSM operation)
    } else if (event === "pause" && this.state === "Working") {
      // => Logical AND: both conditions must be true
      this.saveHistory(); // => Save Working state
      this.state = "Paused"; // => State transition execution
      // => Transition: set state to Paused
      // => State mutation (core FSM operation)
    } else if (event === "resume" && this.state === "Paused") {
      // => Logical AND: both conditions must be true
      if (this.isHistoryValid()) {
        // => Conditional branch
        // => Chained method calls or nested operations
        // => Conditional check
        // => Branch execution based on condition
        this.state = this.history!; // => Restore from history
        console.log(`Resumed from history: ${this.state}`); // => Output for verification
        // => Debug/audit output
        // => Log for observability
      } else {
        // => Fallback branch
        this.state = "Idle"; // => History expired → default state
        console.log("History expired: reset to Idle"); // => Output for verification
        // => Debug/audit output
        // => Log for observability
      }
      this.history = null; // => Clear history after use
      this.historyTimestamp = null;
    }
  }
}
 
// Usage
const timedFSM = new TimedHistory(); // => state: Idle
timedFSM.handleEvent("start"); // => Idle → Working
console.log(timedFSM.getCurrentState()); // => Output: Working
 
timedFSM.handleEvent("pause"); // => Working → Paused (save history)
// => Output: History saved: Working at [timestamp]
console.log(timedFSM.getCurrentState()); // => Output: Paused
 
// Resume immediately (within timeout)
timedFSM.handleEvent("resume"); // => Paused → Working (history valid)
// => Output: Resumed from history: Working
console.log(timedFSM.getCurrentState()); // => Output: Working
 
// Pause again and wait for timeout
timedFSM.handleEvent("pause");
// => Event handler: main FSM dispatch method
console.log("Waiting 6 seconds for history to expire..."); // => Output for verification
// => Debug/audit output
// => Log for observability
// (In real code: setTimeout or await delay)
// After 6 seconds:
// timedFSM.handleEvent("resume"); // => Paused → Idle (history expired)
// => Output: History expired: reset to Idle

// Conditional history: Restore only if validation passes
type State = "Disconnected" | "Connected.Syncing" | "Connected.Idle"; // => States
// => Type system ensures only valid states used
type Event = "connect" | "disconnect" | "sync" | "reconnect"; // => Events
// => Events trigger state transitions
 
interface HistoryContext {
  // => Type declaration defines structure
  state: State;
  timestamp: number;
  networkQuality: "good" | "poor"; // => Additional context
}
 
class ConditionalHistory {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: State = "Disconnected"; // => State field: stores current FSM state privately
  // => Mutable state storage (single source of truth)
  // => FSM begins execution in Disconnected state
  private history: HistoryContext | null = null; // => Field declaration: class member variable
  // => Extended state (data beyond FSM state)
  // => Initialized alongside FSM state
 
  getCurrentState(): State {
    // => Query method: read current FSM state
    return this.state; // => Returns value to caller
    // => Return current state value
  }
 
  private saveHistory(networkQuality: "good" | "poor"): void {
    // => Extended state (data beyond FSM state)
    this.history = {
      state: this.state,
      timestamp: Date.now(),
      networkQuality, // => Save additional context
    };
    console.log(`History saved: ${this.state} (network: ${networkQuality})`); // => Output for verification
    // => Chained method calls or nested operations
    // => Debug/audit output
    // => Log for observability
  }
 
  private canRestoreHistory(currentNetworkQuality: "good" | "poor"): boolean {
    // => Extended state (data beyond FSM state)
    if (!this.history) return false; // => Conditional branch
    // => Return computed result
 
    // Validation 1: Check timeout (5 seconds)
    const elapsed = Date.now() - this.history.timestamp; // => Variable declaration and assignment
    // => Initialize elapsed
    if (elapsed > 5000) {
      // => Conditional branch
      // => Conditional check
      // => Branch execution based on condition
      console.log("History validation failed: timeout"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
      return false; // => Returns value to caller
      // => Return computed result
    }
 
    // Validation 2: Check network quality consistency
    if (this.history.networkQuality === "good" && currentNetworkQuality === "poor") {
      // => Conditional branch
      // => Logical AND: both conditions must be true
      // => Conditional check
      // => Branch execution based on condition
      console.log("History validation failed: network degraded"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
      return false; // => Don't restore "Syncing" if network is now poor
    }
 
    console.log("History validation passed"); // => Output for verification
    // => Debug/audit output
    // => Log for observability
    return true; // => Returns value to caller
    // => Return computed result
  }
 
  handleEvent(event: Event, networkQuality: "good" | "poor" = "good"): void {
    // => Event handler: main FSM dispatch method
    if (event === "connect" && this.state === "Disconnected") {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Event type check
      // => Combined (state, event) guard
      this.state = "Connected.Idle"; // => State transition execution
    } else if (event === "sync" && this.state === "Connected.Idle") {
      // => Logical AND: both conditions must be true
      this.state = "Connected.Syncing"; // => State transition execution
      this.saveHistory(networkQuality);
    } else if (event === "disconnect" && this.state.startsWith("Connected.")) {
      // => Logical AND: both conditions must be true
      this.saveHistory(networkQuality); // => Save before disconnect
      this.state = "Disconnected"; // => State transition execution
      // => Transition: set state to Disconnected
      // => State mutation (core FSM operation)
    } else if (event === "reconnect" && this.state === "Disconnected") {
      // => Logical AND: both conditions must be true
      if (this.canRestoreHistory(networkQuality)) {
        // => Conditional branch
        // => Chained method calls or nested operations
        // => Conditional check
        // => Branch execution based on condition
        this.state = this.history!.state as State; // => Restore validated history
        console.log(`Restored: ${this.state}`); // => Output for verification
        // => Debug/audit output
        // => Log for observability
      } else {
        // => Fallback branch
        this.state = "Connected.Idle"; // => Validation failed → default state
        console.log("Fallback to default: Connected.Idle"); // => Output for verification
        // => Debug/audit output
        // => Log for observability
      }
    }
  }
}
 
// Usage - Successful restoration
const condFSM = new ConditionalHistory(); // => Instance creation via constructor
// => Create new instance
// => Initialize condFSM
condFSM.handleEvent("connect"); // => Disconnected → Connected.Idle
condFSM.handleEvent("sync", "good"); // => Idle → Syncing (good network)
// => Output: History saved: Connected.Syncing (network: good)
 
condFSM.handleEvent("disconnect", "good"); // => Syncing → Disconnected
// => Output: History saved: Connected.Syncing (network: good)
 
condFSM.handleEvent("reconnect", "good"); // => Restore (validation passes)
// => Output: History validation passed
// =>         Restored: Connected.Syncing
console.log(condFSM.getCurrentState()); // => Output: Connected.Syncing
 
// Usage - Failed restoration (network degraded)
const condFSM2 = new ConditionalHistory(); // => Instance creation via constructor
// => Create new instance
// => Initialize condFSM2
condFSM2.handleEvent("connect");
// => Event handler: main FSM dispatch method
condFSM2.handleEvent("sync", "good"); // => Save with good network
condFSM2.handleEvent("disconnect", "good");
// => Event handler: main FSM dispatch method
condFSM2.handleEvent("reconnect", "poor"); // => Reconnect with poor network
// => Output: History validation failed: network degraded
// =>         Fallback to default: Connected.Idle
console.log(condFSM2.getCurrentState()); // => Output: Connected.Idle

// State Pattern: Each state is a class implementing State interface
interface State {
  // => Type declaration defines structure
  handle(context: TrafficLight): void; // => Each state handles its own transitions
  toString(): string; // => State name for logging
}
 
class RedState implements State {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  handle(context: TrafficLight): void {
    // => Event handler: main FSM dispatch method
    console.log("Red light: Stop. Transitioning to Green..."); // => Output for verification
    // => Debug/audit output
    // => Log for observability
    context.setState(new GreenState()); // => Red → Green
    // => Traffic light state management
  }
  toString(): string {
    return "Red"; // => State name
  }
}
 
class GreenState implements State {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  handle(context: TrafficLight): void {
    // => Event handler: main FSM dispatch method
    console.log("Green light: Go. Transitioning to Yellow..."); // => Output for verification
    // => Debug/audit output
    // => Log for observability
    context.setState(new YellowState()); // => Green → Yellow
    // => Traffic light state management
  }
  toString(): string {
    return "Green"; // => Returns value to caller
    // => Return computed result
  }
}
 
class YellowState implements State {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  handle(context: TrafficLight): void {
    // => Event handler: main FSM dispatch method
    console.log("Yellow light: Caution. Transitioning to Red..."); // => Output for verification
    // => Debug/audit output
    // => Log for observability
    context.setState(new RedState()); // => Yellow → Red
    // => Traffic light state management
  }
  toString(): string {
    return "Yellow"; // => Returns value to caller
    // => Return computed result
  }
}
 
class TrafficLight {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: State; // => Current state object
 
  constructor() {
    this.state = new RedState(); // => Initial state: Red
    // => Traffic light state management
  }
 
  setState(state: State): void {
    this.state = state; // => Transition to new state
    console.log(`State changed to: ${state.toString()}`); // => Output for verification
    // => Chained method calls or nested operations
    // => Debug/audit output
    // => Log for observability
  }
 
  next(): void {
    this.state.handle(this); // => Delegate to current state
  }
 
  getCurrentState(): string {
    // => Query method: read current FSM state
    return this.state.toString(); // => State name
  }
}
 
// Usage
const traffic = new TrafficLight(); // => state: Red
console.log(`Current: ${traffic.getCurrentState()}`); // => Output: Current: Red
 
traffic.next(); // => Red handles: Red → Green
// => Output: Red light: Stop. Transitioning to Green...
// =>         State changed to: Green
console.log(`Current: ${traffic.getCurrentState()}`); // => Output: Current: Green
 
traffic.next(); // => Green handles: Green → Yellow
// => Output: Green light: Go. Transitioning to Yellow...
// =>         State changed to: Yellow
console.log(`Current: ${traffic.getCurrentState()}`); // => Output: Current: Yellow
 
traffic.next(); // => Yellow handles: Yellow → Red
// => Output: Yellow light: Caution. Transitioning to Red...
// =>         State changed to: Red

// State Pattern with lifecycle hooks
interface StateWithLifecycle {
  // => Type declaration defines structure
  onEnter(context: Application): void; // => Called when entering state
  onExit(context: Application): void; // => Called when exiting state
  handle(event: string, context: Application): void; // => Handle events
  getName(): string;
}
 
class LoadingState implements StateWithLifecycle {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  onEnter(context: Application): void {
    console.log("Loading: Initialize resources"); // => Entry action
    // => Log for observability
  }
 
  onExit(context: Application): void {
    console.log("Loading: Cleanup loaders"); // => Exit action
    // => Log for observability
  }
 
  handle(event: string, context: Application): void {
    // => Event handler: main FSM dispatch method
    if (event === "loaded") {
      // => Event type guard condition
      // => Event type check
      context.transitionTo(new ReadyState()); // => Loading → Ready
    }
  }
 
  getName(): string {
    return "Loading"; // => Returns value to caller
    // => Return computed result
  }
}
 
class ReadyState implements StateWithLifecycle {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  onEnter(context: Application): void {
    console.log("Ready: Application ready for use"); // => Output for verification
    // => Debug/audit output
    // => Log for observability
  }
 
  onExit(context: Application): void {
    console.log("Ready: Pausing operations"); // => Output for verification
    // => Debug/audit output
    // => Log for observability
  }
 
  handle(event: string, context: Application): void {
    // => Event handler: main FSM dispatch method
    if (event === "error") {
      // => Event type guard condition
      // => Event type check
      context.transitionTo(new ErrorState()); // => Ready → Error
    }
  }
 
  getName(): string {
    return "Ready"; // => Returns value to caller
    // => Return computed result
  }
}
 
class ErrorState implements StateWithLifecycle {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  onEnter(context: Application): void {
    console.log("Error: Logging error, notifying user"); // => Output for verification
    // => Debug/audit output
    // => Log for observability
  }
 
  onExit(context: Application): void {
    console.log("Error: Clearing error state"); // => Output for verification
    // => Debug/audit output
    // => Log for observability
  }
 
  handle(event: string, context: Application): void {
    // => Event handler: main FSM dispatch method
    if (event === "retry") {
      // => Event type guard condition
      // => Event type check
      context.transitionTo(new LoadingState()); // => Error → Loading (retry)
    }
  }
 
  getName(): string {
    return "Error"; // => Returns value to caller
    // => Return computed result
  }
}
 
class Application {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: StateWithLifecycle; // => State field: stores current FSM state privately
  // => State variable declaration
 
  constructor() {
    this.state = new LoadingState(); // => State transition execution
    // => Constructor creates new object instance
    // => Create new instance
    this.state.onEnter(this); // => Execute entry action for initial state
  }
 
  transitionTo(newState: StateWithLifecycle): void {
    console.log(`Transitioning: ${this.state.getName()} → ${newState.getName()}`); // => Output for verification
    // => Chained method calls or nested operations
    // => Debug/audit output
    // => Log for observability
    this.state.onExit(this); // => Exit current state
    this.state = newState; // => Switch state
    this.state.onEnter(this); // => Enter new state
  }
 
  handleEvent(event: string): void {
    // => Event handler: main FSM dispatch method
    this.state.handle(event, this); // => Delegate to current state
  }
 
  getCurrentState(): string {
    // => Query method: read current FSM state
    return this.state.getName(); // => Returns value to caller
    // => Return current state value
  }
}
 
// Usage
const app = new Application(); // => state: Loading (onEnter executes)
// => Output: Loading: Initialize resources
console.log(`Current: ${app.getCurrentState()}`); // => Output: Current: Loading
 
app.handleEvent("loaded"); // => Loading → Ready
// => Output: Transitioning: Loading → Ready
// =>         Loading: Cleanup loaders
// =>         Ready: Application ready for use
console.log(`Current: ${app.getCurrentState()}`); // => Output: Current: Ready
 
app.handleEvent("error"); // => Ready → Error
// => Output: Transitioning: Ready → Error
// =>         Ready: Pausing operations
// =>         Error: Logging error, notifying user
console.log(`Current: ${app.getCurrentState()}`); // => Output: Current: Error
 
app.handleEvent("retry"); // => Error → Loading
// => Output: Transitioning: Error → Loading
// =>         Error: Clearing error state
// =>         Loading: Initialize resources

// State Pattern with guard conditions
interface GuardedState {
  // => Type declaration defines structure
  canTransition(event: string, context: VendingMachine): boolean; // => Guard condition
  // => Returns boolean without changing state
  handle(event: string, context: VendingMachine): void;
  // => Event handler: main FSM dispatch method
  getName(): string;
}
 
class IdleState implements GuardedState {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  canTransition(event: string, context: VendingMachine): boolean {
    // => Guard: validates transition possibility
    // => Returns boolean without changing state
    if (event === "insertCoin") {
      // => Event type guard condition
      // => Event type check
      return context.getBalance() < 100; // => Guard: allow only if balance < $1.00
    }
    return false; // => Returns value to caller
    // => Return computed result
  }
 
  handle(event: string, context: VendingMachine): void {
    // => Event handler: main FSM dispatch method
    if (event === "insertCoin" && this.canTransition(event, context)) {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Guard: validates transition possibility
      // => Returns boolean without changing state
      context.addBalance(25); // => Add $0.25
      console.log(`Coin inserted. Balance: $${context.getBalance() / 100}`); // => Output for verification
      // => Chained method calls or nested operations
      // => Debug/audit output
      // => Log for observability
      if (context.getBalance() >= 50) {
        // => Conditional branch
        // => Chained method calls or nested operations
        // => Conditional check
        // => Branch execution based on condition
        // => Guard for state transition
        context.transitionTo(new ReadyState()); // => Idle → Ready (enough money)
      }
    } else if (!this.canTransition(event, context)) {
      // => Chained method calls or nested operations
      // => Guard: validates transition possibility
      // => Returns boolean without changing state
      console.log("Guard failed: Balance limit reached"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    }
  }
 
  getName(): string {
    return "Idle"; // => Returns value to caller
    // => Return computed result
  }
}
 
class ReadyState implements GuardedState {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  canTransition(event: string, context: VendingMachine): boolean {
    // => Guard: validates transition possibility
    // => Returns boolean without changing state
    if (event === "selectItem") {
      // => Event type guard condition
      // => Event type check
      return context.getBalance() >= 50; // => Guard: need at least $0.50
    }
    return event === "cancel"; // => Cancel always allowed
  }
 
  handle(event: string, context: VendingMachine): void {
    // => Event handler: main FSM dispatch method
    if (event === "selectItem" && this.canTransition(event, context)) {
      // => Event type guard condition
      // => Logical AND: both conditions must be true
      // => Guard: validates transition possibility
      // => Returns boolean without changing state
      context.transitionTo(new DispensingState()); // => Ready → Dispensing
    } else if (event === "cancel") {
      console.log(`Refunding $${context.getBalance() / 100}`); // => Output for verification
      // => Chained method calls or nested operations
      // => Debug/audit output
      // => Log for observability
      context.resetBalance();
      context.transitionTo(new IdleState()); // => Ready → Idle (cancel)
      // => Workflow state progression
    } else {
      // => Fallback branch
      console.log("Guard failed: Insufficient balance"); // => Output for verification
      // => Debug/audit output
      // => Log for observability
    }
  }
 
  getName(): string {
    return "Ready"; // => Returns value to caller
    // => Return computed result
  }
}
 
class DispensingState implements GuardedState {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  canTransition(event: string, context: VendingMachine): boolean {
    // => Guard: validates transition possibility
    // => Returns boolean without changing state
    return event === "dispensed"; // => Only transition on dispensed
  }
 
  handle(event: string, context: VendingMachine): void {
    // => Event handler: main FSM dispatch method
    console.log("Dispensing item..."); // => Output for verification
    // => Debug/audit output
    // => Log for observability
    context.deductItemCost(50); // => Deduct $0.50
    if (this.canTransition("dispensed", context)) {
      // => Conditional branch
      // => Chained method calls or nested operations
      // => Guard: validates transition possibility
      // => Returns boolean without changing state
      context.transitionTo(new IdleState()); // => Dispensing → Idle
      // => Workflow state progression
    }
  }
 
  getName(): string {
    return "Dispensing"; // => Returns value to caller
    // => Return computed result
  }
}
 
class VendingMachine {
  // => State machine implementation class
  // => Encapsulates state + transition logic
  private state: GuardedState; // => State field: stores current FSM state privately
  // => State variable declaration
  private balance = 0; // => Balance in cents
  // => Initialized alongside FSM state
 
  constructor() {
    this.state = new IdleState(); // => State transition execution
    // => Constructor creates new object instance
    // => Create new instance
  }
 
  getBalance(): number {
    return this.balance; // => Returns value to caller
    // => Return computed result
  }
 
  addBalance(amount: number): void {
    this.balance += amount;
    // => Modify state data
    // => Update extended state data
  }
 
  deductItemCost(cost: number): void {
    this.balance -= cost;
    // => Modify state data
    // => Update extended state data
  }
 
  resetBalance(): void {
    this.balance = 0;
  }
 
  transitionTo(newState: GuardedState): void {
    console.log(`Transition: ${this.state.getName()} → ${newState.getName()}`); // => Output for verification
    // => Chained method calls or nested operations
    // => Debug/audit output
    // => Log for observability
    this.state = newState; // => State transition execution
  }
 
  handleEvent(event: string): void {
    // => Event handler: main FSM dispatch method
    this.state.handle(event, this); // => Delegate to state
  }
 
  getCurrentState(): string {
    // => Query method: read current FSM state
    return this.state.getName(); // => Returns value to caller
    // => Return current state value
  }
}
 
// Usage
const vending = new VendingMachine(); // => state: Idle, balance: $0
console.log(`Current: ${vending.getCurrentState()}`); // => Output: Current: Idle
 
vending.handleEvent("insertCoin"); // => Add $0.25 (balance: $0.25)
// => Output: Coin inserted. Balance: $0.25
console.log(`Balance: $${vending.getBalance() / 100}`); // => Output: Balance: $0.25
 
vending.handleEvent("insertCoin"); // => Add $0.25 (balance: $0.50) → Ready
// => Output: Coin inserted. Balance: $0.5
// =>         Transition: Idle → Ready
console.log(`Current: ${vending.getCurrentState()}`); // => Output: Current: Ready
 
vending.handleEvent("selectItem"); // => Ready → Dispensing (guard passes)
// => Output: Transition: Ready → Dispensing
// =>         Dispensing item...
// =>         Transition: Dispensing → Idle
console.log(`Current: ${vending.getCurrentState()}`); // => Output: Current: Idle