@memberjunction/ng-artifacts 5.36.0 → 5.38.0

package/dist/lib/components/artifact-type-plugin-viewer.component.js

@@ -64,6 +64,13 @@ export class ArtifactTypePluginViewerComponent extends BaseAngularComponent {
     navigationRequest = new EventEmitter();
     pluginLoaded = new EventEmitter();
     tabsChanged = new EventEmitter();
+    /**
+     * Bubbled up from the component-artifact-viewer's form-aware branch when
+     * the user clicks "Apply to my form". Carries the spec + entity so the
+     * consumer (chat message card, conversation host) can invoke the
+     * Create-or-Modify Interactive Form action behind a confirmation dialog.
+     */
+    applyFormRequested = new EventEmitter();
     viewerContainer;
     isLoading = true;
     error = null;
@@ -184,6 +191,14 @@ export class ArtifactTypePluginViewerComponent extends BaseAngularComponent {
                     this.tabsChanged.emit();
                 });
             }
+            // Subscribe to the form-aware "Apply to my form" event when the
+            // underlying plugin is a component-artifact-viewer rendering a
+            // form-role spec. Other plugin types don't have this output.
+            if (componentInstance.applyFormRequested) {
+                componentInstance.applyFormRequested.subscribe((event) => {
+                    this.applyFormRequested.emit(event);
+                });
+            }
             // Trigger change detection
             this.componentRef.changeDetectorRef.detectChanges();
             this.isLoading = false;
