@tilde-nlp/ngx-common 6.1.88 → 6.1.89

package/fesm2022/tilde-nlp-ngx-common.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { Injectable, EventEmitter, Component, Output, Input, ViewChild, NgModule, Optional, Inject, Pipe, inject, Directive, HostListener, HostBinding, ViewChildren, input, effect, ElementRef, ContentChildren, ContentChild, InjectionToken, output, computed, signal } from '@angular/core';
+import { Injectable, EventEmitter, Component, Output, Input, ViewChild, NgModule, Optional, Inject, Pipe, inject, Directive, HostListener, HostBinding, ViewChildren, input, effect, ElementRef, ContentChildren, ContentChild, InjectionToken, signal, output, computed } from '@angular/core';
 import * as i1 from '@angular/material/icon';
 import { MatIconModule, MatIcon } from '@angular/material/icon';
 import * as i2 from '@angular/platform-browser';
@@ -7328,45 +7328,278 @@ var icons = /*#__PURE__*/Object.freeze({
     SUMMARIZE: SUMMARIZE
 });
 
+class NewFeatureDialogComponent {
+    constructor() {
+        this.data = inject(MAT_DIALOG_DATA);
+    }
+    static { this.ɵfac = function NewFeatureDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || NewFeatureDialogComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NewFeatureDialogComponent, selectors: [["lib-new-feature-dialog"]], standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 10, vars: 9, consts: [["mat-dialog-title", ""], [1, "description", 3, "innerHTML"], ["mat-button", "", "mat-dialog-close", "", "color", "accent"]], template: function NewFeatureDialogComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "h2", 0);
+            i0.ɵɵtext(1);
+            i0.ɵɵpipe(2, "translate");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(3, "mat-dialog-content");
+            i0.ɵɵelement(4, "p", 1);
+            i0.ɵɵpipe(5, "translate");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(6, "mat-dialog-actions")(7, "button", 2);
+            i0.ɵɵtext(8);
+            i0.ɵɵpipe(9, "translate");
+            i0.ɵɵelementEnd()();
+        } if (rf & 2) {
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 3, ctx.data.title));
+            i0.ɵɵadvance(3);
+            i0.ɵɵproperty("innerHTML", i0.ɵɵpipeBind1(5, 5, ctx.data.description), i0.ɵɵsanitizeHtml);
+            i0.ɵɵadvance(4);
+            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(9, 7, ctx.data.close), " ");
+        } }, dependencies: [MatDialogModule, i1$4.MatDialogClose, i1$4.MatDialogTitle, i1$4.MatDialogActions, i1$4.MatDialogContent, MatButtonModule, i2$1.MatButton, TranslatePipe], styles: ["[_nghost-%COMP%]    {display:inline-block;padding:12px 16px}[_nghost-%COMP%]     .mat-mdc-dialog-title, [_nghost-%COMP%]     mat-dialog-actions, [_nghost-%COMP%]     mat-dialog-content{padding:0!important;margin:0!important}"] }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NewFeatureDialogComponent, [{
+        type: Component,
+        args: [{ selector: 'lib-new-feature-dialog', standalone: true, imports: [MatDialogModule, MatButtonModule, TranslatePipe], template: "<h2 mat-dialog-title>{{ data.title | translate }}</h2>\r\n<mat-dialog-content>\r\n  <p class=\"description\" [innerHTML]=\"data.description | translate\"></p>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <button mat-button mat-dialog-close color=\"accent\">\r\n    {{ data.close | translate }}\r\n  </button>\r\n</mat-dialog-actions>\r\n", styles: [":host ::ng-deep{display:inline-block;padding:12px 16px}:host ::ng-deep .mat-mdc-dialog-title,:host ::ng-deep mat-dialog-actions,:host ::ng-deep mat-dialog-content{padding:0!important;margin:0!important}\n"] }]
+    }], null, null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NewFeatureDialogComponent, { className: "NewFeatureDialogComponent", filePath: "lib\\new-feature-dialog\\new-feature-dialog.component.ts", lineNumber: 13 }); })();
+
+class NewFeatureDialogService {
+    constructor() {
+        this.current = signal(undefined);
+        this.queue = [];
+    }
+    requestOpenFeature(component) {
+        if (this.queue.includes(component)) {
+            return;
+        }
+        this.queue.push(component);
+        if (!this.current()) {
+            this.showNextFeature();
+        }
+    }
+    showNextFeature() {
+        if (this.queue.length === 0) {
+            return;
+        }
+        const nextFeature = this.queue.shift();
+        if (!nextFeature) {
+            return;
+        }
+        this.current.set(nextFeature);
+        nextFeature.showFeatureDialog();
+    }
+    static { this.ɵfac = function NewFeatureDialogService_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || NewFeatureDialogService)(); }; }
+    static { this.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: NewFeatureDialogService, factory: NewFeatureDialogService.ɵfac, providedIn: 'root' }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NewFeatureDialogService, [{
+        type: Injectable,
+        args: [{
+                providedIn: 'root',
+            }]
+    }], null, null); })();
+
+class NewFeatureDialogWrapperComponent {
+    constructor() {
+        this.timeout = 0;
+        this.maxWidth = 320;
+        this.#dialog = inject(MatDialog);
+        this.#featureService = inject(NewFeatureDialogService);
+        this.#destroy = new Subject();
+        this.featureActive = signal(false);
+        this.isFeatureSeen = false;
+    }
+    #dialog;
+    #featureService;
+    #destroy;
+    ngOnInit() {
+        setTimeout(() => {
+            this.setFeatureStatus();
+        }, this.timeout);
+    }
+    ngOnDestroy() {
+        this.#destroy.next(null);
+        this.#destroy.complete();
+    }
+    showFeatureDialog() {
+        const targetElement = document.querySelector(`.${this.featureClassName}`);
+        if (!targetElement) {
+            return;
+        }
+        if (ResolutionHelper.isMobileRes() && this.mobileScreenCustomPosition?.autoScroll) {
+            targetElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
+        }
+        setTimeout(() => {
+            this.featureActive.set(true);
+            const updatedRects = targetElement.getBoundingClientRect();
+            this.dialogRef = this.#dialog.open(NewFeatureDialogComponent, {
+                data: {
+                    title: this.titleLocalizationKey,
+                    description: this.descriptionLocalizationKey,
+                    close: this.closeLocalizationKey,
+                    featureLocalStorageKey: this.featureLocalStorageKey,
+                },
+                position: {
+                    left: `${ResolutionHelper.isMobileRes() && this.mobileScreenCustomPosition?.left ? this.mobileScreenCustomPosition.left : (updatedRects.left - this.maxWidth) + 'px'}`,
+                    top: `${ResolutionHelper.isMobileRes() && this.mobileScreenCustomPosition?.top ? this.mobileScreenCustomPosition.top : (updatedRects.top + 45) + 'px'}`
+                },
+                maxWidth: `${this.maxWidth}px`
+            });
+            this.dialogRef.afterClosed().subscribe(() => {
+                this.setFeatureSeen();
+                this.#featureService.current.set(undefined);
+                this.#featureService.showNextFeature();
+            });
+            // Wait until the element is visible in the viewport.
+        }, ResolutionHelper.isMobileRes() && this.mobileScreenCustomPosition?.autoScroll ? 500 : 0);
+    }
+    setFeatureStatus() {
+        this.isFeatureSeen = !!this.featureLocalStorageKey && !!localStorage.getItem(this.featureLocalStorageKey);
+        if (!this.isFeatureSeen) {
+            this.#featureService.requestOpenFeature(this);
+        }
+    }
+    setFeatureSeen() {
+        this.featureActive.set(false);
+        this.isFeatureSeen = true;
+        if (this.featureLocalStorageKey) {
+            localStorage.setItem(this.featureLocalStorageKey, 'true');
+        }
+    }
+    static { this.ɵfac = function NewFeatureDialogWrapperComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || NewFeatureDialogWrapperComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NewFeatureDialogWrapperComponent, selectors: [["lib-new-feature-dialog-wrapper"]], inputs: { titleLocalizationKey: "titleLocalizationKey", descriptionLocalizationKey: "descriptionLocalizationKey", closeLocalizationKey: "closeLocalizationKey", featureClassName: "featureClassName", featureLocalStorageKey: "featureLocalStorageKey", timeout: "timeout", maxWidth: "maxWidth", mobileScreenCustomPosition: "mobileScreenCustomPosition" }, standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 0, vars: 0, template: function NewFeatureDialogWrapperComponent_Template(rf, ctx) { }, dependencies: [CommonModule, MatDialogModule], encapsulation: 2 }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NewFeatureDialogWrapperComponent, [{
+        type: Component,
+        args: [{
+                selector: 'lib-new-feature-dialog-wrapper',
+                standalone: true,
+                imports: [CommonModule, MatDialogModule, NewFeatureDialogComponent],
+                template: '',
+            }]
+    }], null, { titleLocalizationKey: [{
+            type: Input
+        }], descriptionLocalizationKey: [{
+            type: Input
+        }], closeLocalizationKey: [{
+            type: Input
+        }], featureClassName: [{
+            type: Input
+        }], featureLocalStorageKey: [{
+            type: Input
+        }], timeout: [{
+            type: Input
+        }], maxWidth: [{
+            type: Input
+        }], mobileScreenCustomPosition: [{
+            type: Input
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NewFeatureDialogWrapperComponent, { className: "NewFeatureDialogWrapperComponent", filePath: "lib\\new-feature-dialog\\new-feature-dialog-wrapper\\new-feature-dialog-wrapper.component.ts", lineNumber: 16 }); })();
+
+class LLMSummaryComponent {
+    constructor() {
+        this.openModalEvent = new EventEmitter();
+    }
+    openModal() {
+        this.openModalEvent.emit(LLMActions.SUMMARY);
+    }
+    static { this.ɵfac = function LLMSummaryComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LLMSummaryComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMSummaryComponent, selectors: [["lib-llm-summary"]], inputs: { isTextSummarizable: "isTextSummarizable", newFeatureLocalStorageKey: "newFeatureLocalStorageKey" }, outputs: { openModalEvent: "openModalEvent" }, decls: 6, vars: 12, consts: [["summarizeFeature", ""], ["mat-stroked-button", "", "color", "accent", 1, "llm-summary", 3, "click", "disabled"], [3, "svgIcon"], [3, "titleLocalizationKey", "descriptionLocalizationKey", "closeLocalizationKey", "featureClassName", "featureLocalStorageKey"]], template: function LLMSummaryComponent_Template(rf, ctx) { if (rf & 1) {
+            const _r1 = i0.ɵɵgetCurrentView();
+            i0.ɵɵelementStart(0, "button", 1);
+            i0.ɵɵlistener("click", function LLMSummaryComponent_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.openModal()); });
+            i0.ɵɵelement(1, "mat-icon", 2);
+            i0.ɵɵtext(2);
+            i0.ɵɵpipe(3, "translate");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelement(4, "lib-new-feature-dialog-wrapper", 3, 0);
+        } if (rf & 2) {
+            const summarizeFeature_r2 = i0.ɵɵreference(5);
+            i0.ɵɵclassProp("summarize-feature-active", summarizeFeature_r2 == null ? null : summarizeFeature_r2.featureActive());
+            i0.ɵɵproperty("disabled", !ctx.isTextSummarizable);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("svgIcon", "summarize");
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(3, 10, "LLM.SUMMARY"), "\n");
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("titleLocalizationKey", "LLM.SUMMARY_NEW_FEATURE.TITLE")("descriptionLocalizationKey", "LLM.SUMMARY_NEW_FEATURE.DESCRIPTION")("closeLocalizationKey", "LLM.SUMMARY_NEW_FEATURE.CLOSE")("featureClassName", "llm-summary")("featureLocalStorageKey", "summary" + ctx.newFeatureLocalStorageKey);
+        } }, dependencies: [i2$1.MatButton, i1.MatIcon, NewFeatureDialogWrapperComponent, i1$1.TranslatePipe], styles: [".summarize-feature-active{z-index:1001!important;background-color:#fff!important}"] }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LLMSummaryComponent, [{
+        type: Component,
+        args: [{ selector: 'lib-llm-summary', template: "<button\r\n\tmat-stroked-button\r\n\tclass=\"llm-summary\"\r\n\tcolor=\"accent\"\r\n\t[disabled]=\"!isTextSummarizable\"\r\n\t[class.summarize-feature-active]=\"summarizeFeature?.featureActive()\"\r\n\t(click)=\"openModal()\"\r\n>\r\n\t<mat-icon [svgIcon]=\"'summarize'\"></mat-icon>\r\n\t{{ \"LLM.SUMMARY\" | translate }}\r\n</button>\r\n\r\n<lib-new-feature-dialog-wrapper\r\n\t#summarizeFeature\r\n\t[titleLocalizationKey]=\"'LLM.SUMMARY_NEW_FEATURE.TITLE'\"\r\n\t[descriptionLocalizationKey]=\"'LLM.SUMMARY_NEW_FEATURE.DESCRIPTION'\"\r\n\t[closeLocalizationKey]=\"'LLM.SUMMARY_NEW_FEATURE.CLOSE'\"\r\n\t[featureClassName]=\"'llm-summary'\"\r\n\t[featureLocalStorageKey]=\"'summary' + newFeatureLocalStorageKey\"\r\n></lib-new-feature-dialog-wrapper>\r\n", styles: ["::ng-deep .summarize-feature-active{z-index:1001!important;background-color:#fff!important}\n"] }]
+    }], null, { isTextSummarizable: [{
+            type: Input
+        }], newFeatureLocalStorageKey: [{
+            type: Input
+        }], openModalEvent: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMSummaryComponent, { className: "LLMSummaryComponent", filePath: "lib\\llm\\components\\llm-summary\\llm-summary.component.ts", lineNumber: 9 }); })();
+
+class LLMRephraseComponent {
+    constructor() {
+        this.openModalEvent = new EventEmitter();
+    }
+    openModal() {
+        this.openModalEvent.emit(LLMActions.REPHRASE);
+    }
+    static { this.ɵfac = function LLMRephraseComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LLMRephraseComponent)(); }; }
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMRephraseComponent, selectors: [["lib-llm-rephrase"]], inputs: { isTargetLanguageRephrasable: "isTargetLanguageRephrasable", newFeatureLocalStorageKey: "newFeatureLocalStorageKey" }, outputs: { openModalEvent: "openModalEvent" }, decls: 6, vars: 13, consts: [["rephraseFeature", ""], ["mat-stroked-button", "", "color", "accent", 1, "llm-rephrase", 3, "click", "disabled"], [3, "svgIcon"], [3, "titleLocalizationKey", "descriptionLocalizationKey", "closeLocalizationKey", "featureClassName", "featureLocalStorageKey", "maxWidth"]], template: function LLMRephraseComponent_Template(rf, ctx) { if (rf & 1) {
+            const _r1 = i0.ɵɵgetCurrentView();
+            i0.ɵɵelementStart(0, "button", 1);
+            i0.ɵɵlistener("click", function LLMRephraseComponent_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r1); return i0.ɵɵresetView(ctx.openModal()); });
+            i0.ɵɵelement(1, "mat-icon", 2);
+            i0.ɵɵtext(2);
+            i0.ɵɵpipe(3, "translate");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelement(4, "lib-new-feature-dialog-wrapper", 3, 0);
+        } if (rf & 2) {
+            const rephraseFeature_r2 = i0.ɵɵreference(5);
+            i0.ɵɵclassProp("rephrase-feature-active", rephraseFeature_r2 == null ? null : rephraseFeature_r2.featureActive());
+            i0.ɵɵproperty("disabled", !ctx.isTargetLanguageRephrasable);
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("svgIcon", "rephrase");
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(3, 11, "LLM.REPHRASE"), "\n");
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("titleLocalizationKey", "LLM.REPHRASE_NEW_FEATURE.TITLE")("descriptionLocalizationKey", "LLM.REPHRASE_NEW_FEATURE.DESCRIPTION")("closeLocalizationKey", "LLM.REPHRASE_NEW_FEATURE.CLOSE")("featureClassName", "llm-rephrase")("featureLocalStorageKey", "rephrase" + ctx.newFeatureLocalStorageKey)("maxWidth", 400);
+        } }, dependencies: [i2$1.MatButton, i1.MatIcon, NewFeatureDialogWrapperComponent, i1$1.TranslatePipe], styles: [".rephrase-feature-active{z-index:1001!important;background-color:#fff!important}"] }); }
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LLMRephraseComponent, [{
+        type: Component,
+        args: [{ selector: 'lib-llm-rephrase', template: "<button\r\n\tmat-stroked-button\r\n\tclass=\"llm-rephrase\"\r\n\tcolor=\"accent\"\r\n\t[disabled]=\"!isTargetLanguageRephrasable\"\r\n\t[class.rephrase-feature-active]=\"rephraseFeature?.featureActive()\"\r\n\t(click)=\"openModal()\"\r\n>\r\n\t<mat-icon [svgIcon]=\"'rephrase'\"></mat-icon>\r\n\t{{ \"LLM.REPHRASE\" | translate }}\r\n</button>\r\n\r\n<lib-new-feature-dialog-wrapper\r\n\t#rephraseFeature\r\n\t[titleLocalizationKey]=\"'LLM.REPHRASE_NEW_FEATURE.TITLE'\"\r\n\t[descriptionLocalizationKey]=\"'LLM.REPHRASE_NEW_FEATURE.DESCRIPTION'\"\r\n\t[closeLocalizationKey]=\"'LLM.REPHRASE_NEW_FEATURE.CLOSE'\"\r\n\t[featureClassName]=\"'llm-rephrase'\"\r\n\t[featureLocalStorageKey]=\"'rephrase' + newFeatureLocalStorageKey\"\r\n\t[maxWidth]=\"400\"\r\n></lib-new-feature-dialog-wrapper>\r\n", styles: ["::ng-deep .rephrase-feature-active{z-index:1001!important;background-color:#fff!important}\n"] }]
+    }], null, { isTargetLanguageRephrasable: [{
+            type: Input
+        }], newFeatureLocalStorageKey: [{
+            type: Input
+        }], openModalEvent: [{
+            type: Output
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(LLMRephraseComponent, { className: "LLMRephraseComponent", filePath: "lib\\llm\\components\\llm-rephrase\\llm-rephrase.component.ts", lineNumber: 9 }); })();
+
 function LLMComponent_div_1_Template(rf, ctx) { if (rf & 1) {
     const _r1 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 2);
     i0.ɵɵpipe(1, "translate");
-    i0.ɵɵelementStart(2, "button", 3);
-    i0.ɵɵlistener("click", function LLMComponent_div_1_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.openLLMModal(ctx_r1.llmAction.SUMMARY)); });
-    i0.ɵɵelement(3, "mat-icon", 4);
-    i0.ɵɵtext(4);
-    i0.ɵɵpipe(5, "translate");
+    i0.ɵɵelementStart(2, "lib-llm-summary", 3);
+    i0.ɵɵlistener("openModalEvent", function LLMComponent_div_1_Template_lib_llm_summary_openModalEvent_2_listener($event) { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.openLLMModal($event)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("matTooltipPosition", "left")("matTooltip", !ctx_r1.isTextSummarizable ? i0.ɵɵpipeBind1(1, 5, "LLM.MENU_SUMMARY_DISABLED_TOOLTIP") : "");
+    i0.ɵɵproperty("matTooltipPosition", "left")("matTooltip", !ctx_r1.isTextSummarizable ? i0.ɵɵpipeBind1(1, 4, "LLM.MENU_SUMMARY_DISABLED_TOOLTIP") : "");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("disabled", !ctx_r1.isTextSummarizable);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("svgIcon", "summarize");
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(5, 7, "LLM.SUMMARY"), " ");
+    i0.ɵɵproperty("isTextSummarizable", !!ctx_r1.isTextSummarizable)("newFeatureLocalStorageKey", ctx_r1.newFeatureLocalStorageKey);
 } }
 function LLMComponent_div_2_Template(rf, ctx) { if (rf & 1) {
     const _r3 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 2);
     i0.ɵɵpipe(1, "translate");
-    i0.ɵɵelementStart(2, "button", 3);
-    i0.ɵɵlistener("click", function LLMComponent_div_2_Template_button_click_2_listener() { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.openLLMModal(ctx_r1.llmAction.REPHRASE)); });
-    i0.ɵɵelement(3, "mat-icon", 4);
-    i0.ɵɵtext(4);
-    i0.ɵɵpipe(5, "translate");
+    i0.ɵɵelementStart(2, "lib-llm-rephrase", 4);
+    i0.ɵɵlistener("openModalEvent", function LLMComponent_div_2_Template_lib_llm_rephrase_openModalEvent_2_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.openLLMModal($event)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext();
-    i0.ɵɵproperty("matTooltipPosition", "left")("matTooltip", !ctx_r1.isTargetLanguageRephrasable ? i0.ɵɵpipeBind1(1, 5, "LLM.MENU_REPHRASE_DISABLED_TOOLTIP") : "");
+    i0.ɵɵproperty("matTooltipPosition", "left")("matTooltip", !ctx_r1.isTargetLanguageRephrasable ? i0.ɵɵpipeBind1(1, 4, "LLM.MENU_REPHRASE_DISABLED_TOOLTIP") : "");
     i0.ɵɵadvance(2);
-    i0.ɵɵproperty("disabled", !ctx_r1.isTargetLanguageRephrasable);
-    i0.ɵɵadvance();
-    i0.ɵɵproperty("svgIcon", "rephrase");
-    i0.ɵɵadvance();
-    i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(5, 7, "LLM.REPHRASE"), " ");
+    i0.ɵɵproperty("isTargetLanguageRephrasable", !!ctx_r1.isTargetLanguageRephrasable)("newFeatureLocalStorageKey", ctx_r1.newFeatureLocalStorageKey);
 } }
 class LLMComponent {
     get isTextSummarizable() {
@@ -7410,20 +7643,20 @@ class LLMComponent {
         });
     }
     static { this.ɵfac = function LLMComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || LLMComponent)(i0.ɵɵdirectiveInject(i1$4.MatDialog), i0.ɵɵdirectiveInject(IconService), i0.ɵɵdirectiveInject(LanguageTranslateService)); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMComponent, selectors: [["lib-llm"]], inputs: { text: "text", language: "language", rephrasableLanguagesCodeList: "rephrasableLanguagesCodeList", summaryEnabled: "summaryEnabled", rephraseEnabled: "rephraseEnabled", showUseCaseSummary: "showUseCaseSummary", showUseCaseRephrase: "showUseCaseRephrase" }, outputs: { menuTriggerClick: "menuTriggerClick" }, decls: 3, vars: 2, consts: [[1, "llm-wrapper"], [3, "matTooltipPosition", "matTooltip", 4, "ngIf"], [3, "matTooltipPosition", "matTooltip"], ["mat-stroked-button", "", "color", "accent", 3, "click", "disabled"], [3, "svgIcon"]], template: function LLMComponent_Template(rf, ctx) { if (rf & 1) {
+    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: LLMComponent, selectors: [["lib-llm"]], inputs: { text: "text", language: "language", rephrasableLanguagesCodeList: "rephrasableLanguagesCodeList", summaryEnabled: "summaryEnabled", rephraseEnabled: "rephraseEnabled", showUseCaseSummary: "showUseCaseSummary", showUseCaseRephrase: "showUseCaseRephrase", newFeatureLocalStorageKey: "newFeatureLocalStorageKey" }, outputs: { menuTriggerClick: "menuTriggerClick" }, decls: 3, vars: 2, consts: [[1, "llm-wrapper"], [3, "matTooltipPosition", "matTooltip", 4, "ngIf"], [3, "matTooltipPosition", "matTooltip"], [3, "openModalEvent", "isTextSummarizable", "newFeatureLocalStorageKey"], [3, "openModalEvent", "isTargetLanguageRephrasable", "newFeatureLocalStorageKey"]], template: function LLMComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
-            i0.ɵɵtemplate(1, LLMComponent_div_1_Template, 6, 9, "div", 1)(2, LLMComponent_div_2_Template, 6, 9, "div", 1);
+            i0.ɵɵtemplate(1, LLMComponent_div_1_Template, 3, 6, "div", 1)(2, LLMComponent_div_2_Template, 3, 6, "div", 1);
             i0.ɵɵelementEnd();
         } if (rf & 2) {
             i0.ɵɵadvance();
             i0.ɵɵproperty("ngIf", ctx.summaryEnabled);
             i0.ɵɵadvance();
-            i0.ɵɵproperty("ngIf", ctx.summaryEnabled);
-        } }, dependencies: [i1$2.NgIf, i2$1.MatButton, i1.MatIcon, i2$2.MatTooltip, i1$1.TranslatePipe], styles: [".llm-wrapper[_ngcontent-%COMP%]{display:flex;gap:8px}"] }); }
+            i0.ɵɵproperty("ngIf", ctx.rephraseEnabled);
+        } }, dependencies: [i1$2.NgIf, i2$2.MatTooltip, LLMSummaryComponent, LLMRephraseComponent, i1$1.TranslatePipe], styles: [".llm-wrapper[_ngcontent-%COMP%]{display:flex;gap:8px}"] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LLMComponent, [{
         type: Component,
-        args: [{ selector: 'lib-llm', template: "<div class=\"llm-wrapper\">\r\n\t<div *ngIf=\"summaryEnabled\" [matTooltipPosition]=\"'left'\" [matTooltip]=\"!isTextSummarizable ? ('LLM.MENU_SUMMARY_DISABLED_TOOLTIP' | translate) : ''\">\r\n\t\t<button mat-stroked-button color=\"accent\" [disabled]=\"!isTextSummarizable\" (click)=\"openLLMModal(llmAction.SUMMARY)\">\r\n\t\t\t<mat-icon [svgIcon]=\"'summarize'\"></mat-icon>\r\n\t\t\t{{ \"LLM.SUMMARY\" | translate }}\r\n\t\t</button>\r\n\t</div>\r\n\r\n\t<div *ngIf=\"summaryEnabled\" [matTooltipPosition]=\"'left'\" [matTooltip]=\"!isTargetLanguageRephrasable ? ('LLM.MENU_REPHRASE_DISABLED_TOOLTIP' | translate) : ''\">\r\n\t\t<button mat-stroked-button color=\"accent\" [disabled]=\"!isTargetLanguageRephrasable\" (click)=\"openLLMModal(llmAction.REPHRASE)\">\r\n\t\t\t<mat-icon [svgIcon]=\"'rephrase'\"></mat-icon>\r\n\t\t\t{{ \"LLM.REPHRASE\" | translate }}\r\n\t\t</button>\r\n\t</div>\r\n</div>\r\n", styles: [".llm-wrapper{display:flex;gap:8px}\n"] }]
+        args: [{ selector: 'lib-llm', template: "<div class=\"llm-wrapper\">\r\n\t<div *ngIf=\"summaryEnabled\" [matTooltipPosition]=\"'left'\" [matTooltip]=\"!isTextSummarizable ? ('LLM.MENU_SUMMARY_DISABLED_TOOLTIP' | translate) : ''\">\r\n\t\t<lib-llm-summary [isTextSummarizable]=\"!!isTextSummarizable\" [newFeatureLocalStorageKey]=\"newFeatureLocalStorageKey\" (openModalEvent)=\"openLLMModal($event)\"></lib-llm-summary>\r\n\t</div>\r\n\r\n\t<div *ngIf=\"rephraseEnabled\" [matTooltipPosition]=\"'left'\" [matTooltip]=\"!isTargetLanguageRephrasable ? ('LLM.MENU_REPHRASE_DISABLED_TOOLTIP' | translate) : ''\">\r\n\t\t<lib-llm-rephrase\r\n\t\t\t[isTargetLanguageRephrasable]=\"!!isTargetLanguageRephrasable\"\r\n\t\t\t[newFeatureLocalStorageKey]=\"newFeatureLocalStorageKey\"\r\n\t\t\t(openModalEvent)=\"openLLMModal($event)\"\r\n\t\t></lib-llm-rephrase>\r\n\t</div>\r\n</div>\r\n", styles: [".llm-wrapper{display:flex;gap:8px}\n"] }]
     }], () => [{ type: i1$4.MatDialog }, { type: IconService }, { type: LanguageTranslateService }], { text: [{
             type: Input
         }], language: [{
@@ -7438,6 +7671,8 @@ class LLMComponent {
             type: Input
         }], showUseCaseRephrase: [{
             type: Input
+        }], newFeatureLocalStorageKey: [{
+            type: Input
         }], menuTriggerClick: [{
             type: Output
         }] }); })();
