carbon-components-angular
Version:
Next generation components
94 lines • 8.3 kB
JavaScript
import { Directive, HostBinding, Input } from "@angular/core";
import * as i0 from "@angular/core";
/**
* Applies Carbon aspect ratio box classes (`cds--aspect-ratio`) to the host element.
*
* ```html
* <div cdsAspectRatio ratio="16x9">...</div>
* ```
*
* ```typescript
* import { AspectRatioModule } from 'carbon-components-angular';
* ```
*/
export class AspectRatioDirective {
constructor() {
/**
* Set aspect ratio
*/
this.ratio = "1x1";
// Set base class
this.aspectRatioBase = true;
}
/**
* Set ratio class based on `ratio` input
*/
get ratio1x1() {
return this.ratio === "1x1";
}
get ratio2x3() {
return this.ratio === "2x3";
}
get ratio3x2() {
return this.ratio === "3x2";
}
get ratio3x4() {
return this.ratio === "3x4";
}
get ratio4x3() {
return this.ratio === "4x3";
}
get ratio1x2() {
return this.ratio === "1x2";
}
get ratio2x1() {
return this.ratio === "2x1";
}
get ratio9x16() {
return this.ratio === "9x16";
}
get ratio16x9() {
return this.ratio === "16x9";
}
}
AspectRatioDirective.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AspectRatioDirective, deps: [], target: i0.ɵɵFactoryTarget.Directive });
AspectRatioDirective.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "14.3.0", type: AspectRatioDirective, selector: "[cdsAspectRatio], [ibmAspectRatio]", inputs: { ratio: "ratio" }, host: { properties: { "class.cds--aspect-ratio": "this.aspectRatioBase", "class.cds--aspect-ratio--1x1": "this.ratio1x1", "class.cds--aspect-ratio--2x3": "this.ratio2x3", "class.cds--aspect-ratio--3x2": "this.ratio3x2", "class.cds--aspect-ratio--3x4": "this.ratio3x4", "class.cds--aspect-ratio--4x3": "this.ratio4x3", "class.cds--aspect-ratio--1x2": "this.ratio1x2", "class.cds--aspect-ratio--2x1": "this.ratio2x1", "class.cds--aspect-ratio--9x16": "this.ratio9x16", "class.cds--aspect-ratio--16x9": "this.ratio16x9" } }, ngImport: i0 });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: AspectRatioDirective, decorators: [{
type: Directive,
args: [{
selector: "[cdsAspectRatio], [ibmAspectRatio]"
}]
}], propDecorators: { ratio: [{
type: Input
}], aspectRatioBase: [{
type: HostBinding,
args: ["class.cds--aspect-ratio"]
}], ratio1x1: [{
type: HostBinding,
args: ["class.cds--aspect-ratio--1x1"]
}], ratio2x3: [{
type: HostBinding,
args: ["class.cds--aspect-ratio--2x3"]
}], ratio3x2: [{
type: HostBinding,
args: ["class.cds--aspect-ratio--3x2"]
}], ratio3x4: [{
type: HostBinding,
args: ["class.cds--aspect-ratio--3x4"]
}], ratio4x3: [{
type: HostBinding,
args: ["class.cds--aspect-ratio--4x3"]
}], ratio1x2: [{
type: HostBinding,
args: ["class.cds--aspect-ratio--1x2"]
}], ratio2x1: [{
type: HostBinding,
args: ["class.cds--aspect-ratio--2x1"]
}], ratio9x16: [{
type: HostBinding,
args: ["class.cds--aspect-ratio--9x16"]
}], ratio16x9: [{
type: HostBinding,
args: ["class.cds--aspect-ratio--16x9"]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYXNwZWN0LXJhdGlvLmRpcmVjdGl2ZS5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9hc3BlY3QtcmF0aW8vYXNwZWN0LXJhdGlvLmRpcmVjdGl2ZS50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSxLQUFLLEVBQUUsTUFBTSxlQUFlLENBQUM7O0FBYTlEOzs7Ozs7Ozs7O0dBVUc7QUFJSCxNQUFNLE9BQU8sb0JBQW9CO0lBSGpDO1FBSUM7O1dBRUc7UUFDTSxVQUFLLEdBQXFCLEtBQUssQ0FBQztRQUV6QyxpQkFBaUI7UUFDZ0Msb0JBQWUsR0FBRyxJQUFJLENBQUM7S0FnQ3hFO0lBOUJBOztPQUVHO0lBQ0gsSUFBaUQsUUFBUTtRQUN4RCxPQUFPLElBQUksQ0FBQyxLQUFLLEtBQUssS0FBSyxDQUFDO0lBQzdCLENBQUM7SUFDRCxJQUFpRCxRQUFRO1FBQ3hELE9BQU8sSUFBSSxDQUFDLEtBQUssS0FBSyxLQUFLLENBQUM7SUFDN0IsQ0FBQztJQUNELElBQWlELFFBQVE7UUFDeEQsT0FBTyxJQUFJLENBQUMsS0FBSyxLQUFLLEtBQUssQ0FBQztJQUM3QixDQUFDO0lBQ0QsSUFBaUQsUUFBUTtRQUN4RCxPQUFPLElBQUksQ0FBQyxLQUFLLEtBQUssS0FBSyxDQUFDO0lBQzdCLENBQUM7SUFDRCxJQUFpRCxRQUFRO1FBQ3hELE9BQU8sSUFBSSxDQUFDLEtBQUssS0FBSyxLQUFLLENBQUM7SUFDN0IsQ0FBQztJQUNELElBQWlELFFBQVE7UUFDeEQsT0FBTyxJQUFJLENBQUMsS0FBSyxLQUFLLEtBQUssQ0FBQztJQUM3QixDQUFDO0lBQ0QsSUFBaUQsUUFBUTtRQUN4RCxPQUFPLElBQUksQ0FBQyxLQUFLLEtBQUssS0FBSyxDQUFDO0lBQzdCLENBQUM7SUFDRCxJQUFrRCxTQUFTO1FBQzFELE9BQU8sSUFBSSxDQUFDLEtBQUssS0FBSyxNQUFNLENBQUM7SUFDOUIsQ0FBQztJQUNELElBQWtELFNBQVM7UUFDMUQsT0FBTyxJQUFJLENBQUMsS0FBSyxLQUFLLE1BQU0sQ0FBQztJQUM5QixDQUFDOztpSEF0Q1csb0JBQW9CO3FHQUFwQixvQkFBb0I7MkZBQXBCLG9CQUFvQjtrQkFIaEMsU0FBUzttQkFBQztvQkFDVixRQUFRLEVBQUUsb0NBQW9DO2lCQUM5Qzs4QkFLUyxLQUFLO3NCQUFiLEtBQUs7Z0JBRzJDLGVBQWU7c0JBQS9ELFdBQVc7dUJBQUMseUJBQXlCO2dCQUtXLFFBQVE7c0JBQXhELFdBQVc7dUJBQUMsOEJBQThCO2dCQUdNLFFBQVE7c0JBQXhELFdBQVc7dUJBQUMsOEJBQThCO2dCQUdNLFFBQVE7c0JBQXhELFdBQVc7dUJBQUMsOEJBQThCO2dCQUdNLFFBQVE7c0JBQXhELFdBQVc7dUJBQUMsOEJBQThCO2dCQUdNLFFBQVE7c0JBQXhELFdBQVc7dUJBQUMsOEJBQThCO2dCQUdNLFFBQVE7c0JBQXhELFdBQVc7dUJBQUMsOEJBQThCO2dCQUdNLFFBQVE7c0JBQXhELFdBQVc7dUJBQUMsOEJBQThCO2dCQUdPLFNBQVM7c0JBQTFELFdBQVc7dUJBQUMsK0JBQStCO2dCQUdNLFNBQVM7c0JBQTFELFdBQVc7dUJBQUMsK0JBQStCIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgRGlyZWN0aXZlLCBIb3N0QmluZGluZywgSW5wdXQgfSBmcm9tIFwiQGFuZ3VsYXIvY29yZVwiO1xyXG5cclxuZXhwb3J0IHR5cGUgQXNwZWN0UmF0aW9WYWx1ZSA9XHJcblx0fCBcIjF4MVwiXHJcblx0fCBcIjJ4M1wiXHJcblx0fCBcIjN4MlwiXHJcblx0fCBcIjN4NFwiXHJcblx0fCBcIjR4M1wiXHJcblx0fCBcIjF4MlwiXHJcblx0fCBcIjJ4MVwiXHJcblx0fCBcIjl4MTZcIlxyXG5cdHwgXCIxNng5XCI7XHJcblxyXG4vKipcclxuICogQXBwbGllcyBDYXJib24gYXNwZWN0IHJhdGlvIGJveCBjbGFzc2VzIChgY2RzLS1hc3BlY3QtcmF0aW9gKSB0byB0aGUgaG9zdCBlbGVtZW50LlxyXG4gKlxyXG4gKiBgYGBodG1sXHJcbiAqIDxkaXYgY2RzQXNwZWN0UmF0aW8gcmF0aW89XCIxNng5XCI+Li4uPC9kaXY+XHJcbiAqIGBgYFxyXG4gKlxyXG4gKiBgYGB0eXBlc2NyaXB0XHJcbiAqIGltcG9ydCB7IEFzcGVjdFJhdGlvTW9kdWxlIH0gZnJvbSAnY2FyYm9uLWNvbXBvbmVudHMtYW5ndWxhcic7XHJcbiAqIGBgYFxyXG4gKi9cclxuQERpcmVjdGl2ZSh7XHJcblx0c2VsZWN0b3I6IFwiW2Nkc0FzcGVjdFJhdGlvXSwgW2libUFzcGVjdFJhdGlvXVwiXHJcbn0pXHJcbmV4cG9ydCBjbGFzcyBBc3BlY3RSYXRpb0RpcmVjdGl2ZSB7XHJcblx0LyoqXHJcblx0ICogU2V0IGFzcGVjdCByYXRpb1xyXG5cdCAqL1xyXG5cdEBJbnB1dCgpIHJhdGlvOiBBc3BlY3RSYXRpb1ZhbHVlID0gXCIxeDFcIjtcclxuXHJcblx0Ly8gU2V0IGJhc2UgY2xhc3NcclxuXHRASG9zdEJpbmRpbmcoXCJjbGFzcy5jZHMtLWFzcGVjdC1yYXRpb1wiKSByZWFkb25seSBhc3BlY3RSYXRpb0Jhc2UgPSB0cnVlO1xyXG5cclxuXHQvKipcclxuXHQgKiBTZXQgcmF0aW8gY2xhc3MgYmFzZWQgb24gYHJhdGlvYCBpbnB1dFxyXG5cdCAqL1xyXG5cdEBIb3N0QmluZGluZyhcImNsYXNzLmNkcy0tYXNwZWN0LXJhdGlvLS0xeDFcIikgZ2V0IHJhdGlvMXgxKCkge1xyXG5cdFx0cmV0dXJuIHRoaXMucmF0aW8gPT09IFwiMXgxXCI7XHJcblx0fVxyXG5cdEBIb3N0QmluZGluZyhcImNsYXNzLmNkcy0tYXNwZWN0LXJhdGlvLS0yeDNcIikgZ2V0IHJhdGlvMngzKCkge1xyXG5cdFx0cmV0dXJuIHRoaXMucmF0aW8gPT09IFwiMngzXCI7XHJcblx0fVxyXG5cdEBIb3N0QmluZGluZyhcImNsYXNzLmNkcy0tYXNwZWN0LXJhdGlvLS0zeDJcIikgZ2V0IHJhdGlvM3gyKCkge1xyXG5cdFx0cmV0dXJuIHRoaXMucmF0aW8gPT09IFwiM3gyXCI7XHJcblx0fVxyXG5cdEBIb3N0QmluZGluZyhcImNsYXNzLmNkcy0tYXNwZWN0LXJhdGlvLS0zeDRcIikgZ2V0IHJhdGlvM3g0KCkge1xyXG5cdFx0cmV0dXJuIHRoaXMucmF0aW8gPT09IFwiM3g0XCI7XHJcblx0fVxyXG5cdEBIb3N0QmluZGluZyhcImNsYXNzLmNkcy0tYXNwZWN0LXJhdGlvLS00eDNcIikgZ2V0IHJhdGlvNHgzKCkge1xyXG5cdFx0cmV0dXJuIHRoaXMucmF0aW8gPT09IFwiNHgzXCI7XHJcblx0fVxyXG5cdEBIb3N0QmluZGluZyhcImNsYXNzLmNkcy0tYXNwZWN0LXJhdGlvLS0xeDJcIikgZ2V0IHJhdGlvMXgyKCkge1xyXG5cdFx0cmV0dXJuIHRoaXMucmF0aW8gPT09IFwiMXgyXCI7XHJcblx0fVxyXG5cdEBIb3N0QmluZGluZyhcImNsYXNzLmNkcy0tYXNwZWN0LXJhdGlvLS0yeDFcIikgZ2V0IHJhdGlvMngxKCkge1xyXG5cdFx0cmV0dXJuIHRoaXMucmF0aW8gPT09IFwiMngxXCI7XHJcblx0fVxyXG5cdEBIb3N0QmluZGluZyhcImNsYXNzLmNkcy0tYXNwZWN0LXJhdGlvLS05eDE2XCIpIGdldCByYXRpbzl4MTYoKSB7XHJcblx0XHRyZXR1cm4gdGhpcy5yYXRpbyA9PT0gXCI5eDE2XCI7XHJcblx0fVxyXG5cdEBIb3N0QmluZGluZyhcImNsYXNzLmNkcy0tYXNwZWN0LXJhdGlvLS0xNng5XCIpIGdldCByYXRpbzE2eDkoKSB7XHJcblx0XHRyZXR1cm4gdGhpcy5yYXRpbyA9PT0gXCIxNng5XCI7XHJcblx0fVxyXG59XHJcbiJdfQ==