## `<w-tabs>` API

Unless otherwise noted all properties are HTML attributes (as opposed to JavaScript object properties).

### Properties

| Name | Type | Default | Summary |
|-|-|-|-|
| active | `string \| undefined` | `"" (Shows the first tab)` | The `id` of the panel that should be active. |

### Property Details

#### active

The `id` of the panel that should be active.

- Type: `string | undefined`
- Default: `"" (Shows the first tab)`

### Events

#### change

Includes `details.panelId` with the now active tab panel's ID

- Type: [`WarpTabsChangeEvent`](#warptabschangeevent)


### Types

#### WarpTabsChangeEvent

`{ detail: { panelId: string }, initCustomEvent: {  }, bubbles: false | true, cancelBubble: false | true, cancelable: false | true, composed: false | true, currentTarget: null | { addEventListener: {  }, dispatchEvent: {  }, removeEventListener: {  } }, defaultPrevented: false | true, eventPhase: number, isTrusted: false | true, returnValue: false | true, srcElement: null | { addEventListener: {  }, dispatchEvent: {  }, removeEventListener: {  } }, target: null | { addEventListener: {  }, dispatchEvent: {  }, removeEventListener: {  } }, timeStamp: number, type: string, composedPath: {  }, initEvent: {  }, preventDefault: {  }, stopImmediatePropagation: {  }, stopPropagation: {  }, NONE: 0, CAPTURING_PHASE: 1, AT_TARGET: 2, BUBBLING_PHASE: 3 }`