@memberjunction/ng-dashboards 2.94.0 → 2.95.0

package/dist/ComponentStudio/components/artifact-selection-dialog.component.js

@@ -0,0 +1,602 @@
+import { Component } from '@angular/core';
+import { RunView, Metadata } from '@memberjunction/core';
+import { Subject, debounceTime, distinctUntilChanged } from 'rxjs';
+import { takeUntil } from 'rxjs/operators';
+import * as i0 from "@angular/core";
+import * as i1 from "@progress/kendo-angular-dialog";
+import * as i2 from "@angular/forms";
+import * as i3 from "@progress/kendo-angular-inputs";
+import * as i4 from "@progress/kendo-angular-buttons";
+import * as i5 from "@angular/common";
+const _forTrack0 = ($index, $item) => $item.ID;
+function ArtifactSelectionDialogComponent_Conditional_8_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span");
+    i0.ɵɵtext(1, "Filters");
+    i0.ɵɵelementEnd();
+} }
+function ArtifactSelectionDialogComponent_Conditional_11_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "span", 8);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate(ctx_r0.getActiveFilterCount());
+} }
+function ArtifactSelectionDialogComponent_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    const _r2 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 9)(1, "div", 27)(2, "label");
+    i0.ɵɵtext(3, "Search");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "input", 28);
+    i0.ɵɵtwoWayListener("ngModelChange", function ArtifactSelectionDialogComponent_Conditional_12_Template_input_ngModelChange_4_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r0.searchTerm, $event) || (ctx_r0.searchTerm = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("input", function ArtifactSelectionDialogComponent_Conditional_12_Template_input_input_4_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onSearchInput()); });
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(5, "div", 27)(6, "label");
+    i0.ɵɵtext(7, "Artifact Type");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "select", 29);
+    i0.ɵɵtwoWayListener("ngModelChange", function ArtifactSelectionDialogComponent_Conditional_12_Template_select_ngModelChange_8_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r0.selectedArtifactType, $event) || (ctx_r0.selectedArtifactType = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("change", function ArtifactSelectionDialogComponent_Conditional_12_Template_select_change_8_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.onArtifactTypeChange()); });
+    i0.ɵɵelementStart(9, "option", 30);
+    i0.ɵɵtext(10, "All Types");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(11, "option", 31);
+    i0.ɵɵtext(12, "Component");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(13, "option", 32);
+    i0.ɵɵtext(14, "Report");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(15, "option", 33);
+    i0.ɵɵtext(16, "Dashboard");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵelementStart(17, "div", 27)(18, "label");
+    i0.ɵɵtext(19, "Filter by User");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(20, "input", 34);
+    i0.ɵɵtwoWayListener("ngModelChange", function ArtifactSelectionDialogComponent_Conditional_12_Template_input_ngModelChange_20_listener($event) { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r0.userEmail, $event) || (ctx_r0.userEmail = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("input", function ArtifactSelectionDialogComponent_Conditional_12_Template_input_input_20_listener() { i0.ɵɵrestoreView(_r2); const ctx_r0 = i0.ɵɵnextContext(); return i0.ɵɵresetView(ctx_r0.filterArtifacts()); });
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(4);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r0.searchTerm);
+    i0.ɵɵadvance(4);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r0.selectedArtifactType);
+    i0.ɵɵadvance(12);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r0.userEmail);
+} }
+function ArtifactSelectionDialogComponent_Conditional_24_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 17);
+    i0.ɵɵelement(1, "i", 35);
+    i0.ɵɵelementStart(2, "p");
+    i0.ɵɵtext(3, "Loading artifacts...");
+    i0.ɵɵelementEnd()();
+} }
+function ArtifactSelectionDialogComponent_Conditional_25_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 18);
+    i0.ɵɵelement(1, "i", 36);
+    i0.ɵɵelementStart(2, "p");
+    i0.ɵɵtext(3, "No artifacts found");
+    i0.ɵɵelementEnd()();
+} }
+function ArtifactSelectionDialogComponent_Conditional_26_For_1_Conditional_7_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 43);
+    i0.ɵɵtext(1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const artifact_r4 = i0.ɵɵnextContext().$implicit;
+    i0.ɵɵadvance();
+    i0.ɵɵtextInterpolate1(" ", artifact_r4.Description, " ");
+} }
+function ArtifactSelectionDialogComponent_Conditional_26_For_1_Template(rf, ctx) { if (rf & 1) {
+    const _r3 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 38);
+    i0.ɵɵlistener("click", function ArtifactSelectionDialogComponent_Conditional_26_For_1_Template_div_click_0_listener() { const artifact_r4 = i0.ɵɵrestoreView(_r3).$implicit; const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.selectArtifact(artifact_r4)); });
+    i0.ɵɵelementStart(1, "div", 39)(2, "div", 40)(3, "div", 41);
+    i0.ɵɵelement(4, "i", 42);
+    i0.ɵɵelementStart(5, "span");
+    i0.ɵɵtext(6);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(7, ArtifactSelectionDialogComponent_Conditional_26_For_1_Conditional_7_Template, 2, 1, "div", 43);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(8, "div", 44)(9, "div");
+    i0.ɵɵtext(10);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(11, "div");
+    i0.ɵɵtext(12);
+    i0.ɵɵpipe(13, "date");
+    i0.ɵɵelementEnd()()()();
+} if (rf & 2) {
+    const artifact_r4 = ctx.$implicit;
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵclassProp("selected", (ctx_r0.selectedArtifact == null ? null : ctx_r0.selectedArtifact.ID) === artifact_r4.ID);
+    i0.ɵɵadvance(6);
+    i0.ɵɵtextInterpolate(artifact_r4.Name);
+    i0.ɵɵadvance();
+    i0.ɵɵconditional(artifact_r4.Description ? 7 : -1);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate(artifact_r4.ArtifactType);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(13, 6, artifact_r4.__mj_UpdatedAt, "short"));
+} }
+function ArtifactSelectionDialogComponent_Conditional_26_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵrepeaterCreate(0, ArtifactSelectionDialogComponent_Conditional_26_For_1_Template, 14, 9, "div", 37, _forTrack0);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵrepeater(ctx_r0.artifacts);
+} }
+function ArtifactSelectionDialogComponent_Conditional_33_Template(rf, ctx) { if (rf & 1) {
+    const _r5 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 23)(1, "kendo-textbox", 45);
+    i0.ɵɵtwoWayListener("valueChange", function ArtifactSelectionDialogComponent_Conditional_33_Template_kendo_textbox_valueChange_1_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r0 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r0.newArtifactName, $event) || (ctx_r0.newArtifactName = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(2, "kendo-textarea", 46);
+    i0.ɵɵtwoWayListener("valueChange", function ArtifactSelectionDialogComponent_Conditional_33_Template_kendo_textarea_valueChange_2_listener($event) { i0.ɵɵrestoreView(_r5); const ctx_r0 = i0.ɵɵnextContext(); i0.ɵɵtwoWayBindingSet(ctx_r0.newArtifactDescription, $event) || (ctx_r0.newArtifactDescription = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance();
+    i0.ɵɵtwoWayProperty("value", ctx_r0.newArtifactName);
+    i0.ɵɵadvance();
+    i0.ɵɵtwoWayProperty("value", ctx_r0.newArtifactDescription);
+} }
+function ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Conditional_12_For_4_Template(rf, ctx) { if (rf & 1) {
+    const _r7 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "label", 57)(1, "input", 58);
+    i0.ɵɵtwoWayListener("ngModelChange", function ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Conditional_12_For_4_Template_input_ngModelChange_1_listener($event) { i0.ɵɵrestoreView(_r7); const ctx_r0 = i0.ɵɵnextContext(4); i0.ɵɵtwoWayBindingSet(ctx_r0.selectedVersion, $event) || (ctx_r0.selectedVersion = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(2, "div", 59)(3, "div", 60);
+    i0.ɵɵtext(4);
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(5, "div", 61);
+    i0.ɵɵtext(6);
+    i0.ɵɵpipe(7, "date");
+    i0.ɵɵelementEnd()()();
+} if (rf & 2) {
+    const version_r8 = ctx.$implicit;
+    const ctx_r0 = i0.ɵɵnextContext(4);
+    i0.ɵɵclassProp("selected", (ctx_r0.selectedVersion == null ? null : ctx_r0.selectedVersion.ID) === version_r8.ID);
+    i0.ɵɵadvance();
+    i0.ɵɵproperty("value", version_r8);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r0.selectedVersion);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1("Version ", version_r8.Version, "");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate(i0.ɵɵpipeBind2(7, 6, version_r8.__mj_UpdatedAt, "short"));
+} }
+function ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Conditional_12_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 56);
+    i0.ɵɵelement(1, "i", 62);
+    i0.ɵɵelementStart(2, "span");
+    i0.ɵɵtext(3);
+    i0.ɵɵelementEnd()();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(4);
+    i0.ɵɵadvance(3);
+    i0.ɵɵtextInterpolate1("Warning: This will overwrite version ", ctx_r0.selectedVersion.Version, "");
+} }
+function ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Conditional_12_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 54)(1, "label");
+    i0.ɵɵtext(2, "Select Version");
+    i0.ɵɵelementEnd();
+    i0.ɵɵrepeaterCreate(3, ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Conditional_12_For_4_Template, 8, 9, "label", 55, _forTrack0);
+    i0.ɵɵelementEnd();
+    i0.ɵɵtemplate(5, ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Conditional_12_Conditional_5_Template, 4, 1, "div", 56);
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(3);
+    i0.ɵɵadvance(3);
+    i0.ɵɵrepeater(ctx_r0.artifactVersions);
+    i0.ɵɵadvance(2);
+    i0.ɵɵconditional(ctx_r0.selectedVersion ? 5 : -1);
+} }
+function ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Template(rf, ctx) { if (rf & 1) {
+    const _r6 = i0.ɵɵgetCurrentView();
+    i0.ɵɵelementStart(0, "div", 48)(1, "div", 50)(2, "label");
+    i0.ɵɵtext(3, "Action");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "label", 51)(5, "input", 52);
+    i0.ɵɵtwoWayListener("ngModelChange", function ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Template_input_ngModelChange_5_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r0 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r0.versionAction, $event) || (ctx_r0.versionAction = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵlistener("change", function ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Template_input_change_5_listener() { i0.ɵɵrestoreView(_r6); const ctx_r0 = i0.ɵɵnextContext(2); return i0.ɵɵresetView(ctx_r0.selectedVersion = null); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(6, "span");
+    i0.ɵɵtext(7);
+    i0.ɵɵelementEnd()();
+    i0.ɵɵelementStart(8, "label", 51)(9, "input", 53);
+    i0.ɵɵtwoWayListener("ngModelChange", function ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Template_input_ngModelChange_9_listener($event) { i0.ɵɵrestoreView(_r6); const ctx_r0 = i0.ɵɵnextContext(2); i0.ɵɵtwoWayBindingSet(ctx_r0.versionAction, $event) || (ctx_r0.versionAction = $event); return i0.ɵɵresetView($event); });
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(10, "span");
+    i0.ɵɵtext(11, "Update Existing Version");
+    i0.ɵɵelementEnd()()();
+    i0.ɵɵtemplate(12, ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Conditional_12_Template, 6, 1);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext(2);
+    i0.ɵɵadvance(5);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r0.versionAction);
+    i0.ɵɵadvance(2);
+    i0.ɵɵtextInterpolate1("Create New Version (v", ctx_r0.getNextVersionNumber(), ")");
+    i0.ɵɵadvance(2);
+    i0.ɵɵtwoWayProperty("ngModel", ctx_r0.versionAction);
+    i0.ɵɵadvance(3);
+    i0.ɵɵconditional(ctx_r0.versionAction === "update" ? 12 : -1);
+} }
+function ArtifactSelectionDialogComponent_Conditional_34_Conditional_6_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 49);
+    i0.ɵɵelement(1, "i", 63);
+    i0.ɵɵelementStart(2, "p");
+    i0.ɵɵtext(3, "No versions available for this artifact.");
+    i0.ɵɵelementEnd();
+    i0.ɵɵelementStart(4, "p");
+    i0.ɵɵtext(5, "A new version will be created.");
+    i0.ɵɵelementEnd()();
+} }
+function ArtifactSelectionDialogComponent_Conditional_34_Template(rf, ctx) { if (rf & 1) {
+    i0.ɵɵelementStart(0, "div", 24)(1, "div", 5)(2, "h4");
+    i0.ɵɵelement(3, "i", 47);
+    i0.ɵɵtext(4, " Version");
+    i0.ɵɵelementEnd()();
+    i0.ɵɵtemplate(5, ArtifactSelectionDialogComponent_Conditional_34_Conditional_5_Template, 13, 4, "div", 48)(6, ArtifactSelectionDialogComponent_Conditional_34_Conditional_6_Template, 6, 0, "div", 49);
+    i0.ɵɵelementEnd();
+} if (rf & 2) {
+    const ctx_r0 = i0.ɵɵnextContext();
+    i0.ɵɵadvance(5);
+    i0.ɵɵconditional(ctx_r0.artifactVersions.length > 0 ? 5 : 6);
+} }
+export class ArtifactSelectionDialogComponent {
+    dialog;
+    // Data
+    artifacts = [];
+    artifactVersions = [];
+    // Paging State
+    currentPage = 0;
+    pageSize = 25;
+    totalArtifacts = 0;
+    hasMorePages = false;
+    // UI State
+    isLoading = true;
+    searchTerm = '';
+    userEmail = '';
+    selectedArtifactType = '';
+    showNewArtifactForm = false;
+    isFilterPanelCollapsed = false;
+    // Selection State
+    selectedArtifact = null;
+    selectedVersion = null;
+    versionAction = 'new';
+    // New Artifact Form
+    newArtifactName = '';
+    newArtifactDescription = '';
+    metadata = new Metadata();
+    currentUser = null;
+    destroy$ = new Subject();
+    searchSubject = new Subject();
+    constructor(dialog) {
+        this.dialog = dialog;
+    }
+    async ngOnInit() {
+        // Setup search debouncing
+        this.searchSubject.pipe(debounceTime(300), distinctUntilChanged(), takeUntil(this.destroy$)).subscribe(() => {
+            this.filterArtifacts();
+        });
+        await this.filterArtifacts();
+    }
+    ngOnDestroy() {
+        this.destroy$.next();
+        this.destroy$.complete();
+    }
+    async loadArtifacts() {
+        this.isLoading = true;
+        try {
+            const rv = new RunView();
+            // Calculate StartRow for server-side paging
+            const startRow = this.currentPage * this.pageSize;
+            // Load artifacts with paging
+            const result = await rv.RunView({
+                ExtraFilter: this._artifactFilter,
+                EntityName: 'MJ: Conversation Artifacts',
+                OrderBy: '__mj_UpdatedAt DESC',
+                MaxRows: this.pageSize,
+                StartRow: startRow,
+                ResultType: 'entity_object'
+            });
+            if (result.Success && result.Results) {
+                this.artifacts = result.Results;
+                // Calculate total pages using TotalRowCount from server
+                this.totalArtifacts = result.TotalRowCount || 0;
+                const totalPages = Math.ceil(this.totalArtifacts / this.pageSize);
+                this.hasMorePages = this.currentPage < totalPages - 1;
+            }
+        }
+        catch (error) {
+            console.error('Error loading artifacts:', error);
+        }
+        finally {
+            this.isLoading = false;
+        }
+    }
+    _artifactFilter = undefined;
+    async filterArtifacts() {
+        // Reset to first page when filters change
+        this.currentPage = 0;
+        const filters = [];
+        // Filter by search term
+        if (this.searchTerm?.trim()) {
+            const term = this.searchTerm.toLowerCase();
+            filters.push(`(Name LIKE '%${term}%' OR Description LIKE '%${term}%')`);
+        }
+        // Filter by artifact type
+        if (this.selectedArtifactType) {
+            filters.push(`ArtifactTypeID IN (SELECT ID FROM __mj.vwArtifactTypes WHERE Name = '${this.selectedArtifactType}')`);
+        }
+        // Filter by user email if provided
+        if (this.userEmail?.trim()) {
+            const md = new Metadata();
+            const schemaName = md.EntityByName("Conversations")?.SchemaName || "__mj";
+            const userFilter = `ConversationID IN(SELECT ID FROM ${schemaName}.vwConversations WHERE [User] LIKE '%${this.userEmail.trim()}%')`;
+            filters.push(userFilter);
+        }
+        // Combine all filters
+        this._artifactFilter = filters.length > 0 ? filters.join(' AND ') : undefined;
+        await this.loadArtifacts();
+    }
+    selectCreateNew() {
+        this.showNewArtifactForm = true;
+        this.selectedArtifact = null;
+        this.selectedVersion = null;
+    }
+    async selectArtifact(artifact) {
+        this.selectedArtifact = artifact;
+        this.showNewArtifactForm = false;
+        this.versionAction = 'new';
+        this.selectedVersion = null;
+        // Load versions for this artifact
+        await this.loadVersions(artifact.ID);
+    }
+    async loadVersions(artifactId) {
+        try {
+            const rv = new RunView();
+            const result = await rv.RunView({
+                EntityName: 'MJ: Conversation Artifact Versions',
+                ExtraFilter: `ConversationArtifactID = '${artifactId}'`,
+                OrderBy: 'Version DESC',
+                ResultType: 'entity_object'
+            });
+            if (result.Success && result.Results) {
+                this.artifactVersions = result.Results;
+            }
+        }
+        catch (error) {
+            console.error('Error loading versions:', error);
+            this.artifactVersions = [];
+        }
+    }
+    getNextVersionNumber() {
+        if (this.artifactVersions.length === 0)
+            return 1;
+        return Math.max(...this.artifactVersions.map(v => v.Version)) + 1;
+    }
+    // Paging methods
+    async nextPage() {
+        if (this.hasMorePages) {
+            this.currentPage++;
+            await this.loadArtifacts();
+        }
+    }
+    async previousPage() {
+        if (this.currentPage > 0) {
+            this.currentPage--;
+            await this.loadArtifacts();
+        }
+    }
+    canGoNext() {
+        return this.hasMorePages;
+    }
+    canGoPrevious() {
+        return this.currentPage > 0;
+    }
+    getTotalPages() {
+        return Math.ceil(this.totalArtifacts / this.pageSize);
+    }
+    toggleFilterPanel() {
+        this.isFilterPanelCollapsed = !this.isFilterPanelCollapsed;
+    }
+    onSearchInput() {
+        this.searchSubject.next(this.searchTerm);
+    }
+    onArtifactTypeChange() {
+        // Clear selected artifact when type changes
+        this.selectedArtifact = null;
+        this.selectedVersion = null;
+        this.artifactVersions = [];
+        this.filterArtifacts();
+    }
+    getActiveFilterCount() {
+        let count = 0;
+        if (this.searchTerm?.trim())
+            count++;
+        if (this.selectedArtifactType)
+            count++;
+        if (this.userEmail?.trim())
+            count++;
+        return count;
+    }
+    canSave() {
+        if (this.showNewArtifactForm) {
+            return this.newArtifactName.trim().length > 0;
+        }
+        if (!this.selectedArtifact)
+            return false;
+        if (this.versionAction === 'update') {
+            return this.selectedVersion !== null;
+        }
+        return true;
+    }
+    getSaveButtonText() {
+        if (this.showNewArtifactForm) {
+            return 'Create & Save';
+        }
+        if (this.versionAction === 'update' && this.selectedVersion) {
+            return `Update Version ${this.selectedVersion.Version}`;
+        }
+        return `Save as Version ${this.getNextVersionNumber()}`;
+    }
+    cancel() {
+        this.dialog.close(undefined);
+    }
+    async save() {
+        if (!this.canSave())
+            return;
+        // Handle new artifact creation
+        if (this.showNewArtifactForm) {
+            const newArtifact = await this.createNewArtifact();
+            if (newArtifact) {
+                const result = {
+                    artifact: newArtifact,
+                    action: 'new-version'
+                };
+                this.dialog.close(result);
+            }
+            return;
+        }
+        // Handle existing artifact selection
+        if (this.selectedArtifact) {
+            const result = {
+                artifact: this.selectedArtifact,
+                action: this.versionAction === 'update' ? 'update-version' : 'new-version',
+                versionToUpdate: this.versionAction === 'update' ? this.selectedVersion : undefined
+            };
+            // If updating, show confirmation
+            if (this.versionAction === 'update') {
+                const confirm = window.confirm(`Are you sure you want to overwrite version ${this.selectedVersion.Version}? This action cannot be undone.`);
+                if (!confirm)
+                    return;
+            }
+            this.dialog.close(result);
+        }
+    }
+    async createNewArtifact() {
+        try {
+            const artifact = await this.metadata.GetEntityObject('MJ: Conversation Artifacts');
+            artifact.Name = this.newArtifactName;
+            artifact.Description = this.newArtifactDescription || null;
+            // Get Component artifact type
+            const rv = new RunView();
+            const typeResult = await rv.RunView({
+                EntityName: 'MJ: Artifact Types',
+                ExtraFilter: `Name = 'Component'`,
+                MaxRows: 1
+            });
+            if (typeResult.Success && typeResult.Results?.length > 0) {
+                artifact.ArtifactTypeID = typeResult.Results[0].ID;
+            }
+            artifact.SharingScope = 'None';
+            artifact.Comments = 'Created from Component Studio';
+            const saveResult = await artifact.Save();
+            if (saveResult) {
+                return artifact;
+            }
+            else {
+                console.error('Failed to create artifact:', artifact.LatestResult?.Message);
+                alert('Failed to create artifact. Check console for details.');
+                return null;
+            }
+        }
+        catch (error) {
+            console.error('Error creating artifact:', error);
+            alert('Error creating artifact. Check console for details.');
+            return null;
+        }
+    }
+    static ɵfac = function ArtifactSelectionDialogComponent_Factory(t) { return new (t || ArtifactSelectionDialogComponent)(i0.ɵɵdirectiveInject(i1.DialogRef)); };
+    static ɵcmp = /*@__PURE__*/ i0.ɵɵdefineComponent({ type: ArtifactSelectionDialogComponent, selectors: [["app-artifact-selection-dialog"]], decls: 41, vars: 23, consts: [[3, "close"], [2, "font-size", "18px"], [1, "fa-solid", "fa-save"], [1, "artifact-selection-content"], [1, "filter-panel"], [1, "panel-header"], ["kendoButton", "", 3, "click", "fillMode", "themeColor"], [1, "fa-solid", "fa-filter"], [1, "filter-count"], [1, "filter-content"], [1, "main-content"], [1, "paging-controls"], ["kendoButton", "", 3, "click", "disabled", "themeColor"], [1, "fa-solid", "fa-chevron-left"], [1, "page-info"], [1, "fa-solid", "fa-chevron-right"], [1, "artifacts-list"], [1, "loading-state"], [1, "empty-state"], [1, "create-section"], [1, "divider"], ["kendoButton", "", 1, "create-btn", 3, "click", "themeColor"], [1, "fa-solid", "fa-plus"], [1, "new-artifact-form"], [1, "version-panel"], ["kendoButton", "", 3, "click", "themeColor", "disabled"], ["kendoButton", "", 3, "click"], [1, "filter-group"], ["type", "text", "placeholder", "Name or description...", 1, "filter-input", 3, "ngModelChange", "input", "ngModel"], [1, "filter-select", 3, "ngModelChange", "change", "ngModel"], ["value", ""], ["value", "Component"], ["value", "Report"], ["value", "Dashboard"], ["type", "text", "placeholder", "Enter user email...", 1, "filter-input", 3, "ngModelChange", "input", "ngModel"], [1, "fa-solid", "fa-spinner", "fa-spin"], [1, "fa-solid", "fa-inbox"], [1, "artifact-item", 3, "selected"], [1, "artifact-item", 3, "click"], [1, "artifact-content"], [1, "artifact-main"], [1, "artifact-name"], [1, "fa-solid", "fa-file-code"], [1, "artifact-description"], [1, "artifact-meta"], ["placeholder", "Artifact name...", 3, "valueChange", "value"], ["placeholder", "Description (optional)...", 3, "valueChange", "value"], [1, "fa-solid", "fa-code-branch"], [1, "version-content"], [1, "info-state"], [1, "version-actions"], [1, "radio-label"], ["type", "radio", "name", "versionAction", "value", "new", 3, "ngModelChange", "change", "ngModel"], ["type", "radio", "name", "versionAction", "value", "update", 3, "ngModelChange", "ngModel"], [1, "version-selection"], [1, "version-item", 3, "selected"], [1, "warning"], [1, "version-item"], ["type", "radio", "name", "selectedVersion", 3, "ngModelChange", "value", "ngModel"], [1, "version-info"], [1, "version-number"], [1, "version-date"], [1, "fa-solid", "fa-exclamation-triangle"], [1, "fa-solid", "fa-info-circle"]], template: function ArtifactSelectionDialogComponent_Template(rf, ctx) { if (rf & 1) {
+            i0.ɵɵelementStart(0, "div")(1, "kendo-dialog-titlebar", 0);
+            i0.ɵɵlistener("close", function ArtifactSelectionDialogComponent_Template_kendo_dialog_titlebar_close_1_listener() { return ctx.cancel(); });
+            i0.ɵɵelementStart(2, "div", 1);
+            i0.ɵɵelement(3, "i", 2);
+            i0.ɵɵtext(4, " Save Component to Artifact ");
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(5, "div", 3)(6, "div", 4)(7, "div", 5);
+            i0.ɵɵtemplate(8, ArtifactSelectionDialogComponent_Conditional_8_Template, 2, 0, "span");
+            i0.ɵɵelementStart(9, "button", 6);
+            i0.ɵɵlistener("click", function ArtifactSelectionDialogComponent_Template_button_click_9_listener() { return ctx.toggleFilterPanel(); });
+            i0.ɵɵelement(10, "i", 7);
+            i0.ɵɵtemplate(11, ArtifactSelectionDialogComponent_Conditional_11_Template, 2, 1, "span", 8);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵtemplate(12, ArtifactSelectionDialogComponent_Conditional_12_Template, 21, 3, "div", 9);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(13, "div", 10)(14, "div", 11)(15, "button", 12);
+            i0.ɵɵlistener("click", function ArtifactSelectionDialogComponent_Template_button_click_15_listener() { return ctx.previousPage(); });
+            i0.ɵɵelement(16, "i", 13);
+            i0.ɵɵtext(17, " Previous ");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(18, "span", 14);
+            i0.ɵɵtext(19);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(20, "button", 12);
+            i0.ɵɵlistener("click", function ArtifactSelectionDialogComponent_Template_button_click_20_listener() { return ctx.nextPage(); });
+            i0.ɵɵtext(21, " Next ");
+            i0.ɵɵelement(22, "i", 15);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵelementStart(23, "div", 16);
+            i0.ɵɵtemplate(24, ArtifactSelectionDialogComponent_Conditional_24_Template, 4, 0, "div", 17)(25, ArtifactSelectionDialogComponent_Conditional_25_Template, 4, 0, "div", 18)(26, ArtifactSelectionDialogComponent_Conditional_26_Template, 2, 0);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(27, "div", 19)(28, "div", 20);
+            i0.ɵɵtext(29, "OR CREATE NEW ARTIFACT");
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(30, "button", 21);
+            i0.ɵɵlistener("click", function ArtifactSelectionDialogComponent_Template_button_click_30_listener() { return ctx.selectCreateNew(); });
+            i0.ɵɵelement(31, "i", 22);
+            i0.ɵɵtext(32, " Create New Artifact ");
+            i0.ɵɵelementEnd();
+            i0.ɵɵtemplate(33, ArtifactSelectionDialogComponent_Conditional_33_Template, 3, 2, "div", 23);
+            i0.ɵɵelementEnd()();
+            i0.ɵɵtemplate(34, ArtifactSelectionDialogComponent_Conditional_34_Template, 7, 1, "div", 24);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(35, "kendo-dialog-actions")(36, "button", 25);
+            i0.ɵɵlistener("click", function ArtifactSelectionDialogComponent_Template_button_click_36_listener() { return ctx.save(); });
+            i0.ɵɵelement(37, "i", 2);
+            i0.ɵɵtext(38);
+            i0.ɵɵelementEnd();
+            i0.ɵɵelementStart(39, "button", 26);
+            i0.ɵɵlistener("click", function ArtifactSelectionDialogComponent_Template_button_click_39_listener() { return ctx.cancel(); });
+            i0.ɵɵtext(40, "Cancel");
+            i0.ɵɵelementEnd()()();
+        } if (rf & 2) {
+            i0.ɵɵadvance(6);
+            i0.ɵɵstyleProp("width", ctx.isFilterPanelCollapsed ? "40px" : "280px");
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(!ctx.isFilterPanelCollapsed ? 8 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵclassProp("filter-active", ctx.getActiveFilterCount() > 0);
+            i0.ɵɵproperty("fillMode", "flat")("themeColor", ctx.getActiveFilterCount() > 0 ? "primary" : "base");
+            i0.ɵɵadvance(2);
+            i0.ɵɵconditional(ctx.isFilterPanelCollapsed && ctx.getActiveFilterCount() > 0 ? 11 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(!ctx.isFilterPanelCollapsed ? 12 : -1);
+            i0.ɵɵadvance(3);
+            i0.ɵɵproperty("disabled", !ctx.canGoPrevious())("themeColor", "base");
+            i0.ɵɵadvance(4);
+            i0.ɵɵtextInterpolate3(" Page ", ctx.currentPage + 1, " of ", ctx.getTotalPages(), " (", ctx.totalArtifacts, " total items) ");
+            i0.ɵɵadvance();
+            i0.ɵɵproperty("disabled", !ctx.canGoNext())("themeColor", "base");
+            i0.ɵɵadvance(4);
+            i0.ɵɵconditional(ctx.isLoading ? 24 : ctx.artifacts.length === 0 ? 25 : 26);
+            i0.ɵɵadvance(6);
+            i0.ɵɵproperty("themeColor", "primary");
+            i0.ɵɵadvance(3);
+            i0.ɵɵconditional(ctx.showNewArtifactForm ? 33 : -1);
+            i0.ɵɵadvance();
+            i0.ɵɵconditional(ctx.selectedArtifact ? 34 : -1);
+            i0.ɵɵadvance(2);
+            i0.ɵɵproperty("themeColor", ctx.versionAction === "update" && ctx.selectedVersion ? "warning" : "primary")("disabled", !ctx.canSave());
+            i0.ɵɵadvance(2);
+            i0.ɵɵtextInterpolate1(" ", ctx.getSaveButtonText(), " ");
+        } }, dependencies: [i2.NgSelectOption, i2.ɵNgSelectMultipleOption, i2.DefaultValueAccessor, i2.SelectControlValueAccessor, i2.RadioControlValueAccessor, i2.NgControlStatus, i2.NgModel, i3.TextAreaComponent, i3.TextBoxComponent, i1.DialogTitleBarComponent, i1.DialogActionsComponent, i4.ButtonComponent, i5.DatePipe], styles: ["\n\n.artifact-selection-content[_ngcontent-%COMP%] {\n    height: 100%;\n    display: flex;\n    flex-direction: row;\n}\n\n\n\n.filter-panel[_ngcontent-%COMP%] {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    border-right: 1px solid #ddd;\n    transition: width 0.3s ease;\n    flex-shrink: 0;\n    background: #fafafa;\n}\n\n.panel-header[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 10px;\n    border-bottom: 1px solid #eee;\n    font-weight: bold;\n    color: #666;\n}\n\n.filter-content[_ngcontent-%COMP%] {\n    flex: 1;\n    padding: 15px;\n    overflow-y: auto;\n}\n\n.filter-group[_ngcontent-%COMP%] {\n    margin-bottom: 15px;\n}\n\n.filter-group[_ngcontent-%COMP%]   label[_ngcontent-%COMP%] {\n    display: block;\n    margin-bottom: 5px;\n    font-weight: 500;\n    color: #555;\n}\n\n.filter-input[_ngcontent-%COMP%], \n.filter-select[_ngcontent-%COMP%] {\n    width: 100%;\n    padding: 8px;\n    border: 1px solid #ccc;\n    border-radius: 4px;\n    font-size: 14px;\n}\n\n.filter-input[_ngcontent-%COMP%]:focus, \n.filter-select[_ngcontent-%COMP%]:focus {\n    outline: none;\n    border-color: #2196f3;\n    box-shadow: 0 0 3px rgba(33, 150, 243, 0.3);\n}\n\n\n\n.main-content[_ngcontent-%COMP%] {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    flex: 2;\n    min-width: 0; \n\n}\n\n.paging-controls[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 10px 15px;\n    border-bottom: 1px solid #eee;\n}\n\n.page-info[_ngcontent-%COMP%] {\n    color: #666;\n    font-size: 14px;\n}\n\n.artifacts-list[_ngcontent-%COMP%] {\n    flex: 1;\n    overflow-y: auto;\n    padding: 0 15px;\n}\n\n.loading-state[_ngcontent-%COMP%], \n.empty-state[_ngcontent-%COMP%] {\n    text-align: center;\n    padding: 40px;\n    color: #666;\n}\n\n.empty-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    font-size: 48px;\n    margin-bottom: 15px;\n    color: #999;\n}\n\n.create-section[_ngcontent-%COMP%] {\n    padding: 15px;\n    border-top: 1px solid #eee;\n}\n\n.create-btn[_ngcontent-%COMP%] {\n    width: 100%;\n}\n\n.new-artifact-form[_ngcontent-%COMP%] {\n    margin-top: 15px;\n}\n\n.new-artifact-form[_ngcontent-%COMP%]   kendo-textbox[_ngcontent-%COMP%] {\n    width: 100%;\n    margin-bottom: 10px;\n}\n\n.new-artifact-form[_ngcontent-%COMP%]   kendo-textarea[_ngcontent-%COMP%] {\n    width: 100%;\n    height: 60px;\n}\n\n.divider[_ngcontent-%COMP%] {\n    text-align: center;\n    padding: 10px;\n    background: #f8f9fa;\n    color: #666;\n    font-size: 12px;\n    margin-bottom: 10px;\n}\n\n.artifact-item[_ngcontent-%COMP%] {\n    border: 1px solid #ddd;\n    border-radius: 6px;\n    margin: 10px 0;\n    padding: 15px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.artifact-item[_ngcontent-%COMP%]:hover {\n    border-color: #2196f3;\n    background: #fafafa;\n}\n\n.artifact-item.selected[_ngcontent-%COMP%] {\n    border-color: #2196f3;\n    background: #e8f4f8;\n}\n\n.artifact-content[_ngcontent-%COMP%] {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n}\n\n.artifact-main[_ngcontent-%COMP%] {\n    flex: 1;\n}\n\n.artifact-name[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    margin-bottom: 5px;\n}\n\n.artifact-name[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: #666;\n    margin-right: 8px;\n}\n\n.artifact-name[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    font-weight: 600;\n    color: #333;\n}\n\n.artifact-description[_ngcontent-%COMP%] {\n    color: #666;\n    font-size: 14px;\n    margin-bottom: 8px;\n}\n\n.artifact-meta[_ngcontent-%COMP%] {\n    text-align: right;\n    color: #999;\n    font-size: 12px;\n}\n\n\n\n.version-panel[_ngcontent-%COMP%] {\n    width: 320px;\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    border-left: 1px solid #ddd;\n    flex-shrink: 0;\n    background: #fafafa;\n}\n\n.version-content[_ngcontent-%COMP%] {\n    flex: 1;\n    padding: 15px;\n    overflow-y: auto;\n}\n\n.version-actions[_ngcontent-%COMP%] {\n    margin-bottom: 20px;\n}\n\n.version-actions[_ngcontent-%COMP%]   label[_ngcontent-%COMP%]:first-child {\n    display: block;\n    margin-bottom: 10px;\n    font-weight: 500;\n    color: #555;\n}\n\n.radio-label[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    margin-bottom: 8px;\n    cursor: pointer;\n}\n\n.radio-label[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n    margin-right: 8px;\n}\n\n.version-selection[_ngcontent-%COMP%] {\n    margin-bottom: 15px;\n}\n\n.version-selection[_ngcontent-%COMP%]    > label[_ngcontent-%COMP%]:first-child {\n    display: block;\n    margin-bottom: 8px;\n    font-weight: 500;\n    color: #555;\n}\n\n.version-item[_ngcontent-%COMP%] {\n    display: flex;\n    align-items: center;\n    margin-bottom: 8px;\n    padding: 8px;\n    border: 1px solid #eee;\n    border-radius: 4px;\n    cursor: pointer;\n}\n\n.version-item.selected[_ngcontent-%COMP%] {\n    background: #f0f8ff;\n}\n\n.version-item[_ngcontent-%COMP%]   input[_ngcontent-%COMP%] {\n    margin-right: 8px;\n}\n\n.version-info[_ngcontent-%COMP%] {\n    flex: 1;\n}\n\n.version-number[_ngcontent-%COMP%] {\n    font-weight: 500;\n}\n\n.version-date[_ngcontent-%COMP%] {\n    font-size: 12px;\n    color: #666;\n}\n\n.warning[_ngcontent-%COMP%] {\n    background: #fff3cd;\n    border: 1px solid #ffeaa7;\n    border-radius: 4px;\n    padding: 10px;\n}\n\n.warning[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    color: #856404;\n    margin-right: 5px;\n}\n\n.warning[_ngcontent-%COMP%]   span[_ngcontent-%COMP%] {\n    color: #856404;\n    font-size: 14px;\n}\n\n.info-state[_ngcontent-%COMP%], \n.empty-state[_ngcontent-%COMP%] {\n    padding: 15px;\n    text-align: center;\n    color: #666;\n}\n\n.info-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%], \n.empty-state[_ngcontent-%COMP%]   i[_ngcontent-%COMP%] {\n    margin-bottom: 10px;\n    font-size: 24px;\n}\n\n.info-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%], \n.empty-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%] {\n    margin: 5px 0;\n}\n\n.info-state[_ngcontent-%COMP%]   p[_ngcontent-%COMP%]:last-child {\n    font-size: 14px;\n}\n\n\n\n.filter-count[_ngcontent-%COMP%] {\n    background: #fff;\n    color: #2196f3;\n    border-radius: 50%;\n    min-width: 18px;\n    height: 18px;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 10px;\n    font-weight: bold;\n    margin-left: 4px;\n}\n\n.filter-active[_ngcontent-%COMP%]   .filter-count[_ngcontent-%COMP%] {\n    background: #fff;\n    color: #2196f3;\n}"] });
+}
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassMetadata(ArtifactSelectionDialogComponent, [{
+        type: Component,
+        args: [{ selector: 'app-artifact-selection-dialog', template: "<div>\n    <kendo-dialog-titlebar (close)=\"cancel()\">\n        <div style=\"font-size: 18px;\">\n        <i class=\"fa-solid fa-save\"></i> Save Component to Artifact\n        </div>\n    </kendo-dialog-titlebar>\n\n    <div class=\"artifact-selection-content\">\n        <!-- Left Filter Panel -->\n        <div class=\"filter-panel\" [style.width]=\"isFilterPanelCollapsed ? '40px' : '280px'\">\n            <!-- Panel Header -->\n            <div class=\"panel-header\">\n                @if (!isFilterPanelCollapsed) {\n                    <span>Filters</span>\n                }\n                <button kendoButton (click)=\"toggleFilterPanel()\" \n                        [fillMode]=\"'flat'\"\n                        [class.filter-active]=\"getActiveFilterCount() > 0\"\n                        [themeColor]=\"getActiveFilterCount() > 0 ? 'primary' : 'base'\">\n                    <i class=\"fa-solid fa-filter\"></i>\n                    @if (isFilterPanelCollapsed && getActiveFilterCount() > 0) {\n                        <span class=\"filter-count\">{{ getActiveFilterCount() }}</span>\n                    }\n                </button>\n            </div>\n\n            @if (!isFilterPanelCollapsed) {\n                <div class=\"filter-content\">\n                    <!-- Search -->\n                    <div class=\"filter-group\">\n                        <label>Search</label>\n                        <input type=\"text\" \n                               [(ngModel)]=\"searchTerm\"\n                               (input)=\"onSearchInput()\"\n                               placeholder=\"Name or description...\"\n                               class=\"filter-input\">\n                    </div>\n\n                    <!-- Artifact Type -->\n                    <div class=\"filter-group\">\n                        <label>Artifact Type</label>\n                        <select [(ngModel)]=\"selectedArtifactType\" \n                                (change)=\"onArtifactTypeChange()\"\n                                class=\"filter-select\">\n                            <option value=\"\">All Types</option>\n                            <option value=\"Component\">Component</option>\n                            <option value=\"Report\">Report</option>\n                            <option value=\"Dashboard\">Dashboard</option>\n                        </select>\n                    </div>\n                    \n                    <!-- User Email -->\n                    <div class=\"filter-group\">\n                        <label>Filter by User</label>\n                        <input type=\"text\" \n                               [(ngModel)]=\"userEmail\"\n                               (input)=\"filterArtifacts()\"\n                               placeholder=\"Enter user email...\"\n                               class=\"filter-input\">\n                    </div>\n                </div>\n            }\n        </div>\n\n        <!-- Main Content Area -->\n        <div class=\"main-content\">\n            <!-- Paging Controls -->\n            <div class=\"paging-controls\">\n                <button kendoButton \n                    (click)=\"previousPage()\" \n                    [disabled]=\"!canGoPrevious()\"\n                    [themeColor]=\"'base'\">\n                    <i class=\"fa-solid fa-chevron-left\"></i> Previous\n                </button>\n                <span class=\"page-info\">\n                    Page {{ currentPage + 1 }} of {{ getTotalPages() }}\n                    ({{ totalArtifacts }} total items)\n                </span>\n                <button kendoButton \n                    (click)=\"nextPage()\" \n                    [disabled]=\"!canGoNext()\"\n                    [themeColor]=\"'base'\">\n                    Next <i class=\"fa-solid fa-chevron-right\"></i>\n                </button>\n            </div>\n\n            <!-- Existing Artifacts -->\n            <div class=\"artifacts-list\">\n                @if (isLoading) {\n                    <div class=\"loading-state\">\n                        <i class=\"fa-solid fa-spinner fa-spin\"></i>\n                        <p>Loading artifacts...</p>\n                    </div>\n                } \n                @else if (artifacts.length === 0) {\n                    <div class=\"empty-state\">\n                        <i class=\"fa-solid fa-inbox\"></i>\n                        <p>No artifacts found</p>\n                    </div>\n                } \n                @else {\n                    @for (artifact of artifacts; track artifact.ID) {\n                        <div class=\"artifact-item\" \n                            [class.selected]=\"selectedArtifact?.ID === artifact.ID\"\n                            (click)=\"selectArtifact(artifact)\">\n                            <div class=\"artifact-content\">\n                                <div class=\"artifact-main\">\n                                    <div class=\"artifact-name\">\n                                        <i class=\"fa-solid fa-file-code\"></i>\n                                        <span>{{ artifact.Name }}</span>\n                                    </div>\n                                    @if (artifact.Description) {\n                                        <div class=\"artifact-description\">\n                                            {{ artifact.Description }}\n                                        </div>\n                                    }\n                                </div>\n                                <div class=\"artifact-meta\">\n                                    <div>{{ artifact.ArtifactType }}</div>\n                                    <div>{{ artifact.__mj_UpdatedAt | date:'short' }}</div>\n                                </div>\n                            </div>\n                        </div>\n                    }\n                }\n            </div>\n            \n            <!-- Create New Artifact Section (at bottom) -->\n            <div class=\"create-section\">\n                <div class=\"divider\">OR CREATE NEW ARTIFACT</div>\n                \n                <button kendoButton \n                (click)=\"selectCreateNew()\"\n                [themeColor]=\"'primary'\"\n                class=\"create-btn\">\n                <i class=\"fa-solid fa-plus\"></i> Create New Artifact\n                </button>\n                \n                @if (showNewArtifactForm) {\n                    <div class=\"new-artifact-form\">\n                        <kendo-textbox \n                        [(value)]=\"newArtifactName\"\n                        placeholder=\"Artifact name...\">\n                        </kendo-textbox>\n                        <kendo-textarea \n                        [(value)]=\"newArtifactDescription\"\n                        placeholder=\"Description (optional)...\">\n                        </kendo-textarea>\n                    </div>\n                }\n            </div>\n        </div>\n\n        <!-- Right Version Panel (only show when artifact selected) -->\n        @if (selectedArtifact) {\n            <div class=\"version-panel\">\n                <div class=\"panel-header\">\n                    <h4><i class=\"fa-solid fa-code-branch\"></i> Version</h4>\n                </div>\n                \n                @if (artifactVersions.length > 0) {\n                    <div class=\"version-content\">\n                        <div class=\"version-actions\">\n                            <label>Action</label>\n                            <label class=\"radio-label\">\n                                <input type=\"radio\" \n                                    name=\"versionAction\" \n                                    value=\"new\"\n                                    [(ngModel)]=\"versionAction\"\n                                    (change)=\"selectedVersion = null\">\n                                <span>Create New Version (v{{ getNextVersionNumber() }})</span>\n                            </label>\n                            \n                            <label class=\"radio-label\">\n                                <input type=\"radio\" \n                                    name=\"versionAction\" \n                                    value=\"update\"\n                                    [(ngModel)]=\"versionAction\">\n                                <span>Update Existing Version</span>\n                            </label>\n                        </div>\n                        \n                        @if (versionAction === 'update') {\n                            <div class=\"version-selection\">\n                                <label>Select Version</label>\n                                @for (version of artifactVersions; track version.ID) {\n                                    <label class=\"version-item\" \n                                           [class.selected]=\"selectedVersion?.ID === version.ID\">\n                                        <input type=\"radio\" \n                                            name=\"selectedVersion\"\n                                            [value]=\"version\"\n                                            [(ngModel)]=\"selectedVersion\">\n                                        <div class=\"version-info\">\n                                            <div class=\"version-number\">Version {{ version.Version }}</div>\n                                            <div class=\"version-date\">{{ version.__mj_UpdatedAt | date:'short' }}</div>\n                                        </div>\n                                    </label>\n                                }\n                            </div>\n                            \n                            @if (selectedVersion) {\n                                <div class=\"warning\">\n                                    <i class=\"fa-solid fa-exclamation-triangle\"></i>\n                                    <span>Warning: This will overwrite version {{ selectedVersion.Version }}</span>\n                                </div>\n                            }\n                        }\n                    </div>\n                } @else {\n                    <div class=\"info-state\">\n                        <i class=\"fa-solid fa-info-circle\"></i>\n                        <p>No versions available for this artifact.</p>\n                        <p>A new version will be created.</p>\n                    </div>\n                }\n            </div>\n        }\n    </div>\n\n    <kendo-dialog-actions>\n        <button kendoButton \n            [themeColor]=\"versionAction === 'update' && selectedVersion ? 'warning' : 'primary'\" \n            (click)=\"save()\"\n            [disabled]=\"!canSave()\">\n            <i class=\"fa-solid fa-save\"></i> \n            {{ getSaveButtonText() }}\n        </button>\n        <button kendoButton (click)=\"cancel()\">Cancel</button>\n    </kendo-dialog-actions>\n</div>\n", styles: ["/* Main container */\n.artifact-selection-content {\n    height: 100%;\n    display: flex;\n    flex-direction: row;\n}\n\n/* Filter Panel */\n.filter-panel {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    border-right: 1px solid #ddd;\n    transition: width 0.3s ease;\n    flex-shrink: 0;\n    background: #fafafa;\n}\n\n.panel-header {\n    display: flex;\n    align-items: center;\n    justify-content: space-between;\n    padding: 10px;\n    border-bottom: 1px solid #eee;\n    font-weight: bold;\n    color: #666;\n}\n\n.filter-content {\n    flex: 1;\n    padding: 15px;\n    overflow-y: auto;\n}\n\n.filter-group {\n    margin-bottom: 15px;\n}\n\n.filter-group label {\n    display: block;\n    margin-bottom: 5px;\n    font-weight: 500;\n    color: #555;\n}\n\n.filter-input,\n.filter-select {\n    width: 100%;\n    padding: 8px;\n    border: 1px solid #ccc;\n    border-radius: 4px;\n    font-size: 14px;\n}\n\n.filter-input:focus,\n.filter-select:focus {\n    outline: none;\n    border-color: #2196f3;\n    box-shadow: 0 0 3px rgba(33, 150, 243, 0.3);\n}\n\n/* Main Content Panel */\n.main-content {\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    flex: 2;\n    min-width: 0; /* Prevents flex item from growing beyond container */\n}\n\n.paging-controls {\n    display: flex;\n    justify-content: space-between;\n    align-items: center;\n    padding: 10px 15px;\n    border-bottom: 1px solid #eee;\n}\n\n.page-info {\n    color: #666;\n    font-size: 14px;\n}\n\n.artifacts-list {\n    flex: 1;\n    overflow-y: auto;\n    padding: 0 15px;\n}\n\n.loading-state,\n.empty-state {\n    text-align: center;\n    padding: 40px;\n    color: #666;\n}\n\n.empty-state i {\n    font-size: 48px;\n    margin-bottom: 15px;\n    color: #999;\n}\n\n.create-section {\n    padding: 15px;\n    border-top: 1px solid #eee;\n}\n\n.create-btn {\n    width: 100%;\n}\n\n.new-artifact-form {\n    margin-top: 15px;\n}\n\n.new-artifact-form kendo-textbox {\n    width: 100%;\n    margin-bottom: 10px;\n}\n\n.new-artifact-form kendo-textarea {\n    width: 100%;\n    height: 60px;\n}\n\n.divider {\n    text-align: center;\n    padding: 10px;\n    background: #f8f9fa;\n    color: #666;\n    font-size: 12px;\n    margin-bottom: 10px;\n}\n\n.artifact-item {\n    border: 1px solid #ddd;\n    border-radius: 6px;\n    margin: 10px 0;\n    padding: 15px;\n    cursor: pointer;\n    transition: all 0.2s ease;\n}\n\n.artifact-item:hover {\n    border-color: #2196f3;\n    background: #fafafa;\n}\n\n.artifact-item.selected {\n    border-color: #2196f3;\n    background: #e8f4f8;\n}\n\n.artifact-content {\n    display: flex;\n    justify-content: space-between;\n    align-items: flex-start;\n}\n\n.artifact-main {\n    flex: 1;\n}\n\n.artifact-name {\n    display: flex;\n    align-items: center;\n    margin-bottom: 5px;\n}\n\n.artifact-name i {\n    color: #666;\n    margin-right: 8px;\n}\n\n.artifact-name span {\n    font-weight: 600;\n    color: #333;\n}\n\n.artifact-description {\n    color: #666;\n    font-size: 14px;\n    margin-bottom: 8px;\n}\n\n.artifact-meta {\n    text-align: right;\n    color: #999;\n    font-size: 12px;\n}\n\n/* Version Panel */\n.version-panel {\n    width: 320px;\n    height: 100%;\n    display: flex;\n    flex-direction: column;\n    border-left: 1px solid #ddd;\n    flex-shrink: 0;\n    background: #fafafa;\n}\n\n.version-content {\n    flex: 1;\n    padding: 15px;\n    overflow-y: auto;\n}\n\n.version-actions {\n    margin-bottom: 20px;\n}\n\n.version-actions label:first-child {\n    display: block;\n    margin-bottom: 10px;\n    font-weight: 500;\n    color: #555;\n}\n\n.radio-label {\n    display: flex;\n    align-items: center;\n    margin-bottom: 8px;\n    cursor: pointer;\n}\n\n.radio-label input {\n    margin-right: 8px;\n}\n\n.version-selection {\n    margin-bottom: 15px;\n}\n\n.version-selection > label:first-child {\n    display: block;\n    margin-bottom: 8px;\n    font-weight: 500;\n    color: #555;\n}\n\n.version-item {\n    display: flex;\n    align-items: center;\n    margin-bottom: 8px;\n    padding: 8px;\n    border: 1px solid #eee;\n    border-radius: 4px;\n    cursor: pointer;\n}\n\n.version-item.selected {\n    background: #f0f8ff;\n}\n\n.version-item input {\n    margin-right: 8px;\n}\n\n.version-info {\n    flex: 1;\n}\n\n.version-number {\n    font-weight: 500;\n}\n\n.version-date {\n    font-size: 12px;\n    color: #666;\n}\n\n.warning {\n    background: #fff3cd;\n    border: 1px solid #ffeaa7;\n    border-radius: 4px;\n    padding: 10px;\n}\n\n.warning i {\n    color: #856404;\n    margin-right: 5px;\n}\n\n.warning span {\n    color: #856404;\n    font-size: 14px;\n}\n\n.info-state,\n.empty-state {\n    padding: 15px;\n    text-align: center;\n    color: #666;\n}\n\n.info-state i,\n.empty-state i {\n    margin-bottom: 10px;\n    font-size: 24px;\n}\n\n.info-state p,\n.empty-state p {\n    margin: 5px 0;\n}\n\n.info-state p:last-child {\n    font-size: 14px;\n}\n\n/* Filter button styling */\n.filter-count {\n    background: #fff;\n    color: #2196f3;\n    border-radius: 50%;\n    min-width: 18px;\n    height: 18px;\n    display: inline-flex;\n    align-items: center;\n    justify-content: center;\n    font-size: 10px;\n    font-weight: bold;\n    margin-left: 4px;\n}\n\n.filter-active .filter-count {\n    background: #fff;\n    color: #2196f3;\n}"] }]
+    }], () => [{ type: i1.DialogRef }], null); })();
+(() => { (typeof ngDevMode === "undefined" || ngDevMode) && i0.ɵsetClassDebugInfo(ArtifactSelectionDialogComponent, { className: "ArtifactSelectionDialogComponent", filePath: "src/ComponentStudio/components/artifact-selection-dialog.component.ts", lineNumber: 19 }); })();
+//# sourceMappingURL=artifact-selection-dialog.component.js.map