@panoramax/web-viewer/docs/reference/components/ui/Popup.md

Panoramax web viewer for geolocated pictures

<a name="Panoramax.components.ui.Popup"></a>

## Panoramax.components.ui.Popup ⇐ <code>[lit.LitElement](https://lit.dev/docs/api/LitElement/)</code>
**Kind**: static class of <code>Panoramax.components.ui</code>  
**Extends**: <code>[lit.LitElement](https://lit.dev/docs/api/LitElement/)</code>  
**Emits**: [<code>open</code>](#Panoramax.components.ui.Popup+event_open), [<code>close</code>](#Panoramax.components.ui.Popup+event_close)  
**Element**: pnx-popup  

* [.Popup](#Panoramax.components.ui.Popup) ⇐ <code>[lit.LitElement](https://lit.dev/docs/api/LitElement/)</code>
    * [new Popup()](#new_Panoramax.components.ui.Popup_new)
    * [.properties](#Panoramax.components.ui.Popup+properties) : <code>Object</code>
    * [.close()](#Panoramax.components.ui.Popup+close)
    * ["open"](#Panoramax.components.ui.Popup+event_open)
    * ["close"](#Panoramax.components.ui.Popup+event_close)

<a name="new_Panoramax.components.ui.Popup_new"></a>

### new Popup()
Popup Element displays a full overlay container.

**Example**  
```html
<pnx-popup @close=${() => alert("closed")}>
   <h3>Popup content</h3>
</pnx-popup>
```
<a name="Panoramax.components.ui.Popup+properties"></a>

### popup.properties : <code>Object</code>
Component properties.

**Kind**: instance property of [<code>Popup</code>](#Panoramax.components.ui.Popup)  
**Properties**

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| [visible] | <code>boolean</code> | <code>true</code> | Is the popup visible to user ? |

<a name="Panoramax.components.ui.Popup+close"></a>

### popup.close()
Close popup

**Kind**: instance method of [<code>Popup</code>](#Panoramax.components.ui.Popup)  
<a name="Panoramax.components.ui.Popup+event_open"></a>

### "open"
Event for popup opening

**Kind**: event emitted by [<code>Popup</code>](#Panoramax.components.ui.Popup)  
<a name="Panoramax.components.ui.Popup+event_close"></a>

### "close"
Event for popup closing

**Kind**: event emitted by [<code>Popup</code>](#Panoramax.components.ui.Popup)