src/input/text-area.directive.ts
A directive for applying styling to a textarea element.
Example:
Example :<textarea cdsTextArea></textarea>See the vanilla carbon docs for more detail.
| Selector | [cdsTextArea], [ibmTextArea] |
Properties |
Inputs |
HostBindings |
Accessors |
| invalid | |
Type : boolean
|
|
Default value : false
|
|
|
Defined in src/input/text-area.directive.ts:25
|
|
| skeleton | |
Type : boolean
|
|
Default value : false
|
|
|
Defined in src/input/text-area.directive.ts:26
|
|
| theme | |
Type : "light" | "dark"
|
|
Default value : "dark"
|
|
|
Defined in src/input/text-area.directive.ts:22
|
|
| attr.data-invalid |
Type : boolean
|
|
Defined in src/input/text-area.directive.ts:31
|
| class.cds--text-area |
Type : boolean
|
Default value : true
|
|
Defined in src/input/text-area.directive.ts:24
|
| class.cds--text-area--light |
Type : boolean
|
|
Defined in src/input/text-area.directive.ts:27
|
| baseClass |
Default value : true
|
Decorators :
@HostBinding('class.cds--text-area')
|
|
Defined in src/input/text-area.directive.ts:24
|
| isLightTheme |
getisLightTheme()
|
|
Defined in src/input/text-area.directive.ts:27
|
| getInvalidAttr |
getgetInvalidAttr()
|
|
Defined in src/input/text-area.directive.ts:31
|
import { Directive, HostBinding, Input } from "@angular/core";
/**
* A directive for applying styling to a textarea element.
*
* Example:
*
* ```html
* <textarea cdsTextArea></textarea>
* ```
*
* See the [vanilla carbon docs](http://www.carbondesignsystem.com/components/text-input/code) for more detail.
*/
@Directive({
selector: "[cdsTextArea], [ibmTextArea]"
})
export class TextArea {
/**
* @deprecated since v5 - Use `cdsLayer` directive instead
* `light` or `dark` input theme
*/
@Input() theme: "light" | "dark" = "dark";
@HostBinding("class.cds--text-area") baseClass = true;
@HostBinding("class.cds--text-area--invalid") @Input() invalid = false;
@HostBinding("class.cds--skeleton") @Input() skeleton = false;
@HostBinding("class.cds--text-area--light") get isLightTheme() {
return this.theme === "light";
}
@HostBinding("attr.data-invalid") get getInvalidAttr() {
return this.invalid ? true : undefined;
}
}