angular-bootstrap-md
Version:
Bootstrap 4 & Angular 15 UI KIT - 700+ components, MIT license, simple installation.
61 lines • 14 kB
JavaScript
import { ChangeDetectionStrategy, Component, HostBinding, Input, ViewChild, ViewEncapsulation, } from '@angular/core';
import { isBs3 } from '../utils/ng2-bootstrap-config';
import * as i0 from "@angular/core";
import * as i1 from "./tooltip.service";
export class TooltipContainerComponent {
constructor(config, elem) {
this.elem = elem;
this.containerClass = '';
this.show = !this.isBs3;
Object.assign(this, config);
}
get tooltipClasses() {
return `tooltip-fadeIn tooltip in tooltip-${this.placement} bs-tooltip-${this.placement} ${this.placement} ${this.containerClass}`;
}
get isBs3() {
return isBs3();
}
ngAfterViewInit() {
this.classMap = { in: false, fade: false };
this.classMap[this.placement] = true;
this.classMap['tooltip-' + this.placement] = true;
this.classMap.in = true;
if (this.animation) {
this.classMap.fade = true;
}
if (this.popupClass) {
this.classMap[this.popupClass] = true;
}
}
}
TooltipContainerComponent.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: TooltipContainerComponent, deps: [{ token: i1.TooltipConfig }, { token: i0.ElementRef }], target: i0.ɵɵFactoryTarget.Component });
TooltipContainerComponent.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "15.1.1", type: TooltipContainerComponent, selector: "mdb-tooltip-container", inputs: { containerClass: "containerClass" }, host: { properties: { "class.show": "this.show", "class": "this.tooltipClasses" } }, viewQueries: [{ propertyName: "tooltipInner", first: true, predicate: ["tooltipInner"], descendants: true, static: true }, { propertyName: "tooltipArrow", first: true, predicate: ["tooltipArrow"], descendants: true, static: true }], ngImport: i0, template: `
<div #tooltipArrow class="tooltip-arrow arrow"></div>
<div #tooltipInner class="tooltip-inner">
<ng-content></ng-content>
</div>
`, isInline: true, styles: ["a .tooltip{position:absolute;z-index:1070;display:block;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,Liberation Sans,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol,\"Noto Color Emoji\";font-style:normal;font-weight:400;letter-spacing:normal;line-break:auto;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;white-space:normal;word-break:normal;word-spacing:normal;font-size:.875rem;word-wrap:break-word;opacity:0}a .tooltip.show{opacity:.9}a .tooltip.tooltip-top,a .tooltip.bs-tether-element-attached-bottom{padding:.8rem 0;margin-top:0}a .tooltip.tooltip-top .tooltip-inner:before,a .tooltip.bs-tether-element-attached-bottom .tooltip-inner:before{bottom:0;left:50%;margin-left:-.8rem;content:\"\";border-width:.8rem .8rem 0}a .tooltip.tooltip-right,a .tooltip.bs-tether-element-attached-left{padding:0 .8rem;margin-left:0}a .tooltip.tooltip-right .tooltip-inner:before,a .tooltip.bs-tether-element-attached-left .tooltip-inner:before{top:50%;left:0;margin-top:-.8rem;content:\"\";border-width:.8rem .8rem .8rem 0}a .tooltip.tooltip-bottom,a .tooltip.bs-tether-element-attached-top{padding:.8rem 0;margin-top:0}a .tooltip.tooltip-bottom .tooltip-inner:before,a .tooltip.bs-tether-element-attached-top .tooltip-inner:before{top:0;left:50%;margin-left:-.8rem;content:\"\";border-width:0 .8rem .8rem}a .tooltip.tooltip-left,a .tooltip.bs-tether-element-attached-right{padding:0 .8rem;margin-left:0}a .tooltip.tooltip-left .tooltip-inner:before,a .tooltip.bs-tether-element-attached-right .tooltip-inner:before{top:50%;right:0;margin-top:-.8rem;content:\"\";border-width:.8rem 0 .8rem .8rem}.tooltip-inner{max-width:200px;padding:.25rem .5rem;text-align:center;padding:.2rem .4rem;box-shadow:0 5px 11px #0000002e,0 4px 15px #00000026;border-radius:.25rem}.tooltip-inner:before{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}@keyframes fadeInTooltip{0%{opacity:0}to{opacity:1}}.tooltip-fadeIn{animation-name:fadeInTooltip;animation-delay:.2s;animation-duration:.2s;animation-fill-mode:both}.single-tooltip{padding:.75rem 0 0}.single-tooltip a{padding:0!important}a[tooltip]{margin-left:0!important;padding:0 .5rem}.tooltip-arrow.left{position:relative;margin-right:-.6rem;transform:rotate(90deg)}.tooltip-arrow.right{position:relative;margin-left:-.6rem;transform:rotate(-90deg)}.tooltip-arrow.top{position:relative;transform:rotate(-180deg)}.tooltip-top{padding:.4rem 0}.tooltip-top .arrow{bottom:0}.tooltip-top .arrow:before{top:0;border-width:.4rem .4rem 0;border-top-color:#000}.tooltip-right{padding:0 .4rem}.tooltip-right .arrow{left:0}.tooltip-right .arrow:before{right:0;border-width:.4rem .4rem .4rem 0;border-right-color:#000}.tooltip-bottom{padding:.4rem 0}.tooltip-bottom .arrow{top:0}.tooltip-bottom .arrow:before{bottom:0;border-width:0 .4rem .4rem;border-bottom-color:#000}.tooltip-left{padding:0 .4rem}.tooltip-left .arrow{right:0}.tooltip-left .arrow:before{left:0;border-width:.4rem 0 .4rem .4rem;border-left-color:#000}\n"], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None });
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "15.1.1", ngImport: i0, type: TooltipContainerComponent, decorators: [{
type: Component,
args: [{ selector: 'mdb-tooltip-container', changeDetection: ChangeDetectionStrategy.OnPush, template: `
<div #tooltipArrow class="tooltip-arrow arrow"></div>
<div #tooltipInner class="tooltip-inner">
<ng-content></ng-content>
</div>
`, encapsulation: ViewEncapsulation.None, styles: ["a .tooltip{position:absolute;z-index:1070;display:block;font-family:-apple-system,BlinkMacSystemFont,Segoe UI,Roboto,Helvetica Neue,Arial,Noto Sans,Liberation Sans,sans-serif,\"Apple Color Emoji\",\"Segoe UI Emoji\",Segoe UI Symbol,\"Noto Color Emoji\";font-style:normal;font-weight:400;letter-spacing:normal;line-break:auto;line-height:1.5;text-align:left;text-align:start;text-decoration:none;text-shadow:none;text-transform:none;white-space:normal;word-break:normal;word-spacing:normal;font-size:.875rem;word-wrap:break-word;opacity:0}a .tooltip.show{opacity:.9}a .tooltip.tooltip-top,a .tooltip.bs-tether-element-attached-bottom{padding:.8rem 0;margin-top:0}a .tooltip.tooltip-top .tooltip-inner:before,a .tooltip.bs-tether-element-attached-bottom .tooltip-inner:before{bottom:0;left:50%;margin-left:-.8rem;content:\"\";border-width:.8rem .8rem 0}a .tooltip.tooltip-right,a .tooltip.bs-tether-element-attached-left{padding:0 .8rem;margin-left:0}a .tooltip.tooltip-right .tooltip-inner:before,a .tooltip.bs-tether-element-attached-left .tooltip-inner:before{top:50%;left:0;margin-top:-.8rem;content:\"\";border-width:.8rem .8rem .8rem 0}a .tooltip.tooltip-bottom,a .tooltip.bs-tether-element-attached-top{padding:.8rem 0;margin-top:0}a .tooltip.tooltip-bottom .tooltip-inner:before,a .tooltip.bs-tether-element-attached-top .tooltip-inner:before{top:0;left:50%;margin-left:-.8rem;content:\"\";border-width:0 .8rem .8rem}a .tooltip.tooltip-left,a .tooltip.bs-tether-element-attached-right{padding:0 .8rem;margin-left:0}a .tooltip.tooltip-left .tooltip-inner:before,a .tooltip.bs-tether-element-attached-right .tooltip-inner:before{top:50%;right:0;margin-top:-.8rem;content:\"\";border-width:.8rem 0 .8rem .8rem}.tooltip-inner{max-width:200px;padding:.25rem .5rem;text-align:center;padding:.2rem .4rem;box-shadow:0 5px 11px #0000002e,0 4px 15px #00000026;border-radius:.25rem}.tooltip-inner:before{position:absolute;width:0;height:0;border-color:transparent;border-style:solid}@keyframes fadeInTooltip{0%{opacity:0}to{opacity:1}}.tooltip-fadeIn{animation-name:fadeInTooltip;animation-delay:.2s;animation-duration:.2s;animation-fill-mode:both}.single-tooltip{padding:.75rem 0 0}.single-tooltip a{padding:0!important}a[tooltip]{margin-left:0!important;padding:0 .5rem}.tooltip-arrow.left{position:relative;margin-right:-.6rem;transform:rotate(90deg)}.tooltip-arrow.right{position:relative;margin-left:-.6rem;transform:rotate(-90deg)}.tooltip-arrow.top{position:relative;transform:rotate(-180deg)}.tooltip-top{padding:.4rem 0}.tooltip-top .arrow{bottom:0}.tooltip-top .arrow:before{top:0;border-width:.4rem .4rem 0;border-top-color:#000}.tooltip-right{padding:0 .4rem}.tooltip-right .arrow{left:0}.tooltip-right .arrow:before{right:0;border-width:.4rem .4rem .4rem 0;border-right-color:#000}.tooltip-bottom{padding:.4rem 0}.tooltip-bottom .arrow{top:0}.tooltip-bottom .arrow:before{bottom:0;border-width:0 .4rem .4rem;border-bottom-color:#000}.tooltip-left{padding:0 .4rem}.tooltip-left .arrow{right:0}.tooltip-left .arrow:before{left:0;border-width:.4rem 0 .4rem .4rem;border-left-color:#000}\n"] }]
}], ctorParameters: function () { return [{ type: i1.TooltipConfig }, { type: i0.ElementRef }]; }, propDecorators: { containerClass: [{
type: Input
}], tooltipInner: [{
type: ViewChild,
args: ['tooltipInner', { static: true }]
}], tooltipArrow: [{
type: ViewChild,
args: ['tooltipArrow', { static: true }]
}], show: [{
type: HostBinding,
args: ['class.show']
}], tooltipClasses: [{
type: HostBinding,
args: ['class']
}] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9vbHRpcC5jb21wb25lbnQuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy9hbmd1bGFyLWJvb3RzdHJhcC1tZC9zcmMvbGliL2ZyZWUvdG9vbHRpcC90b29sdGlwLmNvbXBvbmVudC50cyJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBRUwsdUJBQXVCLEVBQ3ZCLFNBQVMsRUFFVCxXQUFXLEVBQ1gsS0FBSyxFQUNMLFNBQVMsRUFDVCxpQkFBaUIsR0FDbEIsTUFBTSxlQUFlLENBQUM7QUFFdkIsT0FBTyxFQUFFLEtBQUssRUFBRSxNQUFNLCtCQUErQixDQUFDOzs7QUFjdEQsTUFBTSxPQUFPLHlCQUF5QjtJQW1CcEMsWUFBbUIsTUFBcUIsRUFBUyxJQUFnQjtRQUFoQixTQUFJLEdBQUosSUFBSSxDQUFZO1FBYnhELG1CQUFjLEdBQUcsRUFBRSxDQUFDO1FBR0YsU0FBSSxHQUFHLENBQUMsSUFBSSxDQUFDLEtBQUssQ0FBQztRQVc1QyxNQUFNLENBQUMsTUFBTSxDQUFDLElBQUksRUFBRSxNQUFNLENBQUMsQ0FBQztJQUM5QixDQUFDO0lBWEQsSUFDSSxjQUFjO1FBQ2hCLE9BQU8scUNBQXFDLElBQUksQ0FBQyxTQUFTLGVBQWUsSUFBSSxDQUFDLFNBQVMsSUFBSSxJQUFJLENBQUMsU0FBUyxJQUFJLElBQUksQ0FBQyxjQUFjLEVBQUUsQ0FBQztJQUNySSxDQUFDO0lBRUQsSUFBVyxLQUFLO1FBQ2QsT0FBTyxLQUFLLEVBQUUsQ0FBQztJQUNqQixDQUFDO0lBTU0sZUFBZTtRQUNwQixJQUFJLENBQUMsUUFBUSxHQUFHLEVBQUUsRUFBRSxFQUFFLEtBQUssRUFBRSxJQUFJLEVBQUUsS0FBSyxFQUFFLENBQUM7UUFDM0MsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsU0FBUyxDQUFDLEdBQUcsSUFBSSxDQUFDO1FBQ3JDLElBQUksQ0FBQyxRQUFRLENBQUMsVUFBVSxHQUFHLElBQUksQ0FBQyxTQUFTLENBQUMsR0FBRyxJQUFJLENBQUM7UUFFbEQsSUFBSSxDQUFDLFFBQVEsQ0FBQyxFQUFFLEdBQUcsSUFBSSxDQUFDO1FBQ3hCLElBQUksSUFBSSxDQUFDLFNBQVMsRUFBRTtZQUNsQixJQUFJLENBQUMsUUFBUSxDQUFDLElBQUksR0FBRyxJQUFJLENBQUM7U0FDM0I7UUFFRCxJQUFJLElBQUksQ0FBQyxVQUFVLEVBQUU7WUFDbkIsSUFBSSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsVUFBVSxDQUFDLEdBQUcsSUFBSSxDQUFDO1NBQ3ZDO0lBQ0gsQ0FBQzs7c0hBcENVLHlCQUF5QjswR0FBekIseUJBQXlCLHlhQVQxQjs7Ozs7R0FLVDsyRkFJVSx5QkFBeUI7a0JBWnJDLFNBQVM7K0JBQ0UsdUJBQXVCLG1CQUNoQix1QkFBdUIsQ0FBQyxNQUFNLFlBQ3JDOzs7OztHQUtULGlCQUVjLGlCQUFpQixDQUFDLElBQUk7NkhBUTVCLGNBQWM7c0JBQXRCLEtBQUs7Z0JBQ3VDLFlBQVk7c0JBQXhELFNBQVM7dUJBQUMsY0FBYyxFQUFFLEVBQUUsTUFBTSxFQUFFLElBQUksRUFBRTtnQkFDRSxZQUFZO3NCQUF4RCxTQUFTO3VCQUFDLGNBQWMsRUFBRSxFQUFFLE1BQU0sRUFBRSxJQUFJLEVBQUU7Z0JBQ2hCLElBQUk7c0JBQTlCLFdBQVc7dUJBQUMsWUFBWTtnQkFFckIsY0FBYztzQkFEakIsV0FBVzt1QkFBQyxPQUFPIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHtcbiAgQWZ0ZXJWaWV3SW5pdCxcbiAgQ2hhbmdlRGV0ZWN0aW9uU3RyYXRlZ3ksXG4gIENvbXBvbmVudCxcbiAgRWxlbWVudFJlZixcbiAgSG9zdEJpbmRpbmcsXG4gIElucHV0LFxuICBWaWV3Q2hpbGQsXG4gIFZpZXdFbmNhcHN1bGF0aW9uLFxufSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFRvb2x0aXBDb25maWcgfSBmcm9tICcuL3Rvb2x0aXAuc2VydmljZSc7XG5pbXBvcnQgeyBpc0JzMyB9IGZyb20gJy4uL3V0aWxzL25nMi1ib290c3RyYXAtY29uZmlnJztcblxuQENvbXBvbmVudCh7XG4gIHNlbGVjdG9yOiAnbWRiLXRvb2x0aXAtY29udGFpbmVyJyxcbiAgY2hhbmdlRGV0ZWN0aW9uOiBDaGFuZ2VEZXRlY3Rpb25TdHJhdGVneS5PblB1c2gsXG4gIHRlbXBsYXRlOiBgXG4gICAgPGRpdiAjdG9vbHRpcEFycm93IGNsYXNzPVwidG9vbHRpcC1hcnJvdyBhcnJvd1wiPjwvZGl2PlxuICAgIDxkaXYgI3Rvb2x0aXBJbm5lciBjbGFzcz1cInRvb2x0aXAtaW5uZXJcIj5cbiAgICAgIDxuZy1jb250ZW50PjwvbmctY29udGVudD5cbiAgICA8L2Rpdj5cbiAgYCxcbiAgc3R5bGVVcmxzOiBbJ3Rvb2x0aXAtbW9kdWxlLnNjc3MnXSxcbiAgZW5jYXBzdWxhdGlvbjogVmlld0VuY2Fwc3VsYXRpb24uTm9uZSxcbn0pXG5leHBvcnQgY2xhc3MgVG9vbHRpcENvbnRhaW5lckNvbXBvbmVudCBpbXBsZW1lbnRzIEFmdGVyVmlld0luaXQge1xuICBwdWJsaWMgY2xhc3NNYXA6IGFueTtcbiAgcHVibGljIHBsYWNlbWVudDogc3RyaW5nO1xuICBwdWJsaWMgcG9wdXBDbGFzczogc3RyaW5nO1xuICBwdWJsaWMgYW5pbWF0aW9uOiBib29sZWFuO1xuXG4gIEBJbnB1dCgpIGNvbnRhaW5lckNsYXNzID0gJyc7XG4gIEBWaWV3Q2hpbGQoJ3Rvb2x0aXBJbm5lcicsIHsgc3RhdGljOiB0cnVlIH0pIHRvb2x0aXBJbm5lcjogRWxlbWVudFJlZjtcbiAgQFZpZXdDaGlsZCgndG9vbHRpcEFycm93JywgeyBzdGF0aWM6IHRydWUgfSkgdG9vbHRpcEFycm93OiBFbGVtZW50UmVmO1xuICBASG9zdEJpbmRpbmcoJ2NsYXNzLnNob3cnKSBzaG93ID0gIXRoaXMuaXNCczM7XG4gIEBIb3N0QmluZGluZygnY2xhc3MnKVxuICBnZXQgdG9vbHRpcENsYXNzZXMoKSB7XG4gICAgcmV0dXJuIGB0b29sdGlwLWZhZGVJbiB0b29sdGlwIGluIHRvb2x0aXAtJHt0aGlzLnBsYWNlbWVudH0gYnMtdG9vbHRpcC0ke3RoaXMucGxhY2VtZW50fSAke3RoaXMucGxhY2VtZW50fSAke3RoaXMuY29udGFpbmVyQ2xhc3N9YDtcbiAgfVxuXG4gIHB1YmxpYyBnZXQgaXNCczMoKTogYm9vbGVhbiB7XG4gICAgcmV0dXJuIGlzQnMzKCk7XG4gIH1cblxuICBwdWJsaWMgY29uc3RydWN0b3IoY29uZmlnOiBUb29sdGlwQ29uZmlnLCBwdWJsaWMgZWxlbTogRWxlbWVudFJlZikge1xuICAgIE9iamVjdC5hc3NpZ24odGhpcywgY29uZmlnKTtcbiAgfVxuXG4gIHB1YmxpYyBuZ0FmdGVyVmlld0luaXQoKTogdm9pZCB7XG4gICAgdGhpcy5jbGFzc01hcCA9IHsgaW46IGZhbHNlLCBmYWRlOiBmYWxzZSB9O1xuICAgIHRoaXMuY2xhc3NNYXBbdGhpcy5wbGFjZW1lbnRdID0gdHJ1ZTtcbiAgICB0aGlzLmNsYXNzTWFwWyd0b29sdGlwLScgKyB0aGlzLnBsYWNlbWVudF0gPSB0cnVlO1xuXG4gICAgdGhpcy5jbGFzc01hcC5pbiA9IHRydWU7XG4gICAgaWYgKHRoaXMuYW5pbWF0aW9uKSB7XG4gICAgICB0aGlzLmNsYXNzTWFwLmZhZGUgPSB0cnVlO1xuICAgIH1cblxuICAgIGlmICh0aGlzLnBvcHVwQ2xhc3MpIHtcbiAgICAgIHRoaXMuY2xhc3NNYXBbdGhpcy5wb3B1cENsYXNzXSA9IHRydWU7XG4gICAgfVxuICB9XG59XG4iXX0=