@ai-table/grid 0.1.16 → 0.1.18

package/components/field-setting/field-setting.component.scss

@@ -4,4 +4,9 @@
     .thy-popover-container {
         overflow-y: auto;
     }
-}
+}
+
+.ai-table-field-type-menu {
+    max-height: 296px;
+    overflow-y: auto;
+}

package/fesm2022/ai-table-grid.mjs

@@ -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, DateFieldBase, isDateValid, LinkFieldBase, MemberFieldBase, NumberFieldBase, ProgressFieldBase, RateFieldBase, RichTextFieldBase, SelectFieldBase, generateOptionsByTexts, TextFieldBase, FieldModelBaseMap } from '@ai-table/utils';
+import { AITableFieldGroup, AITableFieldType, AITableRowColumnType, DragType, isUndefinedOrNull, idCreator as idCreator$1, isUrl, AITableSelectOptionStyle, isEmpty, AITableFilterOperation, AttachmentFieldBase, DateFieldBase, isDateValid, isDateAndReturnDate, LinkFieldBase, MemberFieldBase, NumberFieldBase, ProgressFieldBase, isProgressAndReturnValue, RateFieldBase, RichTextFieldBase, SelectFieldBase, generateOptionsByTexts, TextFieldBase, FieldModelBaseMap } from '@ai-table/utils';
 import ObjectID from 'bson-objectid';
 import { customAlphabet } from 'nanoid';
 import * as _ from 'lodash';
