@ng-matero/extensions 16.3.2 → 17.1.0

package/fesm2022/mtxTooltip.mjs

@@ -1,25 +1,22 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, TemplateRef, ElementRef, Directive, Inject, Input, Optional, Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, NgModule } from '@angular/core';
-import * as i5 from '@angular/common';
-import { DOCUMENT, CommonModule } from '@angular/common';
+import { inject, InjectionToken, TemplateRef, ElementRef, Directive, Inject, Optional, Input, ANIMATION_MODULE_TYPE, Component, ViewEncapsulation, ChangeDetectionStrategy, ViewChild, NgModule } from '@angular/core';
+import { DOCUMENT, NgClass, NgTemplateOutlet, CommonModule } from '@angular/common';
 import * as i3 from '@angular/cdk/a11y';
 import { A11yModule } from '@angular/cdk/a11y';
 import * as i1 from '@angular/cdk/overlay';
 import { Overlay, OverlayModule } from '@angular/cdk/overlay';
 import { CdkScrollableModule } from '@angular/cdk/scrolling';
 import { MatCommonModule } from '@angular/material/core';
-import * as i6 from '@ng-matero/extensions/core';
-import { MtxPipesModule } from '@ng-matero/extensions/core';
+import { MtxIsTemplateRefPipe, MtxPipesModule } from '@ng-matero/extensions/core';
 import { coerceBooleanProperty, coerceNumberProperty } from '@angular/cdk/coercion';
 import { ESCAPE, hasModifierKey } from '@angular/cdk/keycodes';
 import * as i2 from '@angular/cdk/platform';
 import { normalizePassiveListenerOptions } from '@angular/cdk/platform';
 import { ComponentPortal } from '@angular/cdk/portal';
-import { ANIMATION_MODULE_TYPE } from '@angular/platform-browser/animations';
 import { Subject } from 'rxjs';
 import { takeUntil, take } from 'rxjs/operators';
 import * as i4 from '@angular/cdk/bidi';
-import { trigger, state, style, transition, animate } from '@angular/animations';
+import { style, state, animate, transition, trigger } from '@angular/animations';
 
 /** Time in ms to throttle repositioning after scroll events. */
 const SCROLL_THROTTLE_MS = 20;
@@ -31,7 +28,13 @@ function getMtxTooltipInvalidPositionError(position) {
     return Error(`Tooltip position "${position}" is invalid.`);
 }
 /** Injection token that determines the scroll handling while a tooltip is visible. */
