# Tab

### Uso

{% code title="" %}

```html
<cat-toolbar [config]="getToolbarInfo()"></cat-toolbar>

<cat-tab-group>
  <cat-tab label="First">Content 1</cat-tab>
  <cat-tab label="Second">Content 2</cat-tab>
  <cat-tab label="Third">Content 3</cat-tab>
</cat-tab-group>
```

{% endcode %}

{% code title="" lineNumbers="true" %}

```typescript
import { Component } from '@angular/core';
import { CatComponentBase } from '@catrx/ui/common';

@Component({
  templateUrl: './page-tab.component.html'
})
export class PageTabComponent extends CatComponentBase { }
```

{% endcode %}

{% code title="" lineNumbers="true" %}

```typescript
import { NgModule } from '@angular/core';
import { CatTabModule } from '@catrx/ui/tab';
import { CatToolbarModule } from '@catrx/ui/toolbar';
import { PageTabComponent } from './page-tab.component';
import { PageTabRoutingModule } from './page-tab.routing.module';

@NgModule({
  declarations: [PageTabComponent],
  imports: [CatToolbarModule, CatTabModule, PageTabRoutingModule],
})
export class PageTabModule {}
```

{% endcode %}

### Overview

{% embed url="<https://cat-ui.igordrangel.com.br/components/tab>" %}