https://framer.com/m/PopupMsg-VpMR8M.js
Io / Enhancements / PopupMessage
PopupMessage
PopupMessage takes a layer you have designed and shows it as a modal over the page, handling the overlay, the scroll lock and the close button around it.
Examples
Live specimens for every control the component exposes.
Setup
The modal’s content is a layer slot, dropped in on the canvas — the specimen here is empty for that reason, rather than showing a fake dialogue. Everything around the content is configured in the groups below.
Overlay
showOverlay draws the scrim behind the modal and overlayColor sets it. blockScroll stops the page moving underneath while the modal is open.
overlay on
overlay off
scroll allowed
Props
The controls exposed on the instance panel.
Usage
Guidance carried over from the component definition.
Reach for PopupMessage
A designed layer should appear as a modal without rebuilding the plumbing.
The page must not scroll while the modal is open.
The overlay and close button should match the site.
The same modal is reused from more than one trigger.
Reach for something else
The panel should slide in from an edge — use DrawerX.
The message is a small hint next to a control — use TooltipX.
The content needs its own route rather than a modal.
Io — Enhancements
Every specimen above is a live component instance. Colour, type and radius resolve from the project theme tokens.