@univerjs/sheets-crosshair-highlight 1.0.0-alpha.2 → 1.0.0-alpha.4

package/lib/cjs/index.js

@@ -1,9 +1,9 @@
 Object.defineProperty(exports, Symbol.toStringTag, { value: 'Module' });
 let _univerjs_core = require("@univerjs/core");
 let rxjs = require("rxjs");
+let _univerjs_ui = require("@univerjs/ui");
 let _univerjs_engine_render = require("@univerjs/engine-render");
 let _univerjs_icons = require("@univerjs/icons");
-let _univerjs_ui = require("@univerjs/ui");
 let _univerjs_design = require("@univerjs/design");
 let react = require("react");
 let react_jsx_runtime = require("react/jsx-runtime");
@@ -166,17 +166,6 @@ const DisableCrosshairHighlightOperation = {
 	}
 };
 
-//#endregion
-//#region package.json
-var name = "@univerjs/sheets-crosshair-highlight";
-var version = "1.0.0-alpha.2";
-
-//#endregion
-//#region src/config/config.ts
-const SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY = "sheets-crosshair-highlight.config";
-const configSymbol = Symbol(SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY);
-const defaultPluginConfig = {};
-
 //#endregion
 //#region src/menu/crosshair.menu.ts
 const CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT = "CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT";
@@ -200,10 +189,27 @@ function CrosshairHighlightMenuItemFactory(accessor) {
 
 //#endregion
 //#region src/menu/schema.ts
-const menuSchema = { [_univerjs_ui.ContextMenuPosition.FOOTER_MENU]: { [_univerjs_ui.ContextMenuGroup.OTHERS]: { [ToggleCrosshairHighlightOperation.id]: {
-	order: 0,
-	menuItemFactory: CrosshairHighlightMenuItemFactory
-} } } };
+const menuSchema = {
+	[_univerjs_ui.RibbonViewGroup.VISIBILITY]: { [ToggleCrosshairHighlightOperation.id]: {
+		order: 1,
+		menuItemFactory: CrosshairHighlightMenuItemFactory
+	} },
+	[_univerjs_ui.ContextMenuPosition.FOOTER_MENU]: { [_univerjs_ui.ContextMenuGroup.OTHERS]: { [ToggleCrosshairHighlightOperation.id]: {
+		order: 0,
+		menuItemFactory: CrosshairHighlightMenuItemFactory
+	} } }
+};
+
+//#endregion
+//#region package.json
+var name = "@univerjs/sheets-crosshair-highlight";
+var version = "1.0.0-alpha.4";
+
+//#endregion
+//#region src/config/config.ts
+const SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY = "sheets-crosshair-highlight.config";
+const configSymbol = Symbol(SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY);
+const defaultPluginConfig = {};
 
 //#endregion
 //#region src/views/components/CrosshairHighlight.tsx
@@ -227,8 +233,7 @@ function CrosshairOverlay(props) {
 	const crosshairSrv = (0, _univerjs_ui.useDependency)(SheetsCrosshairHighlightService);
 	const themeService = (0, _univerjs_ui.useDependency)(_univerjs_core.ThemeService);
 	const currentColor = (0, _univerjs_ui.useObservable)(crosshairSrv.color$);
-	(0, _univerjs_ui.useObservable)(themeService.currentTheme$);
-	const colors = resolveCrosshairHighlightColors(themeService);
+	const colors = (0, _univerjs_ui.useObservable)(() => themeService.currentTheme$.pipe((0, rxjs.map)(() => resolveCrosshairHighlightColors(themeService))), resolveCrosshairHighlightColors(themeService), false, [themeService]);
 	const handleColorPicked = (0, react.useCallback)((tokenPath) => {
 		onChange === null || onChange === void 0 || onChange(tokenPath);
 	}, [onChange]);
@@ -244,6 +249,40 @@ function CrosshairOverlay(props) {
 	});
 }
 
+//#endregion
+//#region src/controllers/components.controller.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 ComponentsController = class ComponentsController extends _univerjs_core.Disposable {
+	constructor(_componentManager, _iconManager) {
+		super();
+		this._componentManager = _componentManager;
+		this._iconManager = _iconManager;
+		this._registerComponents();
+		this._registerIcons();
+	}
+	_registerComponents() {
+		this.disposeWithMe(this._componentManager.register(CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT, CrosshairOverlay));
+	}
+	_registerIcons() {
+		this.disposeWithMe(this._iconManager.register({ CrossHighlightingIcon: _univerjs_icons.CrossHighlightingIcon }));
+	}
+};
+ComponentsController = __decorate([__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_ui.ComponentManager)), __decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_ui.IconManager))], ComponentsController);
+
 //#endregion
 //#region src/controllers/crosshair.controller.ts
 /**
@@ -262,16 +301,12 @@ function CrosshairOverlay(props) {
 * limitations under the License.
 */
 let SheetsCrosshairHighlightController = class SheetsCrosshairHighlightController extends _univerjs_core.Disposable {
-	constructor(_componentMgr, _iconMgr, _menuManagerService, _cmdSrv) {
+	constructor(_menuManagerService, _cmdSrv) {
 		super();
-		this._componentMgr = _componentMgr;
-		this._iconMgr = _iconMgr;
 		this._menuManagerService = _menuManagerService;
 		this._cmdSrv = _cmdSrv;
 		this._initCommands();
 		this._initMenus();
-		this._initComponents();
-		this._registerIcons();
 	}
 	_initCommands() {
 		[
@@ -284,19 +319,8 @@ let SheetsCrosshairHighlightController = class SheetsCrosshairHighlightControlle
 	_initMenus() {
 		this._menuManagerService.mergeMenu(menuSchema);
 	}
-	_initComponents() {
-		this._componentMgr.register(CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT, CrosshairOverlay);
-	}
-	_registerIcons() {
-		this.disposeWithMe(this._iconMgr.register({ CrossHighlightingIcon: _univerjs_icons.CrossHighlightingIcon }));
-	}
 };
-SheetsCrosshairHighlightController = __decorate([
-	__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_ui.ComponentManager)),
-	__decorateParam(1, (0, _univerjs_core.Inject)(_univerjs_ui.IconManager)),
-	__decorateParam(2, _univerjs_ui.IMenuManagerService),
-	__decorateParam(3, _univerjs_core.ICommandService)
-], SheetsCrosshairHighlightController);
+SheetsCrosshairHighlightController = __decorate([__decorateParam(0, _univerjs_ui.IMenuManagerService), __decorateParam(1, _univerjs_core.ICommandService)], SheetsCrosshairHighlightController);
 
 //#endregion
 //#region src/util.ts
@@ -518,10 +542,15 @@ let UniverSheetsCrosshairHighlightPlugin = class UniverSheetsCrosshairHighlightP
 		this._configService.setConfig(SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY, rest);
 	}
 	onStarting() {
-		[[SheetsCrosshairHighlightService], [SheetsCrosshairHighlightController]].forEach((d) => this._injector.add(d));
+		[
+			[ComponentsController],
+			[SheetsCrosshairHighlightService],
+			[SheetsCrosshairHighlightController]
+		].forEach((d) => this._injector.add(d));
 	}
 	onReady() {
 		[[SheetCrosshairHighlightRenderController]].forEach((d) => this._injector.add(d));
+		this._injector.get(ComponentsController);
 		this._injector.get(SheetsCrosshairHighlightController);
 		this._renderManagerService.registerRenderModule(_univerjs_core.UniverInstanceType.UNIVER_SHEET, [SheetCrosshairHighlightRenderController]);
 	}
