@univerjs/sheets-conditional-formatting 0.25.1 → 1.0.0-alpha.1

package/lib/cjs/index.js

@@ -221,7 +221,7 @@ const isAnchorEqual = (anchor1, anchor2) => {
 const createCfId = () => `${(0, _univerjs_core.generateRandomId)(8)}`;
 
 //#endregion
-//#region \0@oxc-project+runtime@0.133.0/helpers/esm/typeof.js
+//#region \0@oxc-project+runtime@0.137.0/helpers/esm/typeof.js
 function _typeof(o) {
 	"@babel/helpers - typeof";
 	return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) {
@@ -232,7 +232,7 @@ function _typeof(o) {
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.133.0/helpers/esm/toPrimitive.js
+//#region \0@oxc-project+runtime@0.137.0/helpers/esm/toPrimitive.js
 function toPrimitive(t, r) {
 	if ("object" != _typeof(t) || !t) return t;
 	var e = t[Symbol.toPrimitive];
@@ -245,14 +245,14 @@ function toPrimitive(t, r) {
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.133.0/helpers/esm/toPropertyKey.js
+//#region \0@oxc-project+runtime@0.137.0/helpers/esm/toPropertyKey.js
 function toPropertyKey(t) {
 	var i = toPrimitive(t, "string");
 	return "symbol" == _typeof(i) ? i : i + "";
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.133.0/helpers/esm/defineProperty.js
+//#region \0@oxc-project+runtime@0.137.0/helpers/esm/defineProperty.js
 function _defineProperty(e, r, t) {
 	return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
 		value: t,
@@ -512,6 +512,146 @@ const AddCfCommand = {
 	}
 };
 
+//#endregion
+//#region \0@oxc-project+runtime@0.137.0/helpers/esm/decorateParam.js
+function __decorateParam(paramIndex, decorator) {
+	return function(target, key) {
+		decorator(target, key, paramIndex);
+	};
+}
+
+//#endregion
+//#region \0@oxc-project+runtime@0.137.0/helpers/esm/decorate.js
+function __decorate(decorators, target, key, desc) {
+	var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
+	if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
+	else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
+	return c > 3 && r && Object.defineProperty(target, key, r), r;
+}
+
+//#endregion
+//#region src/models/conditional-formatting-range-index-model.ts
+let ConditionalFormattingRangeIndexModel = class ConditionalFormattingRangeIndexModel extends _univerjs_core.Disposable {
+	constructor(_conditionalFormattingRuleModel) {
+		super();
+		this._conditionalFormattingRuleModel = _conditionalFormattingRuleModel;
+		_defineProperty(this, "_rTreeManager", new _univerjs_core.RTree());
+		this.rebuild();
+		this._initRuleListener();
+	}
+	getRuleIdsByCell(unitId, subUnitId, row, col) {
+		return this.getRuleIdsByRanges(unitId, subUnitId, [{
+			startRow: row,
+			endRow: row,
+			startColumn: col,
+			endColumn: col
+		}]);
+	}
+	getRuleIdsByRanges(unitId, subUnitId, ranges) {
+		if (!ranges.length) return /* @__PURE__ */ new Set();
+		const ids = this._rTreeManager.bulkSearch(ranges.map((range) => ({
+			unitId,
+			sheetId: subUnitId,
+			range
+		})));
+		return new Set(Array.from(ids).map((id) => String(id)));
+	}
+	getRulesByRanges(unitId, subUnitId, ranges) {
+		var _this$_conditionalFor;
+		const ids = this.getRuleIdsByRanges(unitId, subUnitId, ranges);
+		return ((_this$_conditionalFor = this._conditionalFormattingRuleModel.getSubunitRules(unitId, subUnitId)) !== null && _this$_conditionalFor !== void 0 ? _this$_conditionalFor : []).filter((rule) => ids.has(rule.cfId));
+	}
+	dispose() {
+		this.clear();
+		super.dispose();
+	}
+	clear() {
+		this._rTreeManager.clear();
+	}
+	rebuild() {
+		this.clear();
+		this._conditionalFormattingRuleModel.getAll().forEach((subUnitMap, unitId) => {
+			subUnitMap.forEach((rules, subUnitId) => {
+				rules.forEach((rule) => {
+					this._insert(unitId, subUnitId, rule.cfId, rule.ranges);
+				});
+			});
+		});
+	}
+	_initRuleListener() {
+		this.disposeWithMe(this._conditionalFormattingRuleModel.$ruleChange.subscribe((e) => {
+			const { unitId, subUnitId, rule } = e;
+			const { cfId, ranges } = rule;
+			switch (e.type) {
+				case "add":
+					this._insert(unitId, subUnitId, cfId, ranges);
+					break;
+				case "delete":
+					this._remove(unitId, subUnitId, cfId, ranges);
+					break;
+				case "set": {
+					const oldRule = e.oldRule;
+					this._remove(unitId, subUnitId, oldRule.cfId, oldRule.ranges);
+					this._insert(unitId, subUnitId, cfId, ranges);
+					break;
+				}
+			}
+		}));
+	}
+	_insert(unitId, subUnitId, cfId, ranges) {
+		this._rTreeManager.bulkInsert(ranges.map((range) => ({
+			unitId,
+			sheetId: subUnitId,
+			id: cfId,
+			range
+		})));
+	}
+	_remove(unitId, subUnitId, cfId, ranges) {
+		this._rTreeManager.bulkRemove(ranges.map((range) => ({
+			unitId,
+			sheetId: subUnitId,
+			id: cfId,
+			range
+		})));
+	}
+};
+ConditionalFormattingRangeIndexModel = __decorate([__decorateParam(0, (0, _univerjs_core.Inject)(ConditionalFormattingRuleModel))], ConditionalFormattingRangeIndexModel);
+
+//#endregion
+//#region src/services/conditional-formatting-range-transform.service.ts
+var ConditionalFormattingRangeTransformService = class {
+	subtractRanges(sourceRanges, rangesToSubtract) {
+		return _univerjs_core.Rectangle.mergeRanges(_univerjs_core.Rectangle.subtractMulti(sourceRanges, rangesToSubtract));
+	}
+	addRanges(sourceRanges, rangesToAdd) {
+		return _univerjs_core.Rectangle.mergeRanges([...sourceRanges, ...rangesToAdd]);
+	}
+	applyRangeDelta(sourceRanges, rangesToSubtract, rangesToAdd) {
+		const ranges = rangesToSubtract.length ? this.subtractRanges(sourceRanges, rangesToSubtract) : sourceRanges;
+		return rangesToAdd.length ? this.addRanges(ranges, rangesToAdd) : ranges;
+	}
+	copyIntersectingRanges(sourceRanges, sourceRange, targetAnchor) {
+		const fragments = [];
+		sourceRanges.forEach((range) => {
+			const intersect = _univerjs_core.Rectangle.getIntersects(range, sourceRange);
+			if (!intersect) return;
+			fragments.push(this.translateRange(intersect, {
+				row: targetAnchor.row - sourceRange.startRow,
+				col: targetAnchor.col - sourceRange.startColumn
+			}));
+		});
+		return _univerjs_core.Rectangle.mergeRanges(fragments);
+	}
+	translateRange(range, offset) {
+		return {
+			startRow: range.startRow + offset.row,
+			endRow: range.endRow + offset.row,
+			startColumn: range.startColumn + offset.col,
+			endColumn: range.endColumn + offset.col
+		};
+	}
+};
+
 //#endregion
 //#region src/commands/mutations/set-conditional-rule.mutation.ts
 const SetConditionalRuleMutation = {
@@ -548,9 +688,10 @@ const ClearRangeCfCommand = {
 	type: _univerjs_core.CommandType.COMMAND,
 	id: "sheet.command.clear-range-conditional-rule",
 	handler(accessor, params) {
-		var _selectionManagerServ;
+		var _ref, _params$ranges, _selectionManagerServ;
 		if (!params) return false;
-		const conditionalFormattingRuleModel = accessor.get(ConditionalFormattingRuleModel);
+		const conditionalFormattingRangeIndexModel = accessor.get(ConditionalFormattingRangeIndexModel);
+		const conditionalFormattingRangeTransformService = accessor.get(ConditionalFormattingRangeTransformService);
 		const univerInstanceService = accessor.get(_univerjs_core.IUniverInstanceService);
 		const commandService = accessor.get(_univerjs_core.ICommandService);
 		const undoRedoService = accessor.get(_univerjs_core.IUndoRedoService);
@@ -558,24 +699,13 @@ const ClearRangeCfCommand = {
 		const target = (0, _univerjs_sheets.getSheetCommandTarget)(univerInstanceService, params);
 		if (!target) return false;
 		const { unitId, subUnitId } = target;
-		const ranges = ((_selectionManagerServ = selectionManagerService.getCurrentSelections()) === null || _selectionManagerServ === void 0 ? void 0 : _selectionManagerServ.map((selection) => selection.range)) || [];
-		const allRuleList = conditionalFormattingRuleModel.getSubunitRules(unitId, subUnitId);
+		const ranges = (_ref = (_params$ranges = params.ranges) !== null && _params$ranges !== void 0 ? _params$ranges : (_selectionManagerServ = selectionManagerService.getCurrentSelections()) === null || _selectionManagerServ === void 0 ? void 0 : _selectionManagerServ.map((selection) => selection.range)) !== null && _ref !== void 0 ? _ref : [];
+		const allRuleList = conditionalFormattingRangeIndexModel.getRulesByRanges(unitId, subUnitId, ranges);
 		if (!(allRuleList === null || allRuleList === void 0 ? void 0 : allRuleList.length) || !ranges.length) return false;
 		const redos = [];
 		const undos = [];
 		allRuleList.forEach((oldRule) => {
-			const matrix = new _univerjs_core.ObjectMatrix();
-			oldRule.ranges.forEach((range) => {
-				_univerjs_core.Range.foreach(range, (row, col) => {
-					matrix.setValue(row, col, 1);
-				});
-			});
-			ranges.forEach((range) => {
-				_univerjs_core.Range.foreach(range, (row, col) => {
-					matrix.realDeleteValue(row, col);
-				});
-			});
-			const newRanges = (0, _univerjs_sheets.findAllRectangle)((0, _univerjs_sheets.createTopMatrixFromMatrix)(matrix));
+			const newRanges = conditionalFormattingRangeTransformService.subtractRanges(oldRule.ranges, ranges);
 			if (newRanges.length) {
 				const params = {
 					unitId,
@@ -750,23 +880,6 @@ const SetCfCommand = {
 	}
 };
 
-//#endregion
-//#region \0@oxc-project+runtime@0.133.0/helpers/esm/decorateParam.js
-function __decorateParam(paramIndex, decorator) {
-	return function(target, key) {
-		decorator(target, key, paramIndex);
-	};
-}
-
-//#endregion
-//#region \0@oxc-project+runtime@0.133.0/helpers/esm/decorate.js
-function __decorate(decorators, target, key, desc) {
-	var c = arguments.length, r = c < 3 ? target : desc === null ? desc = Object.getOwnPropertyDescriptor(target, key) : desc, d;
-	if (typeof Reflect === "object" && typeof Reflect.decorate === "function") r = Reflect.decorate(decorators, target, key, desc);
-	else for (var i = decorators.length - 1; i >= 0; i--) if (d = decorators[i]) r = (c < 3 ? d(r) : c > 3 ? d(target, key, r) : d(target, key)) || r;
-	return c > 3 && r && Object.defineProperty(target, key, r), r;
-}
-
 //#endregion
 //#region src/services/conditional-formatting-formula.service.ts
 let ConditionalFormattingFormulaService = class ConditionalFormattingFormulaService extends _univerjs_core.Disposable {
@@ -1671,14 +1784,14 @@ var IconSetCalculateUnit = class extends BaseCalculateUnit {
 //#region src/models/conditional-formatting-view-model.ts
 const CONDITIONAL_FORMATTING_VIEWPORT_CACHE_LENGTH = 1e3 * 3 * 3;
 let ConditionalFormattingViewModel = class ConditionalFormattingViewModel extends _univerjs_core.Disposable {
-	constructor(_injector, _conditionalFormattingRuleModel, _conditionalFormattingFormulaService, _univerInstanceService) {
+	constructor(_injector, _conditionalFormattingRuleModel, _conditionalFormattingRangeIndexModel, _conditionalFormattingFormulaService, _univerInstanceService) {
 		super();
 		this._injector = _injector;
 		this._conditionalFormattingRuleModel = _conditionalFormattingRuleModel;
+		this._conditionalFormattingRangeIndexModel = _conditionalFormattingRangeIndexModel;
 		this._conditionalFormattingFormulaService = _conditionalFormattingFormulaService;
 		this._univerInstanceService = _univerInstanceService;
 		_defineProperty(this, "_calculateUnitManagers", /* @__PURE__ */ new Map());
-		_defineProperty(this, "_rTreeManager", new _univerjs_core.RTree());
 		_defineProperty(this, "_cellCache", new _univerjs_core.LRUMap(CONDITIONAL_FORMATTING_VIEWPORT_CACHE_LENGTH));
 		_defineProperty(this, "_markDirty$", new rxjs.Subject());
 		_defineProperty(this, "markDirty$", this._markDirty$.asObservable());
@@ -1746,16 +1859,7 @@ let ConditionalFormattingViewModel = class ConditionalFormattingViewModel extend
 		var _this$_conditionalFor;
 		const subunitRules = (_this$_conditionalFor = this._conditionalFormattingRuleModel.getSubunitRules(unitId, subUnitId)) !== null && _this$_conditionalFor !== void 0 ? _this$_conditionalFor : [];
 		const _calculateUnitManagers = this._ensureCalculateUnitManager(unitId, subUnitId);
-		const list = this._rTreeManager.bulkSearch([{
-			unitId,
-			sheetId: subUnitId,
-			range: {
-				startColumn: col,
-				endColumn: col,
-				startRow: row,
-				endRow: row
-			}
-		}]);
+		const list = this._conditionalFormattingRangeIndexModel.getRuleIdsByCell(unitId, subUnitId, row, col);
 		const rules = subunitRules.filter((rule) => list.has(rule.cfId));
 		if (!rules.length) return [];
 		return rules.map((rule) => {
@@ -1777,7 +1881,6 @@ let ConditionalFormattingViewModel = class ConditionalFormattingViewModel extend
 	clearCache() {
 		this._calculateUnitManagers.clear();
 		this._cellCache.clear();
-		this._rTreeManager.clear();
 	}
 	_handleCustomFormulasSeparately() {
 		this.disposeWithMe(this._conditionalFormattingRuleModel.$ruleChange.subscribe((e) => {
@@ -1796,40 +1899,16 @@ let ConditionalFormattingViewModel = class ConditionalFormattingViewModel extend
 			this.markRuleDirty(unitId, subUnitId, cfId);
 			switch (e.type) {
 				case "add": {
-					this._rTreeManager.bulkInsert(ranges.map((r) => ({
-						unitId,
-						sheetId: subUnitId,
-						id: cfId,
-						range: r
-					})));
 					const instance = this._createRuleCalculateUnitInstance(unitId, subUnitId, rule);
 					if (!instance) return;
 					calculateUnitManager.set(rule.cfId, instance);
 					break;
 				}
 				case "delete":
-					this._rTreeManager.bulkRemove(ranges.map((r) => ({
-						unitId,
-						sheetId: subUnitId,
-						id: cfId,
-						range: r
-					})));
 					calculateUnitManager.delete(rule.cfId);
 					break;
 				case "set": {
 					const oldRule = e.oldRule;
-					this._rTreeManager.bulkRemove(oldRule.ranges.map((r) => ({
-						unitId,
-						sheetId: subUnitId,
-						id: oldRule.cfId,
-						range: r
-					})));
-					this._rTreeManager.bulkInsert(ranges.map((r) => ({
-						unitId,
-						sheetId: subUnitId,
-						id: cfId,
-						range: r
-					})));
 					if (oldRule.rule.type !== rule.rule.type) {
 						const instance = this._createRuleCalculateUnitInstance(unitId, subUnitId, rule);
 						if (!instance) return;
@@ -1896,8 +1975,9 @@ let ConditionalFormattingViewModel = class ConditionalFormattingViewModel extend
 ConditionalFormattingViewModel = __decorate([
 	__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_core.Injector)),
 	__decorateParam(1, (0, _univerjs_core.Inject)(ConditionalFormattingRuleModel)),
-	__decorateParam(2, (0, _univerjs_core.Inject)(ConditionalFormattingFormulaService)),
-	__decorateParam(3, _univerjs_core.IUniverInstanceService)
+	__decorateParam(2, (0, _univerjs_core.Inject)(ConditionalFormattingRangeIndexModel)),
+	__decorateParam(3, (0, _univerjs_core.Inject)(ConditionalFormattingFormulaService)),
+	__decorateParam(4, _univerjs_core.IUniverInstanceService)
 ], ConditionalFormattingViewModel);
 
 //#endregion
@@ -2213,21 +2293,6 @@ const ICON_MAP = {
 
 //#endregion
 //#region src/models/icon-map.ts
-/**
-* Copyright 2023-present DreamNum Co., Ltd.
-*
-* Licensed under the Apache License, Version 2.0 (the "License");
-* you may not use this file except in compliance with the License.
-* You may obtain a copy of the License at
-*
-*     http://www.apache.org/licenses/LICENSE-2.0
-*
-* Unless required by applicable law or agreed to in writing, software
-* distributed under the License is distributed on an "AS IS" BASIS,
-* WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied.
-* See the License for the specific language governing permissions and
-* limitations under the License.
-*/
 let IIconSetType = /* @__PURE__ */ function(IIconSetType) {
 	IIconSetType["threeArrows"] = "3Arrows";
 	IIconSetType["threeArrowsGray"] = "3ArrowsGray";
@@ -2255,7 +2320,7 @@ let IIconSetType = /* @__PURE__ */ function(IIconSetType) {
 }({});
 const iconGroup = [
 	{
-		title: "sheet.cf.iconSet.direction",
+		title: "sheets-conditional-formatting.iconSet.direction",
 		group: [
 			{
 				name: "3Arrows",
@@ -2322,7 +2387,7 @@ const iconGroup = [
 		]
 	},
 	{
-		title: "sheet.cf.iconSet.shape",
+		title: "sheets-conditional-formatting.iconSet.shape",
 		group: [
 			{
 				name: "3TrafficLights1",
@@ -2369,7 +2434,7 @@ const iconGroup = [
 		]
 	},
 	{
-		title: "sheet.cf.iconSet.mark",
+		title: "sheets-conditional-formatting.iconSet.mark",
 		group: [
 			{
 				name: "3Symbols",
@@ -2398,7 +2463,7 @@ const iconGroup = [
 		]
 	},
 	{
-		title: "sheet.cf.iconSet.rank",
+		title: "sheets-conditional-formatting.iconSet.rank",
 		group: [
 			{
 				name: "4Rating",
@@ -2473,7 +2538,7 @@ for (const key in iconMap) {
 //#endregion
 //#region package.json
 var name = "@univerjs/sheets-conditional-formatting";
-var version = "0.25.1";
+var version = "1.0.0-alpha.1";
 
 //#endregion
 //#region src/config/config.ts
@@ -2497,10 +2562,34 @@ const configSymbol = Symbol(SHEETS_CONDITIONAL_FORMATTING_PLUGIN_CONFIG_KEY);
 const defaultPluginConfig = {};
 
 //#endregion
-//#region src/services/conditional-formatting.service.ts
-let ConditionalFormattingService = class ConditionalFormattingService extends _univerjs_core.Disposable {
-	get _conditionalFormattingViewModelV2() {
-		return this._injector.get(ConditionalFormattingViewModel);
+//#region src/services/conditional-formatting-style-composer.service.ts
+let ConditionalFormattingStyleComposer = class ConditionalFormattingStyleComposer {
+	constructor(_conditionalFormattingRuleModel, _conditionalFormattingViewModel) {
+		this._conditionalFormattingRuleModel = _conditionalFormattingRuleModel;
+		this._conditionalFormattingViewModel = _conditionalFormattingViewModel;
+	}
+	composeStyle(unitId, subUnitId, row, col) {
+		const cellCfs = this._conditionalFormattingViewModel.getCellCfs(unitId, subUnitId, row, col);
+		if (!(cellCfs === null || cellCfs === void 0 ? void 0 : cellCfs.length)) return null;
+		const matchedRules = [];
+		let stopIfTrueIndex = -1;
+		for (const cacheItem of cellCfs) {
+			const rule = this._conditionalFormattingRuleModel.getRule(unitId, subUnitId, cacheItem.cfId);
+			if (!rule) continue;
+			matchedRules.push({
+				rule,
+				cacheItem
+			});
+			if (stopIfTrueIndex === -1 && rule.stopIfTrue && this._isRuleMatched(rule, cacheItem.result)) stopIfTrueIndex = matchedRules.length - 1;
+		}
+		if (!matchedRules.length) return null;
+		const effectiveRules = stopIfTrueIndex > -1 ? matchedRules.slice(0, stopIfTrueIndex + 1) : matchedRules;
+		const result = {};
+		for (let i = effectiveRules.length - 1; i >= 0; i--) {
+			const { rule, cacheItem } = effectiveRules[i];
+			this._mergeComposeResult(result, rule, cacheItem.result);
+		}
+		return result;
 	}
 	_mergeComposeResult(result, rule, ruleResult) {
 		const type = rule.rule.type;
@@ -2531,9 +2620,24 @@ let ConditionalFormattingService = class ConditionalFormattingService extends _u
 			}
 		}
 	}
-	constructor(_conditionalFormattingRuleModel, _injector, _univerInstanceService, _resourceManagerService, _sheetInterceptorService, _commandService) {
+	_isRuleMatched(rule, ruleResult) {
+		if (rule.rule.type === "highlightCell") return !!ruleResult && typeof ruleResult === "object" && Object.keys(ruleResult).length > 0;
+		return !!ruleResult;
+	}
+};
+ConditionalFormattingStyleComposer = __decorate([__decorateParam(0, (0, _univerjs_core.Inject)(ConditionalFormattingRuleModel)), __decorateParam(1, (0, _univerjs_core.Inject)(ConditionalFormattingViewModel))], ConditionalFormattingStyleComposer);
+
+//#endregion
+//#region src/services/conditional-formatting.service.ts
+let ConditionalFormattingService = class ConditionalFormattingService extends _univerjs_core.Disposable {
+	get _conditionalFormattingViewModelV2() {
+		return this._injector.get(ConditionalFormattingViewModel);
+	}
+	constructor(_conditionalFormattingRuleModel, _conditionalFormattingRangeIndexModel, _conditionalFormattingStyleComposer, _injector, _univerInstanceService, _resourceManagerService, _sheetInterceptorService, _commandService) {
 		super();
 		this._conditionalFormattingRuleModel = _conditionalFormattingRuleModel;
+		this._conditionalFormattingRangeIndexModel = _conditionalFormattingRangeIndexModel;
+		this._conditionalFormattingStyleComposer = _conditionalFormattingStyleComposer;
 		this._injector = _injector;
 		this._univerInstanceService = _univerInstanceService;
 		this._resourceManagerService = _resourceManagerService;
@@ -2544,31 +2648,7 @@ let ConditionalFormattingService = class ConditionalFormattingService extends _u
 		this._initSheetChange();
 	}
 	composeStyle(unitId, subUnitId, row, col) {
-		const cellCfs = this._conditionalFormattingViewModelV2.getCellCfs(unitId, subUnitId, row, col);
-		if (!(cellCfs === null || cellCfs === void 0 ? void 0 : cellCfs.length)) return null;
-		const matchedRules = [];
-		let stopIfTrueIndex = -1;
-		for (const cacheItem of cellCfs) {
-			const rule = this._conditionalFormattingRuleModel.getRule(unitId, subUnitId, cacheItem.cfId);
-			if (!rule) continue;
-			matchedRules.push({
-				rule,
-				cacheItem
-			});
-			if (stopIfTrueIndex === -1 && rule.stopIfTrue && this._isRuleMatched(rule, cacheItem.result)) stopIfTrueIndex = matchedRules.length - 1;
-		}
-		if (!matchedRules.length) return null;
-		const effectiveRules = stopIfTrueIndex > -1 ? matchedRules.slice(0, stopIfTrueIndex + 1) : matchedRules;
-		const result = {};
-		for (let i = effectiveRules.length - 1; i >= 0; i--) {
-			const { rule, cacheItem } = effectiveRules[i];
-			this._mergeComposeResult(result, rule, cacheItem.result);
-		}
-		return result;
-	}
-	_isRuleMatched(rule, ruleResult) {
-		if (rule.rule.type === "highlightCell") return !!ruleResult && typeof ruleResult === "object" && Object.keys(ruleResult).length > 0;
-		return !!ruleResult;
+		return this._conditionalFormattingStyleComposer.composeStyle(unitId, subUnitId, row, col);
 	}
 	_initSnapshot() {
 		const toJson = (unitID) => {
@@ -2597,6 +2677,7 @@ let ConditionalFormattingService = class ConditionalFormattingService extends _u
 			parseJson: (json) => parseJson(json),
 			onUnLoad: (unitID) => {
 				this._conditionalFormattingRuleModel.deleteUnitId(unitID);
+				this._conditionalFormattingRangeIndexModel.rebuild();
 				if ((0, _univerjs_core.isInternalEditorID)(unitID)) return;
 				this._conditionalFormattingViewModelV2.clearCache();
 			},
@@ -2686,29 +2767,24 @@ let ConditionalFormattingService = class ConditionalFormattingService extends _u
 	}
 	_initCellChange() {
 		this.disposeWithMe(this._commandService.onCommandExecuted((commandInfo) => {
-			const collectRule = (unitId, subUnitId, cellData) => {
-				const ruleIds = /* @__PURE__ */ new Set();
-				cellData.forEach(([row, col]) => {
-					const ruleItem = this._conditionalFormattingViewModelV2.getCellCfs(unitId, subUnitId, row, col);
-					ruleItem === null || ruleItem === void 0 || ruleItem.forEach((item) => ruleIds.add(item.cfId));
+			const markRulesDirtyByRanges = (unitId, subUnitId, ranges) => {
+				this._conditionalFormattingRangeIndexModel.getRulesByRanges(unitId, subUnitId, ranges).forEach((rule) => {
+					this._conditionalFormattingViewModelV2.markRuleDirty(unitId, subUnitId, rule.cfId);
 				});
-				const rules = [];
-				for (const cfId of ruleIds) {
-					const rule = this._conditionalFormattingRuleModel.getRule(unitId, subUnitId, cfId);
-					if (rule) rules.push(rule);
-				}
-				return rules;
 			};
 			switch (commandInfo.id) {
 				case _univerjs_sheets.SetRangeValuesMutation.id: {
 					const { subUnitId, unitId, cellValue } = commandInfo.params;
-					const cellMatrix = [];
+					const ranges = [];
 					new _univerjs_core.ObjectMatrix(cellValue).forValue((row, col, value) => {
-						if (value && Object.keys(value).some((key) => ["p", "v"].includes(key))) cellMatrix.push([row, col]);
-					});
-					collectRule(unitId, subUnitId, cellMatrix).forEach((rule) => {
-						this._conditionalFormattingViewModelV2.markRuleDirty(unitId, subUnitId, rule.cfId);
+						if (value && Object.keys(value).some((key) => ["p", "v"].includes(key))) ranges.push({
+							startRow: row,
+							endRow: row,
+							startColumn: col,
+							endColumn: col
+						});
 					});
+					markRulesDirtyByRanges(unitId, subUnitId, ranges);
 					break;
 				}
 				case _univerjs_sheets.InsertColMutation.id:
@@ -2718,14 +2794,10 @@ let ConditionalFormattingService = class ConditionalFormattingService extends _u
 					if (!target) return;
 					const { worksheet, unitId, subUnitId } = target;
 					const { range } = params;
-					const effectRange = {
+					markRulesDirtyByRanges(unitId, subUnitId, [{
 						...range,
 						endColumn: worksheet.getColumnCount() - 1
-					};
-					const allRules = this._conditionalFormattingRuleModel.getSubunitRules(unitId, subUnitId);
-					if (allRules) allRules.filter((rule) => rule.ranges.some((ruleRange) => _univerjs_core.Rectangle.intersects(ruleRange, effectRange))).forEach((rule) => {
-						this._conditionalFormattingViewModelV2.markRuleDirty(unitId, subUnitId, rule.cfId);
-					});
+					}]);
 					break;
 				}
 				case _univerjs_sheets.RemoveRowMutation.id:
@@ -2735,14 +2807,10 @@ let ConditionalFormattingService = class ConditionalFormattingService extends _u
 					if (!target) return;
 					const { worksheet, unitId, subUnitId } = target;
 					const { range } = params;
-					const effectRange = {
+					markRulesDirtyByRanges(unitId, subUnitId, [{
 						...range,
 						endRow: worksheet.getRowCount() - 1
-					};
-					const allRules = this._conditionalFormattingRuleModel.getSubunitRules(unitId, subUnitId);
-					if (allRules) allRules.filter((rule) => rule.ranges.some((ruleRange) => _univerjs_core.Rectangle.intersects(ruleRange, effectRange))).forEach((rule) => {
-						this._conditionalFormattingViewModelV2.markRuleDirty(unitId, subUnitId, rule.cfId);
-					});
+					}]);
 					break;
 				}
 				case _univerjs_sheets.MoveRowsMutation.id: {
@@ -2751,16 +2819,12 @@ let ConditionalFormattingService = class ConditionalFormattingService extends _u
 					if (!target) return;
 					const { worksheet, unitId, subUnitId } = target;
 					const { sourceRange, targetRange } = params;
-					const effectRange = {
+					markRulesDirtyByRanges(unitId, subUnitId, [{
 						startRow: Math.min(sourceRange.startRow, targetRange.startRow),
 						endRow: worksheet.getRowCount() - 1,
 						startColumn: 0,
 						endColumn: worksheet.getColumnCount() - 1
-					};
-					const allRules = this._conditionalFormattingRuleModel.getSubunitRules(unitId, subUnitId);
-					if (allRules) allRules.filter((rule) => rule.ranges.some((ruleRange) => _univerjs_core.Rectangle.intersects(ruleRange, effectRange))).forEach((rule) => {
-						this._conditionalFormattingViewModelV2.markRuleDirty(unitId, subUnitId, rule.cfId);
-					});
+					}]);
 					break;
 				}
 				case _univerjs_sheets.MoveColsMutation.id: {
@@ -2769,28 +2833,27 @@ let ConditionalFormattingService = class ConditionalFormattingService extends _u
 					if (!target) return;
 					const { worksheet, unitId, subUnitId } = target;
 					const { sourceRange, targetRange } = params;
-					const effectRange = {
+					markRulesDirtyByRanges(unitId, subUnitId, [{
 						startRow: 0,
 						endRow: worksheet.getRowCount() - 1,
 						startColumn: Math.min(sourceRange.startColumn, targetRange.startColumn),
 						endColumn: worksheet.getColumnCount() - 1
-					};
-					const allRules = this._conditionalFormattingRuleModel.getSubunitRules(unitId, subUnitId);
-					if (allRules) allRules.filter((rule) => rule.ranges.some((ruleRange) => _univerjs_core.Rectangle.intersects(ruleRange, effectRange))).forEach((rule) => {
-						this._conditionalFormattingViewModelV2.markRuleDirty(unitId, subUnitId, rule.cfId);
-					});
+					}]);
 					break;
 				}
 				case _univerjs_sheets.MoveRangeMutation.id: {
 					const { unitId, to, from } = commandInfo.params;
 					const handleSubUnit = (value) => {
-						const cellMatrix = [];
+						const ranges = [];
 						new _univerjs_core.ObjectMatrix(value.value).forValue((row, col) => {
-							cellMatrix.push([row, col]);
-						});
-						collectRule(unitId, value.subUnitId, cellMatrix).forEach((rule) => {
-							this._conditionalFormattingViewModelV2.markRuleDirty(unitId, value.subUnitId, rule.cfId);
+							ranges.push({
+								startRow: row,
+								endRow: row,
+								startColumn: col,
+								endColumn: col
+							});
 						});
+						markRulesDirtyByRanges(unitId, value.subUnitId, ranges);
 					};
 					handleSubUnit(to);
 					handleSubUnit(from);
@@ -2798,10 +2861,7 @@ let ConditionalFormattingService = class ConditionalFormattingService extends _u
 				}
 				case _univerjs_sheets.ReorderRangeMutation.id: {
 					const { range, unitId, subUnitId } = commandInfo.params;
-					const allRules = this._conditionalFormattingRuleModel.getSubunitRules(unitId, subUnitId);
-					if (allRules) allRules.filter((rule) => rule.ranges.some((ruleRange) => _univerjs_core.Rectangle.intersects(ruleRange, range))).forEach((rule) => {
-						this._conditionalFormattingViewModelV2.markRuleDirty(unitId, subUnitId, rule.cfId);
-					});
+					markRulesDirtyByRanges(unitId, subUnitId, [range]);
 					break;
 				}
 			}
@@ -2810,11 +2870,13 @@ let ConditionalFormattingService = class ConditionalFormattingService extends _u
 };
 ConditionalFormattingService = __decorate([
 	__decorateParam(0, (0, _univerjs_core.Inject)(ConditionalFormattingRuleModel)),
-	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_core.Injector)),
-	__decorateParam(2, (0, _univerjs_core.Inject)(_univerjs_core.IUniverInstanceService)),
-	__decorateParam(3, (0, _univerjs_core.Inject)(_univerjs_core.IResourceManagerService)),
-	__decorateParam(4, (0, _univerjs_core.Inject)(_univerjs_sheets.SheetInterceptorService)),
-	__decorateParam(5, (0, _univerjs_core.Inject)(_univerjs_core.ICommandService))
+	__decorateParam(1, (0, _univerjs_core.Inject)(ConditionalFormattingRangeIndexModel)),
+	__decorateParam(2, (0, _univerjs_core.Inject)(ConditionalFormattingStyleComposer)),
+	__decorateParam(3, (0, _univerjs_core.Inject)(_univerjs_core.Injector)),
+	__decorateParam(4, (0, _univerjs_core.Inject)(_univerjs_core.IUniverInstanceService)),
+	__decorateParam(5, (0, _univerjs_core.Inject)(_univerjs_core.IResourceManagerService)),
+	__decorateParam(6, (0, _univerjs_core.Inject)(_univerjs_sheets.SheetInterceptorService)),
+	__decorateParam(7, (0, _univerjs_core.Inject)(_univerjs_core.ICommandService))
 ], ConditionalFormattingService);
 
 //#endregion
@@ -2831,7 +2893,10 @@ let UniverSheetsConditionalFormattingPlugin = class UniverSheetsConditionalForma
 		[
 			[ConditionalFormattingService],
 			[ConditionalFormattingFormulaService],
+			[ConditionalFormattingRangeTransformService],
+			[ConditionalFormattingStyleComposer],
 			[ConditionalFormattingRuleModel],
+			[ConditionalFormattingRangeIndexModel],
 			[ConditionalFormattingViewModel]
 		].forEach((dependency) => {
 			this._injector.add(dependency);
@@ -2853,7 +2918,11 @@ let UniverSheetsConditionalFormattingPlugin = class UniverSheetsConditionalForma
 	}
 	onStarting() {
 		this._injector.get(ConditionalFormattingService);
-		(0, _univerjs_core.touchDependencies)(this._injector, [[ConditionalFormattingService], [ConditionalFormattingViewModel]]);
+		(0, _univerjs_core.touchDependencies)(this._injector, [
+			[ConditionalFormattingService],
+			[ConditionalFormattingRangeIndexModel],
+			[ConditionalFormattingViewModel]
+		]);
 	}
 };
 _defineProperty(UniverSheetsConditionalFormattingPlugin, "pluginName", SHEET_CONDITIONAL_FORMATTING_PLUGIN);
@@ -2985,6 +3054,13 @@ Object.defineProperty(exports, 'ConditionalFormattingFormulaService', {
   }
 });
 exports.ConditionalFormattingIcon = ConditionalFormattingIcon;
+Object.defineProperty(exports, 'ConditionalFormattingRangeIndexModel', {
+  enumerable: true,
+  get: function () {
+    return ConditionalFormattingRangeIndexModel;
+  }
+});
+exports.ConditionalFormattingRangeTransformService = ConditionalFormattingRangeTransformService;
 exports.ConditionalFormattingRuleModel = ConditionalFormattingRuleModel;
 Object.defineProperty(exports, 'ConditionalFormattingService', {
   enumerable: true,
@@ -2992,6 +3068,12 @@ Object.defineProperty(exports, 'ConditionalFormattingService', {
     return ConditionalFormattingService;
   }
 });
+Object.defineProperty(exports, 'ConditionalFormattingStyleComposer', {
+  enumerable: true,
+  get: function () {
+    return ConditionalFormattingStyleComposer;
+  }
+});
 Object.defineProperty(exports, 'ConditionalFormattingViewModel', {
   enumerable: true,
   get: function () {