@@ -7458,7 +7693,8 @@ class LLMModule {
             NotificationMessageModule,
             MatTooltipModule,
             FlexLayoutModule,
-            MatProgressSpinnerModule] }); }
+            MatProgressSpinnerModule,
+            NewFeatureDialogWrapperComponent] }); }
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(LLMModule, [{
         type: NgModule,
@@ -7467,6 +7703,8 @@ class LLMModule {
                     LLMComponent,
                     LLMTextareaComponent,
                     LLMTextareaWithActionsComponent,
+                    LLMSummaryComponent,
+                    LLMRephraseComponent
                 ],
                 imports: [
                     CommonModule,
@@ -7481,14 +7719,17 @@ class LLMModule {
                     NotificationMessageModule,
                     MatTooltipModule,
                     FlexLayoutModule,
-                    MatProgressSpinnerModule
+                    MatProgressSpinnerModule,
+                    NewFeatureDialogWrapperComponent
                 ],
                 exports: [LLMComponent],
             }]
     }], null, null); })();
 (function () { (typeof ngJitMode === "undefined" || ngJitMode) && i0.ɵɵsetNgModuleScope(LLMModule, { declarations: [LLMComponent,
         LLMTextareaComponent,
-        LLMTextareaWithActionsComponent], imports: [CommonModule,
+        LLMTextareaWithActionsComponent,
+        LLMSummaryComponent,
+        LLMRephraseComponent], imports: [CommonModule,
         MatButtonModule,
         MatIconModule,
         TranslateModule,
@@ -7500,7 +7741,8 @@ class LLMModule {
         NotificationMessageModule,
         MatTooltipModule,
         FlexLayoutModule,
-        MatProgressSpinnerModule], exports: [LLMComponent] }); })();
+        MatProgressSpinnerModule,
+        NewFeatureDialogWrapperComponent], exports: [LLMComponent] }); })();
 
 class SidebarService {
     constructor() {
@@ -8253,171 +8495,6 @@ class SubscriptionComponent {
     }], null, null); })();
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(SubscriptionComponent, { className: "SubscriptionComponent", filePath: "lib\\subscription\\subscription.component.ts", lineNumber: 27 }); })();
 
