imm-element-ui 2.6.2 → 2.6.4

package/fesm2022/imm-element-ui.mjs

@@ -2825,7 +2825,6 @@ class TreeSelectComponent {
 		(onNodeSelect)="props.onNodeSelect?.(field()!, $event)"
 		(onNodeUnselect)="props.onNodeUnselect?.(field()!, $event)"
 		[class]="props.class"
-		[disabled]="true"
 		[formControl]="field()!.fieldControl!" />`, isInline: true, styles: [":host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:1}:host ::ng-deep .p-inputtext{border-width:0;border-radius:0;box-shadow:none;background:#fff;padding:0}:host ::ng-deep .p-inputtext:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputtext:not(:disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:not(:disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered .p-autocomplete-input:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-label{padding:0}:host ::ng-deep .p-select{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-select .p-select-dropdown{display:none}:host ::ng-deep .p-select .p-select-clear-icon{display:none}:host ::ng-deep .p-select:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-select-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-open .p-select-dropdown{display:flex}:host ::ng-deep .p-select-open .p-select-clear-icon{display:flex}:host ::ng-deep .p-select:hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select:hover .p-select-dropdown{display:flex}:host ::ng-deep .p-select:hover .p-select-clear-icon{display:flex}:host ::ng-deep .p-select.ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select.ng-hovered .p-select-dropdown{display:flex}:host ::ng-deep .p-select.ng-hovered .p-select-clear-icon{display:flex}:host ::ng-deep .p-multiselect-label{padding:0}:host ::ng-deep .p-multiselect{border-width:0;border-radius:0;background:#fff;box-shadow:none}:host ::ng-deep .p-multiselect .p-multiselect-dropdown{display:none}:host ::ng-deep .p-multiselect:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-multiselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect-open .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled):hover .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-textarea{border-radius:0;box-shadow:none;padding:0 .25rem;background:#fff;resize:none}:host ::ng-deep .p-textarea:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border:1px solid var(--p-red-500)!important}:host ::ng-deep .p-textarea:not(:disabled):hover{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:not(:disabled).ng-hovered{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:focus{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-treeselect-label{padding:0}:host ::ng-deep .p-treeselect{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-treeselect .p-treeselect-dropdown{display:none}:host ::ng-deep .ng-invalid.ng-dirty>.p-treeselect{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-treeselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect-open .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled):hover .p-treeselect-dropdown{display:flex}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled) .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-menubar{border-width:0;padding:0}:host ::ng-deep .p-menubar-submenu{z-index:3}:host ::ng-deep .p-fileupload-advanced{border-width:0;border-radius:0;background-color:#fff}:host ::ng-deep .p-fileupload-header{padding:0}:host ::ng-deep .p-fileupload-content{padding:0;display:block;border-width:0}:host ::ng-deep .p-inputnumber:not(.ng-valid).ng-dirty>.p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputnumber.ng-hovered:not(.p-disabled)>.p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-invalid.ng-dirty>.p-datepicker .p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .ng-hovered>.p-datepicker:not(.p-disabled) .p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor{border:1px solid #cbd5e1}:host ::ng-deep .cm-editor.cm-focused{outline:none!important;border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor:hover{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor.ng-hovered{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-gutters{background-color:#fff;border:\"none\"}:host ::ng-deep .cm-activeLineGutter{background-color:#fff}\n"], dependencies: [{ kind: "component", type: TreeSelect, selector: "p-treeSelect, p-treeselect, p-tree-select", inputs: ["inputId", "scrollHeight", "disabled", "metaKeySelection", "variant", "display", "selectionMode", "tabindex", "ariaLabel", "ariaLabelledBy", "placeholder", "panelClass", "panelStyle", "fluid", "panelStyleClass", "containerStyle", "containerStyleClass", "labelStyle", "labelStyleClass", "overlayOptions", "emptyMessage", "appendTo", "filter", "filterBy", "filterMode", "filterPlaceholder", "filterLocale", "filterInputAutoFocus", "propagateSelectionDown", "propagateSelectionUp", "showClear", "resetFilterOnHide", "virtualScroll", "virtualScrollItemSize", "size", "virtualScrollOptions", "autofocus", "options", "showTransitionOptions", "hideTransitionOptions", "loading"], outputs: ["onNodeExpand", "onNodeCollapse", "onShow", "onHide", "onClear", "onFilter", "onFocus", "onBlur", "onNodeUnselect", "onNodeSelect"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.FormControlDirective, selector: "[formControl]", inputs: ["formControl", "disabled", "ngModel"], outputs: ["ngModelChange"], exportAs: ["ngForm"] }] }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: TreeSelectComponent, decorators: [{
@@ -2886,7 +2885,6 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 		(onNodeSelect)="props.onNodeSelect?.(field()!, $event)"
 		(onNodeUnselect)="props.onNodeUnselect?.(field()!, $event)"
 		[class]="props.class"
-		[disabled]="true"
 		[formControl]="field()!.fieldControl!" />`, styles: [":host ::ng-deep .p-disabled,:host ::ng-deep .p-component:disabled{opacity:1}:host ::ng-deep .p-inputtext{border-width:0;border-radius:0;box-shadow:none;background:#fff;padding:0}:host ::ng-deep .p-inputtext:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputtext:not(:disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:not(:disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-inputtext:focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered .p-autocomplete-input:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-label{padding:0}:host ::ng-deep .p-select{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-select .p-select-dropdown{display:none}:host ::ng-deep .p-select .p-select-clear-icon{display:none}:host ::ng-deep .p-select:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-select-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select-open .p-select-dropdown{display:flex}:host ::ng-deep .p-select-open .p-select-clear-icon{display:flex}:host ::ng-deep .p-select:hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select:hover .p-select-dropdown{display:flex}:host ::ng-deep .p-select:hover .p-select-clear-icon{display:flex}:host ::ng-deep .p-select.ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-select.ng-hovered .p-select-dropdown{display:flex}:host ::ng-deep .p-select.ng-hovered .p-select-clear-icon{display:flex}:host ::ng-deep .p-multiselect-label{padding:0}:host ::ng-deep .p-multiselect{border-width:0;border-radius:0;background:#fff;box-shadow:none}:host ::ng-deep .p-multiselect .p-multiselect-dropdown{display:none}:host ::ng-deep .p-multiselect:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-multiselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect-open .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).p-focus .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled):hover .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-multiselect:not(.p-disabled).ng-hovered .p-multiselect-dropdown{display:flex}:host ::ng-deep .p-textarea{border-radius:0;box-shadow:none;padding:0 .25rem;background:#fff;resize:none}:host ::ng-deep .p-textarea:not(.ng-valid).ng-dirty{background:var(--p-red-200)!important;border:1px solid var(--p-red-500)!important}:host ::ng-deep .p-textarea:not(:disabled):hover{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:not(:disabled).ng-hovered{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-textarea:focus{border:1px solid var(--p-primary-color);resize:vertical}:host ::ng-deep .p-treeselect-label{padding:0}:host ::ng-deep .p-treeselect{border-width:0;border-radius:0;box-shadow:none;background:#fff}:host ::ng-deep .p-treeselect .p-treeselect-dropdown{display:none}:host ::ng-deep .ng-invalid.ng-dirty>.p-treeselect{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-treeselect-open{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect-open .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled).p-focus .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-treeselect:not(.p-disabled):hover{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .p-treeselect:not(.p-disabled):hover .p-treeselect-dropdown{display:flex}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled){border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-hovered>.p-treeselect:not(.p-disabled) .p-treeselect-dropdown{display:flex}:host ::ng-deep .p-menubar{border-width:0;padding:0}:host ::ng-deep .p-menubar-submenu{z-index:3}:host ::ng-deep .p-fileupload-advanced{border-width:0;border-radius:0;background-color:#fff}:host ::ng-deep .p-fileupload-header{padding:0}:host ::ng-deep .p-fileupload-content{padding:0;display:block;border-width:0}:host ::ng-deep .p-inputnumber:not(.ng-valid).ng-dirty>.p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .p-inputnumber.ng-hovered:not(.p-disabled)>.p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .ng-invalid.ng-dirty>.p-datepicker .p-inputtext{background:var(--p-red-200)!important;border-bottom:1px solid var(--p-red-500)!important}:host ::ng-deep .ng-hovered>.p-datepicker:not(.p-disabled) .p-inputtext{border-bottom:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor{border:1px solid #cbd5e1}:host ::ng-deep .cm-editor.cm-focused{outline:none!important;border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor:hover{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-editor.ng-hovered{border:1px solid var(--p-primary-color)}:host ::ng-deep .cm-gutters{background-color:#fff;border:\"none\"}:host ::ng-deep .cm-activeLineGutter{background-color:#fff}\n"] }]
         }], ctorParameters: () => [{ type: ActionService }, { type: i0.Renderer2 }], propDecorators: { treeselect: [{
                 type: ViewChild,
@@ -5503,6 +5501,455 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
                 args: ['input', { read: ViewContainerRef }]
             }] } });
 
