@leanix/components 0.4.420 → 0.4.422
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/esm2022/lib/core-ui/components/empty-state/empty-state.component.mjs +8 -4
- package/esm2022/lib/modal-ui/components/modal-header/modal-header.component.mjs +3 -3
- package/fesm2022/leanix-components.mjs +8 -4
- package/fesm2022/leanix-components.mjs.map +1 -1
- package/lib/core-ui/components/empty-state/empty-state.component.d.ts +3 -1
- package/package.json +1 -1
|
@@ -1,4 +1,4 @@
|
|
|
1
|
-
import { CommonModule
|
|
1
|
+
import { CommonModule } from '@angular/common';
|
|
2
2
|
import { Component, EventEmitter, HostBinding, Output, computed, input } from '@angular/core';
|
|
3
3
|
import { RouterLink } from '@angular/router';
|
|
4
4
|
import { ButtonComponent } from '../button/button.component';
|
|
@@ -8,6 +8,7 @@ export class EmptyStateComponent {
|
|
|
8
8
|
this.title = input.required();
|
|
9
9
|
this.icon = input();
|
|
10
10
|
this.buttonLabel = input();
|
|
11
|
+
this.secondaryButtonLabel = input();
|
|
11
12
|
this.loading = input(false);
|
|
12
13
|
this.moreLinkLabel = input();
|
|
13
14
|
this.moreLink = input();
|
|
@@ -15,23 +16,26 @@ export class EmptyStateComponent {
|
|
|
15
16
|
this.size = input('medium');
|
|
16
17
|
this.useRouterLink = computed(() => Array.isArray(this.moreLink()));
|
|
17
18
|
this.buttonClicked = new EventEmitter();
|
|
19
|
+
this.secondaryButtonClicked = new EventEmitter();
|
|
18
20
|
this.moreLinkClicked = new EventEmitter();
|
|
19
21
|
}
|
|
20
22
|
get _size() {
|
|
21
23
|
return this.size();
|
|
22
24
|
}
|
|
23
25
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: EmptyStateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
24
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: EmptyStateComponent, isStandalone: true, selector: "lx-empty-state", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, buttonLabel: { classPropertyName: "buttonLabel", publicName: "buttonLabel", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, moreLinkLabel: { classPropertyName: "moreLinkLabel", publicName: "moreLinkLabel", isSignal: true, isRequired: false, transformFunction: null }, moreLink: { classPropertyName: "moreLink", publicName: "moreLink", isSignal: true, isRequired: false, transformFunction: null }, openMoreLinkInNewTab: { classPropertyName: "openMoreLinkInNewTab", publicName: "openMoreLinkInNewTab", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClicked: "buttonClicked", moreLinkClicked: "moreLinkClicked" }, host: { properties: { "attr.size": "this._size" } }, ngImport: i0, 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-font-bold 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 @if (buttonLabel()) {\n
|
|
26
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: EmptyStateComponent, isStandalone: true, selector: "lx-empty-state", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, buttonLabel: { classPropertyName: "buttonLabel", publicName: "buttonLabel", isSignal: true, isRequired: false, transformFunction: null }, secondaryButtonLabel: { classPropertyName: "secondaryButtonLabel", publicName: "secondaryButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, moreLinkLabel: { classPropertyName: "moreLinkLabel", publicName: "moreLinkLabel", isSignal: true, isRequired: false, transformFunction: null }, moreLink: { classPropertyName: "moreLink", publicName: "moreLink", isSignal: true, isRequired: false, transformFunction: null }, openMoreLinkInNewTab: { classPropertyName: "openMoreLinkInNewTab", publicName: "openMoreLinkInNewTab", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClicked: "buttonClicked", secondaryButtonClicked: "secondaryButtonClicked", moreLinkClicked: "moreLinkClicked" }, host: { properties: { "attr.size": "this._size" } }, ngImport: i0, 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-font-bold 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(--sapFontSize, 13.5px)}:host[size=small] .empty-state-content{font-size:var(--lxFontSmallSize, 12px)}:host[size=medium] .empty-state-title{font-size:24px}:host[size=medium] .empty-state-content{font-size:13px}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"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonComponent, selector: "button[lx-button]", inputs: ["size", "color", "mode", "pressed", "selected", "square", "circle", "disabled", "showSpinner"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
|
|
25
27
|
}
|
|
26
28
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: EmptyStateComponent, decorators: [{
|
|
27
29
|
type: Component,
|
|
28
|
-
args: [{ selector: 'lx-empty-state', standalone: true, imports: [CommonModule,
|
|
30
|
+
args: [{ selector: 'lx-empty-state', standalone: true, imports: [CommonModule, 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-font-bold 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(--sapFontSize, 13.5px)}:host[size=small] .empty-state-content{font-size:var(--lxFontSmallSize, 12px)}:host[size=medium] .empty-state-title{font-size:24px}:host[size=medium] .empty-state-content{font-size:13px}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"] }]
|
|
29
31
|
}], propDecorators: { _size: [{
|
|
30
32
|
type: HostBinding,
|
|
31
33
|
args: ['attr.size']
|
|
32
34
|
}], buttonClicked: [{
|
|
33
35
|
type: Output
|
|
36
|
+
}], secondaryButtonClicked: [{
|
|
37
|
+
type: Output
|
|
34
38
|
}], moreLinkClicked: [{
|
|
35
39
|
type: Output
|
|
36
40
|
}] } });
|
|
37
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
41
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoiZW1wdHktc3RhdGUuY29tcG9uZW50LmpzIiwic291cmNlUm9vdCI6IiIsInNvdXJjZXMiOlsiLi4vLi4vLi4vLi4vLi4vLi4vLi4vLi4vbGlicy9jb21wb25lbnRzL3NyYy9saWIvY29yZS11aS9jb21wb25lbnRzL2VtcHR5LXN0YXRlL2VtcHR5LXN0YXRlLmNvbXBvbmVudC50cyIsIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9zcmMvbGliL2NvcmUtdWkvY29tcG9uZW50cy9lbXB0eS1zdGF0ZS9lbXB0eS1zdGF0ZS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsWUFBWSxFQUFFLE1BQU0saUJBQWlCLENBQUM7QUFDL0MsT0FBTyxFQUFFLFNBQVMsRUFBRSxZQUFZLEVBQUUsV0FBVyxFQUFFLE1BQU0sRUFBVSxRQUFRLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDO0FBQ3RHLE9BQU8sRUFBRSxVQUFVLEVBQUUsTUFBTSxpQkFBaUIsQ0FBQztBQUM3QyxPQUFPLEVBQUUsZUFBZSxFQUFFLE1BQU0sNEJBQTRCLENBQUM7O0FBUzdELE1BQU0sT0FBTyxtQkFBbUI7SUFQaEM7UUFRRSxVQUFLLEdBQUcsS0FBSyxDQUFDLFFBQVEsRUFBVSxDQUFDO1FBRWpDLFNBQUksR0FBRyxLQUFLLEVBQVUsQ0FBQztRQUN2QixnQkFBVyxHQUFHLEtBQUssRUFBVSxDQUFDO1FBQzlCLHlCQUFvQixHQUFHLEtBQUssRUFBVSxDQUFDO1FBQ3ZDLFlBQU8sR0FBRyxLQUFLLENBQVUsS0FBSyxDQUFDLENBQUM7UUFDaEMsa0JBQWEsR0FBRyxLQUFLLEVBQVUsQ0FBQztRQUNoQyxhQUFRLEdBQUcsS0FBSyxFQUFxQixDQUFDO1FBQ3RDLHlCQUFvQixHQUFHLEtBQUssQ0FBVSxJQUFJLENBQUMsQ0FBQztRQUM1QyxTQUFJLEdBQUcsS0FBSyxDQUFxQixRQUFRLENBQUMsQ0FBQztRQUVwQyxrQkFBYSxHQUFvQixRQUFRLENBQUMsR0FBRyxFQUFFLENBQUMsS0FBSyxDQUFDLE9BQU8sQ0FBQyxJQUFJLENBQUMsUUFBUSxFQUFFLENBQUMsQ0FBQyxDQUFDO1FBTzdFLGtCQUFhLEdBQUcsSUFBSSxZQUFZLEVBQWMsQ0FBQztRQUMvQywyQkFBc0IsR0FBRyxJQUFJLFlBQVksRUFBYyxDQUFDO1FBQ3hELG9CQUFlLEdBQUcsSUFBSSxZQUFZLEVBQWMsQ0FBQztLQUM1RDtJQVJDLElBQ0ksS0FBSztRQUNQLE9BQU8sSUFBSSxDQUFDLElBQUksRUFBRSxDQUFDO0lBQ3JCLENBQUM7OEdBakJVLG1CQUFtQjtrR0FBbkIsbUJBQW1CLGs5Q0NaaEMsMHVEQXFEQSxvbEJEN0NZLFlBQVksK0JBQUUsZUFBZSx1S0FBRSxVQUFVOzsyRkFJeEMsbUJBQW1CO2tCQVAvQixTQUFTOytCQUNFLGdCQUFnQixjQUNkLElBQUksV0FDUCxDQUFDLFlBQVksRUFBRSxlQUFlLEVBQUUsVUFBVSxDQUFDOzhCQW1CaEQsS0FBSztzQkFEUixXQUFXO3VCQUFDLFdBQVc7Z0JBS2QsYUFBYTtzQkFBdEIsTUFBTTtnQkFDRyxzQkFBc0I7c0JBQS9CLE1BQU07Z0JBQ0csZUFBZTtzQkFBeEIsTUFBTSIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IENvbW1vbk1vZHVsZSB9IGZyb20gJ0Bhbmd1bGFyL2NvbW1vbic7XG5pbXBvcnQgeyBDb21wb25lbnQsIEV2ZW50RW1pdHRlciwgSG9zdEJpbmRpbmcsIE91dHB1dCwgU2lnbmFsLCBjb21wdXRlZCwgaW5wdXQgfSBmcm9tICdAYW5ndWxhci9jb3JlJztcbmltcG9ydCB7IFJvdXRlckxpbmsgfSBmcm9tICdAYW5ndWxhci9yb3V0ZXInO1xuaW1wb3J0IHsgQnV0dG9uQ29tcG9uZW50IH0gZnJvbSAnLi4vYnV0dG9uL2J1dHRvbi5jb21wb25lbnQnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdseC1lbXB0eS1zdGF0ZScsXG4gIHN0YW5kYWxvbmU6IHRydWUsXG4gIGltcG9ydHM6IFtDb21tb25Nb2R1bGUsIEJ1dHRvbkNvbXBvbmVudCwgUm91dGVyTGlua10sXG4gIHRlbXBsYXRlVXJsOiAnLi9lbXB0eS1zdGF0ZS5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsOiAnLi9lbXB0eS1zdGF0ZS5jb21wb25lbnQuc2Nzcydcbn0pXG5leHBvcnQgY2xhc3MgRW1wdHlTdGF0ZUNvbXBvbmVudCB7XG4gIHRpdGxlID0gaW5wdXQucmVxdWlyZWQ8c3RyaW5nPigpO1xuXG4gIGljb24gPSBpbnB1dDxzdHJpbmc+KCk7XG4gIGJ1dHRvbkxhYmVsID0gaW5wdXQ8c3RyaW5nPigpO1xuICBzZWNvbmRhcnlCdXR0b25MYWJlbCA9IGlucHV0PHN0cmluZz4oKTtcbiAgbG9hZGluZyA9IGlucHV0PGJvb2xlYW4+KGZhbHNlKTtcbiAgbW9yZUxpbmtMYWJlbCA9IGlucHV0PHN0cmluZz4oKTtcbiAgbW9yZUxpbmsgPSBpbnB1dDxzdHJpbmcgfCBzdHJpbmdbXT4oKTtcbiAgb3Blbk1vcmVMaW5rSW5OZXdUYWIgPSBpbnB1dDxib29sZWFuPih0cnVlKTtcbiAgc2l6ZSA9IGlucHV0PCdzbWFsbCcgfCAnbWVkaXVtJz4oJ21lZGl1bScpO1xuXG4gIHB1YmxpYyB1c2VSb3V0ZXJMaW5rOiBTaWduYWw8Ym9vbGVhbj4gPSBjb21wdXRlZCgoKSA9PiBBcnJheS5pc0FycmF5KHRoaXMubW9yZUxpbmsoKSkpO1xuXG4gIEBIb3N0QmluZGluZygnYXR0ci5zaXplJylcbiAgZ2V0IF9zaXplKCkge1xuICAgIHJldHVybiB0aGlzLnNpemUoKTtcbiAgfVxuXG4gIEBPdXRwdXQoKSBidXR0b25DbGlja2VkID0gbmV3IEV2ZW50RW1pdHRlcjxNb3VzZUV2ZW50PigpO1xuICBAT3V0cHV0KCkgc2Vjb25kYXJ5QnV0dG9uQ2xpY2tlZCA9IG5ldyBFdmVudEVtaXR0ZXI8TW91c2VFdmVudD4oKTtcbiAgQE91dHB1dCgpIG1vcmVMaW5rQ2xpY2tlZCA9IG5ldyBFdmVudEVtaXR0ZXI8TW91c2VFdmVudD4oKTtcbn1cbiIsIjxkaXYgY2xhc3M9XCJ0dy1tYXgtdy1bNDM0cHhdIHR3LXRleHQtY2VudGVyXCI+XG4gIEBpZiAoaWNvbigpKSB7XG4gICAgPGkgY2xhc3M9XCJlbXB0eVN0YXRlSWNvbiBmYXMgdHctdGV4dC1wcmltYXJ5XCIgW2NsYXNzXT1cIidmYS0nICsgaWNvbigpXCIgYXJpYS1oaWRkZW49XCJ0cnVlXCI+PC9pPlxuICB9XG5cbiAgPGgzIGNsYXNzPVwiZW1wdHktc3RhdGUtdGl0bGUgdHctbWItbSB0dy1tdC14bCB0dy1mb250LWJvbGQgdHctdGV4dC1ibGFja1wiIFtpbm5lckhUTUxdPVwidGl0bGUoKVwiPjwvaDM+XG5cbiAgPGRpdiBjbGFzcz1cImVtcHR5LXN0YXRlLWNvbnRlbnQgdHctbGVhZGluZy1bMTZweF0gdHctdGV4dC1ncmF5LTUwXCI+XG4gICAgPG5nLWNvbnRlbnQgLz5cbiAgPC9kaXY+XG5cbiAgPGRpdiBjbGFzcz1cInR3LWZsZXggdHctanVzdGlmeS1jZW50ZXIgdHctZ2FwLW1cIj5cbiAgICBAaWYgKHNlY29uZGFyeUJ1dHRvbkxhYmVsKCkpIHtcbiAgICAgIDxkaXYgY2xhc3M9XCJzZWNvbmRhcnlCdXR0b24gdHctbXkteGxcIj5cbiAgICAgICAgPGJ1dHRvbiBseC1idXR0b24gc2l6ZT1cImxhcmdlXCIgW3Nob3dTcGlubmVyXT1cImxvYWRpbmcoKVwiIChjbGljayk9XCJzZWNvbmRhcnlCdXR0b25DbGlja2VkLmVtaXQoJGV2ZW50KVwiPlxuICAgICAgICAgIHt7IHNlY29uZGFyeUJ1dHRvbkxhYmVsKCkgfX1cbiAgICAgICAgPC9idXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICB9XG5cbiAgICBAaWYgKGJ1dHRvbkxhYmVsKCkpIHtcbiAgICAgIDxkaXYgY2xhc3M9XCJhY3Rpb25CdXR0b24gdHctbXkteGxcIj5cbiAgICAgICAgPGJ1dHRvbiBseC1idXR0b24gc2l6ZT1cImxhcmdlXCIgY29sb3I9XCJwcmltYXJ5XCIgW3Nob3dTcGlubmVyXT1cImxvYWRpbmcoKVwiIChjbGljayk9XCJidXR0b25DbGlja2VkLmVtaXQoJGV2ZW50KVwiPlxuICAgICAgICAgIHt7IGJ1dHRvbkxhYmVsKCkgfX1cbiAgICAgICAgPC9idXR0b24+XG4gICAgICA8L2Rpdj5cbiAgICB9XG4gIDwvZGl2PlxuXG4gIEBpZiAobW9yZUxpbmtMYWJlbCgpICYmIG1vcmVMaW5rKCkpIHtcbiAgICA8ZGl2PlxuICAgICAgQGlmICh1c2VSb3V0ZXJMaW5rKCkpIHtcbiAgICAgICAgPGFcbiAgICAgICAgICByZWw9XCJub29wZW5lciBub3JlZmVycmVyXCJcbiAgICAgICAgICBjbGFzcz1cInR3LXRleHQtc2l6ZS1tZCB0dy10ZXh0LXByaW1hcnlcIlxuICAgICAgICAgIFtyb3V0ZXJMaW5rXT1cIm1vcmVMaW5rKClcIlxuICAgICAgICAgIChjbGljayk9XCJtb3JlTGlua0NsaWNrZWQuZW1pdCgkZXZlbnQpXCJcbiAgICAgICAgICBbdGFyZ2V0XT1cIm9wZW5Nb3JlTGlua0luTmV3VGFiKCkgPyAnX2JsYW5rJyA6ICdfc2VsZidcIlxuICAgICAgICAgID57eyBtb3JlTGlua0xhYmVsKCkgfX08L2FcbiAgICAgICAgPlxuICAgICAgfSBAZWxzZSB7XG4gICAgICAgIDxhXG4gICAgICAgICAgcmVsPVwibm9vcGVuZXIgbm9yZWZlcnJlclwiXG4gICAgICAgICAgY2xhc3M9XCJ0dy10ZXh0LXNpemUtbWQgdHctdGV4dC1wcmltYXJ5XCJcbiAgICAgICAgICBbaHJlZl09XCJtb3JlTGluaygpXCJcbiAgICAgICAgICAoY2xpY2spPVwibW9yZUxpbmtDbGlja2VkLmVtaXQoJGV2ZW50KVwiXG4gICAgICAgICAgW3RhcmdldF09XCJvcGVuTW9yZUxpbmtJbk5ld1RhYigpID8gJ19ibGFuaycgOiAnX3NlbGYnXCJcbiAgICAgICAgICA+e3sgbW9yZUxpbmtMYWJlbCgpIH19PC9hXG4gICAgICAgID5cbiAgICAgIH1cbiAgICA8L2Rpdj5cbiAgfVxuPC9kaXY+XG4iXX0=
|
|
@@ -7,14 +7,14 @@ export class ModalHeaderComponent {
|
|
|
7
7
|
this.bottomBorder = true;
|
|
8
8
|
}
|
|
9
9
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
10
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ModalHeaderComponent, isStandalone: true, selector: "lx-modal-header", inputs: { title: "title", bottomBorder: "bottomBorder" }, ngImport: i0, template: "<div class=\"headerContainer\" [class.bottomBorder]=\"bottomBorder\">\n <ng-content />\n <h1 *ngIf=\"title.length > 0\">{{ title }}</h1>\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;
|
|
10
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ModalHeaderComponent, isStandalone: true, selector: "lx-modal-header", inputs: { title: "title", bottomBorder: "bottomBorder" }, ngImport: i0, template: "<div class=\"headerContainer\" [class.bottomBorder]=\"bottomBorder\">\n <ng-content />\n <h1 class=\"lx-heading-2\" *ngIf=\"title.length > 0\">{{ title }}</h1>\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"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
11
11
|
}
|
|
12
12
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ModalHeaderComponent, decorators: [{
|
|
13
13
|
type: Component,
|
|
14
|
-
args: [{ selector: 'lx-modal-header', standalone: true, imports: [NgIf], template: "<div class=\"headerContainer\" [class.bottomBorder]=\"bottomBorder\">\n <ng-content />\n <h1 *ngIf=\"title.length > 0\">{{ title }}</h1>\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;
|
|
14
|
+
args: [{ selector: 'lx-modal-header', standalone: true, imports: [NgIf], template: "<div class=\"headerContainer\" [class.bottomBorder]=\"bottomBorder\">\n <ng-content />\n <h1 class=\"lx-heading-2\" *ngIf=\"title.length > 0\">{{ title }}</h1>\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"] }]
|
|
15
15
|
}], propDecorators: { title: [{
|
|
16
16
|
type: Input
|
|
17
17
|
}], bottomBorder: [{
|
|
18
18
|
type: Input
|
|
19
19
|
}] } });
|
|
20
|
-
//# sourceMappingURL=data:application/json;base64,
|
|
20
|
+
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoibW9kYWwtaGVhZGVyLmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uLy4uLy4uL2xpYnMvY29tcG9uZW50cy9zcmMvbGliL21vZGFsLXVpL2NvbXBvbmVudHMvbW9kYWwtaGVhZGVyL21vZGFsLWhlYWRlci5jb21wb25lbnQudHMiLCIuLi8uLi8uLi8uLi8uLi8uLi8uLi8uLi9saWJzL2NvbXBvbmVudHMvc3JjL2xpYi9tb2RhbC11aS9jb21wb25lbnRzL21vZGFsLWhlYWRlci9tb2RhbC1oZWFkZXIuY29tcG9uZW50Lmh0bWwiXSwibmFtZXMiOltdLCJtYXBwaW5ncyI6IkFBQUEsT0FBTyxFQUFFLElBQUksRUFBRSxNQUFNLGlCQUFpQixDQUFDO0FBQ3ZDLE9BQU8sRUFBRSxTQUFTLEVBQUUsS0FBSyxFQUFFLE1BQU0sZUFBZSxDQUFDOztBQVNqRCxNQUFNLE9BQU8sb0JBQW9CO0lBUGpDO1FBUWtCLFVBQUssR0FBVyxFQUFFLENBQUM7UUFDbkIsaUJBQVksR0FBWSxJQUFJLENBQUM7S0FDOUM7OEdBSFksb0JBQW9CO2tHQUFwQixvQkFBb0IscUlDVmpDLDZLQUlBLHd3QkRJWSxJQUFJOzsyRkFFSCxvQkFBb0I7a0JBUGhDLFNBQVM7K0JBQ0UsaUJBQWlCLGNBR2YsSUFBSSxXQUNQLENBQUMsSUFBSSxDQUFDOzhCQUdDLEtBQUs7c0JBQXBCLEtBQUs7Z0JBQ1UsWUFBWTtzQkFBM0IsS0FBSyIsInNvdXJjZXNDb250ZW50IjpbImltcG9ydCB7IE5nSWYgfSBmcm9tICdAYW5ndWxhci9jb21tb24nO1xuaW1wb3J0IHsgQ29tcG9uZW50LCBJbnB1dCB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xuXG5AQ29tcG9uZW50KHtcbiAgc2VsZWN0b3I6ICdseC1tb2RhbC1oZWFkZXInLFxuICB0ZW1wbGF0ZVVybDogJ21vZGFsLWhlYWRlci5jb21wb25lbnQuaHRtbCcsXG4gIHN0eWxlVXJsczogWydtb2RhbC1oZWFkZXIuY29tcG9uZW50LnNjc3MnXSxcbiAgc3RhbmRhbG9uZTogdHJ1ZSxcbiAgaW1wb3J0czogW05nSWZdXG59KVxuZXhwb3J0IGNsYXNzIE1vZGFsSGVhZGVyQ29tcG9uZW50IHtcbiAgQElucHV0KCkgcHVibGljIHRpdGxlOiBzdHJpbmcgPSAnJztcbiAgQElucHV0KCkgcHVibGljIGJvdHRvbUJvcmRlcjogYm9vbGVhbiA9IHRydWU7XG59XG4iLCI8ZGl2IGNsYXNzPVwiaGVhZGVyQ29udGFpbmVyXCIgW2NsYXNzLmJvdHRvbUJvcmRlcl09XCJib3R0b21Cb3JkZXJcIj5cbiAgPG5nLWNvbnRlbnQgLz5cbiAgPGgxIGNsYXNzPVwibHgtaGVhZGluZy0yXCIgKm5nSWY9XCJ0aXRsZS5sZW5ndGggPiAwXCI+e3sgdGl0bGUgfX08L2gxPlxuPC9kaXY+XG4iXX0=
|
|
@@ -753,6 +753,7 @@ class EmptyStateComponent {
|
|
|
753
753
|
this.title = input.required();
|
|
754
754
|
this.icon = input();
|
|
755
755
|
this.buttonLabel = input();
|
|
756
|
+
this.secondaryButtonLabel = input();
|
|
756
757
|
this.loading = input(false);
|
|
757
758
|
this.moreLinkLabel = input();
|
|
758
759
|
this.moreLink = input();
|
|
@@ -760,22 +761,25 @@ class EmptyStateComponent {
|
|
|
760
761
|
this.size = input('medium');
|
|
761
762
|
this.useRouterLink = computed(() => Array.isArray(this.moreLink()));
|
|
762
763
|
this.buttonClicked = new EventEmitter();
|
|
764
|
+
this.secondaryButtonClicked = new EventEmitter();
|
|
763
765
|
this.moreLinkClicked = new EventEmitter();
|
|
764
766
|
}
|
|
765
767
|
get _size() {
|
|
766
768
|
return this.size();
|
|
767
769
|
}
|
|
768
770
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: EmptyStateComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
769
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: EmptyStateComponent, isStandalone: true, selector: "lx-empty-state", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, buttonLabel: { classPropertyName: "buttonLabel", publicName: "buttonLabel", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, moreLinkLabel: { classPropertyName: "moreLinkLabel", publicName: "moreLinkLabel", isSignal: true, isRequired: false, transformFunction: null }, moreLink: { classPropertyName: "moreLink", publicName: "moreLink", isSignal: true, isRequired: false, transformFunction: null }, openMoreLinkInNewTab: { classPropertyName: "openMoreLinkInNewTab", publicName: "openMoreLinkInNewTab", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClicked: "buttonClicked", moreLinkClicked: "moreLinkClicked" }, host: { properties: { "attr.size": "this._size" } }, ngImport: i0, 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-font-bold 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 @if (buttonLabel()) {\n
|
|
771
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: EmptyStateComponent, isStandalone: true, selector: "lx-empty-state", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: true, transformFunction: null }, icon: { classPropertyName: "icon", publicName: "icon", isSignal: true, isRequired: false, transformFunction: null }, buttonLabel: { classPropertyName: "buttonLabel", publicName: "buttonLabel", isSignal: true, isRequired: false, transformFunction: null }, secondaryButtonLabel: { classPropertyName: "secondaryButtonLabel", publicName: "secondaryButtonLabel", isSignal: true, isRequired: false, transformFunction: null }, loading: { classPropertyName: "loading", publicName: "loading", isSignal: true, isRequired: false, transformFunction: null }, moreLinkLabel: { classPropertyName: "moreLinkLabel", publicName: "moreLinkLabel", isSignal: true, isRequired: false, transformFunction: null }, moreLink: { classPropertyName: "moreLink", publicName: "moreLink", isSignal: true, isRequired: false, transformFunction: null }, openMoreLinkInNewTab: { classPropertyName: "openMoreLinkInNewTab", publicName: "openMoreLinkInNewTab", isSignal: true, isRequired: false, transformFunction: null }, size: { classPropertyName: "size", publicName: "size", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { buttonClicked: "buttonClicked", secondaryButtonClicked: "secondaryButtonClicked", moreLinkClicked: "moreLinkClicked" }, host: { properties: { "attr.size": "this._size" } }, ngImport: i0, 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-font-bold 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(--sapFontSize, 13.5px)}:host[size=small] .empty-state-content{font-size:var(--lxFontSmallSize, 12px)}:host[size=medium] .empty-state-title{font-size:24px}:host[size=medium] .empty-state-content{font-size:13px}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"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "component", type: ButtonComponent, selector: "button[lx-button]", inputs: ["size", "color", "mode", "pressed", "selected", "square", "circle", "disabled", "showSpinner"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }] }); }
|
|
770
772
|
}
|
|
771
773
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: EmptyStateComponent, decorators: [{
|
|
772
774
|
type: Component,
|
|
773
|
-
args: [{ selector: 'lx-empty-state', standalone: true, imports: [CommonModule,
|
|
775
|
+
args: [{ selector: 'lx-empty-state', standalone: true, imports: [CommonModule, 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-font-bold 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(--sapFontSize, 13.5px)}:host[size=small] .empty-state-content{font-size:var(--lxFontSmallSize, 12px)}:host[size=medium] .empty-state-title{font-size:24px}:host[size=medium] .empty-state-content{font-size:13px}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"] }]
|
|
774
776
|
}], propDecorators: { _size: [{
|
|
775
777
|
type: HostBinding,
|
|
776
778
|
args: ['attr.size']
|
|
777
779
|
}], buttonClicked: [{
|
|
778
780
|
type: Output
|
|
781
|
+
}], secondaryButtonClicked: [{
|
|
782
|
+
type: Output
|
|
779
783
|
}], moreLinkClicked: [{
|
|
780
784
|
type: Output
|
|
781
785
|
}] } });
|
|
@@ -8892,11 +8896,11 @@ class ModalHeaderComponent {
|
|
|
8892
8896
|
this.bottomBorder = true;
|
|
8893
8897
|
}
|
|
8894
8898
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ModalHeaderComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
8895
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ModalHeaderComponent, isStandalone: true, selector: "lx-modal-header", inputs: { title: "title", bottomBorder: "bottomBorder" }, ngImport: i0, template: "<div class=\"headerContainer\" [class.bottomBorder]=\"bottomBorder\">\n <ng-content />\n <h1 *ngIf=\"title.length > 0\">{{ title }}</h1>\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;
|
|
8899
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ModalHeaderComponent, isStandalone: true, selector: "lx-modal-header", inputs: { title: "title", bottomBorder: "bottomBorder" }, ngImport: i0, template: "<div class=\"headerContainer\" [class.bottomBorder]=\"bottomBorder\">\n <ng-content />\n <h1 class=\"lx-heading-2\" *ngIf=\"title.length > 0\">{{ title }}</h1>\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"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }] }); }
|
|
8896
8900
|
}
|
|
8897
8901
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ModalHeaderComponent, decorators: [{
|
|
8898
8902
|
type: Component,
|
|
8899
|
-
args: [{ selector: 'lx-modal-header', standalone: true, imports: [NgIf], template: "<div class=\"headerContainer\" [class.bottomBorder]=\"bottomBorder\">\n <ng-content />\n <h1 *ngIf=\"title.length > 0\">{{ title }}</h1>\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;
|
|
8903
|
+
args: [{ selector: 'lx-modal-header', standalone: true, imports: [NgIf], template: "<div class=\"headerContainer\" [class.bottomBorder]=\"bottomBorder\">\n <ng-content />\n <h1 class=\"lx-heading-2\" *ngIf=\"title.length > 0\">{{ title }}</h1>\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"] }]
|
|
8900
8904
|
}], propDecorators: { title: [{
|
|
8901
8905
|
type: Input
|
|
8902
8906
|
}], bottomBorder: [{
|