@univerjs/sheets-data-validation-ui 0.4.0-alpha.1 → 0.4.0-alpha.2

package/lib/es/index.js

@@ -3,10 +3,10 @@ var __defNormalProp = (obj, key, value) => key in obj ? __defProp(obj, key, { en
 var __name = (target, value) => __defProp(target, "name", { value, configurable: !0 });
 var __publicField = (obj, key, value) => __defNormalProp(obj, typeof key != "symbol" ? key + "" : key, value);
 import React, { useState, forwardRef, useRef, createElement, useMemo, useEffect } from "react";
-import { Inject, LocaleService, Disposable, DataValidationErrorStyle, useDependency, ICommandService, numfmt, CellValueType, UniverInstanceType, toDisposable, IUniverInstanceService, DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY, DisposableCollection, CommandType, BuildTextUtils, DataValidationRenderMode, DataValidationType, IConfigService, UndoCommand, RedoCommand, isUnitRangesEqual, createInternalEditorID, isValidRange, debounce, shallowEqual, Injector, DataValidationStatus, ObjectMatrix, Range, Rectangle, queryObjectMatrix, Optional, RxDisposable, InterceptorEffectEnum, sequenceExecute, isFormulaString, Tools, ThemeService, VerticalAlign, HorizontalAlign, DEFAULT_STYLES, WrapStrategy, DocumentDataModel, DEFAULT_EMPTY_DOCUMENT_VALUE, BooleanNumber, Plugin } from "@univerjs/core";
+import { Inject, LocaleService, Disposable, DataValidationErrorStyle, useDependency, ICommandService, numfmt, CellValueType, UniverInstanceType, toDisposable, IUniverInstanceService, DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY, DisposableCollection, CommandType, BuildTextUtils, DataValidationRenderMode, DataValidationType, IConfigService, UndoCommand, RedoCommand, isUnitRangesEqual, debounce, shallowEqual, Injector, DataValidationStatus, ObjectMatrix, Range, Rectangle, queryObjectMatrix, Optional, RxDisposable, InterceptorEffectEnum, sequenceExecute, bufferDebounceTime, createInternalEditorID, isFormulaString, Tools, ThemeService, VerticalAlign, HorizontalAlign, DEFAULT_STYLES, WrapStrategy, DocumentDataModel, DEFAULT_EMPTY_DOCUMENT_VALUE, BooleanNumber, Plugin } from "@univerjs/core";
 import { Button, DatePanel, RectPopup, Scrollbar, FormLayout, RadioGroup, Radio, Checkbox, Input, Select, DraggableList } from "@univerjs/design";
 import { SetRangeValuesCommand, SheetsSelectionsService, getSheetCommandTarget, WorkbookEditablePermission, RangeProtectionPermissionEditPoint, WorksheetEditPermission, checkRangesEditablePermission, WorksheetSetCellStylePermission, SheetInterceptorService, INTERCEPTOR_POINT, InterceptCellContentPriority } from "@univerjs/sheets";
-import { SheetDataValidationModel, getCellValueOrigin, getDataValidationCellValue, deserializeListOptions, serializeListOptions, UpdateSheetDataValidationRangeCommand, UpdateSheetDataValidationSettingCommand, RemoveSheetDataValidationCommand, UpdateSheetDataValidationOptionsCommand, createDefaultNewRule, AddSheetDataValidationCommand, RemoveSheetAllDataValidationCommand, DATA_VALIDATION_PLUGIN_NAME, getDataValidationDiffMutations, DataValidationFormulaController, DataValidationFormulaService, getFormulaResult, transformCheckboxValue, CHECKBOX_FORMULA_1, CHECKBOX_FORMULA_2 } from "@univerjs/sheets-data-validation";
+import { SheetDataValidationModel, getCellValueOrigin, getDataValidationCellValue, deserializeListOptions, serializeListOptions, UpdateSheetDataValidationRangeCommand, UpdateSheetDataValidationSettingCommand, RemoveSheetDataValidationCommand, UpdateSheetDataValidationOptionsCommand, createDefaultNewRule, AddSheetDataValidationCommand, RemoveSheetAllDataValidationCommand, DATA_VALIDATION_PLUGIN_NAME, getDataValidationDiffMutations, DataValidationCacheService, DataValidationFormulaController, DataValidationFormulaService, getFormulaResult, transformCheckboxValue, CHECKBOX_FORMULA_1, CHECKBOX_FORMULA_2 } from "@univerjs/sheets-data-validation";
 import { getPatternType } from "@univerjs/sheets-numfmt";
 import { DataValidatorRegistryService, DataValidationModel, DataValidatorRegistryScope, TWO_FORMULA_OPERATOR_COUNT, getRuleOptions, getRuleSetting } from "@univerjs/data-validation";
 import { IEditorBridgeService, SheetCanvasPopManagerService, SheetPermissionInterceptorBaseController, IMarkSelectionService, HoverManagerService, CellAlertManagerService, CellAlertType, IAutoFillService, APPLY_TYPE, virtualizeDiscreteRanges, getAutoFillRepeatRange, COPY_TYPE, rangeToDiscreteRange, PREDEFINED_HOOK_NAME, getRepeatRange, ISheetClipboardService, getCurrentRangeDisable$, AutoHeightController, SheetSkeletonManagerService } from "@univerjs/sheets-ui";
@@ -14,8 +14,9 @@ import { IDialogService, ISidebarService, useObservable, ComponentManager, IZenZ
 import { RichTextEditingMutation } from "@univerjs/docs";
 import { IRenderManagerService, DeviceInputEventType, fixLineWidthByScale, Transform, Checkbox as Checkbox$1, FontCache, Shape, Rect, getFontStyleString, getDocsSkeletonPageSize, DocumentViewModel, DocumentSkeleton, Documents } from "@univerjs/engine-render";
 import { filter, BehaviorSubject, distinctUntilChanged, Subject, debounceTime, bufferTime } from "rxjs";
-import { RangeSelector, TextEditor } from "@univerjs/docs-ui";
-import { serializeRange } from "@univerjs/engine-formula";
+import { deserializeRangeWithSheet, serializeRange } from "@univerjs/engine-formula";
+import { RangeSelector } from "@univerjs/sheets-formula-ui";
+import { TextEditor } from "@univerjs/docs-ui";
 var commonjsGlobal = typeof globalThis < "u" ? globalThis : typeof window < "u" ? window : typeof global < "u" ? global : typeof self < "u" ? self : {};
 function getDefaultExportFromCjs(x) {
   return x && x.__esModule && Object.prototype.hasOwnProperty.call(x, "default") ? x.default : x;
@@ -399,11 +400,11 @@ var utc$1 = { exports: {} };
 })(utc$1);
 var utcExports = utc$1.exports;
 const utc = /* @__PURE__ */ getDefaultExportFromCjs(utcExports);
-var __defProp$e = Object.defineProperty, __getOwnPropDesc$e = Object.getOwnPropertyDescriptor, __decorateClass$e = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$e(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$f = Object.defineProperty, __getOwnPropDesc$f = Object.getOwnPropertyDescriptor, __decorateClass$f = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$f(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$e(target, key, result), result;
-}, "__decorateClass$e"), __decorateParam$e = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$e"), _a;
+  return kind && result && __defProp$f(target, key, result), result;
+}, "__decorateClass$f"), __decorateParam$f = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$f"), _a;
 let DataValidationRejectInputController = (_a = class extends Disposable {
   constructor(_editorBridgeService, _dataValidationModel, _dataValidatorRegistryService, _dialogService, _localeService) {
     super(), this._editorBridgeService = _editorBridgeService, this._dataValidationModel = _dataValidationModel, this._dataValidatorRegistryService = _dataValidatorRegistryService, this._dialogService = _dialogService, this._localeService = _localeService, this._initEditorBridgeInterceptor();
@@ -413,7 +414,7 @@ let DataValidationRejectInputController = (_a = class extends Disposable {
       this._editorBridgeService.interceptor.getInterceptPoints().AFTER_CELL_EDIT_ASYNC,
       {
         handler: /* @__PURE__ */ __name(async (cellPromise, context, next) => {
-          var _a17;
+          var _a18;
           const cell = await cellPromise, { worksheet, row, col, unitId, subUnitId, workbook } = context, ruleId = this._dataValidationModel.getRuleIdByLocation(unitId, subUnitId, row, col), rule = ruleId ? this._dataValidationModel.getRuleById(unitId, subUnitId, ruleId) : void 0;
           if (!rule || rule.errorStyle !== DataValidationErrorStyle.STOP)
             return next(Promise.resolve(cell));
@@ -421,7 +422,7 @@ let DataValidationRejectInputController = (_a = class extends Disposable {
           if (!validator || await validator.validator(
             {
               value: getCellValueOrigin(cell),
-              interceptValue: getCellValueOrigin((_a17 = context == null ? void 0 : context.origin) != null ? _a17 : cell),
+              interceptValue: getCellValueOrigin((_a18 = context == null ? void 0 : context.origin) != null ? _a18 : cell),
               row,
               column: col,
               unitId,
@@ -487,12 +488,12 @@ let DataValidationRejectInputController = (_a = class extends Disposable {
     });
   }
 }, __name(_a, "DataValidationRejectInputController"), _a);
-DataValidationRejectInputController = __decorateClass$e([
-  __decorateParam$e(0, IEditorBridgeService),
-  __decorateParam$e(1, Inject(SheetDataValidationModel)),
-  __decorateParam$e(2, Inject(DataValidatorRegistryService)),
-  __decorateParam$e(3, IDialogService),
-  __decorateParam$e(4, Inject(LocaleService))
+DataValidationRejectInputController = __decorateClass$f([
+  __decorateParam$f(0, IEditorBridgeService),
+  __decorateParam$f(1, Inject(SheetDataValidationModel)),
+  __decorateParam$f(2, Inject(DataValidatorRegistryService)),
+  __decorateParam$f(3, IDialogService),
+  __decorateParam$f(4, Inject(LocaleService))
 ], DataValidationRejectInputController);
 const dvDateDropdown = "univer-dv-date-dropdown", dvDateDropdownBtns = "univer-dv-date-dropdown-btns", styles$6 = {
   dvDateDropdown,
@@ -509,15 +510,15 @@ const transformDate = /* @__PURE__ */ __name((value) => {
     return date;
 }, "transformDate");
 function DateDropdown(props) {
-  var _a17, _b, _c;
-  const { location, hideFn } = props, { worksheet, row, col, unitId, subUnitId, workbook } = location, commandService = useDependency(ICommandService), rejectInputController = useDependency(DataValidationRejectInputController), cellData = worksheet.getCell(row, col), rule = (_a17 = cellData == null ? void 0 : cellData.dataValidation) == null ? void 0 : _a17.rule, validator = (_b = cellData == null ? void 0 : cellData.dataValidation) == null ? void 0 : _b.validator, cellStr = getCellValueOrigin(worksheet.getCellRaw(row, col)), originDate = transformDate(cellStr), [localDate, setLocalDate] = useState(originDate), showTime = !!((_c = rule == null ? void 0 : rule.bizInfo) != null && _c.showTime), date = localDate && localDate.isValid() ? localDate : dayjs(), localeService = useDependency(LocaleService);
+  var _a18, _b, _c;
+  const { location, hideFn } = props, { worksheet, row, col, unitId, subUnitId, workbook } = location, commandService = useDependency(ICommandService), rejectInputController = useDependency(DataValidationRejectInputController), cellData = worksheet.getCell(row, col), rule = (_a18 = cellData == null ? void 0 : cellData.dataValidation) == null ? void 0 : _a18.rule, validator = (_b = cellData == null ? void 0 : cellData.dataValidation) == null ? void 0 : _b.validator, cellStr = getCellValueOrigin(worksheet.getCellRaw(row, col)), originDate = transformDate(cellStr), [localDate, setLocalDate] = useState(originDate), showTime = !!((_c = rule == null ? void 0 : rule.bizInfo) != null && _c.showTime), date = localDate && localDate.isValid() ? localDate : dayjs(), localeService = useDependency(LocaleService);
   if (!cellData || !rule || !validator)
     return;
   const handleSave = /* @__PURE__ */ __name(async () => {
-    var _a18, _b2, _c2;
+    var _a19, _b2, _c2;
     if (!date)
       return;
-    const dateStr = date.format(showTime ? "YYYY-MM-DD HH:mm:ss" : "YYYY-MM-DD 00:00:00"), serialTime = (_a18 = numfmt.parseDate(dateStr)) == null ? void 0 : _a18.v, cellStyle = workbook.getStyles().getStyleByCell(cellData), format = (_c2 = (_b2 = cellStyle == null ? void 0 : cellStyle.n) == null ? void 0 : _b2.pattern) != null ? _c2 : "", patternType = getPatternType(format);
+    const dateStr = date.format(showTime ? "YYYY-MM-DD HH:mm:ss" : "YYYY-MM-DD 00:00:00"), serialTime = (_a19 = numfmt.parseDate(dateStr)) == null ? void 0 : _a19.v, cellStyle = workbook.getStyles().getStyleByCell(cellData), format = (_c2 = (_b2 = cellStyle == null ? void 0 : cellStyle.n) == null ? void 0 : _b2.pattern) != null ? _c2 : "", patternType = getPatternType(format);
     rule.errorStyle !== DataValidationErrorStyle.STOP || await validator.validator({
       value: serialTime,
       unitId,
@@ -600,15 +601,15 @@ function replaceRuntimeIdsAndExtInAttrs(node, runtimeProps, extend) {
   var attrs = __assign({}, node.attrs);
   extend != null && extend.colorChannel1 && attrs.fill === "colorChannel1" && (attrs.fill = extend.colorChannel1);
   var defIds = runtimeProps.defIds;
-  return !defIds || defIds.length === 0 || (node.tag === "use" && attrs["xlink:href"] && (attrs["xlink:href"] = attrs["xlink:href"] + runtimeProps.idSuffix), Object.entries(attrs).forEach(function(_a17) {
-    var key = _a17[0], value = _a17[1];
+  return !defIds || defIds.length === 0 || (node.tag === "use" && attrs["xlink:href"] && (attrs["xlink:href"] = attrs["xlink:href"] + runtimeProps.idSuffix), Object.entries(attrs).forEach(function(_a18) {
+    var key = _a18[0], value = _a18[1];
     typeof value == "string" && (attrs[key] = value.replace(/url\(#(.*)\)/, "url(#$1".concat(runtimeProps.idSuffix, ")")));
   })), attrs;
 }
 __name(replaceRuntimeIdsAndExtInAttrs, "replaceRuntimeIdsAndExtInAttrs");
 function replaceRuntimeIdsInDefs(node, runtimeProps) {
-  var _a17, defIds = runtimeProps.defIds;
-  return !defIds || defIds.length === 0 ? node : node.tag === "defs" && (!((_a17 = node.children) === null || _a17 === void 0) && _a17.length) ? __assign(__assign({}, node), { children: node.children.map(function(child) {
+  var _a18, defIds = runtimeProps.defIds;
+  return !defIds || defIds.length === 0 ? node : node.tag === "defs" && (!((_a18 = node.children) === null || _a18 === void 0) && _a18.length) ? __assign(__assign({}, node), { children: node.children.map(function(child) {
     return typeof child.attrs.id == "string" && defIds && defIds.indexOf(child.attrs.id) > -1 ? __assign(__assign({}, child), { attrs: __assign(__assign({}, child.attrs), { id: child.attrs.id + runtimeProps.idSuffix }) }) : child;
   }) }) : node;
 }
@@ -674,11 +675,11 @@ var element = { tag: "svg", attrs: { fill: "none", viewBox: "0 0 16 16", width:
   }));
 });
 SequenceSingle.displayName = "SequenceSingle";
-var __defProp$d = Object.defineProperty, __getOwnPropDesc$d = Object.getOwnPropertyDescriptor, __decorateClass$d = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$d(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$e = Object.defineProperty, __getOwnPropDesc$e = Object.getOwnPropertyDescriptor, __decorateClass$e = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$e(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$d(target, key, result), result;
-}, "__decorateClass$d"), __decorateParam$d = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$d"), _a2;
+  return kind && result && __defProp$e(target, key, result), result;
+}, "__decorateClass$e"), __decorateParam$e = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$e"), _a2;
 let DataValidationPanelService = (_a2 = class extends Disposable {
   constructor(_univerInstanceService, _sidebarService) {
     super();
@@ -692,7 +693,11 @@ let DataValidationPanelService = (_a2 = class extends Disposable {
       this._univerInstanceService.getCurrentTypeOfUnit$(UniverInstanceType.UNIVER_SHEET).pipe(filter((sheet) => !sheet)).subscribe(() => {
         this.close();
       })
-    );
+    ), this.disposeWithMe(this._sidebarService.sidebarOptions$.subscribe((info) => {
+      info.id === DATA_VALIDATION_PANEL && (info.visible || setTimeout(() => {
+        this._sidebarService.sidebarOptions$.next({ visible: !1 });
+      }));
+    }));
   }
   get activeRule() {
     return this._activeRule;
@@ -701,15 +706,15 @@ let DataValidationPanelService = (_a2 = class extends Disposable {
     return this._open$.getValue();
   }
   dispose() {
-    var _a17;
-    super.dispose(), this._open$.next(!1), this._open$.complete(), this._activeRule$.complete(), (_a17 = this._closeDisposable) == null || _a17.dispose();
+    var _a18;
+    super.dispose(), this._open$.next(!1), this._open$.complete(), this._activeRule$.complete(), (_a18 = this._closeDisposable) == null || _a18.dispose();
   }
   open() {
     this._open$.next(!0);
   }
   close() {
-    var _a17;
-    this._open$.next(!1), (_a17 = this._closeDisposable) == null || _a17.dispose();
+    var _a18;
+    this._open$.next(!1), (_a18 = this._closeDisposable) == null || _a18.dispose();
   }
   setCloseDisposable(disposable) {
     this._closeDisposable = toDisposable(() => {
@@ -720,9 +725,9 @@ let DataValidationPanelService = (_a2 = class extends Disposable {
     this._activeRule = rule, this._activeRule$.next(rule);
   }
 }, __name(_a2, "DataValidationPanelService"), _a2);
-DataValidationPanelService = __decorateClass$d([
-  __decorateParam$d(0, IUniverInstanceService),
-  __decorateParam$d(1, ISidebarService)
+DataValidationPanelService = __decorateClass$e([
+  __decorateParam$e(0, IUniverInstanceService),
+  __decorateParam$e(1, ISidebarService)
 ], DataValidationPanelService);
 function CellDropdown() {
   const dropdownManagerService = useDependency(DataValidationDropdownManagerService), activeDropdown = useObservable(dropdownManagerService.activeDropdown$, dropdownManagerService.activeDropdown), componentManager = useDependency(ComponentManager);
@@ -745,11 +750,11 @@ function CellDropdown() {
 }
 __name(CellDropdown, "CellDropdown");
 const DROP_DOWN_KEY = "sheet.ui.dropdown";
-var __defProp$c = Object.defineProperty, __getOwnPropDesc$c = Object.getOwnPropertyDescriptor, __decorateClass$c = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$c(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$d = Object.defineProperty, __getOwnPropDesc$d = Object.getOwnPropertyDescriptor, __decorateClass$d = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$d(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$c(target, key, result), result;
-}, "__decorateClass$c"), __decorateParam$c = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$c"), _a3;
+  return kind && result && __defProp$d(target, key, result), result;
+}, "__decorateClass$d"), __decorateParam$d = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$d"), _a3;
 let DataValidationDropdownManagerService = (_a3 = class extends Disposable {
   constructor(_canvasPopupManagerService, _univerInstanceService, _dataValidatorRegistryService, _zenZoneService, _renderManagerService, _dataValidationModel, _sheetsSelectionsService) {
     super();
@@ -812,8 +817,8 @@ let DataValidationDropdownManagerService = (_a3 = class extends Disposable {
     const disposableCollection = new DisposableCollection();
     disposableCollection.add(popupDisposable), disposableCollection.add({
       dispose: /* @__PURE__ */ __name(() => {
-        var _a17, _b;
-        (_b = (_a17 = this._activeDropdown) == null ? void 0 : _a17.onHide) == null || _b.call(_a17);
+        var _a18, _b;
+        (_b = (_a18 = this._activeDropdown) == null ? void 0 : _a18.onHide) == null || _b.call(_a18);
       }, "dispose")
     }), this._currentPopup = disposableCollection;
   }
@@ -849,14 +854,14 @@ let DataValidationDropdownManagerService = (_a3 = class extends Disposable {
     });
   }
 }, __name(_a3, "DataValidationDropdownManagerService"), _a3);
-DataValidationDropdownManagerService = __decorateClass$c([
-  __decorateParam$c(0, Inject(SheetCanvasPopManagerService)),
-  __decorateParam$c(1, IUniverInstanceService),
-  __decorateParam$c(2, Inject(DataValidatorRegistryService)),
-  __decorateParam$c(3, IZenZoneService),
-  __decorateParam$c(4, IRenderManagerService),
-  __decorateParam$c(5, Inject(SheetDataValidationModel)),
-  __decorateParam$c(6, Inject(SheetsSelectionsService))
+DataValidationDropdownManagerService = __decorateClass$d([
+  __decorateParam$d(0, Inject(SheetCanvasPopManagerService)),
+  __decorateParam$d(1, IUniverInstanceService),
+  __decorateParam$d(2, Inject(DataValidatorRegistryService)),
+  __decorateParam$d(3, IZenZoneService),
+  __decorateParam$d(4, IRenderManagerService),
+  __decorateParam$d(5, Inject(SheetDataValidationModel)),
+  __decorateParam$d(6, Inject(SheetsSelectionsService))
 ], DataValidationDropdownManagerService);
 const DATA_VALIDATION_PANEL = "DataValidationPanel", OpenValidationPanelOperation = {
   id: "data-validation.operation.open-validation-panel",
@@ -924,8 +929,8 @@ const DATA_VALIDATION_PANEL = "DataValidationPanel", OpenValidationPanelOperatio
   dvListDropdownSplit,
   dvListDropdownEdit
 }, SelectList = /* @__PURE__ */ __name((props) => {
-  var _a17, _b;
-  const { value, onChange, multiple, options, title, onEdit, style, filter: filter2, location } = props, localeService = useDependency(LocaleService), configService = useDependency(IConfigService), lowerFilter = filter2 == null ? void 0 : filter2.toLowerCase(), { row, col, unitId, subUnitId } = location, filteredOptions = options.filter((item) => lowerFilter ? item.label.toLowerCase().includes(lowerFilter) : !0), showEditOnDropdown = (_b = (_a17 = configService.getConfig(PLUGIN_CONFIG_KEY)) == null ? void 0 : _a17.showEditOnDropdown) != null ? _b : !0, sheetPermissionInterceptorBaseController = useDependency(SheetPermissionInterceptorBaseController), hasPermission = useMemo(() => sheetPermissionInterceptorBaseController.permissionCheckWithRanges(
+  var _a18, _b;
+  const { value, onChange, multiple, options, title, onEdit, style, filter: filter2, location } = props, localeService = useDependency(LocaleService), configService = useDependency(IConfigService), lowerFilter = filter2 == null ? void 0 : filter2.toLowerCase(), { row, col, unitId, subUnitId } = location, filteredOptions = options.filter((item) => lowerFilter ? item.label.toLowerCase().includes(lowerFilter) : !0), showEditOnDropdown = (_b = (_a18 = configService.getConfig(PLUGIN_CONFIG_KEY)) == null ? void 0 : _a18.showEditOnDropdown) != null ? _b : !0, sheetPermissionInterceptorBaseController = useDependency(SheetPermissionInterceptorBaseController), hasPermission = useMemo(() => sheetPermissionInterceptorBaseController.permissionCheckWithRanges(
     {
       workbookTypes: [WorkbookEditablePermission],
       rangeTypes: [RangeProtectionPermissionEditPoint],
@@ -962,18 +967,18 @@ const DATA_VALIDATION_PANEL = "DataValidationPanel", OpenValidationPanelOperatio
   ] });
 }, "SelectList");
 function ListDropDown(props) {
-  var _a17, _b;
+  var _a18, _b;
   const { location, hideFn } = props, { worksheet, row, col, unitId, subUnitId } = location, dataValidationModel = useDependency(DataValidationModel), [editingText, setEditingText] = useState(""), commandService = useDependency(ICommandService), localeService = useDependency(LocaleService), [localValue, setLocalValue] = useState(""), editorBridgeService = useDependency(IEditorBridgeService), instanceService = useDependency(IUniverInstanceService), ruleChange$ = useMemo(() => dataValidationModel.ruleChange$.pipe(debounceTime(16)), []);
   useObservable(ruleChange$);
   const anchorRect = RectPopup.useContext(), cellWidth = anchorRect.right - anchorRect.left;
   if (useEffect(() => {
     const dispose = commandService.onCommandExecuted((command) => {
-      var _a18, _b2;
+      var _a19, _b2;
       if (command.id === RichTextEditingMutation.id) {
         const params = command.params, { unitId: unitId2 } = params, unit = instanceService.getUnit(unitId2, UniverInstanceType.UNIVER_DOC);
         if (!unit)
           return;
-        const text = BuildTextUtils.transform.getPlainText((_b2 = (_a18 = unit.getSnapshot().body) == null ? void 0 : _a18.dataStream) != null ? _b2 : "");
+        const text = BuildTextUtils.transform.getPlainText((_b2 = (_a19 = unit.getSnapshot().body) == null ? void 0 : _a19.dataStream) != null ? _b2 : "");
         setEditingText(text);
       }
     });
@@ -982,7 +987,7 @@ function ListDropDown(props) {
     };
   }, [commandService, instanceService]), !worksheet)
     return null;
-  const cellData = worksheet.getCell(row, col), rule = (_a17 = cellData == null ? void 0 : cellData.dataValidation) == null ? void 0 : _a17.rule, validator = (_b = cellData == null ? void 0 : cellData.dataValidation) == null ? void 0 : _b.validator, showColor = (rule == null ? void 0 : rule.renderMode) === DataValidationRenderMode.CUSTOM || (rule == null ? void 0 : rule.renderMode) === void 0;
+  const cellData = worksheet.getCell(row, col), rule = (_a18 = cellData == null ? void 0 : cellData.dataValidation) == null ? void 0 : _a18.rule, validator = (_b = cellData == null ? void 0 : cellData.dataValidation) == null ? void 0 : _b.validator, showColor = (rule == null ? void 0 : rule.renderMode) === DataValidationRenderMode.CUSTOM || (rule == null ? void 0 : rule.renderMode) === void 0;
   if (!cellData || !rule || !validator || validator.id.indexOf(DataValidationType.LIST) !== 0)
     return;
   const multiple = rule.type === DataValidationType.LIST_MULTIPLE, list = validator.getListWithColor(rule, unitId, subUnitId), cellStr = localValue || getDataValidationCellValue(worksheet.getCellRaw(row, col)), value = deserializeListOptions(cellStr), handleEdit = /* @__PURE__ */ __name(() => {
@@ -1038,7 +1043,7 @@ const dataValidationOptionsButton = "univer-data-validation-options-button", dat
   dataValidationOptionsButtonIcon
 };
 function DataValidationOptions(props) {
-  var _a17;
+  var _a18;
   const localeService = useDependency(LocaleService), componentManager = useDependency(ComponentManager), { value, onChange, extraComponent } = props, [show, setShow] = useState(!1), ExtraOptions = extraComponent ? componentManager.get(extraComponent) : null;
   return /* @__PURE__ */ jsxRuntimeExports.jsxs(jsxRuntimeExports.Fragment, { children: [
     /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$4.dataValidationOptionsButton, onClick: /* @__PURE__ */ __name(() => setShow(!show), "onClick"), children: [
@@ -1054,7 +1059,7 @@ function DataValidationOptions(props) {
           children: /* @__PURE__ */ jsxRuntimeExports.jsxs(
             RadioGroup,
             {
-              value: `${(_a17 = value.errorStyle) != null ? _a17 : DataValidationErrorStyle.WARNING}`,
+              value: `${(_a18 = value.errorStyle) != null ? _a18 : DataValidationErrorStyle.WARNING}`,
               onChange: /* @__PURE__ */ __name((errorStyle) => onChange({ ...value, errorStyle: +errorStyle }), "onChange"),
               children: [
                 /* @__PURE__ */ jsxRuntimeExports.jsx(Radio, { value: `${DataValidationErrorStyle.WARNING}`, children: localeService.t("dataValidation.panel.showWarning") }),
@@ -1098,8 +1103,13 @@ const dataValidationDetail = "univer-data-validation-detail", dataValidationDeta
   },
   1e3
 ), "debounceExecuteFactory");
+function getSheetIdByName(univerInstanceService, unitId, name) {
+  var _a18, _b, _c, _d;
+  return unitId ? ((_b = (_a18 = univerInstanceService.getUnit(unitId)) == null ? void 0 : _a18.getSheetBySheetName(name)) == null ? void 0 : _b.getSheetId()) || "" : ((_d = (_c = univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET)) == null ? void 0 : _c.getSheetBySheetName(name)) == null ? void 0 : _d.getSheetId()) || "";
+}
+__name(getSheetIdByName, "getSheetIdByName");
 function DataValidationDetail() {
-  const [key, setKey] = useState(0), dataValidationPanelService = useDependency(DataValidationPanelService), activeRuleInfo = useObservable(dataValidationPanelService.activeRule$, dataValidationPanelService.activeRule), { unitId, subUnitId, rule } = activeRuleInfo || {}, ruleId = rule.uid, validatorService = useDependency(DataValidatorRegistryService), componentManager = useDependency(ComponentManager), commandService = useDependency(ICommandService), dataValidationModel = useDependency(DataValidationModel), localeService = useDependency(LocaleService), [localRule, setLocalRule] = useState(rule), validator = validatorService.getValidatorItem(localRule.type), [showError, setShowError] = useState(!1), validators = validatorService.getValidatorsByScope(DataValidatorRegistryScope.SHEET), [localRanges, setLocalRanges] = useState(() => localRule.ranges.map((i) => ({ unitId: "", sheetId: "", range: i }))), debounceExecute = useMemo(() => debounceExecuteFactory(commandService), [commandService]), sheetSelectionService = useDependency(SheetsSelectionsService);
+  const [key, setKey] = useState(0), dataValidationPanelService = useDependency(DataValidationPanelService), activeRuleInfo = useObservable(dataValidationPanelService.activeRule$, dataValidationPanelService.activeRule), { unitId, subUnitId, rule } = activeRuleInfo || {}, ruleId = rule.uid, validatorService = useDependency(DataValidatorRegistryService), univerInstanceService = useDependency(IUniverInstanceService), componentManager = useDependency(ComponentManager), commandService = useDependency(ICommandService), dataValidationModel = useDependency(DataValidationModel), localeService = useDependency(LocaleService), [localRule, setLocalRule] = useState(rule), validator = validatorService.getValidatorItem(localRule.type), [showError, setShowError] = useState(!1), validators = validatorService.getValidatorsByScope(DataValidatorRegistryScope.SHEET), [localRanges, setLocalRanges] = useState(() => localRule.ranges.map((i) => ({ unitId: "", sheetId: "", range: i }))), debounceExecute = useMemo(() => debounceExecuteFactory(commandService), [commandService]), rangeSelectorActionsRef = useRef({}), [isFocusRangeSelector, isFocusRangeSelectorSet] = useState(!1), sheetSelectionService = useDependency(SheetsSelectionsService);
   if (useEffect(() => () => {
     const currentSelection = sheetSelectionService.getCurrentLastSelection();
     currentSelection && sheetSelectionService.setSelections([currentSelection]);
@@ -1114,7 +1124,18 @@ function DataValidationDetail() {
     return null;
   const operators = validator.operators, operatorNames = validator.operatorNames, isTwoFormula = localRule.operator ? TWO_FORMULA_OPERATOR_COUNT.includes(localRule.operator) : !1, handleOk = /* @__PURE__ */ __name(() => {
     localRule.ranges.length && (validator.validatorFormula(localRule, unitId, subUnitId).success ? dataValidationPanelService.setActiveRule(null) : setShowError(!0));
-  }, "handleOk"), handleUpdateRuleRanges = useEvent((unitRanges) => {
+  }, "handleOk"), handleUpdateRuleRanges = useEvent((rangeText) => {
+    const unitRanges = rangeText.split(",").map(deserializeRangeWithSheet).map((unitRange) => {
+      const sheetName = unitRange.sheetName;
+      if (sheetName) {
+        const sheetId = getSheetIdByName(univerInstanceService, unitRange.unitId, sheetName);
+        return { ...unitRange, sheetId };
+      }
+      return {
+        ...unitRange,
+        sheetId: ""
+      };
+    });
     if (isUnitRangesEqual(unitRanges, localRanges))
       return;
     setLocalRanges(unitRanges);
@@ -1194,8 +1215,12 @@ function DataValidationDetail() {
         options: newOptions
       }
     ));
-  }, "handleUpdateRuleOptions");
-  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$3.dataValidationDetail, children: [
+  }, "handleUpdateRuleOptions"), handlePanelClick = /* @__PURE__ */ __name((e) => {
+    var _a18;
+    const handleOutClick = (_a18 = rangeSelectorActionsRef.current) == null ? void 0 : _a18.handleOutClick;
+    handleOutClick && handleOutClick(e, isFocusRangeSelectorSet);
+  }, "handlePanelClick");
+  return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$3.dataValidationDetail, onClick: handlePanelClick, children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(
       FormLayout,
       {
@@ -1204,16 +1229,13 @@ function DataValidationDetail() {
         children: /* @__PURE__ */ jsxRuntimeExports.jsx(
           RangeSelector,
           {
-            className: styles$3.dataValidationDetailFormItem,
-            value: rangeStr,
-            id: createInternalEditorID("data-validation-detail"),
-            openForSheetUnitId: unitId,
-            openForSheetSubUnitId: subUnitId,
-            onChange: /* @__PURE__ */ __name((newRange) => {
-              newRange.some((i) => !isValidRange(i.range) || i.range.endColumn < i.range.startColumn || i.range.endRow < i.range.startRow) || handleUpdateRuleRanges(newRange);
-            }, "onChange")
-          },
-          key
+            unitId,
+            subUnitId,
+            initValue: rangeStr,
+            onChange: handleUpdateRuleRanges,
+            isFocus: isFocusRangeSelector,
+            actions: rangeSelectorActionsRef.current
+          }
         )
       }
     ),
@@ -1290,8 +1312,8 @@ const dataValidationItemContainer = "univer-data-validation-item-container", dat
     }), e.stopPropagation();
   }, "handleDelete");
   return useEffect(() => () => {
-    var _a17;
-    ids.current && ((_a17 = ids.current) == null || _a17.forEach((id) => {
+    var _a18;
+    ids.current && ((_a18 = ids.current) == null || _a18.forEach((id) => {
       id && markSelectionService.removeShape(id);
     }));
   }, [markSelectionService]), /* @__PURE__ */ jsxRuntimeExports.jsxs(
@@ -1322,8 +1344,8 @@ const dataValidationItemContainer = "univer-data-validation-item-container", dat
         })));
       }, "onMouseEnter"),
       onMouseLeave: /* @__PURE__ */ __name(() => {
-        var _a17;
-        setIsHover(!1), (_a17 = ids.current) == null || _a17.forEach((id) => {
+        var _a18;
+        setIsHover(!1), (_a18 = ids.current) == null || _a18.forEach((id) => {
           id && markSelectionService.removeShape(id);
         }), ids.current = void 0;
       }, "onMouseLeave"),
@@ -1382,7 +1404,7 @@ function DataValidationListWithWorkbook(props) {
   }, "getDvRulesByPermissionCorrect"))(rules), hasDisableRule = rulesByPermissionCheck == null ? void 0 : rulesByPermissionCheck.some((rule) => rule.disable);
   return /* @__PURE__ */ jsxRuntimeExports.jsxs("div", { className: styles$1.dataValidationList, children: [
     rulesByPermissionCheck == null ? void 0 : rulesByPermissionCheck.map((rule) => {
-      var _a17;
+      var _a18;
       return /* @__PURE__ */ jsxRuntimeExports.jsx(
         DataValidationItem,
         {
@@ -1396,7 +1418,7 @@ function DataValidationListWithWorkbook(props) {
             });
           }, "onClick"),
           rule,
-          disable: (_a17 = rule.disable) != null ? _a17 : !1
+          disable: (_a18 = rule.disable) != null ? _a18 : !1
         },
         rule.uid
       );
@@ -1414,7 +1436,7 @@ const DataValidationPanel = /* @__PURE__ */ __name(() => {
 }, "DataValidationPanel"), LIST_DROPDOWN_KEY = "data-validation.list.dropdown", DATE_DROPDOWN_KEY = "data-validation.date.dropdown", AddSheetDataValidationAndOpenCommand = {
   type: CommandType.COMMAND,
   id: "data-validation.command.addRuleAndOpen",
-  async handler(accessor) {
+  handler(accessor) {
     const univerInstanceService = accessor.get(IUniverInstanceService), target = getSheetCommandTarget(univerInstanceService);
     if (!target) return !1;
     const { workbook, worksheet } = target, rule = createDefaultNewRule(accessor), commandService = accessor.get(ICommandService), unitId = workbook.getUnitId(), subUnitId = worksheet.getSheetId(), addParams = {
@@ -1422,17 +1444,17 @@ const DataValidationPanel = /* @__PURE__ */ __name(() => {
       unitId,
       subUnitId
     };
-    return await commandService.executeCommand(AddSheetDataValidationCommand.id, addParams) ? (commandService.executeCommand(OpenValidationPanelOperation.id, {
+    return commandService.syncExecuteCommand(AddSheetDataValidationCommand.id, addParams) ? (commandService.syncExecuteCommand(OpenValidationPanelOperation.id, {
       ruleId: rule.uid,
       isAdd: !0
     }), !0) : !1;
   }
 };
-var __defProp$b = Object.defineProperty, __getOwnPropDesc$b = Object.getOwnPropertyDescriptor, __decorateClass$b = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$b(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$c = Object.defineProperty, __getOwnPropDesc$c = Object.getOwnPropertyDescriptor, __decorateClass$c = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$c(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$b(target, key, result), result;
-}, "__decorateClass$b"), __decorateParam$b = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$b");
+  return kind && result && __defProp$c(target, key, result), result;
+}, "__decorateClass$c"), __decorateParam$c = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$c");
 const ALERT_KEY = "SHEET_DATA_VALIDATION_ALERT";
 var _a4;
 let DataValidationAlertController = (_a4 = class extends Disposable {
@@ -1444,12 +1466,12 @@ let DataValidationAlertController = (_a4 = class extends Disposable {
   }
   _initCellAlertPopup() {
     this.disposeWithMe(this._hoverManagerService.currentCell$.pipe(debounceTime(100)).subscribe((cellPos) => {
-      var _a17, _b;
+      var _a18, _b;
       if (cellPos) {
         const worksheet = this._univerInstanceService.getCurrentUnitForType(UniverInstanceType.UNIVER_SHEET).getActiveSheet();
         if (!worksheet) return;
         const cellData = worksheet.getCell(cellPos.location.row, cellPos.location.col);
-        if (((_a17 = cellData == null ? void 0 : cellData.dataValidation) == null ? void 0 : _a17.validStatus) === DataValidationStatus.INVALID) {
+        if (((_a18 = cellData == null ? void 0 : cellData.dataValidation) == null ? void 0 : _a18.validStatus) === DataValidationStatus.INVALID) {
           const currentAlert = this._cellAlertManagerService.currentAlert.get(ALERT_KEY), currentLoc = (_b = currentAlert == null ? void 0 : currentAlert.alert) == null ? void 0 : _b.location;
           if (currentLoc && currentLoc.row === cellPos.location.row && currentLoc.col === cellPos.location.col && currentLoc.subUnitId === cellPos.location.subUnitId && currentLoc.unitId === cellPos.location.unitId)
             return;
@@ -1477,18 +1499,18 @@ let DataValidationAlertController = (_a4 = class extends Disposable {
     }));
   }
 }, __name(_a4, "DataValidationAlertController"), _a4);
-DataValidationAlertController = __decorateClass$b([
-  __decorateParam$b(0, Inject(HoverManagerService)),
-  __decorateParam$b(1, Inject(CellAlertManagerService)),
-  __decorateParam$b(2, IUniverInstanceService),
-  __decorateParam$b(3, Inject(LocaleService)),
-  __decorateParam$b(4, IZenZoneService)
+DataValidationAlertController = __decorateClass$c([
+  __decorateParam$c(0, Inject(HoverManagerService)),
+  __decorateParam$c(1, Inject(CellAlertManagerService)),
+  __decorateParam$c(2, IUniverInstanceService),
+  __decorateParam$c(3, Inject(LocaleService)),
+  __decorateParam$c(4, IZenZoneService)
 ], DataValidationAlertController);
-var __defProp$a = Object.defineProperty, __getOwnPropDesc$a = Object.getOwnPropertyDescriptor, __decorateClass$a = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$a(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$b = Object.defineProperty, __getOwnPropDesc$b = Object.getOwnPropertyDescriptor, __decorateClass$b = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$b(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$a(target, key, result), result;
-}, "__decorateClass$a"), __decorateParam$a = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$a"), _a5;
+  return kind && result && __defProp$b(target, key, result), result;
+}, "__decorateClass$b"), __decorateParam$b = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$b"), _a5;
 let DataValidationAutoFillController = (_a5 = class extends Disposable {
   constructor(_autoFillService, _dataValidationModel, _injector) {
     super(), this._autoFillService = _autoFillService, this._dataValidationModel = _dataValidationModel, this._injector = _injector, this._initAutoFill();
@@ -1565,16 +1587,16 @@ let DataValidationAutoFillController = (_a5 = class extends Disposable {
     this.disposeWithMe(this._autoFillService.addHook(hook));
   }
 }, __name(_a5, "DataValidationAutoFillController"), _a5);
-DataValidationAutoFillController = __decorateClass$a([
-  __decorateParam$a(0, IAutoFillService),
-  __decorateParam$a(1, Inject(SheetDataValidationModel)),
-  __decorateParam$a(2, Inject(Injector))
+DataValidationAutoFillController = __decorateClass$b([
+  __decorateParam$b(0, IAutoFillService),
+  __decorateParam$b(1, Inject(SheetDataValidationModel)),
+  __decorateParam$b(2, Inject(Injector))
 ], DataValidationAutoFillController);
-var __defProp$9 = Object.defineProperty, __getOwnPropDesc$9 = Object.getOwnPropertyDescriptor, __decorateClass$9 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$9(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$a = Object.defineProperty, __getOwnPropDesc$a = Object.getOwnPropertyDescriptor, __decorateClass$a = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$a(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$9(target, key, result), result;
-}, "__decorateClass$9"), __decorateParam$9 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$9"), _a6;
+  return kind && result && __defProp$a(target, key, result), result;
+}, "__decorateClass$a"), __decorateParam$a = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$a"), _a6;
 let DataValidationCopyPasteController = (_a6 = class extends Disposable {
   constructor(_sheetClipboardService, _sheetDataValidationModel, _injector) {
     super();
@@ -1630,8 +1652,8 @@ let DataValidationCopyPasteController = (_a6 = class extends Disposable {
     if (copyInfo.unitId !== unitId || subUnitId !== copyInfo.subUnitId) {
       const ruleMatrix = this._sheetDataValidationModel.getRuleObjectMatrix(copyInfo.unitId, copyInfo.subUnitId).clone(), additionMatrix = new ObjectMatrix(), addRules = /* @__PURE__ */ new Set(), { ranges: [vCopyRange, vPastedRange], mapFunc } = virtualizeDiscreteRanges([copyInfo.copyRange, pastedRange]), repeatRange = getRepeatRange(vCopyRange, vPastedRange, !0), additionRules = /* @__PURE__ */ new Map();
       repeatRange.forEach(({ startRange }) => {
-        var _a17;
-        (_a17 = this._copyInfo) == null || _a17.matrix.forValue((row, col, ruleId) => {
+        var _a18;
+        (_a18 = this._copyInfo) == null || _a18.matrix.forValue((row, col, ruleId) => {
           const range = Rectangle.getPositionRange(
             {
               startRow: row,
@@ -1662,8 +1684,8 @@ let DataValidationCopyPasteController = (_a6 = class extends Disposable {
     } else {
       const ruleMatrix = this._sheetDataValidationModel.getRuleObjectMatrix(unitId, subUnitId).clone(), additionMatrix = new ObjectMatrix(), additionRules = /* @__PURE__ */ new Set(), { ranges: [vCopyRange, vPastedRange], mapFunc } = virtualizeDiscreteRanges([copyInfo.copyRange, pastedRange]);
       getRepeatRange(vCopyRange, vPastedRange, !0).forEach(({ startRange }) => {
-        var _a17;
-        (_a17 = this._copyInfo) == null || _a17.matrix.forValue((row, col, ruleId) => {
+        var _a18;
+        (_a18 = this._copyInfo) == null || _a18.matrix.forValue((row, col, ruleId) => {
           const range = Rectangle.getPositionRange(
             {
               startRow: row,
@@ -1692,16 +1714,16 @@ let DataValidationCopyPasteController = (_a6 = class extends Disposable {
     }
   }
 }, __name(_a6, "DataValidationCopyPasteController"), _a6);
-DataValidationCopyPasteController = __decorateClass$9([
-  __decorateParam$9(0, ISheetClipboardService),
-  __decorateParam$9(1, Inject(SheetDataValidationModel)),
-  __decorateParam$9(2, Inject(Injector))
+DataValidationCopyPasteController = __decorateClass$a([
+  __decorateParam$a(0, ISheetClipboardService),
+  __decorateParam$a(1, Inject(SheetDataValidationModel)),
+  __decorateParam$a(2, Inject(Injector))
 ], DataValidationCopyPasteController);
-var __defProp$8 = Object.defineProperty, __getOwnPropDesc$8 = Object.getOwnPropertyDescriptor, __decorateClass$8 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$8(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$9 = Object.defineProperty, __getOwnPropDesc$9 = Object.getOwnPropertyDescriptor, __decorateClass$9 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$9(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$8(target, key, result), result;
-}, "__decorateClass$8"), __decorateParam$8 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$8"), _a7;
+  return kind && result && __defProp$9(target, key, result), result;
+}, "__decorateClass$9"), __decorateParam$9 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$9"), _a7;
 let DataValidationPermissionController = (_a7 = class extends Disposable {
   constructor(_localeService, _commandService, _sheetPermissionInterceptorBaseController) {
     super(), this._localeService = _localeService, this._commandService = _commandService, this._sheetPermissionInterceptorBaseController = _sheetPermissionInterceptorBaseController, this._commandExecutedListener();
@@ -1722,10 +1744,10 @@ let DataValidationPermissionController = (_a7 = class extends Disposable {
     );
   }
 }, __name(_a7, "DataValidationPermissionController"), _a7);
-DataValidationPermissionController = __decorateClass$8([
-  __decorateParam$8(0, Inject(LocaleService)),
-  __decorateParam$8(1, ICommandService),
-  __decorateParam$8(2, Inject(SheetPermissionInterceptorBaseController))
+DataValidationPermissionController = __decorateClass$9([
+  __decorateParam$9(0, Inject(LocaleService)),
+  __decorateParam$9(1, ICommandService),
+  __decorateParam$9(2, Inject(SheetPermissionInterceptorBaseController))
 ], DataValidationPermissionController);
 const DataValidationIcon = "data-validation-single", DATA_VALIDATION_MENU_ID = "sheet.menu.data-validation";
 function dataValidationMenuFactory(accessor) {
@@ -1771,11 +1793,11 @@ const menuSchema = {
     }
   }
 };
-var __defProp$7 = Object.defineProperty, __getOwnPropDesc$7 = Object.getOwnPropertyDescriptor, __decorateClass$7 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
-  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$7(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+var __defProp$8 = Object.defineProperty, __getOwnPropDesc$8 = Object.getOwnPropertyDescriptor, __decorateClass$8 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$8(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
-  return kind && result && __defProp$7(target, key, result), result;
-}, "__decorateClass$7"), __decorateParam$7 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$7");
+  return kind && result && __defProp$8(target, key, result), result;
+}, "__decorateClass$8"), __decorateParam$8 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$8");
 const INVALID_MARK = {
   tr: {
     size: 6,
@@ -1784,17 +1806,17 @@ const INVALID_MARK = {
 };
 var _a8;
 let SheetsDataValidationRenderController = (_a8 = class extends RxDisposable {
-  constructor(_commandService, _menuManagerService, _renderManagerService, _univerInstanceService, _autoHeightController, _dropdownManagerService, _sheetDataValidationModel, _dataValidatorRegistryService, _sheetInterceptorService, _editorBridgeService) {
-    super(), this._commandService = _commandService, this._menuManagerService = _menuManagerService, this._renderManagerService = _renderManagerService, this._univerInstanceService = _univerInstanceService, this._autoHeightController = _autoHeightController, this._dropdownManagerService = _dropdownManagerService, this._sheetDataValidationModel = _sheetDataValidationModel, this._dataValidatorRegistryService = _dataValidatorRegistryService, this._sheetInterceptorService = _sheetInterceptorService, this._editorBridgeService = _editorBridgeService, this._initMenu(), this._initDropdown(), this._initViewModelIntercept(), this._initAutoHeight();
+  constructor(_commandService, _menuManagerService, _renderManagerService, _univerInstanceService, _autoHeightController, _dropdownManagerService, _sheetDataValidationModel, _dataValidatorRegistryService, _sheetInterceptorService, _dataValidationCacheService, _editorBridgeService) {
+    super(), this._commandService = _commandService, this._menuManagerService = _menuManagerService, this._renderManagerService = _renderManagerService, this._univerInstanceService = _univerInstanceService, this._autoHeightController = _autoHeightController, this._dropdownManagerService = _dropdownManagerService, this._sheetDataValidationModel = _sheetDataValidationModel, this._dataValidatorRegistryService = _dataValidatorRegistryService, this._sheetInterceptorService = _sheetInterceptorService, this._dataValidationCacheService = _dataValidationCacheService, this._editorBridgeService = _editorBridgeService, this._initMenu(), this._initDropdown(), this._initViewModelIntercept(), this._initAutoHeight();
   }
   _initMenu() {
     this._menuManagerService.mergeMenu(menuSchema);
   }
   _initDropdown() {
     this._editorBridgeService && this.disposeWithMe(this._editorBridgeService.visible$.subscribe((visible) => {
-      var _a17;
+      var _a18;
       if (!visible.visible) {
-        ((_a17 = this._dropdownManagerService.activeDropdown) == null ? void 0 : _a17.trigger) === "editor-bridge" && this._dropdownManagerService.hideDropdown();
+        ((_a18 = this._dropdownManagerService.activeDropdown) == null ? void 0 : _a18.trigger) === "editor-bridge" && this._dropdownManagerService.hideDropdown();
         return;
       }
       const state = this._editorBridgeService.getEditCellState();
@@ -1844,24 +1866,24 @@ let SheetsDataValidationRenderController = (_a8 = class extends RxDisposable {
           priority: InterceptCellContentPriority.DATA_VALIDATION,
           // eslint-disable-next-line max-lines-per-function, complexity
           handler: /* @__PURE__ */ __name((cell, pos, next) => {
-            var _a17, _b, _c, _d;
+            var _a18, _b, _c, _d, _e, _f;
             const { row, col, unitId, subUnitId, workbook, worksheet } = pos, ruleId = this._sheetDataValidationModel.getRuleIdByLocation(unitId, subUnitId, row, col);
             if (!ruleId)
               return next(cell);
             const rule = this._sheetDataValidationModel.getRuleById(unitId, subUnitId, ruleId);
             if (!rule)
               return next(cell);
-            const validStatus = this._sheetDataValidationModel.validator(cell, rule, pos), validator = this._dataValidatorRegistryService.getValidatorItem(rule.type), cellOrigin = pos.rawData;
+            const validStatus = (_b = (_a18 = this._dataValidationCacheService.getValue(unitId, subUnitId, row, col)) == null ? void 0 : _a18.status) != null ? _b : DataValidationStatus.VALID, validator = this._dataValidatorRegistryService.getValidatorItem(rule.type), cellOrigin = pos.rawData;
             let cache;
             const cellValue = {
               get value() {
-                var _a18;
-                return cache !== void 0 || (cache = (_a18 = getCellValueOrigin(cellOrigin)) != null ? _a18 : null), cache;
+                var _a19;
+                return cache !== void 0 || (cache = (_a19 = getCellValueOrigin(cellOrigin)) != null ? _a19 : null), cache;
               }
             }, valueStr = {
               get value() {
-                var _a18;
-                return `${(_a18 = cellValue.value) != null ? _a18 : ""}`;
+                var _a19;
+                return `${(_a19 = cellValue.value) != null ? _a19 : ""}`;
               }
             };
             return next({
@@ -1877,12 +1899,12 @@ let SheetsDataValidationRenderController = (_a8 = class extends RxDisposable {
                 ...validStatus === DataValidationStatus.INVALID ? INVALID_MARK : null
               },
               customRender: [
-                ...(_a17 = cell == null ? void 0 : cell.customRender) != null ? _a17 : [],
+                ...(_c = cell == null ? void 0 : cell.customRender) != null ? _c : [],
                 ...validator != null && validator.canvasRender ? [validator.canvasRender] : []
               ],
               fontRenderExtension: {
                 ...cell == null ? void 0 : cell.fontRenderExtension,
-                isSkip: ((_b = cell == null ? void 0 : cell.fontRenderExtension) == null ? void 0 : _b.isSkip) || ((_c = validator == null ? void 0 : validator.skipDefaultFontRender) == null ? void 0 : _c.call(validator, rule, cellValue.value, pos))
+                isSkip: ((_d = cell == null ? void 0 : cell.fontRenderExtension) == null ? void 0 : _d.isSkip) || ((_e = validator == null ? void 0 : validator.skipDefaultFontRender) == null ? void 0 : _e.call(validator, rule, cellValue.value, pos))
               },
               interceptorStyle: {
                 ...cell == null ? void 0 : cell.interceptorStyle,
@@ -1894,8 +1916,8 @@ let SheetsDataValidationRenderController = (_a8 = class extends RxDisposable {
                 })
               },
               interceptorAutoHeight: /* @__PURE__ */ __name(() => {
-                var _a18, _b2, _c2, _d2, _e, _f;
-                const skeleton = (_b2 = (_a18 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a18.with(SheetSkeletonManagerService).getWorksheetSkeleton(subUnitId)) == null ? void 0 : _b2.skeleton;
+                var _a19, _b2, _c2, _d2, _e2, _f2;
+                const skeleton = (_b2 = (_a19 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a19.with(SheetSkeletonManagerService).getWorksheetSkeleton(subUnitId)) == null ? void 0 : _b2.skeleton;
                 if (!skeleton)
                   return;
                 const mergeCell = skeleton.worksheet.getMergedCell(row, col), info = {
@@ -1917,9 +1939,9 @@ let SheetsDataValidationRenderController = (_a8 = class extends RxDisposable {
                   workbook,
                   worksheet
                 };
-                return (_f = (_e = validator == null ? void 0 : validator.canvasRender) == null ? void 0 : _e.calcCellAutoHeight) == null ? void 0 : _f.call(_e, info);
+                return (_f2 = (_e2 = validator == null ? void 0 : validator.canvasRender) == null ? void 0 : _e2.calcCellAutoHeight) == null ? void 0 : _f2.call(_e2, info);
               }, "interceptorAutoHeight"),
-              coverable: ((_d = cell == null ? void 0 : cell.coverable) != null ? _d : !0) && !(rule.type === DataValidationType.LIST || rule.type === DataValidationType.LIST_MULTIPLE)
+              coverable: ((_f = cell == null ? void 0 : cell.coverable) != null ? _f : !0) && !(rule.type === DataValidationType.LIST || rule.type === DataValidationType.LIST_MULTIPLE)
             });
           }, "handler")
         }
@@ -1935,8 +1957,8 @@ let SheetsDataValidationRenderController = (_a8 = class extends RxDisposable {
     ).subscribe((infos) => {
       const ranges = [];
       if (infos.forEach((info) => {
-        var _a17;
-        (_a17 = info.rule) != null && _a17.ranges && ranges.push(...info.rule.ranges);
+        var _a18;
+        (_a18 = info.rule) != null && _a18.ranges && ranges.push(...info.rule.ranges);
       }), ranges.length) {
         const mutations = this._autoHeightController.getUndoRedoParamsOfAutoHeight(ranges);
         sequenceExecute(mutations.redos, this._commandService);
@@ -1944,22 +1966,23 @@ let SheetsDataValidationRenderController = (_a8 = class extends RxDisposable {
     });
   }
 }, __name(_a8, "SheetsDataValidationRenderController"), _a8);
-SheetsDataValidationRenderController = __decorateClass$7([
-  __decorateParam$7(0, ICommandService),
-  __decorateParam$7(1, IMenuManagerService),
-  __decorateParam$7(2, IRenderManagerService),
-  __decorateParam$7(3, IUniverInstanceService),
-  __decorateParam$7(4, Inject(AutoHeightController)),
-  __decorateParam$7(5, Inject(DataValidationDropdownManagerService)),
-  __decorateParam$7(6, Inject(SheetDataValidationModel)),
-  __decorateParam$7(7, Inject(DataValidatorRegistryService)),
-  __decorateParam$7(8, Inject(SheetInterceptorService)),
-  __decorateParam$7(9, Optional(IEditorBridgeService))
+SheetsDataValidationRenderController = __decorateClass$8([
+  __decorateParam$8(0, ICommandService),
+  __decorateParam$8(1, IMenuManagerService),
+  __decorateParam$8(2, IRenderManagerService),
+  __decorateParam$8(3, IUniverInstanceService),
+  __decorateParam$8(4, Inject(AutoHeightController)),
+  __decorateParam$8(5, Inject(DataValidationDropdownManagerService)),
+  __decorateParam$8(6, Inject(SheetDataValidationModel)),
+  __decorateParam$8(7, Inject(DataValidatorRegistryService)),
+  __decorateParam$8(8, Inject(SheetInterceptorService)),
+  __decorateParam$8(9, Inject(DataValidationCacheService)),
+  __decorateParam$8(10, Optional(IEditorBridgeService))
 ], SheetsDataValidationRenderController);
 var _a9;
 let SheetsDataValidationMobileRenderController = (_a9 = class extends RxDisposable {
-  constructor(_commandService, _renderManagerService, _autoHeightController, _dataValidatorRegistryService, _sheetInterceptorService, _sheetDataValidationModel) {
-    super(), this._commandService = _commandService, this._renderManagerService = _renderManagerService, this._autoHeightController = _autoHeightController, this._dataValidatorRegistryService = _dataValidatorRegistryService, this._sheetInterceptorService = _sheetInterceptorService, this._sheetDataValidationModel = _sheetDataValidationModel, this._initViewModelIntercept(), this._initAutoHeight();
+  constructor(_commandService, _renderManagerService, _autoHeightController, _dataValidatorRegistryService, _sheetInterceptorService, _sheetDataValidationModel, _dataValidationCacheService) {
+    super(), this._commandService = _commandService, this._renderManagerService = _renderManagerService, this._autoHeightController = _autoHeightController, this._dataValidatorRegistryService = _dataValidatorRegistryService, this._sheetInterceptorService = _sheetInterceptorService, this._sheetDataValidationModel = _sheetDataValidationModel, this._dataValidationCacheService = _dataValidationCacheService, this._initViewModelIntercept(), this._initAutoHeight();
   }
   // eslint-disable-next-line max-lines-per-function
   _initViewModelIntercept() {
@@ -1972,14 +1995,14 @@ let SheetsDataValidationMobileRenderController = (_a9 = class extends RxDisposab
           priority: InterceptCellContentPriority.DATA_VALIDATION,
           // eslint-disable-next-line complexity
           handler: /* @__PURE__ */ __name((cell, pos, next) => {
-            var _a17, _b, _c, _d;
+            var _a18, _b, _c, _d, _e, _f;
             const { row, col, unitId, subUnitId, workbook, worksheet } = pos, ruleId = this._sheetDataValidationModel.getRuleIdByLocation(unitId, subUnitId, row, col);
             if (!ruleId)
               return next(cell);
             const rule = this._sheetDataValidationModel.getRuleById(unitId, subUnitId, ruleId);
             if (!rule)
               return next(cell);
-            const validStatus = this._sheetDataValidationModel.validator(cell, rule, pos), validator = this._dataValidatorRegistryService.getValidatorItem(rule.type), cellOrigin = worksheet.getCellRaw(row, col), cellValue = getCellValueOrigin(cellOrigin), valueStr = `${cellValue != null ? cellValue : ""}`;
+            const validStatus = (_b = (_a18 = this._dataValidationCacheService.getValue(unitId, subUnitId, row, col)) == null ? void 0 : _a18.status) != null ? _b : DataValidationStatus.VALID, validator = this._dataValidatorRegistryService.getValidatorItem(rule.type), cellOrigin = worksheet.getCellRaw(row, col), cellValue = getCellValueOrigin(cellOrigin), valueStr = `${cellValue != null ? cellValue : ""}`;
             return next({
               ...cell,
               dataValidation: {
@@ -1993,12 +2016,12 @@ let SheetsDataValidationMobileRenderController = (_a9 = class extends RxDisposab
                 ...validStatus === DataValidationStatus.INVALID ? INVALID_MARK : null
               },
               customRender: [
-                ...(_a17 = cell == null ? void 0 : cell.customRender) != null ? _a17 : [],
+                ...(_c = cell == null ? void 0 : cell.customRender) != null ? _c : [],
                 ...validator != null && validator.canvasRender ? [validator.canvasRender] : []
               ],
               fontRenderExtension: {
                 ...cell == null ? void 0 : cell.fontRenderExtension,
-                isSkip: ((_b = cell == null ? void 0 : cell.fontRenderExtension) == null ? void 0 : _b.isSkip) || ((_c = validator == null ? void 0 : validator.skipDefaultFontRender) == null ? void 0 : _c.call(validator, rule, cellValue, pos))
+                isSkip: ((_d = cell == null ? void 0 : cell.fontRenderExtension) == null ? void 0 : _d.isSkip) || ((_e = validator == null ? void 0 : validator.skipDefaultFontRender) == null ? void 0 : _e.call(validator, rule, cellValue, pos))
               },
               interceptorStyle: {
                 ...cell == null ? void 0 : cell.interceptorStyle,
@@ -2010,8 +2033,8 @@ let SheetsDataValidationMobileRenderController = (_a9 = class extends RxDisposab
                 })
               },
               interceptorAutoHeight: /* @__PURE__ */ __name(() => {
-                var _a18, _b2, _c2, _d2, _e, _f;
-                const skeleton = (_b2 = (_a18 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a18.with(SheetSkeletonManagerService).getWorksheetSkeleton(subUnitId)) == null ? void 0 : _b2.skeleton;
+                var _a19, _b2, _c2, _d2, _e2, _f2;
+                const skeleton = (_b2 = (_a19 = this._renderManagerService.getRenderById(unitId)) == null ? void 0 : _a19.with(SheetSkeletonManagerService).getWorksheetSkeleton(subUnitId)) == null ? void 0 : _b2.skeleton;
                 if (!skeleton)
                   return;
                 const mergeCell = skeleton.worksheet.getMergedCell(row, col), info = {
@@ -2033,9 +2056,9 @@ let SheetsDataValidationMobileRenderController = (_a9 = class extends RxDisposab
                   workbook,
                   worksheet
                 };
-                return (_f = (_e = validator == null ? void 0 : validator.canvasRender) == null ? void 0 : _e.calcCellAutoHeight) == null ? void 0 : _f.call(_e, info);
+                return (_f2 = (_e2 = validator == null ? void 0 : validator.canvasRender) == null ? void 0 : _e2.calcCellAutoHeight) == null ? void 0 : _f2.call(_e2, info);
               }, "interceptorAutoHeight"),
-              coverable: ((_d = cell == null ? void 0 : cell.coverable) != null ? _d : !0) && !(rule.type === DataValidationType.LIST || rule.type === DataValidationType.LIST_MULTIPLE)
+              coverable: ((_f = cell == null ? void 0 : cell.coverable) != null ? _f : !0) && !(rule.type === DataValidationType.LIST || rule.type === DataValidationType.LIST_MULTIPLE)
             });
           }, "handler")
         }
@@ -2049,8 +2072,8 @@ let SheetsDataValidationMobileRenderController = (_a9 = class extends RxDisposab
     ).subscribe((infos) => {
       const ranges = [];
       if (infos.forEach((info) => {
-        var _a17;
-        (_a17 = info.rule) != null && _a17.ranges && ranges.push(...info.rule.ranges);
+        var _a18;
+        (_a18 = info.rule) != null && _a18.ranges && ranges.push(...info.rule.ranges);
       }), ranges.length) {
         const mutations = this._autoHeightController.getUndoRedoParamsOfAutoHeight(ranges);
         sequenceExecute(mutations.redos, this._commandService);
@@ -2058,14 +2081,44 @@ let SheetsDataValidationMobileRenderController = (_a9 = class extends RxDisposab
     });
   }
 }, __name(_a9, "SheetsDataValidationMobileRenderController"), _a9);
-SheetsDataValidationMobileRenderController = __decorateClass$7([
-  __decorateParam$7(0, ICommandService),
-  __decorateParam$7(1, IRenderManagerService),
-  __decorateParam$7(2, Inject(AutoHeightController)),
-  __decorateParam$7(3, Inject(DataValidatorRegistryService)),
-  __decorateParam$7(4, Inject(SheetInterceptorService)),
-  __decorateParam$7(5, Inject(SheetDataValidationModel))
+SheetsDataValidationMobileRenderController = __decorateClass$8([
+  __decorateParam$8(0, ICommandService),
+  __decorateParam$8(1, IRenderManagerService),
+  __decorateParam$8(2, Inject(AutoHeightController)),
+  __decorateParam$8(3, Inject(DataValidatorRegistryService)),
+  __decorateParam$8(4, Inject(SheetInterceptorService)),
+  __decorateParam$8(5, Inject(SheetDataValidationModel)),
+  __decorateParam$8(6, Inject(DataValidationCacheService))
 ], SheetsDataValidationMobileRenderController);
+var __defProp$7 = Object.defineProperty, __getOwnPropDesc$7 = Object.getOwnPropertyDescriptor, __decorateClass$7 = /* @__PURE__ */ __name((decorators, target, key, kind) => {
+  for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$7(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
+    (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
+  return kind && result && __defProp$7(target, key, result), result;
+}, "__decorateClass$7"), __decorateParam$7 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$7"), _a10;
+let SheetsDataValidationReRenderController = (_a10 = class extends Disposable {
+  constructor(_context, _sheetDataValidationModel, _sheetSkeletonManagerService) {
+    super(), this._context = _context, this._sheetDataValidationModel = _sheetDataValidationModel, this._sheetSkeletonManagerService = _sheetSkeletonManagerService, this._initSkeletonChange();
+  }
+  _initSkeletonChange() {
+    const reRender = /* @__PURE__ */ __name((values) => {
+      var _a18;
+      if (!values.length)
+        return;
+      const sheetIds = /* @__PURE__ */ new Set();
+      values.forEach((value) => {
+        sheetIds.add(value.subUnitId);
+      }), sheetIds.forEach((sheetId) => {
+        var _a19;
+        (_a19 = this._sheetSkeletonManagerService.getWorksheetSkeleton(sheetId)) == null || _a19.skeleton.makeDirty(!0);
+      }), (_a18 = this._context.mainComponent) == null || _a18.makeForceDirty();
+    }, "reRender");
+    this.disposeWithMe(this._sheetDataValidationModel.validStatusChange$.pipe(bufferDebounceTime(16)).subscribe(reRender));
+  }
+}, __name(_a10, "SheetsDataValidationReRenderController"), _a10);
+SheetsDataValidationReRenderController = __decorateClass$7([
+  __decorateParam$7(1, Inject(SheetDataValidationModel)),
+  __decorateParam$7(2, Inject(SheetSkeletonManagerService))
+], SheetsDataValidationReRenderController);
 const dataValidationFormula = "univer-data-validation-formula", dataValidationFormulaAnd = "univer-data-validation-formula-and", dataValidationFormulaListItem = "univer-data-validation-formula-list-item", dataValidationFormulaListItemIcon = "univer-data-validation-formula-list-item-icon", dataValidationFormulaListItemDrag = "univer-data-validation-formula-list-item-drag", dataValidationFormulaListAdd = "univer-data-validation-formula-list-add", dataValidationFormulaColorSelect = "univer-data-validation-formula-color-select", dataValidationFormulaColorSelectPanel = "univer-data-validation-formula-color-select-panel", dataValidationFormulaColorItem = "univer-data-validation-formula-color-item", styles = {
   dataValidationFormula,
   dataValidationFormulaAnd,
@@ -2169,12 +2222,12 @@ function CheckboxFormulaInput(props) {
 }
 __name(CheckboxFormulaInput, "CheckboxFormulaInput");
 function CustomFormulaInput(props) {
-  var _a17;
+  var _a18;
   const { unitId, subUnitId, value, onChange, showError, validResult } = props, formula1Res = showError ? validResult == null ? void 0 : validResult.formula1 : "";
   return /* @__PURE__ */ jsxRuntimeExports.jsx(FormLayout, { error: formula1Res, children: /* @__PURE__ */ jsxRuntimeExports.jsx(
     TextEditor,
     {
-      value: (_a17 = value == null ? void 0 : value.formula1) != null ? _a17 : "",
+      value: (_a18 = value == null ? void 0 : value.formula1) != null ? _a18 : "",
       id: createInternalEditorID(`dataValidation-custom-formula-${unitId}-${subUnitId}`),
       onChange: /* @__PURE__ */ __name((newValue) => {
         onChange == null || onChange({
@@ -2463,9 +2516,9 @@ const CUSTOM_FORMULA_INPUT_NAME = "data-validation.custom-formula-input", BASE_F
   ]
 ], LIST_RENDER_MODE_OPTION_INPUT = "LIST_RENDER_MODE_OPTION_INPUT";
 function ListRenderModeInput(props) {
-  var _a17;
+  var _a18;
   const { value, onChange } = props, localeService = useDependency(LocaleService);
-  return /* @__PURE__ */ jsxRuntimeExports.jsx(FormLayout, { label: localeService.t("dataValidation.renderMode.label"), children: /* @__PURE__ */ jsxRuntimeExports.jsxs(RadioGroup, { value: `${(_a17 = value.renderMode) != null ? _a17 : DataValidationRenderMode.CUSTOM}`, onChange: /* @__PURE__ */ __name((renderMode) => onChange({ ...value, renderMode: +renderMode }), "onChange"), children: [
+  return /* @__PURE__ */ jsxRuntimeExports.jsx(FormLayout, { label: localeService.t("dataValidation.renderMode.label"), children: /* @__PURE__ */ jsxRuntimeExports.jsxs(RadioGroup, { value: `${(_a18 = value.renderMode) != null ? _a18 : DataValidationRenderMode.CUSTOM}`, onChange: /* @__PURE__ */ __name((renderMode) => onChange({ ...value, renderMode: +renderMode }), "onChange"), children: [
     /* @__PURE__ */ jsxRuntimeExports.jsx(Radio, { value: `${DataValidationRenderMode.CUSTOM}`, children: localeService.t("dataValidation.renderMode.chip") }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(Radio, { value: `${DataValidationRenderMode.ARROW}`, children: localeService.t("dataValidation.renderMode.arrow") }),
     /* @__PURE__ */ jsxRuntimeExports.jsx(Radio, { value: `${DataValidationRenderMode.TEXT}`, children: localeService.t("dataValidation.renderMode.text") })
@@ -2475,12 +2528,12 @@ __name(ListRenderModeInput, "ListRenderModeInput");
 ListRenderModeInput.componentKey = LIST_RENDER_MODE_OPTION_INPUT;
 const DATE_SHOW_TIME_OPTION = "DATE_SHOW_TIME_OPTION";
 function DateShowTimeOption(props) {
-  var _a17;
+  var _a18;
   const { value, onChange } = props, localeService = useDependency(LocaleService);
   return /* @__PURE__ */ jsxRuntimeExports.jsx(FormLayout, { children: /* @__PURE__ */ jsxRuntimeExports.jsx(
     Checkbox,
     {
-      checked: (_a17 = value.bizInfo) == null ? void 0 : _a17.showTime,
+      checked: (_a18 = value.bizInfo) == null ? void 0 : _a18.showTime,
       onChange: /* @__PURE__ */ __name((showTime) => {
         onChange({
           ...value,
@@ -2502,14 +2555,14 @@ var __defProp$6 = Object.defineProperty, __getOwnPropDesc$6 = Object.getOwnPrope
   return kind && result && __defProp$6(target, key, result), result;
 }, "__decorateClass$6"), __decorateParam$6 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$6");
 const MARGIN_H$2 = 6;
-var _a10;
-let CheckboxRender = (_a10 = class {
+var _a11;
+let CheckboxRender = (_a11 = class {
   constructor(_commandService, _formulaService, _themeService) {
     this._commandService = _commandService, this._formulaService = _formulaService, this._themeService = _themeService;
   }
   _calc(cellInfo, style) {
-    var _a17, _b, _c;
-    const { vt, ht } = style || {}, width = cellInfo.endX - cellInfo.startX - MARGIN_H$2 * 2, height = cellInfo.endY - cellInfo.startY, size = ((_a17 = style == null ? void 0 : style.fs) != null ? _a17 : 10) * 1.6;
+    var _a18, _b, _c;
+    const { vt, ht } = style || {}, width = cellInfo.endX - cellInfo.startX - MARGIN_H$2 * 2, height = cellInfo.endY - cellInfo.startY, size = ((_a18 = style == null ? void 0 : style.fs) != null ? _a18 : 10) * 1.6;
     let widgetLeft = 0, widgetTop = 0;
     switch (vt) {
       case VerticalAlign.TOP:
@@ -2541,21 +2594,21 @@ let CheckboxRender = (_a10 = class {
     };
   }
   calcCellAutoHeight(info) {
-    var _a17;
+    var _a18;
     const { style } = info;
-    return ((_a17 = style == null ? void 0 : style.fs) != null ? _a17 : 10) * 1.6;
+    return ((_a18 = style == null ? void 0 : style.fs) != null ? _a18 : 10) * 1.6;
   }
   async _parseFormula(rule, unitId, subUnitId) {
-    var _a17, _b;
+    var _a18, _b;
     const { formula1 = CHECKBOX_FORMULA_1, formula2 = CHECKBOX_FORMULA_2 } = rule, results = await this._formulaService.getRuleFormulaResult(unitId, subUnitId, rule.uid);
     return {
-      formula1: isFormulaString(formula1) ? getFormulaResult((_a17 = results == null ? void 0 : results[0]) == null ? void 0 : _a17.result) : formula1,
+      formula1: isFormulaString(formula1) ? getFormulaResult((_a18 = results == null ? void 0 : results[0]) == null ? void 0 : _a18.result) : formula1,
       formula2: isFormulaString(formula2) ? getFormulaResult((_b = results == null ? void 0 : results[1]) == null ? void 0 : _b.result) : formula2
     };
   }
   drawWith(ctx, info) {
-    var _a17, _b, _c, _d, _e, _f;
-    const { style, data, primaryWithCoord, unitId, subUnitId, worksheet, row, col } = info, cellBounding = primaryWithCoord.isMergedMainCell ? primaryWithCoord.mergeInfo : primaryWithCoord, value = getCellValueOrigin(worksheet.getCellRaw(row, col)), rule = (_a17 = data.dataValidation) == null ? void 0 : _a17.rule, validator = (_b = data.dataValidation) == null ? void 0 : _b.validator;
+    var _a18, _b, _c, _d, _e, _f;
+    const { style, data, primaryWithCoord, unitId, subUnitId, worksheet, row, col } = info, cellBounding = primaryWithCoord.isMergedMainCell ? primaryWithCoord.mergeInfo : primaryWithCoord, value = getCellValueOrigin(worksheet.getCellRaw(row, col)), rule = (_a18 = data.dataValidation) == null ? void 0 : _a18.rule, validator = (_b = data.dataValidation) == null ? void 0 : _b.validator;
     if (!rule || !validator)
       return;
     const colors = this._themeService.getCurrentTheme();
@@ -2588,10 +2641,10 @@ let CheckboxRender = (_a10 = class {
     return offsetX <= endX && offsetX >= startX && offsetY <= endY && offsetY >= startY;
   }
   async onPointerDown(info, evt) {
-    var _a17, _b, _c;
+    var _a18, _b, _c;
     if (evt.button === 2)
       return;
-    const { primaryWithCoord, unitId, subUnitId, data, worksheet, row, col } = info, value = getCellValueOrigin(worksheet.getCellRaw(row, col)), rule = (_a17 = data.dataValidation) == null ? void 0 : _a17.rule, validator = (_b = data.dataValidation) == null ? void 0 : _b.validator;
+    const { primaryWithCoord, unitId, subUnitId, data, worksheet, row, col } = info, value = getCellValueOrigin(worksheet.getCellRaw(row, col)), rule = (_a18 = data.dataValidation) == null ? void 0 : _a18.rule, validator = (_b = data.dataValidation) == null ? void 0 : _b.validator;
     if (!rule || !validator || !((_c = validator.skipDefaultFontRender) != null && _c.call(validator, rule, value, { unitId, subUnitId })))
       return;
     const { formula1, formula2 } = await this._parseFormula(rule, unitId, subUnitId), params = {
@@ -2611,7 +2664,7 @@ let CheckboxRender = (_a10 = class {
       params
     );
   }
-}, __name(_a10, "CheckboxRender"), _a10);
+}, __name(_a11, "CheckboxRender"), _a11);
 CheckboxRender = __decorateClass$6([
   __decorateParam$6(0, ICommandService),
   __decorateParam$6(1, Inject(DataValidationFormulaService)),
@@ -2621,8 +2674,8 @@ var __defProp$5 = Object.defineProperty, __getOwnPropDesc$5 = Object.getOwnPrope
   for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$5(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
   return kind && result && __defProp$5(target, key, result), result;
-}, "__decorateClass$5"), __decorateParam$5 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$5"), _a11;
-let BaseSheetDataValidatorView = (_a11 = class {
+}, "__decorateClass$5"), __decorateParam$5 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$5"), _a12;
+let BaseSheetDataValidatorView = (_a12 = class {
   constructor(injector) {
     __publicField(this, "canvasRender", null);
     __publicField(this, "dropdown");
@@ -2630,7 +2683,7 @@ let BaseSheetDataValidatorView = (_a11 = class {
     __publicField(this, "formulaInput", LIST_FORMULA_INPUT_NAME);
     this.injector = injector;
   }
-}, __name(_a11, "BaseSheetDataValidatorView"), _a11);
+}, __name(_a12, "BaseSheetDataValidatorView"), _a12);
 BaseSheetDataValidatorView = __decorateClass$5([
   __decorateParam$5(0, Inject(Injector))
 ], BaseSheetDataValidatorView);
@@ -2735,8 +2788,8 @@ var __defProp$4 = Object.defineProperty, __getOwnPropDesc$4 = Object.getOwnPrope
   return kind && result && __defProp$4(target, key, result), result;
 }, "__decorateClass$4"), __decorateParam$4 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$4");
 const downPath$1 = new Path2D("M3.32201 4.84556C3.14417 5.05148 2.85583 5.05148 2.67799 4.84556L0.134292 1.90016C-0.152586 1.56798 0.0505937 1 0.456301 1L5.5437 1C5.94941 1 6.15259 1.56798 5.86571 1.90016L3.32201 4.84556Z");
-var _a12;
-let DropdownMultipleWidget = (_a12 = class {
+var _a13;
+let DropdownMultipleWidget = (_a13 = class {
   constructor(_commandService) {
     __publicField(this, "zIndex");
     __publicField(this, "_dropdownInfoMap", /* @__PURE__ */ new Map());
@@ -2764,7 +2817,7 @@ let DropdownMultipleWidget = (_a12 = class {
   }
   // eslint-disable-next-line max-lines-per-function
   drawWith(ctx, info, skeleton, spreadsheets) {
-    var _a17, _b;
+    var _a18, _b;
     const { primaryWithCoord, row, col, style, data, subUnitId } = info, _cellBounding = primaryWithCoord.isMergedMainCell ? primaryWithCoord.mergeInfo : primaryWithCoord, fontRenderExtension = data.fontRenderExtension, { leftOffset = 0, rightOffset = 0, topOffset = 0, downOffset = 0 } = fontRenderExtension || {}, validation = data.dataValidation, map = this._ensureMap(subUnitId), key = this._generateKey(row, col);
     if (!validation)
       return;
@@ -2773,7 +2826,7 @@ let DropdownMultipleWidget = (_a12 = class {
       endX: _cellBounding.endX - rightOffset,
       startY: _cellBounding.startY + topOffset,
       endY: _cellBounding.endY - downOffset
-    }, cellWidth = cellBounding.endX - cellBounding.startX, cellHeight = cellBounding.endY - cellBounding.startY, { cl } = style || {}, color = (_a17 = typeof cl == "object" ? cl == null ? void 0 : cl.rgb : cl) != null ? _a17 : "#000", fontStyle = getFontStyleString(style != null ? style : void 0), { rule, validator: _validator } = validation, validator = _validator, { vt: _vt, ht } = style || {}, vt = _vt != null ? _vt : VerticalAlign.MIDDLE, cellValue = (_b = getCellValueOrigin(data)) != null ? _b : "", items = validator.parseCellValue(cellValue), labelColorMap = validator.getListWithColorMap(rule), layout = layoutDropdowns(items, fontStyle, cellWidth, cellHeight);
+    }, cellWidth = cellBounding.endX - cellBounding.startX, cellHeight = cellBounding.endY - cellBounding.startY, { cl } = style || {}, color = (_a18 = typeof cl == "object" ? cl == null ? void 0 : cl.rgb : cl) != null ? _a18 : "#000", fontStyle = getFontStyleString(style != null ? style : void 0), { rule, validator: _validator } = validation, validator = _validator, { vt: _vt, ht } = style || {}, vt = _vt != null ? _vt : VerticalAlign.MIDDLE, cellValue = (_b = getCellValueOrigin(data)) != null ? _b : "", items = validator.parseCellValue(cellValue), labelColorMap = validator.getListWithColorMap(rule), layout = layoutDropdowns(items, fontStyle, cellWidth, cellHeight);
     this._drawDownIcon(ctx, cellBounding, cellWidth, cellHeight, vt), ctx.save(), ctx.translateWithPrecision(cellBounding.startX, cellBounding.startY), ctx.beginPath(), ctx.rect(0, 0, cellWidth - ICON_PLACE$1, cellHeight), ctx.clip(), ctx.translateWithPrecision(CELL_PADDING_H, CELL_PADDING_V);
     let top = 0;
     switch (vt) {
@@ -2812,7 +2865,7 @@ let DropdownMultipleWidget = (_a12 = class {
     });
   }
   calcCellAutoHeight(info) {
-    var _a17;
+    var _a18;
     const { primaryWithCoord, style, data } = info, fontRenderExtension = data.fontRenderExtension, { leftOffset = 0, rightOffset = 0, topOffset = 0, downOffset = 0 } = fontRenderExtension || {}, _cellBounding = primaryWithCoord.isMergedMainCell ? primaryWithCoord.mergeInfo : primaryWithCoord, cellBounding = {
       startX: _cellBounding.startX + leftOffset,
       endX: _cellBounding.endX - rightOffset,
@@ -2821,7 +2874,7 @@ let DropdownMultipleWidget = (_a12 = class {
     }, validation = data.dataValidation;
     if (!validation)
       return;
-    const cellWidth = cellBounding.endX - cellBounding.startX, cellHeight = cellBounding.endY - cellBounding.startY, cellValue = (_a17 = getCellValueOrigin(data)) != null ? _a17 : "", { validator: _validator } = validation, items = _validator.parseCellValue(cellValue), fontStyle = getFontStyleString(style != null ? style : void 0);
+    const cellWidth = cellBounding.endX - cellBounding.startX, cellHeight = cellBounding.endY - cellBounding.startY, cellValue = (_a18 = getCellValueOrigin(data)) != null ? _a18 : "", { validator: _validator } = validation, items = _validator.parseCellValue(cellValue), fontStyle = getFontStyleString(style != null ? style : void 0);
     return layoutDropdowns(items, fontStyle, cellWidth, cellHeight).cellAutoHeight;
   }
   isHit(position, info) {
@@ -2839,7 +2892,7 @@ let DropdownMultipleWidget = (_a12 = class {
     };
     this._commandService.executeCommand(ShowDataValidationDropdown.id, params);
   }
-}, __name(_a12, "DropdownMultipleWidget"), _a12);
+}, __name(_a13, "DropdownMultipleWidget"), _a13);
 DropdownMultipleWidget = __decorateClass$4([
   __decorateParam$4(0, ICommandService)
 ], DropdownMultipleWidget);
@@ -2955,8 +3008,8 @@ function calcPadding(cellWidth, cellHeight, fontWidth, fontHeight, vt, ht, margi
   };
 }
 __name(calcPadding, "calcPadding");
-var _a13;
-let DropdownWidget = (_a13 = class {
+var _a14;
+let DropdownWidget = (_a14 = class {
   constructor(_localeService, _commandService) {
     __publicField(this, "_dropdownInfoMap", /* @__PURE__ */ new Map());
     __publicField(this, "zIndex");
@@ -2989,8 +3042,8 @@ let DropdownWidget = (_a13 = class {
   }
   // eslint-disable-next-line max-lines-per-function, complexity
   drawWith(ctx, info, skeleton) {
-    var _a17, _b;
-    const { primaryWithCoord, row, col, style, data, subUnitId } = info, _cellBounding = primaryWithCoord.isMergedMainCell ? primaryWithCoord.mergeInfo : primaryWithCoord, rule = (_a17 = data.dataValidation) == null ? void 0 : _a17.rule, validator = (_b = data.dataValidation) == null ? void 0 : _b.validator, fontRenderExtension = data.fontRenderExtension, { leftOffset = 0, rightOffset = 0, topOffset = 0, downOffset = 0 } = fontRenderExtension || {};
+    var _a18, _b;
+    const { primaryWithCoord, row, col, style, data, subUnitId } = info, _cellBounding = primaryWithCoord.isMergedMainCell ? primaryWithCoord.mergeInfo : primaryWithCoord, rule = (_a18 = data.dataValidation) == null ? void 0 : _a18.rule, validator = (_b = data.dataValidation) == null ? void 0 : _b.validator, fontRenderExtension = data.fontRenderExtension, { leftOffset = 0, rightOffset = 0, topOffset = 0, downOffset = 0 } = fontRenderExtension || {};
     if (!rule || !validator || !validator || validator.id.indexOf(DataValidationType.LIST) !== 0 || !validator.skipDefaultFontRender(rule))
       return;
     const cellBounding = {
@@ -3031,8 +3084,8 @@ let DropdownWidget = (_a13 = class {
     }
   }
   calcCellAutoHeight(info) {
-    var _a17;
-    const { primaryWithCoord, style, data } = info, _cellBounding = primaryWithCoord.isMergedMainCell ? primaryWithCoord.mergeInfo : primaryWithCoord, fontRenderExtension = data.fontRenderExtension, { leftOffset = 0, rightOffset = 0, topOffset = 0, downOffset = 0 } = fontRenderExtension || {}, rule = (_a17 = data.dataValidation) == null ? void 0 : _a17.rule;
+    var _a18;
+    const { primaryWithCoord, style, data } = info, _cellBounding = primaryWithCoord.isMergedMainCell ? primaryWithCoord.mergeInfo : primaryWithCoord, fontRenderExtension = data.fontRenderExtension, { leftOffset = 0, rightOffset = 0, topOffset = 0, downOffset = 0 } = fontRenderExtension || {}, rule = (_a18 = data.dataValidation) == null ? void 0 : _a18.rule;
     if (!rule || rule.renderMode === DataValidationRenderMode.TEXT)
       return;
     const cellBounding = {
@@ -3075,7 +3128,7 @@ let DropdownWidget = (_a13 = class {
     };
     this._commandService.executeCommand(ShowDataValidationDropdown.id, params);
   }
-}, __name(_a13, "DropdownWidget"), _a13);
+}, __name(_a14, "DropdownWidget"), _a14);
 DropdownWidget = __decorateClass$3([
   __decorateParam$3(0, Inject(LocaleService)),
   __decorateParam$3(1, ICommandService)
@@ -3114,8 +3167,8 @@ var __defProp$2 = Object.defineProperty, __getOwnPropDesc$2 = Object.getOwnPrope
   for (var result = kind > 1 ? void 0 : kind ? __getOwnPropDesc$2(target, key) : target, i = decorators.length - 1, decorator; i >= 0; i--)
     (decorator = decorators[i]) && (result = (kind ? decorator(target, key, result) : decorator(result)) || result);
   return kind && result && __defProp$2(target, key, result), result;
-}, "__decorateClass$2"), __decorateParam$2 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$2"), _a14;
-let SheetsDataValidationUIController = (_a14 = class extends RxDisposable {
+}, "__decorateClass$2"), __decorateParam$2 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$2"), _a15;
+let SheetsDataValidationUIController = (_a15 = class extends RxDisposable {
   constructor(_injector, _componentManger, _dataValidatorRegistryService) {
     super(), this._injector = _injector, this._componentManger = _componentManger, this._dataValidatorRegistryService = _dataValidatorRegistryService, this._initComponents(), this._registerValidatorViews();
   }
@@ -3151,7 +3204,7 @@ let SheetsDataValidationUIController = (_a14 = class extends RxDisposable {
       validator && (validator.formulaInput = view.formulaInput, validator.canvasRender = view.canvasRender, validator.dropdown = view.dropdown, validator.optionsInput = view.optionsInput);
     });
   }
-}, __name(_a14, "SheetsDataValidationUIController"), _a14);
+}, __name(_a15, "SheetsDataValidationUIController"), _a15);
 SheetsDataValidationUIController = __decorateClass$2([
   __decorateParam$2(0, Inject(Injector)),
   __decorateParam$2(1, Inject(ComponentManager)),
@@ -3163,8 +3216,8 @@ var __defProp$1 = Object.defineProperty, __getOwnPropDesc$1 = Object.getOwnPrope
   return kind && result && __defProp$1(target, key, result), result;
 }, "__decorateClass$1"), __decorateParam$1 = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam$1");
 const PLUGIN_NAME$1 = "SHEET_DATA_VALIDATION_UI_PLUGIN";
-var _a15;
-let UniverSheetsDataValidationUIPlugin = (_a15 = class extends Plugin {
+var _a16;
+let UniverSheetsDataValidationUIPlugin = (_a16 = class extends Plugin {
   constructor(_config = defaultPluginConfig, _injector, _commandService, _configService) {
     super(), this._config = _config, this._injector = _injector, this._commandService = _commandService, this._configService = _configService;
     const { menu, ...rest } = this._config;
@@ -3195,7 +3248,10 @@ let UniverSheetsDataValidationUIPlugin = (_a15 = class extends Plugin {
     });
   }
   onReady() {
-    this._injector.get(DataValidationCopyPasteController), this._injector.get(DataValidationPermissionController), this._injector.get(DataValidationRejectInputController), this._injector.get(DataValidationAlertController);
+    this._injector.get(DataValidationCopyPasteController), this._injector.get(DataValidationPermissionController), this._injector.get(DataValidationRejectInputController), this._injector.get(DataValidationAlertController), this._injector.get(IRenderManagerService).registerRenderModule(
+      UniverInstanceType.UNIVER_SHEET,
+      [SheetsDataValidationReRenderController]
+    );
   }
   onRendered() {
     this._injector.get(SheetsDataValidationUIController), this._injector.get(SheetsDataValidationRenderController);
@@ -3203,7 +3259,7 @@ let UniverSheetsDataValidationUIPlugin = (_a15 = class extends Plugin {
   onSteady() {
     this._injector.get(DataValidationAutoFillController);
   }
-}, __name(_a15, "UniverSheetsDataValidationUIPlugin"), __publicField(_a15, "pluginName", PLUGIN_NAME$1), __publicField(_a15, "type", UniverInstanceType.UNIVER_SHEET), _a15);
+}, __name(_a16, "UniverSheetsDataValidationUIPlugin"), __publicField(_a16, "pluginName", PLUGIN_NAME$1), __publicField(_a16, "type", UniverInstanceType.UNIVER_SHEET), _a16);
 UniverSheetsDataValidationUIPlugin = __decorateClass$1([
   __decorateParam$1(1, Inject(Injector)),
   __decorateParam$1(2, ICommandService),
@@ -3215,8 +3271,8 @@ var __defProp2 = Object.defineProperty, __getOwnPropDesc = Object.getOwnProperty
   return kind && result && __defProp2(target, key, result), result;
 }, "__decorateClass"), __decorateParam = /* @__PURE__ */ __name((index, decorator) => (target, key) => decorator(target, key, index), "__decorateParam");
 const PLUGIN_NAME = "SHEET_DATA_VALIDATION_UI_PLUGIN";
-var _a16;
-let UniverSheetsDataValidationMobileUIPlugin = (_a16 = class extends Plugin {
+var _a17;
+let UniverSheetsDataValidationMobileUIPlugin = (_a17 = class extends Plugin {
   constructor(_config = defaultPluginConfig, _injector, _commandService, _configService) {
     super(), this._config = _config, this._injector = _injector, this._commandService = _commandService, this._configService = _configService;
     const { menu, ...rest } = this._config;
@@ -3246,7 +3302,10 @@ let UniverSheetsDataValidationMobileUIPlugin = (_a16 = class extends Plugin {
     });
   }
   onReady() {
-    this._injector.get(DataValidationCopyPasteController), this._injector.get(DataValidationPermissionController);
+    this._injector.get(DataValidationCopyPasteController), this._injector.get(DataValidationPermissionController), this._injector.get(IRenderManagerService).registerRenderModule(
+      UniverInstanceType.UNIVER_SHEET,
+      [SheetsDataValidationReRenderController]
+    );
   }
   onRendered() {
     this._injector.get(SheetsDataValidationUIController), this._injector.get(SheetsDataValidationRenderController);
@@ -3254,7 +3313,7 @@ let UniverSheetsDataValidationMobileUIPlugin = (_a16 = class extends Plugin {
   onSteady() {
     this._injector.get(DataValidationAutoFillController);
   }
-}, __name(_a16, "UniverSheetsDataValidationMobileUIPlugin"), __publicField(_a16, "pluginName", PLUGIN_NAME), __publicField(_a16, "type", UniverInstanceType.UNIVER_SHEET), _a16);
+}, __name(_a17, "UniverSheetsDataValidationMobileUIPlugin"), __publicField(_a17, "pluginName", PLUGIN_NAME), __publicField(_a17, "type", UniverInstanceType.UNIVER_SHEET), _a17);
 UniverSheetsDataValidationMobileUIPlugin = __decorateClass([
   __decorateParam(1, Inject(Injector)),
   __decorateParam(2, ICommandService),