A deprecated modal component system providing an accessible, composable modal dialog with scroll locking, keyboard handling, and overlay dismissal. All exports are superseded by `ModalV2` from `./modal-v2`. What remains here is the compact legacy dialog used by the confirm modals that have not moved yet. ## Key Components | Export | Description | |---|---| | `Modal` | Root container — handles overlay, Escape key, scroll lock, and `role="dialog"` | | `ModalHeader` | Top section with bottom border, meant to hold a title | | `ModalTitle` | Styled `

` for the dialog heading | | `ModalContent` | Scrollable body area (`overflow-y-auto`) | | `ModalFooter` | Bottom action row, right-aligned with gap | All components use `React.forwardRef` and accept an optional `className` for Tailwind overrides. ## Removed exports There is no sizing or two-column layout here any more. `size` / `MODAL_SIZE_CLASSES` and the `TWO_COLUMN_MODAL_BODY_CLASS` / `TWO_COLUMN_MODAL_GRID_CLASS` / `TWO_COLUMN_MODAL_COLUMN_CLASS` class-string constants were removed once `ModalV2` gained a `size` prop and `ModalV2TwoColumn` — the class strings were copied per call site and drifted, so a component owns the scroll model instead. Width on this legacy dialog is a plain `className` override; anything that needs a size variant or a two-column body belongs on `ModalV2`. ## Usage Example > ⚠️ Deprecated. Use [`ModalV2`](https://github.com/flamingo-stack/openframe-oss-lib/blob/main/src/components/modal-v2.tsx) instead. ```typescript import { Modal, ModalHeader, ModalTitle, ModalContent, ModalFooter } from "./modal" function Example() { const [open, setOpen] = React.useState(false) return ( setOpen(false)}> Confirm Action Are you sure you want to proceed? ) } ``` ## Behavior Notes - Scroll lock — uses `usePreventScroll` from `@react-aria/overlays`; ref-counted, safely restores prior body styles on close - Escape key — document-level listener added only while open; cleaned up on close or unmount - Overlay click — clicking the backdrop calls `onClose`; the dialog itself is `z-10` above the `bg-ods-overlay` backdrop - Max dimensions — constrained to `max-w-md` width and `max-h-[90vh]` height; `ModalContent` scrolls independently