# td-tab-select
`td-tab-select` element generates a tab group component that behaves like a `mat-select`.
## API Summary
#### Inputs
+ value?: any
+ Sets the value of the component.
+ disabled?: boolean
+ Sets disabled state of the component.
+ disabledRipple?: boolean
+ Disables ripple effect on component.
+ stretchTabs?: boolean
+ Makes the tabs stretch to fit the parent container.
+ color?: ThemePalette
+ Color of the tab group.
+ backgroundColor?: ThemePalette
+ Background color of the tab group.
#### Events
+ valueChange: function(value: any)
+ Event that emits whenever the raw value of the select changes.
+ This is here primarily to facilitate the two-way binding for the `value` input.
# td-tab-option
`td-tab-option` element generates a tab component to which a value can be binded to.
## API Summary
#### Inputs
+ value?: any
+ Bind a value to the component.
+ disabled?: boolean
+ Sets disabled state of the component.
## Setup
Import the [CovalentTabSelectModule] in your NgModule:
```typescript
import { CovalentTabSelectModule } from '@covalent/core/tab-select';
@NgModule({
imports: [
CovalentTabSelectModule,
...
],
...
})
export class MyModule {}
```
## Usage
Example without forms:
```html
Label 1
Label 2
Label 3
```
Example with forms:
```html
Label 1
Label 2
Label 3
```
Example with all inputs/outputs:
```html
Label 1
Label 2
Label 3
```