@@ -2827,11 +2827,7 @@ function toDateFieldValue(plainText, targetField, originData) {
         .map((text) => text.trim())
         .filter((text) => !!text);
     const value = texts && texts.length ? texts[0].trim() : plainText.trim();
-    const dateValue = transformDateValue(value);
-    if (dateValue) {
-        return dateValue;
-    }
-    return null;
+    return transformDateValue(value);
 }
 function cellValueToSortValue$3(cellValue) {
     if (isUndefinedOrNull(cellValue) || !isDateValid(cellValue)) {
@@ -2840,44 +2836,13 @@ function cellValueToSortValue$3(cellValue) {
     return cellValue?.timestamp ?? 0;
 }
 function transformDateValue(text) {
-    const value = text.trim();
-    if (!value || isEmpty(value))
-        return null;
-    // 基础日期格式：支持识别 - / . 年月日 作为分隔符
-    const datePattern = String.raw `(?:(\d{2}|\d{4})[-/.年](\d{1,2})[-/.月](\d{1,2})日?)`;
-    const timePattern = String.raw `(?:\s+(\d{1,2}):(\d{1,2})(?::(\d{1,2}))?)?`;
-    const pattern = new RegExp(`^${datePattern}${timePattern}$`);
-    const match = value.match(pattern);
-    if (!match)
-        return null;
-    try {
-        let [_, year, month, day] = match;
-        if (year.length === 2) {
-            const currentYear = new Date().getFullYear();
-            const century = Math.floor(currentYear / 100) * 100;
-            const twoDigitYear = parseInt(year);
-            year = String(twoDigitYear > currentYear % 100 ? century - 100 + twoDigitYear : century + twoDigitYear);
-        }
-        const monthNum = parseInt(month);
-        const dayNum = parseInt(day);
-        if (monthNum < 1 || monthNum > 12) {
-            console.warn('Invalid month:', monthNum);
-            return null;
-        }
-        const maxDays = new Date(parseInt(year), monthNum, 0).getDate();
-        if (dayNum < 1 || dayNum > maxDays) {
-            console.warn('Invalid day:', dayNum);
-            return null;
-        }
-        const standardDate = `${year}-${String(monthNum).padStart(2, '0')}-${String(dayNum).padStart(2, '0')}`;
+    const date = isDateAndReturnDate(text);
+    if (date) {
         return {
-            timestamp: new TinyDate(standardDate).getUnixTime()
+            timestamp: new TinyDate(date).getUnixTime()
         };
     }
-    catch (error) {
-        console.warn('Invalid date:', value);
-        return null;
-    }
+    return null;
 }
 
 class LinkField extends LinkFieldBase {
@@ -3117,20 +3082,7 @@ function toProgressFieldValue(plainText, targetField, originData) {
                 break;
         }
     }
-    const progressRegex = /^(?:100|[1-9]?\d(?:\.\d+)?)\s*%$/;
-    if (progressRegex.test(value)) {
-        value = parseFloat(value);
-    }
-    if (!isEmpty(value)) {
-        let progressValue = Number(value);
-        if (!Number.isNaN(progressValue)) {
-            progressValue = Math.round(progressValue);
-            if (progressValue >= 0 && progressValue <= 100) {
-                return progressValue;
-            }
-        }
-    }
-    return null;
+    return isProgressAndReturnValue(value);
 }
 
 class RateField extends RateFieldBase {
@@ -9023,7 +8975,7 @@ class AITableFieldSetting {
         this.thyPopoverRef.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableFieldSetting, deps: [], target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: AITableFieldSetting, isStandalone: true, selector: "ai-table-field-setting", inputs: { aiEditField: { classPropertyName: "aiEditField", publicName: "aiEditField", isSignal: true, isRequired: true, transformFunction: null }, aiTable: { classPropertyName: "aiTable", publicName: "aiTable", isSignal: true, isRequired: true, transformFunction: null }, aiExternalTemplate: { classPropertyName: "aiExternalTemplate", publicName: "aiExternalTemplate", isSignal: true, isRequired: false, transformFunction: null }, aiReferences: { classPropertyName: "aiReferences", publicName: "aiReferences", isSignal: true, isRequired: false, transformFunction: null }, isUpdate: { classPropertyName: "isUpdate", publicName: "isUpdate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { aiEditField: "aiEditFieldChange", addField: "addField", setField: "setField" }, host: { classAttribute: "field-setting d-block pl-5 pr-5 pb-5 pt-4" }, ngImport: i0, template: "<form thyForm name=\"createPropertyForm\" [thyFormValidatorConfig]=\"validatorConfig()\" thyLayout=\"vertical\">\n    <thy-form-group thyLabelRequired [thyLabelText]=\"i18nTexts().columnName\">\n        <thy-input-group>\n            <input\n                thyInput\n                [thyAutofocus]=\"true\"\n                name=\"fieldName\"\n                [maxlength]=\"fieldMaxLength\"\n                [(ngModel)]=\"aiEditField().name\"\n                (ngModelChange)=\"nameChange($event)\"\n                required\n                [placeholder]=\"i18nTexts().columnNamePlaceholder\"\n                [thyUniqueCheck]=\"checkUniqueName\"\n            />\n            <ng-template #suffix>\n                <thy-input-count></thy-input-count>\n            </ng-template>\n        </thy-input-group>\n    </thy-form-group>\n    <thy-form-group [thyLabelText]=\"i18nTexts().fieldType\">\n        <div class=\"thy-dropdown-menu py-0\">\n            <div class=\"ml-n5 mr-n5\">\n                <span thyDropdownMenuItem [thyDropdown]=\"menu\" thyTrigger=\"hover\" thyPlacement=\"right\" (click)=\"fieldTypeClick($event)\">\n                    <thy-icon thyDropdownMenuItemIcon [thyIconName]=\"selectedFieldOption().icon\"></thy-icon>\n                    <span thyDropdownMenuItemName>{{ selectedFieldOption().name }}</span>\n                    <thy-icon thyDropdownMenuItemExtendIcon thyIconName=\"angle-right\" class=\"text-desc\"></thy-icon>\n                </span>\n            </div>\n        </div>\n\n        @if (selectedFieldOption().type === aITableFieldType.member) {\n            <div class=\"d-flex justify-content-between mt-3\">\n                {{ i18nTexts().allowMultipleMembers }}\n                <thy-switch\n                    name=\"isMultipleMember\"\n                    [(ngModel)]=\"isMultipleMember\"\n                    (ngModelChange)=\"multipleMemberChange()\"\n                    thySize=\"sm\"\n                ></thy-switch>\n            </div>\n        }\n    </thy-form-group>\n    @if (aiExternalTemplate()) {\n        <ng-container *ngTemplateOutlet=\"aiExternalTemplate()\"></ng-container>\n    }\n    <thy-form-group-footer thyAlign=\"right\">\n        <button thyButton=\"link-secondary\" (click)=\"cancel()\" thySize=\"sm\">{{ i18nTexts().cancel }}</button>\n        <button thyButton=\"primary\" (thyFormSubmit)=\"editFieldProperty()\" thySize=\"sm\">{{ i18nTexts().confirm }}</button>\n    </thy-form-group-footer>\n</form>\n\n<thy-dropdown-menu #menu>\n    <thy-dropdown-menu-group [thyTitle]=\"i18nTexts().base\">\n        @for (item of fieldOptions().base; track $index) {\n            <a\n                thyDropdownMenuItem\n                href=\"javascript:;\"\n                [ngClass]=\"{\n                    active: (item | fieldIsSameOption: aiEditField())\n                }\"\n                (click)=\"selectFieldType(item)\"\n            >\n                <thy-icon [thyIconName]=\"item.icon!\"></thy-icon>\n                <span thyDropdownMenuItemName>{{ item.name }}</span>\n            </a>\n        }\n    </thy-dropdown-menu-group>\n\n    <thy-dropdown-menu-group [thyTitle]=\"i18nTexts().advanced\">\n        @for (item of fieldOptions().advanced; track $index) {\n            <a\n                thyDropdownMenuItem\n                href=\"javascript:;\"\n                [ngClass]=\"{\n                    active: (item | fieldIsSameOption: aiEditField())\n                }\"\n                (click)=\"selectFieldType(item)\"\n            >\n                <thy-icon [thyIconName]=\"item.icon!\"></thy-icon>\n                <span thyDropdownMenuItemName>{{ item.name }}</span>\n            </a>\n        }\n    </thy-dropdown-menu-group>\n</thy-dropdown-menu>\n", styles: [":host{width:350px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "component", type: ThyInputGroup, selector: "thy-input-group", inputs: ["thyAppendText", "thyAppendTextTranslateKey", "thyPrependText", "thyPrependTextTranslateKey", "thySize"] }, { kind: "component", type: ThyInputCount, selector: "thy-input-count", inputs: ["thyInput"] }, { kind: "directive", type: ThyInputDirective, selector: "input[thyInput], select[thyInput], textarea[thyInput]", inputs: ["thySize"], exportAs: ["thyInput"] }, { kind: "directive", type: ThyUniqueCheckValidator, selector: "[thyUniqueCheck]", inputs: ["thyUniqueCheck"] }, { kind: "component", type: ThyDropdownMenuComponent, selector: "thy-dropdown-menu", inputs: ["thyWidth", "thyImmediateRender"] }, { kind: "component", type: ThyDropdownMenuGroup, selector: "thy-dropdown-menu-group", inputs: ["thyTitle"] }, { kind: "directive", type: ThyDropdownDirective, selector: "[thyDropdown]", inputs: ["thyDropdownMenu", "thyDropdown", "thyTrigger", "thyShowDelay", "thyHideDelay", "thyActiveClass", "thyPopoverOptions", "thyPlacement", "thyMenuInsideClosable", "thyPanelClass"], outputs: ["thyActiveChange"] }, { kind: "directive", type: ThyDropdownMenuItemDirective, selector: "[thyDropdownMenuItem]", inputs: ["thyType", "thyDisabled"] }, { kind: "directive", type: ThyDropdownMenuItemIconDirective, selector: "[thyDropdownMenuItemIcon]" }, { kind: "directive", type: ThyDropdownMenuItemNameDirective, selector: "[thyDropdownMenuItemName]" }, { kind: "directive", type: ThyDropdownMenuItemExtendIconDirective, selector: "[thyDropdownMenuItemExtendIcon]" }, { kind: "component", type: ThyButton, selector: "thy-button,[thy-button],[thyButton]", inputs: ["thyButton", "thyType", "thyLoading", "thyLoadingText", "thySize", "thyIcon", "thyBlock"] }, { kind: "component", type: ThySwitch, selector: "thy-switch", inputs: ["thyType", "thySize", "thyDisabled", "thyLoading"], outputs: ["thyChange"] }, { kind: "ngmodule", type: ThyFormModule }, { kind: "directive", type: i2.ThyFormDirective, selector: "[thyForm],[thy-form]", inputs: ["thyLayout", "thyEnterKeyMode", "thyFormValidatorConfig"], exportAs: ["thyForm"] }, { kind: "component", type: i2.ThyFormGroup, selector: "thy-form-group", inputs: ["thyLabelText", "thyLabelTextTranslateKey", "thyLabelRequired", "thyLabelPaddingTopClear", "thyFeedbackIcon", "thyTipsMode", "thyTips", "thyTipsTranslateKey", "thyRowFill"] }, { kind: "directive", type: i2.ThyFormSubmitDirective, selector: "[thyFormSubmit],[thy-form-submit]", outputs: ["thyFormSubmit"] }, { kind: "component", type: i2.ThyFormGroupFooter, selector: "thy-form-group-footer", inputs: ["thyAlign"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ThyAutofocusDirective, selector: "input[thyAutofocus],textarea[thyAutofocus]", inputs: ["thyAutofocus", "thyAutoSelect"] }, { kind: "pipe", type: AITableFieldIsSameOptionPipe, name: "fieldIsSameOption" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: AITableFieldSetting, isStandalone: true, selector: "ai-table-field-setting", inputs: { aiEditField: { classPropertyName: "aiEditField", publicName: "aiEditField", isSignal: true, isRequired: true, transformFunction: null }, aiTable: { classPropertyName: "aiTable", publicName: "aiTable", isSignal: true, isRequired: true, transformFunction: null }, aiExternalTemplate: { classPropertyName: "aiExternalTemplate", publicName: "aiExternalTemplate", isSignal: true, isRequired: false, transformFunction: null }, aiReferences: { classPropertyName: "aiReferences", publicName: "aiReferences", isSignal: true, isRequired: false, transformFunction: null }, isUpdate: { classPropertyName: "isUpdate", publicName: "isUpdate", isSignal: true, isRequired: false, transformFunction: null } }, outputs: { aiEditField: "aiEditFieldChange", addField: "addField", setField: "setField" }, host: { classAttribute: "field-setting d-block pl-5 pr-5 pb-5 pt-4" }, ngImport: i0, template: "<form thyForm name=\"createPropertyForm\" [thyFormValidatorConfig]=\"validatorConfig()\" thyLayout=\"vertical\">\n    <thy-form-group thyLabelRequired [thyLabelText]=\"i18nTexts().columnName\">\n        <thy-input-group>\n            <input\n                thyInput\n                [thyAutofocus]=\"true\"\n                name=\"fieldName\"\n                [maxlength]=\"fieldMaxLength\"\n                [(ngModel)]=\"aiEditField().name\"\n                (ngModelChange)=\"nameChange($event)\"\n                required\n                [placeholder]=\"i18nTexts().columnNamePlaceholder\"\n                [thyUniqueCheck]=\"checkUniqueName\"\n            />\n            <ng-template #suffix>\n                <thy-input-count></thy-input-count>\n            </ng-template>\n        </thy-input-group>\n    </thy-form-group>\n    <thy-form-group [thyLabelText]=\"i18nTexts().fieldType\">\n        <div class=\"thy-dropdown-menu py-0\">\n            <div class=\"ml-n5 mr-n5\">\n                <span thyDropdownMenuItem [thyDropdown]=\"menu\" thyTrigger=\"hover\" thyPlacement=\"right\" (click)=\"fieldTypeClick($event)\">\n                    <thy-icon thyDropdownMenuItemIcon [thyIconName]=\"selectedFieldOption().icon\"></thy-icon>\n                    <span thyDropdownMenuItemName>{{ selectedFieldOption().name }}</span>\n                    <thy-icon thyDropdownMenuItemExtendIcon thyIconName=\"angle-right\" class=\"text-desc\"></thy-icon>\n                </span>\n            </div>\n        </div>\n\n        @if (selectedFieldOption().type === aITableFieldType.member) {\n            <div class=\"d-flex justify-content-between mt-3\">\n                {{ i18nTexts().allowMultipleMembers }}\n                <thy-switch\n                    name=\"isMultipleMember\"\n                    [(ngModel)]=\"isMultipleMember\"\n                    (ngModelChange)=\"multipleMemberChange()\"\n                    thySize=\"sm\"\n                ></thy-switch>\n            </div>\n        }\n    </thy-form-group>\n    @if (aiExternalTemplate()) {\n        <ng-container *ngTemplateOutlet=\"aiExternalTemplate()\"></ng-container>\n    }\n    <thy-form-group-footer thyAlign=\"right\">\n        <button thyButton=\"link-secondary\" (click)=\"cancel()\" thySize=\"sm\">{{ i18nTexts().cancel }}</button>\n        <button thyButton=\"primary\" (thyFormSubmit)=\"editFieldProperty()\" thySize=\"sm\">{{ i18nTexts().confirm }}</button>\n    </thy-form-group-footer>\n</form>\n\n<thy-dropdown-menu #menu>\n    <div class=\"ai-table-field-type-menu\">\n        <thy-dropdown-menu-group [thyTitle]=\"i18nTexts().base\">\n            @for (item of fieldOptions().base; track $index) {\n                <a\n                    thyDropdownMenuItem\n                    href=\"javascript:;\"\n                    [ngClass]=\"{\n                        active: (item | fieldIsSameOption: aiEditField())\n                    }\"\n                    (click)=\"selectFieldType(item)\"\n                >\n                    <thy-icon [thyIconName]=\"item.icon!\"></thy-icon>\n                    <span thyDropdownMenuItemName>{{ item.name }}</span>\n                </a>\n            }\n        </thy-dropdown-menu-group>\n        <thy-dropdown-menu-group [thyTitle]=\"i18nTexts().advanced\">\n            @for (item of fieldOptions().advanced; track $index) {\n                <a\n                    thyDropdownMenuItem\n                    href=\"javascript:;\"\n                    [ngClass]=\"{\n                        active: (item | fieldIsSameOption: aiEditField())\n                    }\"\n                    (click)=\"selectFieldType(item)\"\n                >\n                    <thy-icon [thyIconName]=\"item.icon!\"></thy-icon>\n                    <span thyDropdownMenuItemName>{{ item.name }}</span>\n                </a>\n            }\n        </thy-dropdown-menu-group>\n    </div>\n</thy-dropdown-menu>\n", styles: [":host{width:350px}\n"], dependencies: [{ kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "ngmodule", type: FormsModule }, { kind: "directive", type: i1.ɵNgNoValidate, selector: "form:not([ngNoForm]):not([ngNativeValidate])" }, { 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.NgControlStatusGroup, selector: "[formGroupName],[formArrayName],[ngModelGroup],[formGroup],form:not([ngNoForm]),[ngForm]" }, { kind: "directive", type: i1.RequiredValidator, selector: ":not([type=checkbox])[required][formControlName],:not([type=checkbox])[required][formControl],:not([type=checkbox])[required][ngModel]", inputs: ["required"] }, { kind: "directive", type: i1.MaxLengthValidator, selector: "[maxlength][formControlName],[maxlength][formControl],[maxlength][ngModel]", inputs: ["maxlength"] }, { kind: "directive", type: i1.NgModel, selector: "[ngModel]:not([formControlName]):not([formControl])", inputs: ["name", "disabled", "ngModel", "ngModelOptions"], outputs: ["ngModelChange"], exportAs: ["ngModel"] }, { kind: "directive", type: i1.NgForm, selector: "form:not([ngNoForm]):not([formGroup]),ng-form,[ngForm]", inputs: ["ngFormOptions"], outputs: ["ngSubmit"], exportAs: ["ngForm"] }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "component", type: ThyInputGroup, selector: "thy-input-group", inputs: ["thyAppendText", "thyAppendTextTranslateKey", "thyPrependText", "thyPrependTextTranslateKey", "thySize"] }, { kind: "component", type: ThyInputCount, selector: "thy-input-count", inputs: ["thyInput"] }, { kind: "directive", type: ThyInputDirective, selector: "input[thyInput], select[thyInput], textarea[thyInput]", inputs: ["thySize"], exportAs: ["thyInput"] }, { kind: "directive", type: ThyUniqueCheckValidator, selector: "[thyUniqueCheck]", inputs: ["thyUniqueCheck"] }, { kind: "component", type: ThyDropdownMenuComponent, selector: "thy-dropdown-menu", inputs: ["thyWidth", "thyImmediateRender"] }, { kind: "component", type: ThyDropdownMenuGroup, selector: "thy-dropdown-menu-group", inputs: ["thyTitle"] }, { kind: "directive", type: ThyDropdownDirective, selector: "[thyDropdown]", inputs: ["thyDropdownMenu", "thyDropdown", "thyTrigger", "thyShowDelay", "thyHideDelay", "thyActiveClass", "thyPopoverOptions", "thyPlacement", "thyMenuInsideClosable", "thyPanelClass"], outputs: ["thyActiveChange"] }, { kind: "directive", type: ThyDropdownMenuItemDirective, selector: "[thyDropdownMenuItem]", inputs: ["thyType", "thyDisabled"] }, { kind: "directive", type: ThyDropdownMenuItemIconDirective, selector: "[thyDropdownMenuItemIcon]" }, { kind: "directive", type: ThyDropdownMenuItemNameDirective, selector: "[thyDropdownMenuItemName]" }, { kind: "directive", type: ThyDropdownMenuItemExtendIconDirective, selector: "[thyDropdownMenuItemExtendIcon]" }, { kind: "component", type: ThyButton, selector: "thy-button,[thy-button],[thyButton]", inputs: ["thyButton", "thyType", "thyLoading", "thyLoadingText", "thySize", "thyIcon", "thyBlock"] }, { kind: "component", type: ThySwitch, selector: "thy-switch", inputs: ["thyType", "thySize", "thyDisabled", "thyLoading"], outputs: ["thyChange"] }, { kind: "ngmodule", type: ThyFormModule }, { kind: "directive", type: i2.ThyFormDirective, selector: "[thyForm],[thy-form]", inputs: ["thyLayout", "thyEnterKeyMode", "thyFormValidatorConfig"], exportAs: ["thyForm"] }, { kind: "component", type: i2.ThyFormGroup, selector: "thy-form-group", inputs: ["thyLabelText", "thyLabelTextTranslateKey", "thyLabelRequired", "thyLabelPaddingTopClear", "thyFeedbackIcon", "thyTipsMode", "thyTips", "thyTipsTranslateKey", "thyRowFill"] }, { kind: "directive", type: i2.ThyFormSubmitDirective, selector: "[thyFormSubmit],[thy-form-submit]", outputs: ["thyFormSubmit"] }, { kind: "component", type: i2.ThyFormGroupFooter, selector: "thy-form-group-footer", inputs: ["thyAlign"] }, { kind: "directive", type: NgTemplateOutlet, selector: "[ngTemplateOutlet]", inputs: ["ngTemplateOutletContext", "ngTemplateOutlet", "ngTemplateOutletInjector"] }, { kind: "directive", type: ThyAutofocusDirective, selector: "input[thyAutofocus],textarea[thyAutofocus]", inputs: ["thyAutofocus", "thyAutoSelect"] }, { kind: "pipe", type: AITableFieldIsSameOptionPipe, name: "fieldIsSameOption" }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableFieldSetting, decorators: [{
             type: Component,
@@ -9050,7 +9002,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                         AITableFieldIsSameOptionPipe
                     ], host: {
                         class: 'field-setting d-block pl-5 pr-5 pb-5 pt-4'
-                    }, template: "<form thyForm name=\"createPropertyForm\" [thyFormValidatorConfig]=\"validatorConfig()\" thyLayout=\"vertical\">\n    <thy-form-group thyLabelRequired [thyLabelText]=\"i18nTexts().columnName\">\n        <thy-input-group>\n            <input\n                thyInput\n                [thyAutofocus]=\"true\"\n                name=\"fieldName\"\n                [maxlength]=\"fieldMaxLength\"\n                [(ngModel)]=\"aiEditField().name\"\n                (ngModelChange)=\"nameChange($event)\"\n                required\n                [placeholder]=\"i18nTexts().columnNamePlaceholder\"\n                [thyUniqueCheck]=\"checkUniqueName\"\n            />\n            <ng-template #suffix>\n                <thy-input-count></thy-input-count>\n            </ng-template>\n        </thy-input-group>\n    </thy-form-group>\n    <thy-form-group [thyLabelText]=\"i18nTexts().fieldType\">\n        <div class=\"thy-dropdown-menu py-0\">\n            <div class=\"ml-n5 mr-n5\">\n                <span thyDropdownMenuItem [thyDropdown]=\"menu\" thyTrigger=\"hover\" thyPlacement=\"right\" (click)=\"fieldTypeClick($event)\">\n                    <thy-icon thyDropdownMenuItemIcon [thyIconName]=\"selectedFieldOption().icon\"></thy-icon>\n                    <span thyDropdownMenuItemName>{{ selectedFieldOption().name }}</span>\n                    <thy-icon thyDropdownMenuItemExtendIcon thyIconName=\"angle-right\" class=\"text-desc\"></thy-icon>\n                </span>\n            </div>\n        </div>\n\n        @if (selectedFieldOption().type === aITableFieldType.member) {\n            <div class=\"d-flex justify-content-between mt-3\">\n                {{ i18nTexts().allowMultipleMembers }}\n                <thy-switch\n                    name=\"isMultipleMember\"\n                    [(ngModel)]=\"isMultipleMember\"\n                    (ngModelChange)=\"multipleMemberChange()\"\n                    thySize=\"sm\"\n                ></thy-switch>\n            </div>\n        }\n    </thy-form-group>\n    @if (aiExternalTemplate()) {\n        <ng-container *ngTemplateOutlet=\"aiExternalTemplate()\"></ng-container>\n    }\n    <thy-form-group-footer thyAlign=\"right\">\n        <button thyButton=\"link-secondary\" (click)=\"cancel()\" thySize=\"sm\">{{ i18nTexts().cancel }}</button>\n        <button thyButton=\"primary\" (thyFormSubmit)=\"editFieldProperty()\" thySize=\"sm\">{{ i18nTexts().confirm }}</button>\n    </thy-form-group-footer>\n</form>\n\n<thy-dropdown-menu #menu>\n    <thy-dropdown-menu-group [thyTitle]=\"i18nTexts().base\">\n        @for (item of fieldOptions().base; track $index) {\n            <a\n                thyDropdownMenuItem\n                href=\"javascript:;\"\n                [ngClass]=\"{\n                    active: (item | fieldIsSameOption: aiEditField())\n                }\"\n                (click)=\"selectFieldType(item)\"\n            >\n                <thy-icon [thyIconName]=\"item.icon!\"></thy-icon>\n                <span thyDropdownMenuItemName>{{ item.name }}</span>\n            </a>\n        }\n    </thy-dropdown-menu-group>\n\n    <thy-dropdown-menu-group [thyTitle]=\"i18nTexts().advanced\">\n        @for (item of fieldOptions().advanced; track $index) {\n            <a\n                thyDropdownMenuItem\n                href=\"javascript:;\"\n                [ngClass]=\"{\n                    active: (item | fieldIsSameOption: aiEditField())\n                }\"\n                (click)=\"selectFieldType(item)\"\n            >\n                <thy-icon [thyIconName]=\"item.icon!\"></thy-icon>\n                <span thyDropdownMenuItemName>{{ item.name }}</span>\n            </a>\n        }\n    </thy-dropdown-menu-group>\n</thy-dropdown-menu>\n", styles: [":host{width:350px}\n"] }]
+                    }, template: "<form thyForm name=\"createPropertyForm\" [thyFormValidatorConfig]=\"validatorConfig()\" thyLayout=\"vertical\">\n    <thy-form-group thyLabelRequired [thyLabelText]=\"i18nTexts().columnName\">\n        <thy-input-group>\n            <input\n                thyInput\n                [thyAutofocus]=\"true\"\n                name=\"fieldName\"\n                [maxlength]=\"fieldMaxLength\"\n                [(ngModel)]=\"aiEditField().name\"\n                (ngModelChange)=\"nameChange($event)\"\n                required\n                [placeholder]=\"i18nTexts().columnNamePlaceholder\"\n                [thyUniqueCheck]=\"checkUniqueName\"\n            />\n            <ng-template #suffix>\n                <thy-input-count></thy-input-count>\n            </ng-template>\n        </thy-input-group>\n    </thy-form-group>\n    <thy-form-group [thyLabelText]=\"i18nTexts().fieldType\">\n        <div class=\"thy-dropdown-menu py-0\">\n            <div class=\"ml-n5 mr-n5\">\n                <span thyDropdownMenuItem [thyDropdown]=\"menu\" thyTrigger=\"hover\" thyPlacement=\"right\" (click)=\"fieldTypeClick($event)\">\n                    <thy-icon thyDropdownMenuItemIcon [thyIconName]=\"selectedFieldOption().icon\"></thy-icon>\n                    <span thyDropdownMenuItemName>{{ selectedFieldOption().name }}</span>\n                    <thy-icon thyDropdownMenuItemExtendIcon thyIconName=\"angle-right\" class=\"text-desc\"></thy-icon>\n                </span>\n            </div>\n        </div>\n\n        @if (selectedFieldOption().type === aITableFieldType.member) {\n            <div class=\"d-flex justify-content-between mt-3\">\n                {{ i18nTexts().allowMultipleMembers }}\n                <thy-switch\n                    name=\"isMultipleMember\"\n                    [(ngModel)]=\"isMultipleMember\"\n                    (ngModelChange)=\"multipleMemberChange()\"\n                    thySize=\"sm\"\n                ></thy-switch>\n            </div>\n        }\n    </thy-form-group>\n    @if (aiExternalTemplate()) {\n        <ng-container *ngTemplateOutlet=\"aiExternalTemplate()\"></ng-container>\n    }\n    <thy-form-group-footer thyAlign=\"right\">\n        <button thyButton=\"link-secondary\" (click)=\"cancel()\" thySize=\"sm\">{{ i18nTexts().cancel }}</button>\n        <button thyButton=\"primary\" (thyFormSubmit)=\"editFieldProperty()\" thySize=\"sm\">{{ i18nTexts().confirm }}</button>\n    </thy-form-group-footer>\n</form>\n\n<thy-dropdown-menu #menu>\n    <div class=\"ai-table-field-type-menu\">\n        <thy-dropdown-menu-group [thyTitle]=\"i18nTexts().base\">\n            @for (item of fieldOptions().base; track $index) {\n                <a\n                    thyDropdownMenuItem\n                    href=\"javascript:;\"\n                    [ngClass]=\"{\n                        active: (item | fieldIsSameOption: aiEditField())\n                    }\"\n                    (click)=\"selectFieldType(item)\"\n                >\n                    <thy-icon [thyIconName]=\"item.icon!\"></thy-icon>\n                    <span thyDropdownMenuItemName>{{ item.name }}</span>\n                </a>\n            }\n        </thy-dropdown-menu-group>\n        <thy-dropdown-menu-group [thyTitle]=\"i18nTexts().advanced\">\n            @for (item of fieldOptions().advanced; track $index) {\n                <a\n                    thyDropdownMenuItem\n                    href=\"javascript:;\"\n                    [ngClass]=\"{\n                        active: (item | fieldIsSameOption: aiEditField())\n                    }\"\n                    (click)=\"selectFieldType(item)\"\n                >\n                    <thy-icon [thyIconName]=\"item.icon!\"></thy-icon>\n                    <span thyDropdownMenuItemName>{{ item.name }}</span>\n                </a>\n            }\n        </thy-dropdown-menu-group>\n    </div>\n</thy-dropdown-menu>\n", styles: [":host{width:350px}\n"] }]
         }] });
 
 class AITableGridSelectionService {
@@ -9217,7 +9169,7 @@ class AITableContextMenu extends ThyDropdownAbstractMenu {
         this.thyPopoverRef.close();
     }
     static { this.ɵfac = i0.ɵɵngDeclareFactory({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableContextMenu, deps: null, target: i0.ɵɵFactoryTarget.Component }); }
-    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: AITableContextMenu, isStandalone: true, selector: "ai-table-context-menu", inputs: { aiTable: { classPropertyName: "aiTable", publicName: "aiTable", isSignal: true, isRequired: true, transformFunction: null }, menuItems: { classPropertyName: "menuItems", publicName: "menuItems", isSignal: true, isRequired: true, transformFunction: null }, targetName: { classPropertyName: "targetName", publicName: "targetName", isSignal: true, isRequired: true, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "context-menu" }, usesInheritance: true, ngImport: i0, template: "@for (menu of menuItems(); track $index) {\n    @if ((menu.hidden && !menu.hidden(aiTable(), targetName(), position())) || !menu.hidden) {\n        @if (menu.type === 'divider') {\n            <thy-divider thyStyle=\"solid\"></thy-divider>\n        } @else {\n            @let disabled = !!(menu.disabled && menu.disabled(aiTable(), targetName(), position()));\n            @let isRemoveRecords = menu.type === 'removeRecords';\n            @let isPreventClearSelection =\n                menu.type === 'copyCells' ||\n                menu.type === 'pasteCells' ||\n                menu.type === 'removeRecords' ||\n                menu.type === 'insertUpwardRecords' ||\n                menu.type === 'insertDownwardRecords';\n\n            <a\n                thyDropdownMenuItem\n                href=\"javascript:;\"\n                [ngClass]=\"{\n                    'remove-record': isRemoveRecords && !disabled,\n                    'ai-table-prevent-clear-selection': isPreventClearSelection && !disabled\n                }\"\n                (click)=\"execute(menu)\"\n                [thyDisabled]=\"disabled\"\n            >\n                <thy-icon thyDropdownMenuItemIcon [thyIconName]=\"menu.icon!\"></thy-icon>\n                @if (menu?.isInputNumber) {\n                    <span thyDropdownMenuItemName class=\"d-flex align-items-center\">\n                        {{ menu.name }}\n                        <thy-input-number\n                            #inputNumber\n                            class=\"mx-2\"\n                            thySize=\"sm\"\n                            [(ngModel)]=\"menu.count\"\n                            [thyStep]=\"1\"\n                            [thyMin]=\"1\"\n                            [thyMax]=\"maxCount()\"\n                            (click)=\"inputNumberFocus($event)\"\n                            (thyEnter)=\"itemEnterHandle($event, menu)\"\n                            thyStopPropagation\n                        ></thy-input-number>\n                        {{ menu.nameSuffix }}\n                    </span>\n                } @else {\n                    <span thyDropdownMenuItemName>{{ menu.name }}</span>\n                }\n                <span thyDropdownMenuItemMeta class=\"text-desc\">{{ menu.shortcutKey }}</span>\n            </a>\n        }\n    }\n}\n", dependencies: [{ kind: "component", type: ThyInputNumber, selector: "thy-input-number", inputs: ["thyAutoFocus", "thyPlaceholder", "thyDisabled", "thyMax", "thyMin", "thyStep", "thyStepDelay", "thySize", "thyPrecision", "thySuffix"], outputs: ["thyBlur", "thyFocus", "thyStepChange"] }, { 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: "directive", type: ThyStopPropagationDirective, selector: "[thyStopPropagation]", inputs: ["thyStopPropagation"] }, { kind: "directive", type: ThyDropdownMenuItemDirective, selector: "[thyDropdownMenuItem]", inputs: ["thyType", "thyDisabled"] }, { kind: "directive", type: ThyDropdownMenuItemNameDirective, selector: "[thyDropdownMenuItemName]" }, { kind: "directive", type: ThyDropdownMenuItemIconDirective, selector: "[thyDropdownMenuItemIcon]" }, { kind: "directive", type: ThyDropdownMenuItemMetaDirective, selector: "[thyDropdownMenuItemMeta]" }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThyDivider, selector: "thy-divider", inputs: ["thyVertical", "thyStyle", "thyColor", "thyText", "thyTextDirection", "thyDeeper"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
+    static { this.ɵcmp = i0.ɵɵngDeclareComponent({ minVersion: "17.0.0", version: "19.2.10", type: AITableContextMenu, isStandalone: true, selector: "ai-table-context-menu", inputs: { aiTable: { classPropertyName: "aiTable", publicName: "aiTable", isSignal: true, isRequired: true, transformFunction: null }, menuItems: { classPropertyName: "menuItems", publicName: "menuItems", isSignal: true, isRequired: true, transformFunction: null }, targetName: { classPropertyName: "targetName", publicName: "targetName", isSignal: true, isRequired: true, transformFunction: null }, position: { classPropertyName: "position", publicName: "position", isSignal: true, isRequired: true, transformFunction: null } }, host: { classAttribute: "context-menu" }, usesInheritance: true, ngImport: i0, template: "@for (menu of menuItems(); track $index) {\n    @if ((menu.hidden && !menu.hidden(aiTable(), targetName(), position())) || !menu.hidden) {\n        @if (menu.type === 'divider') {\n            <thy-divider thyStyle=\"solid\"></thy-divider>\n        } @else {\n            @let disabled = !!(menu.disabled && menu.disabled(aiTable(), targetName(), position()));\n            @let isRemoveRecords = menu.type === 'removeRecords';\n            @let isPreventClearSelection =\n                menu.type === 'copyCells' ||\n                menu.type === 'pasteCells' ||\n                menu.type === 'removeRecords' ||\n                menu.type === 'insertUpwardRecords' ||\n                menu.type === 'insertDownwardRecords';\n\n            <a\n                thyDropdownMenuItem\n                href=\"javascript:;\"\n                [ngClass]=\"{\n                    'remove-record': isRemoveRecords && !disabled,\n                    'ai-table-prevent-clear-selection': isPreventClearSelection && !disabled\n                }\"\n                draggable=\"false\"\n                (click)=\"execute(menu)\"\n                [thyDisabled]=\"disabled\"\n            >\n                <thy-icon thyDropdownMenuItemIcon [thyIconName]=\"menu.icon!\"></thy-icon>\n                @if (menu?.isInputNumber) {\n                    <span thyDropdownMenuItemName class=\"d-flex align-items-center\">\n                        {{ menu.name }}\n                        <thy-input-number\n                            #inputNumber\n                            class=\"mx-2\"\n                            thySize=\"sm\"\n                            [(ngModel)]=\"menu.count\"\n                            [thyStep]=\"1\"\n                            [thyMin]=\"1\"\n                            [thyMax]=\"maxCount()\"\n                            (click)=\"inputNumberFocus($event)\"\n                            (thyEnter)=\"itemEnterHandle($event, menu)\"\n                            thyStopPropagation\n                        ></thy-input-number>\n                        {{ menu.nameSuffix }}\n                    </span>\n                } @else {\n                    <span thyDropdownMenuItemName>{{ menu.name }}</span>\n                }\n                <span thyDropdownMenuItemMeta class=\"text-desc\">{{ menu.shortcutKey }}</span>\n            </a>\n        }\n    }\n}\n", dependencies: [{ kind: "component", type: ThyInputNumber, selector: "thy-input-number", inputs: ["thyAutoFocus", "thyPlaceholder", "thyDisabled", "thyMax", "thyMin", "thyStep", "thyStepDelay", "thySize", "thyPrecision", "thySuffix"], outputs: ["thyBlur", "thyFocus", "thyStepChange"] }, { 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: "directive", type: ThyStopPropagationDirective, selector: "[thyStopPropagation]", inputs: ["thyStopPropagation"] }, { kind: "directive", type: ThyDropdownMenuItemDirective, selector: "[thyDropdownMenuItem]", inputs: ["thyType", "thyDisabled"] }, { kind: "directive", type: ThyDropdownMenuItemNameDirective, selector: "[thyDropdownMenuItemName]" }, { kind: "directive", type: ThyDropdownMenuItemIconDirective, selector: "[thyDropdownMenuItemIcon]" }, { kind: "directive", type: ThyDropdownMenuItemMetaDirective, selector: "[thyDropdownMenuItemMeta]" }, { kind: "component", type: ThyIcon, selector: "thy-icon, [thy-icon]", inputs: ["thyIconType", "thyTwotoneColor", "thyIconName", "thyIconRotate", "thyIconSet", "thyIconLegging", "thyIconLinearGradient"] }, { kind: "directive", type: NgClass, selector: "[ngClass]", inputs: ["class", "ngClass"] }, { kind: "component", type: ThyDivider, selector: "thy-divider", inputs: ["thyVertical", "thyStyle", "thyColor", "thyText", "thyTextDirection", "thyDeeper"] }], changeDetection: i0.ChangeDetectionStrategy.OnPush }); }
 }
 i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImport: i0, type: AITableContextMenu, decorators: [{
             type: Component,
@@ -9235,7 +9187,7 @@ i0.ɵɵngDeclareClassMetadata({ minVersion: "12.0.0", version: "19.2.10", ngImpo
                         ThyIcon,
                         NgClass,
                         ThyDivider
-                    ], template: "@for (menu of menuItems(); track $index) {\n    @if ((menu.hidden && !menu.hidden(aiTable(), targetName(), position())) || !menu.hidden) {\n        @if (menu.type === 'divider') {\n            <thy-divider thyStyle=\"solid\"></thy-divider>\n        } @else {\n            @let disabled = !!(menu.disabled && menu.disabled(aiTable(), targetName(), position()));\n            @let isRemoveRecords = menu.type === 'removeRecords';\n            @let isPreventClearSelection =\n                menu.type === 'copyCells' ||\n                menu.type === 'pasteCells' ||\n                menu.type === 'removeRecords' ||\n                menu.type === 'insertUpwardRecords' ||\n                menu.type === 'insertDownwardRecords';\n\n            <a\n                thyDropdownMenuItem\n                href=\"javascript:;\"\n                [ngClass]=\"{\n                    'remove-record': isRemoveRecords && !disabled,\n                    'ai-table-prevent-clear-selection': isPreventClearSelection && !disabled\n                }\"\n                (click)=\"execute(menu)\"\n                [thyDisabled]=\"disabled\"\n            >\n                <thy-icon thyDropdownMenuItemIcon [thyIconName]=\"menu.icon!\"></thy-icon>\n                @if (menu?.isInputNumber) {\n                    <span thyDropdownMenuItemName class=\"d-flex align-items-center\">\n                        {{ menu.name }}\n                        <thy-input-number\n                            #inputNumber\n                            class=\"mx-2\"\n                            thySize=\"sm\"\n                            [(ngModel)]=\"menu.count\"\n                            [thyStep]=\"1\"\n                            [thyMin]=\"1\"\n                            [thyMax]=\"maxCount()\"\n                            (click)=\"inputNumberFocus($event)\"\n                            (thyEnter)=\"itemEnterHandle($event, menu)\"\n                            thyStopPropagation\n                        ></thy-input-number>\n                        {{ menu.nameSuffix }}\n                    </span>\n                } @else {\n                    <span thyDropdownMenuItemName>{{ menu.name }}</span>\n                }\n                <span thyDropdownMenuItemMeta class=\"text-desc\">{{ menu.shortcutKey }}</span>\n            </a>\n        }\n    }\n}\n" }]
+                    ], template: "@for (menu of menuItems(); track $index) {\n    @if ((menu.hidden && !menu.hidden(aiTable(), targetName(), position())) || !menu.hidden) {\n        @if (menu.type === 'divider') {\n            <thy-divider thyStyle=\"solid\"></thy-divider>\n        } @else {\n            @let disabled = !!(menu.disabled && menu.disabled(aiTable(), targetName(), position()));\n            @let isRemoveRecords = menu.type === 'removeRecords';\n            @let isPreventClearSelection =\n                menu.type === 'copyCells' ||\n                menu.type === 'pasteCells' ||\n                menu.type === 'removeRecords' ||\n                menu.type === 'insertUpwardRecords' ||\n                menu.type === 'insertDownwardRecords';\n\n            <a\n                thyDropdownMenuItem\n                href=\"javascript:;\"\n                [ngClass]=\"{\n                    'remove-record': isRemoveRecords && !disabled,\n                    'ai-table-prevent-clear-selection': isPreventClearSelection && !disabled\n                }\"\n                draggable=\"false\"\n                (click)=\"execute(menu)\"\n                [thyDisabled]=\"disabled\"\n            >\n                <thy-icon thyDropdownMenuItemIcon [thyIconName]=\"menu.icon!\"></thy-icon>\n                @if (menu?.isInputNumber) {\n                    <span thyDropdownMenuItemName class=\"d-flex align-items-center\">\n                        {{ menu.name }}\n                        <thy-input-number\n                            #inputNumber\n                            class=\"mx-2\"\n                            thySize=\"sm\"\n                            [(ngModel)]=\"menu.count\"\n                            [thyStep]=\"1\"\n                            [thyMin]=\"1\"\n                            [thyMax]=\"maxCount()\"\n                            (click)=\"inputNumberFocus($event)\"\n                            (thyEnter)=\"itemEnterHandle($event, menu)\"\n                            thyStopPropagation\n                        ></thy-input-number>\n                        {{ menu.nameSuffix }}\n                    </span>\n                } @else {\n                    <span thyDropdownMenuItemName>{{ menu.name }}</span>\n                }\n                <span thyDropdownMenuItemMeta class=\"text-desc\">{{ menu.shortcutKey }}</span>\n            </a>\n        }\n    }\n}\n" }]
         }] });
 
 class AITableGridEventService {
@@ -9780,6 +9732,7 @@ class AITableScrollControllerService {
             this.autoScrollSub = null;
         }
         this.isAutoScrolling = false;
+        this.lastAutoScrollOptions?.onAutoScrollEnd?.();
     }
     startAutoScroll(options) {
         if (this.autoScrollSub) {
@@ -10350,6 +10303,7 @@ class AITableGrid extends AITableGridBase {
         super();
         this.viewContainerRef = inject(ViewContainerRef);
         this.isDragSelecting = false;
+        this.isDragSelectionAutoScrolling = false;
         this.dragSelectionStart = null;
         this.notifyService = inject(ThyNotifyService);
         this.scrollControllerService = inject(AITableScrollControllerService);
@@ -10713,7 +10667,9 @@ class AITableGrid extends AITableGridBase {
         this.updateDragSelectionState(false, null);
     }
     stageMouseleave(e) {
-        this.isDragSelecting = false;
+        if (!this.isDragSelectionAutoScrolling) {
+            this.updateDragSelectionState(false, null);
+        }
         if (this.timer) {
             cancelAnimationFrame(this.timer);
         }
@@ -11107,6 +11063,7 @@ class AITableGrid extends AITableGridBase {
                 bottom: AI_TABLE_AUTO_SCROLL_BOTTOM_THRESHOLD
             },
             onScrollChange: (position, isAutoScrolling) => {
+                this.isDragSelectionAutoScrolling = isAutoScrolling;
                 if (isAutoScrolling) {
                     const scrollLeft = position.x - scrollState.scrollLeft;
                     const scrollTop = position.y - scrollState.scrollTop;
@@ -11120,6 +11077,10 @@ class AITableGrid extends AITableGridBase {
                         this.aiTableGridSelectionService.selectCells([startCell[0], startCell[1]], [nextRecord._id, nextField._id]);
                     }
                 }
+            },
+            onAutoScrollEnd: () => {
+                this.isDragSelectionAutoScrolling = false;
+                this.updateDragSelectionState(false, null);
             }
         });
     }