// Browser verification fixture. These sample notices are never loaded by the board.
import { createRoot } from 'react-dom/client';
import type { CSSProperties } from 'react';
import '@fontsource-variable/manrope';
import '../src/styles.css';
import { AlertCard } from '../src/AlertCard';
import type { Alert } from '../src/types';
const examples: Alert[] = [
  { id: 'preview-cancellation', type: 'cancellation', routeNumbers: ['2', '12тк'], routeIds: [], title: 'Вечерние отправления отменены', message: 'Сегодня рейсы в 20:15 и 21:05 от остановки «Швейная фабрика» не выполняются. Выберите другое отправление.', startAt: null, endAt: '2026-10-09T20:59:00Z' },
  { id: 'preview-detour', type: 'detour', routeNumbers: ['6', '11'], routeIds: [], title: 'Временный объезд', message: 'Транспорт следует через улицу Калинина. Остановка «Площадь Свободы» временно не обслуживается.', startAt: null, endAt: '2026-10-10T15:00:00Z' },
  { id: 'preview-info', type: 'info', routeNumbers: [], routeIds: [], title: 'Посадка на соседней площадке', message: 'На время дорожных работ посадка перенесена на 50 метров по направлению движения.', startAt: null, endAt: null },
];
const light = new URLSearchParams(location.search).get('theme') === 'light';
createRoot(document.getElementById('root')!).render(<div className="board" data-theme={light ? 'light' : 'dark'} style={{ '--accent': light ? '#154a9c' : '#d5ff70' } as CSSProperties}><header className="board-header"><div><h1>Уведомления</h1><div className="stop-direction">Примеры оформления · тестовые данные</div></div></header><main className="scene-container"><section className="info-screen"><div className="info-notices">{examples.map(alert => <AlertCard key={alert.id} alert={alert} />)}</div></section></main></div>);