import { Component, HostBinding, Input } from '@angular/core';
import { UntypedFormControl } from '@angular/forms';
import { JsonHelper } from '../../shared/json-helper';
import * as i0 from "@angular/core";
import * as i1 from "@ngx-translate/core";
import * as i2 from "@angular/common";
import * as i3 from "../../controls/button/button.component";
import * as i4 from "../../controls/button/copy-button.directive";
export class JsonDisplayComponent {
    constructor(translate) {
        this.translate = translate;
        this.maxLength = 10000;
        this.jsonDisplay = new UntypedFormControl('');
    }
    ngOnChanges() {
        if (this.id) {
            this.attrId = this.id;
        }
        if (this.jsonString) {
            let display = this.jsonString;
            let parsedJson = JsonHelper.tryParseJSON(this.jsonString);
            if (parsedJson) {
                display = JSON.stringify(parsedJson, null, 2);
            }
            if (display.length > this.maxLength) {
                display = display.substr(0, this.maxLength) + `\r\n${this.translate.instant('MessageTooLong_Truncated_SC')}`;
            }
            this.jsonDisplay.patchValue(display);
        }
    }
    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: JsonDisplayComponent, deps: [{ token: i1.TranslateService }], target: i0.ɵɵFactoryTarget.Component }); }
    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "17.3.12", type: JsonDisplayComponent, selector: "ec-json-display", inputs: { id: "id", jsonString: "jsonString", maxLength: "maxLength" }, host: { properties: { "attr.id": "this.attrId" } }, usesOnChanges: true, ngImport: i0, template: "<ec-button id=\"{{id}}_copy\"\r\n           class=\"copy-button\"\r\n           *ngIf=\"jsonDisplay.value\"\r\n           type=\"icon\"\r\n           icon=\"icon-copy\"\r\n           [ecCopyButton]=\"jsonDisplay\">\r\n</ec-button>\r\n<pre><code>{{jsonDisplay.value}}</code></pre>", styles: [":host{display:block;position:relative;color:var(--ec-color-primary-light);background:#354751;max-height:15rem;min-height:2.125rem;font-size:var(--ec-font-size-label);border-radius:var(--ec-border-radius-card);overflow-x:auto;overflow-y:auto;text-align:right}pre{margin-bottom:0;margin-top:-2rem;text-align:left}pre code{display:block;padding:.5rem}.copy-button{position:sticky;top:0}.copy-button ::ng-deep .ec-icon{color:var(--ec-color-secondary-light)!important}.copy-button ::ng-deep button:hover{background-color:transparent!important}.copy-button ::ng-deep button:hover .ec-icon{color:var(--ec-color-primary-light)!important}\n"], dependencies: [{ kind: "directive", type: i2.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "component", type: i3.ButtonComponent, selector: "ec-button", inputs: ["id", "disabled", "icon", "label", "badge", "tabindex", "type", "pending", "pendingIcon", "customTemplate", "isSubmit", "autofocus"], outputs: ["clicked"] }, { kind: "directive", type: i4.CopyButtonDirective, selector: "[ecCopyButton]", inputs: ["ecCopyButton"] }] }); }
}
i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "17.3.12", ngImport: i0, type: JsonDisplayComponent, decorators: [{
            type: Component,
            args: [{ selector: 'ec-json-display', template: "<ec-button id=\"{{id}}_copy\"\r\n           class=\"copy-button\"\r\n           *ngIf=\"jsonDisplay.value\"\r\n           type=\"icon\"\r\n           icon=\"icon-copy\"\r\n           [ecCopyButton]=\"jsonDisplay\">\r\n</ec-button>\r\n<pre><code>{{jsonDisplay.value}}</code></pre>", styles: [":host{display:block;position:relative;color:var(--ec-color-primary-light);background:#354751;max-height:15rem;min-height:2.125rem;font-size:var(--ec-font-size-label);border-radius:var(--ec-border-radius-card);overflow-x:auto;overflow-y:auto;text-align:right}pre{margin-bottom:0;margin-top:-2rem;text-align:left}pre code{display:block;padding:.5rem}.copy-button{position:sticky;top:0}.copy-button ::ng-deep .ec-icon{color:var(--ec-color-secondary-light)!important}.copy-button ::ng-deep button:hover{background-color:transparent!important}.copy-button ::ng-deep button:hover .ec-icon{color:var(--ec-color-primary-light)!important}\n"] }]
        }], ctorParameters: () => [{ type: i1.TranslateService }], propDecorators: { id: [{
                type: Input
            }], attrId: [{
                type: HostBinding,
                args: ['attr.id']
            }], jsonString: [{
                type: Input
            }], maxLength: [{
                type: Input
            }] } });