+const optionsCache = new Map();
+const resolveAsyncSelectOptions = async (params, context) => {
+    const cache = params.cache !== false;
+    const cacheKey = resolveCacheKey(params, context);
+    if (cache && params.clearCache) {
+        optionsCache.delete(cacheKey);
+    }
+    if (cache && optionsCache.has(cacheKey)) {
+        return optionsCache.get(cacheKey);
+    }
+    const promise = loadOptions(params, context).catch((error) => {
+        if (cache) {
+            optionsCache.delete(cacheKey);
+        }
+        throw error;
+    });
+    if (cache) {
+        optionsCache.set(cacheKey, promise);
+    }
+    return promise;
+};
+const clearAsyncSelectOptionsCache = (cacheKey) => {
+    if (cacheKey === undefined) {
+        optionsCache.clear();
+        return;
+    }
+    optionsCache.delete(cacheKey);
+};
+const loadOptions = async (params, context) => {
+    const source = resolveOptionsSource(params, context);
+    let options = normalizeOptions(await unwrapOptions(source));
+    console.log('options----', options);
+    if (params.filterOptions && typeof params.filterOptions === 'function') {
+        options = params.filterOptions(options, context) || options;
+    }
+    return options;
+};
+const resolveOptionsSource = (params, context) => {
+    if (typeof params.getOptions === 'function') {
+        return params.getOptions(context);
+    }
+    if (typeof params.optionsHook === 'function') {
+        return params.optionsHook(context);
+    }
+    return params.rawOptions || params.options || [];
+};
+const unwrapOptions = async (source) => {
+    console.log('source----', source);
+    if (isObservable(source)) {
+        return firstValueFrom(source);
+    }
+    if (source && typeof source.then === 'function') {
+        return source;
+    }
+    return source;
+};
+const normalizeOptions = (res) => {
+    if (Array.isArray(res)) {
+        return res;
+    }
+    if (Array.isArray(res?.data)) {
+        return res.data;
+    }
+    return [];
+};
+const resolveCacheKey = (params, context) => {
+    if (typeof params.cacheKey === 'function') {
+        return String(params.cacheKey(context));
+    }
+    if (params.cacheKey !== undefined && params.cacheKey !== null) {
+        return String(params.cacheKey);
+    }
+    return [
+        context.field || context.colDef?.field || '',
+        params.optionValue || 'value',
+        params.optionLabel || 'label',
+        params.multiple ? 'multiple' : 'single',
+    ].join('|');
+};
+
+class CellEditAsyncSelectFieldComponent {
+    async agInit(params) {
+        this.params = params;
+        this.params.optionLabel = this.params.optionLabel || 'label';
+        this.params.optionValue = this.params.optionValue || 'value';
+        const rowValue = this.params.data?.[this.params.colDef.field];
+        this.value = this.params.multiple ? this.toValueArray(params.value ?? rowValue) : (params.value ?? rowValue);
+        this.setEditorSize(params);
+        await this.loadOptions();
+    }
+    getValue() {
+        if (this.params.multiple) {
+            return this.toValueString(this.value);
+        }
+        const value = this.value;
+        return value === '' || value == null ? null : value;
+    }
+    onChange(event) {
+        const nameFields = this.params.nameFields || [];
+        nameFields.forEach((nameField) => {
+            this.updateNameField(nameField, event);
+        });
+    }
+    async loadOptions() {
+        const context = this.createContext();
+        try {
+            this.params.loading = true;
+            this.params.options = await resolveAsyncSelectOptions(this.params, context);
+        }
+        finally {
+            this.params.loading = false;
+        }
+    }
+    createContext() {
+        return {
+            data: this.params.data,
+            value: this.params.multiple ? this.toValueString(this.value) : this.value,
+            params: this.params,
+            field: this.params.colDef.field,
+            colDef: this.params.colDef,
+            rowIndex: this.params.node?.rowIndex,
+        };
+    }
+    setEditorSize(params) {
+        const cellWidth = params.column.getActualWidth();
+        this.params.style = {
+            border: 'none',
+            boxShadow: 'none',
+            width: `${cellWidth}px`,
+            background: 'var(--ag-background-color)',
+            height: '40px',
+            alignItems: 'center',
+            ...(this.params.style || {}),
+        };
+        this.params.panelStyle = {
+            width: `${cellWidth}px`,
+            ...(this.params.panelStyle || {}),
+        };
+    }
+    updateNameField(nameField, event) {
+        const oldValue = this.params.data[nameField.field];
+        const newValue = this.resolveNameFieldValue(nameField, event.value);
+        const grid = this.params.grid();
+        const e = {
+            colDef: nameField,
+            oldValue,
+            newValue,
+            rowIndex: this.params.node.rowIndex,
+            data: { id: this.params.data.id },
+        };
+        grid.cellValueChanged(e);
+        this.params.data[nameField.field] = newValue;
+    }
+    resolveNameFieldValue(nameField, value) {
+        const valueField = this.params.optionValue || 'value';
+        if (this.params.multiple) {
+            const values = this.toValueArray(value);
+            return (this.params.options || [])
+                .filter((op) => values.some((selectedValue) => selectedValue == op?.[valueField]))
+                .map((op) => op?.[nameField.key])
+                .filter((item) => item !== undefined && item !== null && item !== '')
+                .join(',');
+        }
+        const item = (this.params.options || []).find((op) => op?.[valueField] === value);
+        return item ? item[nameField.key] : null;
+    }
+    toValueArray(value) {
+        if (Array.isArray(value)) {
+            return value;
+        }
+        if (value === '' || value == null) {
+            return [];
+        }
+        return String(value).split(',').filter((item) => item !== '');
+    }
+    toValueString(value) {
+        if (Array.isArray(value)) {
+            return value.filter((item) => item !== '' && item != null).join(',');
+        }
+        if (value === '' || value == null) {
+            return '';
+        }
+        return String(value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CellEditAsyncSelectFieldComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "18.2.13", type: CellEditAsyncSelectFieldComponent, isStandalone: true, selector: "ng-component", viewQueries: [{ propertyName: "input", first: true, predicate: ["input"], descendants: true, read: ViewContainerRef }], ngImport: i0, template: `
+		@if (params.multiple) {
+			<p-multiselect
+				[(ngModel)]="value"
+				[scrollHeight]="params.scrollHeight || '200px'"
+				[filter]="params.filter"
+				[name]="params.name"
+				[options]="params.options"
+				[placeholder]="params.placeholder"
+				[class]="params.class"
+				[style]="params.style"
+				[panelStyle]="params.panelStyle"
+				[panelStyleClass]="params.panelStyleClass"
+				[readonly]="params.readonly"
+				[appendTo]="params.appendTo || 'body'"
+				[tabindex]="params.tabindex"
+				[loadingIcon]="params.loadingIcon"
+				[filterPlaceHolder]="params.filterPlaceHolder || params.filterPlaceholder"
+				[filterLocale]="params.filterLocale"
+				[variant]="params.variant"
+				[inputId]="params.inputId"
+				[dataKey]="params.dataKey"
+				[filterBy]="params.filterBy"
+				[filterFields]="params.filterFields"
+				[autofocus]="params.autofocus ?? true"
+				[resetFilterOnHide]="params.resetFilterOnHide"
+				[dropdownIcon]="params.dropdownIcon"
+				[loading]="params.loading"
+				[optionLabel]="params.optionLabel"
+				[optionValue]="params.optionValue"
+				[optionDisabled]="params.optionDisabled"
+				[optionGroupLabel]="params.optionGroupLabel"
+				[optionGroupChildren]="params.optionGroupChildren || 'items'"
+				[group]="params.group"
+				[showClear]="params.showClear"
+				[emptyFilterMessage]="params.emptyFilterMessage"
+				[emptyMessage]="params.emptyMessage"
+				[lazy]="params.lazy"
+				[virtualScroll]="params.virtualScroll"
+				[virtualScrollItemSize]="params.virtualScrollItemSize"
+				[virtualScrollOptions]="params.virtualScrollOptions"
+				[overlayOptions]="params.overlayOptions"
+				[size]="params.size"
+				[ariaFilterLabel]="params.ariaFilterLabel"
+				[ariaLabel]="params.ariaLabel"
+				[ariaLabelledBy]="params.ariaLabelledBy"
+				[filterMatchMode]="params.filterMatchMode"
+				[maxlength]="params.maxlength"
+				[tooltip]="params.tooltip"
+				[tooltipPosition]="params.tooltipPosition || 'right'"
+				[tooltipPositionStyle]="params.tooltipPositionStyle || 'absolute'"
+				[tooltipStyleClass]="params.tooltipStyleClass"
+				[focusOnHover]="params.focusOnHover == undefined ? true : params.focusOnHover"
+				[fluid]="params.fluid == undefined ? true : params.fluid"
+				[filterValue]="params.filterValue"
+				[display]="params.display ?? 'comma'"
+				[displaySelectedLabel]="params.displaySelectedLabel ?? true"
+				[maxSelectedLabels]="params.maxSelectedLabels"
+				[selectionLimit]="params.selectionLimit"
+				[selectedItemsLabel]="params.selectedItemsLabel"
+				[showToggleAll]="params.showToggleAll ?? true"
+				[showHeader]="params.showHeader ?? true"
+				[autofocusFilter]="params.autofocusFilter"
+				[selectAll]="params.selectAll ?? null"
+				[selectOnFocus]="params.selectOnFocus"
+				[autoOptionFocus]="params.autoOptionFocus"
+				(onChange)="onChange($event)" />
+		} @else {
+			<p-select
+				[(ngModel)]="value"
+				[scrollHeight]="params.scrollHeight || '200px'"
+				[filter]="params.filter"
+				[name]="params.name"
+				[options]="params.options"
+				[placeholder]="params.placeholder"
+				[class]="params.class"
+				[style]="params.style"
+				[panelStyle]="params.panelStyle"
+				[panelStyleClass]="params.panelStyleClass"
+				[readonly]="params.readonly"
+				[editable]="params.editable"
+				[appendTo]="params.appendTo || 'body'"
+				[tabindex]="params.tabindex"
+				[loadingIcon]="params.loadingIcon"
+				[filterPlaceholder]="params.filterPlaceholder"
+				[filterLocale]="params.filterLocale"
+				[variant]="params.variant"
+				[inputId]="params.inputId"
+				[dataKey]="params.dataKey"
+				[filterBy]="params.filterBy"
+				[filterFields]="params.filterFields"
+				[autofocus]="params.autofocus ?? true"
+				[resetFilterOnHide]="params.resetFilterOnHide"
+				[checkmark]="params.checkmark"
+				[dropdownIcon]="params.dropdownIcon"
+				[loading]="params.loading"
+				[optionLabel]="params.optionLabel"
+				[optionValue]="params.optionValue"
+				[optionDisabled]="params.optionDisabled"
+				[optionGroupLabel]="params.optionGroupLabel"
+				[optionGroupChildren]="params.optionGroupChildren || 'items'"
+				[group]="params.group"
+				[showClear]="params.showClear"
+				[emptyFilterMessage]="params.emptyFilterMessage"
+				[emptyMessage]="params.emptyMessage"
+				[lazy]="params.lazy"
+				[virtualScroll]="params.virtualScroll"
+				[virtualScrollItemSize]="params.virtualScrollItemSize"
+				[virtualScrollOptions]="params.virtualScrollOptions"
+				[overlayOptions]="params.overlayOptions"
+				[size]="params.size"
+				[ariaFilterLabel]="params.ariaFilterLabel"
+				[ariaLabel]="params.ariaLabel"
+				[ariaLabelledBy]="params.ariaLabelledBy"
+				[filterMatchMode]="params.filterMatchMode"
+				[maxlength]="params.maxlength"
+				[tooltip]="params.tooltip"
+				[tooltipPosition]="params.tooltipPosition || 'right'"
+				[tooltipPositionStyle]="params.tooltipPositionStyle || 'absolute'"
+				[tooltipStyleClass]="params.tooltipStyleClass"
+				[focusOnHover]="params.focusOnHover == undefined ? true : params.focusOnHover"
+				[fluid]="params.fluid == undefined ? true : params.fluid"
+				[filterValue]="params.filterValue"
+				(onChange)="onChange($event)" />
+		}
+	`, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i3$1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i3$1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i3$1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ReactiveFormsModule }, { kind: "ngmodule", type: SelectModule }, { kind: "component", type: i2$6.Select, selector: "p-select", inputs: ["id", "scrollHeight", "filter", "name", "style", "panelStyle", "styleClass", "panelStyleClass", "readonly", "required", "editable", "appendTo", "tabindex", "placeholder", "loadingIcon", "filterPlaceholder", "filterLocale", "variant", "inputId", "dataKey", "filterBy", "filterFields", "autofocus", "resetFilterOnHide", "checkmark", "dropdownIcon", "loading", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "autoDisplayFirst", "group", "showClear", "emptyFilterMessage", "emptyMessage", "lazy", "virtualScroll", "virtualScrollItemSize", "virtualScrollOptions", "size", "overlayOptions", "ariaFilterLabel", "ariaLabel", "ariaLabelledBy", "filterMatchMode", "maxlength", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "focusOnHover", "selectOnFocus", "autoOptionFocus", "autofocusFilter", "fluid", "disabled", "itemSize", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "filterValue", "options"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onShow", "onHide", "onClear", "onLazyLoad"] }, { kind: "component", type: MultiSelect, selector: "p-multiSelect, p-multiselect, p-multi-select", inputs: ["id", "ariaLabel", "style", "styleClass", "panelStyle", "panelStyleClass", "inputId", "disabled", "fluid", "readonly", "group", "filter", "filterPlaceHolder", "filterLocale", "overlayVisible", "tabindex", "variant", "appendTo", "dataKey", "name", "ariaLabelledBy", "displaySelectedLabel", "maxSelectedLabels", "selectionLimit", "selectedItemsLabel", "showToggleAll", "emptyFilterMessage", "emptyMessage", "resetFilterOnHide", "dropdownIcon", "chipIcon", "optionLabel", "optionValue", "optionDisabled", "optionGroupLabel", "optionGroupChildren", "showHeader", "filterBy", "scrollHeight", "lazy", "virtualScroll", "loading", "virtualScrollItemSize", "loadingIcon", "virtualScrollOptions", "overlayOptions", "ariaFilterLabel", "filterMatchMode", "tooltip", "tooltipPosition", "tooltipPositionStyle", "tooltipStyleClass", "autofocusFilter", "display", "autocomplete", "size", "showClear", "autofocus", "autoZIndex", "baseZIndex", "showTransitionOptions", "hideTransitionOptions", "defaultLabel", "placeholder", "options", "filterValue", "itemSize", "selectAll", "focusOnHover", "filterFields", "selectOnFocus", "autoOptionFocus"], outputs: ["onChange", "onFilter", "onFocus", "onBlur", "onClick", "onClear", "onPanelShow", "onPanelHide", "onLazyLoad", "onRemove", "onSelectAllChange"] }] }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: CellEditAsyncSelectFieldComponent, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    template: `
+		@if (params.multiple) {
+			<p-multiselect
+				[(ngModel)]="value"
+				[scrollHeight]="params.scrollHeight || '200px'"
+				[filter]="params.filter"
+				[name]="params.name"
+				[options]="params.options"
+				[placeholder]="params.placeholder"
+				[class]="params.class"
+				[style]="params.style"
+				[panelStyle]="params.panelStyle"
+				[panelStyleClass]="params.panelStyleClass"
+				[readonly]="params.readonly"
+				[appendTo]="params.appendTo || 'body'"
+				[tabindex]="params.tabindex"
+				[loadingIcon]="params.loadingIcon"
+				[filterPlaceHolder]="params.filterPlaceHolder || params.filterPlaceholder"
+				[filterLocale]="params.filterLocale"
+				[variant]="params.variant"
+				[inputId]="params.inputId"
+				[dataKey]="params.dataKey"
+				[filterBy]="params.filterBy"
+				[filterFields]="params.filterFields"
+				[autofocus]="params.autofocus ?? true"
+				[resetFilterOnHide]="params.resetFilterOnHide"
+				[dropdownIcon]="params.dropdownIcon"
+				[loading]="params.loading"
+				[optionLabel]="params.optionLabel"
+				[optionValue]="params.optionValue"
+				[optionDisabled]="params.optionDisabled"
+				[optionGroupLabel]="params.optionGroupLabel"
+				[optionGroupChildren]="params.optionGroupChildren || 'items'"
+				[group]="params.group"
+				[showClear]="params.showClear"
+				[emptyFilterMessage]="params.emptyFilterMessage"
+				[emptyMessage]="params.emptyMessage"
+				[lazy]="params.lazy"
+				[virtualScroll]="params.virtualScroll"
+				[virtualScrollItemSize]="params.virtualScrollItemSize"
+				[virtualScrollOptions]="params.virtualScrollOptions"
+				[overlayOptions]="params.overlayOptions"
+				[size]="params.size"
+				[ariaFilterLabel]="params.ariaFilterLabel"
+				[ariaLabel]="params.ariaLabel"
+				[ariaLabelledBy]="params.ariaLabelledBy"
+				[filterMatchMode]="params.filterMatchMode"
+				[maxlength]="params.maxlength"
+				[tooltip]="params.tooltip"
+				[tooltipPosition]="params.tooltipPosition || 'right'"
+				[tooltipPositionStyle]="params.tooltipPositionStyle || 'absolute'"
+				[tooltipStyleClass]="params.tooltipStyleClass"
+				[focusOnHover]="params.focusOnHover == undefined ? true : params.focusOnHover"
+				[fluid]="params.fluid == undefined ? true : params.fluid"
+				[filterValue]="params.filterValue"
+				[display]="params.display ?? 'comma'"
+				[displaySelectedLabel]="params.displaySelectedLabel ?? true"
+				[maxSelectedLabels]="params.maxSelectedLabels"
+				[selectionLimit]="params.selectionLimit"
+				[selectedItemsLabel]="params.selectedItemsLabel"
+				[showToggleAll]="params.showToggleAll ?? true"
+				[showHeader]="params.showHeader ?? true"
+				[autofocusFilter]="params.autofocusFilter"
+				[selectAll]="params.selectAll ?? null"
+				[selectOnFocus]="params.selectOnFocus"
+				[autoOptionFocus]="params.autoOptionFocus"
+				(onChange)="onChange($event)" />
+		} @else {
+			<p-select
+				[(ngModel)]="value"
+				[scrollHeight]="params.scrollHeight || '200px'"
+				[filter]="params.filter"
+				[name]="params.name"
+				[options]="params.options"
+				[placeholder]="params.placeholder"
+				[class]="params.class"
+				[style]="params.style"
+				[panelStyle]="params.panelStyle"
+				[panelStyleClass]="params.panelStyleClass"
+				[readonly]="params.readonly"
+				[editable]="params.editable"
+				[appendTo]="params.appendTo || 'body'"
+				[tabindex]="params.tabindex"
+				[loadingIcon]="params.loadingIcon"
+				[filterPlaceholder]="params.filterPlaceholder"
+				[filterLocale]="params.filterLocale"
+				[variant]="params.variant"
+				[inputId]="params.inputId"
+				[dataKey]="params.dataKey"
+				[filterBy]="params.filterBy"
+				[filterFields]="params.filterFields"
+				[autofocus]="params.autofocus ?? true"
+				[resetFilterOnHide]="params.resetFilterOnHide"
+				[checkmark]="params.checkmark"
+				[dropdownIcon]="params.dropdownIcon"
+				[loading]="params.loading"
+				[optionLabel]="params.optionLabel"
+				[optionValue]="params.optionValue"
+				[optionDisabled]="params.optionDisabled"
+				[optionGroupLabel]="params.optionGroupLabel"
+				[optionGroupChildren]="params.optionGroupChildren || 'items'"
+				[group]="params.group"
+				[showClear]="params.showClear"
+				[emptyFilterMessage]="params.emptyFilterMessage"
+				[emptyMessage]="params.emptyMessage"
+				[lazy]="params.lazy"
+				[virtualScroll]="params.virtualScroll"
+				[virtualScrollItemSize]="params.virtualScrollItemSize"
+				[virtualScrollOptions]="params.virtualScrollOptions"
+				[overlayOptions]="params.overlayOptions"
+				[size]="params.size"
+				[ariaFilterLabel]="params.ariaFilterLabel"
+				[ariaLabel]="params.ariaLabel"
+				[ariaLabelledBy]="params.ariaLabelledBy"
+				[filterMatchMode]="params.filterMatchMode"
+				[maxlength]="params.maxlength"
+				[tooltip]="params.tooltip"
+				[tooltipPosition]="params.tooltipPosition || 'right'"
+				[tooltipPositionStyle]="params.tooltipPositionStyle || 'absolute'"
+				[tooltipStyleClass]="params.tooltipStyleClass"
+				[focusOnHover]="params.focusOnHover == undefined ? true : params.focusOnHover"
+				[fluid]="params.fluid == undefined ? true : params.fluid"
+				[filterValue]="params.filterValue"
+				(onChange)="onChange($event)" />
+		}
+	`,
+                    imports: [FormsModule, ReactiveFormsModule, SelectModule, MultiSelect],
+                }]
+        }], propDecorators: { input: [{
+                type: ViewChild,
+                args: ['input', { read: ViewContainerRef }]
+            }] } });
+
 class CellEditAutoCompleteComponent {
     agInit(params) {
         this.params = params;
@@ -6188,6 +6635,103 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
 		>`, styles: [".cell-link{color:var(--p-primary-color);cursor:pointer}\n"] }]
         }] });
 
