@testgorilla/tgo-ui 3.13.7 → 3.13.9
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.
- package/components/badge/badge.component.d.ts +8 -2
- package/components/badge/badge.model.d.ts +2 -1
- package/esm2022/components/badge/badge.component.mjs +12 -3
- package/esm2022/components/badge/badge.model.mjs +2 -1
- package/esm2022/components/breadcrumb/breadcrumb.component.mjs +2 -2
- package/esm2022/components/button/button.component.mjs +1 -1
- package/esm2022/components/field/field.component.mjs +1 -1
- package/esm2022/components/navbar/navbar.component.mjs +1 -1
- package/esm2022/components/universal-skills-report/universal-skills-report.component.mjs +1 -1
- package/fesm2022/testgorilla-tgo-ui.mjs +18 -8
- package/fesm2022/testgorilla-tgo-ui.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -1,6 +1,6 @@
|
|
|
1
|
+
import { ApplicationTheme } from '../../models/application-theme.model';
|
|
1
2
|
import { IconColor, IconName } from '../icon/icon.model';
|
|
2
3
|
import { BadgeColor, BadgeVariant, BadgeVariantEnum, RebrandBadgeColor } from './badge.model';
|
|
3
|
-
import { ApplicationTheme } from '../../models/application-theme.model';
|
|
4
4
|
import * as i0 from "@angular/core";
|
|
5
5
|
export declare class BadgeComponent {
|
|
6
6
|
private readonly defaultAppTheme;
|
|
@@ -49,11 +49,17 @@ export declare class BadgeComponent {
|
|
|
49
49
|
*/
|
|
50
50
|
rebrandColor: RebrandBadgeColor;
|
|
51
51
|
truncateLabel: boolean;
|
|
52
|
+
/**
|
|
53
|
+
* Whether to enable the animation when label changes from empty to having content.
|
|
54
|
+
* @type {boolean}
|
|
55
|
+
* @memberof BadgeComponent
|
|
56
|
+
*/
|
|
57
|
+
enableAnimation: boolean;
|
|
52
58
|
protected badgeVariant: typeof BadgeVariantEnum;
|
|
53
59
|
private darkColors;
|
|
54
60
|
constructor(defaultAppTheme: ApplicationTheme);
|
|
55
61
|
protected get iconColor(): IconColor;
|
|
56
62
|
protected get isClassicTheme(): boolean;
|
|
57
63
|
static ɵfac: i0.ɵɵFactoryDeclaration<BadgeComponent, [{ optional: true; }]>;
|
|
58
|
-
static ɵcmp: i0.ɵɵComponentDeclaration<BadgeComponent, "ui-badge", never, { "label": { "alias": "label"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "color": { "alias": "color"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "notificationsAmount": { "alias": "notificationsAmount"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "rebrandColor": { "alias": "rebrandColor"; "required": false; }; "truncateLabel": { "alias": "truncateLabel"; "required": false; }; }, {}, never, never, false, never>;
|
|
64
|
+
static ɵcmp: i0.ɵɵComponentDeclaration<BadgeComponent, "ui-badge", never, { "label": { "alias": "label"; "required": false; }; "icon": { "alias": "icon"; "required": false; }; "color": { "alias": "color"; "required": false; }; "variant": { "alias": "variant"; "required": false; }; "notificationsAmount": { "alias": "notificationsAmount"; "required": false; }; "applicationTheme": { "alias": "applicationTheme"; "required": false; }; "rebrandColor": { "alias": "rebrandColor"; "required": false; }; "truncateLabel": { "alias": "truncateLabel"; "required": false; }; "enableAnimation": { "alias": "enableAnimation"; "required": false; }; }, {}, never, never, false, never>;
|
|
59
65
|
}
|
|
@@ -13,7 +13,7 @@ export declare enum BadgeColorEnum {
|
|
|
13
13
|
BLUE_20 = "blue-20",
|
|
14
14
|
BLUE_40 = "blue-40"
|
|
15
15
|
}
|
|
16
|
-
export type RebrandBadgeColor = 'success' | 'warning' | 'negative' | 'info' | 'brand' | 'neutral' | 'blue-20' | 'blue-40' | 'pink-30' | 'blue-10' | 'grey-10' | 'grey-30';
|
|
16
|
+
export type RebrandBadgeColor = 'success' | 'warning' | 'negative' | 'info' | 'brand' | 'neutral' | 'blue-20' | 'blue-40' | 'pink-30' | 'blue-10' | 'grey-10' | 'grey-20' | 'grey-30';
|
|
17
17
|
export declare enum RebrandBadgeColorEnum {
|
|
18
18
|
SUCCESS = "success",
|
|
19
19
|
WARNING = "warning",
|
|
@@ -26,6 +26,7 @@ export declare enum RebrandBadgeColorEnum {
|
|
|
26
26
|
PINK_30 = "pink-30",
|
|
27
27
|
BLUE_10 = "blue-10",
|
|
28
28
|
GREY_30 = "grey-30",
|
|
29
|
+
GREY_20 = "grey-20",
|
|
29
30
|
GREY_10 = "grey-10"
|
|
30
31
|
}
|
|
31
32
|
export declare enum BadgeVariantEnum {
|
|
@@ -52,6 +52,12 @@ export class BadgeComponent {
|
|
|
52
52
|
*/
|
|
53
53
|
this.rebrandColor = 'brand';
|
|
54
54
|
this.truncateLabel = true;
|
|
55
|
+
/**
|
|
56
|
+
* Whether to enable the animation when label changes from empty to having content.
|
|
57
|
+
* @type {boolean}
|
|
58
|
+
* @memberof BadgeComponent
|
|
59
|
+
*/
|
|
60
|
+
this.enableAnimation = false;
|
|
55
61
|
this.badgeVariant = BadgeVariantEnum;
|
|
56
62
|
this.darkColors = [
|
|
57
63
|
BadgeColorEnum.GREY_MEDIUM,
|
|
@@ -67,6 +73,7 @@ export class BadgeComponent {
|
|
|
67
73
|
RebrandBadgeColorEnum.BLUE_20,
|
|
68
74
|
RebrandBadgeColorEnum.PINK_30,
|
|
69
75
|
RebrandBadgeColorEnum.BLUE_10,
|
|
76
|
+
RebrandBadgeColorEnum.GREY_20,
|
|
70
77
|
];
|
|
71
78
|
if (defaultAppTheme) {
|
|
72
79
|
this.applicationTheme = defaultAppTheme;
|
|
@@ -79,11 +86,11 @@ export class BadgeComponent {
|
|
|
79
86
|
return this.applicationTheme === 'classic';
|
|
80
87
|
}
|
|
81
88
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BadgeComponent, deps: [{ token: 'CANOPYUI_DEFAULT_APPLICATION_THEME', optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
|
|
82
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: BadgeComponent, selector: "ui-badge", inputs: { label: "label", icon: "icon", color: "color", variant: "variant", notificationsAmount: "notificationsAmount", applicationTheme: "applicationTheme", rebrandColor: "rebrandColor", truncateLabel: "truncateLabel" }, ngImport: i0, template: "<div [class]=\"'badge badge-container-' + variant\"\n [class.no-label]=\"!label\"\n [attr.aria-label]=\"label\"\n [attr.theme]=\"applicationTheme\"\n [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n [matTooltip]=\"(label.length > 25) ? label : ''\"\n [matTooltipClass]=\"applicationTheme\"\n>\n <ng-container [ngSwitch]=\"variant\">\n <ng-container *ngSwitchCase=\"badgeVariant.PRIMARY\">\n <ui-icon *ngIf=\"icon\" class=\"badge-icon\" [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 *ngSwitchCase=\"badgeVariant.SECONDARY\" class=\"point\" [attr.color]=\"isClassicTheme ? color : rebrandColor\"></div>\n <div *ngSwitchCase=\"badgeVariant.NOTIFICATION\" class=\"number-notification\">{{ notificationsAmount }}</div>\n </ng-container>\n <div class=\"label\" *ngIf=\"label && variant !== badgeVariant.NOTIFICATION\">{{ label.length > 25 && truncateLabel ? (label | slice : 0 : 25) + '...' : label }}</div>\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}: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 .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-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:#aae47a;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-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" }] }); }
|
|
89
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: BadgeComponent, selector: "ui-badge", inputs: { label: "label", 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\"\n [attr.aria-label]=\"label\"\n [attr.theme]=\"applicationTheme\"\n [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n [matTooltip]=\"label.length > 25 ? label : ''\"\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 class=\"label\" *ngIf=\"variant !== badgeVariant.NOTIFICATION\" [class.empty]=\"!label\" [class.animated]=\"enableAnimation\">\n {{ label.length > 25 && truncateLabel ? (label | slice: 0 : 25) + '...' : label }}\n </div>\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 .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-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:#aae47a;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" }] }); }
|
|
83
90
|
}
|
|
84
91
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BadgeComponent, decorators: [{
|
|
85
92
|
type: Component,
|
|
86
|
-
args: [{ selector: 'ui-badge', template: "<div [class]=\"'badge badge-container-' + variant\"\n [class.no-label]=\"!label\"\n [attr.aria-label]=\"label\"\n [attr.theme]=\"applicationTheme\"\n [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n [matTooltip]=\"(label.length > 25) ? label : ''\"\n [matTooltipClass]=\"applicationTheme\"\n>\n <ng-container [ngSwitch]=\"variant\">\n <ng-container *ngSwitchCase=\"badgeVariant.PRIMARY\">\n <ui-icon *ngIf=\"icon\" class=\"badge-icon\" [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 *ngSwitchCase=\"badgeVariant.SECONDARY\" class=\"point\" [attr.color]=\"isClassicTheme ? color : rebrandColor\"></div>\n <div *ngSwitchCase=\"badgeVariant.NOTIFICATION\" class=\"number-notification\">{{ notificationsAmount }}</div>\n </ng-container>\n <div class=\"label\" *ngIf=\"label && variant !== badgeVariant.NOTIFICATION\">{{ label.length > 25 && truncateLabel ? (label | slice : 0 : 25) + '...' : label }}</div>\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}: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 .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-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:#aae47a;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-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"] }]
|
|
93
|
+
args: [{ selector: 'ui-badge', template: "<div\n [class]=\"'badge badge-container-' + variant\"\n [class.no-label]=\"!label\"\n [attr.aria-label]=\"label\"\n [attr.theme]=\"applicationTheme\"\n [attr.color]=\"isClassicTheme ? color : rebrandColor\"\n [matTooltip]=\"label.length > 25 ? label : ''\"\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 class=\"label\" *ngIf=\"variant !== badgeVariant.NOTIFICATION\" [class.empty]=\"!label\" [class.animated]=\"enableAnimation\">\n {{ label.length > 25 && truncateLabel ? (label | slice: 0 : 25) + '...' : label }}\n </div>\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 .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-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:#aae47a;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"] }]
|
|
87
94
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
88
95
|
type: Optional
|
|
89
96
|
}, {
|
|
@@ -105,5 +112,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
|
|
|
105
112
|
type: Input
|
|
106
113
|
}], truncateLabel: [{
|
|
107
114
|
type: Input
|
|
115
|
+
}], enableAnimation: [{
|
|
116
|
+
type: Input
|
|
108
117
|
}] } });
|
|
109
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
118
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvdGdvLWNhbm9weS11aS9jb21wb25lbnRzL2JhZGdlL2JhZGdlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL3Rnby1jYW5vcHktdWkvY29tcG9uZW50cy9iYWRnZS9iYWRnZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLE1BQU0sRUFBRSxLQUFLLEVBQUUsUUFBUSxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBR25FLE9BQU8sRUFFTCxjQUFjLEVBRWQsZ0JBQWdCLEVBRWhCLHFCQUFxQixHQUN0QixNQUFNLGVBQWUsQ0FBQzs7Ozs7QUFPdkIsTUFBTSxPQUFPLGNBQWM7SUErRXpCLFlBQzZFLGVBQWlDO1FBQWpDLG9CQUFlLEdBQWYsZUFBZSxDQUFrQjtRQS9FOUc7Ozs7V0FJRztRQUNNLFVBQUssR0FBRyxFQUFFLENBQUM7UUFFcEI7Ozs7V0FJRztRQUNNLFNBQUksR0FBYSxFQUFFLENBQUM7UUFFN0I7Ozs7V0FJRztRQUNNLFVBQUssR0FBZSxRQUFRLENBQUM7UUFFdEM7Ozs7V0FJRztRQUNNLFlBQU8sR0FBaUIsU0FBUyxDQUFDO1FBRTNDOzs7O1dBSUc7UUFDTSx3QkFBbUIsR0FBRyxDQUFDLENBQUM7UUFFakM7Ozs7OztXQU1HO1FBQ00scUJBQWdCLEdBQXFCLE9BQU8sQ0FBQztRQUV0RDs7OztXQUlHO1FBQ00saUJBQVksR0FBc0IsT0FBTyxDQUFDO1FBRTFDLGtCQUFhLEdBQUcsSUFBSSxDQUFDO1FBRTlCOzs7O1dBSUc7UUFDTSxvQkFBZSxHQUFHLEtBQUssQ0FBQztRQUV2QixpQkFBWSxHQUFHLGdCQUFnQixDQUFDO1FBQ2xDLGVBQVUsR0FBYTtZQUM3QixjQUFjLENBQUMsV0FBVztZQUMxQixjQUFjLENBQUMsVUFBVTtZQUN6QixjQUFjLENBQUMsUUFBUTtZQUN2QixjQUFjLENBQUMsVUFBVTtZQUN6QixxQkFBcUIsQ0FBQyxPQUFPO1lBQzdCLHFCQUFxQixDQUFDLElBQUk7WUFDMUIscUJBQXFCLENBQUMsS0FBSztZQUMzQixxQkFBcUIsQ0FBQyxPQUFPO1lBQzdCLHFCQUFxQixDQUFDLFFBQVE7WUFDOUIscUJBQXFCLENBQUMsT0FBTztZQUM3QixxQkFBcUIsQ0FBQyxPQUFPO1lBQzdCLHFCQUFxQixDQUFDLE9BQU87WUFDN0IscUJBQXFCLENBQUMsT0FBTztZQUM3QixxQkFBcUIsQ0FBQyxPQUFPO1NBQzlCLENBQUM7UUFLQSxJQUFJLGVBQWUsRUFBRSxDQUFDO1lBQ3BCLElBQUksQ0FBQyxnQkFBZ0IsR0FBRyxlQUFlLENBQUM7UUFDMUMsQ0FBQztJQUNILENBQUM7SUFFRCxJQUFjLFNBQVM7UUFDckIsT0FBTyxJQUFJLENBQUMsVUFBVSxDQUFDLFFBQVEsQ0FBQyxJQUFJLENBQUMsY0FBYyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsS0FBSyxDQUFDLENBQUMsQ0FBQyxJQUFJLENBQUMsWUFBWSxDQUFDLENBQUMsQ0FBQyxDQUFDLE9BQU8sQ0FBQyxDQUFDLENBQUMsT0FBTyxDQUFDO0lBQzVHLENBQUM7SUFFRCxJQUFjLGNBQWM7UUFDMUIsT0FBTyxJQUFJLENBQUMsZ0JBQWdCLEtBQUssU0FBUyxDQUFDO0lBQzdDLENBQUM7K0dBN0ZVLGNBQWMsa0JBZ0ZILG9DQUFvQzttR0FoRi9DLGNBQWMsa1RDakIzQiw2K0NBa0NBOzs0RkRqQmEsY0FBYztrQkFMMUIsU0FBUzsrQkFDRSxVQUFVOzswQkFvRmpCLFFBQVE7OzBCQUFJLE1BQU07MkJBQUMsb0NBQW9DO3lDQTFFakQsS0FBSztzQkFBYixLQUFLO2dCQU9HLElBQUk7c0JBQVosS0FBSztnQkFPRyxLQUFLO3NCQUFiLEtBQUs7Z0JBT0csT0FBTztzQkFBZixLQUFLO2dCQU9HLG1CQUFtQjtzQkFBM0IsS0FBSztnQkFTRyxnQkFBZ0I7c0JBQXhCLEtBQUs7Z0JBT0csWUFBWTtzQkFBcEIsS0FBSztnQkFFRyxhQUFhO3NCQUFyQixLQUFLO2dCQU9HLGVBQWU7c0JBQXZCLEtBQUsiLCJzb3VyY2VzQ29udGVudCI6WyJpbXBvcnQgeyBDb21wb25lbnQsIEluamVjdCwgSW5wdXQsIE9wdGlvbmFsIH0gZnJvbSAnQGFuZ3VsYXIvY29yZSc7XG5pbXBvcnQgeyBBcHBsaWNhdGlvblRoZW1lIH0gZnJvbSAnLi4vLi4vbW9kZWxzL2FwcGxpY2F0aW9uLXRoZW1lLm1vZGVsJztcbmltcG9ydCB7IEljb25Db2xvciwgSWNvbk5hbWUgfSBmcm9tICcuLi9pY29uL2ljb24ubW9kZWwnO1xuaW1wb3J0IHtcbiAgQmFkZ2VDb2xvcixcbiAgQmFkZ2VDb2xvckVudW0sXG4gIEJhZGdlVmFyaWFudCxcbiAgQmFkZ2VWYXJpYW50RW51bSxcbiAgUmVicmFuZEJhZGdlQ29sb3IsXG4gIFJlYnJhbmRCYWRnZUNvbG9yRW51bSxcbn0gZnJvbSAnLi9iYWRnZS5tb2RlbCc7XG5cbkBDb21wb25lbnQoe1xuICBzZWxlY3RvcjogJ3VpLWJhZGdlJyxcbiAgdGVtcGxhdGVVcmw6ICcuL2JhZGdlLmNvbXBvbmVudC5odG1sJyxcbiAgc3R5bGVVcmxzOiBbJy4vYmFkZ2UuY29tcG9uZW50LnNjc3MnXSxcbn0pXG5leHBvcnQgY2xhc3MgQmFkZ2VDb21wb25lbnQge1xuICAvKipcbiAgICogVGhlIGxhYmVsIHRvIGJlIGRpc3BsYXllZCBvbiB0aGUgYmFkZ2UuXG4gICAqIEB0eXBlIHtzdHJpbmd9XG4gICAqIEBtZW1iZXJvZiBCYWRnZUNvbXBvbmVudFxuICAgKi9cbiAgQElucHV0KCkgbGFiZWwgPSAnJztcblxuICAvKipcbiAgICogVGhlIGljb24gbmFtZSB0byBiZSBkaXNwbGF5ZWQgb24gdGhlIGJhZGdlLlxuICAgKiBAdHlwZSB7SWNvbk5hbWV9XG4gICAqIEBtZW1iZXJvZiBCYWRnZUNvbXBvbmVudFxuICAgKi9cbiAgQElucHV0KCkgaWNvbjogSWNvbk5hbWUgPSAnJztcblxuICAvKipcbiAgICogVGhlIGNvbG9yIG9mIHRoZSBiYWRnZS4gRGVmYXVsdHMgdG8gJ3BldHJvbCcuXG4gICAqIEB0eXBlIHtCYWRnZUNvbG9yfVxuICAgKiBAbWVtYmVyb2YgQmFkZ2VDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIGNvbG9yOiBCYWRnZUNvbG9yID0gJ3BldHJvbCc7XG5cbiAgLyoqXG4gICAqIFRoZSB2YXJpYW50IG9mIHRoZSBiYWRnZS4gRGVmYXVsdHMgdG8gJ3ByaW1hcnknLlxuICAgKiBAdHlwZSB7QmFkZ2VWYXJpYW50fVxuICAgKiBAbWVtYmVyb2YgQmFkZ2VDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIHZhcmlhbnQ6IEJhZGdlVmFyaWFudCA9ICdwcmltYXJ5JztcblxuICAvKipcbiAgICogVGhlIGFtb3VudCBvZiBub3RpZmljYXRpb25zIHRvIGJlIGRpc3BsYXllZCBvbiB0aGUgYmFkZ2UuXG4gICAqIEB0eXBlIHtudW1iZXJ9XG4gICAqIEBtZW1iZXJvZiBCYWRnZUNvbXBvbmVudFxuICAgKi9cbiAgQElucHV0KCkgbm90aWZpY2F0aW9uc0Ftb3VudCA9IDA7XG5cbiAgLyoqXG4gICAqXG4gICAqIERlZmluZXMgdGhlIGFwcGxpY2F0aW9uIHRoZW1lXG4gICAqXG4gICAqIEB0eXBlIHtBcHBsaWNhdGlvblRoZW1lfVxuICAgKiBAbWVtYmVyb2YgQmFkZ2VDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIGFwcGxpY2F0aW9uVGhlbWU6IEFwcGxpY2F0aW9uVGhlbWUgPSAnbGlnaHQnO1xuXG4gIC8qKlxuICAgKiBUaGUgY29sb3Igb2YgdGhlIGJhZGdlIG9uIG5ldyB0aGVtZS4gRGVmYXVsdHMgdG8gJ2JyYW5kJy5cbiAgICogQHR5cGUge1JlYnJhbmRCYWRnZUNvbG9yfVxuICAgKiBAbWVtYmVyb2YgQmFkZ2VDb21wb25lbnRcbiAgICovXG4gIEBJbnB1dCgpIHJlYnJhbmRDb2xvcjogUmVicmFuZEJhZGdlQ29sb3IgPSAnYnJhbmQnO1xuXG4gIEBJbnB1dCgpIHRydW5jYXRlTGFiZWwgPSB0cnVlO1xuXG4gIC8qKlxuICAgKiBXaGV0aGVyIHRvIGVuYWJsZSB0aGUgYW5pbWF0aW9uIHdoZW4gbGFiZWwgY2hhbmdlcyBmcm9tIGVtcHR5IHRvIGhhdmluZyBjb250ZW50LlxuICAgKiBAdHlwZSB7Ym9vbGVhbn1cbiAgICogQG1lbWJlcm9mIEJhZGdlQ29tcG9uZW50XG4gICAqL1xuICBASW5wdXQoKSBlbmFibGVBbmltYXRpb24gPSBmYWxzZTtcblxuICBwcm90ZWN0ZWQgYmFkZ2VWYXJpYW50ID0gQmFkZ2VWYXJpYW50RW51bTtcbiAgcHJpdmF0ZSBkYXJrQ29sb3JzOiBzdHJpbmdbXSA9IFtcbiAgICBCYWRnZUNvbG9yRW51bS5HUkVZX01FRElVTSxcbiAgICBCYWRnZUNvbG9yRW51bS5QRVRST0xfOTBXLFxuICAgIEJhZGdlQ29sb3JFbnVtLlRFQUxfNjBXLFxuICAgIEJhZGdlQ29sb3JFbnVtLlBFVFJPTF82MFcsXG4gICAgUmVicmFuZEJhZGdlQ29sb3JFbnVtLlNVQ0NFU1MsXG4gICAgUmVicmFuZEJhZGdlQ29sb3JFbnVtLklORk8sXG4gICAgUmVicmFuZEJhZGdlQ29sb3JFbnVtLkJSQU5ELFxuICAgIFJlYnJhbmRCYWRnZUNvbG9yRW51bS5ORVVUUkFMLFxuICAgIFJlYnJhbmRCYWRnZUNvbG9yRW51bS5ORUdBVElWRSxcbiAgICBSZWJyYW5kQmFkZ2VDb2xvckVudW0uV0FSTklORyxcbiAgICBSZWJyYW5kQmFkZ2VDb2xvckVudW0uQkxVRV8yMCxcbiAgICBSZWJyYW5kQmFkZ2VDb2xvckVudW0uUElOS18zMCxcbiAgICBSZWJyYW5kQmFkZ2VDb2xvckVudW0uQkxVRV8xMCxcbiAgICBSZWJyYW5kQmFkZ2VDb2xvckVudW0uR1JFWV8yMCxcbiAgXTtcblxuICBjb25zdHJ1Y3RvcihcbiAgICBAT3B0aW9uYWwoKSBASW5qZWN0KCdDQU5PUFlVSV9ERUZBVUxUX0FQUExJQ0FUSU9OX1RIRU1FJykgcHJpdmF0ZSByZWFkb25seSBkZWZhdWx0QXBwVGhlbWU6IEFwcGxpY2F0aW9uVGhlbWVcbiAgKSB7XG4gICAgaWYgKGRlZmF1bHRBcHBUaGVtZSkge1xuICAgICAgdGhpcy5hcHBsaWNhdGlvblRoZW1lID0gZGVmYXVsdEFwcFRoZW1lO1xuICAgIH1cbiAgfVxuXG4gIHByb3RlY3RlZCBnZXQgaWNvbkNvbG9yKCk6IEljb25Db2xvciB7XG4gICAgcmV0dXJuIHRoaXMuZGFya0NvbG9ycy5pbmNsdWRlcyh0aGlzLmlzQ2xhc3NpY1RoZW1lID8gdGhpcy5jb2xvciA6IHRoaXMucmVicmFuZENvbG9yKSA/ICdibGFjaycgOiAnd2hpdGUnO1xuICB9XG5cbiAgcHJvdGVjdGVkIGdldCBpc0NsYXNzaWNUaGVtZSgpOiBib29sZWFuIHtcbiAgICByZXR1cm4gdGhpcy5hcHBsaWNhdGlvblRoZW1lID09PSAnY2xhc3NpYyc7XG4gIH1cbn1cbiIsIjxkaXZcbiAgW2NsYXNzXT1cIidiYWRnZSBiYWRnZS1jb250YWluZXItJyArIHZhcmlhbnRcIlxuICBbY2xhc3Mubm8tbGFiZWxdPVwiIWxhYmVsXCJcbiAgW2F0dHIuYXJpYS1sYWJlbF09XCJsYWJlbFwiXG4gIFthdHRyLnRoZW1lXT1cImFwcGxpY2F0aW9uVGhlbWVcIlxuICBbYXR0ci5jb2xvcl09XCJpc0NsYXNzaWNUaGVtZSA/IGNvbG9yIDogcmVicmFuZENvbG9yXCJcbiAgW21hdFRvb2x0aXBdPVwibGFiZWwubGVuZ3RoID4gMjUgPyBsYWJlbCA6ICcnXCJcbiAgW21hdFRvb2x0aXBDbGFzc109XCJhcHBsaWNhdGlvblRoZW1lXCJcbj5cbiAgPG5nLWNvbnRhaW5lciBbbmdTd2l0Y2hdPVwidmFyaWFudFwiPlxuICAgIDxuZy1jb250YWluZXIgKm5nU3dpdGNoQ2FzZT1cImJhZGdlVmFyaWFudC5QUklNQVJZXCI+XG4gICAgICA8dWktaWNvbiAqbmdJZj1cImljb25cIiBbY2xhc3MuYmFkZ2UtaWNvbl09XCIhIWxhYmVsXCIgW25hbWVdPVwiaWNvblwiIFtjb2xvcl09XCJpY29uQ29sb3JcIj48L3VpLWljb24+XG4gICAgPC9uZy1jb250YWluZXI+XG4gICAgPG5nLWNvbnRhaW5lciAqbmdTd2l0Y2hDYXNlPVwiYmFkZ2VWYXJpYW50LlBSSU1BUllfQUlcIj5cbiAgICAgIDxuZy1jb250YWluZXIgW25nVGVtcGxhdGVPdXRsZXRdPVwiYWlJY29uVHBsXCI+PC9uZy1jb250YWluZXI+XG4gICAgPC9uZy1jb250YWluZXI+XG4gICAgPG5nLWNvbnRhaW5lciAqbmdTd2l0Y2hDYXNlPVwiYmFkZ2VWYXJpYW50LlNFQ09OREFSWV9BSVwiPlxuICAgICAgPG5nLWNvbnRhaW5lciBbbmdUZW1wbGF0ZU91dGxldF09XCJhaUljb25UcGxcIj48L25nLWNvbnRhaW5lcj5cbiAgICA8L25nLWNvbnRhaW5lcj5cbiAgICA8ZGl2XG4gICAgICAqbmdTd2l0Y2hDYXNlPVwiYmFkZ2VWYXJpYW50LlNFQ09OREFSWVwiXG4gICAgICBjbGFzcz1cInBvaW50XCJcbiAgICAgIFthdHRyLmNvbG9yXT1cImlzQ2xhc3NpY1RoZW1lID8gY29sb3IgOiByZWJyYW5kQ29sb3JcIlxuICAgID48L2Rpdj5cbiAgICA8ZGl2ICpuZ1N3aXRjaENhc2U9XCJiYWRnZVZhcmlhbnQuTk9USUZJQ0FUSU9OXCIgY2xhc3M9XCJudW1iZXItbm90aWZpY2F0aW9uXCI+e3sgbm90aWZpY2F0aW9uc0Ftb3VudCB9fTwvZGl2PlxuICA8L25nLWNvbnRhaW5lcj5cbiAgPGRpdiBjbGFzcz1cImxhYmVsXCIgKm5nSWY9XCJ2YXJpYW50ICE9PSBiYWRnZVZhcmlhbnQuTk9USUZJQ0FUSU9OXCIgW2NsYXNzLmVtcHR5XT1cIiFsYWJlbFwiIFtjbGFzcy5hbmltYXRlZF09XCJlbmFibGVBbmltYXRpb25cIj5cbiAgICB7eyBsYWJlbC5sZW5ndGggPiAyNSAmJiB0cnVuY2F0ZUxhYmVsID8gKGxhYmVsIHwgc2xpY2U6IDAgOiAyNSkgKyAnLi4uJyA6IGxhYmVsIH19XG4gIDwvZGl2PlxuPC9kaXY+XG5cbjxuZy10ZW1wbGF0ZSAjYWlJY29uVHBsPlxuICA8dWktaWNvbiBjbGFzcz1cImJhZGdlLWljb25cIiBbbmFtZV09XCInU3BhcmtsZS1pbi1saW5lJ1wiIFtjb2xvcl09XCInYWknXCI+PC91aS1pY29uPlxuPC9uZy10ZW1wbGF0ZT5cbiJdfQ==
|
|
@@ -25,6 +25,7 @@ export var RebrandBadgeColorEnum;
|
|
|
25
25
|
RebrandBadgeColorEnum["PINK_30"] = "pink-30";
|
|
26
26
|
RebrandBadgeColorEnum["BLUE_10"] = "blue-10";
|
|
27
27
|
RebrandBadgeColorEnum["GREY_30"] = "grey-30";
|
|
28
|
+
RebrandBadgeColorEnum["GREY_20"] = "grey-20";
|
|
28
29
|
RebrandBadgeColorEnum["GREY_10"] = "grey-10";
|
|
29
30
|
})(RebrandBadgeColorEnum || (RebrandBadgeColorEnum = {}));
|
|
30
31
|
export var BadgeVariantEnum;
|
|
@@ -35,4 +36,4 @@ export var BadgeVariantEnum;
|
|
|
35
36
|
BadgeVariantEnum["SECONDARY_AI"] = "secondary-ai";
|
|
36
37
|
BadgeVariantEnum["NOTIFICATION"] = "notification";
|
|
37
38
|
})(BadgeVariantEnum || (BadgeVariantEnum = {}));
|
|
38
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
39
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiYmFkZ2UubW9kZWwuanMiLCJzb3VyY2VSb290IjoiIiwic291cmNlcyI6WyIuLi8uLi8uLi8uLi8uLi9wcm9qZWN0cy90Z28tY2Fub3B5LXVpL2NvbXBvbmVudHMvYmFkZ2UvYmFkZ2UubW9kZWwudHMiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBZ0JBLE1BQU0sQ0FBTixJQUFZLGNBWVg7QUFaRCxXQUFZLGNBQWM7SUFDeEIsNkJBQVcsQ0FBQTtJQUNYLDZDQUEyQixDQUFBO0lBQzNCLCtCQUFhLENBQUE7SUFDYixtQ0FBaUIsQ0FBQTtJQUNqQixtQ0FBaUIsQ0FBQTtJQUNqQix1Q0FBcUIsQ0FBQTtJQUNyQiwyQ0FBeUIsQ0FBQTtJQUN6QiwyQ0FBeUIsQ0FBQTtJQUN6Qix5Q0FBdUIsQ0FBQTtJQUN2QixxQ0FBbUIsQ0FBQTtJQUNuQixxQ0FBbUIsQ0FBQTtBQUNyQixDQUFDLEVBWlcsY0FBYyxLQUFkLGNBQWMsUUFZekI7QUFpQkQsTUFBTSxDQUFOLElBQVkscUJBY1g7QUFkRCxXQUFZLHFCQUFxQjtJQUMvQiw0Q0FBbUIsQ0FBQTtJQUNuQiw0Q0FBbUIsQ0FBQTtJQUNuQiw4Q0FBcUIsQ0FBQTtJQUNyQixzQ0FBYSxDQUFBO0lBQ2Isd0NBQWUsQ0FBQTtJQUNmLDRDQUFtQixDQUFBO0lBQ25CLDRDQUFtQixDQUFBO0lBQ25CLDRDQUFtQixDQUFBO0lBQ25CLDRDQUFtQixDQUFBO0lBQ25CLDRDQUFtQixDQUFBO0lBQ25CLDRDQUFtQixDQUFBO0lBQ25CLDRDQUFtQixDQUFBO0lBQ25CLDRDQUFtQixDQUFBO0FBQ3JCLENBQUMsRUFkVyxxQkFBcUIsS0FBckIscUJBQXFCLFFBY2hDO0FBRUQsTUFBTSxDQUFOLElBQVksZ0JBTVg7QUFORCxXQUFZLGdCQUFnQjtJQUMxQix1Q0FBbUIsQ0FBQTtJQUNuQiw2Q0FBeUIsQ0FBQTtJQUN6QiwyQ0FBdUIsQ0FBQTtJQUN2QixpREFBNkIsQ0FBQTtJQUM3QixpREFBNkIsQ0FBQTtBQUMvQixDQUFDLEVBTlcsZ0JBQWdCLEtBQWhCLGdCQUFnQixRQU0zQiIsInNvdXJjZXNDb250ZW50IjpbImV4cG9ydCB0eXBlIEJhZGdlVmFyaWFudCA9ICdwcmltYXJ5JyB8ICdzZWNvbmRhcnknIHwgJ25vdGlmaWNhdGlvbicgfCAncHJpbWFyeS1haScgfCAnc2Vjb25kYXJ5LWFpJztcbmV4cG9ydCB0eXBlIEJhZGdlQ29sb3IgPVxuICB8ICdyZWQnXG4gIHwgJ2dyZXktbWVkaXVtJ1xuICB8ICd0ZWFsJ1xuICB8ICd5ZWxsb3cnXG4gIHwgJ3BldHJvbCdcbiAgfCAndGVhbC02MHcnXG4gIHwgJ3BldHJvbC05MHcnXG4gIHwgJ3BldHJvbC02MHcnXG4gIHwgJ2dyZXktZGFyaydcbiAgfCAnYmx1ZS0yMCdcbiAgfCAnYmx1ZS00MCdcbiAgfCAncGluay0zMCdcbiAgfCAnYmx1ZS0xMCc7XG5cbmV4cG9ydCBlbnVtIEJhZGdlQ29sb3JFbnVtIHtcbiAgUkVEID0gJ3JlZCcsXG4gIEdSRVlfTUVESVVNID0gJ2dyZXktbWVkaXVtJyxcbiAgVEVBTCA9ICd0ZWFsJyxcbiAgWUVMTE9XID0gJ3llbGxvdycsXG4gIFBFVFJPTCA9ICdwZXRyb2wnLFxuICBURUFMXzYwVyA9ICd0ZWFsLTYwdycsXG4gIFBFVFJPTF85MFcgPSAncGV0cm9sLTkwdycsXG4gIFBFVFJPTF82MFcgPSAncGV0cm9sLTYwdycsXG4gIEdSRVlfREFSSyA9ICdncmV5LWRhcmsnLFxuICBCTFVFXzIwID0gJ2JsdWUtMjAnLFxuICBCTFVFXzQwID0gJ2JsdWUtNDAnLFxufVxuXG5leHBvcnQgdHlwZSBSZWJyYW5kQmFkZ2VDb2xvciA9XG4gIHwgJ3N1Y2Nlc3MnXG4gIHwgJ3dhcm5pbmcnXG4gIHwgJ25lZ2F0aXZlJ1xuICB8ICdpbmZvJ1xuICB8ICdicmFuZCdcbiAgfCAnbmV1dHJhbCdcbiAgfCAnYmx1ZS0yMCdcbiAgfCAnYmx1ZS00MCdcbiAgfCAncGluay0zMCdcbiAgfCAnYmx1ZS0xMCdcbiAgfCAnZ3JleS0xMCdcbiAgfCAnZ3JleS0yMCdcbiAgfCAnZ3JleS0zMCc7XG5cbmV4cG9ydCBlbnVtIFJlYnJhbmRCYWRnZUNvbG9yRW51bSB7XG4gIFNVQ0NFU1MgPSAnc3VjY2VzcycsXG4gIFdBUk5JTkcgPSAnd2FybmluZycsXG4gIE5FR0FUSVZFID0gJ25lZ2F0aXZlJyxcbiAgSU5GTyA9ICdpbmZvJyxcbiAgQlJBTkQgPSAnYnJhbmQnLFxuICBORVVUUkFMID0gJ25ldXRyYWwnLFxuICBCTFVFXzQwID0gJ2JsdWUtNDAnLFxuICBCTFVFXzIwID0gJ2JsdWUtMjAnLFxuICBQSU5LXzMwID0gJ3BpbmstMzAnLFxuICBCTFVFXzEwID0gJ2JsdWUtMTAnLFxuICBHUkVZXzMwID0gJ2dyZXktMzAnLFxuICBHUkVZXzIwID0gJ2dyZXktMjAnLFxuICBHUkVZXzEwID0gJ2dyZXktMTAnLFxufVxuXG5leHBvcnQgZW51bSBCYWRnZVZhcmlhbnRFbnVtIHtcbiAgUFJJTUFSWSA9ICdwcmltYXJ5JyxcbiAgUFJJTUFSWV9BSSA9ICdwcmltYXJ5LWFpJyxcbiAgU0VDT05EQVJZID0gJ3NlY29uZGFyeScsXG4gIFNFQ09OREFSWV9BSSA9ICdzZWNvbmRhcnktYWknLFxuICBOT1RJRklDQVRJT04gPSAnbm90aWZpY2F0aW9uJyxcbn1cbiJdfQ==
|
|
@@ -175,11 +175,11 @@ export class BreadcrumbComponent {
|
|
|
175
175
|
this.resizeObserver.observe(this.breadcrumbContainer.nativeElement);
|
|
176
176
|
}
|
|
177
177
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BreadcrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
178
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BreadcrumbComponent, 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: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"], 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: i8.TruncatePipe, name: "truncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
178
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: BreadcrumbComponent, 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"], 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: i8.TruncatePipe, name: "truncate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
179
179
|
}
|
|
180
180
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: BreadcrumbComponent, decorators: [{
|
|
181
181
|
type: Component,
|
|
182
|
-
args: [{ selector: 'ui-breadcrumb', changeDetection: ChangeDetectionStrategy.OnPush, 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: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"] }]
|
|
182
|
+
args: [{ selector: 'ui-breadcrumb', changeDetection: ChangeDetectionStrategy.OnPush, 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"] }]
|
|
183
183
|
}], ctorParameters: () => [], propDecorators: { selectItem: [{
|
|
184
184
|
type: Output
|
|
185
185
|
}], backButtonClickEvent: [{
|