@memberjunction/ng-ai-test-harness
Version:
MemberJunction AI Test Harness - A reusable component for testing AI agents and prompts with beautiful UX
57 lines • 6.39 kB
JavaScript
import { Component, Input } from '@angular/core';
import * as i0 from "@angular/core";
import * as i1 from "@angular/forms";
import * as i2 from "@memberjunction/ng-code-editor";
export class JsonViewerWindowComponent {
constructor() {
this.jsonContent = '';
}
copyJsonContent() {
if (this.jsonContent) {
navigator.clipboard.writeText(this.jsonContent).then(() => {
// Success - JSON copied
}).catch((err) => {
// Error copying
});
}
}
static { this.ɵfac = function JsonViewerWindowComponent_Factory(t) { return new (t || JsonViewerWindowComponent)(); }; }
static { this.ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: JsonViewerWindowComponent, selectors: [["mj-json-viewer-window"]], inputs: { jsonContent: "jsonContent" }, decls: 6, vars: 4, consts: [[1, "json-dialog-content"], [1, "json-dialog-header"], ["title", "Copy JSON", 1, "custom-button", "icon-only", 3, "click"], [1, "fa-solid", "fa-copy"], [1, "json-dialog-body"], [2, "height", "100%", "width", "100%", 3, "ngModelChange", "ngModel", "readonly", "language", "lineWrapping"]], template: function JsonViewerWindowComponent_Template(rf, ctx) { if (rf & 1) {
i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "button", 2);
i0.ɵɵlistener("click", function JsonViewerWindowComponent_Template_button_click_2_listener() { return ctx.copyJsonContent(); });
i0.ɵɵelement(3, "i", 3);
i0.ɵɵelementEnd()();
i0.ɵɵelementStart(4, "div", 4)(5, "mj-code-editor", 5);
i0.ɵɵtwoWayListener("ngModelChange", function JsonViewerWindowComponent_Template_mj_code_editor_ngModelChange_5_listener($event) { i0.ɵɵtwoWayBindingSet(ctx.jsonContent, $event) || (ctx.jsonContent = $event); return $event; });
i0.ɵɵelementEnd()()();
} if (rf & 2) {
i0.ɵɵadvance(5);
i0.ɵɵtwoWayProperty("ngModel", ctx.jsonContent);
i0.ɵɵproperty("readonly", true)("language", "json")("lineWrapping", true);
} }, dependencies: [i1.NgControlStatus, i1.NgModel, i2.CodeEditorComponent], styles: [".json-dialog-content[_ngcontent-%COMP%] {\n display: flex;\n flex-direction: column;\n height: 100%;\n background: white;\n overflow: hidden;\n }\n\n .json-dialog-header[_ngcontent-%COMP%] {\n padding: 12px 16px;\n background: #f8f9fa;\n border-bottom: 1px solid #dee2e6;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n flex-shrink: 0;\n }\n\n .json-dialog-body[_ngcontent-%COMP%] {\n flex: 1;\n overflow: auto;\n padding: 0;\n position: relative;\n min-height: 0;\n }\n\n .custom-button[_ngcontent-%COMP%] {\n background: white;\n border: 1px solid #dee2e6;\n border-radius: 4px;\n padding: 6px 12px;\n font-size: 13px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n font-family: inherit;\n }\n\n .custom-button[_ngcontent-%COMP%]:hover:not(:disabled) {\n background: #f8f9fa;\n border-color: #adb5bd;\n color: #212529;\n }\n\n .custom-button.icon-only[_ngcontent-%COMP%] {\n padding: 6px 8px;\n }\n\n .custom-button[_ngcontent-%COMP%] i[_ngcontent-%COMP%] {\n font-size: 14px;\n }"] }); }
}
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(JsonViewerWindowComponent, [{
type: Component,
args: [{ selector: 'mj-json-viewer-window', template: `
<div class="json-dialog-content">
<div class="json-dialog-header">
<button class="custom-button icon-only" (click)="copyJsonContent()" title="Copy JSON">
<i class="fa-solid fa-copy"></i>
</button>
</div>
<div class="json-dialog-body">
<mj-code-editor
[(ngModel)]="jsonContent"
[readonly]="true"
[language]="'json'"
[lineWrapping]="true"
style="height: 100%; width: 100%;">
</mj-code-editor>
</div>
</div>
`, styles: ["\n .json-dialog-content {\n display: flex;\n flex-direction: column;\n height: 100%;\n background: white;\n overflow: hidden;\n }\n\n .json-dialog-header {\n padding: 12px 16px;\n background: #f8f9fa;\n border-bottom: 1px solid #dee2e6;\n display: flex;\n justify-content: flex-end;\n align-items: center;\n flex-shrink: 0;\n }\n\n .json-dialog-body {\n flex: 1;\n overflow: auto;\n padding: 0;\n position: relative;\n min-height: 0;\n }\n\n .custom-button {\n background: white;\n border: 1px solid #dee2e6;\n border-radius: 4px;\n padding: 6px 12px;\n font-size: 13px;\n color: #495057;\n cursor: pointer;\n transition: all 0.2s;\n display: inline-flex;\n align-items: center;\n gap: 6px;\n font-family: inherit;\n }\n\n .custom-button:hover:not(:disabled) {\n background: #f8f9fa;\n border-color: #adb5bd;\n color: #212529;\n }\n\n .custom-button.icon-only {\n padding: 6px 8px;\n }\n\n .custom-button i {\n font-size: 14px;\n }\n "] }]
}], null, { jsonContent: [{
type: Input
}] }); })();
(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(JsonViewerWindowComponent, { className: "JsonViewerWindowComponent", filePath: "lib/json-viewer-window.component.ts", lineNumber: 80 }); })();
//# sourceMappingURL=json-viewer-window.component.js.map