@tilde-nlp/ngx-translate 7.0.21 → 7.0.23

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
Files changed (19) hide show
  1. package/esm2022/lib/i18n/en.mjs +4 -2
  2. package/esm2022/lib/i18n/lv.mjs +4 -2
  3. package/esm2022/lib/modules/tld-text/components/textarea-with-background/textarea-with-background.component.mjs +2 -2
  4. package/esm2022/lib/modules/tld-text/components/tld-translate-source/tld-translate-source.component.mjs +2 -2
  5. package/esm2022/lib/modules/tld-text/components/tld-translate-text/tld-translate-text.component.mjs +7 -4
  6. package/esm2022/lib/modules/tld-tooltip/translation-system-picker/dropdown/translation-system-picker-dropdown.component.mjs +3 -3
  7. package/esm2022/lib/modules/tld-tooltip/translation-system-picker/dropdown-body/translation-system-picker-dropdown-body.component.mjs +13 -4
  8. package/esm2022/lib/modules/tld-tooltip/translation-system-picker/system-list/translation-system-picker-system-list.component.mjs +11 -5
  9. package/esm2022/lib/modules/tld-tooltip/translation-system-picker/translation-system-picker.component.mjs +2 -2
  10. package/fesm2022/tilde-nlp-ngx-translate.mjs +39 -18
  11. package/fesm2022/tilde-nlp-ngx-translate.mjs.map +1 -1
  12. package/lib/i18n/en.d.ts +2 -0
  13. package/lib/i18n/lv.d.ts +2 -0
  14. package/lib/modules/tld-tooltip/translation-system-picker/dropdown-body/translation-system-picker-dropdown-body.component.d.ts +2 -1
  15. package/lib/modules/tld-tooltip/translation-system-picker/system-list/translation-system-picker-system-list.component.d.ts +4 -1
  16. package/package.json +1 -1
  17. package/src/assets/webcomponent/styles.css +1 -1
  18. package/src/assets/webcomponent/tilde-translate-box.js +1 -1
  19. package/src/styles/styles.scss +2 -2
@@ -1017,7 +1017,9 @@ const i18n_en = {
1017
1017
  "CLEAR_SEARCH": "Clear search text",
1018
1018
  "OPEN_SOURCE_ARIA_LABEL": "Select source language",
1019
1019
  "OPEN_TARGET_ARIA_LABEL": "Select target language and domain",
1020
- "DETECTED": "Detected"
1020
+ "DETECTED": "Detected",
1021
+ "SHOW_ALL": "Show all",
1022
+ "HIDE_ALL": "Collapse"
1021
1023
  },
