@edm-sdui/sdui 1.0.26 → 1.0.28

package/fesm2022/edm-sdui-sdui.mjs

@@ -90,14 +90,19 @@ class UIScreenService {
             .pipe(map((json) => this.mapToUIScreen(json)));
     }
     mapToUIScreen(json) {
-        const { identifier, content } = json;
+        const { identifier, content, config } = json;
         if (!identifier) {
             throw new Error(`Identificador da tela ausente no JSON recebido.`);
         }
         const layout = this.getLayout(identifier, content);
+        const normalizedConfig = config ??
+            (json.container
+                ? { container: json.container }
+                : null);
         return {
             identifier: identifier,
             content: layout,
+            config: this.mapToUIScreenConfig(normalizedConfig),
             ...this.mapToUIView(json),
         };
     }
@@ -173,6 +178,7 @@ class UIScreenService {
     }
     mapToUIView(json) {
         return {
+            id: json.id ?? null,
             padding: json.padding,
             background: json.background ? this.mapBackground(json.background) : null,
             action: json.action ? this.mapAction(json.action) : null,
@@ -191,6 +197,19 @@ class UIScreenService {
             justify: json.justify ? json.justify : null,
         };
     }
+    mapToUIScreenConfig(config) {
+        if (!config) {
+            return null;
+        }
+        const containerValue = config.container;
+        const containerNormalized = containerValue
+            ? String(containerValue).toLowerCase()
+            : null;
+        return {
+            alwaysReload: config.always_reload ?? config.alwaysReload ?? null,
+            container: containerNormalized,
+        };
+    }
     mapBackground(json) {
         return {
             backgroundColor: json.background_color ? json.background_color : null,
@@ -203,6 +222,7 @@ class UIScreenService {
             canAccess: json.can_acces ?? null,
             type: json.type ? json.type : null,
             url: json.url ?? null,
+            param: json.param ?? null,
         };
     }
     mapRadius(json) {
@@ -422,6 +442,7 @@ var UIActionType;
     UIActionType["DISMISS_TO_SCENE"] = "DISMISS_TO_SCENE";
     UIActionType["EXTERNAL_URL"] = "EXTERNAL_URL";
     UIActionType["WEBVIEW_URL"] = "WEBVIEW_URL";
+    UIActionType["ANCHOR"] = "ANCHOR";
     // paywall
     UIActionType["PAYWALL"] = "PAYWALL";
     UIActionType["REGISTER"] = "REGISTER";
@@ -547,9 +568,37 @@ class UIActionService {
                     const modal = this.modalService.open(action.url);
                 }
                 break;
+            case UIActionType.ANCHOR:
+                this.scrollToAnchor(action);
+                break;
             // Outros tipos de ação podem ser adicionados aqui
         }
     }
+    scrollToAnchor(action) {
+        // Confluence: param = string para uso geral; aqui priorizamos param como id do elemento
+        const raw = action.param || action.url || '';
+        const targetId = String(raw).replace(/^#/, '').trim();
+        if (!targetId) {
+            console.warn('[UIActionService] ANCHOR sem destino informado');
+            return;
+        }
+        const el = document.getElementById(targetId);
+        if (!el) {
+            console.warn('[UIActionService] ANCHOR não encontrou elemento com id:', targetId);
+            return;
+        }
+        try {
+            el.scrollIntoView({ behavior: 'smooth', block: 'start', inline: 'nearest' });
+        }
+        catch {
+            el.scrollIntoView();
+        }
+        // guarda o último anchor acessado (usado pelo app host para restaurar)
+        try {
+            sessionStorage.setItem('exploreLastAnchor', targetId);
+        }
+        catch { }
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UIActionService, deps: [{ token: i1$3.Router }, { token: ModalService }, { token: UIActionHandlersService }], target: i0.ɵɵFactoryTarget.Injectable }); }
     static { this.ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UIActionService, providedIn: 'root' }); }
 }
@@ -751,6 +800,9 @@ var UIAsset;
     UIAsset["IC_LINK_LIST"] = "ic_link_list";
     UIAsset["IC_LINK_LIST_DISABLED"] = "ic_link_list_disabled";
     UIAsset["IC_LIVE_WAITING"] = "ic_live_waiting";
