@meshmakers/octo-ui 3.3.560 → 3.3.570

package/fesm2022/meshmakers-octo-ui.mjs

@@ -1,7 +1,7 @@
 import * as i0 from '@angular/core';
-import { inject, Component, Injectable, EventEmitter, Output, Input, ElementRef, forwardRef, ViewChild, makeEnvironmentProviders } from '@angular/core';
-import { AttributeSelectorService, AttributeValueTypeDto as AttributeValueTypeDto$1, CkTypeAttributeService, CkTypeSelectorService, SearchFilterTypesDto, SortOrdersDto, FieldFilterOperatorsDto, provideOctoServices } from '@meshmakers/octo-services';
-import { DataSourceTyped, HierarchyDataSourceBase, NotificationDisplayService, provideMmSharedUi } from '@meshmakers/shared-ui';
+import { inject, Component, Injectable, EventEmitter, Output, Input, ElementRef, forwardRef, ViewChild, signal, computed, makeEnvironmentProviders } from '@angular/core';
+import { AttributeSelectorService, AttributeValueTypeDto as AttributeValueTypeDto$1, CkTypeAttributeService, CkTypeSelectorService, GetEntitiesByCkTypeDtoGQL, RuntimeEntitySelectDataSource, RuntimeEntityDialogDataSource, SearchFilterTypesDto, SortOrdersDto, FieldFilterOperatorsDto, provideOctoServices } from '@meshmakers/octo-services';
+import { WindowStateService, EntitySelectInputComponent, DataSourceTyped, HierarchyDataSourceBase, NotificationDisplayService, provideMmSharedUi } from '@meshmakers/shared-ui';
 import { provideMmSharedAuth } from '@meshmakers/shared-auth';
 import * as i1 from '@angular/common';
 import { CommonModule } from '@angular/common';
@@ -17,7 +17,7 @@ import * as i3$1 from '@progress/kendo-angular-dropdowns';
 import { DropDownListModule, DropDownsModule, AutoCompleteModule } from '@progress/kendo-angular-dropdowns';
 import * as i5$1 from '@progress/kendo-angular-icons';
 import { IconsModule, SVGIconModule } from '@progress/kendo-angular-icons';
-import { searchIcon, sortAscSmallIcon, sortDescSmallIcon, chevronRightIcon, chevronDownIcon, downloadIcon, fileIcon, folderIcon, calendarIcon, checkboxCheckedIcon, listUnorderedIcon, filterClearIcon, arrowRightIcon, arrowLeftIcon, chevronDoubleRightIcon, chevronDoubleLeftIcon, arrowUpIcon, arrowDownIcon, plusIcon, minusIcon, trashIcon, dollarIcon, copyIcon } from '@progress/kendo-svg-icons';
+import { searchIcon, sortAscSmallIcon, sortDescSmallIcon, chevronRightIcon, chevronDownIcon, downloadIcon, fileIcon, folderIcon, calendarIcon, checkboxCheckedIcon, listUnorderedIcon, filterClearIcon, arrowRightIcon, arrowLeftIcon, chevronDoubleRightIcon, chevronDoubleLeftIcon, arrowUpIcon, arrowDownIcon, pencilIcon, trashIcon, plusIcon, minusIcon, dollarIcon, copyIcon } from '@progress/kendo-svg-icons';
 import { WindowRef, WindowModule, WindowService, WindowCloseResult } from '@progress/kendo-angular-dialog';
 import { Subject, firstValueFrom, of, forkJoin, Subscription } from 'rxjs';
 import { debounceTime, distinctUntilChanged, switchMap, map, tap, catchError } from 'rxjs/operators';
