# gds-tab

**Class**: `GdsTab`

**Tag**: `<gds-tab>`


## Properties

| Name | Type | Default | Description |
|------|------|---------|-------------|
| `size` | `'small' \| 'medium'` | `-` | Optional size variant. When set to "small", applies reduced padding. |
| `disabled` | `boolean` | `-` | Disables selection of this tab. |
| `selected` | `boolean` | `-` | Whether this tab is currently selected. Managed by the parent `<gds-tabs>`. |
| `panel` | `string` | `-` | The `name` of the `<gds-tab-panel>` to associate with this tab. When set, this tab controls the panel whose `name` attribute matches, regardless of DOM order. When omitted, pairing falls back to position. |
| `syncFirstRender` | `boolean` | `-` | Force the element to perform a synchronous first render and apply style expression properties in `connectedCallback`.  This guarantees that the child DOM always remains projected in DOM, since the element will attach the shadowRoot and run the first render pass in the same event loop cycle, and that declarative layout will be applied once slotted DOM is projected.  Note: This will cause the first render pass to be blocking. Use sparingly and only when necessary, such as when the element needs to be measured synchronously after being added to the DOM. |


## Events

| Name | Type | Description |
|------|------|-------------|
| `click` | `MouseEvent` | Fired when the tab is clicked. Note that clicks on disabled tabs are ignored. |


## Slots

| Name | Description |
|------|-------------|
| `lead` | Optional content before the label (e.g. an icon) |
| `(default)` | The tab label text content |
| `trail` | Optional content after the label (e.g. a badge) |