@leanix/components 0.4.545 → 0.4.546
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.
|
@@ -324,7 +324,7 @@ class BadgeComponent {
|
|
|
324
324
|
}
|
|
325
325
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: BadgeComponent, decorators: [{
|
|
326
326
|
type: Component,
|
|
327
|
-
args: [{ selector: 'lx-badge',
|
|
327
|
+
args: [{ selector: 'lx-badge', template: "@if (calculateColorsDynamically) {\n <div class=\"wrapper\" [style.background-color]=\"backGroundColor\" [style.color]=\"textColor\">\n <span>{{ content }}</span>\n </div>\n} @else {\n <div class=\"wrapper\" [class]=\"colorClass\">\n <span>{{ content }}</span>\n </div>\n}\n", styles: [".wrapper{border-radius:2px;padding:2px 4px;height:20px;max-width:max-content;font-weight:var(--lxFontSemibold, 600);font-size:var(--lxFontSmallSize, 12px);letter-spacing:.3px}.gray{background-color:#f0f2f5;color:#3e495b}.blue{background-color:#e9f3ff;color:#0a3e6b}.green{background-color:#ebfaee;color:#145027}.red{background-color:#feefef;color:#731616}.yellow{background-color:#fff8ea;color:#78350f}.purple{background-color:#f4efff;color:#531991}.white{background-color:#fff;color:#2a303d;border:1px solid #c2c9d6}\n"] }]
|
|
328
328
|
}], propDecorators: { content: [{
|
|
329
329
|
type: Input,
|
|
330
330
|
args: [{ required: true }]
|
|
@@ -404,7 +404,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
404
404
|
args: [{ selector: 'lx-banner', host: {
|
|
405
405
|
'[attr.type]': 'type',
|
|
406
406
|
'[attr.size]': 'size'
|
|
407
|
-
}, changeDetection: ChangeDetectionStrategy.OnPush,
|
|
407
|
+
}, changeDetection: ChangeDetectionStrategy.OnPush, template: "<div class=\"banner-wrapper\">\n @if (showIcon()) {\n <div class=\"banner-icon-box\" aria-hidden=\"true\">\n <i class=\"fas tw-text-size-sm\" [class]=\"iconClass()\"></i>\n </div>\n }\n <div class=\"banner-content\">\n <ng-content />\n </div>\n</div>\n", styles: [":host{display:flex;flex-direction:column}:host ::ng-deep .banner-content h4{margin-top:0;color:inherit}:host ::ng-deep .banner-content .alert-link{font-weight:700}:host ::ng-deep .banner-content>p,:host ::ng-deep .banner-content>ul{margin-bottom:0}:host ::ng-deep .banner-content p+p{margin-bottom:5px}:host ::ng-deep .banner-content p:last-child{margin-bottom:0}:host([size=big]){padding:12px;margin-bottom:12px}:host([size=small]){padding:8px;margin-bottom:6px}:host([type=success]){border-left:2px solid #33cc58;background-color:color-mix(in srgb,#33cc58 10%,white)}:host([type=success]) .banner-wrapper{display:flex;flex-direction:row}:host([type=success]) .banner-icon-box{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin-right:12px;background-color:#33cc58;padding:6px;border-radius:100%;flex-shrink:0}:host([type=success]) .banner-content{display:flex;width:100%;flex-direction:column;justify-content:center}:host([type=success]) i{font-size:var(--lxFontSmallSize, 12px);color:#fff}:host([type=info]){border-left:2px solid #2889ff;background-color:color-mix(in srgb,#2889ff 10%,white)}:host([type=info]) .banner-wrapper{display:flex;flex-direction:row}:host([type=info]) .banner-icon-box{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin-right:12px;background-color:#2889ff;padding:6px;border-radius:100%;flex-shrink:0}:host([type=info]) .banner-content{display:flex;width:100%;flex-direction:column;justify-content:center}:host([type=info]) i{font-size:var(--lxFontSmallSize, 12px);color:#fff}:host([type=warning]){border-left:2px solid #ffb62a;background-color:color-mix(in srgb,#ffb62a 10%,white)}:host([type=warning]) .banner-wrapper{display:flex;flex-direction:row}:host([type=warning]) .banner-icon-box{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin-right:12px;background-color:#ffb62a;padding:6px;border-radius:100%;flex-shrink:0}:host([type=warning]) .banner-content{display:flex;width:100%;flex-direction:column;justify-content:center}:host([type=warning]) i{font-size:var(--lxFontSmallSize, 12px);color:#fff}:host([type=danger]){border-left:2px solid #f96464;background-color:color-mix(in srgb,#f96464 10%,white)}:host([type=danger]) .banner-wrapper{display:flex;flex-direction:row}:host([type=danger]) .banner-icon-box{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin-right:12px;background-color:#f96464;padding:6px;border-radius:100%;flex-shrink:0}:host([type=danger]) .banner-content{display:flex;width:100%;flex-direction:column;justify-content:center}:host([type=danger]) i{font-size:var(--lxFontSmallSize, 12px);color:#fff}:host([type=gray]){border-left:2px solid #8594ad;background-color:color-mix(in srgb,#8594ad 10%,white)}:host([type=gray]) .banner-wrapper{display:flex;flex-direction:row}:host([type=gray]) .banner-icon-box{display:inline-flex;align-items:center;justify-content:center;width:24px;height:24px;margin-right:12px;background-color:#8594ad;padding:6px;border-radius:100%;flex-shrink:0}:host([type=gray]) .banner-content{display:flex;width:100%;flex-direction:column;justify-content:center}:host([type=gray]) i{font-size:var(--lxFontSmallSize, 12px);color:#fff}\n"] }]
|
|
408
408
|
}], propDecorators: { type: [{
|
|
409
409
|
type: Input
|
|
410
410
|
}], size: [{
|
|
@@ -426,7 +426,7 @@ class ButtonGroupComponent {
|
|
|
426
426
|
}
|
|
427
427
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ButtonGroupComponent, decorators: [{
|
|
428
428
|
type: Component,
|
|
429
|
-
args: [{ selector: 'lx-button-group',
|
|
429
|
+
args: [{ selector: 'lx-button-group', template: "<ng-content />\n", styles: [":host{display:flex;align-items:center}:host.marginSeparator ::ng-deep [lx-button]:not(:last-child){margin-right:1px}:host.borderSeparator ::ng-deep [lx-button]:not(:last-child){border-right:none!important}:host.borderSeparator ::ng-deep [lx-button]:not(:last-child):hover{border-right:none!important}:host ::ng-deep [lx-button]:not(:last-child){border-top-right-radius:0;border-bottom-right-radius:0}:host ::ng-deep [lx-button]:not(:first-of-type){border-top-left-radius:0;border-bottom-left-radius:0}:host ::ng-deep lx-options-dropdown button[lx-button]:last-of-type{border-top-left-radius:0;border-bottom-left-radius:0}\n"] }]
|
|
430
430
|
}], propDecorators: { separator: [{
|
|
431
431
|
type: Input
|
|
432
432
|
}], hasMarginSeperator: [{
|
|
@@ -446,7 +446,7 @@ class TinySpinnerComponent {
|
|
|
446
446
|
}
|
|
447
447
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TinySpinnerComponent, decorators: [{
|
|
448
448
|
type: Component,
|
|
449
|
-
args: [{ selector: 'lx-tiny-spinner',
|
|
449
|
+
args: [{ selector: 'lx-tiny-spinner', template: "<i class=\"far fa-spinner fa-spin fa-fw\"></i>\n" }]
|
|
450
450
|
}] });
|
|
451
451
|
|
|
452
452
|
/**
|
|
@@ -550,7 +550,7 @@ class ButtonComponent {
|
|
|
550
550
|
}
|
|
551
551
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ButtonComponent, decorators: [{
|
|
552
552
|
type: Component,
|
|
553
|
-
args: [{ selector: 'button[lx-button]', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [TinySpinnerComponent, IconComponent$1, NgTemplateOutlet], template: "@let useNewIcons = useSAPIcons();\n@let startIcon = iconName();\n@let endIcon = endIconName();\n@if (!startIcon && !endIcon) {\n <!-- old layout -->\n @if (showSpinner) {\n <lx-tiny-spinner />\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n} @else {\n <div class=\"contentWrapper\">\n <!-- new layout -->\n @if (showSpinner) {\n <lx-tiny-spinner />\n } @else if (startIcon && useNewIcons) {\n <ui5-icon class=\"ui5Icon\" [name]=\"startIcon\" data-testid=\"start-icon\" />\n } @else if (startIcon && !useNewIcons) {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ startIcon }} {{ iconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"start-icon\"\n ></i>\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n @if (!showSpinner && endIcon && useNewIcons) {\n <ui5-icon class=\"ui5Icon\" [name]=\"endIcon\" data-testid=\"end-icon\" />\n } @else if (!showSpinner && endIcon && !useNewIcons) {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ endIcon }} {{ endIconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"end-icon\"\n ></i>\n }\n </div>\n}\n\n<!-- ng-content with the same slot can be used once in the same template -->\n<ng-template #content>\n <ng-content />\n</ng-template>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}:host ::ng-deep i{font-size:.9em}:host(.withIcon){line-height:normal}:host(.withIcon) .contentWrapper{display:flex;height:100%;align-items:center;justify-content:center;column-gap:4px}:host(.withIcon) [class*=fa-]{font-size:var(--lxFontSize, 14px)}:host(.withIcon)[mode=link] .contentWrapper{column-gap:6px}:host(.withIcon)[mode=link] i:before{display:inline-block}:host(.withIcon) .ui5Icon{width:var(--lxFontSmallSize);height:var(--lxFontSmallSize);color:inherit}:host(.withIcon).loading[color]{position:relative;color:transparent}:host(.withIcon).loading[color] lx-tiny-spinner{position:absolute;left:50%;transform:translate(-50%)}:host{border-radius:3px;font-weight:var(--lxFontNormal, 400);cursor:pointer;transition:color,background-color,border-color .18s;transition-delay:0s;transition-timing-function:ease}:host[disabled]{opacity:.5;cursor:default}:host[color=default] lx-tiny-spinner{color:#2a303d}:host[color=default][mode=solid]{color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=solid]:hover:not([disabled]),:host[color=default][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=default][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=default][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=outline]:focus:not([disabled]),:host[color=default][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=default][mode=ghost]:focus:not([disabled]),:host[color=default][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=default][mode=link]:focus:not([disabled]),:host[color=default][mode=link]:hover:not([disabled]),:host[color=default][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=light] lx-tiny-spinner{color:#2a303d}:host[color=light][mode=solid]{color:#2a303d;background-color:#fff;border:1px solid #99a5bb}:host[color=light][mode=solid]:hover:not([disabled]),:host[color=light][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=light][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=light][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=outline]:focus:not([disabled]),:host[color=light][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=light][mode=ghost]:focus:not([disabled]),:host[color=light][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=light][mode=link]:focus:not([disabled]),:host[color=light][mode=link]:hover:not([disabled]),:host[color=light][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=primary] lx-tiny-spinner{color:var(--lx-primarybutton-fontcolor)}:host[color=primary][mode=solid]{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=solid]:hover:not([disabled]),:host[color=primary][mode=solid]:focus:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=solid]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcoloractive);border:1px solid var(--lx-primarybutton-backgroundcoloractive)}:host[color=primary][mode=solid].pressed{background-color:var(--lx-primarybutton-backgroundcoloractive)!important;border-color:var(--lx-primarybutton-backgroundcoloractive)!important}:host[color=primary][mode=solid].selected{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=outline]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline]:focus:not([disabled]),:host[color=primary][mode=outline]:hover:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=ghost]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent}:host[color=primary][mode=ghost]:focus:not([disabled]),:host[color=primary][mode=ghost]:hover:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=ghost]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=link]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=primary][mode=link]:focus:not([disabled]),:host[color=primary][mode=link]:hover:not([disabled]),:host[color=primary][mode=link]:active:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=danger] lx-tiny-spinner{color:#fff}:host[color=danger][mode=solid]{color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=solid]:hover:not([disabled]),:host[color=danger][mode=solid]:focus:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=solid]:active:not([disabled]){color:#fff;background-color:#bd0707;border:1px solid rgb(188.6956521739,7.3043478261,7.3043478261)}:host[color=danger][mode=solid].pressed{background-color:#bd0707!important;border-color:#bd0707!important}:host[color=danger][mode=solid].selected{color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=outline]{color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=outline]:focus:not([disabled]),:host[color=danger][mode=outline]:hover:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=outline]:active:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=ghost]{color:#f96464;background-color:transparent;border:1px solid transparent}:host[color=danger][mode=ghost]:focus:not([disabled]),:host[color=danger][mode=ghost]:hover:not([disabled]){color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=ghost]:active:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=link]{color:#f96464;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=danger][mode=link]:focus:not([disabled]),:host[color=danger][mode=link]:hover:not([disabled]),:host[color=danger][mode=link]:active:not([disabled]){color:#f96464;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=success] lx-tiny-spinner{color:#fff}:host[color=success][mode=solid]{color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=solid]:hover:not([disabled]),:host[color=success][mode=solid]:focus:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=solid]:active:not([disabled]){color:#fff;background-color:#145223;border:1px solid rgb(20.4,81.6,35.2)}:host[color=success][mode=solid].pressed{background-color:#145223!important;border-color:#145223!important}:host[color=success][mode=solid].selected{color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=outline]{color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=outline]:focus:not([disabled]),:host[color=success][mode=outline]:hover:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=outline]:active:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=ghost]{color:#33cc58;background-color:transparent;border:1px solid transparent}:host[color=success][mode=ghost]:focus:not([disabled]),:host[color=success][mode=ghost]:hover:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=ghost]:active:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=link]{color:#33cc58;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=success][mode=link]:focus:not([disabled]),:host[color=success][mode=link]:hover:not([disabled]),:host[color=success][mode=link]:active:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[size=small]{height:20px;padding:3px 7px;font-size:var(--lxFontSmallSize, 12px);min-width:20px}:host[size=small]:not(.withIcon){line-height:12px}:host[size=small].square{width:20px;text-align:center;padding:0}:host[size=small].circle{border-radius:10px;min-width:20px;padding:0 3px}:host[size=small].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=medium]{height:24px;padding:3px 7px;font-size:var(--lxFontSize, 14px);min-width:24px}:host[size=medium]:not(.withIcon){line-height:16px}:host[size=medium].square{width:24px;text-align:center;padding:0}:host[size=medium].circle{border-radius:11px;min-width:24px;padding:0 3px}:host[size=medium].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=large]{height:32px;padding:7px 11px;font-size:var(--lxFontSize, 14px);min-width:32px}:host[size=large]:not(.withIcon){line-height:16px}:host[size=large].square{width:32px;text-align:center;padding:0}:host[size=large].circle{border-radius:15px;min-width:32px;padding:0 7px}:host[size=large].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=auto]{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto]:not(.withIcon){line-height:normal}:host[size=auto].square{width:auto;text-align:center;padding:0}:host[size=auto].circle{border-radius:unset;min-width:auto;padding:0}:host[size=auto].circle{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto].circle:not(.withIcon){line-height:normal}:host[size=auto].circle.square{width:auto;text-align:center;padding:0}:host[size=auto].circle.circle{border-radius:10px;min-width:auto;padding:0}:host.loading:not(.withIcon){position:relative;opacity:.5;color:transparent!important}:host.loading:not(.withIcon) lx-tiny-spinner{position:absolute;left:calc(50% - .5em)}\n"] }]
|
|
553
|
+
args: [{ selector: 'button[lx-button]', changeDetection: ChangeDetectionStrategy.OnPush, imports: [TinySpinnerComponent, IconComponent$1, NgTemplateOutlet], template: "@let useNewIcons = useSAPIcons();\n@let startIcon = iconName();\n@let endIcon = endIconName();\n@if (!startIcon && !endIcon) {\n <!-- old layout -->\n @if (showSpinner) {\n <lx-tiny-spinner />\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n} @else {\n <div class=\"contentWrapper\">\n <!-- new layout -->\n @if (showSpinner) {\n <lx-tiny-spinner />\n } @else if (startIcon && useNewIcons) {\n <ui5-icon class=\"ui5Icon\" [name]=\"startIcon\" data-testid=\"start-icon\" />\n } @else if (startIcon && !useNewIcons) {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ startIcon }} {{ iconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"start-icon\"\n ></i>\n }\n <ng-container *ngTemplateOutlet=\"content\" />\n @if (!showSpinner && endIcon && useNewIcons) {\n <ui5-icon class=\"ui5Icon\" [name]=\"endIcon\" data-testid=\"end-icon\" />\n } @else if (!showSpinner && endIcon && !useNewIcons) {\n <i\n [class.fa-fw]=\"mode !== 'link'\"\n class=\"{{ endIcon }} {{ endIconVariant() }}\"\n role=\"img\"\n aria-hidden=\"true\"\n data-testid=\"end-icon\"\n ></i>\n }\n </div>\n}\n\n<!-- ng-content with the same slot can be used once in the same template -->\n<ng-template #content>\n <ng-content />\n</ng-template>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}:host ::ng-deep i{font-size:.9em}:host(.withIcon){line-height:normal}:host(.withIcon) .contentWrapper{display:flex;height:100%;align-items:center;justify-content:center;column-gap:4px}:host(.withIcon) [class*=fa-]{font-size:var(--lxFontSize, 14px)}:host(.withIcon)[mode=link] .contentWrapper{column-gap:6px}:host(.withIcon)[mode=link] i:before{display:inline-block}:host(.withIcon) .ui5Icon{width:var(--lxFontSmallSize);height:var(--lxFontSmallSize);color:inherit}:host(.withIcon).loading[color]{position:relative;color:transparent}:host(.withIcon).loading[color] lx-tiny-spinner{position:absolute;left:50%;transform:translate(-50%)}:host{border-radius:3px;font-weight:var(--lxFontNormal, 400);cursor:pointer;transition:color,background-color,border-color .18s;transition-delay:0s;transition-timing-function:ease}:host[disabled]{opacity:.5;cursor:default}:host[color=default] lx-tiny-spinner{color:#2a303d}:host[color=default][mode=solid]{color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=solid]:hover:not([disabled]),:host[color=default][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=default][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=default][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=outline]:focus:not([disabled]),:host[color=default][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=default][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=default][mode=ghost]:focus:not([disabled]),:host[color=default][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=default][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#f0f2f5;border:1px solid #f0f2f5}:host[color=default][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=default][mode=link]:focus:not([disabled]),:host[color=default][mode=link]:hover:not([disabled]),:host[color=default][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=light] lx-tiny-spinner{color:#2a303d}:host[color=light][mode=solid]{color:#2a303d;background-color:#fff;border:1px solid #99a5bb}:host[color=light][mode=solid]:hover:not([disabled]),:host[color=light][mode=solid]:focus:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=solid]:active:not([disabled]){color:#2a303d;background-color:#c2c9d6;border:1px solid #c2c9d6}:host[color=light][mode=solid].pressed{background-color:#c2c9d6!important;border-color:#c2c9d6!important}:host[color=light][mode=solid].selected{color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=outline]{color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=outline]:focus:not([disabled]),:host[color=light][mode=outline]:hover:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=outline]:active:not([disabled]){color:#2a303d;background-color:#e1e5eb;border:1px solid #e1e5eb}:host[color=light][mode=ghost]{color:#2a303d;background-color:transparent;border:1px solid transparent}:host[color=light][mode=ghost]:focus:not([disabled]),:host[color=light][mode=ghost]:hover:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid #e1e5eb}:host[color=light][mode=ghost]:active:not([disabled]){color:#2a303d;background-color:#fff;border:1px solid #fff}:host[color=light][mode=link]{color:#2a303d;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=light][mode=link]:focus:not([disabled]),:host[color=light][mode=link]:hover:not([disabled]),:host[color=light][mode=link]:active:not([disabled]){color:#2a303d;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=primary] lx-tiny-spinner{color:var(--lx-primarybutton-fontcolor)}:host[color=primary][mode=solid]{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=solid]:hover:not([disabled]),:host[color=primary][mode=solid]:focus:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=solid]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcoloractive);border:1px solid var(--lx-primarybutton-backgroundcoloractive)}:host[color=primary][mode=solid].pressed{background-color:var(--lx-primarybutton-backgroundcoloractive)!important;border-color:var(--lx-primarybutton-backgroundcoloractive)!important}:host[color=primary][mode=solid].selected{color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=outline]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline]:focus:not([disabled]),:host[color=primary][mode=outline]:hover:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=outline]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolorhover);border:1px solid var(--lx-primarybutton-backgroundcolorhover)}:host[color=primary][mode=ghost]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent}:host[color=primary][mode=ghost]:focus:not([disabled]),:host[color=primary][mode=ghost]:hover:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=ghost]:active:not([disabled]){color:var(--lx-primarybutton-fontcolor);background-color:var(--lx-primarybutton-backgroundcolor);border:1px solid var(--lx-primarybutton-backgroundcolor)}:host[color=primary][mode=link]{color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=primary][mode=link]:focus:not([disabled]),:host[color=primary][mode=link]:hover:not([disabled]),:host[color=primary][mode=link]:active:not([disabled]){color:var(--lx-primarybutton-backgroundcolor);background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=danger] lx-tiny-spinner{color:#fff}:host[color=danger][mode=solid]{color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=solid]:hover:not([disabled]),:host[color=danger][mode=solid]:focus:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=solid]:active:not([disabled]){color:#fff;background-color:#bd0707;border:1px solid rgb(188.6956521739,7.3043478261,7.3043478261)}:host[color=danger][mode=solid].pressed{background-color:#bd0707!important;border-color:#bd0707!important}:host[color=danger][mode=solid].selected{color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=outline]{color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=outline]:focus:not([disabled]),:host[color=danger][mode=outline]:hover:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=outline]:active:not([disabled]){color:#fff;background-color:#f61a1a;border:1px solid rgb(246.149068323,26.350931677,26.350931677)}:host[color=danger][mode=ghost]{color:#f96464;background-color:transparent;border:1px solid transparent}:host[color=danger][mode=ghost]:focus:not([disabled]),:host[color=danger][mode=ghost]:hover:not([disabled]){color:#f96464;background-color:transparent;border:1px solid #f96464}:host[color=danger][mode=ghost]:active:not([disabled]){color:#fff;background-color:#f96464;border:1px solid #f96464}:host[color=danger][mode=link]{color:#f96464;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=danger][mode=link]:focus:not([disabled]),:host[color=danger][mode=link]:hover:not([disabled]),:host[color=danger][mode=link]:active:not([disabled]){color:#f96464;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[color=success] lx-tiny-spinner{color:#fff}:host[color=success][mode=solid]{color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=solid]:hover:not([disabled]),:host[color=success][mode=solid]:focus:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=solid]:active:not([disabled]){color:#fff;background-color:#145223;border:1px solid rgb(20.4,81.6,35.2)}:host[color=success][mode=solid].pressed{background-color:#145223!important;border-color:#145223!important}:host[color=success][mode=solid].selected{color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=outline]{color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=outline]:focus:not([disabled]),:host[color=success][mode=outline]:hover:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=outline]:active:not([disabled]){color:#fff;background-color:#248f3e;border:1px solid rgb(35.7,142.8,61.6)}:host[color=success][mode=ghost]{color:#33cc58;background-color:transparent;border:1px solid transparent}:host[color=success][mode=ghost]:focus:not([disabled]),:host[color=success][mode=ghost]:hover:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid #33cc58}:host[color=success][mode=ghost]:active:not([disabled]){color:#fff;background-color:#33cc58;border:1px solid #33cc58}:host[color=success][mode=link]{color:#33cc58;background-color:transparent;border:1px solid transparent;padding:0;border:none}:host[color=success][mode=link]:focus:not([disabled]),:host[color=success][mode=link]:hover:not([disabled]),:host[color=success][mode=link]:active:not([disabled]){color:#33cc58;background-color:transparent;border:1px solid transparent;text-decoration:underline;border:none}:host[size=small]{height:20px;padding:3px 7px;font-size:var(--lxFontSmallSize, 12px);min-width:20px}:host[size=small]:not(.withIcon){line-height:12px}:host[size=small].square{width:20px;text-align:center;padding:0}:host[size=small].circle{border-radius:10px;min-width:20px;padding:0 3px}:host[size=small].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=medium]{height:24px;padding:3px 7px;font-size:var(--lxFontSize, 14px);min-width:24px}:host[size=medium]:not(.withIcon){line-height:16px}:host[size=medium].square{width:24px;text-align:center;padding:0}:host[size=medium].circle{border-radius:11px;min-width:24px;padding:0 3px}:host[size=medium].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=large]{height:32px;padding:7px 11px;font-size:var(--lxFontSize, 14px);min-width:32px}:host[size=large]:not(.withIcon){line-height:16px}:host[size=large].square{width:32px;text-align:center;padding:0}:host[size=large].circle{border-radius:15px;min-width:32px;padding:0 7px}:host[size=large].withIcon:not(.square,.circle,[mode=link]){padding:0 8px}:host[size=auto]{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto]:not(.withIcon){line-height:normal}:host[size=auto].square{width:auto;text-align:center;padding:0}:host[size=auto].circle{border-radius:unset;min-width:auto;padding:0}:host[size=auto].circle{height:auto;padding:0;font-size:inherit;min-width:auto}:host[size=auto].circle:not(.withIcon){line-height:normal}:host[size=auto].circle.square{width:auto;text-align:center;padding:0}:host[size=auto].circle.circle{border-radius:10px;min-width:auto;padding:0}:host.loading:not(.withIcon){position:relative;opacity:.5;color:transparent!important}:host.loading:not(.withIcon) lx-tiny-spinner{position:absolute;left:calc(50% - .5em)}\n"] }]
|
|
554
554
|
}], propDecorators: { size: [{
|
|
555
555
|
type: Input
|
|
556
556
|
}, {
|
|
@@ -635,7 +635,7 @@ class CardComponent {
|
|
|
635
635
|
}
|
|
636
636
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CardComponent, decorators: [{
|
|
637
637
|
type: Component,
|
|
638
|
-
args: [{ selector: 'lx-card',
|
|
638
|
+
args: [{ selector: 'lx-card', template: "<ng-content />\n", styles: [":host{display:block;border-radius:2px;padding:12px}:host[data-style=white]{color:#526179;background-color:#fff;box-shadow:0 1px 3px #0003}\n"] }]
|
|
639
639
|
}], propDecorators: { dataStyle: [{
|
|
640
640
|
type: Input
|
|
641
641
|
}, {
|
|
@@ -671,7 +671,7 @@ class CollapsibleComponent {
|
|
|
671
671
|
}
|
|
672
672
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CollapsibleComponent, decorators: [{
|
|
673
673
|
type: Component,
|
|
674
|
-
args: [{ selector: 'lx-collapsible', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
674
|
+
args: [{ selector: 'lx-collapsible', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ButtonComponent], template: "@if (!hideSectionToggle) {\n <button\n lx-button\n mode=\"link\"\n [title]=\"toggleTitle\"\n [size]=\"toggleSize\"\n class=\"sectionToggle\"\n [class.collapsed]=\"collapsed\"\n type=\"button\"\n [disabled]=\"disableSectionToggle\"\n [square]=\"true\"\n icon=\"fa-angle-down\"\n (click)=\"onToggleSection($event)\"\n ></button>\n}\n<div class=\"collapsible-title\">\n <ng-content />\n</div>\n", styles: [":host{position:relative;cursor:pointer;display:flex;border-bottom:1px solid #e1e5eb;margin-bottom:4px}:host.notClickable{cursor:default}.sectionToggle{font-size:18px;width:32px;align-self:center;transition:transform .2s linear}.sectionToggle.collapsed{transform:rotate(-90deg)}.collapsible-title{width:100%;align-self:center}:host(.align-left) .sectionToggle{text-align:left;width:24px}:host-context(lx-fact-sheet-section.transformationsRedesign){border-bottom-color:#c2c9d6;padding-bottom:8px}:host-context(lx-fact-sheet-section.transformationsRedesign) .sectionToggle{font-size:var(--lxFontLargeSize, 16px);width:20px;height:20px;min-width:20px;text-align:left}\n"] }]
|
|
675
675
|
}], propDecorators: { disableSectionToggle: [{
|
|
676
676
|
type: Input
|
|
677
677
|
}], hideSectionToggle: [{
|
|
@@ -710,7 +710,7 @@ class CounterComponent {
|
|
|
710
710
|
}
|
|
711
711
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CounterComponent, decorators: [{
|
|
712
712
|
type: Component,
|
|
713
|
-
args: [{ selector: 'lx-counter',
|
|
713
|
+
args: [{ selector: 'lx-counter', imports: [NgClass], template: "<span class=\"content\" [ngClass]=\"classes\">{{ content }}</span>\n", styles: [":host{display:inline-block}.content{display:inline-block;text-align:center;font-weight:var(--lxFontBold, 700)}.default{min-width:20px;line-height:20px;padding:0 6px;font-size:var(--lxFontSmallSize, 12px);border-radius:10px}.small{min-width:16px;line-height:16px;padding:0 4px;font-size:var(--lxFontSmallSize, 12px);border-radius:8px}.primary{background-color:var(--lx-primarybutton-backgroundcolor);color:var(--lx-primarybutton-fontcolor)}.gray{background-color:#f0f2f5;color:#2a303d;font-weight:400}.darkgray{background-color:#2a303d;color:#fff}.green{background-color:#33cc58;color:#fff}.red{background-color:#f96464;color:#fff}.yellow{background-color:#ffb62a;color:#fff}\n"] }]
|
|
714
714
|
}], propDecorators: { content: [{
|
|
715
715
|
type: Input
|
|
716
716
|
}], size: [{
|
|
@@ -982,7 +982,7 @@ __decorate([
|
|
|
982
982
|
], EllipsisComponent.prototype, "content$", void 0);
|
|
983
983
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: EllipsisComponent, decorators: [{
|
|
984
984
|
type: Component,
|
|
985
|
-
args: [{ selector: 'lx-ellipsis', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
985
|
+
args: [{ selector: 'lx-ellipsis', changeDetection: ChangeDetectionStrategy.OnPush, imports: [ButtonComponent, AsyncPipe], template: "<span\n #contentEl\n [class.showMore]=\"isShowingMore$ | async\"\n class=\"content truncate lx-margin-right\"\n [innerHtml]=\"sanitizedContent$ | async\"\n></span>\n@if (showButton$ | async) {\n <button (click)=\"onShowMoreToggle()\" lx-button #showMoreButton size=\"auto\" mode=\"link\" color=\"primary\">\n {{ showMoreButtonLabel$ | async }}\n </button>\n}\n", styles: [":host{display:block;white-space:pre-line;overflow-wrap:break-word}.content{display:inline-block;word-break:break-word}.truncate:not(.showMore){width:calc(100% - 140px);white-space:nowrap;overflow-wrap:normal;overflow:hidden;text-overflow:ellipsis}.content.showMore+button{margin-top:4px;display:block}button{white-space:nowrap;vertical-align:top}\n"] }]
|
|
986
986
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
987
987
|
type: Inject,
|
|
988
988
|
args: [LX_ELLIPSIS_DEBOUNCE_ON_RESIZE]
|
|
@@ -1022,7 +1022,7 @@ class EmptyStateComponent {
|
|
|
1022
1022
|
}
|
|
1023
1023
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: EmptyStateComponent, decorators: [{
|
|
1024
1024
|
type: Component,
|
|
1025
|
-
args: [{ selector: 'lx-empty-state',
|
|
1025
|
+
args: [{ selector: 'lx-empty-state', imports: [ButtonComponent, RouterLink], template: "<div class=\"tw-max-w-[434px] tw-text-center\">\n @if (icon()) {\n <i class=\"emptyStateIcon fas tw-text-primary\" [class]=\"'fa-' + icon()\" aria-hidden=\"true\"></i>\n }\n\n <h3 class=\"empty-state-title tw-mb-m tw-mt-xl tw-text-black\" [innerHTML]=\"title()\"></h3>\n\n <div class=\"empty-state-content tw-leading-[16px] tw-text-gray-50\">\n <ng-content />\n </div>\n\n <div class=\"tw-flex tw-justify-center tw-gap-m\">\n @if (secondaryButtonLabel()) {\n <div class=\"secondaryButton tw-my-xl\">\n <button lx-button size=\"large\" [showSpinner]=\"loading()\" (click)=\"secondaryButtonClicked.emit($event)\">\n {{ secondaryButtonLabel() }}\n </button>\n </div>\n }\n\n @if (buttonLabel()) {\n <div class=\"actionButton tw-my-xl\">\n <button lx-button size=\"large\" color=\"primary\" [showSpinner]=\"loading()\" (click)=\"buttonClicked.emit($event)\">\n {{ buttonLabel() }}\n </button>\n </div>\n }\n </div>\n\n @if (moreLinkLabel() && moreLink()) {\n <div>\n @if (useRouterLink()) {\n <a\n rel=\"noopener noreferrer\"\n class=\"tw-text-size-md tw-text-primary\"\n [routerLink]=\"moreLink()\"\n (click)=\"moreLinkClicked.emit($event)\"\n [target]=\"openMoreLinkInNewTab() ? '_blank' : '_self'\"\n >{{ moreLinkLabel() }}</a\n >\n } @else {\n <a\n rel=\"noopener noreferrer\"\n class=\"tw-text-size-md tw-text-primary\"\n [href]=\"moreLink()\"\n (click)=\"moreLinkClicked.emit($event)\"\n [target]=\"openMoreLinkInNewTab() ? '_blank' : '_self'\"\n >{{ moreLinkLabel() }}</a\n >\n }\n </div>\n }\n</div>\n", styles: [":host{display:flex;justify-content:center}:host .emptyStateIcon{font-size:var(--lxFontHeader1Size, 32px)}:host[size=small] .empty-state-title{font-size:var(--lxFontSize, 14px)}:host[size=small] .empty-state-content{font-size:var(--lxFontSmallSize, 12px)}:host[size=medium] .empty-state-title{font-size:var(--lxFontHeader2Size, 24px)}:host[size=medium] .empty-state-content{font-size:var(--lxFontSize, 14px)}i{position:relative}i:after{content:\"\";position:absolute;bottom:-8px;left:50%;transform:translate(-50%);height:6px;width:44px;background-color:#f0f2f5;border-radius:100%}\n"] }]
|
|
1026
1026
|
}], propDecorators: { _size: [{
|
|
1027
1027
|
type: HostBinding,
|
|
1028
1028
|
args: ['attr.size']
|
|
@@ -1058,7 +1058,7 @@ class IconScaleComponent {
|
|
|
1058
1058
|
}
|
|
1059
1059
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: IconScaleComponent, decorators: [{
|
|
1060
1060
|
type: Component,
|
|
1061
|
-
args: [{ selector: 'lx-icon-scale', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1061
|
+
args: [{ selector: 'lx-icon-scale', changeDetection: ChangeDetectionStrategy.OnPush, template: "@for (isColored of iconArray; track $index) {\n <span data-testid=\"icon-scale\" class=\"iconElement fas fa-{{ icon.type }}\" [style.color]=\"isColored ? icon.color : null\"> </span>\n}\n", styles: [".iconElement{color:#c2c9d6;width:15px}\n"] }]
|
|
1062
1062
|
}], propDecorators: { icon: [{
|
|
1063
1063
|
type: Input
|
|
1064
1064
|
}], numberOfColoredItems: [{
|
|
@@ -1083,7 +1083,7 @@ class SpinnerComponent {
|
|
|
1083
1083
|
}
|
|
1084
1084
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: SpinnerComponent, decorators: [{
|
|
1085
1085
|
type: Component,
|
|
1086
|
-
args: [{ selector: 'lx-spinner',
|
|
1086
|
+
args: [{ selector: 'lx-spinner', template: "<div class=\"container\">\n <div class=\"middle\">\n <div class=\"center\">\n <div class=\"spinner\">\n <div class=\"rect1\"></div>\n <div class=\"rect2\"></div>\n <div class=\"rect3\"></div>\n <div class=\"rect4\"></div>\n <div class=\"rect5\"></div>\n </div>\n <ng-content />\n </div>\n </div>\n</div>\n", styles: [":host{font-size:2rem}:host(.fullSpace){position:absolute;inset:0;z-index:1000}:host(.fullSpaceFixed){position:fixed;inset:0;z-index:1000}.container{display:table;height:100%;width:100%}.middle{display:table-cell;vertical-align:middle}.center{text-align:center}:host(.fadeBackground),:host(.fadeBackgroundFromInput){background-color:#fff9}.spinner{margin:0 auto;width:55px;height:25px;text-align:center;font-size:11.25px}.spinner>div{height:100%;width:6px;background-color:#0070f2;display:inline-block;margin:0 1px;animation:sk-stretchdelay 1.2s infinite ease-in-out}.spinner .rect2{animation-delay:-1.1s}.spinner .rect3{animation-delay:-1s}.spinner .rect4{animation-delay:-.9s}.spinner .rect5{animation-delay:-.8s}@-webkit-keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}@-moz-keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}@-ms-keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}@-o-keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}@keyframes sk-stretchdelay{0%,40%,to{transform:scaleY(.4)}20%{transform:scaleY(1)}}\n"] }]
|
|
1087
1087
|
}], propDecorators: { fadeBackground: [{
|
|
1088
1088
|
type: HostBinding,
|
|
1089
1089
|
args: ['class.fadeBackgroundFromInput']
|
|
@@ -1152,7 +1152,7 @@ class StepperComponent extends CdkStepper {
|
|
|
1152
1152
|
}
|
|
1153
1153
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: StepperComponent, decorators: [{
|
|
1154
1154
|
type: Component,
|
|
1155
|
-
args: [{ selector: 'lx-stepper',
|
|
1155
|
+
args: [{ selector: 'lx-stepper', imports: [CdkStepperModule, NgTemplateOutlet, NgClass], providers: [{ provide: CdkStepper, useExisting: StepperComponent }], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ul class=\"stepper\">\n @for (step of steps; track step.label; let i = $index) {\n <li class=\"step\" [ngClass]=\"{ 'step-completed': isCompleted(i) }\">\n <div\n class=\"step-container\"\n [class]=\"isSmallVariant ? 'step-container-small' : 'step-container-normal'\"\n [ngClass]=\"{ 'step-container-active': isActiveStep(i), 'step-container-completed': isCompleted(i) }\"\n >\n <div class=\"step-number\" [ngClass]=\"{ 'step-number-active': isActiveStep(i) }\">\n @if (isCompleted(i)) {\n <i [class]=\"'far fa-check check-icon'\" [ngClass]=\"{ 'small-icon': isSmallVariant }\"></i>\n } @else if (!isSmallVariant) {\n {{ i + 1 }}\n }\n </div>\n @if (!isSmallVariant) {\n <div class=\"step-title\">\n {{ step.label }}\n </div>\n }\n </div>\n </li>\n }\n</ul>\n@if (selected) {\n <div class=\"content\">\n <ng-container [ngTemplateOutlet]=\"selected!.content\" />\n </div>\n}\n", styles: [".stepper{display:flex;position:relative;align-items:center;padding-left:0}.step{position:relative;z-index:1;flex:1;display:flex;flex-direction:row;flex-shrink:0}.step:not(:last-child):after{content:\"\";position:relative;z-index:1;flex:auto;height:1px;min-width:30px;border-top:2px solid #b2bccc;align-self:center;margin-left:5px;margin-right:5px}.step-container{display:flex;flex-direction:column;justify-content:space-between;flex-shrink:0;border:2px solid #b2bccc;border-radius:50%;background-color:#fff;pointer-events:none}.step-container-normal{width:40px;height:40px}.step-container-small{width:22.5px;height:22.5px}.step-number{color:#b2bccc;font-size:15.5px;font-style:normal;font-weight:var(--lxFontNormal, 400);line-height:20px;width:100%;height:100%;padding-top:8px;text-align:center}.step-container-small .step-number{padding-top:0}.step-title{width:max-content;top:50px;position:absolute}.check-icon{font-size:20px;color:#0070f2}.small-icon{position:relative;font-size:var(--lxFontSmallSize, 12px)}@supports (-moz-appearance: none){.small-icon{top:-1px}}.content{margin-top:48px;height:100%}.step:first-child{justify-content:flex-start}.step:first-child .step-title{left:0}.step:not(:first-child):not(:last-child) .step-container{align-self:center}.step:not(:first-child):not(:last-child) .step-container .step-title{align-self:center}.step:last-child{justify-content:flex-end;align-items:flex-end;text-align:right;flex:0 0 auto}.step:last-child .step-container .step-title{align-self:flex-end;right:0}.step:last-child .step-number{margin-right:40%}.step:nth-child(n+19):last-child .step-number{margin-right:31%}.step-container.step-container-active{background-color:#0070f2;border-color:#0070f2}.step-number-active{color:#fff}.step.step-completed:not(:last-child):after{border-color:#0070f2}.step-container.step-container-completed{border-color:#0070f2}\n"] }]
|
|
1156
1156
|
}], ctorParameters: () => [{ type: i1$1.Directionality }, { type: i0.ChangeDetectorRef }, { type: i0.ElementRef }] });
|
|
1157
1157
|
|
|
1158
1158
|
/**
|
|
@@ -1225,8 +1225,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
1225
1225
|
selector: 'table[lx-table]',
|
|
1226
1226
|
host: {
|
|
1227
1227
|
class: 'table table-hover'
|
|
1228
|
-
}
|
|
1229
|
-
standalone: true
|
|
1228
|
+
}
|
|
1230
1229
|
}]
|
|
1231
1230
|
}] });
|
|
1232
1231
|
|
|
@@ -1316,7 +1315,7 @@ class TableHeaderComponent {
|
|
|
1316
1315
|
}
|
|
1317
1316
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TableHeaderComponent, decorators: [{
|
|
1318
1317
|
type: Component,
|
|
1319
|
-
args: [{ selector: 'lx-th', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
1318
|
+
args: [{ selector: 'lx-th', changeDetection: ChangeDetectionStrategy.OnPush, host: {
|
|
1320
1319
|
'[class.sortable]': 'sortable()',
|
|
1321
1320
|
'[tabIndex]': 'sortable() ? 0 : -1',
|
|
1322
1321
|
role: 'columnheader'
|
|
@@ -1375,8 +1374,7 @@ class AfterViewInitDirective {
|
|
|
1375
1374
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AfterViewInitDirective, decorators: [{
|
|
1376
1375
|
type: Directive,
|
|
1377
1376
|
args: [{
|
|
1378
|
-
selector: '[lxAfterViewInit]'
|
|
1379
|
-
standalone: true
|
|
1377
|
+
selector: '[lxAfterViewInit]'
|
|
1380
1378
|
}]
|
|
1381
1379
|
}], propDecorators: { lxAfterViewInit: [{
|
|
1382
1380
|
type: Output
|
|
@@ -1448,8 +1446,7 @@ class AutocloseDirective {
|
|
|
1448
1446
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AutocloseDirective, decorators: [{
|
|
1449
1447
|
type: Directive,
|
|
1450
1448
|
args: [{
|
|
1451
|
-
selector: '[lxAutoclose]'
|
|
1452
|
-
standalone: true
|
|
1449
|
+
selector: '[lxAutoclose]'
|
|
1453
1450
|
}]
|
|
1454
1451
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: AutocloseGroupService }], propDecorators: { autoclose: [{
|
|
1455
1452
|
type: Output
|
|
@@ -1480,8 +1477,7 @@ class AutofocusDirective {
|
|
|
1480
1477
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AutofocusDirective, decorators: [{
|
|
1481
1478
|
type: Directive,
|
|
1482
1479
|
args: [{
|
|
1483
|
-
selector: '[lxAutofocus]'
|
|
1484
|
-
standalone: true
|
|
1480
|
+
selector: '[lxAutofocus]'
|
|
1485
1481
|
}]
|
|
1486
1482
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.NgZone }], propDecorators: { lxAutofocus: [{
|
|
1487
1483
|
type: Input
|
|
@@ -1630,8 +1626,7 @@ class LxLinkifyPipe {
|
|
|
1630
1626
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: LxLinkifyPipe, decorators: [{
|
|
1631
1627
|
type: Pipe,
|
|
1632
1628
|
args: [{
|
|
1633
|
-
name: 'lxLinkify'
|
|
1634
|
-
standalone: true
|
|
1629
|
+
name: 'lxLinkify'
|
|
1635
1630
|
}]
|
|
1636
1631
|
}] });
|
|
1637
1632
|
|
|
@@ -1678,8 +1673,7 @@ class LxUnlinkifyPipe {
|
|
|
1678
1673
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: LxUnlinkifyPipe, decorators: [{
|
|
1679
1674
|
type: Pipe,
|
|
1680
1675
|
args: [{
|
|
1681
|
-
name: 'lxUnlinkify'
|
|
1682
|
-
standalone: true
|
|
1676
|
+
name: 'lxUnlinkify'
|
|
1683
1677
|
}]
|
|
1684
1678
|
}] });
|
|
1685
1679
|
|
|
@@ -1699,8 +1693,7 @@ class BrPipe {
|
|
|
1699
1693
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: BrPipe, decorators: [{
|
|
1700
1694
|
type: Pipe,
|
|
1701
1695
|
args: [{
|
|
1702
|
-
name: 'lxBr'
|
|
1703
|
-
standalone: true
|
|
1696
|
+
name: 'lxBr'
|
|
1704
1697
|
}]
|
|
1705
1698
|
}] });
|
|
1706
1699
|
|
|
@@ -1768,8 +1761,7 @@ class ContrastColorPipe {
|
|
|
1768
1761
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ContrastColorPipe, decorators: [{
|
|
1769
1762
|
type: Pipe,
|
|
1770
1763
|
args: [{
|
|
1771
|
-
name: 'lxContrastColor'
|
|
1772
|
-
standalone: true
|
|
1764
|
+
name: 'lxContrastColor'
|
|
1773
1765
|
}]
|
|
1774
1766
|
}] });
|
|
1775
1767
|
|
|
@@ -1787,8 +1779,7 @@ class CustomDatePipe {
|
|
|
1787
1779
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CustomDatePipe, decorators: [{
|
|
1788
1780
|
type: Pipe,
|
|
1789
1781
|
args: [{
|
|
1790
|
-
name: 'lxDate'
|
|
1791
|
-
standalone: true
|
|
1782
|
+
name: 'lxDate'
|
|
1792
1783
|
}]
|
|
1793
1784
|
}], ctorParameters: () => [{ type: Function, decorators: [{
|
|
1794
1785
|
type: Optional
|
|
@@ -1818,8 +1809,7 @@ class HighlightRangePipe {
|
|
|
1818
1809
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: HighlightRangePipe, decorators: [{
|
|
1819
1810
|
type: Pipe,
|
|
1820
1811
|
args: [{
|
|
1821
|
-
name: 'lxHighlightRange'
|
|
1822
|
-
standalone: true
|
|
1812
|
+
name: 'lxHighlightRange'
|
|
1823
1813
|
}]
|
|
1824
1814
|
}] });
|
|
1825
1815
|
|
|
@@ -1872,8 +1862,7 @@ class HighlightTermPipe {
|
|
|
1872
1862
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: HighlightTermPipe, decorators: [{
|
|
1873
1863
|
type: Pipe,
|
|
1874
1864
|
args: [{
|
|
1875
|
-
name: 'lxHighlightTerm'
|
|
1876
|
-
standalone: true
|
|
1865
|
+
name: 'lxHighlightTerm'
|
|
1877
1866
|
}]
|
|
1878
1867
|
}] });
|
|
1879
1868
|
|
|
@@ -1892,8 +1881,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
1892
1881
|
type: Pipe,
|
|
1893
1882
|
args: [{
|
|
1894
1883
|
name: 'lxIsUuid',
|
|
1895
|
-
pure: true
|
|
1896
|
-
standalone: true
|
|
1884
|
+
pure: true
|
|
1897
1885
|
}]
|
|
1898
1886
|
}] });
|
|
1899
1887
|
|
|
@@ -1912,8 +1900,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
1912
1900
|
type: Pipe,
|
|
1913
1901
|
args: [{
|
|
1914
1902
|
name: 'lxTimeAgo',
|
|
1915
|
-
pure: true
|
|
1916
|
-
standalone: true
|
|
1903
|
+
pure: true
|
|
1917
1904
|
}]
|
|
1918
1905
|
}], ctorParameters: () => [{ type: Function, decorators: [{
|
|
1919
1906
|
type: Optional
|
|
@@ -1956,8 +1943,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
1956
1943
|
type: Pipe,
|
|
1957
1944
|
args: [{
|
|
1958
1945
|
name: 'lxTranslate',
|
|
1959
|
-
pure: false
|
|
1960
|
-
standalone: true
|
|
1946
|
+
pure: false
|
|
1961
1947
|
}]
|
|
1962
1948
|
}], ctorParameters: () => [{ type: i1.TranslateService }, { type: i0.ChangeDetectorRef }, { type: undefined, decorators: [{
|
|
1963
1949
|
type: Optional
|
|
@@ -1989,8 +1975,7 @@ class MarkdownPipe {
|
|
|
1989
1975
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: MarkdownPipe, decorators: [{
|
|
1990
1976
|
type: Pipe,
|
|
1991
1977
|
args: [{
|
|
1992
|
-
name: 'lxMarkdown'
|
|
1993
|
-
standalone: true
|
|
1978
|
+
name: 'lxMarkdown'
|
|
1994
1979
|
}]
|
|
1995
1980
|
}], ctorParameters: () => [] });
|
|
1996
1981
|
|
|
@@ -2004,8 +1989,7 @@ class NbspPipe {
|
|
|
2004
1989
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: NbspPipe, decorators: [{
|
|
2005
1990
|
type: Pipe,
|
|
2006
1991
|
args: [{
|
|
2007
|
-
name: 'lxNbsp'
|
|
2008
|
-
standalone: true
|
|
1992
|
+
name: 'lxNbsp'
|
|
2009
1993
|
}]
|
|
2010
1994
|
}] });
|
|
2011
1995
|
|
|
@@ -2027,8 +2011,7 @@ class SortPipe {
|
|
|
2027
2011
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: SortPipe, decorators: [{
|
|
2028
2012
|
type: Pipe,
|
|
2029
2013
|
args: [{
|
|
2030
|
-
name: 'lxSort'
|
|
2031
|
-
standalone: true
|
|
2014
|
+
name: 'lxSort'
|
|
2032
2015
|
}]
|
|
2033
2016
|
}] });
|
|
2034
2017
|
function applySorting(options, items) {
|
|
@@ -2106,8 +2089,7 @@ class TranslationBeforePipe {
|
|
|
2106
2089
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TranslationBeforePipe, decorators: [{
|
|
2107
2090
|
type: Pipe,
|
|
2108
2091
|
args: [{
|
|
2109
|
-
name: 'lxTranslationBefore'
|
|
2110
|
-
standalone: true
|
|
2092
|
+
name: 'lxTranslationBefore'
|
|
2111
2093
|
}]
|
|
2112
2094
|
}], ctorParameters: () => [{ type: i1.TranslateService }] });
|
|
2113
2095
|
|
|
@@ -2131,8 +2113,7 @@ class TranslationAfterPipe {
|
|
|
2131
2113
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TranslationAfterPipe, decorators: [{
|
|
2132
2114
|
type: Pipe,
|
|
2133
2115
|
args: [{
|
|
2134
|
-
name: 'lxTranslationAfter'
|
|
2135
|
-
standalone: true
|
|
2116
|
+
name: 'lxTranslationAfter'
|
|
2136
2117
|
}]
|
|
2137
2118
|
}], ctorParameters: () => [{ type: i1.TranslateService }] });
|
|
2138
2119
|
|
|
@@ -2195,8 +2176,7 @@ class TranslationBetweenPipe {
|
|
|
2195
2176
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TranslationBetweenPipe, decorators: [{
|
|
2196
2177
|
type: Pipe,
|
|
2197
2178
|
args: [{
|
|
2198
|
-
name: 'lxTranslationBetween'
|
|
2199
|
-
standalone: true
|
|
2179
|
+
name: 'lxTranslationBetween'
|
|
2200
2180
|
}]
|
|
2201
2181
|
}], ctorParameters: () => [{ type: i1.TranslateService }] });
|
|
2202
2182
|
|
|
@@ -2210,8 +2190,7 @@ class UnescapeCurlyBracesPipe {
|
|
|
2210
2190
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: UnescapeCurlyBracesPipe, decorators: [{
|
|
2211
2191
|
type: Pipe,
|
|
2212
2192
|
args: [{
|
|
2213
|
-
name: 'lxUnescapeCurlyBraces'
|
|
2214
|
-
standalone: true
|
|
2193
|
+
name: 'lxUnescapeCurlyBraces'
|
|
2215
2194
|
}]
|
|
2216
2195
|
}] });
|
|
2217
2196
|
|
|
@@ -2310,7 +2289,7 @@ class TooltipComponent {
|
|
|
2310
2289
|
}
|
|
2311
2290
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TooltipComponent, decorators: [{
|
|
2312
2291
|
type: Component,
|
|
2313
|
-
args: [{ selector: 'lx-tooltip',
|
|
2292
|
+
args: [{ selector: 'lx-tooltip', host: { role: 'tooltip' }, template: "@if (!isHtmlContent) {\n <div [class]=\"'x-' + position.x + ' y-' + position.y\">{{ content }}</div>\n} @else {\n <div [innerHtml]=\"content\" [class]=\"'x-' + position.x + ' y-' + position.y\"></div>\n}\n", styles: [":host{display:block;position:relative;margin:5px}div{background-color:#292929;color:#fff;border:0 solid transparent;border-radius:5px;opacity:1;font-size:var(--lxFontSmallSize, 12px);font-weight:var(--lxFontNormal, 400);text-shadow:0 1px black;text-align:left;word-wrap:break-word;line-height:16px;max-width:280px;min-width:50px;padding:6px 10px;overflow:hidden}.y-bottom:after,.y-top:after,.x-left:after,.x-right:after{content:\" \";position:absolute;border-width:5px;border-style:solid;border-color:#292929 transparent transparent transparent}.y-top:after{top:100%;margin-left:-5px}.y-bottom:after{top:0;margin-left:-5px;transform-origin:center top;transform:rotate(180deg)}.y-center:after{top:50%;margin-left:-5px;margin-top:-10px}.y-top.x-center:after,.y-bottom.x-center:after{left:50%}.y-top.x-left:after,.y-bottom.x-left:after{right:10px}.y-top.x-right:after,.y-bottom.x-right:after{left:10px}.y-center.x-right:after{left:0;transform-origin:left center;transform:rotate(90deg)}.y-center.x-left:after{left:100%;transform-origin:right center;transform:rotate(-90deg)}\n"] }]
|
|
2314
2293
|
}], propDecorators: { content: [{
|
|
2315
2294
|
type: Input
|
|
2316
2295
|
}], isHtmlContent: [{
|
|
@@ -2399,8 +2378,7 @@ class TooltipDirective {
|
|
|
2399
2378
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TooltipDirective, decorators: [{
|
|
2400
2379
|
type: Directive,
|
|
2401
2380
|
args: [{
|
|
2402
|
-
selector: '[lxTooltip]'
|
|
2403
|
-
standalone: true
|
|
2381
|
+
selector: '[lxTooltip]'
|
|
2404
2382
|
}]
|
|
2405
2383
|
}], ctorParameters: () => [{ type: i1$2.OverlayPositionBuilder }, { type: i0.ElementRef }, { type: i1$2.Overlay }, { type: i2.AriaDescriber }], propDecorators: { content: [{
|
|
2406
2384
|
type: Input,
|
|
@@ -2617,8 +2595,7 @@ class DisplayAvatarsPipe {
|
|
|
2617
2595
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DisplayAvatarsPipe, decorators: [{
|
|
2618
2596
|
type: Pipe,
|
|
2619
2597
|
args: [{
|
|
2620
|
-
name: 'displayAvatars'
|
|
2621
|
-
standalone: true
|
|
2598
|
+
name: 'displayAvatars'
|
|
2622
2599
|
}]
|
|
2623
2600
|
}] });
|
|
2624
2601
|
const SIZES = {
|
|
@@ -2682,7 +2659,7 @@ class AvatarComponent {
|
|
|
2682
2659
|
}
|
|
2683
2660
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AvatarComponent, decorators: [{
|
|
2684
2661
|
type: Component,
|
|
2685
|
-
args: [{ selector: 'lx-avatar',
|
|
2662
|
+
args: [{ selector: 'lx-avatar', imports: [NgIf, AsyncPipe, NgClass, TooltipDirective], template: "<ng-container *ngIf=\"imageURL | async; else loading\">\n <ng-container *ngIf=\"!user.technicalUser; else technicalUserIcon\">\n <a\n *ngIf=\"showMailToLink && user.email; else profilePicture\"\n class=\"userLink\"\n href=\"mailto:{{ user.email }}\"\n lxTooltip=\"{{ user.displayName }}\"\n >\n <img\n [src]=\"imageURL | async\"\n class=\"avatarImage\"\n [class]=\"size\"\n [class.disabled]=\"disabled\"\n role=\"presentation\"\n alt=\"{{ user.displayName }}\"\n />\n </a>\n <ng-template #profilePicture>\n <img\n [src]=\"imageURL | async\"\n class=\"avatarImage\"\n [class]=\"size\"\n [class.disabled]=\"disabled\"\n role=\"presentation\"\n alt=\"{{ user.displayName }}\"\n />\n </ng-template>\n </ng-container>\n <ng-template #technicalUserIcon>\n <i class=\"avatarImage fas fa-robot\" lxTooltip=\"{{ user.displayName }}\" [class]=\"size\" [class.disabled]=\"disabled\"></i>\n </ng-template>\n</ng-container>\n<ng-template #loading>\n <div class=\"avatarImage userLink loading\" [ngClass]=\"size\"></div>\n</ng-template>\n", styles: [".userLink{display:inline-block;width:fit-content;height:fit-content}.avatarImage{border-radius:50%}.avatarImage.disabled{opacity:.4}.loading{background:linear-gradient(270deg,#ccc,#eee,#ccc);background-size:200% 100%;animation:loading 1.5s infinite;object-fit:cover;vertical-align:middle}@keyframes loading{0%{background-position:200% 0}to{background-position:-200% 0}}.fa-robot{background-color:#b2bccc;color:#fff;vertical-align:middle;text-align:center}.fa-robot.XS{line-height:14px;font-size:10px}.fa-robot.S{line-height:22px;font-size:13px}.fa-robot.M{line-height:30px;font-size:18px}.fa-robot.L{line-height:38px;font-size:22px}.fa-robot.XL{line-height:62px;font-size:40px}.XS{width:16px;max-width:16px;height:16px;max-height:16px}.S{width:24px;max-width:24px;height:24px;max-height:24px}.M{width:32px;max-width:32px;height:32px;max-height:32px}.L{width:40px;max-width:40px;height:40px;max-height:40px}.XL{width:64px;max-width:64px;height:64px;max-height:64px}\n"] }]
|
|
2686
2663
|
}], ctorParameters: () => [{ type: undefined, decorators: [{
|
|
2687
2664
|
type: Inject,
|
|
2688
2665
|
args: [IMAGE_READER]
|
|
@@ -2745,7 +2722,7 @@ class AvatarGroupComponent {
|
|
|
2745
2722
|
}
|
|
2746
2723
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: AvatarGroupComponent, decorators: [{
|
|
2747
2724
|
type: Component,
|
|
2748
|
-
args: [{ selector: 'lx-avatar-group',
|
|
2725
|
+
args: [{ selector: 'lx-avatar-group', imports: [CdkOverlayOrigin, TooltipDirective, AvatarComponent, CdkConnectedOverlay, DisplayAvatarsPipe], template: "<div\n #userGroup\n (click)=\"handleClick($event)\"\n (keydown.enter)=\"handleClick($event)\"\n (keydown.space)=\"handleClick($event)\"\n cdkOverlayOrigin\n #trigger=\"cdkOverlayOrigin\"\n [lxTooltip]=\"!overlayVisible ? userNames : null\"\n [lxTooltipIsHtmlContent]=\"true\"\n tabindex=\"0\"\n role=\"button\"\n aria-haspopup=\"dialog\"\n>\n @let filteredUsers = users | displayAvatars: type : size : userGroup.offsetWidth : autoScale : maxLength;\n @if (filteredUsers) {\n <div class=\"group-container\">\n @for (user of filteredUsers; track userTrackBy($index, user)) {\n <lx-avatar\n [user]=\"user\"\n [size]=\"size\"\n [showMailToLink]=\"false\"\n [disabled]=\"isUserDisabled(user)\"\n [class]=\"[type === 'individual' ? 'individual' : 'group', size]\"\n />\n }\n @if (filteredUsers.length < users.length) {\n <div [class]=\"[type === 'individual' ? 'individual' : 'group', size]\" class=\"more-users-icon\">\n +{{ users.length - filteredUsers.length }}\n </div>\n }\n </div>\n }\n</div>\n\n<ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"overlayVisible\"\n (overlayOutsideClick)=\"overlayVisible = false\"\n>\n <div class=\"avatars-overlay\">\n @if (title) {\n <div class=\"avatars-overlay-title\">{{ title }}</div>\n }\n <div class=\"avatars-list\">\n @for (user of users; track userTrackBy($index, user)) {\n <div class=\"individual\">\n <lx-avatar [user]=\"user\" [size]=\"size\" [showMailToLink]=\"true\" [disabled]=\"isUserDisabled(user)\" />\n </div>\n }\n </div>\n </div>\n</ng-template>\n", styles: [".group-container{display:flex;align-items:center}.group-container lx-avatar{display:flex;align-items:center}.group-container .more-users-icon{color:#61779d;background-color:#fff;border:1px solid #c2c9d6;border-radius:50%;font-weight:700;-webkit-user-select:none;user-select:none}.individual{margin-right:2px!important}.avatars-overlay{max-width:360px;overflow:auto;margin-top:5px;border-radius:10px;background-color:#fff;border:1px solid #c2c9d6;box-shadow:0 6px 12px #0000002d}.avatars-overlay .avatars-list{display:flex;flex-wrap:wrap;padding:10px}.avatars-overlay .avatars-list lx-avatar{display:block;margin-bottom:5px}.avatars-overlay .avatars-overlay-title{border-bottom:1px solid #c2c9d6;padding:10px;font-weight:700}.XS{width:16px;height:16px;line-height:16px;font-size:8px}.XS.group:not(:first-child){margin-left:-8px}.S{width:24px;height:24px;line-height:24px;font-size:11.25px}.S.group:not(:first-child){margin-left:-12px}.M{width:32px;height:32px;line-height:32px;text-align:center;vertical-align:middle;font-size:15.5px}.M.group:not(:first-child){margin-left:-10px}.L{width:40px;height:40px;line-height:40px;text-align:center;vertical-align:middle;font-size:large}.L.group:not(:first-child){margin-left:-20px}.XL{width:64px;height:64px;line-height:64px;text-align:center;vertical-align:middle;font-size:large}.XL.group:not(:first-child){margin-left:-50px}\n"] }]
|
|
2749
2726
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i0.NgZone }], propDecorators: { title: [{
|
|
2750
2727
|
type: Input
|
|
2751
2728
|
}], users: [{
|
|
@@ -2784,7 +2761,7 @@ class SkeletonComponent {
|
|
|
2784
2761
|
}
|
|
2785
2762
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: SkeletonComponent, decorators: [{
|
|
2786
2763
|
type: Component,
|
|
2787
|
-
args: [{ selector: 'lx-skeleton', template: '', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
2764
|
+
args: [{ selector: 'lx-skeleton', template: '', changeDetection: ChangeDetectionStrategy.OnPush, styles: [":host{display:block;position:relative;overflow:hidden;width:100%;height:18px;border-radius:4px;animation:pulse 1.5s infinite;filter:drop-shadow(0px 0px 2px #fff)}:host[color=dark]{background-color:#e1e5eb}:host[color=light]{background-color:#eaedf1}:host:after{content:\"\";position:absolute;inset:0;transform:translate(-100%);background-image:linear-gradient(90deg,#fff0 0,#c2c9d633 20%,#c2c9d680 60%,#fff0);animation:shimmer 1.5s cubic-bezier(.4,0,.2,1) infinite}@keyframes shimmer{to{transform:translate(100%)}}@keyframes pulse{0%{opacity:1}50%{opacity:.5}to{opacity:1}}@media (prefers-reduced-motion: reduce){:host:after{animation:none}}\n"] }]
|
|
2788
2765
|
}], propDecorators: { width: [{
|
|
2789
2766
|
type: HostBinding,
|
|
2790
2767
|
args: ['style.width']
|
|
@@ -2822,7 +2799,7 @@ class TokenComponent {
|
|
|
2822
2799
|
}
|
|
2823
2800
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TokenComponent, decorators: [{
|
|
2824
2801
|
type: Component,
|
|
2825
|
-
args: [{ selector: 'lx-token',
|
|
2802
|
+
args: [{ selector: 'lx-token', changeDetection: ChangeDetectionStrategy.OnPush, template: "<ng-content />\n" }]
|
|
2826
2803
|
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
2827
2804
|
|
|
2828
2805
|
class TokenizerOverflowPopoverComponent {
|
|
@@ -2853,7 +2830,7 @@ class TokenizerOverflowPopoverComponent {
|
|
|
2853
2830
|
}
|
|
2854
2831
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TokenizerOverflowPopoverComponent, decorators: [{
|
|
2855
2832
|
type: Component,
|
|
2856
|
-
args: [{ selector: 'lx-tokenizer-overflow-popover',
|
|
2833
|
+
args: [{ selector: 'lx-tokenizer-overflow-popover', imports: [SatPopoverModule, NgTemplateOutlet], changeDetection: ChangeDetectionStrategy.OnPush, template: "<sat-popover\n (backdropClicked)=\"closePopover()\"\n [hasBackdrop]=\"true\"\n [horizontalAlign]=\"horizontalAlign()\"\n [verticalAlign]=\"verticalAlign()\"\n openTransition=\"100ms\"\n closeTransition=\"100ms\"\n>\n @if (popoverTemplate) {\n <div\n class=\"tokenizerPopoverContentWrapper\"\n [class.before]=\"horizontalAlign() === 'before'\"\n [class.after]=\"horizontalAlign() === 'after'\"\n >\n <ng-container *ngTemplateOutlet=\"popoverTemplate; context: { $implicit: startIndex() }\" />\n </div>\n }\n</sat-popover>\n", styles: [".tokenizerPopoverContentWrapper{padding:16px;background:#fff;border-radius:4px;box-shadow:0 8px 14px #5261794d}.tokenizerPopoverContentWrapper.before{margin-right:10px}.tokenizerPopoverContentWrapper.after{margin-left:10px}\n"] }]
|
|
2857
2834
|
}], ctorParameters: () => [], propDecorators: { popoverTemplate: [{
|
|
2858
2835
|
type: ContentChild,
|
|
2859
2836
|
args: ['popoverTemplate']
|
|
@@ -2985,7 +2962,7 @@ class TokenizerComponent {
|
|
|
2985
2962
|
}
|
|
2986
2963
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TokenizerComponent, decorators: [{
|
|
2987
2964
|
type: Component,
|
|
2988
|
-
args: [{ selector: 'lx-tokenizer',
|
|
2965
|
+
args: [{ selector: 'lx-tokenizer', imports: [CounterComponent, ButtonComponent, TranslateModule], changeDetection: ChangeDetectionStrategy.OnPush, template: "<div #tokensContainer class=\"tokensContainer\">\n <ng-content select=\"lx-token\" />\n @if (showCounter()) {\n <button\n lx-button\n class=\"counterButton\"\n mode=\"ghost\"\n (click)=\"onCounterClicked()\"\n [attr.aria-label]=\"\n NAME + (overflowItemCount() === 1 ? '.showMoreItem' : '.showMoreItems') | translate: { count: overflowItemCount() }\n \"\n >\n <lx-counter #counter aria-hidden=\"true\" [content]=\"'+' + overflowItemCount()\" color=\"gray\" />\n </button>\n }\n</div>\n", styles: [":host{display:flex;align-items:center;white-space:nowrap}:host .counterButton{padding:0;display:flex;align-items:center;margin-left:4px;border-radius:12px}.tokensContainer{display:flex;align-items:center}\n"] }]
|
|
2989
2966
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.DestroyRef }, { type: i0.ChangeDetectorRef }, { type: ResizeObserverService }], propDecorators: { overflowPlaceholderClick: [{
|
|
2990
2967
|
type: Output
|
|
2991
2968
|
}], items: [{
|
|
@@ -3140,7 +3117,7 @@ class BasicDropdownItemComponent {
|
|
|
3140
3117
|
}
|
|
3141
3118
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: BasicDropdownItemComponent, decorators: [{
|
|
3142
3119
|
type: Component,
|
|
3143
|
-
args: [{ selector: 'lx-basic-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
3120
|
+
args: [{ selector: 'lx-basic-dropdown-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgClass, HighlightTermPipe], template: "@if (optionLabelSuffix) {\n <div [class.boldLabel]=\"labelFontWeight === 'bold'\" class=\"optionLabel\">\n <div [innerHtml]=\"label | lxHighlightTerm: highlightTerm\"></div>\n <ng-content [select]=\"optionLabelSuffix\" />\n </div>\n} @else {\n <div [class.boldLabel]=\"labelFontWeight === 'bold'\" [innerHtml]=\"label | lxHighlightTerm: highlightTerm\"></div>\n}\n<div\n class=\"optionDescription\"\n [style.font-style]=\"descriptionFontStyle\"\n [ngClass]=\"{ maxTextLines: descriptionStyleOptions?.maxLines }\"\n [style.-webkit-line-clamp]=\"descriptionStyleOptions?.maxLines || 'inherit'\"\n [innerHtml]=\"description | lxHighlightTerm: (descriptionStyleOptions?.shouldHighlightTerm ? highlightTerm : undefined)\"\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:var(--lxFontSmallSize, 12px)}.optionDescription.maxTextLines{overflow:hidden;text-overflow:ellipsis;display:-webkit-box;-webkit-line-clamp:inherit;-webkit-box-orient:vertical}.optionLabel{display:flex;align-items:center;justify-content:space-between}\n"] }]
|
|
3144
3121
|
}], propDecorators: { label: [{
|
|
3145
3122
|
type: Input
|
|
3146
3123
|
}], description: [{
|
|
@@ -3205,8 +3182,7 @@ class SelectableItemDirective {
|
|
|
3205
3182
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: SelectableItemDirective, decorators: [{
|
|
3206
3183
|
type: Directive,
|
|
3207
3184
|
args: [{
|
|
3208
|
-
selector: '[lxSelectableItem]'
|
|
3209
|
-
standalone: true
|
|
3185
|
+
selector: '[lxSelectableItem]'
|
|
3210
3186
|
}]
|
|
3211
3187
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { scrollInContainer: [{
|
|
3212
3188
|
type: Input
|
|
@@ -3400,7 +3376,7 @@ class BasicDropdownComponent extends KeyboardSelectDirective {
|
|
|
3400
3376
|
}
|
|
3401
3377
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: BasicDropdownComponent, decorators: [{
|
|
3402
3378
|
type: Component,
|
|
3403
|
-
args: [{ selector: 'lx-basic-dropdown', providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => BasicDropdownComponent) }], changeDetection: ChangeDetectionStrategy.OnPush,
|
|
3379
|
+
args: [{ selector: 'lx-basic-dropdown', providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => BasicDropdownComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
3404
3380
|
NgTemplateOutlet,
|
|
3405
3381
|
CdkOverlayOrigin,
|
|
3406
3382
|
CdkConnectedOverlay,
|
|
@@ -3526,8 +3502,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
3526
3502
|
type: Directive,
|
|
3527
3503
|
args: [{
|
|
3528
3504
|
exportAs: 'keyboardActionSource',
|
|
3529
|
-
selector: '[lxKeyboardActionSource]'
|
|
3530
|
-
standalone: true
|
|
3505
|
+
selector: '[lxKeyboardActionSource]'
|
|
3531
3506
|
}]
|
|
3532
3507
|
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
3533
3508
|
|
|
@@ -3548,7 +3523,7 @@ class OptionGroupComponent {
|
|
|
3548
3523
|
}
|
|
3549
3524
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: OptionGroupComponent, decorators: [{
|
|
3550
3525
|
type: Component,
|
|
3551
|
-
args: [{ selector: 'lx-option-group', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
3526
|
+
args: [{ selector: 'lx-option-group', changeDetection: ChangeDetectionStrategy.OnPush, template: "<li>\n @if (label) {\n <span class=\"groupLabel\" [class.selectedState]=\"hasSelectedState\">{{ label }}</span>\n }\n <ul>\n <ng-content />\n </ul>\n</li>\n", styles: [":host{display:block}:host:not(:first-child){border-top:solid 1px #eaedf1}ul{list-style:none;margin:0;padding-left:0}.groupLabel{display:block;line-height:23px;padding:4px 12px;color:#99a5bb;letter-spacing:.5px;font-weight:700;text-transform:uppercase}.groupLabel.selectedState{padding-left:28px}\n"] }]
|
|
3552
3527
|
}], propDecorators: { hasSelectedState: [{
|
|
3553
3528
|
type: Input
|
|
3554
3529
|
}], label: [{
|
|
@@ -3616,7 +3591,7 @@ class OptionComponent {
|
|
|
3616
3591
|
}
|
|
3617
3592
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: OptionComponent, decorators: [{
|
|
3618
3593
|
type: Component,
|
|
3619
|
-
args: [{ selector: 'lx-option',
|
|
3594
|
+
args: [{ selector: 'lx-option', template: "<li\n #option\n class=\"option\"\n role=\"option\"\n tabindex=\"-1\"\n [attr.id]=\"optionId\"\n [attr.aria-selected]=\"selected\"\n [class.selectedState]=\"hasSelectedState && !hasSubdropdown\"\n [class.highlighted]=\"isHighlighted\"\n [class.selected]=\"selected\"\n [class.disabled]=\"disabled\"\n [class.hasSubdropdown]=\"hasSubdropdown\"\n (keydown)=\"handleKeyDown($event)\"\n>\n @if (hasSelectedState) {\n @switch (selectIcon) {\n @case ('check') {\n @if (selected) {\n <i class=\"far fa-check\"></i>\n }\n }\n @case ('circle') {\n <i class=\"fal fa-circle\"></i>\n @if (selected) {\n <i class=\"fas fa-circle\"></i>\n }\n }\n }\n }\n <ng-content />\n @if (hasSubdropdown) {\n <i class=\"far fa-chevron-right\"></i>\n }\n</li>\n", styles: [":host{display:block}:host.flexLi li.option{display:flex}.option{line-height:23px;padding:4px 12px;cursor:pointer;color:#2a303d;position:relative}.option:hover{background-color:#e1e5eb}.option.selectedState{padding-left:28px}.option.selected{cursor:default;color:var(--lx-primarybutton-backgroundcolor)}.option.highlighted{background:#eaedf1}.option.disabled{opacity:.6}.option.hasSubdropdown{padding-right:28px}.option i{font-size:.9em;line-height:23px;position:absolute;top:calc(50% - 11.5px)}.option i.fa-check{left:8px}.option i.fa-circle{left:6px;font-size:var(--lxFontLargeSize, 16px);width:16px;text-align:center}.option i.fas.fa-circle{font-size:8px;color:inherit}.option i.fa-chevron-right{right:8px;font-size:8px}\n"] }]
|
|
3620
3595
|
}], ctorParameters: () => [{ type: OptionGroupComponent, decorators: [{
|
|
3621
3596
|
type: Optional
|
|
3622
3597
|
}, {
|
|
@@ -3830,7 +3805,7 @@ class CdkOptionsDropdownComponent {
|
|
|
3830
3805
|
}
|
|
3831
3806
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CdkOptionsDropdownComponent, decorators: [{
|
|
3832
3807
|
type: Component,
|
|
3833
|
-
args: [{ selector: 'lx-cdk-options-dropdown', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
3808
|
+
args: [{ selector: 'lx-cdk-options-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, imports: [CdkOverlayOrigin, CdkConnectedOverlay], template: "<div (click)=\"open = !open\" class=\"triggerContainer\" cdkOverlayOrigin #trigger=\"cdkOverlayOrigin\">\n <ng-content select=\"[lxKeyboardActionSource]\" />\n</div>\n<ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"trigger\"\n [cdkConnectedOverlayOpen]=\"open\"\n (overlayOutsideClick)=\"closeDropdown()\"\n>\n <ul\n #dropdown\n [class.showScrollbar]=\"maxHeight !== 'none'\"\n [style.max-height]=\"maxHeight\"\n [style.visibility]=\"isPositionComputed ? null : 'hidden'\"\n >\n <ng-content />\n </ul>\n</ng-template>\n", styles: [":host{display:inline-block;position:relative}ul{position:absolute;background-color:#fff;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;border:solid 1px #e1e5eb;text-align:left;list-style:none;margin:0;padding-left:0;z-index:20;white-space:nowrap}ul::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}ul::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}ul::-webkit-scrollbar-track-piece{background-color:transparent}ul.left{right:0;padding-right:0}ul.showScrollbar{overflow-y:auto}.triggerContainer{display:inline-block}\n"] }]
|
|
3834
3809
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { dropdownContainer: [{
|
|
3835
3810
|
type: ViewChild,
|
|
3836
3811
|
args: ['dropdown']
|
|
@@ -3900,7 +3875,7 @@ class BreadcrumbComponent {
|
|
|
3900
3875
|
}
|
|
3901
3876
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: BreadcrumbComponent, decorators: [{
|
|
3902
3877
|
type: Component,
|
|
3903
|
-
args: [{ selector: 'lx-breadcrumb',
|
|
3878
|
+
args: [{ selector: 'lx-breadcrumb', imports: [CdkOptionsDropdownComponent, KeyboardActionSourceDirective, OptionComponent], template: "@for (breadcrumb of viewBreadcrumbs; track $index; let last = $last) {\n @if (isEllipsedBreadcrumb(breadcrumb)) {\n <lx-cdk-options-dropdown [align]=\"'right'\" class=\"dropdownContainer\">\n <button class=\"step clickable\" lxKeyboardActionSource>...</button>\n @for (ellipsedBreadcrumbs of breadcrumb.breadcrumbs; track $index) {\n <lx-option [hasSelectedState]=\"false\" (select)=\"ellipsedBreadcrumbs.onClick?.(ellipsedBreadcrumbs)\">\n {{ ellipsedBreadcrumbs.label }}\n </lx-option>\n }\n </lx-cdk-options-dropdown>\n } @else {\n <button class=\"step\" [disabled]=\"!breadcrumb.onClick\" (click)=\"breadcrumb.onClick?.(breadcrumb)\">\n {{ breadcrumb.label }}\n </button>\n }\n\n @if (!last) {\n <i class=\"fa fa-angle-right\" aria-hidden=\"true\"></i>\n }\n}\n", styles: [":host{display:inline-flex;align-items:center;gap:6px}:host .step{color:#526179;text-decoration:none;font-size:var(--lxFontSmallSize, 12px);line-height:16px;font-weight:var(--lxFontNormal, 400);border:none;background-color:unset;padding:0}:host .step:not(:disabled){cursor:pointer}:host .step:not(:disabled):hover,:host .step:not(:disabled):focus-visible{color:#526179;text-decoration:underline}:host i{font-weight:var(--lxFontNormal, 400);color:#2a303d}\n"] }]
|
|
3904
3879
|
}], propDecorators: { breadcrumbs: [{
|
|
3905
3880
|
type: Input
|
|
3906
3881
|
}] } });
|
|
@@ -4016,7 +3991,7 @@ class CdkOptionsSubDropdownComponent {
|
|
|
4016
3991
|
}
|
|
4017
3992
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CdkOptionsSubDropdownComponent, decorators: [{
|
|
4018
3993
|
type: Component,
|
|
4019
|
-
args: [{ selector: 'lx-cdk-options-sub-dropdown',
|
|
3994
|
+
args: [{ selector: 'lx-cdk-options-sub-dropdown', imports: [CdkConnectedOverlay, AutocloseDirective], template: "<ng-template cdkConnectedOverlay [cdkConnectedOverlayOrigin]=\"trigger.elementRef\" [cdkConnectedOverlayOpen]=\"open\">\n <ul\n (mouseenter)=\"mouseenter()\"\n (mouseleave)=\"mouseleave()\"\n class=\"sub-dropdown\"\n [style.visibility]=\"isPositionComputed ? '' : 'hidden'\"\n lxAutoclose\n (autoclose)=\"closeDropdown()\"\n #dropdown\n >\n <ng-content />\n </ul>\n</ng-template>\n", styles: [".sub-dropdown{height:100%;padding:0;margin:0;background-color:#fff;border:solid 1px #e1e5eb;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;text-align:left;list-style:none;max-height:50vh;overflow-y:auto}\n"] }]
|
|
4020
3995
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { trigger: [{
|
|
4021
3996
|
type: Input
|
|
4022
3997
|
}], align: [{
|
|
@@ -4057,8 +4032,7 @@ __decorate([
|
|
|
4057
4032
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: MarkInvalidDirective, decorators: [{
|
|
4058
4033
|
type: Directive,
|
|
4059
4034
|
args: [{
|
|
4060
|
-
selector: '[lxMarkInvalid]'
|
|
4061
|
-
standalone: true
|
|
4035
|
+
selector: '[lxMarkInvalid]'
|
|
4062
4036
|
}]
|
|
4063
4037
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }], propDecorators: { lxMarkInvalid: [{
|
|
4064
4038
|
type: Input
|
|
@@ -4181,7 +4155,7 @@ __decorate([
|
|
|
4181
4155
|
], CurrencySymbolComponent.prototype, "code$", void 0);
|
|
4182
4156
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: CurrencySymbolComponent, decorators: [{
|
|
4183
4157
|
type: Component,
|
|
4184
|
-
args: [{ selector: 'lx-currency-symbol',
|
|
4158
|
+
args: [{ selector: 'lx-currency-symbol', imports: [AsyncPipe], template: "<span [innerHtml]=\"currency$ | async\"></span>\n" }]
|
|
4185
4159
|
}], propDecorators: { code: [{
|
|
4186
4160
|
type: Input
|
|
4187
4161
|
}], code$: [] } });
|
|
@@ -4302,7 +4276,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
4302
4276
|
useExisting: forwardRef(() => CurrencyInputComponent),
|
|
4303
4277
|
multi: true
|
|
4304
4278
|
}
|
|
4305
|
-
], changeDetection: ChangeDetectionStrategy.OnPush,
|
|
4279
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, imports: [CurrencySymbolComponent, MarkInvalidDirective, FormsModule, AsyncPipe, DecimalPipe], template: "@if (mode === 'edit') {\n <div class=\"container input-group\">\n @if (iconPosition === 'first') {\n <div class=\"labelContainer input-group-addon\">\n <lx-currency-symbol [code]=\"code\" />\n </div>\n }\n @if (!showCurrencyInput) {\n <input\n [attr.disabled]=\"disabled ? true : null\"\n type=\"text\"\n class=\"form-control currencyDisplayValue\"\n placeholder=\"{{ placeholder }}\"\n [lxMarkInvalid]=\"markInvalid\"\n [value]=\"dataValue$ | async | number: format\"\n (focus)=\"focusCurrencyInput()\"\n />\n }\n <input\n autocomplete=\"off\"\n [attr.disabled]=\"disabled ? true : null\"\n [class.hideInput]=\"!showCurrencyInput\"\n type=\"text\"\n inputmode=\"numeric\"\n class=\"form-control currencyInput\"\n name=\"inputAmount\"\n [attr.id]=\"inputId\"\n #currencyInput\n placeholder=\"{{ placeholder }}\"\n [ngModel]=\"dataValue$ | async\"\n (blur)=\"onBlur()\"\n (ngModelChange)=\"valueChanged($event)\"\n />\n @if (iconPosition === 'end') {\n <div class=\"labelContainer input-group-addon\">\n <lx-currency-symbol [code]=\"code\" />\n </div>\n }\n </div>\n} @else if (mode === 'view') {\n <span [class.placeholder]=\"(dataValue$ | async) === null && placeholder\">\n <!-- Not using Angular 2 currency pipe since a lot of currency symbols are missing: https://github.com/angular/angular/issues/6724 -->\n @if (iconPosition === 'first') {\n <lx-currency-symbol [code]=\"code\" />\n }\n {{ (dataValue$ | async | number: format) || placeholder }}\n @if (iconPosition === 'end') {\n <lx-currency-symbol [code]=\"code\" />\n }\n </span>\n}\n", styles: [".container{width:100%!important;padding:0}.labelContainer{width:5%!important;min-width:40px}input{width:100%}.hideInput{display:none}.placeholder{color:#99a5bb}\n"] }]
|
|
4306
4280
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { code: [{
|
|
4307
4281
|
type: Input
|
|
4308
4282
|
}], decimalSeparator: [{
|
|
@@ -4627,8 +4601,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
4627
4601
|
<ng-content />
|
|
4628
4602
|
</div>
|
|
4629
4603
|
}
|
|
4630
|
-
|
|
4631
|
-
standalone: true
|
|
4604
|
+
`
|
|
4632
4605
|
}]
|
|
4633
4606
|
}], propDecorators: { locale: [{
|
|
4634
4607
|
type: Input
|
|
@@ -4973,7 +4946,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
4973
4946
|
</tbody>
|
|
4974
4947
|
</table>
|
|
4975
4948
|
}
|
|
4976
|
-
`,
|
|
4949
|
+
`, imports: [NgClass], styles: [":host .btn-secondary{color:#292b2c;background-color:#fff;border-color:#ccc}:host .btn-info .text-muted{color:#292b2c!important}\n"] }]
|
|
4977
4950
|
}], ctorParameters: () => [{ type: DatePickerInnerComponent }] });
|
|
4978
4951
|
|
|
4979
4952
|
class MonthPickerComponent {
|
|
@@ -5135,7 +5108,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
5135
5108
|
</tbody>
|
|
5136
5109
|
</table>
|
|
5137
5110
|
}
|
|
5138
|
-
`,
|
|
5111
|
+
`, imports: [NgClass], styles: [":host .btn-info .text-success{color:#fff!important}\n"] }]
|
|
5139
5112
|
}], ctorParameters: () => [{ type: DatePickerInnerComponent }] });
|
|
5140
5113
|
|
|
5141
5114
|
// @deprecated
|
|
@@ -5301,7 +5274,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
5301
5274
|
</tbody>
|
|
5302
5275
|
</table>
|
|
5303
5276
|
}
|
|
5304
|
-
`,
|
|
5277
|
+
`, imports: [NgClass], styles: [":host .btn-info .text-success{color:#fff!important}\n"] }]
|
|
5305
5278
|
}], ctorParameters: () => [{ type: DatePickerInnerComponent }] });
|
|
5306
5279
|
|
|
5307
5280
|
class DatepickerConfig {
|
|
@@ -5471,7 +5444,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
5471
5444
|
</datepicker-inner>
|
|
5472
5445
|
`,
|
|
5473
5446
|
providers: [DATEPICKER_CONTROL_VALUE_ACCESSOR],
|
|
5474
|
-
standalone: true,
|
|
5475
5447
|
imports: [DatePickerInnerComponent, DayPickerComponent, MonthPickerComponent, YearPickerComponent]
|
|
5476
5448
|
}]
|
|
5477
5449
|
}], ctorParameters: () => [{ type: DatepickerConfig }], propDecorators: { datepickerMode: [{
|
|
@@ -5764,7 +5736,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
5764
5736
|
args: [{ selector: 'lx-date-input', providers: [
|
|
5765
5737
|
{ provide: NG_VALUE_ACCESSOR, useExisting: forwardRef(() => DateInputComponent), multi: true },
|
|
5766
5738
|
{ provide: NG_VALIDATORS, useExisting: forwardRef(() => DateInputComponent), multi: true }
|
|
5767
|
-
],
|
|
5739
|
+
], imports: [
|
|
5768
5740
|
NgTemplateOutlet,
|
|
5769
5741
|
CdkOverlayOrigin,
|
|
5770
5742
|
FormsModule,
|
|
@@ -5893,7 +5865,7 @@ class DragAndDropListItemComponent {
|
|
|
5893
5865
|
}
|
|
5894
5866
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DragAndDropListItemComponent, decorators: [{
|
|
5895
5867
|
type: Component,
|
|
5896
|
-
args: [{ selector: 'lx-drag-and-drop-list-item', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
5868
|
+
args: [{ selector: 'lx-drag-and-drop-list-item', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, ButtonComponent], template: "@if (customTemplateRef) {\n <ng-container *ngTemplateOutlet=\"customTemplateRef\" />\n} @else {\n <div class=\"drag-item-wrappper\">\n @if (draggable) {\n <i class=\"far fa-bars drag-handle\"></i>\n }\n <span [attr.title]=\"item\" class=\"itemWrapperForTruncation truncate\">{{ item }}</span>\n </div>\n <div class=\"left-button-container\" align=\"left\">\n @if (!!actions) {\n <div class=\"action-buttons-wrapper\">\n @for (act of actions; track act.id) {\n <button\n lx-button\n (click)=\"action.emit({ actionId: act.id, item: item })\"\n [title]=\"act.label\"\n [square]=\"true\"\n mode=\"ghost\"\n size=\"small\"\n class=\"action-button\"\n [class.show-on-hover-button]=\"act.showOnlyOnHover ? true : false\"\n [icon]=\"act.icon\"\n ></button>\n }\n </div>\n }\n </div>\n}\n", styles: [":host:not(.customTemplate){padding:6px 8px;display:flex;flex-direction:row;align-items:center;justify-content:space-between;box-sizing:border-box;background:#fff;border-radius:3px}:host:not(.customTemplate):hover .show-on-hover-button{opacity:1}:host.draggingDisabled{background:#eaedf1}.truncate{white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.drag-handle{padding-right:4px}.drag-item-wrappper{display:flex;min-width:0;align-items:baseline}.left-button-container,.action-buttons-wrapper{display:flex;flex-direction:row;flex-wrap:nowrap}.show-on-hover-button{opacity:0}.show-on-hover-button:focus{opacity:1}lx-option i{margin-right:8px}\n"] }]
|
|
5897
5869
|
}], ctorParameters: () => [{ type: i0.ElementRef }], propDecorators: { item: [{
|
|
5898
5870
|
type: Input
|
|
5899
5871
|
}], draggable: [{
|
|
@@ -5996,8 +5968,7 @@ class KeyboardSortableItemDirective {
|
|
|
5996
5968
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: KeyboardSortableItemDirective, decorators: [{
|
|
5997
5969
|
type: Directive,
|
|
5998
5970
|
args: [{
|
|
5999
|
-
selector: '[lxKeyboardSortableItem]'
|
|
6000
|
-
standalone: true
|
|
5971
|
+
selector: '[lxKeyboardSortableItem]'
|
|
6001
5972
|
}]
|
|
6002
5973
|
}], ctorParameters: () => [{ type: i1$6.CdkDrag }, { type: i1$2.OverlayPositionBuilder }, { type: i0.ElementRef }, { type: i1$2.Overlay }, { type: i2.AriaDescriber }], propDecorators: { allItemsData: [{
|
|
6003
5974
|
type: Input,
|
|
@@ -6071,8 +6042,7 @@ __decorate([
|
|
|
6071
6042
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: KeyboardSortableListDirective, decorators: [{
|
|
6072
6043
|
type: Directive,
|
|
6073
6044
|
args: [{
|
|
6074
|
-
selector: '[lxKeyboardSortableList]'
|
|
6075
|
-
standalone: true
|
|
6045
|
+
selector: '[lxKeyboardSortableList]'
|
|
6076
6046
|
}]
|
|
6077
6047
|
}], ctorParameters: () => [{ type: i1.TranslateService }], propDecorators: { keyboardSortableItems$: [], keyboardSortableItems: [{
|
|
6078
6048
|
type: Input
|
|
@@ -6144,7 +6114,7 @@ class DragAndDropListComponent {
|
|
|
6144
6114
|
}
|
|
6145
6115
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: DragAndDropListComponent, decorators: [{
|
|
6146
6116
|
type: Component,
|
|
6147
|
-
args: [{ selector: 'lx-drag-and-drop-list',
|
|
6117
|
+
args: [{ selector: 'lx-drag-and-drop-list', imports: [
|
|
6148
6118
|
CdkDropList,
|
|
6149
6119
|
KeyboardSortableListDirective,
|
|
6150
6120
|
CdkDrag,
|
|
@@ -6221,7 +6191,7 @@ class ErrorMessageComponent {
|
|
|
6221
6191
|
}
|
|
6222
6192
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ErrorMessageComponent, decorators: [{
|
|
6223
6193
|
type: Component,
|
|
6224
|
-
args: [{ selector: 'lx-error-message', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
6194
|
+
args: [{ selector: 'lx-error-message', changeDetection: ChangeDetectionStrategy.OnPush, template: "<span #contentWrapper hidden>\n <ng-content />\n</span>\n\n@if (computedErrorMessage()) {\n <div class=\"error\">\n {{ computedErrorMessage() }}\n </div>\n}\n", styles: [".error{color:#f96464;padding:4px}\n"] }]
|
|
6225
6195
|
}] });
|
|
6226
6196
|
|
|
6227
6197
|
class ExpandedDropdownComponent extends KeyboardSelectDirective {
|
|
@@ -6236,7 +6206,7 @@ class ExpandedDropdownComponent extends KeyboardSelectDirective {
|
|
|
6236
6206
|
}
|
|
6237
6207
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ExpandedDropdownComponent, decorators: [{
|
|
6238
6208
|
type: Component,
|
|
6239
|
-
args: [{ selector: 'lx-expanded-dropdown', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
6209
|
+
args: [{ selector: 'lx-expanded-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SelectableItemDirective, NgTemplateOutlet, AsyncPipe, TranslateModule], template: "<ul role=\"listbox\" class=\"options lxThinScrollbar\" #keyboardSelectContainer>\n @for (option of options; track option.id; let index = $index) {\n <li\n tabindex=\"-1\"\n lxSelectableItem\n [scrollInContainer]=\"keyboardSelectContainer\"\n #item\n class=\"option keyboardSelectable\"\n (click)=\"onChooseItem.emit(option.id)\"\n [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n role=\"option\"\n [attr.aria-selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n >\n <ng-container>\n <ng-container *ngTemplateOutlet=\"simpleStringDisplay; context: { $implicit: option, index: index }\" />\n </ng-container>\n <ng-template #simpleStringDisplay>\n <span [title]=\"option.name\">\n {{ option.name }}\n </span>\n </ng-template>\n <div class=\"iconContainer\">\n <svg\n width=\"32px\"\n height=\"32px\"\n viewBox=\"0 0 32 32\"\n version=\"1.1\"\n xmlns=\"http://www.w3.org/2000/svg\"\n xmlns:xlink=\"http://www.w3.org/1999/xlink\"\n >\n <g id=\"choose-workspace-D\" stroke=\"none\" stroke-width=\"1\" fill=\"none\" fill-rule=\"evenodd\">\n <g id=\"choose-a-workspace-D\" transform=\"translate(-911.000000, -429.000000)\">\n <g id=\"Group-3\" transform=\"translate(471.000000, 249.000000)\">\n <g id=\"Button/Text/Primary/Medium\" transform=\"translate(440.000000, 180.000000)\">\n <g id=\"UI/Shape/Rectangle-rounded-2px\" fill=\"#0070f2\">\n <circle id=\"\uD83C\uDFA8-Style\" cx=\"16\" cy=\"16\" r=\"16\" />\n </g>\n <g id=\"Icons/basic/refresh\" transform=\"translate(7.000000, 11.000000)\" fill=\"#FFFFFF\" fill-rule=\"nonzero\">\n <g id=\"arrow-right\" transform=\"translate(3.772240, 0.000000)\">\n <path\n d=\"M5.41769476,0.0873198725 L4.92588162,0.579133017 C4.80947996,0.695534673 4.80947996,0.88427129 4.92588162,1.00069779 L8.77935771,4.85414904 L0.298083627,4.85414904 C0.133466944,4.85414904 0,4.98761598 0,5.15223266 L0,5.84776113 C0,6.01237781 0.133466944,6.14584475 0.298083627,6.14584475 L8.77935771,6.14584475 L4.92588162,9.99932084 C4.80947996,10.1157225 4.80947996,10.3044591 4.92588162,10.4208856 L5.41769476,10.9126988 C5.53409642,11.0291004 5.72283304,11.0291004 5.83925953,10.9126988 L11.0411666,5.7107917 C11.1575682,5.59439004 11.1575682,5.40565343 11.0411666,5.28922693 L5.83923469,0.0873198725 C5.72283304,-0.0291066242 5.53409642,-0.0291066242 5.41769476,0.0873198725 Z\"\n id=\"Path\"\n />\n </g>\n </g>\n </g>\n </g>\n </g>\n </g>\n </svg>\n </div>\n </li>\n } @empty {\n <li tabindex=\"-1\" id=\"noOption\" class=\"option noOptionsAvailable\">\n {{ NAME + '.noResults' | translate }}\n </li>\n }\n</ul>\n", styles: [".options{list-style:none;margin:0;padding:0;overflow-y:auto;max-height:200px}.options:hover .selected{background-color:#fff}.optionSearch{padding:2px}.option{display:flex;justify-content:space-between;font-size:var(--lxFontLargeSize, 16px);height:40px;align-items:center;padding:4px 12px;border-bottom:1px solid #e1e5eb}.option:hover{background-color:#e1e5eb!important}.option.selected{background:#eaedf1}.option span{overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.iconContainer{display:none}.option:hover .iconContainer{display:flex}\n"] }]
|
|
6240
6210
|
}], propDecorators: { options: [{
|
|
6241
6211
|
type: Input
|
|
6242
6212
|
}], onChooseItem: [{
|
|
@@ -6273,7 +6243,7 @@ class FormErrorComponent {
|
|
|
6273
6243
|
}
|
|
6274
6244
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FormErrorComponent, decorators: [{
|
|
6275
6245
|
type: Component,
|
|
6276
|
-
args: [{ selector: 'lx-form-error',
|
|
6246
|
+
args: [{ selector: 'lx-form-error', imports: [TranslateModule], template: "@for (key of translationKeys; track $index) {\n <div class=\"error\">\n {{ key | translate }}\n </div>\n}\n", styles: [".error{color:#f96464;padding:4px}\n"] }]
|
|
6277
6247
|
}], propDecorators: { namespace: [{
|
|
6278
6248
|
type: Input
|
|
6279
6249
|
}], form: [{
|
|
@@ -6309,7 +6279,7 @@ class IconComponent {
|
|
|
6309
6279
|
}
|
|
6310
6280
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: IconComponent, decorators: [{
|
|
6311
6281
|
type: Component,
|
|
6312
|
-
args: [{ selector: 'lx-icon', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
6282
|
+
args: [{ selector: 'lx-icon', changeDetection: ChangeDetectionStrategy.OnPush, template: "<i [attr.title]=\"title\" [class]=\"iconStyle + ' fa-' + name\" [style.color]=\"color\" [style.fontSize]=\"size\"></i>\n", styles: [":host{display:inline-block}\n"] }]
|
|
6313
6283
|
}], propDecorators: { name: [{
|
|
6314
6284
|
type: Input
|
|
6315
6285
|
}], color: [{
|
|
@@ -6352,7 +6322,7 @@ class InputComponent {
|
|
|
6352
6322
|
}
|
|
6353
6323
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: InputComponent, decorators: [{
|
|
6354
6324
|
type: Component,
|
|
6355
|
-
args: [{ selector: 'input[lx-input]', template: ``,
|
|
6325
|
+
args: [{ selector: 'input[lx-input]', template: ``, imports: [ReactiveFormsModule], styles: [":host{height:32px;padding:8px;border-radius:3px;border:solid 1px #99a5bb;outline:0;color:#2a303d}:host:focus{border-color:#99c6fa}:host.error{border-color:#f96464}:host.lx-max-length-counter-input.error{color:#f96464}:host.lx-max-length-counter-input.error+span.lx-max-length-counter{color:#f96464}:host.lx-max-length-counter-input+span.lx-max-length-counter{font-size:var(--lxFontSize, 14px);float:right;margin-left:auto;margin-top:2px}:host.disabled{background-color:#f0f2f5;color:#61779d}\n"] }]
|
|
6356
6326
|
}], ctorParameters: () => [{ type: i1$5.NgControl, decorators: [{
|
|
6357
6327
|
type: Optional
|
|
6358
6328
|
}] }], propDecorators: { error: [{
|
|
@@ -6392,8 +6362,7 @@ class SelectDropdownDirective {
|
|
|
6392
6362
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: SelectDropdownDirective, decorators: [{
|
|
6393
6363
|
type: Directive,
|
|
6394
6364
|
args: [{
|
|
6395
|
-
selector: '[lxSelectDropdown]'
|
|
6396
|
-
standalone: true
|
|
6365
|
+
selector: '[lxSelectDropdown]'
|
|
6397
6366
|
}]
|
|
6398
6367
|
}] });
|
|
6399
6368
|
|
|
@@ -6651,7 +6620,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
6651
6620
|
multi: true,
|
|
6652
6621
|
useExisting: forwardRef(() => ResponsiveInputComponent)
|
|
6653
6622
|
}
|
|
6654
|
-
],
|
|
6623
|
+
], imports: [FormsModule, ReactiveFormsModule, AsyncPipe], template: "<span #inputWidth class=\"inputWidth\"></span>\n<input\n type=\"text\"\n class=\"responsiveInput\"\n (focus)=\"focus.emit()\"\n (blur)=\"blur.emit()\"\n (keyup.tab)=\"focusViaTab.emit()\"\n (keyup.shift.tab)=\"focusViaTab.emit()\"\n [formControl]=\"inputControl\"\n [attr.id]=\"inputId\"\n #responsiveInput\n [style.width]=\"inputWidth$ | async\"\n/>\n", styles: [":host{display:inline-block}.inputWidth{display:none;height:0;overflow:hidden;position:absolute;white-space:pre;max-width:100%}.responsiveInput{border:0;padding:0;height:100%;max-width:100%}.responsiveInput::-ms-clear{display:none}.responsiveInput:focus{outline:0}\n"] }]
|
|
6655
6624
|
}], propDecorators: { inputId: [{
|
|
6656
6625
|
type: Input
|
|
6657
6626
|
}], focus: [{
|
|
@@ -6681,7 +6650,7 @@ class MultiSelectSelectionComponent extends KeyboardSelectDirective {
|
|
|
6681
6650
|
}
|
|
6682
6651
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: MultiSelectSelectionComponent, decorators: [{
|
|
6683
6652
|
type: Component,
|
|
6684
|
-
args: [{ selector: 'lx-multi-select-selection',
|
|
6653
|
+
args: [{ selector: 'lx-multi-select-selection', imports: [AsyncPipe, NgTemplateOutlet, SelectableItemDirective, TokenizerComponent, TokenComponent], changeDetection: ChangeDetectionStrategy.OnPush, template: "<ul>\n <lx-tokenizer [active]=\"tokenize()\">\n @for (selectedItem of selection(); track $index) {\n <lx-token>\n <li\n lxSelectableItem\n #item\n [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n (select)=\"removeItem.emit(selectedItem)\"\n >\n <ng-container *ngTemplateOutlet=\"selectionTemplate; context: { $implicit: selectedItem }\" />\n </li>\n </lx-token>\n }\n </lx-tokenizer>\n</ul>\n", styles: [":host{display:block;overflow:hidden;overflow-x:auto;scrollbar-width:none}ul{display:block;margin:0!important;padding:0!important}li{display:inline}\n"] }]
|
|
6685
6654
|
}], propDecorators: { removeItem: [{
|
|
6686
6655
|
type: Output
|
|
6687
6656
|
}], selectionTemplate: [{
|
|
@@ -6953,7 +6922,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
6953
6922
|
useExisting: forwardRef(() => MultiSelectComponent),
|
|
6954
6923
|
multi: true
|
|
6955
6924
|
}
|
|
6956
|
-
],
|
|
6925
|
+
], imports: [
|
|
6957
6926
|
MarkInvalidDirective,
|
|
6958
6927
|
MultiSelectSelectionComponent,
|
|
6959
6928
|
ResponsiveInputComponent,
|
|
@@ -7049,7 +7018,7 @@ class OptionGroupDropdownComponent extends KeyboardSelectDirective {
|
|
|
7049
7018
|
}
|
|
7050
7019
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: OptionGroupDropdownComponent, decorators: [{
|
|
7051
7020
|
type: Component,
|
|
7052
|
-
args: [{ selector: 'lx-option-group-dropdown', providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => OptionGroupDropdownComponent) }], changeDetection: ChangeDetectionStrategy.OnPush,
|
|
7021
|
+
args: [{ selector: 'lx-option-group-dropdown', providers: [{ provide: KeyboardSelectDirective, useExisting: forwardRef(() => OptionGroupDropdownComponent) }], changeDetection: ChangeDetectionStrategy.OnPush, imports: [
|
|
7053
7022
|
NgIf,
|
|
7054
7023
|
CdkOverlayOrigin,
|
|
7055
7024
|
CdkConnectedOverlay,
|
|
@@ -7349,7 +7318,7 @@ class OptionsDropdownComponent {
|
|
|
7349
7318
|
}
|
|
7350
7319
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: OptionsDropdownComponent, decorators: [{
|
|
7351
7320
|
type: Component,
|
|
7352
|
-
args: [{ selector: 'lx-options-dropdown', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
7321
|
+
args: [{ selector: 'lx-options-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, imports: [NgTemplateOutlet, NgClass, CdkOverlayOrigin, CdkConnectedOverlay, AutocloseDirective], template: "@if (overlayPositioning) {\n <div class=\"overlayOrigin triggerContainer\" (click)=\"toggleOpen()\" cdkOverlayOrigin #selectOrigin=\"cdkOverlayOrigin\">\n <ng-container [ngTemplateOutlet]=\"triggerTemplate\" />\n </div>\n <ng-template\n cdkConnectedOverlay\n [cdkConnectedOverlayOrigin]=\"selectOrigin\"\n [cdkConnectedOverlayScrollStrategy]=\"overlayScrollStrategy\"\n [cdkConnectedOverlayOpen]=\"open\"\n [cdkConnectedOverlayPositions]=\"overlayPositions\"\n (overlayOutsideClick)=\"closeDropdown(); closedWithoutSelection.emit()\"\n >\n <div class=\"overlayDropdown\">\n <ng-container [ngTemplateOutlet]=\"dropdownTemplate\" />\n </div>\n </ng-template>\n} @else {\n <div lxAutoclose (autoclose)=\"closeDropdown()\">\n <div class=\"triggerContainer\" [ngClass]=\"{ flexDisplay: isFlexEnabledTriggerContainer }\" (click)=\"toggleOpen()\">\n <ng-container [ngTemplateOutlet]=\"triggerTemplate\" />\n </div>\n <ng-container [ngTemplateOutlet]=\"dropdownTemplate\" />\n </div>\n}\n\n<ng-template #triggerTemplate>\n <ng-content select=\"[lxKeyboardActionSource]\" />\n</ng-template>\n\n<ng-template #dropdownTemplate>\n @if (open) {\n <ul\n [id]=\"listboxId\"\n [class]=\"dropdownClass\"\n [class.left]=\"align === 'left'\"\n [class.showScrollbar]=\"maxHeight !== 'none'\"\n [style.max-height]=\"maxHeight\"\n role=\"listbox\"\n tabindex=\"-1\"\n [attr.aria-owns]=\"optionIds.join(' ')\"\n >\n <ng-content />\n </ul>\n }\n</ng-template>\n", styles: [":host{position:relative}.overlayDropdown ul{position:static}ul{position:absolute;background-color:#fff;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;border:solid 1px #e1e5eb;text-align:left;list-style:none;margin:0;padding-left:0;z-index:20;white-space:nowrap}ul::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}ul::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}ul::-webkit-scrollbar-track-piece{background-color:transparent}ul.left{right:0;padding-right:0}ul.showScrollbar{overflow-y:auto}.triggerContainer{display:inline-block}.flexDisplay{display:flex}\n"] }]
|
|
7353
7322
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$2.ScrollStrategyOptions }, { type: i0.Renderer2 }], propDecorators: { align: [{
|
|
7354
7323
|
type: Input
|
|
7355
7324
|
}], closeOnScroll: [{
|
|
@@ -7451,7 +7420,7 @@ class OptionsSubDropdownComponent {
|
|
|
7451
7420
|
}
|
|
7452
7421
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: OptionsSubDropdownComponent, decorators: [{
|
|
7453
7422
|
type: Component,
|
|
7454
|
-
args: [{ selector: 'lx-options-sub-dropdown',
|
|
7423
|
+
args: [{ selector: 'lx-options-sub-dropdown', imports: [AutocloseDirective, AsyncPipe], template: "<div #spacingContainer class=\"spacingContainer\" [class.left]=\"align === 'left'\">\n <ul\n #subDropdown\n class=\"sub-dropdown\"\n lxAutoclose\n [class.showScrollbar]=\"(maxHeight$ | async) !== 'none'\"\n [style.max-height]=\"(maxHeight$ | async) ?? 'none'\"\n (autoclose)=\"closeDropdown()\"\n >\n <ng-content />\n </ul>\n</div>\n", styles: [":host{display:block}:host.hidden{display:none}.spacingContainer{position:absolute;left:100%;transform:translateY(-32px);padding:0 0 0 4px}.spacingContainer.left{left:auto;right:100%;padding:0 4px 0 0}.sub-dropdown{position:relative;padding:0;background-color:#fff;border:solid 1px #e1e5eb;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;text-align:left;list-style:none}.sub-dropdown::-webkit-scrollbar{width:.5em;height:.5em;background-color:transparent}.sub-dropdown::-webkit-scrollbar-thumb{background-color:#c2c9d6;border-radius:6px}.sub-dropdown::-webkit-scrollbar-track-piece{background-color:transparent}.sub-dropdown.showScrollbar{overflow-y:auto}\n"] }]
|
|
7455
7424
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { trigger: [{
|
|
7456
7425
|
type: Input
|
|
7457
7426
|
}], align: [{
|
|
@@ -7541,7 +7510,7 @@ class PickerOptionComponent {
|
|
|
7541
7510
|
}
|
|
7542
7511
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: PickerOptionComponent, decorators: [{
|
|
7543
7512
|
type: Component,
|
|
7544
|
-
args: [{ selector: 'li[lx-picker-option]', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
7513
|
+
args: [{ selector: 'li[lx-picker-option]', changeDetection: ChangeDetectionStrategy.OnPush, imports: [IconComponent], template: "@if (isClearOption) {\n <lx-icon name=\"slash\" color=\"#d8d8d8\" />\n} @else {\n <ng-content />\n}\n", styles: [":host{display:inline-block;cursor:pointer;width:35px;height:35px;line-height:35px;text-align:center;border:1px solid transparent;border-radius:3px}:host.clearOption{border:1px solid #cfd5df}:host.highlighted,:host.selected{border:1px solid #b2bccc;cursor:default}:host:hover{border:1px solid #b2bccc}:host:focus{outline:0}\n"] }]
|
|
7545
7514
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1.TranslateService }], propDecorators: { role: [{
|
|
7546
7515
|
type: HostBinding,
|
|
7547
7516
|
args: ['attr.role']
|
|
@@ -7621,8 +7590,7 @@ class PickerTriggerDirective {
|
|
|
7621
7590
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: PickerTriggerDirective, decorators: [{
|
|
7622
7591
|
type: Directive,
|
|
7623
7592
|
args: [{
|
|
7624
|
-
selector: '[lxPickerTrigger]'
|
|
7625
|
-
standalone: true
|
|
7593
|
+
selector: '[lxPickerTrigger]'
|
|
7626
7594
|
}]
|
|
7627
7595
|
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
7628
7596
|
|
|
@@ -7815,7 +7783,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
7815
7783
|
multi: true,
|
|
7816
7784
|
useExisting: forwardRef(() => PickerComponent)
|
|
7817
7785
|
}
|
|
7818
|
-
], changeDetection: ChangeDetectionStrategy.OnPush,
|
|
7786
|
+
], changeDetection: ChangeDetectionStrategy.OnPush, imports: [AutocloseDirective], template: "<div class=\"pickerContainer\">\n <ng-content select=\"[lxPickerTrigger]\" />\n @if (open) {\n <ul\n class=\"pickerOptions\"\n lxAutoclose\n (autoclose)=\"closePicker()\"\n role=\"listbox\"\n [style.margin-left]=\"leftOffset\"\n [attr.aria-activedescendant]=\"activeDescendantsId\"\n [attr.aria-label]=\"listBoxAriaLabel\"\n [attr.aria-labelledby]=\"listBoxAriaLabelledBy\"\n >\n <ng-content />\n </ul>\n }\n</div>\n", styles: [":host{display:inline-block;width:100%;position:relative}.pickerOptions{position:absolute;background-color:#fff;border-radius:3px;box-shadow:0 8px 12px 2px #00000026;border:solid 1px #e1e5eb;padding:4px;z-index:20;width:185px}\n"] }]
|
|
7819
7787
|
}], ctorParameters: () => [{ type: i1$1.Directionality }, { type: i0.ChangeDetectorRef }], propDecorators: { listBoxAriaLabel: [{
|
|
7820
7788
|
type: Input
|
|
7821
7789
|
}], listBoxAriaLabelledBy: [{
|
|
@@ -7849,7 +7817,7 @@ class PillItemComponent {
|
|
|
7849
7817
|
}
|
|
7850
7818
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: PillItemComponent, decorators: [{
|
|
7851
7819
|
type: Component,
|
|
7852
|
-
args: [{ selector: 'lx-pill-item',
|
|
7820
|
+
args: [{ selector: 'lx-pill-item', template: "<span data-testid=\"pill-label\" class=\"pillLabel\">{{ label }}</span>\n@if (!disabled) {\n <span data-testid=\"remove-pill-item\" (click)=\"removePill(item, true)\" class=\"remove far fa-times\"></span>\n}\n", styles: [":host{margin:2px;border-radius:1px;border:solid 1px #f0f2f5;background-color:#f0f2f5;color:#2a303d;display:inline-block;padding:4px}:host:hover{background-color:#e1e5eb;border:solid 1px #e1e5eb}:host-context(.selected){background-color:#e1e5eb}.pillLabel{margin-left:4px;margin-right:4px;font-weight:400;font-style:normal;font-stretch:normal;line-height:normal;letter-spacing:normal;vertical-align:middle}.remove{vertical-align:middle;margin:0 4px}.remove:hover{cursor:pointer}\n"] }]
|
|
7853
7821
|
}], propDecorators: { item: [{
|
|
7854
7822
|
type: Input
|
|
7855
7823
|
}], label: [{
|
|
@@ -7891,7 +7859,7 @@ class PillListComponent extends KeyboardSelectDirective {
|
|
|
7891
7859
|
}
|
|
7892
7860
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: PillListComponent, decorators: [{
|
|
7893
7861
|
type: Component,
|
|
7894
|
-
args: [{ selector: 'lx-pill-list', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
7862
|
+
args: [{ selector: 'lx-pill-list', changeDetection: ChangeDetectionStrategy.OnPush, imports: [SelectableItemDirective, NgTemplateOutlet, PillItemComponent, AsyncPipe], template: "<ul class=\"pills\" #keyboardSelectContainer>\n @for (pill of pills; track trackByProp(index, pill); let index = $index) {\n <li\n lxSelectableItem\n [scrollInContainer]=\"keyboardSelectContainer\"\n #item\n (select)=\"removePillViaKeyboard(pill)\"\n class=\"pill\"\n [class.selected]=\"isItemSelected(item, (selectedItem$ | async)?.element)\"\n >\n @if (pillTemplate) {\n <ng-container *ngTemplateOutlet=\"pillTemplate; context: { $implicit: pill, index: index }\" />\n } @else {\n <lx-pill-item [item]=\"pill\" [label]=\"labelKey ? pill[labelKey] : pill\" [disabled]=\"disabled\" (remove)=\"removePill($event)\" />\n }\n </li>\n }\n</ul>\n", styles: [":host .pill{display:inline}:host.disabled{cursor:not-allowed}:host .pills{display:inline;margin:0!important;padding:0!important}\n"] }]
|
|
7895
7863
|
}], propDecorators: { pills: [{
|
|
7896
7864
|
type: Input
|
|
7897
7865
|
}], labelKey: [{
|
|
@@ -8084,7 +8052,7 @@ class SelectListComponent extends BaseSelectDirective {
|
|
|
8084
8052
|
}
|
|
8085
8053
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: SelectListComponent, decorators: [{
|
|
8086
8054
|
type: Component,
|
|
8087
|
-
args: [{ selector: 'lx-select-list',
|
|
8055
|
+
args: [{ selector: 'lx-select-list', imports: [FormsModule, ReactiveFormsModule, NgTemplateOutlet], template: "<div class=\"selectContainer focused\">\n <div class=\"selectionContainer\">\n <div class=\"inputContainer\">\n <div class=\"searchWrapper\">\n <input\n #searchInput\n id=\"searchInput\"\n class=\"searchInput\"\n type=\"text\"\n autocomplete=\"off\"\n (keyup)=\"searchKeyChanged($event)\"\n [formControl]=\"queryControl\"\n [placeholder]=\"searchPlaceholder\"\n />\n <label for=\"searchInput\" class=\"fa fa-search\"></label>\n </div>\n </div>\n </div>\n <div class=\"optionsContainer\" #optionsContainer>\n <ng-container>\n <ng-container *ngTemplateOutlet=\"dropdownTmpl\" />\n </ng-container>\n </div>\n</div>\n\n<ng-template #selectedOption>\n <ng-content select=\".selectedOption\" />\n</ng-template>\n<ng-template #dropdown>\n <ng-content select=\".dropdownComponent\" />\n</ng-template>\n", styles: [".selectContainer{position:relative;height:auto;padding:0;box-sizing:border-box;z-index:1049;background:#fff;border-bottom-color:#fff;border-bottom-left-radius:0;border-bottom-right-radius:0;border:none;box-shadow:none;font-size:var(--lxFontLargeSize, 16px)}.selectContainer .optionsContainer{border-bottom:solid 1px #e1e5eb;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;box-shadow:0 6px 6px #21252933;top:100%;border-top:0;border-top-left-radius:0;border-top-right-radius:0;border:none;border-top:1px solid #e1e5eb;box-shadow:none;margin-top:1px}.selectContainer .inputContainer,.selectContainer .searchInput,.selectContainer .selection,.selectContainer .iconContainer{height:29px}.selectContainer .inputContainer{line-height:29px}.selectContainer .selectionContainer{min-height:29px}.selectionContainer{display:flex}.inputContainer{flex:1;position:relative;white-space:nowrap}.searchInput{width:100%;appearance:none;padding-left:27px;border:0;background:transparent;position:relative;cursor:inherit}.searchInput::-ms-clear{display:none}.searchInput:focus{outline:0}.iconContainer{display:flex;align-items:center;text-align:center}.fa-search{position:absolute;left:3px;top:calc(50% - .5em);color:#526179}.searchWrapper{position:relative}.selection{width:100%;position:absolute;display:flex;align-items:center}.selection.lowerOpacity{opacity:.7}.optionsContainer{position:absolute;left:-1px;right:-1px;padding:0;border-radius:3px;background:#fff;z-index:1001}\n"] }]
|
|
8088
8056
|
}], propDecorators: { searchPlaceholder: [{
|
|
8089
8057
|
type: Input
|
|
8090
8058
|
}], options: [{
|
|
@@ -8132,8 +8100,7 @@ class SelectedOptionDirective {
|
|
|
8132
8100
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: SelectedOptionDirective, decorators: [{
|
|
8133
8101
|
type: Directive,
|
|
8134
8102
|
args: [{
|
|
8135
|
-
selector: '[lxSelectedOption]'
|
|
8136
|
-
standalone: true
|
|
8103
|
+
selector: '[lxSelectedOption]'
|
|
8137
8104
|
}]
|
|
8138
8105
|
}] });
|
|
8139
8106
|
|
|
@@ -8367,7 +8334,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
8367
8334
|
multi: true,
|
|
8368
8335
|
useExisting: forwardRef(() => SingleSelectComponent)
|
|
8369
8336
|
}
|
|
8370
|
-
],
|
|
8337
|
+
], imports: [MarkInvalidDirective, NgTemplateOutlet, FormsModule, ReactiveFormsModule, AsyncPipe], template: "@if (dropdownOpen) {\n <div class=\"backdrop\" (click)=\"handleBackdropClick($event)\"></div>\n}\n<div\n [lxMarkInvalid]=\"markInvalid\"\n class=\"selectContainer {{ padding }}Padding\"\n [class.open]=\"dropdownOpen\"\n [class.top]=\"(dropdownDirection$ | async) === 'TOP'\"\n [class.bottom]=\"(dropdownDirection$ | async) === 'BOTTOM'\"\n [class.disabled]=\"disabled\"\n [class.grayBackground]=\"selectionBackground === 'gray'\"\n [class.defaultSize]=\"size === 'default'\"\n [class.smallSize]=\"size === 'small'\"\n [class.select2Size]=\"size === 'select2'\"\n [class.largeSize]=\"size === 'large'\"\n [style.cursor]=\"cursorStyle\"\n [class.focused]=\"isInputFocused\"\n [class.focusedVisible]=\"isInputFocusedViaTab\"\n (click)=\"handleClick($event.target === toggle)\"\n>\n <div class=\"selectionContainer\">\n <div class=\"inputContainer\">\n @if (!selection && selection !== 0 && !queryInput?.value) {\n <div class=\"placeholder\" [attr.title]=\"placeholder\">\n {{ placeholder }}\n </div>\n }\n @if (!allowQuery || !queryInput?.value) {\n <div\n class=\"selection\"\n [class.lowerOpacity]=\"allowQuery && !queryInput?.value && dropdownOpen\"\n [class.lightgrayColor]=\"!allowQuery && dropdownOpen\"\n (click)=\"$event.stopPropagation(); focus()\"\n >\n <ng-container *ngTemplateOutlet=\"selectedOptionTmpl\" />\n </div>\n }\n <input\n #queryInput\n class=\"queryInput\"\n type=\"text\"\n [attr.id]=\"inputId\"\n [attr.required]=\"required ? 'true' : null\"\n [class.isHidden]=\"!allowQuery\"\n (keydown.enter)=\"$event.preventDefault()\"\n (focus)=\"isInputFocused = true\"\n (blur)=\"isInputFocused = false; isInputFocusedViaTab = false; blur.emit($event)\"\n (keyup.tab)=\"focusedViaTab()\"\n (keyup.shift.tab)=\"focusedViaTab()\"\n [tabIndex]=\"disabled ? -1 : tabIndex\"\n [formControl]=\"queryControl\"\n [readOnly]=\"!allowQuery\"\n />\n </div>\n <div class=\"iconContainer\">\n @if ((selection || selection === 0) && allowClear && !disabled) {\n <i class=\"far fa-times\" (click)=\"removeSelection()\"></i>\n }\n <i #toggle class=\"fas fa-angle-down\" aria-hidden=\"true\"></i>\n </div>\n </div>\n <div class=\"optionsContainer\" #optionsContainer>\n @if (dropdownOpen) {\n <ng-container *ngTemplateOutlet=\"dropdownTmpl\" />\n }\n </div>\n</div>\n\n<ng-template #selectedOption>\n <ng-content select=\".selectedOption\" />\n</ng-template>\n<ng-template #dropdown>\n <ng-content select=\".dropdownComponent\" />\n</ng-template>\n", styles: [":host ::ng-deep .selectedOption{overflow:hidden;text-overflow:ellipsis}.selectContainer{position:relative;height:auto;padding:0;box-sizing:border-box;background:#fff;border:1px solid #99a5bb;box-shadow:inset 0 1px 1px #00000012;border-radius:3px}.selectContainer.grayBackground{background:#eaedf1;border-color:#eaedf1;box-shadow:none}.selectContainer.open{z-index:1049;background:#fff;border:1px solid #e1e5eb}.selectContainer.open.bottom{box-shadow:0 6px 6px #21252933;border-bottom-color:#fff;border-bottom-left-radius:0;border-bottom-right-radius:0}.selectContainer.open.bottom .optionsContainer{border-bottom:solid 1px #e1e5eb;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;box-shadow:0 6px 6px #21252933;top:100%;border-top:0;border-top-left-radius:0;border-top-right-radius:0}.selectContainer.open.top{box-shadow:0 -4px 6px #21252933;border-top:0;border-top-left-radius:0;border-top-right-radius:0}.selectContainer.open.top .optionsContainer{border-bottom:solid 1px #e1e5eb;border-left:solid 1px #e1e5eb;border-right:solid 1px #e1e5eb;box-shadow:0 -4px 6px #21252933;margin-bottom:0;border-bottom:0;border-bottom-left-radius:0;border-bottom-right-radius:0;top:none;bottom:100%}.selectContainer:not(.open).focused{outline:0;border:1px solid #99c6fa}.selectContainer:not(.open).focusedVisible{outline:1px auto Highlight;outline:1px auto -webkit-focus-ring-color}.selectContainer.disabled{background-color:#eaedf1;cursor:not-allowed!important}.selectContainer.defaultPadding .selectionContainer{padding-left:12px}.selectContainer.narrowPadding .selectionContainer{padding-left:4px}.selectContainer .lightgrayColor{color:#8594ad}.selectionContainer{display:flex}.inputContainer{flex:1;position:relative;white-space:nowrap}.queryInput{width:100%;appearance:none;border:0;padding-left:0;background:transparent;position:relative;cursor:inherit}.queryInput::-ms-clear{display:none}.queryInput:focus{outline:0}.queryInput.isHidden{opacity:0}.placeholder{position:absolute;width:100%;text-align:left;color:#8594ad;overflow:hidden;word-break:break-all;white-space:nowrap;text-overflow:ellipsis}.iconContainer{display:flex;align-items:center;text-align:center}.iconContainer .far,.iconContainer .fas{width:10px;cursor:pointer}.disabled .iconContainer .far,.disabled .iconContainer .fas{cursor:inherit;color:#8594ad}.iconContainer .fa-angle-down{margin:0 12px}.iconContainer .fa-times{margin-left:4px}.selection{width:100%;position:absolute;display:flex;align-items:center}.selection.lowerOpacity{opacity:.7}.backdrop{position:fixed;inset:0;z-index:1048}.optionsContainer{position:absolute;left:-1px;right:-1px;padding:0;border-radius:3px;background:#fff;z-index:1001}.defaultSize .inputContainer,.defaultSize .queryInput,.defaultSize .selection,.defaultSize .iconContainer{height:29px}.defaultSize .inputContainer{line-height:29px}.defaultSize .selectionContainer{min-height:29px}.smallSize .inputContainer,.smallSize .queryInput,.smallSize .selection,.smallSize .iconContainer{height:22px}.smallSize .inputContainer{line-height:22px}.smallSize .selectionContainer{min-height:22px}.select2Size .inputContainer,.select2Size .queryInput,.select2Size .selection,.select2Size .iconContainer{height:26px}.select2Size .inputContainer{line-height:26px}.select2Size .selectionContainer{min-height:26px}.largeSize .inputContainer,.largeSize .queryInput,.largeSize .selection,.largeSize .iconContainer{height:40px}.largeSize .inputContainer{line-height:40px}.largeSize .selectionContainer{min-height:40px}\n"] }]
|
|
8371
8338
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { selection: [{
|
|
8372
8339
|
type: Input
|
|
8373
8340
|
}], selectionBackground: [{
|
|
@@ -8420,7 +8387,7 @@ class SortingDropdownTriggerComponent {
|
|
|
8420
8387
|
}
|
|
8421
8388
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: SortingDropdownTriggerComponent, decorators: [{
|
|
8422
8389
|
type: Component,
|
|
8423
|
-
args: [{ selector: 'lx-sorting-dropdown-trigger',
|
|
8390
|
+
args: [{ selector: 'lx-sorting-dropdown-trigger', imports: [ButtonComponent], template: "<button lx-button mode=\"link\" [disabled]=\"disabled\" endIcon=\"fa-angle-down\">\n {{ label ? label + ': ' : '' }}{{ currentSortingLabel }}\n</button>\n" }]
|
|
8424
8391
|
}], propDecorators: { label: [{
|
|
8425
8392
|
type: Input
|
|
8426
8393
|
}], currentSortingLabel: [{
|
|
@@ -8470,7 +8437,7 @@ class SortingDropdownComponent {
|
|
|
8470
8437
|
}
|
|
8471
8438
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: SortingDropdownComponent, decorators: [{
|
|
8472
8439
|
type: Component,
|
|
8473
|
-
args: [{ selector: 'lx-sorting-dropdown',
|
|
8440
|
+
args: [{ selector: 'lx-sorting-dropdown', imports: [
|
|
8474
8441
|
OptionsDropdownComponent,
|
|
8475
8442
|
SortingDropdownTriggerComponent,
|
|
8476
8443
|
KeyboardActionSourceDirective,
|
|
@@ -8519,7 +8486,7 @@ class SwitchComponent {
|
|
|
8519
8486
|
}
|
|
8520
8487
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: SwitchComponent, decorators: [{
|
|
8521
8488
|
type: Component,
|
|
8522
|
-
args: [{ selector: 'lx-switch', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
8489
|
+
args: [{ selector: 'lx-switch', changeDetection: ChangeDetectionStrategy.OnPush, template: "<div\n class=\"wrapper\"\n [class.withLabel]=\"label\"\n [class.withLabelBehind]=\"label && !labelInFront\"\n [class.disabled]=\"disabled\"\n [attr.id]=\"id\"\n [class.small]=\"size === 'small'\"\n>\n @if (label) {\n <span class=\"labelText\" [class.off]=\"!value\">{{ label }}</span>\n }\n <label class=\"checkbox\" [class.small]=\"size === 'small'\">\n <input\n #inputRef\n type=\"checkbox\"\n [checked]=\"value\"\n [disabled]=\"disabled\"\n (click)=\"inputRef.blur()\"\n (change)=\"onToggle()\"\n (keydown.space)=\"focus(inputRef)\"\n (keydown.enter)=\"onToggle()\"\n />\n <span class=\"slider\"></span>\n </label>\n</div>\n", styles: [":host{display:block}.wrapper{display:flex;align-items:center;justify-content:space-between;gap:4px}.wrapper.withLabel{flex-direction:row}.wrapper.withLabelBehind{flex-direction:row-reverse}.disabled{opacity:.5}.disabled .slider{cursor:default}.checkbox{position:relative;display:inline-block;margin:0}.labelText{color:#2a303d}.labelText.off{color:#526179}input{opacity:0;width:0;height:0;margin:0;padding:0}.small.checkbox{width:22px;height:14px}.small.wrapper:not(.withLabel){height:14px}.small .labelText{font-size:var(--lxFontSize, 14px)}.small .slider{border-radius:7px}.small .slider:before{height:12px;width:12px;left:1px;bottom:1px}.small input:checked+.slider:before{transform:translate(8px)}input:focus+.slider:before{box-shadow:0 0 0 6px #0003;transition:box-shadow .2s ease}.slider{position:absolute;cursor:pointer;inset:0;background-color:#b2bccc;transition:transform .2s}.slider:before{position:absolute;content:\"\";border-radius:50%;background-color:#fff;transition:transform .2s}input:checked+.slider{background-color:#33cc58}\n"] }]
|
|
8523
8490
|
}], propDecorators: { value: [{
|
|
8524
8491
|
type: Input
|
|
8525
8492
|
}], size: [{
|
|
@@ -8666,8 +8633,7 @@ class ContenteditableDirective {
|
|
|
8666
8633
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ContenteditableDirective, decorators: [{
|
|
8667
8634
|
type: Directive,
|
|
8668
8635
|
args: [{
|
|
8669
|
-
selector: '[lxContenteditableModel]'
|
|
8670
|
-
standalone: true
|
|
8636
|
+
selector: '[lxContenteditableModel]'
|
|
8671
8637
|
}]
|
|
8672
8638
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i1$7.DomSanitizer }], propDecorators: { lxContenteditableModel: [{
|
|
8673
8639
|
type: Input
|
|
@@ -8714,8 +8680,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
8714
8680
|
type: Directive,
|
|
8715
8681
|
args: [{
|
|
8716
8682
|
// eslint-disable-next-line @angular-eslint/directive-selector
|
|
8717
|
-
selector: 'form'
|
|
8718
|
-
standalone: true
|
|
8683
|
+
selector: 'form'
|
|
8719
8684
|
}]
|
|
8720
8685
|
}], ctorParameters: () => [{ type: i0.ElementRef }] });
|
|
8721
8686
|
|
|
@@ -8800,8 +8765,7 @@ class FormErrorDirective {
|
|
|
8800
8765
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FormErrorDirective, decorators: [{
|
|
8801
8766
|
type: Directive,
|
|
8802
8767
|
args: [{
|
|
8803
|
-
selector: '[lxFormError]'
|
|
8804
|
-
standalone: true
|
|
8768
|
+
selector: '[lxFormError]'
|
|
8805
8769
|
}]
|
|
8806
8770
|
}], ctorParameters: () => [{ type: i0.ViewContainerRef }, { type: i0.ComponentFactoryResolver }, { type: i1.TranslateService }, { type: i0.DestroyRef }, { type: i1$5.NgControl, decorators: [{
|
|
8807
8771
|
type: Optional
|
|
@@ -8855,8 +8819,7 @@ class FilterSelectionPipe {
|
|
|
8855
8819
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FilterSelectionPipe, decorators: [{
|
|
8856
8820
|
type: Pipe,
|
|
8857
8821
|
args: [{
|
|
8858
|
-
name: 'lxFilterBySelection'
|
|
8859
|
-
standalone: true
|
|
8822
|
+
name: 'lxFilterBySelection'
|
|
8860
8823
|
}]
|
|
8861
8824
|
}] });
|
|
8862
8825
|
|
|
@@ -8881,8 +8844,7 @@ class FilterTermPipe {
|
|
|
8881
8844
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FilterTermPipe, decorators: [{
|
|
8882
8845
|
type: Pipe,
|
|
8883
8846
|
args: [{
|
|
8884
|
-
name: 'lxFilterByTerm'
|
|
8885
|
-
standalone: true
|
|
8847
|
+
name: 'lxFilterByTerm'
|
|
8886
8848
|
}]
|
|
8887
8849
|
}] });
|
|
8888
8850
|
|
|
@@ -8939,8 +8901,7 @@ class FormatNumberPipe {
|
|
|
8939
8901
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: FormatNumberPipe, decorators: [{
|
|
8940
8902
|
type: Pipe,
|
|
8941
8903
|
args: [{
|
|
8942
|
-
name: 'lxFormatNumber'
|
|
8943
|
-
standalone: true
|
|
8904
|
+
name: 'lxFormatNumber'
|
|
8944
8905
|
}]
|
|
8945
8906
|
}], ctorParameters: () => [{ type: Function, decorators: [{
|
|
8946
8907
|
type: Inject,
|
|
@@ -9277,8 +9238,7 @@ class MaxLengthCounterDirective {
|
|
|
9277
9238
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: MaxLengthCounterDirective, decorators: [{
|
|
9278
9239
|
type: Directive,
|
|
9279
9240
|
args: [{
|
|
9280
|
-
selector: '[lxMaxLengthCounter]'
|
|
9281
|
-
standalone: true
|
|
9241
|
+
selector: '[lxMaxLengthCounter]'
|
|
9282
9242
|
}]
|
|
9283
9243
|
}], ctorParameters: () => [{ type: i0.ElementRef }, { type: i0.Renderer2 }, { type: i1$5.NgControl, decorators: [{
|
|
9284
9244
|
type: Self
|
|
@@ -9375,7 +9335,7 @@ class ModalFooterComponent {
|
|
|
9375
9335
|
}
|
|
9376
9336
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ModalFooterComponent, decorators: [{
|
|
9377
9337
|
type: Component,
|
|
9378
|
-
args: [{ selector: 'lx-modal-footer',
|
|
9338
|
+
args: [{ selector: 'lx-modal-footer', template: "<div class=\"footerContainer\" [class.border]=\"border\">\n <ng-content />\n</div>\n", styles: [":host{display:block;text-align:right;--modal-footer-padding-left: 90px;--modal-footer-padding-right: 0;--modal-footer-display: block}:host-context(.fullscreen) .footerContainer{padding-left:var(--modal-footer-padding-left);padding-right:var(--modal-footer-padding-right);height:70px}:host-context(.dialog) .footerContainer,:host-context(.dialog-large) .footerContainer{padding:16px;height:64px;border-radius:0 0 6px 6px;display:var(--modal-footer-display)}.footerContainer.border{border-top:1px solid #cfd5df}\n"] }]
|
|
9379
9339
|
}], propDecorators: { border: [{
|
|
9380
9340
|
type: Input
|
|
9381
9341
|
}] } });
|
|
@@ -9390,7 +9350,7 @@ class ModalHeaderComponent {
|
|
|
9390
9350
|
}
|
|
9391
9351
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ModalHeaderComponent, decorators: [{
|
|
9392
9352
|
type: Component,
|
|
9393
|
-
args: [{ selector: 'lx-modal-header',
|
|
9353
|
+
args: [{ selector: 'lx-modal-header', template: "<div class=\"headerContainer\" [class.bottomBorder]=\"bottomBorder\">\n <ng-content />\n @if (title.length > 0) {\n <h1 class=\"lx-heading-2\">{{ title }}</h1>\n }\n</div>\n", styles: [":host{display:block}:host.lxModalHeaderOneLine h1{white-space:nowrap;overflow:hidden;text-overflow:ellipsis;max-width:var(--lx-modal-header-max-width)}:host-context(.fullscreen) .headerContainer{padding:24px 90px;border-bottom:none}:host-context(.fullscreen) .headerContainer.bottomBorder{border-bottom:1px solid #cfd5df}:host-context(.dialog) .headerContainer,:host-context(.dialog-large) .headerContainer{padding:24px 16px;border-radius:6px 6px 0 0}:host-context(.dialog) .headerContainer h1,:host-context(.dialog-large) .headerContainer h1{word-break:break-word}h1{margin:0 auto;padding:0;color:#2a303d;text-align:center}.headerContainer{display:flex}.headerContainer.bottomBorder{border-bottom:1px solid #cfd5df}\n"] }]
|
|
9394
9354
|
}], propDecorators: { title: [{
|
|
9395
9355
|
type: Input
|
|
9396
9356
|
}], bottomBorder: [{
|
|
@@ -9404,8 +9364,7 @@ class ModalContentDirective {
|
|
|
9404
9364
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: ModalContentDirective, decorators: [{
|
|
9405
9365
|
type: Directive,
|
|
9406
9366
|
args: [{
|
|
9407
|
-
selector: '[lxModalContent]'
|
|
9408
|
-
standalone: true
|
|
9367
|
+
selector: '[lxModalContent]'
|
|
9409
9368
|
}]
|
|
9410
9369
|
}] });
|
|
9411
9370
|
|
|
@@ -9610,7 +9569,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
9610
9569
|
transition(':enter', [style({ opacity: 0 }), animate('0.15s', style({ opacity: 1 }))]),
|
|
9611
9570
|
transition(':leave', animate('0.15s', style({ opacity: 0 })))
|
|
9612
9571
|
])
|
|
9613
|
-
],
|
|
9572
|
+
], imports: [PortalModule, NgTemplateOutlet, TranslateModule, CommonModule], template: "<ng-template cdkPortal>\n @if (open) {\n <div\n role=\"dialog\"\n class=\"lxmodal\"\n [class.lxmodal--fullscreen]=\"size === 'fullscreen'\"\n [class.lxmodal--dialog]=\"size === 'dialog'\"\n [class.lxmodal--dialog-large]=\"size === 'dialog-large'\"\n [class.lxmodal--withFooter]=\"!!footer\"\n [class.lxmodal--verticalScroll]=\"verticalScroll\"\n @modal\n >\n @if (size === 'fullscreen' && showBackButton) {\n <div (click)=\"emitBack()\" (keyup.enter)=\"emitBack()\" tabindex=\"0\" role=\"button\" class=\"fal fa-long-arrow-left\"></div>\n }\n @if (showCloseButton) {\n <!-- TODO lx-button doesn't comply with modal close button style yet -->\n <!-- eslint-disable-next-line @nx/workspace-no-icon-in-button-content -->\n <button\n (click)=\"closeModal(closeLocation.CloseButton)\"\n [attr.aria-label]=\"NAME + '.close' | translate\"\n class=\"fal fa-times closeButton\"\n ></button>\n }\n @if (header) {\n <ng-content select=\"lx-modal-header\" />\n }\n <div class=\"modalContentContainer\" [class.lxThinScrollbar]=\"verticalScroll\">\n <ng-container *ngTemplateOutlet=\"content\" />\n </div>\n @if (footer) {\n <ng-content select=\"lx-modal-footer\" />\n }\n </div>\n }\n</ng-template>\n<ng-template #implicitContent>\n <ng-content />\n</ng-template>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.lxmodal{background:#fff;width:100%}.lxmodal--withFooter.lxmodal--fullscreen.lxmodal--verticalScroll .modalContentContainer{overflow-y:auto;padding:16px}.lxmodal--withFooter.lxmodal--fullscreen:not(.lxmodal--verticalScroll) .modalContentContainer{bottom:70px;overflow:hidden}.lxmodal--verticalScroll .modalContentContainer{overflow-y:auto;padding:16px}.lxmodal--fullscreen{height:100%;display:flex;flex-direction:column}.lxmodal--fullscreen .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;width:48px;height:48px;line-height:48px;right:36px;top:12px;z-index:1}.lxmodal--fullscreen .closeButton:before{cursor:pointer}.lxmodal--fullscreen .closeButton:hover,.lxmodal--fullscreen .closeButton:focus{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .closeButton:focus{outline:0}.lxmodal--fullscreen .fa-long-arrow-left{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;width:48px;height:48px;line-height:48px;left:36px;top:16px}.lxmodal--fullscreen .fa-long-arrow-left:before{cursor:pointer}.lxmodal--fullscreen .fa-long-arrow-left:hover,.lxmodal--fullscreen .fa-long-arrow-left:focus{color:#526179;background-color:#eaedf1}.lxmodal--fullscreen .fa-long-arrow-left:focus{outline:0}.lxmodal--dialog,.lxmodal--dialog-large{display:block;position:relative;border-radius:6px;box-shadow:0 8px 20px #0000003d}.lxmodal--dialog .modalContentContainer,.lxmodal--dialog-large .modalContentContainer{position:relative}.lxmodal--dialog .closeButton,.lxmodal--dialog-large .closeButton{border:0;background:transparent;position:absolute;text-align:center;transition:color,background-color .18s;transition-delay:.1s;transition-timing-function:ease;border-radius:50%;color:#61779d;font-size:26px;height:32px;width:32px;z-index:999;right:10px;top:20px}.lxmodal--dialog .closeButton:before,.lxmodal--dialog-large .closeButton:before{cursor:pointer}.lxmodal--dialog .closeButton:hover,.lxmodal--dialog .closeButton:focus,.lxmodal--dialog-large .closeButton:hover,.lxmodal--dialog-large .closeButton:focus{color:#526179;background-color:#eaedf1}.lxmodal--dialog .closeButton:focus,.lxmodal--dialog-large .closeButton:focus{outline:0}.lxmodal--dialog .modalContentContainer{padding:16px 16px 0}.lxmodal--dialog.lxmodal--verticalScroll .modalContentContainer{padding:16px;max-height:calc(84vh - 136px)}.lxmodal--dialog-large .modalContentContainer{padding:16px;height:calc(100% - 136px)}.modalContentContainer{flex:1}\n"] }]
|
|
9614
9573
|
}], ctorParameters: () => [{ type: i1$2.Overlay }, { type: i0.Renderer2 }, { type: i5.Observable, decorators: [{
|
|
9615
9574
|
type: Optional
|
|
9616
9575
|
}, {
|
|
@@ -9701,8 +9660,7 @@ class PopoverContentDirective {
|
|
|
9701
9660
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: PopoverContentDirective, decorators: [{
|
|
9702
9661
|
type: Directive,
|
|
9703
9662
|
args: [{
|
|
9704
|
-
selector: '[lxPopoverContent]'
|
|
9705
|
-
standalone: true
|
|
9663
|
+
selector: '[lxPopoverContent]'
|
|
9706
9664
|
}]
|
|
9707
9665
|
}] });
|
|
9708
9666
|
|
|
@@ -9894,7 +9852,7 @@ class PopoverComponent {
|
|
|
9894
9852
|
}
|
|
9895
9853
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: PopoverComponent, decorators: [{
|
|
9896
9854
|
type: Component,
|
|
9897
|
-
args: [{ selector: 'lx-popover',
|
|
9855
|
+
args: [{ selector: 'lx-popover', imports: [SatPopoverModule, NgClass, NgTemplateOutlet], template: "<sat-popover\n [anchor]=\"trigger.anchor\"\n [horizontalAlign]=\"horizontalAlign\"\n [verticalAlign]=\"verticalAlign\"\n [restoreFocus]=\"restoreFocus\"\n [lockAlignment]=\"true\"\n [autoFocus]=\"autoFocus\"\n [hasBackdrop]=\"hasBackdrop\"\n openTransition=\"0ms\"\n closeTransition=\"0ms\"\n (opened)=\"onOpen()\"\n (afterOpen)=\"onAfterOpen()\"\n (closed)=\"onClose()\"\n>\n <div\n class=\"popoverContainer\"\n [ngClass]=\"marginClasses\"\n [class.overflowHidden]=\"!allowOverflow\"\n (mouseenter)=\"trigger.showPopover(true)\"\n (mouseleave)=\"!hasBackdrop && trigger.closePopover(true)\"\n (keydown.escape)=\"$event.stopPropagation(); trigger.closePopover(true)\"\n >\n @if (isOpen) {\n <ng-container *ngTemplateOutlet=\"content\" />\n }\n </div>\n</sat-popover>\n<ng-template #implicitContent>\n <ng-content />\n</ng-template>\n", styles: ["@keyframes subtleScaleUpKeyFrames{0%{transform:scale(.95);opacity:0}}.popoverContainer{position:relative;box-shadow:0 8px 12px 2px #00000026;max-width:600px;max-height:80vh;border-radius:3px;background-color:#fff;hyphens:auto;animation:subtleScaleUpKeyFrames .2s ease}.popoverContainer.overflowHidden{overflow:hidden}.right{margin-left:18px}.left{margin-right:18px}.bottom{margin-top:18px}.top{margin-bottom:18px}\n"] }]
|
|
9898
9856
|
}], propDecorators: { trigger: [{
|
|
9899
9857
|
type: Input
|
|
9900
9858
|
}], horizontalAlign: [{
|
|
@@ -9963,8 +9921,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
9963
9921
|
type: Directive,
|
|
9964
9922
|
args: [{
|
|
9965
9923
|
exportAs: 'clickAnchor',
|
|
9966
|
-
selector: '[lxPopoverClick]'
|
|
9967
|
-
standalone: true
|
|
9924
|
+
selector: '[lxPopoverClick]'
|
|
9968
9925
|
}]
|
|
9969
9926
|
}], ctorParameters: () => [{ type: i1$3.SatPopoverAnchorDirective }], propDecorators: { lxPopoverPinned: [{
|
|
9970
9927
|
type: Input
|
|
@@ -10040,8 +9997,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImpor
|
|
|
10040
9997
|
type: Directive,
|
|
10041
9998
|
args: [{
|
|
10042
9999
|
exportAs: 'hoverAnchor',
|
|
10043
|
-
selector: '[lxPopoverHover]'
|
|
10044
|
-
standalone: true
|
|
10000
|
+
selector: '[lxPopoverHover]'
|
|
10045
10001
|
}]
|
|
10046
10002
|
}], ctorParameters: () => [{ type: i1$3.SatPopoverAnchorDirective }], propDecorators: { lxPopoverHover: [{
|
|
10047
10003
|
type: Input
|
|
@@ -10147,7 +10103,7 @@ __decorate([
|
|
|
10147
10103
|
], TabComponent.prototype, "routerLinkActive$", void 0);
|
|
10148
10104
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TabComponent, decorators: [{
|
|
10149
10105
|
type: Component,
|
|
10150
|
-
args: [{ selector: 'lx-tab', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
10106
|
+
args: [{ selector: 'lx-tab', changeDetection: ChangeDetectionStrategy.OnPush, imports: [RouterLinkActive, RouterLink, CounterComponent, PortalModule, NgTemplateOutlet], template: "<li\n #tabElement\n class=\"tab\"\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 (click)=\"select()\"\n (keydown)=\"handleKeyDown($event)\"\n role=\"tab\"\n [attr.id]=\"tabId\"\n [attr.aria-selected]=\"isActive\"\n [attr.tabindex]=\"isActive ? '0' : '-1'\"\n>\n @if (tabLink) {\n <a tabindex=\"-1\" [routerLink]=\"tabLink\" routerLinkActive [routerLinkActiveOptions]=\"routerLinkActiveOptions\">\n <ng-container *ngTemplateOutlet=\"portalTab\" />\n </a>\n } @else {\n <ng-container *ngTemplateOutlet=\"portalTab\" />\n }\n <ng-template #portalTab>\n @if (icon) {\n <i class=\"icon {{ icon }}\"></i>\n }\n @if (label) {\n <span class=\"tabLabel\">{{ label }}</span>\n }\n @if (counter) {\n <lx-counter [size]=\"counterBadgeSize\" [content]=\"counter\" [color]=\"'gray'\" />\n }\n </ng-template>\n <ng-template cdkPortal #contentTemplate=\"cdkPortal\">\n @if (!tabLink) {\n <div class=\"content\" role=\"tabpanel\">\n <ng-content />\n </div>\n }\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:var(--lx-primarybutton-backgroundcolor)}.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 a:focus{outline:0}.routerLinkTab.active a,.routerLinkTab.disabled a{cursor:default}.icon{font-size:var(--lxFontLargeSize, 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:14.5px;text-decoration:none}.content{height:100%}lx-counter{margin-left:8px}\n"] }]
|
|
10151
10107
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }, { type: i1$8.Router }, { type: i1$8.ActivatedRoute }], propDecorators: { icon: [{
|
|
10152
10108
|
type: Input
|
|
10153
10109
|
}], label: [{
|
|
@@ -10309,7 +10265,7 @@ __decorate([
|
|
|
10309
10265
|
], TabGroupComponent.prototype, "tabsQueryList$", void 0);
|
|
10310
10266
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.6", ngImport: i0, type: TabGroupComponent, decorators: [{
|
|
10311
10267
|
type: Component,
|
|
10312
|
-
args: [{ selector: 'lx-tab-group', changeDetection: ChangeDetectionStrategy.OnPush,
|
|
10268
|
+
args: [{ selector: 'lx-tab-group', changeDetection: ChangeDetectionStrategy.OnPush, imports: [PortalModule], template: "<ul\n #tabListElement\n class=\"tabs\"\n role=\"tablist\"\n (focusout)=\"onFocusOut($event)\"\n [attr.aria-owns]=\"tabIds.join(' ')\"\n [class.centered]=\"isCentered\"\n>\n <ng-content />\n</ul>\n\n<ng-template [cdkPortalOutlet]=\"activeTabPortal\" />\n", styles: [":host{--tab-group-padding-y: 0}.tabs{display:inline-block;list-style:none;border-bottom:solid 1px #cfd5df;width:100%;margin:0;padding:0 var(--tab-group-padding-y);text-align:left}.tabs.centered{text-align:center}\n"] }]
|
|
10313
10269
|
}], ctorParameters: () => [{ type: i0.ChangeDetectorRef }], propDecorators: { isCentered: [{
|
|
10314
10270
|
type: Input
|
|
10315
10271
|
}], selectedIndex: [{
|