@leanix/components 0.4.427 → 0.4.429
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 +3 -3
- package/esm2022/lib/core-ui/components/integration-link-card/integration-link-card.component.mjs +3 -3
- package/esm2022/lib/forms-ui/components/expanded-dropdown/expanded-dropdown.component.mjs +3 -3
- package/esm2022/lib/forms-ui/components/select-list/select-list.component.mjs +3 -3
- package/fesm2022/leanix-components.mjs +8 -8
- package/fesm2022/leanix-components.mjs.map +1 -1
- package/package.json +1 -1
|
@@ -766,11 +766,11 @@ class EmptyStateComponent {
|
|
|
766
766
|
return this.size();
|
|
767
767
|
}
|
|
768
768
|
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-
|
|
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-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 <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 @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, 13.5px)}: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, 13.5px)}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
770
|
}
|
|
771
771
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: EmptyStateComponent, decorators: [{
|
|
772
772
|
type: Component,
|
|
773
|
-
args: [{ selector: 'lx-empty-state', standalone: true, imports: [CommonModule, NgIf, 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-
|
|
773
|
+
args: [{ selector: 'lx-empty-state', standalone: true, imports: [CommonModule, NgIf, 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 @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 @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, 13.5px)}: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, 13.5px)}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
774
|
}], propDecorators: { _size: [{
|
|
775
775
|
type: HostBinding,
|
|
776
776
|
args: ['attr.size']
|
|
@@ -1100,11 +1100,11 @@ class IntegrationLinkCardComponent {
|
|
|
1100
1100
|
this.linkClicked.emit(event);
|
|
1101
1101
|
}
|
|
1102
1102
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: IntegrationLinkCardComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
|
|
1103
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: IntegrationLinkCardComponent, isStandalone: true, selector: "lx-integration-link-card", inputs: { sourceIconClasses: "sourceIconClasses", sourceName: "sourceName", title: "title", isInactive: "isInactive", link: "link", queryParams: "queryParams", externalLink: "externalLink", tooltipContent: "tooltipContent", badgeContent: "badgeContent", actionButtonName: "actionButtonName", timestamp: "timestamp", tertiaryInfo: "tertiaryInfo" }, outputs: { actionButtonClicked: "actionButtonClicked", linkClicked: "linkClicked" }, ngImport: i0, template: "<div class=\"integration-link-card-body {{ isInactive ? 'inactive-link' : '' }}\">\n @if (badgeContent) {\n <div class=\"integration-link-card-badge\">\n <lx-badge [content]=\"badgeContent\" />\n </div>\n }\n <div class=\"integration-link-card-source\"><i [class]=\"sourceIconClasses\" aria-hidden=\"true\"></i>{{ sourceName }}</div>\n <h2 class=\"integration-link-card-heading\">{{ title }}</h2>\n @if (tertiaryInfo) {\n <div class=\"integration-link-card-tertiary-info\">{{ tertiaryInfo }}</div>\n }\n @if (timestamp) {\n <div class=\"integration-link-card-timestamp\">{{ timestamp }}</div>\n }\n @if (actionButtonName) {\n <button lx-button color=\"light\" class=\"integration-link-card-action-button\" (click)=\"onActionButtonClicked()\">\n {{ actionButtonName }}\n </button>\n }\n</div>\n@if (link) {\n <div class=\"integration-link-card-link\">\n @if (externalLink) {\n <a\n [href]=\"link\"\n [attr.target]=\"'_blank'\"\n [attr.rel]=\"'noopener norefferer'\"\n [lxTooltip]=\"tooltipContent\"\n [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\"\n (click)=\"onLinkClicked($event)\"\n >\n <i class=\"far fa-external-link\" aria-hidden=\"true\"></i>\n </a>\n } @else {\n @if (link.startsWith('http')) {\n <a [lxTooltip]=\"tooltipContent\" [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\" [href]=\"link\" (click)=\"onLinkClicked($event)\">\n <i class=\"far fa-arrow-circle-right\" aria-hidden=\"true\"></i>\n </a>\n } @else {\n <a\n [lxTooltip]=\"tooltipContent\"\n [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\"\n [routerLink]=\"link\"\n [queryParams]=\"queryParams\"\n (click)=\"onLinkClicked($event)\"\n >\n <i class=\"far fa-arrow-circle-right\" aria-hidden=\"true\"></i>\n </a>\n }\n }\n </div>\n}\n", styles: [":host{width:100%;border-radius:4px;position:relative;display:flex;flex-direction:row;justify-content:space-between;gap:4px;background-color:#e1e5eb;font-size:var(--lxFontSmallSize, 12px)}.integration-link-card-body{display:flex;flex-direction:column;align-items:flex-start;padding:8px}.integration-link-card-badge{margin-bottom:8px}.integration-link-card-source{margin-bottom:4px}.integration-link-card-source i{margin-right:4px}.integration-link-card-tertiary-info{margin-bottom:4px;color:#99a5bb}.integration-link-card-timestamp{margin-bottom:4px;color:#526179}.integration-link-card-action-button{margin:4px 0}.integration-link-card-heading{padding-bottom:4px;font-weight:var(--lxFontBold, 700);font-size:14px;line-height:16px;margin:0;text-overflow:ellipsis;overflow:hidden;max-width:160px}.integration-link-card-link{width:30px;height:30px;display:flex;justify-content:center;align-items:center;align-self:center;transition:background-color .18s;transition-delay:0s;transition-timing-function:ease;cursor:pointer}.integration-link-card-link:hover,.integration-link-card-link:focus{text-decoration:none}.inactive-link *{color:#61779d}\n"], dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[lxTooltip]", inputs: ["lxTooltip", "lxTooltipPosition", "lxTooltipDelay", "lxTooltipIsHtmlContent"] }, { kind: "component", type: BadgeComponent, selector: "lx-badge", inputs: ["content", "color", "calculateColorsDynamically"] }, { 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"] }] }); }
|
|
1103
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.8", type: IntegrationLinkCardComponent, isStandalone: true, selector: "lx-integration-link-card", inputs: { sourceIconClasses: "sourceIconClasses", sourceName: "sourceName", title: "title", isInactive: "isInactive", link: "link", queryParams: "queryParams", externalLink: "externalLink", tooltipContent: "tooltipContent", badgeContent: "badgeContent", actionButtonName: "actionButtonName", timestamp: "timestamp", tertiaryInfo: "tertiaryInfo" }, outputs: { actionButtonClicked: "actionButtonClicked", linkClicked: "linkClicked" }, ngImport: i0, template: "<div class=\"integration-link-card-body {{ isInactive ? 'inactive-link' : '' }}\">\n @if (badgeContent) {\n <div class=\"integration-link-card-badge\">\n <lx-badge [content]=\"badgeContent\" />\n </div>\n }\n <div class=\"integration-link-card-source\"><i [class]=\"sourceIconClasses\" aria-hidden=\"true\"></i>{{ sourceName }}</div>\n <h2 class=\"integration-link-card-heading\">{{ title }}</h2>\n @if (tertiaryInfo) {\n <div class=\"integration-link-card-tertiary-info\">{{ tertiaryInfo }}</div>\n }\n @if (timestamp) {\n <div class=\"integration-link-card-timestamp\">{{ timestamp }}</div>\n }\n @if (actionButtonName) {\n <button lx-button color=\"light\" class=\"integration-link-card-action-button\" (click)=\"onActionButtonClicked()\">\n {{ actionButtonName }}\n </button>\n }\n</div>\n@if (link) {\n <div class=\"integration-link-card-link\">\n @if (externalLink) {\n <a\n [href]=\"link\"\n [attr.target]=\"'_blank'\"\n [attr.rel]=\"'noopener norefferer'\"\n [lxTooltip]=\"tooltipContent\"\n [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\"\n (click)=\"onLinkClicked($event)\"\n >\n <i class=\"far fa-external-link\" aria-hidden=\"true\"></i>\n </a>\n } @else {\n @if (link.startsWith('http')) {\n <a [lxTooltip]=\"tooltipContent\" [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\" [href]=\"link\" (click)=\"onLinkClicked($event)\">\n <i class=\"far fa-arrow-circle-right\" aria-hidden=\"true\"></i>\n </a>\n } @else {\n <a\n [lxTooltip]=\"tooltipContent\"\n [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\"\n [routerLink]=\"link\"\n [queryParams]=\"queryParams\"\n (click)=\"onLinkClicked($event)\"\n >\n <i class=\"far fa-arrow-circle-right\" aria-hidden=\"true\"></i>\n </a>\n }\n }\n </div>\n}\n", styles: [":host{width:100%;border-radius:4px;position:relative;display:flex;flex-direction:row;justify-content:space-between;gap:4px;background-color:#e1e5eb;font-size:var(--lxFontSmallSize, 12px)}.integration-link-card-body{display:flex;flex-direction:column;align-items:flex-start;padding:8px}.integration-link-card-badge{margin-bottom:8px}.integration-link-card-source{margin-bottom:4px}.integration-link-card-source i{margin-right:4px}.integration-link-card-tertiary-info{margin-bottom:4px;color:#99a5bb}.integration-link-card-timestamp{margin-bottom:4px;color:#526179}.integration-link-card-action-button{margin:4px 0}.integration-link-card-heading{padding-bottom:4px;font-weight:var(--lxFontBold, 700);font-size:var(--lxFontHeader5Size, 14px);line-height:16px;margin:0;text-overflow:ellipsis;overflow:hidden;max-width:160px}.integration-link-card-link{width:30px;height:30px;display:flex;justify-content:center;align-items:center;align-self:center;transition:background-color .18s;transition-delay:0s;transition-timing-function:ease;cursor:pointer}.integration-link-card-link:hover,.integration-link-card-link:focus{text-decoration:none}.inactive-link *{color:#61779d}\n"], dependencies: [{ kind: "directive", type: TooltipDirective, selector: "[lxTooltip]", inputs: ["lxTooltip", "lxTooltipPosition", "lxTooltipDelay", "lxTooltipIsHtmlContent"] }, { kind: "component", type: BadgeComponent, selector: "lx-badge", inputs: ["content", "color", "calculateColorsDynamically"] }, { 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"] }] }); }
|
|
1104
1104
|
}
|
|
1105
1105
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: IntegrationLinkCardComponent, decorators: [{
|
|
1106
1106
|
type: Component,
|
|
1107
|
-
args: [{ selector: 'lx-integration-link-card', standalone: true, imports: [TooltipDirective, BadgeComponent, ButtonComponent, RouterLink], template: "<div class=\"integration-link-card-body {{ isInactive ? 'inactive-link' : '' }}\">\n @if (badgeContent) {\n <div class=\"integration-link-card-badge\">\n <lx-badge [content]=\"badgeContent\" />\n </div>\n }\n <div class=\"integration-link-card-source\"><i [class]=\"sourceIconClasses\" aria-hidden=\"true\"></i>{{ sourceName }}</div>\n <h2 class=\"integration-link-card-heading\">{{ title }}</h2>\n @if (tertiaryInfo) {\n <div class=\"integration-link-card-tertiary-info\">{{ tertiaryInfo }}</div>\n }\n @if (timestamp) {\n <div class=\"integration-link-card-timestamp\">{{ timestamp }}</div>\n }\n @if (actionButtonName) {\n <button lx-button color=\"light\" class=\"integration-link-card-action-button\" (click)=\"onActionButtonClicked()\">\n {{ actionButtonName }}\n </button>\n }\n</div>\n@if (link) {\n <div class=\"integration-link-card-link\">\n @if (externalLink) {\n <a\n [href]=\"link\"\n [attr.target]=\"'_blank'\"\n [attr.rel]=\"'noopener norefferer'\"\n [lxTooltip]=\"tooltipContent\"\n [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\"\n (click)=\"onLinkClicked($event)\"\n >\n <i class=\"far fa-external-link\" aria-hidden=\"true\"></i>\n </a>\n } @else {\n @if (link.startsWith('http')) {\n <a [lxTooltip]=\"tooltipContent\" [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\" [href]=\"link\" (click)=\"onLinkClicked($event)\">\n <i class=\"far fa-arrow-circle-right\" aria-hidden=\"true\"></i>\n </a>\n } @else {\n <a\n [lxTooltip]=\"tooltipContent\"\n [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\"\n [routerLink]=\"link\"\n [queryParams]=\"queryParams\"\n (click)=\"onLinkClicked($event)\"\n >\n <i class=\"far fa-arrow-circle-right\" aria-hidden=\"true\"></i>\n </a>\n }\n }\n </div>\n}\n", styles: [":host{width:100%;border-radius:4px;position:relative;display:flex;flex-direction:row;justify-content:space-between;gap:4px;background-color:#e1e5eb;font-size:var(--lxFontSmallSize, 12px)}.integration-link-card-body{display:flex;flex-direction:column;align-items:flex-start;padding:8px}.integration-link-card-badge{margin-bottom:8px}.integration-link-card-source{margin-bottom:4px}.integration-link-card-source i{margin-right:4px}.integration-link-card-tertiary-info{margin-bottom:4px;color:#99a5bb}.integration-link-card-timestamp{margin-bottom:4px;color:#526179}.integration-link-card-action-button{margin:4px 0}.integration-link-card-heading{padding-bottom:4px;font-weight:var(--lxFontBold, 700);font-size:14px;line-height:16px;margin:0;text-overflow:ellipsis;overflow:hidden;max-width:160px}.integration-link-card-link{width:30px;height:30px;display:flex;justify-content:center;align-items:center;align-self:center;transition:background-color .18s;transition-delay:0s;transition-timing-function:ease;cursor:pointer}.integration-link-card-link:hover,.integration-link-card-link:focus{text-decoration:none}.inactive-link *{color:#61779d}\n"] }]
|
|
1107
|
+
args: [{ selector: 'lx-integration-link-card', standalone: true, imports: [TooltipDirective, BadgeComponent, ButtonComponent, RouterLink], template: "<div class=\"integration-link-card-body {{ isInactive ? 'inactive-link' : '' }}\">\n @if (badgeContent) {\n <div class=\"integration-link-card-badge\">\n <lx-badge [content]=\"badgeContent\" />\n </div>\n }\n <div class=\"integration-link-card-source\"><i [class]=\"sourceIconClasses\" aria-hidden=\"true\"></i>{{ sourceName }}</div>\n <h2 class=\"integration-link-card-heading\">{{ title }}</h2>\n @if (tertiaryInfo) {\n <div class=\"integration-link-card-tertiary-info\">{{ tertiaryInfo }}</div>\n }\n @if (timestamp) {\n <div class=\"integration-link-card-timestamp\">{{ timestamp }}</div>\n }\n @if (actionButtonName) {\n <button lx-button color=\"light\" class=\"integration-link-card-action-button\" (click)=\"onActionButtonClicked()\">\n {{ actionButtonName }}\n </button>\n }\n</div>\n@if (link) {\n <div class=\"integration-link-card-link\">\n @if (externalLink) {\n <a\n [href]=\"link\"\n [attr.target]=\"'_blank'\"\n [attr.rel]=\"'noopener norefferer'\"\n [lxTooltip]=\"tooltipContent\"\n [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\"\n (click)=\"onLinkClicked($event)\"\n >\n <i class=\"far fa-external-link\" aria-hidden=\"true\"></i>\n </a>\n } @else {\n @if (link.startsWith('http')) {\n <a [lxTooltip]=\"tooltipContent\" [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\" [href]=\"link\" (click)=\"onLinkClicked($event)\">\n <i class=\"far fa-arrow-circle-right\" aria-hidden=\"true\"></i>\n </a>\n } @else {\n <a\n [lxTooltip]=\"tooltipContent\"\n [lxTooltipPosition]=\"{ y: 'top', x: 'left' }\"\n [routerLink]=\"link\"\n [queryParams]=\"queryParams\"\n (click)=\"onLinkClicked($event)\"\n >\n <i class=\"far fa-arrow-circle-right\" aria-hidden=\"true\"></i>\n </a>\n }\n }\n </div>\n}\n", styles: [":host{width:100%;border-radius:4px;position:relative;display:flex;flex-direction:row;justify-content:space-between;gap:4px;background-color:#e1e5eb;font-size:var(--lxFontSmallSize, 12px)}.integration-link-card-body{display:flex;flex-direction:column;align-items:flex-start;padding:8px}.integration-link-card-badge{margin-bottom:8px}.integration-link-card-source{margin-bottom:4px}.integration-link-card-source i{margin-right:4px}.integration-link-card-tertiary-info{margin-bottom:4px;color:#99a5bb}.integration-link-card-timestamp{margin-bottom:4px;color:#526179}.integration-link-card-action-button{margin:4px 0}.integration-link-card-heading{padding-bottom:4px;font-weight:var(--lxFontBold, 700);font-size:var(--lxFontHeader5Size, 14px);line-height:16px;margin:0;text-overflow:ellipsis;overflow:hidden;max-width:160px}.integration-link-card-link{width:30px;height:30px;display:flex;justify-content:center;align-items:center;align-self:center;transition:background-color .18s;transition-delay:0s;transition-timing-function:ease;cursor:pointer}.integration-link-card-link:hover,.integration-link-card-link:focus{text-decoration:none}.inactive-link *{color:#61779d}\n"] }]
|
|
1108
1108
|
}], propDecorators: { sourceIconClasses: [{
|
|
1109
1109
|
type: Input,
|
|
1110
1110
|
args: [{ required: true }]
|
|
@@ -5795,11 +5795,11 @@ class ExpandedDropdownComponent extends KeyboardSelectDirective {
|
|
|
5795
5795
|
this.onChooseItem = new EventEmitter();
|
|
5796
5796
|
}
|
|
5797
5797
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ExpandedDropdownComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
5798
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ExpandedDropdownComponent, isStandalone: true, selector: "lx-expanded-dropdown", inputs: { options: "options" }, outputs: { onChooseItem: "onChooseItem" }, usesInheritance: true, ngImport: i0, template: "<ul class=\"options lxThinScrollbar\" #keyboardSelectContainer>\n <li *ngIf=\"options?.length === 0\" tabindex=\"-1\" id=\"noOption\" class=\"option noOptionsAvailable\">\n {{ NAME + '.noResults' | translate }}\n </li>\n <li\n *ngFor=\"let option of options; let index = index\"\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 >\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 <title>Button/Text/Primary/Medium</title>\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</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:
|
|
5798
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: ExpandedDropdownComponent, isStandalone: true, selector: "lx-expanded-dropdown", inputs: { options: "options" }, outputs: { onChooseItem: "onChooseItem" }, usesInheritance: true, ngImport: i0, template: "<ul class=\"options lxThinScrollbar\" #keyboardSelectContainer>\n <li *ngIf=\"options?.length === 0\" tabindex=\"-1\" id=\"noOption\" class=\"option noOptionsAvailable\">\n {{ NAME + '.noResults' | translate }}\n </li>\n <li\n *ngFor=\"let option of options; let index = index\"\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 >\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 <title>Button/Text/Primary/Medium</title>\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</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"], dependencies: [{ kind: "directive", type: NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: NgFor, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: SelectableItemDirective, selector: "[lxSelectableItem]", inputs: ["scrollInContainer", "lxSelectableItem"], outputs: ["select"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "pipe", type: AsyncPipe, name: "async" }, { kind: "ngmodule", type: TranslateModule }, { kind: "pipe", type: i1$1.TranslatePipe, name: "translate" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
|
|
5799
5799
|
}
|
|
5800
5800
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: ExpandedDropdownComponent, decorators: [{
|
|
5801
5801
|
type: Component,
|
|
5802
|
-
args: [{ selector: 'lx-expanded-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgIf, NgFor, SelectableItemDirective, NgTemplateOutlet, AsyncPipe, TranslateModule], template: "<ul class=\"options lxThinScrollbar\" #keyboardSelectContainer>\n <li *ngIf=\"options?.length === 0\" tabindex=\"-1\" id=\"noOption\" class=\"option noOptionsAvailable\">\n {{ NAME + '.noResults' | translate }}\n </li>\n <li\n *ngFor=\"let option of options; let index = index\"\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 >\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 <title>Button/Text/Primary/Medium</title>\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</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:
|
|
5802
|
+
args: [{ selector: 'lx-expanded-dropdown', changeDetection: ChangeDetectionStrategy.OnPush, standalone: true, imports: [NgIf, NgFor, SelectableItemDirective, NgTemplateOutlet, AsyncPipe, TranslateModule], template: "<ul class=\"options lxThinScrollbar\" #keyboardSelectContainer>\n <li *ngIf=\"options?.length === 0\" tabindex=\"-1\" id=\"noOption\" class=\"option noOptionsAvailable\">\n {{ NAME + '.noResults' | translate }}\n </li>\n <li\n *ngFor=\"let option of options; let index = index\"\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 >\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 <title>Button/Text/Primary/Medium</title>\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</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"] }]
|
|
5803
5803
|
}], propDecorators: { options: [{
|
|
5804
5804
|
type: Input
|
|
5805
5805
|
}], onChooseItem: [{
|
|
@@ -7582,11 +7582,11 @@ class SelectListComponent extends BaseSelectDirective {
|
|
|
7582
7582
|
return options.findIndex((option) => isEqual$1(selection, option));
|
|
7583
7583
|
}
|
|
7584
7584
|
static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SelectListComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
|
|
7585
|
-
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SelectListComponent, isStandalone: true, selector: "lx-select-list", inputs: { searchPlaceholder: "searchPlaceholder", options: "options", selection: "selection" }, outputs: { selectionChange: "selectionChange", onChooseItem: "onChooseItem" }, queries: [{ propertyName: "explicitDropdown", first: true, predicate: SelectDropdownDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "dropdownComponent", first: true, predicate: ExpandedDropdownComponent, descendants: true }], viewQueries: [{ propertyName: "implicitSelectedOption", first: true, predicate: ["selectedOption"], descendants: true, static: true }, { propertyName: "implicitDropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, 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:
|
|
7585
|
+
static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.8", type: SelectListComponent, isStandalone: true, selector: "lx-select-list", inputs: { searchPlaceholder: "searchPlaceholder", options: "options", selection: "selection" }, outputs: { selectionChange: "selectionChange", onChooseItem: "onChooseItem" }, queries: [{ propertyName: "explicitDropdown", first: true, predicate: SelectDropdownDirective, descendants: true, read: TemplateRef, static: true }, { propertyName: "dropdownComponent", first: true, predicate: ExpandedDropdownComponent, descendants: true }], viewQueries: [{ propertyName: "implicitSelectedOption", first: true, predicate: ["selectedOption"], descendants: true, static: true }, { propertyName: "implicitDropdown", first: true, predicate: ["dropdown"], descendants: true, static: true }, { propertyName: "searchInput", first: true, predicate: ["searchInput"], descendants: true, static: true }], usesInheritance: true, ngImport: i0, 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"], dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1$6.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1$6.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i1$6.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }] }); }
|
|
7586
7586
|
}
|
|
7587
7587
|
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.8", ngImport: i0, type: SelectListComponent, decorators: [{
|
|
7588
7588
|
type: Component,
|
|
7589
|
-
args: [{ selector: 'lx-select-list', standalone: true, 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:
|
|
7589
|
+
args: [{ selector: 'lx-select-list', standalone: true, 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"] }]
|
|
7590
7590
|
}], propDecorators: { searchPlaceholder: [{
|
|
7591
7591
|
type: Input
|
|
7592
7592
|
}], options: [{
|