carbon-components-angular
Version:
Next generation components
53 lines • 5.37 kB
JavaScript
import { Component, HostBinding, ViewChild } from "@angular/core";
import * as i0 from "@angular/core";
import * as i1 from "@angular/common";
/**
* [See demo](../../?path=/story/components-popover--basic)
*/
export class PopoverContent {
constructor(changeDetectorRef) {
this.changeDetectorRef = changeDetectorRef;
this.popoverClass = true;
this.autoAlign = false;
}
ngAfterViewInit() {
if (this.popoverContent) {
// Check we are in a popover with autoAlign enabled
this.autoAlign = !!this.popoverContent.nativeElement.closest(".cds--popover--auto-align");
// Run change detection manually to resolve ExpressionHasChanged
this.changeDetectorRef.detectChanges();
}
}
}
PopoverContent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PopoverContent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component });
PopoverContent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "14.3.0", type: PopoverContent, selector: "cds-popover-content, ibm-popover-content", host: { properties: { "class.cds--popover": "this.popoverClass" } }, viewQueries: [{ propertyName: "popoverContent", first: true, predicate: ["content"], descendants: true }], ngImport: i0, template: `
<span class="cds--popover-content" #content>
<div>
<ng-content></ng-content>
</div>
<span *ngIf="autoAlign" class="cds--popover-caret cds--popover--auto-align"></span>
</span>
<span *ngIf="!autoAlign" class="cds--popover-caret"></span>
`, isInline: true, dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "14.3.0", ngImport: i0, type: PopoverContent, decorators: [{
type: Component,
args: [{
selector: "cds-popover-content, ibm-popover-content",
template: `
<span class="cds--popover-content" #content>
<div>
<ng-content></ng-content>
</div>
<span *ngIf="autoAlign" class="cds--popover-caret cds--popover--auto-align"></span>
</span>
<span *ngIf="!autoAlign" class="cds--popover-caret"></span>
`
}]
}], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { popoverClass: [{
type: HostBinding,
args: ["class.cds--popover"]
}], popoverContent: [{
type: ViewChild,
args: ["content"]
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoicG9wb3Zlci1jb250ZW50LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uL3NyYy9wb3BvdmVyL3BvcG92ZXItY29udGVudC5jb21wb25lbnQudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUNOLFNBQVMsRUFDVCxXQUFXLEVBQ1gsU0FBUyxFQUlULE1BQU0sZUFBZSxDQUFDOzs7QUFFdkI7O0dBRUc7QUFhSCxNQUFNLE9BQU8sY0FBYztJQUsxQixZQUFvQixpQkFBb0M7UUFBcEMsc0JBQWlCLEdBQWpCLGlCQUFpQixDQUFtQjtRQUpyQixpQkFBWSxHQUFHLElBQUksQ0FBQztRQUV2RCxjQUFTLEdBQUcsS0FBSyxDQUFDO0lBRXlDLENBQUM7SUFFNUQsZUFBZTtRQUNkLElBQUksSUFBSSxDQUFDLGNBQWMsRUFBRTtZQUN4QixtREFBbUQ7WUFDbkQsSUFBSSxDQUFDLFNBQVMsR0FBRyxDQUFDLENBQUMsSUFBSSxDQUFDLGNBQWMsQ0FBQyxhQUFhLENBQUMsT0FBTyxDQUFDLDJCQUEyQixDQUFDLENBQUM7WUFDMUYsZ0VBQWdFO1lBQ2hFLElBQUksQ0FBQyxpQkFBaUIsQ0FBQyxhQUFhLEVBQUUsQ0FBQztTQUN2QztJQUNGLENBQUM7OzJHQWRXLGNBQWM7K0ZBQWQsY0FBYyxnUUFWaEI7Ozs7Ozs7O0VBUVQ7MkZBRVcsY0FBYztrQkFaMUIsU0FBUzttQkFBQztvQkFDVixRQUFRLEVBQUUsMENBQTBDO29CQUNwRCxRQUFRLEVBQUU7Ozs7Ozs7O0VBUVQ7aUJBQ0Q7d0dBRW1DLFlBQVk7c0JBQTlDLFdBQVc7dUJBQUMsb0JBQW9CO2dCQUNYLGNBQWM7c0JBQW5DLFNBQVM7dUJBQUMsU0FBUyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7XG5cdENvbXBvbmVudCxcblx0SG9zdEJpbmRpbmcsXG5cdFZpZXdDaGlsZCxcblx0RWxlbWVudFJlZixcblx0QWZ0ZXJWaWV3SW5pdCxcblx0Q2hhbmdlRGV0ZWN0b3JSZWZcbn0gZnJvbSBcIkBhbmd1bGFyL2NvcmVcIjtcblxuLyoqXG4gKiBbU2VlIGRlbW9dKC4uLy4uLz9wYXRoPS9zdG9yeS9jb21wb25lbnRzLXBvcG92ZXItLWJhc2ljKVxuICovXG5AQ29tcG9uZW50KHtcblx0c2VsZWN0b3I6IFwiY2RzLXBvcG92ZXItY29udGVudCwgaWJtLXBvcG92ZXItY29udGVudFwiLFxuXHR0ZW1wbGF0ZTogYFxuXHRcdDxzcGFuIGNsYXNzPVwiY2RzLS1wb3BvdmVyLWNvbnRlbnRcIiAjY29udGVudD5cblx0XHRcdDxkaXY+XG5cdFx0XHRcdDxuZy1jb250ZW50PjwvbmctY29udGVudD5cblx0XHRcdDwvZGl2PlxuXHRcdFx0PHNwYW4gKm5nSWY9XCJhdXRvQWxpZ25cIiBjbGFzcz1cImNkcy0tcG9wb3Zlci1jYXJldCBjZHMtLXBvcG92ZXItLWF1dG8tYWxpZ25cIj48L3NwYW4+XG5cdFx0PC9zcGFuPlxuXHRcdDxzcGFuICpuZ0lmPVwiIWF1dG9BbGlnblwiIGNsYXNzPVwiY2RzLS1wb3BvdmVyLWNhcmV0XCI+PC9zcGFuPlxuXHRgXG59KVxuZXhwb3J0IGNsYXNzIFBvcG92ZXJDb250ZW50IGltcGxlbWVudHMgQWZ0ZXJWaWV3SW5pdCB7XG5cdEBIb3N0QmluZGluZyhcImNsYXNzLmNkcy0tcG9wb3ZlclwiKSBwb3BvdmVyQ2xhc3MgPSB0cnVlO1xuXHRAVmlld0NoaWxkKFwiY29udGVudFwiKSBwb3BvdmVyQ29udGVudDogRWxlbWVudFJlZjtcblx0YXV0b0FsaWduID0gZmFsc2U7XG5cblx0Y29uc3RydWN0b3IocHJpdmF0ZSBjaGFuZ2VEZXRlY3RvclJlZjogQ2hhbmdlRGV0ZWN0b3JSZWYpIHt9XG5cblx0bmdBZnRlclZpZXdJbml0KCk6IHZvaWQge1xuXHRcdGlmICh0aGlzLnBvcG92ZXJDb250ZW50KSB7XG5cdFx0XHQvLyBDaGVjayB3ZSBhcmUgaW4gYSBwb3BvdmVyIHdpdGggYXV0b0FsaWduIGVuYWJsZWRcblx0XHRcdHRoaXMuYXV0b0FsaWduID0gISF0aGlzLnBvcG92ZXJDb250ZW50Lm5hdGl2ZUVsZW1lbnQuY2xvc2VzdChcIi5jZHMtLXBvcG92ZXItLWF1dG8tYWxpZ25cIik7XG5cdFx0XHQvLyBSdW4gY2hhbmdlIGRldGVjdGlvbiBtYW51YWxseSB0byByZXNvbHZlIEV4cHJlc3Npb25IYXNDaGFuZ2VkXG5cdFx0XHR0aGlzLmNoYW5nZURldGVjdG9yUmVmLmRldGVjdENoYW5nZXMoKTtcblx0XHR9XG5cdH1cbn1cbiJdfQ==