npm - @testgorilla/tgo-ui - Versions diffs - 7.9.1 → 7.11.0 - Mend

@testgorilla/tgo-ui 7.9.1 → 7.11.0

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.

Files changed (60) hide show

package/fesm2022/testgorilla-tgo-ui-components-badge.mjs CHANGED Viewed

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Input, Optional, Inject, Component, NgModule } from '@angular/core';
+import { input, Input, Optional, Inject, Component, NgModule } from '@angular/core';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
 import * as i2 from '@testgorilla/tgo-ui/components/icon';
@@ -69,6 +69,22 @@ class BadgeComponent {
          * @memberof BadgeComponent
          */
         this.icon = '';
+        /**
+         * Override color for the leading icon. Accepts any value the `ui-icon`
+         * `color` input accepts (named token, hex, or CSS custom property).
+         * When unset, falls back to the auto-derived color based on the badge background.
+         */
+        this.iconColor = input(undefined);
+        /**
+         * Optional trailing icon, rendered after the label/static label on the primary variant.
+         */
+        this.trailingIcon = input('');
+        /**
+         * Override color for the trailing icon. Accepts any value the `ui-icon`
+         * `color` input accepts (named token, hex, or CSS custom property).
+         * When unset, falls back to the auto-derived color based on the badge background.
+         */
+        this.trailingIconColor = input(undefined);
         /**
          * The color of the badge. Defaults to 'petrol'.
          * @type {BadgeColor}
@@ -129,18 +145,24 @@ class BadgeComponent {
             this.applicationTheme = defaultAppTheme;
         }
     }
-    get iconColor() {
+    get autoIconColor() {
         return this.darkColors.includes(this.isClassicTheme ? this.color : this.rebrandColor) ? 'black' : 'white';
     }
+    get resolvedIconColor() {
+        return this.iconColor() ?? this.autoIconColor;
+    }
+    get resolvedTrailingIconColor() {
+        return this.trailingIconColor() ?? this.autoIconColor;
+    }
     get isClassicTheme() {
         return this.applicationTheme === 'classic';
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: BadgeComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.20", type: BadgeComponent, isStandalone: false, selector: "ui-badge", inputs: { label: "label", staticLabel: "staticLabel", icon: "icon", color: "color", variant: "variant", notificationsAmount: "notificationsAmount", applicationTheme: "applicationTheme", rebrandColor: "rebrandColor", truncateLabel: "truncateLabel", enableAnimation: "enableAnimation" }, ngImport: i0, template: "<div\n  [class]=\"'badge badge-container-' + variant\"\n  [class.no-label]=\"!label && !staticLabel\"\n  [attr.aria-label]=\"label + (staticLabel ? ' ' + staticLabel : '')\"\n  [attr.theme]=\"applicationTheme\"\n  [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n  [matTooltip]=\"\n    label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4)\n      ? label + (staticLabel ? ' ' + staticLabel : '')\n      : ''\n  \"\n  [matTooltipClass]=\"applicationTheme\"\n>\n  <ng-container [ngSwitch]=\"variant\">\n    <ng-container *ngSwitchCase=\"badgeVariant.PRIMARY\">\n      <ui-icon *ngIf=\"icon\" [class.badge-icon]=\"!!label\" [name]=\"icon\" [color]=\"iconColor\"></ui-icon>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"badgeVariant.PRIMARY_AI\">\n      <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"badgeVariant.SECONDARY_AI\">\n      <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n    </ng-container>\n    <div\n      *ngSwitchCase=\"badgeVariant.SECONDARY\"\n      class=\"point\"\n      [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n    ></div>\n    <div *ngSwitchCase=\"badgeVariant.NOTIFICATION\" class=\"number-notification\">{{ notificationsAmount }}</div>\n  </ng-container>\n  <div\n    class=\"label\"\n    *ngIf=\"variant !== badgeVariant.NOTIFICATION\"\n    [class.empty]=\"!label && !staticLabel\"\n    [class.animated]=\"enableAnimation\"\n  >\n    {{\n      label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4) && truncateLabel\n        ? (label | slice: 0 : 25 - (staticLabel.length < 4 ? staticLabel.length : 4)) + '...'\n        : label\n    }}\n  </div>\n  <span *ngIf=\"staticLabel && variant !== badgeVariant.NOTIFICATION\" class=\"static-label\">{{\n    staticLabel | slice: 0 : 4\n  }}</span>\n</div>\n\n<ng-template #aiIconTpl>\n  <ui-icon class=\"badge-icon\" [name]=\"'Sparkle-in-line'\" [color]=\"'ai'\"></ui-icon>\n</ng-template>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{display:block}:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai,:host .badge-container-notification{width:fit-content}:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai{height:24px;padding:0 8px;border-radius:21px;color:#fff;line-height:10px;transition:all .2s ease-out}:host .badge-container-primary .label,:host .badge-container-primary-ai .label,:host .badge-container-secondary .label,:host .badge-container-secondary-ai .label{font-size:12px;line-height:14px}:host .badge-container-primary .label.animated,:host .badge-container-primary-ai .label.animated,:host .badge-container-secondary .label.animated,:host .badge-container-secondary-ai .label.animated{display:inline-block;max-width:500px;opacity:1;overflow:hidden;white-space:nowrap;transition:max-width .25s ease-in-out,opacity .2s ease-in-out;will-change:max-width,opacity;contain:layout style}:host .badge-container-primary .label.empty,:host .badge-container-primary-ai .label.empty,:host .badge-container-secondary .label.empty,:host .badge-container-secondary-ai .label.empty{max-width:0;opacity:0}:host .badge-container-primary .static-label,:host .badge-container-primary-ai .static-label,:host .badge-container-secondary .static-label,:host .badge-container-secondary-ai .static-label{font-size:12px;line-height:14px;white-space:nowrap;flex-shrink:0;margin-left:2px}:host .badge-container-primary .badge-icon:not(:last-child),:host .badge-container-primary-ai .badge-icon:not(:last-child),:host .badge-container-secondary .badge-icon:not(:last-child),:host .badge-container-secondary-ai .badge-icon:not(:last-child){margin-right:8px}:host .badge-container-primary.no-label .badge-icon,:host .badge-container-primary-ai.no-label .badge-icon,:host .badge-container-secondary.no-label .badge-icon,:host .badge-container-secondary-ai.no-label .badge-icon{margin-right:0}:host .badge-container-secondary{padding:0}:host .badge-container-primary-ai.no-label{padding:4px}:host .badge-container-secondary .point,:host .badge-container-secondary-ai .point{border-radius:50%;padding:4px;margin-right:8px}:host .badge-container-secondary .label,:host .badge-container-secondary-ai .label{color:#000!important;width:100%}:host .badge-container-secondary[theme=dark],:host .badge-container-secondary[theme=light],:host .badge-container-secondary-ai[theme=dark],:host .badge-container-secondary-ai[theme=light]{color:#242424}:host .badge-container-secondary .badge-icon:not(:last-child),:host .badge-container-secondary-ai .badge-icon:not(:last-child){margin-right:4px}:host .badge-container-notification{min-width:20px;height:20px;border-radius:50%;color:#fff;line-height:10px}:host .badge-container-notification .label{font-size:12px}:host .badge-container-notification[theme=dark],:host .badge-container-notification[theme=light]{background:#242424!important;color:#fff!important;border-color:1px solid #ffffff}:host .badge{width:100%!important;max-width:fit-content!important}:host .badge .label{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;box-sizing:border-box!important}.flex-center,:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai,:host .badge-container-notification{display:flex;align-items:center;justify-content:center}.background-colors[color=red],:host [color=red].badge-container-primary,:host [color=red].badge-container-primary-ai,:host .badge-container-secondary [color=red].point,:host .badge-container-secondary-ai [color=red].point,:host [color=red].badge-container-notification{background:#cb7b7a}.background-colors[color=grey-medium],:host [color=grey-medium].badge-container-primary,:host [color=grey-medium].badge-container-primary-ai,:host .badge-container-secondary [color=grey-medium].point,:host .badge-container-secondary-ai [color=grey-medium].point,:host [color=grey-medium].badge-container-notification{background:#e0e0e0;color:#000}.background-colors[color=teal],:host [color=teal].badge-container-primary,:host [color=teal].badge-container-primary-ai,:host .badge-container-secondary [color=teal].point,:host .badge-container-secondary-ai [color=teal].point,:host [color=teal].badge-container-notification{background:#46a997}.background-colors[color=yellow],:host [color=yellow].badge-container-primary,:host [color=yellow].badge-container-primary-ai,:host .badge-container-secondary [color=yellow].point,:host .badge-container-secondary-ai [color=yellow].point,:host [color=yellow].badge-container-notification{background:#cca45f}.background-colors[color=petrol],:host [color=petrol].badge-container-primary,:host [color=petrol].badge-container-primary-ai,:host .badge-container-secondary [color=petrol].point,:host .badge-container-secondary-ai [color=petrol].point,:host [color=petrol].badge-container-notification{background:#276678}.background-colors[color=teal-60w],:host [color=teal-60w].badge-container-primary,:host [color=teal-60w].badge-container-primary-ai,:host .badge-container-secondary [color=teal-60w].point,:host .badge-container-secondary-ai [color=teal-60w].point,:host [color=teal-60w].badge-container-notification{background:#b5ddd5;color:#000}.background-colors[color=petrol-90w],:host [color=petrol-90w].badge-container-primary,:host [color=petrol-90w].badge-container-primary-ai,:host .badge-container-secondary [color=petrol-90w].point,:host .badge-container-secondary-ai [color=petrol-90w].point,:host [color=petrol-90w].badge-container-notification{background:#e9f0f1;color:#000}.background-colors[color=petrol-60w],:host [color=petrol-60w].badge-container-primary,:host [color=petrol-60w].badge-container-primary-ai,:host .badge-container-secondary [color=petrol-60w].point,:host .badge-container-secondary-ai [color=petrol-60w].point,:host [color=petrol-60w].badge-container-notification{background:#a9c2c9;color:#000}.background-colors[color=grey-dark],:host [color=grey-dark].badge-container-primary,:host [color=grey-dark].badge-container-primary-ai,:host .badge-container-secondary [color=grey-dark].point,:host .badge-container-secondary-ai [color=grey-dark].point,:host [color=grey-dark].badge-container-notification{background:#888}.background-colors[color=success],:host [color=success].badge-container-primary,:host [color=success].badge-container-primary-ai,:host .badge-container-secondary [color=success].point,:host .badge-container-secondary-ai [color=success].point,:host [color=success].badge-container-notification{background:#d4f2c3;color:#242424}.background-colors[color=warning],:host [color=warning].badge-container-primary,:host [color=warning].badge-container-primary-ai,:host .badge-container-secondary [color=warning].point,:host .badge-container-secondary-ai [color=warning].point,:host [color=warning].badge-container-notification{background:#ffe1b3;color:#242424}.background-colors[color=negative],:host [color=negative].badge-container-primary,:host [color=negative].badge-container-primary-ai,:host .badge-container-secondary [color=negative].point,:host .badge-container-secondary-ai [color=negative].point,:host [color=negative].badge-container-notification{background:#ffac9a;color:#242424}.background-colors[color=info],:host [color=info].badge-container-primary,:host [color=info].badge-container-primary-ai,:host .badge-container-secondary [color=info].point,:host .badge-container-secondary-ai [color=info].point,:host [color=info].badge-container-notification{background:#d9e8ff;color:#242424}.background-colors[color=brand],:host [color=brand].badge-container-primary,:host [color=brand].badge-container-primary-ai,:host .badge-container-secondary [color=brand].point,:host .badge-container-secondary-ai [color=brand].point,:host [color=brand].badge-container-notification{background:#ffe6fa;color:#242424}.background-colors[color=neutral],:host [color=neutral].badge-container-primary,:host [color=neutral].badge-container-primary-ai,:host .badge-container-secondary [color=neutral].point,:host .badge-container-secondary-ai [color=neutral].point,:host [color=neutral].badge-container-notification{background:#e9e9e9;color:#242424}.background-colors[color=blue-20],:host [color=blue-20].badge-container-primary,:host [color=blue-20].badge-container-primary-ai,:host .badge-container-secondary [color=blue-20].point,:host .badge-container-secondary-ai [color=blue-20].point,:host [color=blue-20].badge-container-notification{background:#99c1fe;color:#242424}.background-colors[color=blue-30],:host [color=blue-30].badge-container-primary,:host [color=blue-30].badge-container-primary-ai,:host .badge-container-secondary [color=blue-30].point,:host .badge-container-secondary-ai [color=blue-30].point,:host [color=blue-30].badge-container-notification{background:#277cfd;color:#fff}.background-colors[color=blue-40],:host [color=blue-40].badge-container-primary,:host [color=blue-40].badge-container-primary-ai,:host .badge-container-secondary [color=blue-40].point,:host .badge-container-secondary-ai [color=blue-40].point,:host [color=blue-40].badge-container-notification{background:#0165fc;color:#fff}.background-colors[color=pink-30],:host [color=pink-30].badge-container-primary,:host [color=pink-30].badge-container-primary-ai,:host .badge-container-secondary [color=pink-30].point,:host .badge-container-secondary-ai [color=pink-30].point,:host [color=pink-30].badge-container-notification{background:#ffb3ee;color:#242424}.background-colors[color=blue-10],:host [color=blue-10].badge-container-primary,:host [color=blue-10].badge-container-primary-ai,:host .badge-container-secondary [color=blue-10].point,:host .badge-container-secondary-ai [color=blue-10].point,:host [color=blue-10].badge-container-notification{background:#d9e8ff;color:#242424}.background-colors[color=grey-30],:host [color=grey-30].badge-container-primary,:host [color=grey-30].badge-container-primary-ai,:host .badge-container-secondary [color=grey-30].point,:host .badge-container-secondary-ai [color=grey-30].point,:host [color=grey-30].badge-container-notification{background:#d3d3d3;color:#242424}.background-colors[color=grey-20],:host [color=grey-20].badge-container-primary,:host [color=grey-20].badge-container-primary-ai,:host .badge-container-secondary [color=grey-20].point,:host .badge-container-secondary-ai [color=grey-20].point,:host [color=grey-20].badge-container-notification{background:#e9e9e9;color:#242424}.background-colors[color=grey-10],:host [color=grey-10].badge-container-primary,:host [color=grey-10].badge-container-primary-ai,:host .badge-container-secondary [color=grey-10].point,:host .badge-container-secondary-ai [color=grey-10].point,:host [color=grey-10].badge-container-notification{background:#f4f4f4;color:#242424}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.20", type: BadgeComponent, isStandalone: false, selector: "ui-badge", inputs: { label: { classPropertyName: "label", publicName: "label", isSignal: false, isRequired: false, transformFunction: null }, staticLabel: { classPropertyName: "staticLabel", publicName: "staticLabel", isSignal: false, isRequired: false, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: false, isRequired: false, transformFunction: null }, iconColor: { classPropertyName: "iconColor", publicName: "iconColor", isSignal: true, isRequired: false, transformFunction: null }, trailingIcon: { classPropertyName: "trailingIcon", publicName: "trailingIcon", isSignal: true, isRequired: false, transformFunction: null }, trailingIconColor: { classPropertyName: "trailingIconColor", publicName: "trailingIconColor", isSignal: true, isRequired: false, transformFunction: null }, color: { classPropertyName: "color", publicName: "color", isSignal: false, isRequired: false, transformFunction: null }, variant: { classPropertyName: "variant", publicName: "variant", isSignal: false, isRequired: false, transformFunction: null }, notificationsAmount: { classPropertyName: "notificationsAmount", publicName: "notificationsAmount", isSignal: false, isRequired: false, transformFunction: null }, applicationTheme: { classPropertyName: "applicationTheme", publicName: "applicationTheme", isSignal: false, isRequired: false, transformFunction: null }, rebrandColor: { classPropertyName: "rebrandColor", publicName: "rebrandColor", isSignal: false, isRequired: false, transformFunction: null }, truncateLabel: { classPropertyName: "truncateLabel", publicName: "truncateLabel", isSignal: false, isRequired: false, transformFunction: null }, enableAnimation: { classPropertyName: "enableAnimation", publicName: "enableAnimation", isSignal: false, isRequired: false, transformFunction: null } }, ngImport: i0, template: "<div\n  [class]=\"'badge badge-container-' + variant\"\n  [class.no-label]=\"!label && !staticLabel && !trailingIcon()\"\n  [attr.aria-label]=\"label + (staticLabel ? ' ' + staticLabel : '')\"\n  [attr.theme]=\"applicationTheme\"\n  [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n  [matTooltip]=\"\n    label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4)\n      ? label + (staticLabel ? ' ' + staticLabel : '')\n      : ''\n  \"\n  [matTooltipClass]=\"applicationTheme\"\n>\n  <ng-container [ngSwitch]=\"variant\">\n    <ng-container *ngSwitchCase=\"badgeVariant.PRIMARY\">\n      <ui-icon\n        *ngIf=\"icon\"\n        [class.badge-icon]=\"!!label || !!staticLabel || !!trailingIcon\"\n        [name]=\"icon\"\n        [color]=\"resolvedIconColor\"\n      ></ui-icon>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"badgeVariant.PRIMARY_AI\">\n      <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"badgeVariant.SECONDARY_AI\">\n      <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n    </ng-container>\n    <div\n      *ngSwitchCase=\"badgeVariant.SECONDARY\"\n      class=\"point\"\n      [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n    ></div>\n    <div *ngSwitchCase=\"badgeVariant.NOTIFICATION\" class=\"number-notification\">{{ notificationsAmount }}</div>\n  </ng-container>\n  <div\n    class=\"label\"\n    *ngIf=\"variant !== badgeVariant.NOTIFICATION\"\n    [class.empty]=\"!label && !staticLabel\"\n    [class.animated]=\"enableAnimation\"\n  >\n    {{\n      label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4) && truncateLabel\n        ? (label | slice: 0 : 25 - (staticLabel.length < 4 ? staticLabel.length : 4)) + '...'\n        : label\n    }}\n  </div>\n  <span *ngIf=\"staticLabel && variant !== badgeVariant.NOTIFICATION\" class=\"static-label\">{{\n    staticLabel | slice: 0 : 4\n  }}</span>\n  <ui-icon\n    *ngIf=\"trailingIcon() && variant === badgeVariant.PRIMARY\"\n    class=\"badge-icon-trailing\"\n    [name]=\"trailingIcon()\"\n    [color]=\"resolvedTrailingIconColor\"\n  ></ui-icon>\n</div>\n\n<ng-template #aiIconTpl>\n  <ui-icon class=\"badge-icon\" [name]=\"'Sparkle-in-line'\" [color]=\"'ai'\"></ui-icon>\n</ng-template>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{display:block}:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai,:host .badge-container-notification{width:fit-content}:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai{height:24px;padding:0 8px;border-radius:21px;color:#fff;line-height:10px;transition:all .2s ease-out}:host .badge-container-primary .label,:host .badge-container-primary-ai .label,:host .badge-container-secondary .label,:host .badge-container-secondary-ai .label{font-size:12px;line-height:14px}:host .badge-container-primary .label.animated,:host .badge-container-primary-ai .label.animated,:host .badge-container-secondary .label.animated,:host .badge-container-secondary-ai .label.animated{display:inline-block;max-width:500px;opacity:1;overflow:hidden;white-space:nowrap;transition:max-width .25s ease-in-out,opacity .2s ease-in-out;will-change:max-width,opacity;contain:layout style}:host .badge-container-primary .label.empty,:host .badge-container-primary-ai .label.empty,:host .badge-container-secondary .label.empty,:host .badge-container-secondary-ai .label.empty{max-width:0;opacity:0}:host .badge-container-primary .static-label,:host .badge-container-primary-ai .static-label,:host .badge-container-secondary .static-label,:host .badge-container-secondary-ai .static-label{font-size:12px;line-height:14px;white-space:nowrap;flex-shrink:0;margin-left:2px}:host .badge-container-primary .badge-icon:not(:last-child),:host .badge-container-primary-ai .badge-icon:not(:last-child),:host .badge-container-secondary .badge-icon:not(:last-child),:host .badge-container-secondary-ai .badge-icon:not(:last-child){margin-right:8px}:host .badge-container-primary .badge-icon-trailing,:host .badge-container-primary-ai .badge-icon-trailing,:host .badge-container-secondary .badge-icon-trailing,:host .badge-container-secondary-ai .badge-icon-trailing{margin-left:8px}:host .badge-container-primary.no-label .badge-icon,:host .badge-container-primary-ai.no-label .badge-icon,:host .badge-container-secondary.no-label .badge-icon,:host .badge-container-secondary-ai.no-label .badge-icon{margin-right:0}:host .badge-container-secondary{padding:0}:host .badge-container-primary-ai.no-label{padding:4px}:host .badge-container-secondary .point,:host .badge-container-secondary-ai .point{border-radius:50%;padding:4px;margin-right:8px}:host .badge-container-secondary .label,:host .badge-container-secondary-ai .label{color:#000!important;width:100%}:host .badge-container-secondary[theme=dark],:host .badge-container-secondary[theme=light],:host .badge-container-secondary-ai[theme=dark],:host .badge-container-secondary-ai[theme=light]{color:#242424}:host .badge-container-secondary .badge-icon:not(:last-child),:host .badge-container-secondary-ai .badge-icon:not(:last-child){margin-right:4px}:host .badge-container-notification{min-width:20px;height:20px;border-radius:50%;color:#fff;line-height:10px}:host .badge-container-notification .label{font-size:12px}:host .badge-container-notification[theme=dark],:host .badge-container-notification[theme=light]{background:#242424!important;color:#fff!important;border-color:1px solid #ffffff}:host .badge{width:100%!important;max-width:fit-content!important}:host .badge .label{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;box-sizing:border-box!important}.flex-center,:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai,:host .badge-container-notification{display:flex;align-items:center;justify-content:center}.background-colors[color=red],:host [color=red].badge-container-primary,:host [color=red].badge-container-primary-ai,:host .badge-container-secondary [color=red].point,:host .badge-container-secondary-ai [color=red].point,:host [color=red].badge-container-notification{background:#cb7b7a}.background-colors[color=grey-medium],:host [color=grey-medium].badge-container-primary,:host [color=grey-medium].badge-container-primary-ai,:host .badge-container-secondary [color=grey-medium].point,:host .badge-container-secondary-ai [color=grey-medium].point,:host [color=grey-medium].badge-container-notification{background:#e0e0e0;color:#000}.background-colors[color=teal],:host [color=teal].badge-container-primary,:host [color=teal].badge-container-primary-ai,:host .badge-container-secondary [color=teal].point,:host .badge-container-secondary-ai [color=teal].point,:host [color=teal].badge-container-notification{background:#46a997}.background-colors[color=yellow],:host [color=yellow].badge-container-primary,:host [color=yellow].badge-container-primary-ai,:host .badge-container-secondary [color=yellow].point,:host .badge-container-secondary-ai [color=yellow].point,:host [color=yellow].badge-container-notification{background:#cca45f}.background-colors[color=petrol],:host [color=petrol].badge-container-primary,:host [color=petrol].badge-container-primary-ai,:host .badge-container-secondary [color=petrol].point,:host .badge-container-secondary-ai [color=petrol].point,:host [color=petrol].badge-container-notification{background:#276678}.background-colors[color=teal-60w],:host [color=teal-60w].badge-container-primary,:host [color=teal-60w].badge-container-primary-ai,:host .badge-container-secondary [color=teal-60w].point,:host .badge-container-secondary-ai [color=teal-60w].point,:host [color=teal-60w].badge-container-notification{background:#b5ddd5;color:#000}.background-colors[color=petrol-90w],:host [color=petrol-90w].badge-container-primary,:host [color=petrol-90w].badge-container-primary-ai,:host .badge-container-secondary [color=petrol-90w].point,:host .badge-container-secondary-ai [color=petrol-90w].point,:host [color=petrol-90w].badge-container-notification{background:#e9f0f1;color:#000}.background-colors[color=petrol-60w],:host [color=petrol-60w].badge-container-primary,:host [color=petrol-60w].badge-container-primary-ai,:host .badge-container-secondary [color=petrol-60w].point,:host .badge-container-secondary-ai [color=petrol-60w].point,:host [color=petrol-60w].badge-container-notification{background:#a9c2c9;color:#000}.background-colors[color=grey-dark],:host [color=grey-dark].badge-container-primary,:host [color=grey-dark].badge-container-primary-ai,:host .badge-container-secondary [color=grey-dark].point,:host .badge-container-secondary-ai [color=grey-dark].point,:host [color=grey-dark].badge-container-notification{background:#888}.background-colors[color=success],:host [color=success].badge-container-primary,:host [color=success].badge-container-primary-ai,:host .badge-container-secondary [color=success].point,:host .badge-container-secondary-ai [color=success].point,:host [color=success].badge-container-notification{background:#d4f2c3;color:#242424}.background-colors[color=warning],:host [color=warning].badge-container-primary,:host [color=warning].badge-container-primary-ai,:host .badge-container-secondary [color=warning].point,:host .badge-container-secondary-ai [color=warning].point,:host [color=warning].badge-container-notification{background:#ffe1b3;color:#242424}.background-colors[color=negative],:host [color=negative].badge-container-primary,:host [color=negative].badge-container-primary-ai,:host .badge-container-secondary [color=negative].point,:host .badge-container-secondary-ai [color=negative].point,:host [color=negative].badge-container-notification{background:#ffac9a;color:#242424}.background-colors[color=info],:host [color=info].badge-container-primary,:host [color=info].badge-container-primary-ai,:host .badge-container-secondary [color=info].point,:host .badge-container-secondary-ai [color=info].point,:host [color=info].badge-container-notification{background:#d9e8ff;color:#242424}.background-colors[color=brand],:host [color=brand].badge-container-primary,:host [color=brand].badge-container-primary-ai,:host .badge-container-secondary [color=brand].point,:host .badge-container-secondary-ai [color=brand].point,:host [color=brand].badge-container-notification{background:#ffe6fa;color:#242424}.background-colors[color=neutral],:host [color=neutral].badge-container-primary,:host [color=neutral].badge-container-primary-ai,:host .badge-container-secondary [color=neutral].point,:host .badge-container-secondary-ai [color=neutral].point,:host [color=neutral].badge-container-notification{background:#e9e9e9;color:#242424}.background-colors[color=blue-20],:host [color=blue-20].badge-container-primary,:host [color=blue-20].badge-container-primary-ai,:host .badge-container-secondary [color=blue-20].point,:host .badge-container-secondary-ai [color=blue-20].point,:host [color=blue-20].badge-container-notification{background:#99c1fe;color:#242424}.background-colors[color=blue-30],:host [color=blue-30].badge-container-primary,:host [color=blue-30].badge-container-primary-ai,:host .badge-container-secondary [color=blue-30].point,:host .badge-container-secondary-ai [color=blue-30].point,:host [color=blue-30].badge-container-notification{background:#277cfd;color:#fff}.background-colors[color=blue-40],:host [color=blue-40].badge-container-primary,:host [color=blue-40].badge-container-primary-ai,:host .badge-container-secondary [color=blue-40].point,:host .badge-container-secondary-ai [color=blue-40].point,:host [color=blue-40].badge-container-notification{background:#0165fc;color:#fff}.background-colors[color=pink-30],:host [color=pink-30].badge-container-primary,:host [color=pink-30].badge-container-primary-ai,:host .badge-container-secondary [color=pink-30].point,:host .badge-container-secondary-ai [color=pink-30].point,:host [color=pink-30].badge-container-notification{background:#ffb3ee;color:#242424}.background-colors[color=blue-10],:host [color=blue-10].badge-container-primary,:host [color=blue-10].badge-container-primary-ai,:host .badge-container-secondary [color=blue-10].point,:host .badge-container-secondary-ai [color=blue-10].point,:host [color=blue-10].badge-container-notification{background:#d9e8ff;color:#242424}.background-colors[color=grey-30],:host [color=grey-30].badge-container-primary,:host [color=grey-30].badge-container-primary-ai,:host .badge-container-secondary [color=grey-30].point,:host .badge-container-secondary-ai [color=grey-30].point,:host [color=grey-30].badge-container-notification{background:#d3d3d3;color:#242424}.background-colors[color=grey-20],:host [color=grey-20].badge-container-primary,:host [color=grey-20].badge-container-primary-ai,:host .badge-container-secondary [color=grey-20].point,:host .badge-container-secondary-ai [color=grey-20].point,:host [color=grey-20].badge-container-notification{background:#e9e9e9;color:#242424}.background-colors[color=grey-10],:host [color=grey-10].badge-container-primary,:host [color=grey-10].badge-container-primary-ai,:host .badge-container-secondary [color=grey-10].point,:host .badge-container-secondary-ai [color=grey-10].point,:host [color=grey-10].badge-container-notification{background:#f4f4f4;color:#242424}\n"], dependencies: [{ kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: i2.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i3.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "pipe", type: i1.SlicePipe, name: "slice" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: BadgeComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'ui-badge', standalone: false, template: "<div\n  [class]=\"'badge badge-container-' + variant\"\n  [class.no-label]=\"!label && !staticLabel\"\n  [attr.aria-label]=\"label + (staticLabel ? ' ' + staticLabel : '')\"\n  [attr.theme]=\"applicationTheme\"\n  [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n  [matTooltip]=\"\n    label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4)\n      ? label + (staticLabel ? ' ' + staticLabel : '')\n      : ''\n  \"\n  [matTooltipClass]=\"applicationTheme\"\n>\n  <ng-container [ngSwitch]=\"variant\">\n    <ng-container *ngSwitchCase=\"badgeVariant.PRIMARY\">\n      <ui-icon *ngIf=\"icon\" [class.badge-icon]=\"!!label\" [name]=\"icon\" [color]=\"iconColor\"></ui-icon>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"badgeVariant.PRIMARY_AI\">\n      <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"badgeVariant.SECONDARY_AI\">\n      <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n    </ng-container>\n    <div\n      *ngSwitchCase=\"badgeVariant.SECONDARY\"\n      class=\"point\"\n      [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n    ></div>\n    <div *ngSwitchCase=\"badgeVariant.NOTIFICATION\" class=\"number-notification\">{{ notificationsAmount }}</div>\n  </ng-container>\n  <div\n    class=\"label\"\n    *ngIf=\"variant !== badgeVariant.NOTIFICATION\"\n    [class.empty]=\"!label && !staticLabel\"\n    [class.animated]=\"enableAnimation\"\n  >\n    {{\n      label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4) && truncateLabel\n        ? (label | slice: 0 : 25 - (staticLabel.length < 4 ? staticLabel.length : 4)) + '...'\n        : label\n    }}\n  </div>\n  <span *ngIf=\"staticLabel && variant !== badgeVariant.NOTIFICATION\" class=\"static-label\">{{\n    staticLabel | slice: 0 : 4\n  }}</span>\n</div>\n\n<ng-template #aiIconTpl>\n  <ui-icon class=\"badge-icon\" [name]=\"'Sparkle-in-line'\" [color]=\"'ai'\"></ui-icon>\n</ng-template>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{display:block}:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai,:host .badge-container-notification{width:fit-content}:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai{height:24px;padding:0 8px;border-radius:21px;color:#fff;line-height:10px;transition:all .2s ease-out}:host .badge-container-primary .label,:host .badge-container-primary-ai .label,:host .badge-container-secondary .label,:host .badge-container-secondary-ai .label{font-size:12px;line-height:14px}:host .badge-container-primary .label.animated,:host .badge-container-primary-ai .label.animated,:host .badge-container-secondary .label.animated,:host .badge-container-secondary-ai .label.animated{display:inline-block;max-width:500px;opacity:1;overflow:hidden;white-space:nowrap;transition:max-width .25s ease-in-out,opacity .2s ease-in-out;will-change:max-width,opacity;contain:layout style}:host .badge-container-primary .label.empty,:host .badge-container-primary-ai .label.empty,:host .badge-container-secondary .label.empty,:host .badge-container-secondary-ai .label.empty{max-width:0;opacity:0}:host .badge-container-primary .static-label,:host .badge-container-primary-ai .static-label,:host .badge-container-secondary .static-label,:host .badge-container-secondary-ai .static-label{font-size:12px;line-height:14px;white-space:nowrap;flex-shrink:0;margin-left:2px}:host .badge-container-primary .badge-icon:not(:last-child),:host .badge-container-primary-ai .badge-icon:not(:last-child),:host .badge-container-secondary .badge-icon:not(:last-child),:host .badge-container-secondary-ai .badge-icon:not(:last-child){margin-right:8px}:host .badge-container-primary.no-label .badge-icon,:host .badge-container-primary-ai.no-label .badge-icon,:host .badge-container-secondary.no-label .badge-icon,:host .badge-container-secondary-ai.no-label .badge-icon{margin-right:0}:host .badge-container-secondary{padding:0}:host .badge-container-primary-ai.no-label{padding:4px}:host .badge-container-secondary .point,:host .badge-container-secondary-ai .point{border-radius:50%;padding:4px;margin-right:8px}:host .badge-container-secondary .label,:host .badge-container-secondary-ai .label{color:#000!important;width:100%}:host .badge-container-secondary[theme=dark],:host .badge-container-secondary[theme=light],:host .badge-container-secondary-ai[theme=dark],:host .badge-container-secondary-ai[theme=light]{color:#242424}:host .badge-container-secondary .badge-icon:not(:last-child),:host .badge-container-secondary-ai .badge-icon:not(:last-child){margin-right:4px}:host .badge-container-notification{min-width:20px;height:20px;border-radius:50%;color:#fff;line-height:10px}:host .badge-container-notification .label{font-size:12px}:host .badge-container-notification[theme=dark],:host .badge-container-notification[theme=light]{background:#242424!important;color:#fff!important;border-color:1px solid #ffffff}:host .badge{width:100%!important;max-width:fit-content!important}:host .badge .label{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;box-sizing:border-box!important}.flex-center,:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai,:host .badge-container-notification{display:flex;align-items:center;justify-content:center}.background-colors[color=red],:host [color=red].badge-container-primary,:host [color=red].badge-container-primary-ai,:host .badge-container-secondary [color=red].point,:host .badge-container-secondary-ai [color=red].point,:host [color=red].badge-container-notification{background:#cb7b7a}.background-colors[color=grey-medium],:host [color=grey-medium].badge-container-primary,:host [color=grey-medium].badge-container-primary-ai,:host .badge-container-secondary [color=grey-medium].point,:host .badge-container-secondary-ai [color=grey-medium].point,:host [color=grey-medium].badge-container-notification{background:#e0e0e0;color:#000}.background-colors[color=teal],:host [color=teal].badge-container-primary,:host [color=teal].badge-container-primary-ai,:host .badge-container-secondary [color=teal].point,:host .badge-container-secondary-ai [color=teal].point,:host [color=teal].badge-container-notification{background:#46a997}.background-colors[color=yellow],:host [color=yellow].badge-container-primary,:host [color=yellow].badge-container-primary-ai,:host .badge-container-secondary [color=yellow].point,:host .badge-container-secondary-ai [color=yellow].point,:host [color=yellow].badge-container-notification{background:#cca45f}.background-colors[color=petrol],:host [color=petrol].badge-container-primary,:host [color=petrol].badge-container-primary-ai,:host .badge-container-secondary [color=petrol].point,:host .badge-container-secondary-ai [color=petrol].point,:host [color=petrol].badge-container-notification{background:#276678}.background-colors[color=teal-60w],:host [color=teal-60w].badge-container-primary,:host [color=teal-60w].badge-container-primary-ai,:host .badge-container-secondary [color=teal-60w].point,:host .badge-container-secondary-ai [color=teal-60w].point,:host [color=teal-60w].badge-container-notification{background:#b5ddd5;color:#000}.background-colors[color=petrol-90w],:host [color=petrol-90w].badge-container-primary,:host [color=petrol-90w].badge-container-primary-ai,:host .badge-container-secondary [color=petrol-90w].point,:host .badge-container-secondary-ai [color=petrol-90w].point,:host [color=petrol-90w].badge-container-notification{background:#e9f0f1;color:#000}.background-colors[color=petrol-60w],:host [color=petrol-60w].badge-container-primary,:host [color=petrol-60w].badge-container-primary-ai,:host .badge-container-secondary [color=petrol-60w].point,:host .badge-container-secondary-ai [color=petrol-60w].point,:host [color=petrol-60w].badge-container-notification{background:#a9c2c9;color:#000}.background-colors[color=grey-dark],:host [color=grey-dark].badge-container-primary,:host [color=grey-dark].badge-container-primary-ai,:host .badge-container-secondary [color=grey-dark].point,:host .badge-container-secondary-ai [color=grey-dark].point,:host [color=grey-dark].badge-container-notification{background:#888}.background-colors[color=success],:host [color=success].badge-container-primary,:host [color=success].badge-container-primary-ai,:host .badge-container-secondary [color=success].point,:host .badge-container-secondary-ai [color=success].point,:host [color=success].badge-container-notification{background:#d4f2c3;color:#242424}.background-colors[color=warning],:host [color=warning].badge-container-primary,:host [color=warning].badge-container-primary-ai,:host .badge-container-secondary [color=warning].point,:host .badge-container-secondary-ai [color=warning].point,:host [color=warning].badge-container-notification{background:#ffe1b3;color:#242424}.background-colors[color=negative],:host [color=negative].badge-container-primary,:host [color=negative].badge-container-primary-ai,:host .badge-container-secondary [color=negative].point,:host .badge-container-secondary-ai [color=negative].point,:host [color=negative].badge-container-notification{background:#ffac9a;color:#242424}.background-colors[color=info],:host [color=info].badge-container-primary,:host [color=info].badge-container-primary-ai,:host .badge-container-secondary [color=info].point,:host .badge-container-secondary-ai [color=info].point,:host [color=info].badge-container-notification{background:#d9e8ff;color:#242424}.background-colors[color=brand],:host [color=brand].badge-container-primary,:host [color=brand].badge-container-primary-ai,:host .badge-container-secondary [color=brand].point,:host .badge-container-secondary-ai [color=brand].point,:host [color=brand].badge-container-notification{background:#ffe6fa;color:#242424}.background-colors[color=neutral],:host [color=neutral].badge-container-primary,:host [color=neutral].badge-container-primary-ai,:host .badge-container-secondary [color=neutral].point,:host .badge-container-secondary-ai [color=neutral].point,:host [color=neutral].badge-container-notification{background:#e9e9e9;color:#242424}.background-colors[color=blue-20],:host [color=blue-20].badge-container-primary,:host [color=blue-20].badge-container-primary-ai,:host .badge-container-secondary [color=blue-20].point,:host .badge-container-secondary-ai [color=blue-20].point,:host [color=blue-20].badge-container-notification{background:#99c1fe;color:#242424}.background-colors[color=blue-30],:host [color=blue-30].badge-container-primary,:host [color=blue-30].badge-container-primary-ai,:host .badge-container-secondary [color=blue-30].point,:host .badge-container-secondary-ai [color=blue-30].point,:host [color=blue-30].badge-container-notification{background:#277cfd;color:#fff}.background-colors[color=blue-40],:host [color=blue-40].badge-container-primary,:host [color=blue-40].badge-container-primary-ai,:host .badge-container-secondary [color=blue-40].point,:host .badge-container-secondary-ai [color=blue-40].point,:host [color=blue-40].badge-container-notification{background:#0165fc;color:#fff}.background-colors[color=pink-30],:host [color=pink-30].badge-container-primary,:host [color=pink-30].badge-container-primary-ai,:host .badge-container-secondary [color=pink-30].point,:host .badge-container-secondary-ai [color=pink-30].point,:host [color=pink-30].badge-container-notification{background:#ffb3ee;color:#242424}.background-colors[color=blue-10],:host [color=blue-10].badge-container-primary,:host [color=blue-10].badge-container-primary-ai,:host .badge-container-secondary [color=blue-10].point,:host .badge-container-secondary-ai [color=blue-10].point,:host [color=blue-10].badge-container-notification{background:#d9e8ff;color:#242424}.background-colors[color=grey-30],:host [color=grey-30].badge-container-primary,:host [color=grey-30].badge-container-primary-ai,:host .badge-container-secondary [color=grey-30].point,:host .badge-container-secondary-ai [color=grey-30].point,:host [color=grey-30].badge-container-notification{background:#d3d3d3;color:#242424}.background-colors[color=grey-20],:host [color=grey-20].badge-container-primary,:host [color=grey-20].badge-container-primary-ai,:host .badge-container-secondary [color=grey-20].point,:host .badge-container-secondary-ai [color=grey-20].point,:host [color=grey-20].badge-container-notification{background:#e9e9e9;color:#242424}.background-colors[color=grey-10],:host [color=grey-10].badge-container-primary,:host [color=grey-10].badge-container-primary-ai,:host .badge-container-secondary [color=grey-10].point,:host .badge-container-secondary-ai [color=grey-10].point,:host [color=grey-10].badge-container-notification{background:#f4f4f4;color:#242424}\n"] }]
+            args: [{ selector: 'ui-badge', standalone: false, template: "<div\n  [class]=\"'badge badge-container-' + variant\"\n  [class.no-label]=\"!label && !staticLabel && !trailingIcon()\"\n  [attr.aria-label]=\"label + (staticLabel ? ' ' + staticLabel : '')\"\n  [attr.theme]=\"applicationTheme\"\n  [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n  [matTooltip]=\"\n    label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4)\n      ? label + (staticLabel ? ' ' + staticLabel : '')\n      : ''\n  \"\n  [matTooltipClass]=\"applicationTheme\"\n>\n  <ng-container [ngSwitch]=\"variant\">\n    <ng-container *ngSwitchCase=\"badgeVariant.PRIMARY\">\n      <ui-icon\n        *ngIf=\"icon\"\n        [class.badge-icon]=\"!!label || !!staticLabel || !!trailingIcon\"\n        [name]=\"icon\"\n        [color]=\"resolvedIconColor\"\n      ></ui-icon>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"badgeVariant.PRIMARY_AI\">\n      <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n    </ng-container>\n    <ng-container *ngSwitchCase=\"badgeVariant.SECONDARY_AI\">\n      <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n    </ng-container>\n    <div\n      *ngSwitchCase=\"badgeVariant.SECONDARY\"\n      class=\"point\"\n      [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n    ></div>\n    <div *ngSwitchCase=\"badgeVariant.NOTIFICATION\" class=\"number-notification\">{{ notificationsAmount }}</div>\n  </ng-container>\n  <div\n    class=\"label\"\n    *ngIf=\"variant !== badgeVariant.NOTIFICATION\"\n    [class.empty]=\"!label && !staticLabel\"\n    [class.animated]=\"enableAnimation\"\n  >\n    {{\n      label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4) && truncateLabel\n        ? (label | slice: 0 : 25 - (staticLabel.length < 4 ? staticLabel.length : 4)) + '...'\n        : label\n    }}\n  </div>\n  <span *ngIf=\"staticLabel && variant !== badgeVariant.NOTIFICATION\" class=\"static-label\">{{\n    staticLabel | slice: 0 : 4\n  }}</span>\n  <ui-icon\n    *ngIf=\"trailingIcon() && variant === badgeVariant.PRIMARY\"\n    class=\"badge-icon-trailing\"\n    [name]=\"trailingIcon()\"\n    [color]=\"resolvedTrailingIconColor\"\n  ></ui-icon>\n</div>\n\n<ng-template #aiIconTpl>\n  <ui-icon class=\"badge-icon\" [name]=\"'Sparkle-in-line'\" [color]=\"'ai'\"></ui-icon>\n</ng-template>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{display:block}:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai,:host .badge-container-notification{width:fit-content}:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai{height:24px;padding:0 8px;border-radius:21px;color:#fff;line-height:10px;transition:all .2s ease-out}:host .badge-container-primary .label,:host .badge-container-primary-ai .label,:host .badge-container-secondary .label,:host .badge-container-secondary-ai .label{font-size:12px;line-height:14px}:host .badge-container-primary .label.animated,:host .badge-container-primary-ai .label.animated,:host .badge-container-secondary .label.animated,:host .badge-container-secondary-ai .label.animated{display:inline-block;max-width:500px;opacity:1;overflow:hidden;white-space:nowrap;transition:max-width .25s ease-in-out,opacity .2s ease-in-out;will-change:max-width,opacity;contain:layout style}:host .badge-container-primary .label.empty,:host .badge-container-primary-ai .label.empty,:host .badge-container-secondary .label.empty,:host .badge-container-secondary-ai .label.empty{max-width:0;opacity:0}:host .badge-container-primary .static-label,:host .badge-container-primary-ai .static-label,:host .badge-container-secondary .static-label,:host .badge-container-secondary-ai .static-label{font-size:12px;line-height:14px;white-space:nowrap;flex-shrink:0;margin-left:2px}:host .badge-container-primary .badge-icon:not(:last-child),:host .badge-container-primary-ai .badge-icon:not(:last-child),:host .badge-container-secondary .badge-icon:not(:last-child),:host .badge-container-secondary-ai .badge-icon:not(:last-child){margin-right:8px}:host .badge-container-primary .badge-icon-trailing,:host .badge-container-primary-ai .badge-icon-trailing,:host .badge-container-secondary .badge-icon-trailing,:host .badge-container-secondary-ai .badge-icon-trailing{margin-left:8px}:host .badge-container-primary.no-label .badge-icon,:host .badge-container-primary-ai.no-label .badge-icon,:host .badge-container-secondary.no-label .badge-icon,:host .badge-container-secondary-ai.no-label .badge-icon{margin-right:0}:host .badge-container-secondary{padding:0}:host .badge-container-primary-ai.no-label{padding:4px}:host .badge-container-secondary .point,:host .badge-container-secondary-ai .point{border-radius:50%;padding:4px;margin-right:8px}:host .badge-container-secondary .label,:host .badge-container-secondary-ai .label{color:#000!important;width:100%}:host .badge-container-secondary[theme=dark],:host .badge-container-secondary[theme=light],:host .badge-container-secondary-ai[theme=dark],:host .badge-container-secondary-ai[theme=light]{color:#242424}:host .badge-container-secondary .badge-icon:not(:last-child),:host .badge-container-secondary-ai .badge-icon:not(:last-child){margin-right:4px}:host .badge-container-notification{min-width:20px;height:20px;border-radius:50%;color:#fff;line-height:10px}:host .badge-container-notification .label{font-size:12px}:host .badge-container-notification[theme=dark],:host .badge-container-notification[theme=light]{background:#242424!important;color:#fff!important;border-color:1px solid #ffffff}:host .badge{width:100%!important;max-width:fit-content!important}:host .badge .label{white-space:nowrap!important;overflow:hidden!important;text-overflow:ellipsis!important;box-sizing:border-box!important}.flex-center,:host .badge-container-primary,:host .badge-container-primary-ai,:host .badge-container-secondary,:host .badge-container-secondary-ai,:host .badge-container-notification{display:flex;align-items:center;justify-content:center}.background-colors[color=red],:host [color=red].badge-container-primary,:host [color=red].badge-container-primary-ai,:host .badge-container-secondary [color=red].point,:host .badge-container-secondary-ai [color=red].point,:host [color=red].badge-container-notification{background:#cb7b7a}.background-colors[color=grey-medium],:host [color=grey-medium].badge-container-primary,:host [color=grey-medium].badge-container-primary-ai,:host .badge-container-secondary [color=grey-medium].point,:host .badge-container-secondary-ai [color=grey-medium].point,:host [color=grey-medium].badge-container-notification{background:#e0e0e0;color:#000}.background-colors[color=teal],:host [color=teal].badge-container-primary,:host [color=teal].badge-container-primary-ai,:host .badge-container-secondary [color=teal].point,:host .badge-container-secondary-ai [color=teal].point,:host [color=teal].badge-container-notification{background:#46a997}.background-colors[color=yellow],:host [color=yellow].badge-container-primary,:host [color=yellow].badge-container-primary-ai,:host .badge-container-secondary [color=yellow].point,:host .badge-container-secondary-ai [color=yellow].point,:host [color=yellow].badge-container-notification{background:#cca45f}.background-colors[color=petrol],:host [color=petrol].badge-container-primary,:host [color=petrol].badge-container-primary-ai,:host .badge-container-secondary [color=petrol].point,:host .badge-container-secondary-ai [color=petrol].point,:host [color=petrol].badge-container-notification{background:#276678}.background-colors[color=teal-60w],:host [color=teal-60w].badge-container-primary,:host [color=teal-60w].badge-container-primary-ai,:host .badge-container-secondary [color=teal-60w].point,:host .badge-container-secondary-ai [color=teal-60w].point,:host [color=teal-60w].badge-container-notification{background:#b5ddd5;color:#000}.background-colors[color=petrol-90w],:host [color=petrol-90w].badge-container-primary,:host [color=petrol-90w].badge-container-primary-ai,:host .badge-container-secondary [color=petrol-90w].point,:host .badge-container-secondary-ai [color=petrol-90w].point,:host [color=petrol-90w].badge-container-notification{background:#e9f0f1;color:#000}.background-colors[color=petrol-60w],:host [color=petrol-60w].badge-container-primary,:host [color=petrol-60w].badge-container-primary-ai,:host .badge-container-secondary [color=petrol-60w].point,:host .badge-container-secondary-ai [color=petrol-60w].point,:host [color=petrol-60w].badge-container-notification{background:#a9c2c9;color:#000}.background-colors[color=grey-dark],:host [color=grey-dark].badge-container-primary,:host [color=grey-dark].badge-container-primary-ai,:host .badge-container-secondary [color=grey-dark].point,:host .badge-container-secondary-ai [color=grey-dark].point,:host [color=grey-dark].badge-container-notification{background:#888}.background-colors[color=success],:host [color=success].badge-container-primary,:host [color=success].badge-container-primary-ai,:host .badge-container-secondary [color=success].point,:host .badge-container-secondary-ai [color=success].point,:host [color=success].badge-container-notification{background:#d4f2c3;color:#242424}.background-colors[color=warning],:host [color=warning].badge-container-primary,:host [color=warning].badge-container-primary-ai,:host .badge-container-secondary [color=warning].point,:host .badge-container-secondary-ai [color=warning].point,:host [color=warning].badge-container-notification{background:#ffe1b3;color:#242424}.background-colors[color=negative],:host [color=negative].badge-container-primary,:host [color=negative].badge-container-primary-ai,:host .badge-container-secondary [color=negative].point,:host .badge-container-secondary-ai [color=negative].point,:host [color=negative].badge-container-notification{background:#ffac9a;color:#242424}.background-colors[color=info],:host [color=info].badge-container-primary,:host [color=info].badge-container-primary-ai,:host .badge-container-secondary [color=info].point,:host .badge-container-secondary-ai [color=info].point,:host [color=info].badge-container-notification{background:#d9e8ff;color:#242424}.background-colors[color=brand],:host [color=brand].badge-container-primary,:host [color=brand].badge-container-primary-ai,:host .badge-container-secondary [color=brand].point,:host .badge-container-secondary-ai [color=brand].point,:host [color=brand].badge-container-notification{background:#ffe6fa;color:#242424}.background-colors[color=neutral],:host [color=neutral].badge-container-primary,:host [color=neutral].badge-container-primary-ai,:host .badge-container-secondary [color=neutral].point,:host .badge-container-secondary-ai [color=neutral].point,:host [color=neutral].badge-container-notification{background:#e9e9e9;color:#242424}.background-colors[color=blue-20],:host [color=blue-20].badge-container-primary,:host [color=blue-20].badge-container-primary-ai,:host .badge-container-secondary [color=blue-20].point,:host .badge-container-secondary-ai [color=blue-20].point,:host [color=blue-20].badge-container-notification{background:#99c1fe;color:#242424}.background-colors[color=blue-30],:host [color=blue-30].badge-container-primary,:host [color=blue-30].badge-container-primary-ai,:host .badge-container-secondary [color=blue-30].point,:host .badge-container-secondary-ai [color=blue-30].point,:host [color=blue-30].badge-container-notification{background:#277cfd;color:#fff}.background-colors[color=blue-40],:host [color=blue-40].badge-container-primary,:host [color=blue-40].badge-container-primary-ai,:host .badge-container-secondary [color=blue-40].point,:host .badge-container-secondary-ai [color=blue-40].point,:host [color=blue-40].badge-container-notification{background:#0165fc;color:#fff}.background-colors[color=pink-30],:host [color=pink-30].badge-container-primary,:host [color=pink-30].badge-container-primary-ai,:host .badge-container-secondary [color=pink-30].point,:host .badge-container-secondary-ai [color=pink-30].point,:host [color=pink-30].badge-container-notification{background:#ffb3ee;color:#242424}.background-colors[color=blue-10],:host [color=blue-10].badge-container-primary,:host [color=blue-10].badge-container-primary-ai,:host .badge-container-secondary [color=blue-10].point,:host .badge-container-secondary-ai [color=blue-10].point,:host [color=blue-10].badge-container-notification{background:#d9e8ff;color:#242424}.background-colors[color=grey-30],:host [color=grey-30].badge-container-primary,:host [color=grey-30].badge-container-primary-ai,:host .badge-container-secondary [color=grey-30].point,:host .badge-container-secondary-ai [color=grey-30].point,:host [color=grey-30].badge-container-notification{background:#d3d3d3;color:#242424}.background-colors[color=grey-20],:host [color=grey-20].badge-container-primary,:host [color=grey-20].badge-container-primary-ai,:host .badge-container-secondary [color=grey-20].point,:host .badge-container-secondary-ai [color=grey-20].point,:host [color=grey-20].badge-container-notification{background:#e9e9e9;color:#242424}.background-colors[color=grey-10],:host [color=grey-10].badge-container-primary,:host [color=grey-10].badge-container-primary-ai,:host .badge-container-secondary [color=grey-10].point,:host .badge-container-secondary-ai [color=grey-10].point,:host [color=grey-10].badge-container-notification{background:#f4f4f4;color:#242424}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Optional
                 }, {

package/fesm2022/testgorilla-tgo-ui-components-badge.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-badge.mjs","sources":["../../../components/badge/badge.model.ts","../../../components/badge/badge.component.ts","../../../components/badge/badge.component.html","../../../components/badge/badge.component.module.ts","../../../components/badge/testgorilla-tgo-ui-components-badge.ts"],"sourcesContent":["export type BadgeVariant = 'primary' \| 'secondary' \| 'notification' \| 'primary-ai' \| 'secondary-ai';\nexport type BadgeColor =\n \| 'red'\n \| 'grey-medium'\n \| 'teal'\n \| 'yellow'\n \| 'petrol'\n \| 'teal-60w'\n \| 'petrol-90w'\n \| 'petrol-60w'\n \| 'grey-dark'\n \| 'blue-20'\n \| 'blue-40'\n \| 'pink-30'\n \| 'blue-10';\n\nexport enum BadgeColorEnum {\n RED = 'red',\n GREY_MEDIUM = 'grey-medium',\n TEAL = 'teal',\n YELLOW = 'yellow',\n PETROL = 'petrol',\n TEAL_60W = 'teal-60w',\n PETROL_90W = 'petrol-90w',\n PETROL_60W = 'petrol-60w',\n GREY_DARK = 'grey-dark',\n BLUE_20 = 'blue-20',\n BLUE_40 = 'blue-40',\n}\n\nexport type RebrandBadgeColor =\n \| 'success'\n \| 'warning'\n \| 'negative'\n \| 'info'\n \| 'brand'\n \| 'neutral'\n \| 'blue-20'\n \| 'blue-40'\n \| 'pink-30'\n \| 'blue-10'\n \| 'grey-10'\n \| 'grey-20'\n \| 'grey-30';\n\nexport enum RebrandBadgeColorEnum {\n SUCCESS = 'success',\n WARNING = 'warning',\n NEGATIVE = 'negative',\n INFO = 'info',\n BRAND = 'brand',\n NEUTRAL = 'neutral',\n BLUE_40 = 'blue-40',\n BLUE_20 = 'blue-20',\n PINK_30 = 'pink-30',\n BLUE_10 = 'blue-10',\n GREY_30 = 'grey-30',\n GREY_20 = 'grey-20',\n GREY_10 = 'grey-10',\n}\n\nexport enum BadgeVariantEnum {\n PRIMARY = 'primary',\n PRIMARY_AI = 'primary-ai',\n SECONDARY = 'secondary',\n SECONDARY_AI = 'secondary-ai',\n NOTIFICATION = 'notification',\n}\n","import { Component, Inject, Input, Optional } from '@angular/core';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { IconColor, IconName } from '@testgorilla/tgo-ui/components/icon';\nimport {\n BadgeColor,\n BadgeColorEnum,\n BadgeVariant,\n BadgeVariantEnum,\n RebrandBadgeColor,\n RebrandBadgeColorEnum,\n} from './badge.model';\n\n@Component({\n selector: 'ui-badge',\n templateUrl: './badge.component.html',\n styleUrls: ['./badge.component.scss'],\n standalone: false,\n})\nexport class BadgeComponent {\n /*\n The label to be displayed on the badge.\n * @type {string}\n * @memberof BadgeComponent\n /\n @Input() label = '';\n\n /\n A static label always displayed after the main label, never truncated.\n * Intended for short suffixes (max 4 chars, e.g. \"100%\").\n * When the main label is truncated, the tooltip shows both labels in full.\n * @type {string}\n * @memberof BadgeComponent\n /\n @Input() staticLabel = '';\n\n /\n The icon name to be displayed on the badge.\n * @type {IconName}\n * @memberof BadgeComponent\n /\n @Input() icon: IconName = '';\n\n /\n The color of the badge. Defaults to 'petrol'.\n * @type {BadgeColor}\n * @memberof BadgeComponent\n /\n @Input() color: BadgeColor = 'petrol';\n\n /\n The variant of the badge. Defaults to 'primary'.\n * @type {BadgeVariant}\n * @memberof BadgeComponent\n /\n @Input() variant: BadgeVariant = 'primary';\n\n /\n The amount of notifications to be displayed on the badge.\n * @type {number}\n * @memberof BadgeComponent\n /\n @Input() notificationsAmount = 0;\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof BadgeComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n The color of the badge on new theme. Defaults to 'brand'.\n * @type {RebrandBadgeColor}\n * @memberof BadgeComponent\n /\n @Input() rebrandColor: RebrandBadgeColor = 'brand';\n\n @Input() truncateLabel = true;\n\n /\n Whether to enable the animation when label changes from empty to having content.\n * @type {boolean}\n * @memberof BadgeComponent\n /\n @Input() enableAnimation = false;\n\n protected badgeVariant = BadgeVariantEnum;\n private darkColors: string[] = [\n BadgeColorEnum.GREY_MEDIUM,\n BadgeColorEnum.PETROL_90W,\n BadgeColorEnum.TEAL_60W,\n BadgeColorEnum.PETROL_60W,\n RebrandBadgeColorEnum.SUCCESS,\n RebrandBadgeColorEnum.INFO,\n RebrandBadgeColorEnum.BRAND,\n RebrandBadgeColorEnum.NEUTRAL,\n RebrandBadgeColorEnum.NEGATIVE,\n RebrandBadgeColorEnum.WARNING,\n RebrandBadgeColorEnum.BLUE_20,\n RebrandBadgeColorEnum.PINK_30,\n RebrandBadgeColorEnum.BLUE_10,\n RebrandBadgeColorEnum.GREY_20,\n ];\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n protected get iconColor(): IconColor {\n return this.darkColors.includes(this.isClassicTheme ? this.color : this.rebrandColor) ? 'black' : 'white';\n }\n\n protected get isClassicTheme(): boolean {\n return this.applicationTheme === 'classic';\n }\n}\n","<div\n [class]=\"'badge badge-container-' + variant\"\n [class.no-label]=\"!label && !staticLabel\"\n [attr.aria-label]=\"label + (staticLabel ? ' ' + staticLabel : '')\"\n [attr.theme]=\"applicationTheme\"\n [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n [matTooltip]=\"\n label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4)\n ? label + (staticLabel ? ' ' + staticLabel : '')\n : ''\n \"\n [matTooltipClass]=\"applicationTheme\"\n>\n <ng-container [ngSwitch]=\"variant\">\n <ng-container ngSwitchCase=\"badgeVariant.PRIMARY\">\n <ui-icon ngIf=\"icon\" [class.badge-icon]=\"!!label\" [name]=\"icon\" [color]=\"iconColor\"></ui-icon>\n </ng-container>\n <ng-container ngSwitchCase=\"badgeVariant.PRIMARY_AI\">\n <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n </ng-container>\n <ng-container ngSwitchCase=\"badgeVariant.SECONDARY_AI\">\n <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n </ng-container>\n <div\n ngSwitchCase=\"badgeVariant.SECONDARY\"\n class=\"point\"\n [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n ></div>\n <div ngSwitchCase=\"badgeVariant.NOTIFICATION\" class=\"number-notification\">{{ notificationsAmount }}</div>\n </ng-container>\n <div\n class=\"label\"\n ngIf=\"variant !== badgeVariant.NOTIFICATION\"\n [class.empty]=\"!label && !staticLabel\"\n [class.animated]=\"enableAnimation\"\n >\n {{\n label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4) && truncateLabel\n ? (label \| slice: 0 : 25 - (staticLabel.length < 4 ? staticLabel.length : 4)) + '...'\n : label\n }}\n </div>\n <span ngIf=\"staticLabel && variant !== badgeVariant.NOTIFICATION\" class=\"static-label\">{{\n staticLabel \| slice: 0 : 4\n }}</span>\n</div>\n\n<ng-template #aiIconTpl>\n <ui-icon class=\"badge-icon\" [name]=\"'Sparkle-in-line'\" [color]=\"'ai'\"></ui-icon>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { BadgeComponent } from './badge.component';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\n@NgModule({\n declarations: [BadgeComponent],\n imports: [CommonModule, IconComponentModule, MatTooltipModule],\n exports: [BadgeComponent],\n})\nexport class BadgeComponentModule {}\n","/\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":";;;;;;;;;IAgBY;AAAZ,CAAA,UAAY,cAAc,EAAA;AACxB,IAAA,cAAA,CAAA,KAAA,CAAA,GAAA,KAAW;AACX,IAAA,cAAA,CAAA,aAAA,CAAA,GAAA,aAA2B;AAC3B,IAAA,cAAA,CAAA,MAAA,CAAA,GAAA,MAAa;AACb,IAAA,cAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjB,IAAA,cAAA,CAAA,QAAA,CAAA,GAAA,QAAiB;AACjB,IAAA,cAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACrB,IAAA,cAAA,CAAA,YAAA,CAAA,GAAA,YAAyB;AACzB,IAAA,cAAA,CAAA,YAAA,CAAA,GAAA,YAAyB;AACzB,IAAA,cAAA,CAAA,WAAA,CAAA,GAAA,WAAuB;AACvB,IAAA,cAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,cAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACrB,CAAC,EAZW,cAAc,KAAd,cAAc,GAAA,EAAA,CAAA,CAAA;IA6Bd;AAAZ,CAAA,UAAY,qBAAqB,EAAA;AAC/B,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,qBAAA,CAAA,UAAA,CAAA,GAAA,UAAqB;AACrB,IAAA,qBAAA,CAAA,MAAA,CAAA,GAAA,MAAa;AACb,IAAA,qBAAA,CAAA,OAAA,CAAA,GAAA,OAAe;AACf,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,qBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACrB,CAAC,EAdW,qBAAqB,KAArB,qBAAqB,GAAA,EAAA,CAAA,CAAA;IAgBrB;AAAZ,CAAA,UAAY,gBAAgB,EAAA;AAC1B,IAAA,gBAAA,CAAA,SAAA,CAAA,GAAA,SAAmB;AACnB,IAAA,gBAAA,CAAA,YAAA,CAAA,GAAA,YAAyB;AACzB,IAAA,gBAAA,CAAA,WAAA,CAAA,GAAA,WAAuB;AACvB,IAAA,gBAAA,CAAA,cAAA,CAAA,GAAA,cAA6B;AAC7B,IAAA,gBAAA,CAAA,cAAA,CAAA,GAAA,cAA6B;AAC/B,CAAC,EANW,gBAAgB,KAAhB,gBAAgB,GAAA,EAAA,CAAA,CAAA;;MC3Cf,cAAc,CAAA;AAwFzB,IAAA,WAAA,CAC6E,eAAiC,EAAA;QAAjC,IAAA,CAAA,eAAe,GAAf,eAAe;AAxF5F;;;;AAIG;QACM,IAAA,CAAA,KAAK,GAAG,EAAE;AAEnB;;;;;;AAMG;QACM,IAAA,CAAA,WAAW,GAAG,EAAE;AAEzB;;;;AAIG;QACM,IAAA,CAAA,IAAI,GAAa,EAAE;AAE5B;;;;AAIG;QACM,IAAA,CAAA,KAAK,GAAe,QAAQ;AAErC;;;;AAIG;QACM,IAAA,CAAA,OAAO,GAAiB,SAAS;AAE1C;;;;AAIG;QACM,IAAA,CAAA,mBAAmB,GAAG,CAAC;AAEhC;;;;;;AAMG;QACM,IAAA,CAAA,gBAAgB,GAAqB,OAAO;AAErD;;;;AAIG;QACM,IAAA,CAAA,YAAY,GAAsB,OAAO;QAEzC,IAAA,CAAA,aAAa,GAAG,IAAI;AAE7B;;;;AAIG;QACM,IAAA,CAAA,eAAe,GAAG,KAAK;QAEtB,IAAA,CAAA,YAAY,GAAG,gBAAgB;AACjC,QAAA,IAAA,CAAA,UAAU,GAAa;AAC7B,YAAA,cAAc,CAAC,WAAW;AAC1B,YAAA,cAAc,CAAC,UAAU;AACzB,YAAA,cAAc,CAAC,QAAQ;AACvB,YAAA,cAAc,CAAC,UAAU;AACzB,YAAA,qBAAqB,CAAC,OAAO;AAC7B,YAAA,qBAAqB,CAAC,IAAI;AAC1B,YAAA,qBAAqB,CAAC,KAAK;AAC3B,YAAA,qBAAqB,CAAC,OAAO;AAC7B,YAAA,qBAAqB,CAAC,QAAQ;AAC9B,YAAA,qBAAqB,CAAC,OAAO;AAC7B,YAAA,qBAAqB,CAAC,OAAO;AAC7B,YAAA,qBAAqB,CAAC,OAAO;AAC7B,YAAA,qBAAqB,CAAC,OAAO;AAC7B,YAAA,qBAAqB,CAAC,OAAO;SAC9B;QAKC,IAAI,eAAe,EAAE;AACnB,YAAA,IAAI,CAAC,gBAAgB,GAAG,eAAe;QACzC;IACF;AAEA,IAAA,IAAc,SAAS,GAAA;AACrB,QAAA,OAAO,IAAI,CAAC,UAAU,CAAC,QAAQ,CAAC,IAAI,CAAC,cAAc,GAAG,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC,YAAY,CAAC,GAAG,OAAO,GAAG,OAAO;IAC3G;AAEA,IAAA,IAAc,cAAc,GAAA;AAC1B,QAAA,OAAO,IAAI,CAAC,gBAAgB,KAAK,SAAS;IAC5C;AAtGW,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,kBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,cAAc,kBAyFH,oCAAoC,EAAA,QAAA,EAAA,IAAA,EAAA,CAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,SAAA,EAAA,CAAA,CAAA;AAzF/C,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,oBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,IAAA,EAAA,cAAc,mWClB3B,w9DAkDA,EAAA,MAAA,EAAA,CAAA,qwZAAA,CAAA,EAAA,YAAA,EAAA,CAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,IAAA,EAAA,QAAA,EAAA,QAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,gBAAA,EAAA,QAAA,EAAA,oBAAA,EAAA,MAAA,EAAA,CAAA,yBAAA,EAAA,kBAAA,EAAA,0BAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,QAAA,EAAA,QAAA,EAAA,YAAA,EAAA,MAAA,EAAA,CAAA,UAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,YAAA,EAAA,QAAA,EAAA,gBAAA,EAAA,MAAA,EAAA,CAAA,cAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,aAAA,EAAA,QAAA,EAAA,SAAA,EAAA,MAAA,EAAA,CAAA,MAAA,EAAA,UAAA,EAAA,MAAA,EAAA,OAAA,EAAA,QAAA,EAAA,iBAAA,EAAA,kBAAA,EAAA,iBAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,WAAA,EAAA,IAAA,EAAA,EAAA,CAAA,UAAA,EAAA,QAAA,EAAA,cAAA,EAAA,MAAA,EAAA,CAAA,oBAAA,EAAA,4BAAA,EAAA,oBAAA,EAAA,qBAAA,EAAA,qBAAA,EAAA,yBAAA,EAAA,YAAA,EAAA,iBAAA,CAAA,EAAA,QAAA,EAAA,CAAA,YAAA,CAAA,EAAA,EAAA,EAAA,IAAA,EAAA,MAAA,EAAA,IAAA,EAAA,EAAA,CAAA,SAAA,EAAA,IAAA,EAAA,OAAA,EAAA,CAAA,EAAA,CAAA,CAAA;;4FDhCa,cAAc,EAAA,UAAA,EAAA,CAAA;kBAN1B,SAAS;AACE,YAAA,IAAA,EAAA,CAAA,EAAA,QAAA,EAAA,UAAU,cAGR,KAAK,EAAA,QAAA,EAAA,w9DAAA,EAAA,MAAA,EAAA,CAAA,qwZAAA,CAAA,EAAA;;0BA2Fd;;0BAAY,MAAM;2BAAC,oCAAoC;yCAnFjD,KAAK,EAAA,CAAA;sBAAb;gBASQ,WAAW,EAAA,CAAA;sBAAnB;gBAOQ,IAAI,EAAA,CAAA;sBAAZ;gBAOQ,KAAK,EAAA,CAAA;sBAAb;gBAOQ,OAAO,EAAA,CAAA;sBAAf;gBAOQ,mBAAmB,EAAA,CAAA;sBAA3B;gBASQ,gBAAgB,EAAA,CAAA;sBAAxB;gBAOQ,YAAY,EAAA,CAAA;sBAApB;gBAEQ,aAAa,EAAA,CAAA;sBAArB;gBAOQ,eAAe,EAAA,CAAA;sBAAvB;;;ME3EU,oBAAoB,CAAA;+GAApB,oBAAoB,EAAA,IAAA,EAAA,EAAA,EAAA,MAAA,EAAA,EAAA,CAAA,eAAA,CAAA,QAAA,EAAA,CAAA,CAAA;gHAApB,oBAAoB,EAAA,YAAA,EAAA,CAJhB,cAAc,CAAA,EAAA,OAAA,EAAA,CACnB,YAAY,EAAE,mBAAmB,EAAE,gBAAgB,CAAA,EAAA,OAAA,EAAA,CACnD,cAAc,CAAA,EAAA,CAAA,CAAA;AAEb,IAAA,SAAA,IAAA,CAAA,IAAA,GAAA,EAAA,CAAA,mBAAA,CAAA,EAAA,UAAA,EAAA,QAAA,EAAA,OAAA,EAAA,SAAA,EAAA,QAAA,EAAA,EAAA,EAAA,IAAA,EAAA,oBAAoB,EAAA,OAAA,EAAA,CAHrB,YAAY,EAAE,mBAAmB,EAAE,gBAAgB,CAAA,EAAA,CAAA,CAAA;;4FAGlD,oBAAoB,EAAA,UAAA,EAAA,CAAA;kBALhC,QAAQ;AAAC,YAAA,IAAA,EAAA,CAAA;oBACR,YAAY,EAAE,CAAC,cAAc,CAAC;AAC9B,oBAAA,OAAO,EAAE,CAAC,YAAY,EAAE,mBAAmB,EAAE,gBAAgB,CAAC;oBAC9D,OAAO,EAAE,CAAC,cAAc,CAAC;AAC1B,iBAAA;;;ACVD;;AAEG;;;;"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-badge.mjs","sources":["../../../components/badge/badge.model.ts","../../../components/badge/badge.component.ts","../../../components/badge/badge.component.html","../../../components/badge/badge.component.module.ts","../../../components/badge/testgorilla-tgo-ui-components-badge.ts"],"sourcesContent":["export type BadgeVariant = 'primary' \| 'secondary' \| 'notification' \| 'primary-ai' \| 'secondary-ai';\nexport type BadgeColor =\n \| 'red'\n \| 'grey-medium'\n \| 'teal'\n \| 'yellow'\n \| 'petrol'\n \| 'teal-60w'\n \| 'petrol-90w'\n \| 'petrol-60w'\n \| 'grey-dark'\n \| 'blue-20'\n \| 'blue-40'\n \| 'pink-30'\n \| 'blue-10';\n\nexport enum BadgeColorEnum {\n RED = 'red',\n GREY_MEDIUM = 'grey-medium',\n TEAL = 'teal',\n YELLOW = 'yellow',\n PETROL = 'petrol',\n TEAL_60W = 'teal-60w',\n PETROL_90W = 'petrol-90w',\n PETROL_60W = 'petrol-60w',\n GREY_DARK = 'grey-dark',\n BLUE_20 = 'blue-20',\n BLUE_40 = 'blue-40',\n}\n\nexport type RebrandBadgeColor =\n \| 'success'\n \| 'warning'\n \| 'negative'\n \| 'info'\n \| 'brand'\n \| 'neutral'\n \| 'blue-20'\n \| 'blue-40'\n \| 'pink-30'\n \| 'blue-10'\n \| 'grey-10'\n \| 'grey-20'\n \| 'grey-30';\n\nexport enum RebrandBadgeColorEnum {\n SUCCESS = 'success',\n WARNING = 'warning',\n NEGATIVE = 'negative',\n INFO = 'info',\n BRAND = 'brand',\n NEUTRAL = 'neutral',\n BLUE_40 = 'blue-40',\n BLUE_20 = 'blue-20',\n PINK_30 = 'pink-30',\n BLUE_10 = 'blue-10',\n GREY_30 = 'grey-30',\n GREY_20 = 'grey-20',\n GREY_10 = 'grey-10',\n}\n\nexport enum BadgeVariantEnum {\n PRIMARY = 'primary',\n PRIMARY_AI = 'primary-ai',\n SECONDARY = 'secondary',\n SECONDARY_AI = 'secondary-ai',\n NOTIFICATION = 'notification',\n}\n","import { Component, Inject, Input, Optional, input } from '@angular/core';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { IconColor, IconName } from '@testgorilla/tgo-ui/components/icon';\nimport {\n BadgeColor,\n BadgeColorEnum,\n BadgeVariant,\n BadgeVariantEnum,\n RebrandBadgeColor,\n RebrandBadgeColorEnum,\n} from './badge.model';\n\n@Component({\n selector: 'ui-badge',\n templateUrl: './badge.component.html',\n styleUrls: ['./badge.component.scss'],\n standalone: false,\n})\nexport class BadgeComponent {\n /*\n The label to be displayed on the badge.\n * @type {string}\n * @memberof BadgeComponent\n /\n @Input() label = '';\n\n /\n A static label always displayed after the main label, never truncated.\n * Intended for short suffixes (max 4 chars, e.g. \"100%\").\n * When the main label is truncated, the tooltip shows both labels in full.\n * @type {string}\n * @memberof BadgeComponent\n /\n @Input() staticLabel = '';\n\n /\n The icon name to be displayed on the badge.\n * @type {IconName}\n * @memberof BadgeComponent\n /\n @Input() icon: IconName = '';\n\n /\n Override color for the leading icon. Accepts any value the `ui-icon`\n * `color` input accepts (named token, hex, or CSS custom property).\n * When unset, falls back to the auto-derived color based on the badge background.\n /\n iconColor = input<string \| undefined>(undefined);\n\n /\n Optional trailing icon, rendered after the label/static label on the primary variant.\n /\n trailingIcon = input<IconName>('');\n\n /\n Override color for the trailing icon. Accepts any value the `ui-icon`\n * `color` input accepts (named token, hex, or CSS custom property).\n * When unset, falls back to the auto-derived color based on the badge background.\n /\n trailingIconColor = input<string \| undefined>(undefined);\n\n /\n The color of the badge. Defaults to 'petrol'.\n * @type {BadgeColor}\n * @memberof BadgeComponent\n /\n @Input() color: BadgeColor = 'petrol';\n\n /\n The variant of the badge. Defaults to 'primary'.\n * @type {BadgeVariant}\n * @memberof BadgeComponent\n /\n @Input() variant: BadgeVariant = 'primary';\n\n /\n The amount of notifications to be displayed on the badge.\n * @type {number}\n * @memberof BadgeComponent\n /\n @Input() notificationsAmount = 0;\n\n /\n \n * Defines the application theme\n \n @type {ApplicationTheme}\n * @memberof BadgeComponent\n /\n @Input() applicationTheme: ApplicationTheme = 'light';\n\n /\n The color of the badge on new theme. Defaults to 'brand'.\n * @type {RebrandBadgeColor}\n * @memberof BadgeComponent\n /\n @Input() rebrandColor: RebrandBadgeColor = 'brand';\n\n @Input() truncateLabel = true;\n\n /\n Whether to enable the animation when label changes from empty to having content.\n * @type {boolean}\n * @memberof BadgeComponent\n /\n @Input() enableAnimation = false;\n\n protected badgeVariant = BadgeVariantEnum;\n private darkColors: string[] = [\n BadgeColorEnum.GREY_MEDIUM,\n BadgeColorEnum.PETROL_90W,\n BadgeColorEnum.TEAL_60W,\n BadgeColorEnum.PETROL_60W,\n RebrandBadgeColorEnum.SUCCESS,\n RebrandBadgeColorEnum.INFO,\n RebrandBadgeColorEnum.BRAND,\n RebrandBadgeColorEnum.NEUTRAL,\n RebrandBadgeColorEnum.NEGATIVE,\n RebrandBadgeColorEnum.WARNING,\n RebrandBadgeColorEnum.BLUE_20,\n RebrandBadgeColorEnum.PINK_30,\n RebrandBadgeColorEnum.BLUE_10,\n RebrandBadgeColorEnum.GREY_20,\n ];\n\n constructor(\n @Optional() @Inject('CANOPYUI_DEFAULT_APPLICATION_THEME') private readonly defaultAppTheme: ApplicationTheme\n ) {\n if (defaultAppTheme) {\n this.applicationTheme = defaultAppTheme;\n }\n }\n\n protected get autoIconColor(): IconColor {\n return this.darkColors.includes(this.isClassicTheme ? this.color : this.rebrandColor) ? 'black' : 'white';\n }\n\n protected get resolvedIconColor(): IconColor {\n return this.iconColor() ?? this.autoIconColor;\n }\n\n protected get resolvedTrailingIconColor(): IconColor {\n return this.trailingIconColor() ?? this.autoIconColor;\n }\n\n protected get isClassicTheme(): boolean {\n return this.applicationTheme === 'classic';\n }\n}\n","<div\n [class]=\"'badge badge-container-' + variant\"\n [class.no-label]=\"!label && !staticLabel && !trailingIcon()\"\n [attr.aria-label]=\"label + (staticLabel ? ' ' + staticLabel : '')\"\n [attr.theme]=\"applicationTheme\"\n [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n [matTooltip]=\"\n label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4)\n ? label + (staticLabel ? ' ' + staticLabel : '')\n : ''\n \"\n [matTooltipClass]=\"applicationTheme\"\n>\n <ng-container [ngSwitch]=\"variant\">\n <ng-container ngSwitchCase=\"badgeVariant.PRIMARY\">\n <ui-icon\n ngIf=\"icon\"\n [class.badge-icon]=\"!!label \|\| !!staticLabel \|\| !!trailingIcon\"\n [name]=\"icon\"\n [color]=\"resolvedIconColor\"\n ></ui-icon>\n </ng-container>\n <ng-container ngSwitchCase=\"badgeVariant.PRIMARY_AI\">\n <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n </ng-container>\n <ng-container ngSwitchCase=\"badgeVariant.SECONDARY_AI\">\n <ng-container [ngTemplateOutlet]=\"aiIconTpl\"></ng-container>\n </ng-container>\n <div\n ngSwitchCase=\"badgeVariant.SECONDARY\"\n class=\"point\"\n [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n ></div>\n <div ngSwitchCase=\"badgeVariant.NOTIFICATION\" class=\"number-notification\">{{ notificationsAmount }}</div>\n </ng-container>\n <div\n class=\"label\"\n ngIf=\"variant !== badgeVariant.NOTIFICATION\"\n [class.empty]=\"!label && !staticLabel\"\n [class.animated]=\"enableAnimation\"\n >\n {{\n label.length > 25 - (staticLabel.length < 4 ? staticLabel.length : 4) && truncateLabel\n ? (label \| slice: 0 : 25 - (staticLabel.length < 4 ? staticLabel.length : 4)) + '...'\n : label\n }}\n </div>\n <span ngIf=\"staticLabel && variant !== badgeVariant.NOTIFICATION\" class=\"static-label\">{{\n staticLabel \| slice: 0 : 4\n }}</span>\n <ui-icon\n ngIf=\"trailingIcon() && variant === badgeVariant.PRIMARY\"\n class=\"badge-icon-trailing\"\n [name]=\"trailingIcon()\"\n [color]=\"resolvedTrailingIconColor\"\n ></ui-icon>\n</div>\n\n<ng-template #aiIconTpl>\n <ui-icon class=\"badge-icon\" [name]=\"'Sparkle-in-line'\" [color]=\"'ai'\"></ui-icon>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { BadgeComponent } from './badge.component';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { MatTooltipModule } from '@angular/material/tooltip';\n\n@NgModule({\n declarations: [BadgeComponent],\n imports: [CommonModule, IconComponentModule, MatTooltipModule],\n exports: [BadgeComponent],\n})\nexport class BadgeComponentModule {}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}

package/fesm2022/testgorilla-tgo-ui-components-breadcrumb.mjs CHANGED Viewed

@@ -193,7 +193,7 @@ class BreadcrumbComponent {
         this.resizeObserver.observe(this.breadcrumbContainer.nativeElement);
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: BreadcrumbComponent, deps: [{ token: i0.Injector }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: BreadcrumbComponent, isStandalone: false, selector: "ui-breadcrumb", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, applicationTheme: { classPropertyName: "applicationTheme", publicName: "applicationTheme", isSignal: true, isRequired: false, transformFunction: null }, includeBackButton: { classPropertyName: "includeBackButton", publicName: "includeBackButton", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, numberOfLoadingItems: { classPropertyName: "numberOfLoadingItems", publicName: "numberOfLoadingItems", isSignal: true, isRequired: false, transformFunction: null }, maxItemLength: { classPropertyName: "maxItemLength", publicName: "maxItemLength", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectItem: "selectItem", backButtonClickEvent: "backButtonClickEvent" }, viewQueries: [{ propertyName: "breadcrumbContainer", first: true, predicate: ["breadcrumbContainer"], descendants: true }], ngImport: i0, template: "@if (!isLoading()) {\n  <div class=\"breadcrumb\" [attr.theme]=\"applicationTheme()\" #breadcrumbContainer [class]=\"'breadcrumb-' + size()\">\n    @if (includeBackButton()) {\n      <ui-button\n        [variant]=\"'icon-button'\"\n        [tooltip]=\"('COMMON.BACK' | uiTranslate | async)!\"\n        [iconName]=\"'Arrow-chevron-left-filled'\"\n        (buttonClickEvent)=\"backButtonClickEvent.emit($event)\"\n      ></ui-button>\n    }\n    @if (isOverflowing()) {\n      <ui-overflow-menu\n        [applicationTheme]=\"applicationTheme()\"\n        [contentTemplateRef]=\"overflowMenu\"\n        [buttons]=\"overflowButtonItems()\"\n        [matTooltip]=\"('COMMON.OPTIONS' | uiTranslate | async)!\"\n        [matTooltipClass]=\"applicationTheme()\"\n        [isDynamicMenu]=\"true\"\n        (selectItem)=\"selectItem.emit($event)\"\n        class=\"breadcrumb-overflow-menu\"\n      ></ui-overflow-menu>\n      <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n    }\n    @for (item of visibleItems(); track item.value) {\n      @if (!$last) {\n        <span\n          class=\"breadcrumb-item\"\n          tabindex=\"0\"\n          [matTooltip]=\"item.label.length > maxItemLength() ? item.label : ''\"\n          [matTooltipClass]=\"applicationTheme()\"\n          [attr.aria-label]=\"item.label\"\n          (click)=\"selectItem.emit(item.value)\"\n          (keydown.enter)=\"selectItem.emit(item.value)\"\n        >\n          {{ item.label | truncate: maxItemLength() : '...' }}\n        </span>\n        <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n      } @else {\n        <strong\n          class=\"breadcrumb-item-active\"\n          tabindex=\"0\"\n          [matTooltip]=\"shouldTruncateLastItem() ? item.label : ''\"\n          [matTooltipClass]=\"applicationTheme()\"\n          [class.breadcrumb-item-active-truncated]=\"shouldTruncateLastItem()\"\n          [attr.aria-label]=\"item.label\"\n          [attr.aria-current]=\"'page'\"\n          (click)=\"selectItem.emit(item.value)\"\n          (keydown.enter)=\"selectItem.emit(item.value)\"\n        >\n          {{ item.label }}\n        </strong>\n      }\n    }\n  </div>\n} @else {\n  <div class=\"breadcrumb\">\n    @for (i of loadingItems(); track $index) {\n      <ui-skeleton count=\"1\" [theme]=\"{ width: '160px', margin: '10px 0 0' }\"></ui-skeleton>\n      @if ($index !== numberOfLoadingItems() - 1) {\n        <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n      }\n    }\n  </div>\n}\n<ng-template #overflowMenu>\n  <div class=\"breadcrumb-item breadcrumb-overflow\" [class]=\"'breadcrumb-' + size()\">...</div>\n</ng-template>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{min-width:0}:host .breadcrumb{display:flex;align-items:center;gap:4px;color:#666}:host .breadcrumb .breadcrumb-item{text-decoration:underline;cursor:pointer;transition:color .15s ease,transform .1s ease;white-space:nowrap}:host .breadcrumb .breadcrumb-item:hover{color:#919191}:host .breadcrumb .breadcrumb-item:active{transform:scale(.98);color:#919191}:host .breadcrumb .breadcrumb-item:focus-visible{outline:2px solid #242424;outline-offset:4px;border-radius:1px}:host .breadcrumb.breadcrumb-small{font-size:14px;line-height:22px}:host .breadcrumb.breadcrumb-medium{font-size:20px;line-height:26px}:host .breadcrumb.breadcrumb-large{font-size:32px;line-height:48px}:host .breadcrumb.breadcrumb-large .breadcrumb-item:focus-visible{outline-offset:8px}:host .breadcrumb.breadcrumb-large .breadcrumb-item-active{font-weight:900!important}:host .breadcrumb.breadcrumb-large .breadcrumb-item-active:focus-visible{outline-offset:8px}:host .breadcrumb .breadcrumb-item-active{color:#242424;white-space:nowrap}:host .breadcrumb .breadcrumb-item-active.breadcrumb-item-active-truncated{text-overflow:ellipsis;overflow:hidden}:host .breadcrumb .breadcrumb-item-active:focus-visible{outline:2px solid #242424;outline-offset:4px;border-radius:1px}:host .breadcrumb .breadcrumb-overflow-menu ::ng-deep .overflow-menu-container .mat-mdc-menu-trigger{min-width:0}:host .breadcrumb-overflow{cursor:pointer;color:#666}:host .breadcrumb-overflow:active{transform:scale(.98);color:#919191}:host .breadcrumb-overflow.breadcrumb-small{font-size:14px;line-height:22px}:host .breadcrumb-overflow.breadcrumb-medium{font-size:20px;line-height:26px}:host .breadcrumb-overflow.breadcrumb-large{font-size:32px;line-height:48px}\n"], dependencies: [{ kind: "component", type: i1.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i3.OverflowMenuComponent, selector: "ui-overflow-menu", inputs: ["buttons", "iconTrigger", "menuLabel", "applicationTheme", "ariaLabel", "ariaRequired", "describedby", "contentTemplateRef", "buttonVariant", "buttonSize", "menuConfig", "isDynamicMenu", "withRemovableOption"], outputs: ["selectItem", "menuOpened", "menuClosed"] }, { kind: "component", type: i4.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: i5.SkeletonComponent, selector: "ui-skeleton", inputs: ["count", "theme", "appearance", "isAiTheme", "applicationTheme"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: i7.TruncatePipe, name: "truncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.20", type: BreadcrumbComponent, isStandalone: false, selector: "ui-breadcrumb", inputs: { size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null }, items: { classPropertyName: "items", publicName: "items", isSignal: true, isRequired: false, transformFunction: null }, applicationTheme: { classPropertyName: "applicationTheme", publicName: "applicationTheme", isSignal: true, isRequired: false, transformFunction: null }, includeBackButton: { classPropertyName: "includeBackButton", publicName: "includeBackButton", isSignal: true, isRequired: false, transformFunction: null }, isLoading: { classPropertyName: "isLoading", publicName: "isLoading", isSignal: true, isRequired: false, transformFunction: null }, numberOfLoadingItems: { classPropertyName: "numberOfLoadingItems", publicName: "numberOfLoadingItems", isSignal: true, isRequired: false, transformFunction: null }, maxItemLength: { classPropertyName: "maxItemLength", publicName: "maxItemLength", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { selectItem: "selectItem", backButtonClickEvent: "backButtonClickEvent" }, viewQueries: [{ propertyName: "breadcrumbContainer", first: true, predicate: ["breadcrumbContainer"], descendants: true }], ngImport: i0, template: "@if (!isLoading()) {\n  <div class=\"breadcrumb\" [attr.theme]=\"applicationTheme()\" #breadcrumbContainer [class]=\"'breadcrumb-' + size()\">\n    @if (includeBackButton()) {\n      <ui-button\n        [variant]=\"'icon-button'\"\n        [tooltip]=\"('COMMON.BACK' | uiTranslate | async)!\"\n        [iconName]=\"'Arrow-chevron-left-filled'\"\n        (buttonClickEvent)=\"backButtonClickEvent.emit($event)\"\n      ></ui-button>\n    }\n    @if (isOverflowing()) {\n      <ui-overflow-menu\n        [applicationTheme]=\"applicationTheme()\"\n        [contentTemplateRef]=\"overflowMenu\"\n        [buttons]=\"overflowButtonItems()\"\n        [matTooltip]=\"('COMMON.OPTIONS' | uiTranslate | async)!\"\n        [matTooltipClass]=\"applicationTheme()\"\n        [isDynamicMenu]=\"true\"\n        (selectItem)=\"selectItem.emit($event)\"\n        class=\"breadcrumb-overflow-menu\"\n      ></ui-overflow-menu>\n      <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n    }\n    @for (item of visibleItems(); track item.value) {\n      @if (!$last) {\n        <span\n          class=\"breadcrumb-item\"\n          tabindex=\"0\"\n          [matTooltip]=\"item.label.length > maxItemLength() ? item.label : ''\"\n          [matTooltipClass]=\"applicationTheme()\"\n          [attr.aria-label]=\"item.label\"\n          (click)=\"selectItem.emit(item.value)\"\n          (keydown.enter)=\"selectItem.emit(item.value)\"\n        >\n          {{ item.label | truncate: maxItemLength() : '...' }}\n        </span>\n        <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n      } @else {\n        <strong\n          class=\"breadcrumb-item-active\"\n          tabindex=\"0\"\n          [matTooltip]=\"shouldTruncateLastItem() ? item.label : ''\"\n          [matTooltipClass]=\"applicationTheme()\"\n          [class.breadcrumb-item-active-truncated]=\"shouldTruncateLastItem()\"\n          [attr.aria-label]=\"item.label\"\n          [attr.aria-current]=\"'page'\"\n          (click)=\"selectItem.emit(item.value)\"\n          (keydown.enter)=\"selectItem.emit(item.value)\"\n        >\n          {{ item.label }}\n        </strong>\n      }\n    }\n  </div>\n} @else {\n  <div class=\"breadcrumb\">\n    @for (i of loadingItems(); track $index) {\n      <ui-skeleton count=\"1\" [theme]=\"{ width: '160px', margin: '10px 0 0' }\"></ui-skeleton>\n      @if ($index !== numberOfLoadingItems() - 1) {\n        <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n      }\n    }\n  </div>\n}\n<ng-template #overflowMenu>\n  <div class=\"breadcrumb-item breadcrumb-overflow\" [class]=\"'breadcrumb-' + size()\">...</div>\n</ng-template>\n", styles: [".bg-teal-60b{background:#1c443c}.bg-teal-30b{background:#31766a}.bg-teal-default{background:#46a997}.bg-teal-30w{background:#7ec3b6}.bg-teal-60w{background:#b5ddd5}.bg-teal-secondary{background:#cbd6cb}.bg-teal-90w{background:#ecf6f5}.bg-petrol-60b{background:#102930}.bg-petrol-30b{background:#1b4754}.bg-petrol-default{background:#276678}.bg-petrol-30w{background:#6894a0}.bg-petrol-60w{background:#a9c2c9}.bg-petrol-secondary{background:#c8d7de}.bg-petrol-90w{background:#e9f0f1}.bg-error-60b{background:#513131}.bg-error-30b{background:#8e5655}.bg-error-60w{background:#e3c3c6}.bg-error-secondary{background:#f0dad9}.bg-error-default{background:#cb7b7a}.bg-warning-secondary{background:#f0d6bb}.bg-warning-default{background:#cca45f}.bg-black{background:#000}.bg-dark{background:#888}.bg-medium{background:#e0e0e0}.bg-grey{background:#ededed}.bg-light{background:#f6f6f6}.bg-white{background:#fff}.bg-box-shadow{background:#00000014}.bg-navigation-subtitle{background:#528593}.bgc-teal-60b{background-color:#1c443c}.bgc-teal-30b{background-color:#31766a}.bgc-teal-default{background-color:#46a997}.bgc-teal-30w{background-color:#7ec3b6}.bgc-teal-60w{background-color:#b5ddd5}.bgc-teal-secondary{background-color:#cbd6cb}.bgc-teal-90w{background-color:#ecf6f5}.bgc-petrol-60b{background-color:#102930}.bgc-petrol-30b{background-color:#1b4754}.bgc-petrol-default{background-color:#276678}.bgc-petrol-30w{background-color:#6894a0}.bgc-petrol-60w{background-color:#a9c2c9}.bgc-petrol-secondary{background-color:#c8d7de}.bgc-petrol-90w{background-color:#e9f0f1}.bgc-error-60b{background-color:#513131}.bgc-error-30b{background-color:#8e5655}.bgc-error-60w{background-color:#e3c3c6}.bgc-error-secondary{background-color:#f0dad9}.bgc-error-default{background-color:#cb7b7a}.bgc-warning-secondary{background-color:#f0d6bb}.bgc-warning-default{background-color:#cca45f}.bgc-black{background-color:#000}.bgc-dark{background-color:#888}.bgc-medium{background-color:#e0e0e0}.bgc-grey{background-color:#ededed}.bgc-light{background-color:#f6f6f6}.bgc-white{background-color:#fff}.bgc-box-shadow{background-color:#00000014}.bgc-navigation-subtitle{background-color:#528593}:host{min-width:0}:host .breadcrumb{display:flex;align-items:center;gap:4px;color:#666}:host .breadcrumb .breadcrumb-item{text-decoration:underline;cursor:pointer;transition:color .15s ease,transform .1s ease;white-space:nowrap}:host .breadcrumb .breadcrumb-item:hover{color:#919191}:host .breadcrumb .breadcrumb-item:active{transform:scale(.98);color:#919191}:host .breadcrumb .breadcrumb-item:focus-visible{outline:2px solid #242424;outline-offset:4px;border-radius:1px}:host .breadcrumb.breadcrumb-small{font-size:14px;line-height:22px}:host .breadcrumb.breadcrumb-medium{font-size:20px;line-height:26px}:host .breadcrumb.breadcrumb-large{font-size:32px;line-height:48px}:host .breadcrumb.breadcrumb-large .breadcrumb-item:focus-visible{outline-offset:8px}:host .breadcrumb.breadcrumb-large .breadcrumb-item-active{font-weight:900!important}:host .breadcrumb.breadcrumb-large .breadcrumb-item-active:focus-visible{outline-offset:8px}:host .breadcrumb .breadcrumb-item-active{color:#242424;white-space:nowrap}:host .breadcrumb .breadcrumb-item-active.breadcrumb-item-active-truncated{text-overflow:ellipsis;overflow:hidden}:host .breadcrumb .breadcrumb-item-active:focus-visible{outline:2px solid #242424;outline-offset:4px;border-radius:1px}:host .breadcrumb .breadcrumb-overflow-menu ::ng-deep .overflow-menu-container .mat-mdc-menu-trigger{min-width:0}:host .breadcrumb-overflow{cursor:pointer;color:#666}:host .breadcrumb-overflow:active{transform:scale(.98);color:#919191}:host .breadcrumb-overflow.breadcrumb-small{font-size:14px;line-height:22px}:host .breadcrumb-overflow.breadcrumb-medium{font-size:20px;line-height:26px}:host .breadcrumb-overflow.breadcrumb-large{font-size:32px;line-height:48px}\n"], dependencies: [{ kind: "component", type: i1.IconComponent, selector: "ui-icon", inputs: ["size", "cssClass", "name", "color", "filled", "toggleIconStyle", "applicationTheme", "useFullIconName"] }, { kind: "directive", type: i2.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i3.OverflowMenuComponent, selector: "ui-overflow-menu", inputs: ["buttons", "iconTrigger", "menuLabel", "applicationTheme", "ariaLabel", "ariaRequired", "describedby", "contentTemplateRef", "buttonVariant", "buttonSize", "menuConfig", "isDynamicMenu", "withRemovableOption"], outputs: ["selectItem", "menuOpened", "menuClosed"] }, { kind: "component", type: i4.ButtonComponent, selector: "ui-button", inputs: ["size", "variant", "label", "iconPosition", "justIcon", "iconName", "disabled", "loading", "loadingWithLabel", "fullWidth", "url", "urlTarget", "value", "tooltip", "isPremium", "type", "companyColor", "buttonBadgeConfig", "applicationTheme", "disabledScaleOnClick", "ariaLabel", "ariaRequired", "ariaLabelledby", "ariaDescribedby", "preventDefault", "hasBackground", "tooltipPosition", "role", "iconFilled"], outputs: ["buttonClickEvent", "buttonHoverEvent"] }, { kind: "component", type: i5.SkeletonComponent, selector: "ui-skeleton", inputs: ["count", "theme", "appearance", "isAiTheme", "applicationTheme"] }, { kind: "pipe", type: i6.AsyncPipe, name: "async" }, { kind: "pipe", type: i7.UiTranslatePipe, name: "uiTranslate" }, { kind: "pipe", type: i7.TruncatePipe, name: "truncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.20", ngImport: i0, type: BreadcrumbComponent, decorators: [{
             type: Component,

package/fesm2022/testgorilla-tgo-ui-components-breadcrumb.mjs.map CHANGED Viewed

	@@ -1 +1 @@
1	- {"version":3,"file":"testgorilla-tgo-ui-components-breadcrumb.mjs","sources":["../../../components/breadcrumb/breadcrumb.component.ts","../../../components/breadcrumb/breadcrumb.component.html","../../../components/breadcrumb/breadcrumb.component.module.ts","../../../components/breadcrumb/testgorilla-tgo-ui-components-breadcrumb.ts"],"sourcesContent":["import {\n AfterViewInit,\n Component,\n input,\n signal,\n ViewChild,\n OnDestroy,\n computed,\n EventEmitter,\n Output,\n effect,\n ChangeDetectionStrategy,\n Injector,\n afterNextRender,\n} from '@angular/core';\nimport { BreadcrumbItem, BreadcrumbSize } from './breadcrumb.model';\nimport { ElementRef } from '@angular/core';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { OverflowMenuButtonsType } from '@testgorilla/tgo-ui/components/overflow-menu';\n\n@Component({\n selector: 'ui-breadcrumb',\n templateUrl: './breadcrumb.component.html',\n styleUrls: ['./breadcrumb.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: false,\n})\nexport class BreadcrumbComponent implements AfterViewInit, OnDestroy {\n size = input<BreadcrumbSize>('large');\n items = input<BreadcrumbItem[]>([]);\n applicationTheme = input<ApplicationTheme>('light');\n includeBackButton = input<boolean>(false);\n isLoading = input<boolean>(false);\n numberOfLoadingItems = input<number>(3);\n maxItemLength = input<number>(18);\n @Output() selectItem: EventEmitter<string> = new EventEmitter<string>();\n @Output() backButtonClickEvent: EventEmitter<Event> = new EventEmitter<Event>();\n\n loadingItems = computed(() => Array(this.numberOfLoadingItems()));\n isOverflowing = signal<boolean>(false);\n visibleItems = signal<BreadcrumbItem[]>([]);\n overflowItems = signal<BreadcrumbItem[]>([]);\n overflowButtonItems = computed<OverflowMenuButtonsType[]>(() =>\n this.overflowItems().map(item => ({\n label: item.label,\n value: item.value,\n }))\n );\n shouldTruncateLastItem = signal<boolean>(false);\n\n @ViewChild('breadcrumbContainer') breadcrumbContainer!: ElementRef<HTMLElement>;\n\n private resizeObserver?: ResizeObserver;\n private itemsInOverflow = 0;\n private previousLoadingState?: boolean;\n private injector = Injector.create({ providers: [] });\n\n constructor(private readonly parentInjector: Injector) {\n this.injector = parentInjector;\n // React to items changes and recalculate overflow\n effect(() => {\n this.items();\n this.itemsInOverflow = 0;\n\n // Only proceed if not in loading state\n if (!this.isLoading()) {\n // Use afterNextRender to ensure DOM is updated before calculating\n afterNextRender(\n () => {\n if (this.breadcrumbContainer?.nativeElement) {\n this.calculateItemDistribution();\n }\n },\n { injector: this.injector }\n );\n }\n });\n\n // React to loading state changes and setup ResizeObserver when loading changes from true to false\n effect(() => {\n const currentLoadingState = this.isLoading();\n\n if (this.previousLoadingState === true && currentLoadingState === false) {\n // Use afterNextRender to ensure DOM is ready before setting up observer\n afterNextRender(\n () => {\n this.setupResizeObserver();\n },\n { injector: this.injector }\n );\n }\n\n this.previousLoadingState = currentLoadingState;\n });\n }\n\n ngAfterViewInit() {\n this.calculateItemDistribution();\n this.setupResizeObserver();\n }\n\n ngOnDestroy() {\n this.resizeObserver?.disconnect();\n }\n\n private calculateItemDistribution() {\n if (!this.breadcrumbContainer?.nativeElement \|\| this.items().length === 0) {\n this.resetToAllVisible();\n return;\n }\n\n const element = this.breadcrumbContainer.nativeElement;\n const hasHorizontalOverflow = element.scrollWidth > element.clientWidth;\n\n if (hasHorizontalOverflow) {\n this.handleOverflow();\n } else if (this.itemsInOverflow > 0) {\n // Check if we can bring items back from overflow\n this.tryReduceOverflow();\n } else {\n this.resetToAllVisible();\n }\n }\n\n private handleOverflow() {\n this.itemsInOverflow = Math.min(this.itemsInOverflow + 1, this.items().length - 1);\n\n this.updateItemArrays();\n this.isOverflowing.set(true);\n\n // Wait for DOM to render the updated template after hiding items\n // We need to measure dimensions AFTER the DOM has been updated with the new visible items\n setTimeout(() => {\n if (this.breadcrumbContainer?.nativeElement) {\n const element = this.breadcrumbContainer.nativeElement;\n const stillOverflowing = element.scrollWidth > element.clientWidth;\n\n if (stillOverflowing && this.itemsInOverflow < this.items().length - 1) {\n this.handleOverflow();\n } else if (stillOverflowing && this.itemsInOverflow === this.items().length - 1) {\n this.shouldTruncateLastItem.set(true);\n }\n }\n }, 0);\n }\n\n private tryReduceOverflow() {\n const testItemsInOverflow = this.itemsInOverflow - 1;\n\n if (testItemsInOverflow >= 0) {\n const testVisibleItems = this.items().slice(testItemsInOverflow);\n const testOverflowItems = testItemsInOverflow > 0 ? this.items().slice(0, testItemsInOverflow) : [];\n\n this.visibleItems.set(testVisibleItems);\n this.overflowItems.set(testOverflowItems);\n\n // Always reset truncation when trying to reduce overflow\n this.shouldTruncateLastItem.set(false);\n\n // Wait for DOM to render with test configuration before measuring\n setTimeout(() => {\n if (this.breadcrumbContainer?.nativeElement) {\n const element = this.breadcrumbContainer.nativeElement;\n const hasOverflow = element.scrollWidth > element.clientWidth;\n\n if (!hasOverflow) {\n // It fits! Update the counter\n this.itemsInOverflow = testItemsInOverflow;\n this.isOverflowing.set(this.itemsInOverflow > 0);\n\n // Try to reduce more if there are still items in overflow\n if (this.itemsInOverflow > 0) {\n // Schedule next reduction attempt after current render cycle\n setTimeout(() => this.tryReduceOverflow(), 0);\n }\n } else {\n // Doesn't fit, revert to previous state\n this.updateItemArrays();\n\n // Wait for DOM to render reverted state before checking truncation\n setTimeout(() => {\n if (this.breadcrumbContainer?.nativeElement) {\n const containerElement = this.breadcrumbContainer.nativeElement;\n const stillOverflowing = containerElement.scrollWidth > containerElement.clientWidth;\n\n if (stillOverflowing && this.itemsInOverflow === this.items().length - 1) {\n this.shouldTruncateLastItem.set(true);\n }\n }\n }, 0);\n }\n }\n }, 0);\n } else {\n // testItemsInOverflow < 0, means we're trying to show all items\n this.resetToAllVisible();\n\n // Wait for DOM to render all items before measuring overflow\n setTimeout(() => {\n if (this.breadcrumbContainer?.nativeElement) {\n const element = this.breadcrumbContainer.nativeElement;\n const hasOverflow = element.scrollWidth > element.clientWidth;\n\n if (hasOverflow) {\n // Still overflows with all items, need to go back to overflow state\n this.itemsInOverflow = 1; // Start with minimal overflow\n this.handleOverflow();\n }\n }\n }, 0);\n }\n }\n\n private updateItemArrays() {\n if (this.itemsInOverflow > 0) {\n this.overflowItems.set(this.items().slice(0, this.itemsInOverflow));\n this.visibleItems.set(this.items().slice(this.itemsInOverflow));\n } else {\n this.resetToAllVisible();\n }\n }\n\n private resetToAllVisible() {\n this.visibleItems.set(this.items());\n this.overflowItems.set([]);\n this.isOverflowing.set(false);\n this.shouldTruncateLastItem.set(false);\n this.itemsInOverflow = 0;\n }\n\n private setupResizeObserver() {\n if (!this.breadcrumbContainer?.nativeElement) {\n return;\n }\n\n this.resizeObserver = new ResizeObserver(() => {\n this.calculateItemDistribution();\n });\n\n this.resizeObserver.observe(this.breadcrumbContainer.nativeElement);\n }\n}\n","@if (!isLoading()) {\n <div class=\"breadcrumb\" [attr.theme]=\"applicationTheme()\" #breadcrumbContainer [class]=\"'breadcrumb-' + size()\">\n @if (includeBackButton()) {\n <ui-button\n [variant]=\"'icon-button'\"\n [tooltip]=\"('COMMON.BACK' \| uiTranslate \| async)!\"\n [iconName]=\"'Arrow-chevron-left-filled'\"\n (buttonClickEvent)=\"backButtonClickEvent.emit($event)\"\n ></ui-button>\n }\n @if (isOverflowing()) {\n <ui-overflow-menu\n [applicationTheme]=\"applicationTheme()\"\n [contentTemplateRef]=\"overflowMenu\"\n [buttons]=\"overflowButtonItems()\"\n [matTooltip]=\"('COMMON.OPTIONS' \| uiTranslate \| async)!\"\n [matTooltipClass]=\"applicationTheme()\"\n [isDynamicMenu]=\"true\"\n (selectItem)=\"selectItem.emit($event)\"\n class=\"breadcrumb-overflow-menu\"\n ></ui-overflow-menu>\n <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n }\n @for (item of visibleItems(); track item.value) {\n @if (!$last) {\n <span\n class=\"breadcrumb-item\"\n tabindex=\"0\"\n [matTooltip]=\"item.label.length > maxItemLength() ? item.label : ''\"\n [matTooltipClass]=\"applicationTheme()\"\n [attr.aria-label]=\"item.label\"\n (click)=\"selectItem.emit(item.value)\"\n (keydown.enter)=\"selectItem.emit(item.value)\"\n >\n {{ item.label \| truncate: maxItemLength() : '...' }}\n </span>\n <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n } @else {\n <strong\n class=\"breadcrumb-item-active\"\n tabindex=\"0\"\n [matTooltip]=\"shouldTruncateLastItem() ? item.label : ''\"\n [matTooltipClass]=\"applicationTheme()\"\n [class.breadcrumb-item-active-truncated]=\"shouldTruncateLastItem()\"\n [attr.aria-label]=\"item.label\"\n [attr.aria-current]=\"'page'\"\n (click)=\"selectItem.emit(item.value)\"\n (keydown.enter)=\"selectItem.emit(item.value)\"\n >\n {{ item.label }}\n </strong>\n }\n }\n </div>\n} @else {\n <div class=\"breadcrumb\">\n @for (i of loadingItems(); track $index) {\n <ui-skeleton count=\"1\" [theme]=\"{ width: '160px', margin: '10px 0 0' }\"></ui-skeleton>\n @if ($index !== numberOfLoadingItems() - 1) {\n <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n }\n }\n </div>\n}\n<ng-template #overflowMenu>\n <div class=\"breadcrumb-item breadcrumb-overflow\" [class]=\"'breadcrumb-' + size()\">...</div>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { BreadcrumbComponent } from './breadcrumb.component';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { OverflowMenuComponentModule } from '@testgorilla/tgo-ui/components/overflow-menu';\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { UiTranslatePipe, TruncatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { SkeletonComponent } from '@testgorilla/tgo-ui/components/skeleton';\n\n@NgModule({\n declarations: [BreadcrumbComponent],\n imports: [\n CommonModule,\n IconComponentModule,\n MatTooltipModule,\n OverflowMenuComponentModule,\n ButtonComponentModule,\n SkeletonComponent,\n UiTranslatePipe,\n TruncatePipe,\n ],\n exports: [BreadcrumbComponent],\n})\nexport class BreadcrumbComponentModule {}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}
1	+ {"version":3,"file":"testgorilla-tgo-ui-components-breadcrumb.mjs","sources":["../../../components/breadcrumb/breadcrumb.component.ts","../../../components/breadcrumb/breadcrumb.component.html","../../../components/breadcrumb/breadcrumb.component.module.ts","../../../components/breadcrumb/testgorilla-tgo-ui-components-breadcrumb.ts"],"sourcesContent":["import {\n AfterViewInit,\n Component,\n input,\n signal,\n ViewChild,\n OnDestroy,\n computed,\n EventEmitter,\n Output,\n effect,\n ChangeDetectionStrategy,\n Injector,\n afterNextRender,\n} from '@angular/core';\nimport { BreadcrumbItem, BreadcrumbSize } from './breadcrumb.model';\nimport { ElementRef } from '@angular/core';\nimport { ApplicationTheme } from '@testgorilla/tgo-ui/components/core';\nimport { OverflowMenuButtonsType } from '@testgorilla/tgo-ui/components/overflow-menu';\n\n@Component({\n selector: 'ui-breadcrumb',\n templateUrl: './breadcrumb.component.html',\n styleUrls: ['./breadcrumb.component.scss'],\n changeDetection: ChangeDetectionStrategy.OnPush,\n standalone: false,\n})\nexport class BreadcrumbComponent implements AfterViewInit, OnDestroy {\n size = input<BreadcrumbSize>('large');\n items = input<BreadcrumbItem[]>([]);\n applicationTheme = input<ApplicationTheme>('light');\n includeBackButton = input<boolean>(false);\n isLoading = input<boolean>(false);\n numberOfLoadingItems = input<number>(3);\n maxItemLength = input<number>(18);\n @Output() selectItem: EventEmitter<string> = new EventEmitter<string>();\n @Output() backButtonClickEvent: EventEmitter<Event> = new EventEmitter<Event>();\n\n loadingItems = computed(() => Array(this.numberOfLoadingItems()));\n isOverflowing = signal<boolean>(false);\n visibleItems = signal<BreadcrumbItem[]>([]);\n overflowItems = signal<BreadcrumbItem[]>([]);\n overflowButtonItems = computed<OverflowMenuButtonsType[]>(() =>\n this.overflowItems().map(item => ({\n label: item.label,\n value: item.value,\n }))\n );\n shouldTruncateLastItem = signal<boolean>(false);\n\n @ViewChild('breadcrumbContainer') breadcrumbContainer!: ElementRef<HTMLElement>;\n\n private resizeObserver?: ResizeObserver;\n private itemsInOverflow = 0;\n private previousLoadingState?: boolean;\n private injector = Injector.create({ providers: [] });\n\n constructor(private readonly parentInjector: Injector) {\n this.injector = parentInjector;\n // React to items changes and recalculate overflow\n effect(() => {\n this.items();\n this.itemsInOverflow = 0;\n\n // Only proceed if not in loading state\n if (!this.isLoading()) {\n // Use afterNextRender to ensure DOM is updated before calculating\n afterNextRender(\n () => {\n if (this.breadcrumbContainer?.nativeElement) {\n this.calculateItemDistribution();\n }\n },\n { injector: this.injector }\n );\n }\n });\n\n // React to loading state changes and setup ResizeObserver when loading changes from true to false\n effect(() => {\n const currentLoadingState = this.isLoading();\n\n if (this.previousLoadingState === true && currentLoadingState === false) {\n // Use afterNextRender to ensure DOM is ready before setting up observer\n afterNextRender(\n () => {\n this.setupResizeObserver();\n },\n { injector: this.injector }\n );\n }\n\n this.previousLoadingState = currentLoadingState;\n });\n }\n\n ngAfterViewInit() {\n this.calculateItemDistribution();\n this.setupResizeObserver();\n }\n\n ngOnDestroy() {\n this.resizeObserver?.disconnect();\n }\n\n private calculateItemDistribution() {\n if (!this.breadcrumbContainer?.nativeElement \|\| this.items().length === 0) {\n this.resetToAllVisible();\n return;\n }\n\n const element = this.breadcrumbContainer.nativeElement;\n const hasHorizontalOverflow = element.scrollWidth > element.clientWidth;\n\n if (hasHorizontalOverflow) {\n this.handleOverflow();\n } else if (this.itemsInOverflow > 0) {\n // Check if we can bring items back from overflow\n this.tryReduceOverflow();\n } else {\n this.resetToAllVisible();\n }\n }\n\n private handleOverflow() {\n this.itemsInOverflow = Math.min(this.itemsInOverflow + 1, this.items().length - 1);\n\n this.updateItemArrays();\n this.isOverflowing.set(true);\n\n // Wait for DOM to render the updated template after hiding items\n // We need to measure dimensions AFTER the DOM has been updated with the new visible items\n setTimeout(() => {\n if (this.breadcrumbContainer?.nativeElement) {\n const element = this.breadcrumbContainer.nativeElement;\n const stillOverflowing = element.scrollWidth > element.clientWidth;\n\n if (stillOverflowing && this.itemsInOverflow < this.items().length - 1) {\n this.handleOverflow();\n } else if (stillOverflowing && this.itemsInOverflow === this.items().length - 1) {\n this.shouldTruncateLastItem.set(true);\n }\n }\n }, 0);\n }\n\n private tryReduceOverflow() {\n const testItemsInOverflow = this.itemsInOverflow - 1;\n\n if (testItemsInOverflow >= 0) {\n const testVisibleItems = this.items().slice(testItemsInOverflow);\n const testOverflowItems = testItemsInOverflow > 0 ? this.items().slice(0, testItemsInOverflow) : [];\n\n this.visibleItems.set(testVisibleItems);\n this.overflowItems.set(testOverflowItems);\n\n // Always reset truncation when trying to reduce overflow\n this.shouldTruncateLastItem.set(false);\n\n // Wait for DOM to render with test configuration before measuring\n setTimeout(() => {\n if (this.breadcrumbContainer?.nativeElement) {\n const element = this.breadcrumbContainer.nativeElement;\n const hasOverflow = element.scrollWidth > element.clientWidth;\n\n if (!hasOverflow) {\n // It fits! Update the counter\n this.itemsInOverflow = testItemsInOverflow;\n this.isOverflowing.set(this.itemsInOverflow > 0);\n\n // Try to reduce more if there are still items in overflow\n if (this.itemsInOverflow > 0) {\n // Schedule next reduction attempt after current render cycle\n setTimeout(() => this.tryReduceOverflow(), 0);\n }\n } else {\n // Doesn't fit, revert to previous state\n this.updateItemArrays();\n\n // Wait for DOM to render reverted state before checking truncation\n setTimeout(() => {\n if (this.breadcrumbContainer?.nativeElement) {\n const containerElement = this.breadcrumbContainer.nativeElement;\n const stillOverflowing = containerElement.scrollWidth > containerElement.clientWidth;\n\n if (stillOverflowing && this.itemsInOverflow === this.items().length - 1) {\n this.shouldTruncateLastItem.set(true);\n }\n }\n }, 0);\n }\n }\n }, 0);\n } else {\n // testItemsInOverflow < 0, means we're trying to show all items\n this.resetToAllVisible();\n\n // Wait for DOM to render all items before measuring overflow\n setTimeout(() => {\n if (this.breadcrumbContainer?.nativeElement) {\n const element = this.breadcrumbContainer.nativeElement;\n const hasOverflow = element.scrollWidth > element.clientWidth;\n\n if (hasOverflow) {\n // Still overflows with all items, need to go back to overflow state\n this.itemsInOverflow = 1; // Start with minimal overflow\n this.handleOverflow();\n }\n }\n }, 0);\n }\n }\n\n private updateItemArrays() {\n if (this.itemsInOverflow > 0) {\n this.overflowItems.set(this.items().slice(0, this.itemsInOverflow));\n this.visibleItems.set(this.items().slice(this.itemsInOverflow));\n } else {\n this.resetToAllVisible();\n }\n }\n\n private resetToAllVisible() {\n this.visibleItems.set(this.items());\n this.overflowItems.set([]);\n this.isOverflowing.set(false);\n this.shouldTruncateLastItem.set(false);\n this.itemsInOverflow = 0;\n }\n\n private setupResizeObserver() {\n if (!this.breadcrumbContainer?.nativeElement) {\n return;\n }\n\n this.resizeObserver = new ResizeObserver(() => {\n this.calculateItemDistribution();\n });\n\n this.resizeObserver.observe(this.breadcrumbContainer.nativeElement);\n }\n}\n","@if (!isLoading()) {\n <div class=\"breadcrumb\" [attr.theme]=\"applicationTheme()\" #breadcrumbContainer [class]=\"'breadcrumb-' + size()\">\n @if (includeBackButton()) {\n <ui-button\n [variant]=\"'icon-button'\"\n [tooltip]=\"('COMMON.BACK' \| uiTranslate \| async)!\"\n [iconName]=\"'Arrow-chevron-left-filled'\"\n (buttonClickEvent)=\"backButtonClickEvent.emit($event)\"\n ></ui-button>\n }\n @if (isOverflowing()) {\n <ui-overflow-menu\n [applicationTheme]=\"applicationTheme()\"\n [contentTemplateRef]=\"overflowMenu\"\n [buttons]=\"overflowButtonItems()\"\n [matTooltip]=\"('COMMON.OPTIONS' \| uiTranslate \| async)!\"\n [matTooltipClass]=\"applicationTheme()\"\n [isDynamicMenu]=\"true\"\n (selectItem)=\"selectItem.emit($event)\"\n class=\"breadcrumb-overflow-menu\"\n ></ui-overflow-menu>\n <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n }\n @for (item of visibleItems(); track item.value) {\n @if (!$last) {\n <span\n class=\"breadcrumb-item\"\n tabindex=\"0\"\n [matTooltip]=\"item.label.length > maxItemLength() ? item.label : ''\"\n [matTooltipClass]=\"applicationTheme()\"\n [attr.aria-label]=\"item.label\"\n (click)=\"selectItem.emit(item.value)\"\n (keydown.enter)=\"selectItem.emit(item.value)\"\n >\n {{ item.label \| truncate: maxItemLength() : '...' }}\n </span>\n <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n } @else {\n <strong\n class=\"breadcrumb-item-active\"\n tabindex=\"0\"\n [matTooltip]=\"shouldTruncateLastItem() ? item.label : ''\"\n [matTooltipClass]=\"applicationTheme()\"\n [class.breadcrumb-item-active-truncated]=\"shouldTruncateLastItem()\"\n [attr.aria-label]=\"item.label\"\n [attr.aria-current]=\"'page'\"\n (click)=\"selectItem.emit(item.value)\"\n (keydown.enter)=\"selectItem.emit(item.value)\"\n >\n {{ item.label }}\n </strong>\n }\n }\n </div>\n} @else {\n <div class=\"breadcrumb\">\n @for (i of loadingItems(); track $index) {\n <ui-skeleton count=\"1\" [theme]=\"{ width: '160px', margin: '10px 0 0' }\"></ui-skeleton>\n @if ($index !== numberOfLoadingItems() - 1) {\n <ui-icon name=\"Arrow-chevron-right-filled\" [applicationTheme]=\"applicationTheme()\" color=\"gray\"></ui-icon>\n }\n }\n </div>\n}\n<ng-template #overflowMenu>\n <div class=\"breadcrumb-item breadcrumb-overflow\" [class]=\"'breadcrumb-' + size()\">...</div>\n</ng-template>\n","import { NgModule } from '@angular/core';\nimport { CommonModule } from '@angular/common';\nimport { MatTooltipModule } from '@angular/material/tooltip';\nimport { BreadcrumbComponent } from './breadcrumb.component';\nimport { IconComponentModule } from '@testgorilla/tgo-ui/components/icon';\nimport { OverflowMenuComponentModule } from '@testgorilla/tgo-ui/components/overflow-menu';\nimport { ButtonComponentModule } from '@testgorilla/tgo-ui/components/button';\nimport { UiTranslatePipe, TruncatePipe } from '@testgorilla/tgo-ui/components/core';\nimport { SkeletonComponent } from '@testgorilla/tgo-ui/components/skeleton';\n\n@NgModule({\n declarations: [BreadcrumbComponent],\n imports: [\n CommonModule,\n IconComponentModule,\n MatTooltipModule,\n OverflowMenuComponentModule,\n ButtonComponentModule,\n SkeletonComponent,\n UiTranslatePipe,\n TruncatePipe,\n ],\n exports: [BreadcrumbComponent],\n})\nexport class BreadcrumbComponentModule {}\n","/*\n Generated bundle index. Do not edit.\n /\n\nexport from './public-api';\n"],"names":[],"mappings":"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"}