@@ -493,6 +493,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
 
 class AttributeSortSelectorDialogService {
     windowService = inject(WindowService);
+    windowStateService = inject(WindowStateService);
     /**
      * Opens the attribute sort selector dialog
      * @param ckTypeId The CkType ID to fetch attributes for
@@ -506,15 +507,17 @@ class AttributeSortSelectorDialogService {
             selectedAttributes,
             dialogTitle
         };
+        const size = this.windowStateService.resolveWindowSize('attribute-sort-selector', { width: 1200, height: 750 });
         const windowRef = this.windowService.open({
             content: AttributeSortSelectorDialogComponent,
-            width: 1200,
-            height: 750,
+            width: size.width,
+            height: size.height,
             minWidth: 1050,
             minHeight: 700,
             resizable: true,
             title: dialogTitle || 'Select Attributes with Sort Order'
         });
+        this.windowStateService.applyModalBehavior('attribute-sort-selector', windowRef);
         // Pass data to the component
         const contentRef = windowRef.content;
         if (contentRef?.instance) {
@@ -523,14 +526,12 @@ class AttributeSortSelectorDialogService {
         try {
             const result = await firstValueFrom(windowRef.result);
             if (result instanceof WindowCloseResult) {
-                // User closed the window via X button
                 return {
                     confirmed: false,
                     selectedAttributes: []
                 };
             }
             if (result && typeof result === 'object' && 'selectedAttributes' in result) {
-                // User clicked OK
                 const dialogResult = result;
                 return {
                     confirmed: true,
@@ -538,7 +539,6 @@ class AttributeSortSelectorDialogService {
                 };
             }
             else {
-                // User clicked Cancel or closed dialog (result is undefined)
                 return {
                     confirmed: false,
                     selectedAttributes: []
@@ -546,7 +546,6 @@ class AttributeSortSelectorDialogService {
             }
         }
         catch {
-            // Dialog was closed without result (e.g., ESC key, X button)
             return {
                 confirmed: false,
                 selectedAttributes: []
@@ -1898,7 +1897,7 @@ class CkTypeSelectorDialogComponent {
     searchIcon = searchIcon;
     filterClearIcon = filterClearIcon;
     dialogTitle = 'Select Construction Kit Type';
-    allowAbstract = false;
+    allowAbstract = true;
     searchText = '';
     selectedModel = null;
     availableModels = [];
@@ -1919,7 +1918,7 @@ class CkTypeSelectorDialogComponent {
     ngOnInit() {
         if (this.data) {
             this.dialogTitle = this.data.dialogTitle || 'Select Construction Kit Type';
-            this.allowAbstract = this.data.allowAbstract ?? false;
+            this.allowAbstract = this.data.allowAbstract ?? true;
             this.initialCkModelIds = this.data.ckModelIds;
             this.derivedFromRtCkTypeId = this.data.derivedFromRtCkTypeId;
             if (this.data.selectedCkTypeId) {
@@ -2220,6 +2219,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
 
 class CkTypeSelectorDialogService {
     windowService = inject(WindowService);
+    windowStateService = inject(WindowStateService);
     /**
      * Opens the CkType selector dialog
      * @param options Dialog options
@@ -2233,15 +2233,17 @@ class CkTypeSelectorDialogService {
             allowAbstract: options.allowAbstract,
             derivedFromRtCkTypeId: options.derivedFromRtCkTypeId
         };
+        const size = this.windowStateService.resolveWindowSize('ck-type-selector', { width: 900, height: 650 });
         const windowRef = this.windowService.open({
             content: CkTypeSelectorDialogComponent,
-            width: 900,
-            height: 650,
+            width: size.width,
+            height: size.height,
             minWidth: 750,
             minHeight: 550,
             resizable: true,
             title: options.dialogTitle || 'Select Construction Kit Type'
         });
+        this.windowStateService.applyModalBehavior('ck-type-selector', windowRef);
         // Pass data to the component
         const contentRef = windowRef.content;
         if (contentRef?.instance) {
@@ -2256,7 +2258,6 @@ class CkTypeSelectorDialogService {
                 };
             }
             if (result && typeof result === 'object' && 'selectedCkType' in result) {
-                // User clicked OK and we have a result
                 const dialogResult = result;
                 return {
                     confirmed: true,
@@ -2264,7 +2265,6 @@ class CkTypeSelectorDialogService {
                 };
             }
             else {
-                // User clicked Cancel or closed dialog
                 return {
                     confirmed: false,
                     selectedCkType: null
@@ -2272,7 +2272,6 @@ class CkTypeSelectorDialogService {
             }
         }
         catch {
-            // Dialog was closed without result (e.g., ESC key, X button)
             return {
                 confirmed: false,
                 selectedCkType: null
@@ -2286,363 +2285,652 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
             type: Injectable
         }] });
 
-// noinspection JSUnusedGlobalSymbols
-class OctoGraphQlDataSource extends DataSourceTyped {
-    _searchFilterAttributePaths = [];
-    // noinspection JSUnusedGlobalSymbols
-    constructor(listViewComponent) {
-        super(listViewComponent);
-    }
-    get searchFilterAttributePaths() {
-        return this._searchFilterAttributePaths;
-    }
-    set searchFilterAttributePaths(value) {
-        this._searchFilterAttributePaths = value;
+class CkTypeSelectorInputComponent {
+    autocomplete;
+    placeholder = 'Select a CK type...';
+    minSearchLength = 2;
+    maxResults = 50;
+    debounceMs = 300;
+    ckModelIds;
+    allowAbstract = true;
+    dialogTitle = 'Select Construction Kit Type';
+    advancedSearchLabel = 'Advanced Search...';
+    derivedFromRtCkTypeId;
+    _disabled = false;
+    get disabled() {
+        return this._disabled;
     }
-    // noinspection JSUnusedGlobalSymbols
-    getFieldFilterDefinitions(state) {
-        let fieldFilters = null;
-        if (state.filter?.filters) {
-            fieldFilters = state.filter.filters.map((f) => {
-                if (isCompositeFilterDescriptor(f)) {
-                    throw new Error('Composite filter descriptor not supported');
-                }
-                const { operator, value } = OctoGraphQlDataSource.getOperatorAndValue(f.operator, f.value);
-                return {
-                    attributePath: f.field,
-                    operator: operator,
-                    comparisonValue: value
-                };
-            });
+    set disabled(value) {
+        this._disabled = !!value;
+        if (this._disabled) {
+            this.searchFormControl.disable();
         }
-        return fieldFilters;
-    }
-    // noinspection JSUnusedGlobalSymbols
-    getSearchFilterDefinitions(textSearchValue) {
-        let searchFilterDto = null;
-        if (textSearchValue) {
-            searchFilterDto = {
-                type: SearchFilterTypesDto.AttributeFilterDto,
-                attributePaths: this.searchFilterAttributePaths,
-                searchTerm: textSearchValue,
-            };
+        else {
+            this.searchFormControl.enable();
         }
-        return searchFilterDto;
     }
-    // noinspection JSUnusedGlobalSymbols
-    getSortDefinitions(state) {
-        let sort = null;
-        if (state.sort) {
-            sort = new Array();
-            state.sort.forEach((s) => {
-                switch (s.dir) {
-                    case 'asc':
-                        sort?.push({
-                            attributePath: s.field,
-                            sortOrder: SortOrdersDto.AscendingDto
-                        });
-                        break;
-                    case 'desc':
-                        sort?.push({
-                            attributePath: s.field,
-                            sortOrder: SortOrdersDto.DescendingDto,
-                        });
-                        break;
-                    default:
-                        sort?.push({
-                            attributePath: s.field,
-                            sortOrder: SortOrdersDto.DefaultDto,
-                        });
-                        break;
-                }
-            });
-        }
-        return sort;
+    _required = false;
+    get required() {
+        return this._required;
     }
-    static getOperatorAndValue(operator, value) {
-        switch (operator) {
-            case 'eq':
-                return { operator: FieldFilterOperatorsDto.EqualsDto, value: value };
-            case 'neq':
-                return { operator: FieldFilterOperatorsDto.NotEqualsDto, value: value };
-            case 'lt':
-                return { operator: FieldFilterOperatorsDto.LessThanDto, value: value };
-            case 'lte':
-                return { operator: FieldFilterOperatorsDto.LessEqualThanDto, value: value };
-            case 'gt':
-                return { operator: FieldFilterOperatorsDto.GreaterThanDto, value: value };
-            case 'gte':
-                return { operator: FieldFilterOperatorsDto.GreaterEqualThanDto, value: value };
-            case 'contains':
-                return { operator: FieldFilterOperatorsDto.LikeDto, value: value };
-            case 'doesnotcontain':
-                return { operator: FieldFilterOperatorsDto.MatchRegExDto, value: `^(?!.*${value}).*$` };
-            case 'startswith':
-                return { operator: FieldFilterOperatorsDto.MatchRegExDto, value: value + '.*' };
-            case 'endswith':
-                return { operator: FieldFilterOperatorsDto.MatchRegExDto, value: '.*' + value };
-            case 'isnull':
-                return { operator: FieldFilterOperatorsDto.EqualsDto, value: null };
-            case 'isnotnull':
-                return { operator: FieldFilterOperatorsDto.NotEqualsDto, value: null };
-            case 'isempty':
-                return { operator: FieldFilterOperatorsDto.EqualsDto, value: "" };
-            case 'isnotempty':
-                return { operator: FieldFilterOperatorsDto.NotEqualsDto, value: "" };
-            default:
-                throw new Error('The filter operator is not supported');
-        }
+    set required(value) {
+        this._required = !!value;
     }
-}
-
-class OctoGraphQlHierarchyDataSource extends HierarchyDataSourceBase {
-}
-
-class AttributeSelectorDialogComponent {
-    windowRef = inject(WindowRef);
-    attributeService = inject(AttributeSelectorService);
+    ckTypeSelected = new EventEmitter();
+    ckTypeCleared = new EventEmitter();
+    searchFormControl = new FormControl();
+    filteredTypes = [];
+    selectedCkType = null;
+    isLoading = false;
+    typeMap = new Map();
     searchSubject = new Subject();
-    arrowRightIcon = arrowRightIcon;
-    arrowLeftIcon = arrowLeftIcon;
-    chevronDoubleRightIcon = chevronDoubleRightIcon;
-    chevronDoubleLeftIcon = chevronDoubleLeftIcon;
+    subscriptions = new Subscription();
+    onChange = () => { };
+    onTouched = () => { };
     searchIcon = searchIcon;
-    arrowUpIcon = arrowUpIcon;
-    arrowDownIcon = arrowDownIcon;
-    data;
-    dialogTitle = 'Select Attributes';
-    rtCkTypeId;
-    singleSelect = false;
-    searchText = '';
-    selectedSingleKey = [];
-    selectedValueTypeFilter = null;
-    includeNavigationProperties = true;
-    maxDepth = null;
-    availableAttributes = [];
-    selectedAttributes = [];
-    availableGridData = { data: [], total: 0 };
-    selectedGridData = { data: [], total: 0 };
-    selectedAvailableKeys = [];
-    selectedChosenKeys = [];
-    valueTypeOptions = [
-        { text: 'All Types', value: null },
-        { text: 'String', value: AttributeValueTypeDto$1.StringDto },
-        { text: 'Integer', value: AttributeValueTypeDto$1.IntegerDto },
-        { text: 'Double', value: AttributeValueTypeDto$1.DoubleDto },
-        { text: 'Boolean', value: AttributeValueTypeDto$1.BooleanDto },
-        { text: 'DateTime', value: AttributeValueTypeDto$1.DateTimeDto },
-        { text: 'DateTimeOffset', value: AttributeValueTypeDto$1.DateTimeOffsetDto },
-        { text: 'Enum', value: AttributeValueTypeDto$1.EnumDto },
-        { text: 'TimeSpan', value: AttributeValueTypeDto$1.TimeSpanDto }
-    ];
-    // Double-click tracking
-    lastClickTime = 0;
-    lastClickedItem = null;
-    doubleClickDelay = 300; // milliseconds
+    popupSettings = { appendTo: 'root', popupClass: 'mm-ck-type-popup' };
+    static popupStyleInjected = false;
+    ckTypeSelectorService = inject(CkTypeSelectorService);
+    dialogService = inject(CkTypeSelectorDialogService, { optional: true });
+    elementRef = inject(ElementRef);
     ngOnInit() {
-        if (this.data) {
-            this.rtCkTypeId = this.data.rtCkTypeId;
-            this.dialogTitle = this.data.dialogTitle || 'Select Attributes';
-            this.singleSelect = this.data.singleSelect ?? false;
-            this.includeNavigationProperties = this.data.includeNavigationProperties ?? true;
-            this.maxDepth = this.data.maxDepth ?? null;
-            if (this.data.selectedAttributes && this.data.selectedAttributes.length > 0) {
-                if (this.singleSelect) {
-                    this.selectedSingleKey = [this.data.selectedAttributes[0]];
-                }
-                else {
-                    // Pre-populate selected attributes if provided
-                    this.loadInitialSelectedAttributes(this.data.selectedAttributes);
+        this.setupSearch();
+        this.injectPopupStyles();
+    }
+    ngOnDestroy() {
+        this.subscriptions.unsubscribe();
+        this.searchSubject.complete();
+    }
+    // ControlValueAccessor implementation
+    writeValue(value) {
+        if (value !== this.selectedCkType) {
+            this.selectedCkType = value;
+            if (value) {
+                // Ensure the value is in the data list so the autocomplete can display it
+                if (!this.typeMap.has(value.rtCkTypeId)) {
+                    this.typeMap.set(value.rtCkTypeId, value);
+                    this.filteredTypes = [value.rtCkTypeId];
                 }
+                this.searchFormControl.setValue(value.rtCkTypeId, { emitEvent: false });
+            }
+            else {
+                this.searchFormControl.setValue('', { emitEvent: false });
             }
         }
-        // Set up search debouncing
-        this.searchSubject.pipe(debounceTime(300), distinctUntilChanged()).subscribe(searchText => {
-            this.loadAvailableAttributes(searchText);
-        });
-        // Load initial attributes
-        this.loadAvailableAttributes();
-    }
-    loadAvailableAttributes(searchTerm) {
-        this.attributeService.getAvailableAttributes(this.rtCkTypeId, undefined, undefined, undefined, this.selectedValueTypeFilter || undefined, searchTerm || undefined, this.includeNavigationProperties, this.maxDepth ?? undefined).subscribe(result => {
-            // Filter out already selected attributes
-            const selectedPaths = new Set(this.selectedAttributes.map(a => a.attributePath));
-            this.availableAttributes = result.items.filter(item => !selectedPaths.has(item.attributePath));
-            this.updateAvailableGrid();
-        });
     }
-    loadInitialSelectedAttributes(attributePaths) {
-        // Load all attributes to get the details for selected ones
-        this.attributeService.getAvailableAttributes(this.rtCkTypeId).subscribe(result => {
-            // Create a map for quick lookup
-            const attributeMap = new Map(result.items.map(item => [item.attributePath, item]));
-            // Preserve the order from attributePaths
-            this.selectedAttributes = attributePaths
-                .map(path => attributeMap.get(path))
-                .filter((item) => item !== undefined);
-            this.updateSelectedGrid();
-            // Filter out selected from available
-            const selectedPaths = new Set(this.selectedAttributes.map(a => a.attributePath));
-            this.availableAttributes = result.items.filter(item => !selectedPaths.has(item.attributePath));
-            this.updateAvailableGrid();
-        });
+    registerOnChange(fn) {
+        this.onChange = fn;
     }
-    onSearchChange(value) {
-        this.searchSubject.next(value);
+    registerOnTouched(fn) {
+        this.onTouched = fn;
     }
-    onValueTypeFilterChange(_value) {
-        this.loadAvailableAttributes(this.searchText || undefined);
+    setDisabledState(isDisabled) {
+        this.disabled = isDisabled;
     }
-    onNavigationPropertiesChange() {
-        if (!this.includeNavigationProperties) {
-            this.maxDepth = null;
-        }
-        this.loadAvailableAttributes(this.searchText || undefined);
-    }
-    onMaxDepthChange(value) {
-        this.maxDepth = value;
-        this.loadAvailableAttributes(this.searchText || undefined);
+    // Validator implementation
+    validate(control) {
+        if (this.required && !this.selectedCkType) {
+            return { required: true };
+        }
+        const value = control.value;
+        if (value && typeof value === 'string') {
+            return { invalidCkType: true };
+        }
+        return null;
     }
-    addSelected() {
-        const itemsToAdd = this.availableAttributes.filter(item => this.selectedAvailableKeys.includes(item.attributePath));
-        this.selectedAttributes.push(...itemsToAdd);
-        this.availableAttributes = this.availableAttributes.filter(item => !this.selectedAvailableKeys.includes(item.attributePath));
-        this.selectedAvailableKeys = [];
-        this.updateGrids();
+    // Event handlers
+    onFilterChange(filter) {
+        if (!filter || filter.length < this.minSearchLength) {
+            this.filteredTypes = [];
+            return;
+        }
+        this.searchSubject.next(filter);
     }
-    removeSelected() {
-        const itemsToRemove = this.selectedAttributes.filter(item => this.selectedChosenKeys.includes(item.attributePath));
-        this.availableAttributes.push(...itemsToRemove);
-        this.selectedAttributes = this.selectedAttributes.filter(item => !this.selectedChosenKeys.includes(item.attributePath));
-        this.selectedChosenKeys = [];
-        this.sortAvailableAttributes();
-        this.updateGrids();
+    onSelectionChange(value) {
+        if (value && typeof value === 'string') {
+            const ckType = this.typeMap.get(value);
+            if (ckType) {
+                this.selectCkType(ckType);
+            }
+        }
     }
-    addAll() {
-        this.selectedAttributes.push(...this.availableAttributes);
-        this.availableAttributes = [];
-        this.selectedAvailableKeys = [];
-        this.updateGrids();
+    onFocus() {
+        const currentValue = this.searchFormControl.value;
+        if (currentValue && currentValue.length >= this.minSearchLength && this.filteredTypes.length === 0) {
+            this.searchSubject.next(currentValue);
+        }
     }
-    removeAll() {
-        this.availableAttributes.push(...this.selectedAttributes);
-        this.selectedAttributes = [];
-        this.selectedChosenKeys = [];
-        this.sortAvailableAttributes();
-        this.updateGrids();
+    onBlur() {
+        this.onTouched();
+        if (this.filteredTypes.length === 1 && !this.selectedCkType) {
+            const displayText = this.filteredTypes[0];
+            const ckType = this.typeMap.get(displayText);
+            if (ckType) {
+                this.selectCkType(ckType);
+            }
+        }
     }
-    sortAvailableAttributes() {
-        this.availableAttributes.sort((a, b) => a.attributePath.localeCompare(b.attributePath));
+    // Public methods
+    clear() {
+        this.selectedCkType = null;
+        this.filteredTypes = [];
+        this.typeMap.clear();
+        this.searchFormControl.setValue('', { emitEvent: false });
+        this.onChange(null);
+        this.ckTypeCleared.emit();
+        this.autocomplete.focus();
     }
-    canMoveUp() {
-        if (this.selectedChosenKeys.length !== 1)
-            return false;
-        const index = this.selectedAttributes.findIndex(a => a.attributePath === this.selectedChosenKeys[0]);
-        return index > 0;
+    focus() {
+        if (this.autocomplete) {
+            this.autocomplete.focus();
+        }
     }
-    canMoveDown() {
-        if (this.selectedChosenKeys.length !== 1)
-            return false;
-        const index = this.selectedAttributes.findIndex(a => a.attributePath === this.selectedChosenKeys[0]);
-        return index >= 0 && index < this.selectedAttributes.length - 1;
+    reset() {
+        this.clear();
     }
-    moveUp() {
-        if (!this.canMoveUp())
-            return;
-        const index = this.selectedAttributes.findIndex(a => a.attributePath === this.selectedChosenKeys[0]);
-        [this.selectedAttributes[index - 1], this.selectedAttributes[index]] =
-            [this.selectedAttributes[index], this.selectedAttributes[index - 1]];
-        this.updateSelectedGrid();
+    // Private methods
+    setupSearch() {
+        this.subscriptions.add(this.searchSubject.pipe(debounceTime(this.debounceMs), distinctUntilChanged(), tap(() => {
+            this.isLoading = true;
+            this.filteredTypes = [];
+        }), switchMap(filter => {
+            const source$ = this.derivedFromRtCkTypeId
+                ? this.ckTypeSelectorService.getDerivedCkTypes(this.derivedFromRtCkTypeId, {
+                    searchText: filter
+                })
+                : this.ckTypeSelectorService.getCkTypes({
+                    ckModelIds: this.ckModelIds,
+                    searchText: filter,
+                    first: this.maxResults
+                });
+            return source$.pipe(catchError(error => {
+                console.error('CK type search error:', error);
+                return of({ items: [], totalCount: 0 });
+            }));
+        })).subscribe(result => {
+            this.isLoading = false;
+            // Filter out abstract types if not allowed
+            let items = result.items;
+            if (!this.allowAbstract) {
+                items = items.filter(item => !item.isAbstract);
+            }
+            this.filteredTypes = items.map(item => item.rtCkTypeId);
+            this.typeMap = new Map(items.map(item => [item.rtCkTypeId, item]));
+        }));
     }
-    moveDown() {
-        if (!this.canMoveDown())
+    injectPopupStyles() {
+        if (CkTypeSelectorInputComponent.popupStyleInjected)
             return;
-        const index = this.selectedAttributes.findIndex(a => a.attributePath === this.selectedChosenKeys[0]);
-        [this.selectedAttributes[index], this.selectedAttributes[index + 1]] =
-            [this.selectedAttributes[index + 1], this.selectedAttributes[index]];
-        this.updateSelectedGrid();
-    }
-    updateGrids() {
-        this.updateAvailableGrid();
-        this.updateSelectedGrid();
-    }
-    updateAvailableGrid() {
-        this.availableGridData = {
-            data: this.availableAttributes,
-            total: this.availableAttributes.length
-        };
-    }
-    updateSelectedGrid() {
-        this.selectedGridData = {
-            data: this.selectedAttributes,
-            total: this.selectedAttributes.length
-        };
-    }
-    onCancel() {
-        this.windowRef.close();
+        const style = document.createElement('style');
+        style.setAttribute('data-mm-ck-type-popup', '');
+        style.textContent = `
+      .mm-ck-type-popup {
+        max-width: 500px !important;
+        min-width: 0 !important;
+      }
+      .mm-ck-type-popup .k-child-animation-container {
+        max-width: 500px !important;
+      }
+      .mm-ck-type-popup .k-list-item {
+        padding: 4px 12px !important;
+        min-height: 0 !important;
+        font-size: 13px !important;
+        line-height: 20px !important;
+      }
+    `;
+        document.head.appendChild(style);
+        CkTypeSelectorInputComponent.popupStyleInjected = true;
     }
-    onConfirm() {
-        if (this.singleSelect) {
-            const selected = this.availableAttributes.find(a => a.attributePath === this.selectedSingleKey[0]);
-            const result = {
-                selectedAttributes: selected ? [selected] : []
-            };
-            this.windowRef.close(result);
-        }
-        else {
-            const result = {
-                selectedAttributes: this.selectedAttributes
-            };
-            this.windowRef.close(result);
-        }
+    selectCkType(ckType) {
+        this.selectedCkType = ckType;
+        this.searchFormControl.setValue(ckType.rtCkTypeId, { emitEvent: false });
+        this.filteredTypes = [];
+        this.onChange(ckType);
+        this.ckTypeSelected.emit(ckType);
+        this.autocomplete.toggle(false);
     }
-    /**
-     * Handle cell click on available attributes grid to detect double-click
-     */
-    onAvailableCellClick(event) {
-        const dataItem = event.dataItem;
-        if (!dataItem)
-            return;
-        const currentTime = Date.now();
-        const attributePath = dataItem.attributePath;
-        if (this.lastClickedItem === attributePath &&
-            currentTime - this.lastClickTime <= this.doubleClickDelay) {
-            // Double-click detected - move attribute to selected
-            this.moveAttributeToSelected(dataItem);
-            // Reset to prevent triple-click
-            this.lastClickTime = 0;
-            this.lastClickedItem = null;
-        }
-        else {
-            // Single click - just update tracking
-            this.lastClickTime = currentTime;
-            this.lastClickedItem = attributePath;
+    // Dialog
+    async openDialog(event) {
+        if (event) {
+            event.preventDefault();
+            event.stopPropagation();
         }
-    }
-    /**
-     * Handle cell click on selected attributes grid to detect double-click
-     */
-    onSelectedCellClick(event) {
-        const dataItem = event.dataItem;
-        if (!dataItem)
+        if (!this.dialogService) {
+            console.warn('CkTypeSelectorDialogService not available');
             return;
-        const currentTime = Date.now();
-        const attributePath = dataItem.attributePath;
-        if (this.lastClickedItem === attributePath &&
-            currentTime - this.lastClickTime <= this.doubleClickDelay) {
-            // Double-click detected - move attribute to available
-            this.moveAttributeToAvailable(dataItem);
-            // Reset to prevent triple-click
-            this.lastClickTime = 0;
-            this.lastClickedItem = null;
         }
-        else {
-            // Single click - just update tracking
-            this.lastClickTime = currentTime;
-            this.lastClickedItem = attributePath;
+        this.autocomplete.toggle(false);
+        const result = await this.dialogService.openCkTypeSelector({
+            selectedCkTypeId: this.selectedCkType?.fullName,
+            ckModelIds: this.ckModelIds,
+            dialogTitle: this.dialogTitle,
+            allowAbstract: this.allowAbstract,
+            derivedFromRtCkTypeId: this.derivedFromRtCkTypeId
+        });
+        if (result.confirmed && result.selectedCkType) {
+            this.selectCkType(result.selectedCkType);
         }
     }
-    /**
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CkTypeSelectorInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CkTypeSelectorInputComponent, isStandalone: true, selector: "mm-ck-type-selector-input", inputs: { placeholder: "placeholder", minSearchLength: "minSearchLength", maxResults: "maxResults", debounceMs: "debounceMs", ckModelIds: "ckModelIds", allowAbstract: "allowAbstract", dialogTitle: "dialogTitle", advancedSearchLabel: "advancedSearchLabel", derivedFromRtCkTypeId: "derivedFromRtCkTypeId", disabled: "disabled", required: "required" }, outputs: { ckTypeSelected: "ckTypeSelected", ckTypeCleared: "ckTypeCleared" }, providers: [
+            {
+                provide: NG_VALUE_ACCESSOR,
+                useExisting: forwardRef(() => CkTypeSelectorInputComponent),
+                multi: true
+            },
+            {
+                provide: NG_VALIDATORS,
+                useExisting: forwardRef(() => CkTypeSelectorInputComponent),
+                multi: true
+            }
+        ], viewQueries: [{ propertyName: "autocomplete", first: true, predicate: ["autocomplete"], descendants: true, static: true }], ngImport: i0, template: `
+    <div class="ck-type-select-wrapper" [class.disabled]="disabled">
+      <kendo-autocomplete
+        #autocomplete
+        [formControl]="searchFormControl"
+        [data]="filteredTypes"
+        [loading]="isLoading"
+        [placeholder]="placeholder"
+        [suggest]="true"
+        [clearButton]="true"
+        [filterable]="true"
+        [popupSettings]="popupSettings"
+        (filterChange)="onFilterChange($event)"
+        (valueChange)="onSelectionChange($event)"
+        (blur)="onBlur()"
+        (focus)="onFocus()"
+        class="ck-type-autocomplete">
+
+        <ng-template kendoAutoCompleteItemTemplate let-dataItem>
+          <div class="ck-type-item">
+            {{ dataItem }}
+          </div>
+        </ng-template>
+
+        <ng-template kendoAutoCompleteNoDataTemplate>
+          <div class="no-data-message">
+            <span *ngIf="!isLoading && searchFormControl.value && searchFormControl.value.length >= minSearchLength">
+              No types found for "{{ searchFormControl.value }}"
+            </span>
+            <span *ngIf="!isLoading && (!searchFormControl.value || searchFormControl.value.length < minSearchLength)">
+              Type at least {{ minSearchLength }} characters to search...
+            </span>
+          </div>
+        </ng-template>
+
+        <ng-template kendoAutoCompleteFooterTemplate>
+          <div class="advanced-search-footer" (click)="openDialog($event)">
+            <kendo-svg-icon [icon]="searchIcon" size="small"></kendo-svg-icon>
+            <span>{{ advancedSearchLabel }}</span>
+          </div>
+        </ng-template>
+
+      </kendo-autocomplete>
+
+      <button
+        kendoButton
+        type="button"
+        [svgIcon]="searchIcon"
+        [disabled]="disabled"
+        [title]="advancedSearchLabel"
+        class="dialog-button"
+        (click)="openDialog()">
+      </button>
+    </div>
+  `, isInline: true, styles: [":host{display:block;width:100%}.ck-type-select-wrapper{position:relative;display:flex;align-items:center;width:100%;gap:4px}.ck-type-select-wrapper.disabled{opacity:.6;pointer-events:none}.ck-type-autocomplete{flex:1;min-width:0}.dialog-button{flex-shrink:0;height:30px;width:30px;padding:0;display:flex;align-items:center;justify-content:center}.ck-type-item{padding:4px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.no-data-message{padding:8px 12px;color:var(--kendo-color-subtle);font-style:italic;text-align:center}.advanced-search-footer{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;color:var(--kendo-color-primary);border-top:1px solid var(--kendo-color-border);background:var(--kendo-color-surface-alt);transition:background-color .2s}.advanced-search-footer:hover{background:var(--kendo-color-base-hover)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: AutoCompleteModule }, { kind: "component", type: i3$1.AutoCompleteComponent, selector: "kendo-autocomplete", inputs: ["highlightFirst", "showStickyHeader", "focusableId", "data", "value", "valueField", "placeholder", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "loading", "clearButton", "suggest", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoAutoComplete"] }, { kind: "directive", type: i3$1.FooterTemplateDirective, selector: "[kendoDropDownListFooterTemplate],[kendoComboBoxFooterTemplate],[kendoDropDownTreeFooterTemplate],[kendoMultiColumnComboBoxFooterTemplate],[kendoAutoCompleteFooterTemplate],[kendoMultiSelectFooterTemplate],[kendoMultiSelectTreeFooterTemplate]" }, { kind: "directive", type: i3$1.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "directive", type: i3$1.NoDataTemplateDirective, selector: "[kendoDropDownListNoDataTemplate],[kendoDropDownTreeNoDataTemplate],[kendoComboBoxNoDataTemplate],[kendoMultiColumnComboBoxNoDataTemplate],[kendoAutoCompleteNoDataTemplate],[kendoMultiSelectNoDataTemplate],[kendoMultiSelectTreeNoDataTemplate]" }, { kind: "ngmodule", type: LoaderModule }, { kind: "ngmodule", type: ButtonsModule }, { kind: "component", type: i4.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: IconsModule }, { kind: "component", type: i5$1.SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon"], exportAs: ["kendoSVGIcon"] }, { kind: "ngmodule", type: SVGIconModule }] });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CkTypeSelectorInputComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mm-ck-type-selector-input', standalone: true, imports: [
+                        CommonModule,
+                        ReactiveFormsModule,
+                        AutoCompleteModule,
+                        LoaderModule,
+                        ButtonsModule,
+                        IconsModule,
+                        SVGIconModule
+                    ], providers: [
+                        {
+                            provide: NG_VALUE_ACCESSOR,
+                            useExisting: forwardRef(() => CkTypeSelectorInputComponent),
+                            multi: true
+                        },
+                        {
+                            provide: NG_VALIDATORS,
+                            useExisting: forwardRef(() => CkTypeSelectorInputComponent),
+                            multi: true
+                        }
+                    ], template: `
+    <div class="ck-type-select-wrapper" [class.disabled]="disabled">
+      <kendo-autocomplete
+        #autocomplete
+        [formControl]="searchFormControl"
+        [data]="filteredTypes"
+        [loading]="isLoading"
+        [placeholder]="placeholder"
+        [suggest]="true"
+        [clearButton]="true"
+        [filterable]="true"
+        [popupSettings]="popupSettings"
+        (filterChange)="onFilterChange($event)"
+        (valueChange)="onSelectionChange($event)"
+        (blur)="onBlur()"
+        (focus)="onFocus()"
+        class="ck-type-autocomplete">
+
+        <ng-template kendoAutoCompleteItemTemplate let-dataItem>
+          <div class="ck-type-item">
+            {{ dataItem }}
+          </div>
+        </ng-template>
+
+        <ng-template kendoAutoCompleteNoDataTemplate>
+          <div class="no-data-message">
+            <span *ngIf="!isLoading && searchFormControl.value && searchFormControl.value.length >= minSearchLength">
+              No types found for "{{ searchFormControl.value }}"
+            </span>
+            <span *ngIf="!isLoading && (!searchFormControl.value || searchFormControl.value.length < minSearchLength)">
+              Type at least {{ minSearchLength }} characters to search...
+            </span>
+          </div>
+        </ng-template>
+
+        <ng-template kendoAutoCompleteFooterTemplate>
+          <div class="advanced-search-footer" (click)="openDialog($event)">
+            <kendo-svg-icon [icon]="searchIcon" size="small"></kendo-svg-icon>
+            <span>{{ advancedSearchLabel }}</span>
+          </div>
+        </ng-template>
+
+      </kendo-autocomplete>
+
+      <button
+        kendoButton
+        type="button"
+        [svgIcon]="searchIcon"
+        [disabled]="disabled"
+        [title]="advancedSearchLabel"
+        class="dialog-button"
+        (click)="openDialog()">
+      </button>
+    </div>
+  `, styles: [":host{display:block;width:100%}.ck-type-select-wrapper{position:relative;display:flex;align-items:center;width:100%;gap:4px}.ck-type-select-wrapper.disabled{opacity:.6;pointer-events:none}.ck-type-autocomplete{flex:1;min-width:0}.dialog-button{flex-shrink:0;height:30px;width:30px;padding:0;display:flex;align-items:center;justify-content:center}.ck-type-item{padding:4px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.no-data-message{padding:8px 12px;color:var(--kendo-color-subtle);font-style:italic;text-align:center}.advanced-search-footer{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;color:var(--kendo-color-primary);border-top:1px solid var(--kendo-color-border);background:var(--kendo-color-surface-alt);transition:background-color .2s}.advanced-search-footer:hover{background:var(--kendo-color-base-hover)}\n"] }]
+        }], propDecorators: { autocomplete: [{
+                type: ViewChild,
+                args: ['autocomplete', { static: true }]
+            }], placeholder: [{
+                type: Input
+            }], minSearchLength: [{
+                type: Input
+            }], maxResults: [{
+                type: Input
+            }], debounceMs: [{
+                type: Input
+            }], ckModelIds: [{
+                type: Input
+            }], allowAbstract: [{
+                type: Input
+            }], dialogTitle: [{
+                type: Input
+            }], advancedSearchLabel: [{
+                type: Input
+            }], derivedFromRtCkTypeId: [{
+                type: Input
+            }], disabled: [{
+                type: Input
+            }], required: [{
+                type: Input
+            }], ckTypeSelected: [{
+                type: Output
+            }], ckTypeCleared: [{
+                type: Output
+            }] } });
+
+class AttributeSelectorDialogComponent {
+    windowRef = inject(WindowRef);
+    attributeService = inject(AttributeSelectorService);
+    searchSubject = new Subject();
+    arrowRightIcon = arrowRightIcon;
+    arrowLeftIcon = arrowLeftIcon;
+    chevronDoubleRightIcon = chevronDoubleRightIcon;
+    chevronDoubleLeftIcon = chevronDoubleLeftIcon;
+    searchIcon = searchIcon;
+    arrowUpIcon = arrowUpIcon;
+    arrowDownIcon = arrowDownIcon;
+    data;
+    dialogTitle = 'Select Attributes';
+    rtCkTypeId;
+    singleSelect = false;
+    searchText = '';
+    selectedSingleKey = [];
+    selectedValueTypeFilter = null;
+    includeNavigationProperties = true;
+    maxDepth = null;
+    availableAttributes = [];
+    selectedAttributes = [];
+    availableGridData = { data: [], total: 0 };
+    selectedGridData = { data: [], total: 0 };
+    selectedAvailableKeys = [];
+    selectedChosenKeys = [];
+    valueTypeOptions = [
+        { text: 'All Types', value: null },
+        { text: 'String', value: AttributeValueTypeDto$1.StringDto },
+        { text: 'Integer', value: AttributeValueTypeDto$1.IntegerDto },
+        { text: 'Double', value: AttributeValueTypeDto$1.DoubleDto },
+        { text: 'Boolean', value: AttributeValueTypeDto$1.BooleanDto },
+        { text: 'DateTime', value: AttributeValueTypeDto$1.DateTimeDto },
+        { text: 'DateTimeOffset', value: AttributeValueTypeDto$1.DateTimeOffsetDto },
+        { text: 'Enum', value: AttributeValueTypeDto$1.EnumDto },
+        { text: 'TimeSpan', value: AttributeValueTypeDto$1.TimeSpanDto }
+    ];
+    // Double-click tracking
+    lastClickTime = 0;
+    lastClickedItem = null;
+    doubleClickDelay = 300; // milliseconds
+    ngOnInit() {
+        if (this.data) {
+            this.rtCkTypeId = this.data.rtCkTypeId;
+            this.dialogTitle = this.data.dialogTitle || 'Select Attributes';
+            this.singleSelect = this.data.singleSelect ?? false;
+            this.includeNavigationProperties = this.data.includeNavigationProperties ?? true;
+            this.maxDepth = this.data.maxDepth ?? null;
+            if (this.data.selectedAttributes && this.data.selectedAttributes.length > 0) {
+                if (this.singleSelect) {
+                    this.selectedSingleKey = [this.data.selectedAttributes[0]];
+                }
+                else {
+                    // Pre-populate selected attributes if provided
+                    this.loadInitialSelectedAttributes(this.data.selectedAttributes);
+                }
+            }
+        }
+        // Set up search debouncing
+        this.searchSubject.pipe(debounceTime(300), distinctUntilChanged()).subscribe(searchText => {
+            this.loadAvailableAttributes(searchText);
+        });
+        // Load initial attributes
+        this.loadAvailableAttributes();
+    }
+    loadAvailableAttributes(searchTerm) {
+        this.attributeService.getAvailableAttributes(this.rtCkTypeId, undefined, undefined, undefined, this.selectedValueTypeFilter || undefined, searchTerm || undefined, this.includeNavigationProperties, this.maxDepth ?? undefined).subscribe(result => {
+            // Filter out already selected attributes
+            const selectedPaths = new Set(this.selectedAttributes.map(a => a.attributePath));
+            this.availableAttributes = result.items.filter(item => !selectedPaths.has(item.attributePath));
+            this.updateAvailableGrid();
+        });
+    }
+    loadInitialSelectedAttributes(attributePaths) {
+        // Load all attributes to get the details for selected ones
+        this.attributeService.getAvailableAttributes(this.rtCkTypeId).subscribe(result => {
+            // Create a map for quick lookup
+            const attributeMap = new Map(result.items.map(item => [item.attributePath, item]));
+            // Preserve the order from attributePaths
+            this.selectedAttributes = attributePaths
+                .map(path => attributeMap.get(path))
+                .filter((item) => item !== undefined);
+            this.updateSelectedGrid();
+            // Filter out selected from available
+            const selectedPaths = new Set(this.selectedAttributes.map(a => a.attributePath));
+            this.availableAttributes = result.items.filter(item => !selectedPaths.has(item.attributePath));
+            this.updateAvailableGrid();
+        });
+    }
+    onSearchChange(value) {
+        this.searchSubject.next(value);
+    }
+    onValueTypeFilterChange(_value) {
+        this.loadAvailableAttributes(this.searchText || undefined);
+    }
+    onNavigationPropertiesChange() {
+        if (!this.includeNavigationProperties) {
+            this.maxDepth = null;
+        }
+        this.loadAvailableAttributes(this.searchText || undefined);
+    }
+    onMaxDepthChange(value) {
+        this.maxDepth = value;
+        this.loadAvailableAttributes(this.searchText || undefined);
+    }
+    addSelected() {
+        const itemsToAdd = this.availableAttributes.filter(item => this.selectedAvailableKeys.includes(item.attributePath));
+        this.selectedAttributes.push(...itemsToAdd);
+        this.availableAttributes = this.availableAttributes.filter(item => !this.selectedAvailableKeys.includes(item.attributePath));
+        this.selectedAvailableKeys = [];
+        this.updateGrids();
+    }
+    removeSelected() {
+        const itemsToRemove = this.selectedAttributes.filter(item => this.selectedChosenKeys.includes(item.attributePath));
+        this.availableAttributes.push(...itemsToRemove);
+        this.selectedAttributes = this.selectedAttributes.filter(item => !this.selectedChosenKeys.includes(item.attributePath));
+        this.selectedChosenKeys = [];
+        this.sortAvailableAttributes();
+        this.updateGrids();
+    }
+    addAll() {
+        this.selectedAttributes.push(...this.availableAttributes);
+        this.availableAttributes = [];
+        this.selectedAvailableKeys = [];
+        this.updateGrids();
+    }
+    removeAll() {
+        this.availableAttributes.push(...this.selectedAttributes);
+        this.selectedAttributes = [];
+        this.selectedChosenKeys = [];
+        this.sortAvailableAttributes();
+        this.updateGrids();
+    }
+    sortAvailableAttributes() {
+        this.availableAttributes.sort((a, b) => a.attributePath.localeCompare(b.attributePath));
+    }
+    canMoveUp() {
+        if (this.selectedChosenKeys.length !== 1)
+            return false;
+        const index = this.selectedAttributes.findIndex(a => a.attributePath === this.selectedChosenKeys[0]);
+        return index > 0;
+    }
+    canMoveDown() {
+        if (this.selectedChosenKeys.length !== 1)
+            return false;
+        const index = this.selectedAttributes.findIndex(a => a.attributePath === this.selectedChosenKeys[0]);
+        return index >= 0 && index < this.selectedAttributes.length - 1;
+    }
+    moveUp() {
+        if (!this.canMoveUp())
+            return;
+        const index = this.selectedAttributes.findIndex(a => a.attributePath === this.selectedChosenKeys[0]);
+        [this.selectedAttributes[index - 1], this.selectedAttributes[index]] =
+            [this.selectedAttributes[index], this.selectedAttributes[index - 1]];
+        this.updateSelectedGrid();
+    }
+    moveDown() {
+        if (!this.canMoveDown())
+            return;
+        const index = this.selectedAttributes.findIndex(a => a.attributePath === this.selectedChosenKeys[0]);
+        [this.selectedAttributes[index], this.selectedAttributes[index + 1]] =
+            [this.selectedAttributes[index + 1], this.selectedAttributes[index]];
+        this.updateSelectedGrid();
+    }
+    updateGrids() {
+        this.updateAvailableGrid();
+        this.updateSelectedGrid();
+    }
+    updateAvailableGrid() {
+        this.availableGridData = {
+            data: this.availableAttributes,
+            total: this.availableAttributes.length
+        };
+    }
+    updateSelectedGrid() {
+        this.selectedGridData = {
+            data: this.selectedAttributes,
+            total: this.selectedAttributes.length
+        };
+    }
+    onCancel() {
+        this.windowRef.close();
+    }
+    onConfirm() {
+        if (this.singleSelect) {
+            const selected = this.availableAttributes.find(a => a.attributePath === this.selectedSingleKey[0]);
+            const result = {
+                selectedAttributes: selected ? [selected] : []
+            };
+            this.windowRef.close(result);
+        }
+        else {
+            const result = {
+                selectedAttributes: this.selectedAttributes
+            };
+            this.windowRef.close(result);
+        }
+    }
+    /**
+     * Handle cell click on available attributes grid to detect double-click
+     */
+    onAvailableCellClick(event) {
+        const dataItem = event.dataItem;
+        if (!dataItem)
+            return;
+        const currentTime = Date.now();
+        const attributePath = dataItem.attributePath;
+        if (this.lastClickedItem === attributePath &&
+            currentTime - this.lastClickTime <= this.doubleClickDelay) {
+            // Double-click detected - move attribute to selected
+            this.moveAttributeToSelected(dataItem);
+            // Reset to prevent triple-click
+            this.lastClickTime = 0;
+            this.lastClickedItem = null;
+        }
+        else {
+            // Single click - just update tracking
+            this.lastClickTime = currentTime;
+            this.lastClickedItem = attributePath;
+        }
+    }
+    /**
+     * Handle cell click on selected attributes grid to detect double-click
+     */
+    onSelectedCellClick(event) {
+        const dataItem = event.dataItem;
+        if (!dataItem)
+            return;
+        const currentTime = Date.now();
+        const attributePath = dataItem.attributePath;
+        if (this.lastClickedItem === attributePath &&
+            currentTime - this.lastClickTime <= this.doubleClickDelay) {
+            // Double-click detected - move attribute to available
+            this.moveAttributeToAvailable(dataItem);
+            // Reset to prevent triple-click
+            this.lastClickTime = 0;
+            this.lastClickedItem = null;
+        }
+        else {
+            // Single click - just update tracking
+            this.lastClickTime = currentTime;
+            this.lastClickedItem = attributePath;
+        }
+    }
+    /**
      * Handle cell click on single-select grid to detect double-click (confirm immediately)
      */
     onSingleSelectCellClick(event) {
@@ -3011,6 +3299,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImpor
 
 class AttributeSelectorDialogService {
     windowService = inject(WindowService);
+    windowStateService = inject(WindowStateService);
     /**
      * Opens the attribute selector dialog
      * @param rtCkTypeId The RtCkType ID to fetch attributes for
@@ -3026,455 +3315,540 @@ class AttributeSelectorDialogService {
             dialogTitle,
             singleSelect
         };
+        const dialogKey = singleSelect ? 'attribute-selector-single' : 'attribute-selector';
+        const defaultWidth = singleSelect ? 550 : 1000;
+        const defaultHeight = singleSelect ? 650 : 700;
+        const size = this.windowStateService.resolveWindowSize(dialogKey, { width: defaultWidth, height: defaultHeight });
         const windowRef = this.windowService.open({
             content: AttributeSelectorDialogComponent,
-            width: singleSelect ? 550 : 1000,
-            height: singleSelect ? 650 : 700,
+            width: size.width,
+            height: size.height,
             minWidth: singleSelect ? 450 : 850,
             minHeight: singleSelect ? 550 : 650,
             resizable: true,
             title: dialogTitle || 'Select Attributes'
         });
-        // Pass data to the component
-        const contentRef = windowRef.content;
-        if (contentRef?.instance) {
-            contentRef.instance.data = data;
-        }
-        try {
-            const result = await firstValueFrom(windowRef.result);
-            if (result instanceof WindowCloseResult) {
-                // User closed the window via X button
-                return {
-                    confirmed: false,
-                    selectedAttributes: []
-                };
-            }
-            if (result && typeof result === 'object' && 'selectedAttributes' in result) {
-                // User clicked OK and we have a result
-                const dialogResult = result;
-                return {
-                    confirmed: true,
-                    selectedAttributes: dialogResult.selectedAttributes
-                };
-            }
-            else {
-                // User clicked Cancel or closed dialog
-                return {
-                    confirmed: false,
-                    selectedAttributes: []
-                };
-            }
-        }
-        catch {
-            // Dialog was closed without result (e.g., ESC key, X button)
-            return {
-                confirmed: false,
-                selectedAttributes: []
-            };
-        }
-    }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AttributeSelectorDialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
-    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AttributeSelectorDialogService });
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AttributeSelectorDialogService, decorators: [{
-            type: Injectable
-        }] });
-
-class CkTypeSelectorInputComponent {
-    autocomplete;
-    placeholder = 'Select a CK type...';
-    minSearchLength = 2;
-    maxResults = 50;
-    debounceMs = 300;
-    ckModelIds;
-    allowAbstract = false;
-    dialogTitle = 'Select Construction Kit Type';
-    advancedSearchLabel = 'Advanced Search...';
-    derivedFromRtCkTypeId;
-    _disabled = false;
-    get disabled() {
-        return this._disabled;
-    }
-    set disabled(value) {
-        this._disabled = !!value;
-        if (this._disabled) {
-            this.searchFormControl.disable();
-        }
-        else {
-            this.searchFormControl.enable();
-        }
-    }
-    _required = false;
-    get required() {
-        return this._required;
-    }
-    set required(value) {
-        this._required = !!value;
-    }
-    ckTypeSelected = new EventEmitter();
-    ckTypeCleared = new EventEmitter();
-    searchFormControl = new FormControl();
-    filteredTypes = [];
-    selectedCkType = null;
-    isLoading = false;
-    typeMap = new Map();
-    searchSubject = new Subject();
-    subscriptions = new Subscription();
-    onChange = () => { };
-    onTouched = () => { };
-    searchIcon = searchIcon;
-    popupSettings = { appendTo: 'root', popupClass: 'mm-ck-type-popup' };
-    static popupStyleInjected = false;
-    ckTypeSelectorService = inject(CkTypeSelectorService);
-    dialogService = inject(CkTypeSelectorDialogService, { optional: true });
-    elementRef = inject(ElementRef);
-    ngOnInit() {
-        this.setupSearch();
-        this.injectPopupStyles();
-    }
-    ngOnDestroy() {
-        this.subscriptions.unsubscribe();
-        this.searchSubject.complete();
-    }
-    // ControlValueAccessor implementation
-    writeValue(value) {
-        if (value !== this.selectedCkType) {
-            this.selectedCkType = value;
-            if (value) {
-                this.searchFormControl.setValue(value.rtCkTypeId, { emitEvent: false });
-            }
-            else {
-                this.searchFormControl.setValue('', { emitEvent: false });
-            }
-        }
-    }
-    registerOnChange(fn) {
-        this.onChange = fn;
-    }
-    registerOnTouched(fn) {
-        this.onTouched = fn;
-    }
-    setDisabledState(isDisabled) {
-        this.disabled = isDisabled;
-    }
-    // Validator implementation
-    validate(control) {
-        if (this.required && !this.selectedCkType) {
-            return { required: true };
-        }
-        const value = control.value;
-        if (value && typeof value === 'string') {
-            return { invalidCkType: true };
-        }
-        return null;
-    }
-    // Event handlers
-    onFilterChange(filter) {
-        if (!filter || filter.length < this.minSearchLength) {
-            this.filteredTypes = [];
-            return;
+        this.windowStateService.applyModalBehavior(dialogKey, windowRef);
+        // Pass data to the component
+        const contentRef = windowRef.content;
+        if (contentRef?.instance) {
+            contentRef.instance.data = data;
         }
-        this.searchSubject.next(filter);
-    }
-    onSelectionChange(value) {
-        if (value && typeof value === 'string') {
-            const ckType = this.typeMap.get(value);
-            if (ckType) {
-                this.selectCkType(ckType);
+        try {
+            const result = await firstValueFrom(windowRef.result);
+            if (result instanceof WindowCloseResult) {
+                return {
+                    confirmed: false,
+                    selectedAttributes: []
+                };
             }
-        }
-    }
-    onFocus() {
-        const currentValue = this.searchFormControl.value;
-        if (currentValue && currentValue.length >= this.minSearchLength && this.filteredTypes.length === 0) {
-            this.searchSubject.next(currentValue);
-        }
-    }
-    onBlur() {
-        this.onTouched();
-        if (this.filteredTypes.length === 1 && !this.selectedCkType) {
-            const displayText = this.filteredTypes[0];
-            const ckType = this.typeMap.get(displayText);
-            if (ckType) {
-                this.selectCkType(ckType);
+            if (result && typeof result === 'object' && 'selectedAttributes' in result) {
+                const dialogResult = result;
+                return {
+                    confirmed: true,
+                    selectedAttributes: dialogResult.selectedAttributes
+                };
+            }
+            else {
+                return {
+                    confirmed: false,
+                    selectedAttributes: []
+                };
             }
         }
-    }
-    // Public methods
-    clear() {
-        this.selectedCkType = null;
-        this.filteredTypes = [];
-        this.typeMap.clear();
-        this.searchFormControl.setValue('', { emitEvent: false });
-        this.onChange(null);
-        this.ckTypeCleared.emit();
-        this.autocomplete.focus();
-    }
-    focus() {
-        if (this.autocomplete) {
-            this.autocomplete.focus();
+        catch {
+            return {
+                confirmed: false,
+                selectedAttributes: []
+            };
         }
     }
-    reset() {
-        this.clear();
-    }
-    // Private methods
-    setupSearch() {
-        this.subscriptions.add(this.searchSubject.pipe(debounceTime(this.debounceMs), distinctUntilChanged(), tap(() => {
-            this.isLoading = true;
-            this.filteredTypes = [];
-        }), switchMap(filter => {
-            const source$ = this.derivedFromRtCkTypeId
-                ? this.ckTypeSelectorService.getDerivedCkTypes(this.derivedFromRtCkTypeId, {
-                    searchText: filter
-                })
-                : this.ckTypeSelectorService.getCkTypes({
-                    ckModelIds: this.ckModelIds,
-                    searchText: filter,
-                    first: this.maxResults
-                });
-            return source$.pipe(catchError(error => {
-                console.error('CK type search error:', error);
-                return of({ items: [], totalCount: 0 });
-            }));
-        })).subscribe(result => {
-            this.isLoading = false;
-            // Filter out abstract types if not allowed
-            let items = result.items;
-            if (!this.allowAbstract) {
-                items = items.filter(item => !item.isAbstract);
-            }
-            this.filteredTypes = items.map(item => item.rtCkTypeId);
-            this.typeMap = new Map(items.map(item => [item.rtCkTypeId, item]));
-        }));
-    }
-    injectPopupStyles() {
-        if (CkTypeSelectorInputComponent.popupStyleInjected)
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AttributeSelectorDialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AttributeSelectorDialogService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: AttributeSelectorDialogService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+class RuntimeEntityVariableDialogComponent {
+    windowRef = inject(WindowRef);
+    getEntitiesByCkTypeGQL = inject(GetEntitiesByCkTypeDtoGQL);
+    attributeSelectorDialogService = inject(AttributeSelectorDialogService);
+    pencilIcon = pencilIcon;
+    trashIcon = trashIcon;
+    /** Data passed to the dialog (set by service) */
+    data = {};
+    // Signals
+    selectedCkType = signal(null, ...(ngDevMode ? [{ debugName: "selectedCkType" }] : []));
+    selectedEntity = signal(null, ...(ngDevMode ? [{ debugName: "selectedEntity" }] : []));
+    variableMappings = signal([], ...(ngDevMode ? [{ debugName: "variableMappings" }] : []));
+    entityDataSource = computed(() => {
+        const ckType = this.selectedCkType();
+        if (!ckType)
+            return null;
+        return new RuntimeEntitySelectDataSource(this.getEntitiesByCkTypeGQL, ckType.rtCkTypeId);
+    }, ...(ngDevMode ? [{ debugName: "entityDataSource" }] : []));
+    entityDialogDataSource = computed(() => {
+        const ckType = this.selectedCkType();
+        if (!ckType)
+            return null;
+        return new RuntimeEntityDialogDataSource(this.getEntitiesByCkTypeGQL, ckType.rtCkTypeId);
+    }, ...(ngDevMode ? [{ debugName: "entityDialogDataSource" }] : []));
+    VALID_NAME_REGEX = /^[a-zA-Z_][a-zA-Z0-9_]*$/;
+    onCkTypeSelected(ckType) {
+        this.selectedCkType.set(ckType);
+        this.selectedEntity.set(null);
+        // Don't clear mappings — keep them if user is just switching type
+    }
+    onCkTypeCleared() {
+        this.selectedCkType.set(null);
+        this.selectedEntity.set(null);
+    }
+    onEntitySelected(entity) {
+        this.selectedEntity.set(entity);
+    }
+    onEntityCleared() {
+        this.selectedEntity.set(null);
+    }
+    async openAttributeSelector() {
+        const ckType = this.selectedCkType();
+        if (!ckType)
             return;
-        const style = document.createElement('style');
-        style.setAttribute('data-mm-ck-type-popup', '');
-        style.textContent = `
-      .mm-ck-type-popup {
-        max-width: 500px !important;
-        min-width: 0 !important;
-      }
-      .mm-ck-type-popup .k-child-animation-container {
-        max-width: 500px !important;
-      }
-      .mm-ck-type-popup .k-list-item {
-        padding: 4px 12px !important;
-        min-height: 0 !important;
-        font-size: 13px !important;
-        line-height: 20px !important;
-      }
-    `;
-        document.head.appendChild(style);
-        CkTypeSelectorInputComponent.popupStyleInjected = true;
+        const existingPaths = this.variableMappings().map(m => m.attributePath);
+        const result = await this.attributeSelectorDialogService.openAttributeSelector(ckType.rtCkTypeId, existingPaths, 'Select Attributes');
+        if (result.confirmed && result.selectedAttributes.length > 0) {
+            this.addAttributeMappings(result.selectedAttributes);
+        }
+    }
+    onNameChange(index, name) {
+        const sanitized = name.replace(/[^a-zA-Z0-9_]/g, '');
+        const mappings = [...this.variableMappings()];
+        mappings[index] = { ...mappings[index], name: sanitized };
+        this.variableMappings.set(mappings);
+    }
+    removeMapping(index) {
+        const mappings = this.variableMappings().filter((_, i) => i !== index);
+        this.variableMappings.set(mappings);
+    }
+    getNameError(name, index) {
+        if (!name)
+            return 'Name required';
+        if (!this.VALID_NAME_REGEX.test(name))
+            return 'Invalid name';
+        if (this.isDuplicateName(name, index))
+            return 'Duplicate';
+        return null;
     }
-    selectCkType(ckType) {
-        this.selectedCkType = ckType;
-        this.searchFormControl.setValue(ckType.rtCkTypeId, { emitEvent: false });
-        this.filteredTypes = [];
-        this.onChange(ckType);
-        this.ckTypeSelected.emit(ckType);
-        this.autocomplete.toggle(false);
+    isValid() {
+        const entity = this.selectedEntity();
+        const mappings = this.variableMappings();
+        if (!entity || mappings.length === 0)
+            return false;
+        return mappings.every((m, i) => m.name &&
+            this.VALID_NAME_REGEX.test(m.name) &&
+            !this.isDuplicateName(m.name, i));
     }
-    // Dialog
-    async openDialog(event) {
-        if (event) {
-            event.preventDefault();
-            event.stopPropagation();
-        }
-        if (!this.dialogService) {
-            console.warn('CkTypeSelectorDialogService not available');
+    onOk() {
+        const ckType = this.selectedCkType();
+        const entity = this.selectedEntity();
+        if (!ckType || !entity)
             return;
-        }
-        this.autocomplete.toggle(false);
-        const result = await this.dialogService.openCkTypeSelector({
-            selectedCkTypeId: this.selectedCkType?.fullName,
-            ckModelIds: this.ckModelIds,
-            dialogTitle: this.dialogTitle,
-            allowAbstract: this.allowAbstract,
-            derivedFromRtCkTypeId: this.derivedFromRtCkTypeId
-        });
-        if (result.confirmed && result.selectedCkType) {
-            this.selectCkType(result.selectedCkType);
-        }
+        const result = {
+            entityCkTypeId: ckType.rtCkTypeId,
+            entityRtId: entity.rtId,
+            entityDisplayName: entity.displayName,
+            variables: this.variableMappings()
+        };
+        this.windowRef.close(result);
     }
-    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CkTypeSelectorInputComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
-    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "21.2.0", type: CkTypeSelectorInputComponent, isStandalone: true, selector: "mm-ck-type-selector-input", inputs: { placeholder: "placeholder", minSearchLength: "minSearchLength", maxResults: "maxResults", debounceMs: "debounceMs", ckModelIds: "ckModelIds", allowAbstract: "allowAbstract", dialogTitle: "dialogTitle", advancedSearchLabel: "advancedSearchLabel", derivedFromRtCkTypeId: "derivedFromRtCkTypeId", disabled: "disabled", required: "required" }, outputs: { ckTypeSelected: "ckTypeSelected", ckTypeCleared: "ckTypeCleared" }, providers: [
-            {
-                provide: NG_VALUE_ACCESSOR,
-                useExisting: forwardRef(() => CkTypeSelectorInputComponent),
-                multi: true
-            },
-            {
-                provide: NG_VALIDATORS,
-                useExisting: forwardRef(() => CkTypeSelectorInputComponent),
-                multi: true
+    onCancel() {
+        this.windowRef.close();
+    }
+    addAttributeMappings(attributes) {
+        const existingMappings = this.variableMappings();
+        const existingPaths = new Set(existingMappings.map(m => m.attributePath));
+        const allNames = new Set([
+            ...existingMappings.map(m => m.name),
+            ...(this.data.existingVariableNames ?? [])
+        ]);
+        const newMappings = [];
+        for (const attr of attributes) {
+            if (existingPaths.has(attr.attributePath))
+                continue;
+            let name = this.attributePathToVariableName(attr.attributePath);
+            let counter = 1;
+            while (allNames.has(name)) {
+                name = `${this.attributePathToVariableName(attr.attributePath)}${counter}`;
+                counter++;
             }
-        ], viewQueries: [{ propertyName: "autocomplete", first: true, predicate: ["autocomplete"], descendants: true, static: true }], ngImport: i0, template: `
-    <div class="ck-type-select-wrapper" [class.disabled]="disabled">
-      <kendo-autocomplete
-        #autocomplete
-        [formControl]="searchFormControl"
-        [data]="filteredTypes"
-        [loading]="isLoading"
-        [placeholder]="placeholder"
-        [suggest]="true"
-        [clearButton]="true"
-        [filterable]="true"
-        [popupSettings]="popupSettings"
-        (filterChange)="onFilterChange($event)"
-        (valueChange)="onSelectionChange($event)"
-        (blur)="onBlur()"
-        (focus)="onFocus()"
-        class="ck-type-autocomplete">
+            allNames.add(name);
+            newMappings.push({
+                name,
+                attributePath: attr.attributePath,
+                attributeValueType: attr.attributeValueType
+            });
+        }
+        this.variableMappings.set([...existingMappings, ...newMappings]);
+    }
+    attributePathToVariableName(attributePath) {
+        const parts = attributePath.split('.');
+        return parts
+            .map((part, index) => index === 0 ? part : part.charAt(0).toUpperCase() + part.slice(1))
+            .join('');
+    }
+    isDuplicateName(name, currentIndex) {
+        const mappings = this.variableMappings();
+        const existingNames = this.data.existingVariableNames ?? [];
+        // Check within dialog mappings
+        if (mappings.some((m, i) => i !== currentIndex && m.name === name))
+            return true;
+        // Check against existing external variable names
+        if (existingNames.includes(name))
+            return true;
+        return false;
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: RuntimeEntityVariableDialogComponent, deps: [], target: i0.ɵɵFactoryTarget.Component });
+    static ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "21.2.0", type: RuntimeEntityVariableDialogComponent, isStandalone: true, selector: "mm-runtime-entity-variable-dialog", ngImport: i0, template: `
+    <div class="dialog-content">
+      <div class="form-row">
+        <label class="form-label">CK Type</label>
+        <mm-ck-type-selector-input
+          [placeholder]="'Select CK Type...'"
+          [minSearchLength]="2"
+          (ckTypeSelected)="onCkTypeSelected($event)"
+          (ckTypeCleared)="onCkTypeCleared()">
+        </mm-ck-type-selector-input>
+      </div>
 
-        <ng-template kendoAutoCompleteItemTemplate let-dataItem>
-          <div class="ck-type-item">
-            {{ dataItem }}
-          </div>
-        </ng-template>
+      <div class="form-row">
+        <label class="form-label">Entity</label>
+        <mm-entity-select-input
+          [dataSource]="entityDataSource()!"
+          [dialogDataSource]="entityDialogDataSource()!"
+          [placeholder]="'Select Entity...'"
+          [disabled]="!selectedCkType()"
+          [minSearchLength]="1"
+          dialogTitle="Select Entity"
+          (entitySelected)="onEntitySelected($event)"
+          (entityCleared)="onEntityCleared()">
+        </mm-entity-select-input>
+      </div>
 
-        <ng-template kendoAutoCompleteNoDataTemplate>
-          <div class="no-data-message">
-            <span *ngIf="!isLoading && searchFormControl.value && searchFormControl.value.length >= minSearchLength">
-              No types found for "{{ searchFormControl.value }}"
-            </span>
-            <span *ngIf="!isLoading && (!searchFormControl.value || searchFormControl.value.length < minSearchLength)">
-              Type at least {{ minSearchLength }} characters to search...
-            </span>
-          </div>
-        </ng-template>
+      <div class="form-row">
+        <label class="form-label">Attributes</label>
+        <button
+          kendoButton
+          (click)="openAttributeSelector()"
+          [disabled]="!selectedCkType()"
+          themeColor="primary"
+          fillMode="outline">
+          Select Attributes...
+        </button>
+      </div>
 
-        <ng-template kendoAutoCompleteFooterTemplate>
-          <div class="advanced-search-footer" (click)="openDialog($event)">
-            <kendo-svg-icon [icon]="searchIcon" size="small"></kendo-svg-icon>
-            <span>{{ advancedSearchLabel }}</span>
+      @if (variableMappings().length > 0) {
+        <div class="mappings-grid">
+          <div class="grid-header">
+            <span class="col-name">Variable Name</span>
+            <span class="col-path">Attribute Path</span>
+            <span class="col-type">Type</span>
+            <span class="col-actions"></span>
           </div>
-        </ng-template>
-
-      </kendo-autocomplete>
+          @for (mapping of variableMappings(); track mapping.attributePath; let i = $index) {
+            <div class="grid-row">
+              <div class="col-name">
+                <kendo-textbox
+                  [value]="mapping.name"
+                  (valueChange)="onNameChange(i, $event)"
+                  [style.width.%]="100">
+                </kendo-textbox>
+                @if (getNameError(mapping.name, i); as error) {
+                  <span class="error-text">{{ error }}</span>
+                }
+              </div>
+              <div class="col-path">{{ mapping.attributePath }}</div>
+              <div class="col-type">{{ mapping.attributeValueType }}</div>
+              <div class="col-actions">
+                <button
+                  kendoButton
+                  (click)="removeMapping(i)"
+                  [svgIcon]="trashIcon"
+                  fillMode="flat"
+                  themeColor="error"
+                  title="Remove">
+                </button>
+              </div>
+            </div>
+          }
+        </div>
+      }
 
-      <button
-        kendoButton
-        type="button"
-        [svgIcon]="searchIcon"
-        [disabled]="disabled"
-        [title]="advancedSearchLabel"
-        class="dialog-button"
-        (click)="openDialog()">
-      </button>
+      <div class="dialog-actions">
+        <button kendoButton (click)="onCancel()" fillMode="outline">Cancel</button>
+        <button kendoButton (click)="onOk()" themeColor="primary" [disabled]="!isValid()">OK</button>
+      </div>
     </div>
-  `, isInline: true, styles: [":host{display:block;width:100%}.ck-type-select-wrapper{position:relative;display:flex;align-items:center;width:100%;gap:4px}.ck-type-select-wrapper.disabled{opacity:.6;pointer-events:none}.ck-type-autocomplete{flex:1;min-width:0}.dialog-button{flex-shrink:0;height:30px;width:30px;padding:0;display:flex;align-items:center;justify-content:center}.ck-type-item{padding:4px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.no-data-message{padding:8px 12px;color:var(--kendo-color-subtle);font-style:italic;text-align:center}.advanced-search-footer{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;color:var(--kendo-color-primary);border-top:1px solid var(--kendo-color-border);background:var(--kendo-color-surface-alt);transition:background-color .2s}.advanced-search-footer:hover{background:var(--kendo-color-base-hover)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "directive", type: i1.NgIf, selector: "[ngIf]", inputs: ["ngIf", "ngIfThen", "ngIfElse"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i2.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i2.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }, { kind: "ngmodule", type: AutoCompleteModule }, { kind: "component", type: i3$1.AutoCompleteComponent, selector: "kendo-autocomplete", inputs: ["highlightFirst", "showStickyHeader", "focusableId", "data", "value", "valueField", "placeholder", "adaptiveMode", "adaptiveTitle", "adaptiveSubtitle", "popupSettings", "listHeight", "loading", "clearButton", "suggest", "disabled", "itemDisabled", "readonly", "tabindex", "tabIndex", "filterable", "virtual", "size", "rounded", "fillMode", "inputAttributes"], outputs: ["valueChange", "filterChange", "open", "opened", "close", "closed", "focus", "blur", "inputFocus", "inputBlur"], exportAs: ["kendoAutoComplete"] }, { kind: "directive", type: i3$1.FooterTemplateDirective, selector: "[kendoDropDownListFooterTemplate],[kendoComboBoxFooterTemplate],[kendoDropDownTreeFooterTemplate],[kendoMultiColumnComboBoxFooterTemplate],[kendoAutoCompleteFooterTemplate],[kendoMultiSelectFooterTemplate],[kendoMultiSelectTreeFooterTemplate]" }, { kind: "directive", type: i3$1.ItemTemplateDirective, selector: "[kendoDropDownListItemTemplate],[kendoComboBoxItemTemplate],[kendoAutoCompleteItemTemplate],[kendoMultiSelectItemTemplate]" }, { kind: "directive", type: i3$1.NoDataTemplateDirective, selector: "[kendoDropDownListNoDataTemplate],[kendoDropDownTreeNoDataTemplate],[kendoComboBoxNoDataTemplate],[kendoMultiColumnComboBoxNoDataTemplate],[kendoAutoCompleteNoDataTemplate],[kendoMultiSelectNoDataTemplate],[kendoMultiSelectTreeNoDataTemplate]" }, { kind: "ngmodule", type: LoaderModule }, { kind: "ngmodule", type: ButtonsModule }, { kind: "component", type: i4.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: IconsModule }, { kind: "component", type: i5$1.SVGIconComponent, selector: "kendo-svg-icon, kendo-svgicon", inputs: ["icon"], exportAs: ["kendoSVGIcon"] }, { kind: "ngmodule", type: SVGIconModule }] });
+  `, isInline: true, styles: [".dialog-content{display:flex;flex-direction:column;gap:16px;padding:16px 20px}.form-row{display:flex;flex-direction:column;gap:4px}.form-label{font-size:12px;font-weight:600;color:var(--kendo-color-subtle, #666)}.mappings-grid{border:1px solid var(--kendo-color-border, #e0e0e0);border-radius:4px;background:var(--kendo-color-surface-alt, #fafafa)}.grid-header{display:grid;grid-template-columns:1fr 1fr 100px 40px;gap:.5rem;padding:.5rem .75rem;background:var(--kendo-color-surface, #f5f5f5);border-bottom:1px solid var(--kendo-color-border, #e0e0e0);font-size:12px;font-weight:600;color:var(--kendo-color-subtle, #666)}.grid-row{display:grid;grid-template-columns:1fr 1fr 100px 40px;gap:.5rem;padding:.5rem .75rem;align-items:start;border-bottom:1px solid var(--kendo-color-border, #e0e0e0)}.grid-row:last-child{border-bottom:none}.col-name{display:flex;flex-direction:column;gap:2px}.col-path,.col-type{font-size:13px;padding-top:6px;color:var(--kendo-color-on-app-surface, #424242)}.col-actions{display:flex;justify-content:center;padding-top:2px}.error-text{font-size:11px;color:var(--kendo-color-error, #f44336)}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;padding-top:8px;border-top:1px solid var(--kendo-color-border, #e0e0e0)}\n"], dependencies: [{ kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: FormsModule }, { kind: "ngmodule", type: ButtonsModule }, { kind: "component", type: i4.ButtonComponent, selector: "button[kendoButton]", inputs: ["arrowIcon", "toggleable", "togglable", "selected", "tabIndex", "imageUrl", "iconClass", "icon", "disabled", "size", "rounded", "fillMode", "themeColor", "svgIcon", "primary", "look"], outputs: ["selectedChange", "click"], exportAs: ["kendoButton"] }, { kind: "ngmodule", type: InputsModule }, { kind: "component", type: i5.TextBoxComponent, selector: "kendo-textbox", inputs: ["focusableId", "title", "type", "disabled", "readonly", "tabindex", "value", "selectOnFocus", "showSuccessIcon", "showErrorIcon", "clearButton", "successIcon", "successSvgIcon", "errorIcon", "errorSvgIcon", "clearButtonIcon", "clearButtonSvgIcon", "size", "rounded", "fillMode", "tabIndex", "placeholder", "maxlength", "inputAttributes"], outputs: ["valueChange", "inputFocus", "inputBlur", "focus", "blur"], exportAs: ["kendoTextBox"] }, { kind: "ngmodule", type: GridModule }, { kind: "ngmodule", type: IconsModule }, { kind: "component", type: CkTypeSelectorInputComponent, selector: "mm-ck-type-selector-input", inputs: ["placeholder", "minSearchLength", "maxResults", "debounceMs", "ckModelIds", "allowAbstract", "dialogTitle", "advancedSearchLabel", "derivedFromRtCkTypeId", "disabled", "required"], outputs: ["ckTypeSelected", "ckTypeCleared"] }, { kind: "component", type: EntitySelectInputComponent, selector: "mm-entity-select-input", inputs: ["dataSource", "placeholder", "minSearchLength", "maxResults", "debounceMs", "prefix", "initialDisplayValue", "dialogDataSource", "dialogTitle", "multiSelect", "advancedSearchLabel", "dialogMessages", "messages", "disabled", "required"], outputs: ["entitySelected", "entityCleared", "entitiesSelected"] }] });
 }
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: CkTypeSelectorInputComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'mm-ck-type-selector-input', standalone: true, imports: [
-                        CommonModule,
-                        ReactiveFormsModule,
-                        AutoCompleteModule,
-                        LoaderModule,
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: RuntimeEntityVariableDialogComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'mm-runtime-entity-variable-dialog', standalone: true, imports: [
+                        CommonModule,
+                        FormsModule,
                         ButtonsModule,
+                        InputsModule,
+                        GridModule,
                         IconsModule,
-                        SVGIconModule
-                    ], providers: [
-                        {
-                            provide: NG_VALUE_ACCESSOR,
-                            useExisting: forwardRef(() => CkTypeSelectorInputComponent),
-                            multi: true
-                        },
-                        {
-                            provide: NG_VALIDATORS,
-                            useExisting: forwardRef(() => CkTypeSelectorInputComponent),
-                            multi: true
-                        }
+                        CkTypeSelectorInputComponent,
+                        EntitySelectInputComponent
                     ], template: `
-    <div class="ck-type-select-wrapper" [class.disabled]="disabled">
-      <kendo-autocomplete
-        #autocomplete
-        [formControl]="searchFormControl"
-        [data]="filteredTypes"
-        [loading]="isLoading"
-        [placeholder]="placeholder"
-        [suggest]="true"
-        [clearButton]="true"
-        [filterable]="true"
-        [popupSettings]="popupSettings"
-        (filterChange)="onFilterChange($event)"
-        (valueChange)="onSelectionChange($event)"
-        (blur)="onBlur()"
-        (focus)="onFocus()"
-        class="ck-type-autocomplete">
+    <div class="dialog-content">
+      <div class="form-row">
+        <label class="form-label">CK Type</label>
+        <mm-ck-type-selector-input
+          [placeholder]="'Select CK Type...'"
+          [minSearchLength]="2"
+          (ckTypeSelected)="onCkTypeSelected($event)"
+          (ckTypeCleared)="onCkTypeCleared()">
+        </mm-ck-type-selector-input>
+      </div>
 
-        <ng-template kendoAutoCompleteItemTemplate let-dataItem>
-          <div class="ck-type-item">
-            {{ dataItem }}
-          </div>
-        </ng-template>
+      <div class="form-row">
+        <label class="form-label">Entity</label>
+        <mm-entity-select-input
+          [dataSource]="entityDataSource()!"
+          [dialogDataSource]="entityDialogDataSource()!"
+          [placeholder]="'Select Entity...'"
+          [disabled]="!selectedCkType()"
+          [minSearchLength]="1"
+          dialogTitle="Select Entity"
+          (entitySelected)="onEntitySelected($event)"
+          (entityCleared)="onEntityCleared()">
+        </mm-entity-select-input>
+      </div>
 
-        <ng-template kendoAutoCompleteNoDataTemplate>
-          <div class="no-data-message">
-            <span *ngIf="!isLoading && searchFormControl.value && searchFormControl.value.length >= minSearchLength">
-              No types found for "{{ searchFormControl.value }}"
-            </span>
-            <span *ngIf="!isLoading && (!searchFormControl.value || searchFormControl.value.length < minSearchLength)">
-              Type at least {{ minSearchLength }} characters to search...
-            </span>
-          </div>
-        </ng-template>
+      <div class="form-row">
+        <label class="form-label">Attributes</label>
+        <button
+          kendoButton
+          (click)="openAttributeSelector()"
+          [disabled]="!selectedCkType()"
+          themeColor="primary"
+          fillMode="outline">
+          Select Attributes...
+        </button>
+      </div>
 
-        <ng-template kendoAutoCompleteFooterTemplate>
-          <div class="advanced-search-footer" (click)="openDialog($event)">
-            <kendo-svg-icon [icon]="searchIcon" size="small"></kendo-svg-icon>
-            <span>{{ advancedSearchLabel }}</span>
+      @if (variableMappings().length > 0) {
+        <div class="mappings-grid">
+          <div class="grid-header">
+            <span class="col-name">Variable Name</span>
+            <span class="col-path">Attribute Path</span>
+            <span class="col-type">Type</span>
+            <span class="col-actions"></span>
           </div>
-        </ng-template>
-
-      </kendo-autocomplete>
+          @for (mapping of variableMappings(); track mapping.attributePath; let i = $index) {
+            <div class="grid-row">
+              <div class="col-name">
+                <kendo-textbox
+                  [value]="mapping.name"
+                  (valueChange)="onNameChange(i, $event)"
+                  [style.width.%]="100">
+                </kendo-textbox>
+                @if (getNameError(mapping.name, i); as error) {
+                  <span class="error-text">{{ error }}</span>
+                }
+              </div>
+              <div class="col-path">{{ mapping.attributePath }}</div>
+              <div class="col-type">{{ mapping.attributeValueType }}</div>
+              <div class="col-actions">
+                <button
+                  kendoButton
+                  (click)="removeMapping(i)"
+                  [svgIcon]="trashIcon"
+                  fillMode="flat"
+                  themeColor="error"
+                  title="Remove">
+                </button>
+              </div>
+            </div>
+          }
+        </div>
+      }
 
-      <button
-        kendoButton
-        type="button"
-        [svgIcon]="searchIcon"
-        [disabled]="disabled"
-        [title]="advancedSearchLabel"
-        class="dialog-button"
-        (click)="openDialog()">
-      </button>
+      <div class="dialog-actions">
+        <button kendoButton (click)="onCancel()" fillMode="outline">Cancel</button>
+        <button kendoButton (click)="onOk()" themeColor="primary" [disabled]="!isValid()">OK</button>
+      </div>
     </div>
-  `, styles: [":host{display:block;width:100%}.ck-type-select-wrapper{position:relative;display:flex;align-items:center;width:100%;gap:4px}.ck-type-select-wrapper.disabled{opacity:.6;pointer-events:none}.ck-type-autocomplete{flex:1;min-width:0}.dialog-button{flex-shrink:0;height:30px;width:30px;padding:0;display:flex;align-items:center;justify-content:center}.ck-type-item{padding:4px 0;white-space:nowrap;overflow:hidden;text-overflow:ellipsis}.no-data-message{padding:8px 12px;color:var(--kendo-color-subtle);font-style:italic;text-align:center}.advanced-search-footer{display:flex;align-items:center;gap:8px;padding:8px 12px;cursor:pointer;color:var(--kendo-color-primary);border-top:1px solid var(--kendo-color-border);background:var(--kendo-color-surface-alt);transition:background-color .2s}.advanced-search-footer:hover{background:var(--kendo-color-base-hover)}\n"] }]
-        }], propDecorators: { autocomplete: [{
-                type: ViewChild,
-                args: ['autocomplete', { static: true }]
-            }], placeholder: [{
-                type: Input
-            }], minSearchLength: [{
-                type: Input
-            }], maxResults: [{
-                type: Input
-            }], debounceMs: [{
-                type: Input
-            }], ckModelIds: [{
-                type: Input
-            }], allowAbstract: [{
-                type: Input
-            }], dialogTitle: [{
-                type: Input
-            }], advancedSearchLabel: [{
-                type: Input
-            }], derivedFromRtCkTypeId: [{
-                type: Input
-            }], disabled: [{
-                type: Input
-            }], required: [{
-                type: Input
-            }], ckTypeSelected: [{
-                type: Output
-            }], ckTypeCleared: [{
-                type: Output
-            }] } });
+  `, styles: [".dialog-content{display:flex;flex-direction:column;gap:16px;padding:16px 20px}.form-row{display:flex;flex-direction:column;gap:4px}.form-label{font-size:12px;font-weight:600;color:var(--kendo-color-subtle, #666)}.mappings-grid{border:1px solid var(--kendo-color-border, #e0e0e0);border-radius:4px;background:var(--kendo-color-surface-alt, #fafafa)}.grid-header{display:grid;grid-template-columns:1fr 1fr 100px 40px;gap:.5rem;padding:.5rem .75rem;background:var(--kendo-color-surface, #f5f5f5);border-bottom:1px solid var(--kendo-color-border, #e0e0e0);font-size:12px;font-weight:600;color:var(--kendo-color-subtle, #666)}.grid-row{display:grid;grid-template-columns:1fr 1fr 100px 40px;gap:.5rem;padding:.5rem .75rem;align-items:start;border-bottom:1px solid var(--kendo-color-border, #e0e0e0)}.grid-row:last-child{border-bottom:none}.col-name{display:flex;flex-direction:column;gap:2px}.col-path,.col-type{font-size:13px;padding-top:6px;color:var(--kendo-color-on-app-surface, #424242)}.col-actions{display:flex;justify-content:center;padding-top:2px}.error-text{font-size:11px;color:var(--kendo-color-error, #f44336)}.dialog-actions{display:flex;justify-content:flex-end;gap:8px;padding-top:8px;border-top:1px solid var(--kendo-color-border, #e0e0e0)}\n"] }]
+        }] });
+
+class RuntimeEntityVariableDialogService {
+    windowService = inject(WindowService);
+    windowStateService = inject(WindowStateService);
+    /**
+     * Opens the runtime entity variable dialog.
+     * @param data Optional pre-populated data for editing
+     * @returns Promise with confirmation status and dialog result
+     */
+    async openRuntimeEntityVariableDialog(data) {
+        const size = this.windowStateService.resolveWindowSize('runtime-entity-variable', { width: 800, height: 600 });
+        const windowRef = this.windowService.open({
+            content: RuntimeEntityVariableDialogComponent,
+            width: size.width,
+            height: size.height,
+            minWidth: 650,
+            minHeight: 500,
+            resizable: true,
+            title: 'Runtime Entity Variables'
+        });
+        this.windowStateService.applyModalBehavior('runtime-entity-variable', windowRef);
+        const contentRef = windowRef.content;
+        if (contentRef?.instance && data) {
+            contentRef.instance.data = data;
+        }
+        try {
+            const result = await firstValueFrom(windowRef.result);
+            if (result instanceof WindowCloseResult) {
+                return { confirmed: false };
+            }
+            if (result && typeof result === 'object' && 'variables' in result) {
+                return {
+                    confirmed: true,
+                    result: result
+                };
+            }
+            return { confirmed: false };
+        }
+        catch {
+            return { confirmed: false };
+        }
+    }
+    static ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: RuntimeEntityVariableDialogService, deps: [], target: i0.ɵɵFactoryTarget.Injectable });
+    static ɵprov = i0.ɵɵngDeclareInjectable({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: RuntimeEntityVariableDialogService, providedIn: 'root' });
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "21.2.0", ngImport: i0, type: RuntimeEntityVariableDialogService, decorators: [{
+            type: Injectable,
+            args: [{
+                    providedIn: 'root'
+                }]
+        }] });
+
+// noinspection JSUnusedGlobalSymbols
+class OctoGraphQlDataSource extends DataSourceTyped {
+    _searchFilterAttributePaths = [];
+    // noinspection JSUnusedGlobalSymbols
+    constructor(listViewComponent) {
+        super(listViewComponent);
+    }
+    get searchFilterAttributePaths() {
+        return this._searchFilterAttributePaths;
+    }
+    set searchFilterAttributePaths(value) {
+        this._searchFilterAttributePaths = value;
+    }
+    // noinspection JSUnusedGlobalSymbols
+    getFieldFilterDefinitions(state) {
+        let fieldFilters = null;
+        if (state.filter?.filters) {
+            fieldFilters = state.filter.filters.map((f) => {
+                if (isCompositeFilterDescriptor(f)) {
+                    throw new Error('Composite filter descriptor not supported');
+                }
+                const { operator, value } = OctoGraphQlDataSource.getOperatorAndValue(f.operator, f.value);
+                return {
+                    attributePath: f.field,
+                    operator: operator,
+                    comparisonValue: value
+                };
+            });
+        }
+        return fieldFilters;
+    }
+    // noinspection JSUnusedGlobalSymbols
+    getSearchFilterDefinitions(textSearchValue) {
+        let searchFilterDto = null;
+        if (textSearchValue) {
+            searchFilterDto = {
+                type: SearchFilterTypesDto.AttributeFilterDto,
+                attributePaths: this.searchFilterAttributePaths,
+                searchTerm: textSearchValue,
+            };
+        }
+        return searchFilterDto;
+    }
+    // noinspection JSUnusedGlobalSymbols
+    getSortDefinitions(state) {
+        let sort = null;
+        if (state.sort) {
+            sort = new Array();
+            state.sort.forEach((s) => {
+                switch (s.dir) {
+                    case 'asc':
+                        sort?.push({
+                            attributePath: s.field,
+                            sortOrder: SortOrdersDto.AscendingDto
+                        });
+                        break;
+                    case 'desc':
+                        sort?.push({
+                            attributePath: s.field,
+                            sortOrder: SortOrdersDto.DescendingDto,
+                        });
+                        break;
+                    default:
+                        sort?.push({
+                            attributePath: s.field,
+                            sortOrder: SortOrdersDto.DefaultDto,
+                        });
+                        break;
+                }
+            });
+        }
+        return sort;
+    }
+    static getOperatorAndValue(operator, value) {
+        switch (operator) {
+            case 'eq':
+                return { operator: FieldFilterOperatorsDto.EqualsDto, value: value };
+            case 'neq':
+                return { operator: FieldFilterOperatorsDto.NotEqualsDto, value: value };
+            case 'lt':
+                return { operator: FieldFilterOperatorsDto.LessThanDto, value: value };
+            case 'lte':
+                return { operator: FieldFilterOperatorsDto.LessEqualThanDto, value: value };
+            case 'gt':
+                return { operator: FieldFilterOperatorsDto.GreaterThanDto, value: value };
+            case 'gte':
+                return { operator: FieldFilterOperatorsDto.GreaterEqualThanDto, value: value };
+            case 'contains':
+                return { operator: FieldFilterOperatorsDto.LikeDto, value: value };
+            case 'doesnotcontain':
+                return { operator: FieldFilterOperatorsDto.MatchRegExDto, value: `^(?!.*${value}).*$` };
+            case 'startswith':
+                return { operator: FieldFilterOperatorsDto.MatchRegExDto, value: value + '.*' };
+            case 'endswith':
+                return { operator: FieldFilterOperatorsDto.MatchRegExDto, value: '.*' + value };
+            case 'isnull':
+                return { operator: FieldFilterOperatorsDto.EqualsDto, value: null };
+            case 'isnotnull':
+                return { operator: FieldFilterOperatorsDto.NotEqualsDto, value: null };
+            case 'isempty':
+                return { operator: FieldFilterOperatorsDto.EqualsDto, value: "" };
+            case 'isnotempty':
+                return { operator: FieldFilterOperatorsDto.NotEqualsDto, value: "" };
+            default:
+                throw new Error('The filter operator is not supported');
+        }
+    }
+}
+
+class OctoGraphQlHierarchyDataSource extends HierarchyDataSourceBase {
+}
 
 class FieldFilterEditorComponent {
     attributeService = inject(AttributeSelectorService, { optional: true });
@@ -4795,7 +5169,8 @@ function provideOctoUi() {
         provideMmSharedAuth(),
         AttributeSortSelectorDialogService,
         PropertyConverterService,
-        CkTypeSelectorDialogService
+        CkTypeSelectorDialogService,
+        RuntimeEntityVariableDialogService
     ]);
 }
 
@@ -4803,5 +5178,5 @@ function provideOctoUi() {
  * Generated bundle index. Do not edit.
  */
 
-export { AttributeSelectorDialogComponent, AttributeSelectorDialogService, AttributeSortSelectorDialogComponent, AttributeSortSelectorDialogService, AttributeValueTypeDto, CkTypeSelectorDialogComponent, CkTypeSelectorDialogService, CkTypeSelectorInputComponent, DefaultPropertyCategory, EntityIdInfoComponent, FieldFilterEditorComponent, OctoGraphQlDataSource, OctoGraphQlHierarchyDataSource, OctoLoaderComponent, PropertyConverterService, PropertyDisplayMode, PropertyGridComponent, PropertyValueDisplayComponent, provideOctoUi };
+export { AttributeSelectorDialogComponent, AttributeSelectorDialogService, AttributeSortSelectorDialogComponent, AttributeSortSelectorDialogService, AttributeValueTypeDto, CkTypeSelectorDialogComponent, CkTypeSelectorDialogService, CkTypeSelectorInputComponent, DefaultPropertyCategory, EntityIdInfoComponent, FieldFilterEditorComponent, OctoGraphQlDataSource, OctoGraphQlHierarchyDataSource, OctoLoaderComponent, PropertyConverterService, PropertyDisplayMode, PropertyGridComponent, PropertyValueDisplayComponent, RuntimeEntityVariableDialogComponent, RuntimeEntityVariableDialogService, provideOctoUi };
 //# sourceMappingURL=meshmakers-octo-ui.mjs.map