import React from 'react';
import ReactDOM from 'react-dom/client';
import { BrowserRouter } from 'react-router';
import App from './App';
import './styles/globals.css';

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

// Signal that the app has painted — the canvas animation in widget.js
// will trigger the melt → travel → reform transition to bubble mode.
requestAnimationFrame(() => requestAnimationFrame(() => {
  (window as any).__blobyAppReady = true;
  window.dispatchEvent(new Event('bloby:app-ready'));
}));