import { StateNode, TLEventHandlers } from 'tldraw'

/** Idle-State: Wartet auf den ersten Klick zum Zeichnen. */
export class PolylinieIdle extends StateNode {
  static override id = 'idle'

  override onEnter() {
    this.editor.setCursor({ type: 'cross', rotation: 0 })
    document.querySelector('.tl-container')?.classList.add('polylinie-active')
  }

  override onExit() {
    // Hintergrund nur entfernen wenn wir nicht in den Drawing-State wechseln
  }

  override onPointerDown: TLEventHandlers['onPointerDown'] = () => {
    this.parent.transition('drawing')
  }

  override onCancel: TLEventHandlers['onCancel'] = () => {
    document.querySelector('.tl-container')?.classList.remove('polylinie-active')
    this.editor.setCurrentTool('select')
  }

  override onKeyDown: TLEventHandlers['onKeyDown'] = (info) => {
    if (info.key === 'Escape') {
      this.onCancel({} as never)
    }
  }
}
