@panoramax/web-viewer/docs/reference/components/layout/Tabs.md

Panoramax web viewer for geolocated pictures

<a name="Panoramax.components.layout.Tabs"></a>

## Panoramax.components.layout.Tabs ⇐ <code>[lit.LitElement](https://lit.dev/docs/api/LitElement/)</code>
**Kind**: static class of <code>Panoramax.components.layout</code>  
**Extends**: <code>[lit.LitElement](https://lit.dev/docs/api/LitElement/)</code>  
**Element**: pnx-tabs  
**Slot**: `title` A single tab name  
**Slot**: `content` A single tab content  

* [.Tabs](#Panoramax.components.layout.Tabs) ⇐ <code>[lit.LitElement](https://lit.dev/docs/api/LitElement/)</code>
    * [new Tabs()](#new_Panoramax.components.layout.Tabs_new)
    * [.properties](#Panoramax.components.layout.Tabs+properties) : <code>Object</code>

<a name="new_Panoramax.components.layout.Tabs_new"></a>

### new Tabs()
Tabs offers a nice paged content rendering based on tabs buttons.
The list of tab names are passed through `title` slots, and content using `content` slots.
Note that tab names and contents should respect a coherent order.

**Example**  
```html
<pnx-tabs>
  <h4 slot="title">Tab 1</h4>
  <div slot="content">Tab 1 content</div>

  <h4 slot="title">Tab 2</h4>
  <div slot="content">Tab 2 content</div>

  <h4 slot="title">Tab 3</h4>
  <div slot="content">Tab 3 content</div>
</pnx-tabs>
```
<a name="Panoramax.components.layout.Tabs+properties"></a>

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

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

| Name | Type | Default | Description |
| --- | --- | --- | --- |
| [activeTabIndex] | <code>string</code> | <code>0</code> | The selected tab index |
| [hideNav] | <code>boolean</code> | <code>false</code> | Hide nav |