@@ -540,6 +569,7 @@ UniverSheetsCrosshairHighlightPlugin = __decorate([
 exports.DisableCrosshairHighlightOperation = DisableCrosshairHighlightOperation;
 exports.EnableCrosshairHighlightOperation = EnableCrosshairHighlightOperation;
 exports.SetCrosshairHighlightColorOperation = SetCrosshairHighlightColorOperation;
+exports.SheetsCrosshairHighlightMenuSchema = menuSchema;
 Object.defineProperty(exports, 'SheetsCrosshairHighlightService', {
   enumerable: true,
   get: function () {

package/lib/cjs/locale/ja-JP.js

@@ -1,6 +1,6 @@
 
 //#region src/locale/ja-JP.ts
-const locale = { "sheets-crosshair-highlight": { button: { tooltip: "십자선 강조" } } };
+const locale = { "sheets-crosshair-highlight": { button: { tooltip: "十字線を強調表示" } } };
 
 //#endregion
 module.exports = locale;

package/lib/es/index.js

@@ -1,8 +1,8 @@
 import { ColorKit, CommandType, Disposable, ICommandService, IConfigService, IContextService, Inject, Injector, Plugin, RANGE_TYPE, Rectangle, ThemeService, UniverInstanceType, merge } from "@univerjs/core";
 import { BehaviorSubject, combineLatest, map, merge as merge$1, startWith, tap } from "rxjs";
+import { ComponentManager, ContextMenuGroup, ContextMenuPosition, IMenuManagerService, IconManager, MenuItemType, RibbonViewGroup, getMenuHiddenObservable, useDependency, useObservable } from "@univerjs/ui";
 import { IRenderManagerService, Rect, Shape } from "@univerjs/engine-render";
 import { CrossHighlightingIcon } from "@univerjs/icons";
-import { ComponentManager, ContextMenuGroup, ContextMenuPosition, IMenuManagerService, IconManager, MenuItemType, getMenuHiddenObservable, useDependency, useObservable } from "@univerjs/ui";
 import { borderClassName, clsx } from "@univerjs/design";
 import { useCallback } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -165,17 +165,6 @@ const DisableCrosshairHighlightOperation = {
 	}
 };
 
-//#endregion
-//#region package.json
-var name = "@univerjs/sheets-crosshair-highlight";
-var version = "1.0.0-alpha.2";
-
-//#endregion
-//#region src/config/config.ts
-const SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY = "sheets-crosshair-highlight.config";
-const configSymbol = Symbol(SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY);
-const defaultPluginConfig = {};
-
 //#endregion
 //#region src/menu/crosshair.menu.ts
 const CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT = "CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT";
@@ -199,10 +188,27 @@ function CrosshairHighlightMenuItemFactory(accessor) {
 
 //#endregion
 //#region src/menu/schema.ts
-const menuSchema = { [ContextMenuPosition.FOOTER_MENU]: { [ContextMenuGroup.OTHERS]: { [ToggleCrosshairHighlightOperation.id]: {
-	order: 0,
-	menuItemFactory: CrosshairHighlightMenuItemFactory
-} } } };
+const menuSchema = {
+	[RibbonViewGroup.VISIBILITY]: { [ToggleCrosshairHighlightOperation.id]: {
+		order: 1,
+		menuItemFactory: CrosshairHighlightMenuItemFactory
+	} },
+	[ContextMenuPosition.FOOTER_MENU]: { [ContextMenuGroup.OTHERS]: { [ToggleCrosshairHighlightOperation.id]: {
+		order: 0,
+		menuItemFactory: CrosshairHighlightMenuItemFactory
+	} } }
+};
+
+//#endregion
+//#region package.json
+var name = "@univerjs/sheets-crosshair-highlight";
+var version = "1.0.0-alpha.4";
+
+//#endregion
+//#region src/config/config.ts
+const SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY = "sheets-crosshair-highlight.config";
+const configSymbol = Symbol(SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY);
+const defaultPluginConfig = {};
 
 //#endregion
 //#region src/views/components/CrosshairHighlight.tsx
@@ -226,8 +232,7 @@ function CrosshairOverlay(props) {
 	const crosshairSrv = useDependency(SheetsCrosshairHighlightService);
 	const themeService = useDependency(ThemeService);
 	const currentColor = useObservable(crosshairSrv.color$);
-	useObservable(themeService.currentTheme$);
-	const colors = resolveCrosshairHighlightColors(themeService);
+	const colors = useObservable(() => themeService.currentTheme$.pipe(map(() => resolveCrosshairHighlightColors(themeService))), resolveCrosshairHighlightColors(themeService), false, [themeService]);
 	const handleColorPicked = useCallback((tokenPath) => {
 		onChange === null || onChange === void 0 || onChange(tokenPath);
 	}, [onChange]);
@@ -243,6 +248,40 @@ function CrosshairOverlay(props) {
 	});
 }
 
+//#endregion
+//#region src/controllers/components.controller.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 ComponentsController = class ComponentsController extends Disposable {
+	constructor(_componentManager, _iconManager) {
+		super();
+		this._componentManager = _componentManager;
+		this._iconManager = _iconManager;
+		this._registerComponents();
+		this._registerIcons();
+	}
+	_registerComponents() {
+		this.disposeWithMe(this._componentManager.register(CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT, CrosshairOverlay));
+	}
+	_registerIcons() {
+		this.disposeWithMe(this._iconManager.register({ CrossHighlightingIcon }));
+	}
+};
+ComponentsController = __decorate([__decorateParam(0, Inject(ComponentManager)), __decorateParam(1, Inject(IconManager))], ComponentsController);
+
 //#endregion
 //#region src/controllers/crosshair.controller.ts
 /**
@@ -261,16 +300,12 @@ function CrosshairOverlay(props) {
 * limitations under the License.
 */
 let SheetsCrosshairHighlightController = class SheetsCrosshairHighlightController extends Disposable {
-	constructor(_componentMgr, _iconMgr, _menuManagerService, _cmdSrv) {
+	constructor(_menuManagerService, _cmdSrv) {
 		super();
-		this._componentMgr = _componentMgr;
-		this._iconMgr = _iconMgr;
 		this._menuManagerService = _menuManagerService;
 		this._cmdSrv = _cmdSrv;
 		this._initCommands();
 		this._initMenus();
-		this._initComponents();
-		this._registerIcons();
 	}
 	_initCommands() {
 		[
@@ -283,19 +318,8 @@ let SheetsCrosshairHighlightController = class SheetsCrosshairHighlightControlle
 	_initMenus() {
 		this._menuManagerService.mergeMenu(menuSchema);
 	}
-	_initComponents() {
-		this._componentMgr.register(CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT, CrosshairOverlay);
-	}
-	_registerIcons() {
-		this.disposeWithMe(this._iconMgr.register({ CrossHighlightingIcon }));
-	}
 };
-SheetsCrosshairHighlightController = __decorate([
-	__decorateParam(0, Inject(ComponentManager)),
-	__decorateParam(1, Inject(IconManager)),
-	__decorateParam(2, IMenuManagerService),
-	__decorateParam(3, ICommandService)
-], SheetsCrosshairHighlightController);
+SheetsCrosshairHighlightController = __decorate([__decorateParam(0, IMenuManagerService), __decorateParam(1, ICommandService)], SheetsCrosshairHighlightController);
 
 //#endregion
 //#region src/util.ts
@@ -517,10 +541,15 @@ let UniverSheetsCrosshairHighlightPlugin = class UniverSheetsCrosshairHighlightP
 		this._configService.setConfig(SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY, rest);
 	}
 	onStarting() {
-		[[SheetsCrosshairHighlightService], [SheetsCrosshairHighlightController]].forEach((d) => this._injector.add(d));
+		[
+			[ComponentsController],
+			[SheetsCrosshairHighlightService],
+			[SheetsCrosshairHighlightController]
+		].forEach((d) => this._injector.add(d));
 	}
 	onReady() {
 		[[SheetCrosshairHighlightRenderController]].forEach((d) => this._injector.add(d));
+		this._injector.get(ComponentsController);
 		this._injector.get(SheetsCrosshairHighlightController);
 		this._renderManagerService.registerRenderModule(UniverInstanceType.UNIVER_SHEET, [SheetCrosshairHighlightRenderController]);
 	}
@@ -536,4 +565,4 @@ UniverSheetsCrosshairHighlightPlugin = __decorate([
 ], UniverSheetsCrosshairHighlightPlugin);
 
 //#endregion
-export { DisableCrosshairHighlightOperation, EnableCrosshairHighlightOperation, SetCrosshairHighlightColorOperation, SheetsCrosshairHighlightService, ToggleCrosshairHighlightOperation, UniverSheetsCrosshairHighlightPlugin };
+export { DisableCrosshairHighlightOperation, EnableCrosshairHighlightOperation, SetCrosshairHighlightColorOperation, menuSchema as SheetsCrosshairHighlightMenuSchema, SheetsCrosshairHighlightService, ToggleCrosshairHighlightOperation, UniverSheetsCrosshairHighlightPlugin };

package/lib/es/locale/ja-JP.js

@@ -1,5 +1,5 @@
 //#region src/locale/ja-JP.ts
-const locale = { "sheets-crosshair-highlight": { button: { tooltip: "십자선 강조" } } };
+const locale = { "sheets-crosshair-highlight": { button: { tooltip: "十字線を強調表示" } } };
 
 //#endregion
 export { locale as default };

package/lib/index.js

@@ -1,8 +1,8 @@
 import { ColorKit, CommandType, Disposable, ICommandService, IConfigService, IContextService, Inject, Injector, Plugin, RANGE_TYPE, Rectangle, ThemeService, UniverInstanceType, merge } from "@univerjs/core";
 import { BehaviorSubject, combineLatest, map, merge as merge$1, startWith, tap } from "rxjs";
+import { ComponentManager, ContextMenuGroup, ContextMenuPosition, IMenuManagerService, IconManager, MenuItemType, RibbonViewGroup, getMenuHiddenObservable, useDependency, useObservable } from "@univerjs/ui";
 import { IRenderManagerService, Rect, Shape } from "@univerjs/engine-render";
 import { CrossHighlightingIcon } from "@univerjs/icons";
-import { ComponentManager, ContextMenuGroup, ContextMenuPosition, IMenuManagerService, IconManager, MenuItemType, getMenuHiddenObservable, useDependency, useObservable } from "@univerjs/ui";
 import { borderClassName, clsx } from "@univerjs/design";
 import { useCallback } from "react";
 import { jsx } from "react/jsx-runtime";
@@ -165,17 +165,6 @@ const DisableCrosshairHighlightOperation = {
 	}
 };
 
-//#endregion
-//#region package.json
-var name = "@univerjs/sheets-crosshair-highlight";
-var version = "1.0.0-alpha.2";
-
-//#endregion
-//#region src/config/config.ts
-const SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY = "sheets-crosshair-highlight.config";
-const configSymbol = Symbol(SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY);
-const defaultPluginConfig = {};
-
 //#endregion
 //#region src/menu/crosshair.menu.ts
 const CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT = "CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT";
@@ -199,10 +188,27 @@ function CrosshairHighlightMenuItemFactory(accessor) {
 
 //#endregion
 //#region src/menu/schema.ts
-const menuSchema = { [ContextMenuPosition.FOOTER_MENU]: { [ContextMenuGroup.OTHERS]: { [ToggleCrosshairHighlightOperation.id]: {
-	order: 0,
-	menuItemFactory: CrosshairHighlightMenuItemFactory
-} } } };
+const menuSchema = {
+	[RibbonViewGroup.VISIBILITY]: { [ToggleCrosshairHighlightOperation.id]: {
+		order: 1,
+		menuItemFactory: CrosshairHighlightMenuItemFactory
+	} },
+	[ContextMenuPosition.FOOTER_MENU]: { [ContextMenuGroup.OTHERS]: { [ToggleCrosshairHighlightOperation.id]: {
+		order: 0,
+		menuItemFactory: CrosshairHighlightMenuItemFactory
+	} } }
+};
+
+//#endregion
+//#region package.json
+var name = "@univerjs/sheets-crosshair-highlight";
+var version = "1.0.0-alpha.4";
+
+//#endregion
+//#region src/config/config.ts
+const SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY = "sheets-crosshair-highlight.config";
+const configSymbol = Symbol(SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY);
+const defaultPluginConfig = {};
 
 //#endregion
 //#region src/views/components/CrosshairHighlight.tsx
@@ -226,8 +232,7 @@ function CrosshairOverlay(props) {
 	const crosshairSrv = useDependency(SheetsCrosshairHighlightService);
 	const themeService = useDependency(ThemeService);
 	const currentColor = useObservable(crosshairSrv.color$);
-	useObservable(themeService.currentTheme$);
-	const colors = resolveCrosshairHighlightColors(themeService);
+	const colors = useObservable(() => themeService.currentTheme$.pipe(map(() => resolveCrosshairHighlightColors(themeService))), resolveCrosshairHighlightColors(themeService), false, [themeService]);
 	const handleColorPicked = useCallback((tokenPath) => {
 		onChange === null || onChange === void 0 || onChange(tokenPath);
 	}, [onChange]);
@@ -243,6 +248,40 @@ function CrosshairOverlay(props) {
 	});
 }
 
+//#endregion
+//#region src/controllers/components.controller.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 ComponentsController = class ComponentsController extends Disposable {
+	constructor(_componentManager, _iconManager) {
+		super();
+		this._componentManager = _componentManager;
+		this._iconManager = _iconManager;
+		this._registerComponents();
+		this._registerIcons();
+	}
+	_registerComponents() {
+		this.disposeWithMe(this._componentManager.register(CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT, CrosshairOverlay));
+	}
+	_registerIcons() {
+		this.disposeWithMe(this._iconManager.register({ CrossHighlightingIcon }));
+	}
+};
+ComponentsController = __decorate([__decorateParam(0, Inject(ComponentManager)), __decorateParam(1, Inject(IconManager))], ComponentsController);
+
 //#endregion
 //#region src/controllers/crosshair.controller.ts
 /**
@@ -261,16 +300,12 @@ function CrosshairOverlay(props) {
 * limitations under the License.
 */
 let SheetsCrosshairHighlightController = class SheetsCrosshairHighlightController extends Disposable {
-	constructor(_componentMgr, _iconMgr, _menuManagerService, _cmdSrv) {
+	constructor(_menuManagerService, _cmdSrv) {
 		super();
-		this._componentMgr = _componentMgr;
-		this._iconMgr = _iconMgr;
 		this._menuManagerService = _menuManagerService;
 		this._cmdSrv = _cmdSrv;
 		this._initCommands();
 		this._initMenus();
-		this._initComponents();
-		this._registerIcons();
 	}
 	_initCommands() {
 		[
@@ -283,19 +318,8 @@ let SheetsCrosshairHighlightController = class SheetsCrosshairHighlightControlle
 	_initMenus() {
 		this._menuManagerService.mergeMenu(menuSchema);
 	}
-	_initComponents() {
-		this._componentMgr.register(CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT, CrosshairOverlay);
-	}
-	_registerIcons() {
-		this.disposeWithMe(this._iconMgr.register({ CrossHighlightingIcon }));
-	}
 };
-SheetsCrosshairHighlightController = __decorate([
-	__decorateParam(0, Inject(ComponentManager)),
-	__decorateParam(1, Inject(IconManager)),
-	__decorateParam(2, IMenuManagerService),
-	__decorateParam(3, ICommandService)
-], SheetsCrosshairHighlightController);
+SheetsCrosshairHighlightController = __decorate([__decorateParam(0, IMenuManagerService), __decorateParam(1, ICommandService)], SheetsCrosshairHighlightController);
 
 //#endregion
 //#region src/util.ts
@@ -517,10 +541,15 @@ let UniverSheetsCrosshairHighlightPlugin = class UniverSheetsCrosshairHighlightP
 		this._configService.setConfig(SHEETS_CROSSHAIR_HIGHLIGHT_PLUGIN_CONFIG_KEY, rest);
 	}
 	onStarting() {
-		[[SheetsCrosshairHighlightService], [SheetsCrosshairHighlightController]].forEach((d) => this._injector.add(d));
+		[
+			[ComponentsController],
+			[SheetsCrosshairHighlightService],
+			[SheetsCrosshairHighlightController]
+		].forEach((d) => this._injector.add(d));
 	}
 	onReady() {
 		[[SheetCrosshairHighlightRenderController]].forEach((d) => this._injector.add(d));
+		this._injector.get(ComponentsController);
 		this._injector.get(SheetsCrosshairHighlightController);
 		this._renderManagerService.registerRenderModule(UniverInstanceType.UNIVER_SHEET, [SheetCrosshairHighlightRenderController]);
 	}
@@ -536,4 +565,4 @@ UniverSheetsCrosshairHighlightPlugin = __decorate([
 ], UniverSheetsCrosshairHighlightPlugin);
 
 //#endregion
-export { DisableCrosshairHighlightOperation, EnableCrosshairHighlightOperation, SetCrosshairHighlightColorOperation, SheetsCrosshairHighlightService, ToggleCrosshairHighlightOperation, UniverSheetsCrosshairHighlightPlugin };
+export { DisableCrosshairHighlightOperation, EnableCrosshairHighlightOperation, SetCrosshairHighlightColorOperation, menuSchema as SheetsCrosshairHighlightMenuSchema, SheetsCrosshairHighlightService, ToggleCrosshairHighlightOperation, UniverSheetsCrosshairHighlightPlugin };

package/lib/locale/ja-JP.js

@@ -1,5 +1,5 @@
 //#region src/locale/ja-JP.ts
-const locale = { "sheets-crosshair-highlight": { button: { tooltip: "십자선 강조" } } };
+const locale = { "sheets-crosshair-highlight": { button: { tooltip: "十字線を強調表示" } } };
 
 //#endregion
 export { locale as default };

package/lib/types/controllers/components.controller.d.ts

@@ -0,0 +1,24 @@
+/**
+ * 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.
+ */
+import { Disposable } from '@univerjs/core';
+import { ComponentManager, IconManager } from '@univerjs/ui';
+export declare class ComponentsController extends Disposable {
+    private readonly _componentManager;
+    private readonly _iconManager;
+    constructor(_componentManager: ComponentManager, _iconManager: IconManager);
+    private _registerComponents;
+    private _registerIcons;
+}

package/lib/types/controllers/crosshair.controller.d.ts

@@ -14,15 +14,11 @@
  * limitations under the License.
  */
 import { Disposable, ICommandService } from '@univerjs/core';
-import { ComponentManager, IconManager, IMenuManagerService } from '@univerjs/ui';
+import { IMenuManagerService } from '@univerjs/ui';
 export declare class SheetsCrosshairHighlightController extends Disposable {
-    private readonly _componentMgr;
-    private readonly _iconMgr;
     private readonly _menuManagerService;
     private readonly _cmdSrv;
-    constructor(_componentMgr: ComponentManager, _iconMgr: IconManager, _menuManagerService: IMenuManagerService, _cmdSrv: ICommandService);
+    constructor(_menuManagerService: IMenuManagerService, _cmdSrv: ICommandService);
     private _initCommands;
     private _initMenus;
-    private _initComponents;
-    private _registerIcons;
 }

package/lib/types/index.d.ts

@@ -17,5 +17,6 @@ import './global.css';
 export { DisableCrosshairHighlightOperation, EnableCrosshairHighlightOperation, SetCrosshairHighlightColorOperation, ToggleCrosshairHighlightOperation, } from './commands/operations/operation';
 export type { ISetCrosshairHighlightColorOperationParams } from './commands/operations/operation';
 export type { IUniverSheetsCrosshairHighlightConfig } from './config/config';
+export { menuSchema as SheetsCrosshairHighlightMenuSchema } from './menu/schema';
 export { UniverSheetsCrosshairHighlightPlugin } from './plugin';
 export { SheetsCrosshairHighlightService } from './services/crosshair.service';

package/lib/umd/index.js

@@ -1 +1 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("@univerjs/core"),require("rxjs"),require("@univerjs/engine-render"),require("react"),require("@univerjs/ui"),require("@univerjs/design"),require("react/jsx-runtime"),require("@univerjs/sheets"),require("@univerjs/sheets-ui")):typeof define==`function`&&define.amd?define([`exports`,`@univerjs/core`,`rxjs`,`@univerjs/engine-render`,`react`,`@univerjs/ui`,`@univerjs/design`,`react/jsx-runtime`,`@univerjs/sheets`,`@univerjs/sheets-ui`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.UniverSheetsCrosshairHighlight={},e.UniverCore,e.rxjs,e.UniverEngineRender,e.React,e.UniverUi,e.UniverDesign,e.React,e.UniverSheets,e.UniverSheetsUi))})(this,function(e,t,n,r,i,a,o,s,c,l){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});function u(e){"@babel/helpers - typeof";return u=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},u(e)}function d(e,t){if(u(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(u(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function f(e){var t=d(e,`string`);return u(t)==`symbol`?t:t+``}function p(e,t,n){return(t=f(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function m(e,t){return function(n,r){t(n,r,e)}}function h(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}let g=Array.from({length:16},(e,t)=>`highlight.background.${t+1}`),_=g[0];function v(e,n){var r;let i=e.getColorFromTheme(n);if(i==null||typeof i.color!=`string`||typeof i.alpha!=`number`)throw Error(`Theme token ${n} is required.`);return new t.ColorKit((r=e.getColorFromTheme(i.color))==null?i.color:r).setAlpha(i.alpha).toRgbString()}function y(e){return g.map(t=>v(e,t))}let b=class extends t.Disposable{get enabled(){return this._enabled$.getValue()}constructor(e){super(),this._themeService=e,p(this,`_enabled$`,new n.BehaviorSubject(!1)),p(this,`enabled$`,this._enabled$.asObservable()),p(this,`_colorToken$`,new n.BehaviorSubject(_)),p(this,`colorToken$`,this._colorToken$.asObservable()),p(this,`color$`,void 0),p(this,`highlightColor$`,void 0),this.color$=(0,n.combineLatest)([this._colorToken$,this._themeService.currentTheme$]).pipe((0,n.map)(([e])=>v(this._themeService,e))),this.highlightColor$=this.color$}dispose(){this._enabled$.complete(),this._colorToken$.complete()}setEnabled(e){this._enabled$.next(e)}setColor(e){this._colorToken$.next(e)}};b=h([m(0,(0,t.Inject)(t.ThemeService))],b);let x={id:`sheet.operation.toggle-crosshair-highlight`,type:t.CommandType.OPERATION,handler(e){let t=e.get(b),n=t.enabled;return t.setEnabled(!n),!0}},S={id:`sheet.operation.set-crosshair-highlight-color`,type:t.CommandType.OPERATION,handler(e,{value:t}){let n=e.get(b);return n.enabled||n.setEnabled(!0),n.setColor(t),!0}},C={id:`sheet.operation.enable-crosshair-highlight`,type:t.CommandType.OPERATION,handler(e){let t=e.get(b);return t.enabled?!1:(t.setEnabled(!0),!0)}},w={id:`sheet.operation.disable-crosshair-highlight`,type:t.CommandType.OPERATION,handler(e){let t=e.get(b);return t.enabled?(t.setEnabled(!1),!0):!1}};var T=`@univerjs/sheets-crosshair-highlight`,E=`1.0.0-alpha.2`;let D={};function O({ref:e,...t}){let{icon:n,id:r,className:a,extend:o,...s}=t,c=`univerjs-icon univerjs-icon-${r} ${a||``}`.trim(),l=(0,i.useRef)(`_${M()}`);return k(n,`${r}`,{defIds:n.defIds,idSuffix:l.current},{ref:e,className:c,...s},o)}function k(e,t,n,r,a){return(0,i.createElement)(e.tag,{key:t,...A(e,n,a),...r},(j(e,n).children||[]).map((r,i)=>k(r,`${t}-${e.tag}-${i}`,n,void 0,a)))}function A(e,t,n){let r={...e.attrs};n!=null&&n.colorChannel1&&r.fill===`colorChannel1`&&(r.fill=n.colorChannel1),n!=null&&n.colorChannel1&&r.stroke===`colorChannel1`&&(r.stroke=n.colorChannel1),e.tag===`mask`&&r.id&&(r.id+=t.idSuffix),Object.entries(r).forEach(([e,n])=>{e===`mask`&&typeof n==`string`&&(r[e]=n.replace(/url\(#(.*)\)/,`url(#$1${t.idSuffix})`))});let{defIds:i}=t;return!i||i.length===0?r:(e.tag===`use`&&r[`xlink:href`]&&(r[`xlink:href`]+=t.idSuffix),Object.entries(r).forEach(([e,n])=>{typeof n==`string`&&(r[e]=n.replace(/url\(#(.*)\)/,`url(#$1${t.idSuffix})`))}),r)}function j(e,t){var n;let{defIds:r}=t;return!r||r.length===0?e:e.tag===`defs`&&(n=e.children)!=null&&n.length?{...e,children:e.children.map(e=>typeof e.attrs.id==`string`&&r&&r.includes(e.attrs.id)?{...e,attrs:{...e.attrs,id:e.attrs.id+t.idSuffix}}:e)}:e}function M(){return Math.random().toString(36).substring(2,8)}O.displayName=`UniverIcon`;let N={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,fill:`none`,viewBox:`0 0 16 16`,width:`1em`,height:`1em`},children:[{tag:`path`,attrs:{fill:`currentColor`,d:`M3.6498 1.05005C2.21386 1.05005 1.0498 2.21411 1.0498 3.65005V12.35C1.0498 13.786 2.21386 14.95 3.6498 14.95H12.3498C13.7857 14.95 14.9498 13.786 14.9498 12.3501V3.65005C14.9498 2.21411 13.7857 1.05005 12.3498 1.05005H3.6498ZM5.4002 2.25005H3.6498C2.87661 2.25005 2.2498 2.87685 2.2498 3.65005V5.40002H5.4002V2.25005ZM2.2498 10.6V12.35C2.2498 13.1232 2.87661 13.75 3.6498 13.75H5.4002V10.6H2.2498ZM6.60019 13.75H9.4002V9.40002H13.7498V6.60002H9.4002V2.25005H6.60019V6.60002H2.25029V9.40002H6.60019V13.75ZM10.6002 2.25005V5.40002H13.7498V3.65005C13.7498 2.87685 13.123 2.25005 12.3498 2.25005H10.6002ZM13.7498 10.6H10.6002V13.75H12.3498C13.123 13.75 13.7498 13.1232 13.7498 12.3501V10.6Z`,fillRule:`evenodd`,clipRule:`evenodd`}}]},P=(0,i.forwardRef)(function(e,t){return(0,i.createElement)(O,Object.assign({},e,{id:`cross-highlighting-icon`,ref:t,icon:N}))});P.displayName=`CrossHighlightingIcon`;let F=`CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT`;function I(e){let n=e.get(b);return{id:x.id,tooltip:`sheets-crosshair-highlight.button.tooltip`,type:a.MenuItemType.BUTTON_SELECTOR,icon:`CrossHighlightingIcon`,selections:[{label:{name:F,hoverable:!1,selectable:!1}}],selectionsCommandId:S.id,activated$:n.enabled$,hidden$:(0,a.getMenuHiddenObservable)(e,t.UniverInstanceType.UNIVER_SHEET)}}let L={[a.ContextMenuPosition.FOOTER_MENU]:{[a.ContextMenuGroup.OTHERS]:{[x.id]:{order:0,menuItemFactory:I}}}};function R(e){let{onChange:n}=e,r=(0,a.useDependency)(b),c=(0,a.useDependency)(t.ThemeService),l=(0,a.useObservable)(r.color$);(0,a.useObservable)(c.currentTheme$);let u=y(c),d=(0,i.useCallback)(e=>{n==null||n(e)},[n]);return(0,s.jsx)(`div`,{className:`univer-grid univer-grid-cols-8 univer-gap-x-2 univer-gap-y-3`,children:u.map((e,t)=>(0,s.jsx)(`div`,{className:(0,o.clsx)(`hover:univer-ring-primary-600/40 univer-box-border univer-size-5 univer-cursor-pointer univer-rounded univer-ring-offset-1 univer-transition-shadow hover:univer-ring-[1.5px]`,o.borderClassName,{"univer-ring-[1.5px] univer-ring-primary-600 hover:univer-ring-primary-600":e===l}),style:{backgroundColor:e},onClick:()=>d(g[t])},g[t]))})}let z=class extends t.Disposable{constructor(e,t,n,r){super(),this._componentMgr=e,this._iconMgr=t,this._menuManagerService=n,this._cmdSrv=r,this._initCommands(),this._initMenus(),this._initComponents(),this._registerIcons()}_initCommands(){[x,S,C,w].forEach(e=>this._cmdSrv.registerCommand(e))}_initMenus(){this._menuManagerService.mergeMenu(L)}_initComponents(){this._componentMgr.register(F,R)}_registerIcons(){this.disposeWithMe(this._iconMgr.register({CrossHighlightingIcon:P}))}};z=h([m(0,(0,t.Inject)(a.ComponentManager)),m(1,(0,t.Inject)(a.IconManager)),m(2,a.IMenuManagerService),m(3,t.ICommandService)],z);var B=class{constructor(){p(this,`_selectedRanges`,[]),p(this,`_ranges`,[])}addRange(e){if(e.rangeType===t.RANGE_TYPE.COLUMN||e.rangeType===t.RANGE_TYPE.ROW||e.rangeType===t.RANGE_TYPE.ALL)return;let n=this._getIntersects(e),r=this._getSplitRanges(e,n);r.length>0&&this._ranges.push(...r)}setSelectedRanges(e){this._selectedRanges=e}_getSplitRanges(e,n){let r=[e];for(let e of n.concat(this._selectedRanges)){let n=[];for(let i of r){let r=t.Rectangle.subtract(i,e);r&&r.length>0&&n.push(...r)}r=n}return r.filter(e=>e.startRow<=e.endRow&&e.startColumn<=e.endColumn)}_getIntersects(e){let n=[];for(let r of this._ranges){let i=t.Rectangle.getIntersects(r,e);i&&n.push(i)}return n}getRanges(){return this._ranges}reset(){this._ranges=[],this._selectedRanges=[]}},V=class extends r.Shape{constructor(e,t){super(e,t),p(this,`_color`,void 0),t&&this.setShapeProps(t)}setShapeProps(e){e.color!==void 0&&(this._color=e.color),this.transformByState({width:e.width,height:e.height})}_draw(e){var t,n;let i=`rgba(${this._color.r}, ${this._color.g}, ${this._color.b}, ${(t=(n=this._color)==null?void 0:n.a)==null?.5:t})`;r.Rect.drawWith(e,{width:this.width,height:this.height,fill:i,stroke:void 0,strokeWidth:0,evented:!1})}};let H=class extends t.Disposable{constructor(e,t,n,r,i,a){super(),this._context=e,this._sheetSkeletonManagerService=t,this._sheetsSelectionsService=n,this._sheetsCrosshairHighlightService=r,this._contextService=i,this._refSelectionsService=a,p(this,`_shapes`,[]),p(this,`_rangeCollection`,new B),p(this,`_color`,`rgba(255,0,0,0.5)`),this._initRenderListener()}_transformSelection(e,t){if(!e)return;let n=t.getRowCount(),r=t.getColumnCount(),i=[];for(let t of e){let{startRow:e,endRow:a,startColumn:o,endColumn:s}=t.range;a-e+1===n||s-o+1===r||i.push(t.range)}this._rangeCollection.setSelectedRanges(i);for(let e of i)this.addSelection(e,t)}_initRenderListener(){let e=this._context.unit;this.disposeWithMe((0,n.combineLatest)([this._contextService.subscribeContextValue$(c.REF_SELECTIONS_ENABLED).pipe((0,n.startWith)(!1)),this._sheetSkeletonManagerService.currentSkeleton$,this._sheetsCrosshairHighlightService.enabled$,this._sheetsCrosshairHighlightService.highlightColor$.pipe((0,n.tap)(e=>this._color=e)),(0,n.merge)(this._sheetsSelectionsService.selectionMoveStart$,this._sheetsSelectionsService.selectionMoving$,this._sheetsSelectionsService.selectionMoveEnd$,this._sheetsSelectionsService.selectionSet$,e.activeSheet$.pipe((0,n.map)(()=>this._sheetsSelectionsService.getCurrentSelections()))),(0,n.merge)(this._refSelectionsService.selectionMoveStart$,this._refSelectionsService.selectionMoving$,this._refSelectionsService.selectionMoveEnd$,this._sheetsSelectionsService.selectionSet$,e.activeSheet$.pipe((0,n.map)(()=>this._refSelectionsService.getCurrentSelections())))]).subscribe(([t,n,r,i,a,o])=>{if(this._clear(),!r)return;let s=t?o:a;this._rangeCollection.reset(),this._transformSelection(s,e.getActiveSheet()),this.render(this._rangeCollection.getRanges())}))}addSelection(e,n){if(e.rangeType===t.RANGE_TYPE.COLUMN||e.rangeType===t.RANGE_TYPE.ROW||e.rangeType===t.RANGE_TYPE.ALL)return;let r=n.getRowCount(),i=n.getColumnCount(),{startRow:a,endRow:o,startColumn:s,endColumn:c}=e,l={startRow:a,endRow:o,startColumn:0,endColumn:s-1},u={startRow:a,endRow:o,startColumn:c+1,endColumn:i},d={startRow:0,endRow:a-1,startColumn:s,endColumn:c},f={startRow:o+1,endRow:r,startColumn:s,endColumn:c};for(let e of[l,u,d,f])e.startRow<=e.endRow&&e.startColumn<=e.endColumn&&this._rangeCollection.addRange(e)}_clear(){this._shapes.forEach(e=>{e.dispose()}),this._shapes=[]}_addShapes(e,n,r,i){let{startRow:a,endRow:o,startColumn:s,endColumn:c}=e,u=(0,l.getCoordByCell)(a,s,r,i),d=(0,l.getCoordByCell)(o,c,r,i),{startX:f,startY:p}=u,{endX:m,endY:h}=d,g=m-f,_=h-p,v={left:f,top:p,color:new t.ColorKit(this._color).toRgb(),width:g,height:_,zIndex:1,evented:!1},y=new V(`crosshair-${n}`,v);this._shapes.push(y),r.addObject(y)}render(e){let t=this._sheetSkeletonManagerService.getCurrentSkeleton();if(!t)return;let{scene:n}=this._context;this._clear();for(let r=0;r<e.length;r++){let i=e[r];this._addShapes(i,r,n,t)}n.makeDirty(!0)}async dispose(){super.dispose()}};H=h([m(1,(0,t.Inject)(l.SheetSkeletonManagerService)),m(2,(0,t.Inject)(c.SheetsSelectionsService)),m(3,(0,t.Inject)(b)),m(4,(0,t.Inject)(t.IContextService)),m(5,c.IRefSelectionsService)],H);let U=class extends t.Plugin{constructor(e=D,n,r,i){super(),this._config=e,this._injector=n,this._renderManagerService=r,this._configService=i;let{...a}=(0,t.merge)({},D,this._config);this._configService.setConfig(`sheets-crosshair-highlight.config`,a)}onStarting(){[[b],[z]].forEach(e=>this._injector.add(e))}onReady(){[[H]].forEach(e=>this._injector.add(e)),this._injector.get(z),this._renderManagerService.registerRenderModule(t.UniverInstanceType.UNIVER_SHEET,[H])}};p(U,`pluginName`,`SHEET_CROSSHAIR_HIGHLIGHT_PLUGIN`),p(U,`packageName`,T),p(U,`version`,E),p(U,`type`,t.UniverInstanceType.UNIVER_SHEET),U=h([m(1,(0,t.Inject)(t.Injector)),m(2,r.IRenderManagerService),m(3,t.IConfigService)],U),e.DisableCrosshairHighlightOperation=w,e.EnableCrosshairHighlightOperation=C,e.SetCrosshairHighlightColorOperation=S,Object.defineProperty(e,"SheetsCrosshairHighlightService",{enumerable:!0,get:function(){return b}}),e.ToggleCrosshairHighlightOperation=x,Object.defineProperty(e,"UniverSheetsCrosshairHighlightPlugin",{enumerable:!0,get:function(){return U}})});
+(function(e,t){typeof exports==`object`&&typeof module<`u`?t(exports,require("@univerjs/core"),require("rxjs"),require("@univerjs/ui"),require("@univerjs/engine-render"),require("react"),require("@univerjs/design"),require("react/jsx-runtime"),require("@univerjs/sheets"),require("@univerjs/sheets-ui")):typeof define==`function`&&define.amd?define([`exports`,`@univerjs/core`,`rxjs`,`@univerjs/ui`,`@univerjs/engine-render`,`react`,`@univerjs/design`,`react/jsx-runtime`,`@univerjs/sheets`,`@univerjs/sheets-ui`],t):(e=typeof globalThis<`u`?globalThis:e||self,t(e.UniverSheetsCrosshairHighlight={},e.UniverCore,e.rxjs,e.UniverUi,e.UniverEngineRender,e.React,e.UniverDesign,e.React,e.UniverSheets,e.UniverSheetsUi))})(this,function(e,t,n,r,i,a,o,s,c,l){Object.defineProperty(e,Symbol.toStringTag,{value:`Module`});function u(e){"@babel/helpers - typeof";return u=typeof Symbol==`function`&&typeof Symbol.iterator==`symbol`?function(e){return typeof e}:function(e){return e&&typeof Symbol==`function`&&e.constructor===Symbol&&e!==Symbol.prototype?`symbol`:typeof e},u(e)}function d(e,t){if(u(e)!=`object`||!e)return e;var n=e[Symbol.toPrimitive];if(n!==void 0){var r=n.call(e,t||`default`);if(u(r)!=`object`)return r;throw TypeError(`@@toPrimitive must return a primitive value.`)}return(t===`string`?String:Number)(e)}function f(e){var t=d(e,`string`);return u(t)==`symbol`?t:t+``}function p(e,t,n){return(t=f(t))in e?Object.defineProperty(e,t,{value:n,enumerable:!0,configurable:!0,writable:!0}):e[t]=n,e}function m(e,t){return function(n,r){t(n,r,e)}}function h(e,t,n,r){var i=arguments.length,a=i<3?t:r===null?r=Object.getOwnPropertyDescriptor(t,n):r,o;if(typeof Reflect==`object`&&typeof Reflect.decorate==`function`)a=Reflect.decorate(e,t,n,r);else for(var s=e.length-1;s>=0;s--)(o=e[s])&&(a=(i<3?o(a):i>3?o(t,n,a):o(t,n))||a);return i>3&&a&&Object.defineProperty(t,n,a),a}let g=Array.from({length:16},(e,t)=>`highlight.background.${t+1}`),_=g[0];function v(e,n){var r;let i=e.getColorFromTheme(n);if(i==null||typeof i.color!=`string`||typeof i.alpha!=`number`)throw Error(`Theme token ${n} is required.`);return new t.ColorKit((r=e.getColorFromTheme(i.color))==null?i.color:r).setAlpha(i.alpha).toRgbString()}function y(e){return g.map(t=>v(e,t))}let b=class extends t.Disposable{get enabled(){return this._enabled$.getValue()}constructor(e){super(),this._themeService=e,p(this,`_enabled$`,new n.BehaviorSubject(!1)),p(this,`enabled$`,this._enabled$.asObservable()),p(this,`_colorToken$`,new n.BehaviorSubject(_)),p(this,`colorToken$`,this._colorToken$.asObservable()),p(this,`color$`,void 0),p(this,`highlightColor$`,void 0),this.color$=(0,n.combineLatest)([this._colorToken$,this._themeService.currentTheme$]).pipe((0,n.map)(([e])=>v(this._themeService,e))),this.highlightColor$=this.color$}dispose(){this._enabled$.complete(),this._colorToken$.complete()}setEnabled(e){this._enabled$.next(e)}setColor(e){this._colorToken$.next(e)}};b=h([m(0,(0,t.Inject)(t.ThemeService))],b);let x={id:`sheet.operation.toggle-crosshair-highlight`,type:t.CommandType.OPERATION,handler(e){let t=e.get(b),n=t.enabled;return t.setEnabled(!n),!0}},S={id:`sheet.operation.set-crosshair-highlight-color`,type:t.CommandType.OPERATION,handler(e,{value:t}){let n=e.get(b);return n.enabled||n.setEnabled(!0),n.setColor(t),!0}},C={id:`sheet.operation.enable-crosshair-highlight`,type:t.CommandType.OPERATION,handler(e){let t=e.get(b);return t.enabled?!1:(t.setEnabled(!0),!0)}},w={id:`sheet.operation.disable-crosshair-highlight`,type:t.CommandType.OPERATION,handler(e){let t=e.get(b);return t.enabled?(t.setEnabled(!1),!0):!1}},T=`CROSSHAIR_HIGHLIGHT_OVERLAY_COMPONENT`;function E(e){let n=e.get(b);return{id:x.id,tooltip:`sheets-crosshair-highlight.button.tooltip`,type:r.MenuItemType.BUTTON_SELECTOR,icon:`CrossHighlightingIcon`,selections:[{label:{name:T,hoverable:!1,selectable:!1}}],selectionsCommandId:S.id,activated$:n.enabled$,hidden$:(0,r.getMenuHiddenObservable)(e,t.UniverInstanceType.UNIVER_SHEET)}}let D={[r.RibbonViewGroup.VISIBILITY]:{[x.id]:{order:1,menuItemFactory:E}},[r.ContextMenuPosition.FOOTER_MENU]:{[r.ContextMenuGroup.OTHERS]:{[x.id]:{order:0,menuItemFactory:E}}}};var O=`@univerjs/sheets-crosshair-highlight`,k=`1.0.0-alpha.4`;let A={};function j({ref:e,...t}){let{icon:n,id:r,className:i,extend:o,...s}=t,c=`univerjs-icon univerjs-icon-${r} ${i||``}`.trim(),l=(0,a.useRef)(`_${F()}`);return M(n,`${r}`,{defIds:n.defIds,idSuffix:l.current},{ref:e,className:c,...s},o)}function M(e,t,n,r,i){return(0,a.createElement)(e.tag,{key:t,...N(e,n,i),...r},(P(e,n).children||[]).map((r,a)=>M(r,`${t}-${e.tag}-${a}`,n,void 0,i)))}function N(e,t,n){let r={...e.attrs};n!=null&&n.colorChannel1&&r.fill===`colorChannel1`&&(r.fill=n.colorChannel1),n!=null&&n.colorChannel1&&r.stroke===`colorChannel1`&&(r.stroke=n.colorChannel1),e.tag===`mask`&&r.id&&(r.id+=t.idSuffix),Object.entries(r).forEach(([e,n])=>{e===`mask`&&typeof n==`string`&&(r[e]=n.replace(/url\(#(.*)\)/,`url(#$1${t.idSuffix})`))});let{defIds:i}=t;return!i||i.length===0?r:(e.tag===`use`&&r[`xlink:href`]&&(r[`xlink:href`]+=t.idSuffix),Object.entries(r).forEach(([e,n])=>{typeof n==`string`&&(r[e]=n.replace(/url\(#(.*)\)/,`url(#$1${t.idSuffix})`))}),r)}function P(e,t){var n;let{defIds:r}=t;return!r||r.length===0?e:e.tag===`defs`&&(n=e.children)!=null&&n.length?{...e,children:e.children.map(e=>typeof e.attrs.id==`string`&&r&&r.includes(e.attrs.id)?{...e,attrs:{...e.attrs,id:e.attrs.id+t.idSuffix}}:e)}:e}function F(){return Math.random().toString(36).substring(2,8)}j.displayName=`UniverIcon`;let I={tag:`svg`,attrs:{xmlns:`http://www.w3.org/2000/svg`,fill:`none`,viewBox:`0 0 16 16`,width:`1em`,height:`1em`},children:[{tag:`path`,attrs:{stroke:`currentColor`,d:`M5 2H2V5M11 2H14V5M14 11V14H11M5 14H2V11`,strokeLinecap:`round`,strokeLinejoin:`round`,strokeWidth:1.3}},{tag:`path`,attrs:{stroke:`currentColor`,d:`M6.6 3.8H9.4V6.6H12.2V9.4H9.4V12.2H6.6V9.4H3.8V6.6H6.6V3.8Z`,strokeLinejoin:`round`,strokeWidth:1.15}},{tag:`rect`,attrs:{width:2.6,height:2.6,x:6.7,y:6.7,fill:`currentColor`,rx:.35}}]},L=(0,a.forwardRef)(function(e,t){return(0,a.createElement)(j,Object.assign({},e,{id:`cross-highlighting-icon`,ref:t,icon:I}))});L.displayName=`CrossHighlightingIcon`;function R(e){let{onChange:i}=e,c=(0,r.useDependency)(b),l=(0,r.useDependency)(t.ThemeService),u=(0,r.useObservable)(c.color$),d=(0,r.useObservable)(()=>l.currentTheme$.pipe((0,n.map)(()=>y(l))),y(l),!1,[l]),f=(0,a.useCallback)(e=>{i==null||i(e)},[i]);return(0,s.jsx)(`div`,{className:`univer-grid univer-grid-cols-8 univer-gap-x-2 univer-gap-y-3`,children:d.map((e,t)=>(0,s.jsx)(`div`,{className:(0,o.clsx)(`hover:univer-ring-primary-600/40 univer-box-border univer-size-5 univer-cursor-pointer univer-rounded univer-ring-offset-1 univer-transition-shadow hover:univer-ring-[1.5px]`,o.borderClassName,{"univer-ring-[1.5px] univer-ring-primary-600 hover:univer-ring-primary-600":e===u}),style:{backgroundColor:e},onClick:()=>f(g[t])},g[t]))})}let z=class extends t.Disposable{constructor(e,t){super(),this._componentManager=e,this._iconManager=t,this._registerComponents(),this._registerIcons()}_registerComponents(){this.disposeWithMe(this._componentManager.register(T,R))}_registerIcons(){this.disposeWithMe(this._iconManager.register({CrossHighlightingIcon:L}))}};z=h([m(0,(0,t.Inject)(r.ComponentManager)),m(1,(0,t.Inject)(r.IconManager))],z);let B=class extends t.Disposable{constructor(e,t){super(),this._menuManagerService=e,this._cmdSrv=t,this._initCommands(),this._initMenus()}_initCommands(){[x,S,C,w].forEach(e=>this._cmdSrv.registerCommand(e))}_initMenus(){this._menuManagerService.mergeMenu(D)}};B=h([m(0,r.IMenuManagerService),m(1,t.ICommandService)],B);var V=class{constructor(){p(this,`_selectedRanges`,[]),p(this,`_ranges`,[])}addRange(e){if(e.rangeType===t.RANGE_TYPE.COLUMN||e.rangeType===t.RANGE_TYPE.ROW||e.rangeType===t.RANGE_TYPE.ALL)return;let n=this._getIntersects(e),r=this._getSplitRanges(e,n);r.length>0&&this._ranges.push(...r)}setSelectedRanges(e){this._selectedRanges=e}_getSplitRanges(e,n){let r=[e];for(let e of n.concat(this._selectedRanges)){let n=[];for(let i of r){let r=t.Rectangle.subtract(i,e);r&&r.length>0&&n.push(...r)}r=n}return r.filter(e=>e.startRow<=e.endRow&&e.startColumn<=e.endColumn)}_getIntersects(e){let n=[];for(let r of this._ranges){let i=t.Rectangle.getIntersects(r,e);i&&n.push(i)}return n}getRanges(){return this._ranges}reset(){this._ranges=[],this._selectedRanges=[]}},H=class extends i.Shape{constructor(e,t){super(e,t),p(this,`_color`,void 0),t&&this.setShapeProps(t)}setShapeProps(e){e.color!==void 0&&(this._color=e.color),this.transformByState({width:e.width,height:e.height})}_draw(e){var t,n;let r=`rgba(${this._color.r}, ${this._color.g}, ${this._color.b}, ${(t=(n=this._color)==null?void 0:n.a)==null?.5:t})`;i.Rect.drawWith(e,{width:this.width,height:this.height,fill:r,stroke:void 0,strokeWidth:0,evented:!1})}};let U=class extends t.Disposable{constructor(e,t,n,r,i,a){super(),this._context=e,this._sheetSkeletonManagerService=t,this._sheetsSelectionsService=n,this._sheetsCrosshairHighlightService=r,this._contextService=i,this._refSelectionsService=a,p(this,`_shapes`,[]),p(this,`_rangeCollection`,new V),p(this,`_color`,`rgba(255,0,0,0.5)`),this._initRenderListener()}_transformSelection(e,t){if(!e)return;let n=t.getRowCount(),r=t.getColumnCount(),i=[];for(let t of e){let{startRow:e,endRow:a,startColumn:o,endColumn:s}=t.range;a-e+1===n||s-o+1===r||i.push(t.range)}this._rangeCollection.setSelectedRanges(i);for(let e of i)this.addSelection(e,t)}_initRenderListener(){let e=this._context.unit;this.disposeWithMe((0,n.combineLatest)([this._contextService.subscribeContextValue$(c.REF_SELECTIONS_ENABLED).pipe((0,n.startWith)(!1)),this._sheetSkeletonManagerService.currentSkeleton$,this._sheetsCrosshairHighlightService.enabled$,this._sheetsCrosshairHighlightService.highlightColor$.pipe((0,n.tap)(e=>this._color=e)),(0,n.merge)(this._sheetsSelectionsService.selectionMoveStart$,this._sheetsSelectionsService.selectionMoving$,this._sheetsSelectionsService.selectionMoveEnd$,this._sheetsSelectionsService.selectionSet$,e.activeSheet$.pipe((0,n.map)(()=>this._sheetsSelectionsService.getCurrentSelections()))),(0,n.merge)(this._refSelectionsService.selectionMoveStart$,this._refSelectionsService.selectionMoving$,this._refSelectionsService.selectionMoveEnd$,this._sheetsSelectionsService.selectionSet$,e.activeSheet$.pipe((0,n.map)(()=>this._refSelectionsService.getCurrentSelections())))]).subscribe(([t,n,r,i,a,o])=>{if(this._clear(),!r)return;let s=t?o:a;this._rangeCollection.reset(),this._transformSelection(s,e.getActiveSheet()),this.render(this._rangeCollection.getRanges())}))}addSelection(e,n){if(e.rangeType===t.RANGE_TYPE.COLUMN||e.rangeType===t.RANGE_TYPE.ROW||e.rangeType===t.RANGE_TYPE.ALL)return;let r=n.getRowCount(),i=n.getColumnCount(),{startRow:a,endRow:o,startColumn:s,endColumn:c}=e,l={startRow:a,endRow:o,startColumn:0,endColumn:s-1},u={startRow:a,endRow:o,startColumn:c+1,endColumn:i},d={startRow:0,endRow:a-1,startColumn:s,endColumn:c},f={startRow:o+1,endRow:r,startColumn:s,endColumn:c};for(let e of[l,u,d,f])e.startRow<=e.endRow&&e.startColumn<=e.endColumn&&this._rangeCollection.addRange(e)}_clear(){this._shapes.forEach(e=>{e.dispose()}),this._shapes=[]}_addShapes(e,n,r,i){let{startRow:a,endRow:o,startColumn:s,endColumn:c}=e,u=(0,l.getCoordByCell)(a,s,r,i),d=(0,l.getCoordByCell)(o,c,r,i),{startX:f,startY:p}=u,{endX:m,endY:h}=d,g=m-f,_=h-p,v={left:f,top:p,color:new t.ColorKit(this._color).toRgb(),width:g,height:_,zIndex:1,evented:!1},y=new H(`crosshair-${n}`,v);this._shapes.push(y),r.addObject(y)}render(e){let t=this._sheetSkeletonManagerService.getCurrentSkeleton();if(!t)return;let{scene:n}=this._context;this._clear();for(let r=0;r<e.length;r++){let i=e[r];this._addShapes(i,r,n,t)}n.makeDirty(!0)}async dispose(){super.dispose()}};U=h([m(1,(0,t.Inject)(l.SheetSkeletonManagerService)),m(2,(0,t.Inject)(c.SheetsSelectionsService)),m(3,(0,t.Inject)(b)),m(4,(0,t.Inject)(t.IContextService)),m(5,c.IRefSelectionsService)],U);let W=class extends t.Plugin{constructor(e=A,n,r,i){super(),this._config=e,this._injector=n,this._renderManagerService=r,this._configService=i;let{...a}=(0,t.merge)({},A,this._config);this._configService.setConfig(`sheets-crosshair-highlight.config`,a)}onStarting(){[[z],[b],[B]].forEach(e=>this._injector.add(e))}onReady(){[[U]].forEach(e=>this._injector.add(e)),this._injector.get(z),this._injector.get(B),this._renderManagerService.registerRenderModule(t.UniverInstanceType.UNIVER_SHEET,[U])}};p(W,`pluginName`,`SHEET_CROSSHAIR_HIGHLIGHT_PLUGIN`),p(W,`packageName`,O),p(W,`version`,k),p(W,`type`,t.UniverInstanceType.UNIVER_SHEET),W=h([m(1,(0,t.Inject)(t.Injector)),m(2,i.IRenderManagerService),m(3,t.IConfigService)],W),e.DisableCrosshairHighlightOperation=w,e.EnableCrosshairHighlightOperation=C,e.SetCrosshairHighlightColorOperation=S,e.SheetsCrosshairHighlightMenuSchema=D,Object.defineProperty(e,"SheetsCrosshairHighlightService",{enumerable:!0,get:function(){return b}}),e.ToggleCrosshairHighlightOperation=x,Object.defineProperty(e,"UniverSheetsCrosshairHighlightPlugin",{enumerable:!0,get:function(){return W}})});

package/lib/umd/locale/ja-JP.js

@@ -1 +1 @@
-(function(e,t){typeof exports==`object`&&typeof module<`u`?module.exports=t():typeof define==`function`&&define.amd?define([],t):(e=typeof globalThis<`u`?globalThis:e||self,e.UniverSheetsCrosshairHighlightJaJP=t())})(this,function(){return{"sheets-crosshair-highlight":{button:{tooltip:`십자선 강조`}}}});
+(function(e,t){typeof exports==`object`&&typeof module<`u`?module.exports=t():typeof define==`function`&&define.amd?define([],t):(e=typeof globalThis<`u`?globalThis:e||self,e.UniverSheetsCrosshairHighlightJaJP=t())})(this,function(){return{"sheets-crosshair-highlight":{button:{tooltip:`十字線を強調表示`}}}});

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@univerjs/sheets-crosshair-highlight",
-  "version": "1.0.0-alpha.2",
+  "version": "1.0.0-alpha.4",
   "private": false,
   "description": "Crosshair highlight plugin for Univer Sheets.",
   "author": "DreamNum Co., Ltd. <developer@univer.ai>",
@@ -68,22 +68,22 @@
     "rxjs": ">=7.0.0"
   },
   "dependencies": {
-    "@univerjs/icons": "1.16.0",
-    "@univerjs/core": "1.0.0-alpha.2",
-    "@univerjs/design": "1.0.0-alpha.2",
-    "@univerjs/engine-render": "1.0.0-alpha.2",
-    "@univerjs/sheets": "1.0.0-alpha.2",
-    "@univerjs/sheets-ui": "1.0.0-alpha.2",
-    "@univerjs/ui": "1.0.0-alpha.2"
+    "@univerjs/icons": "1.29.0",
+    "@univerjs/core": "1.0.0-alpha.4",
+    "@univerjs/design": "1.0.0-alpha.4",
+    "@univerjs/sheets": "1.0.0-alpha.4",
+    "@univerjs/engine-render": "1.0.0-alpha.4",
+    "@univerjs/sheets-ui": "1.0.0-alpha.4",
+    "@univerjs/ui": "1.0.0-alpha.4"
   },
   "devDependencies": {
-    "postcss": "^8.5.16",
+    "postcss": "^8.5.19",
     "react": "18.3.1",
     "rxjs": "^7.8.2",
     "tailwindcss": "3.4.18",
     "typescript": "^6.0.3",
-    "vitest": "^4.1.9",
-    "@univerjs-infra/shared": "1.0.0-alpha.2"
+    "vitest": "^4.1.10",
+    "@univerjs-infra/shared": "1.0.0-alpha.4"
   },
   "scripts": {
     "test": "vitest run",