import React from 'react'
import ReactDOM from 'react-dom/client'
import { App } from './App'
import { useSpotlightStore } from './state/spotlightStore'

let pendingQuery = ''

const handleKeyDown = (e: KeyboardEvent) => {
  const { open } = useSpotlightStore.getState()
  if (e.ctrlKey || e.metaKey || e.altKey || open) return
  
  const isCharacter = e.key.length === 1 && e.key.match(/[a-zA-Z0-9]/)
  if (isCharacter) {
    pendingQuery = e.key
    const event = new CustomEvent('spotlight-trigger', { detail: { query: pendingQuery } })
    window.dispatchEvent(event)
  }
}

window.addEventListener('keydown', handleKeyDown)

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <App />
  </React.StrictMode>
)