//# sourceMappingURL=data:application/json;base64,eyJ2ZXJzaW9uIjozLCJmaWxlIjoianNvbi1kaXNwbGF5LmNvbXBvbmVudC5qcyIsInNvdXJjZVJvb3QiOiIiLCJzb3VyY2VzIjpbIi4uLy4uLy4uLy4uLy4uLy4uL3Byb2plY3RzL2NvbXBvbmVudHMvc3JjL2xpYi9kaXNwbGF5L2pzb24tZGlzcGxheS9qc29uLWRpc3BsYXkuY29tcG9uZW50LnRzIiwiLi4vLi4vLi4vLi4vLi4vLi4vcHJvamVjdHMvY29tcG9uZW50cy9zcmMvbGliL2Rpc3BsYXkvanNvbi1kaXNwbGF5L2pzb24tZGlzcGxheS5jb21wb25lbnQuaHRtbCJdLCJuYW1lcyI6W10sIm1hcHBpbmdzIjoiQUFBQSxPQUFPLEVBQUUsU0FBUyxFQUFFLFdBQVcsRUFBRSxLQUFLLEVBQWEsTUFBTSxlQUFlLENBQUM7QUFDekUsT0FBTyxFQUFFLGtCQUFrQixFQUFFLE1BQU0sZ0JBQWdCLENBQUM7QUFFcEQsT0FBTyxFQUFFLFVBQVUsRUFBRSxNQUFNLDBCQUEwQixDQUFDOzs7Ozs7QUFPdEQsTUFBTSxPQUFPLG9CQUFvQjtJQVEvQixZQUFvQixTQUEyQjtRQUEzQixjQUFTLEdBQVQsU0FBUyxDQUFrQjtRQUh0QyxjQUFTLEdBQVcsS0FBSyxDQUFDO1FBQzVCLGdCQUFXLEdBQUcsSUFBSSxrQkFBa0IsQ0FBQyxFQUFFLENBQUMsQ0FBQztJQUVHLENBQUM7SUFFcEQsV0FBVztRQUNULElBQUksSUFBSSxDQUFDLEVBQUUsRUFBRSxDQUFDO1lBQ1osSUFBSSxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUMsRUFBRSxDQUFDO1FBQ3hCLENBQUM7UUFFRCxJQUFJLElBQUksQ0FBQyxVQUFVLEVBQUUsQ0FBQztZQUNwQixJQUFJLE9BQU8sR0FBRyxJQUFJLENBQUMsVUFBVSxDQUFDO1lBRTlCLElBQUksVUFBVSxHQUF3QixVQUFVLENBQUMsWUFBWSxDQUFDLElBQUksQ0FBQyxVQUFVLENBQUMsQ0FBQztZQUMvRSxJQUFJLFVBQVUsRUFBRSxDQUFDO2dCQUNmLE9BQU8sR0FBRyxJQUFJLENBQUMsU0FBUyxDQUFDLFVBQVUsRUFBRSxJQUFJLEVBQUUsQ0FBQyxDQUFDLENBQUM7WUFDaEQsQ0FBQztZQUVELElBQUksT0FBTyxDQUFDLE1BQU0sR0FBRyxJQUFJLENBQUMsU0FBUyxFQUFFLENBQUM7Z0JBQ3BDLE9BQU8sR0FBRyxPQUFPLENBQUMsTUFBTSxDQUFDLENBQUMsRUFBRSxJQUFJLENBQUMsU0FBUyxDQUFDLEdBQUcsT0FBTyxJQUFJLENBQUMsU0FBUyxDQUFDLE9BQU8sQ0FBQyw2QkFBNkIsQ0FBQyxFQUFFLENBQUM7WUFDL0csQ0FBQztZQUVELElBQUksQ0FBQyxXQUFXLENBQUMsVUFBVSxDQUFDLE9BQU8sQ0FBQyxDQUFDO1FBQ3ZDLENBQUM7SUFDSCxDQUFDOytHQTdCVSxvQkFBb0I7bUdBQXBCLG9CQUFvQix3TUNWakMseVJBTzZDOzs0RkRHaEMsb0JBQW9CO2tCQUxoQyxTQUFTOytCQUNFLGlCQUFpQjtxRkFNbEIsRUFBRTtzQkFBVixLQUFLO2dCQUNrQixNQUFNO3NCQUE3QixXQUFXO3VCQUFDLFNBQVM7Z0JBQ2IsVUFBVTtzQkFBbEIsS0FBSztnQkFDRyxTQUFTO3NCQUFqQixLQUFLIiwic291cmNlc0NvbnRlbnQiOlsiaW1wb3J0IHsgQ29tcG9uZW50LCBIb3N0QmluZGluZywgSW5wdXQsIE9uQ2hhbmdlcyB9IGZyb20gJ0Bhbmd1bGFyL2NvcmUnO1xyXG5pbXBvcnQgeyBVbnR5cGVkRm9ybUNvbnRyb2wgfSBmcm9tICdAYW5ndWxhci9mb3Jtcyc7XHJcbmltcG9ydCB7IFRyYW5zbGF0ZVNlcnZpY2UgfSBmcm9tICdAbmd4LXRyYW5zbGF0ZS9jb3JlJztcclxuaW1wb3J0IHsgSnNvbkhlbHBlciB9IGZyb20gJy4uLy4uL3NoYXJlZC9qc29uLWhlbHBlcic7XHJcblxyXG5AQ29tcG9uZW50KHtcclxuICBzZWxlY3RvcjogJ2VjLWpzb24tZGlzcGxheScsXHJcbiAgdGVtcGxhdGVVcmw6ICcuL2pzb24tZGlzcGxheS5jb21wb25lbnQuaHRtbCcsXHJcbiAgc3R5bGVVcmxzOiBbJy4vanNvbi1kaXNwbGF5LmNvbXBvbmVudC5zY3NzJ11cclxufSlcclxuZXhwb3J0IGNsYXNzIEpzb25EaXNwbGF5Q29tcG9uZW50IGltcGxlbWVudHMgT25DaGFuZ2VzIHtcclxuXHJcbiAgQElucHV0KCkgaWQ/OiBzdHJpbmc7XHJcbiAgQEhvc3RCaW5kaW5nKCdhdHRyLmlkJykgYXR0cklkPzogc3RyaW5nO1xyXG4gIEBJbnB1dCgpIGpzb25TdHJpbmc/OiBzdHJpbmc7XHJcbiAgQElucHV0KCkgbWF4TGVuZ3RoOiBudW1iZXIgPSAxMDAwMDtcclxuICBwdWJsaWMganNvbkRpc3BsYXkgPSBuZXcgVW50eXBlZEZvcm1Db250cm9sKCcnKTtcclxuXHJcbiAgY29uc3RydWN0b3IocHJpdmF0ZSB0cmFuc2xhdGU6IFRyYW5zbGF0ZVNlcnZpY2UpIHsgfVxyXG5cclxuICBuZ09uQ2hhbmdlcygpIHtcclxuICAgIGlmICh0aGlzLmlkKSB7XHJcbiAgICAgIHRoaXMuYXR0cklkID0gdGhpcy5pZDtcclxuICAgIH1cclxuXHJcbiAgICBpZiAodGhpcy5qc29uU3RyaW5nKSB7XHJcbiAgICAgIGxldCBkaXNwbGF5ID0gdGhpcy5qc29uU3RyaW5nO1xyXG5cclxuICAgICAgbGV0IHBhcnNlZEpzb246IHVua25vd24gfCB1bmRlZmluZWQgPSBKc29uSGVscGVyLnRyeVBhcnNlSlNPTih0aGlzLmpzb25TdHJpbmcpO1xyXG4gICAgICBpZiAocGFyc2VkSnNvbikge1xyXG4gICAgICAgIGRpc3BsYXkgPSBKU09OLnN0cmluZ2lmeShwYXJzZWRKc29uLCBudWxsLCAyKTtcclxuICAgICAgfVxyXG5cclxuICAgICAgaWYgKGRpc3BsYXkubGVuZ3RoID4gdGhpcy5tYXhMZW5ndGgpIHtcclxuICAgICAgICBkaXNwbGF5ID0gZGlzcGxheS5zdWJzdHIoMCwgdGhpcy5tYXhMZW5ndGgpICsgYFxcclxcbiR7dGhpcy50cmFuc2xhdGUuaW5zdGFudCgnTWVzc2FnZVRvb0xvbmdfVHJ1bmNhdGVkX1NDJyl9YDtcclxuICAgICAgfVxyXG5cclxuICAgICAgdGhpcy5qc29uRGlzcGxheS5wYXRjaFZhbHVlKGRpc3BsYXkpO1xyXG4gICAgfVxyXG4gIH1cclxufVxyXG4iLCI8ZWMtYnV0dG9uIGlkPVwie3tpZH19X2NvcHlcIlxyXG4gICAgICAgICAgIGNsYXNzPVwiY29weS1idXR0b25cIlxyXG4gICAgICAgICAgICpuZ0lmPVwianNvbkRpc3BsYXkudmFsdWVcIlxyXG4gICAgICAgICAgIHR5cGU9XCJpY29uXCJcclxuICAgICAgICAgICBpY29uPVwiaWNvbi1jb3B5XCJcclxuICAgICAgICAgICBbZWNDb3B5QnV0dG9uXT1cImpzb25EaXNwbGF5XCI+XHJcbjwvZWMtYnV0dG9uPlxyXG48cHJlPjxjb2RlPnt7anNvbkRpc3BsYXkudmFsdWV9fTwvY29kZT48L3ByZT4iXX0=