-const MTX_TOOLTIP_SCROLL_STRATEGY = new InjectionToken('mtx-tooltip-scroll-strategy');
+const MTX_TOOLTIP_SCROLL_STRATEGY = new InjectionToken('mtx-tooltip-scroll-strategy', {
+    providedIn: 'root',
+    factory: () => {
+        const overlay = inject(Overlay);
+        return () => overlay.scrollStrategies.reposition({ scrollThrottle: SCROLL_THROTTLE_MS });
+    },
+});
 /** @docs-private */
 function MTX_TOOLTIP_SCROLL_STRATEGY_FACTORY(overlay) {
     return () => overlay.scrollStrategies.reposition({ scrollThrottle: SCROLL_THROTTLE_MS });
@@ -75,7 +78,13 @@ const MIN_VIEWPORT_TOOLTIP_THRESHOLD = 8;
 const UNBOUNDED_ANCHOR_GAP = 8;
 const MIN_HEIGHT = 24;
 const MAX_WIDTH = 200;
-class _MtxTooltipBase {
+/**
+ * Directive that attaches a material design tooltip to the host element. Animates the showing and
+ * hiding of a tooltip provided position (defaults to below the element).
+ *
+ * https://material.io/design/components/tooltips.html
+ */
+class MtxTooltip {
     /** Allows the user to define the position of the tooltip relative to the parent element */
     get position() {
         return this._position;
@@ -90,6 +99,10 @@ class _MtxTooltipBase {
             }
         }
     }
+    /**
+     * Whether tooltip should be relative to the click or touch origin
+     * instead of outside the element bounding box.
+     */
     get positionAtOrigin() {
         return this._positionAtOrigin;
     }
@@ -186,15 +199,16 @@ class _MtxTooltipBase {
         this._focusMonitor = _focusMonitor;
         this._dir = _dir;
         this._defaultOptions = _defaultOptions;
+        this._overlayRef = null;
+        this._tooltipInstance = null;
         this._position = 'below';
         this._positionAtOrigin = false;
         this._disabled = false;
         this._viewInitialized = false;
         this._pointerExitEventsInitialized = false;
+        this._tooltipComponent = TooltipComponent;
         this._viewportMargin = 8;
-        this._cssClassPrefix = 'mtx';
-        this._showDelay = this._defaultOptions.showDelay;
-        this._hideDelay = this._defaultOptions.hideDelay;
+        this._cssClassPrefix = 'mtx-mdc';
         /**
          * How touch gestures should be handled by the tooltip. On touch devices the tooltip directive
          * uses a long press gesture to show and hide, however it can conflict with the native browser
@@ -218,6 +232,8 @@ class _MtxTooltipBase {
         this._scrollStrategy = scrollStrategy;
         this._document = _document;
         if (_defaultOptions) {
+            this._showDelay = _defaultOptions.showDelay;
+            this._hideDelay = _defaultOptions.hideDelay;
             if (_defaultOptions.position) {
                 this.position = _defaultOptions.position;
             }
@@ -233,6 +249,7 @@ class _MtxTooltipBase {
                 this._updatePosition(this._overlayRef);
             }
         });
+        this._viewportMargin = MIN_VIEWPORT_TOOLTIP_THRESHOLD;
     }
     ngAfterViewInit() {
         // This needs to happen after view init so the initial values for all inputs have been set.
@@ -392,6 +409,20 @@ class _MtxTooltipBase {
     }
     /** Adds the configured offset to a position. Used as a hook for child classes. */
     _addOffset(position) {
+        const offset = UNBOUNDED_ANCHOR_GAP;
+        const isLtr = !this._dir || this._dir.value == 'ltr';
+        if (position.originY === 'top') {
+            position.offsetY = -offset;
+        }
+        else if (position.originY === 'bottom') {
+            position.offsetY = offset;
+        }
+        else if (position.originX === 'start') {
+            position.offsetX = isLtr ? -offset : offset;
+        }
+        else if (position.originX === 'end') {
+            position.offsetX = isLtr ? offset : -offset;
+        }
         return position;
     }
     /**
@@ -647,15 +678,32 @@ class _MtxTooltipBase {
             style.webkitTapHighlightColor = 'transparent';
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: _MtxTooltipBase, deps: "invalid", target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.7", type: _MtxTooltipBase, inputs: { position: ["mtxTooltipPosition", "position"], positionAtOrigin: ["mtxTooltipPositionAtOrigin", "positionAtOrigin"], disabled: ["mtxTooltipDisabled", "disabled"], showDelay: ["mtxTooltipShowDelay", "showDelay"], hideDelay: ["mtxTooltipHideDelay", "hideDelay"], touchGestures: ["mtxTooltipTouchGestures", "touchGestures"], message: ["mtxTooltip", "message"], tooltipContext: ["mtxTooltipContext", "tooltipContext"], tooltipClass: ["mtxTooltipClass", "tooltipClass"] }, ngImport: i0 }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxTooltip, deps: [{ token: i1.Overlay }, { token: i0.ElementRef }, { token: i1.ScrollDispatcher }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i2.Platform }, { token: i3.AriaDescriber }, { token: i3.FocusMonitor }, { token: MTX_TOOLTIP_SCROLL_STRATEGY }, { token: i4.Directionality }, { token: MTX_TOOLTIP_DEFAULT_OPTIONS, optional: true }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
+    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "17.1.0", type: MtxTooltip, isStandalone: true, selector: "[mtxTooltip]", inputs: { position: ["mtxTooltipPosition", "position"], positionAtOrigin: ["mtxTooltipPositionAtOrigin", "positionAtOrigin"], disabled: ["mtxTooltipDisabled", "disabled"], showDelay: ["mtxTooltipShowDelay", "showDelay"], hideDelay: ["mtxTooltipHideDelay", "hideDelay"], touchGestures: ["mtxTooltipTouchGestures", "touchGestures"], message: ["mtxTooltip", "message"], tooltipContext: ["mtxTooltipContext", "tooltipContext"], tooltipClass: ["mtxTooltipClass", "tooltipClass"] }, host: { properties: { "class.mtx-mdc-tooltip-disabled": "disabled" }, classAttribute: "mtx-mdc-tooltip-trigger" }, exportAs: ["mtxTooltip"], ngImport: i0 }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: _MtxTooltipBase, decorators: [{
-            type: Directive
-        }], ctorParameters: function () { return [{ type: i1.Overlay }, { type: i0.ElementRef }, { type: i1.ScrollDispatcher }, { type: i0.ViewContainerRef }, { type: i0.NgZone }, { type: i2.Platform }, { type: i3.AriaDescriber }, { type: i3.FocusMonitor }, { type: undefined }, { type: i4.Directionality }, { type: undefined }, { type: undefined, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxTooltip, decorators: [{
+            type: Directive,
+            args: [{
+                    selector: '[mtxTooltip]',
+                    exportAs: 'mtxTooltip',
+                    host: {
+                        'class': 'mtx-mdc-tooltip-trigger',
+                        '[class.mtx-mdc-tooltip-disabled]': 'disabled',
+                    },
+                    standalone: true,
+                }]
+        }], ctorParameters: () => [{ type: i1.Overlay }, { type: i0.ElementRef }, { type: i1.ScrollDispatcher }, { type: i0.ViewContainerRef }, { type: i0.NgZone }, { type: i2.Platform }, { type: i3.AriaDescriber }, { type: i3.FocusMonitor }, { type: undefined, decorators: [{
+                    type: Inject,
+                    args: [MTX_TOOLTIP_SCROLL_STRATEGY]
+                }] }, { type: i4.Directionality }, { type: undefined, decorators: [{
+                    type: Optional
+                }, {
+                    type: Inject,
+                    args: [MTX_TOOLTIP_DEFAULT_OPTIONS]
+                }] }, { type: undefined, decorators: [{
                     type: Inject,
                     args: [DOCUMENT]
-                }] }]; }, propDecorators: { position: [{
+                }] }], propDecorators: { position: [{
                 type: Input,
                 args: ['mtxTooltipPosition']
             }], positionAtOrigin: [{
@@ -684,70 +732,25 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
                 args: ['mtxTooltipClass']
             }] } });
 /**
- * Directive that attaches a material design tooltip to the host element. Animates the showing and
- * hiding of a tooltip provided position (defaults to below the element).
- *
- * https://material.io/design/components/tooltips.html
+ * Internal component that wraps the tooltip's content.
+ * @docs-private
  */
-class MtxTooltip extends _MtxTooltipBase {
-    constructor(overlay, elementRef, scrollDispatcher, viewContainerRef, ngZone, platform, ariaDescriber, focusMonitor, scrollStrategy, dir, defaultOptions, _document) {
-        super(overlay, elementRef, scrollDispatcher, viewContainerRef, ngZone, platform, ariaDescriber, focusMonitor, scrollStrategy, dir, defaultOptions, _document);
-        this._tooltipComponent = TooltipComponent;
-        this._cssClassPrefix = 'mtx-mdc';
-        this._viewportMargin = MIN_VIEWPORT_TOOLTIP_THRESHOLD;
-    }
-    _addOffset(position) {
-        const offset = UNBOUNDED_ANCHOR_GAP;
-        const isLtr = !this._dir || this._dir.value == 'ltr';
-        if (position.originY === 'top') {
-            position.offsetY = -offset;
-        }
-        else if (position.originY === 'bottom') {
-            position.offsetY = offset;
-        }
-        else if (position.originX === 'start') {
-            position.offsetX = isLtr ? -offset : offset;
-        }
-        else if (position.originX === 'end') {
-            position.offsetX = isLtr ? offset : -offset;
-        }
-        return position;
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: MtxTooltip, deps: [{ token: i1.Overlay }, { token: i0.ElementRef }, { token: i1.ScrollDispatcher }, { token: i0.ViewContainerRef }, { token: i0.NgZone }, { token: i2.Platform }, { token: i3.AriaDescriber }, { token: i3.FocusMonitor }, { token: MTX_TOOLTIP_SCROLL_STRATEGY }, { token: i4.Directionality, optional: true }, { token: MTX_TOOLTIP_DEFAULT_OPTIONS, optional: true }, { token: DOCUMENT }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.7", type: MtxTooltip, selector: "[mtxTooltip]", host: { classAttribute: "mtx-mdc-tooltip-trigger" }, exportAs: ["mtxTooltip"], usesInheritance: true, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: MtxTooltip, decorators: [{
-            type: Directive,
-            args: [{
-                    selector: '[mtxTooltip]',
-                    exportAs: 'mtxTooltip',
-                    host: {
-                        class: 'mtx-mdc-tooltip-trigger',
-                    },
-                }]
-        }], ctorParameters: function () { return [{ type: i1.Overlay }, { type: i0.ElementRef }, { type: i1.ScrollDispatcher }, { type: i0.ViewContainerRef }, { type: i0.NgZone }, { type: i2.Platform }, { type: i3.AriaDescriber }, { type: i3.FocusMonitor }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [MTX_TOOLTIP_SCROLL_STRATEGY]
-                }] }, { type: i4.Directionality, decorators: [{
-                    type: Optional
-                }] }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [MTX_TOOLTIP_DEFAULT_OPTIONS]
-                }] }, { type: undefined, decorators: [{
-                    type: Inject,
-                    args: [DOCUMENT]
-                }] }]; } });
-class _TooltipComponentBase {
-    constructor(_changeDetectorRef, animationMode) {
+class TooltipComponent {
+    constructor(_changeDetectorRef, _elementRef, animationMode) {
         this._changeDetectorRef = _changeDetectorRef;
+        this._elementRef = _elementRef;
+        /* Whether the tooltip text overflows to multiple lines */
+        this._isMultiline = false;
         /** Whether interactions on the page should close the tooltip */
         this._closeOnInteraction = false;
         /** Whether the tooltip is currently visible. */
         this._isVisible = false;
         /** Subject for notifying that the tooltip has been hidden from the view */
         this._onHide = new Subject();
+        /** Name of the show animation and the class that toggles it. */
+        this._showAnimation = 'mtx-mdc-tooltip-show';
+        /** Name of the hide animation and the class that toggles it. */
+        this._hideAnimation = 'mtx-mdc-tooltip-hide';
         this._animationsDisabled = animationMode === 'NoopAnimations';
     }
     /**
@@ -756,7 +759,9 @@ class _TooltipComponentBase {
      */
     show(delay) {
         // Cancel the delayed hide if it is scheduled
-        clearTimeout(this._hideTimeoutId);
+        if (this._hideTimeoutId != null) {
+            clearTimeout(this._hideTimeoutId);
+        }
         this._showTimeoutId = setTimeout(() => {
             this._toggleVisibility(true);
             this._showTimeoutId = undefined;
@@ -768,7 +773,9 @@ class _TooltipComponentBase {
      */
     hide(delay) {
         // Cancel the delayed show if it is scheduled
-        clearTimeout(this._showTimeoutId);
+        if (this._showTimeoutId != null) {
+            clearTimeout(this._showTimeoutId);
+        }
         this._hideTimeoutId = setTimeout(() => {
             this._toggleVisibility(false);
             this._hideTimeoutId = undefined;
@@ -820,7 +827,15 @@ class _TooltipComponentBase {
      * This method is only needed by the mdc-tooltip, and so it is only implemented
      * in the mdc-tooltip, not here.
      */
-    _onShow() { }
+    _onShow() {
+        this._isMultiline = this._isTooltipMultiline();
+        this._markForCheck();
+    }
+    /** Whether the tooltip text has overflown to the next line */
+    _isTooltipMultiline() {
+        const rect = this._elementRef.nativeElement.getBoundingClientRect();
+        return rect.height > MIN_HEIGHT && rect.width >= MAX_WIDTH;
+    }
     /** Event listener dispatched when an animation on the tooltip finishes. */
     _handleAnimationEnd({ animationName }) {
         if (animationName === this._showAnimation || animationName === this._hideAnimation) {
@@ -829,8 +844,12 @@ class _TooltipComponentBase {
     }
     /** Cancels any pending animation sequences. */
     _cancelPendingAnimations() {
-        clearTimeout(this._showTimeoutId);
-        clearTimeout(this._hideTimeoutId);
+        if (this._showTimeoutId != null) {
+            clearTimeout(this._showTimeoutId);
+        }
+        if (this._hideTimeoutId != null) {
+            clearTimeout(this._hideTimeoutId);
+        }
         this._showTimeoutId = this._hideTimeoutId = undefined;
     }
     /** Handles the cleanup after an animation has finished. */
@@ -871,43 +890,10 @@ class _TooltipComponentBase {
             this._finalizeAnimation(isVisible);
         }
     }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: _TooltipComponentBase, deps: [{ token: i0.ChangeDetectorRef }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Directive }); }
-    /** @nocollapse */ static { this.ɵdir = i0.ɵɵngDeclareDirective({ minVersion: "14.0.0", version: "16.2.7", type: _TooltipComponentBase, ngImport: i0 }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: _TooltipComponentBase, decorators: [{
-            type: Directive
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
-                    type: Optional
-                }, {
-                    type: Inject,
-                    args: [ANIMATION_MODULE_TYPE]
-                }] }]; } });
-/**
- * Internal component that wraps the tooltip's content.
- * @docs-private
- */
-class TooltipComponent extends _TooltipComponentBase {
-    constructor(changeDetectorRef, _elementRef, animationMode) {
-        super(changeDetectorRef, animationMode);
-        this._elementRef = _elementRef;
-        /* Whether the tooltip text overflows to multiple lines */
-        this._isMultiline = false;
-        this._showAnimation = 'mtx-mdc-tooltip-show';
-        this._hideAnimation = 'mtx-mdc-tooltip-hide';
-    }
-    _onShow() {
-        this._isMultiline = this._isTooltipMultiline();
-        this._markForCheck();
-    }
-    /** Whether the tooltip text has overflown to the next line */
-    _isTooltipMultiline() {
-        const rect = this._elementRef.nativeElement.getBoundingClientRect();
-        return rect.height > MIN_HEIGHT && rect.width >= MAX_WIDTH;
-    }
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: TooltipComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.2.7", type: TooltipComponent, selector: "mtx-tooltip-component", host: { attributes: { "aria-hidden": "true" }, listeners: { "mouseleave": "_handleMouseLeave($event)" }, properties: { "style.zoom": "isVisible() ? 1 : null" } }, viewQueries: [{ propertyName: "_tooltip", first: true, predicate: ["tooltip"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, template: "<div #tooltip\n     class=\"mdc-tooltip mdc-tooltip--shown mtx-mdc-tooltip\"\n     [ngClass]=\"tooltipClass\"\n     (animationend)=\"_handleAnimationEnd($event)\"\n     [class.mdc-tooltip--multiline]=\"_isMultiline\">\n  <div class=\"mdc-tooltip__surface mdc-tooltip__surface-animation\">\n    <ng-template [ngIf]=\"message | isTemplateRef\" [ngIfElse]=\"msgStrTpl\">\n      <ng-template [ngTemplateOutlet]=\"$any(message)\"\n                   [ngTemplateOutletContext]=\"{ $implicit: tooltipContext }\"></ng-template>\n    </ng-template>\n    <ng-template #msgStrTpl>{{message}}</ng-template>\n  </div>\n</div>\n", styles: [".mdc-tooltip__surface{word-break:break-all;word-break:var(--mdc-tooltip-word-break, normal);overflow-wrap:anywhere}.mdc-tooltip--showing-transition .mdc-tooltip__surface-animation{transition:opacity .15s 0ms cubic-bezier(0,0,.2,1),transform .15s 0ms cubic-bezier(0,0,.2,1)}.mdc-tooltip--hide-transition .mdc-tooltip__surface-animation{transition:opacity 75ms 0ms cubic-bezier(.4,0,1,1)}.mdc-tooltip{position:fixed;display:none;z-index:9}.mdc-tooltip-wrapper--rich{position:relative}.mdc-tooltip--shown,.mdc-tooltip--showing,.mdc-tooltip--hide{display:inline-flex}.mdc-tooltip--shown.mdc-tooltip--rich,.mdc-tooltip--showing.mdc-tooltip--rich,.mdc-tooltip--hide.mdc-tooltip--rich{display:inline-block;left:-320px;position:absolute}.mdc-tooltip__surface{line-height:16px;padding:4px 8px;min-width:40px;max-width:200px;min-height:24px;max-height:40vh;box-sizing:border-box;overflow:hidden;text-align:center}.mdc-tooltip__surface:before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid transparent;border-radius:inherit;content:\"\";pointer-events:none}@media screen and (forced-colors: active){.mdc-tooltip__surface:before{border-color:CanvasText}}.mdc-tooltip--rich .mdc-tooltip__surface{align-items:flex-start;display:flex;flex-direction:column;min-height:24px;min-width:40px;max-width:320px;position:relative}.mdc-tooltip--multiline .mdc-tooltip__surface{text-align:left}[dir=rtl] .mdc-tooltip--multiline .mdc-tooltip__surface,.mdc-tooltip--multiline .mdc-tooltip__surface[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__title{margin:0 8px}.mdc-tooltip__surface .mdc-tooltip__content{max-width:184px;margin:8px;text-align:left}[dir=rtl] .mdc-tooltip__surface .mdc-tooltip__content,.mdc-tooltip__surface .mdc-tooltip__content[dir=rtl]{text-align:right}.mdc-tooltip--rich .mdc-tooltip__surface .mdc-tooltip__content{max-width:304px;align-self:stretch}.mdc-tooltip__surface .mdc-tooltip__content-link{text-decoration:none}.mdc-tooltip--rich-actions,.mdc-tooltip__content,.mdc-tooltip__title{z-index:1}.mdc-tooltip__surface-animation{opacity:0;transform:scale(.8);will-change:transform,opacity}.mdc-tooltip--shown .mdc-tooltip__surface-animation{transform:scale(1);opacity:1}.mdc-tooltip--hide .mdc-tooltip__surface-animation{transform:scale(1)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{position:absolute;height:24px;width:24px;transform:rotate(35deg) skewY(20deg) scaleX(.9396926208)}.mdc-tooltip__caret-surface-top .mdc-elevation-overlay,.mdc-tooltip__caret-surface-bottom .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip__caret-surface-bottom{box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f;outline:1px solid transparent;z-index:-1}@media screen and (forced-colors: active){.mdc-tooltip__caret-surface-bottom{outline-color:CanvasText}}.mtx-mdc-tooltip{--mdc-plain-tooltip-container-shape: 4px;--mdc-plain-tooltip-supporting-text-line-height: 16px}.mtx-mdc-tooltip .mdc-tooltip__surface{background-color:var(--mdc-plain-tooltip-container-color)}.mtx-mdc-tooltip .mdc-tooltip__surface,.mtx-mdc-tooltip .mdc-tooltip__caret-surface-top,.mtx-mdc-tooltip .mdc-tooltip__caret-surface-bottom{border-radius:var(--mdc-plain-tooltip-container-shape)}.mtx-mdc-tooltip .mdc-tooltip__surface{color:var(--mdc-plain-tooltip-supporting-text-color)}.mtx-mdc-tooltip .mdc-tooltip__surface{font-family:var(--mdc-plain-tooltip-supporting-text-font);line-height:var(--mdc-plain-tooltip-supporting-text-line-height);font-size:var(--mdc-plain-tooltip-supporting-text-size);font-weight:var(--mdc-plain-tooltip-supporting-text-weight);letter-spacing:var(--mdc-plain-tooltip-supporting-text-tracking)}.mdc-tooltip.mat-mdc-tooltip,.mdc-tooltip.mtx-mdc-tooltip{position:relative}.mtx-mdc-tooltip{position:relative;transform:scale(0)}.mtx-mdc-tooltip:before{content:\"\";inset:0;z-index:-1;position:absolute}.mtx-mdc-tooltip-panel-below .mtx-mdc-tooltip:before{top:-8px}.mtx-mdc-tooltip-panel-above .mtx-mdc-tooltip:before{bottom:-8px}.mtx-mdc-tooltip-panel-right .mtx-mdc-tooltip:before{left:-8px}.mtx-mdc-tooltip-panel-left .mtx-mdc-tooltip:before{right:-8px}.mtx-mdc-tooltip._mtx-animation-noopable{animation:none;transform:scale(1)}.mtx-mdc-tooltip-panel-non-interactive{pointer-events:none}@keyframes mtx-mdc-tooltip-show{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes mtx-mdc-tooltip-hide{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.mtx-mdc-tooltip-show{animation:mtx-mdc-tooltip-show .15s cubic-bezier(0,0,.2,1) forwards}.mtx-mdc-tooltip-hide{animation:mtx-mdc-tooltip-hide 75ms cubic-bezier(.4,0,1,1) forwards}\n"], dependencies: [{ kind: "directive", type: i5.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i5.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: i6.MtxIsTemplateRefPipe, name: "isTemplateRef" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: TooltipComponent, deps: [{ token: i0.ChangeDetectorRef }, { token: i0.ElementRef }, { token: ANIMATION_MODULE_TYPE, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
+    /** @nocollapse */ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "17.1.0", type: TooltipComponent, isStandalone: true, selector: "mtx-tooltip-component", host: { attributes: { "aria-hidden": "true" }, listeners: { "mouseleave": "_handleMouseLeave($event)" }, properties: { "style.zoom": "isVisible() ? 1 : null" } }, viewQueries: [{ propertyName: "_tooltip", first: true, predicate: ["tooltip"], descendants: true, static: true }], ngImport: i0, template: "<div #tooltip\n  class=\"mdc-tooltip mdc-tooltip--shown mtx-mdc-tooltip\"\n  [ngClass]=\"tooltipClass\"\n  (animationend)=\"_handleAnimationEnd($event)\"\n  [class.mdc-tooltip--multiline]=\"_isMultiline\">\n  <div class=\"mdc-tooltip__surface mdc-tooltip__surface-animation\">\n    @if (message | isTemplateRef) {\n      <ng-template [ngTemplateOutlet]=\"$any(message)\"\n      [ngTemplateOutletContext]=\"{ $implicit: tooltipContext }\"></ng-template>\n    } @else {\n      {{message}}\n    }\n  </div>\n</div>\n", styles: [".mdc-tooltip__surface{word-break:break-all;word-break:var(--mdc-tooltip-word-break, normal);overflow-wrap:anywhere}.mdc-tooltip--showing-transition .mdc-tooltip__surface-animation{transition:opacity .15s 0ms cubic-bezier(0,0,.2,1),transform .15s 0ms cubic-bezier(0,0,.2,1)}.mdc-tooltip--hide-transition .mdc-tooltip__surface-animation{transition:opacity 75ms 0ms cubic-bezier(.4,0,1,1)}.mdc-tooltip{position:fixed;display:none;z-index:9}.mdc-tooltip-wrapper--rich{position:relative}.mdc-tooltip--shown,.mdc-tooltip--showing,.mdc-tooltip--hide{display:inline-flex}.mdc-tooltip--shown.mdc-tooltip--rich,.mdc-tooltip--showing.mdc-tooltip--rich,.mdc-tooltip--hide.mdc-tooltip--rich{display:inline-block;left:-320px;position:absolute}.mdc-tooltip__surface{line-height:16px;padding:4px 8px;min-width:40px;max-width:200px;min-height:24px;max-height:40vh;box-sizing:border-box;overflow:hidden;text-align:center}.mdc-tooltip__surface:before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid transparent;border-radius:inherit;content:\"\";pointer-events:none}@media screen and (forced-colors: active){.mdc-tooltip__surface:before{border-color:CanvasText}}.mdc-tooltip--rich .mdc-tooltip__surface{align-items:flex-start;display:flex;flex-direction:column;min-height:24px;min-width:40px;max-width:320px;position:relative}.mdc-tooltip--multiline .mdc-tooltip__surface{text-align:left}[dir=rtl] .mdc-tooltip--multiline .mdc-tooltip__surface,.mdc-tooltip--multiline .mdc-tooltip__surface[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__title{margin:0 8px}.mdc-tooltip__surface .mdc-tooltip__content{max-width:184px;margin:8px;text-align:left}[dir=rtl] .mdc-tooltip__surface .mdc-tooltip__content,.mdc-tooltip__surface .mdc-tooltip__content[dir=rtl]{text-align:right}.mdc-tooltip--rich .mdc-tooltip__surface .mdc-tooltip__content{max-width:304px;align-self:stretch}.mdc-tooltip__surface .mdc-tooltip__content-link{text-decoration:none}.mdc-tooltip--rich-actions,.mdc-tooltip__content,.mdc-tooltip__title{z-index:1}.mdc-tooltip__surface-animation{opacity:0;transform:scale(.8);will-change:transform,opacity}.mdc-tooltip--shown .mdc-tooltip__surface-animation{transform:scale(1);opacity:1}.mdc-tooltip--hide .mdc-tooltip__surface-animation{transform:scale(1)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{position:absolute;height:24px;width:24px;transform:rotate(35deg) skewY(20deg) scaleX(.9396926208)}.mdc-tooltip__caret-surface-top .mdc-elevation-overlay,.mdc-tooltip__caret-surface-bottom .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip__caret-surface-bottom{box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f;outline:1px solid transparent;z-index:-1}@media screen and (forced-colors: active){.mdc-tooltip__caret-surface-bottom{outline-color:CanvasText}}.mtx-mdc-tooltip .mdc-tooltip__surface{background-color:var(--mdc-plain-tooltip-container-color)}.mtx-mdc-tooltip .mdc-tooltip__surface,.mtx-mdc-tooltip .mdc-tooltip__caret-surface-top,.mtx-mdc-tooltip .mdc-tooltip__caret-surface-bottom{border-radius:var(--mdc-plain-tooltip-container-shape)}.mtx-mdc-tooltip .mdc-tooltip__surface{color:var(--mdc-plain-tooltip-supporting-text-color)}.mtx-mdc-tooltip .mdc-tooltip__surface{font-family:var(--mdc-plain-tooltip-supporting-text-font);line-height:var(--mdc-plain-tooltip-supporting-text-line-height);font-size:var(--mdc-plain-tooltip-supporting-text-size);font-weight:var(--mdc-plain-tooltip-supporting-text-weight);letter-spacing:var(--mdc-plain-tooltip-supporting-text-tracking)}.mdc-tooltip.mat-mdc-tooltip,.mdc-tooltip.mtx-mdc-tooltip{position:relative}.mtx-mdc-tooltip{position:relative;transform:scale(0)}.mtx-mdc-tooltip:before{content:\"\";inset:0;z-index:-1;position:absolute}.mtx-mdc-tooltip-panel-below .mtx-mdc-tooltip:before{top:-8px}.mtx-mdc-tooltip-panel-above .mtx-mdc-tooltip:before{bottom:-8px}.mtx-mdc-tooltip-panel-right .mtx-mdc-tooltip:before{left:-8px}.mtx-mdc-tooltip-panel-left .mtx-mdc-tooltip:before{right:-8px}.mtx-mdc-tooltip._mtx-animation-noopable{animation:none;transform:scale(1)}.mtx-mdc-tooltip-panel.mtx-mdc-tooltip-panel-non-interactive{pointer-events:none}@keyframes mtx-mdc-tooltip-show{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes mtx-mdc-tooltip-hide{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.mtx-mdc-tooltip-show{animation:mtx-mdc-tooltip-show .15s cubic-bezier(0,0,.2,1) forwards}.mtx-mdc-tooltip-hide{animation:mtx-mdc-tooltip-hide 75ms cubic-bezier(.4,0,1,1) forwards}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: MtxIsTemplateRefPipe, name: "isTemplateRef" }], changeDetection: i0.ChangeDetectionStrategy.OnPush, encapsulation: i0.ViewEncapsulation.None }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: TooltipComponent, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: TooltipComponent, decorators: [{
             type: Component,
             args: [{ selector: 'mtx-tooltip-component', encapsulation: ViewEncapsulation.None, changeDetection: ChangeDetectionStrategy.OnPush, host: {
                         // Forces the element to have a layout in IE and Edge. This fixes issues where the element
@@ -915,13 +901,13 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
                         '[style.zoom]': 'isVisible() ? 1 : null',
                         '(mouseleave)': '_handleMouseLeave($event)',
                         'aria-hidden': 'true',
-                    }, template: "<div #tooltip\n     class=\"mdc-tooltip mdc-tooltip--shown mtx-mdc-tooltip\"\n     [ngClass]=\"tooltipClass\"\n     (animationend)=\"_handleAnimationEnd($event)\"\n     [class.mdc-tooltip--multiline]=\"_isMultiline\">\n  <div class=\"mdc-tooltip__surface mdc-tooltip__surface-animation\">\n    <ng-template [ngIf]=\"message | isTemplateRef\" [ngIfElse]=\"msgStrTpl\">\n      <ng-template [ngTemplateOutlet]=\"$any(message)\"\n                   [ngTemplateOutletContext]=\"{ $implicit: tooltipContext }\"></ng-template>\n    </ng-template>\n    <ng-template #msgStrTpl>{{message}}</ng-template>\n  </div>\n</div>\n", styles: [".mdc-tooltip__surface{word-break:break-all;word-break:var(--mdc-tooltip-word-break, normal);overflow-wrap:anywhere}.mdc-tooltip--showing-transition .mdc-tooltip__surface-animation{transition:opacity .15s 0ms cubic-bezier(0,0,.2,1),transform .15s 0ms cubic-bezier(0,0,.2,1)}.mdc-tooltip--hide-transition .mdc-tooltip__surface-animation{transition:opacity 75ms 0ms cubic-bezier(.4,0,1,1)}.mdc-tooltip{position:fixed;display:none;z-index:9}.mdc-tooltip-wrapper--rich{position:relative}.mdc-tooltip--shown,.mdc-tooltip--showing,.mdc-tooltip--hide{display:inline-flex}.mdc-tooltip--shown.mdc-tooltip--rich,.mdc-tooltip--showing.mdc-tooltip--rich,.mdc-tooltip--hide.mdc-tooltip--rich{display:inline-block;left:-320px;position:absolute}.mdc-tooltip__surface{line-height:16px;padding:4px 8px;min-width:40px;max-width:200px;min-height:24px;max-height:40vh;box-sizing:border-box;overflow:hidden;text-align:center}.mdc-tooltip__surface:before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid transparent;border-radius:inherit;content:\"\";pointer-events:none}@media screen and (forced-colors: active){.mdc-tooltip__surface:before{border-color:CanvasText}}.mdc-tooltip--rich .mdc-tooltip__surface{align-items:flex-start;display:flex;flex-direction:column;min-height:24px;min-width:40px;max-width:320px;position:relative}.mdc-tooltip--multiline .mdc-tooltip__surface{text-align:left}[dir=rtl] .mdc-tooltip--multiline .mdc-tooltip__surface,.mdc-tooltip--multiline .mdc-tooltip__surface[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__title{margin:0 8px}.mdc-tooltip__surface .mdc-tooltip__content{max-width:184px;margin:8px;text-align:left}[dir=rtl] .mdc-tooltip__surface .mdc-tooltip__content,.mdc-tooltip__surface .mdc-tooltip__content[dir=rtl]{text-align:right}.mdc-tooltip--rich .mdc-tooltip__surface .mdc-tooltip__content{max-width:304px;align-self:stretch}.mdc-tooltip__surface .mdc-tooltip__content-link{text-decoration:none}.mdc-tooltip--rich-actions,.mdc-tooltip__content,.mdc-tooltip__title{z-index:1}.mdc-tooltip__surface-animation{opacity:0;transform:scale(.8);will-change:transform,opacity}.mdc-tooltip--shown .mdc-tooltip__surface-animation{transform:scale(1);opacity:1}.mdc-tooltip--hide .mdc-tooltip__surface-animation{transform:scale(1)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{position:absolute;height:24px;width:24px;transform:rotate(35deg) skewY(20deg) scaleX(.9396926208)}.mdc-tooltip__caret-surface-top .mdc-elevation-overlay,.mdc-tooltip__caret-surface-bottom .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip__caret-surface-bottom{box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f;outline:1px solid transparent;z-index:-1}@media screen and (forced-colors: active){.mdc-tooltip__caret-surface-bottom{outline-color:CanvasText}}.mtx-mdc-tooltip{--mdc-plain-tooltip-container-shape: 4px;--mdc-plain-tooltip-supporting-text-line-height: 16px}.mtx-mdc-tooltip .mdc-tooltip__surface{background-color:var(--mdc-plain-tooltip-container-color)}.mtx-mdc-tooltip .mdc-tooltip__surface,.mtx-mdc-tooltip .mdc-tooltip__caret-surface-top,.mtx-mdc-tooltip .mdc-tooltip__caret-surface-bottom{border-radius:var(--mdc-plain-tooltip-container-shape)}.mtx-mdc-tooltip .mdc-tooltip__surface{color:var(--mdc-plain-tooltip-supporting-text-color)}.mtx-mdc-tooltip .mdc-tooltip__surface{font-family:var(--mdc-plain-tooltip-supporting-text-font);line-height:var(--mdc-plain-tooltip-supporting-text-line-height);font-size:var(--mdc-plain-tooltip-supporting-text-size);font-weight:var(--mdc-plain-tooltip-supporting-text-weight);letter-spacing:var(--mdc-plain-tooltip-supporting-text-tracking)}.mdc-tooltip.mat-mdc-tooltip,.mdc-tooltip.mtx-mdc-tooltip{position:relative}.mtx-mdc-tooltip{position:relative;transform:scale(0)}.mtx-mdc-tooltip:before{content:\"\";inset:0;z-index:-1;position:absolute}.mtx-mdc-tooltip-panel-below .mtx-mdc-tooltip:before{top:-8px}.mtx-mdc-tooltip-panel-above .mtx-mdc-tooltip:before{bottom:-8px}.mtx-mdc-tooltip-panel-right .mtx-mdc-tooltip:before{left:-8px}.mtx-mdc-tooltip-panel-left .mtx-mdc-tooltip:before{right:-8px}.mtx-mdc-tooltip._mtx-animation-noopable{animation:none;transform:scale(1)}.mtx-mdc-tooltip-panel-non-interactive{pointer-events:none}@keyframes mtx-mdc-tooltip-show{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes mtx-mdc-tooltip-hide{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.mtx-mdc-tooltip-show{animation:mtx-mdc-tooltip-show .15s cubic-bezier(0,0,.2,1) forwards}.mtx-mdc-tooltip-hide{animation:mtx-mdc-tooltip-hide 75ms cubic-bezier(.4,0,1,1) forwards}\n"] }]
-        }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: undefined, decorators: [{
+                    }, standalone: true, imports: [NgClass, NgTemplateOutlet, MtxIsTemplateRefPipe], template: "<div #tooltip\n  class=\"mdc-tooltip mdc-tooltip--shown mtx-mdc-tooltip\"\n  [ngClass]=\"tooltipClass\"\n  (animationend)=\"_handleAnimationEnd($event)\"\n  [class.mdc-tooltip--multiline]=\"_isMultiline\">\n  <div class=\"mdc-tooltip__surface mdc-tooltip__surface-animation\">\n    @if (message | isTemplateRef) {\n      <ng-template [ngTemplateOutlet]=\"$any(message)\"\n      [ngTemplateOutletContext]=\"{ $implicit: tooltipContext }\"></ng-template>\n    } @else {\n      {{message}}\n    }\n  </div>\n</div>\n", styles: [".mdc-tooltip__surface{word-break:break-all;word-break:var(--mdc-tooltip-word-break, normal);overflow-wrap:anywhere}.mdc-tooltip--showing-transition .mdc-tooltip__surface-animation{transition:opacity .15s 0ms cubic-bezier(0,0,.2,1),transform .15s 0ms cubic-bezier(0,0,.2,1)}.mdc-tooltip--hide-transition .mdc-tooltip__surface-animation{transition:opacity 75ms 0ms cubic-bezier(.4,0,1,1)}.mdc-tooltip{position:fixed;display:none;z-index:9}.mdc-tooltip-wrapper--rich{position:relative}.mdc-tooltip--shown,.mdc-tooltip--showing,.mdc-tooltip--hide{display:inline-flex}.mdc-tooltip--shown.mdc-tooltip--rich,.mdc-tooltip--showing.mdc-tooltip--rich,.mdc-tooltip--hide.mdc-tooltip--rich{display:inline-block;left:-320px;position:absolute}.mdc-tooltip__surface{line-height:16px;padding:4px 8px;min-width:40px;max-width:200px;min-height:24px;max-height:40vh;box-sizing:border-box;overflow:hidden;text-align:center}.mdc-tooltip__surface:before{position:absolute;box-sizing:border-box;width:100%;height:100%;top:0;left:0;border:1px solid transparent;border-radius:inherit;content:\"\";pointer-events:none}@media screen and (forced-colors: active){.mdc-tooltip__surface:before{border-color:CanvasText}}.mdc-tooltip--rich .mdc-tooltip__surface{align-items:flex-start;display:flex;flex-direction:column;min-height:24px;min-width:40px;max-width:320px;position:relative}.mdc-tooltip--multiline .mdc-tooltip__surface{text-align:left}[dir=rtl] .mdc-tooltip--multiline .mdc-tooltip__surface,.mdc-tooltip--multiline .mdc-tooltip__surface[dir=rtl]{text-align:right}.mdc-tooltip__surface .mdc-tooltip__title{margin:0 8px}.mdc-tooltip__surface .mdc-tooltip__content{max-width:184px;margin:8px;text-align:left}[dir=rtl] .mdc-tooltip__surface .mdc-tooltip__content,.mdc-tooltip__surface .mdc-tooltip__content[dir=rtl]{text-align:right}.mdc-tooltip--rich .mdc-tooltip__surface .mdc-tooltip__content{max-width:304px;align-self:stretch}.mdc-tooltip__surface .mdc-tooltip__content-link{text-decoration:none}.mdc-tooltip--rich-actions,.mdc-tooltip__content,.mdc-tooltip__title{z-index:1}.mdc-tooltip__surface-animation{opacity:0;transform:scale(.8);will-change:transform,opacity}.mdc-tooltip--shown .mdc-tooltip__surface-animation{transform:scale(1);opacity:1}.mdc-tooltip--hide .mdc-tooltip__surface-animation{transform:scale(1)}.mdc-tooltip__caret-surface-top,.mdc-tooltip__caret-surface-bottom{position:absolute;height:24px;width:24px;transform:rotate(35deg) skewY(20deg) scaleX(.9396926208)}.mdc-tooltip__caret-surface-top .mdc-elevation-overlay,.mdc-tooltip__caret-surface-bottom .mdc-elevation-overlay{width:100%;height:100%;top:0;left:0}.mdc-tooltip__caret-surface-bottom{box-shadow:0 3px 1px -2px #0003,0 2px 2px #00000024,0 1px 5px #0000001f;outline:1px solid transparent;z-index:-1}@media screen and (forced-colors: active){.mdc-tooltip__caret-surface-bottom{outline-color:CanvasText}}.mtx-mdc-tooltip .mdc-tooltip__surface{background-color:var(--mdc-plain-tooltip-container-color)}.mtx-mdc-tooltip .mdc-tooltip__surface,.mtx-mdc-tooltip .mdc-tooltip__caret-surface-top,.mtx-mdc-tooltip .mdc-tooltip__caret-surface-bottom{border-radius:var(--mdc-plain-tooltip-container-shape)}.mtx-mdc-tooltip .mdc-tooltip__surface{color:var(--mdc-plain-tooltip-supporting-text-color)}.mtx-mdc-tooltip .mdc-tooltip__surface{font-family:var(--mdc-plain-tooltip-supporting-text-font);line-height:var(--mdc-plain-tooltip-supporting-text-line-height);font-size:var(--mdc-plain-tooltip-supporting-text-size);font-weight:var(--mdc-plain-tooltip-supporting-text-weight);letter-spacing:var(--mdc-plain-tooltip-supporting-text-tracking)}.mdc-tooltip.mat-mdc-tooltip,.mdc-tooltip.mtx-mdc-tooltip{position:relative}.mtx-mdc-tooltip{position:relative;transform:scale(0)}.mtx-mdc-tooltip:before{content:\"\";inset:0;z-index:-1;position:absolute}.mtx-mdc-tooltip-panel-below .mtx-mdc-tooltip:before{top:-8px}.mtx-mdc-tooltip-panel-above .mtx-mdc-tooltip:before{bottom:-8px}.mtx-mdc-tooltip-panel-right .mtx-mdc-tooltip:before{left:-8px}.mtx-mdc-tooltip-panel-left .mtx-mdc-tooltip:before{right:-8px}.mtx-mdc-tooltip._mtx-animation-noopable{animation:none;transform:scale(1)}.mtx-mdc-tooltip-panel.mtx-mdc-tooltip-panel-non-interactive{pointer-events:none}@keyframes mtx-mdc-tooltip-show{0%{opacity:0;transform:scale(.8)}to{opacity:1;transform:scale(1)}}@keyframes mtx-mdc-tooltip-hide{0%{opacity:1;transform:scale(1)}to{opacity:0;transform:scale(.8)}}.mtx-mdc-tooltip-show{animation:mtx-mdc-tooltip-show .15s cubic-bezier(0,0,.2,1) forwards}.mtx-mdc-tooltip-hide{animation:mtx-mdc-tooltip-hide 75ms cubic-bezier(.4,0,1,1) forwards}\n"] }]
+        }], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.ElementRef }, { type: undefined, decorators: [{
                     type: Optional
                 }, {
                     type: Inject,
                     args: [ANIMATION_MODULE_TYPE]
-                }] }]; }, propDecorators: { _tooltip: [{
+                }] }], propDecorators: { _tooltip: [{
                 type: ViewChild,
                 args: ['tooltip', {
                         // Use a static query here since we interact directly with
@@ -931,16 +917,33 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImpor
             }] } });
 
 class MtxTooltipModule {
-    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: MtxTooltipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
-    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "16.2.7", ngImport: i0, type: MtxTooltipModule, declarations: [MtxTooltip, TooltipComponent], imports: [A11yModule, CommonModule, OverlayModule, MatCommonModule, MtxPipesModule], exports: [MtxTooltip, TooltipComponent, MatCommonModule, CdkScrollableModule] }); }
-    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: MtxTooltipModule, providers: [MTX_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER], imports: [A11yModule, CommonModule, OverlayModule, MatCommonModule, MtxPipesModule, MatCommonModule, CdkScrollableModule] }); }
+    /** @nocollapse */ static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxTooltipModule, deps: [], target: i0.ɵɵFactoryTarget.NgModule }); }
+    /** @nocollapse */ static { this.ɵmod = i0.ɵɵngDeclareNgModule({ minVersion: "14.0.0", version: "17.1.0", ngImport: i0, type: MtxTooltipModule, imports: [A11yModule,
+            CommonModule,
+            OverlayModule,
+            MatCommonModule,
+            MtxPipesModule,
+            MtxTooltip,
+            TooltipComponent], exports: [MtxTooltip, TooltipComponent, MatCommonModule, CdkScrollableModule] }); }
+    /** @nocollapse */ static { this.ɵinj = i0.ɵɵngDeclareInjector({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxTooltipModule, providers: [MTX_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER], imports: [A11yModule,
+            CommonModule,
+            OverlayModule,
+            MatCommonModule,
+            MtxPipesModule, MatCommonModule, CdkScrollableModule] }); }
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.2.7", ngImport: i0, type: MtxTooltipModule, decorators: [{
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.1.0", ngImport: i0, type: MtxTooltipModule, decorators: [{
             type: NgModule,
             args: [{
-                    imports: [A11yModule, CommonModule, OverlayModule, MatCommonModule, MtxPipesModule],
+                    imports: [
+                        A11yModule,
+                        CommonModule,
+                        OverlayModule,
+                        MatCommonModule,
+                        MtxPipesModule,
+                        MtxTooltip,
+                        TooltipComponent,
+                    ],
                     exports: [MtxTooltip, TooltipComponent, MatCommonModule, CdkScrollableModule],
-                    declarations: [MtxTooltip, TooltipComponent],
                     providers: [MTX_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER],
                 }]
         }] });
