UNPKG

@hxui/angular

Version:

This README includes the steps that are necessary to import the HxUi-angular into a project or to contribute with development.

140 lines (139 loc) 11.4 kB
/** * @fileoverview added by tsickle * @suppress {checkTypes} checked by tsc */ import { Component, Input, ViewEncapsulation } from '@angular/core'; import { Context, Visibility } from '../enums'; import { Subject } from 'rxjs'; export class TooltipContentComponent { constructor() { this.placement = 'bottom'; this.context = Context.None; /** * Enums to be used in the template * */ this.contextEnum = Context; this.visibilityEnum = Visibility; this.visibility = Visibility.Hidden; /** * Subject for notifying that the tooltip has been hidden from the view */ this._onHide = new Subject(); } /** * Shows the tooltip * @param {?} delay Amount of milliseconds to the delay showing the tooltip. * @return {?} */ show(delay) { // Cancel the delayed hide if it is scheduled if (this._hideTimeoutId) { clearTimeout(this._hideTimeoutId); } this._showTimeoutId = window.setTimeout(() => { this.visibility = Visibility.Visible; }, delay); } /** * Hide the tooltip after the provided delay in ms. * @param {?} delay Amount of milliseconds to delay hiding the tooltip. * @return {?} */ hide(delay) { // Cancel the delayed show if it is scheduled if (this._showTimeoutId) { clearTimeout(this._showTimeoutId); } this._hideTimeoutId = window.setTimeout(() => { this.visibility = Visibility.Hidden; this._onHide.next(); }, delay); } /** * Returns an observable that notifies when the tooltip has been hidden from view. * @return {?} */ afterHidden() { return this._onHide.asObservable(); } /** * @return {?} */ isVisible() { return this.visibility === Visibility.Visible; } } TooltipContentComponent.decorators = [ { type: Component, args: [{ selector: 'hx-tooltip-content, hxa-tooltip-content', template: ` <div class="hx-tooltip is-{{ placement }}" [class.is-active]='visibility === visibilityEnum.Visible' [class.is-success]="context === contextEnum.Success" [class.is-warning]="context === contextEnum.Warning" [class.is-danger]="context === contextEnum.Danger" role="tooltip"> <div class="hx-tooltip-content"> {{ content }} </div> </div> `, styles: [ '.hxa-tooltip-panel { display:flex; position: absolute; pointer-events: auto; box-sizing: border-box; z-index: 1000; max-width: 100%; max-height: 100%;}', '.hx-tooltip.is-left, .hx-tooltip.is-left:before{ margin-right:.5rem; }', '.hx-tooltip.is-right, .hx-tooltip.is-right:before{ margin-left:.5rem; }', '.hx-tooltip.is-bottom, .hx-tooltip.is-bottom:before{ margin-top:.5rem; }', '.hx-tooltip.is-top, .hx-tooltip.is-top:before{ margin-bottom:.5rem; }' ], encapsulation: ViewEncapsulation.None },] }, ]; /** @nocollapse */ TooltipContentComponent.ctorParameters = () => []; TooltipContentComponent.propDecorators = { "content": [{ type: Input },], "placement": [{ type: Input },], "context": [{ type: Input },], }; function TooltipContentComponent_tsickle_Closure_declarations() { /** @type {!Array<{type: !Function, args: (undefined|!Array<?>)}>} */ TooltipContentComponent.decorators; /** * @nocollapse * @type {function(): !Array<(null|{type: ?, decorators: (undefined|!Array<{type: !Function, args: (undefined|!Array<?>)}>)})>} */ TooltipContentComponent.ctorParameters; /** @type {!Object<string,!Array<{type: !Function, args: (undefined|!Array<?>)}>>} */ TooltipContentComponent.propDecorators; /** @type {?} */ TooltipContentComponent.prototype.content; /** @type {?} */ TooltipContentComponent.prototype.placement; /** @type {?} */ TooltipContentComponent.prototype.context; /** * Enums to be used in the template * * @type {?} */ TooltipContentComponent.prototype.contextEnum; /** @type {?} */ TooltipContentComponent.prototype.visibilityEnum; /** @type {?} */ TooltipContentComponent.prototype.visibility; /** * Subject for notifying that the tooltip has been hidden from the view * @type {?} */ TooltipContentComponent.prototype._onHide; /** * The timeout ID of any current timer set to show the tooltip * @type {?} */ TooltipContentComponent.prototype._showTimeoutId; /** * The timeout ID of any current timer set to hide the tooltip * @type {?} */ TooltipContentComponent.prototype._hideTimeoutId; } //# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoidG9vbHRpcC1jb250ZW50LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiJuZzovL0BoeHVpL2FuZ3VsYXIvIiwic291cmNlcyI6WyJsaWIvdG9vbHRpcC90b29sdGlwLWNvbnRlbnQuY29tcG9uZW50LnRzIl0sIm5hbWVzIjpbXSwibWFwcGluZ3MiOiI7Ozs7QUFBQSxPQUFPLEVBQ0wsU0FBUyxFQUNULEtBQUssRUFDTCxpQkFBaUIsRUFDbEIsTUFBTSxlQUFlLENBQUM7QUFDdkIsT0FBTyxFQUFDLE9BQU8sRUFBRSxVQUFVLEVBQUMsTUFBTSxVQUFVLENBQUM7QUFDN0MsT0FBTyxFQUFhLE9BQU8sRUFBQyxNQUFNLE1BQU0sQ0FBQztBQXlCekMsTUFBTTtJQTBCSjt5QkFwQmlELFFBQVE7dUJBR3RDLE9BQU8sQ0FBQyxJQUFJOzs7OzJCQUdqQixPQUFPOzhCQUNKLFVBQVU7MEJBRUYsVUFBVSxDQUFDLE1BQU07Ozs7dUJBR0QsSUFBSSxPQUFPLEVBQUU7S0FRdEM7Ozs7OztJQU9oQixJQUFJLENBQUMsS0FBYTs7UUFFaEIsRUFBRSxDQUFDLENBQUMsSUFBSSxDQUFDLGNBQWMsQ0FBQyxDQUFDLENBQUM7WUFDeEIsWUFBWSxDQUFDLElBQUksQ0FBQyxjQUFjLENBQUMsQ0FBQztTQUNuQztRQUVELElBQUksQ0FBQyxjQUFjLEdBQUcsTUFBTSxDQUFDLFVBQVUsQ0FBQyxHQUFHLEVBQUU7WUFDM0MsSUFBSSxDQUFDLFVBQVUsR0FBRyxVQUFVLENBQUMsT0FBTyxDQUFDO1NBRXRDLEVBQUUsS0FBSyxDQUFDLENBQUM7S0FDWDs7Ozs7O0lBTUQsSUFBSSxDQUFDLEtBQWE7O1FBRWhCLEVBQUUsQ0FBQyxDQUFDLElBQUksQ0FBQyxjQUFjLENBQUMsQ0FBQyxDQUFDO1lBQ3hCLFlBQVksQ0FBQyxJQUFJLENBQUMsY0FBYyxDQUFDLENBQUM7U0FDbkM7UUFFRCxJQUFJLENBQUMsY0FBYyxHQUFHLE1BQU0sQ0FBQyxVQUFVLENBQUMsR0FBRyxFQUFFO1lBQzNDLElBQUksQ0FBQyxVQUFVLEdBQUcsVUFBVSxDQUFDLE1BQU0sQ0FBQztZQUNwQyxJQUFJLENBQUMsT0FBTyxDQUFDLElBQUksRUFBRSxDQUFDO1NBQ3JCLEVBQUUsS0FBSyxDQUFDLENBQUM7S0FDWDs7Ozs7SUFHRCxXQUFXO1FBQ1QsTUFBTSxDQUFDLElBQUksQ0FBQyxPQUFPLENBQUMsWUFBWSxFQUFFLENBQUM7S0FDcEM7Ozs7SUFFRCxTQUFTO1FBQ1AsTUFBTSxDQUFDLElBQUksQ0FBQyxVQUFVLEtBQUssVUFBVSxDQUFDLE9BQU8sQ0FBQztLQUMvQzs7O1lBM0ZGLFNBQVMsU0FBQztnQkFDVCxRQUFRLEVBQUUseUNBQXlDO2dCQUNuRCxRQUFRLEVBQUU7Ozs7Ozs7Ozs7O0NBV1g7Z0JBQ0MsTUFBTSxFQUFFO29CQUNOLHlKQUF5SjtvQkFDekosd0VBQXdFO29CQUN4RSx5RUFBeUU7b0JBQ3pFLDBFQUEwRTtvQkFDMUUsdUVBQXVFO2lCQUN4RTtnQkFDRCxhQUFhLEVBQUUsaUJBQWlCLENBQUMsSUFBSTthQUN0Qzs7Ozs7d0JBR0UsS0FBSzswQkFHTCxLQUFLO3dCQUdMLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQge1xyXG4gIENvbXBvbmVudCxcclxuICBJbnB1dCxcclxuICBWaWV3RW5jYXBzdWxhdGlvblxyXG59IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQge0NvbnRleHQsIFZpc2liaWxpdHl9IGZyb20gJy4uL2VudW1zJztcclxuaW1wb3J0IHtPYnNlcnZhYmxlLCBTdWJqZWN0fSBmcm9tICdyeGpzJztcclxuXHJcbkBDb21wb25lbnQoe1xyXG4gIHNlbGVjdG9yOiAnaHgtdG9vbHRpcC1jb250ZW50LCBoeGEtdG9vbHRpcC1jb250ZW50JyxcclxuICB0ZW1wbGF0ZTogYCAgICBcclxuICAgICAgPGRpdiBjbGFzcz1cImh4LXRvb2x0aXAgaXMte3sgcGxhY2VtZW50IH19XCJcclxuICAgICAgICAgICBbY2xhc3MuaXMtYWN0aXZlXT0ndmlzaWJpbGl0eSA9PT0gdmlzaWJpbGl0eUVudW0uVmlzaWJsZSdcclxuICAgICAgICAgICBbY2xhc3MuaXMtc3VjY2Vzc109XCJjb250ZXh0ID09PSBjb250ZXh0RW51bS5TdWNjZXNzXCJcclxuICAgICAgICAgICBbY2xhc3MuaXMtd2FybmluZ109XCJjb250ZXh0ID09PSBjb250ZXh0RW51bS5XYXJuaW5nXCJcclxuICAgICAgICAgICBbY2xhc3MuaXMtZGFuZ2VyXT1cImNvbnRleHQgPT09IGNvbnRleHRFbnVtLkRhbmdlclwiXHJcbiAgICAgICAgICAgcm9sZT1cInRvb2x0aXBcIj5cclxuICAgICAgICAgIDxkaXYgY2xhc3M9XCJoeC10b29sdGlwLWNvbnRlbnRcIj5cclxuICAgICAgICAgICAge3sgY29udGVudCB9fVxyXG4gICAgICAgICAgPC9kaXY+XHJcbiAgICAgIDwvZGl2PlxyXG5gLFxyXG4gIHN0eWxlczogW1xyXG4gICAgJy5oeGEtdG9vbHRpcC1wYW5lbCB7IGRpc3BsYXk6ZmxleDsgcG9zaXRpb246IGFic29sdXRlOyBwb2ludGVyLWV2ZW50czogYXV0bzsgYm94LXNpemluZzogYm9yZGVyLWJveDsgei1pbmRleDogMTAwMDsgbWF4LXdpZHRoOiAxMDAlOyBtYXgtaGVpZ2h0OiAxMDAlO30nLFxyXG4gICAgJy5oeC10b29sdGlwLmlzLWxlZnQsIC5oeC10b29sdGlwLmlzLWxlZnQ6YmVmb3JleyBtYXJnaW4tcmlnaHQ6LjVyZW07IH0nLFxyXG4gICAgJy5oeC10b29sdGlwLmlzLXJpZ2h0LCAuaHgtdG9vbHRpcC5pcy1yaWdodDpiZWZvcmV7IG1hcmdpbi1sZWZ0Oi41cmVtOyB9JyxcclxuICAgICcuaHgtdG9vbHRpcC5pcy1ib3R0b20sIC5oeC10b29sdGlwLmlzLWJvdHRvbTpiZWZvcmV7IG1hcmdpbi10b3A6LjVyZW07IH0nLFxyXG4gICAgJy5oeC10b29sdGlwLmlzLXRvcCwgLmh4LXRvb2x0aXAuaXMtdG9wOmJlZm9yZXsgbWFyZ2luLWJvdHRvbTouNXJlbTsgfSdcclxuICBdLFxyXG4gIGVuY2Fwc3VsYXRpb246IFZpZXdFbmNhcHN1bGF0aW9uLk5vbmVcclxufSlcclxuZXhwb3J0IGNsYXNzIFRvb2x0aXBDb250ZW50Q29tcG9uZW50IHtcclxuXHJcbiAgQElucHV0KClcclxuICBjb250ZW50OiBzdHJpbmc7XHJcblxyXG4gIEBJbnB1dCgpXHJcbiAgcGxhY2VtZW50OiAndG9wJyB8ICdib3R0b20nIHwgJ2xlZnQnIHwgJ3JpZ2h0JyA9ICdib3R0b20nO1xyXG5cclxuICBASW5wdXQoKVxyXG4gIGNvbnRleHQ6IENvbnRleHQgPSBDb250ZXh0Lk5vbmU7XHJcblxyXG4gIC8qKiBFbnVtcyB0byBiZSB1c2VkIGluIHRoZSB0ZW1wbGF0ZSAqKi9cclxuICBjb250ZXh0RW51bSA9IENvbnRleHQ7XHJcbiAgdmlzaWJpbGl0eUVudW0gPSBWaXNpYmlsaXR5O1xyXG5cclxuICB2aXNpYmlsaXR5OiBWaXNpYmlsaXR5ID0gVmlzaWJpbGl0eS5IaWRkZW47XHJcblxyXG4gIC8qKiBTdWJqZWN0IGZvciBub3RpZnlpbmcgdGhhdCB0aGUgdG9vbHRpcCBoYXMgYmVlbiBoaWRkZW4gZnJvbSB0aGUgdmlldyAqL1xyXG4gIHByaXZhdGUgcmVhZG9ubHkgX29uSGlkZTogU3ViamVjdDxhbnk+ID0gbmV3IFN1YmplY3QoKTtcclxuXHJcbiAgLyoqIFRoZSB0aW1lb3V0IElEIG9mIGFueSBjdXJyZW50IHRpbWVyIHNldCB0byBzaG93IHRoZSB0b29sdGlwICovXHJcbiAgcHJpdmF0ZSBfc2hvd1RpbWVvdXRJZDogbnVtYmVyO1xyXG5cclxuICAvKiogVGhlIHRpbWVvdXQgSUQgb2YgYW55IGN1cnJlbnQgdGltZXIgc2V0IHRvIGhpZGUgdGhlIHRvb2x0aXAgKi9cclxuICBwcml2YXRlIF9oaWRlVGltZW91dElkOiBudW1iZXI7XHJcblxyXG4gIGNvbnN0cnVjdG9yKCkge31cclxuXHJcblxyXG4gIC8qKlxyXG4gICAqIFNob3dzIHRoZSB0b29sdGlwXHJcbiAgICogQHBhcmFtIGRlbGF5IEFtb3VudCBvZiBtaWxsaXNlY29uZHMgdG8gdGhlIGRlbGF5IHNob3dpbmcgdGhlIHRvb2x0aXAuXHJcbiAgICovXHJcbiAgc2hvdyhkZWxheTogbnVtYmVyKTogdm9pZCB7XHJcbiAgICAvLyBDYW5jZWwgdGhlIGRlbGF5ZWQgaGlkZSBpZiBpdCBpcyBzY2hlZHVsZWRcclxuICAgIGlmICh0aGlzLl9oaWRlVGltZW91dElkKSB7XHJcbiAgICAgIGNsZWFyVGltZW91dCh0aGlzLl9oaWRlVGltZW91dElkKTtcclxuICAgIH1cclxuXHJcbiAgICB0aGlzLl9zaG93VGltZW91dElkID0gd2luZG93LnNldFRpbWVvdXQoKCkgPT4ge1xyXG4gICAgICB0aGlzLnZpc2liaWxpdHkgPSBWaXNpYmlsaXR5LlZpc2libGU7XHJcblxyXG4gICAgfSwgZGVsYXkpO1xyXG4gIH1cclxuXHJcbiAgLyoqXHJcbiAgICogSGlkZSB0aGUgdG9vbHRpcCBhZnRlciB0aGUgcHJvdmlkZWQgZGVsYXkgaW4gbXMuXHJcbiAgICogQHBhcmFtIGRlbGF5IEFtb3VudCBvZiBtaWxsaXNlY29uZHMgdG8gZGVsYXkgaGlkaW5nIHRoZSB0b29sdGlwLlxyXG4gICAqL1xyXG4gIGhpZGUoZGVsYXk6IG51bWJlcik6IHZvaWQge1xyXG4gICAgLy8gQ2FuY2VsIHRoZSBkZWxheWVkIHNob3cgaWYgaXQgaXMgc2NoZWR1bGVkXHJcbiAgICBpZiAodGhpcy5fc2hvd1RpbWVvdXRJZCkge1xyXG4gICAgICBjbGVhclRpbWVvdXQodGhpcy5fc2hvd1RpbWVvdXRJZCk7XHJcbiAgICB9XHJcblxyXG4gICAgdGhpcy5faGlkZVRpbWVvdXRJZCA9IHdpbmRvdy5zZXRUaW1lb3V0KCgpID0+IHtcclxuICAgICAgdGhpcy52aXNpYmlsaXR5ID0gVmlzaWJpbGl0eS5IaWRkZW47XHJcbiAgICAgIHRoaXMuX29uSGlkZS5uZXh0KCk7XHJcbiAgICB9LCBkZWxheSk7XHJcbiAgfVxyXG5cclxuICAvKiogUmV0dXJucyBhbiBvYnNlcnZhYmxlIHRoYXQgbm90aWZpZXMgd2hlbiB0aGUgdG9vbHRpcCBoYXMgYmVlbiBoaWRkZW4gZnJvbSB2aWV3LiAqL1xyXG4gIGFmdGVySGlkZGVuKCk6IE9ic2VydmFibGU8dm9pZD4ge1xyXG4gICAgcmV0dXJuIHRoaXMuX29uSGlkZS5hc09ic2VydmFibGUoKTtcclxuICB9XHJcblxyXG4gIGlzVmlzaWJsZSgpOiBib29sZWFuIHtcclxuICAgIHJldHVybiB0aGlzLnZpc2liaWxpdHkgPT09IFZpc2liaWxpdHkuVmlzaWJsZTtcclxuICB9XHJcblxyXG59XHJcbiJdfQ==