// IMPORTANT — import order is load-bearing:
// 1. temporal-polyfill/global must register Temporal on globalThis BEFORE any
//    Schedule-X code runs (Schedule-X v4 uses Temporal objects at module init).
// 2. Schedule-X theme-default CSS must be imported BEFORE tokens.css so that
//    the project's --sx-color-* overrides in tokens.css win the cascade.
// 3. styles/index.css imports tokens.css which carries the --sx-color-* overrides.
import 'temporal-polyfill/global'
import '@schedule-x/theme-default/dist/index.css'
import './styles/index.css'

import React from 'react'
import ReactDOM from 'react-dom/client'
import { QueryClient, QueryClientProvider } from '@tanstack/react-query'
import App from './App.js'
import { ErrorBoundary } from './components/ErrorBoundary.js'

const queryClient = new QueryClient({
  defaultOptions: {
    queries: {
      retry: 1,
      staleTime: 30_000,
    },
  },
})

ReactDOM.createRoot(document.getElementById('root')!).render(
  <React.StrictMode>
    <QueryClientProvider client={queryClient}>
      <ErrorBoundary>
        <App />
      </ErrorBoundary>
    </QueryClientProvider>
  </React.StrictMode>,
)
