@ai-table/grid 0.1.33 → 0.1.34

package/fesm2022/ai-table-grid.mjs

@@ -1,5 +1,5 @@
 import * as i0 from '@angular/core';
-import { InjectionToken, input, EventEmitter, inject, ElementRef, effect, Output, ChangeDetectionStrategy, Component, signal, computed, output, Input, ChangeDetectorRef, ViewChild, Renderer2, Pipe, model, booleanAttribute, Injectable, DestroyRef, NgZone, ViewContainerRef, viewChild, afterNextRender, untracked } from '@angular/core';
+import { InjectionToken, input, EventEmitter, inject, ElementRef, effect, Output, ChangeDetectionStrategy, Component, signal, computed, output, Input, ChangeDetectorRef, ViewChild, untracked, model, Renderer2, Pipe, booleanAttribute, Injectable, DestroyRef, NgZone, ViewContainerRef, viewChild, afterNextRender } from '@angular/core';
 import Konva from 'konva';
 import { Shape } from 'konva/lib/Shape';
 import { Sprite } from 'konva/lib/shapes/Sprite';
@@ -25,7 +25,7 @@ import { Transformer } from 'konva/lib/shapes/Transformer';
 import { Wedge } from 'konva/lib/shapes/Wedge';
 import * as i1$1 from 'ngx-tethys/popover';
 import { ThyPopoverRef, ThyPopover, ThyPopoverModule } from 'ngx-tethys/popover';
-import { AITableFieldGroup, AITableFieldType, AITableRowColumnType, DragType, isUndefinedOrNull, idCreator as idCreator$1, isUrl, AITableSelectOptionStyle, isEmpty, AITableFilterOperation, AttachmentFieldBase, AITableStatType, DateFieldBase, DEFAULT_FIELD_STAT_TYPE_ITEMS, isDateValid, isDateAndReturnDate, LinkFieldBase, MemberFieldBase, NumberFieldBase, ProgressFieldBase, isProgressAndReturnValue, RateFieldBase, RichTextFieldBase, SelectFieldBase, generateOptionsByTexts, TextFieldBase, CheckboxFieldBase, FieldModelBaseMap, numberFormat } from '@ai-table/utils';
+import { AITableFieldGroup, AITableFieldType, AITableRowColumnType, DragType, isUndefinedOrNull, idCreator as idCreator$1, isUrl, isEmpty, AITableFilterOperation, AttachmentFieldBase, AITableStatType, DateFieldBase, DEFAULT_FIELD_STAT_TYPE_ITEMS, isDateValid, isDateAndReturnDate, LinkFieldBase, MemberFieldBase, NumberFieldBase, ProgressFieldBase, isProgressAndReturnValue, RateFieldBase, RichTextFieldBase, SelectFieldBase, AITableSelectOptionStyle, generateOptionsByTexts, TextFieldBase, CheckboxFieldBase, FieldModelBaseMap, numberFormat, DragDirection, AI_TABLE_MIN_FROZEN_COLUMN_COUNT } from '@ai-table/utils';
 import ObjectID from 'bson-objectid';
 import { customAlphabet } from 'nanoid';
 import * as _ from 'lodash';
@@ -46,22 +46,22 @@ import * as i2 from 'ngx-tethys/form';
 import { ThyFormSubmitDirective, ThyFormModule, ThyUniqueCheckValidator } from 'ngx-tethys/form';
 import { ThyNotifyService } from 'ngx-tethys/notify';
 import { ThyInputNumber } from 'ngx-tethys/input-number';
+import { isKeyHotkey } from 'is-hotkey';
+import { LRUCache } from 'lru-cache';
+import { fromUnixTime, subDays, differenceInDays, differenceInMonths } from 'date-fns';
+import { isArray, TinyDate, helpers } from 'ngx-tethys/util';
+import { DEFAULT_COLORS } from 'ngx-tethys/color-picker';
+import GraphemeSplitter from 'grapheme-splitter';
 import * as i1$2 from '@angular/common';
 import { CommonModule, NgClass, NgTemplateOutlet } from '@angular/common';
+import { ThyDropdownAbstractMenu, ThyDropdownMenuItemDirective, ThyDropdownMenuComponent, ThyDropdownMenuGroup, ThyDropdownDirective, ThyDropdownMenuItemIconDirective, ThyDropdownMenuItemNameDirective, ThyDropdownMenuItemExtendIconDirective, ThyDropdownMenuItemMetaDirective } from 'ngx-tethys/dropdown';
 import { ThyEmptyModule } from 'ngx-tethys/empty';
 import { ThySelect, ThySelectModule } from 'ngx-tethys/select';
 import { ThyDot } from 'ngx-tethys/dot';
 import { ThyIcon } from 'ngx-tethys/icon';
 import { ThyTag } from 'ngx-tethys/tag';
-import { ThyDropdownAbstractMenu, ThyDropdownMenuItemDirective, ThyDropdownMenuComponent, ThyDropdownMenuGroup, ThyDropdownDirective, ThyDropdownMenuItemIconDirective, ThyDropdownMenuItemNameDirective, ThyDropdownMenuItemExtendIconDirective, ThyDropdownMenuItemMetaDirective } from 'ngx-tethys/dropdown';
 import { ThySwitch } from 'ngx-tethys/switch';
 import { of, Subject, fromEvent, debounceTime, mergeWith, animationFrames, filter } from 'rxjs';
-import { isKeyHotkey } from 'is-hotkey';
-import { LRUCache } from 'lru-cache';
-import { fromUnixTime, subDays, differenceInDays, differenceInMonths } from 'date-fns';
-import { isArray, TinyDate, helpers } from 'ngx-tethys/util';
-import { DEFAULT_COLORS } from 'ngx-tethys/color-picker';
-import GraphemeSplitter from 'grapheme-splitter';
 import { ThyDivider } from 'ngx-tethys/divider';
 import * as i4 from 'ngx-tethys/avatar';
 import { ThyAvatarModule } from 'ngx-tethys/avatar';
@@ -1541,7 +1541,8 @@ const AITableQueries = {
 
 class RendererContext {
     constructor(options) {
-        const { rowHeadWidth, linearRows, pointPosition, scrollState, visibleColumnsIndexMap, visibleRowsIndexMap, frozenColumnCount, references, aiFieldConfig, scrollAction, maxFields, maxRecords, maxSelectOptions, fieldOptions, fieldOptionMap, readonly } = options;
+        const { containerRect, rowHeadWidth, linearRows, pointPosition, scrollState, visibleColumnsIndexMap, visibleRowsIndexMap, frozenColumnCount, references, aiFieldConfig, scrollAction, maxFields, maxRecords, maxSelectOptions, fieldOptions, fieldOptionMap, readonly } = options;
+        this.containerRect = containerRect;
         this.rowHeadWidth = rowHeadWidth;
         this.linearRows = linearRows;
         this.pointPosition = pointPosition;
@@ -1872,387 +1873,94 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                 args: ['inputElement', { static: false }]
             }] } });
 