+class AsyncSelectLabelRenderer {
+    constructor() {
+        this.label = '';
+        this.loadId = 0;
+    }
+    agInit(params) {
+        this.refresh(params);
+    }
+    refresh(params) {
+        this.params = this.mergeParams(params);
+        void this.loadLabel();
+        return true;
+    }
+    async loadLabel() {
+        const loadId = ++this.loadId;
+        const value = this.params.value ?? this.params.data?.[this.params.colDef.field];
+        if (value === '' || value == null) {
+            this.label = '';
+            return;
+        }
+        const context = this.createContext(value);
+        try {
+            const options = await resolveAsyncSelectOptions(this.params, context);
+            if (loadId !== this.loadId) {
+                return;
+            }
+            this.label = this.formatLabel(value, options);
+        }
+        catch {
+            if (loadId === this.loadId) {
+                this.label = String(value);
+            }
+        }
+    }
+    mergeParams(params) {
+        const cellEditorParams = params.colDef?.cellEditorParams || {};
+        return {
+            ...cellEditorParams,
+            ...params,
+            optionLabel: params.optionLabel || cellEditorParams.optionLabel || 'label',
+            optionValue: params.optionValue || cellEditorParams.optionValue || 'value',
+            multiple: params.multiple ?? cellEditorParams.multiple,
+        };
+    }
+    createContext(value) {
+        return {
+            data: this.params.data,
+            value: this.params.multiple ? this.toValueString(value) : value,
+            params: this.params,
+            field: this.params.colDef.field,
+            colDef: this.params.colDef,
+            rowIndex: this.params.node?.rowIndex,
+        };
+    }
+    formatLabel(value, options) {
+        const valueField = this.params.optionValue || 'value';
+        const labelField = this.params.optionLabel || 'label';
+        if (this.params.multiple) {
+            const values = this.toValueArray(value);
+            const labels = values.map((item) => {
+                const option = options.find((opt) => opt?.[valueField] == item);
+                return option ? option?.[labelField] : item;
+            });
+            return labels.filter((item) => item !== undefined && item !== null && item !== '').join(',');
+        }
+        const option = options.find((opt) => opt?.[valueField] == value);
+        return option ? option?.[labelField] : String(value);
+    }
+    toValueArray(value) {
+        if (Array.isArray(value)) {
+            return value;
+        }
+        if (value === '' || value == null) {
+            return [];
+        }
+        return String(value).split(',').filter((item) => item !== '');
+    }
+    toValueString(value) {
+        if (Array.isArray(value)) {
+            return value.filter((item) => item !== '' && item != null).join(',');
+        }
+        if (value === '' || value == null) {
+            return '';
+        }
+        return String(value);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AsyncSelectLabelRenderer, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "18.2.13", type: AsyncSelectLabelRenderer, isStandalone: true, selector: "ng-component", ngImport: i0, template: `{{ label }}`, isInline: true }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImport: i0, type: AsyncSelectLabelRenderer, decorators: [{
+            type: Component,
+            args: [{
+                    standalone: true,
+                    template: `{{ label }}`,
+                }]
+        }] });
+
 // rowModelType 使用clientSide的最大值
 const CLIENTLIMIT = 9999;
 const components = {
@@ -6202,8 +6746,10 @@ const components = {
     cellEditInputDateComponent: CellEditInputDateComponent,
     rowSpanRenderer: RowSpanRenderer,
     cellEditSelectFieldComponent: CellEditSelectFieldComponent,
+    cellEditAsyncSelectFieldComponent: CellEditAsyncSelectFieldComponent,
     primeActionsRenderer: PrimeActionsRenderer,
-    asyncLinkRenderer: AsyncLinkRenderer
+    asyncLinkRenderer: AsyncLinkRenderer,
+    asyncSelectLabelRenderer: AsyncSelectLabelRenderer
 };
 
 const defaultOption = {
@@ -11534,5 +12080,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "18.2.13", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { ActionService, ActionsComponent, AmComponent, AsyncRenderer, CellEditAutoCompleteComponent, CellEditDatePickerComponent, CellEditInputDateComponent, CellEditInputNumberCompoent, CellEditInputTextCompoent, CellEditSelectComponent, CellEditSelectFieldComponent, CodeMirrorComponent, CrumbActionComponent, FieldControl, FormComponent, FormFieldComponent, FormTypeComponent, GridComponent, HeadComponent, HrefBtnListComponent, I18N_Token, I18nService, ImportComponent, LANGS, LinkRenderer, LoadingComponent, LoadingService, LogComponent, PageActionService, PageFormComponent, PageFormService, PageFormSlotDirective, PageGridListComponent, PagerComponent, PopActionService, RowSelectorComponent$1 as RowSelectorComponent, SearchComponent, SingleSelectListboxComponent, StepsComponent, ThemeConfigComponent, ThemeConfigService, UserHistoryService, calcRowSpan, changeContent, clearLocal, compileTsToJs, convertAct, convertCol, convertForm, convertGrid, createCircularIterator, deepClone, executeRuntimeContextInit, filterObjectByKeys, formTypeToProps, generateUniqueId, getFilterMatchMode, gridOptionsHooker, gridUtils, isJSONParsable, pageListGridOptions, parseFunctions, toPascalCase, wrapHeaderValueGetter };
+export { ActionService, ActionsComponent, AmComponent, AsyncRenderer, AsyncSelectLabelRenderer, CellEditAsyncSelectFieldComponent, CellEditAutoCompleteComponent, CellEditDatePickerComponent, CellEditInputDateComponent, CellEditInputNumberCompoent, CellEditInputTextCompoent, CellEditSelectComponent, CellEditSelectFieldComponent, CodeMirrorComponent, CrumbActionComponent, FieldControl, FormComponent, FormFieldComponent, FormTypeComponent, GridComponent, HeadComponent, HrefBtnListComponent, I18N_Token, I18nService, ImportComponent, LANGS, LinkRenderer, LoadingComponent, LoadingService, LogComponent, PageActionService, PageFormComponent, PageFormService, PageFormSlotDirective, PageGridListComponent, PagerComponent, PopActionService, RowSelectorComponent$1 as RowSelectorComponent, SearchComponent, SingleSelectListboxComponent, StepsComponent, ThemeConfigComponent, ThemeConfigService, UserHistoryService, calcRowSpan, changeContent, clearLocal, compileTsToJs, convertAct, convertCol, convertForm, convertGrid, createCircularIterator, deepClone, executeRuntimeContextInit, filterObjectByKeys, formTypeToProps, generateUniqueId, getFilterMatchMode, gridOptionsHooker, gridUtils, isJSONParsable, pageListGridOptions, parseFunctions, toPascalCase, wrapHeaderValueGetter };
 //# sourceMappingURL=imm-element-ui.mjs.map