@leanix/components 0.4.53 → 0.4.54

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.
@@ -11,11 +11,11 @@ export class BasicDropdownItemComponent {
11
11
  return !!this.description;
12
12
  }
13
13
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: BasicDropdownItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
14
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: BasicDropdownItemComponent, selector: "lx-basic-dropdown-item", inputs: { label: "label", description: "description", highlightTerm: "highlightTerm", labelFontWeight: "labelFontWeight", descriptionFontStyle: "descriptionFontStyle", descriptionStyleOptions: "descriptionStyleOptions" }, host: { properties: { "class.hasDescription": "this.hasDescription" } }, ngImport: i0, template: "<div [class.boldLabel]=\"labelFontWeight === 'bold'\" [innerHtml]=\"label | lxHighlightTerm : highlightTerm\"></div>\n<div\n class=\"optionDescription\"\n [style.font-style]=\"descriptionFontStyle\"\n [ngClass]=\"{ maxTextLines: descriptionStyleOptions?.maxLines }\"\n [style.-webkit-line-clamp]=\"descriptionStyleOptions?.maxLines || 'inherit'\"\n>\n {{ description }}\n</div>\n", styles: [":host{display:block;padding:2px 0}:host.hasDescription{padding:4px 0}.boldLabel{font-weight:700}.optionDescription{padding-top:2px;color:#677a9a;font-size:11px}.optionDescription.maxTextLines{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:inherit;-webkit-box-orient:vertical}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i2.HighlightTermPipe, name: "lxHighlightTerm" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
14
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: BasicDropdownItemComponent, selector: "lx-basic-dropdown-item", inputs: { label: "label", description: "description", highlightTerm: "highlightTerm", labelFontWeight: "labelFontWeight", descriptionFontStyle: "descriptionFontStyle", descriptionStyleOptions: "descriptionStyleOptions" }, host: { properties: { "class.hasDescription": "this.hasDescription" } }, ngImport: i0, template: "<div [class.boldLabel]=\"labelFontWeight === 'bold'\" [innerHtml]=\"label | lxHighlightTerm : highlightTerm\"></div>\n<div\n class=\"optionDescription\"\n [style.font-style]=\"descriptionFontStyle\"\n [ngClass]=\"{ maxTextLines: descriptionStyleOptions?.maxLines }\"\n [style.-webkit-line-clamp]=\"descriptionStyleOptions?.maxLines || 'inherit'\"\n>\n {{ description }}\n</div>\n", styles: [":host{display:block;padding:2px 0}:host.hasDescription{padding:4px 0}.boldLabel{font-weight:700}.optionDescription{padding-top:2px;color:#61779d;font-size:11px}.optionDescription.maxTextLines{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:inherit;-webkit-box-orient:vertical}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: i2.HighlightTermPipe, name: "lxHighlightTerm" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
15
15
  }
16
16
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: BasicDropdownItemComponent, decorators: [{
17
17
  type: Component,
18
- args: [{ selector: 'lx-basic-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class.boldLabel]=\"labelFontWeight === 'bold'\" [innerHtml]=\"label | lxHighlightTerm : highlightTerm\"></div>\n<div\n class=\"optionDescription\"\n [style.font-style]=\"descriptionFontStyle\"\n [ngClass]=\"{ maxTextLines: descriptionStyleOptions?.maxLines }\"\n [style.-webkit-line-clamp]=\"descriptionStyleOptions?.maxLines || 'inherit'\"\n>\n {{ description }}\n</div>\n", styles: [":host{display:block;padding:2px 0}:host.hasDescription{padding:4px 0}.boldLabel{font-weight:700}.optionDescription{padding-top:2px;color:#677a9a;font-size:11px}.optionDescription.maxTextLines{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:inherit;-webkit-box-orient:vertical}\n"] }]
18
+ args: [{ selector: 'lx-basic-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class.boldLabel]=\"labelFontWeight === 'bold'\" [innerHtml]=\"label | lxHighlightTerm : highlightTerm\"></div>\n<div\n class=\"optionDescription\"\n [style.font-style]=\"descriptionFontStyle\"\n [ngClass]=\"{ maxTextLines: descriptionStyleOptions?.maxLines }\"\n [style.-webkit-line-clamp]=\"descriptionStyleOptions?.maxLines || 'inherit'\"\n>\n {{ description }}\n</div>\n", styles: [":host{display:block;padding:2px 0}:host.hasDescription{padding:4px 0}.boldLabel{font-weight:700}.optionDescription{padding-top:2px;color:#61779d;font-size:11px}.optionDescription.maxTextLines{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:inherit;-webkit-box-orient:vertical}\n"] }]
19
19
  }], propDecorators: { label: [{
20
20
  type: Input
21
21
  }], description: [{
@@ -23,11 +23,11 @@ export class InputComponent {
23
23
  this.destroyed$.next();
24
24
  }
25
25
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: InputComponent, deps: [{ token: i1.NgControl, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
26
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: InputComponent, selector: "input[lx-input]", inputs: { error: "error", disabled: "disabled" }, host: { properties: { "class.error": "this.error", "class.disabled": "this.disabled" } }, ngImport: i0, template: ``, isInline: true, styles: [":host{height:32px;padding:8px;border-radius:3px;border:solid 1px #99a5bb;outline:0;color:#2a303d}:host:focus{border-color:#59f}:host.error{border-color:#f96464}:host.disabled{background-color:#f0f2f5;color:#677a9a}\n"] }); }
26
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: InputComponent, selector: "input[lx-input]", inputs: { error: "error", disabled: "disabled" }, host: { properties: { "class.error": "this.error", "class.disabled": "this.disabled" } }, ngImport: i0, template: ``, isInline: true, styles: [":host{height:32px;padding:8px;border-radius:3px;border:solid 1px #99a5bb;outline:0;color:#2a303d}:host:focus{border-color:#59f}:host.error{border-color:#f96464}:host.disabled{background-color:#f0f2f5;color:#61779d}\n"] }); }
27
27
  }
28
28
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: InputComponent, decorators: [{
29
29
  type: Component,
30
- args: [{ selector: 'input[lx-input]', template: ``, styles: [":host{height:32px;padding:8px;border-radius:3px;border:solid 1px #99a5bb;outline:0;color:#2a303d}:host:focus{border-color:#59f}:host.error{border-color:#f96464}:host.disabled{background-color:#f0f2f5;color:#677a9a}\n"] }]
30
+ args: [{ selector: 'input[lx-input]', template: ``, styles: [":host{height:32px;padding:8px;border-radius:3px;border:solid 1px #99a5bb;outline:0;color:#2a303d}:host:focus{border-color:#59f}:host.error{border-color:#f96464}:host.disabled{background-color:#f0f2f5;color:#61779d}\n"] }]
31
31
  }], ctorParameters: function () { return [{ type: i1.NgControl, decorators: [{
32
32
  type: Optional
33
33
  }] }]; }, propDecorators: { error: [{
@@ -31,11 +31,11 @@ export class TabComponent {
31
31
  this.tabPanelId = uniqueId('panelId');
32
32
  }
33
33
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TabComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
34
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TabComponent, selector: "lx-tab", inputs: { icon: "icon", label: "label", title: "title", tabLink: "tabLink", counter: "counter", routerLinkActiveOptions: "routerLinkActiveOptions", counterBadgeSize: "counterBadgeSize", noMargin: "noMargin", noLeftMarginForFirstTab: "noLeftMarginForFirstTab", background: "background", disabled: "disabled" }, outputs: { switch: "switch" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentTemplate"], descendants: true, static: true }, { propertyName: "routerLinkActive", first: true, predicate: RouterLinkActive, descendants: true }], ngImport: i0, template: "<li\n class=\"tab\"\n [attr.tabindex]=\"isActive || disabled || tabLink ? '-1' : '0'\"\n [attr.aria-selected]=\"isActive\"\n [attr.aria-controls]=\"tabPanelId\"\n [class.active]=\"isActive\"\n [class.withIcon]=\"icon\"\n [class.noMargin]=\"noMargin\"\n [class.noLeftMarginForFirstTab]=\"noLeftMarginForFirstTab\"\n [class.backgroundGray]=\"background === 'gray'\"\n [class.disabled]=\"disabled\"\n [class.portalTab]=\"!tabLink\"\n [class.routerLinkTab]=\"tabLink\"\n [attr.title]=\"title\"\n role=\"tab\"\n (keyup.enter)=\"switch.emit()\"\n (click)=\"switch.emit()\"\n>\n <a *ngIf=\"tabLink; else portalTab\" [routerLink]=\"tabLink\" routerLinkActive [routerLinkActiveOptions]=\"routerLinkActiveOptions\">\n <ng-container *ngTemplateOutlet=\"portalTab\"></ng-container>\n </a>\n\n <ng-template #portalTab>\n <i *ngIf=\"icon\" class=\"icon {{ icon }}\"></i>\n <span *ngIf=\"label\" class=\"tabLabel\">{{ label }}</span>\n <lx-badge *ngIf=\"counter\" [size]=\"counterBadgeSize\" [content]=\"counter\" [color]=\"'gray'\"></lx-badge>\n </ng-template>\n\n <ng-template cdkPortal #contentTemplate=\"cdkPortal\">\n <div *ngIf=\"!tabLink\" class=\"content\" role=\"tabpanel\" [attr.id]=\"tabPanelId\">\n <ng-content></ng-content>\n </div>\n </ng-template>\n</li>\n", styles: [":host{display:inline-block}.tab{position:relative;display:inline-block;margin:0 8px;text-align:center;transition:border-bottom .5s;cursor:pointer}.tab:after{position:absolute;content:\"\";left:0;right:0;bottom:-1px;height:2px;background-color:transparent}.tab:hover:after,.tab.active:after{transition:background-color .1s;background-color:#1666ee;outline:0}.tab:hover,.tab.active{outline:0}.tab.active{cursor:default}.tab.disabled{opacity:.3;cursor:default}.tab:hover .tabLabel,.tab.active .tabLabel{color:#2a303d;transition:color .1s}.portalTab,.routerLinkTab a{display:inline-block;padding:8px 8px 12px;line-height:20px}.portalTab.withIcon,.routerLinkTab a.withIcon{padding:10px 14px;line-height:16px}.routerLinkTab.active a,.routerLinkTab.disabled a{cursor:default}.icon{font-size:16px;opacity:.6}.noMargin{margin:0}.noLeftMarginForFirstTab{margin-left:0}.backgroundGray{background-color:#c2c9d6}.backgroundGray:not(.active):not(.disabled){background-color:#cfd5df}.tabLabel{color:#677a9a;display:inline-block;font-size:13px;text-decoration:none}.content{height:100%}lx-badge{margin-left:8px}\n"], dependencies: [{ kind: "directive", type: i1.CdkPortal, selector: "[cdkPortal]", exportAs: ["cdkPortal"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.BadgeComponent, selector: "lx-badge", inputs: ["content", "size", "color"] }, { kind: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
34
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TabComponent, selector: "lx-tab", inputs: { icon: "icon", label: "label", title: "title", tabLink: "tabLink", counter: "counter", routerLinkActiveOptions: "routerLinkActiveOptions", counterBadgeSize: "counterBadgeSize", noMargin: "noMargin", noLeftMarginForFirstTab: "noLeftMarginForFirstTab", background: "background", disabled: "disabled" }, outputs: { switch: "switch" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentTemplate"], descendants: true, static: true }, { propertyName: "routerLinkActive", first: true, predicate: RouterLinkActive, descendants: true }], ngImport: i0, template: "<li\n class=\"tab\"\n [attr.tabindex]=\"isActive || disabled || tabLink ? '-1' : '0'\"\n [attr.aria-selected]=\"isActive\"\n [attr.aria-controls]=\"tabPanelId\"\n [class.active]=\"isActive\"\n [class.withIcon]=\"icon\"\n [class.noMargin]=\"noMargin\"\n [class.noLeftMarginForFirstTab]=\"noLeftMarginForFirstTab\"\n [class.backgroundGray]=\"background === 'gray'\"\n [class.disabled]=\"disabled\"\n [class.portalTab]=\"!tabLink\"\n [class.routerLinkTab]=\"tabLink\"\n [attr.title]=\"title\"\n role=\"tab\"\n (keyup.enter)=\"switch.emit()\"\n (click)=\"switch.emit()\"\n>\n <a *ngIf=\"tabLink; else portalTab\" [routerLink]=\"tabLink\" routerLinkActive [routerLinkActiveOptions]=\"routerLinkActiveOptions\">\n <ng-container *ngTemplateOutlet=\"portalTab\"></ng-container>\n </a>\n\n <ng-template #portalTab>\n <i *ngIf=\"icon\" class=\"icon {{ icon }}\"></i>\n <span *ngIf=\"label\" class=\"tabLabel\">{{ label }}</span>\n <lx-badge *ngIf=\"counter\" [size]=\"counterBadgeSize\" [content]=\"counter\" [color]=\"'gray'\"></lx-badge>\n </ng-template>\n\n <ng-template cdkPortal #contentTemplate=\"cdkPortal\">\n <div *ngIf=\"!tabLink\" class=\"content\" role=\"tabpanel\" [attr.id]=\"tabPanelId\">\n <ng-content></ng-content>\n </div>\n </ng-template>\n</li>\n", styles: [":host{display:inline-block}.tab{position:relative;display:inline-block;margin:0 8px;text-align:center;transition:border-bottom .5s;cursor:pointer}.tab:after{position:absolute;content:\"\";left:0;right:0;bottom:-1px;height:2px;background-color:transparent}.tab:hover:after,.tab.active:after{transition:background-color .1s;background-color:#1666ee;outline:0}.tab:hover,.tab.active{outline:0}.tab.active{cursor:default}.tab.disabled{opacity:.3;cursor:default}.tab:hover .tabLabel,.tab.active .tabLabel{color:#2a303d;transition:color .1s}.portalTab,.routerLinkTab a{display:inline-block;padding:8px 8px 12px;line-height:20px}.portalTab.withIcon,.routerLinkTab a.withIcon{padding:10px 14px;line-height:16px}.routerLinkTab.active a,.routerLinkTab.disabled a{cursor:default}.icon{font-size:16px;opacity:.6}.noMargin{margin:0}.noLeftMarginForFirstTab{margin-left:0}.backgroundGray{background-color:#c2c9d6}.backgroundGray:not(.active):not(.disabled){background-color:#cfd5df}.tabLabel{color:#61779d;display:inline-block;font-size:13px;text-decoration:none}.content{height:100%}lx-badge{margin-left:8px}\n"], dependencies: [{ kind: "directive", type: i1.CdkPortal, selector: "[cdkPortal]", exportAs: ["cdkPortal"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: i3.BadgeComponent, selector: "lx-badge", inputs: ["content", "size", "color"] }, { kind: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
35
35
  }
36
36
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TabComponent, decorators: [{
37
37
  type: Component,
38
- args: [{ selector: 'lx-tab', changeDetection: ChangeDetectionStrategy.OnPush, template: "<li\n class=\"tab\"\n [attr.tabindex]=\"isActive || disabled || tabLink ? '-1' : '0'\"\n [attr.aria-selected]=\"isActive\"\n [attr.aria-controls]=\"tabPanelId\"\n [class.active]=\"isActive\"\n [class.withIcon]=\"icon\"\n [class.noMargin]=\"noMargin\"\n [class.noLeftMarginForFirstTab]=\"noLeftMarginForFirstTab\"\n [class.backgroundGray]=\"background === 'gray'\"\n [class.disabled]=\"disabled\"\n [class.portalTab]=\"!tabLink\"\n [class.routerLinkTab]=\"tabLink\"\n [attr.title]=\"title\"\n role=\"tab\"\n (keyup.enter)=\"switch.emit()\"\n (click)=\"switch.emit()\"\n>\n <a *ngIf=\"tabLink; else portalTab\" [routerLink]=\"tabLink\" routerLinkActive [routerLinkActiveOptions]=\"routerLinkActiveOptions\">\n <ng-container *ngTemplateOutlet=\"portalTab\"></ng-container>\n </a>\n\n <ng-template #portalTab>\n <i *ngIf=\"icon\" class=\"icon {{ icon }}\"></i>\n <span *ngIf=\"label\" class=\"tabLabel\">{{ label }}</span>\n <lx-badge *ngIf=\"counter\" [size]=\"counterBadgeSize\" [content]=\"counter\" [color]=\"'gray'\"></lx-badge>\n </ng-template>\n\n <ng-template cdkPortal #contentTemplate=\"cdkPortal\">\n <div *ngIf=\"!tabLink\" class=\"content\" role=\"tabpanel\" [attr.id]=\"tabPanelId\">\n <ng-content></ng-content>\n </div>\n </ng-template>\n</li>\n", styles: [":host{display:inline-block}.tab{position:relative;display:inline-block;margin:0 8px;text-align:center;transition:border-bottom .5s;cursor:pointer}.tab:after{position:absolute;content:\"\";left:0;right:0;bottom:-1px;height:2px;background-color:transparent}.tab:hover:after,.tab.active:after{transition:background-color .1s;background-color:#1666ee;outline:0}.tab:hover,.tab.active{outline:0}.tab.active{cursor:default}.tab.disabled{opacity:.3;cursor:default}.tab:hover .tabLabel,.tab.active .tabLabel{color:#2a303d;transition:color .1s}.portalTab,.routerLinkTab a{display:inline-block;padding:8px 8px 12px;line-height:20px}.portalTab.withIcon,.routerLinkTab a.withIcon{padding:10px 14px;line-height:16px}.routerLinkTab.active a,.routerLinkTab.disabled a{cursor:default}.icon{font-size:16px;opacity:.6}.noMargin{margin:0}.noLeftMarginForFirstTab{margin-left:0}.backgroundGray{background-color:#c2c9d6}.backgroundGray:not(.active):not(.disabled){background-color:#cfd5df}.tabLabel{color:#677a9a;display:inline-block;font-size:13px;text-decoration:none}.content{height:100%}lx-badge{margin-left:8px}\n"] }]
38
+ args: [{ selector: 'lx-tab', changeDetection: ChangeDetectionStrategy.OnPush, template: "<li\n class=\"tab\"\n [attr.tabindex]=\"isActive || disabled || tabLink ? '-1' : '0'\"\n [attr.aria-selected]=\"isActive\"\n [attr.aria-controls]=\"tabPanelId\"\n [class.active]=\"isActive\"\n [class.withIcon]=\"icon\"\n [class.noMargin]=\"noMargin\"\n [class.noLeftMarginForFirstTab]=\"noLeftMarginForFirstTab\"\n [class.backgroundGray]=\"background === 'gray'\"\n [class.disabled]=\"disabled\"\n [class.portalTab]=\"!tabLink\"\n [class.routerLinkTab]=\"tabLink\"\n [attr.title]=\"title\"\n role=\"tab\"\n (keyup.enter)=\"switch.emit()\"\n (click)=\"switch.emit()\"\n>\n <a *ngIf=\"tabLink; else portalTab\" [routerLink]=\"tabLink\" routerLinkActive [routerLinkActiveOptions]=\"routerLinkActiveOptions\">\n <ng-container *ngTemplateOutlet=\"portalTab\"></ng-container>\n </a>\n\n <ng-template #portalTab>\n <i *ngIf=\"icon\" class=\"icon {{ icon }}\"></i>\n <span *ngIf=\"label\" class=\"tabLabel\">{{ label }}</span>\n <lx-badge *ngIf=\"counter\" [size]=\"counterBadgeSize\" [content]=\"counter\" [color]=\"'gray'\"></lx-badge>\n </ng-template>\n\n <ng-template cdkPortal #contentTemplate=\"cdkPortal\">\n <div *ngIf=\"!tabLink\" class=\"content\" role=\"tabpanel\" [attr.id]=\"tabPanelId\">\n <ng-content></ng-content>\n </div>\n </ng-template>\n</li>\n", styles: [":host{display:inline-block}.tab{position:relative;display:inline-block;margin:0 8px;text-align:center;transition:border-bottom .5s;cursor:pointer}.tab:after{position:absolute;content:\"\";left:0;right:0;bottom:-1px;height:2px;background-color:transparent}.tab:hover:after,.tab.active:after{transition:background-color .1s;background-color:#1666ee;outline:0}.tab:hover,.tab.active{outline:0}.tab.active{cursor:default}.tab.disabled{opacity:.3;cursor:default}.tab:hover .tabLabel,.tab.active .tabLabel{color:#2a303d;transition:color .1s}.portalTab,.routerLinkTab a{display:inline-block;padding:8px 8px 12px;line-height:20px}.portalTab.withIcon,.routerLinkTab a.withIcon{padding:10px 14px;line-height:16px}.routerLinkTab.active a,.routerLinkTab.disabled a{cursor:default}.icon{font-size:16px;opacity:.6}.noMargin{margin:0}.noLeftMarginForFirstTab{margin-left:0}.backgroundGray{background-color:#c2c9d6}.backgroundGray:not(.active):not(.disabled){background-color:#cfd5df}.tabLabel{color:#61779d;display:inline-block;font-size:13px;text-decoration:none}.content{height:100%}lx-badge{margin-left:8px}\n"] }]
39
39
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { icon: [{
40
40
  type: Input
41
41
  }], label: [{
@@ -1988,11 +1988,11 @@ class BasicDropdownItemComponent {
1988
1988
  return !!this.description;
1989
1989
  }
1990
1990
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: BasicDropdownItemComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
1991
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: BasicDropdownItemComponent, selector: "lx-basic-dropdown-item", inputs: { label: "label", description: "description", highlightTerm: "highlightTerm", labelFontWeight: "labelFontWeight", descriptionFontStyle: "descriptionFontStyle", descriptionStyleOptions: "descriptionStyleOptions" }, host: { properties: { "class.hasDescription": "this.hasDescription" } }, ngImport: i0, template: "<div [class.boldLabel]=\"labelFontWeight === 'bold'\" [innerHtml]=\"label | lxHighlightTerm : highlightTerm\"></div>\n<div\n class=\"optionDescription\"\n [style.font-style]=\"descriptionFontStyle\"\n [ngClass]=\"{ maxTextLines: descriptionStyleOptions?.maxLines }\"\n [style.-webkit-line-clamp]=\"descriptionStyleOptions?.maxLines || 'inherit'\"\n>\n {{ description }}\n</div>\n", styles: [":host{display:block;padding:2px 0}:host.hasDescription{padding:4px 0}.boldLabel{font-weight:700}.optionDescription{padding-top:2px;color:#677a9a;font-size:11px}.optionDescription.maxTextLines{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:inherit;-webkit-box-orient:vertical}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: HighlightTermPipe, name: "lxHighlightTerm" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1991
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: BasicDropdownItemComponent, selector: "lx-basic-dropdown-item", inputs: { label: "label", description: "description", highlightTerm: "highlightTerm", labelFontWeight: "labelFontWeight", descriptionFontStyle: "descriptionFontStyle", descriptionStyleOptions: "descriptionStyleOptions" }, host: { properties: { "class.hasDescription": "this.hasDescription" } }, ngImport: i0, template: "<div [class.boldLabel]=\"labelFontWeight === 'bold'\" [innerHtml]=\"label | lxHighlightTerm : highlightTerm\"></div>\n<div\n class=\"optionDescription\"\n [style.font-style]=\"descriptionFontStyle\"\n [ngClass]=\"{ maxTextLines: descriptionStyleOptions?.maxLines }\"\n [style.-webkit-line-clamp]=\"descriptionStyleOptions?.maxLines || 'inherit'\"\n>\n {{ description }}\n</div>\n", styles: [":host{display:block;padding:2px 0}:host.hasDescription{padding:4px 0}.boldLabel{font-weight:700}.optionDescription{padding-top:2px;color:#61779d;font-size:11px}.optionDescription.maxTextLines{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:inherit;-webkit-box-orient:vertical}\n"], dependencies: [{ kind: "directive", type: i1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: HighlightTermPipe, name: "lxHighlightTerm" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
1992
1992
  }
1993
1993
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: BasicDropdownItemComponent, decorators: [{
1994
1994
  type: Component,
1995
- args: [{ selector: 'lx-basic-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class.boldLabel]=\"labelFontWeight === 'bold'\" [innerHtml]=\"label | lxHighlightTerm : highlightTerm\"></div>\n<div\n class=\"optionDescription\"\n [style.font-style]=\"descriptionFontStyle\"\n [ngClass]=\"{ maxTextLines: descriptionStyleOptions?.maxLines }\"\n [style.-webkit-line-clamp]=\"descriptionStyleOptions?.maxLines || 'inherit'\"\n>\n {{ description }}\n</div>\n", styles: [":host{display:block;padding:2px 0}:host.hasDescription{padding:4px 0}.boldLabel{font-weight:700}.optionDescription{padding-top:2px;color:#677a9a;font-size:11px}.optionDescription.maxTextLines{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:inherit;-webkit-box-orient:vertical}\n"] }]
1995
+ args: [{ selector: 'lx-basic-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div [class.boldLabel]=\"labelFontWeight === 'bold'\" [innerHtml]=\"label | lxHighlightTerm : highlightTerm\"></div>\n<div\n class=\"optionDescription\"\n [style.font-style]=\"descriptionFontStyle\"\n [ngClass]=\"{ maxTextLines: descriptionStyleOptions?.maxLines }\"\n [style.-webkit-line-clamp]=\"descriptionStyleOptions?.maxLines || 'inherit'\"\n>\n {{ description }}\n</div>\n", styles: [":host{display:block;padding:2px 0}:host.hasDescription{padding:4px 0}.boldLabel{font-weight:700}.optionDescription{padding-top:2px;color:#61779d;font-size:11px}.optionDescription.maxTextLines{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:inherit;-webkit-box-orient:vertical}\n"] }]
1996
1996
  }], propDecorators: { label: [{
1997
1997
  type: Input
1998
1998
  }], description: [{
@@ -5045,11 +5045,11 @@ class InputComponent {
5045
5045
  this.destroyed$.next();
5046
5046
  }
5047
5047
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: InputComponent, deps: [{ token: i2$1.NgControl, optional: true }], target: i0.ɵɵFactoryTarget.Component }); }
5048
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: InputComponent, selector: "input[lx-input]", inputs: { error: "error", disabled: "disabled" }, host: { properties: { "class.error": "this.error", "class.disabled": "this.disabled" } }, ngImport: i0, template: ``, isInline: true, styles: [":host{height:32px;padding:8px;border-radius:3px;border:solid 1px #99a5bb;outline:0;color:#2a303d}:host:focus{border-color:#59f}:host.error{border-color:#f96464}:host.disabled{background-color:#f0f2f5;color:#677a9a}\n"] }); }
5048
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: InputComponent, selector: "input[lx-input]", inputs: { error: "error", disabled: "disabled" }, host: { properties: { "class.error": "this.error", "class.disabled": "this.disabled" } }, ngImport: i0, template: ``, isInline: true, styles: [":host{height:32px;padding:8px;border-radius:3px;border:solid 1px #99a5bb;outline:0;color:#2a303d}:host:focus{border-color:#59f}:host.error{border-color:#f96464}:host.disabled{background-color:#f0f2f5;color:#61779d}\n"] }); }
5049
5049
  }
5050
5050
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: InputComponent, decorators: [{
5051
5051
  type: Component,
5052
- args: [{ selector: 'input[lx-input]', template: ``, styles: [":host{height:32px;padding:8px;border-radius:3px;border:solid 1px #99a5bb;outline:0;color:#2a303d}:host:focus{border-color:#59f}:host.error{border-color:#f96464}:host.disabled{background-color:#f0f2f5;color:#677a9a}\n"] }]
5052
+ args: [{ selector: 'input[lx-input]', template: ``, styles: [":host{height:32px;padding:8px;border-radius:3px;border:solid 1px #99a5bb;outline:0;color:#2a303d}:host:focus{border-color:#59f}:host.error{border-color:#f96464}:host.disabled{background-color:#f0f2f5;color:#61779d}\n"] }]
5053
5053
  }], ctorParameters: function () { return [{ type: i2$1.NgControl, decorators: [{
5054
5054
  type: Optional
5055
5055
  }] }]; }, propDecorators: { error: [{
@@ -8267,11 +8267,11 @@ class TabComponent {
8267
8267
  this.tabPanelId = uniqueId('panelId');
8268
8268
  }
8269
8269
  static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TabComponent, deps: [{ token: i0.ChangeDetectorRef }], target: i0.ɵɵFactoryTarget.Component }); }
8270
- static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TabComponent, selector: "lx-tab", inputs: { icon: "icon", label: "label", title: "title", tabLink: "tabLink", counter: "counter", routerLinkActiveOptions: "routerLinkActiveOptions", counterBadgeSize: "counterBadgeSize", noMargin: "noMargin", noLeftMarginForFirstTab: "noLeftMarginForFirstTab", background: "background", disabled: "disabled" }, outputs: { switch: "switch" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentTemplate"], descendants: true, static: true }, { propertyName: "routerLinkActive", first: true, predicate: RouterLinkActive, descendants: true }], ngImport: i0, template: "<li\n class=\"tab\"\n [attr.tabindex]=\"isActive || disabled || tabLink ? '-1' : '0'\"\n [attr.aria-selected]=\"isActive\"\n [attr.aria-controls]=\"tabPanelId\"\n [class.active]=\"isActive\"\n [class.withIcon]=\"icon\"\n [class.noMargin]=\"noMargin\"\n [class.noLeftMarginForFirstTab]=\"noLeftMarginForFirstTab\"\n [class.backgroundGray]=\"background === 'gray'\"\n [class.disabled]=\"disabled\"\n [class.portalTab]=\"!tabLink\"\n [class.routerLinkTab]=\"tabLink\"\n [attr.title]=\"title\"\n role=\"tab\"\n (keyup.enter)=\"switch.emit()\"\n (click)=\"switch.emit()\"\n>\n <a *ngIf=\"tabLink; else portalTab\" [routerLink]=\"tabLink\" routerLinkActive [routerLinkActiveOptions]=\"routerLinkActiveOptions\">\n <ng-container *ngTemplateOutlet=\"portalTab\"></ng-container>\n </a>\n\n <ng-template #portalTab>\n <i *ngIf=\"icon\" class=\"icon {{ icon }}\"></i>\n <span *ngIf=\"label\" class=\"tabLabel\">{{ label }}</span>\n <lx-badge *ngIf=\"counter\" [size]=\"counterBadgeSize\" [content]=\"counter\" [color]=\"'gray'\"></lx-badge>\n </ng-template>\n\n <ng-template cdkPortal #contentTemplate=\"cdkPortal\">\n <div *ngIf=\"!tabLink\" class=\"content\" role=\"tabpanel\" [attr.id]=\"tabPanelId\">\n <ng-content></ng-content>\n </div>\n </ng-template>\n</li>\n", styles: [":host{display:inline-block}.tab{position:relative;display:inline-block;margin:0 8px;text-align:center;transition:border-bottom .5s;cursor:pointer}.tab:after{position:absolute;content:\"\";left:0;right:0;bottom:-1px;height:2px;background-color:transparent}.tab:hover:after,.tab.active:after{transition:background-color .1s;background-color:#1666ee;outline:0}.tab:hover,.tab.active{outline:0}.tab.active{cursor:default}.tab.disabled{opacity:.3;cursor:default}.tab:hover .tabLabel,.tab.active .tabLabel{color:#2a303d;transition:color .1s}.portalTab,.routerLinkTab a{display:inline-block;padding:8px 8px 12px;line-height:20px}.portalTab.withIcon,.routerLinkTab a.withIcon{padding:10px 14px;line-height:16px}.routerLinkTab.active a,.routerLinkTab.disabled a{cursor:default}.icon{font-size:16px;opacity:.6}.noMargin{margin:0}.noLeftMarginForFirstTab{margin-left:0}.backgroundGray{background-color:#c2c9d6}.backgroundGray:not(.active):not(.disabled){background-color:#cfd5df}.tabLabel{color:#677a9a;display:inline-block;font-size:13px;text-decoration:none}.content{height:100%}lx-badge{margin-left:8px}\n"], dependencies: [{ kind: "directive", type: i1$7.CdkPortal, selector: "[cdkPortal]", exportAs: ["cdkPortal"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: BadgeComponent, selector: "lx-badge", inputs: ["content", "size", "color"] }, { kind: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
8270
+ static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "16.1.5", type: TabComponent, selector: "lx-tab", inputs: { icon: "icon", label: "label", title: "title", tabLink: "tabLink", counter: "counter", routerLinkActiveOptions: "routerLinkActiveOptions", counterBadgeSize: "counterBadgeSize", noMargin: "noMargin", noLeftMarginForFirstTab: "noLeftMarginForFirstTab", background: "background", disabled: "disabled" }, outputs: { switch: "switch" }, viewQueries: [{ propertyName: "content", first: true, predicate: ["contentTemplate"], descendants: true, static: true }, { propertyName: "routerLinkActive", first: true, predicate: RouterLinkActive, descendants: true }], ngImport: i0, template: "<li\n class=\"tab\"\n [attr.tabindex]=\"isActive || disabled || tabLink ? '-1' : '0'\"\n [attr.aria-selected]=\"isActive\"\n [attr.aria-controls]=\"tabPanelId\"\n [class.active]=\"isActive\"\n [class.withIcon]=\"icon\"\n [class.noMargin]=\"noMargin\"\n [class.noLeftMarginForFirstTab]=\"noLeftMarginForFirstTab\"\n [class.backgroundGray]=\"background === 'gray'\"\n [class.disabled]=\"disabled\"\n [class.portalTab]=\"!tabLink\"\n [class.routerLinkTab]=\"tabLink\"\n [attr.title]=\"title\"\n role=\"tab\"\n (keyup.enter)=\"switch.emit()\"\n (click)=\"switch.emit()\"\n>\n <a *ngIf=\"tabLink; else portalTab\" [routerLink]=\"tabLink\" routerLinkActive [routerLinkActiveOptions]=\"routerLinkActiveOptions\">\n <ng-container *ngTemplateOutlet=\"portalTab\"></ng-container>\n </a>\n\n <ng-template #portalTab>\n <i *ngIf=\"icon\" class=\"icon {{ icon }}\"></i>\n <span *ngIf=\"label\" class=\"tabLabel\">{{ label }}</span>\n <lx-badge *ngIf=\"counter\" [size]=\"counterBadgeSize\" [content]=\"counter\" [color]=\"'gray'\"></lx-badge>\n </ng-template>\n\n <ng-template cdkPortal #contentTemplate=\"cdkPortal\">\n <div *ngIf=\"!tabLink\" class=\"content\" role=\"tabpanel\" [attr.id]=\"tabPanelId\">\n <ng-content></ng-content>\n </div>\n </ng-template>\n</li>\n", styles: [":host{display:inline-block}.tab{position:relative;display:inline-block;margin:0 8px;text-align:center;transition:border-bottom .5s;cursor:pointer}.tab:after{position:absolute;content:\"\";left:0;right:0;bottom:-1px;height:2px;background-color:transparent}.tab:hover:after,.tab.active:after{transition:background-color .1s;background-color:#1666ee;outline:0}.tab:hover,.tab.active{outline:0}.tab.active{cursor:default}.tab.disabled{opacity:.3;cursor:default}.tab:hover .tabLabel,.tab.active .tabLabel{color:#2a303d;transition:color .1s}.portalTab,.routerLinkTab a{display:inline-block;padding:8px 8px 12px;line-height:20px}.portalTab.withIcon,.routerLinkTab a.withIcon{padding:10px 14px;line-height:16px}.routerLinkTab.active a,.routerLinkTab.disabled a{cursor:default}.icon{font-size:16px;opacity:.6}.noMargin{margin:0}.noLeftMarginForFirstTab{margin-left:0}.backgroundGray{background-color:#c2c9d6}.backgroundGray:not(.active):not(.disabled){background-color:#cfd5df}.tabLabel{color:#61779d;display:inline-block;font-size:13px;text-decoration:none}.content{height:100%}lx-badge{margin-left:8px}\n"], dependencies: [{ kind: "directive", type: i1$7.CdkPortal, selector: "[cdkPortal]", exportAs: ["cdkPortal"] }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "component", type: BadgeComponent, selector: "lx-badge", inputs: ["content", "size", "color"] }, { kind: "directive", type: i4.RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: i4.RouterLinkActive, selector: "[routerLinkActive]", inputs: ["routerLinkActiveOptions", "ariaCurrentWhenActive", "routerLinkActive"], outputs: ["isActiveChange"], exportAs: ["routerLinkActive"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
8271
8271
  }
8272
8272
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "16.1.5", ngImport: i0, type: TabComponent, decorators: [{
8273
8273
  type: Component,
8274
- args: [{ selector: 'lx-tab', changeDetection: ChangeDetectionStrategy.OnPush, template: "<li\n class=\"tab\"\n [attr.tabindex]=\"isActive || disabled || tabLink ? '-1' : '0'\"\n [attr.aria-selected]=\"isActive\"\n [attr.aria-controls]=\"tabPanelId\"\n [class.active]=\"isActive\"\n [class.withIcon]=\"icon\"\n [class.noMargin]=\"noMargin\"\n [class.noLeftMarginForFirstTab]=\"noLeftMarginForFirstTab\"\n [class.backgroundGray]=\"background === 'gray'\"\n [class.disabled]=\"disabled\"\n [class.portalTab]=\"!tabLink\"\n [class.routerLinkTab]=\"tabLink\"\n [attr.title]=\"title\"\n role=\"tab\"\n (keyup.enter)=\"switch.emit()\"\n (click)=\"switch.emit()\"\n>\n <a *ngIf=\"tabLink; else portalTab\" [routerLink]=\"tabLink\" routerLinkActive [routerLinkActiveOptions]=\"routerLinkActiveOptions\">\n <ng-container *ngTemplateOutlet=\"portalTab\"></ng-container>\n </a>\n\n <ng-template #portalTab>\n <i *ngIf=\"icon\" class=\"icon {{ icon }}\"></i>\n <span *ngIf=\"label\" class=\"tabLabel\">{{ label }}</span>\n <lx-badge *ngIf=\"counter\" [size]=\"counterBadgeSize\" [content]=\"counter\" [color]=\"'gray'\"></lx-badge>\n </ng-template>\n\n <ng-template cdkPortal #contentTemplate=\"cdkPortal\">\n <div *ngIf=\"!tabLink\" class=\"content\" role=\"tabpanel\" [attr.id]=\"tabPanelId\">\n <ng-content></ng-content>\n </div>\n </ng-template>\n</li>\n", styles: [":host{display:inline-block}.tab{position:relative;display:inline-block;margin:0 8px;text-align:center;transition:border-bottom .5s;cursor:pointer}.tab:after{position:absolute;content:\"\";left:0;right:0;bottom:-1px;height:2px;background-color:transparent}.tab:hover:after,.tab.active:after{transition:background-color .1s;background-color:#1666ee;outline:0}.tab:hover,.tab.active{outline:0}.tab.active{cursor:default}.tab.disabled{opacity:.3;cursor:default}.tab:hover .tabLabel,.tab.active .tabLabel{color:#2a303d;transition:color .1s}.portalTab,.routerLinkTab a{display:inline-block;padding:8px 8px 12px;line-height:20px}.portalTab.withIcon,.routerLinkTab a.withIcon{padding:10px 14px;line-height:16px}.routerLinkTab.active a,.routerLinkTab.disabled a{cursor:default}.icon{font-size:16px;opacity:.6}.noMargin{margin:0}.noLeftMarginForFirstTab{margin-left:0}.backgroundGray{background-color:#c2c9d6}.backgroundGray:not(.active):not(.disabled){background-color:#cfd5df}.tabLabel{color:#677a9a;display:inline-block;font-size:13px;text-decoration:none}.content{height:100%}lx-badge{margin-left:8px}\n"] }]
8274
+ args: [{ selector: 'lx-tab', changeDetection: ChangeDetectionStrategy.OnPush, template: "<li\n class=\"tab\"\n [attr.tabindex]=\"isActive || disabled || tabLink ? '-1' : '0'\"\n [attr.aria-selected]=\"isActive\"\n [attr.aria-controls]=\"tabPanelId\"\n [class.active]=\"isActive\"\n [class.withIcon]=\"icon\"\n [class.noMargin]=\"noMargin\"\n [class.noLeftMarginForFirstTab]=\"noLeftMarginForFirstTab\"\n [class.backgroundGray]=\"background === 'gray'\"\n [class.disabled]=\"disabled\"\n [class.portalTab]=\"!tabLink\"\n [class.routerLinkTab]=\"tabLink\"\n [attr.title]=\"title\"\n role=\"tab\"\n (keyup.enter)=\"switch.emit()\"\n (click)=\"switch.emit()\"\n>\n <a *ngIf=\"tabLink; else portalTab\" [routerLink]=\"tabLink\" routerLinkActive [routerLinkActiveOptions]=\"routerLinkActiveOptions\">\n <ng-container *ngTemplateOutlet=\"portalTab\"></ng-container>\n </a>\n\n <ng-template #portalTab>\n <i *ngIf=\"icon\" class=\"icon {{ icon }}\"></i>\n <span *ngIf=\"label\" class=\"tabLabel\">{{ label }}</span>\n <lx-badge *ngIf=\"counter\" [size]=\"counterBadgeSize\" [content]=\"counter\" [color]=\"'gray'\"></lx-badge>\n </ng-template>\n\n <ng-template cdkPortal #contentTemplate=\"cdkPortal\">\n <div *ngIf=\"!tabLink\" class=\"content\" role=\"tabpanel\" [attr.id]=\"tabPanelId\">\n <ng-content></ng-content>\n </div>\n </ng-template>\n</li>\n", styles: [":host{display:inline-block}.tab{position:relative;display:inline-block;margin:0 8px;text-align:center;transition:border-bottom .5s;cursor:pointer}.tab:after{position:absolute;content:\"\";left:0;right:0;bottom:-1px;height:2px;background-color:transparent}.tab:hover:after,.tab.active:after{transition:background-color .1s;background-color:#1666ee;outline:0}.tab:hover,.tab.active{outline:0}.tab.active{cursor:default}.tab.disabled{opacity:.3;cursor:default}.tab:hover .tabLabel,.tab.active .tabLabel{color:#2a303d;transition:color .1s}.portalTab,.routerLinkTab a{display:inline-block;padding:8px 8px 12px;line-height:20px}.portalTab.withIcon,.routerLinkTab a.withIcon{padding:10px 14px;line-height:16px}.routerLinkTab.active a,.routerLinkTab.disabled a{cursor:default}.icon{font-size:16px;opacity:.6}.noMargin{margin:0}.noLeftMarginForFirstTab{margin-left:0}.backgroundGray{background-color:#c2c9d6}.backgroundGray:not(.active):not(.disabled){background-color:#cfd5df}.tabLabel{color:#61779d;display:inline-block;font-size:13px;text-decoration:none}.content{height:100%}lx-badge{margin-left:8px}\n"] }]
8275
8275
  }], ctorParameters: function () { return [{ type: i0.ChangeDetectorRef }]; }, propDecorators: { icon: [{
8276
8276
  type: Input
8277
8277
  }], label: [{
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@leanix/components",
3
- "version": "0.4.53",
3
+ "version": "0.4.54",
4
4
  "license": "Apache-2.0",
5
5
  "author": "LeanIX GmbH",
6
6
  "repository": {