@memberjunction/ng-artifacts 2.105.0

package/dist/lib/components/plugins/component-artifact-viewer.component.js

@@ -0,0 +1,293 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Component, ViewChild } from '@angular/core';
+import { RegisterClass, SafeJSONParse } from '@memberjunction/global';
+import { BaseArtifactViewerPluginComponent } from '../base-artifact-viewer.component';
+import { BuildComponentCompleteCode } from '@memberjunction/interactive-component-types';
+import * as i0 from "@angular/core";
+import * as i1 from "@memberjunction/ng-react";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/forms";
+import * as i4 from "@memberjunction/ng-code-editor";
+const _c0 = ["reactComponent"];
+function ComponentArtifactViewerComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    const _r1 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "button", 10);
+    i0.ɵɵlistener("click", function ComponentArtifactViewerComponent_Conditional_8_Template_button_click_0_listener() { i0.ɵɵrestoreView(_r1); const ctx_r1 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r1.onCopy()); });
+    i0.ɵɵelement(1, "i", 11);
+    i0.ɵɵtext(2, " Copy ");
+    i0.ɵɵelementEnd();
+} }
+function ComponentArtifactViewerComponent_Conditional_10_Conditional_1_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "details")(1, "summary");
+    i0.ɵɵtext(2, "Technical Details");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(3, "pre");
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtextInterpolate(ctx_r1.errorDetails);
+} }
+function ComponentArtifactViewerComponent_Conditional_10_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 12);
+    i0.ɵɵelement(1, "i", 13);
+    i0.ɵɵelementStart(2, "h3");
+    i0.ɵɵtext(3, "Component Error");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p");
+    i0.ɵɵtext(5);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(6, ComponentArtifactViewerComponent_Conditional_10_Conditional_1_Conditional_6_Template, 5, 1, "details");
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtextInterpolate(ctx_r1.errorMessage);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.errorDetails ? 6 : -1);
+} }
+function ComponentArtifactViewerComponent_Conditional_10_Conditional_2_Conditional_0_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-react-component", 15, 0);
+    i0.ɵɵlistener("componentEvent", function ComponentArtifactViewerComponent_Conditional_10_Conditional_2_Conditional_0_Template_mj_react_component_componentEvent_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onComponentEvent($event)); })("stateChange", function ComponentArtifactViewerComponent_Conditional_10_Conditional_2_Conditional_0_Template_mj_react_component_stateChange_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onStateChange($event)); })("openEntityRecord", function ComponentArtifactViewerComponent_Conditional_10_Conditional_2_Conditional_0_Template_mj_react_component_openEntityRecord_0_listener($event) { i0.ɵɵrestoreView(_r3); const ctx_r1 = i0.ɵɵnextContext(3); return i0.ɵɵresetView(ctx_r1.onOpenEntityRecord($event)); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(3);
+    i0.ɵɵproperty("component", ctx_r1.component);
+} }
+function ComponentArtifactViewerComponent_Conditional_10_Conditional_2_Conditional_1_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 12);
+    i0.ɵɵelement(1, "i", 16);
+    i0.ɵɵelementStart(2, "h3");
+    i0.ɵɵtext(3, "No Component Loaded");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p");
+    i0.ɵɵtext(5, "The component data is missing or invalid.");
+    i0.ɵɵelementEnd()();
+} }
+function ComponentArtifactViewerComponent_Conditional_10_Conditional_2_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵtemplate(0, ComponentArtifactViewerComponent_Conditional_10_Conditional_2_Conditional_0_Template, 2, 1, "mj-react-component", 14)(1, ComponentArtifactViewerComponent_Conditional_10_Conditional_2_Conditional_1_Template, 6, 0, "div", 12);
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext(2);
+    i0.ɵɵconditional(ctx_r1.component ? 0 : 1);
+} }
+function ComponentArtifactViewerComponent_Conditional_10_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 8);
+    i0.ɵɵtemplate(1, ComponentArtifactViewerComponent_Conditional_10_Conditional_1_Template, 7, 2, "div", 12)(2, ComponentArtifactViewerComponent_Conditional_10_Conditional_2_Template, 2, 1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(ctx_r1.hasError ? 1 : 2);
+} }
+function ComponentArtifactViewerComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    const _r4 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-code-editor", 17);
+    i0.ɵɵtwoWayListener("ngModelChange", function ComponentArtifactViewerComponent_Conditional_11_Template_mj_code_editor_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r4); const ctx_r1 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r1.componentCode, $event) || (ctx_r1.componentCode = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r1 = i0.ɵɵnextContext();
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r1.componentCode);
+    i0.ɵɵproperty("language", "typescript")("readonly", ctx_r1.readonly);
+} }
+/**
+ * Viewer component for interactive Component artifacts (React-based UI components)
+ */
+let ComponentArtifactViewerComponent = class ComponentArtifactViewerComponent extends BaseArtifactViewerPluginComponent {
+    adapter;
+    reactComponent;
+    component = null;
+    componentCode = "";
+    componentName = '';
+    viewMode = 'preview';
+    hasError = false;
+    errorMessage = '';
+    errorDetails = '';
+    constructor(adapter) {
+        super();
+        this.adapter = adapter;
+    }
+    async ngOnInit() {
+        // Extract component name from the code
+        if (this.artifactVersion.Content) {
+            this.component = SafeJSONParse(this.artifactVersion.Content);
+        }
+        else {
+            throw new Error('Artifact content is empty');
+        }
+        this.extractComponentParts();
+        // Initialize Angular adapter for React components
+        try {
+            await this.adapter.initialize();
+        }
+        catch (error) {
+            console.error('Failed to initialize Angular adapter:', error);
+            this.hasError = true;
+            this.errorMessage = 'Failed to initialize component runtime';
+            this.errorDetails = error instanceof Error ? error.message : String(error);
+        }
+    }
+    async ngAfterViewInit() {
+        // Component initialization happens automatically via mj-react-component
+    }
+    /**
+     * Component plugin always shows elevated display (interactive React component).
+     */
+    get isShowingElevatedDisplay() {
+        return true;
+    }
+    /**
+     * Component plugin should tell parent to show JSON tab so users can view the component spec source.
+     */
+    get parentShouldShowRawContent() {
+        return true;
+    }
+    extractComponentParts() {
+        if (this.component?.name) {
+            this.componentName = this.component?.name;
+        }
+        if (this.component?.code) {
+            this.componentCode = BuildComponentCompleteCode(this.component);
+        }
+    }
+    onCopy() {
+        if (this.componentCode) {
+            navigator.clipboard.writeText(this.componentCode).then(() => {
+                console.log('✅ Copied component code to clipboard');
+            }).catch(err => {
+                console.error('Failed to copy to clipboard:', err);
+            });
+        }
+    }
+    onComponentEvent(event) {
+        if (event.type === 'error') {
+            this.hasError = true;
+            this.errorMessage = event.payload?.error || 'An unknown error occurred';
+            this.errorDetails = event.payload?.errorInfo || event.payload?.stackTrace || '';
+            console.error('Component error:', event.payload);
+        }
+        else {
+            console.log('Component event:', event.type, event.payload);
+        }
+    }
+    onStateChange(event) {
+        console.log('Component state change:', event);
+        // Could update componentContext here if needed for persistence
+    }
+    onOpenEntityRecord(event) {
+        console.log('Open entity record requested:', event);
+        // This would typically be handled by a parent component to open entity forms
+        // For now just log it
+    }
+    static ɵfac = function ComponentArtifactViewerComponent_Factory(t) { return new (t || ComponentArtifactViewerComponent)(i0.ɵɵdirectiveInject(i1.AngularAdapterService)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ComponentArtifactViewerComponent, selectors: [["mj-component-artifact-viewer"]], viewQuery: function ComponentArtifactViewerComponent_Query(rf, ctx) { if (rf & 1) {
+            i0.ɵɵviewQuery(_c0, 5);
+        } if (rf & 2) {
+            let _t;
+            i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.reactComponent = _t.first);
+        } }, features: [i0.ɵɵInheritDefinitionFeature], decls: 12, vars: 6, consts: [["reactComponent", ""], [1, "component-artifact-viewer", 3, "ngClass"], [1, "component-toolbar"], [1, "component-badge"], [1, "fas", "fa-cube"], ["title", "View Source Code", 1, "btn-icon", 3, "click"], ["title", "Copy Code", 1, "btn-icon"], [1, "component-content-container"], [1, "component-preview"], [2, "width", "100%", "height", "100%", 3, "ngModel", "language", "readonly"], ["title", "Copy Code", 1, "btn-icon", 3, "click"], [1, "fas", "fa-copy"], [1, "error-state"], [1, "fas", "fa-exclamation-triangle"], [3, "component"], [3, "componentEvent", "stateChange", "openEntityRecord", "component"], [1, "fas", "fa-exclamation-circle"], [2, "width", "100%", "height", "100%", 3, "ngModelChange", "ngModel", "language", "readonly"]], template: function ComponentArtifactViewerComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 1)(1, "div", 2)(2, "div", 3);
+            i0.ɵɵelement(3, "i", 4);
+            i0.ɵɵtext(4, " Interactive Component ");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(5, "button", 5);
+            i0.ɵɵlistener("click", function ComponentArtifactViewerComponent_Template_button_click_5_listener() { return ctx.viewMode = ctx.viewMode === "preview" ? "source" : "preview"; });
+            i0.ɵɵelement(6, "i");
+            i0.ɵɵtext(7);
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(8, ComponentArtifactViewerComponent_Conditional_8_Template, 3, 0, "button", 6);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(9, "div", 7);
+            i0.ɵɵtemplate(10, ComponentArtifactViewerComponent_Conditional_10_Template, 3, 1, "div", 8)(11, ComponentArtifactViewerComponent_Conditional_11_Template, 1, 3, "mj-code-editor", 9);
+            i0.ɵɵelementEnd()();
+        } if (rf & 2) {
+            i0.ɵɵproperty("ngClass", ctx.cssClass);
+            i0.ɵɵadvance(6);
+            i0.ɵɵclassMap(ctx.viewMode === "preview" ? "fas fa-code" : "fas fa-eye");
+            i0.ɵɵadvance();
+            i0.ɵɵtextInterpolate1(" ", ctx.viewMode === "preview" ? "Source" : "Preview", " ");
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.viewMode === "source" ? 8 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.viewMode === "preview" ? 10 : 11);
+        } }, dependencies: [i2.NgClass, i3.NgControlStatus, i3.NgModel, i4.CodeEditorComponent, i1.MJReactComponent], styles: [".component-artifact-viewer[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      height: 100%;\n    }\n\n    .component-toolbar[_ngcontent-%COMP%] {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 8px;\n      background: #f5f5f5;\n      border-bottom: 1px solid #ddd;\n      gap: 8px;\n    }\n\n    .component-badge[_ngcontent-%COMP%] {\n      padding: 6px 12px;\n      background: #28a745;\n      color: white;\n      border-radius: 12px;\n      font-size: 11px;\n      font-weight: 600;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .btn-icon[_ngcontent-%COMP%] {\n      padding: 6px 12px;\n      background: white;\n      border: 1px solid #ccc;\n      border-radius: 4px;\n      cursor: pointer;\n      font-size: 12px;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .btn-icon[_ngcontent-%COMP%]:hover {\n      background: #e9ecef;\n      border-color: #999;\n    }\n\n    .component-content-container[_ngcontent-%COMP%] {\n      flex: 1;\n      overflow: auto;\n    }\n\n    .component-preview[_ngcontent-%COMP%] {\n      padding: 20px;\n      background: white;\n      height: 100%;\n      overflow: auto;\n    }\n\n    .error-state[_ngcontent-%COMP%] {\n      padding: 20px;\n      text-align: center;\n      color: #dc3545;\n    }\n\n    .error-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n      font-size: 48px;\n      margin-bottom: 16px;\n    }\n\n    .error-state[_ngcontent-%COMP%]   h3[_ngcontent-%COMP%] {\n      margin: 0 0 12px;\n      font-size: 20px;\n      font-weight: 600;\n    }\n\n    .error-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n      margin: 0 0 12px;\n      color: #6c757d;\n    }\n\n    .error-state[_ngcontent-%COMP%]   details[_ngcontent-%COMP%] {\n      margin-top: 16px;\n      text-align: left;\n      background: #f8f9fa;\n      padding: 12px;\n      border-radius: 4px;\n    }\n\n    .error-state[_ngcontent-%COMP%]   summary[_ngcontent-%COMP%] {\n      cursor: pointer;\n      font-weight: 600;\n      color: #495057;\n    }\n\n    .error-state[_ngcontent-%COMP%]   pre[_ngcontent-%COMP%] {\n      margin-top: 8px;\n      white-space: pre-wrap;\n      word-wrap: break-word;\n      font-size: 12px;\n      color: #212529;\n    }"] });
+};
+ComponentArtifactViewerComponent = __decorate([
+    RegisterClass(BaseArtifactViewerPluginComponent, 'ComponentArtifactViewerPlugin')
+], ComponentArtifactViewerComponent);
+export { ComponentArtifactViewerComponent };
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ComponentArtifactViewerComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-component-artifact-viewer', template: `
+    <div class="component-artifact-viewer" [ngClass]="cssClass">
+      <div class="component-toolbar">
+        <div class="component-badge">
+          <i class="fas fa-cube"></i> Interactive Component
+        </div>
+        <button class="btn-icon" title="View Source Code" (click)="viewMode = viewMode === 'preview' ? 'source' : 'preview'">
+          <i [class]="viewMode === 'preview' ? 'fas fa-code' : 'fas fa-eye'"></i>
+          {{ viewMode === 'preview' ? 'Source' : 'Preview' }}
+        </button>
+        @if (viewMode === 'source') {
+          <button class="btn-icon" title="Copy Code" (click)="onCopy()">
+            <i class="fas fa-copy"></i> Copy
+          </button>
+        }
+      </div>
+      <div class="component-content-container">
+        @if (viewMode === 'preview') {
+          <div class="component-preview">
+            @if (hasError) {
+              <div class="error-state">
+                <i class="fas fa-exclamation-triangle"></i>
+                <h3>Component Error</h3>
+                <p>{{ errorMessage }}</p>
+                @if (errorDetails) {
+                  <details>
+                    <summary>Technical Details</summary>
+                    <pre>{{ errorDetails }}</pre>
+                  </details>
+                }
+              </div>
+            } @else {
+              @if (component) {
+                <mj-react-component
+                  #reactComponent
+                  [component]="component"
+                  (componentEvent)="onComponentEvent($event)"
+                  (stateChange)="onStateChange($event)"
+                  (openEntityRecord)="onOpenEntityRecord($event)">
+                </mj-react-component>
+              }
+              @else {
+                <div class="error-state">
+                  <i class="fas fa-exclamation-circle"></i>
+                  <h3>No Component Loaded</h3>
+                  <p>The component data is missing or invalid.</p>
+                </div>
+              }
+            }
+          </div>
+        } @else {
+          <mj-code-editor
+            [(ngModel)]="componentCode"
+            [language]="'typescript'"
+            [readonly]="readonly"
+            style="width: 100%; height: 100%;">
+          </mj-code-editor>
+        }
+      </div>
+    </div>
+  `, styles: ["\n    .component-artifact-viewer {\n      display: flex;\n      flex-direction: column;\n      height: 100%;\n    }\n\n    .component-toolbar {\n      display: flex;\n      justify-content: space-between;\n      align-items: center;\n      padding: 8px;\n      background: #f5f5f5;\n      border-bottom: 1px solid #ddd;\n      gap: 8px;\n    }\n\n    .component-badge {\n      padding: 6px 12px;\n      background: #28a745;\n      color: white;\n      border-radius: 12px;\n      font-size: 11px;\n      font-weight: 600;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .btn-icon {\n      padding: 6px 12px;\n      background: white;\n      border: 1px solid #ccc;\n      border-radius: 4px;\n      cursor: pointer;\n      font-size: 12px;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .btn-icon:hover {\n      background: #e9ecef;\n      border-color: #999;\n    }\n\n    .component-content-container {\n      flex: 1;\n      overflow: auto;\n    }\n\n    .component-preview {\n      padding: 20px;\n      background: white;\n      height: 100%;\n      overflow: auto;\n    }\n\n    .error-state {\n      padding: 20px;\n      text-align: center;\n      color: #dc3545;\n    }\n\n    .error-state i {\n      font-size: 48px;\n      margin-bottom: 16px;\n    }\n\n    .error-state h3 {\n      margin: 0 0 12px;\n      font-size: 20px;\n      font-weight: 600;\n    }\n\n    .error-state p {\n      margin: 0 0 12px;\n      color: #6c757d;\n    }\n\n    .error-state details {\n      margin-top: 16px;\n      text-align: left;\n      background: #f8f9fa;\n      padding: 12px;\n      border-radius: 4px;\n    }\n\n    .error-state summary {\n      cursor: pointer;\n      font-weight: 600;\n      color: #495057;\n    }\n\n    .error-state pre {\n      margin-top: 8px;\n      white-space: pre-wrap;\n      word-wrap: break-word;\n      font-size: 12px;\n      color: #212529;\n    }\n  "] }]
+    }], () => [{ type: i1.AngularAdapterService }], { reactComponent: [{
+            type: ViewChild,
+            args: ['reactComponent']
+        }] }); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ComponentArtifactViewerComponent, { className: "ComponentArtifactViewerComponent", filePath: "src/lib/components/plugins/component-artifact-viewer.component.ts", lineNumber: 177 }); })();
+//# sourceMappingURL=component-artifact-viewer.component.js.map

package/dist/lib/components/plugins/component-artifact-viewer.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"component-artifact-viewer.component.js","sourceRoot":"","sources":["../../../../src/lib/components/plugins/component-artifact-viewer.component.ts"],"names":[],"mappings":"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"}

package/dist/lib/components/plugins/html-artifact-viewer.component.d.ts

@@ -0,0 +1,18 @@
+import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
+import { BaseArtifactViewerPluginComponent } from '../base-artifact-viewer.component';
+import * as i0 from "@angular/core";
+/**
+ * Viewer component for HTML artifacts
+ */
+export declare class HtmlArtifactViewerComponent extends BaseArtifactViewerPluginComponent {
+    private sanitizer;
+    htmlContent: string;
+    safeHtmlContent: SafeHtml;
+    viewMode: 'preview' | 'source';
+    constructor(sanitizer: DomSanitizer);
+    ngOnInit(): void;
+    onCopy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<HtmlArtifactViewerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<HtmlArtifactViewerComponent, "mj-html-artifact-viewer", never, {}, {}, never, never, false, never>;
+}
+//# sourceMappingURL=html-artifact-viewer.component.d.ts.map

package/dist/lib/components/plugins/html-artifact-viewer.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"html-artifact-viewer.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/plugins/html-artifact-viewer.component.ts"],"names":[],"mappings":"AACA,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEnE,OAAO,EAAE,iCAAiC,EAAE,MAAM,mCAAmC,CAAC;;AAEtF;;GAEG;AACH,qBAuFa,2BAA4B,SAAQ,iCAAiC;IAKpE,OAAO,CAAC,SAAS;IAJtB,WAAW,SAAM;IACjB,eAAe,EAAE,QAAQ,CAAM;IAC/B,QAAQ,EAAE,SAAS,GAAG,QAAQ,CAAa;gBAE9B,SAAS,EAAE,YAAY;IAI3C,QAAQ,IAAI,IAAI;IAKhB,MAAM,IAAI,IAAI;yCAdH,2BAA2B;2CAA3B,2BAA2B;CAuBvC"}

package/dist/lib/components/plugins/html-artifact-viewer.component.js

@@ -0,0 +1,128 @@
+var __decorate = (this && this.__decorate) || function (decorators, target, key, desc) {
+    var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+    if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+    else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+    return c > 3 && r && Object.defineProperty(target, key, r), r;
+};
+import { Component } from '@angular/core';
+import { RegisterClass } from '@memberjunction/global';
+import { BaseArtifactViewerPluginComponent } from '../base-artifact-viewer.component';
+import * as i0 from "@angular/core";
+import * as i1 from "@angular/platform-browser";
+import * as i2 from "@angular/common";
+import * as i3 from "@angular/forms";
+import * as i4 from "@memberjunction/ng-code-editor";
+function HtmlArtifactViewerComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 9);
+    i0.ɵɵelement(1, "div", 11);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("innerHTML", ctx_r0.safeHtmlContent, i0.ɵɵsanitizeHtml);
+} }
+function HtmlArtifactViewerComponent_Conditional_13_Template(rf, ctx) { if (rf & 1) {
+    const _r2 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "mj-code-editor", 12);
+    i0.ɵɵtwoWayListener("ngModelChange", function HtmlArtifactViewerComponent_Conditional_13_Template_mj_code_editor_ngModelChange_0_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r0.htmlContent, $event) || (ctx_r0.htmlContent = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r0.htmlContent);
+    i0.ɵɵproperty("language", "html")("readonly", ctx_r0.readonly);
+} }
+/**
+ * Viewer component for HTML artifacts
+ */
+let HtmlArtifactViewerComponent = class HtmlArtifactViewerComponent extends BaseArtifactViewerPluginComponent {
+    sanitizer;
+    htmlContent = '';
+    safeHtmlContent = '';
+    viewMode = 'preview';
+    constructor(sanitizer) {
+        super();
+        this.sanitizer = sanitizer;
+    }
+    ngOnInit() {
+        this.htmlContent = this.getContent();
+        this.safeHtmlContent = this.sanitizer.sanitize(1, this.htmlContent) || '';
+    }
+    onCopy() {
+        if (this.htmlContent) {
+            navigator.clipboard.writeText(this.htmlContent).then(() => {
+                console.log('✅ Copied HTML to clipboard');
+            }).catch(err => {
+                console.error('Failed to copy to clipboard:', err);
+            });
+        }
+    }
+    static ɵfac = function HtmlArtifactViewerComponent_Factory(t) { return new (t || HtmlArtifactViewerComponent)(i0.ɵɵdirectiveInject(i1.DomSanitizer)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: HtmlArtifactViewerComponent, selectors: [["mj-html-artifact-viewer"]], features: [i0.ɵɵInheritDefinitionFeature], decls: 14, vars: 6, consts: [[1, "html-artifact-viewer", 3, "ngClass"], [1, "html-toolbar"], ["title", "Preview", 1, "btn-icon", 3, "click"], [1, "fas", "fa-eye"], ["title", "Source", 1, "btn-icon", 3, "click"], [1, "fas", "fa-code"], ["title", "Copy HTML", 1, "btn-icon", 3, "click"], [1, "fas", "fa-copy"], [1, "html-content-container"], [1, "html-preview"], [2, "width", "100%", "height", "100%", 3, "ngModel", "language", "readonly"], [3, "innerHTML"], [2, "width", "100%", "height", "100%", 3, "ngModelChange", "ngModel", "language", "readonly"]], template: function HtmlArtifactViewerComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div", 0)(1, "div", 1)(2, "button", 2);
+            i0.ɵɵlistener("click", function HtmlArtifactViewerComponent_Template_button_click_2_listener() { return ctx.viewMode = "preview"; });
+            i0.ɵɵelement(3, "i", 3);
+            i0.ɵɵtext(4, " Preview ");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(5, "button", 4);
+            i0.ɵɵlistener("click", function HtmlArtifactViewerComponent_Template_button_click_5_listener() { return ctx.viewMode = "source"; });
+            i0.ɵɵelement(6, "i", 5);
+            i0.ɵɵtext(7, " Source ");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(8, "button", 6);
+            i0.ɵɵlistener("click", function HtmlArtifactViewerComponent_Template_button_click_8_listener() { return ctx.onCopy(); });
+            i0.ɵɵelement(9, "i", 7);
+            i0.ɵɵtext(10, " Copy ");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(11, "div", 8);
+            i0.ɵɵtemplate(12, HtmlArtifactViewerComponent_Conditional_12_Template, 2, 1, "div", 9)(13, HtmlArtifactViewerComponent_Conditional_13_Template, 1, 3, "mj-code-editor", 10);
+            i0.ɵɵelementEnd()();
+        } if (rf & 2) {
+            i0.ɵɵproperty("ngClass", ctx.cssClass);
+            i0.ɵɵadvance(2);
+            i0.ɵɵclassProp("active", ctx.viewMode === "preview");
+            i0.ɵɵadvance(3);
+            i0.ɵɵclassProp("active", ctx.viewMode === "source");
+            i0.ɵɵadvance(7);
+            i0.ɵɵconditional(ctx.viewMode === "preview" ? 12 : 13);
+        } }, dependencies: [i2.NgClass, i3.NgControlStatus, i3.NgModel, i4.CodeEditorComponent], styles: [".html-artifact-viewer[_ngcontent-%COMP%] {\n      display: flex;\n      flex-direction: column;\n      height: 100%;\n    }\n\n    .html-toolbar[_ngcontent-%COMP%] {\n      display: flex;\n      justify-content: flex-end;\n      align-items: center;\n      gap: 8px;\n      padding: 8px;\n      background: #f5f5f5;\n      border-bottom: 1px solid #ddd;\n    }\n\n    .btn-icon[_ngcontent-%COMP%] {\n      padding: 6px 12px;\n      background: white;\n      border: 1px solid #ccc;\n      border-radius: 4px;\n      cursor: pointer;\n      font-size: 12px;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .btn-icon[_ngcontent-%COMP%]:hover {\n      background: #e9ecef;\n      border-color: #999;\n    }\n\n    .btn-icon.active[_ngcontent-%COMP%] {\n      background: #007acc;\n      color: white;\n      border-color: #007acc;\n    }\n\n    .html-content-container[_ngcontent-%COMP%] {\n      flex: 1;\n      overflow: auto;\n    }\n\n    .html-preview[_ngcontent-%COMP%] {\n      padding: 20px;\n      background: white;\n      height: 100%;\n      overflow: auto;\n    }"] });
+};
+HtmlArtifactViewerComponent = __decorate([
+    RegisterClass(BaseArtifactViewerPluginComponent, 'HtmlArtifactViewerPlugin')
+], HtmlArtifactViewerComponent);
+export { HtmlArtifactViewerComponent };
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(HtmlArtifactViewerComponent, [{
+        type: Component,
+        args: [{ selector: 'mj-html-artifact-viewer', template: `
+    <div class="html-artifact-viewer" [ngClass]="cssClass">
+      <div class="html-toolbar">
+        <button class="btn-icon" [class.active]="viewMode === 'preview'"
+                title="Preview" (click)="viewMode = 'preview'">
+          <i class="fas fa-eye"></i> Preview
+        </button>
+        <button class="btn-icon" [class.active]="viewMode === 'source'"
+                title="Source" (click)="viewMode = 'source'">
+          <i class="fas fa-code"></i> Source
+        </button>
+        <button class="btn-icon" title="Copy HTML" (click)="onCopy()">
+          <i class="fas fa-copy"></i> Copy
+        </button>
+      </div>
+      <div class="html-content-container">
+        @if (viewMode === 'preview') {
+          <div class="html-preview">
+            <div [innerHTML]="safeHtmlContent"></div>
+          </div>
+        } @else {
+          <mj-code-editor
+            [(ngModel)]="htmlContent"
+            [language]="'html'"
+            [readonly]="readonly"
+            style="width: 100%; height: 100%;">
+          </mj-code-editor>
+        }
+      </div>
+    </div>
+  `, styles: ["\n    .html-artifact-viewer {\n      display: flex;\n      flex-direction: column;\n      height: 100%;\n    }\n\n    .html-toolbar {\n      display: flex;\n      justify-content: flex-end;\n      align-items: center;\n      gap: 8px;\n      padding: 8px;\n      background: #f5f5f5;\n      border-bottom: 1px solid #ddd;\n    }\n\n    .btn-icon {\n      padding: 6px 12px;\n      background: white;\n      border: 1px solid #ccc;\n      border-radius: 4px;\n      cursor: pointer;\n      font-size: 12px;\n      display: flex;\n      align-items: center;\n      gap: 6px;\n    }\n\n    .btn-icon:hover {\n      background: #e9ecef;\n      border-color: #999;\n    }\n\n    .btn-icon.active {\n      background: #007acc;\n      color: white;\n      border-color: #007acc;\n    }\n\n    .html-content-container {\n      flex: 1;\n      overflow: auto;\n    }\n\n    .html-preview {\n      padding: 20px;\n      background: white;\n      height: 100%;\n      overflow: auto;\n    }\n  "] }]
+    }], () => [{ type: i1.DomSanitizer }], null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(HtmlArtifactViewerComponent, { className: "HtmlArtifactViewerComponent", filePath: "src/lib/components/plugins/html-artifact-viewer.component.ts", lineNumber: 96 }); })();
+//# sourceMappingURL=html-artifact-viewer.component.js.map

package/dist/lib/components/plugins/html-artifact-viewer.component.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"html-artifact-viewer.component.js","sourceRoot":"","sources":["../../../../src/lib/components/plugins/html-artifact-viewer.component.ts"],"names":[],"mappings":";;;;;;AAAA,OAAO,EAAE,SAAS,EAAE,MAAM,eAAe,CAAC;AAE1C,OAAO,EAAE,aAAa,EAAE,MAAM,wBAAwB,CAAC;AACvD,OAAO,EAAE,iCAAiC,EAAE,MAAM,mCAAmC,CAAC;;;;;;;IAwB5E,8BAA0B;IACxB,0BAAyC;IAC3C,iBAAM;;;IADC,cAA6B;IAA7B,qEAA6B;;;;IAGpC,0CAIqC;IAHnC,mUAAyB;IAI3B,iBAAiB;;;IAJf,kDAAyB;IAEzB,AADA,iCAAmB,6BACE;;AA7BjC;;GAEG;AAwFI,IAAM,2BAA2B,GAAjC,MAAM,2BAA4B,SAAQ,iCAAiC;IAK5D;IAJb,WAAW,GAAG,EAAE,CAAC;IACjB,eAAe,GAAa,EAAE,CAAC;IAC/B,QAAQ,GAAyB,SAAS,CAAC;IAElD,YAAoB,SAAuB;QACzC,KAAK,EAAE,CAAC;QADU,cAAS,GAAT,SAAS,CAAc;IAE3C,CAAC;IAED,QAAQ;QACN,IAAI,CAAC,WAAW,GAAG,IAAI,CAAC,UAAU,EAAE,CAAC;QACrC,IAAI,CAAC,eAAe,GAAG,IAAI,CAAC,SAAS,CAAC,QAAQ,CAAC,CAAC,EAAE,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;IAC5E,CAAC;IAED,MAAM;QACJ,IAAI,IAAI,CAAC,WAAW,EAAE,CAAC;YACrB,SAAS,CAAC,SAAS,CAAC,SAAS,CAAC,IAAI,CAAC,WAAW,CAAC,CAAC,IAAI,CAAC,GAAG,EAAE;gBACxD,OAAO,CAAC,GAAG,CAAC,4BAA4B,CAAC,CAAC;YAC5C,CAAC,CAAC,CAAC,KAAK,CAAC,GAAG,CAAC,EAAE;gBACb,OAAO,CAAC,KAAK,CAAC,8BAA8B,EAAE,GAAG,CAAC,CAAC;YACrD,CAAC,CAAC,CAAC;QACL,CAAC;IACH,CAAC;qFAtBU,2BAA2B;6DAA3B,2BAA2B;YAlFhC,AADF,AADF,8BAAuD,aAC3B,gBAE+B;YAA/B,uHAAoB,SAAS,IAAC;YACpD,uBAA0B;YAAC,yBAC7B;YAAA,iBAAS;YACT,iCACqD;YAA9B,uHAAoB,QAAQ,IAAC;YAClD,uBAA2B;YAAC,wBAC9B;YAAA,iBAAS;YACT,iCAA8D;YAAnB,wGAAS,YAAQ,IAAC;YAC3D,uBAA2B;YAAC,uBAC9B;YACF,AADE,iBAAS,EACL;YACN,+BAAoC;YAKhC,AAJF,sFAA8B,qFAIrB;YASb,AADE,iBAAM,EACF;;YA5B4B,sCAAoB;YAEzB,eAAuC;YAAvC,oDAAuC;YAIvC,eAAsC;YAAtC,mDAAsC;YAS/D,eAWC;YAXD,sDAWC;;;AA0DI,2BAA2B;IADvC,aAAa,CAAC,iCAAiC,EAAE,0BAA0B,CAAC;GAChE,2BAA2B,CAuBvC;;iFAvBY,2BAA2B;cAvFvC,SAAS;2BACE,yBAAyB,YACzB;;;;;;;;;;;;;;;;;;;;;;;;;;;;;;GA8BT;;kFAuDU,2BAA2B"}

package/dist/lib/components/plugins/json-artifact-viewer.component.d.ts

@@ -0,0 +1,37 @@
+import { OnInit, ChangeDetectorRef } from '@angular/core';
+import { DomSanitizer, SafeHtml } from '@angular/platform-browser';
+import { BaseArtifactViewerPluginComponent } from '../base-artifact-viewer.component';
+import * as i0 from "@angular/core";
+/**
+ * Viewer component for JSON artifacts.
+ * Supports extract rules - shows displayMarkdown, displayHtml, or raw JSON editor (in that priority order).
+ * All content is displayed in the parent's Display tab.
+ */
+export declare class JsonArtifactViewerComponent extends BaseArtifactViewerPluginComponent implements OnInit {
+    private cdr;
+    private sanitizer;
+    jsonContent: string;
+    displayMarkdown: string | null;
+    displayHtml: string | null;
+    renderedMarkdown: SafeHtml | null;
+    private versionAttributes;
+    constructor(cdr: ChangeDetectorRef, sanitizer: DomSanitizer);
+    ngOnInit(): Promise<void>;
+    /**
+     * Override to return true when showing extracted displayMarkdown or displayHtml.
+     * Returns false when showing raw JSON editor (no extract rules available).
+     */
+    get isShowingElevatedDisplay(): boolean;
+    /**
+     * Override to tell parent whether to show raw JSON tab.
+     * When showing elevated display (markdown/HTML), return true so parent shows JSON tab.
+     * When showing raw JSON editor, return false (no need for duplicate JSON tab).
+     */
+    get parentShouldShowRawContent(): boolean;
+    private loadVersionAttributes;
+    private parseAttributeValue;
+    onCopy(): void;
+    static ɵfac: i0.ɵɵFactoryDeclaration<JsonArtifactViewerComponent, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<JsonArtifactViewerComponent, "mj-json-artifact-viewer", never, {}, {}, never, never, false, never>;
+}
+//# sourceMappingURL=json-artifact-viewer.component.d.ts.map

package/dist/lib/components/plugins/json-artifact-viewer.component.d.ts.map

@@ -0,0 +1 @@
+{"version":3,"file":"json-artifact-viewer.component.d.ts","sourceRoot":"","sources":["../../../../src/lib/components/plugins/json-artifact-viewer.component.ts"],"names":[],"mappings":"AAAA,OAAO,EAAa,MAAM,EAAE,iBAAiB,EAAE,MAAM,eAAe,CAAC;AACrE,OAAO,EAAE,YAAY,EAAE,QAAQ,EAAE,MAAM,2BAA2B,CAAC;AAEnE,OAAO,EAAE,iCAAiC,EAAE,MAAM,mCAAmC,CAAC;;AAKtF;;;;GAIG;AACH,qBAuFa,2BAA4B,SAAQ,iCAAkC,YAAW,MAAM;IAQhG,OAAO,CAAC,GAAG;IACX,OAAO,CAAC,SAAS;IARZ,WAAW,SAAM;IACjB,eAAe,EAAE,MAAM,GAAG,IAAI,CAAQ;IACtC,WAAW,EAAE,MAAM,GAAG,IAAI,CAAQ;IAClC,gBAAgB,EAAE,QAAQ,GAAG,IAAI,CAAQ;IAChD,OAAO,CAAC,iBAAiB,CAAwC;gBAGvD,GAAG,EAAE,iBAAiB,EACtB,SAAS,EAAE,YAAY;IAK3B,QAAQ,IAAI,OAAO,CAAC,IAAI,CAAC;IAU/B;;;OAGG;IACH,IAAoB,wBAAwB,IAAI,OAAO,CAEtD;IAED;;;;OAIG;IACH,IAAoB,0BAA0B,IAAI,OAAO,CAExD;YAEa,qBAAqB;IAyDnC,OAAO,CAAC,mBAAmB;IAgB3B,MAAM,IAAI,IAAI;yCAlHH,2BAA2B;2CAA3B,2BAA2B;CA6HvC"}