@@ -303,7 +318,7 @@ export class ArtifactTypePluginViewerComponent extends BaseAngularComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.viewerContainer = _t.first);
-        } }, inputs: { artifactVersion: "artifactVersion", artifactTypeName: "artifactTypeName", contentType: "contentType", height: "height", readonly: "readonly", cssClass: "cssClass" }, outputs: { openEntityRecord: "openEntityRecord", navigationRequest: "navigationRequest", pluginLoaded: "pluginLoaded", tabsChanged: "tabsChanged" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 5, vars: 2, consts: [["viewerContainer", ""], [1, "artifact-type-plugin-viewer"], [1, "loading-state"], [1, "error-state"], [1, "fas", "fa-spinner", "fa-spin"], [1, "fas", "fa-exclamation-triangle"], [1, "error-title"], [1, "error-details"], [1, "error-tech-details"]], template: function ArtifactTypePluginViewerComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { artifactVersion: "artifactVersion", artifactTypeName: "artifactTypeName", contentType: "contentType", height: "height", readonly: "readonly", cssClass: "cssClass" }, outputs: { openEntityRecord: "openEntityRecord", navigationRequest: "navigationRequest", pluginLoaded: "pluginLoaded", tabsChanged: "tabsChanged", applyFormRequested: "applyFormRequested" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 5, vars: 2, consts: [["viewerContainer", ""], [1, "artifact-type-plugin-viewer"], [1, "loading-state"], [1, "error-state"], [1, "fas", "fa-spinner", "fa-spin"], [1, "fas", "fa-exclamation-triangle"], [1, "error-title"], [1, "error-details"], [1, "error-tech-details"]], template: function ArtifactTypePluginViewerComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 1);
             i0.ɵɵconditionalCreate(1, ArtifactTypePluginViewerComponent_Conditional_1_Template, 4, 0, "div", 2);
             i0.ɵɵconditionalCreate(2, ArtifactTypePluginViewerComponent_Conditional_2_Template, 6, 3, "div", 3);
@@ -361,6 +376,8 @@ export class ArtifactTypePluginViewerComponent extends BaseAngularComponent {
             type: Output
         }], tabsChanged: [{
             type: Output
+        }], applyFormRequested: [{
+            type: Output
         }], viewerContainer: [{
             type: ViewChild,
             args: ['viewerContainer', { read: ViewContainerRef, static: true }]

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

@@ -1 +1 @@
-{"version":3,"file":"artifact-type-plugin-viewer.component.js","sourceRoot":"","sources":["../../../src/lib/components/artifact-type-plugin-viewer.component.ts"],"names":[],"mappings":"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","sourcesContent":["import {\n  Component,\n  Input,\n  Output,\n  EventEmitter,\n  OnInit,\n  OnChanges,\n  SimpleChanges,\n  ViewChild,\n  ViewContainerRef,\n  ComponentRef,\n  Type\n} from '@angular/core';\nimport { MJArtifactVersionEntity, MJArtifactTypeEntity, ArtifactMetadataEngine } from '@memberjunction/core-entities';\nimport { BaseAngularComponent } from '@memberjunction/ng-base-types';\nimport { Metadata, LogError, RunView, CompositeKey } from '@memberjunction/core';\nimport { MJGlobal } from '@memberjunction/global';\nimport { IArtifactViewerComponent } from '../interfaces/artifact-viewer-plugin.interface';\nimport { BaseArtifactViewerPluginComponent, NavigationRequest } from './base-artifact-viewer.component';\n\n/**\n * Artifact type plugin viewer that loads the appropriate plugin based on the artifact's DriverClass.\n * Uses MJGlobal.Instance.ClassFactory.CreateInstance() to dynamically load viewer plugins.\n */\n@Component({\n  standalone: false,\n  selector: 'mj-artifact-type-plugin-viewer',\n  template: `\n    <div class=\"artifact-type-plugin-viewer\">\n      @if (isLoading) {\n        <div class=\"loading-state\">\n          <i class=\"fas fa-spinner fa-spin\"></i>\n          <span>Loading artifact viewer...</span>\n        </div>\n      }\n      @if (error) {\n        <div class=\"error-state\">\n          <i class=\"fas fa-exclamation-triangle\"></i>\n          @if (errorTitle) {\n            <div class=\"error-title\">{{ errorTitle }}</div>\n          }\n          <div class=\"error-details\">{{ error }}</div>\n          @if (errorDetails) {\n            <div class=\"error-tech-details\">{{ errorDetails }}</div>\n          }\n        </div>\n      }\n      <ng-container #viewerContainer></ng-container>\n    </div>\n  `,\n  styles: [`\n    .artifact-type-plugin-viewer {\n      width: 100%;\n      height: 100%;\n      display: flex;\n      flex-direction: column;\n    }\n\n    .artifact-type-plugin-viewer ::ng-deep > * {\n      flex: 1;\n      min-height: 0;\n    }\n\n    .loading-state,\n    .error-state {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      padding: 40px;\n      gap: 16px;\n      color: #6c757d;\n      width: 100%;\n      height: 100%;\n      min-height: 200px;\n    }\n\n    .loading-state i {\n      font-size: 32px;\n    }\n\n    .error-state {\n      color: #dc3545;\n      text-align: center;\n      max-width: 600px;\n    }\n\n    .error-state i {\n      font-size: 32px;\n    }\n\n    .error-state .error-title {\n      font-weight: 600;\n      font-size: 16px;\n      margin-bottom: 8px;\n    }\n\n    .error-state .error-details {\n      font-size: 14px;\n      line-height: 1.5;\n      color: #6c757d;\n    }\n\n    .error-state .error-tech-details {\n      margin-top: 12px;\n      padding: 12px;\n      background: #f8f9fa;\n      border-radius: 4px;\n      font-family: monospace;\n      font-size: 12px;\n      color: #495057;\n      word-break: break-word;\n    }\n  `]\n})\nexport class ArtifactTypePluginViewerComponent extends BaseAngularComponent implements OnInit, OnChanges  {\n  @Input() artifactVersion!: MJArtifactVersionEntity;\n  @Input() artifactTypeName!: string;\n  @Input() contentType?: string;\n  @Input() height?: string;\n  @Input() readonly: boolean = true;\n  @Input() cssClass?: string;\n\n  @Output() openEntityRecord = new EventEmitter<{entityName: string; compositeKey: CompositeKey}>();\n  @Output() navigationRequest = new EventEmitter<NavigationRequest>();\n  @Output() pluginLoaded = new EventEmitter<void>();\n  @Output() tabsChanged = new EventEmitter<void>();\n\n  @ViewChild('viewerContainer', { read: ViewContainerRef, static: true })\n  viewerContainer!: ViewContainerRef;\n\n  public isLoading = true;\n  public error: string | null = null;\n  public errorDetails: string | null = null;\n  public errorTitle: string | null = null;\n\n  private componentRef: ComponentRef<any> | null = null;\n\n  /**\n   * Get the loaded plugin instance (if available)\n   */\n  public get pluginInstance(): BaseArtifactViewerPluginComponent | null {\n    return this.componentRef?.instance as BaseArtifactViewerPluginComponent || null;\n  }\n\n  /**\n   * Whether the loaded plugin supports user feedback.\n   * Pass-through to the plugin instance for use by the parent panel wrapper.\n   */\n  public get SupportsFeedback(): boolean {\n    return this.pluginInstance?.SupportsFeedback ?? false;\n  }\n\n  /**\n   * Ask the loaded plugin to show its feedback UX.\n   * Pass-through to the plugin instance, called from the parent panel header.\n   */\n  public AskUserForFeedback(): void {\n    this.pluginInstance?.AskUserForFeedback();\n  }\n\n  async ngOnInit(): Promise<void> {\n    await this.loadViewer();\n  }\n\n  async ngOnChanges(changes: SimpleChanges): Promise<void> {\n    if ((changes['artifactVersion'] || changes['artifactTypeName']) &&\n        !changes['artifactVersion']?.firstChange) {\n      await this.loadViewer();\n    }\n  }\n\n  ngOnDestroy(): void {\n    this.destroyCurrentViewer();\n  }\n\n  /**\n   * Load the appropriate viewer plugin for the artifact\n   */\n  private async loadViewer(): Promise<void> {\n    try {\n      this.isLoading = true;\n      this.error = null;\n      this.errorTitle = null;\n      this.errorDetails = null;\n\n      if (!this.artifactVersion) {\n        this.setError(\n          'Missing Artifact Data',\n          'Unable to display this artifact because the version information is missing.',\n          'artifactVersion is null or undefined'\n        );\n        this.isLoading = false;\n        return;\n      }\n\n      if (!this.artifactTypeName) {\n        this.setError(\n          'Missing Artifact Type',\n          'Unable to display this artifact because the type information is missing.',\n          'artifactTypeName is empty'\n        );\n        this.isLoading = false;\n        return;\n      }\n\n      // Get the artifact type entity to find the DriverClass\n      const artifactType = await this.getArtifactType();\n      if (!artifactType) {\n        this.setError(\n          'Unknown Artifact Type',\n          `The artifact type \"${this.artifactTypeName}\" is not recognized. This might be a custom type that hasn't been properly configured.`,\n          `Artifact type \"${this.artifactTypeName}\" not found in metadata`\n        );\n        this.isLoading = false;\n        return;\n      }\n\n      // Resolve DriverClass by traversing parent hierarchy if needed\n      const driverClass = await this.resolveDriverClass(artifactType);\n      if (!driverClass) {\n        this.setError(\n          'No Viewer Available',\n          `This artifact type (${this.artifactTypeName}) doesn't have a viewer component configured. The artifact content may need to be viewed in the JSON tab.`,\n          `No DriverClass in hierarchy and content is not valid JSON`\n        );\n        this.isLoading = false;\n        return;\n      }\n\n      // Get the component type using MJGlobal ClassFactory\n      // CreateInstance returns the registered component class for the given DriverClass key\n      const tempInstance = await MJGlobal.Instance.ClassFactory.CreateInstanceAsync<BaseArtifactViewerPluginComponent>(\n        BaseArtifactViewerPluginComponent,\n        driverClass\n      );\n\n      if (!tempInstance) {\n        this.setError(\n          'Viewer Component Not Found',\n          `The viewer component \"${driverClass}\" is not registered in the application. This usually means the required package or module hasn't been loaded.`,\n          `Component \"${driverClass}\" not found in ClassFactory registry. Ensure it's registered with @RegisterClass(BaseArtifactViewerPluginComponent, '${driverClass}').`\n        );\n        this.isLoading = false;\n        return;\n      }\n\n      // Get the component type from the instance\n      const componentType = tempInstance.constructor as Type<BaseArtifactViewerPluginComponent>;\n\n      // Destroy previous viewer if exists\n      this.destroyCurrentViewer();\n\n      // Create and configure the viewer component\n      this.componentRef = this.viewerContainer.createComponent(componentType);\n\n      // Set inputs using setInput() which properly triggers ngOnChanges\n      // This is critical for plugins like ComponentArtifactViewerComponent that\n      // need to process the artifactVersion in ngOnChanges before pluginLoaded fires\n      this.componentRef.setInput('artifactVersion', this.artifactVersion);\n      if (this.height !== undefined) {\n        this.componentRef.setInput('height', this.height);\n      }\n      if (this.readonly !== undefined) {\n        this.componentRef.setInput('readonly', this.readonly);\n      }\n      if (this.cssClass !== undefined) {\n        this.componentRef.setInput('cssClass', this.cssClass);\n      }\n      if (this.contentType !== undefined) {\n        this.componentRef.setInput('contentType', this.contentType);\n      }\n\n      // Subscribe to openEntityRecord event if the plugin emits it\n      const componentInstance = this.componentRef.instance;\n      if (componentInstance.openEntityRecord) {\n        componentInstance.openEntityRecord.subscribe((event: {entityName: string; compositeKey: CompositeKey}) => {\n          this.openEntityRecord.emit(event);\n        });\n      }\n\n      // Subscribe to navigationRequest event if the plugin emits it\n      if (componentInstance.navigationRequest) {\n        componentInstance.navigationRequest.subscribe((event: NavigationRequest) => {\n          this.navigationRequest.emit(event);\n        });\n      }\n\n      // Subscribe to tabsChanged event if the plugin emits it (e.g., after async spec loading)\n      if (componentInstance.tabsChanged) {\n        componentInstance.tabsChanged.subscribe(() => {\n          this.tabsChanged.emit();\n        });\n      }\n\n      // Trigger change detection\n      this.componentRef.changeDetectorRef.detectChanges();\n\n      this.isLoading = false;\n\n      // Notify parent that plugin has loaded (for tab selection timing)\n      this.pluginLoaded.emit();\n    } catch (err) {\n      console.error('Error loading artifact viewer:', err);\n      LogError(err);\n      const errorMessage = err instanceof Error ? err.message : String(err);\n      const errorStack = err instanceof Error && err.stack ? err.stack : undefined;\n      this.setError(\n        'Failed to Load Viewer',\n        'An unexpected error occurred while loading the artifact viewer. Please try refreshing the page or contact support if the problem persists.',\n        errorStack || errorMessage\n      );\n      this.isLoading = false;\n    }\n  }\n\n  /**\n   * Set a structured error message with title, user-friendly description, and technical details\n   */\n  private setError(title: string, userMessage: string, technicalDetails: string): void {\n    this.errorTitle = title;\n    this.error = userMessage;\n    this.errorDetails = technicalDetails;\n  }\n\n  /**\n   * Get the artifact type entity for the current artifact using the cached ArtifactMetadataEngine\n   */\n  private async getArtifactType(): Promise<MJArtifactTypeEntity | null> {\n    try {\n      // Use the cached metadata engine instead of querying the database\n      const artifactType = ArtifactMetadataEngine.Instance.FindArtifactType(this.artifactTypeName);\n      return artifactType || null;\n    } catch (err) {\n      console.error('Error loading artifact type:', err);\n      return null;\n    }\n  }\n\n  /**\n   * Resolves the DriverClass for an artifact type by traversing up the parent hierarchy.\n   * Falls back to JSON viewer if content is valid JSON and no DriverClass is found.\n   *\n   * @param artifactType The artifact type to resolve the DriverClass for\n   * @returns The DriverClass string, or null if none found and no JSON fallback available\n   */\n  private async resolveDriverClass(artifactType: MJArtifactTypeEntity): Promise<string | null> {\n    // Check if current artifact type has a DriverClass\n    if (artifactType.DriverClass) {\n      console.log(`✅ Found DriverClass '${artifactType.DriverClass}' on artifact type '${artifactType.Name}'`);\n      return artifactType.DriverClass;\n    }\n\n    // No DriverClass on current type - check if it has a parent\n    if (artifactType.ParentID) {\n      console.log(`🔍 No DriverClass on '${artifactType.Name}', checking parent...`);\n      const parentType = await this.getArtifactTypeById(artifactType.ParentID);\n\n      if (parentType) {\n        // Recursively check parent\n        return await this.resolveDriverClass(parentType);\n      } else {\n        console.warn(`⚠️ Parent artifact type '${artifactType.ParentID}' not found`);\n      }\n    }\n\n    // Reached root with no DriverClass - check for JSON fallback\n    console.log(`📄 No DriverClass found in hierarchy for '${artifactType.Name}', checking JSON fallback...`);\n    return this.checkJsonFallback();\n  }\n\n  /**\n   * Loads an artifact type by ID\n   */\n  private async getArtifactTypeById(id: string): Promise<MJArtifactTypeEntity | null> {\n    try {\n      const md = this.ProviderToUse;\n      const artifactType = await md.GetEntityObject<MJArtifactTypeEntity>('MJ: Artifact Types');\n      const loaded = await artifactType.Load(id);\n\n      if (loaded) {\n        return artifactType;\n      }\n\n      return null;\n    } catch (err) {\n      console.error('Error loading artifact type by ID:', err);\n      return null;\n    }\n  }\n\n  /**\n   * Checks if the artifact content is valid JSON and returns the JSON viewer plugin if so\n   */\n  private checkJsonFallback(): string | null {\n    if (!this.artifactVersion || !this.artifactVersion.Content) {\n      console.log('❌ No content available for JSON fallback');\n      return null;\n    }\n\n    try {\n      // Try to parse the content as JSON\n      JSON.parse(this.artifactVersion.Content);\n      console.log('✅ Content is valid JSON, using JsonArtifactViewerPlugin as fallback');\n      return 'JsonArtifactViewerPlugin';\n    } catch {\n      console.log('❌ Content is not valid JSON, no fallback available');\n      return null;\n    }\n  }\n\n  /**\n   * Destroy the current viewer component\n   */\n  private destroyCurrentViewer(): void {\n    if (this.componentRef) {\n      this.componentRef.destroy();\n      this.componentRef = null;\n    }\n    this.viewerContainer.clear();\n  }\n}\n"]}
+{"version":3,"file":"artifact-type-plugin-viewer.component.js","sourceRoot":"","sources":["../../../src/lib/components/artifact-type-plugin-viewer.component.ts"],"names":[],"mappings":"AAAA,OAAO,EACL,SAAS,EACT,KAAK,EACL,MAAM,EACN,YAAY,EAIZ,SAAS,EACT,gBAAgB,EAGjB,MAAM,eAAe,CAAC;AACvB,OAAO,EAAiD,sBAAsB,EAAE,MAAM,+BAA+B,CAAC;AACtH,OAAO,EAAE,oBAAoB,EAAE,MAAM,+BAA+B,CAAC;AACrE,OAAO,EAAY,QAAQ,EAAyB,MAAM,sBAAsB,CAAC;AACjF,OAAO,EAAE,QAAQ,EAAE,MAAM,wBAAwB,CAAC;AAElD,OAAO,EAAE,iCAAiC,EAAqB,MAAM,kCAAkC,CAAC;;;;IAYhG,8BAA2B;IACzB,uBAAsC;IACtC,4BAAM;IAAA,0CAA0B;IAClC,AADkC,iBAAO,EACnC;;;IAMF,8BAAyB;IAAA,YAAgB;IAAA,iBAAM;;;IAAtB,cAAgB;IAAhB,uCAAgB;;;IAIzC,8BAAgC;IAAA,YAAkB;IAAA,iBAAM;;;IAAxB,cAAkB;IAAlB,yCAAkB;;;IAPtD,8BAAyB;IACvB,uBAA2C;IAC3C,iHAAkB;IAGlB,8BAA2B;IAAA,YAAW;IAAA,iBAAM;IAC5C,iHAAoB;IAGtB,iBAAM;;;IAPJ,eAEC;IAFD,4CAEC;IAC0B,eAAW;IAAX,kCAAW;IACtC,cAEC;IAFD,8CAEC;;AAxBX;;;GAGG;AA4FH,MAAM,OAAO,iCAAkC,SAAQ,oBAAoB;IAChE,eAAe,CAA2B;IAC1C,gBAAgB,CAAU;IAC1B,WAAW,CAAU;IACrB,MAAM,CAAU;IAChB,QAAQ,GAAY,IAAI,CAAC;IACzB,QAAQ,CAAU;IAEjB,gBAAgB,GAAG,IAAI,YAAY,EAAoD,CAAC;IACxF,iBAAiB,GAAG,IAAI,YAAY,EAAqB,CAAC;IAC1D,YAAY,GAAG,IAAI,YAAY,EAAQ,CAAC;IACxC,WAAW,GAAG,IAAI,YAAY,EAAQ,CAAC;IACjD;;;;;OAKG;IACO,kBAAkB,GAAG,IAAI,YAAY,EAAyC,CAAC;IAGzF,eAAe,CAAoB;IAE5B,SAAS,GAAG,IAAI,CAAC;IACjB,KAAK,GAAkB,IAAI,CAAC;IAC5B,YAAY,GAAkB,IAAI,CAAC;IACnC,UAAU,GAAkB,IAAI,CAAC;IAEhC,YAAY,GAA6B,IAAI,CAAC;IAEtD;;OAEG;IACH,IAAW,cAAc;QACvB,OAAO,IAAI,CAAC,YAAY,EAAE,QAA6C,IAAI,IAAI,CAAC;IAClF,CAAC;IAED;;;OAGG;IACH,IAAW,gBAAgB;QACzB,OAAO,IAAI,CAAC,cAAc,EAAE,gBAAgB,IAAI,KAAK,CAAC;IACxD,CAAC;IAED;;;OAGG;IACI,kBAAkB;QACvB,IAAI,CAAC,cAAc,EAAE,kBAAkB,EAAE,CAAC;IAC5C,CAAC;IAED,KAAK,CAAC,QAAQ;QACZ,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;IAC1B,CAAC;IAED,KAAK,CAAC,WAAW,CAAC,OAAsB;QACtC,IAAI,CAAC,OAAO,CAAC,iBAAiB,CAAC,IAAI,OAAO,CAAC,kBAAkB,CAAC,CAAC;YAC3D,CAAC,OAAO,CAAC,iBAAiB,CAAC,EAAE,WAAW,EAAE,CAAC;YAC7C,MAAM,IAAI,CAAC,UAAU,EAAE,CAAC;QAC1B,CAAC;IACH,CAAC;IAED,WAAW;QACT,IAAI,CAAC,oBAAoB,EAAE,CAAC;IAC9B,CAAC;IAED;;OAEG;IACK,KAAK,CAAC,UAAU;QACtB,IAAI,CAAC;YACH,IAAI,CAAC,SAAS,GAAG,IAAI,CAAC;YACtB,IAAI,CAAC,KAAK,GAAG,IAAI,CAAC;YAClB,IAAI,CAAC,UAAU,GAAG,IAAI,CAAC;YACvB,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;YAEzB,IAAI,CAAC,IAAI,CAAC,eAAe,EAAE,CAAC;gBAC1B,IAAI,CAAC,QAAQ,CACX,uBAAuB,EACvB,6EAA6E,EAC7E,sCAAsC,CACvC,CAAC;gBACF,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;gBACvB,OAAO;YACT,CAAC;YAED,IAAI,CAAC,IAAI,CAAC,gBAAgB,EAAE,CAAC;gBAC3B,IAAI,CAAC,QAAQ,CACX,uBAAuB,EACvB,0EAA0E,EAC1E,2BAA2B,CAC5B,CAAC;gBACF,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;gBACvB,OAAO;YACT,CAAC;YAED,uDAAuD;YACvD,MAAM,YAAY,GAAG,MAAM,IAAI,CAAC,eAAe,EAAE,CAAC;YAClD,IAAI,CAAC,YAAY,EAAE,CAAC;gBAClB,IAAI,CAAC,QAAQ,CACX,uBAAuB,EACvB,sBAAsB,IAAI,CAAC,gBAAgB,wFAAwF,EACnI,kBAAkB,IAAI,CAAC,gBAAgB,yBAAyB,CACjE,CAAC;gBACF,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;gBACvB,OAAO;YACT,CAAC;YAED,+DAA+D;YAC/D,MAAM,WAAW,GAAG,MAAM,IAAI,CAAC,kBAAkB,CAAC,YAAY,CAAC,CAAC;YAChE,IAAI,CAAC,WAAW,EAAE,CAAC;gBACjB,IAAI,CAAC,QAAQ,CACX,qBAAqB,EACrB,uBAAuB,IAAI,CAAC,gBAAgB,2GAA2G,EACvJ,2DAA2D,CAC5D,CAAC;gBACF,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;gBACvB,OAAO;YACT,CAAC;YAED,qDAAqD;YACrD,sFAAsF;YACtF,MAAM,YAAY,GAAG,MAAM,QAAQ,CAAC,QAAQ,CAAC,YAAY,CAAC,mBAAmB,CAC3E,iCAAiC,EACjC,WAAW,CACZ,CAAC;YAEF,IAAI,CAAC,YAAY,EAAE,CAAC;gBAClB,IAAI,CAAC,QAAQ,CACX,4BAA4B,EAC5B,yBAAyB,WAAW,+GAA+G,EACnJ,cAAc,WAAW,wHAAwH,WAAW,KAAK,CAClK,CAAC;gBACF,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;gBACvB,OAAO;YACT,CAAC;YAED,2CAA2C;YAC3C,MAAM,aAAa,GAAG,YAAY,CAAC,WAAsD,CAAC;YAE1F,oCAAoC;YACpC,IAAI,CAAC,oBAAoB,EAAE,CAAC;YAE5B,4CAA4C;YAC5C,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC,eAAe,CAAC,eAAe,CAAC,aAAa,CAAC,CAAC;YAExE,kEAAkE;YAClE,0EAA0E;YAC1E,+EAA+E;YAC/E,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,iBAAiB,EAAE,IAAI,CAAC,eAAe,CAAC,CAAC;YACpE,IAAI,IAAI,CAAC,MAAM,KAAK,SAAS,EAAE,CAAC;gBAC9B,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,QAAQ,EAAE,IAAI,CAAC,MAAM,CAAC,CAAC;YACpD,CAAC;YACD,IAAI,IAAI,CAAC,QAAQ,KAAK,SAAS,EAAE,CAAC;gBAChC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,UAAU,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;YACxD,CAAC;YACD,IAAI,IAAI,CAAC,QAAQ,KAAK,SAAS,EAAE,CAAC;gBAChC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,UAAU,EAAE,IAAI,CAAC,QAAQ,CAAC,CAAC;YACxD,CAAC;YACD,IAAI,IAAI,CAAC,WAAW,KAAK,SAAS,EAAE,CAAC;gBACnC,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC,aAAa,EAAE,IAAI,CAAC,WAAW,CAAC,CAAC;YAC9D,CAAC;YAED,6DAA6D;YAC7D,MAAM,iBAAiB,GAAG,IAAI,CAAC,YAAY,CAAC,QAAQ,CAAC;YACrD,IAAI,iBAAiB,CAAC,gBAAgB,EAAE,CAAC;gBACvC,iBAAiB,CAAC,gBAAgB,CAAC,SAAS,CAAC,CAAC,KAAuD,EAAE,EAAE;oBACvG,IAAI,CAAC,gBAAgB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBACpC,CAAC,CAAC,CAAC;YACL,CAAC;YAED,8DAA8D;YAC9D,IAAI,iBAAiB,CAAC,iBAAiB,EAAE,CAAC;gBACxC,iBAAiB,CAAC,iBAAiB,CAAC,SAAS,CAAC,CAAC,KAAwB,EAAE,EAAE;oBACzE,IAAI,CAAC,iBAAiB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBACrC,CAAC,CAAC,CAAC;YACL,CAAC;YAED,yFAAyF;YACzF,IAAI,iBAAiB,CAAC,WAAW,EAAE,CAAC;gBAClC,iBAAiB,CAAC,WAAW,CAAC,SAAS,CAAC,GAAG,EAAE;oBAC3C,IAAI,CAAC,WAAW,CAAC,IAAI,EAAE,CAAC;gBAC1B,CAAC,CAAC,CAAC;YACL,CAAC;YAED,gEAAgE;YAChE,+DAA+D;YAC/D,6DAA6D;YAC7D,IAAI,iBAAiB,CAAC,kBAAkB,EAAE,CAAC;gBACzC,iBAAiB,CAAC,kBAAkB,CAAC,SAAS,CAC5C,CAAC,KAA4C,EAAE,EAAE;oBAC/C,IAAI,CAAC,kBAAkB,CAAC,IAAI,CAAC,KAAK,CAAC,CAAC;gBACtC,CAAC,CACF,CAAC;YACJ,CAAC;YAED,2BAA2B;YAC3B,IAAI,CAAC,YAAY,CAAC,iBAAiB,CAAC,aAAa,EAAE,CAAC;YAEpD,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;YAEvB,kEAAkE;YAClE,IAAI,CAAC,YAAY,CAAC,IAAI,EAAE,CAAC;QAC3B,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,OAAO,CAAC,KAAK,CAAC,gCAAgC,EAAE,GAAG,CAAC,CAAC;YACrD,QAAQ,CAAC,GAAG,CAAC,CAAC;YACd,MAAM,YAAY,GAAG,GAAG,YAAY,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,OAAO,CAAC,CAAC,CAAC,MAAM,CAAC,GAAG,CAAC,CAAC;YACtE,MAAM,UAAU,GAAG,GAAG,YAAY,KAAK,IAAI,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,GAAG,CAAC,KAAK,CAAC,CAAC,CAAC,SAAS,CAAC;YAC7E,IAAI,CAAC,QAAQ,CACX,uBAAuB,EACvB,4IAA4I,EAC5I,UAAU,IAAI,YAAY,CAC3B,CAAC;YACF,IAAI,CAAC,SAAS,GAAG,KAAK,CAAC;QACzB,CAAC;IACH,CAAC;IAED;;OAEG;IACK,QAAQ,CAAC,KAAa,EAAE,WAAmB,EAAE,gBAAwB;QAC3E,IAAI,CAAC,UAAU,GAAG,KAAK,CAAC;QACxB,IAAI,CAAC,KAAK,GAAG,WAAW,CAAC;QACzB,IAAI,CAAC,YAAY,GAAG,gBAAgB,CAAC;IACvC,CAAC;IAED;;OAEG;IACK,KAAK,CAAC,eAAe;QAC3B,IAAI,CAAC;YACH,kEAAkE;YAClE,MAAM,YAAY,GAAG,sBAAsB,CAAC,QAAQ,CAAC,gBAAgB,CAAC,IAAI,CAAC,gBAAgB,CAAC,CAAC;YAC7F,OAAO,YAAY,IAAI,IAAI,CAAC;QAC9B,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,OAAO,CAAC,KAAK,CAAC,8BAA8B,EAAE,GAAG,CAAC,CAAC;YACnD,OAAO,IAAI,CAAC;QACd,CAAC;IACH,CAAC;IAED;;;;;;OAMG;IACK,KAAK,CAAC,kBAAkB,CAAC,YAAkC;QACjE,mDAAmD;QACnD,IAAI,YAAY,CAAC,WAAW,EAAE,CAAC;YAC7B,OAAO,CAAC,GAAG,CAAC,wBAAwB,YAAY,CAAC,WAAW,uBAAuB,YAAY,CAAC,IAAI,GAAG,CAAC,CAAC;YACzG,OAAO,YAAY,CAAC,WAAW,CAAC;QAClC,CAAC;QAED,4DAA4D;QAC5D,IAAI,YAAY,CAAC,QAAQ,EAAE,CAAC;YAC1B,OAAO,CAAC,GAAG,CAAC,yBAAyB,YAAY,CAAC,IAAI,uBAAuB,CAAC,CAAC;YAC/E,MAAM,UAAU,GAAG,MAAM,IAAI,CAAC,mBAAmB,CAAC,YAAY,CAAC,QAAQ,CAAC,CAAC;YAEzE,IAAI,UAAU,EAAE,CAAC;gBACf,2BAA2B;gBAC3B,OAAO,MAAM,IAAI,CAAC,kBAAkB,CAAC,UAAU,CAAC,CAAC;YACnD,CAAC;iBAAM,CAAC;gBACN,OAAO,CAAC,IAAI,CAAC,4BAA4B,YAAY,CAAC,QAAQ,aAAa,CAAC,CAAC;YAC/E,CAAC;QACH,CAAC;QAED,6DAA6D;QAC7D,OAAO,CAAC,GAAG,CAAC,6CAA6C,YAAY,CAAC,IAAI,8BAA8B,CAAC,CAAC;QAC1G,OAAO,IAAI,CAAC,iBAAiB,EAAE,CAAC;IAClC,CAAC;IAED;;OAEG;IACK,KAAK,CAAC,mBAAmB,CAAC,EAAU;QAC1C,IAAI,CAAC;YACH,MAAM,EAAE,GAAG,IAAI,CAAC,aAAa,CAAC;YAC9B,MAAM,YAAY,GAAG,MAAM,EAAE,CAAC,eAAe,CAAuB,oBAAoB,CAAC,CAAC;YAC1F,MAAM,MAAM,GAAG,MAAM,YAAY,CAAC,IAAI,CAAC,EAAE,CAAC,CAAC;YAE3C,IAAI,MAAM,EAAE,CAAC;gBACX,OAAO,YAAY,CAAC;YACtB,CAAC;YAED,OAAO,IAAI,CAAC;QACd,CAAC;QAAC,OAAO,GAAG,EAAE,CAAC;YACb,OAAO,CAAC,KAAK,CAAC,oCAAoC,EAAE,GAAG,CAAC,CAAC;YACzD,OAAO,IAAI,CAAC;QACd,CAAC;IACH,CAAC;IAED;;OAEG;IACK,iBAAiB;QACvB,IAAI,CAAC,IAAI,CAAC,eAAe,IAAI,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,EAAE,CAAC;YAC3D,OAAO,CAAC,GAAG,CAAC,0CAA0C,CAAC,CAAC;YACxD,OAAO,IAAI,CAAC;QACd,CAAC;QAED,IAAI,CAAC;YACH,mCAAmC;YACnC,IAAI,CAAC,KAAK,CAAC,IAAI,CAAC,eAAe,CAAC,OAAO,CAAC,CAAC;YACzC,OAAO,CAAC,GAAG,CAAC,qEAAqE,CAAC,CAAC;YACnF,OAAO,0BAA0B,CAAC;QACpC,CAAC;QAAC,MAAM,CAAC;YACP,OAAO,CAAC,GAAG,CAAC,oDAAoD,CAAC,CAAC;YAClE,OAAO,IAAI,CAAC;QACd,CAAC;IACH,CAAC;IAED;;OAEG;IACK,oBAAoB;QAC1B,IAAI,IAAI,CAAC,YAAY,EAAE,CAAC;YACtB,IAAI,CAAC,YAAY,CAAC,OAAO,EAAE,CAAC;YAC5B,IAAI,CAAC,YAAY,GAAG,IAAI,CAAC;QAC3B,CAAC;QACD,IAAI,CAAC,eAAe,CAAC,KAAK,EAAE,CAAC;IAC/B,CAAC;iTAnUU,iCAAiC,yBAAjC,iCAAiC;6DAAjC,iCAAiC;mCAoBN,gBAAgB;;;;;YA3GpD,8BAAyC;YACvC,mGAAiB;YAMjB,mGAAa;YAYb,iCAA8C;YAChD,iBAAM;;YAnBJ,cAKC;YALD,wCAKC;YACD,cAWC;YAXD,oCAWC;;;iFAqEM,iCAAiC;cA3F7C,SAAS;6BACI,KAAK,YACP,gCAAgC,YAChC;;;;;;;;;;;;;;;;;;;;;;GAsBT;;kBAmEA,KAAK;;kBACL,KAAK;;kBACL,KAAK;;kBACL,KAAK;;kBACL,KAAK;;kBACL,KAAK;;kBAEL,MAAM;;kBACN,MAAM;;kBACN,MAAM;;kBACN,MAAM;;kBAON,MAAM;;kBAEN,SAAS;mBAAC,iBAAiB,EAAE,EAAE,IAAI,EAAE,gBAAgB,EAAE,MAAM,EAAE,IAAI,EAAE;;kFApB3D,iCAAiC","sourcesContent":["import {\n  Component,\n  Input,\n  Output,\n  EventEmitter,\n  OnInit,\n  OnChanges,\n  SimpleChanges,\n  ViewChild,\n  ViewContainerRef,\n  ComponentRef,\n  Type\n} from '@angular/core';\nimport { MJArtifactVersionEntity, MJArtifactTypeEntity, ArtifactMetadataEngine } from '@memberjunction/core-entities';\nimport { BaseAngularComponent } from '@memberjunction/ng-base-types';\nimport { Metadata, LogError, RunView, CompositeKey } from '@memberjunction/core';\nimport { MJGlobal } from '@memberjunction/global';\nimport { IArtifactViewerComponent } from '../interfaces/artifact-viewer-plugin.interface';\nimport { BaseArtifactViewerPluginComponent, NavigationRequest } from './base-artifact-viewer.component';\n\n/**\n * Artifact type plugin viewer that loads the appropriate plugin based on the artifact's DriverClass.\n * Uses MJGlobal.Instance.ClassFactory.CreateInstance() to dynamically load viewer plugins.\n */\n@Component({\n  standalone: false,\n  selector: 'mj-artifact-type-plugin-viewer',\n  template: `\n    <div class=\"artifact-type-plugin-viewer\">\n      @if (isLoading) {\n        <div class=\"loading-state\">\n          <i class=\"fas fa-spinner fa-spin\"></i>\n          <span>Loading artifact viewer...</span>\n        </div>\n      }\n      @if (error) {\n        <div class=\"error-state\">\n          <i class=\"fas fa-exclamation-triangle\"></i>\n          @if (errorTitle) {\n            <div class=\"error-title\">{{ errorTitle }}</div>\n          }\n          <div class=\"error-details\">{{ error }}</div>\n          @if (errorDetails) {\n            <div class=\"error-tech-details\">{{ errorDetails }}</div>\n          }\n        </div>\n      }\n      <ng-container #viewerContainer></ng-container>\n    </div>\n  `,\n  styles: [`\n    .artifact-type-plugin-viewer {\n      width: 100%;\n      height: 100%;\n      display: flex;\n      flex-direction: column;\n    }\n\n    .artifact-type-plugin-viewer ::ng-deep > * {\n      flex: 1;\n      min-height: 0;\n    }\n\n    .loading-state,\n    .error-state {\n      display: flex;\n      flex-direction: column;\n      align-items: center;\n      justify-content: center;\n      padding: 40px;\n      gap: 16px;\n      color: #6c757d;\n      width: 100%;\n      height: 100%;\n      min-height: 200px;\n    }\n\n    .loading-state i {\n      font-size: 32px;\n    }\n\n    .error-state {\n      color: #dc3545;\n      text-align: center;\n      max-width: 600px;\n    }\n\n    .error-state i {\n      font-size: 32px;\n    }\n\n    .error-state .error-title {\n      font-weight: 600;\n      font-size: 16px;\n      margin-bottom: 8px;\n    }\n\n    .error-state .error-details {\n      font-size: 14px;\n      line-height: 1.5;\n      color: #6c757d;\n    }\n\n    .error-state .error-tech-details {\n      margin-top: 12px;\n      padding: 12px;\n      background: #f8f9fa;\n      border-radius: 4px;\n      font-family: monospace;\n      font-size: 12px;\n      color: #495057;\n      word-break: break-word;\n    }\n  `]\n})\nexport class ArtifactTypePluginViewerComponent extends BaseAngularComponent implements OnInit, OnChanges  {\n  @Input() artifactVersion!: MJArtifactVersionEntity;\n  @Input() artifactTypeName!: string;\n  @Input() contentType?: string;\n  @Input() height?: string;\n  @Input() readonly: boolean = true;\n  @Input() cssClass?: string;\n\n  @Output() openEntityRecord = new EventEmitter<{entityName: string; compositeKey: CompositeKey}>();\n  @Output() navigationRequest = new EventEmitter<NavigationRequest>();\n  @Output() pluginLoaded = new EventEmitter<void>();\n  @Output() tabsChanged = new EventEmitter<void>();\n  /**\n   * Bubbled up from the component-artifact-viewer's form-aware branch when\n   * the user clicks \"Apply to my form\". Carries the spec + entity so the\n   * consumer (chat message card, conversation host) can invoke the\n   * Create-or-Modify Interactive Form action behind a confirmation dialog.\n   */\n  @Output() applyFormRequested = new EventEmitter<{ spec: unknown; entityName: string }>();\n\n  @ViewChild('viewerContainer', { read: ViewContainerRef, static: true })\n  viewerContainer!: ViewContainerRef;\n\n  public isLoading = true;\n  public error: string | null = null;\n  public errorDetails: string | null = null;\n  public errorTitle: string | null = null;\n\n  private componentRef: ComponentRef<any> | null = null;\n\n  /**\n   * Get the loaded plugin instance (if available)\n   */\n  public get pluginInstance(): BaseArtifactViewerPluginComponent | null {\n    return this.componentRef?.instance as BaseArtifactViewerPluginComponent || null;\n  }\n\n  /**\n   * Whether the loaded plugin supports user feedback.\n   * Pass-through to the plugin instance for use by the parent panel wrapper.\n   */\n  public get SupportsFeedback(): boolean {\n    return this.pluginInstance?.SupportsFeedback ?? false;\n  }\n\n  /**\n   * Ask the loaded plugin to show its feedback UX.\n   * Pass-through to the plugin instance, called from the parent panel header.\n   */\n  public AskUserForFeedback(): void {\n    this.pluginInstance?.AskUserForFeedback();\n  }\n\n  async ngOnInit(): Promise<void> {\n    await this.loadViewer();\n  }\n\n  async ngOnChanges(changes: SimpleChanges): Promise<void> {\n    if ((changes['artifactVersion'] || changes['artifactTypeName']) &&\n        !changes['artifactVersion']?.firstChange) {\n      await this.loadViewer();\n    }\n  }\n\n  ngOnDestroy(): void {\n    this.destroyCurrentViewer();\n  }\n\n  /**\n   * Load the appropriate viewer plugin for the artifact\n   */\n  private async loadViewer(): Promise<void> {\n    try {\n      this.isLoading = true;\n      this.error = null;\n      this.errorTitle = null;\n      this.errorDetails = null;\n\n      if (!this.artifactVersion) {\n        this.setError(\n          'Missing Artifact Data',\n          'Unable to display this artifact because the version information is missing.',\n          'artifactVersion is null or undefined'\n        );\n        this.isLoading = false;\n        return;\n      }\n\n      if (!this.artifactTypeName) {\n        this.setError(\n          'Missing Artifact Type',\n          'Unable to display this artifact because the type information is missing.',\n          'artifactTypeName is empty'\n        );\n        this.isLoading = false;\n        return;\n      }\n\n      // Get the artifact type entity to find the DriverClass\n      const artifactType = await this.getArtifactType();\n      if (!artifactType) {\n        this.setError(\n          'Unknown Artifact Type',\n          `The artifact type \"${this.artifactTypeName}\" is not recognized. This might be a custom type that hasn't been properly configured.`,\n          `Artifact type \"${this.artifactTypeName}\" not found in metadata`\n        );\n        this.isLoading = false;\n        return;\n      }\n\n      // Resolve DriverClass by traversing parent hierarchy if needed\n      const driverClass = await this.resolveDriverClass(artifactType);\n      if (!driverClass) {\n        this.setError(\n          'No Viewer Available',\n          `This artifact type (${this.artifactTypeName}) doesn't have a viewer component configured. The artifact content may need to be viewed in the JSON tab.`,\n          `No DriverClass in hierarchy and content is not valid JSON`\n        );\n        this.isLoading = false;\n        return;\n      }\n\n      // Get the component type using MJGlobal ClassFactory\n      // CreateInstance returns the registered component class for the given DriverClass key\n      const tempInstance = await MJGlobal.Instance.ClassFactory.CreateInstanceAsync<BaseArtifactViewerPluginComponent>(\n        BaseArtifactViewerPluginComponent,\n        driverClass\n      );\n\n      if (!tempInstance) {\n        this.setError(\n          'Viewer Component Not Found',\n          `The viewer component \"${driverClass}\" is not registered in the application. This usually means the required package or module hasn't been loaded.`,\n          `Component \"${driverClass}\" not found in ClassFactory registry. Ensure it's registered with @RegisterClass(BaseArtifactViewerPluginComponent, '${driverClass}').`\n        );\n        this.isLoading = false;\n        return;\n      }\n\n      // Get the component type from the instance\n      const componentType = tempInstance.constructor as Type<BaseArtifactViewerPluginComponent>;\n\n      // Destroy previous viewer if exists\n      this.destroyCurrentViewer();\n\n      // Create and configure the viewer component\n      this.componentRef = this.viewerContainer.createComponent(componentType);\n\n      // Set inputs using setInput() which properly triggers ngOnChanges\n      // This is critical for plugins like ComponentArtifactViewerComponent that\n      // need to process the artifactVersion in ngOnChanges before pluginLoaded fires\n      this.componentRef.setInput('artifactVersion', this.artifactVersion);\n      if (this.height !== undefined) {\n        this.componentRef.setInput('height', this.height);\n      }\n      if (this.readonly !== undefined) {\n        this.componentRef.setInput('readonly', this.readonly);\n      }\n      if (this.cssClass !== undefined) {\n        this.componentRef.setInput('cssClass', this.cssClass);\n      }\n      if (this.contentType !== undefined) {\n        this.componentRef.setInput('contentType', this.contentType);\n      }\n\n      // Subscribe to openEntityRecord event if the plugin emits it\n      const componentInstance = this.componentRef.instance;\n      if (componentInstance.openEntityRecord) {\n        componentInstance.openEntityRecord.subscribe((event: {entityName: string; compositeKey: CompositeKey}) => {\n          this.openEntityRecord.emit(event);\n        });\n      }\n\n      // Subscribe to navigationRequest event if the plugin emits it\n      if (componentInstance.navigationRequest) {\n        componentInstance.navigationRequest.subscribe((event: NavigationRequest) => {\n          this.navigationRequest.emit(event);\n        });\n      }\n\n      // Subscribe to tabsChanged event if the plugin emits it (e.g., after async spec loading)\n      if (componentInstance.tabsChanged) {\n        componentInstance.tabsChanged.subscribe(() => {\n          this.tabsChanged.emit();\n        });\n      }\n\n      // Subscribe to the form-aware \"Apply to my form\" event when the\n      // underlying plugin is a component-artifact-viewer rendering a\n      // form-role spec. Other plugin types don't have this output.\n      if (componentInstance.applyFormRequested) {\n        componentInstance.applyFormRequested.subscribe(\n          (event: { spec: unknown; entityName: string }) => {\n            this.applyFormRequested.emit(event);\n          }\n        );\n      }\n\n      // Trigger change detection\n      this.componentRef.changeDetectorRef.detectChanges();\n\n      this.isLoading = false;\n\n      // Notify parent that plugin has loaded (for tab selection timing)\n      this.pluginLoaded.emit();\n    } catch (err) {\n      console.error('Error loading artifact viewer:', err);\n      LogError(err);\n      const errorMessage = err instanceof Error ? err.message : String(err);\n      const errorStack = err instanceof Error && err.stack ? err.stack : undefined;\n      this.setError(\n        'Failed to Load Viewer',\n        'An unexpected error occurred while loading the artifact viewer. Please try refreshing the page or contact support if the problem persists.',\n        errorStack || errorMessage\n      );\n      this.isLoading = false;\n    }\n  }\n\n  /**\n   * Set a structured error message with title, user-friendly description, and technical details\n   */\n  private setError(title: string, userMessage: string, technicalDetails: string): void {\n    this.errorTitle = title;\n    this.error = userMessage;\n    this.errorDetails = technicalDetails;\n  }\n\n  /**\n   * Get the artifact type entity for the current artifact using the cached ArtifactMetadataEngine\n   */\n  private async getArtifactType(): Promise<MJArtifactTypeEntity | null> {\n    try {\n      // Use the cached metadata engine instead of querying the database\n      const artifactType = ArtifactMetadataEngine.Instance.FindArtifactType(this.artifactTypeName);\n      return artifactType || null;\n    } catch (err) {\n      console.error('Error loading artifact type:', err);\n      return null;\n    }\n  }\n\n  /**\n   * Resolves the DriverClass for an artifact type by traversing up the parent hierarchy.\n   * Falls back to JSON viewer if content is valid JSON and no DriverClass is found.\n   *\n   * @param artifactType The artifact type to resolve the DriverClass for\n   * @returns The DriverClass string, or null if none found and no JSON fallback available\n   */\n  private async resolveDriverClass(artifactType: MJArtifactTypeEntity): Promise<string | null> {\n    // Check if current artifact type has a DriverClass\n    if (artifactType.DriverClass) {\n      console.log(`✅ Found DriverClass '${artifactType.DriverClass}' on artifact type '${artifactType.Name}'`);\n      return artifactType.DriverClass;\n    }\n\n    // No DriverClass on current type - check if it has a parent\n    if (artifactType.ParentID) {\n      console.log(`🔍 No DriverClass on '${artifactType.Name}', checking parent...`);\n      const parentType = await this.getArtifactTypeById(artifactType.ParentID);\n\n      if (parentType) {\n        // Recursively check parent\n        return await this.resolveDriverClass(parentType);\n      } else {\n        console.warn(`⚠️ Parent artifact type '${artifactType.ParentID}' not found`);\n      }\n    }\n\n    // Reached root with no DriverClass - check for JSON fallback\n    console.log(`📄 No DriverClass found in hierarchy for '${artifactType.Name}', checking JSON fallback...`);\n    return this.checkJsonFallback();\n  }\n\n  /**\n   * Loads an artifact type by ID\n   */\n  private async getArtifactTypeById(id: string): Promise<MJArtifactTypeEntity | null> {\n    try {\n      const md = this.ProviderToUse;\n      const artifactType = await md.GetEntityObject<MJArtifactTypeEntity>('MJ: Artifact Types');\n      const loaded = await artifactType.Load(id);\n\n      if (loaded) {\n        return artifactType;\n      }\n\n      return null;\n    } catch (err) {\n      console.error('Error loading artifact type by ID:', err);\n      return null;\n    }\n  }\n\n  /**\n   * Checks if the artifact content is valid JSON and returns the JSON viewer plugin if so\n   */\n  private checkJsonFallback(): string | null {\n    if (!this.artifactVersion || !this.artifactVersion.Content) {\n      console.log('❌ No content available for JSON fallback');\n      return null;\n    }\n\n    try {\n      // Try to parse the content as JSON\n      JSON.parse(this.artifactVersion.Content);\n      console.log('✅ Content is valid JSON, using JsonArtifactViewerPlugin as fallback');\n      return 'JsonArtifactViewerPlugin';\n    } catch {\n      console.log('❌ Content is not valid JSON, no fallback available');\n      return null;\n    }\n  }\n\n  /**\n   * Destroy the current viewer component\n   */\n  private destroyCurrentViewer(): void {\n    if (this.componentRef) {\n      this.componentRef.destroy();\n      this.componentRef = null;\n    }\n    this.viewerContainer.clear();\n  }\n}\n"]}

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

@@ -55,6 +55,15 @@ export declare class ArtifactViewerPanelComponent extends BaseAngularComponent i
         artifactId: string;
         snapshot: DataSnapshot;
     }>;
+    /**
+     * "Apply to my form" — bubbled from the form-aware component-artifact-viewer
+     * branch. Carries the spec + entity. Consumer (chat message card, etc.)
+     * confirms and invokes the Create-or-Modify Interactive Form action.
+     */
+    applyFormRequested: EventEmitter<{
+        spec: unknown;
+        entityName: string;
+    }>;
     pluginViewer?: ArtifactTypePluginViewerComponent;
     private destroy$;
     artifact: MJArtifactEntity | null;
@@ -275,6 +284,6 @@ export declare class ArtifactViewerPanelComponent extends BaseAngularComponent i
      */
     GetCurrentStateSnapshot(): DataSnapshot | null;
     static ɵfac: i0.ɵɵFactoryDeclaration<ArtifactViewerPanelComponent, never>;
-    static ɵcmp: i0.ɵɵComponentDeclaration<ArtifactViewerPanelComponent, "mj-artifact-viewer-panel", never, { "artifactId": { "alias": "artifactId"; "required": false; }; "currentUser": { "alias": "currentUser"; "required": false; }; "environmentId": { "alias": "environmentId"; "required": false; }; "versionNumber": { "alias": "versionNumber"; "required": false; }; "showSaveToCollection": { "alias": "showSaveToCollection"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "showTabs": { "alias": "showTabs"; "required": false; }; "showCloseButton": { "alias": "showCloseButton"; "required": false; }; "showMaximizeButton": { "alias": "showMaximizeButton"; "required": false; }; "refreshTrigger": { "alias": "refreshTrigger"; "required": false; }; "viewContext": { "alias": "viewContext"; "required": false; }; "contextCollectionId": { "alias": "contextCollectionId"; "required": false; }; "canShare": { "alias": "canShare"; "required": false; }; "canEdit": { "alias": "canEdit"; "required": false; }; "isMaximized": { "alias": "isMaximized"; "required": false; }; }, { "closed": "closed"; "saveToCollectionRequested": "saveToCollectionRequested"; "navigateToLink": "navigateToLink"; "shareRequested": "shareRequested"; "maximizeToggled": "maximizeToggled"; "openEntityRecord": "openEntityRecord"; "navigationRequest": "navigationRequest"; "analyzeRequested": "analyzeRequested"; }, never, never, false, never>;
+    static ɵcmp: i0.ɵɵComponentDeclaration<ArtifactViewerPanelComponent, "mj-artifact-viewer-panel", never, { "artifactId": { "alias": "artifactId"; "required": false; }; "currentUser": { "alias": "currentUser"; "required": false; }; "environmentId": { "alias": "environmentId"; "required": false; }; "versionNumber": { "alias": "versionNumber"; "required": false; }; "showSaveToCollection": { "alias": "showSaveToCollection"; "required": false; }; "showHeader": { "alias": "showHeader"; "required": false; }; "showTabs": { "alias": "showTabs"; "required": false; }; "showCloseButton": { "alias": "showCloseButton"; "required": false; }; "showMaximizeButton": { "alias": "showMaximizeButton"; "required": false; }; "refreshTrigger": { "alias": "refreshTrigger"; "required": false; }; "viewContext": { "alias": "viewContext"; "required": false; }; "contextCollectionId": { "alias": "contextCollectionId"; "required": false; }; "canShare": { "alias": "canShare"; "required": false; }; "canEdit": { "alias": "canEdit"; "required": false; }; "isMaximized": { "alias": "isMaximized"; "required": false; }; }, { "closed": "closed"; "saveToCollectionRequested": "saveToCollectionRequested"; "navigateToLink": "navigateToLink"; "shareRequested": "shareRequested"; "maximizeToggled": "maximizeToggled"; "openEntityRecord": "openEntityRecord"; "navigationRequest": "navigationRequest"; "analyzeRequested": "analyzeRequested"; "applyFormRequested": "applyFormRequested"; }, never, never, false, never>;
 }
 //# sourceMappingURL=artifact-viewer-panel.component.d.ts.map

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

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

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

@@ -224,7 +224,7 @@ function ArtifactViewerPanelComponent_Conditional_5_Conditional_1_Template(rf, c
 function ArtifactViewerPanelComponent_Conditional_5_Conditional_3_Template(rf, ctx) { if (rf & 1) {
     const _r13 = i0.ɵɵgetCurrentView();
     i0.ɵɵelementStart(0, "div", 55)(1, "mj-artifact-type-plugin-viewer", 56);
-    i0.ɵɵlistener("openEntityRecord", function ArtifactViewerPanelComponent_Conditional_5_Conditional_3_Template_mj_artifact_type_plugin_viewer_openEntityRecord_1_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onOpenEntityRecord($event)); })("navigationRequest", function ArtifactViewerPanelComponent_Conditional_5_Conditional_3_Template_mj_artifact_type_plugin_viewer_navigationRequest_1_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onNavigationRequest($event)); })("pluginLoaded", function ArtifactViewerPanelComponent_Conditional_5_Conditional_3_Template_mj_artifact_type_plugin_viewer_pluginLoaded_1_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onPluginLoaded()); })("tabsChanged", function ArtifactViewerPanelComponent_Conditional_5_Conditional_3_Template_mj_artifact_type_plugin_viewer_tabsChanged_1_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onTabsChanged()); });
+    i0.ɵɵlistener("openEntityRecord", function ArtifactViewerPanelComponent_Conditional_5_Conditional_3_Template_mj_artifact_type_plugin_viewer_openEntityRecord_1_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onOpenEntityRecord($event)); })("navigationRequest", function ArtifactViewerPanelComponent_Conditional_5_Conditional_3_Template_mj_artifact_type_plugin_viewer_navigationRequest_1_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onNavigationRequest($event)); })("pluginLoaded", function ArtifactViewerPanelComponent_Conditional_5_Conditional_3_Template_mj_artifact_type_plugin_viewer_pluginLoaded_1_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onPluginLoaded()); })("tabsChanged", function ArtifactViewerPanelComponent_Conditional_5_Conditional_3_Template_mj_artifact_type_plugin_viewer_tabsChanged_1_listener() { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.onTabsChanged()); })("applyFormRequested", function ArtifactViewerPanelComponent_Conditional_5_Conditional_3_Template_mj_artifact_type_plugin_viewer_applyFormRequested_1_listener($event) { i0.ɵɵrestoreView(_r13); const ctx_r1 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r1.applyFormRequested.emit($event)); });
     i0.ɵɵelementEnd()();
 } if (rf & 2) {
     const ctx_r1 = i0.ɵɵnextContext(2);
@@ -577,6 +577,12 @@ export class ArtifactViewerPanelComponent extends BaseAngularComponent {
     openEntityRecord = new EventEmitter();
     navigationRequest = new EventEmitter();
     analyzeRequested = new EventEmitter();
+    /**
+     * "Apply to my form" — bubbled from the form-aware component-artifact-viewer
+     * branch. Carries the spec + entity. Consumer (chat message card, etc.)
+     * confirms and invokes the Create-or-Modify Interactive Form action.
+     */
+    applyFormRequested = new EventEmitter();
     pluginViewer;
     destroy$ = new Subject();
     artifact = null;
@@ -1672,7 +1678,7 @@ export class ArtifactViewerPanelComponent extends BaseAngularComponent {
         } if (rf & 2) {
             let _t;
             i0.ɵɵqueryRefresh(_t = i0.ɵɵloadQuery()) && (ctx.pluginViewer = _t.first);
-        } }, inputs: { artifactId: "artifactId", currentUser: "currentUser", environmentId: "environmentId", versionNumber: "versionNumber", showSaveToCollection: "showSaveToCollection", showHeader: "showHeader", showTabs: "showTabs", showCloseButton: "showCloseButton", showMaximizeButton: "showMaximizeButton", refreshTrigger: "refreshTrigger", viewContext: "viewContext", contextCollectionId: "contextCollectionId", canShare: "canShare", canEdit: "canEdit", isMaximized: "isMaximized" }, outputs: { closed: "closed", saveToCollectionRequested: "saveToCollectionRequested", navigateToLink: "navigateToLink", shareRequested: "shareRequested", maximizeToggled: "maximizeToggled", openEntityRecord: "openEntityRecord", navigationRequest: "navigationRequest", analyzeRequested: "analyzeRequested" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 6, vars: 6, consts: [[1, "artifact-viewer-panel"], [1, "panel-header"], [1, "panel-content"], [1, "loading-state"], [1, "error-state"], [1, "artifact-content-wrapper", 3, "no-tabs"], [1, "panel-header-left"], [1, "fas", 3, "ngClass"], [1, "header-description"], [1, "panel-header-right"], [1, "version-selector", 3, "click"], [1, "fas", "fa-history"], [1, "version-label"], [1, "fas", "fa-chevron-down", "dropdown-icon", 3, "open"], [1, "version-dropdown"], ["title", "Inspect & rate components", 1, "feedback-btn"], [1, "save-to-collection-btn", 3, "in-collection", "title"], ["title", "Share", 1, "share-btn"], ["title", "Analyze this artifact with AI", 1, "analyze-btn", 3, "click"], [1, "fas", "fa-magnifying-glass-chart"], [1, "maximize-btn", 3, "title"], ["title", "Close", 1, "close-btn"], [1, "fas", "fa-chevron-down", "dropdown-icon"], [1, "version-dropdown", 3, "click"], [1, "version-option", 3, "selected"], [1, "version-option", 3, "click"], [1, "version-number"], [1, "version-date"], [1, "fas", "fa-check"], ["title", "Inspect & rate components", 1, "feedback-btn", 3, "click"], [1, "fas", "fa-star-half-stroke"], [1, "save-to-collection-btn", 3, "click", "title"], ["title", "Share", 1, "share-btn", 3, "click"], [1, "fas", "fa-share-nodes"], [1, "maximize-btn", 3, "click", "title"], ["title", "Close", 1, "close-btn", 3, "click"], [1, "fas", "fa-times"], [1, "fas", "fa-spinner", "fa-spin"], [1, "fas", "fa-exclamation-triangle"], [1, "artifact-content-wrapper"], [1, "tab-navigation"], [1, "tab-content"], [1, "plugin-container", 3, "plugin-hidden"], [1, "display-content"], [1, "details-content"], [1, "artifact-meta"], [1, "meta-item"], [1, "meta-item", "full-width"], [1, "attributes-section"], [1, "links-container"], [1, "links-section"], [1, "empty-state"], [1, "tab-btn", 3, "active"], [1, "tab-btn", 3, "click"], [3, "class"], [1, "plugin-container"], [3, "openEntityRecord", "navigationRequest", "pluginLoaded", "tabsChanged", "artifactVersion", "artifactTypeName", "contentType", "readonly"], [1, "display-toolbar"], ["title", "Print", 1, "btn-icon", 3, "click"], [1, "fas", "fa-print"], ["title", "Copy Content", 1, "btn-icon", 3, "click"], [1, "fas", "fa-copy"], [1, "markdown-content"], [1, "html-content", 3, "innerHTML"], [3, "data", "enableCollapsibleHeadings", "enableLineNumbers", "enableSmartypants", "enableHtml"], [1, "attributes-list"], [1, "attribute-item"], [1, "attribute-empty-pill"], [1, "link-item", 3, "disabled", "clickable", "title"], [1, "link-item", 3, "click", "title"], [1, "link-icon"], [1, "fas", "fa-comments"], [1, "fas", "fa-folder"], [1, "link-content"], [1, "link-name"], [1, "link-type"], [1, "link-actions"], [1, "fas", "fa-arrow-right"], [1, "fas", "fa-link"], [1, "component-tab-content"], [4, "ngComponentOutlet", "ngComponentOutletInputs"], [1, "dynamic-tab-content"], [1, "markdown-viewer"], [1, "json-viewer"], [1, "code-viewer"], [1, "html-viewer", 3, "innerHTML"], [1, "plaintext-viewer"], [1, "json-toolbar"], ["title", "Copy JSON", 1, "btn-icon", 3, "click"], [1, "json-editor-container"], [2, "width", "100%", "height", "100%", 3, "value", "language", "readonly", "lineWrapping"], [1, "code-toolbar"], ["title", "Copy Code", 1, "btn-icon", 3, "click"], [1, "code-editor-container"]], template: function ArtifactViewerPanelComponent_Template(rf, ctx) { if (rf & 1) {
+        } }, inputs: { artifactId: "artifactId", currentUser: "currentUser", environmentId: "environmentId", versionNumber: "versionNumber", showSaveToCollection: "showSaveToCollection", showHeader: "showHeader", showTabs: "showTabs", showCloseButton: "showCloseButton", showMaximizeButton: "showMaximizeButton", refreshTrigger: "refreshTrigger", viewContext: "viewContext", contextCollectionId: "contextCollectionId", canShare: "canShare", canEdit: "canEdit", isMaximized: "isMaximized" }, outputs: { closed: "closed", saveToCollectionRequested: "saveToCollectionRequested", navigateToLink: "navigateToLink", shareRequested: "shareRequested", maximizeToggled: "maximizeToggled", openEntityRecord: "openEntityRecord", navigationRequest: "navigationRequest", analyzeRequested: "analyzeRequested", applyFormRequested: "applyFormRequested" }, standalone: false, features: [i0.ɵɵInheritDefinitionFeature, i0.ɵɵNgOnChangesFeature], decls: 6, vars: 6, consts: [[1, "artifact-viewer-panel"], [1, "panel-header"], [1, "panel-content"], [1, "loading-state"], [1, "error-state"], [1, "artifact-content-wrapper", 3, "no-tabs"], [1, "panel-header-left"], [1, "fas", 3, "ngClass"], [1, "header-description"], [1, "panel-header-right"], [1, "version-selector", 3, "click"], [1, "fas", "fa-history"], [1, "version-label"], [1, "fas", "fa-chevron-down", "dropdown-icon", 3, "open"], [1, "version-dropdown"], ["title", "Inspect & rate components", 1, "feedback-btn"], [1, "save-to-collection-btn", 3, "in-collection", "title"], ["title", "Share", 1, "share-btn"], ["title", "Analyze this artifact with AI", 1, "analyze-btn", 3, "click"], [1, "fas", "fa-magnifying-glass-chart"], [1, "maximize-btn", 3, "title"], ["title", "Close", 1, "close-btn"], [1, "fas", "fa-chevron-down", "dropdown-icon"], [1, "version-dropdown", 3, "click"], [1, "version-option", 3, "selected"], [1, "version-option", 3, "click"], [1, "version-number"], [1, "version-date"], [1, "fas", "fa-check"], ["title", "Inspect & rate components", 1, "feedback-btn", 3, "click"], [1, "fas", "fa-star-half-stroke"], [1, "save-to-collection-btn", 3, "click", "title"], ["title", "Share", 1, "share-btn", 3, "click"], [1, "fas", "fa-share-nodes"], [1, "maximize-btn", 3, "click", "title"], ["title", "Close", 1, "close-btn", 3, "click"], [1, "fas", "fa-times"], [1, "fas", "fa-spinner", "fa-spin"], [1, "fas", "fa-exclamation-triangle"], [1, "artifact-content-wrapper"], [1, "tab-navigation"], [1, "tab-content"], [1, "plugin-container", 3, "plugin-hidden"], [1, "display-content"], [1, "details-content"], [1, "artifact-meta"], [1, "meta-item"], [1, "meta-item", "full-width"], [1, "attributes-section"], [1, "links-container"], [1, "links-section"], [1, "empty-state"], [1, "tab-btn", 3, "active"], [1, "tab-btn", 3, "click"], [3, "class"], [1, "plugin-container"], [3, "openEntityRecord", "navigationRequest", "pluginLoaded", "tabsChanged", "applyFormRequested", "artifactVersion", "artifactTypeName", "contentType", "readonly"], [1, "display-toolbar"], ["title", "Print", 1, "btn-icon", 3, "click"], [1, "fas", "fa-print"], ["title", "Copy Content", 1, "btn-icon", 3, "click"], [1, "fas", "fa-copy"], [1, "markdown-content"], [1, "html-content", 3, "innerHTML"], [3, "data", "enableCollapsibleHeadings", "enableLineNumbers", "enableSmartypants", "enableHtml"], [1, "attributes-list"], [1, "attribute-item"], [1, "attribute-empty-pill"], [1, "link-item", 3, "disabled", "clickable", "title"], [1, "link-item", 3, "click", "title"], [1, "link-icon"], [1, "fas", "fa-comments"], [1, "fas", "fa-folder"], [1, "link-content"], [1, "link-name"], [1, "link-type"], [1, "link-actions"], [1, "fas", "fa-arrow-right"], [1, "fas", "fa-link"], [1, "component-tab-content"], [4, "ngComponentOutlet", "ngComponentOutletInputs"], [1, "dynamic-tab-content"], [1, "markdown-viewer"], [1, "json-viewer"], [1, "code-viewer"], [1, "html-viewer", 3, "innerHTML"], [1, "plaintext-viewer"], [1, "json-toolbar"], ["title", "Copy JSON", 1, "btn-icon", 3, "click"], [1, "json-editor-container"], [2, "width", "100%", "height", "100%", 3, "value", "language", "readonly", "lineWrapping"], [1, "code-toolbar"], ["title", "Copy Code", 1, "btn-icon", 3, "click"], [1, "code-editor-container"]], template: function ArtifactViewerPanelComponent_Template(rf, ctx) { if (rf & 1) {
             i0.ɵɵelementStart(0, "div", 0);
             i0.ɵɵconditionalCreate(1, ArtifactViewerPanelComponent_Conditional_1_Template, 20, 13, "div", 1);
             i0.ɵɵelementStart(2, "div", 2);
@@ -1694,7 +1700,7 @@ export class ArtifactViewerPanelComponent extends BaseAngularComponent {
 }
 (() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ArtifactViewerPanelComponent, [{
         type: Component,
-        args: [{ standalone: false, selector: 'mj-artifact-viewer-panel', template: "<div class=\"artifact-viewer-panel\" [class.no-header]=\"!showHeader\">\n  @if (showHeader) {\n    <div class=\"panel-header\">\n      <div class=\"panel-header-left\">\n        <h3>\n          <i class=\"fas\" [ngClass]=\"artifactIcon\"></i>\n          {{ displayName }}\n        </h3>\n        @if (displayDescription) {\n          <p class=\"header-description\">{{ displayDescription }}</p>\n        }\n      </div>\n      <div class=\"panel-header-right\">\n        <div class=\"version-selector\"\n             [class.clickable]=\"allVersions.length > 1 && viewContext !== 'collection'\"\n             (click)=\"viewContext !== 'collection' && toggleVersionDropdown()\">\n          <i class=\"fas fa-history\"></i>\n          <span class=\"version-label\">v{{ selectedVersionNumber }}</span>\n          @if (allVersions.length > 1 && viewContext !== 'collection') {\n            <i class=\"fas fa-chevron-down dropdown-icon\" [class.open]=\"showVersionDropdown\"></i>\n          }\n          @if (showVersionDropdown) {\n            <div class=\"version-dropdown\" (click)=\"$event.stopPropagation()\">\n              @for (version of allVersions; track version.ID) {\n                <div class=\"version-option\"\n                     [class.selected]=\"version.VersionNumber === selectedVersionNumber\"\n                     (click)=\"selectVersion(version); $event.stopPropagation()\">\n                  <span class=\"version-number\">v{{ version.VersionNumber }}</span>\n                  <span class=\"version-date\">{{ version.__mj_CreatedAt | date:'short' }}</span>\n                  @if (version.VersionNumber === selectedVersionNumber) {\n                    <i class=\"fas fa-check\"></i>\n                  }\n                </div>\n              }\n            </div>\n          }\n        </div>\n        @if (pluginViewer?.SupportsFeedback) {\n          <button class=\"feedback-btn\"\n                  (click)=\"pluginViewer?.AskUserForFeedback()\"\n                  title=\"Inspect & rate components\">\n            <i class=\"fas fa-star-half-stroke\"></i>\n          </button>\n        }\n        @if (showSaveToCollection) {\n          <button class=\"save-to-collection-btn\"\n                  [class.in-collection]=\"isInCollection\"\n                  (click)=\"onSaveToLibrary()\"\n                  [title]=\"isInCollection ? 'Current version saved to ' + currentVersionCollections.length + ' collection(s)' : 'Save to Collection'\">\n            <i [class]=\"isInCollection ? 'fas fa-bookmark' : 'far fa-bookmark'\"></i>\n          </button>\n        }\n        @if (canShare) {\n          <button class=\"share-btn\"\n                  (click)=\"onShare()\"\n                  title=\"Share\">\n            <i class=\"fas fa-share-nodes\"></i>\n          </button>\n        }\n        <button class=\"analyze-btn\"\n                (click)=\"OnAnalyze()\"\n                title=\"Analyze this artifact with AI\">\n          <i class=\"fas fa-magnifying-glass-chart\"></i>\n        </button>\n        @if (showMaximizeButton) {\n          <button class=\"maximize-btn\"\n                  (click)=\"onMaximizeToggle()\"\n                  [title]=\"isMaximized ? 'Restore Width' : 'Maximize Width'\">\n            <i class=\"fas\" [ngClass]=\"isMaximized ? 'fa-compress-arrows-alt' : 'fa-arrows-left-right'\"></i>\n          </button>\n        }\n        @if (showCloseButton) {\n          <button class=\"close-btn\" (click)=\"onClose()\" title=\"Close\">\n            <i class=\"fas fa-times\"></i>\n          </button>\n        }\n      </div>\n    </div>\n  }\n\n  <div class=\"panel-content\">\n    @if (isLoading) {\n      <div class=\"loading-state\">\n        <i class=\"fas fa-spinner fa-spin\"></i>\n        <span>Loading artifact...</span>\n      </div>\n    }\n\n    @if (error) {\n      <div class=\"error-state\">\n        <i class=\"fas fa-exclamation-triangle\"></i>\n        <span>{{ error }}</span>\n      </div>\n    }\n\n    @if (!isLoading && !error && artifact) {\n      <div class=\"artifact-content-wrapper\" [class.no-tabs]=\"!showTabs\">\n        <!-- Tab Navigation (Dynamic) - Hidden when showTabs is false -->\n        @if (showTabs) {\n          <div class=\"tab-navigation\">\n            @for (tab of allTabs; track tab) {\n              <button class=\"tab-btn\"\n                      [class.active]=\"activeTab === tab.toLowerCase()\"\n                      (click)=\"SetActiveTab(tab)\">\n                @if (GetTabIcon(tab)) {\n                  <i [class]=\"GetTabIcon(tab)!\"></i>\n                }\n                {{ tab }}\n              </button>\n            }\n          </div>\n        }\n\n        <!-- Tab Content (Dynamic) -->\n        <div class=\"tab-content\">\n          <!-- Plugin Viewer - Created once, kept alive, shown/hidden with CSS -->\n          @if (hasPlugin && artifactVersion && artifactTypeName) {\n            <div class=\"plugin-container\" [class.plugin-hidden]=\"activeTab !== 'display'\">\n              <mj-artifact-type-plugin-viewer\n                [artifactVersion]=\"artifactVersion\"\n                [artifactTypeName]=\"artifactTypeName\"\n                [contentType]=\"contentType\"\n                [readonly]=\"true\"\n                (openEntityRecord)=\"onOpenEntityRecord($event)\"\n                (navigationRequest)=\"onNavigationRequest($event)\"\n                (pluginLoaded)=\"onPluginLoaded()\"\n                (tabsChanged)=\"onTabsChanged()\">\n              </mj-artifact-type-plugin-viewer>\n            </div>\n          }\n\n          <!-- Display Tab - Fallback content when no plugin -->\n          @if (activeTab === 'display' && (!hasPlugin || !artifactVersion)) {\n            <div class=\"display-content\">\n              @if (displayMarkdown || displayHtml) {\n                <!-- Fallback to extracted markdown/HTML attributes -->\n                <div class=\"display-toolbar\">\n                  <button class=\"btn-icon\" title=\"Print\" (click)=\"onPrintDisplayContent()\">\n                    <i class=\"fas fa-print\"></i> Print\n                  </button>\n                  <button class=\"btn-icon\" title=\"Copy Content\" (click)=\"onCopyDisplayContent()\">\n                    <i class=\"fas fa-copy\"></i> Copy\n                  </button>\n                </div>\n                @if (displayMarkdown) {\n                  <div class=\"markdown-content\">\n                    <mj-markdown [data]=\"displayMarkdown\"\n                                 [enableCollapsibleHeadings]=\"true\"\n                                 [enableLineNumbers]=\"true\"\n                                 [enableSmartypants]=\"true\"\n                                 [enableHtml]=\"true\"></mj-markdown>\n                  </div>\n                } @else if (displayHtml) {\n                  <div class=\"html-content\" [innerHTML]=\"displayHtml\"></div>\n                }\n              }\n            </div>\n          }\n\n          <!-- Details Tab - Artifact metadata (always in DOM, hidden with CSS) -->\n          <div class=\"details-content\" [class.tab-hidden]=\"activeTab !== 'details'\">\n              <div class=\"artifact-meta\">\n                <div class=\"meta-item\">\n                  <label>Type</label>\n                  <span>{{ artifact.Type }}</span>\n                </div>\n                <div class=\"meta-item\">\n                  <label>Version</label>\n                  <span>{{ artifactVersion?.VersionNumber || 1 }}</span>\n                </div>\n                <div class=\"meta-item\">\n                  <label>Created</label>\n                  <span>{{ artifact.__mj_CreatedAt | date:'short' }}</span>\n                </div>\n                <div class=\"meta-item\">\n                  <label>Updated</label>\n                  <span>{{ artifactVersion?.__mj_UpdatedAt | date:'short' }}</span>\n                </div>\n                @if (artifact.Description) {\n                  <div class=\"meta-item full-width\">\n                    <label>Artifact Description</label>\n                    <span>{{ artifact.Description }}</span>\n                  </div>\n                }\n                @if (artifactVersion?.Description && artifact.Description && artifactVersion?.Description !== artifact.Description) {\n                  <div class=\"meta-item full-width\">\n                    <label>Version Description</label>\n                    <span>{{ artifactVersion?.Description }}</span>\n                  </div>\n                }\n              </div>\n\n              <!-- Version Attributes -->\n              @if (filteredAttributes.length > 0) {\n                <div class=\"attributes-section\">\n                  <h4>Version Attributes</h4>\n                  <div class=\"attributes-list\">\n                    @for (attr of filteredAttributes; track attr.ID) {\n                      <div class=\"attribute-item\">\n                        <label>{{ attr.Name }}</label>\n                        @if (attr.Value) {\n                          <span>{{ attr.Value }}</span>\n                        } @else {\n                          <span class=\"attribute-empty-pill\">Empty</span>\n                        }\n                      </div>\n                    }\n                  </div>\n                </div>\n              }\n            </div>\n\n          <!-- Links Tab - Conversations and Collections (always in DOM, hidden with CSS) -->\n          <div class=\"links-container\" [class.tab-hidden]=\"activeTab !== 'links'\">\n            @if (linksToShow.length > 0) {\n              <div class=\"links-section\">\n                @for (link of linksToShow; track link.id) {\n                  <div class=\"link-item\"\n                       [class.disabled]=\"!link.hasAccess\"\n                       [class.clickable]=\"link.hasAccess\"\n                       (click)=\"link.hasAccess ? onNavigateToLink(link) : null\"\n                       [title]=\"link.hasAccess ? 'Click to open' : 'No access'\">\n                    <div class=\"link-icon\">\n                      @if (link.type === 'conversation') {\n                        <i class=\"fas fa-comments\"></i>\n                      } @else {\n                        <i class=\"fas fa-folder\"></i>\n                      }\n                    </div>\n                    <div class=\"link-content\">\n                      <div class=\"link-name\">{{ link.name }}</div>\n                      <div class=\"link-type\">{{ link.type === 'conversation' ? 'Conversation' : 'Collection' }}</div>\n                    </div>\n                    <div class=\"link-actions\">\n                      <i class=\"fas fa-arrow-right\"></i>\n                    </div>\n                  </div>\n                }\n              </div>\n            } @else {\n              <div class=\"empty-state\">\n                <i class=\"fas fa-link\"></i>\n                <p>No links available</p>\n              </div>\n            }\n          </div>\n\n          <!-- Dynamic Plugin Tabs and Base Tabs (JSON, etc.) -->\n          @if (activeTab !== 'display' && activeTab !== 'details' && activeTab !== 'links') {\n            <!-- Check if this is a component tab -->\n            @if (GetComponentTabType(activeTab); as componentType) {\n              <div class=\"component-tab-content\">\n                <ng-container *ngComponentOutlet=\"componentType; inputs: GetComponentInputs(activeTab)\"></ng-container>\n              </div>\n            } @else {\n              @if (GetTabContent(activeTab); as tabData) {\n                <div class=\"dynamic-tab-content\">\n                  @switch (tabData.type) {\n                    @case ('markdown') {\n                      <div class=\"markdown-viewer\">\n                        <mj-markdown [data]=\"tabData.content\"\n                                     [enableCollapsibleHeadings]=\"true\"\n                                     [enableLineNumbers]=\"true\"\n                                     [enableSmartypants]=\"true\"\n                                     [enableHtml]=\"true\"></mj-markdown>\n                      </div>\n                    }\n                    @case ('json') {\n                      <div class=\"json-viewer\">\n                        <div class=\"json-toolbar\">\n                          <button class=\"btn-icon\" title=\"Copy JSON\" (click)=\"onCopyToClipboard()\">\n                            <i class=\"fas fa-copy\"></i> Copy\n                          </button>\n                        </div>\n                        <div class=\"json-editor-container\">\n                          <mj-code-editor\n                            [value]=\"tabData.content\"\n                            [language]=\"'json'\"\n                            [readonly]=\"true\"\n                            [lineWrapping]=\"true\"\n                            style=\"width: 100%; height: 100%;\">\n                          </mj-code-editor>\n                        </div>\n                      </div>\n                    }\n                    @case ('code') {\n                      <div class=\"code-viewer\">\n                        <div class=\"code-toolbar\">\n                          <button class=\"btn-icon\" title=\"Copy Code\" (click)=\"onCopyToClipboard()\">\n                            <i class=\"fas fa-copy\"></i> Copy\n                          </button>\n                        </div>\n                        <div class=\"code-editor-container\">\n                          <mj-code-editor\n                            [value]=\"tabData.content\"\n                            [language]=\"tabData.language || 'typescript'\"\n                            [readonly]=\"true\"\n                            [lineWrapping]=\"true\"\n                            style=\"width: 100%; height: 100%;\">\n                          </mj-code-editor>\n                        </div>\n                      </div>\n                    }\n                    @case ('html') {\n                      <div class=\"html-viewer\" [innerHTML]=\"tabData.content\"></div>\n                    }\n                    @case ('plaintext') {\n                      <pre class=\"plaintext-viewer\">{{ tabData.content }}</pre>\n                    }\n                  }\n                </div>\n              }\n            }\n          }\n        </div>\n      </div>\n    }\n  </div>\n</div>\n\n", styles: [".artifact-viewer-panel {\n  width: 100%;\n  height: 100%;\n  background: var(--mj-bg-surface);\n  border-left: 1px solid var(--mj-border-default);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  box-sizing: border-box;\n}\n\n.panel-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  padding: 12px 16px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  flex-shrink: 0;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.panel-header-left {\n  flex: 1;\n  min-width: 0;\n  margin-right: 16px;\n}\n\n.panel-header h3 {\n  margin: 0;\n  font-size: 14px;\n  font-weight: 600;\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  word-wrap: break-word;\n  overflow-wrap: break-word;\n}\n\n.panel-header h3 i {\n  color: var(--mj-brand-primary);\n  flex-shrink: 0;\n  margin-top: 2px;\n}\n\n.header-description {\n  margin: 4px 0 0 0;\n  font-size: 12px;\n  color: var(--mj-text-muted);\n  font-weight: normal;\n  word-wrap: break-word;\n  overflow-wrap: break-word;\n}\n\n.panel-header-right {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-shrink: 0;\n}\n\n.version-selector {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 10px;\n  background: var(--mj-bg-surface-sunken);\n  border-radius: 12px;\n  font-size: 12px;\n  color: var(--mj-text-muted);\n  font-weight: 500;\n  transition: all 0.2s;\n}\n\n.version-selector.clickable {\n  cursor: pointer;\n}\n\n.version-selector.clickable:hover {\n  background: var(--mj-border-default);\n}\n\n.version-selector i {\n  font-size: 11px;\n}\n\n.version-selector .dropdown-icon {\n  margin-left: 2px;\n  transition: transform 0.2s;\n}\n\n.version-selector .dropdown-icon.open {\n  transform: rotate(180deg);\n}\n\n.version-label {\n  font-family: monospace;\n}\n\n.version-dropdown {\n  position: absolute;\n  top: calc(100% + 4px);\n  right: 0;\n  min-width: 200px;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  box-shadow: var(--mj-shadow-md);\n  z-index: 1000;\n  overflow: hidden;\n}\n\n.version-option {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 12px;\n  cursor: pointer;\n  transition: background 0.15s;\n  font-size: 13px;\n}\n\n.version-option:hover {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.version-option.selected {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n.version-option .version-number {\n  font-family: monospace;\n  font-weight: 600;\n  min-width: 35px;\n}\n\n.version-option .version-date {\n  flex: 1;\n  color: var(--mj-text-muted);\n  font-size: 12px;\n}\n\n.version-option i.fa-check {\n  color: var(--mj-status-success);\n  margin-left: auto;\n}\n\n.feedback-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-disabled);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n}\n\n.feedback-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-brand-primary);\n}\n\n.feedback-btn i {\n  font-size: 14px;\n}\n\n.save-to-collection-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-disabled);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n}\n\n.save-to-collection-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n}\n\n.save-to-collection-btn i {\n  font-size: 14px;\n}\n\n.save-to-collection-btn.in-collection {\n  color: var(--mj-brand-primary);\n}\n\n.save-to-collection-btn.in-collection:hover {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n.share-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-disabled);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n}\n\n.share-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-brand-primary);\n}\n\n.share-btn i {\n  font-size: 14px;\n}\n\n.analyze-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-disabled);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.analyze-btn:hover {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n.analyze-btn i {\n  font-size: 14px;\n}\n\n.maximize-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-muted);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n}\n\n.maximize-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n}\n\n.maximize-btn i {\n  font-size: 14px;\n}\n\n.close-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-muted);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n}\n\n.close-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n}\n\n.close-btn i {\n  font-size: 14px;\n}\n\n.panel-content {\n  flex: 1;\n  overflow: hidden;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.artifact-content-wrapper {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  min-height: 0;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.loading-state,\n.error-state {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  padding: 40px 20px;\n  color: var(--mj-text-muted);\n}\n\n.error-state {\n  color: var(--mj-status-error);\n}\n\n.loading-state i {\n  font-size: 24px;\n}\n\n.artifact-meta {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n  gap: 16px;\n  margin-bottom: 16px;\n  padding: 16px;\n  background: var(--mj-bg-surface-sunken);\n  border-radius: 8px;\n  flex-shrink: 0;\n}\n\n.meta-item {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.meta-item label {\n  font-size: 12px;\n  font-weight: 500;\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.meta-item span {\n  font-size: 14px;\n  color: var(--mj-text-primary);\n}\n\n.artifact-description {\n  padding: 12px;\n  margin-bottom: 16px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  border-left: 3px solid var(--mj-brand-primary);\n  border-radius: 4px;\n  color: var(--mj-brand-primary);\n  font-size: 14px;\n  flex-shrink: 0;\n}\n\n.json-viewer {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  overflow: hidden;\n  min-height: 0;\n}\n\n.json-editor-container {\n  flex: 1;\n  overflow: hidden;\n  min-height: 0;\n}\n\n.json-toolbar {\n  display: flex;\n  justify-content: flex-end;\n  gap: 8px;\n  padding: 8px 12px;\n  background: var(--mj-bg-surface-sunken);\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n\n.btn-icon {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 4px;\n  padding: 6px 12px;\n  cursor: pointer;\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  transition: all 0.2s;\n}\n\n.btn-icon:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-color: var(--mj-text-disabled);\n}\n\n.btn-icon.btn-primary {\n  background: var(--mj-brand-primary);\n  border-color: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n\n.btn-icon.btn-primary:hover {\n  background: var(--mj-brand-primary-hover);\n  border-color: var(--mj-brand-primary-hover);\n}\n\n.btn-icon i {\n  font-size: 14px;\n}\n\n/* Library Dialog Styles */\n.modal-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: var(--mj-bg-overlay);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 10000;\n}\n\n.modal-content {\n  background: var(--mj-bg-surface);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-lg);\n  max-width: 500px;\n  width: 90%;\n  max-height: 90vh;\n  display: flex;\n  flex-direction: column;\n}\n\n.modal-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.modal-header h3 {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 600;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.modal-header h3 i {\n  color: var(--mj-status-warning);\n}\n\n.modal-body {\n  padding: 20px;\n  overflow-y: auto;\n}\n\n.modal-footer {\n  display: flex;\n  justify-content: flex-end;\n  gap: 12px;\n  padding: 16px 20px;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.form-section {\n  margin-bottom: 20px;\n}\n\n.form-section label {\n  display: block;\n  margin-bottom: 8px;\n  font-size: 14px;\n  font-weight: 500;\n  color: var(--mj-text-secondary);\n}\n\n.form-select,\n.form-input {\n  width: 100%;\n  padding: 10px 12px;\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 6px;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n  background: var(--mj-bg-surface);\n  transition: border-color 0.2s;\n}\n\n.form-select:focus,\n.form-input:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.divider {\n  display: flex;\n  align-items: center;\n  margin: 24px 0;\n  color: var(--mj-text-disabled);\n  font-size: 12px;\n  font-weight: 500;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.divider::before,\n.divider::after {\n  content: '';\n  flex: 1;\n  height: 1px;\n  background: var(--mj-border-default);\n}\n\n.divider span {\n  padding: 0 12px;\n}\n\n.create-collection-row {\n  display: flex;\n  gap: 8px;\n}\n\n.create-collection-row .form-input {\n  flex: 1;\n}\n\n.btn {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 16px;\n  border: none;\n  border-radius: 6px;\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 0.2s;\n  white-space: nowrap;\n}\n\n.btn:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.btn-primary {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n\n.btn-primary:hover:not(:disabled) {\n  background: var(--mj-brand-primary-hover);\n}\n\n.btn-secondary {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-strong);\n  color: var(--mj-text-secondary);\n}\n\n.btn-secondary:hover:not(:disabled) {\n  background: var(--mj-bg-surface-sunken);\n}\n\n/* Tab Navigation */\n.tab-navigation {\n  display: flex;\n  gap: 0;\n  border-bottom: 2px solid var(--mj-border-default);\n  padding: 0 16px;\n  background: var(--mj-bg-surface);\n}\n\n.tab-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 12px 20px;\n  background: transparent;\n  border: none;\n  border-bottom: 2px solid transparent;\n  margin-bottom: -2px;\n  color: var(--mj-text-muted);\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 150ms ease;\n}\n\n.tab-btn:hover {\n  color: var(--mj-brand-primary);\n  background: var(--mj-bg-surface-sunken);\n}\n\n.tab-btn.active {\n  color: var(--mj-brand-primary);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.tab-btn i {\n  font-size: 14px;\n}\n\n/* Tab Content */\n.tab-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n  width: 100%;\n  box-sizing: border-box;\n  margin-bottom: 5px;\n  min-width: 0;\n  min-height: 0;\n}\n\n/* Plugin Container */\n.plugin-container {\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.plugin-container.plugin-hidden,\n.tab-hidden {\n  display: none;\n}\n\n/* Ensure artifact viewer component takes full height */\n.plugin-container mj-artifact-type-plugin-viewer {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0;\n  width: 100%;\n}\n\n.display-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n  overflow: hidden;\n  min-height: 0;\n  min-width: 0;\n  padding: 7px;\n}\n\n.display-toolbar {\n  position: absolute;\n  top: 12px;\n  right: 12px;\n  display: flex;\n  gap: 8px;\n  z-index: 10;\n}\n\n.markdown-content,\n.html-content {\n  flex: 1;\n  font-size: 14px;\n  line-height: 1.6;\n  width: 100%;\n  padding: 20px 10px 5px 20px; /* top right bottom left */\n  box-sizing: border-box;\n  overflow: auto;\n  min-height: 0;\n}\n\n.details-content {\n  padding: 20px;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.details-content .artifact-meta {\n  margin-bottom: 0;\n  padding: 20px;\n}\n\n.details-content .meta-item.full-width {\n  grid-column: 1 / -1;\n}\n\n.attributes-section {\n  margin-top: 24px;\n  padding: 24px;\n  background: var(--mj-bg-surface-sunken);\n  border-radius: 8px;\n}\n\n.attributes-section h4 {\n  margin: 0 0 16px 0;\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.attributes-list {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n  gap: 16px;\n}\n\n.attribute-item {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  padding: 12px;\n  background: var(--mj-bg-surface);\n  border-radius: 6px;\n  border: 1px solid var(--mj-border-default);\n}\n\n.attribute-item label {\n  font-size: 11px;\n  font-weight: 600;\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.attribute-item span {\n  font-size: 13px;\n  color: var(--mj-text-primary);\n  word-break: break-word;\n}\n\n.attribute-empty-pill {\n  display: inline-block;\n  padding: 2px 8px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-disabled);\n  font-size: 11px;\n  font-weight: 500;\n  border-radius: 4px;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n/* Links Tab */\n.links-container {\n  padding: 20px;\n}\n\n.links-section {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.link-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  transition: all 0.15s;\n}\n\n.link-item.clickable {\n  cursor: pointer;\n}\n\n.link-item.clickable:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: var(--mj-shadow-sm);\n  background: var(--mj-bg-surface-sunken);\n}\n\n.link-item.disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.link-item:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.link-icon {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--mj-bg-surface);\n  border-radius: 8px;\n  flex-shrink: 0;\n}\n\n.link-icon i {\n  font-size: 18px;\n  color: var(--mj-brand-primary);\n}\n\n.link-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.link-name {\n  font-size: 14px;\n  font-weight: 500;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.link-type {\n  font-size: 12px;\n  color: var(--mj-text-muted);\n  margin-top: 2px;\n}\n\n.link-actions {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  flex-shrink: 0;\n}\n\n.link-actions i {\n  font-size: 14px;\n  color: var(--mj-text-muted);\n  transition: all 0.15s;\n}\n\n.link-item.clickable:hover .link-actions i {\n  color: var(--mj-brand-primary);\n  transform: translateX(2px);\n}\n\n.links-container .empty-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 48px 24px;\n  color: var(--mj-text-disabled);\n  text-align: center;\n}\n\n.links-container .empty-state i {\n  font-size: 48px;\n  margin-bottom: 16px;\n  opacity: 0.3;\n}\n\n.links-container .empty-state p {\n  margin: 0;\n  font-size: 14px;\n}\n\n/* Dynamic Tab Content Styles */\n.dynamic-tab-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  padding: 16px;\n}\n\n/* Custom component tab content */\n.component-tab-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n  padding: 16px;\n}\n\n.markdown-viewer {\n  flex: 1;\n  overflow: auto;\n  padding: 20px;\n  background: var(--mj-bg-surface);\n  line-height: 1.6;\n}\n\n.markdown-viewer h1, .markdown-viewer h2, .markdown-viewer h3 {\n  margin-top: 24px;\n  margin-bottom: 12px;\n  font-weight: 600;\n}\n\n.markdown-viewer h1 { font-size: 24px; }\n.markdown-viewer h2 { font-size: 20px; }\n.markdown-viewer h3 { font-size: 18px; }\n\n.markdown-viewer p {\n  margin-bottom: 12px;\n}\n\n.markdown-viewer ul, .markdown-viewer ol {\n  margin-bottom: 12px;\n  padding-left: 24px;\n}\n\n.markdown-viewer code {\n  background: var(--mj-bg-surface-sunken);\n  padding: 2px 6px;\n  border-radius: 3px;\n  font-family: 'Courier New', monospace;\n  font-size: 13px;\n}\n\n.markdown-viewer pre {\n  background: var(--mj-bg-surface-sunken);\n  padding: 12px;\n  border-radius: 6px;\n  overflow-x: auto;\n  margin-bottom: 12px;\n}\n\n.markdown-viewer pre code {\n  background: none;\n  padding: 0;\n}\n\n.code-viewer {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  overflow: hidden;\n  min-height: 0;\n}\n\n.code-toolbar {\n  display: flex;\n  justify-content: flex-end;\n  gap: 8px;\n  padding: 8px 12px;\n  background: var(--mj-bg-surface-sunken);\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n\n.code-editor-container {\n  flex: 1;\n  overflow: hidden;\n  min-height: 0;\n}\n\n.plaintext-viewer {\n  flex: 1;\n  overflow: auto;\n  padding: 12px;\n  background: var(--mj-bg-surface-sunken);\n  font-family: 'Courier New', monospace;\n  font-size: 13px;\n  white-space: pre-wrap;\n}\n\n.html-viewer {\n  flex: 1;\n  overflow: auto;\n  padding: 20px;\n  background: var(--mj-bg-surface);\n}\n\n/* Mobile adjustments: 481px - 768px */\n@media (max-width: 768px) {\n  /* Add top border with slight visual separation from top nav */\n  .artifact-viewer-panel {\n    border-top: 3px solid var(--mj-brand-primary);\n    position: relative;\n  }\n\n  /* Create a small dark strip above the blue border to separate from top nav */\n  .artifact-viewer-panel::before {\n    content: '';\n    position: absolute;\n    top: -8px;\n    left: 0;\n    right: 0;\n    height: 8px;\n    background: var(--mj-brand-secondary);\n  }\n\n  .tab-navigation {\n    padding: 0 8px;\n    overflow-x: auto;\n    overflow-y: hidden;\n    -webkit-overflow-scrolling: touch;\n    scrollbar-width: none;\n  }\n\n  .tab-navigation::-webkit-scrollbar {\n    display: none;\n  }\n\n  .tab-btn {\n    padding: 10px 12px;\n    font-size: 12px;\n    white-space: nowrap;\n    flex-shrink: 0;\n  }\n\n  .tab-btn i {\n    font-size: 13px;\n  }\n\n  .panel-header {\n    padding: 12px;\n  }\n\n  .dynamic-tab-content {\n    padding: 12px;\n  }\n\n  .markdown-viewer {\n    padding: 12px;\n  }\n}\n\n/* Small Phone adjustments: <= 480px */\n@media (max-width: 480px) {\n  .tab-navigation {\n    padding: 0 4px;\n  }\n\n  .tab-btn {\n    padding: 8px 10px;\n    font-size: 11px;\n    gap: 4px;\n  }\n\n  .tab-btn i {\n    font-size: 12px;\n  }\n\n  .panel-header {\n    padding: 8px;\n  }\n\n  .dynamic-tab-content {\n    padding: 8px;\n  }\n\n  .markdown-viewer {\n    padding: 8px;\n  }\n}\n"] }]
+        args: [{ standalone: false, selector: 'mj-artifact-viewer-panel', template: "<div class=\"artifact-viewer-panel\" [class.no-header]=\"!showHeader\">\n  @if (showHeader) {\n    <div class=\"panel-header\">\n      <div class=\"panel-header-left\">\n        <h3>\n          <i class=\"fas\" [ngClass]=\"artifactIcon\"></i>\n          {{ displayName }}\n        </h3>\n        @if (displayDescription) {\n          <p class=\"header-description\">{{ displayDescription }}</p>\n        }\n      </div>\n      <div class=\"panel-header-right\">\n        <div class=\"version-selector\"\n             [class.clickable]=\"allVersions.length > 1 && viewContext !== 'collection'\"\n             (click)=\"viewContext !== 'collection' && toggleVersionDropdown()\">\n          <i class=\"fas fa-history\"></i>\n          <span class=\"version-label\">v{{ selectedVersionNumber }}</span>\n          @if (allVersions.length > 1 && viewContext !== 'collection') {\n            <i class=\"fas fa-chevron-down dropdown-icon\" [class.open]=\"showVersionDropdown\"></i>\n          }\n          @if (showVersionDropdown) {\n            <div class=\"version-dropdown\" (click)=\"$event.stopPropagation()\">\n              @for (version of allVersions; track version.ID) {\n                <div class=\"version-option\"\n                     [class.selected]=\"version.VersionNumber === selectedVersionNumber\"\n                     (click)=\"selectVersion(version); $event.stopPropagation()\">\n                  <span class=\"version-number\">v{{ version.VersionNumber }}</span>\n                  <span class=\"version-date\">{{ version.__mj_CreatedAt | date:'short' }}</span>\n                  @if (version.VersionNumber === selectedVersionNumber) {\n                    <i class=\"fas fa-check\"></i>\n                  }\n                </div>\n              }\n            </div>\n          }\n        </div>\n        @if (pluginViewer?.SupportsFeedback) {\n          <button class=\"feedback-btn\"\n                  (click)=\"pluginViewer?.AskUserForFeedback()\"\n                  title=\"Inspect & rate components\">\n            <i class=\"fas fa-star-half-stroke\"></i>\n          </button>\n        }\n        @if (showSaveToCollection) {\n          <button class=\"save-to-collection-btn\"\n                  [class.in-collection]=\"isInCollection\"\n                  (click)=\"onSaveToLibrary()\"\n                  [title]=\"isInCollection ? 'Current version saved to ' + currentVersionCollections.length + ' collection(s)' : 'Save to Collection'\">\n            <i [class]=\"isInCollection ? 'fas fa-bookmark' : 'far fa-bookmark'\"></i>\n          </button>\n        }\n        @if (canShare) {\n          <button class=\"share-btn\"\n                  (click)=\"onShare()\"\n                  title=\"Share\">\n            <i class=\"fas fa-share-nodes\"></i>\n          </button>\n        }\n        <button class=\"analyze-btn\"\n                (click)=\"OnAnalyze()\"\n                title=\"Analyze this artifact with AI\">\n          <i class=\"fas fa-magnifying-glass-chart\"></i>\n        </button>\n        @if (showMaximizeButton) {\n          <button class=\"maximize-btn\"\n                  (click)=\"onMaximizeToggle()\"\n                  [title]=\"isMaximized ? 'Restore Width' : 'Maximize Width'\">\n            <i class=\"fas\" [ngClass]=\"isMaximized ? 'fa-compress-arrows-alt' : 'fa-arrows-left-right'\"></i>\n          </button>\n        }\n        @if (showCloseButton) {\n          <button class=\"close-btn\" (click)=\"onClose()\" title=\"Close\">\n            <i class=\"fas fa-times\"></i>\n          </button>\n        }\n      </div>\n    </div>\n  }\n\n  <div class=\"panel-content\">\n    @if (isLoading) {\n      <div class=\"loading-state\">\n        <i class=\"fas fa-spinner fa-spin\"></i>\n        <span>Loading artifact...</span>\n      </div>\n    }\n\n    @if (error) {\n      <div class=\"error-state\">\n        <i class=\"fas fa-exclamation-triangle\"></i>\n        <span>{{ error }}</span>\n      </div>\n    }\n\n    @if (!isLoading && !error && artifact) {\n      <div class=\"artifact-content-wrapper\" [class.no-tabs]=\"!showTabs\">\n        <!-- Tab Navigation (Dynamic) - Hidden when showTabs is false -->\n        @if (showTabs) {\n          <div class=\"tab-navigation\">\n            @for (tab of allTabs; track tab) {\n              <button class=\"tab-btn\"\n                      [class.active]=\"activeTab === tab.toLowerCase()\"\n                      (click)=\"SetActiveTab(tab)\">\n                @if (GetTabIcon(tab)) {\n                  <i [class]=\"GetTabIcon(tab)!\"></i>\n                }\n                {{ tab }}\n              </button>\n            }\n          </div>\n        }\n\n        <!-- Tab Content (Dynamic) -->\n        <div class=\"tab-content\">\n          <!-- Plugin Viewer - Created once, kept alive, shown/hidden with CSS -->\n          @if (hasPlugin && artifactVersion && artifactTypeName) {\n            <div class=\"plugin-container\" [class.plugin-hidden]=\"activeTab !== 'display'\">\n              <mj-artifact-type-plugin-viewer\n                [artifactVersion]=\"artifactVersion\"\n                [artifactTypeName]=\"artifactTypeName\"\n                [contentType]=\"contentType\"\n                [readonly]=\"true\"\n                (openEntityRecord)=\"onOpenEntityRecord($event)\"\n                (navigationRequest)=\"onNavigationRequest($event)\"\n                (pluginLoaded)=\"onPluginLoaded()\"\n                (tabsChanged)=\"onTabsChanged()\"\n                (applyFormRequested)=\"applyFormRequested.emit($event)\">\n              </mj-artifact-type-plugin-viewer>\n            </div>\n          }\n\n          <!-- Display Tab - Fallback content when no plugin -->\n          @if (activeTab === 'display' && (!hasPlugin || !artifactVersion)) {\n            <div class=\"display-content\">\n              @if (displayMarkdown || displayHtml) {\n                <!-- Fallback to extracted markdown/HTML attributes -->\n                <div class=\"display-toolbar\">\n                  <button class=\"btn-icon\" title=\"Print\" (click)=\"onPrintDisplayContent()\">\n                    <i class=\"fas fa-print\"></i> Print\n                  </button>\n                  <button class=\"btn-icon\" title=\"Copy Content\" (click)=\"onCopyDisplayContent()\">\n                    <i class=\"fas fa-copy\"></i> Copy\n                  </button>\n                </div>\n                @if (displayMarkdown) {\n                  <div class=\"markdown-content\">\n                    <mj-markdown [data]=\"displayMarkdown\"\n                                 [enableCollapsibleHeadings]=\"true\"\n                                 [enableLineNumbers]=\"true\"\n                                 [enableSmartypants]=\"true\"\n                                 [enableHtml]=\"true\"></mj-markdown>\n                  </div>\n                } @else if (displayHtml) {\n                  <div class=\"html-content\" [innerHTML]=\"displayHtml\"></div>\n                }\n              }\n            </div>\n          }\n\n          <!-- Details Tab - Artifact metadata (always in DOM, hidden with CSS) -->\n          <div class=\"details-content\" [class.tab-hidden]=\"activeTab !== 'details'\">\n              <div class=\"artifact-meta\">\n                <div class=\"meta-item\">\n                  <label>Type</label>\n                  <span>{{ artifact.Type }}</span>\n                </div>\n                <div class=\"meta-item\">\n                  <label>Version</label>\n                  <span>{{ artifactVersion?.VersionNumber || 1 }}</span>\n                </div>\n                <div class=\"meta-item\">\n                  <label>Created</label>\n                  <span>{{ artifact.__mj_CreatedAt | date:'short' }}</span>\n                </div>\n                <div class=\"meta-item\">\n                  <label>Updated</label>\n                  <span>{{ artifactVersion?.__mj_UpdatedAt | date:'short' }}</span>\n                </div>\n                @if (artifact.Description) {\n                  <div class=\"meta-item full-width\">\n                    <label>Artifact Description</label>\n                    <span>{{ artifact.Description }}</span>\n                  </div>\n                }\n                @if (artifactVersion?.Description && artifact.Description && artifactVersion?.Description !== artifact.Description) {\n                  <div class=\"meta-item full-width\">\n                    <label>Version Description</label>\n                    <span>{{ artifactVersion?.Description }}</span>\n                  </div>\n                }\n              </div>\n\n              <!-- Version Attributes -->\n              @if (filteredAttributes.length > 0) {\n                <div class=\"attributes-section\">\n                  <h4>Version Attributes</h4>\n                  <div class=\"attributes-list\">\n                    @for (attr of filteredAttributes; track attr.ID) {\n                      <div class=\"attribute-item\">\n                        <label>{{ attr.Name }}</label>\n                        @if (attr.Value) {\n                          <span>{{ attr.Value }}</span>\n                        } @else {\n                          <span class=\"attribute-empty-pill\">Empty</span>\n                        }\n                      </div>\n                    }\n                  </div>\n                </div>\n              }\n            </div>\n\n          <!-- Links Tab - Conversations and Collections (always in DOM, hidden with CSS) -->\n          <div class=\"links-container\" [class.tab-hidden]=\"activeTab !== 'links'\">\n            @if (linksToShow.length > 0) {\n              <div class=\"links-section\">\n                @for (link of linksToShow; track link.id) {\n                  <div class=\"link-item\"\n                       [class.disabled]=\"!link.hasAccess\"\n                       [class.clickable]=\"link.hasAccess\"\n                       (click)=\"link.hasAccess ? onNavigateToLink(link) : null\"\n                       [title]=\"link.hasAccess ? 'Click to open' : 'No access'\">\n                    <div class=\"link-icon\">\n                      @if (link.type === 'conversation') {\n                        <i class=\"fas fa-comments\"></i>\n                      } @else {\n                        <i class=\"fas fa-folder\"></i>\n                      }\n                    </div>\n                    <div class=\"link-content\">\n                      <div class=\"link-name\">{{ link.name }}</div>\n                      <div class=\"link-type\">{{ link.type === 'conversation' ? 'Conversation' : 'Collection' }}</div>\n                    </div>\n                    <div class=\"link-actions\">\n                      <i class=\"fas fa-arrow-right\"></i>\n                    </div>\n                  </div>\n                }\n              </div>\n            } @else {\n              <div class=\"empty-state\">\n                <i class=\"fas fa-link\"></i>\n                <p>No links available</p>\n              </div>\n            }\n          </div>\n\n          <!-- Dynamic Plugin Tabs and Base Tabs (JSON, etc.) -->\n          @if (activeTab !== 'display' && activeTab !== 'details' && activeTab !== 'links') {\n            <!-- Check if this is a component tab -->\n            @if (GetComponentTabType(activeTab); as componentType) {\n              <div class=\"component-tab-content\">\n                <ng-container *ngComponentOutlet=\"componentType; inputs: GetComponentInputs(activeTab)\"></ng-container>\n              </div>\n            } @else {\n              @if (GetTabContent(activeTab); as tabData) {\n                <div class=\"dynamic-tab-content\">\n                  @switch (tabData.type) {\n                    @case ('markdown') {\n                      <div class=\"markdown-viewer\">\n                        <mj-markdown [data]=\"tabData.content\"\n                                     [enableCollapsibleHeadings]=\"true\"\n                                     [enableLineNumbers]=\"true\"\n                                     [enableSmartypants]=\"true\"\n                                     [enableHtml]=\"true\"></mj-markdown>\n                      </div>\n                    }\n                    @case ('json') {\n                      <div class=\"json-viewer\">\n                        <div class=\"json-toolbar\">\n                          <button class=\"btn-icon\" title=\"Copy JSON\" (click)=\"onCopyToClipboard()\">\n                            <i class=\"fas fa-copy\"></i> Copy\n                          </button>\n                        </div>\n                        <div class=\"json-editor-container\">\n                          <mj-code-editor\n                            [value]=\"tabData.content\"\n                            [language]=\"'json'\"\n                            [readonly]=\"true\"\n                            [lineWrapping]=\"true\"\n                            style=\"width: 100%; height: 100%;\">\n                          </mj-code-editor>\n                        </div>\n                      </div>\n                    }\n                    @case ('code') {\n                      <div class=\"code-viewer\">\n                        <div class=\"code-toolbar\">\n                          <button class=\"btn-icon\" title=\"Copy Code\" (click)=\"onCopyToClipboard()\">\n                            <i class=\"fas fa-copy\"></i> Copy\n                          </button>\n                        </div>\n                        <div class=\"code-editor-container\">\n                          <mj-code-editor\n                            [value]=\"tabData.content\"\n                            [language]=\"tabData.language || 'typescript'\"\n                            [readonly]=\"true\"\n                            [lineWrapping]=\"true\"\n                            style=\"width: 100%; height: 100%;\">\n                          </mj-code-editor>\n                        </div>\n                      </div>\n                    }\n                    @case ('html') {\n                      <div class=\"html-viewer\" [innerHTML]=\"tabData.content\"></div>\n                    }\n                    @case ('plaintext') {\n                      <pre class=\"plaintext-viewer\">{{ tabData.content }}</pre>\n                    }\n                  }\n                </div>\n              }\n            }\n          }\n        </div>\n      </div>\n    }\n  </div>\n</div>\n\n", styles: [".artifact-viewer-panel {\n  width: 100%;\n  height: 100%;\n  background: var(--mj-bg-surface);\n  border-left: 1px solid var(--mj-border-default);\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  box-sizing: border-box;\n}\n\n.panel-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: flex-start;\n  padding: 12px 16px;\n  border-bottom: 1px solid var(--mj-border-default);\n  background: var(--mj-bg-surface);\n  flex-shrink: 0;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.panel-header-left {\n  flex: 1;\n  min-width: 0;\n  margin-right: 16px;\n}\n\n.panel-header h3 {\n  margin: 0;\n  font-size: 14px;\n  font-weight: 600;\n  display: flex;\n  align-items: flex-start;\n  gap: 8px;\n  word-wrap: break-word;\n  overflow-wrap: break-word;\n}\n\n.panel-header h3 i {\n  color: var(--mj-brand-primary);\n  flex-shrink: 0;\n  margin-top: 2px;\n}\n\n.header-description {\n  margin: 4px 0 0 0;\n  font-size: 12px;\n  color: var(--mj-text-muted);\n  font-weight: normal;\n  word-wrap: break-word;\n  overflow-wrap: break-word;\n}\n\n.panel-header-right {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  flex-shrink: 0;\n}\n\n.version-selector {\n  position: relative;\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 4px 10px;\n  background: var(--mj-bg-surface-sunken);\n  border-radius: 12px;\n  font-size: 12px;\n  color: var(--mj-text-muted);\n  font-weight: 500;\n  transition: all 0.2s;\n}\n\n.version-selector.clickable {\n  cursor: pointer;\n}\n\n.version-selector.clickable:hover {\n  background: var(--mj-border-default);\n}\n\n.version-selector i {\n  font-size: 11px;\n}\n\n.version-selector .dropdown-icon {\n  margin-left: 2px;\n  transition: transform 0.2s;\n}\n\n.version-selector .dropdown-icon.open {\n  transform: rotate(180deg);\n}\n\n.version-label {\n  font-family: monospace;\n}\n\n.version-dropdown {\n  position: absolute;\n  top: calc(100% + 4px);\n  right: 0;\n  min-width: 200px;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  box-shadow: var(--mj-shadow-md);\n  z-index: 1000;\n  overflow: hidden;\n}\n\n.version-option {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 10px 12px;\n  cursor: pointer;\n  transition: background 0.15s;\n  font-size: 13px;\n}\n\n.version-option:hover {\n  background: var(--mj-bg-surface-sunken);\n}\n\n.version-option.selected {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n.version-option .version-number {\n  font-family: monospace;\n  font-weight: 600;\n  min-width: 35px;\n}\n\n.version-option .version-date {\n  flex: 1;\n  color: var(--mj-text-muted);\n  font-size: 12px;\n}\n\n.version-option i.fa-check {\n  color: var(--mj-status-success);\n  margin-left: auto;\n}\n\n.feedback-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-disabled);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n}\n\n.feedback-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-brand-primary);\n}\n\n.feedback-btn i {\n  font-size: 14px;\n}\n\n.save-to-collection-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-disabled);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n}\n\n.save-to-collection-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-muted);\n}\n\n.save-to-collection-btn i {\n  font-size: 14px;\n}\n\n.save-to-collection-btn.in-collection {\n  color: var(--mj-brand-primary);\n}\n\n.save-to-collection-btn.in-collection:hover {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n.share-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-disabled);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n}\n\n.share-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-brand-primary);\n}\n\n.share-btn i {\n  font-size: 14px;\n}\n\n.analyze-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-disabled);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n}\n\n.analyze-btn:hover {\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  color: var(--mj-brand-primary);\n}\n\n.analyze-btn i {\n  font-size: 14px;\n}\n\n.maximize-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-muted);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n}\n\n.maximize-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n}\n\n.maximize-btn i {\n  font-size: 14px;\n}\n\n.close-btn {\n  background: none;\n  border: none;\n  cursor: pointer;\n  color: var(--mj-text-muted);\n  padding: 6px;\n  border-radius: 4px;\n  transition: all 0.2s;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 28px;\n  height: 28px;\n}\n\n.close-btn:hover {\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-primary);\n}\n\n.close-btn i {\n  font-size: 14px;\n}\n\n.panel-content {\n  flex: 1;\n  overflow: hidden;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.artifact-content-wrapper {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  min-height: 0;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.loading-state,\n.error-state {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  gap: 12px;\n  padding: 40px 20px;\n  color: var(--mj-text-muted);\n}\n\n.error-state {\n  color: var(--mj-status-error);\n}\n\n.loading-state i {\n  font-size: 24px;\n}\n\n.artifact-meta {\n  display: grid;\n  grid-template-columns: repeat(auto-fit, minmax(150px, 1fr));\n  gap: 16px;\n  margin-bottom: 16px;\n  padding: 16px;\n  background: var(--mj-bg-surface-sunken);\n  border-radius: 8px;\n  flex-shrink: 0;\n}\n\n.meta-item {\n  display: flex;\n  flex-direction: column;\n  gap: 4px;\n}\n\n.meta-item label {\n  font-size: 12px;\n  font-weight: 500;\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.meta-item span {\n  font-size: 14px;\n  color: var(--mj-text-primary);\n}\n\n.artifact-description {\n  padding: 12px;\n  margin-bottom: 16px;\n  background: color-mix(in srgb, var(--mj-brand-primary) 10%, var(--mj-bg-surface));\n  border-left: 3px solid var(--mj-brand-primary);\n  border-radius: 4px;\n  color: var(--mj-brand-primary);\n  font-size: 14px;\n  flex-shrink: 0;\n}\n\n.json-viewer {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  overflow: hidden;\n  min-height: 0;\n}\n\n.json-editor-container {\n  flex: 1;\n  overflow: hidden;\n  min-height: 0;\n}\n\n.json-toolbar {\n  display: flex;\n  justify-content: flex-end;\n  gap: 8px;\n  padding: 8px 12px;\n  background: var(--mj-bg-surface-sunken);\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n\n.btn-icon {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 4px;\n  padding: 6px 12px;\n  cursor: pointer;\n  color: var(--mj-text-secondary);\n  font-size: 14px;\n  transition: all 0.2s;\n}\n\n.btn-icon:hover {\n  background: var(--mj-bg-surface-sunken);\n  border-color: var(--mj-text-disabled);\n}\n\n.btn-icon.btn-primary {\n  background: var(--mj-brand-primary);\n  border-color: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n\n.btn-icon.btn-primary:hover {\n  background: var(--mj-brand-primary-hover);\n  border-color: var(--mj-brand-primary-hover);\n}\n\n.btn-icon i {\n  font-size: 14px;\n}\n\n/* Library Dialog Styles */\n.modal-overlay {\n  position: fixed;\n  top: 0;\n  left: 0;\n  right: 0;\n  bottom: 0;\n  background: var(--mj-bg-overlay);\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  z-index: 10000;\n}\n\n.modal-content {\n  background: var(--mj-bg-surface);\n  border-radius: 12px;\n  box-shadow: var(--mj-shadow-lg);\n  max-width: 500px;\n  width: 90%;\n  max-height: 90vh;\n  display: flex;\n  flex-direction: column;\n}\n\n.modal-header {\n  display: flex;\n  justify-content: space-between;\n  align-items: center;\n  padding: 16px 20px;\n  border-bottom: 1px solid var(--mj-border-default);\n}\n\n.modal-header h3 {\n  margin: 0;\n  font-size: 16px;\n  font-weight: 600;\n  display: flex;\n  align-items: center;\n  gap: 8px;\n}\n\n.modal-header h3 i {\n  color: var(--mj-status-warning);\n}\n\n.modal-body {\n  padding: 20px;\n  overflow-y: auto;\n}\n\n.modal-footer {\n  display: flex;\n  justify-content: flex-end;\n  gap: 12px;\n  padding: 16px 20px;\n  border-top: 1px solid var(--mj-border-default);\n}\n\n.form-section {\n  margin-bottom: 20px;\n}\n\n.form-section label {\n  display: block;\n  margin-bottom: 8px;\n  font-size: 14px;\n  font-weight: 500;\n  color: var(--mj-text-secondary);\n}\n\n.form-select,\n.form-input {\n  width: 100%;\n  padding: 10px 12px;\n  border: 1px solid var(--mj-border-strong);\n  border-radius: 6px;\n  font-size: 14px;\n  color: var(--mj-text-primary);\n  background: var(--mj-bg-surface);\n  transition: border-color 0.2s;\n}\n\n.form-select:focus,\n.form-input:focus {\n  outline: none;\n  border-color: var(--mj-brand-primary);\n  box-shadow: 0 0 0 3px color-mix(in srgb, var(--mj-brand-primary) 10%, transparent);\n}\n\n.divider {\n  display: flex;\n  align-items: center;\n  margin: 24px 0;\n  color: var(--mj-text-disabled);\n  font-size: 12px;\n  font-weight: 500;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.divider::before,\n.divider::after {\n  content: '';\n  flex: 1;\n  height: 1px;\n  background: var(--mj-border-default);\n}\n\n.divider span {\n  padding: 0 12px;\n}\n\n.create-collection-row {\n  display: flex;\n  gap: 8px;\n}\n\n.create-collection-row .form-input {\n  flex: 1;\n}\n\n.btn {\n  display: flex;\n  align-items: center;\n  gap: 8px;\n  padding: 8px 16px;\n  border: none;\n  border-radius: 6px;\n  font-size: 14px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 0.2s;\n  white-space: nowrap;\n}\n\n.btn:disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.btn-primary {\n  background: var(--mj-brand-primary);\n  color: var(--mj-text-inverse);\n}\n\n.btn-primary:hover:not(:disabled) {\n  background: var(--mj-brand-primary-hover);\n}\n\n.btn-secondary {\n  background: var(--mj-bg-surface);\n  border: 1px solid var(--mj-border-strong);\n  color: var(--mj-text-secondary);\n}\n\n.btn-secondary:hover:not(:disabled) {\n  background: var(--mj-bg-surface-sunken);\n}\n\n/* Tab Navigation */\n.tab-navigation {\n  display: flex;\n  gap: 0;\n  border-bottom: 2px solid var(--mj-border-default);\n  padding: 0 16px;\n  background: var(--mj-bg-surface);\n}\n\n.tab-btn {\n  display: flex;\n  align-items: center;\n  gap: 6px;\n  padding: 12px 20px;\n  background: transparent;\n  border: none;\n  border-bottom: 2px solid transparent;\n  margin-bottom: -2px;\n  color: var(--mj-text-muted);\n  font-size: 13px;\n  font-weight: 500;\n  cursor: pointer;\n  transition: all 150ms ease;\n}\n\n.tab-btn:hover {\n  color: var(--mj-brand-primary);\n  background: var(--mj-bg-surface-sunken);\n}\n\n.tab-btn.active {\n  color: var(--mj-brand-primary);\n  border-bottom-color: var(--mj-brand-primary);\n}\n\n.tab-btn i {\n  font-size: 14px;\n}\n\n/* Tab Content */\n.tab-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n  width: 100%;\n  box-sizing: border-box;\n  margin-bottom: 5px;\n  min-width: 0;\n  min-height: 0;\n}\n\n/* Plugin Container */\n.plugin-container {\n  width: 100%;\n  height: 100%;\n  min-height: 0;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n}\n\n.plugin-container.plugin-hidden,\n.tab-hidden {\n  display: none;\n}\n\n/* Ensure artifact viewer component takes full height */\n.plugin-container mj-artifact-type-plugin-viewer {\n  display: flex;\n  flex-direction: column;\n  flex: 1;\n  min-height: 0;\n  width: 100%;\n}\n\n.display-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  position: relative;\n  width: 100%;\n  box-sizing: border-box;\n  overflow: hidden;\n  min-height: 0;\n  min-width: 0;\n  padding: 7px;\n}\n\n.display-toolbar {\n  position: absolute;\n  top: 12px;\n  right: 12px;\n  display: flex;\n  gap: 8px;\n  z-index: 10;\n}\n\n.markdown-content,\n.html-content {\n  flex: 1;\n  font-size: 14px;\n  line-height: 1.6;\n  width: 100%;\n  padding: 20px 10px 5px 20px; /* top right bottom left */\n  box-sizing: border-box;\n  overflow: auto;\n  min-height: 0;\n}\n\n.details-content {\n  padding: 20px;\n  width: 100%;\n  box-sizing: border-box;\n}\n\n.details-content .artifact-meta {\n  margin-bottom: 0;\n  padding: 20px;\n}\n\n.details-content .meta-item.full-width {\n  grid-column: 1 / -1;\n}\n\n.attributes-section {\n  margin-top: 24px;\n  padding: 24px;\n  background: var(--mj-bg-surface-sunken);\n  border-radius: 8px;\n}\n\n.attributes-section h4 {\n  margin: 0 0 16px 0;\n  font-size: 14px;\n  font-weight: 600;\n  color: var(--mj-text-primary);\n}\n\n.attributes-list {\n  display: grid;\n  grid-template-columns: repeat(auto-fill, minmax(250px, 1fr));\n  gap: 16px;\n}\n\n.attribute-item {\n  display: flex;\n  flex-direction: column;\n  gap: 6px;\n  padding: 12px;\n  background: var(--mj-bg-surface);\n  border-radius: 6px;\n  border: 1px solid var(--mj-border-default);\n}\n\n.attribute-item label {\n  font-size: 11px;\n  font-weight: 600;\n  color: var(--mj-text-muted);\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n.attribute-item span {\n  font-size: 13px;\n  color: var(--mj-text-primary);\n  word-break: break-word;\n}\n\n.attribute-empty-pill {\n  display: inline-block;\n  padding: 2px 8px;\n  background: var(--mj-bg-surface-sunken);\n  color: var(--mj-text-disabled);\n  font-size: 11px;\n  font-weight: 500;\n  border-radius: 4px;\n  text-transform: uppercase;\n  letter-spacing: 0.5px;\n}\n\n/* Links Tab */\n.links-container {\n  padding: 20px;\n}\n\n.links-section {\n  display: flex;\n  flex-direction: column;\n  gap: 12px;\n}\n\n.link-item {\n  display: flex;\n  align-items: center;\n  gap: 12px;\n  padding: 12px;\n  background: var(--mj-bg-surface-sunken);\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  transition: all 0.15s;\n}\n\n.link-item.clickable {\n  cursor: pointer;\n}\n\n.link-item.clickable:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: var(--mj-shadow-sm);\n  background: var(--mj-bg-surface-sunken);\n}\n\n.link-item.disabled {\n  opacity: 0.5;\n  cursor: not-allowed;\n}\n\n.link-item:hover {\n  border-color: var(--mj-brand-primary);\n  box-shadow: var(--mj-shadow-sm);\n}\n\n.link-icon {\n  width: 40px;\n  height: 40px;\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  background: var(--mj-bg-surface);\n  border-radius: 8px;\n  flex-shrink: 0;\n}\n\n.link-icon i {\n  font-size: 18px;\n  color: var(--mj-brand-primary);\n}\n\n.link-content {\n  flex: 1;\n  min-width: 0;\n}\n\n.link-name {\n  font-size: 14px;\n  font-weight: 500;\n  color: var(--mj-text-primary);\n  white-space: nowrap;\n  overflow: hidden;\n  text-overflow: ellipsis;\n}\n\n.link-type {\n  font-size: 12px;\n  color: var(--mj-text-muted);\n  margin-top: 2px;\n}\n\n.link-actions {\n  display: flex;\n  align-items: center;\n  justify-content: center;\n  width: 24px;\n  height: 24px;\n  flex-shrink: 0;\n}\n\n.link-actions i {\n  font-size: 14px;\n  color: var(--mj-text-muted);\n  transition: all 0.15s;\n}\n\n.link-item.clickable:hover .link-actions i {\n  color: var(--mj-brand-primary);\n  transform: translateX(2px);\n}\n\n.links-container .empty-state {\n  display: flex;\n  flex-direction: column;\n  align-items: center;\n  justify-content: center;\n  padding: 48px 24px;\n  color: var(--mj-text-disabled);\n  text-align: center;\n}\n\n.links-container .empty-state i {\n  font-size: 48px;\n  margin-bottom: 16px;\n  opacity: 0.3;\n}\n\n.links-container .empty-state p {\n  margin: 0;\n  font-size: 14px;\n}\n\n/* Dynamic Tab Content Styles */\n.dynamic-tab-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: hidden;\n  padding: 16px;\n}\n\n/* Custom component tab content */\n.component-tab-content {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  overflow: auto;\n  padding: 16px;\n}\n\n.markdown-viewer {\n  flex: 1;\n  overflow: auto;\n  padding: 20px;\n  background: var(--mj-bg-surface);\n  line-height: 1.6;\n}\n\n.markdown-viewer h1, .markdown-viewer h2, .markdown-viewer h3 {\n  margin-top: 24px;\n  margin-bottom: 12px;\n  font-weight: 600;\n}\n\n.markdown-viewer h1 { font-size: 24px; }\n.markdown-viewer h2 { font-size: 20px; }\n.markdown-viewer h3 { font-size: 18px; }\n\n.markdown-viewer p {\n  margin-bottom: 12px;\n}\n\n.markdown-viewer ul, .markdown-viewer ol {\n  margin-bottom: 12px;\n  padding-left: 24px;\n}\n\n.markdown-viewer code {\n  background: var(--mj-bg-surface-sunken);\n  padding: 2px 6px;\n  border-radius: 3px;\n  font-family: 'Courier New', monospace;\n  font-size: 13px;\n}\n\n.markdown-viewer pre {\n  background: var(--mj-bg-surface-sunken);\n  padding: 12px;\n  border-radius: 6px;\n  overflow-x: auto;\n  margin-bottom: 12px;\n}\n\n.markdown-viewer pre code {\n  background: none;\n  padding: 0;\n}\n\n.code-viewer {\n  flex: 1;\n  display: flex;\n  flex-direction: column;\n  border: 1px solid var(--mj-border-default);\n  border-radius: 8px;\n  overflow: hidden;\n  min-height: 0;\n}\n\n.code-toolbar {\n  display: flex;\n  justify-content: flex-end;\n  gap: 8px;\n  padding: 8px 12px;\n  background: var(--mj-bg-surface-sunken);\n  border-bottom: 1px solid var(--mj-border-default);\n  flex-shrink: 0;\n}\n\n.code-editor-container {\n  flex: 1;\n  overflow: hidden;\n  min-height: 0;\n}\n\n.plaintext-viewer {\n  flex: 1;\n  overflow: auto;\n  padding: 12px;\n  background: var(--mj-bg-surface-sunken);\n  font-family: 'Courier New', monospace;\n  font-size: 13px;\n  white-space: pre-wrap;\n}\n\n.html-viewer {\n  flex: 1;\n  overflow: auto;\n  padding: 20px;\n  background: var(--mj-bg-surface);\n}\n\n/* Mobile adjustments: 481px - 768px */\n@media (max-width: 768px) {\n  /* Add top border with slight visual separation from top nav */\n  .artifact-viewer-panel {\n    border-top: 3px solid var(--mj-brand-primary);\n    position: relative;\n  }\n\n  /* Create a small dark strip above the blue border to separate from top nav */\n  .artifact-viewer-panel::before {\n    content: '';\n    position: absolute;\n    top: -8px;\n    left: 0;\n    right: 0;\n    height: 8px;\n    background: var(--mj-brand-secondary);\n  }\n\n  .tab-navigation {\n    padding: 0 8px;\n    overflow-x: auto;\n    overflow-y: hidden;\n    -webkit-overflow-scrolling: touch;\n    scrollbar-width: none;\n  }\n\n  .tab-navigation::-webkit-scrollbar {\n    display: none;\n  }\n\n  .tab-btn {\n    padding: 10px 12px;\n    font-size: 12px;\n    white-space: nowrap;\n    flex-shrink: 0;\n  }\n\n  .tab-btn i {\n    font-size: 13px;\n  }\n\n  .panel-header {\n    padding: 12px;\n  }\n\n  .dynamic-tab-content {\n    padding: 12px;\n  }\n\n  .markdown-viewer {\n    padding: 12px;\n  }\n}\n\n/* Small Phone adjustments: <= 480px */\n@media (max-width: 480px) {\n  .tab-navigation {\n    padding: 0 4px;\n  }\n\n  .tab-btn {\n    padding: 8px 10px;\n    font-size: 11px;\n    gap: 4px;\n  }\n\n  .tab-btn i {\n    font-size: 12px;\n  }\n\n  .panel-header {\n    padding: 8px;\n  }\n\n  .dynamic-tab-content {\n    padding: 8px;\n  }\n\n  .markdown-viewer {\n    padding: 8px;\n  }\n}\n"] }]
     }], () => [{ type: i0.ChangeDetectorRef }, { type: i1.MJNotificationService }, { type: i2.DomSanitizer }, { type: i3.ArtifactIconService }], { artifactId: [{
             type: Input
         }], currentUser: [{
@@ -1741,6 +1747,8 @@ export class ArtifactViewerPanelComponent extends BaseAngularComponent {
             type: Output
         }], analyzeRequested: [{
             type: Output
+        }], applyFormRequested: [{
+            type: Output
         }], pluginViewer: [{
             type: ViewChild,
             args: [ArtifactTypePluginViewerComponent]