Usage

Shows additional information about a map marker in a pop-up.

Rules

• Keep the pop-up visible within the map viewport. Its position may change to the left, below or to the right when the map is moved.
• On small screens, show the content in a box at the bottom of the screen, like a sidebar or card. The box has no fixed height.
• Provide a close button in the upper-right corner.
• If a marker has several pieces of information, show them vertically. Increase the pop-up height as needed or use pagination.

Variants

The component has the following variants:

• Mode: light/dark
• Breakpoint: desktop/mobile
• Position: left/bottom/right

Right

Left

Bottom

Mobile