Урок 21. Старый vs Новый: самописный модал и примитив

❌ «Тридцать строк» — и десяток проблем

function Modal({ open, onClose, children }) {
  if (!open) return null
  return (
    <div className="fixed inset-0 z-50 bg-black/50" onClick={onClose}>
      <div className="mx-auto mt-24 max-w-sm rounded-xl bg-white p-4"
           onClick={(e) => e.stopPropagation()}>
        {children}
      </div>
    </div>
  )
}

Чего здесь нет: фокус не переходит внутрь, Tab уходит на страницу под окном, Esc не работает, страница прокручивается, скринридер не знает, что открыт диалог, после закрытия фокус теряется, окно обрежется, если родитель с overflow-hidden.