+    UIAsset["IC_PLAY_VIEW_EXPLORER"] = "ic_play_view_explorer";
+    UIAsset["IC_RATING_EXPLORER"] = "ic_rating_explorer";
+    UIAsset["IC_CHECK_EXPLORER"] = "ic_check_explorer";
     UIAsset["IC_LOCK"] = "ic_lock";
     UIAsset["IC_LOCK_CHECK"] = "ic_lock_check";
     UIAsset["IC_LOCK_LESSON"] = "ic_lock_lesson";
@@ -927,6 +979,7 @@ var UIAsset;
     UIAsset["BT_NEXT_PROFILE"] = "bt_next_profile";
     UIAsset["IC_SUPPORT_PROFILE"] = "ic_support_profile";
     UIAsset["BT_BACK_SEC"] = "bt_back_sec";
+    UIAsset["IC_EXPLORER_EMPTY"] = "ic_explorer_empty";
 })(UIAsset || (UIAsset = {}));
 
 const assetMapping = {
@@ -1118,6 +1171,9 @@ const assetMapping = {
     [UIAsset.IC_LINK_LIST]: 'assets/images/ic-link-list.svg',
     [UIAsset.IC_LINK_LIST_DISABLED]: 'assets/images/ic-link-list-disabled.svg',
     [UIAsset.IC_LIVE_WAITING]: 'assets/images/ic-live-waiting.svg',
+    [UIAsset.IC_PLAY_VIEW_EXPLORER]: 'assets/images/ic-play-view-explorer.svg',
+    [UIAsset.IC_RATING_EXPLORER]: 'assets/images/ic-rating-explorer.svg',
+    [UIAsset.IC_CHECK_EXPLORER]: 'assets/images/ic-check-explorer.svg',
     [UIAsset.IC_LOCK]: 'assets/images/ic-lock.svg',
     [UIAsset.IC_LOCK_CHECK]: 'assets/images/ic-lock-check.svg',
     [UIAsset.IC_LOCK_LESSON]: 'assets/images/ic-lock-lesson.svg',
@@ -1297,6 +1353,7 @@ const assetMapping = {
     [UIAsset.BT_NEXT_PROFILE]: 'assets/images/bt-next-profile.svg',
     [UIAsset.IC_SUPPORT_PROFILE]: 'assets/images/ic-support-profile.svg',
     [UIAsset.BT_BACK_SEC]: 'assets/images/bt-back-sec.svg',
+    [UIAsset.IC_EXPLORER_EMPTY]: 'assets/images/ic-explorer-empty.svg'
 };
 
 var UISpacingLevel;
@@ -1778,6 +1835,9 @@ class UIViewDirective {
         }
     }
     applyStyles(uiView) {
+        if (uiView.id) {
+            this.renderer.setAttribute(this.elementRef.nativeElement, 'id', String(uiView.id));
+        }
         if (uiView.padding) {
             this.applyPadding(uiView.padding);
         }
@@ -2054,12 +2114,18 @@ class UIScreenComponent {
         this.viewModel = viewModel;
         this.UIScreenIdentifier = UIScreenIdentifier;
     }
+    containerClass(config) {
+        const container = (config?.container || 'fluid').toString().toLowerCase();
+        return container === 'contained'
+            ? 'ui-screen--contained'
+            : 'ui-screen--fluid';
+    }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UIScreenComponent, deps: [{ token: UIScreenViewModel }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: UIScreenComponent, isStandalone: false, selector: "edm-sdui-uiscreen", ngImport: i0, template: "<ng-container *ngIf=\"viewModel.isLoading$ | async; else loaded\">\n  <div class=\"loading-spinner\">\n    <div class=\"spinner\"></div>\n  </div>\n</ng-container>\n\n<ng-template #loaded>\n  <ng-container\n    *ngIf=\"viewModel.error$ | async as errorMessage; else renderScreen\"\n  >\n    <div class=\"error-label\">\n      Erro ao carregar a tela:\n      <pre>{{ errorMessage }}</pre>\n    </div>\n  </ng-container>\n\n  <ng-template #renderScreen>\n    <div\n      class=\"ui-screen\"\n      *ngIf=\"viewModel.uiScreen$ | async as uiScreen\"\n      [edmSduiView]=\"uiScreen\"\n    >\n      <edm-sdui-navigation-controls\n        [edmSduiView]=\"uiScreen\"\n      ></edm-sdui-navigation-controls>\n\n      <ng-container [ngSwitch]=\"uiScreen.identifier\">\n        <edm-sdui-single-column-layout\n          *ngSwitchCase=\"UIScreenIdentifier.SINGLE_COLUMN\"\n          [uiLayout]=\"uiScreen.content\"\n        ></edm-sdui-single-column-layout>\n\n        <edm-sdui-centered-content-layout\n          *ngSwitchCase=\"UIScreenIdentifier.CENTERED_CONTENT\"\n          [uiLayout]=\"uiScreen.content\"\n        ></edm-sdui-centered-content-layout>\n      </ng-container>\n    </div>\n  </ng-template>\n</ng-template>\n", styles: [":host{display:contents}.ui-screen{width:100vw;min-height:100vh}.error-label{color:var(--input-error)}.loading-spinner{display:flex;justify-content:center;align-items:center;height:100vh;width:100vw;box-sizing:border-box;position:relative}.spinner{width:48px;height:48px;border:5px solid var(--actindcolor);border-top-color:#333;border-radius:50%;animation:spin 1s linear infinite;top:50%;left:50%}@keyframes spin{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: SingleColumnLayoutComponent, selector: "edm-sdui-single-column-layout", inputs: ["uiLayout"] }, { kind: "component", type: CenteredContentLayoutComponent, selector: "edm-sdui-centered-content-layout", inputs: ["uiLayout"] }, { kind: "directive", type: UIViewDirective, selector: "[edmSduiView]", inputs: ["edmSduiView", "disableClick"] }, { kind: "component", type: NavigationControlsComponent, selector: "edm-sdui-navigation-controls" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: UIScreenComponent, isStandalone: false, selector: "edm-sdui-uiscreen", ngImport: i0, template: "<ng-container *ngIf=\"viewModel.isLoading$ | async; else loaded\">\n  <div class=\"loading-spinner\">\n    <div class=\"spinner\"></div>\n  </div>\n</ng-container>\n\n<ng-template #loaded>\n  <ng-container\n    *ngIf=\"viewModel.error$ | async as errorMessage; else renderScreen\"\n  >\n    <div class=\"error-label\">\n      Erro ao carregar a tela:\n      <pre>{{ errorMessage }}</pre>\n    </div>\n  </ng-container>\n\n  <ng-template #renderScreen>\n    <div\n      class=\"ui-screen\"\n      *ngIf=\"viewModel.uiScreen$ | async as uiScreen\"\n      [ngClass]=\"containerClass(uiScreen.config)\"\n      [edmSduiView]=\"uiScreen\"\n    >\n      <edm-sdui-navigation-controls\n        [edmSduiView]=\"uiScreen\"\n      ></edm-sdui-navigation-controls>\n\n      <ng-container [ngSwitch]=\"uiScreen.identifier\">\n        <edm-sdui-single-column-layout\n          *ngSwitchCase=\"UIScreenIdentifier.SINGLE_COLUMN\"\n          [uiLayout]=\"uiScreen.content\"\n        ></edm-sdui-single-column-layout>\n\n        <edm-sdui-centered-content-layout\n          *ngSwitchCase=\"UIScreenIdentifier.CENTERED_CONTENT\"\n          [uiLayout]=\"uiScreen.content\"\n        ></edm-sdui-centered-content-layout>\n      </ng-container>\n    </div>\n  </ng-template>\n</ng-template>\n", styles: [":host{display:contents}.ui-screen{width:100%;min-height:100vh}.ui-screen--fluid{width:100vw}.ui-screen--contained{width:100%;max-width:1200px;margin:0 auto;padding:16px;box-sizing:border-box}.error-label{color:var(--input-error)}.loading-spinner{display:flex;justify-content:center;align-items:center;height:100vh;width:100vw;box-sizing:border-box;position:relative}.spinner{width:48px;height:48px;border:5px solid var(--actindcolor);border-top-color:#333;border-radius:50%;animation:spin 1s linear infinite;top:50%;left:50%}@keyframes spin{to{transform:rotate(360deg)}}\n"], dependencies: [{ kind: "directive", type: i1$1.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i1$1.NgSwitch, selector: "[ngSwitch]", inputs: ["ngSwitch"] }, { kind: "directive", type: i1$1.NgSwitchCase, selector: "[ngSwitchCase]", inputs: ["ngSwitchCase"] }, { kind: "component", type: SingleColumnLayoutComponent, selector: "edm-sdui-single-column-layout", inputs: ["uiLayout"] }, { kind: "component", type: CenteredContentLayoutComponent, selector: "edm-sdui-centered-content-layout", inputs: ["uiLayout"] }, { kind: "directive", type: UIViewDirective, selector: "[edmSduiView]", inputs: ["edmSduiView", "disableClick"] }, { kind: "component", type: NavigationControlsComponent, selector: "edm-sdui-navigation-controls" }, { kind: "pipe", type: i1$1.AsyncPipe, name: "async" }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: UIScreenComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'edm-sdui-uiscreen', standalone: false, template: "<ng-container *ngIf=\"viewModel.isLoading$ | async; else loaded\">\n  <div class=\"loading-spinner\">\n    <div class=\"spinner\"></div>\n  </div>\n</ng-container>\n\n<ng-template #loaded>\n  <ng-container\n    *ngIf=\"viewModel.error$ | async as errorMessage; else renderScreen\"\n  >\n    <div class=\"error-label\">\n      Erro ao carregar a tela:\n      <pre>{{ errorMessage }}</pre>\n    </div>\n  </ng-container>\n\n  <ng-template #renderScreen>\n    <div\n      class=\"ui-screen\"\n      *ngIf=\"viewModel.uiScreen$ | async as uiScreen\"\n      [edmSduiView]=\"uiScreen\"\n    >\n      <edm-sdui-navigation-controls\n        [edmSduiView]=\"uiScreen\"\n      ></edm-sdui-navigation-controls>\n\n      <ng-container [ngSwitch]=\"uiScreen.identifier\">\n        <edm-sdui-single-column-layout\n          *ngSwitchCase=\"UIScreenIdentifier.SINGLE_COLUMN\"\n          [uiLayout]=\"uiScreen.content\"\n        ></edm-sdui-single-column-layout>\n\n        <edm-sdui-centered-content-layout\n          *ngSwitchCase=\"UIScreenIdentifier.CENTERED_CONTENT\"\n          [uiLayout]=\"uiScreen.content\"\n        ></edm-sdui-centered-content-layout>\n      </ng-container>\n    </div>\n  </ng-template>\n</ng-template>\n", styles: [":host{display:contents}.ui-screen{width:100vw;min-height:100vh}.error-label{color:var(--input-error)}.loading-spinner{display:flex;justify-content:center;align-items:center;height:100vh;width:100vw;box-sizing:border-box;position:relative}.spinner{width:48px;height:48px;border:5px solid var(--actindcolor);border-top-color:#333;border-radius:50%;animation:spin 1s linear infinite;top:50%;left:50%}@keyframes spin{to{transform:rotate(360deg)}}\n"] }]
+            args: [{ selector: 'edm-sdui-uiscreen', standalone: false, template: "<ng-container *ngIf=\"viewModel.isLoading$ | async; else loaded\">\n  <div class=\"loading-spinner\">\n    <div class=\"spinner\"></div>\n  </div>\n</ng-container>\n\n<ng-template #loaded>\n  <ng-container\n    *ngIf=\"viewModel.error$ | async as errorMessage; else renderScreen\"\n  >\n    <div class=\"error-label\">\n      Erro ao carregar a tela:\n      <pre>{{ errorMessage }}</pre>\n    </div>\n  </ng-container>\n\n  <ng-template #renderScreen>\n    <div\n      class=\"ui-screen\"\n      *ngIf=\"viewModel.uiScreen$ | async as uiScreen\"\n      [ngClass]=\"containerClass(uiScreen.config)\"\n      [edmSduiView]=\"uiScreen\"\n    >\n      <edm-sdui-navigation-controls\n        [edmSduiView]=\"uiScreen\"\n      ></edm-sdui-navigation-controls>\n\n      <ng-container [ngSwitch]=\"uiScreen.identifier\">\n        <edm-sdui-single-column-layout\n          *ngSwitchCase=\"UIScreenIdentifier.SINGLE_COLUMN\"\n          [uiLayout]=\"uiScreen.content\"\n        ></edm-sdui-single-column-layout>\n\n        <edm-sdui-centered-content-layout\n          *ngSwitchCase=\"UIScreenIdentifier.CENTERED_CONTENT\"\n          [uiLayout]=\"uiScreen.content\"\n        ></edm-sdui-centered-content-layout>\n      </ng-container>\n    </div>\n  </ng-template>\n</ng-template>\n", styles: [":host{display:contents}.ui-screen{width:100%;min-height:100vh}.ui-screen--fluid{width:100vw}.ui-screen--contained{width:100%;max-width:1200px;margin:0 auto;padding:16px;box-sizing:border-box}.error-label{color:var(--input-error)}.loading-spinner{display:flex;justify-content:center;align-items:center;height:100vh;width:100vw;box-sizing:border-box;position:relative}.spinner{width:48px;height:48px;border:5px solid var(--actindcolor);border-top-color:#333;border-radius:50%;animation:spin 1s linear infinite;top:50%;left:50%}@keyframes spin{to{transform:rotate(360deg)}}\n"] }]
         }], ctorParameters: () => [{ type: UIScreenViewModel }] });
 
 class RowComponent {
@@ -2377,6 +2443,8 @@ var UISize;
 (function (UISize) {
     UISize["THUMB_1"] = "thumb_1";
     UISize["THUMB_2"] = "thumb_2";
+    UISize["THUMB_3"] = "thumb_3";
+    UISize["THUMB_4"] = "thumb_4";
     UISize["ASSET_1"] = "asset_1";
     UISize["ASSET_2"] = "asset_2";
     UISize["ASSET_3"] = "asset_3";
@@ -2390,6 +2458,8 @@ var UISize;
 const sizeMappingHeight = {
     [UISize.THUMB_1]: '56px',
     [UISize.THUMB_2]: '40px',
+    [UISize.THUMB_3]: '180px',
+    [UISize.THUMB_4]: '380px',
     [UISize.ASSET_1]: '26px',
     [UISize.ASSET_2]: '16px',
     [UISize.ASSET_3]: '80px',
@@ -2402,6 +2472,8 @@ const sizeMappingHeight = {
 const sizeMappingWidth = {
     [UISize.THUMB_1]: '100px',
     [UISize.THUMB_2]: '105px',
+    [UISize.THUMB_3]: '320px',
+    [UISize.THUMB_4]: '262px',
     [UISize.ASSET_1]: '26px',
     [UISize.ASSET_2]: '16px',
     [UISize.ASSET_3]: '80px',
@@ -3184,39 +3256,49 @@ class ProfileButtonComponent {
             return;
         }
         const lineHeightRatio = lineHeight / fontSize;
-        const updateMetrics = (forceHeight) => {
-            const targetHeight = lineHeightRatio * fontSize * maxLines;
-            this.renderer.setStyle(labelElement, 'line-height', `${lineHeightRatio * fontSize}px`);
-            this.renderer.setStyle(labelElement, 'max-height', `${targetHeight}px`);
-            if (forceHeight) {
-                this.renderer.setStyle(labelElement, 'height', `${targetHeight}px`);
-            }
-            else {
-                this.renderer.removeStyle(labelElement, 'height');
+        const applyMetrics = () => {
+            const currentLineHeight = lineHeightRatio * fontSize;
+            const allowedHeight = currentLineHeight * maxLines;
+            this.renderer.setStyle(labelElement, 'line-height', `${currentLineHeight}px`);
+            this.renderer.setStyle(labelElement, 'max-height', `${allowedHeight}px`);
+            return allowedHeight;
+        };
+        const fits = (allowedHeight) => {
+            const EPSILON = 0.5;
+            const availableWidth = labelElement.clientWidth;
+            if (availableWidth <= 0) {
+                return true;
             }
-            return targetHeight;
+            return (labelElement.scrollHeight <= allowedHeight + EPSILON &&
+                labelElement.scrollWidth <= availableWidth + EPSILON);
         };
-        let targetHeight = updateMetrics(false);
-        let constrained = false;
-        while (labelElement.scrollHeight > targetHeight && fontSize > minFontSizePx) {
+        this.renderer.removeClass(labelElement, 'truncate');
+        this.renderer.removeStyle(labelElement, 'height');
+        let allowedHeight = applyMetrics();
+        let contentFits = fits(allowedHeight);
+        while (!contentFits && fontSize > minFontSizePx) {
             fontSize -= 1;
             this.renderer.setStyle(labelElement, 'font-size', `${fontSize}px`);
-            targetHeight = updateMetrics(true);
-            constrained = true;
+            allowedHeight = applyMetrics();
+            contentFits = fits(allowedHeight);
         }
-        if (!constrained) {
-            this.renderer.removeStyle(labelElement, 'height');
+        if (!contentFits) {
+            this.renderer.addClass(labelElement, 'truncate');
+        }
+        else {
+            this.renderer.removeClass(labelElement, 'truncate');
+            this.renderer.removeStyle(labelElement, 'max-height');
         }
     }
     getAssetPath(asset) {
         return assetMapping[asset];
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ProfileButtonComponent, deps: [{ token: 'uiComponent' }, { token: i0.Renderer2 }, { token: FontSizeMappingService }], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ProfileButtonComponent, isStandalone: false, selector: "edm-sdui-profile-button", viewQueries: [{ propertyName: "profileButtonElementRef", first: true, predicate: ["profileButtonElement"], descendants: true }, { propertyName: "profileButtonLabelElementRef", first: true, predicate: ["profileButtonLabelElement"], descendants: true }, { propertyName: "profileButtonImageElementRef", first: true, predicate: ["profileButtonImageElement"], descendants: true }], ngImport: i0, template: "<button #profileButtonElement [edmSduiView]=\"uiComponent.element\" class=\"profile-button\" *ngIf=\"uiComponent\">\n  <img #profileButtonImageElement *ngIf=\"uiComponent.element.asset\" [src]=\"getAssetPath(uiComponent.element.asset)\" alt=\"Profile\" class=\"profile-image\">\n  <span #profileButtonLabelElement class=\"profile-label\">{{ uiComponent.element.label }}</span>\n</button>\n", styles: [":host{display:contents}.profile-button{display:flex;padding:16px 16px 0;border-radius:20px;background-color:var(--bt-profile);border:none;cursor:pointer;flex-direction:column;height:108px;width:108px;align-items:start;justify-content:start;gap:24px}.profile-button:hover{background-color:#0000000d;cursor:pointer}.profile-button .profile-image{width:24px;height:24px}.profile-button .profile-label{max-width:100%;white-space:normal;word-break:keep-all;overflow-wrap:normal;text-align:left;line-height:1.25;max-height:2.5em;overflow:hidden;text-overflow:ellipsis;display:block;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;-webkit-hyphens:none;hyphens:none}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: UIViewDirective, selector: "[edmSduiView]", inputs: ["edmSduiView", "disableClick"] }] }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.14", type: ProfileButtonComponent, isStandalone: false, selector: "edm-sdui-profile-button", viewQueries: [{ propertyName: "profileButtonElementRef", first: true, predicate: ["profileButtonElement"], descendants: true }, { propertyName: "profileButtonLabelElementRef", first: true, predicate: ["profileButtonLabelElement"], descendants: true }, { propertyName: "profileButtonImageElementRef", first: true, predicate: ["profileButtonImageElement"], descendants: true }], ngImport: i0, template: "<button #profileButtonElement [edmSduiView]=\"uiComponent.element\" class=\"profile-button\" *ngIf=\"uiComponent\">\n  <img #profileButtonImageElement *ngIf=\"uiComponent.element.asset\" [src]=\"getAssetPath(uiComponent.element.asset)\" alt=\"Profile\" class=\"profile-image\">\n  <span #profileButtonLabelElement class=\"profile-label\">{{ uiComponent.element.label }}</span>\n</button>\n", styles: [":host{display:contents}.profile-button{display:flex;padding:16px 16px 0;border-radius:20px;background-color:var(--bt-profile);border:none;cursor:pointer;flex-direction:column;height:108px;width:108px;align-items:start;justify-content:start;gap:24px}.profile-button:hover{background-color:#0000000d;cursor:pointer}.profile-button .profile-image{width:24px;height:24px}.profile-button .profile-label{max-width:100%;white-space:normal;word-break:keep-all;overflow-wrap:normal;text-align:left;overflow:hidden;display:block}.profile-button .profile-label.truncate{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;text-overflow:ellipsis}\n"], dependencies: [{ kind: "directive", type: i1$1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: UIViewDirective, selector: "[edmSduiView]", inputs: ["edmSduiView", "disableClick"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.14", ngImport: i0, type: ProfileButtonComponent, decorators: [{
             type: Component,
-            args: [{ selector: 'edm-sdui-profile-button', standalone: false, template: "<button #profileButtonElement [edmSduiView]=\"uiComponent.element\" class=\"profile-button\" *ngIf=\"uiComponent\">\n  <img #profileButtonImageElement *ngIf=\"uiComponent.element.asset\" [src]=\"getAssetPath(uiComponent.element.asset)\" alt=\"Profile\" class=\"profile-image\">\n  <span #profileButtonLabelElement class=\"profile-label\">{{ uiComponent.element.label }}</span>\n</button>\n", styles: [":host{display:contents}.profile-button{display:flex;padding:16px 16px 0;border-radius:20px;background-color:var(--bt-profile);border:none;cursor:pointer;flex-direction:column;height:108px;width:108px;align-items:start;justify-content:start;gap:24px}.profile-button:hover{background-color:#0000000d;cursor:pointer}.profile-button .profile-image{width:24px;height:24px}.profile-button .profile-label{max-width:100%;white-space:normal;word-break:keep-all;overflow-wrap:normal;text-align:left;line-height:1.25;max-height:2.5em;overflow:hidden;text-overflow:ellipsis;display:block;display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;-webkit-hyphens:none;hyphens:none}\n"] }]
+            args: [{ selector: 'edm-sdui-profile-button', standalone: false, template: "<button #profileButtonElement [edmSduiView]=\"uiComponent.element\" class=\"profile-button\" *ngIf=\"uiComponent\">\n  <img #profileButtonImageElement *ngIf=\"uiComponent.element.asset\" [src]=\"getAssetPath(uiComponent.element.asset)\" alt=\"Profile\" class=\"profile-image\">\n  <span #profileButtonLabelElement class=\"profile-label\">{{ uiComponent.element.label }}</span>\n</button>\n", styles: [":host{display:contents}.profile-button{display:flex;padding:16px 16px 0;border-radius:20px;background-color:var(--bt-profile);border:none;cursor:pointer;flex-direction:column;height:108px;width:108px;align-items:start;justify-content:start;gap:24px}.profile-button:hover{background-color:#0000000d;cursor:pointer}.profile-button .profile-image{width:24px;height:24px}.profile-button .profile-label{max-width:100%;white-space:normal;word-break:keep-all;overflow-wrap:normal;text-align:left;overflow:hidden;display:block}.profile-button .profile-label.truncate{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;text-overflow:ellipsis}\n"] }]
         }], ctorParameters: () => [{ type: undefined, decorators: [{
                     type: Inject,
                     args: ['uiComponent']