1022
1024
  "TEXT_TRANSLATION_PROGRESS_INDICATOR": {
1023
1025
  "TITLE": "Translation provided by {{provider}}",
@@ -3007,7 +3009,9 @@ const i18n_lv = {
3007
3009
  "CLEAR_SEARCH": "Notīrīt meklēšanas tekstu",
3008
3010
  "OPEN_SOURCE_ARIA_LABEL": "Izvēlieties avota valodu",
3009
3011
  "OPEN_TARGET_ARIA_LABEL": "Izvēlieties mērķa valodu un domēnu",
3010
- "DETECTED": "Noteikta"
3012
+ "DETECTED": "Noteikta",
3013
+ "SHOW_ALL": "Rādīt visas",
3014
+ "HIDE_ALL": "Aizvērt"
3011
3015
  },
3012
3016
  "TEXT_TRANSLATION_PROGRESS_INDICATOR": {
3013
3017
  "TITLE": "Tulkošanu nodrošina {{provider}}",
@@ -7652,11 +7656,11 @@ class TextareaWithBackgroundComponent {
7652
7656
  element.dispatchEvent(ev);
7653
7657
  };
7654
7658
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextareaWithBackgroundComponent, deps: [{ token: i5.AlertService }, { token: TldTranslateTextService }], target: i0.ɵɵFactoryTarget.Component });
7655
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TextareaWithBackgroundComponent, selector: "tld-textarea-with-background", inputs: { maxCharLength: "maxCharLength", autoFocuss: "autoFocuss", highlightTree: "highlightTree", highlight: "highlight", gramCheck: "gramCheck", textareaDisabled: "textareaDisabled" }, viewQueries: [{ propertyName: "sourceInput", first: true, predicate: ["sourceInput"], descendants: true }, { propertyName: "treeWrapper", first: true, predicate: ["treeWrapper"], descendants: true }], ngImport: i0, template: "<div [class.textarea-overflow]=\"hasOverflow\" class=\"textarea-with-background\">\r\n <textarea [disabled]=\"textareaDisabled\" cdkScrollable (paste)=\"onPaste($event)\" matInput [(ngModel)]=\"sourceText\" #sourceInput fxFlex\r\n spellcheck=\"false\" (mousemove)=\"onTextAreaMouseMove($event)\" [attr.maxLength]=\"maxCharLength? maxCharLength: null\"\r\n [attr.aria-label]=\"'TLD_TRANSLATE.SOURCE_TOOLTIP' | translate\" (click)=\"textareaClick($event)\"></textarea>\r\n <div class=\"{{wrapperClass}}\" *ngIf=\"gramCheck || highlight\" cdkScrollable #treeWrapper>\r\n <div class=\"textarea-highlight-backround-inner\" cdkScrollable>\r\n <div *ngFor=\"let paragraph of highlightTree\">\r\n <tld-highlight-tree [isSource]=\"true\" [tree]=\"paragraph\" [highlight]=\"highlight\" [gramCheck]=\"gramCheck\"\r\n (onReplace)=\"replace($event)\"></tld-highlight-tree>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".textarea-with-background{position:relative}.textarea-with-background .textarea-highlight-background{position:absolute;color:transparent}.textarea-with-background textarea{resize:none!important;z-index:1;caret-color:#000!important}.textarea-with-background textarea,.textarea-with-background .textarea-highlight-backround-inner{padding:1em 3em 1em 1em!important}.textarea-with-background .textarea-highlight-backround-inner{max-width:calc(100% - 2em);width:calc(100% - 2em);min-width:calc(100% - 2em);min-height:calc(100% - 2em);max-height:calc(100% - 2em);height:calc(100% - 2em);overflow-y:auto}.textarea-with-background,.textarea-highlight-background{width:100%;max-width:100%;min-width:100%;min-height:100%;max-height:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: HighlightTreeComponent, selector: "tld-highlight-tree", inputs: ["tree", "isSource", "correctionsEnabled", "highlight", "gramCheck", "selectSentence"], outputs: ["onReplace"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
7659
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TextareaWithBackgroundComponent, selector: "tld-textarea-with-background", inputs: { maxCharLength: "maxCharLength", autoFocuss: "autoFocuss", highlightTree: "highlightTree", highlight: "highlight", gramCheck: "gramCheck", textareaDisabled: "textareaDisabled" }, viewQueries: [{ propertyName: "sourceInput", first: true, predicate: ["sourceInput"], descendants: true }, { propertyName: "treeWrapper", first: true, predicate: ["treeWrapper"], descendants: true }], ngImport: i0, template: "<div [class.textarea-overflow]=\"hasOverflow\" class=\"textarea-with-background\">\r\n <textarea [disabled]=\"textareaDisabled\" cdkScrollable (paste)=\"onPaste($event)\" matInput [(ngModel)]=\"sourceText\" #sourceInput fxFlex\r\n spellcheck=\"false\" (mousemove)=\"onTextAreaMouseMove($event)\" [attr.maxLength]=\"maxCharLength? maxCharLength: null\"\r\n [attr.aria-label]=\"'TLD_TRANSLATE.SOURCE_TOOLTIP' | translate\" (click)=\"textareaClick($event)\"></textarea>\r\n <div class=\"{{wrapperClass}}\" *ngIf=\"gramCheck || highlight\" cdkScrollable #treeWrapper>\r\n <div class=\"textarea-highlight-backround-inner\" cdkScrollable>\r\n <div *ngFor=\"let paragraph of highlightTree\">\r\n <tld-highlight-tree [isSource]=\"true\" [tree]=\"paragraph\" [highlight]=\"highlight\" [gramCheck]=\"gramCheck\"\r\n (onReplace)=\"replace($event)\"></tld-highlight-tree>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".textarea-with-background{position:relative}.textarea-with-background .textarea-highlight-background{position:absolute;color:transparent}.textarea-with-background textarea{resize:none!important;z-index:1;caret-color:#000!important}.textarea-with-background textarea,.textarea-with-background .textarea-highlight-backround-inner{padding:18px 48px 18px 18px!important}.textarea-with-background .textarea-highlight-backround-inner{max-width:calc(100% - 2em);width:calc(100% - 2em);min-width:calc(100% - 2em);min-height:calc(100% - 2em);max-height:calc(100% - 2em);height:calc(100% - 2em);overflow-y:auto}.textarea-with-background,.textarea-highlight-background{width:100%;max-width:100%;min-width:100%;min-height:100%;max-height:100%;height:100%}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i4$1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i4$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i4$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i6.CdkScrollable, selector: "[cdk-scrollable], [cdkScrollable]" }, { kind: "directive", type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i7.MatInput, selector: "input[matInput], textarea[matInput], select[matNativeControl], input[matNativeControl], textarea[matNativeControl]", inputs: ["disabled", "id", "placeholder", "name", "required", "type", "errorStateMatcher", "aria-describedby", "value", "readonly"], exportAs: ["matInput"] }, { kind: "component", type: HighlightTreeComponent, selector: "tld-highlight-tree", inputs: ["tree", "isSource", "correctionsEnabled", "highlight", "gramCheck", "selectSentence"], outputs: ["onReplace"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
7656
7660
  }
7657
7661
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TextareaWithBackgroundComponent, decorators: [{
7658
7662
  type: Component,
7659
- args: [{ selector: 'tld-textarea-with-background', template: "<div [class.textarea-overflow]=\"hasOverflow\" class=\"textarea-with-background\">\r\n <textarea [disabled]=\"textareaDisabled\" cdkScrollable (paste)=\"onPaste($event)\" matInput [(ngModel)]=\"sourceText\" #sourceInput fxFlex\r\n spellcheck=\"false\" (mousemove)=\"onTextAreaMouseMove($event)\" [attr.maxLength]=\"maxCharLength? maxCharLength: null\"\r\n [attr.aria-label]=\"'TLD_TRANSLATE.SOURCE_TOOLTIP' | translate\" (click)=\"textareaClick($event)\"></textarea>\r\n <div class=\"{{wrapperClass}}\" *ngIf=\"gramCheck || highlight\" cdkScrollable #treeWrapper>\r\n <div class=\"textarea-highlight-backround-inner\" cdkScrollable>\r\n <div *ngFor=\"let paragraph of highlightTree\">\r\n <tld-highlight-tree [isSource]=\"true\" [tree]=\"paragraph\" [highlight]=\"highlight\" [gramCheck]=\"gramCheck\"\r\n (onReplace)=\"replace($event)\"></tld-highlight-tree>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".textarea-with-background{position:relative}.textarea-with-background .textarea-highlight-background{position:absolute;color:transparent}.textarea-with-background textarea{resize:none!important;z-index:1;caret-color:#000!important}.textarea-with-background textarea,.textarea-with-background .textarea-highlight-backround-inner{padding:1em 3em 1em 1em!important}.textarea-with-background .textarea-highlight-backround-inner{max-width:calc(100% - 2em);width:calc(100% - 2em);min-width:calc(100% - 2em);min-height:calc(100% - 2em);max-height:calc(100% - 2em);height:calc(100% - 2em);overflow-y:auto}.textarea-with-background,.textarea-highlight-background{width:100%;max-width:100%;min-width:100%;min-height:100%;max-height:100%;height:100%}\n"] }]
7663
+ args: [{ selector: 'tld-textarea-with-background', template: "<div [class.textarea-overflow]=\"hasOverflow\" class=\"textarea-with-background\">\r\n <textarea [disabled]=\"textareaDisabled\" cdkScrollable (paste)=\"onPaste($event)\" matInput [(ngModel)]=\"sourceText\" #sourceInput fxFlex\r\n spellcheck=\"false\" (mousemove)=\"onTextAreaMouseMove($event)\" [attr.maxLength]=\"maxCharLength? maxCharLength: null\"\r\n [attr.aria-label]=\"'TLD_TRANSLATE.SOURCE_TOOLTIP' | translate\" (click)=\"textareaClick($event)\"></textarea>\r\n <div class=\"{{wrapperClass}}\" *ngIf=\"gramCheck || highlight\" cdkScrollable #treeWrapper>\r\n <div class=\"textarea-highlight-backround-inner\" cdkScrollable>\r\n <div *ngFor=\"let paragraph of highlightTree\">\r\n <tld-highlight-tree [isSource]=\"true\" [tree]=\"paragraph\" [highlight]=\"highlight\" [gramCheck]=\"gramCheck\"\r\n (onReplace)=\"replace($event)\"></tld-highlight-tree>\r\n </div>\r\n </div>\r\n </div>\r\n</div>", styles: [".textarea-with-background{position:relative}.textarea-with-background .textarea-highlight-background{position:absolute;color:transparent}.textarea-with-background textarea{resize:none!important;z-index:1;caret-color:#000!important}.textarea-with-background textarea,.textarea-with-background .textarea-highlight-backround-inner{padding:18px 48px 18px 18px!important}.textarea-with-background .textarea-highlight-backround-inner{max-width:calc(100% - 2em);width:calc(100% - 2em);min-width:calc(100% - 2em);min-height:calc(100% - 2em);max-height:calc(100% - 2em);height:calc(100% - 2em);overflow-y:auto}.textarea-with-background,.textarea-highlight-background{width:100%;max-width:100%;min-width:100%;min-height:100%;max-height:100%;height:100%}\n"] }]
7660
7664
  }], ctorParameters: () => [{ type: i5.AlertService }, { type: TldTranslateTextService }], propDecorators: { sourceInput: [{
7661
7665
  type: ViewChild,
7662
7666
  args: ["sourceInput"]
@@ -7761,11 +7765,11 @@ class TldTranslateSourceComponent {
7761
7765
  this.extendedFileTypesString = this.extendedFileTypes.join(", ").replace(/\./g, '');
7762
7766
  }
7763
7767
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TldTranslateSourceComponent, deps: [{ token: TldTranslateConfigService }, { token: TldTranslateTextService }], target: i0.ɵɵFactoryTarget.Component });
7764
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TldTranslateSourceComponent, selector: "tld-translate-source", inputs: { textareaDisabled: "textareaDisabled", sourceParagraphs: "sourceParagraphs" }, ngImport: i0, template: "<div class=\"tld-translate-source-wrapper\" fxFlex fxLayout=\"column\">\r\n <div class=\"source-input-wrapper\" fxFlex>\r\n <tld-textarea-with-background *ngIf=\"!isDictating\" [textareaDisabled]=\"textareaDisabled\" [highlight]=\"highlight\"\r\n [autoFocuss]=\"autoFocuss\" [highlightTree]=\"sourceParagraphs\" [gramCheck]=\"gramCheck\" fxFlex\r\n [maxCharLength]=\"maxCharLength\"></tld-textarea-with-background>\r\n <div *ngIf=\"isDictating\" class=\"asr-result-wrapper\">\r\n <span class=\"asr-result\">\r\n {{sourceText}}\r\n </span>\r\n <span class=\"asr-hypothesis\">\r\n {{sourceTextHypothesis}}\r\n </span>\r\n </div>\r\n </div>\r\n <div fxLayout=\"column\" fxFlex *ngIf=\"showPlaceHolder\" class=\"description-text tld-trg-placeholder\">\r\n <div fxFlex>\r\n <p\r\n [innerHtml]=\"(webTranslation?'TLD_TRANSLATE.SOURCE_TOOLTIP':'TLD_TRANSLATE.SOURCE_TOOLTIP_ONLY_TEXT') | translate: {appName: appName}\">\r\n </p>\r\n <ng-container *ngIf=\"showSensitiveInfoTooltip\">\r\n <br fxHide.xs />\r\n <p>{{'TLD_TRANSLATE.SOURCE_TOOLTIP_SENSITIVE_INFO' | translate: {appName: appName} }}</p>\r\n </ng-container>\r\n </div>\r\n\r\n <div *ngIf=\"showExtensions\" class=\"extension-container\">\r\n <ng-container *ngIf=\"!isAuth\">\r\n <p class=\"description-smaller\">\r\n <span>{{'TLD_TRANSLATE.SOURCE_FORMATS' | translate: { formats:acceptedTypesString, appName:\r\n appName} }}</span>\r\n </p>\r\n\r\n <ng-container *ngIf=\"!showExtensionsUnauthOnly\">\r\n <br fxHide.xs />\r\n <p class=\"description-smaller\" *ngIf=\" !isAuth\"\r\n [innerHtml]=\"'TLD_TRANSLATE.REGISTERED_FORMATS' | translate: { formats:extendedFileTypesString, registerLink:registerLink, appName: appName }\">\r\n </ng-container>\r\n </ng-container>\r\n\r\n <p class=\"description-smaller\" *ngIf=\"isAuth\"\r\n [innerHtml]=\"'TLD_TRANSLATE.REGISTERED_FORMATS_LOGGED_IN' | translate: { formats:extendedFileTypesString, registerLink:registerLink, appName: appName }\">\r\n </p>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["textarea{resize:none!important;outline:none;border:none;font-size:1em;z-index:1;background-color:transparent;font-family:Inter,sans-serif;padding:0;line-height:1.5;word-break:break-word;padding:1em!important;caret-color:#000!important}.tld-translate-source-wrapper{position:relative;cursor:text}.source-input-wrapper{position:relative}.tld-trg-placeholder{padding:1em 1em 0;position:absolute;height:100%;width:100%;font-size:1em}.tld-trg-placeholder p{margin:0}.extension-container{z-index:2}.asr-result-wrapper{margin:1em}.asr-result-wrapper .asr-hypothesis{color:gray}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5$1.DefaultShowHideDirective, selector: " [fxShow], [fxShow.print], [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl], [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl], [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg], [fxHide], [fxHide.print], [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl], [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl], [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "component", type: TextareaWithBackgroundComponent, selector: "tld-textarea-with-background", inputs: ["maxCharLength", "autoFocuss", "highlightTree", "highlight", "gramCheck", "textareaDisabled"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
7768
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TldTranslateSourceComponent, selector: "tld-translate-source", inputs: { textareaDisabled: "textareaDisabled", sourceParagraphs: "sourceParagraphs" }, ngImport: i0, template: "<div class=\"tld-translate-source-wrapper\" fxFlex fxLayout=\"column\">\r\n <div class=\"source-input-wrapper\" fxFlex>\r\n <tld-textarea-with-background *ngIf=\"!isDictating\" [textareaDisabled]=\"textareaDisabled\" [highlight]=\"highlight\"\r\n [autoFocuss]=\"autoFocuss\" [highlightTree]=\"sourceParagraphs\" [gramCheck]=\"gramCheck\" fxFlex\r\n [maxCharLength]=\"maxCharLength\"></tld-textarea-with-background>\r\n <div *ngIf=\"isDictating\" class=\"asr-result-wrapper\">\r\n <span class=\"asr-result\">\r\n {{sourceText}}\r\n </span>\r\n <span class=\"asr-hypothesis\">\r\n {{sourceTextHypothesis}}\r\n </span>\r\n </div>\r\n </div>\r\n <div fxLayout=\"column\" fxFlex *ngIf=\"showPlaceHolder\" class=\"description-text tld-trg-placeholder\">\r\n <div fxFlex>\r\n <p\r\n [innerHtml]=\"(webTranslation?'TLD_TRANSLATE.SOURCE_TOOLTIP':'TLD_TRANSLATE.SOURCE_TOOLTIP_ONLY_TEXT') | translate: {appName: appName}\">\r\n </p>\r\n <ng-container *ngIf=\"showSensitiveInfoTooltip\">\r\n <br fxHide.xs />\r\n <p>{{'TLD_TRANSLATE.SOURCE_TOOLTIP_SENSITIVE_INFO' | translate: {appName: appName} }}</p>\r\n </ng-container>\r\n </div>\r\n\r\n <div *ngIf=\"showExtensions\" class=\"extension-container\">\r\n <ng-container *ngIf=\"!isAuth\">\r\n <p class=\"description-smaller\">\r\n <span>{{'TLD_TRANSLATE.SOURCE_FORMATS' | translate: { formats:acceptedTypesString, appName:\r\n appName} }}</span>\r\n </p>\r\n\r\n <ng-container *ngIf=\"!showExtensionsUnauthOnly\">\r\n <br fxHide.xs />\r\n <p class=\"description-smaller\" *ngIf=\" !isAuth\"\r\n [innerHtml]=\"'TLD_TRANSLATE.REGISTERED_FORMATS' | translate: { formats:extendedFileTypesString, registerLink:registerLink, appName: appName }\">\r\n </ng-container>\r\n </ng-container>\r\n\r\n <p class=\"description-smaller\" *ngIf=\"isAuth\"\r\n [innerHtml]=\"'TLD_TRANSLATE.REGISTERED_FORMATS_LOGGED_IN' | translate: { formats:extendedFileTypesString, registerLink:registerLink, appName: appName }\">\r\n </p>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["textarea{resize:none!important;outline:none;border:none;font-size:1em;z-index:1;background-color:transparent;font-family:Inter,sans-serif;padding:0;line-height:1.5;word-break:break-word;padding:1em!important;caret-color:#000!important}.tld-translate-source-wrapper{position:relative;cursor:text}.source-input-wrapper{position:relative}.tld-trg-placeholder{padding:18px;position:absolute;height:100%;width:100%;font-size:1em}.tld-trg-placeholder p{margin:0}.extension-container{z-index:2}.asr-result-wrapper{margin:1em}.asr-result-wrapper .asr-hypothesis{color:gray}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5$1.DefaultShowHideDirective, selector: " [fxShow], [fxShow.print], [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl], [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl], [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg], [fxHide], [fxHide.print], [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl], [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl], [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "component", type: TextareaWithBackgroundComponent, selector: "tld-textarea-with-background", inputs: ["maxCharLength", "autoFocuss", "highlightTree", "highlight", "gramCheck", "textareaDisabled"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
7765
7769
  }
7766
7770
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TldTranslateSourceComponent, decorators: [{
7767
7771
  type: Component,
7768
- args: [{ selector: 'tld-translate-source', template: "<div class=\"tld-translate-source-wrapper\" fxFlex fxLayout=\"column\">\r\n <div class=\"source-input-wrapper\" fxFlex>\r\n <tld-textarea-with-background *ngIf=\"!isDictating\" [textareaDisabled]=\"textareaDisabled\" [highlight]=\"highlight\"\r\n [autoFocuss]=\"autoFocuss\" [highlightTree]=\"sourceParagraphs\" [gramCheck]=\"gramCheck\" fxFlex\r\n [maxCharLength]=\"maxCharLength\"></tld-textarea-with-background>\r\n <div *ngIf=\"isDictating\" class=\"asr-result-wrapper\">\r\n <span class=\"asr-result\">\r\n {{sourceText}}\r\n </span>\r\n <span class=\"asr-hypothesis\">\r\n {{sourceTextHypothesis}}\r\n </span>\r\n </div>\r\n </div>\r\n <div fxLayout=\"column\" fxFlex *ngIf=\"showPlaceHolder\" class=\"description-text tld-trg-placeholder\">\r\n <div fxFlex>\r\n <p\r\n [innerHtml]=\"(webTranslation?'TLD_TRANSLATE.SOURCE_TOOLTIP':'TLD_TRANSLATE.SOURCE_TOOLTIP_ONLY_TEXT') | translate: {appName: appName}\">\r\n </p>\r\n <ng-container *ngIf=\"showSensitiveInfoTooltip\">\r\n <br fxHide.xs />\r\n <p>{{'TLD_TRANSLATE.SOURCE_TOOLTIP_SENSITIVE_INFO' | translate: {appName: appName} }}</p>\r\n </ng-container>\r\n </div>\r\n\r\n <div *ngIf=\"showExtensions\" class=\"extension-container\">\r\n <ng-container *ngIf=\"!isAuth\">\r\n <p class=\"description-smaller\">\r\n <span>{{'TLD_TRANSLATE.SOURCE_FORMATS' | translate: { formats:acceptedTypesString, appName:\r\n appName} }}</span>\r\n </p>\r\n\r\n <ng-container *ngIf=\"!showExtensionsUnauthOnly\">\r\n <br fxHide.xs />\r\n <p class=\"description-smaller\" *ngIf=\" !isAuth\"\r\n [innerHtml]=\"'TLD_TRANSLATE.REGISTERED_FORMATS' | translate: { formats:extendedFileTypesString, registerLink:registerLink, appName: appName }\">\r\n </ng-container>\r\n </ng-container>\r\n\r\n <p class=\"description-smaller\" *ngIf=\"isAuth\"\r\n [innerHtml]=\"'TLD_TRANSLATE.REGISTERED_FORMATS_LOGGED_IN' | translate: { formats:extendedFileTypesString, registerLink:registerLink, appName: appName }\">\r\n </p>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["textarea{resize:none!important;outline:none;border:none;font-size:1em;z-index:1;background-color:transparent;font-family:Inter,sans-serif;padding:0;line-height:1.5;word-break:break-word;padding:1em!important;caret-color:#000!important}.tld-translate-source-wrapper{position:relative;cursor:text}.source-input-wrapper{position:relative}.tld-trg-placeholder{padding:1em 1em 0;position:absolute;height:100%;width:100%;font-size:1em}.tld-trg-placeholder p{margin:0}.extension-container{z-index:2}.asr-result-wrapper{margin:1em}.asr-result-wrapper .asr-hypothesis{color:gray}\n"] }]
7772
+ args: [{ selector: 'tld-translate-source', template: "<div class=\"tld-translate-source-wrapper\" fxFlex fxLayout=\"column\">\r\n <div class=\"source-input-wrapper\" fxFlex>\r\n <tld-textarea-with-background *ngIf=\"!isDictating\" [textareaDisabled]=\"textareaDisabled\" [highlight]=\"highlight\"\r\n [autoFocuss]=\"autoFocuss\" [highlightTree]=\"sourceParagraphs\" [gramCheck]=\"gramCheck\" fxFlex\r\n [maxCharLength]=\"maxCharLength\"></tld-textarea-with-background>\r\n <div *ngIf=\"isDictating\" class=\"asr-result-wrapper\">\r\n <span class=\"asr-result\">\r\n {{sourceText}}\r\n </span>\r\n <span class=\"asr-hypothesis\">\r\n {{sourceTextHypothesis}}\r\n </span>\r\n </div>\r\n </div>\r\n <div fxLayout=\"column\" fxFlex *ngIf=\"showPlaceHolder\" class=\"description-text tld-trg-placeholder\">\r\n <div fxFlex>\r\n <p\r\n [innerHtml]=\"(webTranslation?'TLD_TRANSLATE.SOURCE_TOOLTIP':'TLD_TRANSLATE.SOURCE_TOOLTIP_ONLY_TEXT') | translate: {appName: appName}\">\r\n </p>\r\n <ng-container *ngIf=\"showSensitiveInfoTooltip\">\r\n <br fxHide.xs />\r\n <p>{{'TLD_TRANSLATE.SOURCE_TOOLTIP_SENSITIVE_INFO' | translate: {appName: appName} }}</p>\r\n </ng-container>\r\n </div>\r\n\r\n <div *ngIf=\"showExtensions\" class=\"extension-container\">\r\n <ng-container *ngIf=\"!isAuth\">\r\n <p class=\"description-smaller\">\r\n <span>{{'TLD_TRANSLATE.SOURCE_FORMATS' | translate: { formats:acceptedTypesString, appName:\r\n appName} }}</span>\r\n </p>\r\n\r\n <ng-container *ngIf=\"!showExtensionsUnauthOnly\">\r\n <br fxHide.xs />\r\n <p class=\"description-smaller\" *ngIf=\" !isAuth\"\r\n [innerHtml]=\"'TLD_TRANSLATE.REGISTERED_FORMATS' | translate: { formats:extendedFileTypesString, registerLink:registerLink, appName: appName }\">\r\n </ng-container>\r\n </ng-container>\r\n\r\n <p class=\"description-smaller\" *ngIf=\"isAuth\"\r\n [innerHtml]=\"'TLD_TRANSLATE.REGISTERED_FORMATS_LOGGED_IN' | translate: { formats:extendedFileTypesString, registerLink:registerLink, appName: appName }\">\r\n </p>\r\n </div>\r\n </div>\r\n</div>\r\n", styles: ["textarea{resize:none!important;outline:none;border:none;font-size:1em;z-index:1;background-color:transparent;font-family:Inter,sans-serif;padding:0;line-height:1.5;word-break:break-word;padding:1em!important;caret-color:#000!important}.tld-translate-source-wrapper{position:relative;cursor:text}.source-input-wrapper{position:relative}.tld-trg-placeholder{padding:18px;position:absolute;height:100%;width:100%;font-size:1em}.tld-trg-placeholder p{margin:0}.extension-container{z-index:2}.asr-result-wrapper{margin:1em}.asr-result-wrapper .asr-hypothesis{color:gray}\n"] }]
7769
7773
  }], ctorParameters: () => [{ type: TldTranslateConfigService }, { type: TldTranslateTextService }], propDecorators: { textareaDisabled: [{
7770
7774
  type: Input
7771
7775
  }], sourceParagraphs: [{
@@ -8108,11 +8112,14 @@ class TldTranslateTextComponent {
8108
8112
  document.querySelector('.summary-wrapper').scrollIntoView({ behavior: 'smooth' });
8109
8113
  }, 100);
8110
8114
  this.llmService
8111
- .summarize({ language: this.targetLanguage, text: this.translatedText, useCase: LLMUseCase.General })
8115
+ .summarize({ language: this.targetLanguage, text: this.translatedText, useCase: LLMUseCase.Brief })
8112
8116
  .pipe(finalize(() => (this.isSummarazing = false)))
8113
8117
  .subscribe({
8114
8118
  next: (response) => {
8115
8119
  this.summarizedText = marked.parse(response);
8120
+ setTimeout(() => {
8121
+ document.querySelector('.summary-wrapper').scrollIntoView({ behavior: 'smooth', block: 'center' });
8122
+ }, 100);
8116
8123
  },
8117
8124
  });
8118
8125
  }
@@ -8204,11 +8211,11 @@ class TldTranslateTextComponent {
8204
8211
  this.summarizedText = null;
8205
8212
  }
8206
8213
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TldTranslateTextComponent, deps: [{ token: TldTranslateTextService }, { token: i2$3.Clipboard }, { token: i5.AlertService }, { token: TldTranslateConfigService }, { token: TldScrollService }, { token: TldTranslateSystemManagementService }, { token: AudioRecordService }, { token: TldVoiceInputService }, { token: TldTranslateFileService }, { token: i8$1.BreakpointObserver }, { token: i5$2.LLMService }], target: i0.ɵɵFactoryTarget.Component });
8207
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TldTranslateTextComponent, selector: "tld-translate-text", inputs: { filePreviewProgress: "filePreviewProgress" }, outputs: { onFileChange: "onFileChange" }, viewQueries: [{ propertyName: "sourceComponent", first: true, predicate: ["sourceComponent"], descendants: true }, { propertyName: "dictateComponent", first: true, predicate: ["dictate"], descendants: true }], ngImport: i0, template: "<!-- NOTE. tld-source-and-target-wrapper uses multiple content projections, so might seem confusing first, but elements are displayed at their places based on tld-source-and-target-wrapper component\r\nhttps://angular.io/guide/content-projection#multi-slot-content-projection\r\n-->\r\n<tld-source-and-target-wrapper\r\n\t[textToSpeechSourceSettings]=\"textToSpeechSourceSettings\"\r\n\t[clearSourceVisible]=\"source?.length > 0\"\r\n\t(onSourceClear)=\"clearSource()\"\r\n\t[clearDisabled]=\"textareaDisabled\"\r\n\t[clearSourceTooltip]=\"'TLD_TRANSLATE.CLEAR_SOURCE_TOOLTIP'\"\r\n\t[ngClass]=\"{ 'highlight-active': highlight, 'gramcheck-active': gramCheck, 'empty-target': isEmptyTarget }\"\r\n>\r\n\t<div sourceMain class=\"source-main\" fxLayout=\"column\">\r\n\t\t<tld-translate-source [textareaDisabled]=\"textareaDisabled\" #sourceComponent fxFlex [sourceParagraphs]=\"sourceParagraphs\"></tld-translate-source>\r\n\t</div>\r\n\t<ng-container sourceActions *ngIf=\"!hideSourceActions\">\r\n\t\t<div fxLayoutAlign=\"start center\" class=\"basic-padding\" fxLayoutGap=\"1em\">\r\n\t\t\t<ng-container *ngIf=\"audioInputVisible\">\r\n\t\t\t\t<tld-dictate\r\n\t\t\t\t\t#dictate\r\n\t\t\t\t\t[configuration]=\"dictateConfig\"\r\n\t\t\t\t\t[ngClass]=\"{ 'full-width': !fileUpload }\"\r\n\t\t\t\t\t(isDictating)=\"dictateStartStop($event)\"\r\n\t\t\t\t\t(result)=\"dictateResult($event)\"\r\n\t\t\t\t\t(partialResult)=\"dictatePartialResult($event)\"\r\n\t\t\t\t\t(onError)=\"dictateError($event)\"\r\n\t\t\t\t\t[language]=\"sourceLanguage\"\r\n\t\t\t\t>\r\n\t\t\t\t</tld-dictate>\r\n\t\t\t</ng-container>\r\n\t\t\t<div *ngIf=\"fileUpload\" class=\"file-upload-wrapper\">\r\n\t\t\t\t<lib-file-upload\r\n\t\t\t\t\t(fileChange)=\"fileChange($event)\"\r\n\t\t\t\t\t[accept]=\"allowedFileTypes\"\r\n\t\t\t\t\t[maxSize]=\"maxFileUploadSize\"\r\n\t\t\t\t\t[uploadIconName]=\"uploadIconName\"\r\n\t\t\t\t\t[extendedAcceptList]=\"extendedFileTypes\"\r\n\t\t\t\t\t[multiple]=\"multipleFiles\"\r\n\t\t\t\t\t(errorEvent)=\"fileUploadError($event)\"\r\n\t\t\t\t\t[filePreviewProgress]=\"filePreviewProgress\"\r\n\t\t\t\t\t[disabled]=\"fileUploadDisabled\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"upload-file-text\">\r\n\t\t\t\t\t\t\t<span class=\"info\">\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.UPLOAD' | translate\" class=\"accent-color\"></span>\r\n\t\t\t\t\t\t\t\t<span>&nbsp;</span>\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.DRAG_AND_DROP' | translate\" fxHide.lt-sm></span>\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.' + (multipleFiles ? 'FILES' : 'FILE') | translate\" [ngClass.lt-sm]=\"'accent-color'\"></span>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\t<span class=\"file-upload-extensions text-m\">\r\n\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t<span>{{ visibleExtensions }}. </span>\r\n\t\t\t\t\t\t\t\t<span *ngIf=\"maxSizeMB\" [innerHTML]=\"'FILE_UPLOAD.LIMITS_MB' | translate : { maxSizeMB: maxSizeMB }\"></span>\r\n\t\t\t\t\t\t\t\t)\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</lib-file-upload>\r\n\t\t\t\t<lib-open-extension-dialog *ngIf=\"showExtensionPopup\" [extensions]=\"allowedTypesWithoutDots\"> </lib-open-extension-dialog>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</ng-container>\r\n\r\n\t<div targetMain class=\"target-main\">\r\n\t\t<ng-container *ngIf=\"isEmptyTarget; else translatedTextBlock\">\r\n\t\t\t<p *ngIf=\"showTargetPlaceholder\" class=\"description-text target-empty\" [innerHtml]=\"'TLD_TRANSLATE.TARGET_DESCRIPTION' | translate\"></p>\r\n\t\t</ng-container>\r\n\t</div>\r\n\r\n\t<ng-container targetActions>\r\n\t\t<div class=\"tld-translate-target-footer basic-padding\" *ngIf=\"showSuggestions || showProgressIndicator\">\r\n\t\t\t<tld-translate-suggest *ngIf=\"showSuggestions\" [systemId]=\"systemId\" [target]=\"targetParagraphs\" [source]=\"sourceParagraphs\"> </tld-translate-suggest>\r\n\t\t\t<progress-indicator (onClose)=\"closeProgressIndicator()\" *ngIf=\"showProgressIndicator\"></progress-indicator>\r\n\t\t</div>\r\n\t</ng-container>\r\n</tld-source-and-target-wrapper>\r\n\r\n<!-- templates used for else blocks in target container -->\r\n<ng-template #translatedTextBlock>\r\n\t<div [class.translated-source-overflow]=\"targetWrapperOverflow\" class=\"translated-source\" [class.selectable-sentence]=\"showSuggestions\">\r\n\t\t<ng-container *ngIf=\"!urlToTranslate\">\r\n\t\t\t<div class=\"target-wrapper-action-buttons\">\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated\"\r\n\t\t\t\t\tclass=\"tld-copy-translation\"\r\n\t\t\t\t\t(click)=\"copy()\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.COPY' | translate\"\r\n\t\t\t\t\t[attr.aria-describedby]=\"copyMessageId\"\r\n\t\t\t\t\t[attr.Id]=\"copyButtonId\"\r\n\t\t\t\t\t(keydown.Tab)=\"switchFocusFromCopy($event)\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.COPY' | translate\"> content_copy </span>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated || translationError\"\r\n\t\t\t\t\tclass=\"tld-refresh-translation\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.REFRESH' | translate\"\r\n\t\t\t\t\t(click)=\"refresh()\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.REFRESH' | translate\"> refresh </span>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated && isLlmEnabled\"\r\n\t\t\t\t\tclass=\"tld-create-summary\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.CREATE_SUMMARY' | translate\"\r\n\t\t\t\t\t[disabled]=\"isTranslating || isSummarazing || summarizedText\"\r\n\t\t\t\t\t(click)=\"createSummary()\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<mat-icon [svgIcon]=\"'summarize'\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.CREATE_SUMMARY' | translate\"></mat-icon>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<tld-text-to-speech *ngIf=\"textToSpeechTargetSettings && firstParagraphTranslated\" [settings]=\"textToSpeechTargetSettings\"> </tld-text-to-speech>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngFor=\"let paragraph of targetParagraphs\">\r\n\t\t\t\t<tld-highlight-tree [highlight]=\"highlight\" [tree]=\"paragraph\" [selectSentence]=\"showSuggestions\"> </tld-highlight-tree>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngIf=\"isSummarazing || summarizedText\" class=\"summary-wrapper\">\r\n\t\t\t\t<p>{{ \"TLD_TRANSLATE.SUMMARY.TITLE\" | translate }}</p>\r\n\r\n\t\t\t\t<p *ngIf=\"isSummarazing\" class=\"creating-progress\">{{ \"TLD_TRANSLATE.SUMMARY.CREATING\" | translate }}<span class=\"dot-loading\">...</span></p>\r\n\r\n\t\t\t\t<p [innerHTML]=\"summarizedText\"></p>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"summarizedText\"\r\n\t\t\t\t\t[ngClass.lt-sm]=\"'summary-mobile'\"\r\n\t\t\t\t\tclass=\"summary-copy-btn\"\r\n\t\t\t\t\t(click)=\"copySummarizedText()\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.COPY' | translate\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.COPY' | translate\"> content_copy </span>\r\n\t\t\t\t</button>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngIf=\"firstParagraphTranslated\" class=\"dictionary-wrapper\">\r\n\t\t\t\t<tld-dictionary [dictionary]=\"dictionaryEntry\"></tld-dictionary>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\r\n\t\t<div *ngIf=\"urlToTranslate\" class=\"target-url-container\">\r\n\t\t\t<a [attr.href]=\"translateUrlRedirect\" target=\"_blank\" fxLayoutAlign=\"start center\" class=\"go-to-webtranslate\">\r\n\t\t\t\t{{ urlToTranslate }}\r\n\t\t\t\t<span class=\"material-icons\" color=\"accent\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.OPEN_IN_NEW'\"> open_in_new </span>\r\n\t\t\t</a>\r\n\t\t</div>\r\n\t</div>\r\n</ng-template>\r\n", styles: [".go-to-webtranslate{word-break:break-all;display:inline}.basic-padding,.target-empty,.target-translated-text{padding:1em}.source-container{border-right:1px solid #cbd2d9;padding:0;overflow:auto}.target-description{margin-top:0}.translated-source{position:relative;overflow-y:auto;overflow-x:hidden;flex:1 1 0!important;padding:1em 3.5em 1em 2em!important}.translated-source.selectable-sentence{cursor:pointer}::ng-deep .target-highlight .tld-highlight-container{padding:1em}.target-wrapper-action-buttons{position:absolute;top:0;right:0}.target-wrapper-action-buttons .tld-copy-translation,.target-wrapper-action-buttons .tld-refresh-translation,.target-wrapper-action-buttons tld-text-to-speech{display:block}.target-empty,.target-translated-text{margin:0}tld-dictionary{overflow-y:auto;flex:1 1 0!important}.source-main,.target-main{height:100%}.upload-file-text{color:var(--base-40);font-size:14px;display:inline-block;text-align:left}.file-upload-wrapper{width:100%}.file-upload-wrapper .file-upload-extensions{font-weight:400}.dictionary-wrapper{margin-top:2rem}.summary-wrapper{position:relative;padding-top:12px;border-top:1px solid var(--base-70)}.summary-wrapper p{margin-bottom:.5rem;font-weight:500}.creating-progress{color:var(--base-40)}.dot-loading{clip-path:inset(0 100% 0 0);animation:loading 1.5s steps(4) infinite}.summary-copy-btn{position:absolute;right:-53px;top:20px}.summary-mobile{right:-46px}@media (max-width: 768px){.translated-source{padding:1em 3em 1em 1em!important}}@keyframes loading{to{clip-path:inset(0 -34% 0 0)}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SourceAndTargetWrapperComponent, selector: "tld-source-and-target-wrapper", inputs: ["clearSourceVisible", "clearSourceTooltip", "clearDisabled", "textToSpeechSourceSettings"], outputs: ["onSourceClear"] }, { kind: "component", type: TldDictateComponent, selector: "tld-dictate", inputs: ["configuration", "language"], outputs: ["result", "partialResult", "isDictating", "onError"] }, { kind: "component", type: i5.OpenExtensionDialogComponent, selector: "lib-open-extension-dialog", inputs: ["extensions"] }, { kind: "component", type: TextToSpeechComponent, selector: "tld-text-to-speech", inputs: ["settings"] }, { kind: "component", type: i5.FileUploadComponent, selector: "lib-file-upload", inputs: ["accept", "useCompactUpload", "maxSize", "multiple", "filePreviewProgress", "allowEmpty", "disabled", "dragZoneLabel", "uploadIconName", "uploadButtonLabel", "openExtensionPopupLabel", "minSupportedFormatCount", "extendedAcceptList"], outputs: ["fileChange", "errorEvent"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5$1.DefaultShowHideDirective, selector: " [fxShow], [fxShow.print], [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl], [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl], [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg], [fxHide], [fxHide.print], [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl], [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl], [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "directive", type: i5$1.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "directive", type: i2$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TldTranslateSourceComponent, selector: "tld-translate-source", inputs: ["textareaDisabled", "sourceParagraphs"] }, { kind: "component", type: TldTranslateSuggestComponent, selector: "tld-translate-suggest", inputs: ["target", "source", "dictionary", "systemId", "options", "selectedSentence"] }, { kind: "component", type: TldDictionaryComponent, selector: "tld-dictionary", inputs: ["dictionary"] }, { kind: "component", type: HighlightTreeComponent, selector: "tld-highlight-tree", inputs: ["tree", "isSource", "correctionsEnabled", "highlight", "gramCheck", "selectSentence"], outputs: ["onReplace"] }, { kind: "component", type: ProgressIndicatorComponent, selector: "progress-indicator", outputs: ["onClose"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
8214
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TldTranslateTextComponent, selector: "tld-translate-text", inputs: { filePreviewProgress: "filePreviewProgress" }, outputs: { onFileChange: "onFileChange" }, viewQueries: [{ propertyName: "sourceComponent", first: true, predicate: ["sourceComponent"], descendants: true }, { propertyName: "dictateComponent", first: true, predicate: ["dictate"], descendants: true }], ngImport: i0, template: "<!-- NOTE. tld-source-and-target-wrapper uses multiple content projections, so might seem confusing first, but elements are displayed at their places based on tld-source-and-target-wrapper component\r\nhttps://angular.io/guide/content-projection#multi-slot-content-projection\r\n-->\r\n<tld-source-and-target-wrapper\r\n\t[textToSpeechSourceSettings]=\"textToSpeechSourceSettings\"\r\n\t[clearSourceVisible]=\"source?.length > 0\"\r\n\t(onSourceClear)=\"clearSource()\"\r\n\t[clearDisabled]=\"textareaDisabled\"\r\n\t[clearSourceTooltip]=\"'TLD_TRANSLATE.CLEAR_SOURCE_TOOLTIP'\"\r\n\t[ngClass]=\"{ 'highlight-active': highlight, 'gramcheck-active': gramCheck, 'empty-target': isEmptyTarget }\"\r\n>\r\n\t<div sourceMain class=\"source-main\" fxLayout=\"column\">\r\n\t\t<tld-translate-source [textareaDisabled]=\"textareaDisabled\" #sourceComponent fxFlex [sourceParagraphs]=\"sourceParagraphs\"></tld-translate-source>\r\n\t</div>\r\n\t<ng-container sourceActions *ngIf=\"!hideSourceActions\">\r\n\t\t<div fxLayoutAlign=\"start center\" class=\"basic-padding\" fxLayoutGap=\"1em\">\r\n\t\t\t<ng-container *ngIf=\"audioInputVisible\">\r\n\t\t\t\t<tld-dictate\r\n\t\t\t\t\t#dictate\r\n\t\t\t\t\t[configuration]=\"dictateConfig\"\r\n\t\t\t\t\t[ngClass]=\"{ 'full-width': !fileUpload }\"\r\n\t\t\t\t\t(isDictating)=\"dictateStartStop($event)\"\r\n\t\t\t\t\t(result)=\"dictateResult($event)\"\r\n\t\t\t\t\t(partialResult)=\"dictatePartialResult($event)\"\r\n\t\t\t\t\t(onError)=\"dictateError($event)\"\r\n\t\t\t\t\t[language]=\"sourceLanguage\"\r\n\t\t\t\t>\r\n\t\t\t\t</tld-dictate>\r\n\t\t\t</ng-container>\r\n\t\t\t<div *ngIf=\"fileUpload\" class=\"file-upload-wrapper\">\r\n\t\t\t\t<lib-file-upload\r\n\t\t\t\t\t(fileChange)=\"fileChange($event)\"\r\n\t\t\t\t\t[accept]=\"allowedFileTypes\"\r\n\t\t\t\t\t[maxSize]=\"maxFileUploadSize\"\r\n\t\t\t\t\t[uploadIconName]=\"uploadIconName\"\r\n\t\t\t\t\t[extendedAcceptList]=\"extendedFileTypes\"\r\n\t\t\t\t\t[multiple]=\"multipleFiles\"\r\n\t\t\t\t\t(errorEvent)=\"fileUploadError($event)\"\r\n\t\t\t\t\t[filePreviewProgress]=\"filePreviewProgress\"\r\n\t\t\t\t\t[disabled]=\"fileUploadDisabled\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"upload-file-text\">\r\n\t\t\t\t\t\t\t<span class=\"info\">\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.UPLOAD' | translate\" class=\"accent-color\"></span>\r\n\t\t\t\t\t\t\t\t<span>&nbsp;</span>\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.DRAG_AND_DROP' | translate\" fxHide.lt-sm></span>\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.' + (multipleFiles ? 'FILES' : 'FILE') | translate\" [ngClass.lt-sm]=\"'accent-color'\"></span>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\t<span class=\"file-upload-extensions text-m\">\r\n\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t<span>{{ visibleExtensions }}. </span>\r\n\t\t\t\t\t\t\t\t<span *ngIf=\"maxSizeMB\" [innerHTML]=\"'FILE_UPLOAD.LIMITS_MB' | translate : { maxSizeMB: maxSizeMB }\"></span>\r\n\t\t\t\t\t\t\t\t)\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</lib-file-upload>\r\n\t\t\t\t<lib-open-extension-dialog *ngIf=\"showExtensionPopup\" [extensions]=\"allowedTypesWithoutDots\"> </lib-open-extension-dialog>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</ng-container>\r\n\r\n\t<div targetMain class=\"target-main\">\r\n\t\t<ng-container *ngIf=\"isEmptyTarget; else translatedTextBlock\">\r\n\t\t\t<p *ngIf=\"showTargetPlaceholder\" class=\"description-text target-empty\" [innerHtml]=\"'TLD_TRANSLATE.TARGET_DESCRIPTION' | translate\"></p>\r\n\t\t</ng-container>\r\n\t</div>\r\n\r\n\t<ng-container targetActions>\r\n\t\t<div class=\"tld-translate-target-footer basic-padding\" *ngIf=\"showSuggestions || showProgressIndicator\">\r\n\t\t\t<tld-translate-suggest *ngIf=\"showSuggestions\" [systemId]=\"systemId\" [target]=\"targetParagraphs\" [source]=\"sourceParagraphs\"> </tld-translate-suggest>\r\n\t\t\t<progress-indicator (onClose)=\"closeProgressIndicator()\" *ngIf=\"showProgressIndicator\"></progress-indicator>\r\n\t\t</div>\r\n\t</ng-container>\r\n</tld-source-and-target-wrapper>\r\n\r\n<!-- templates used for else blocks in target container -->\r\n<ng-template #translatedTextBlock>\r\n\t<div [class.translated-source-overflow]=\"targetWrapperOverflow\" class=\"translated-source\" [class.selectable-sentence]=\"showSuggestions\">\r\n\t\t<ng-container *ngIf=\"!urlToTranslate\">\r\n\t\t\t<div class=\"target-wrapper-action-buttons\">\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated\"\r\n\t\t\t\t\tclass=\"tld-copy-translation\"\r\n\t\t\t\t\t(click)=\"copy()\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.COPY' | translate\"\r\n\t\t\t\t\t[attr.aria-describedby]=\"copyMessageId\"\r\n\t\t\t\t\t[attr.Id]=\"copyButtonId\"\r\n\t\t\t\t\t(keydown.Tab)=\"switchFocusFromCopy($event)\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.COPY' | translate\"> content_copy </span>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated || translationError\"\r\n\t\t\t\t\tclass=\"tld-refresh-translation\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.REFRESH' | translate\"\r\n\t\t\t\t\t(click)=\"refresh()\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.REFRESH' | translate\"> refresh </span>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated && isLlmEnabled\"\r\n\t\t\t\t\tclass=\"tld-create-summary\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.CREATE_SUMMARY' | translate\"\r\n\t\t\t\t\t[disabled]=\"isTranslating || isSummarazing || summarizedText\"\r\n\t\t\t\t\t(click)=\"createSummary()\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<mat-icon [svgIcon]=\"'summarize'\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.CREATE_SUMMARY' | translate\"></mat-icon>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<tld-text-to-speech *ngIf=\"textToSpeechTargetSettings && firstParagraphTranslated\" [settings]=\"textToSpeechTargetSettings\"> </tld-text-to-speech>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngFor=\"let paragraph of targetParagraphs\">\r\n\t\t\t\t<tld-highlight-tree [highlight]=\"highlight\" [tree]=\"paragraph\" [selectSentence]=\"showSuggestions\"> </tld-highlight-tree>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngIf=\"isSummarazing || summarizedText\" class=\"summary-wrapper\">\r\n\t\t\t\t<p>{{ \"TLD_TRANSLATE.SUMMARY.TITLE\" | translate }}</p>\r\n\r\n\t\t\t\t<p *ngIf=\"isSummarazing\" class=\"creating-progress\">{{ \"TLD_TRANSLATE.SUMMARY.CREATING\" | translate }}<span class=\"dot-loading\">...</span></p>\r\n\r\n\t\t\t\t<p [innerHTML]=\"summarizedText\"></p>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"summarizedText\"\r\n\t\t\t\t\t[ngClass.lt-sm]=\"'summary-mobile'\"\r\n\t\t\t\t\tclass=\"summary-copy-btn\"\r\n\t\t\t\t\t(click)=\"copySummarizedText()\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.COPY' | translate\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.COPY' | translate\"> content_copy </span>\r\n\t\t\t\t</button>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngIf=\"firstParagraphTranslated\" class=\"dictionary-wrapper\">\r\n\t\t\t\t<tld-dictionary [dictionary]=\"dictionaryEntry\"></tld-dictionary>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\r\n\t\t<div *ngIf=\"urlToTranslate\" class=\"target-url-container\">\r\n\t\t\t<a [attr.href]=\"translateUrlRedirect\" target=\"_blank\" fxLayoutAlign=\"start center\" class=\"go-to-webtranslate\">\r\n\t\t\t\t{{ urlToTranslate }}\r\n\t\t\t\t<span class=\"material-icons\" color=\"accent\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.OPEN_IN_NEW'\"> open_in_new </span>\r\n\t\t\t</a>\r\n\t\t</div>\r\n\t</div>\r\n</ng-template>\r\n", styles: [".go-to-webtranslate{word-break:break-all;display:inline}.basic-padding,.target-empty,.target-translated-text{padding:18px}.source-container{border-right:1px solid #cbd2d9;padding:0;overflow:auto}.target-description{margin-top:0}.translated-source{position:relative;overflow-y:auto;overflow-x:hidden;flex:1 1 0!important;min-height:-webkit-fill-available;padding:18px 48px 18px 18px!important}.translated-source.selectable-sentence{cursor:pointer}::ng-deep .target-highlight .tld-highlight-container{padding:18px}.target-wrapper-action-buttons{position:absolute;top:3px;right:3px}.target-wrapper-action-buttons .tld-copy-translation,.target-wrapper-action-buttons .tld-refresh-translation,.target-wrapper-action-buttons tld-text-to-speech{display:block}.target-empty,.target-translated-text{margin:0}tld-dictionary{overflow-y:auto;flex:1 1 0!important}.source-main,.target-main{height:100%}.upload-file-text{color:var(--base-40);font-size:14px;display:inline-block;text-align:left}.file-upload-wrapper{width:100%}.file-upload-wrapper .file-upload-extensions{font-weight:400}.dictionary-wrapper{margin-top:2rem}.summary-wrapper{position:relative;padding-top:12px;border-top:1px solid var(--base-70)}.summary-wrapper p{margin-bottom:.5rem;font-weight:500}.creating-progress{color:var(--base-40)}.dot-loading{clip-path:inset(0 100% 0 0);animation:loading 1.5s steps(4) infinite}.summary-copy-btn{position:absolute;right:-45px;top:20px}.summary-mobile{right:-46px}@keyframes loading{to{clip-path:inset(0 -34% 0 0)}}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: SourceAndTargetWrapperComponent, selector: "tld-source-and-target-wrapper", inputs: ["clearSourceVisible", "clearSourceTooltip", "clearDisabled", "textToSpeechSourceSettings"], outputs: ["onSourceClear"] }, { kind: "component", type: TldDictateComponent, selector: "tld-dictate", inputs: ["configuration", "language"], outputs: ["result", "partialResult", "isDictating", "onError"] }, { kind: "component", type: i5.OpenExtensionDialogComponent, selector: "lib-open-extension-dialog", inputs: ["extensions"] }, { kind: "component", type: TextToSpeechComponent, selector: "tld-text-to-speech", inputs: ["settings"] }, { kind: "component", type: i5.FileUploadComponent, selector: "lib-file-upload", inputs: ["accept", "useCompactUpload", "maxSize", "multiple", "filePreviewProgress", "allowEmpty", "disabled", "dragZoneLabel", "uploadIconName", "uploadButtonLabel", "openExtensionPopupLabel", "minSupportedFormatCount", "extendedAcceptList"], outputs: ["fileChange", "errorEvent"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutGapDirective, selector: " [fxLayoutGap], [fxLayoutGap.xs], [fxLayoutGap.sm], [fxLayoutGap.md], [fxLayoutGap.lg], [fxLayoutGap.xl], [fxLayoutGap.lt-sm], [fxLayoutGap.lt-md], [fxLayoutGap.lt-lg], [fxLayoutGap.lt-xl], [fxLayoutGap.gt-xs], [fxLayoutGap.gt-sm], [fxLayoutGap.gt-md], [fxLayoutGap.gt-lg]", inputs: ["fxLayoutGap", "fxLayoutGap.xs", "fxLayoutGap.sm", "fxLayoutGap.md", "fxLayoutGap.lg", "fxLayoutGap.xl", "fxLayoutGap.lt-sm", "fxLayoutGap.lt-md", "fxLayoutGap.lt-lg", "fxLayoutGap.lt-xl", "fxLayoutGap.gt-xs", "fxLayoutGap.gt-sm", "fxLayoutGap.gt-md", "fxLayoutGap.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5$1.DefaultShowHideDirective, selector: " [fxShow], [fxShow.print], [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl], [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl], [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg], [fxHide], [fxHide.print], [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl], [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl], [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "directive", type: i5$1.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "directive", type: i2$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TldTranslateSourceComponent, selector: "tld-translate-source", inputs: ["textareaDisabled", "sourceParagraphs"] }, { kind: "component", type: TldTranslateSuggestComponent, selector: "tld-translate-suggest", inputs: ["target", "source", "dictionary", "systemId", "options", "selectedSentence"] }, { kind: "component", type: TldDictionaryComponent, selector: "tld-dictionary", inputs: ["dictionary"] }, { kind: "component", type: HighlightTreeComponent, selector: "tld-highlight-tree", inputs: ["tree", "isSource", "correctionsEnabled", "highlight", "gramCheck", "selectSentence"], outputs: ["onReplace"] }, { kind: "component", type: ProgressIndicatorComponent, selector: "progress-indicator", outputs: ["onClose"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
8208
8215
  }
8209
8216
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TldTranslateTextComponent, decorators: [{
8210
8217
  type: Component,
8211
- args: [{ selector: 'tld-translate-text', template: "<!-- NOTE. tld-source-and-target-wrapper uses multiple content projections, so might seem confusing first, but elements are displayed at their places based on tld-source-and-target-wrapper component\r\nhttps://angular.io/guide/content-projection#multi-slot-content-projection\r\n-->\r\n<tld-source-and-target-wrapper\r\n\t[textToSpeechSourceSettings]=\"textToSpeechSourceSettings\"\r\n\t[clearSourceVisible]=\"source?.length > 0\"\r\n\t(onSourceClear)=\"clearSource()\"\r\n\t[clearDisabled]=\"textareaDisabled\"\r\n\t[clearSourceTooltip]=\"'TLD_TRANSLATE.CLEAR_SOURCE_TOOLTIP'\"\r\n\t[ngClass]=\"{ 'highlight-active': highlight, 'gramcheck-active': gramCheck, 'empty-target': isEmptyTarget }\"\r\n>\r\n\t<div sourceMain class=\"source-main\" fxLayout=\"column\">\r\n\t\t<tld-translate-source [textareaDisabled]=\"textareaDisabled\" #sourceComponent fxFlex [sourceParagraphs]=\"sourceParagraphs\"></tld-translate-source>\r\n\t</div>\r\n\t<ng-container sourceActions *ngIf=\"!hideSourceActions\">\r\n\t\t<div fxLayoutAlign=\"start center\" class=\"basic-padding\" fxLayoutGap=\"1em\">\r\n\t\t\t<ng-container *ngIf=\"audioInputVisible\">\r\n\t\t\t\t<tld-dictate\r\n\t\t\t\t\t#dictate\r\n\t\t\t\t\t[configuration]=\"dictateConfig\"\r\n\t\t\t\t\t[ngClass]=\"{ 'full-width': !fileUpload }\"\r\n\t\t\t\t\t(isDictating)=\"dictateStartStop($event)\"\r\n\t\t\t\t\t(result)=\"dictateResult($event)\"\r\n\t\t\t\t\t(partialResult)=\"dictatePartialResult($event)\"\r\n\t\t\t\t\t(onError)=\"dictateError($event)\"\r\n\t\t\t\t\t[language]=\"sourceLanguage\"\r\n\t\t\t\t>\r\n\t\t\t\t</tld-dictate>\r\n\t\t\t</ng-container>\r\n\t\t\t<div *ngIf=\"fileUpload\" class=\"file-upload-wrapper\">\r\n\t\t\t\t<lib-file-upload\r\n\t\t\t\t\t(fileChange)=\"fileChange($event)\"\r\n\t\t\t\t\t[accept]=\"allowedFileTypes\"\r\n\t\t\t\t\t[maxSize]=\"maxFileUploadSize\"\r\n\t\t\t\t\t[uploadIconName]=\"uploadIconName\"\r\n\t\t\t\t\t[extendedAcceptList]=\"extendedFileTypes\"\r\n\t\t\t\t\t[multiple]=\"multipleFiles\"\r\n\t\t\t\t\t(errorEvent)=\"fileUploadError($event)\"\r\n\t\t\t\t\t[filePreviewProgress]=\"filePreviewProgress\"\r\n\t\t\t\t\t[disabled]=\"fileUploadDisabled\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"upload-file-text\">\r\n\t\t\t\t\t\t\t<span class=\"info\">\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.UPLOAD' | translate\" class=\"accent-color\"></span>\r\n\t\t\t\t\t\t\t\t<span>&nbsp;</span>\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.DRAG_AND_DROP' | translate\" fxHide.lt-sm></span>\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.' + (multipleFiles ? 'FILES' : 'FILE') | translate\" [ngClass.lt-sm]=\"'accent-color'\"></span>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\t<span class=\"file-upload-extensions text-m\">\r\n\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t<span>{{ visibleExtensions }}. </span>\r\n\t\t\t\t\t\t\t\t<span *ngIf=\"maxSizeMB\" [innerHTML]=\"'FILE_UPLOAD.LIMITS_MB' | translate : { maxSizeMB: maxSizeMB }\"></span>\r\n\t\t\t\t\t\t\t\t)\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</lib-file-upload>\r\n\t\t\t\t<lib-open-extension-dialog *ngIf=\"showExtensionPopup\" [extensions]=\"allowedTypesWithoutDots\"> </lib-open-extension-dialog>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</ng-container>\r\n\r\n\t<div targetMain class=\"target-main\">\r\n\t\t<ng-container *ngIf=\"isEmptyTarget; else translatedTextBlock\">\r\n\t\t\t<p *ngIf=\"showTargetPlaceholder\" class=\"description-text target-empty\" [innerHtml]=\"'TLD_TRANSLATE.TARGET_DESCRIPTION' | translate\"></p>\r\n\t\t</ng-container>\r\n\t</div>\r\n\r\n\t<ng-container targetActions>\r\n\t\t<div class=\"tld-translate-target-footer basic-padding\" *ngIf=\"showSuggestions || showProgressIndicator\">\r\n\t\t\t<tld-translate-suggest *ngIf=\"showSuggestions\" [systemId]=\"systemId\" [target]=\"targetParagraphs\" [source]=\"sourceParagraphs\"> </tld-translate-suggest>\r\n\t\t\t<progress-indicator (onClose)=\"closeProgressIndicator()\" *ngIf=\"showProgressIndicator\"></progress-indicator>\r\n\t\t</div>\r\n\t</ng-container>\r\n</tld-source-and-target-wrapper>\r\n\r\n<!-- templates used for else blocks in target container -->\r\n<ng-template #translatedTextBlock>\r\n\t<div [class.translated-source-overflow]=\"targetWrapperOverflow\" class=\"translated-source\" [class.selectable-sentence]=\"showSuggestions\">\r\n\t\t<ng-container *ngIf=\"!urlToTranslate\">\r\n\t\t\t<div class=\"target-wrapper-action-buttons\">\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated\"\r\n\t\t\t\t\tclass=\"tld-copy-translation\"\r\n\t\t\t\t\t(click)=\"copy()\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.COPY' | translate\"\r\n\t\t\t\t\t[attr.aria-describedby]=\"copyMessageId\"\r\n\t\t\t\t\t[attr.Id]=\"copyButtonId\"\r\n\t\t\t\t\t(keydown.Tab)=\"switchFocusFromCopy($event)\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.COPY' | translate\"> content_copy </span>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated || translationError\"\r\n\t\t\t\t\tclass=\"tld-refresh-translation\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.REFRESH' | translate\"\r\n\t\t\t\t\t(click)=\"refresh()\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.REFRESH' | translate\"> refresh </span>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated && isLlmEnabled\"\r\n\t\t\t\t\tclass=\"tld-create-summary\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.CREATE_SUMMARY' | translate\"\r\n\t\t\t\t\t[disabled]=\"isTranslating || isSummarazing || summarizedText\"\r\n\t\t\t\t\t(click)=\"createSummary()\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<mat-icon [svgIcon]=\"'summarize'\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.CREATE_SUMMARY' | translate\"></mat-icon>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<tld-text-to-speech *ngIf=\"textToSpeechTargetSettings && firstParagraphTranslated\" [settings]=\"textToSpeechTargetSettings\"> </tld-text-to-speech>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngFor=\"let paragraph of targetParagraphs\">\r\n\t\t\t\t<tld-highlight-tree [highlight]=\"highlight\" [tree]=\"paragraph\" [selectSentence]=\"showSuggestions\"> </tld-highlight-tree>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngIf=\"isSummarazing || summarizedText\" class=\"summary-wrapper\">\r\n\t\t\t\t<p>{{ \"TLD_TRANSLATE.SUMMARY.TITLE\" | translate }}</p>\r\n\r\n\t\t\t\t<p *ngIf=\"isSummarazing\" class=\"creating-progress\">{{ \"TLD_TRANSLATE.SUMMARY.CREATING\" | translate }}<span class=\"dot-loading\">...</span></p>\r\n\r\n\t\t\t\t<p [innerHTML]=\"summarizedText\"></p>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"summarizedText\"\r\n\t\t\t\t\t[ngClass.lt-sm]=\"'summary-mobile'\"\r\n\t\t\t\t\tclass=\"summary-copy-btn\"\r\n\t\t\t\t\t(click)=\"copySummarizedText()\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.COPY' | translate\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.COPY' | translate\"> content_copy </span>\r\n\t\t\t\t</button>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngIf=\"firstParagraphTranslated\" class=\"dictionary-wrapper\">\r\n\t\t\t\t<tld-dictionary [dictionary]=\"dictionaryEntry\"></tld-dictionary>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\r\n\t\t<div *ngIf=\"urlToTranslate\" class=\"target-url-container\">\r\n\t\t\t<a [attr.href]=\"translateUrlRedirect\" target=\"_blank\" fxLayoutAlign=\"start center\" class=\"go-to-webtranslate\">\r\n\t\t\t\t{{ urlToTranslate }}\r\n\t\t\t\t<span class=\"material-icons\" color=\"accent\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.OPEN_IN_NEW'\"> open_in_new </span>\r\n\t\t\t</a>\r\n\t\t</div>\r\n\t</div>\r\n</ng-template>\r\n", styles: [".go-to-webtranslate{word-break:break-all;display:inline}.basic-padding,.target-empty,.target-translated-text{padding:1em}.source-container{border-right:1px solid #cbd2d9;padding:0;overflow:auto}.target-description{margin-top:0}.translated-source{position:relative;overflow-y:auto;overflow-x:hidden;flex:1 1 0!important;padding:1em 3.5em 1em 2em!important}.translated-source.selectable-sentence{cursor:pointer}::ng-deep .target-highlight .tld-highlight-container{padding:1em}.target-wrapper-action-buttons{position:absolute;top:0;right:0}.target-wrapper-action-buttons .tld-copy-translation,.target-wrapper-action-buttons .tld-refresh-translation,.target-wrapper-action-buttons tld-text-to-speech{display:block}.target-empty,.target-translated-text{margin:0}tld-dictionary{overflow-y:auto;flex:1 1 0!important}.source-main,.target-main{height:100%}.upload-file-text{color:var(--base-40);font-size:14px;display:inline-block;text-align:left}.file-upload-wrapper{width:100%}.file-upload-wrapper .file-upload-extensions{font-weight:400}.dictionary-wrapper{margin-top:2rem}.summary-wrapper{position:relative;padding-top:12px;border-top:1px solid var(--base-70)}.summary-wrapper p{margin-bottom:.5rem;font-weight:500}.creating-progress{color:var(--base-40)}.dot-loading{clip-path:inset(0 100% 0 0);animation:loading 1.5s steps(4) infinite}.summary-copy-btn{position:absolute;right:-53px;top:20px}.summary-mobile{right:-46px}@media (max-width: 768px){.translated-source{padding:1em 3em 1em 1em!important}}@keyframes loading{to{clip-path:inset(0 -34% 0 0)}}\n"] }]
8218
+ args: [{ selector: 'tld-translate-text', template: "<!-- NOTE. tld-source-and-target-wrapper uses multiple content projections, so might seem confusing first, but elements are displayed at their places based on tld-source-and-target-wrapper component\r\nhttps://angular.io/guide/content-projection#multi-slot-content-projection\r\n-->\r\n<tld-source-and-target-wrapper\r\n\t[textToSpeechSourceSettings]=\"textToSpeechSourceSettings\"\r\n\t[clearSourceVisible]=\"source?.length > 0\"\r\n\t(onSourceClear)=\"clearSource()\"\r\n\t[clearDisabled]=\"textareaDisabled\"\r\n\t[clearSourceTooltip]=\"'TLD_TRANSLATE.CLEAR_SOURCE_TOOLTIP'\"\r\n\t[ngClass]=\"{ 'highlight-active': highlight, 'gramcheck-active': gramCheck, 'empty-target': isEmptyTarget }\"\r\n>\r\n\t<div sourceMain class=\"source-main\" fxLayout=\"column\">\r\n\t\t<tld-translate-source [textareaDisabled]=\"textareaDisabled\" #sourceComponent fxFlex [sourceParagraphs]=\"sourceParagraphs\"></tld-translate-source>\r\n\t</div>\r\n\t<ng-container sourceActions *ngIf=\"!hideSourceActions\">\r\n\t\t<div fxLayoutAlign=\"start center\" class=\"basic-padding\" fxLayoutGap=\"1em\">\r\n\t\t\t<ng-container *ngIf=\"audioInputVisible\">\r\n\t\t\t\t<tld-dictate\r\n\t\t\t\t\t#dictate\r\n\t\t\t\t\t[configuration]=\"dictateConfig\"\r\n\t\t\t\t\t[ngClass]=\"{ 'full-width': !fileUpload }\"\r\n\t\t\t\t\t(isDictating)=\"dictateStartStop($event)\"\r\n\t\t\t\t\t(result)=\"dictateResult($event)\"\r\n\t\t\t\t\t(partialResult)=\"dictatePartialResult($event)\"\r\n\t\t\t\t\t(onError)=\"dictateError($event)\"\r\n\t\t\t\t\t[language]=\"sourceLanguage\"\r\n\t\t\t\t>\r\n\t\t\t\t</tld-dictate>\r\n\t\t\t</ng-container>\r\n\t\t\t<div *ngIf=\"fileUpload\" class=\"file-upload-wrapper\">\r\n\t\t\t\t<lib-file-upload\r\n\t\t\t\t\t(fileChange)=\"fileChange($event)\"\r\n\t\t\t\t\t[accept]=\"allowedFileTypes\"\r\n\t\t\t\t\t[maxSize]=\"maxFileUploadSize\"\r\n\t\t\t\t\t[uploadIconName]=\"uploadIconName\"\r\n\t\t\t\t\t[extendedAcceptList]=\"extendedFileTypes\"\r\n\t\t\t\t\t[multiple]=\"multipleFiles\"\r\n\t\t\t\t\t(errorEvent)=\"fileUploadError($event)\"\r\n\t\t\t\t\t[filePreviewProgress]=\"filePreviewProgress\"\r\n\t\t\t\t\t[disabled]=\"fileUploadDisabled\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"upload-file-text\">\r\n\t\t\t\t\t\t\t<span class=\"info\">\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.UPLOAD' | translate\" class=\"accent-color\"></span>\r\n\t\t\t\t\t\t\t\t<span>&nbsp;</span>\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.DRAG_AND_DROP' | translate\" fxHide.lt-sm></span>\r\n\t\t\t\t\t\t\t\t<span [innerHTML]=\"'FILE_UPLOAD.' + (multipleFiles ? 'FILES' : 'FILE') | translate\" [ngClass.lt-sm]=\"'accent-color'\"></span>\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t\r\n\t\t\t\t\t\t\t<span class=\"file-upload-extensions text-m\">\r\n\t\t\t\t\t\t\t\t(\r\n\t\t\t\t\t\t\t\t<span>{{ visibleExtensions }}. </span>\r\n\t\t\t\t\t\t\t\t<span *ngIf=\"maxSizeMB\" [innerHTML]=\"'FILE_UPLOAD.LIMITS_MB' | translate : { maxSizeMB: maxSizeMB }\"></span>\r\n\t\t\t\t\t\t\t\t)\r\n\t\t\t\t\t\t\t</span>\r\n\t\t\t\t\t</span>\r\n\t\t\t\t</lib-file-upload>\r\n\t\t\t\t<lib-open-extension-dialog *ngIf=\"showExtensionPopup\" [extensions]=\"allowedTypesWithoutDots\"> </lib-open-extension-dialog>\r\n\t\t\t</div>\r\n\t\t</div>\r\n\t</ng-container>\r\n\r\n\t<div targetMain class=\"target-main\">\r\n\t\t<ng-container *ngIf=\"isEmptyTarget; else translatedTextBlock\">\r\n\t\t\t<p *ngIf=\"showTargetPlaceholder\" class=\"description-text target-empty\" [innerHtml]=\"'TLD_TRANSLATE.TARGET_DESCRIPTION' | translate\"></p>\r\n\t\t</ng-container>\r\n\t</div>\r\n\r\n\t<ng-container targetActions>\r\n\t\t<div class=\"tld-translate-target-footer basic-padding\" *ngIf=\"showSuggestions || showProgressIndicator\">\r\n\t\t\t<tld-translate-suggest *ngIf=\"showSuggestions\" [systemId]=\"systemId\" [target]=\"targetParagraphs\" [source]=\"sourceParagraphs\"> </tld-translate-suggest>\r\n\t\t\t<progress-indicator (onClose)=\"closeProgressIndicator()\" *ngIf=\"showProgressIndicator\"></progress-indicator>\r\n\t\t</div>\r\n\t</ng-container>\r\n</tld-source-and-target-wrapper>\r\n\r\n<!-- templates used for else blocks in target container -->\r\n<ng-template #translatedTextBlock>\r\n\t<div [class.translated-source-overflow]=\"targetWrapperOverflow\" class=\"translated-source\" [class.selectable-sentence]=\"showSuggestions\">\r\n\t\t<ng-container *ngIf=\"!urlToTranslate\">\r\n\t\t\t<div class=\"target-wrapper-action-buttons\">\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated\"\r\n\t\t\t\t\tclass=\"tld-copy-translation\"\r\n\t\t\t\t\t(click)=\"copy()\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.COPY' | translate\"\r\n\t\t\t\t\t[attr.aria-describedby]=\"copyMessageId\"\r\n\t\t\t\t\t[attr.Id]=\"copyButtonId\"\r\n\t\t\t\t\t(keydown.Tab)=\"switchFocusFromCopy($event)\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.COPY' | translate\"> content_copy </span>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated || translationError\"\r\n\t\t\t\t\tclass=\"tld-refresh-translation\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.REFRESH' | translate\"\r\n\t\t\t\t\t(click)=\"refresh()\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.REFRESH' | translate\"> refresh </span>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"firstParagraphTranslated && isLlmEnabled\"\r\n\t\t\t\t\tclass=\"tld-create-summary\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.CREATE_SUMMARY' | translate\"\r\n\t\t\t\t\t[disabled]=\"isTranslating || isSummarazing || summarizedText\"\r\n\t\t\t\t\t(click)=\"createSummary()\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<mat-icon [svgIcon]=\"'summarize'\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.CREATE_SUMMARY' | translate\"></mat-icon>\r\n\t\t\t\t</button>\r\n\r\n\t\t\t\t<tld-text-to-speech *ngIf=\"textToSpeechTargetSettings && firstParagraphTranslated\" [settings]=\"textToSpeechTargetSettings\"> </tld-text-to-speech>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngFor=\"let paragraph of targetParagraphs\">\r\n\t\t\t\t<tld-highlight-tree [highlight]=\"highlight\" [tree]=\"paragraph\" [selectSentence]=\"showSuggestions\"> </tld-highlight-tree>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngIf=\"isSummarazing || summarizedText\" class=\"summary-wrapper\">\r\n\t\t\t\t<p>{{ \"TLD_TRANSLATE.SUMMARY.TITLE\" | translate }}</p>\r\n\r\n\t\t\t\t<p *ngIf=\"isSummarazing\" class=\"creating-progress\">{{ \"TLD_TRANSLATE.SUMMARY.CREATING\" | translate }}<span class=\"dot-loading\">...</span></p>\r\n\r\n\t\t\t\t<p [innerHTML]=\"summarizedText\"></p>\r\n\r\n\t\t\t\t<button\r\n\t\t\t\t\tmat-icon-button\r\n\t\t\t\t\t*ngIf=\"summarizedText\"\r\n\t\t\t\t\t[ngClass.lt-sm]=\"'summary-mobile'\"\r\n\t\t\t\t\tclass=\"summary-copy-btn\"\r\n\t\t\t\t\t(click)=\"copySummarizedText()\"\r\n\t\t\t\t\t[matTooltip]=\"'TOOLTIPS.COPY' | translate\"\r\n\t\t\t\t>\r\n\t\t\t\t\t<span class=\"material-icons\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.COPY' | translate\"> content_copy </span>\r\n\t\t\t\t</button>\r\n\t\t\t</div>\r\n\r\n\t\t\t<div *ngIf=\"firstParagraphTranslated\" class=\"dictionary-wrapper\">\r\n\t\t\t\t<tld-dictionary [dictionary]=\"dictionaryEntry\"></tld-dictionary>\r\n\t\t\t</div>\r\n\t\t</ng-container>\r\n\r\n\t\t<div *ngIf=\"urlToTranslate\" class=\"target-url-container\">\r\n\t\t\t<a [attr.href]=\"translateUrlRedirect\" target=\"_blank\" fxLayoutAlign=\"start center\" class=\"go-to-webtranslate\">\r\n\t\t\t\t{{ urlToTranslate }}\r\n\t\t\t\t<span class=\"material-icons\" color=\"accent\" aria-hidden=\"false\" [attr.aria-label]=\"'ARIA_LABELS.OPEN_IN_NEW'\"> open_in_new </span>\r\n\t\t\t</a>\r\n\t\t</div>\r\n\t</div>\r\n</ng-template>\r\n", styles: [".go-to-webtranslate{word-break:break-all;display:inline}.basic-padding,.target-empty,.target-translated-text{padding:18px}.source-container{border-right:1px solid #cbd2d9;padding:0;overflow:auto}.target-description{margin-top:0}.translated-source{position:relative;overflow-y:auto;overflow-x:hidden;flex:1 1 0!important;min-height:-webkit-fill-available;padding:18px 48px 18px 18px!important}.translated-source.selectable-sentence{cursor:pointer}::ng-deep .target-highlight .tld-highlight-container{padding:18px}.target-wrapper-action-buttons{position:absolute;top:3px;right:3px}.target-wrapper-action-buttons .tld-copy-translation,.target-wrapper-action-buttons .tld-refresh-translation,.target-wrapper-action-buttons tld-text-to-speech{display:block}.target-empty,.target-translated-text{margin:0}tld-dictionary{overflow-y:auto;flex:1 1 0!important}.source-main,.target-main{height:100%}.upload-file-text{color:var(--base-40);font-size:14px;display:inline-block;text-align:left}.file-upload-wrapper{width:100%}.file-upload-wrapper .file-upload-extensions{font-weight:400}.dictionary-wrapper{margin-top:2rem}.summary-wrapper{position:relative;padding-top:12px;border-top:1px solid var(--base-70)}.summary-wrapper p{margin-bottom:.5rem;font-weight:500}.creating-progress{color:var(--base-40)}.dot-loading{clip-path:inset(0 100% 0 0);animation:loading 1.5s steps(4) infinite}.summary-copy-btn{position:absolute;right:-45px;top:20px}.summary-mobile{right:-46px}@keyframes loading{to{clip-path:inset(0 -34% 0 0)}}\n"] }]
8212
8219
  }], ctorParameters: () => [{ type: TldTranslateTextService }, { type: i2$3.Clipboard }, { type: i5.AlertService }, { type: TldTranslateConfigService }, { type: TldScrollService }, { type: TldTranslateSystemManagementService }, { type: AudioRecordService }, { type: TldVoiceInputService }, { type: TldTranslateFileService }, { type: i8$1.BreakpointObserver }, { type: i5$2.LLMService }], propDecorators: { sourceComponent: [{
8213
8220
  type: ViewChild,
8214
8221
  args: ["sourceComponent"]
@@ -8749,11 +8756,11 @@ class TranslationSystemPickerComponent {
8749
8756
  });
8750
8757
  }
8751
8758
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TranslationSystemPickerComponent, deps: [{ token: TranslationSystemPickerService }, { token: TldTranslateSystemManagementService }, { token: TldTranslateFileService }, { token: TldTranslateTextService }], target: i0.ɵɵFactoryTarget.Component });
8752
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TranslationSystemPickerComponent, selector: "tld-translation-system-picker", inputs: { isCollectionsActivated: "isCollectionsActivated" }, ngImport: i0, template: "<div fxFlex fxLayout=\"row\">\r\n <ng-container *ngIf=\"isDataLoaded\">\r\n <div fxFlex fxLayoutAlign=\"space-between center\" fxLayoutAlign.lt-sm=\"space-evenly center\">\r\n <ng-container\r\n *ngTemplateOutlet=\"languageDropdownTrigger; context: { language: sourceLanguage, localizationKey: 'SYSTEM_PICKER.SOURCE', isOpened: isSourceOpened, isSource: true, ariaLabelCode: sourceAriaLabel }\">\r\n </ng-container>\r\n <button [disabled]=\"!canSwap\" class=\"swap-languages-button\" mat-icon-button (click)=\"swap()\"\r\n aria-label=\"swap languages\" color=\"primary\" matTooltip=\"{{'TOOLTIPS.SWAP_LANGUAGES' | translate}}\">\r\n <span class=\"material-icons\" aria-hidden=\"false\"\r\n [attr.aria-label]=\"'ARIA_LABELS.SWAP_LANGUAGES' | translate\">swap_horiz</span>\r\n </button>\r\n </div>\r\n <div fxFlex fxLayoutAlign=\"space-between center\" fxLayoutAlign.lt-sm=\"space-evenly center\">\r\n <ng-container\r\n *ngTemplateOutlet=\"languageDropdownTrigger; context: { language: targetLanguage, localizationKey: 'SYSTEM_PICKER.TARGET', isOpened: isTargetOpened, isSource: false, ariaLabelCode: targetAriaLabel}\">\r\n </ng-container>\r\n\r\n <div fxFlex fxLayoutAlign=\"end center\">\r\n <div *ngIf=\"collectionsVisible\" #collectionWrapper class=\"terminology-wrapper\">\r\n <lib-terminology [system]=\"system\"></lib-terminology>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<ng-template #languageName let-language=\"language\" let-showDomain=\"showDomain\" let-detectedLanguage=\"detectedLanguage\">\r\n <span>{{ (detectedLanguage && !showDomain ? detectedLanguage : language.lang) | languageTranslate }}</span>\r\n <span fxHide.lt-md *ngIf=\"detectedLanguage && !showDomain\"> - {{'SYSTEM_PICKER.DETECTED' | translate}}</span>\r\n <ng-container *ngIf=\"showDomain && domainLength>1\">\r\n <span class=\"domain\">({{('DOMAINS.'+(activeDomainLocalizationKey | uppercase)) | translate: {default: activeDomainKey | titlecase} }})</span>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #openedDropdown let-localizationKey=\"localizationKey\">\r\n {{localizationKey | translate}}\r\n</ng-template>\r\n\r\n<!--Template for language dropdown trigger. Same as for target and source with different params-->\r\n<ng-template #languageDropdownTrigger let-language=\"language\" let-isOpened=\"isOpened\" let-placeholder=\"localizationKey\"\r\n let-isSource=\"isSource\" let-ariaLabelCode=\"ariaLabelCode\">\r\n <lib-open-close-button [disabled]=\"isFileTranslating\" class=\"system-picker-button\" [ngClass]=\"isSource? 'source': 'target'\"\r\n [ngClass.lt-sm]=\"'system-picker-button-mobile'\" (click)=\"isSource ? sourceClick($event) : targetClick($event)\"\r\n [disableFocusOnAction]=\"true\" [isOpened]=\"isOpened\" [class.opened]=\"isOpened\" [ariaLabelCode]=\"ariaLabelCode\">\r\n <span [ngClass.lt-sm]=\"'mobile-domain-container'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"isOpened && isSource || isOpened && !isSource && !isTargetReselected ? openedDropdown : languageName; context: { language: language, localizationKey: placeholder, showDomain: !isSource, detectedLanguage: system.detectedLanguage }\">\r\n </ng-container>\r\n </span>\r\n </lib-open-close-button>\r\n</ng-template>\r\n", styles: [":host{display:flex}.swap-languages-button{color:var(--base-30)!important}.source{margin-left:.3em}.system-picker-button.system-picker-button-mobile{margin-left:.2em}.target{margin-left:1.5em}:host ::ng-deep .open-close-button-content{color:var(--base-30)}.mobile-domain-container{display:flex}.mobile-domain-container .domain{display:none}.domain{display:inline-block;max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}.terminology-wrapper{margin-right:.3rem}:host ::ng-deep .system-picker-button-mobile{display:flex;align-items:center;max-height:46px;height:100%;max-width:120px;width:100%;background-color:var(--base-95)!important;border-radius:8px}:host ::ng-deep .system-picker-button-mobile span{font-size:12px;text-align:center;line-height:16px}:host ::ng-deep .system-picker-button-mobile .material-icons{display:none!important}:host ::ng-deep .opened .open-close-button-content,.opened button{color:var(--accent)!important}:host ::ng-deep .open-close-button-content{white-space:nowrap;overflow:hidden}:host ::ng-deep .system-picker-button-mobile span{white-space:wrap;overflow:hidden;text-align:center;max-height:46px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5$1.DefaultShowHideDirective, selector: " [fxShow], [fxShow.print], [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl], [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl], [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg], [fxHide], [fxHide.print], [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl], [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl], [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "directive", type: i5$1.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: i5.OpenCloseButtonComponent, selector: "lib-open-close-button", inputs: ["disableFocusOnAction", "disabled", "isIcon", "ariaLabelCode", "isOpened"] }, { kind: "component", type: i5.TerminologyComponent, selector: "lib-terminology", inputs: ["selectedCollectionId", "system", "disabled", "storeSelectedInLocalStorage", "setSelectedFromLocalStorage", "showMenuIconOnMobile"], outputs: ["glossarySelectEvent", "menuToggleEvent"] }, { kind: "directive", type: i2$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "pipe", type: i2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i2.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i5.LanguageTranslatePipe, name: "languageTranslate" }] });
8759
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TranslationSystemPickerComponent, selector: "tld-translation-system-picker", inputs: { isCollectionsActivated: "isCollectionsActivated" }, ngImport: i0, template: "<div fxFlex fxLayout=\"row\">\r\n <ng-container *ngIf=\"isDataLoaded\">\r\n <div fxFlex fxLayoutAlign=\"space-between center\" fxLayoutAlign.lt-sm=\"space-evenly center\">\r\n <ng-container\r\n *ngTemplateOutlet=\"languageDropdownTrigger; context: { language: sourceLanguage, localizationKey: 'SYSTEM_PICKER.SOURCE', isOpened: isSourceOpened, isSource: true, ariaLabelCode: sourceAriaLabel }\">\r\n </ng-container>\r\n <button [disabled]=\"!canSwap\" class=\"swap-languages-button\" mat-icon-button (click)=\"swap()\"\r\n aria-label=\"swap languages\" color=\"primary\" matTooltip=\"{{'TOOLTIPS.SWAP_LANGUAGES' | translate}}\">\r\n <span class=\"material-icons\" aria-hidden=\"false\"\r\n [attr.aria-label]=\"'ARIA_LABELS.SWAP_LANGUAGES' | translate\">swap_horiz</span>\r\n </button>\r\n </div>\r\n <div fxFlex fxLayoutAlign=\"space-between center\" fxLayoutAlign.lt-sm=\"space-evenly center\">\r\n <ng-container\r\n *ngTemplateOutlet=\"languageDropdownTrigger; context: { language: targetLanguage, localizationKey: 'SYSTEM_PICKER.TARGET', isOpened: isTargetOpened, isSource: false, ariaLabelCode: targetAriaLabel}\">\r\n </ng-container>\r\n\r\n <div fxFlex fxLayoutAlign=\"end center\">\r\n <div *ngIf=\"collectionsVisible\" #collectionWrapper class=\"terminology-wrapper\">\r\n <lib-terminology [system]=\"system\"></lib-terminology>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<ng-template #languageName let-language=\"language\" let-showDomain=\"showDomain\" let-detectedLanguage=\"detectedLanguage\">\r\n <span>{{ (detectedLanguage && !showDomain ? detectedLanguage : language.lang) | languageTranslate }}</span>\r\n <span fxHide.lt-md *ngIf=\"detectedLanguage && !showDomain\"> - {{'SYSTEM_PICKER.DETECTED' | translate}}</span>\r\n <ng-container *ngIf=\"showDomain && domainLength>1\">\r\n <span class=\"domain\">({{('DOMAINS.'+(activeDomainLocalizationKey | uppercase)) | translate: {default: activeDomainKey | titlecase} }})</span>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #openedDropdown let-localizationKey=\"localizationKey\">\r\n {{localizationKey | translate}}\r\n</ng-template>\r\n\r\n<!--Template for language dropdown trigger. Same as for target and source with different params-->\r\n<ng-template #languageDropdownTrigger let-language=\"language\" let-isOpened=\"isOpened\" let-placeholder=\"localizationKey\"\r\n let-isSource=\"isSource\" let-ariaLabelCode=\"ariaLabelCode\">\r\n <lib-open-close-button [disabled]=\"isFileTranslating\" class=\"system-picker-button\" [ngClass]=\"isSource? 'source': 'target'\"\r\n [ngClass.lt-sm]=\"'system-picker-button-mobile'\" (click)=\"isSource ? sourceClick($event) : targetClick($event)\"\r\n [disableFocusOnAction]=\"true\" [isOpened]=\"isOpened\" [class.opened]=\"isOpened\" [ariaLabelCode]=\"ariaLabelCode\">\r\n <span [ngClass.lt-sm]=\"'mobile-domain-container'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"isOpened && isSource || isOpened && !isSource && !isTargetReselected ? openedDropdown : languageName; context: { language: language, localizationKey: placeholder, showDomain: !isSource, detectedLanguage: system.detectedLanguage }\">\r\n </ng-container>\r\n </span>\r\n </lib-open-close-button>\r\n</ng-template>\r\n", styles: [":host{display:flex}.swap-languages-button{color:var(--base-30)!important}.source{margin-left:.3em}.system-picker-button.system-picker-button-mobile{margin-left:.2em}.target{margin-left:8px}:host ::ng-deep .open-close-button-content{color:var(--base-30)}.mobile-domain-container{display:flex}.mobile-domain-container .domain{display:none}.domain{display:inline-block;max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}.terminology-wrapper{margin-right:.3rem}:host ::ng-deep .system-picker-button-mobile{display:flex;align-items:center;max-height:46px;height:100%;max-width:120px;width:100%;background-color:var(--base-95)!important;border-radius:8px}:host ::ng-deep .system-picker-button-mobile span{font-size:12px;text-align:center;line-height:16px}:host ::ng-deep .system-picker-button-mobile .material-icons{display:none!important}:host ::ng-deep .opened .open-close-button-content,.opened button{color:var(--accent)!important}:host ::ng-deep .open-close-button-content{white-space:nowrap;overflow:hidden}:host ::ng-deep .system-picker-button-mobile span{white-space:wrap;overflow:hidden;text-align:center;max-height:46px}\n"], dependencies: [{ kind: "directive", type: i2.NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i3.DefaultLayoutAlignDirective, selector: " [fxLayoutAlign], [fxLayoutAlign.xs], [fxLayoutAlign.sm], [fxLayoutAlign.md], [fxLayoutAlign.lg], [fxLayoutAlign.xl], [fxLayoutAlign.lt-sm], [fxLayoutAlign.lt-md], [fxLayoutAlign.lt-lg], [fxLayoutAlign.lt-xl], [fxLayoutAlign.gt-xs], [fxLayoutAlign.gt-sm], [fxLayoutAlign.gt-md], [fxLayoutAlign.gt-lg]", inputs: ["fxLayoutAlign", "fxLayoutAlign.xs", "fxLayoutAlign.sm", "fxLayoutAlign.md", "fxLayoutAlign.lg", "fxLayoutAlign.xl", "fxLayoutAlign.lt-sm", "fxLayoutAlign.lt-md", "fxLayoutAlign.lt-lg", "fxLayoutAlign.lt-xl", "fxLayoutAlign.gt-xs", "fxLayoutAlign.gt-sm", "fxLayoutAlign.gt-md", "fxLayoutAlign.gt-lg"] }, { kind: "directive", type: i3.DefaultFlexDirective, selector: " [fxFlex], [fxFlex.xs], [fxFlex.sm], [fxFlex.md], [fxFlex.lg], [fxFlex.xl], [fxFlex.lt-sm], [fxFlex.lt-md], [fxFlex.lt-lg], [fxFlex.lt-xl], [fxFlex.gt-xs], [fxFlex.gt-sm], [fxFlex.gt-md], [fxFlex.gt-lg]", inputs: ["fxFlex", "fxFlex.xs", "fxFlex.sm", "fxFlex.md", "fxFlex.lg", "fxFlex.xl", "fxFlex.lt-sm", "fxFlex.lt-md", "fxFlex.lt-lg", "fxFlex.lt-xl", "fxFlex.gt-xs", "fxFlex.gt-sm", "fxFlex.gt-md", "fxFlex.gt-lg"] }, { kind: "directive", type: i5$1.DefaultShowHideDirective, selector: " [fxShow], [fxShow.print], [fxShow.xs], [fxShow.sm], [fxShow.md], [fxShow.lg], [fxShow.xl], [fxShow.lt-sm], [fxShow.lt-md], [fxShow.lt-lg], [fxShow.lt-xl], [fxShow.gt-xs], [fxShow.gt-sm], [fxShow.gt-md], [fxShow.gt-lg], [fxHide], [fxHide.print], [fxHide.xs], [fxHide.sm], [fxHide.md], [fxHide.lg], [fxHide.xl], [fxHide.lt-sm], [fxHide.lt-md], [fxHide.lt-lg], [fxHide.lt-xl], [fxHide.gt-xs], [fxHide.gt-sm], [fxHide.gt-md], [fxHide.gt-lg]", inputs: ["fxShow", "fxShow.print", "fxShow.xs", "fxShow.sm", "fxShow.md", "fxShow.lg", "fxShow.xl", "fxShow.lt-sm", "fxShow.lt-md", "fxShow.lt-lg", "fxShow.lt-xl", "fxShow.gt-xs", "fxShow.gt-sm", "fxShow.gt-md", "fxShow.gt-lg", "fxHide", "fxHide.print", "fxHide.xs", "fxHide.sm", "fxHide.md", "fxHide.lg", "fxHide.xl", "fxHide.lt-sm", "fxHide.lt-md", "fxHide.lt-lg", "fxHide.lt-xl", "fxHide.gt-xs", "fxHide.gt-sm", "fxHide.gt-md", "fxHide.gt-lg"] }, { kind: "directive", type: i5$1.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: i5.OpenCloseButtonComponent, selector: "lib-open-close-button", inputs: ["disableFocusOnAction", "disabled", "isIcon", "ariaLabelCode", "isOpened"] }, { kind: "component", type: i5.TerminologyComponent, selector: "lib-terminology", inputs: ["selectedCollectionId", "system", "disabled", "storeSelectedInLocalStorage", "setSelectedFromLocalStorage", "showMenuIconOnMobile"], outputs: ["glossarySelectEvent", "menuToggleEvent"] }, { kind: "directive", type: i2$1.MatTooltip, selector: "[matTooltip]", inputs: ["matTooltipPosition", "matTooltipPositionAtOrigin", "matTooltipDisabled", "matTooltipShowDelay", "matTooltipHideDelay", "matTooltipTouchGestures", "matTooltip", "matTooltipClass"], exportAs: ["matTooltip"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "pipe", type: i2.UpperCasePipe, name: "uppercase" }, { kind: "pipe", type: i2.TitleCasePipe, name: "titlecase" }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }, { kind: "pipe", type: i5.LanguageTranslatePipe, name: "languageTranslate" }] });
8753
8760
  }
8754
8761
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TranslationSystemPickerComponent, decorators: [{
8755
8762
  type: Component,
8756
- args: [{ selector: 'tld-translation-system-picker', template: "<div fxFlex fxLayout=\"row\">\r\n <ng-container *ngIf=\"isDataLoaded\">\r\n <div fxFlex fxLayoutAlign=\"space-between center\" fxLayoutAlign.lt-sm=\"space-evenly center\">\r\n <ng-container\r\n *ngTemplateOutlet=\"languageDropdownTrigger; context: { language: sourceLanguage, localizationKey: 'SYSTEM_PICKER.SOURCE', isOpened: isSourceOpened, isSource: true, ariaLabelCode: sourceAriaLabel }\">\r\n </ng-container>\r\n <button [disabled]=\"!canSwap\" class=\"swap-languages-button\" mat-icon-button (click)=\"swap()\"\r\n aria-label=\"swap languages\" color=\"primary\" matTooltip=\"{{'TOOLTIPS.SWAP_LANGUAGES' | translate}}\">\r\n <span class=\"material-icons\" aria-hidden=\"false\"\r\n [attr.aria-label]=\"'ARIA_LABELS.SWAP_LANGUAGES' | translate\">swap_horiz</span>\r\n </button>\r\n </div>\r\n <div fxFlex fxLayoutAlign=\"space-between center\" fxLayoutAlign.lt-sm=\"space-evenly center\">\r\n <ng-container\r\n *ngTemplateOutlet=\"languageDropdownTrigger; context: { language: targetLanguage, localizationKey: 'SYSTEM_PICKER.TARGET', isOpened: isTargetOpened, isSource: false, ariaLabelCode: targetAriaLabel}\">\r\n </ng-container>\r\n\r\n <div fxFlex fxLayoutAlign=\"end center\">\r\n <div *ngIf=\"collectionsVisible\" #collectionWrapper class=\"terminology-wrapper\">\r\n <lib-terminology [system]=\"system\"></lib-terminology>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<ng-template #languageName let-language=\"language\" let-showDomain=\"showDomain\" let-detectedLanguage=\"detectedLanguage\">\r\n <span>{{ (detectedLanguage && !showDomain ? detectedLanguage : language.lang) | languageTranslate }}</span>\r\n <span fxHide.lt-md *ngIf=\"detectedLanguage && !showDomain\"> - {{'SYSTEM_PICKER.DETECTED' | translate}}</span>\r\n <ng-container *ngIf=\"showDomain && domainLength>1\">\r\n <span class=\"domain\">({{('DOMAINS.'+(activeDomainLocalizationKey | uppercase)) | translate: {default: activeDomainKey | titlecase} }})</span>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #openedDropdown let-localizationKey=\"localizationKey\">\r\n {{localizationKey | translate}}\r\n</ng-template>\r\n\r\n<!--Template for language dropdown trigger. Same as for target and source with different params-->\r\n<ng-template #languageDropdownTrigger let-language=\"language\" let-isOpened=\"isOpened\" let-placeholder=\"localizationKey\"\r\n let-isSource=\"isSource\" let-ariaLabelCode=\"ariaLabelCode\">\r\n <lib-open-close-button [disabled]=\"isFileTranslating\" class=\"system-picker-button\" [ngClass]=\"isSource? 'source': 'target'\"\r\n [ngClass.lt-sm]=\"'system-picker-button-mobile'\" (click)=\"isSource ? sourceClick($event) : targetClick($event)\"\r\n [disableFocusOnAction]=\"true\" [isOpened]=\"isOpened\" [class.opened]=\"isOpened\" [ariaLabelCode]=\"ariaLabelCode\">\r\n <span [ngClass.lt-sm]=\"'mobile-domain-container'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"isOpened && isSource || isOpened && !isSource && !isTargetReselected ? openedDropdown : languageName; context: { language: language, localizationKey: placeholder, showDomain: !isSource, detectedLanguage: system.detectedLanguage }\">\r\n </ng-container>\r\n </span>\r\n </lib-open-close-button>\r\n</ng-template>\r\n", styles: [":host{display:flex}.swap-languages-button{color:var(--base-30)!important}.source{margin-left:.3em}.system-picker-button.system-picker-button-mobile{margin-left:.2em}.target{margin-left:1.5em}:host ::ng-deep .open-close-button-content{color:var(--base-30)}.mobile-domain-container{display:flex}.mobile-domain-container .domain{display:none}.domain{display:inline-block;max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}.terminology-wrapper{margin-right:.3rem}:host ::ng-deep .system-picker-button-mobile{display:flex;align-items:center;max-height:46px;height:100%;max-width:120px;width:100%;background-color:var(--base-95)!important;border-radius:8px}:host ::ng-deep .system-picker-button-mobile span{font-size:12px;text-align:center;line-height:16px}:host ::ng-deep .system-picker-button-mobile .material-icons{display:none!important}:host ::ng-deep .opened .open-close-button-content,.opened button{color:var(--accent)!important}:host ::ng-deep .open-close-button-content{white-space:nowrap;overflow:hidden}:host ::ng-deep .system-picker-button-mobile span{white-space:wrap;overflow:hidden;text-align:center;max-height:46px}\n"] }]
8763
+ args: [{ selector: 'tld-translation-system-picker', template: "<div fxFlex fxLayout=\"row\">\r\n <ng-container *ngIf=\"isDataLoaded\">\r\n <div fxFlex fxLayoutAlign=\"space-between center\" fxLayoutAlign.lt-sm=\"space-evenly center\">\r\n <ng-container\r\n *ngTemplateOutlet=\"languageDropdownTrigger; context: { language: sourceLanguage, localizationKey: 'SYSTEM_PICKER.SOURCE', isOpened: isSourceOpened, isSource: true, ariaLabelCode: sourceAriaLabel }\">\r\n </ng-container>\r\n <button [disabled]=\"!canSwap\" class=\"swap-languages-button\" mat-icon-button (click)=\"swap()\"\r\n aria-label=\"swap languages\" color=\"primary\" matTooltip=\"{{'TOOLTIPS.SWAP_LANGUAGES' | translate}}\">\r\n <span class=\"material-icons\" aria-hidden=\"false\"\r\n [attr.aria-label]=\"'ARIA_LABELS.SWAP_LANGUAGES' | translate\">swap_horiz</span>\r\n </button>\r\n </div>\r\n <div fxFlex fxLayoutAlign=\"space-between center\" fxLayoutAlign.lt-sm=\"space-evenly center\">\r\n <ng-container\r\n *ngTemplateOutlet=\"languageDropdownTrigger; context: { language: targetLanguage, localizationKey: 'SYSTEM_PICKER.TARGET', isOpened: isTargetOpened, isSource: false, ariaLabelCode: targetAriaLabel}\">\r\n </ng-container>\r\n\r\n <div fxFlex fxLayoutAlign=\"end center\">\r\n <div *ngIf=\"collectionsVisible\" #collectionWrapper class=\"terminology-wrapper\">\r\n <lib-terminology [system]=\"system\"></lib-terminology>\r\n </div>\r\n </div>\r\n </div>\r\n </ng-container>\r\n</div>\r\n\r\n<ng-template #languageName let-language=\"language\" let-showDomain=\"showDomain\" let-detectedLanguage=\"detectedLanguage\">\r\n <span>{{ (detectedLanguage && !showDomain ? detectedLanguage : language.lang) | languageTranslate }}</span>\r\n <span fxHide.lt-md *ngIf=\"detectedLanguage && !showDomain\"> - {{'SYSTEM_PICKER.DETECTED' | translate}}</span>\r\n <ng-container *ngIf=\"showDomain && domainLength>1\">\r\n <span class=\"domain\">({{('DOMAINS.'+(activeDomainLocalizationKey | uppercase)) | translate: {default: activeDomainKey | titlecase} }})</span>\r\n </ng-container>\r\n</ng-template>\r\n\r\n<ng-template #openedDropdown let-localizationKey=\"localizationKey\">\r\n {{localizationKey | translate}}\r\n</ng-template>\r\n\r\n<!--Template for language dropdown trigger. Same as for target and source with different params-->\r\n<ng-template #languageDropdownTrigger let-language=\"language\" let-isOpened=\"isOpened\" let-placeholder=\"localizationKey\"\r\n let-isSource=\"isSource\" let-ariaLabelCode=\"ariaLabelCode\">\r\n <lib-open-close-button [disabled]=\"isFileTranslating\" class=\"system-picker-button\" [ngClass]=\"isSource? 'source': 'target'\"\r\n [ngClass.lt-sm]=\"'system-picker-button-mobile'\" (click)=\"isSource ? sourceClick($event) : targetClick($event)\"\r\n [disableFocusOnAction]=\"true\" [isOpened]=\"isOpened\" [class.opened]=\"isOpened\" [ariaLabelCode]=\"ariaLabelCode\">\r\n <span [ngClass.lt-sm]=\"'mobile-domain-container'\">\r\n <ng-container\r\n *ngTemplateOutlet=\"isOpened && isSource || isOpened && !isSource && !isTargetReselected ? openedDropdown : languageName; context: { language: language, localizationKey: placeholder, showDomain: !isSource, detectedLanguage: system.detectedLanguage }\">\r\n </ng-container>\r\n </span>\r\n </lib-open-close-button>\r\n</ng-template>\r\n", styles: [":host{display:flex}.swap-languages-button{color:var(--base-30)!important}.source{margin-left:.3em}.system-picker-button.system-picker-button-mobile{margin-left:.2em}.target{margin-left:8px}:host ::ng-deep .open-close-button-content{color:var(--base-30)}.mobile-domain-container{display:flex}.mobile-domain-container .domain{display:none}.domain{display:inline-block;max-width:250px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap;vertical-align:bottom}.terminology-wrapper{margin-right:.3rem}:host ::ng-deep .system-picker-button-mobile{display:flex;align-items:center;max-height:46px;height:100%;max-width:120px;width:100%;background-color:var(--base-95)!important;border-radius:8px}:host ::ng-deep .system-picker-button-mobile span{font-size:12px;text-align:center;line-height:16px}:host ::ng-deep .system-picker-button-mobile .material-icons{display:none!important}:host ::ng-deep .opened .open-close-button-content,.opened button{color:var(--accent)!important}:host ::ng-deep .open-close-button-content{white-space:nowrap;overflow:hidden}:host ::ng-deep .system-picker-button-mobile span{white-space:wrap;overflow:hidden;text-align:center;max-height:46px}\n"] }]
8757
8764
  }], ctorParameters: () => [{ type: TranslationSystemPickerService }, { type: TldTranslateSystemManagementService }, { type: TldTranslateFileService }, { type: TldTranslateTextService }], propDecorators: { isCollectionsActivated: [{
8758
8765
  type: Input
8759
8766
  }] } });
@@ -8845,16 +8852,19 @@ class TranslationSystemPickerSystemListComponent {
8845
8852
  icon;
8846
8853
  isRecentSystemList;
8847
8854
  isDomainList;
8855
+ isMobile;
8848
8856
  clicked = new EventEmitter();
8857
+ showAllDomains = false;
8858
+ expandableDomainCount = 4;
8849
8859
  changeSystem(system) {
8850
8860
  this.clicked.emit(system);
8851
8861
  }
8852
8862
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TranslationSystemPickerSystemListComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
8853
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TranslationSystemPickerSystemListComponent, selector: "tld-translation-system-picker-system-list", inputs: { systems: "systems", titleKey: "titleKey", activeId: "activeId", showTitle: "showTitle", icon: "icon", isRecentSystemList: "isRecentSystemList", isDomainList: "isDomainList" }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<div [ngClass.lt-sm]=\"'mobile'\">\r\n <div class=\"span-container\" *ngIf=\"showTitle\">\r\n <mat-icon *ngIf=\"icon\">{{icon}}</mat-icon>\r\n <span class=\"text-l-semi-bold\" [ngClass.lt-sm]=\"'text-m-semi-bold'\">{{titleKey | translate}}</span>\r\n </div>\r\n <translation-system-picker-button [active]=\"activeId === system.languageId\" [isDomainList]=\"isDomainList\" [isRecentSystemList]=\"isRecentSystemList\" (onClick)=\"changeSystem(system)\"\r\n *ngFor=\"let system of systems\">\r\n {{system.displayName}}\r\n </translation-system-picker-button>\r\n</div>\r\n", styles: [":host{display:inline-block}:host .span-container{display:flex;align-items:center;margin:1rem 0 1.25rem}:host .system-picker-button{width:100%;text-align:left}:host .system-picker-button:not(.active){color:var(--base-10)}:host .mobile .span-container{margin:0 0 .75rem}:host ::ng-deep .system-picker-button{white-space:nowrap}mat-icon{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5$1.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: TranslationSystemPickerButtonComponent, selector: "translation-system-picker-button", inputs: ["active", "isRecentSystemList", "isDomainList", "tooltip"], outputs: ["onClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
8863
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: TranslationSystemPickerSystemListComponent, selector: "tld-translation-system-picker-system-list", inputs: { systems: "systems", titleKey: "titleKey", activeId: "activeId", showTitle: "showTitle", icon: "icon", isRecentSystemList: "isRecentSystemList", isDomainList: "isDomainList", isMobile: "isMobile" }, outputs: { clicked: "clicked" }, ngImport: i0, template: "<div [ngClass.lt-sm]=\"'mobile'\">\r\n\t<div class=\"span-container\" *ngIf=\"showTitle\">\r\n\t\t<mat-icon *ngIf=\"icon\">{{ icon }}</mat-icon>\r\n\t\t<span class=\"text-l-semi-bold\" [ngClass.lt-sm]=\"'text-m-semi-bold'\">{{ titleKey | translate }}</span>\r\n\t</div>\r\n\r\n\t@for (system of systems; let i = $index; track i) { \r\n @if (!isDomainList || (systems.length <= expandableDomainCount || (!isMobile || showAllDomains) || i < expandableDomainCount)) {\r\n <translation-system-picker-button\r\n [active]=\"activeId === system.languageId\"\r\n [isDomainList]=\"isDomainList\"\r\n [isRecentSystemList]=\"isRecentSystemList\"\r\n (onClick)=\"changeSystem(system)\"\r\n >\r\n {{ system.displayName }}\r\n </translation-system-picker-button>\r\n\t } \r\n } \r\n \r\n @if (isMobile && isDomainList && systems.length > expandableDomainCount) {\r\n <button mat-button color=\"accent\" (click)=\"showAllDomains = !showAllDomains\">\r\n {{ (showAllDomains ? \"SYSTEM_PICKER.HIDE_ALL\" : \"SYSTEM_PICKER.SHOW_ALL\") | translate }}\r\n </button>\r\n }\r\n</div>\r\n", styles: [":host{display:inline-block}:host .span-container{display:flex;align-items:center;margin:1rem 0 1.25rem}:host .system-picker-button{width:100%;text-align:left}:host .system-picker-button:not(.active){color:var(--base-10)}:host .mobile .span-container{margin:0 0 .75rem}:host ::ng-deep .system-picker-button{white-space:nowrap}mat-icon{margin-right:5px}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i5$1.DefaultClassDirective, selector: " [ngClass], [ngClass.xs], [ngClass.sm], [ngClass.md], [ngClass.lg], [ngClass.xl], [ngClass.lt-sm], [ngClass.lt-md], [ngClass.lt-lg], [ngClass.lt-xl], [ngClass.gt-xs], [ngClass.gt-sm], [ngClass.gt-md], [ngClass.gt-lg]", inputs: ["ngClass", "ngClass.xs", "ngClass.sm", "ngClass.md", "ngClass.lg", "ngClass.xl", "ngClass.lt-sm", "ngClass.lt-md", "ngClass.lt-lg", "ngClass.lt-xl", "ngClass.gt-xs", "ngClass.gt-sm", "ngClass.gt-md", "ngClass.gt-lg"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8.MatButton, selector: " button[mat-button], button[mat-raised-button], button[mat-flat-button], button[mat-stroked-button] ", exportAs: ["matButton"] }, { kind: "component", type: TranslationSystemPickerButtonComponent, selector: "translation-system-picker-button", inputs: ["active", "isRecentSystemList", "isDomainList", "tooltip"], outputs: ["onClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
8854
8864
  }
8855
8865
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TranslationSystemPickerSystemListComponent, decorators: [{
8856
8866
  type: Component,
8857
- args: [{ selector: 'tld-translation-system-picker-system-list', template: "<div [ngClass.lt-sm]=\"'mobile'\">\r\n <div class=\"span-container\" *ngIf=\"showTitle\">\r\n <mat-icon *ngIf=\"icon\">{{icon}}</mat-icon>\r\n <span class=\"text-l-semi-bold\" [ngClass.lt-sm]=\"'text-m-semi-bold'\">{{titleKey | translate}}</span>\r\n </div>\r\n <translation-system-picker-button [active]=\"activeId === system.languageId\" [isDomainList]=\"isDomainList\" [isRecentSystemList]=\"isRecentSystemList\" (onClick)=\"changeSystem(system)\"\r\n *ngFor=\"let system of systems\">\r\n {{system.displayName}}\r\n </translation-system-picker-button>\r\n</div>\r\n", styles: [":host{display:inline-block}:host .span-container{display:flex;align-items:center;margin:1rem 0 1.25rem}:host .system-picker-button{width:100%;text-align:left}:host .system-picker-button:not(.active){color:var(--base-10)}:host .mobile .span-container{margin:0 0 .75rem}:host ::ng-deep .system-picker-button{white-space:nowrap}mat-icon{margin-right:5px}\n"] }]
8867
+ args: [{ selector: 'tld-translation-system-picker-system-list', template: "<div [ngClass.lt-sm]=\"'mobile'\">\r\n\t<div class=\"span-container\" *ngIf=\"showTitle\">\r\n\t\t<mat-icon *ngIf=\"icon\">{{ icon }}</mat-icon>\r\n\t\t<span class=\"text-l-semi-bold\" [ngClass.lt-sm]=\"'text-m-semi-bold'\">{{ titleKey | translate }}</span>\r\n\t</div>\r\n\r\n\t@for (system of systems; let i = $index; track i) { \r\n @if (!isDomainList || (systems.length <= expandableDomainCount || (!isMobile || showAllDomains) || i < expandableDomainCount)) {\r\n <translation-system-picker-button\r\n [active]=\"activeId === system.languageId\"\r\n [isDomainList]=\"isDomainList\"\r\n [isRecentSystemList]=\"isRecentSystemList\"\r\n (onClick)=\"changeSystem(system)\"\r\n >\r\n {{ system.displayName }}\r\n </translation-system-picker-button>\r\n\t } \r\n } \r\n \r\n @if (isMobile && isDomainList && systems.length > expandableDomainCount) {\r\n <button mat-button color=\"accent\" (click)=\"showAllDomains = !showAllDomains\">\r\n {{ (showAllDomains ? \"SYSTEM_PICKER.HIDE_ALL\" : \"SYSTEM_PICKER.SHOW_ALL\") | translate }}\r\n </button>\r\n }\r\n</div>\r\n", styles: [":host{display:inline-block}:host .span-container{display:flex;align-items:center;margin:1rem 0 1.25rem}:host .system-picker-button{width:100%;text-align:left}:host .system-picker-button:not(.active){color:var(--base-10)}:host .mobile .span-container{margin:0 0 .75rem}:host ::ng-deep .system-picker-button{white-space:nowrap}mat-icon{margin-right:5px}\n"] }]
8858
8868
  }], propDecorators: { systems: [{
8859
8869
  type: Input
8860
8870
  }], titleKey: [{
@@ -8869,6 +8879,8 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
8869
8879
  type: Input
8870
8880
  }], isDomainList: [{
8871
8881
  type: Input
8882
+ }], isMobile: [{
8883
+ type: Input
8872
8884
  }], clicked: [{
8873
8885
  type: Output
8874
8886
  }] } });
@@ -8883,6 +8895,7 @@ class TranslationSystemPickerDropdownBodyComponent {
8883
8895
  this.filterLanguages(val);
8884
8896
  }
8885
8897
  config;
8898
+ isMobile;
8886
8899
  onSystemClick = new EventEmitter();
8887
8900
  onLanguageClick = new EventEmitter();
8888
8901
  onFilteredLanguageClick = new EventEmitter();
@@ -9033,7 +9046,13 @@ class TranslationSystemPickerDropdownBodyComponent {
9033
9046
  this.domains.forEach(domain => {
9034
9047
  arr.push({ displayName: this.getDomainDisplayName(domain.title), languageId: domain.languageId });
9035
9048
  });
9036
- return arr.sort((a, b) => a.displayName.localeCompare(b.displayName));
9049
+ return arr.sort((a, b) => {
9050
+ if (a.languageId === this.activeSystemId)
9051
+ return -1;
9052
+ if (b.languageId === this.activeSystemId)
9053
+ return 1;
9054
+ return a.displayName.localeCompare(b.displayName);
9055
+ });
9037
9056
  }
9038
9057
  getTranslatedRecentSystems() {
9039
9058
  this.systemListTitle = this.recentSystemTitleKey;
@@ -9083,15 +9102,17 @@ class TranslationSystemPickerDropdownBodyComponent {
9083
9102
  return this.languageAndDomainTranslations[this.domainsLocalizationKey][domainLocalizationKey] ?? titleCasePipe.transform(domain);
9084
9103
  }
9085
9104
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TranslationSystemPickerDropdownBodyComponent, deps: [{ token: TldTranslateSystemManagementService }, { token: i1.TranslateService }, { token: TranslationSystemPickerService }, { token: i5.LanguageTranslateService }, { token: TldTranslateConfigService }], target: i0.ɵɵFactoryTarget.Component });
9086
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TranslationSystemPickerDropdownBodyComponent, selector: "tld-translation-system-picker-dropdown-body", inputs: { filterText: "filterText", config: "config" }, outputs: { onSystemClick: "onSystemClick", onLanguageClick: "onLanguageClick", onFilteredLanguageClick: "onFilteredLanguageClick" }, ngImport: i0, template: "<div class=\"dropdown-body\" *ngIf=\"!showFiltered; else filter\">\r\n <tld-translation-system-picker-language-list *ngIf=\"showLanguages\" [languages]=\"groupedLanguages\"\r\n [activeCode]=\"activeLanguageCode\" (clicked)=\"languageClick($event)\" [showTitle]=\"showLanguageTitle\" [menuState]=\"menuState\">\r\n </tld-translation-system-picker-language-list>\r\n <tld-translation-system-picker-system-list [isDomainList]=\"systemListTitle === domainsTitleKey\" [isRecentSystemList]=\"systemListTitle === recentSystemTitleKey\" *ngIf=\"showSystems && systemList?.length> 0\" [systems]=\"systemList\"\r\n (clicked)=\"systemClick($event)\" [showTitle]=\"showSystemTitle\" [titleKey]=\"systemListTitle\"\r\n [activeId]=\"activeSystemId\" [icon]=\"systemListTitle === recentSystemTitleKey ? historyIcon : null\">\r\n </tld-translation-system-picker-system-list>\r\n</div>\r\n<ng-template #filter>\r\n <div *ngIf=\"showLanguages\" class=\"filtered-items\">\r\n <ul>\r\n <li>\r\n <translation-system-picker-button *ngFor=\"let language of filteredLanguages\"\r\n [active]=\"activeLanguageCode === language.code\" (onClick)=\"filteredLanguageClick(language)\">\r\n <span [innerHtml]=\"language.displayName\"></span>\r\n </translation-system-picker-button>\r\n </li>\r\n </ul>\r\n <p class=\"no-results-message\" *ngIf=\"!filteredLanguages?.length\">{{\"SYSTEM_PICKER.FILTER_NO_RESULTS\" | translate}}\r\n </p>\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:inline-block}:host .no-results-message{margin:0}.dropdown-body{display:flex;flex:1 1 100%}@media (min-width: 600px){.dropdown-body{flex-direction:row}.dropdown-body tld-translation-system-picker-language-list{padding-right:1rem;order:0}.dropdown-body tld-translation-system-picker-system-list{padding-left:1.5rem;order:1}}@media (min-width: 0) and (max-width: 599.9px){.dropdown-body{flex-direction:column}.dropdown-body tld-translation-system-picker-language-list,.dropdown-body tld-translation-system-picker-system-list,.dropdown-body .filtered-items{padding-top:1rem;order:1}.dropdown-body tld-translation-system-picker-system-list{padding-bottom:1rem;order:0}.dropdown-body tld-translation-system-picker-language-list+tld-translation-system-picker-system-list{border-bottom:1px solid var(--base-70)}}@media (min-width: 0) and (max-width: 599.9px){.filtered-items{padding-top:1rem;order:1}}ul{list-style-type:none;padding:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TranslationSystemPickerLanguageListComponent, selector: "tld-translation-system-picker-language-list", inputs: ["languages", "activeCode", "showTitle", "menuState"], outputs: ["clicked"] }, { kind: "component", type: TranslationSystemPickerSystemListComponent, selector: "tld-translation-system-picker-system-list", inputs: ["systems", "titleKey", "activeId", "showTitle", "icon", "isRecentSystemList", "isDomainList"], outputs: ["clicked"] }, { kind: "component", type: TranslationSystemPickerButtonComponent, selector: "translation-system-picker-button", inputs: ["active", "isRecentSystemList", "isDomainList", "tooltip"], outputs: ["onClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
9105
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TranslationSystemPickerDropdownBodyComponent, selector: "tld-translation-system-picker-dropdown-body", inputs: { filterText: "filterText", config: "config", isMobile: "isMobile" }, outputs: { onSystemClick: "onSystemClick", onLanguageClick: "onLanguageClick", onFilteredLanguageClick: "onFilteredLanguageClick" }, ngImport: i0, template: "<div class=\"dropdown-body\" *ngIf=\"!showFiltered; else filter\">\r\n <tld-translation-system-picker-language-list *ngIf=\"showLanguages\" [languages]=\"groupedLanguages\"\r\n [activeCode]=\"activeLanguageCode\" (clicked)=\"languageClick($event)\" [showTitle]=\"showLanguageTitle\" [menuState]=\"menuState\">\r\n </tld-translation-system-picker-language-list>\r\n <tld-translation-system-picker-system-list [isMobile]=\"isMobile\" [isDomainList]=\"systemListTitle === domainsTitleKey\" [isRecentSystemList]=\"systemListTitle === recentSystemTitleKey\" *ngIf=\"showSystems && systemList?.length> 0\" [systems]=\"systemList\"\r\n (clicked)=\"systemClick($event)\" [showTitle]=\"showSystemTitle\" [titleKey]=\"systemListTitle\"\r\n [activeId]=\"activeSystemId\" [icon]=\"systemListTitle === recentSystemTitleKey ? historyIcon : null\">\r\n </tld-translation-system-picker-system-list>\r\n</div>\r\n<ng-template #filter>\r\n <div *ngIf=\"showLanguages\" class=\"filtered-items\">\r\n <ul>\r\n <li>\r\n <translation-system-picker-button *ngFor=\"let language of filteredLanguages\"\r\n [active]=\"activeLanguageCode === language.code\" (onClick)=\"filteredLanguageClick(language)\">\r\n <span [innerHtml]=\"language.displayName\"></span>\r\n </translation-system-picker-button>\r\n </li>\r\n </ul>\r\n <p class=\"no-results-message\" *ngIf=\"!filteredLanguages?.length\">{{\"SYSTEM_PICKER.FILTER_NO_RESULTS\" | translate}}\r\n </p>\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:inline-block}:host .no-results-message{margin:0}.dropdown-body{display:flex;flex:1 1 100%}@media (min-width: 600px){.dropdown-body{flex-direction:row}.dropdown-body tld-translation-system-picker-language-list{padding-right:1rem;order:0}.dropdown-body tld-translation-system-picker-system-list{padding-left:1.5rem;order:1}}@media (min-width: 0) and (max-width: 599.9px){.dropdown-body{flex-direction:column}.dropdown-body tld-translation-system-picker-language-list,.dropdown-body tld-translation-system-picker-system-list,.dropdown-body .filtered-items{padding-top:1rem;order:1}.dropdown-body tld-translation-system-picker-system-list{padding-bottom:1rem;order:0}.dropdown-body tld-translation-system-picker-language-list+tld-translation-system-picker-system-list{border-bottom:1px solid var(--base-70)}}@media (min-width: 0) and (max-width: 599.9px){.filtered-items{padding-top:1rem;order:1}}ul{list-style-type:none;padding:0;margin:0}\n"], dependencies: [{ kind: "directive", type: i2.NgForOf, selector: "[ngFor][ngForOf]", inputs: ["ngForOf", "ngForTrackBy", "ngForTemplate"] }, { kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: TranslationSystemPickerLanguageListComponent, selector: "tld-translation-system-picker-language-list", inputs: ["languages", "activeCode", "showTitle", "menuState"], outputs: ["clicked"] }, { kind: "component", type: TranslationSystemPickerSystemListComponent, selector: "tld-translation-system-picker-system-list", inputs: ["systems", "titleKey", "activeId", "showTitle", "icon", "isRecentSystemList", "isDomainList", "isMobile"], outputs: ["clicked"] }, { kind: "component", type: TranslationSystemPickerButtonComponent, selector: "translation-system-picker-button", inputs: ["active", "isRecentSystemList", "isDomainList", "tooltip"], outputs: ["onClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
9087
9106
  }
9088
9107
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TranslationSystemPickerDropdownBodyComponent, decorators: [{
9089
9108
  type: Component,
9090
- args: [{ selector: 'tld-translation-system-picker-dropdown-body', template: "<div class=\"dropdown-body\" *ngIf=\"!showFiltered; else filter\">\r\n <tld-translation-system-picker-language-list *ngIf=\"showLanguages\" [languages]=\"groupedLanguages\"\r\n [activeCode]=\"activeLanguageCode\" (clicked)=\"languageClick($event)\" [showTitle]=\"showLanguageTitle\" [menuState]=\"menuState\">\r\n </tld-translation-system-picker-language-list>\r\n <tld-translation-system-picker-system-list [isDomainList]=\"systemListTitle === domainsTitleKey\" [isRecentSystemList]=\"systemListTitle === recentSystemTitleKey\" *ngIf=\"showSystems && systemList?.length> 0\" [systems]=\"systemList\"\r\n (clicked)=\"systemClick($event)\" [showTitle]=\"showSystemTitle\" [titleKey]=\"systemListTitle\"\r\n [activeId]=\"activeSystemId\" [icon]=\"systemListTitle === recentSystemTitleKey ? historyIcon : null\">\r\n </tld-translation-system-picker-system-list>\r\n</div>\r\n<ng-template #filter>\r\n <div *ngIf=\"showLanguages\" class=\"filtered-items\">\r\n <ul>\r\n <li>\r\n <translation-system-picker-button *ngFor=\"let language of filteredLanguages\"\r\n [active]=\"activeLanguageCode === language.code\" (onClick)=\"filteredLanguageClick(language)\">\r\n <span [innerHtml]=\"language.displayName\"></span>\r\n </translation-system-picker-button>\r\n </li>\r\n </ul>\r\n <p class=\"no-results-message\" *ngIf=\"!filteredLanguages?.length\">{{\"SYSTEM_PICKER.FILTER_NO_RESULTS\" | translate}}\r\n </p>\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:inline-block}:host .no-results-message{margin:0}.dropdown-body{display:flex;flex:1 1 100%}@media (min-width: 600px){.dropdown-body{flex-direction:row}.dropdown-body tld-translation-system-picker-language-list{padding-right:1rem;order:0}.dropdown-body tld-translation-system-picker-system-list{padding-left:1.5rem;order:1}}@media (min-width: 0) and (max-width: 599.9px){.dropdown-body{flex-direction:column}.dropdown-body tld-translation-system-picker-language-list,.dropdown-body tld-translation-system-picker-system-list,.dropdown-body .filtered-items{padding-top:1rem;order:1}.dropdown-body tld-translation-system-picker-system-list{padding-bottom:1rem;order:0}.dropdown-body tld-translation-system-picker-language-list+tld-translation-system-picker-system-list{border-bottom:1px solid var(--base-70)}}@media (min-width: 0) and (max-width: 599.9px){.filtered-items{padding-top:1rem;order:1}}ul{list-style-type:none;padding:0;margin:0}\n"] }]
9109
+ args: [{ selector: 'tld-translation-system-picker-dropdown-body', template: "<div class=\"dropdown-body\" *ngIf=\"!showFiltered; else filter\">\r\n <tld-translation-system-picker-language-list *ngIf=\"showLanguages\" [languages]=\"groupedLanguages\"\r\n [activeCode]=\"activeLanguageCode\" (clicked)=\"languageClick($event)\" [showTitle]=\"showLanguageTitle\" [menuState]=\"menuState\">\r\n </tld-translation-system-picker-language-list>\r\n <tld-translation-system-picker-system-list [isMobile]=\"isMobile\" [isDomainList]=\"systemListTitle === domainsTitleKey\" [isRecentSystemList]=\"systemListTitle === recentSystemTitleKey\" *ngIf=\"showSystems && systemList?.length> 0\" [systems]=\"systemList\"\r\n (clicked)=\"systemClick($event)\" [showTitle]=\"showSystemTitle\" [titleKey]=\"systemListTitle\"\r\n [activeId]=\"activeSystemId\" [icon]=\"systemListTitle === recentSystemTitleKey ? historyIcon : null\">\r\n </tld-translation-system-picker-system-list>\r\n</div>\r\n<ng-template #filter>\r\n <div *ngIf=\"showLanguages\" class=\"filtered-items\">\r\n <ul>\r\n <li>\r\n <translation-system-picker-button *ngFor=\"let language of filteredLanguages\"\r\n [active]=\"activeLanguageCode === language.code\" (onClick)=\"filteredLanguageClick(language)\">\r\n <span [innerHtml]=\"language.displayName\"></span>\r\n </translation-system-picker-button>\r\n </li>\r\n </ul>\r\n <p class=\"no-results-message\" *ngIf=\"!filteredLanguages?.length\">{{\"SYSTEM_PICKER.FILTER_NO_RESULTS\" | translate}}\r\n </p>\r\n </div>\r\n</ng-template>\r\n", styles: [":host{display:inline-block}:host .no-results-message{margin:0}.dropdown-body{display:flex;flex:1 1 100%}@media (min-width: 600px){.dropdown-body{flex-direction:row}.dropdown-body tld-translation-system-picker-language-list{padding-right:1rem;order:0}.dropdown-body tld-translation-system-picker-system-list{padding-left:1.5rem;order:1}}@media (min-width: 0) and (max-width: 599.9px){.dropdown-body{flex-direction:column}.dropdown-body tld-translation-system-picker-language-list,.dropdown-body tld-translation-system-picker-system-list,.dropdown-body .filtered-items{padding-top:1rem;order:1}.dropdown-body tld-translation-system-picker-system-list{padding-bottom:1rem;order:0}.dropdown-body tld-translation-system-picker-language-list+tld-translation-system-picker-system-list{border-bottom:1px solid var(--base-70)}}@media (min-width: 0) and (max-width: 599.9px){.filtered-items{padding-top:1rem;order:1}}ul{list-style-type:none;padding:0;margin:0}\n"] }]
9091
9110
  }], ctorParameters: () => [{ type: TldTranslateSystemManagementService }, { type: i1.TranslateService }, { type: TranslationSystemPickerService }, { type: i5.LanguageTranslateService }, { type: TldTranslateConfigService }], propDecorators: { filterText: [{
9092
9111
  type: Input
9093
9112
  }], config: [{
9094
9113
  type: Input
9114
+ }], isMobile: [{
9115
+ type: Input
9095
9116
  }], onSystemClick: [{
9096
9117
  type: Output
9097
9118
  }], onLanguageClick: [{
@@ -9299,11 +9320,11 @@ class TranslationSystemPickerDropdownComponent {
9299
9320
  });
9300
9321
  }
9301
9322
  static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TranslationSystemPickerDropdownComponent, deps: [{ token: TranslationSystemPickerService }, { token: i8$1.BreakpointObserver }, { token: TldTranslateSystemManagementService }], target: i0.ɵɵFactoryTarget.Component });
9302
- static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TranslationSystemPickerDropdownComponent, selector: "tld-translation-system-picker-dropdown", host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, viewQueries: [{ propertyName: "dropdownBody", first: true, predicate: TranslationSystemPickerDropdownBodyComponent, descendants: true }, { propertyName: "filter", first: true, predicate: TranslationSystemPickerFilterComponent, descendants: true }], ngImport: i0, template: "<div *ngIf=\"isMobile\" class=\"dropdown-content-wrapper mobile\" (clickOutside)=\"clickOutside()\">\r\n\t<div class=\"system-picker-header\">\r\n\t\t<button mat-icon-button (click)=\"back()\">\r\n\t\t\t<mat-icon>arrow_back</mat-icon>\r\n\t\t</button>\r\n\t\t<h1 class=\" text-l-semi-bold\">{{currentConfig?.headerTitle | translate}}</h1>\r\n\t</div>\r\n\r\n\t<ng-container *ngTemplateOutlet=\"filter\"></ng-container>\r\n\r\n\t<div class=\"system-picker-dropdown-content mobile\">\r\n\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t[config]=\"currentConfig\"\r\n\t\t\t[filterText]=\"filterText\"\r\n\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t>\r\n\t\t</tld-translation-system-picker-dropdown-body>\r\n\t</div>\r\n</div>\r\n\r\n<div *ngIf=\"!isMobile\" class=\"dropdown-content-wrapper\" (clickOutside)=\"clickOutside()\">\r\n\t<div fxLayout=\"row\" class=\"system-picker-dropdown-content\">\r\n\t\t<div fxLayout=\"column\" class=\"system-picker-dropdown-col\">\r\n\t\t\t<ng-container *ngTemplateOutlet=\"filter\"></ng-container>\r\n\r\n\t\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t\t[config]=\"currentConfig\"\r\n\t\t\t\t[filterText]=\"filterText\"\r\n\t\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t\t>\r\n\t\t\t</tld-translation-system-picker-dropdown-body>\r\n\t\t</div>\r\n\r\n\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t[config]=\"recentSystemPickerConfig\"\r\n\t\t\t[filterText]=\"filterText\"\r\n\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t></tld-translation-system-picker-dropdown-body>\r\n\t</div>\r\n</div>\r\n\r\n<ng-template #filter>\r\n\t<div [class.filter-mobile]=\"isMobile\">\r\n\t\t<tld-translation-system-picker-filter (filterChanged)=\"filterChange($event)\"> </tld-translation-system-picker-filter>\r\n\t</div>\r\n</ng-template>\r\n", styles: [":host{background-color:var(--base-100);overflow-y:auto!important;height:100%!important;box-sizing:border-box}:host .system-picker-dropdown-content{padding:1rem;height:100%}:host .system-picker-dropdown-content.mobile{padding:1rem 1.5rem}:host .system-picker-header{background-color:var(--base-95);padding:.5rem 1rem .5rem .75rem;display:flex;flex-direction:row;align-items:center;border-bottom:1px solid var(--base-70)}:host .system-picker-header h1{margin:0;flex:1 1 100%}:host .dropdown-content-wrapper:not(.mobile) tld-translation-system-picker-filter{margin-bottom:.5rem}.mobile tld-translation-system-picker-dropdown-body{width:100%}.dropdown-content-wrapper{height:100%}.system-picker-dropdown-col:not(.mobile){width:63%;height:100%;padding-right:1.5rem;border-right:1px solid var(--base-70)}.filter-mobile{padding:24px 24px 0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i5.ClickOutsideDirective, selector: "[clickOutside]", outputs: ["clickOutside"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: TranslationSystemPickerFilterComponent, selector: "tld-translation-system-picker-filter", outputs: ["filterChanged"] }, { kind: "component", type: TranslationSystemPickerDropdownBodyComponent, selector: "tld-translation-system-picker-dropdown-body", inputs: ["filterText", "config"], outputs: ["onSystemClick", "onLanguageClick", "onFilteredLanguageClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
9323
+ static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: TranslationSystemPickerDropdownComponent, selector: "tld-translation-system-picker-dropdown", host: { listeners: { "document:keydown.escape": "onKeydownHandler($event)" } }, viewQueries: [{ propertyName: "dropdownBody", first: true, predicate: TranslationSystemPickerDropdownBodyComponent, descendants: true }, { propertyName: "filter", first: true, predicate: TranslationSystemPickerFilterComponent, descendants: true }], ngImport: i0, template: "<div *ngIf=\"isMobile\" class=\"dropdown-content-wrapper mobile\" (clickOutside)=\"clickOutside()\">\r\n\t<div class=\"system-picker-header\">\r\n\t\t<button mat-icon-button (click)=\"back()\">\r\n\t\t\t<mat-icon>arrow_back</mat-icon>\r\n\t\t</button>\r\n\t\t<h1 class=\" text-l-semi-bold\">{{currentConfig?.headerTitle | translate}}</h1>\r\n\t</div>\r\n\r\n\t<ng-container *ngTemplateOutlet=\"filter\"></ng-container>\r\n\r\n\t<div class=\"system-picker-dropdown-content mobile\">\r\n\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t[config]=\"currentConfig\"\r\n\t\t\t[filterText]=\"filterText\"\r\n\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t\t[isMobile]=\"true\"\r\n\t\t>\r\n\t\t</tld-translation-system-picker-dropdown-body>\r\n\t</div>\r\n</div>\r\n\r\n<div *ngIf=\"!isMobile\" class=\"dropdown-content-wrapper\" (clickOutside)=\"clickOutside()\">\r\n\t<div fxLayout=\"row\" class=\"system-picker-dropdown-content\">\r\n\t\t<div fxLayout=\"column\" class=\"system-picker-dropdown-col\">\r\n\t\t\t<ng-container *ngTemplateOutlet=\"filter\"></ng-container>\r\n\r\n\t\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t\t[config]=\"currentConfig\"\r\n\t\t\t\t[filterText]=\"filterText\"\r\n\t\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t\t>\r\n\t\t\t</tld-translation-system-picker-dropdown-body>\r\n\t\t</div>\r\n\r\n\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t[config]=\"recentSystemPickerConfig\"\r\n\t\t\t[filterText]=\"filterText\"\r\n\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t></tld-translation-system-picker-dropdown-body>\r\n\t</div>\r\n</div>\r\n\r\n<ng-template #filter>\r\n\t<div [class.filter-mobile]=\"isMobile\">\r\n\t\t<tld-translation-system-picker-filter (filterChanged)=\"filterChange($event)\"> </tld-translation-system-picker-filter>\r\n\t</div>\r\n</ng-template>\r\n", styles: [":host{background-color:var(--base-100);overflow-y:auto!important;height:100%!important;box-sizing:border-box}:host .system-picker-dropdown-content{padding:1rem;height:100%}:host .system-picker-dropdown-content.mobile{padding:1rem 1.5rem}:host .system-picker-header{background-color:var(--base-95);padding:.5rem 1rem .5rem .75rem;display:flex;flex-direction:row;align-items:center;border-bottom:1px solid var(--base-70)}:host .system-picker-header h1{margin:0;flex:1 1 100%}:host .dropdown-content-wrapper:not(.mobile) tld-translation-system-picker-filter{margin-bottom:.5rem}.mobile tld-translation-system-picker-dropdown-body{width:100%}.dropdown-content-wrapper{height:100%}.system-picker-dropdown-col:not(.mobile){width:63%;height:100%;padding-right:1.5rem;border-right:1px solid var(--base-70)}.filter-mobile{padding:24px 24px 0}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "directive", type: i2.NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: i3.DefaultLayoutDirective, selector: " [fxLayout], [fxLayout.xs], [fxLayout.sm], [fxLayout.md], [fxLayout.lg], [fxLayout.xl], [fxLayout.lt-sm], [fxLayout.lt-md], [fxLayout.lt-lg], [fxLayout.lt-xl], [fxLayout.gt-xs], [fxLayout.gt-sm], [fxLayout.gt-md], [fxLayout.gt-lg]", inputs: ["fxLayout", "fxLayout.xs", "fxLayout.sm", "fxLayout.md", "fxLayout.lg", "fxLayout.xl", "fxLayout.lt-sm", "fxLayout.lt-md", "fxLayout.lt-lg", "fxLayout.lt-xl", "fxLayout.gt-xs", "fxLayout.gt-sm", "fxLayout.gt-md", "fxLayout.gt-lg"] }, { kind: "directive", type: i5.ClickOutsideDirective, selector: "[clickOutside]", outputs: ["clickOutside"] }, { kind: "component", type: i6$1.MatIcon, selector: "mat-icon", inputs: ["color", "inline", "svgIcon", "fontSet", "fontIcon"], exportAs: ["matIcon"] }, { kind: "component", type: i8.MatIconButton, selector: "button[mat-icon-button]", exportAs: ["matButton"] }, { kind: "component", type: TranslationSystemPickerFilterComponent, selector: "tld-translation-system-picker-filter", outputs: ["filterChanged"] }, { kind: "component", type: TranslationSystemPickerDropdownBodyComponent, selector: "tld-translation-system-picker-dropdown-body", inputs: ["filterText", "config", "isMobile"], outputs: ["onSystemClick", "onLanguageClick", "onFilteredLanguageClick"] }, { kind: "pipe", type: i1.TranslatePipe, name: "translate" }] });
9303
9324
  }
9304
9325
  i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TranslationSystemPickerDropdownComponent, decorators: [{
9305
9326
  type: Component,
9306
- args: [{ selector: 'tld-translation-system-picker-dropdown', template: "<div *ngIf=\"isMobile\" class=\"dropdown-content-wrapper mobile\" (clickOutside)=\"clickOutside()\">\r\n\t<div class=\"system-picker-header\">\r\n\t\t<button mat-icon-button (click)=\"back()\">\r\n\t\t\t<mat-icon>arrow_back</mat-icon>\r\n\t\t</button>\r\n\t\t<h1 class=\" text-l-semi-bold\">{{currentConfig?.headerTitle | translate}}</h1>\r\n\t</div>\r\n\r\n\t<ng-container *ngTemplateOutlet=\"filter\"></ng-container>\r\n\r\n\t<div class=\"system-picker-dropdown-content mobile\">\r\n\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t[config]=\"currentConfig\"\r\n\t\t\t[filterText]=\"filterText\"\r\n\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t>\r\n\t\t</tld-translation-system-picker-dropdown-body>\r\n\t</div>\r\n</div>\r\n\r\n<div *ngIf=\"!isMobile\" class=\"dropdown-content-wrapper\" (clickOutside)=\"clickOutside()\">\r\n\t<div fxLayout=\"row\" class=\"system-picker-dropdown-content\">\r\n\t\t<div fxLayout=\"column\" class=\"system-picker-dropdown-col\">\r\n\t\t\t<ng-container *ngTemplateOutlet=\"filter\"></ng-container>\r\n\r\n\t\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t\t[config]=\"currentConfig\"\r\n\t\t\t\t[filterText]=\"filterText\"\r\n\t\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t\t>\r\n\t\t\t</tld-translation-system-picker-dropdown-body>\r\n\t\t</div>\r\n\r\n\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t[config]=\"recentSystemPickerConfig\"\r\n\t\t\t[filterText]=\"filterText\"\r\n\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t></tld-translation-system-picker-dropdown-body>\r\n\t</div>\r\n</div>\r\n\r\n<ng-template #filter>\r\n\t<div [class.filter-mobile]=\"isMobile\">\r\n\t\t<tld-translation-system-picker-filter (filterChanged)=\"filterChange($event)\"> </tld-translation-system-picker-filter>\r\n\t</div>\r\n</ng-template>\r\n", styles: [":host{background-color:var(--base-100);overflow-y:auto!important;height:100%!important;box-sizing:border-box}:host .system-picker-dropdown-content{padding:1rem;height:100%}:host .system-picker-dropdown-content.mobile{padding:1rem 1.5rem}:host .system-picker-header{background-color:var(--base-95);padding:.5rem 1rem .5rem .75rem;display:flex;flex-direction:row;align-items:center;border-bottom:1px solid var(--base-70)}:host .system-picker-header h1{margin:0;flex:1 1 100%}:host .dropdown-content-wrapper:not(.mobile) tld-translation-system-picker-filter{margin-bottom:.5rem}.mobile tld-translation-system-picker-dropdown-body{width:100%}.dropdown-content-wrapper{height:100%}.system-picker-dropdown-col:not(.mobile){width:63%;height:100%;padding-right:1.5rem;border-right:1px solid var(--base-70)}.filter-mobile{padding:24px 24px 0}\n"] }]
9327
+ args: [{ selector: 'tld-translation-system-picker-dropdown', template: "<div *ngIf=\"isMobile\" class=\"dropdown-content-wrapper mobile\" (clickOutside)=\"clickOutside()\">\r\n\t<div class=\"system-picker-header\">\r\n\t\t<button mat-icon-button (click)=\"back()\">\r\n\t\t\t<mat-icon>arrow_back</mat-icon>\r\n\t\t</button>\r\n\t\t<h1 class=\" text-l-semi-bold\">{{currentConfig?.headerTitle | translate}}</h1>\r\n\t</div>\r\n\r\n\t<ng-container *ngTemplateOutlet=\"filter\"></ng-container>\r\n\r\n\t<div class=\"system-picker-dropdown-content mobile\">\r\n\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t[config]=\"currentConfig\"\r\n\t\t\t[filterText]=\"filterText\"\r\n\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t\t[isMobile]=\"true\"\r\n\t\t>\r\n\t\t</tld-translation-system-picker-dropdown-body>\r\n\t</div>\r\n</div>\r\n\r\n<div *ngIf=\"!isMobile\" class=\"dropdown-content-wrapper\" (clickOutside)=\"clickOutside()\">\r\n\t<div fxLayout=\"row\" class=\"system-picker-dropdown-content\">\r\n\t\t<div fxLayout=\"column\" class=\"system-picker-dropdown-col\">\r\n\t\t\t<ng-container *ngTemplateOutlet=\"filter\"></ng-container>\r\n\r\n\t\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t\t[config]=\"currentConfig\"\r\n\t\t\t\t[filterText]=\"filterText\"\r\n\t\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t\t>\r\n\t\t\t</tld-translation-system-picker-dropdown-body>\r\n\t\t</div>\r\n\r\n\t\t<tld-translation-system-picker-dropdown-body\r\n\t\t\t[config]=\"recentSystemPickerConfig\"\r\n\t\t\t[filterText]=\"filterText\"\r\n\t\t\t(onSystemClick)=\"onSystemClick()\"\r\n\t\t\t(onLanguageClick)=\"onLanguageClick()\"\r\n\t\t\t(onFilteredLanguageClick)=\"onFilteredLanguageClick()\"\r\n\t\t></tld-translation-system-picker-dropdown-body>\r\n\t</div>\r\n</div>\r\n\r\n<ng-template #filter>\r\n\t<div [class.filter-mobile]=\"isMobile\">\r\n\t\t<tld-translation-system-picker-filter (filterChanged)=\"filterChange($event)\"> </tld-translation-system-picker-filter>\r\n\t</div>\r\n</ng-template>\r\n", styles: [":host{background-color:var(--base-100);overflow-y:auto!important;height:100%!important;box-sizing:border-box}:host .system-picker-dropdown-content{padding:1rem;height:100%}:host .system-picker-dropdown-content.mobile{padding:1rem 1.5rem}:host .system-picker-header{background-color:var(--base-95);padding:.5rem 1rem .5rem .75rem;display:flex;flex-direction:row;align-items:center;border-bottom:1px solid var(--base-70)}:host .system-picker-header h1{margin:0;flex:1 1 100%}:host .dropdown-content-wrapper:not(.mobile) tld-translation-system-picker-filter{margin-bottom:.5rem}.mobile tld-translation-system-picker-dropdown-body{width:100%}.dropdown-content-wrapper{height:100%}.system-picker-dropdown-col:not(.mobile){width:63%;height:100%;padding-right:1.5rem;border-right:1px solid var(--base-70)}.filter-mobile{padding:24px 24px 0}\n"] }]
9307
9328
  }], ctorParameters: () => [{ type: TranslationSystemPickerService }, { type: i8$1.BreakpointObserver }, { type: TldTranslateSystemManagementService }], propDecorators: { onKeydownHandler: [{
9308
9329
  type: HostListener,
9309
9330
  args: ['document:keydown.escape', ['$event']]