-class NumberCellEditorComponent extends AbstractEditCellEditor {
-    updateValue() {
-        super.update();
-        this.closePopover();
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NumberCellEditorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: NumberCellEditorComponent, isStandalone: true, selector: "number-cell-editor", host: { classAttribute: "number-cell-editor" }, usesInheritance: true, ngImport: i0, template: `<thy-input-number
-        class="h-100"
-        [thyAutoFocus]="true"
-        [(ngModel)]="modelValue"
-        (thyEnter)="updateValue()"
-        (thyBlur)="updateValue()"
-    /> `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: ThyEnterDirective, selector: "[thyEnter]", outputs: ["thyEnter"] }, { kind: "component", type: ThyInputNumber, selector: "thy-input-number", inputs: ["thyAutoFocus", "thyPlaceholder", "thyDisabled", "thyMax", "thyMin", "thyStep", "thyStepDelay", "thySize", "thyPrecision", "thySuffix"], outputs: ["thyBlur", "thyFocus", "thyStepChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NumberCellEditorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'number-cell-editor',
-                    template: `<thy-input-number
-        class="h-100"
-        [thyAutoFocus]="true"
-        [(ngModel)]="modelValue"
-        (thyEnter)="updateValue()"
-        (thyBlur)="updateValue()"
-    /> `,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [FormsModule, ThyEnterDirective, ThyInputNumber],
-                    host: {
-                        class: 'number-cell-editor'
-                    }
-                }]
-        }] });
-
-class SelectOptionComponent {
-    constructor() {
-        this.field = input.required();
-        this.displayOption = input.required();
-        this.optionStyle = computed(() => {
-            return this.field().settings.option_style || AITableSelectOptionStyle.text;
-        });
-        this.AITableSelectOptionStyle = AITableSelectOptionStyle;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: SelectOptionComponent, isStandalone: true, selector: "select-option", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, displayOption: { classPropertyName: "displayOption", publicName: "displayOption", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.select-option-tag": "optionStyle === AITableSelectOptionStyle.tag" }, classAttribute: "select-option thy-text" }, ngImport: i0, template: "@if (displayOption(); as displayOption) {\n    @switch (optionStyle()) {\n        @case (AITableSelectOptionStyle.dot) {\n            @if (displayOption.bg_color || displayOption.color; as color) {\n                <thy-dot [thyColor]=\"color\" [thySize]=\"'md'\" class=\"mr-2\"></thy-dot>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n        @case (AITableSelectOptionStyle.tag) {\n            @if (displayOption.bg_color || displayOption.color || 'default'; as color) {\n                <thy-tag thyTheme=\"fill\" thyShape=\"pill\" [thyColor]=\"color\">\n                    @if (displayOption['icon']) {\n                        <thy-icon class=\"text-white\" [thyIconName]=\"displayOption['icon']\"></thy-icon>\n                    }\n                    <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n                </thy-tag>\n            }\n        }\n        @case (AITableSelectOptionStyle.piece) {\n            @if (displayOption.bg_color || displayOption.color; as color) {\n                <thy-dot thyShape=\"square\" [thyColor]=\"color\" [thySize]=\"'md'\" class=\"mr-2\"></thy-dot>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n        @default {\n            @if (displayOption['icon']) {\n                <thy-icon [thyIconName]=\"displayOption['icon']\" [style.color]=\"displayOption.color\"></thy-icon>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n    }\n}\n", dependencies: [{ kind: "component", type: ThyTag, selector: "thy-tag,[thyTag]", inputs: ["thyTag", "thyShape", "thyColor", "thyTheme", "thySize", "thyHoverable"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "ngmodule", type: ThyTooltipModule }, { kind: "component", type: ThyDot, selector: "thy-dot,[thy-dot],[thyDot]", inputs: ["thyColor", "thySize", "thyTheme", "thyShape"] }, { kind: "component", type: ThyFlexibleText, selector: "thy-flexible-text,[thyFlexibleText]", inputs: ["thyTooltipTrigger", "thyContainerClass", "thyTooltipContent", "thyTooltipPlacement", "thyTooltipOffset"], exportAs: ["thyFlexibleText"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'select-option', changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        class: 'select-option thy-text',
-                        '[class.select-option-tag]': 'optionStyle === AITableSelectOptionStyle.tag'
-                    }, imports: [ThyTag, ThyIcon, ThyTooltipModule, ThyDot, ThyFlexibleText], template: "@if (displayOption(); as displayOption) {\n    @switch (optionStyle()) {\n        @case (AITableSelectOptionStyle.dot) {\n            @if (displayOption.bg_color || displayOption.color; as color) {\n                <thy-dot [thyColor]=\"color\" [thySize]=\"'md'\" class=\"mr-2\"></thy-dot>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n        @case (AITableSelectOptionStyle.tag) {\n            @if (displayOption.bg_color || displayOption.color || 'default'; as color) {\n                <thy-tag thyTheme=\"fill\" thyShape=\"pill\" [thyColor]=\"color\">\n                    @if (displayOption['icon']) {\n                        <thy-icon class=\"text-white\" [thyIconName]=\"displayOption['icon']\"></thy-icon>\n                    }\n                    <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n                </thy-tag>\n            }\n        }\n        @case (AITableSelectOptionStyle.piece) {\n            @if (displayOption.bg_color || displayOption.color; as color) {\n                <thy-dot thyShape=\"square\" [thyColor]=\"color\" [thySize]=\"'md'\" class=\"mr-2\"></thy-dot>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n        @default {\n            @if (displayOption['icon']) {\n                <thy-icon [thyIconName]=\"displayOption['icon']\" [style.color]=\"displayOption.color\"></thy-icon>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n    }\n}\n" }]
-        }] });
-
-class SelectCellEditorComponent extends AbstractEditCellEditor {
-    get isMultiple() {
-        return !!this.field().settings.is_multiple;
-    }
-    constructor() {
-        super();
-        this.selectOptions = computed(() => {
-            return this.field().settings.options;
-        });
-        this.preset = computed(() => {
-            return this.field().settings.is_multiple && this.field().settings.option_style === AITableSelectOptionStyle.tag ? 'tag' : '';
-        });
-    }
-    ngOnInit() {
-        this.modelValue = computed(() => {
-            const value = AITableQueries.getFieldValue(this.aiTable, [this.record()._id, this.field()._id]);
-            if (!this.isMultiple) {
-                return value?.length > 0 ? value[0] : null;
-            }
-            return value || [];
-        })();
-    }
-    onOpenChange(value) {
-        if (!value) {
-            this.closePopover();
+const buildGridLinearRows = (visibleRecords, isAddingVisible = true) => {
+    const linearRows = [];
+    let displayRowIndex = 0;
+    [...visibleRecords, { _id: '' }].forEach((row) => {
+        if (row._id) {
+            displayRowIndex++;
+            linearRows.push({
+                type: AITableRowType.record,
+                _id: row._id,
+                displayIndex: displayRowIndex
+            });
         }
-    }
-    onModelChange(event) {
-        this.updateValueFn();
-    }
-    updateValueFn() {
-        const value = (this.isMultiple ? this.modelValue : (this.modelValue && [this.modelValue]) || []);
-        const originValue = AITableQueries.getFieldValue(this.aiTable, [this.record()._id, this.field()._id]) || [];
-        if (value.length !== originValue.length || !value.every((v, i) => v === originValue[i])) {
-            this.updateFieldValues.emit([
-                {
-                    value: value,
-                    path: [this.record()._id, this.field()._id]
-                }
-            ]);
+        if (isAddingVisible && !row._id) {
+            linearRows.push({
+                type: AITableRowType.add,
+                _id: ''
+            });
         }
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectCellEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: SelectCellEditorComponent, isStandalone: true, selector: "select-cell-editor", host: { classAttribute: "d-block h-100 select-cell-editor" }, usesInheritance: true, ngImport: i0, template: "<thy-select\n    [(ngModel)]=\"modelValue\"\n    [thyAutoExpand]=\"true\"\n    [thyAllowClear]=\"true\"\n    [thyPlaceHolder]=\"''\"\n    [thyPreset]=\"preset()\"\n    [thyMode]=\"field().settings.is_multiple ? 'multiple' : ''\"\n    (ngModelChange)=\"onModelChange($event)\"\n    (thyOnExpandStatusChange)=\"onOpenChange($event)\"\n>\n    <ng-template #selectedDisplay let-option>\n        <select-option [field]=\"field()\" [displayOption]=\"option\"></select-option>\n    </ng-template>\n    @for (option of selectOptions(); track option._id) {\n        <thy-option\n            [thyValue]=\"option._id\"\n            [hidden]=\"!!option.is_disabled\"\n            [thyRawValue]=\"option\"\n            [thyShowOptionCustom]=\"true\"\n            [thyLabelText]=\"option.text\"\n        >\n            <select-option [field]=\"field()\" [displayOption]=\"option\"></select-option>\n        </thy-option>\n    }\n</thy-select>\n", dependencies: [{ kind: "component", type: ThySelect, selector: "thy-select,thy-custom-select", inputs: ["thyDropdownWidthMode", "thyShowSearch", "thyPlaceHolder", "thyServerSearch", "thyLoadState", "thyAutoActiveFirstItem", "thyMode", "thySize", "thyEmptyStateText", "thyEmptySearchMessageText", "thyEnableScrollLoad", "thyAllowClear", "thyDisabled", "thySortComparator", "thyFooterTemplate", "thyPlacement", "thyOrigin", "thyFooterClass", "thyAutoExpand", "thyHasBackdrop", "thyMaxTagCount", "thyBorderless", "thyOptions", "thyPreset"], outputs: ["thyOnSearch", "thyOnScrollToBottom", "thyOnExpandStatusChange"], exportAs: ["thySelect"] }, { kind: "component", type: ThyOption, selector: "thy-option", inputs: ["thyValue", "thyRawValue", "thyLabelText", "thyShowOptionCustom", "thySearchKey", "thyDisabled"], outputs: ["selectionChange", "visibleChange"] }, { kind: "ngmodule", type: ThyTooltipModule }, { kind: "component", type: SelectOptionComponent, selector: "select-option", inputs: ["field", "displayOption"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ThyEmptyModule }, { kind: "ngmodule", type: ThyFormModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ThySelectModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectCellEditorComponent, decorators: [{
-            type: Component,
-            args: [{ selector: 'select-cell-editor', changeDetection: ChangeDetectionStrategy.OnPush, host: {
-                        class: 'd-block h-100 select-cell-editor'
-                    }, imports: [
-                        ThySelect,
-                        ThyOption,
-                        ThyTooltipModule,
-                        SelectOptionComponent,
-                        CommonModule,
-                        ThyEmptyModule,
-                        ThyFormModule,
-                        FormsModule,
-                        ThySelectModule
-                    ], template: "<thy-select\n    [(ngModel)]=\"modelValue\"\n    [thyAutoExpand]=\"true\"\n    [thyAllowClear]=\"true\"\n    [thyPlaceHolder]=\"''\"\n    [thyPreset]=\"preset()\"\n    [thyMode]=\"field().settings.is_multiple ? 'multiple' : ''\"\n    (ngModelChange)=\"onModelChange($event)\"\n    (thyOnExpandStatusChange)=\"onOpenChange($event)\"\n>\n    <ng-template #selectedDisplay let-option>\n        <select-option [field]=\"field()\" [displayOption]=\"option\"></select-option>\n    </ng-template>\n    @for (option of selectOptions(); track option._id) {\n        <thy-option\n            [thyValue]=\"option._id\"\n            [hidden]=\"!!option.is_disabled\"\n            [thyRawValue]=\"option\"\n            [thyShowOptionCustom]=\"true\"\n            [thyLabelText]=\"option.text\"\n        >\n            <select-option [field]=\"field()\" [displayOption]=\"option\"></select-option>\n        </thy-option>\n    }\n</thy-select>\n" }]
-        }], ctorParameters: () => [] });
+    });
+    return linearRows;
+};
+const buildGridData = (aiTable, recordValue, fieldsValue) => {
+    const fieldOptions = getFieldOptions(aiTable);
+    const fields = fieldsValue.map((value) => {
+        const fieldOption = fieldOptions.find((item) => item.type === value.type);
+        return {
+            ...value,
+            icon: value.icon || fieldOption.icon
+        };
+    });
+    return {
+        type: 'grid',
+        fields,
+        records: recordValue
+    };
+};
 
-class TextCellEditorComponent extends AbstractEditCellEditor {
-    constructor() {
-        super();
-        this.render2 = inject(Renderer2);
-        this.maxHeight = 148;
-        this.minHeight = 24;
-        this.isSelectAll = input(false);
+function getColumnIndicesSizeMap(aiTable, fields) {
+    const fieldSizeMap = aiTable.gridData().fieldsSizeMap;
+    const columnIndicesSizeMap = {};
+    fields?.forEach((field, index) => {
+        columnIndicesSizeMap[index] = fieldSizeMap[field._id] ?? getFieldOptionByField(aiTable, field).width;
+    });
+    return columnIndicesSizeMap;
+}
+/**
+ * 获取单元格位置
+ * 根据单元格是否是第一列/最后一列确定单元格所在的位置
+ */
+function getCellHorizontalPosition(options) {
+    const { columnWidth } = options;
+    return { width: columnWidth, offset: 0 };
+}
+function transformToCellText(cellValue, options) {
+    const { aiTable, field } = options;
+    const fieldRenderers = aiTable?.context?.aiFieldConfig()?.fieldRenderers;
+    if (!fieldRenderers || !field) {
+        return cellValue;
     }
-    ngAfterViewInit() {
-        setTimeout(() => {
-            this.updateStyle();
-            this.handleSelectAll();
-        }, 0);
+    const toText = fieldRenderers[field.type]?.toText;
+    if (!toText) {
+        return cellValue;
     }
-    updateStyle() {
-        const textarea = this.elementRef.nativeElement.querySelector('textarea');
-        if (textarea) {
-            this.render2.setStyle(textarea, 'height', 'auto');
-            const scrollHeight = textarea.scrollHeight;
-            const newHeight = Math.max(this.minHeight, Math.min(scrollHeight, this.maxHeight)) + 4;
-            this.render2.setStyle(textarea, 'max-height', `${this.maxHeight}px`);
-            this.render2.setStyle(textarea, 'height', `${newHeight}px`);
-            this.render2.setStyle(textarea, 'resize', 'none');
-        }
+    const cellText = toText(field, cellValue);
+    if (cellText == null) {
+        return cellValue;
     }
-    handleSelectAll() {
-        if (this.isSelectAll()) {
-            const textarea = this.elementRef.nativeElement.querySelector('textarea');
-            textarea.select();
-        }
+    return cellText;
+}
+/**
+ * `\u4e00`: https://www.compart.com/en/unicode/U+4E00
+ * `\u9fa5`: https://www.compart.com/en/unicode/U+9FA5
+ */
+const UNIFIED_IDEOGRAPHS_REGEX = /^[\u4e00-\u9fa5]+$/;
+const SET_OF_LETTERS_REGEX = /^[a-zA-Z\/ ]+$/;
+function getAvatarShortName(name) {
+    if (!name) {
+        return '';
     }
-    valueChange() {
-        this.updateStyle();
+    name = name.trim();
+    if (UNIFIED_IDEOGRAPHS_REGEX.test(name) && name.length > 2) {
+        return name.slice(name.length - 2);
     }
-    updateValue() {
-        super.update();
-        this.closePopover();
+    if (SET_OF_LETTERS_REGEX.test(name) && name.indexOf(' ') > 0) {
+        const words = name.split(' ');
+        return (words[0].slice(0, 1) + words[1].slice(0, 1)).toUpperCase();
     }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: TextCellEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: TextCellEditorComponent, isStandalone: true, selector: "text-cell-editor", inputs: { isSelectAll: { classPropertyName: "isSelectAll", publicName: "isSelectAll", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "text-cell-editor" }, usesInheritance: true, ngImport: i0, template: `
-        <textarea
-            #textarea
-            placeholder=""
-            rows="1"
-            thyInput
-            [thyAutofocus]="true"
-            [(ngModel)]="modelValue"
-            (ngModelChange)="valueChange()"
-            (thyEnter)="updateValue()"
-            (blur)="updateValue()"
-        ></textarea>
-    `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: ThyAutofocusDirective, selector: "input[thyAutofocus],textarea[thyAutofocus]", inputs: ["thyAutofocus", "thyAutoSelect"] }, { kind: "directive", type: ThyInputDirective, selector: "input[thyInput], select[thyInput], textarea[thyInput]", inputs: ["thySize"], exportAs: ["thyInput"] }, { kind: "directive", type: ThyEnterDirective, selector: "[thyEnter]", outputs: ["thyEnter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: TextCellEditorComponent, decorators: [{
-            type: Component,
-            args: [{
-                    selector: 'text-cell-editor',
-                    template: `
-        <textarea
-            #textarea
-            placeholder=""
-            rows="1"
-            thyInput
-            [thyAutofocus]="true"
-            [(ngModel)]="modelValue"
-            (ngModelChange)="valueChange()"
-            (thyEnter)="updateValue()"
-            (blur)="updateValue()"
-        ></textarea>
-    `,
-                    changeDetection: ChangeDetectionStrategy.OnPush,
-                    imports: [FormsModule, ThyAutofocusDirective, ThyInputDirective, ThyEnterDirective],
-                    host: {
-                        class: 'text-cell-editor'
-                    }
-                }]
-        }], ctorParameters: () => [] });
-
-class SelectOptionPipe {
-    transform(_id, options) {
-        return options?.length && options.find((item) => item._id === _id);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionPipe, isStandalone: true, name: "selectOption" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'selectOption'
-                }]
-        }] });
-class SelectOptionsPipe {
-    transform(ids, options = []) {
-        return ((ids?.length &&
-            ids.map((id) => {
-                return options.find((item) => item._id === id);
-            })) ||
-            []);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionsPipe, isStandalone: true, name: "selectOptions" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionsPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'selectOptions'
-                }]
-        }] });
-class IsSelectRecordPipe {
-    transform(recordId, selection) {
-        return selection.selectedRecords.has(recordId);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: IsSelectRecordPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: IsSelectRecordPipe, isStandalone: true, name: "isSelectRecord" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: IsSelectRecordPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'isSelectRecord'
-                }]
-        }] });
-class UserPipe {
-    transform(values, references) {
-        return ((values.length &&
-            values.map((item) => {
-                return references.members[item] || {};
-            })) ||
-            []);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: UserPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: UserPipe, isStandalone: true, name: "user" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: UserPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'user'
-                }]
-        }] });
-class SelectSettingPipe {
-    transform(settings) {
-        return settings;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectSettingPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: SelectSettingPipe, isStandalone: true, name: "selectSetting" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectSettingPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'selectSetting'
-                }]
-        }] });
-class MemberSettingPipe {
-    transform(settings) {
-        return settings;
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MemberSettingPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: MemberSettingPipe, isStandalone: true, name: "memberSetting" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MemberSettingPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'memberSetting'
-                }]
-        }] });
-class AITableFieldIsSameOptionPipe {
-    transform(fieldOption, field) {
-        return isSameFieldOption(fieldOption, field);
-    }
-    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableFieldIsSameOptionPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
-    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: AITableFieldIsSameOptionPipe, isStandalone: true, name: "fieldIsSameOption" }); }
-}
-i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableFieldIsSameOptionPipe, decorators: [{
-            type: Pipe,
-            args: [{
-                    name: 'fieldIsSameOption'
-                }]
-        }] });
-
-const buildGridLinearRows = (visibleRecords, isAddingVisible = true) => {
-    const linearRows = [];
-    let displayRowIndex = 0;
-    [...visibleRecords, { _id: '' }].forEach((row) => {
-        if (row._id) {
-            displayRowIndex++;
-            linearRows.push({
-                type: AITableRowType.record,
-                _id: row._id,
-                displayIndex: displayRowIndex
-            });
-        }
-        if (isAddingVisible && !row._id) {
-            linearRows.push({
-                type: AITableRowType.add,
-                _id: ''
-            });
-        }
-    });
-    return linearRows;
-};
-const buildGridData = (aiTable, recordValue, fieldsValue) => {
-    const fieldOptions = getFieldOptions(aiTable);
-    const fields = fieldsValue.map((value) => {
-        const fieldOption = fieldOptions.find((item) => item.type === value.type);
-        return {
-            ...value,
-            icon: value.icon || fieldOption.icon
-        };
-    });
-    return {
-        type: 'grid',
-        fields,
-        records: recordValue
-    };
-};
-
-function getColumnIndicesSizeMap(aiTable, fields) {
-    const fieldSizeMap = aiTable.gridData().fieldsSizeMap;
-    const columnIndicesSizeMap = {};
-    fields?.forEach((field, index) => {
-        columnIndicesSizeMap[index] = fieldSizeMap[field._id] ?? getFieldOptionByField(aiTable, field).width;
-    });
-    return columnIndicesSizeMap;
-}
-/**
- * 获取单元格位置
- * 根据单元格是否是第一列/最后一列确定单元格所在的位置
- */
-function getCellHorizontalPosition(options) {
-    const { columnWidth } = options;
-    return { width: columnWidth, offset: 0 };
-}
-function transformToCellText(cellValue, options) {
-    const { aiTable, field } = options;
-    const fieldRenderers = aiTable?.context?.aiFieldConfig()?.fieldRenderers;
-    if (!fieldRenderers || !field) {
-        return cellValue;
-    }
-    const toText = fieldRenderers[field.type]?.toText;
-    if (!toText) {
-        return cellValue;
-    }
-    const cellText = toText(field, cellValue);
-    if (cellText == null) {
-        return cellValue;
-    }
-    return cellText;
-}
-/**
- * `\u4e00`: https://www.compart.com/en/unicode/U+4E00
- * `\u9fa5`: https://www.compart.com/en/unicode/U+9FA5
- */
-const UNIFIED_IDEOGRAPHS_REGEX = /^[\u4e00-\u9fa5]+$/;
-const SET_OF_LETTERS_REGEX = /^[a-zA-Z\/ ]+$/;
-function getAvatarShortName(name) {
-    if (!name) {
-        return '';
-    }
-    name = name.trim();
-    if (UNIFIED_IDEOGRAPHS_REGEX.test(name) && name.length > 2) {
-        return name.slice(name.length - 2);
-    }
-    if (SET_OF_LETTERS_REGEX.test(name) && name.indexOf(' ') > 0) {
-        const words = name.split(' ');
-        return (words[0].slice(0, 1) + words[1].slice(0, 1)).toUpperCase();
-    }
-    return name.length > 2 ? name.slice(0, 2).toUpperCase() : name.toUpperCase();
+    return name.length > 2 ? name.slice(0, 2).toUpperCase() : name.toUpperCase();
 }
 function getAvatarBgColor(name) {
     if (!name) {
@@ -2272,9 +1980,17 @@ function expandCell(aiTable, path) {
     const [recordId, fieldId] = path;
     aiTable.selection.set({
         ...aiTable.selection(),
+        activeCell: [recordId, fieldId],
+        selectedCells: new Set([`${recordId}:${fieldId}`]),
         expandCell: [recordId, fieldId]
     });
 }
+function setExpandCellInfo(aiTable, expandCellInfo) {
+    aiTable.selection.set({
+        ...aiTable.selection(),
+        expandCellInfo: expandCellInfo
+    });
+}
 
 /**
  * 生成目标名称
@@ -5062,6 +4778,24 @@ class CoverCellBase {
     constructor() {
         this.config = input();
         this.onlyDisplayBorder = input(false);
+        this.height = computed(() => {
+            const { render } = this.config();
+            return render.rowHeight;
+        });
+        this.isExpand = computed(() => {
+            const { isExpand } = this.config();
+            return isExpand;
+        });
+        effect(() => {
+            const height = this.height();
+            if (this.isExpand()) {
+                untracked(() => {
+                    const { render, aiTable } = this.config();
+                    const { columnWidth } = render;
+                    setExpandCellInfo(aiTable, { width: columnWidth, height });
+                });
+            }
+        });
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: CoverCellBase, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
     static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: CoverCellBase, isStandalone: true, selector: "ai-table-cover-cell-base", inputs: { config: { classPropertyName: "config", publicName: "config", isSignal: true, isRequired: false, transformFunction: null }, onlyDisplayBorder: { classPropertyName: "onlyDisplayBorder", publicName: "onlyDisplayBorder", isSignal: true, isRequired: false, transformFunction: null } }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
@@ -5073,7 +4807,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                     template: '',
                     changeDetection: ChangeDetectionStrategy.OnPush
                 }]
-        }] });
+        }], ctorParameters: () => [] });
 
 class AITableCellLink extends CoverCellBase {
     constructor() {
@@ -8859,9 +8593,8 @@ class AITableFillHandle {
             const { aiTable, readonly } = this.config();
             const selection = aiTable.selection();
             const hasSelectedCells = selection.selectedCells.size > 0;
-            const isExpandCell = selection.expandCell;
             const isEditingCell = selection.editingCell;
-            return hasSelectedCells && !readonly && !isEditingCell && !isExpandCell;
+            return hasSelectedCells && !readonly && !isEditingCell;
         });
         this.handleConfig = computed(() => {
             const { aiTable, coordinate } = this.config();
@@ -8875,9 +8608,10 @@ class AITableFillHandle {
             const rowOffset = coordinate.getRowOffset(rowIndex);
             const width = 6;
             const height = 6;
+            const cellHeight = aiTable.selection().expandCellInfo?.height ?? AI_TABLE_ROW_HEIGHT;
             return {
                 x: columnOffset + columnWidth - width / 2 + AI_TABLE_OFFSET,
-                y: rowOffset + AI_TABLE_ROW_HEIGHT - height + AI_TABLE_CELL_BORDER + AI_TABLE_OFFSET,
+                y: rowOffset + cellHeight - height + AI_TABLE_CELL_BORDER + AI_TABLE_OFFSET,
                 width,
                 height,
                 fill: Colors.primary,
@@ -10272,7 +10006,7 @@ class AITableCellText extends CoverCellBase {
             if (isExpand) {
                 return {
                     width: columnWidth - AI_TABLE_CELL_BORDER / 2,
-                    height: this.renderHeight(),
+                    height: this.height(),
                     stroke: Colors.primary,
                     strokeWidth: 2,
                     listening: false
@@ -10286,9 +10020,9 @@ class AITableCellText extends CoverCellBase {
             const { height } = this.expandTextBounds();
             return {
                 width: columnWidth,
-                height: this.renderHeight(),
+                height: this.height(),
                 contentWidth: columnWidth, // 内容宽度大于容器宽度，会显示横向滚动条
-                contentHeight: height + this.startY() * 2, // 内容高度大于容器高度，会显示竖向滚动条
+                contentHeight: height + this.startY() * 2 - AI_TABLE_CELL_LINE_BORDER, // 内容高度大于容器高度，会显示竖向滚动条
                 scrollbarSize: 9,
                 scrollbarColor: Colors.gray700,
                 x: 0,
@@ -10329,9 +10063,9 @@ class AITableCellText extends CoverCellBase {
             }
             return textRender.replace(/\r|\n/g, ' ');
         });
-        this.renderHeight = computed(() => {
+        this.height = computed(() => {
             const { height } = this.expandTextBounds() || { height: 0 };
-            return Math.min(Math.max(height, this.config()?.render.rowHeight || AI_TABLE_FIELD_HEAD_HEIGHT), 147);
+            return Math.min(Math.max(height, this.config().render.rowHeight - AI_TABLE_CELL_LINE_BORDER || AI_TABLE_ROW_BLANK_HEIGHT), 146);
         });
         this.startY = computed(() => {
             const { y, rowHeight } = this.config()?.render;
@@ -10366,9 +10100,7 @@ class AITableCellText extends CoverCellBase {
             return;
         });
         this.textConfig = computed(() => {
-            const { isExpand } = this.config();
             const render = this.config()?.render;
-            this.isExpand();
             if (render) {
                 const { x, y, transformValue, field, columnWidth, rowHeight, style, zIndex } = render;
                 let textRender = this.textString();
@@ -10391,10 +10123,6 @@ class AITableCellText extends CoverCellBase {
             }
             return;
         });
-        this.isExpand = computed(() => {
-            const { isExpand } = this.config();
-            return isExpand;
-        });
     }
     static { this.fieldType = AITableFieldType.text; }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableCellText, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
@@ -10732,32 +10460,329 @@ function getStartAndEndCell(selectedCells) {
     return { startCell, endCell };
 }
 
-class AITableFieldSetting {
-    constructor() {
-        this.aiEditField = model.required();
-        this.aiTable = input.required();
-        this.aiExternalTemplate = input(null);
-        this.aiReferences = input();
-        this.isUpdate = input(false, { transform: booleanAttribute });
-        this.addField = output();
-        this.setField = output();
-        this.selectedFieldOption = computed(() => {
-            return getFieldOptionByField(this.aiTable(), this.aiEditField());
-        });
-        this.fieldMaxLength = 32;
-        this.validatorConfig = computed(() => {
-            return {
-                validationMessages: {
-                    fieldName: {
-                        required: getI18nTextByKey(this.aiTable(), AITableGridI18nKey.fieldNameRequired),
-                        thyUniqueCheck: getI18nTextByKey(this.aiTable(), AITableGridI18nKey.fieldNameDuplicate)
-                    }
-                }
-            };
-        });
-        this.fieldOptions = computed(() => {
-            const fieldOptions = getFieldOptions(this.aiTable());
-            return _.groupBy(fieldOptions, 'group');
+class NumberCellEditorComponent extends AbstractEditCellEditor {
+    updateValue() {
+        if (this.modelValue === '') {
+            const fieldModel = FieldModelMap[this.field().type];
+            this.modelValue = fieldModel.transformCellValue(this.modelValue, { aiTable: this.aiTable, field: this.field() });
+        }
+        super.update();
+        this.closePopover();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NumberCellEditorComponent, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "14.0.0", version: "19.2.10", type: NumberCellEditorComponent, isStandalone: true, selector: "number-cell-editor", host: { classAttribute: "number-cell-editor" }, usesInheritance: true, ngImport: i0, template: `<thy-input-number
+        class="h-100"
+        [thyAutoFocus]="true"
+        [(ngModel)]="modelValue"
+        (thyEnter)="updateValue()"
+        (thyBlur)="updateValue()"
+    /> `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: ThyEnterDirective, selector: "[thyEnter]", outputs: ["thyEnter"] }, { kind: "component", type: ThyInputNumber, selector: "thy-input-number", inputs: ["thyAutoFocus", "thyPlaceholder", "thyDisabled", "thyMax", "thyMin", "thyStep", "thyStepDelay", "thySize", "thyPrecision", "thySuffix"], outputs: ["thyBlur", "thyFocus", "thyStepChange"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: NumberCellEditorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'number-cell-editor',
+                    template: `<thy-input-number
+        class="h-100"
+        [thyAutoFocus]="true"
+        [(ngModel)]="modelValue"
+        (thyEnter)="updateValue()"
+        (thyBlur)="updateValue()"
+    /> `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [FormsModule, ThyEnterDirective, ThyInputNumber],
+                    host: {
+                        class: 'number-cell-editor'
+                    }
+                }]
+        }] });
+
+class SelectOptionComponent {
+    constructor() {
+        this.field = input.required();
+        this.displayOption = input.required();
+        this.optionStyle = computed(() => {
+            return this.field().settings.option_style || AITableSelectOptionStyle.text;
+        });
+        this.AITableSelectOptionStyle = AITableSelectOptionStyle;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: SelectOptionComponent, isStandalone: true, selector: "select-option", inputs: { field: { classPropertyName: "field", publicName: "field", isSignal: true, isRequired: true, transformFunction: null }, displayOption: { classPropertyName: "displayOption", publicName: "displayOption", isSignal: true, isRequired: true, transformFunction: null } }, host: { properties: { "class.select-option-tag": "optionStyle === AITableSelectOptionStyle.tag" }, classAttribute: "select-option thy-text" }, ngImport: i0, template: "@if (displayOption(); as displayOption) {\n    @switch (optionStyle()) {\n        @case (AITableSelectOptionStyle.dot) {\n            @if (displayOption.bg_color || displayOption.color; as color) {\n                <thy-dot [thyColor]=\"color\" [thySize]=\"'md'\" class=\"mr-2\"></thy-dot>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n        @case (AITableSelectOptionStyle.tag) {\n            @if (displayOption.bg_color || displayOption.color || 'default'; as color) {\n                <thy-tag thyTheme=\"fill\" thyShape=\"pill\" [thyColor]=\"color\">\n                    @if (displayOption['icon']) {\n                        <thy-icon class=\"text-white\" [thyIconName]=\"displayOption['icon']\"></thy-icon>\n                    }\n                    <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n                </thy-tag>\n            }\n        }\n        @case (AITableSelectOptionStyle.piece) {\n            @if (displayOption.bg_color || displayOption.color; as color) {\n                <thy-dot thyShape=\"square\" [thyColor]=\"color\" [thySize]=\"'md'\" class=\"mr-2\"></thy-dot>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n        @default {\n            @if (displayOption['icon']) {\n                <thy-icon [thyIconName]=\"displayOption['icon']\" [style.color]=\"displayOption.color\"></thy-icon>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n    }\n}\n", dependencies: [{ kind: "component", type: ThyTag, selector: "thy-tag,[thyTag]", inputs: ["thyTag", "thyShape", "thyColor", "thyTheme", "thySize", "thyHoverable"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "ngmodule", type: ThyTooltipModule }, { kind: "component", type: ThyDot, selector: "thy-dot,[thy-dot],[thyDot]", inputs: ["thyColor", "thySize", "thyTheme", "thyShape"] }, { kind: "component", type: ThyFlexibleText, selector: "thy-flexible-text,[thyFlexibleText]", inputs: ["thyTooltipTrigger", "thyContainerClass", "thyTooltipContent", "thyTooltipPlacement", "thyTooltipOffset"], exportAs: ["thyFlexibleText"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'select-option', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'select-option thy-text',
+                        '[class.select-option-tag]': 'optionStyle === AITableSelectOptionStyle.tag'
+                    }, imports: [ThyTag, ThyIcon, ThyTooltipModule, ThyDot, ThyFlexibleText], template: "@if (displayOption(); as displayOption) {\n    @switch (optionStyle()) {\n        @case (AITableSelectOptionStyle.dot) {\n            @if (displayOption.bg_color || displayOption.color; as color) {\n                <thy-dot [thyColor]=\"color\" [thySize]=\"'md'\" class=\"mr-2\"></thy-dot>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n        @case (AITableSelectOptionStyle.tag) {\n            @if (displayOption.bg_color || displayOption.color || 'default'; as color) {\n                <thy-tag thyTheme=\"fill\" thyShape=\"pill\" [thyColor]=\"color\">\n                    @if (displayOption['icon']) {\n                        <thy-icon class=\"text-white\" [thyIconName]=\"displayOption['icon']\"></thy-icon>\n                    }\n                    <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n                </thy-tag>\n            }\n        }\n        @case (AITableSelectOptionStyle.piece) {\n            @if (displayOption.bg_color || displayOption.color; as color) {\n                <thy-dot thyShape=\"square\" [thyColor]=\"color\" [thySize]=\"'md'\" class=\"mr-2\"></thy-dot>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n        @default {\n            @if (displayOption['icon']) {\n                <thy-icon [thyIconName]=\"displayOption['icon']\" [style.color]=\"displayOption.color\"></thy-icon>\n            }\n            <span thyFlexibleText [thyTooltipContent]=\"displayOption.text\">{{ displayOption.text }}</span>\n        }\n    }\n}\n" }]
+        }] });
+
+class SelectCellEditorComponent extends AbstractEditCellEditor {
+    get isMultiple() {
+        return !!this.field().settings.is_multiple;
+    }
+    constructor() {
+        super();
+        this.selectOptions = computed(() => {
+            return this.field().settings.options;
+        });
+        this.preset = computed(() => {
+            return this.field().settings.is_multiple && this.field().settings.option_style === AITableSelectOptionStyle.tag ? 'tag' : '';
+        });
+    }
+    ngOnInit() {
+        this.modelValue = computed(() => {
+            const value = AITableQueries.getFieldValue(this.aiTable, [this.record()._id, this.field()._id]);
+            if (!this.isMultiple) {
+                return value?.length > 0 ? value[0] : null;
+            }
+            return value || [];
+        })();
+    }
+    onOpenChange(value) {
+        if (!value) {
+            this.closePopover();
+        }
+    }
+    onModelChange(event) {
+        this.updateValueFn();
+    }
+    updateValueFn() {
+        const value = (this.isMultiple ? this.modelValue : (this.modelValue && [this.modelValue]) || []);
+        const originValue = AITableQueries.getFieldValue(this.aiTable, [this.record()._id, this.field()._id]) || [];
+        if (value.length !== originValue.length || !value.every((v, i) => v === originValue[i])) {
+            this.updateFieldValues.emit([
+                {
+                    value: value,
+                    path: [this.record()._id, this.field()._id]
+                }
+            ]);
+        }
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectCellEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: SelectCellEditorComponent, isStandalone: true, selector: "select-cell-editor", host: { classAttribute: "d-block h-100 select-cell-editor" }, usesInheritance: true, ngImport: i0, template: "<thy-select\n    [(ngModel)]=\"modelValue\"\n    [thyAutoExpand]=\"true\"\n    [thyAllowClear]=\"true\"\n    [thyPlaceHolder]=\"''\"\n    [thyPreset]=\"preset()\"\n    [thyMode]=\"field().settings.is_multiple ? 'multiple' : ''\"\n    (ngModelChange)=\"onModelChange($event)\"\n    (thyOnExpandStatusChange)=\"onOpenChange($event)\"\n>\n    <ng-template #selectedDisplay let-option>\n        <select-option [field]=\"field()\" [displayOption]=\"option\"></select-option>\n    </ng-template>\n    @for (option of selectOptions(); track option._id) {\n        <thy-option\n            [thyValue]=\"option._id\"\n            [hidden]=\"!!option.is_disabled\"\n            [thyRawValue]=\"option\"\n            [thyShowOptionCustom]=\"true\"\n            [thyLabelText]=\"option.text\"\n        >\n            <select-option [field]=\"field()\" [displayOption]=\"option\"></select-option>\n        </thy-option>\n    }\n</thy-select>\n", dependencies: [{ kind: "component", type: ThySelect, selector: "thy-select,thy-custom-select", inputs: ["thyDropdownWidthMode", "thyShowSearch", "thyPlaceHolder", "thyServerSearch", "thyLoadState", "thyAutoActiveFirstItem", "thyMode", "thySize", "thyEmptyStateText", "thyEmptySearchMessageText", "thyEnableScrollLoad", "thyAllowClear", "thyDisabled", "thySortComparator", "thyFooterTemplate", "thyPlacement", "thyOrigin", "thyFooterClass", "thyAutoExpand", "thyHasBackdrop", "thyMaxTagCount", "thyBorderless", "thyOptions", "thyPreset"], outputs: ["thyOnSearch", "thyOnScrollToBottom", "thyOnExpandStatusChange"], exportAs: ["thySelect"] }, { kind: "component", type: ThyOption, selector: "thy-option", inputs: ["thyValue", "thyRawValue", "thyLabelText", "thyShowOptionCustom", "thySearchKey", "thyDisabled"], outputs: ["selectionChange", "visibleChange"] }, { kind: "ngmodule", type: ThyTooltipModule }, { kind: "component", type: SelectOptionComponent, selector: "select-option", inputs: ["field", "displayOption"] }, { kind: "ngmodule", type: CommonModule }, { kind: "ngmodule", type: ThyEmptyModule }, { kind: "ngmodule", type: ThyFormModule }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "ngmodule", type: ThySelectModule }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectCellEditorComponent, decorators: [{
+            type: Component,
+            args: [{ selector: 'select-cell-editor', changeDetection: ChangeDetectionStrategy.OnPush, host: {
+                        class: 'd-block h-100 select-cell-editor'
+                    }, imports: [
+                        ThySelect,
+                        ThyOption,
+                        ThyTooltipModule,
+                        SelectOptionComponent,
+                        CommonModule,
+                        ThyEmptyModule,
+                        ThyFormModule,
+                        FormsModule,
+                        ThySelectModule
+                    ], template: "<thy-select\n    [(ngModel)]=\"modelValue\"\n    [thyAutoExpand]=\"true\"\n    [thyAllowClear]=\"true\"\n    [thyPlaceHolder]=\"''\"\n    [thyPreset]=\"preset()\"\n    [thyMode]=\"field().settings.is_multiple ? 'multiple' : ''\"\n    (ngModelChange)=\"onModelChange($event)\"\n    (thyOnExpandStatusChange)=\"onOpenChange($event)\"\n>\n    <ng-template #selectedDisplay let-option>\n        <select-option [field]=\"field()\" [displayOption]=\"option\"></select-option>\n    </ng-template>\n    @for (option of selectOptions(); track option._id) {\n        <thy-option\n            [thyValue]=\"option._id\"\n            [hidden]=\"!!option.is_disabled\"\n            [thyRawValue]=\"option\"\n            [thyShowOptionCustom]=\"true\"\n            [thyLabelText]=\"option.text\"\n        >\n            <select-option [field]=\"field()\" [displayOption]=\"option\"></select-option>\n        </thy-option>\n    }\n</thy-select>\n" }]
+        }], ctorParameters: () => [] });
+
+class TextCellEditorComponent extends AbstractEditCellEditor {
+    constructor() {
+        super();
+        this.render2 = inject(Renderer2);
+        this.maxHeight = 148;
+        this.minHeight = 24;
+        this.isSelectAll = input(false);
+    }
+    ngAfterViewInit() {
+        setTimeout(() => {
+            this.updateStyle();
+            this.handleSelectAll();
+        }, 0);
+    }
+    updateStyle() {
+        const textarea = this.elementRef.nativeElement.querySelector('textarea');
+        if (textarea) {
+            this.render2.setStyle(textarea, 'height', 'auto');
+            const scrollHeight = textarea.scrollHeight;
+            const newHeight = Math.max(this.minHeight, Math.min(scrollHeight, this.maxHeight)) + 4;
+            this.render2.setStyle(textarea, 'max-height', `${this.maxHeight}px`);
+            this.render2.setStyle(textarea, 'height', `${newHeight}px`);
+            this.render2.setStyle(textarea, 'resize', 'none');
+        }
+    }
+    handleSelectAll() {
+        if (this.isSelectAll()) {
+            const textarea = this.elementRef.nativeElement.querySelector('textarea');
+            textarea.select();
+        }
+    }
+    valueChange() {
+        this.updateStyle();
+    }
+    updateValue() {
+        super.update();
+        this.closePopover();
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: TextCellEditorComponent, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: TextCellEditorComponent, isStandalone: true, selector: "text-cell-editor", inputs: { isSelectAll: { classPropertyName: "isSelectAll", publicName: "isSelectAll", isSignal: true, isRequired: false, transformFunction: null } }, host: { classAttribute: "text-cell-editor" }, usesInheritance: true, ngImport: i0, template: `
+        <textarea
+            #textarea
+            placeholder=""
+            rows="1"
+            thyInput
+            [thyAutofocus]="true"
+            [(ngModel)]="modelValue"
+            (ngModelChange)="valueChange()"
+            (thyEnter)="updateValue()"
+            (blur)="updateValue()"
+        ></textarea>
+    `, isInline: true, dependencies: [{ kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.DefaultValueAccessor, selector: "input:not([type=checkbox])[formControlName],textarea[formControlName],input:not([type=checkbox])[formControl],textarea[formControl],input:not([type=checkbox])[ngModel],textarea[ngModel],[ngDefaultControl]" }, { kind: "directive", type: i1.NgControlStatus, selector: "[formControlName],[ngModel],[formControl]" }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: ThyAutofocusDirective, selector: "input[thyAutofocus],textarea[thyAutofocus]", inputs: ["thyAutofocus", "thyAutoSelect"] }, { kind: "directive", type: ThyInputDirective, selector: "input[thyInput], select[thyInput], textarea[thyInput]", inputs: ["thySize"], exportAs: ["thyInput"] }, { kind: "directive", type: ThyEnterDirective, selector: "[thyEnter]", outputs: ["thyEnter"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: TextCellEditorComponent, decorators: [{
+            type: Component,
+            args: [{
+                    selector: 'text-cell-editor',
+                    template: `
+        <textarea
+            #textarea
+            placeholder=""
+            rows="1"
+            thyInput
+            [thyAutofocus]="true"
+            [(ngModel)]="modelValue"
+            (ngModelChange)="valueChange()"
+            (thyEnter)="updateValue()"
+            (blur)="updateValue()"
+        ></textarea>
+    `,
+                    changeDetection: ChangeDetectionStrategy.OnPush,
+                    imports: [FormsModule, ThyAutofocusDirective, ThyInputDirective, ThyEnterDirective],
+                    host: {
+                        class: 'text-cell-editor'
+                    }
+                }]
+        }], ctorParameters: () => [] });
+
+class SelectOptionPipe {
+    transform(_id, options) {
+        return options?.length && options.find((item) => item._id === _id);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionPipe, isStandalone: true, name: "selectOption" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'selectOption'
+                }]
+        }] });
+class SelectOptionsPipe {
+    transform(ids, options = []) {
+        return ((ids?.length &&
+            ids.map((id) => {
+                return options.find((item) => item._id === id);
+            })) ||
+            []);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionsPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionsPipe, isStandalone: true, name: "selectOptions" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectOptionsPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'selectOptions'
+                }]
+        }] });
+class IsSelectRecordPipe {
+    transform(recordId, selection) {
+        return selection.selectedRecords.has(recordId);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: IsSelectRecordPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: IsSelectRecordPipe, isStandalone: true, name: "isSelectRecord" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: IsSelectRecordPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'isSelectRecord'
+                }]
+        }] });
+class UserPipe {
+    transform(values, references) {
+        return ((values.length &&
+            values.map((item) => {
+                return references.members[item] || {};
+            })) ||
+            []);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: UserPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: UserPipe, isStandalone: true, name: "user" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: UserPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'user'
+                }]
+        }] });
+class SelectSettingPipe {
+    transform(settings) {
+        return settings;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectSettingPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: SelectSettingPipe, isStandalone: true, name: "selectSetting" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: SelectSettingPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'selectSetting'
+                }]
+        }] });
+class MemberSettingPipe {
+    transform(settings) {
+        return settings;
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MemberSettingPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: MemberSettingPipe, isStandalone: true, name: "memberSetting" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: MemberSettingPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'memberSetting'
+                }]
+        }] });
+class AITableFieldIsSameOptionPipe {
+    transform(fieldOption, field) {
+        return isSameFieldOption(fieldOption, field);
+    }
+    static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableFieldIsSameOptionPipe, deps: [], target: i0.ɵɵFactoryTarget.Pipe }); }
+    static { this.ɵpipe = i0.ɵɵngDeclarePipe({ minVersion: "14.0.0", version: "19.2.10", ngImport: i0, type: AITableFieldIsSameOptionPipe, isStandalone: true, name: "fieldIsSameOption" }); }
+}
+i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableFieldIsSameOptionPipe, decorators: [{
+            type: Pipe,
+            args: [{
+                    name: 'fieldIsSameOption'
+                }]
+        }] });
+
+class AITableFieldSetting {
+    constructor() {
+        this.aiEditField = model.required();
+        this.aiTable = input.required();
+        this.aiExternalTemplate = input(null);
+        this.aiReferences = input();
+        this.isUpdate = input(false, { transform: booleanAttribute });
+        this.addField = output();
+        this.setField = output();
+        this.selectedFieldOption = computed(() => {
+            return getFieldOptionByField(this.aiTable(), this.aiEditField());
+        });
+        this.fieldMaxLength = 32;
+        this.validatorConfig = computed(() => {
+            return {
+                validationMessages: {
+                    fieldName: {
+                        required: getI18nTextByKey(this.aiTable(), AITableGridI18nKey.fieldNameRequired),
+                        thyUniqueCheck: getI18nTextByKey(this.aiTable(), AITableGridI18nKey.fieldNameDuplicate)
+                    }
+                }
+            };
+        });
+        this.fieldOptions = computed(() => {
+            const fieldOptions = getFieldOptions(this.aiTable());
+            return _.groupBy(fieldOptions, 'group');
         });
         this.aITableFieldType = AITableFieldType;
         this.isMultipleMember = false;
@@ -10900,7 +10925,8 @@ class AITableGridSelectionService {
             activeCell: null,
             expandCell: null,
             editingCell: null,
-            selectAllState: AITableSelectAllState.none
+            selectAllState: AITableSelectAllState.none,
+            expandCellInfo: null
         });
     }
     setActiveCell(activeCell) {
@@ -11418,6 +11444,7 @@ class AITableGridBase {
         this.aiBuildRenderDataFn = input();
         this.aiGetI18nTextByKey = input();
         this.aiKeywords = input();
+        this.aiFrozenColumnCountFn = input();
         this.AITableFieldType = AITableFieldType;
         this.AITableSelectOptionStyle = AITableSelectOptionStyle;
         this.isSelectedAll = computed(() => {
@@ -11537,7 +11564,7 @@ class AITableGridBase {
         }
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableGridBase, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: AITableGridBase, isStandalone: true, selector: "ai-table-grid-base", inputs: { aiRecords: { classPropertyName: "aiRecords", publicName: "aiRecords", isSignal: true, isRequired: true, transformFunction: null }, aiFields: { classPropertyName: "aiFields", publicName: "aiFields", isSignal: true, isRequired: true, transformFunction: null }, aiFieldsSizeMap: { classPropertyName: "aiFieldsSizeMap", publicName: "aiFieldsSizeMap", isSignal: true, isRequired: true, transformFunction: null }, aiContextMenuItems: { classPropertyName: "aiContextMenuItems", publicName: "aiContextMenuItems", isSignal: true, isRequired: false, transformFunction: null }, aiFieldConfig: { classPropertyName: "aiFieldConfig", publicName: "aiFieldConfig", isSignal: true, isRequired: false, transformFunction: null }, aiReadonly: { classPropertyName: "aiReadonly", publicName: "aiReadonly", isSignal: true, isRequired: false, transformFunction: null }, aiPlugins: { classPropertyName: "aiPlugins", publicName: "aiPlugins", isSignal: true, isRequired: false, transformFunction: null }, aiMaxFields: { classPropertyName: "aiMaxFields", publicName: "aiMaxFields", isSignal: true, isRequired: false, transformFunction: null }, aiMaxRecords: { classPropertyName: "aiMaxRecords", publicName: "aiMaxRecords", isSignal: true, isRequired: false, transformFunction: null }, aiMaxSelectOptions: { classPropertyName: "aiMaxSelectOptions", publicName: "aiMaxSelectOptions", isSignal: true, isRequired: false, transformFunction: null }, aiReferences: { classPropertyName: "aiReferences", publicName: "aiReferences", isSignal: true, isRequired: true, transformFunction: null }, aiBuildRenderDataFn: { classPropertyName: "aiBuildRenderDataFn", publicName: "aiBuildRenderDataFn", isSignal: true, isRequired: false, transformFunction: null }, aiGetI18nTextByKey: { classPropertyName: "aiGetI18nTextByKey", publicName: "aiGetI18nTextByKey", isSignal: true, isRequired: false, transformFunction: null }, aiKeywords: { classPropertyName: "aiKeywords", publicName: "aiKeywords", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { aiRecords: "aiRecordsChange", aiFields: "aiFieldsChange", aiFieldsSizeMap: "aiFieldsSizeMapChange", aiTableInitialized: "aiTableInitialized", aiAddRecord: "aiAddRecord", aiAddField: "aiAddField", aiMoveField: "aiMoveField", aiUpdateFieldValues: "aiUpdateFieldValues", aiSetField: "aiSetField", aiSetFieldWidth: "aiSetFieldWidth", aiSetFieldStatType: "aiSetFieldStatType", aiMoveRecords: "aiMoveRecords", aiClick: "aiClick", aiDbClick: "aiDbClick" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.1.0", version: "19.2.10", type: AITableGridBase, isStandalone: true, selector: "ai-table-grid-base", inputs: { aiRecords: { classPropertyName: "aiRecords", publicName: "aiRecords", isSignal: true, isRequired: true, transformFunction: null }, aiFields: { classPropertyName: "aiFields", publicName: "aiFields", isSignal: true, isRequired: true, transformFunction: null }, aiFieldsSizeMap: { classPropertyName: "aiFieldsSizeMap", publicName: "aiFieldsSizeMap", isSignal: true, isRequired: true, transformFunction: null }, aiContextMenuItems: { classPropertyName: "aiContextMenuItems", publicName: "aiContextMenuItems", isSignal: true, isRequired: false, transformFunction: null }, aiFieldConfig: { classPropertyName: "aiFieldConfig", publicName: "aiFieldConfig", isSignal: true, isRequired: false, transformFunction: null }, aiReadonly: { classPropertyName: "aiReadonly", publicName: "aiReadonly", isSignal: true, isRequired: false, transformFunction: null }, aiPlugins: { classPropertyName: "aiPlugins", publicName: "aiPlugins", isSignal: true, isRequired: false, transformFunction: null }, aiMaxFields: { classPropertyName: "aiMaxFields", publicName: "aiMaxFields", isSignal: true, isRequired: false, transformFunction: null }, aiMaxRecords: { classPropertyName: "aiMaxRecords", publicName: "aiMaxRecords", isSignal: true, isRequired: false, transformFunction: null }, aiMaxSelectOptions: { classPropertyName: "aiMaxSelectOptions", publicName: "aiMaxSelectOptions", isSignal: true, isRequired: false, transformFunction: null }, aiReferences: { classPropertyName: "aiReferences", publicName: "aiReferences", isSignal: true, isRequired: true, transformFunction: null }, aiBuildRenderDataFn: { classPropertyName: "aiBuildRenderDataFn", publicName: "aiBuildRenderDataFn", isSignal: true, isRequired: false, transformFunction: null }, aiGetI18nTextByKey: { classPropertyName: "aiGetI18nTextByKey", publicName: "aiGetI18nTextByKey", isSignal: true, isRequired: false, transformFunction: null }, aiKeywords: { classPropertyName: "aiKeywords", publicName: "aiKeywords", isSignal: true, isRequired: false, transformFunction: null }, aiFrozenColumnCountFn: { classPropertyName: "aiFrozenColumnCountFn", publicName: "aiFrozenColumnCountFn", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { aiRecords: "aiRecordsChange", aiFields: "aiFieldsChange", aiFieldsSizeMap: "aiFieldsSizeMapChange", aiTableInitialized: "aiTableInitialized", aiAddRecord: "aiAddRecord", aiAddField: "aiAddField", aiMoveField: "aiMoveField", aiUpdateFieldValues: "aiUpdateFieldValues", aiSetField: "aiSetField", aiSetFieldWidth: "aiSetFieldWidth", aiSetFieldStatType: "aiSetFieldStatType", aiMoveRecords: "aiMoveRecords", aiClick: "aiClick", aiDbClick: "aiDbClick" }, ngImport: i0, template: '', isInline: true, changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableGridBase, decorators: [{
             type: Component,
@@ -11878,9 +11905,16 @@ class AITableDragComponent {
         this.containerHeight = this.elementRef.nativeElement.offsetHeight;
         const moveX = e.x - (this.mouseStartPosition?.x || 0);
         const moveY = e.y - (this.mouseStartPosition?.y || 0);
+        let direction = DragDirection.none;
         switch (drag.type) {
             case DragType.field:
-                this.movingColumn(drag, moveX);
+                if (e.movementX > 0) {
+                    direction = DragDirection.right;
+                }
+                else if (e.movementX < 0) {
+                    direction = DragDirection.left;
+                }
+                this.movingColumn(drag, moveX, direction);
                 break;
             case DragType.record:
                 this.movingRecord(drag, moveY);
@@ -11890,19 +11924,20 @@ class AITableDragComponent {
                 break;
         }
     }
-    movingColumn(drag, moveX) {
+    movingColumn(drag, moveX, direction) {
         const aiTable = this.aiTableGridSelectionService.aiTable;
         const scroll = { x: this.horizontalBarElement?.scrollLeft || 0, y: 0 };
         const coordinate = drag.coordinate;
         const fields = aiTable.gridData().fields;
         const width = this.calculateDragWidth(fields, coordinate, drag);
         const visibleColumnIndexMap = aiTable.context.visibleColumnsIndexMap();
+        const rowHeadWidth = aiTable.context.rowHeadWidth();
         const sourceColumnIndex = visibleColumnIndexMap.get(drag.sourceIds.values().next().value) || 0;
         const sourceColumnStartX = coordinate.getColumnOffset(sourceColumnIndex);
         const sourceColumnWidth = coordinate.getColumnWidth(sourceColumnIndex);
-        // TODO: 目前默认第一列为冻结列，后期支持设置冻结列需要处理
-        const isSourceColumnFrozen = sourceColumnIndex === 0;
-        const frozenColumnWidth = coordinate.getColumnWidth(0);
+        const frozenColumnCount = aiTable.context.frozenColumnCount();
+        const isSourceColumnFrozen = sourceColumnIndex === frozenColumnCount - 1;
+        const frozenColumnWidth = Array.from({ length: frozenColumnCount }).reduce((acc, _, index) => acc + coordinate.getColumnWidth(index), 0);
         const pointerX = moveX + sourceColumnStartX;
         // 拖拽中心点
         const dragCenter = sourceColumnWidth / 2;
@@ -11932,8 +11967,8 @@ class AITableDragComponent {
             if ((targetColumnIndex >= 0 && (targetColumnIndex - sourceColumnIndex > 1 || targetColumnIndex - sourceColumnIndex < 0)) ||
                 isLastColumn) {
                 let lineLeft = targetColumnStartX - scrollPosition.x;
-                const lineForFrozenX = lineLeft - frozenColumnWidth - aiTable.context.rowHeadWidth();
-                const rectDistanceFrozenX = rectLeft - frozenColumnWidth - aiTable.context.rowHeadWidth();
+                const lineForFrozenX = lineLeft - frozenColumnWidth - rowHeadWidth;
+                const rectDistanceFrozenX = rectLeft - frozenColumnWidth - rowHeadWidth;
                 if (lineForFrozenX < 0) {
                     if (Math.abs(rectDistanceFrozenX) < dragCenter) {
                         // 滚动中保持上一个位置
@@ -11949,6 +11984,12 @@ class AITableDragComponent {
                         };
                         return;
                     }
+                    if (isSourceColumnFrozen) {
+                        // 拖拽的列是冻结列，且目标列在冻结列左侧，不显示辅助线
+                        this.resetAuxiliaryLine();
+                        this.draggedData = null;
+                        return;
+                    }
                 }
                 this.setAuxiliaryLineStyles({
                     width: '2px',
@@ -11973,6 +12014,12 @@ class AITableDragComponent {
             }
         };
         updateTargetAndLine(currentRectLeft, newScrollPosition);
+        if (isSourceColumnFrozen &&
+            (direction === DragDirection.right || direction === DragDirection.none) &&
+            currentRectLeft < frozenColumnWidth + rowHeadWidth + AI_TABLE_AUTO_SCROLL_LEFT_THRESHOLD) {
+            // 拖拽的列是冻结列，方向是向右，且当前列在冻结列左侧，不滚动
+            return;
+        }
         this.scrollControllerService.scroll({
             container: {
                 width: this.containerWidth,
@@ -11989,7 +12036,7 @@ class AITableDragComponent {
                 horizontalElement: this.horizontalBarElement
             },
             frozenArea: {
-                left: frozenColumnWidth + aiTable.context.rowHeadWidth()
+                left: frozenColumnWidth + rowHeadWidth
             },
             edgeThreshold: {
                 left: AI_TABLE_AUTO_SCROLL_LEFT_THRESHOLD,
@@ -12214,7 +12261,14 @@ class AITableGrid extends AITableGridBase {
         this.isPopoverOpen = false;
         this.fieldHeadHeight = AI_TABLE_FIELD_HEAD_HEIGHT;
         this.containerRect = signal({ width: 0, height: 0 });
-        this.frozenColumnCount = signal(1);
+        this.frozenColumnCount = computed(() => {
+            const containerWidth = this.containerRect().width;
+            const aiFrozenColumnCountFn = this.aiFrozenColumnCountFn();
+            if (aiFrozenColumnCountFn) {
+                return aiFrozenColumnCountFn(containerWidth);
+            }
+            return AI_TABLE_MIN_FROZEN_COLUMN_COUNT;
+        });
         this.hasContainerRect = computed(() => {
             return this.containerRect().width > 0 && this.containerRect().height > 0;
         });
@@ -12421,6 +12475,7 @@ class AITableGrid extends AITableGridBase {
     }
     initContext() {
         this.aiTable.context = new RendererContext({
+            containerRect: this.containerRect,
             rowHeadWidth: computed(() => {
                 const aiFieldConfig = this.aiFieldConfig();
                 let width = AI_TABLE_ROW_HEAD_WIDTH_AND_DRAG_ICON_WIDTH;
@@ -12556,6 +12611,7 @@ class AITableGrid extends AITableGridBase {
                 if (expandRecordId !== recordId || expandFieldId !== fieldId) {
                     const field = this.aiTable.fieldsMap()[fieldId];
                     if (field.type === AITableFieldType.text) {
+                        this.aiTableGridSelectionService.clearSelection();
                         expandCell(this.aiTable, [recordId, fieldId]);
                     }
                     else {
@@ -13067,5 +13123,5 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
  * Generated bundle index. Do not edit.
  */
 
-export { AITable, AITableActionIcon, AITableAddField, AITableAreaType, AITableAvatarSize, AITableAvatarType, AITableBackground, AITableCellAttachment, AITableCellCheckbox, AITableCellLink, AITableCellProgress, AITableCellRate, AITableCellRichText, AITableCellText, AITableCells, AITableCheckType, AITableColumnHeads, AITableContextMenu, AITableDomGrid, AITableFieldHead, AITableFieldIcon, AITableFieldIsSameOptionPipe, AITableFieldSetting, AITableFrozenCells, AITableFrozenColumnHeads, AITableFrozenFieldShadow, AITableFrozenPlaceholderCells, AITableGrid, AITableGridEventService, AITableGridFieldService, AITableGridI18nKey, AITableGridI18nText, AITableGridSelectionService, AITableHoverRowHeads, AITableIcon, AITableMemberType, AITableMouseDownType, AITableOtherRows, AITablePlaceholderCells, AITableQueries, AITableRenderer, AITableRowType, AITableScrollableGroup, AITableSelectAllState, AITableTextComponent, AI_TABLE_ACTION_COMMON_RADIUS, AI_TABLE_ACTION_COMMON_RIGHT_PADDING, AI_TABLE_ACTION_COMMON_SIZE, AI_TABLE_AUTO_SCROLL_BOTTOM_THRESHOLD, AI_TABLE_AUTO_SCROLL_LEFT_THRESHOLD, AI_TABLE_AUTO_SCROLL_RIGHT_THRESHOLD, AI_TABLE_AUTO_SCROLL_TOP_THRESHOLD, AI_TABLE_BLANK, AI_TABLE_CELL, AI_TABLE_CELL_ACTIVE_BORDER_WIDTH, AI_TABLE_CELL_ADD_ITEM_BUTTON_SIZE, AI_TABLE_CELL_ATTACHMENT_ADD, AI_TABLE_CELL_ATTACHMENT_FILE, AI_TABLE_CELL_BORDER, AI_TABLE_CELL_DELETE_ITEM_BUTTON_SIZE, AI_TABLE_CELL_DELETE_ITEM_BUTTON_SIZE_OFFSET, AI_TABLE_CELL_EDIT, AI_TABLE_CELL_EMOJI_PADDING, AI_TABLE_CELL_EMOJI_SIZE, AI_TABLE_CELL_FIELD_ITEM_HEIGHT, AI_TABLE_CELL_LINE_BORDER, AI_TABLE_CELL_MAX_ROW_COUNT, AI_TABLE_CELL_MEMBER_ITEM_HEIGHT, AI_TABLE_CELL_MEMBER_ITEM_PADDING, AI_TABLE_CELL_MEMBER_MAX_HEIGHT, AI_TABLE_CELL_MULTI_DOT_RADIUS, AI_TABLE_CELL_MULTI_ITEM_MARGIN_LEFT, AI_TABLE_CELL_MULTI_ITEM_MARGIN_TOP, AI_TABLE_CELL_MULTI_ITEM_MIN_WIDTH, AI_TABLE_CELL_MULTI_PADDING_LEFT, AI_TABLE_CELL_MULTI_PADDING_TOP, AI_TABLE_CELL_PADDING, AI_TABLE_COMMON_FONT_SIZE, AI_TABLE_DEFAULT_COLUMN_WIDTH, AI_TABLE_DOT_RADIUS, AI_TABLE_FIELD_ADD_BUTTON, AI_TABLE_FIELD_ADD_BUTTON_WIDTH, AI_TABLE_FIELD_HEAD, AI_TABLE_FIELD_HEAD_HEIGHT, AI_TABLE_FIELD_HEAD_ICON_GAP_SIZE, AI_TABLE_FIELD_HEAD_MORE, AI_TABLE_FIELD_HEAD_OPACITY_LINE, AI_TABLE_FIELD_HEAD_SELECT_CHECKBOX, AI_TABLE_FIELD_HEAD_TEXT_MIN_WIDTH, AI_TABLE_FIELD_ITEM_MARGIN_RIGHT, AI_TABLE_FIELD_MAX_WIDTH, AI_TABLE_FIELD_MIDDLE_WIDTH, AI_TABLE_FIELD_MINI_WIDTH, AI_TABLE_FIELD_MIN_WIDTH, AI_TABLE_FIELD_STAT_BG, AI_TABLE_FIELD_STAT_CONTAINER_HEIGHT, AI_TABLE_FIELD_STAT_INNER_HEIGHT, AI_TABLE_FILE_ICON_ITEM_HEIGHT, AI_TABLE_FILE_ICON_SIZE, AI_TABLE_FILL_HANDLE, AI_TABLE_GRID_FIELD_SERVICE_MAP, AI_TABLE_ICON_COMMON_SIZE, AI_TABLE_INDEX_FIELD_TEXT, AI_TABLE_MEMBER_AVATAR_SIZE, AI_TABLE_MEMBER_ITEM_AVATAR_MARGIN_RIGHT, AI_TABLE_MEMBER_ITEM_PADDING_RIGHT, AI_TABLE_MIN_TEXT_WIDTH, AI_TABLE_OFFSET, AI_TABLE_OPTION_ITEM_FONT_SIZE, AI_TABLE_OPTION_ITEM_HEIGHT, AI_TABLE_OPTION_ITEM_PADDING, AI_TABLE_OPTION_ITEM_RADIUS, AI_TABLE_OPTION_MULTI_ITEM_FONT_SIZE, AI_TABLE_PIECE_RADIUS, AI_TABLE_PIECE_WIDTH, AI_TABLE_POPOVER_LEFT_OFFSET, AI_TABLE_PREVENT_CLEAR_SELECTION_CLASS, AI_TABLE_PROGRESS_BAR_HEIGHT, AI_TABLE_PROGRESS_BAR_POINTER_HEIGHT, AI_TABLE_PROGRESS_BAR_POINTER_WIDTH, AI_TABLE_PROGRESS_BAR_RADIUS, AI_TABLE_PROGRESS_TEXT_WIDTH, AI_TABLE_RATE_MAX, AI_TABLE_ROW_ADD_BUTTON, AI_TABLE_ROW_BLANK_HEIGHT, AI_TABLE_ROW_DRAG, AI_TABLE_ROW_DRAG_ICON_WIDTH, AI_TABLE_ROW_HEAD, AI_TABLE_ROW_HEAD_SIZE, AI_TABLE_ROW_HEAD_WIDTH, AI_TABLE_ROW_HEAD_WIDTH_AND_DRAG_ICON_WIDTH, AI_TABLE_ROW_HEIGHT, AI_TABLE_ROW_SELECT_CHECKBOX, AI_TABLE_SCROLL_BAR_PADDING, AI_TABLE_SCROLL_BAR_SIZE, AI_TABLE_TAG_FONT_SIZE, AI_TABLE_TAG_PADDING, AI_TABLE_TEXT_GAP, AI_TABLE_TEXT_LINE_HEIGHT, AbstractEditCellEditor, AddOutlinedPath, AngleDownPath, AttachmentField, AttachmentPath, CellDrawer, Check, Colors, ColumnCalendarFilledPath, ColumnCheckboxFilledPath, ColumnLinkOutlinedPath, ColumnMemberFilledPath, ColumnMultipleFillPath, ColumnNumberFilledPath, ColumnProgressFilledPath, ColumnRatingFilledPath, ColumnRichTextFilledPath, ColumnSelectFilledPath, ColumnTextFilledPath, Coordinate, CoverCellBase, DBL_CLICK_EDIT_TYPE, DEFAULT_FONT_FAMILY, DEFAULT_FONT_SIZE, DEFAULT_FONT_STYLE, DEFAULT_FONT_WEIGHT, DEFAULT_ICON_SHAPE, DEFAULT_ICON_SIZE, DEFAULT_POINT_POSITION, DEFAULT_SCROLL_STATE, DEFAULT_TEXT_ALIGN_CENTER, DEFAULT_TEXT_ALIGN_LEFT, DEFAULT_TEXT_ALIGN_RIGHT, DEFAULT_TEXT_DECORATION, DEFAULT_TEXT_ELLIPSIS, DEFAULT_TEXT_FILL, DEFAULT_TEXT_LINE_HEIGHT, DEFAULT_TEXT_LISTENING, DEFAULT_TEXT_MAX_CACHE, DEFAULT_TEXT_MAX_HEIGHT, DEFAULT_TEXT_SCALE, DEFAULT_TEXT_TRANSFORMS_ENABLED, DEFAULT_TEXT_VERTICAL_ALIGN_MIDDLE, DEFAULT_TEXT_VERTICAL_ALIGN_TOP, DEFAULT_TEXT_WRAP, DEFAULT_WRAP_TEXT_MAX_ROW, DateCellEditorComponent, DateField, DepartmentOutlinedPath, Drawer, EditPath, FONT_SIZE_SM, FieldModelMap, IconPathMap, IsSelectRecordPipe, KO_CONTAINER_TOKEN, KoComponent, KoContainer, KoShape, KoShapeTypes, KoStage, LinkCellEditorComponent, LinkField, MIN_COLUMN_WIDTH, MemberField, MemberSettingPipe, MoreStandOutlinedPath, NumberCellEditorComponent, NumberField, ProgressField, RateField, RendererContext, RichTextField, RowDragPath, RowHeight, SelectCellEditorComponent, SelectField, SelectOptionComponent, SelectOptionPipe, SelectOptionsPipe, SelectSettingPipe, StarFill, TextCellEditorComponent, TextField, TextMeasure, Unchecked, UserPipe, WebOutlinedPath, aiTableFragmentAttribute, aiTableImageConfigToKonvaConfig, aiTableRectConfigToKonvaConfig, aiTableTextConfigToKonvaConfig, applyNodeProps, buildClipboardData, buildGridData, buildGridLinearRows, castToString, cellDrawer, clearCells, compareNumber, compareOption, compareString, createAITable, createActiveCellBorder, createCells, createDefaultField, createDefaultFieldName, createListener, dragFillHighlightArea, drawer, expandCell, extractLinkUrl, extractText, generateNewName, generateTargetName, getAvatarBgColor, getAvatarShortName, getCellEditorBorderSpace, getCellHorizontalPosition, getColumnIndicesSizeMap, getCoverCell, getDateFieldValues, getDefaultFieldOptions, getDefaultFieldValue, getDefaultI18nTextByKey, getDetailByTargetName, getEditorBoxOffset, getEditorSpace, getFieldOptionByField, getFieldOptionMap, getFieldOptions, getFieldValue, getFileThumbnailSvgString, getFillDirection, getHoverEditorBoxOffset, getHoverEditorSpace, getI18nTextByKey, getMousePosition, getName, getOptionsByFieldAndRecords, getPlaceHolderCellsConfigs, getStartAndEndCell, getSystemFieldValue, getTargetName, getTextWidth, getVisibleRangeInfo, graphemeSplitter, handleMouseStyle, hasIntersect, idCreator, idsCreator, imageCache, isActiveCell, isArrayField, isCellMatchKeywords, isClipboardReadSupported, isClipboardReadTextSupported, isClipboardWriteSupported, isClipboardWriteTextSupported, isDateFiled, isEmptyOrNot, isMac, isMeetFilter, isNumberFiled, isSameFieldOption, isSelectedField, isSystemField, isVirtualKey, isWindows, isWindowsOS, isWithinFrozenColumnBoundary, performFill, processPastedValueForSelect, readFromClipboard, scrollMax, setMouseStyle, shortIdCreator, shortIdsCreator, statDateRangeOfDays, statDateRangeOfMonths, statEarliestTime, statLatestTime, stringInclude, textDataCache, toAttachmentFieldValue, toDateFieldValue, toLinkFieldValue, toMemberFieldValue, toNumberFieldValue, toProgressFieldValue, toRateFieldValue, toRichTextFieldValue, toSelectFieldValue, toTextFieldValue, transformToCellText, updatePicture, writeToAITable, writeToClipboard, zhIntlCollator };
+export { AITable, AITableActionIcon, AITableAddField, AITableAreaType, AITableAvatarSize, AITableAvatarType, AITableBackground, AITableCellAttachment, AITableCellCheckbox, AITableCellLink, AITableCellProgress, AITableCellRate, AITableCellRichText, AITableCellText, AITableCells, AITableCheckType, AITableColumnHeads, AITableContextMenu, AITableDomGrid, AITableFieldHead, AITableFieldIcon, AITableFieldIsSameOptionPipe, AITableFieldSetting, AITableFrozenCells, AITableFrozenColumnHeads, AITableFrozenFieldShadow, AITableFrozenPlaceholderCells, AITableGrid, AITableGridEventService, AITableGridFieldService, AITableGridI18nKey, AITableGridI18nText, AITableGridSelectionService, AITableHoverRowHeads, AITableIcon, AITableMemberType, AITableMouseDownType, AITableOtherRows, AITablePlaceholderCells, AITableQueries, AITableRenderer, AITableRowType, AITableScrollableGroup, AITableSelectAllState, AITableTextComponent, AI_TABLE_ACTION_COMMON_RADIUS, AI_TABLE_ACTION_COMMON_RIGHT_PADDING, AI_TABLE_ACTION_COMMON_SIZE, AI_TABLE_AUTO_SCROLL_BOTTOM_THRESHOLD, AI_TABLE_AUTO_SCROLL_LEFT_THRESHOLD, AI_TABLE_AUTO_SCROLL_RIGHT_THRESHOLD, AI_TABLE_AUTO_SCROLL_TOP_THRESHOLD, AI_TABLE_BLANK, AI_TABLE_CELL, AI_TABLE_CELL_ACTIVE_BORDER_WIDTH, AI_TABLE_CELL_ADD_ITEM_BUTTON_SIZE, AI_TABLE_CELL_ATTACHMENT_ADD, AI_TABLE_CELL_ATTACHMENT_FILE, AI_TABLE_CELL_BORDER, AI_TABLE_CELL_DELETE_ITEM_BUTTON_SIZE, AI_TABLE_CELL_DELETE_ITEM_BUTTON_SIZE_OFFSET, AI_TABLE_CELL_EDIT, AI_TABLE_CELL_EMOJI_PADDING, AI_TABLE_CELL_EMOJI_SIZE, AI_TABLE_CELL_FIELD_ITEM_HEIGHT, AI_TABLE_CELL_LINE_BORDER, AI_TABLE_CELL_MAX_ROW_COUNT, AI_TABLE_CELL_MEMBER_ITEM_HEIGHT, AI_TABLE_CELL_MEMBER_ITEM_PADDING, AI_TABLE_CELL_MEMBER_MAX_HEIGHT, AI_TABLE_CELL_MULTI_DOT_RADIUS, AI_TABLE_CELL_MULTI_ITEM_MARGIN_LEFT, AI_TABLE_CELL_MULTI_ITEM_MARGIN_TOP, AI_TABLE_CELL_MULTI_ITEM_MIN_WIDTH, AI_TABLE_CELL_MULTI_PADDING_LEFT, AI_TABLE_CELL_MULTI_PADDING_TOP, AI_TABLE_CELL_PADDING, AI_TABLE_COMMON_FONT_SIZE, AI_TABLE_DEFAULT_COLUMN_WIDTH, AI_TABLE_DOT_RADIUS, AI_TABLE_FIELD_ADD_BUTTON, AI_TABLE_FIELD_ADD_BUTTON_WIDTH, AI_TABLE_FIELD_HEAD, AI_TABLE_FIELD_HEAD_HEIGHT, AI_TABLE_FIELD_HEAD_ICON_GAP_SIZE, AI_TABLE_FIELD_HEAD_MORE, AI_TABLE_FIELD_HEAD_OPACITY_LINE, AI_TABLE_FIELD_HEAD_SELECT_CHECKBOX, AI_TABLE_FIELD_HEAD_TEXT_MIN_WIDTH, AI_TABLE_FIELD_ITEM_MARGIN_RIGHT, AI_TABLE_FIELD_MAX_WIDTH, AI_TABLE_FIELD_MIDDLE_WIDTH, AI_TABLE_FIELD_MINI_WIDTH, AI_TABLE_FIELD_MIN_WIDTH, AI_TABLE_FIELD_STAT_BG, AI_TABLE_FIELD_STAT_CONTAINER_HEIGHT, AI_TABLE_FIELD_STAT_INNER_HEIGHT, AI_TABLE_FILE_ICON_ITEM_HEIGHT, AI_TABLE_FILE_ICON_SIZE, AI_TABLE_FILL_HANDLE, AI_TABLE_GRID_FIELD_SERVICE_MAP, AI_TABLE_ICON_COMMON_SIZE, AI_TABLE_INDEX_FIELD_TEXT, AI_TABLE_MEMBER_AVATAR_SIZE, AI_TABLE_MEMBER_ITEM_AVATAR_MARGIN_RIGHT, AI_TABLE_MEMBER_ITEM_PADDING_RIGHT, AI_TABLE_MIN_TEXT_WIDTH, AI_TABLE_OFFSET, AI_TABLE_OPTION_ITEM_FONT_SIZE, AI_TABLE_OPTION_ITEM_HEIGHT, AI_TABLE_OPTION_ITEM_PADDING, AI_TABLE_OPTION_ITEM_RADIUS, AI_TABLE_OPTION_MULTI_ITEM_FONT_SIZE, AI_TABLE_PIECE_RADIUS, AI_TABLE_PIECE_WIDTH, AI_TABLE_POPOVER_LEFT_OFFSET, AI_TABLE_PREVENT_CLEAR_SELECTION_CLASS, AI_TABLE_PROGRESS_BAR_HEIGHT, AI_TABLE_PROGRESS_BAR_POINTER_HEIGHT, AI_TABLE_PROGRESS_BAR_POINTER_WIDTH, AI_TABLE_PROGRESS_BAR_RADIUS, AI_TABLE_PROGRESS_TEXT_WIDTH, AI_TABLE_RATE_MAX, AI_TABLE_ROW_ADD_BUTTON, AI_TABLE_ROW_BLANK_HEIGHT, AI_TABLE_ROW_DRAG, AI_TABLE_ROW_DRAG_ICON_WIDTH, AI_TABLE_ROW_HEAD, AI_TABLE_ROW_HEAD_SIZE, AI_TABLE_ROW_HEAD_WIDTH, AI_TABLE_ROW_HEAD_WIDTH_AND_DRAG_ICON_WIDTH, AI_TABLE_ROW_HEIGHT, AI_TABLE_ROW_SELECT_CHECKBOX, AI_TABLE_SCROLL_BAR_PADDING, AI_TABLE_SCROLL_BAR_SIZE, AI_TABLE_TAG_FONT_SIZE, AI_TABLE_TAG_PADDING, AI_TABLE_TEXT_GAP, AI_TABLE_TEXT_LINE_HEIGHT, AbstractEditCellEditor, AddOutlinedPath, AngleDownPath, AttachmentField, AttachmentPath, CellDrawer, Check, Colors, ColumnCalendarFilledPath, ColumnCheckboxFilledPath, ColumnLinkOutlinedPath, ColumnMemberFilledPath, ColumnMultipleFillPath, ColumnNumberFilledPath, ColumnProgressFilledPath, ColumnRatingFilledPath, ColumnRichTextFilledPath, ColumnSelectFilledPath, ColumnTextFilledPath, Coordinate, CoverCellBase, DBL_CLICK_EDIT_TYPE, DEFAULT_FONT_FAMILY, DEFAULT_FONT_SIZE, DEFAULT_FONT_STYLE, DEFAULT_FONT_WEIGHT, DEFAULT_ICON_SHAPE, DEFAULT_ICON_SIZE, DEFAULT_POINT_POSITION, DEFAULT_SCROLL_STATE, DEFAULT_TEXT_ALIGN_CENTER, DEFAULT_TEXT_ALIGN_LEFT, DEFAULT_TEXT_ALIGN_RIGHT, DEFAULT_TEXT_DECORATION, DEFAULT_TEXT_ELLIPSIS, DEFAULT_TEXT_FILL, DEFAULT_TEXT_LINE_HEIGHT, DEFAULT_TEXT_LISTENING, DEFAULT_TEXT_MAX_CACHE, DEFAULT_TEXT_MAX_HEIGHT, DEFAULT_TEXT_SCALE, DEFAULT_TEXT_TRANSFORMS_ENABLED, DEFAULT_TEXT_VERTICAL_ALIGN_MIDDLE, DEFAULT_TEXT_VERTICAL_ALIGN_TOP, DEFAULT_TEXT_WRAP, DEFAULT_WRAP_TEXT_MAX_ROW, DateCellEditorComponent, DateField, DepartmentOutlinedPath, Drawer, EditPath, FONT_SIZE_SM, FieldModelMap, IconPathMap, IsSelectRecordPipe, KO_CONTAINER_TOKEN, KoComponent, KoContainer, KoShape, KoShapeTypes, KoStage, LinkCellEditorComponent, LinkField, MIN_COLUMN_WIDTH, MemberField, MemberSettingPipe, MoreStandOutlinedPath, NumberCellEditorComponent, NumberField, ProgressField, RateField, RendererContext, RichTextField, RowDragPath, RowHeight, SelectCellEditorComponent, SelectField, SelectOptionComponent, SelectOptionPipe, SelectOptionsPipe, SelectSettingPipe, StarFill, TextCellEditorComponent, TextField, TextMeasure, Unchecked, UserPipe, WebOutlinedPath, aiTableFragmentAttribute, aiTableImageConfigToKonvaConfig, aiTableRectConfigToKonvaConfig, aiTableTextConfigToKonvaConfig, applyNodeProps, buildClipboardData, buildGridData, buildGridLinearRows, castToString, cellDrawer, clearCells, compareNumber, compareOption, compareString, createAITable, createActiveCellBorder, createCells, createDefaultField, createDefaultFieldName, createListener, dragFillHighlightArea, drawer, expandCell, extractLinkUrl, extractText, generateNewName, generateTargetName, getAvatarBgColor, getAvatarShortName, getCellEditorBorderSpace, getCellHorizontalPosition, getColumnIndicesSizeMap, getCoverCell, getDateFieldValues, getDefaultFieldOptions, getDefaultFieldValue, getDefaultI18nTextByKey, getDetailByTargetName, getEditorBoxOffset, getEditorSpace, getFieldOptionByField, getFieldOptionMap, getFieldOptions, getFieldValue, getFileThumbnailSvgString, getFillDirection, getHoverEditorBoxOffset, getHoverEditorSpace, getI18nTextByKey, getMousePosition, getName, getOptionsByFieldAndRecords, getPlaceHolderCellsConfigs, getStartAndEndCell, getSystemFieldValue, getTargetName, getTextWidth, getVisibleRangeInfo, graphemeSplitter, handleMouseStyle, hasIntersect, idCreator, idsCreator, imageCache, isActiveCell, isArrayField, isCellMatchKeywords, isClipboardReadSupported, isClipboardReadTextSupported, isClipboardWriteSupported, isClipboardWriteTextSupported, isDateFiled, isEmptyOrNot, isMac, isMeetFilter, isNumberFiled, isSameFieldOption, isSelectedField, isSystemField, isVirtualKey, isWindows, isWindowsOS, isWithinFrozenColumnBoundary, performFill, processPastedValueForSelect, readFromClipboard, scrollMax, setExpandCellInfo, setMouseStyle, shortIdCreator, shortIdsCreator, statDateRangeOfDays, statDateRangeOfMonths, statEarliestTime, statLatestTime, stringInclude, textDataCache, toAttachmentFieldValue, toDateFieldValue, toLinkFieldValue, toMemberFieldValue, toNumberFieldValue, toProgressFieldValue, toRateFieldValue, toRichTextFieldValue, toSelectFieldValue, toTextFieldValue, transformToCellText, updatePicture, writeToAITable, writeToClipboard, zhIntlCollator };
 //# sourceMappingURL=ai-table-grid.mjs.map