-class NewFeatureDialogComponent {
-    constructor() {
-        this.data = inject(MAT_DIALOG_DATA);
-    }
-    static { this.ɵfac = function NewFeatureDialogComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || NewFeatureDialogComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NewFeatureDialogComponent, selectors: [["lib-new-feature-dialog"]], standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 10, vars: 9, consts: [["mat-dialog-title", ""], [1, "description", 3, "innerHTML"], ["mat-button", "", "mat-dialog-close", "", "color", "accent"]], template: function NewFeatureDialogComponent_Template(rf, ctx) { if (rf & 1) {
-            i0.ɵɵelementStart(0, "h2", 0);
-            i0.ɵɵtext(1);
-            i0.ɵɵpipe(2, "translate");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(3, "mat-dialog-content");
-            i0.ɵɵelement(4, "p", 1);
-            i0.ɵɵpipe(5, "translate");
-            i0.ɵɵelementEnd();
-            i0.ɵɵelementStart(6, "mat-dialog-actions")(7, "button", 2);
-            i0.ɵɵtext(8);
-            i0.ɵɵpipe(9, "translate");
-            i0.ɵɵelementEnd()();
-        } if (rf & 2) {
-            i0.ɵɵadvance();
-            i0.ɵɵtextInterpolate(i0.ɵɵpipeBind1(2, 3, ctx.data.title));
-            i0.ɵɵadvance(3);
-            i0.ɵɵproperty("innerHTML", i0.ɵɵpipeBind1(5, 5, ctx.data.description), i0.ɵɵsanitizeHtml);
-            i0.ɵɵadvance(4);
-            i0.ɵɵtextInterpolate1(" ", i0.ɵɵpipeBind1(9, 7, ctx.data.close), " ");
-        } }, dependencies: [MatDialogModule, i1$4.MatDialogClose, i1$4.MatDialogTitle, i1$4.MatDialogActions, i1$4.MatDialogContent, MatButtonModule, i2$1.MatButton, TranslatePipe], styles: ["[_nghost-%COMP%]    {display:inline-block;padding:12px 16px}[_nghost-%COMP%]     .mat-mdc-dialog-title, [_nghost-%COMP%]     mat-dialog-actions, [_nghost-%COMP%]     mat-dialog-content{padding:0!important;margin:0!important}"] }); }
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NewFeatureDialogComponent, [{
-        type: Component,
-        args: [{ selector: 'lib-new-feature-dialog', standalone: true, imports: [MatDialogModule, MatButtonModule, TranslatePipe], template: "<h2 mat-dialog-title>{{ data.title | translate }}</h2>\r\n<mat-dialog-content>\r\n  <p class=\"description\" [innerHTML]=\"data.description | translate\"></p>\r\n</mat-dialog-content>\r\n<mat-dialog-actions>\r\n  <button mat-button mat-dialog-close color=\"accent\">\r\n    {{ data.close | translate }}\r\n  </button>\r\n</mat-dialog-actions>\r\n", styles: [":host ::ng-deep{display:inline-block;padding:12px 16px}:host ::ng-deep .mat-mdc-dialog-title,:host ::ng-deep mat-dialog-actions,:host ::ng-deep mat-dialog-content{padding:0!important;margin:0!important}\n"] }]
-    }], null, null); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NewFeatureDialogComponent, { className: "NewFeatureDialogComponent", filePath: "lib\\new-feature-dialog\\new-feature-dialog.component.ts", lineNumber: 13 }); })();
-
-class NewFeatureDialogService {
-    constructor() {
-        this.current = signal(undefined);
-        this.queue = [];
-    }
-    requestOpenFeature(component) {
-        if (this.queue.includes(component)) {
-            return;
-        }
-        this.queue.push(component);
-        if (!this.current()) {
-            this.showNextFeature();
-        }
-    }
-    showNextFeature() {
-        if (this.queue.length === 0) {
-            return;
-        }
-        const nextFeature = this.queue.shift();
-        if (!nextFeature) {
-            return;
-        }
-        this.current.set(nextFeature);
-        nextFeature.showFeatureDialog();
-    }
-    static { this.ɵfac = function NewFeatureDialogService_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || NewFeatureDialogService)(); }; }
-    static { this.ɵprov = /*@__PURE__*/ i0.ɵɵdefineInjectable({ token: NewFeatureDialogService, factory: NewFeatureDialogService.ɵfac, providedIn: 'root' }); }
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NewFeatureDialogService, [{
-        type: Injectable,
-        args: [{
-                providedIn: 'root',
-            }]
-    }], null, null); })();
-
-class NewFeatureDialogWrapperComponent {
-    constructor() {
-        this.timeout = 0;
-        this.maxWidth = 320;
-        this.#dialog = inject(MatDialog);
-        this.#featureService = inject(NewFeatureDialogService);
-        this.#destroy = new Subject();
-        this.featureActive = signal(false);
-        this.isFeatureSeen = false;
-    }
-    #dialog;
-    #featureService;
-    #destroy;
-    ngOnInit() {
-        setTimeout(() => {
-            this.setFeatureStatus();
-        }, this.timeout);
-    }
-    ngOnDestroy() {
-        this.#destroy.next(null);
-        this.#destroy.complete();
-    }
-    showFeatureDialog() {
-        const targetElement = document.querySelector(`.${this.featureClassName}`);
-        if (!targetElement) {
-            return;
-        }
-        if (ResolutionHelper.isMobileRes() && this.mobileScreenCustomPosition?.autoScroll) {
-            targetElement.scrollIntoView({ behavior: 'smooth', block: 'center' });
-        }
-        setTimeout(() => {
-            this.featureActive.set(true);
-            const updatedRects = targetElement.getBoundingClientRect();
-            this.dialogRef = this.#dialog.open(NewFeatureDialogComponent, {
-                data: {
-                    title: this.titleLocalizationKey,
-                    description: this.descriptionLocalizationKey,
-                    close: this.closeLocalizationKey,
-                    featureLocalStorageKey: this.featureLocalStorageKey,
-                },
-                position: {
-                    left: `${ResolutionHelper.isMobileRes() && this.mobileScreenCustomPosition?.left ? this.mobileScreenCustomPosition.left : (updatedRects.left - this.maxWidth) + 'px'}`,
-                    top: `${ResolutionHelper.isMobileRes() && this.mobileScreenCustomPosition?.top ? this.mobileScreenCustomPosition.top : (updatedRects.top + 45) + 'px'}`
-                },
-                maxWidth: `${this.maxWidth}px`
-            });
-            this.dialogRef.afterClosed().subscribe(() => {
-                this.setFeatureSeen();
-                this.#featureService.current.set(undefined);
-                this.#featureService.showNextFeature();
-            });
-            // Wait until the element is visible in the viewport.
-        }, ResolutionHelper.isMobileRes() && this.mobileScreenCustomPosition?.autoScroll ? 500 : 0);
-    }
-    setFeatureStatus() {
-        this.isFeatureSeen = !!this.featureLocalStorageKey && !!localStorage.getItem(this.featureLocalStorageKey);
-        if (!this.isFeatureSeen) {
-            this.#featureService.requestOpenFeature(this);
-        }
-    }
-    setFeatureSeen() {
-        this.featureActive.set(false);
-        this.isFeatureSeen = true;
-        if (this.featureLocalStorageKey) {
-            localStorage.setItem(this.featureLocalStorageKey, 'true');
-        }
-    }
-    static { this.ɵfac = function NewFeatureDialogWrapperComponent_Factory(__ngFactoryType__) { return new (__ngFactoryType__ || NewFeatureDialogWrapperComponent)(); }; }
-    static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: NewFeatureDialogWrapperComponent, selectors: [["lib-new-feature-dialog-wrapper"]], inputs: { titleLocalizationKey: "titleLocalizationKey", descriptionLocalizationKey: "descriptionLocalizationKey", closeLocalizationKey: "closeLocalizationKey", featureClassName: "featureClassName", featureLocalStorageKey: "featureLocalStorageKey", timeout: "timeout", maxWidth: "maxWidth", mobileScreenCustomPosition: "mobileScreenCustomPosition" }, standalone: true, features: [i0.ɵɵStandaloneFeature], decls: 0, vars: 0, template: function NewFeatureDialogWrapperComponent_Template(rf, ctx) { }, dependencies: [CommonModule, MatDialogModule], encapsulation: 2 }); }
-}
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(NewFeatureDialogWrapperComponent, [{
-        type: Component,
-        args: [{
-                selector: 'lib-new-feature-dialog-wrapper',
-                standalone: true,
-                imports: [CommonModule, MatDialogModule, NewFeatureDialogComponent],
-                template: '',
-            }]
-    }], null, { titleLocalizationKey: [{
-            type: Input
-        }], descriptionLocalizationKey: [{
-            type: Input
-        }], closeLocalizationKey: [{
-            type: Input
-        }], featureClassName: [{
-            type: Input
-        }], featureLocalStorageKey: [{
-            type: Input
-        }], timeout: [{
-            type: Input
-        }], maxWidth: [{
-            type: Input
-        }], mobileScreenCustomPosition: [{
-            type: Input
-        }] }); })();
-(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(NewFeatureDialogWrapperComponent, { className: "NewFeatureDialogWrapperComponent", filePath: "lib\\new-feature-dialog\\new-feature-dialog-wrapper\\new-feature-dialog-wrapper.component.ts", lineNumber: 16 }); })();
-
 /*
  * Public API Surface of ngx-common
  */