intelica-library-project 20.0.2 → 20.0.3

package/fesm2022/intelica-library-project.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { inject, EventEmitter, forwardRef, Output, Input, Component, Pipe, Injectable, TemplateRef, ContentChild, Directive, ContentChildren, PLATFORM_ID, Inject } from '@angular/core';
+import { inject, EventEmitter, forwardRef, Output, Input, Component, Pipe, Injectable, TemplateRef, ContentChild, Directive, ContentChildren, PLATFORM_ID, Inject, input, output, computed, signal, effect, ViewChildren, DestroyRef } from '@angular/core';
 import * as i1 from '@angular/forms';
 import { FormBuilder, FormsModule, ReactiveFormsModule, NG_VALUE_ACCESSOR } from '@angular/forms';
 import * as i2 from 'primeng/radiobutton';
@@ -7,13 +7,13 @@ import { RadioButtonModule } from 'primeng/radiobutton';
 import { Popover } from 'primeng/popover';
 import { InputText, InputTextModule } from 'primeng/inputtext';
 import * as i1$1 from '@angular/common';
-import { CommonModule, DatePipe, isPlatformBrowser } from '@angular/common';
+import { CommonModule, DatePipe, isPlatformBrowser, NgClass } from '@angular/common';
 import * as i5 from 'primeng/tooltip';
-import { TooltipModule } from 'primeng/tooltip';
-import { GlobalTermService, TermPipe, FormatDateConstants, ConfigService, Color, getColor } from 'intelica-library-base';
+import { TooltipModule, Tooltip } from 'primeng/tooltip';
+import { GlobalTermService, TermPipe, FormatDateConstants, ConfigService, GlobalFavoriteService, Color, getColor } from 'intelica-library-base';
 import * as i4 from 'primeng/button';
-import { ButtonModule } from 'primeng/button';
-import { Subscription, Subject, BehaviorSubject, of, tap, map, shareReplay, throwError } from 'rxjs';
+import { ButtonModule, Button } from 'primeng/button';
+import { Subscription, Subject, BehaviorSubject, firstValueFrom, map, distinctUntilChanged, of, tap, shareReplay, throwError } from 'rxjs';
 import { BadgeModule } from 'primeng/badge';
 import * as i6 from 'primeng/checkbox';
 import { CheckboxModule } from 'primeng/checkbox';
@@ -29,9 +29,14 @@ import moment from 'moment';
 import * as _ from 'lodash';
 import * as i4$1 from 'primeng/api';
 import * as i2$2 from 'primeng/skeleton';
-import { SkeletonModule } from 'primeng/skeleton';
+import { SkeletonModule, Skeleton } from 'primeng/skeleton';
 import * as echarts from 'echarts';
+import { Breadcrumb } from 'primeng/breadcrumb';
+import { RouterLink, ActivatedRoute } from '@angular/router';
 import { HttpClient } from '@angular/common/http';
+import { createEmbeddingContext } from 'amazon-quicksight-embedding-sdk';
+import { toSignal, takeUntilDestroyed } from '@angular/core/rxjs-interop';
+import { Panel } from 'primeng/panel';
 import { catchError } from 'rxjs/operators';
 
 var SearchInputEnum;
@@ -2133,6 +2138,381 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.23", ngImpo
                 type: Output
             }] } });
 