@@ -965,5 +968,5 @@ const matTooltipAnimations = {
  * Generated bundle index. Do not edit.
  */
 
-export { MTX_TOOLTIP_DEFAULT_OPTIONS, MTX_TOOLTIP_DEFAULT_OPTIONS_FACTORY, MTX_TOOLTIP_SCROLL_STRATEGY, MTX_TOOLTIP_SCROLL_STRATEGY_FACTORY, MTX_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER, MtxTooltip, MtxTooltipModule, SCROLL_THROTTLE_MS, TOOLTIP_PANEL_CLASS, TooltipComponent, _MtxTooltipBase, _TooltipComponentBase, getMtxTooltipInvalidPositionError, matTooltipAnimations };
+export { MTX_TOOLTIP_DEFAULT_OPTIONS, MTX_TOOLTIP_DEFAULT_OPTIONS_FACTORY, MTX_TOOLTIP_SCROLL_STRATEGY, MTX_TOOLTIP_SCROLL_STRATEGY_FACTORY, MTX_TOOLTIP_SCROLL_STRATEGY_FACTORY_PROVIDER, MtxTooltip, MtxTooltipModule, SCROLL_THROTTLE_MS, TOOLTIP_PANEL_CLASS, TooltipComponent, getMtxTooltipInvalidPositionError, matTooltipAnimations };
 //# sourceMappingURL=mtxTooltip.mjs.map