+class BreadCrumbComponent {
+    fullItems = input([], ...(ngDevMode ? [{ debugName: "fullItems" }] : []));
+    itemClick = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: BreadCrumbComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.23", type: BreadCrumbComponent, isStandalone: true, selector: "intelica-bread-crumb", inputs: { fullItems: { classPropertyName: "fullItems", publicName: "fullItems", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { itemClick: "itemClick" }, ngImport: i0, template: "<p-breadcrumb class=\"prBreadcrumb\" [model]=\"fullItems()\">\n    <ng-template pTemplate=\"item\" let-item>\n        <a [routerLink]=\"item.routerLink\" [pTooltip]=\"item.tooltip\" tooltipStyleClass=\"prTooltip\"\n            [tooltipPosition]=\"item.tooltipPosition\" [tooltipStyleClass]=\"item.tooltipStyleClass\">\n            <span>{{ item.label }}</span>\n        </a>\n    </ng-template>\n    <ng-template pTemplate=\"separator\">\n        <span class=\"breadcrumb-separator\">\n            <i class=\"icon icon-arrow-right icon--xs\"></i>\n        </span>\n    </ng-template>\n</p-breadcrumb>", dependencies: [{ kind: "component", type: Breadcrumb, selector: "p-breadcrumb", inputs: ["model", "style", "styleClass", "home", "homeAriaLabel"], outputs: ["onItemClick"] }, { kind: "directive", type: RouterLink, selector: "[routerLink]", inputs: ["target", "queryParams", "fragment", "queryParamsHandling", "state", "info", "relativeTo", "preserveFragment", "skipLocationChange", "replaceUrl", "routerLink"] }, { kind: "directive", type: Tooltip, selector: "[pTooltip]", inputs: ["tooltipPosition", "tooltipEvent", "positionStyle", "tooltipStyleClass", "tooltipZIndex", "escape", "showDelay", "hideDelay", "life", "positionTop", "positionLeft", "autoHide", "fitContent", "hideOnEscape", "pTooltip", "tooltipDisabled", "tooltipOptions", "appendTo", "ptTooltip"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: BreadCrumbComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'intelica-bread-crumb', imports: [Breadcrumb, RouterLink, Tooltip,], template: "<p-breadcrumb class=\"prBreadcrumb\" [model]=\"fullItems()\">\n    <ng-template pTemplate=\"item\" let-item>\n        <a [routerLink]=\"item.routerLink\" [pTooltip]=\"item.tooltip\" tooltipStyleClass=\"prTooltip\"\n            [tooltipPosition]=\"item.tooltipPosition\" [tooltipStyleClass]=\"item.tooltipStyleClass\">\n            <span>{{ item.label }}</span>\n        </a>\n    </ng-template>\n    <ng-template pTemplate=\"separator\">\n        <span class=\"breadcrumb-separator\">\n            <i class=\"icon icon-arrow-right icon--xs\"></i>\n        </span>\n    </ng-template>\n</p-breadcrumb>" }]
+        }], propDecorators: { fullItems: [{ type: i0.Input, args: [{ isSignal: true, alias: "fullItems", required: false }] }], itemClick: [{ type: i0.Output, args: ["itemClick"] }] } });
+
+class TitleComponent {
+    title = input('', ...(ngDevMode ? [{ debugName: "title" }] : []));
+    back = output();
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: TitleComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "20.3.23", type: TitleComponent, isStandalone: true, selector: "intelica-title", inputs: { title: { classPropertyName: "title", publicName: "title", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { back: "back" }, ngImport: i0, template: "<div class=\"ptSectionTitle\">\n    <div class=\"ptSectionTitle__icon\">\n        <p-button class=\"prButton\" icon=\"icon icon-nav-left\" (onClick)=\"back.emit()\" />\n    </div>\n    <div class=\"ptSectionTitle__content\">\n        <div class=\"ptSectionTitle__title\">\n            {{ title() }}\n        </div>\n    </div>\n</div>", dependencies: [{ kind: "component", type: Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: TitleComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'intelica-title', imports: [Button], template: "<div class=\"ptSectionTitle\">\n    <div class=\"ptSectionTitle__icon\">\n        <p-button class=\"prButton\" icon=\"icon icon-nav-left\" (onClick)=\"back.emit()\" />\n    </div>\n    <div class=\"ptSectionTitle__content\">\n        <div class=\"ptSectionTitle__title\">\n            {{ title() }}\n        </div>\n    </div>\n</div>" }]
+        }], propDecorators: { title: [{ type: i0.Input, args: [{ isSignal: true, alias: "title", required: false }] }], back: [{ type: i0.Output, args: ["back"] }] } });
+
+const QuicksightEventName = {
+    ERROR_OCCURRED: "ERROR_OCCURRED",
+    CONTENT_LOADED: "CONTENT_LOADED",
+    PARAMETERS_CHANGED: "PARAMETERS_CHANGED",
+    SIZE_CHANGED: "SIZE_CHANGED",
+    SELECTED_SHEET_CHANGED: "SELECTED_SHEET_CHANGED",
+    MODAL_OPENED: "MODAL_OPENED",
+    EXPERIENCE_INITIALIZED: "EXPERIENCE_INITIALIZED",
+};
+const QUICKSIGHT_AUTH_ERROR_CODES = ["Forbidden", "Unauthorized", "EmbeddingNotAuthorized", "TokenExpired"];
+function isQuicksightSessionExpiredEvent(event) {
+    if (event.eventName !== QuicksightEventName.ERROR_OCCURRED)
+        return false;
+    const code = event.data?.errorCode ?? event.data?.code ?? "";
+    return typeof code === "string" && QUICKSIGHT_AUTH_ERROR_CODES.some(c => code.includes(c));
+}
+function dispatchQuicksightEvent(event, outputs) {
+    outputs.sdkEvent.emit(event);
+    if (event.eventName === QuicksightEventName.CONTENT_LOADED)
+        outputs.contentLoaded?.emit(event);
+    if (event.eventName === QuicksightEventName.ERROR_OCCURRED) {
+        outputs.errorOccurred?.emit(event);
+        if (isQuicksightSessionExpiredEvent(event))
+            outputs.sessionExpired?.emit(event);
+    }
+}
+class Shared {
+    http = inject(HttpClient);
+    configService = inject(ConfigService);
+    path = `${this.configService.environment?.sharedPath}/Quicksight`;
+    getEmbedUrl(command) {
+        return this.http.post(`${this.path}/embed-url`, command);
+    }
+    getEmbedVisualUrl(command) {
+        return this.http.post(`${this.path}/embed-visual-url`, command);
+    }
+    getEmbedVisualUrlsAnonymous(command) {
+        return this.http.post(`${this.path}/embed-visual-anonymous`, command);
+    }
+    async createEmbedContext(embedUrl, container, options) {
+        const embeddingContext = await createEmbeddingContext();
+        await embeddingContext.embedDashboard({
+            url: embedUrl,
+            container,
+            ...(options?.height && { height: options.height }),
+            ...(options?.width && { width: options.width }),
+            ...(options?.onChange && { onChange: this.toSdkChangeListener(options.onChange) }),
+        });
+    }
+    async embedDashboard(command, container, options) {
+        container.replaceChildren();
+        const embedUrl = await firstValueFrom(this.getEmbedUrl(command));
+        await this.createEmbedContext(embedUrl, container, options);
+    }
+    async embedDashboardInteractive(command, container, options) {
+        container.replaceChildren();
+        const embedUrl = await firstValueFrom(this.getEmbedUrl({ ...command, parameters: undefined }));
+        const embeddingContext = await createEmbeddingContext();
+        const sdkParameters = command.parameters ? Object.entries(command.parameters).map(([Name, Values]) => ({ Name, Values })) : undefined;
+        return await embeddingContext.embedDashboard({
+            url: embedUrl,
+            container,
+            ...(options?.height && { height: options.height }),
+            ...(options?.width && { width: options.width }),
+            ...(options?.onChange && { onChange: this.toSdkChangeListener(options.onChange) }),
+        }, sdkParameters ? { parameters: sdkParameters } : undefined);
+    }
+    toSdkChangeListener(emit) {
+        return (changeEvent) => {
+            emit({
+                eventName: changeEvent?.eventName,
+                eventLevel: changeEvent?.eventLevel,
+                message: changeEvent?.message,
+                data: changeEvent?.data,
+            });
+        };
+    }
+    async setDashboardParameters(dashboard, parameters) {
+        const sdkParameters = Object.entries(parameters).map(([Name, Values]) => ({ Name, Values }));
+        await dashboard.setParameters(sdkParameters);
+    }
+    async createEmbedVisualContext(embedUrl, container, options) {
+        const embeddingContext = await createEmbeddingContext();
+        await embeddingContext.embedVisual({
+            url: embedUrl,
+            container,
+            ...(options?.height && { height: options.height }),
+            ...(options?.width && { width: options.width }),
+        }, { scaleToContainer: true, fitToIframeWidth: false });
+    }
+    async embedSequentialVisuals(command, configs, onVisualLoaded) {
+        for (const config of configs) {
+            config.container?.nativeElement?.replaceChildren();
+            const { visual } = await firstValueFrom(this.getEmbedVisualUrl({ dashboardId: command.dashboardId, sheetId: command.sheetId, visualId: config.visualId, parameters: command.parameters }));
+            if (!visual)
+                continue;
+            await this.createEmbedVisualContext(visual.embedUrl, config.container.nativeElement);
+            onVisualLoaded?.(config.visualId);
+        }
+    }
+    async embedSequentialVisualsInteractive(command, configs, onVisualLoaded) {
+        const refs = new Map();
+        const sdkParameters = command.parameters ? Object.entries(command.parameters).map(([Name, Values]) => ({ Name, Values })) : undefined;
+        for (const config of configs) {
+            config.container?.nativeElement?.replaceChildren();
+            const { visual } = await firstValueFrom(this.getEmbedVisualUrl({ dashboardId: command.dashboardId, sheetId: command.sheetId, visualId: config.visualId, parameters: {} }));
+            if (!visual)
+                continue;
+            const embeddingContext = await createEmbeddingContext();
+            const visualRef = await embeddingContext.embedVisual({ url: visual.embedUrl, container: config.container.nativeElement }, {
+                scaleToContainer: true,
+                fitToIframeWidth: false,
+                ...(sdkParameters ? { parameters: sdkParameters } : {}),
+            });
+            refs.set(config.visualId, visualRef);
+            onVisualLoaded?.(config.visualId, visualRef);
+        }
+        return refs;
+    }
+    async setVisualParameters(visual, parameters) {
+        const sdkParameters = Object.entries(parameters).map(([Name, Values]) => ({ Name, Values }));
+        await visual.setParameters(sdkParameters);
+    }
+    async setVisualsParameters(visuals, parameters) {
+        const sdkParameters = Object.entries(parameters).map(([Name, Values]) => ({ Name, Values }));
+        await Promise.all([...visuals].map(v => v.setParameters(sdkParameters)));
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: Shared, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: Shared, providedIn: "root" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: Shared, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: "root",
+                }]
+        }] });
+
+class DashboardQsComponent {
+    sharedService = inject(Shared);
+    route = inject(ActivatedRoute);
+    containers;
+    dashboardIdInput = input(undefined, ...(ngDevMode ? [{ debugName: "dashboardIdInput", alias: 'dashboardId' }] : [{ alias: 'dashboardId' }]));
+    parametersInput = input(undefined, ...(ngDevMode ? [{ debugName: "parametersInput", alias: 'parameters' }] : [{ alias: 'parameters' }]));
+    heightInput = input(undefined, ...(ngDevMode ? [{ debugName: "heightInput", alias: 'height' }] : [{ alias: 'height' }]));
+    routeData = toSignal(this.route.data, { initialValue: this.route.snapshot.data });
+    dashboardId = computed(() => this.dashboardIdInput() ?? this.routeData()['dashboardId'], ...(ngDevMode ? [{ debugName: "dashboardId" }] : []));
+    parameters = computed(() => this.parametersInput() ?? this.routeData()['parameters'], ...(ngDevMode ? [{ debugName: "parameters" }] : []));
+    height = computed(() => this.heightInput() ?? this.routeData()['height'], ...(ngDevMode ? [{ debugName: "height" }] : []));
+    isLoading = signal(true, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
+    isLoadingChange = output();
+    sdkEvent = output();
+    contentLoaded = output();
+    errorOccurred = output();
+    sessionExpired = output();
+    viewReady = signal(false, ...(ngDevMode ? [{ debugName: "viewReady" }] : []));
+    constructor() {
+        effect(() => {
+            this.isLoadingChange.emit(this.isLoading());
+        });
+        effect(() => {
+            const id = this.dashboardId();
+            const parameters = this.parameters();
+            if (!this.viewReady() || !id)
+                return;
+            this.EmbedDashboard(id, parameters);
+        });
+    }
+    ngAfterViewInit() {
+        this.viewReady.set(true);
+    }
+    async EmbedDashboard(dashboardId, parameters) {
+        const container = this.containers.first?.nativeElement;
+        if (!container)
+            return;
+        this.isLoading.set(true);
+        try {
+            await this.sharedService.embedDashboard({ dashboardId, parameters }, container, {
+                height: this.height() ?? `${window.innerHeight - 50}px`,
+                onChange: event => dispatchQuicksightEvent(event, this),
+            });
+        }
+        catch (error) {
+            console.error('Error embedding dashboard:', error);
+        }
+        finally {
+            setTimeout(() => this.isLoading.set(false), 2000);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: DashboardQsComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.23", type: DashboardQsComponent, isStandalone: true, selector: "intelica-dashboard-qs", inputs: { dashboardIdInput: { classPropertyName: "dashboardIdInput", publicName: "dashboardId", isSignal: true, isRequired: false, transformFunction: null }, parametersInput: { classPropertyName: "parametersInput", publicName: "parameters", isSignal: true, isRequired: false, transformFunction: null }, heightInput: { classPropertyName: "heightInput", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isLoadingChange: "isLoadingChange", sdkEvent: "sdkEvent", contentLoaded: "contentLoaded", errorOccurred: "errorOccurred", sessionExpired: "sessionExpired" }, viewQueries: [{ propertyName: "containers", predicate: ["visualContainer"], descendants: true }], ngImport: i0, template: "@if (isLoading()) {\n<div class=\"u-display-flex u-flex-column u-gap-sm\">\n    <div class=\"u-display-flex u-background-white u-px-1 u-pt-1\">\n        <div class=\"u-display-flex u-flex-column u-px-1\" style=\"height: 33px\">\n            <p-skeleton class=\"prSkeleton u-m-auto\" [width]=\"'61px'\" [height]=\"'14px'\" />\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'2px'\" />\n        </div>\n        <div class=\"u-display-flex u-flex-column u-px-1\" style=\"height: 33px\">\n            <p-skeleton class=\"prSkeleton u-m-auto\" [width]=\"'61px'\" [height]=\"'14px'\" />\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'2px'\" />\n        </div>\n    </div>\n    <div class=\"u-display-flex u-flex-column u-gap-sm\">\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 1061.57 / 93.02\" />\n        </p-panel>\n    </div>\n    <div class=\"u-display-flex u-flex-row u-gap-sm\">\n        @for (_ of [].constructor(4); track $index) {\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 244.87 / 123.12\" />\n        </p-panel>\n        }\n    </div>\n    <div class=\"u-display-flex u-flex-column u-gap-sm\">\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 1061.57 / 303.7\" />\n        </p-panel>\n    </div>\n    <div class=\"u-display-flex u-flex-row u-gap-sm\">\n        @for (_ of [].constructor(2); track $index) {\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 517.1 / 123.12\" />\n        </p-panel>\n        }\n    </div>\n</div>\n}\n<div #visualContainer [style.height]=\"height()\" [hidden]=\"isLoading()\"></div>", dependencies: [{ kind: "component", type: Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: Panel, selector: "p-panel", inputs: ["id", "toggleable", "header", "collapsed", "styleClass", "iconPos", "showHeader", "toggler", "transitionOptions", "toggleButtonProps"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: DashboardQsComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'intelica-dashboard-qs', imports: [Skeleton, Panel], template: "@if (isLoading()) {\n<div class=\"u-display-flex u-flex-column u-gap-sm\">\n    <div class=\"u-display-flex u-background-white u-px-1 u-pt-1\">\n        <div class=\"u-display-flex u-flex-column u-px-1\" style=\"height: 33px\">\n            <p-skeleton class=\"prSkeleton u-m-auto\" [width]=\"'61px'\" [height]=\"'14px'\" />\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'2px'\" />\n        </div>\n        <div class=\"u-display-flex u-flex-column u-px-1\" style=\"height: 33px\">\n            <p-skeleton class=\"prSkeleton u-m-auto\" [width]=\"'61px'\" [height]=\"'14px'\" />\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'2px'\" />\n        </div>\n    </div>\n    <div class=\"u-display-flex u-flex-column u-gap-sm\">\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 1061.57 / 93.02\" />\n        </p-panel>\n    </div>\n    <div class=\"u-display-flex u-flex-row u-gap-sm\">\n        @for (_ of [].constructor(4); track $index) {\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 244.87 / 123.12\" />\n        </p-panel>\n        }\n    </div>\n    <div class=\"u-display-flex u-flex-column u-gap-sm\">\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 1061.57 / 303.7\" />\n        </p-panel>\n    </div>\n    <div class=\"u-display-flex u-flex-row u-gap-sm\">\n        @for (_ of [].constructor(2); track $index) {\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 517.1 / 123.12\" />\n        </p-panel>\n        }\n    </div>\n</div>\n}\n<div #visualContainer [style.height]=\"height()\" [hidden]=\"isLoading()\"></div>" }]
+        }], ctorParameters: () => [], propDecorators: { containers: [{
+                type: ViewChildren,
+                args: ['visualContainer']
+            }], dashboardIdInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "dashboardId", required: false }] }], parametersInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "parameters", required: false }] }], heightInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], isLoadingChange: [{ type: i0.Output, args: ["isLoadingChange"] }], sdkEvent: [{ type: i0.Output, args: ["sdkEvent"] }], contentLoaded: [{ type: i0.Output, args: ["contentLoaded"] }], errorOccurred: [{ type: i0.Output, args: ["errorOccurred"] }], sessionExpired: [{ type: i0.Output, args: ["sessionExpired"] }] } });
+
+class DashboardQsInteractiveComponent {
+    sharedService = inject(Shared);
+    route = inject(ActivatedRoute);
+    containers;
+    dashboardIdInput = input(undefined, ...(ngDevMode ? [{ debugName: "dashboardIdInput", alias: 'dashboardId' }] : [{ alias: 'dashboardId' }]));
+    parametersInput = input(undefined, ...(ngDevMode ? [{ debugName: "parametersInput", alias: 'parameters' }] : [{ alias: 'parameters' }]));
+    heightInput = input(undefined, ...(ngDevMode ? [{ debugName: "heightInput", alias: 'height' }] : [{ alias: 'height' }]));
+    routeData = toSignal(this.route.data, { initialValue: this.route.snapshot.data });
+    dashboardId = computed(() => this.dashboardIdInput() ?? this.routeData()['dashboardId'], ...(ngDevMode ? [{ debugName: "dashboardId" }] : []));
+    parameters = computed(() => this.parametersInput() ?? this.routeData()['parameters'], ...(ngDevMode ? [{ debugName: "parameters" }] : []));
+    height = computed(() => this.heightInput() ?? this.routeData()['height'], ...(ngDevMode ? [{ debugName: "height" }] : []));
+    isLoading = signal(true, ...(ngDevMode ? [{ debugName: "isLoading" }] : []));
+    isLoadingChange = output();
+    sdkEvent = output();
+    contentLoaded = output();
+    errorOccurred = output();
+    sessionExpired = output();
+    viewReady = signal(false, ...(ngDevMode ? [{ debugName: "viewReady" }] : []));
+    dashboardRef = null;
+    lastEmbeddedId = undefined;
+    constructor() {
+        effect(() => {
+            this.isLoadingChange.emit(this.isLoading());
+        });
+        effect(() => {
+            const id = this.dashboardId();
+            if (!this.viewReady() || !id)
+                return;
+            if (id === this.lastEmbeddedId)
+                return;
+            this.lastEmbeddedId = id;
+            this.firstEmbed(id);
+        });
+        effect(() => {
+            const params = this.parameters();
+            if (!this.dashboardRef || !params)
+                return;
+            this.isLoading.set(true);
+            this.sharedService.setDashboardParameters(this.dashboardRef, params)
+                .finally(() => setTimeout(() => this.isLoading.set(false), 2000));
+        });
+    }
+    ngAfterViewInit() {
+        this.viewReady.set(true);
+    }
+    async firstEmbed(dashboardId) {
+        const container = this.containers.first?.nativeElement;
+        if (!container)
+            return;
+        this.isLoading.set(true);
+        try {
+            this.dashboardRef = await this.sharedService.embedDashboardInteractive({ dashboardId, parameters: this.parameters() }, container, {
+                height: this.height() ?? `${window.innerHeight - 50}px`,
+                onChange: event => dispatchQuicksightEvent(event, this),
+            });
+        }
+        catch (error) {
+            console.error('Error embedding dashboard:', error);
+        }
+        finally {
+            setTimeout(() => this.isLoading.set(false), 2000);
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: DashboardQsInteractiveComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "20.3.23", type: DashboardQsInteractiveComponent, isStandalone: true, selector: "intelica-dashboard-qs-interactive", inputs: { dashboardIdInput: { classPropertyName: "dashboardIdInput", publicName: "dashboardId", isSignal: true, isRequired: false, transformFunction: null }, parametersInput: { classPropertyName: "parametersInput", publicName: "parameters", isSignal: true, isRequired: false, transformFunction: null }, heightInput: { classPropertyName: "heightInput", publicName: "height", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { isLoadingChange: "isLoadingChange", sdkEvent: "sdkEvent", contentLoaded: "contentLoaded", errorOccurred: "errorOccurred", sessionExpired: "sessionExpired" }, viewQueries: [{ propertyName: "containers", predicate: ["visualContainer"], descendants: true }], ngImport: i0, template: "@if (isLoading()) {\n<div class=\"u-display-flex u-flex-column u-gap-sm\">\n    <div class=\"u-display-flex u-background-white u-px-1 u-pt-1\">\n        <div class=\"u-display-flex u-flex-column u-px-1\" style=\"height: 33px\">\n            <p-skeleton class=\"prSkeleton u-m-auto\" [width]=\"'61px'\" [height]=\"'14px'\" />\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'2px'\" />\n        </div>\n        <div class=\"u-display-flex u-flex-column u-px-1\" style=\"height: 33px\">\n            <p-skeleton class=\"prSkeleton u-m-auto\" [width]=\"'61px'\" [height]=\"'14px'\" />\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'2px'\" />\n        </div>\n    </div>\n    <div class=\"u-display-flex u-flex-column u-gap-sm\">\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 1061.57 / 93.02\" />\n        </p-panel>\n    </div>\n    <div class=\"u-display-flex u-flex-row u-gap-sm\">\n        @for (_ of [].constructor(4); track $index) {\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 244.87 / 123.12\" />\n        </p-panel>\n        }\n    </div>\n    <div class=\"u-display-flex u-flex-column u-gap-sm\">\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 1061.57 / 303.7\" />\n        </p-panel>\n    </div>\n    <div class=\"u-display-flex u-flex-row u-gap-sm\">\n        @for (_ of [].constructor(2); track $index) {\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 517.1 / 123.12\" />\n        </p-panel>\n        }\n    </div>\n</div>\n}\n<div #visualContainer [style.height]=\"height()\" [hidden]=\"isLoading()\"></div>", dependencies: [{ kind: "component", type: Skeleton, selector: "p-skeleton", inputs: ["styleClass", "shape", "animation", "borderRadius", "size", "width", "height"] }, { kind: "component", type: Panel, selector: "p-panel", inputs: ["id", "toggleable", "header", "collapsed", "styleClass", "iconPos", "showHeader", "toggler", "transitionOptions", "toggleButtonProps"], outputs: ["collapsedChange", "onBeforeToggle", "onAfterToggle"] }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: DashboardQsInteractiveComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'intelica-dashboard-qs-interactive', imports: [Skeleton, Panel], template: "@if (isLoading()) {\n<div class=\"u-display-flex u-flex-column u-gap-sm\">\n    <div class=\"u-display-flex u-background-white u-px-1 u-pt-1\">\n        <div class=\"u-display-flex u-flex-column u-px-1\" style=\"height: 33px\">\n            <p-skeleton class=\"prSkeleton u-m-auto\" [width]=\"'61px'\" [height]=\"'14px'\" />\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'2px'\" />\n        </div>\n        <div class=\"u-display-flex u-flex-column u-px-1\" style=\"height: 33px\">\n            <p-skeleton class=\"prSkeleton u-m-auto\" [width]=\"'61px'\" [height]=\"'14px'\" />\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'2px'\" />\n        </div>\n    </div>\n    <div class=\"u-display-flex u-flex-column u-gap-sm\">\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 1061.57 / 93.02\" />\n        </p-panel>\n    </div>\n    <div class=\"u-display-flex u-flex-row u-gap-sm\">\n        @for (_ of [].constructor(4); track $index) {\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 244.87 / 123.12\" />\n        </p-panel>\n        }\n    </div>\n    <div class=\"u-display-flex u-flex-column u-gap-sm\">\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 1061.57 / 303.7\" />\n        </p-panel>\n    </div>\n    <div class=\"u-display-flex u-flex-row u-gap-sm\">\n        @for (_ of [].constructor(2); track $index) {\n        <p-panel class=\"prPanel u-flex-grow-1 u-flex-basis-0 u-shadow-none\" showHeader=\"false\">\n            <p-skeleton class=\"prSkeleton\" [width]=\"'100%'\" [height]=\"'100%'\" style=\"aspect-ratio: 517.1 / 123.12\" />\n        </p-panel>\n        }\n    </div>\n</div>\n}\n<div #visualContainer [style.height]=\"height()\" [hidden]=\"isLoading()\"></div>" }]
+        }], ctorParameters: () => [], propDecorators: { containers: [{
+                type: ViewChildren,
+                args: ['visualContainer']
+            }], dashboardIdInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "dashboardId", required: false }] }], parametersInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "parameters", required: false }] }], heightInput: [{ type: i0.Input, args: [{ isSignal: true, alias: "height", required: false }] }], isLoadingChange: [{ type: i0.Output, args: ["isLoadingChange"] }], sdkEvent: [{ type: i0.Output, args: ["sdkEvent"] }], contentLoaded: [{ type: i0.Output, args: ["contentLoaded"] }], errorOccurred: [{ type: i0.Output, args: ["errorOccurred"] }], sessionExpired: [{ type: i0.Output, args: ["sessionExpired"] }] } });
+
+class AddFavoritesService {
+    favoritesService = inject(GlobalFavoriteService);
+    globalTermService = inject(GlobalTermService);
+    addPageToFavorites() {
+        return this.favoritesService.create().pipe(map(() => void 0));
+    }
+    isPageFavorite(pageRoot) {
+        const resolvedPageRoot = this.resolvePageRoot(pageRoot);
+        return this.favoritesService.favoritesChanges().pipe(map(() => this.favoritesService.isFavoriteByPageRoot(resolvedPageRoot)), distinctUntilChanged());
+    }
+    watchPageFavorite(pageRoot) {
+        const resolvedPageRoot = this.resolvePageRoot(pageRoot);
+        return this.favoritesService.favoritesChanges().pipe(map(() => this.favoritesService.isFavoriteByPageRoot(resolvedPageRoot)), distinctUntilChanged());
+    }
+    removeFromFavorites(pageRoot) {
+        const resolvedPageRoot = this.resolvePageRoot(pageRoot);
+        return this.favoritesService.removeFavoriteByPageRoot(resolvedPageRoot);
+    }
+    resolvePageRoot(pageRoot) {
+        return pageRoot?.trim() || this.globalTermService.GetPageRoot();
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: AddFavoritesService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: AddFavoritesService, providedIn: "root" });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: AddFavoritesService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: "root",
+                }]
+        }] });
+
+const ICON_ON = "icon-favorites-on";
+const ICON_OFF = "icon-favorites-off";
+class AddFavoritesComponent {
+    termService = inject(GlobalTermService);
+    addFavoriteService = inject(AddFavoritesService);
+    destroyRef = inject(DestroyRef);
+    favoriteChanged = output();
+    isFavorite = false;
+    isToggling = false;
+    iconClass = ICON_OFF;
+    ngOnInit() {
+        this.loadInitialState();
+    }
+    toggleFavorite() {
+        if (this.isToggling)
+            return;
+        this.isToggling = true;
+        const nextFavorite = !this.isFavorite;
+        const action$ = this.isFavorite ? this.addFavoriteService.removeFromFavorites() : this.addFavoriteService.addPageToFavorites();
+        action$.subscribe({
+            next: () => {
+                this.favoriteChanged.emit(nextFavorite);
+            },
+            complete: () => (this.isToggling = false),
+            error: () => (this.isToggling = false),
+        });
+    }
+    loadInitialState() {
+        this.addFavoriteService
+            .watchPageFavorite()
+            .pipe(takeUntilDestroyed(this.destroyRef))
+            .subscribe({
+            next: isFavorite => {
+                this.isFavorite = isFavorite;
+                this.updateIcon();
+            },
+        });
+    }
+    updateIcon() {
+        this.iconClass = this.isFavorite ? ICON_ON : ICON_OFF;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: AddFavoritesComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "20.3.23", type: AddFavoritesComponent, isStandalone: true, selector: "intelica-add-favorites", outputs: { favoriteChanged: "favoriteChanged" }, ngImport: i0, template: "<p-button class=\"prButton\" severity=\"secondary\" [disabled]=\"isToggling\" (onClick)=\"toggleFavorite()\">\n\t<i class=\"icon p-button-icon-left\" [ngClass]=\"iconClass\" pButtonIcon></i>\n\t<span pButtonLabel>{{ \"ADD_TO_FAVORITES\" | term : termService.languageCode }}</span>\n</p-button>\n", dependencies: [{ kind: "component", type: Button, selector: "p-button", inputs: ["hostName", "type", "badge", "disabled", "raised", "rounded", "text", "plain", "outlined", "link", "tabindex", "size", "variant", "style", "styleClass", "badgeClass", "badgeSeverity", "ariaLabel", "autofocus", "iconPos", "icon", "label", "loading", "loadingIcon", "severity", "buttonProps", "fluid"], outputs: ["onClick", "onFocus", "onBlur"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "pipe", type: TermPipe, name: "term" }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "20.3.23", ngImport: i0, type: AddFavoritesComponent, decorators: [{
+            type: Component,
+            args: [{ selector: "intelica-add-favorites", imports: [Button, TermPipe, NgClass], template: "<p-button class=\"prButton\" severity=\"secondary\" [disabled]=\"isToggling\" (onClick)=\"toggleFavorite()\">\n\t<i class=\"icon p-button-icon-left\" [ngClass]=\"iconClass\" pButtonIcon></i>\n\t<span pButtonLabel>{{ \"ADD_TO_FAVORITES\" | term : termService.languageCode }}</span>\n</p-button>\n" }]
+        }], propDecorators: { favoriteChanged: [{ type: i0.Output, args: ["favoriteChanged"] }] } });
+
 class PageElementService {
     _http = inject(HttpClient);
     _configService = inject(ConfigService);
@@ -2970,5 +3350,5 @@ class PageInformation {
  * Generated bundle index. Do not edit.
  */
 
-export { ColumnComponent, ColumnGroupComponent, EchartComponent, EchartService, ElementService, FormatAmountPipe, FormatCellPipe, OrderConstants, PageElementService, PageInformation, RequestCacheService, RowResumenComponent, SearchComponent, SearchInputEnum, SharedService, SkeletonTableComponent, SortingComponent, TableComponent, TableFetchComponent, TruncatePipe, darkenColor };
+export { AddFavoritesComponent, AddFavoritesService, BreadCrumbComponent, ColumnComponent, ColumnGroupComponent, DashboardQsComponent, DashboardQsInteractiveComponent, EchartComponent, EchartService, ElementService, FormatAmountPipe, FormatCellPipe, OrderConstants, PageElementService, PageInformation, QuicksightEventName, RequestCacheService, RowResumenComponent, SearchComponent, SearchInputEnum, Shared, SharedService, SkeletonTableComponent, SortingComponent, TableComponent, TableFetchComponent, TitleComponent, TruncatePipe, darkenColor, dispatchQuicksightEvent, isQuicksightSessionExpiredEvent };
 //# sourceMappingURL=intelica-library-project.mjs.map