@univerjs/sheets-hyper-link-ui 1.0.0-rc.0 → 1.0.0

package/lib/index.js

@@ -62,7 +62,7 @@ const configSymbol = Symbol(SHEETS_HYPER_LINK_UI_PLUGIN_CONFIG_KEY);
 const defaultPluginConfig = {};
 
 //#endregion
-//#region \0@oxc-project+runtime@0.140.0/helpers/esm/decorateParam.js
+//#region \0@oxc-project+runtime@0.149.0/helpers/esm/decorateParam.js
 function __decorateParam(paramIndex, decorator) {
 	return function(target, key) {
 		decorator(target, key, paramIndex);
@@ -70,7 +70,7 @@ function __decorateParam(paramIndex, decorator) {
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.140.0/helpers/esm/decorate.js
+//#region \0@oxc-project+runtime@0.149.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);
@@ -211,7 +211,7 @@ SheetsHyperLinkResolverService = __decorate([
 ], SheetsHyperLinkResolverService);
 
 //#endregion
-//#region \0@oxc-project+runtime@0.140.0/helpers/esm/typeof.js
+//#region \0@oxc-project+runtime@0.149.0/helpers/esm/typeof.js
 function _typeof(o) {
 	"@babel/helpers - typeof";
 	return _typeof = "function" == typeof Symbol && "symbol" == typeof Symbol.iterator ? function(o) {
@@ -222,7 +222,7 @@ function _typeof(o) {
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.140.0/helpers/esm/toPrimitive.js
+//#region \0@oxc-project+runtime@0.149.0/helpers/esm/toPrimitive.js
 function toPrimitive(t, r) {
 	if ("object" != _typeof(t) || !t) return t;
 	var e = t[Symbol.toPrimitive];
@@ -235,14 +235,14 @@ function toPrimitive(t, r) {
 }
 
 //#endregion
-//#region \0@oxc-project+runtime@0.140.0/helpers/esm/toPropertyKey.js
+//#region \0@oxc-project+runtime@0.149.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.140.0/helpers/esm/defineProperty.js
+//#region \0@oxc-project+runtime@0.149.0/helpers/esm/defineProperty.js
 function _defineProperty(e, r, t) {
 	return (r = toPropertyKey(r)) in e ? Object.defineProperty(e, r, {
 		value: t,
@@ -316,6 +316,7 @@ function resolveRangePayload(rangeText, defaultSheetName) {
 const CellLinkEdit = () => {
 	const [id, setId] = useState("");
 	const [display, setDisplay] = useState("");
+	const [tooltip, setTooltip] = useState("");
 	const [showLabel, setShowLabel] = useState(true);
 	const [type, setType] = useState(SheetHyperLinkType.URL);
 	const [payload, setPayload] = useState("");
@@ -323,7 +324,7 @@ const CellLinkEdit = () => {
 	const definedNameService = useDependency(IDefinedNamesService);
 	const editorBridgeService = useDependency(IEditorBridgeService);
 	const univerInstanceService = useDependency(IUniverInstanceService);
-	const popupService = useDependency(SheetsHyperLinkPopupService);
+	const popupService = useDependency(ISheetsHyperLinkPopupService);
 	const editing = useObservable(popupService.currentEditing$);
 	const parserService = useDependency(SheetsHyperLinkParserService);
 	const resolverService = useDependency(SheetsHyperLinkResolverService);
@@ -360,16 +361,17 @@ const CellLinkEdit = () => {
 			if (typeof label === "number") label = `${label}`;
 			let link;
 			if (customRange) {
-				var _customRange$properti;
+				var _customRange$properti, _customRange$properti2, _customRange$properti3;
 				link = {
 					id: (customRange === null || customRange === void 0 ? void 0 : customRange.rangeId) ?? "",
 					display: label ?? "",
 					payload: (customRange === null || customRange === void 0 || (_customRange$properti = customRange.properties) === null || _customRange$properti === void 0 ? void 0 : _customRange$properti.url) ?? "",
+					tooltip: (customRange === null || customRange === void 0 || (_customRange$properti2 = customRange.properties) === null || _customRange$properti2 === void 0 ? void 0 : _customRange$properti2.tooltip) ?? (customRange === null || customRange === void 0 || (_customRange$properti3 = customRange.properties) === null || _customRange$properti3 === void 0 ? void 0 : _customRange$properti3._xlsxHyperlinkTooltip) ?? "",
 					row,
 					column: col
 				};
 			} else if (editing.type === "viewing") {
-				var _cell$p, _cell$p2, _range$properties2;
+				var _cell$p, _cell$p2, _range$properties2, _range$properties3, _range$properties4;
 				const workbook = univerInstanceService.getUnit(editing.unitId);
 				const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getSheetBySheetId(editing.subUnitId);
 				const cell = worksheet === null || worksheet === void 0 ? void 0 : worksheet.getCellRaw(editing.row, editing.col);
@@ -383,11 +385,12 @@ const CellLinkEdit = () => {
 					id: "",
 					display: "",
 					payload: (range === null || range === void 0 || (_range$properties2 = range.properties) === null || _range$properties2 === void 0 ? void 0 : _range$properties2.url) ?? "",
+					tooltip: (range === null || range === void 0 || (_range$properties3 = range.properties) === null || _range$properties3 === void 0 ? void 0 : _range$properties3.tooltip) ?? (range === null || range === void 0 || (_range$properties4 = range.properties) === null || _range$properties4 === void 0 ? void 0 : _range$properties4._xlsxHyperlinkTooltip) ?? "",
 					row,
 					column: col
 				};
 			} else {
-				var _BuildTextUtils$custo, _customRange$properti2;
+				var _BuildTextUtils$custo, _customRange$properti4, _customRange$properti5, _customRange$properti6;
 				const doc = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_DOC);
 				const currentSelection = textSelectionService.getActiveTextRange();
 				const body = doc === null || doc === void 0 ? void 0 : doc.getBody();
@@ -397,12 +400,14 @@ const CellLinkEdit = () => {
 				link = {
 					id: "",
 					display: label ?? "",
-					payload: (customRange === null || customRange === void 0 || (_customRange$properti2 = customRange.properties) === null || _customRange$properti2 === void 0 ? void 0 : _customRange$properti2.url) ?? "",
+					payload: (customRange === null || customRange === void 0 || (_customRange$properti4 = customRange.properties) === null || _customRange$properti4 === void 0 ? void 0 : _customRange$properti4.url) ?? "",
+					tooltip: (customRange === null || customRange === void 0 || (_customRange$properti5 = customRange.properties) === null || _customRange$properti5 === void 0 ? void 0 : _customRange$properti5.tooltip) ?? (customRange === null || customRange === void 0 || (_customRange$properti6 = customRange.properties) === null || _customRange$properti6 === void 0 ? void 0 : _customRange$properti6._xlsxHyperlinkTooltip) ?? "",
 					row,
 					column: col
 				};
 			}
 			setId(link.id);
+			setTooltip(link.tooltip);
 			const customLink = sidePanelService.findCustomHyperLink(link);
 			if (customLink) {
 				const customLinkInfo = customLink.convert(link);
@@ -422,7 +427,8 @@ const CellLinkEdit = () => {
 				case SheetHyperLinkType.RANGE: {
 					var _univerInstanceServic;
 					const params = linkInfo.searchObj;
-					const payload = serializeRangeWithSheet(params.gid ? ((_univerInstanceServic = univerInstanceService.getUnit(editing.unitId)) === null || _univerInstanceServic === void 0 || (_univerInstanceServic = _univerInstanceServic.getSheetBySheetId(params.gid)) === null || _univerInstanceServic === void 0 ? void 0 : _univerInstanceServic.getName()) ?? "" : "", deserializeRangeWithSheet(params.range).range);
+					const sheetName = params.gid ? ((_univerInstanceServic = univerInstanceService.getUnit(editing.unitId)) === null || _univerInstanceServic === void 0 || (_univerInstanceServic = _univerInstanceServic.getSheetBySheetId(params.gid)) === null || _univerInstanceServic === void 0 ? void 0 : _univerInstanceServic.getName()) ?? "" : "";
+					const payload = serializeRangeWithSheet(sheetName, deserializeRangeWithSheet(params.range).range);
 					setPayload(payload);
 					if (payload === link.display) setDisplaySyncedWithPayload(true);
 					break;
@@ -437,9 +443,7 @@ const CellLinkEdit = () => {
 					setPayload(params.rangeid);
 					break;
 				}
-				default:
-					setPayload("");
-					break;
+				default: setPayload("");
 			}
 		}
 	}, [
@@ -574,34 +578,38 @@ const CellLinkEdit = () => {
 			setShowError(true);
 			return;
 		}
-		if (editing) if (id) {
-			const commandId = editing.type === "editing" ? UpdateRichHyperLinkCommand.id : UpdateHyperLinkCommand.id;
-			await commandService.executeCommand(commandId, {
-				id,
-				unitId: editing.unitId,
-				subUnitId: editing.subUnitId,
-				payload: {
-					display: showLabel ? display : "",
-					payload: formatUrl(type, payload)
-				},
-				row: editing.row,
-				column: editing.col,
-				documentId: editorBridgeService.getCurrentEditorId()
-			});
-		} else {
-			const commandId = editing.type === "editing" ? AddRichHyperLinkCommand.id : AddHyperLinkCommand.id;
-			await commandService.executeCommand(commandId, {
-				unitId: editing.unitId,
-				subUnitId: editing.subUnitId,
-				link: {
-					id: generateRandomId(),
+		if (editing) {
+			if (id) {
+				const commandId = editing.type === "editing" ? UpdateRichHyperLinkCommand.id : UpdateHyperLinkCommand.id;
+				await commandService.executeCommand(commandId, {
+					id,
+					unitId: editing.unitId,
+					subUnitId: editing.subUnitId,
+					payload: {
+						display: showLabel ? display : "",
+						tooltip,
+						payload: formatUrl(type, payload)
+					},
 					row: editing.row,
 					column: editing.col,
-					payload: formatUrl(type, payload),
-					display: showLabel ? display : ""
-				},
-				documentId: editorBridgeService.getCurrentEditorId()
-			});
+					documentId: editorBridgeService.getCurrentEditorId()
+				});
+			} else {
+				const commandId = editing.type === "editing" ? AddRichHyperLinkCommand.id : AddHyperLinkCommand.id;
+				await commandService.executeCommand(commandId, {
+					unitId: editing.unitId,
+					subUnitId: editing.subUnitId,
+					link: {
+						id: generateRandomId(),
+						row: editing.row,
+						column: editing.col,
+						payload: formatUrl(type, payload),
+						display: showLabel ? display : "",
+						tooltip
+					},
+					documentId: editorBridgeService.getCurrentEditorId()
+				});
+			}
 		}
 		if ((editing === null || editing === void 0 ? void 0 : editing.type) === "viewing") {
 			await commandService.executeCommand(SetWorksheetActiveOperation.id, {
@@ -638,6 +646,13 @@ const CellLinkEdit = () => {
 					}
 				})
 			}) : null,
+			/* @__PURE__ */ jsx(FormLayout, {
+				label: localeService.t("sheets-hyper-link-ui.form.tooltip"),
+				children: /* @__PURE__ */ jsx(Input, {
+					value: tooltip,
+					onChange: setTooltip
+				})
+			}),
 			/* @__PURE__ */ jsx(FormLayout, {
 				label: localeService.t("sheets-hyper-link-ui.form.type"),
 				children: /* @__PURE__ */ jsx(Select, {
@@ -780,7 +795,7 @@ const iconsMap = {
 };
 const CellLinkPopupPure = (props) => {
 	var _customRange$properti;
-	const popupService = useDependency(SheetsHyperLinkPopupService);
+	const popupService = useDependency(ISheetsHyperLinkPopupService);
 	const commandService = useDependency(ICommandService);
 	const messageService = useDependency(IMessageService);
 	const localeService = useDependency(LocaleService);
@@ -790,97 +805,105 @@ const CellLinkPopupPure = (props) => {
 	const { customRange, row, col, unitId, subUnitId, editPermission, copyPermission, type } = props;
 	if (!(customRange === null || customRange === void 0 || (_customRange$properti = customRange.properties) === null || _customRange$properti === void 0 ? void 0 : _customRange$properti.url)) return null;
 	const linkObj = parserHyperLinkService.parseHyperLink(customRange.properties.url ?? "");
+	const tooltip = customRange.properties.tooltip ?? customRange.properties._xlsxHyperlinkTooltip;
 	const isError = linkObj.type === SheetHyperLinkType.INVALID;
 	return /* @__PURE__ */ jsxs("div", {
-		className: clsx("univer-mb-1 univer-flex univer-max-w-80 univer-flex-row univer-items-center univer-justify-between univer-gap-2 univer-overflow-hidden univer-rounded-lg univer-bg-gray-0 univer-p-2 univer-shadow-md dark:!univer-bg-gray-900", borderClassName),
+		className: clsx("univer-mb-1 univer-grid univer-max-w-80 univer-grid-cols-[minmax(0,1fr)_auto] univer-items-center univer-gap-2 univer-overflow-hidden univer-rounded-lg univer-bg-gray-0 univer-p-2 univer-shadow-md dark:!univer-bg-gray-900", borderClassName),
 		onClick: () => popupService.hideCurrentPopup(),
-		children: [/* @__PURE__ */ jsxs("div", {
-			className: clsx("univer-flex univer-h-6 univer-flex-1 univer-cursor-pointer univer-flex-row univer-items-center univer-gap-1 univer-truncate univer-text-sm univer-leading-5 univer-text-primary-600", { "univer-text-red-500": isError }),
-			onClick: () => {
-				if (isError) return;
-				resolverService.navigate(linkObj);
-			},
-			children: [/* @__PURE__ */ jsx("div", {
-				className: "univer-flex univer-size-5 univer-flex-none univer-items-center univer-justify-center univer-text-base univer-text-gray-900 dark:!univer-text-gray-0",
-				children: iconsMap[linkObj.type]
-			}), /* @__PURE__ */ jsx(Tooltip, {
-				showIfEllipsis: true,
-				title: linkObj.name,
-				asChild: true,
-				children: /* @__PURE__ */ jsx("span", {
-					className: "univer-flex-1 univer-truncate",
-					children: linkObj.name
-				})
-			})]
-		}), /* @__PURE__ */ jsxs("div", {
-			className: "univer-flex univer-h-6 univer-flex-none univer-flex-row univer-items-center univer-justify-center univer-gap-2",
-			children: [/* @__PURE__ */ jsx(Button, {
-				type: "button",
-				variant: "text",
-				size: "small",
-				"data-u-comp": "cell-link-popup-copy",
-				"aria-label": localeService.t("sheets-hyper-link-ui.popup.copy"),
-				className: clsx("!univer-flex univer-size-6 !univer-rounded !univer-border-0 !univer-p-0 !univer-text-base !univer-font-normal disabled:!univer-pointer-events-auto", { "univer-text-red-500": isError }),
-				disabled: !copyPermission || isError,
-				onClick: async () => {
-					if (linkObj.type !== SheetHyperLinkType.URL) {
-						const url = new URL(window.location.href);
-						url.hash = linkObj.url.slice(1);
-						await navigator.clipboard.writeText(url.href);
-					} else await navigator.clipboard.writeText(linkObj.url);
-					messageService.show({
-						content: localeService.t("sheets-hyper-link-ui.message.coped"),
-						type: MessageType.Info
-					});
-				},
-				children: /* @__PURE__ */ jsx(Tooltip, {
-					placement: "bottom",
-					title: localeService.t("sheets-hyper-link-ui.popup.copy"),
-					children: /* @__PURE__ */ jsx(CopyIcon, { className: "dark:!univer-text-gray-0" })
-				})
-			}), editPermission && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
-				"data-u-comp": "cell-link-popup-edit",
-				className: "univer-flex univer-size-6 univer-cursor-pointer univer-flex-row univer-items-center univer-justify-center univer-rounded univer-text-base hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-700",
-				onClick: () => {
-					return commandService.executeCommand(OpenHyperLinkEditPanelOperation.id, {
-						unitId,
-						subUnitId,
-						row,
-						col,
-						customRangeId: customRange.rangeId,
-						type
-					});
-				},
-				children: /* @__PURE__ */ jsx(Tooltip, {
-					placement: "bottom",
-					title: localeService.t("sheets-hyper-link-ui.popup.edit"),
-					children: /* @__PURE__ */ jsx(WriteIcon, { className: "dark:!univer-text-gray-0" })
-				})
-			}), /* @__PURE__ */ jsx("div", {
-				"data-u-comp": "cell-link-popup-remove",
-				className: "univer-flex univer-size-6 univer-cursor-pointer univer-flex-row univer-items-center univer-justify-center univer-rounded univer-text-base hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-700",
+		children: [
+			/* @__PURE__ */ jsxs("div", {
+				className: clsx("univer-flex univer-h-6 univer-flex-1 univer-cursor-pointer univer-flex-row univer-items-center univer-gap-1 univer-truncate univer-text-sm univer-leading-5 univer-text-primary-600", { "univer-text-red-500": isError }),
 				onClick: () => {
-					const commandId = type === "editing" ? CancelRichHyperLinkCommand.id : CancelHyperLinkCommand.id;
-					if (commandService.syncExecuteCommand(commandId, {
-						unitId,
-						subUnitId,
-						id: customRange.rangeId,
-						row,
-						column: col,
-						documentId: editorBridgeService.getCurrentEditorId()
-					})) popupService.hideCurrentPopup(void 0, true);
+					if (isError) return;
+					resolverService.navigate(linkObj);
 				},
-				children: /* @__PURE__ */ jsx(Tooltip, {
-					placement: "bottom",
-					title: localeService.t("sheets-hyper-link-ui.popup.cancel"),
-					children: /* @__PURE__ */ jsx(UnlinkIcon, { className: "dark:!univer-text-gray-0" })
-				})
-			})] })]
-		})]
+				children: [/* @__PURE__ */ jsx("div", {
+					className: "univer-flex univer-size-5 univer-flex-none univer-items-center univer-justify-center univer-text-base univer-text-gray-900 dark:!univer-text-gray-0",
+					children: iconsMap[linkObj.type]
+				}), /* @__PURE__ */ jsx(Tooltip, {
+					showIfEllipsis: true,
+					title: linkObj.name,
+					asChild: true,
+					children: /* @__PURE__ */ jsx("span", {
+						className: "univer-flex-1 univer-truncate",
+						children: linkObj.name
+					})
+				})]
+			}),
+			/* @__PURE__ */ jsxs("div", {
+				className: "univer-flex univer-h-6 univer-flex-none univer-flex-row univer-items-center univer-justify-center univer-gap-2",
+				children: [/* @__PURE__ */ jsx(Button, {
+					type: "button",
+					variant: "text",
+					size: "small",
+					"data-u-comp": "cell-link-popup-copy",
+					"aria-label": localeService.t("sheets-hyper-link-ui.popup.copy"),
+					className: clsx("!univer-flex univer-size-6 !univer-rounded !univer-border-0 !univer-p-0 !univer-text-base !univer-font-normal disabled:!univer-pointer-events-auto", { "univer-text-red-500": isError }),
+					disabled: !copyPermission || isError,
+					onClick: async () => {
+						if (linkObj.type !== SheetHyperLinkType.URL) {
+							const url = new URL(window.location.href);
+							url.hash = linkObj.url.slice(1);
+							await navigator.clipboard.writeText(url.href);
+						} else await navigator.clipboard.writeText(linkObj.url);
+						messageService.show({
+							content: localeService.t("sheets-hyper-link-ui.message.coped"),
+							type: MessageType.Info
+						});
+					},
+					children: /* @__PURE__ */ jsx(Tooltip, {
+						placement: "bottom",
+						title: localeService.t("sheets-hyper-link-ui.popup.copy"),
+						children: /* @__PURE__ */ jsx(CopyIcon, { className: "dark:!univer-text-gray-0" })
+					})
+				}), editPermission && /* @__PURE__ */ jsxs(Fragment, { children: [/* @__PURE__ */ jsx("div", {
+					"data-u-comp": "cell-link-popup-edit",
+					className: "univer-flex univer-size-6 univer-cursor-pointer univer-flex-row univer-items-center univer-justify-center univer-rounded univer-text-base hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-700",
+					onClick: () => {
+						return commandService.executeCommand(OpenHyperLinkEditPanelOperation.id, {
+							unitId,
+							subUnitId,
+							row,
+							col,
+							customRangeId: customRange.rangeId,
+							type
+						});
+					},
+					children: /* @__PURE__ */ jsx(Tooltip, {
+						placement: "bottom",
+						title: localeService.t("sheets-hyper-link-ui.popup.edit"),
+						children: /* @__PURE__ */ jsx(WriteIcon, { className: "dark:!univer-text-gray-0" })
+					})
+				}), /* @__PURE__ */ jsx("div", {
+					"data-u-comp": "cell-link-popup-remove",
+					className: "univer-flex univer-size-6 univer-cursor-pointer univer-flex-row univer-items-center univer-justify-center univer-rounded univer-text-base hover:univer-bg-gray-100 dark:hover:!univer-bg-gray-700",
+					onClick: () => {
+						const commandId = type === "editing" ? CancelRichHyperLinkCommand.id : CancelHyperLinkCommand.id;
+						if (commandService.syncExecuteCommand(commandId, {
+							unitId,
+							subUnitId,
+							id: customRange.rangeId,
+							row,
+							column: col,
+							documentId: editorBridgeService.getCurrentEditorId()
+						})) popupService.hideCurrentPopup(void 0, true);
+					},
+					children: /* @__PURE__ */ jsx(Tooltip, {
+						placement: "bottom",
+						title: localeService.t("sheets-hyper-link-ui.popup.cancel"),
+						children: /* @__PURE__ */ jsx(UnlinkIcon, { className: "dark:!univer-text-gray-0" })
+					})
+				})] })]
+			}),
+			typeof tooltip === "string" && tooltip && /* @__PURE__ */ jsx("div", {
+				className: "univer-col-span-2 univer-max-h-32 univer-overflow-y-auto univer-whitespace-pre-wrap univer-break-words univer-text-sm univer-text-gray-500",
+				children: tooltip
+			})
+		]
 	});
 };
 const CellLinkPopup = () => {
-	const popupService = useDependency(SheetsHyperLinkPopupService);
+	const popupService = useDependency(ISheetsHyperLinkPopupService);
 	const currentPopup = useObservable(popupService.currentPopup$, popupService.currentPopup);
 	const univerInstanceService = useDependency(IUniverInstanceService);
 	if (!currentPopup) return null;
@@ -1190,7 +1213,7 @@ const OpenHyperLinkEditPanelOperation = {
 	id: "sheet.operation.open-hyper-link-edit-panel",
 	handler(accessor, params) {
 		if (!params) return false;
-		const popupService = accessor.get(SheetsHyperLinkPopupService);
+		const popupService = accessor.get(ISheetsHyperLinkPopupService);
 		if (!params.customRangeId) popupService.startAddEditing(params);
 		else popupService.startEditing(params);
 		return true;
@@ -1200,7 +1223,7 @@ const CloseHyperLinkPopupOperation = {
 	type: CommandType.OPERATION,
 	id: "sheet.operation.close-hyper-link-popup",
 	handler(accessor) {
-		accessor.get(SheetsHyperLinkPopupService).endEditing();
+		accessor.get(ISheetsHyperLinkPopupService).endEditing();
 		return true;
 	}
 };
@@ -1208,7 +1231,8 @@ const InsertHyperLinkOperation = {
 	type: CommandType.OPERATION,
 	id: "sheet.operation.insert-hyper-link",
 	handler(accessor) {
-		const target = getSheetCommandTarget(accessor.get(IUniverInstanceService));
+		const univerInstanceService = accessor.get(IUniverInstanceService);
+		const target = getSheetCommandTarget(univerInstanceService);
 		const editorBridgeService = accessor.get(IEditorBridgeService);
 		if (!target) return false;
 		const commandService = accessor.get(ICommandService);
@@ -1232,7 +1256,7 @@ const InsertHyperLinkToolbarOperation = {
 	handler(accessor) {
 		if (getShouldDisableCurrentCellLink(accessor)) return false;
 		const commandService = accessor.get(ICommandService);
-		if (accessor.get(SheetsHyperLinkPopupService).currentEditing) return commandService.executeCommand(CloseHyperLinkPopupOperation.id);
+		if (accessor.get(ISheetsHyperLinkPopupService).currentEditing) return commandService.executeCommand(CloseHyperLinkPopupOperation.id);
 		else return commandService.executeCommand(InsertHyperLinkOperation.id);
 	}
 };
@@ -1477,7 +1501,8 @@ const getLinkDisable$ = (accessor) => {
 		return getShouldDisableCellLink(accessor, target.worksheet, state.row, state.column);
 	}), switchMap((disableCell) => {
 		if (disableCell === 1) return of(true);
-		return combineLatest([editorBridgeService ? editorBridgeService.visible$ : of(null), univerInstanceService.getCurrentTypeOfUnit$(UniverInstanceType.UNIVER_DOC)]).pipe(switchMap(([editing, focusingDoc]) => {
+		const isEditing$ = editorBridgeService ? editorBridgeService.visible$ : of(null);
+		return combineLatest([isEditing$, univerInstanceService.getCurrentTypeOfUnit$(UniverInstanceType.UNIVER_DOC)]).pipe(switchMap(([editing, focusingDoc]) => {
 			return (editing === null || editing === void 0 ? void 0 : editing.visible) ? (focusingDoc === null || focusingDoc === void 0 ? void 0 : focusingDoc.getUnitId()) === DOCS_FORMULA_BAR_EDITOR_UNIT_ID_KEY ? of(true) : getEditingLinkDisable$(accessor, DOCS_NORMAL_EDITOR_UNIT_ID_KEY) : of(disableCell !== 0);
 		}));
 	}))) ?? of(true)).pipe(switchMap((disableCell) => {
@@ -1546,7 +1571,7 @@ const menuSchema = {
 //#endregion
 //#region package.json
 var name = "@univerjs/sheets-hyper-link-ui";
-var version = "1.0.0-rc.0";
+var version = "1.0.0";
 
 //#endregion
 //#region src/controllers/auto-fill.controller.ts
@@ -1702,6 +1727,7 @@ SheetsHyperLinkPermissionController = __decorate([
 const MobileCellLinkEdit = () => {
 	const [id, setId] = useState("");
 	const [display, setDisplay] = useState("");
+	const [tooltip, setTooltip] = useState("");
 	const [showLabel, setShowLabel] = useState(true);
 	const [type, setType] = useState(SheetHyperLinkType.URL);
 	const [payload, setPayload] = useState("");
@@ -1709,7 +1735,7 @@ const MobileCellLinkEdit = () => {
 	const definedNameService = useDependency(IDefinedNamesService);
 	const editorBridgeService = useDependency(IEditorBridgeService);
 	const univerInstanceService = useDependency(IUniverInstanceService);
-	const popupService = useDependency(SheetsHyperLinkPopupService);
+	const popupService = useDependency(ISheetsHyperLinkPopupService);
 	const editing = useObservable(popupService.currentEditing$);
 	const parserService = useDependency(SheetsHyperLinkParserService);
 	const resolverService = useDependency(SheetsHyperLinkResolverService);
@@ -1746,16 +1772,17 @@ const MobileCellLinkEdit = () => {
 			if (typeof label === "number") label = `${label}`;
 			let link;
 			if (customRange) {
-				var _customRange$properti;
+				var _customRange$properti, _customRange$properti2, _customRange$properti3;
 				link = {
 					id: (customRange === null || customRange === void 0 ? void 0 : customRange.rangeId) ?? "",
 					display: label ?? "",
 					payload: (customRange === null || customRange === void 0 || (_customRange$properti = customRange.properties) === null || _customRange$properti === void 0 ? void 0 : _customRange$properti.url) ?? "",
+					tooltip: (customRange === null || customRange === void 0 || (_customRange$properti2 = customRange.properties) === null || _customRange$properti2 === void 0 ? void 0 : _customRange$properti2.tooltip) ?? (customRange === null || customRange === void 0 || (_customRange$properti3 = customRange.properties) === null || _customRange$properti3 === void 0 ? void 0 : _customRange$properti3._xlsxHyperlinkTooltip) ?? "",
 					row,
 					column: col
 				};
 			} else if (editing.type === "viewing") {
-				var _cell$p, _cell$p2, _range$properties2;
+				var _cell$p, _cell$p2, _range$properties2, _range$properties3, _range$properties4;
 				const workbook = univerInstanceService.getUnit(editing.unitId);
 				const worksheet = workbook === null || workbook === void 0 ? void 0 : workbook.getSheetBySheetId(editing.subUnitId);
 				const cell = worksheet === null || worksheet === void 0 ? void 0 : worksheet.getCellRaw(editing.row, editing.col);
@@ -1769,11 +1796,12 @@ const MobileCellLinkEdit = () => {
 					id: "",
 					display: "",
 					payload: (range === null || range === void 0 || (_range$properties2 = range.properties) === null || _range$properties2 === void 0 ? void 0 : _range$properties2.url) ?? "",
+					tooltip: (range === null || range === void 0 || (_range$properties3 = range.properties) === null || _range$properties3 === void 0 ? void 0 : _range$properties3.tooltip) ?? (range === null || range === void 0 || (_range$properties4 = range.properties) === null || _range$properties4 === void 0 ? void 0 : _range$properties4._xlsxHyperlinkTooltip) ?? "",
 					row,
 					column: col
 				};
 			} else {
-				var _BuildTextUtils$custo, _customRange$properti2;
+				var _BuildTextUtils$custo, _customRange$properti4, _customRange$properti5, _customRange$properti6;
 				const doc = univerInstanceService.getCurrentUnitOfType(UniverInstanceType.UNIVER_DOC);
 				const currentSelection = textSelectionService.getActiveTextRange();
 				const body = doc === null || doc === void 0 ? void 0 : doc.getBody();
@@ -1783,12 +1811,14 @@ const MobileCellLinkEdit = () => {
 				link = {
 					id: "",
 					display: label ?? "",
-					payload: (customRange === null || customRange === void 0 || (_customRange$properti2 = customRange.properties) === null || _customRange$properti2 === void 0 ? void 0 : _customRange$properti2.url) ?? "",
+					payload: (customRange === null || customRange === void 0 || (_customRange$properti4 = customRange.properties) === null || _customRange$properti4 === void 0 ? void 0 : _customRange$properti4.url) ?? "",
+					tooltip: (customRange === null || customRange === void 0 || (_customRange$properti5 = customRange.properties) === null || _customRange$properti5 === void 0 ? void 0 : _customRange$properti5.tooltip) ?? (customRange === null || customRange === void 0 || (_customRange$properti6 = customRange.properties) === null || _customRange$properti6 === void 0 ? void 0 : _customRange$properti6._xlsxHyperlinkTooltip) ?? "",
 					row,
 					column: col
 				};
 			}
 			setId(link.id);
+			setTooltip(link.tooltip);
 			const customLink = sidePanelService.findCustomHyperLink(link);
 			if (customLink) {
 				const customLinkInfo = customLink.convert(link);
@@ -1808,7 +1838,8 @@ const MobileCellLinkEdit = () => {
 				case SheetHyperLinkType.RANGE: {
 					var _univerInstanceServic;
 					const params = linkInfo.searchObj;
-					const payload = serializeRangeWithSheet(params.gid ? ((_univerInstanceServic = univerInstanceService.getUnit(editing.unitId)) === null || _univerInstanceServic === void 0 || (_univerInstanceServic = _univerInstanceServic.getSheetBySheetId(params.gid)) === null || _univerInstanceServic === void 0 ? void 0 : _univerInstanceServic.getName()) ?? "" : "", deserializeRangeWithSheet(params.range).range);
+					const sheetName = params.gid ? ((_univerInstanceServic = univerInstanceService.getUnit(editing.unitId)) === null || _univerInstanceServic === void 0 || (_univerInstanceServic = _univerInstanceServic.getSheetBySheetId(params.gid)) === null || _univerInstanceServic === void 0 ? void 0 : _univerInstanceServic.getName()) ?? "" : "";
+					const payload = serializeRangeWithSheet(sheetName, deserializeRangeWithSheet(params.range).range);
 					setPayload(payload);
 					if (payload === link.display) setDisplaySyncedWithPayload(true);
 					break;
@@ -1823,9 +1854,7 @@ const MobileCellLinkEdit = () => {
 					setPayload(params.rangeid);
 					break;
 				}
-				default:
-					setPayload("");
-					break;
+				default: setPayload("");
 			}
 		}
 	}, [
@@ -1960,34 +1989,38 @@ const MobileCellLinkEdit = () => {
 			setShowError(true);
 			return;
 		}
-		if (editing) if (id) {
-			const commandId = editing.type === "editing" ? UpdateRichHyperLinkCommand.id : UpdateHyperLinkCommand.id;
-			await commandService.executeCommand(commandId, {
-				id,
-				unitId: editing.unitId,
-				subUnitId: editing.subUnitId,
-				payload: {
-					display: showLabel ? display : "",
-					payload: formatUrl(type, payload)
-				},
-				row: editing.row,
-				column: editing.col,
-				documentId: editorBridgeService.getCurrentEditorId()
-			});
-		} else {
-			const commandId = editing.type === "editing" ? AddRichHyperLinkCommand.id : AddHyperLinkCommand.id;
-			await commandService.executeCommand(commandId, {
-				unitId: editing.unitId,
-				subUnitId: editing.subUnitId,
-				link: {
-					id: generateRandomId(),
+		if (editing) {
+			if (id) {
+				const commandId = editing.type === "editing" ? UpdateRichHyperLinkCommand.id : UpdateHyperLinkCommand.id;
+				await commandService.executeCommand(commandId, {
+					id,
+					unitId: editing.unitId,
+					subUnitId: editing.subUnitId,
+					payload: {
+						display: showLabel ? display : "",
+						tooltip,
+						payload: formatUrl(type, payload)
+					},
 					row: editing.row,
 					column: editing.col,
-					payload: formatUrl(type, payload),
-					display: showLabel ? display : ""
-				},
-				documentId: editorBridgeService.getCurrentEditorId()
-			});
+					documentId: editorBridgeService.getCurrentEditorId()
+				});
+			} else {
+				const commandId = editing.type === "editing" ? AddRichHyperLinkCommand.id : AddHyperLinkCommand.id;
+				await commandService.executeCommand(commandId, {
+					unitId: editing.unitId,
+					subUnitId: editing.subUnitId,
+					link: {
+						id: generateRandomId(),
+						row: editing.row,
+						column: editing.col,
+						payload: formatUrl(type, payload),
+						display: showLabel ? display : "",
+						tooltip
+					},
+					documentId: editorBridgeService.getCurrentEditorId()
+				});
+			}
 		}
 		if ((editing === null || editing === void 0 ? void 0 : editing.type) === "viewing") {
 			await commandService.executeCommand(SetWorksheetActiveOperation.id, {
@@ -2024,6 +2057,13 @@ const MobileCellLinkEdit = () => {
 					}
 				})
 			}) : null,
+			/* @__PURE__ */ jsx(FormLayout, {
+				label: localeService.t("sheets-hyper-link-ui.form.tooltip"),
+				children: /* @__PURE__ */ jsx(Input, {
+					value: tooltip,
+					onChange: setTooltip
+				})
+			}),
 			/* @__PURE__ */ jsx(FormLayout, {
 				label: localeService.t("sheets-hyper-link-ui.form.type"),
 				children: /* @__PURE__ */ jsx(MobileSelect, {
@@ -2159,7 +2199,7 @@ MobileCellLinkEdit.componentKey = "univer.sheet.mobile-cell-link-edit";
 //#region src/views/MobileCellLinkPopup.tsx
 function MobileCellLinkPopupPure(props) {
 	var _customRange$properti;
-	const popupService = useDependency(SheetsHyperLinkPopupService);
+	const popupService = useDependency(ISheetsHyperLinkPopupService);
 	const commandService = useDependency(ICommandService);
 	const messageService = useDependency(IMessageService);
 	const localeService = useDependency(LocaleService);
@@ -2169,6 +2209,7 @@ function MobileCellLinkPopupPure(props) {
 	const { customRange, row, col, unitId, subUnitId, editPermission, copyPermission, type } = props;
 	if (!(customRange === null || customRange === void 0 || (_customRange$properti = customRange.properties) === null || _customRange$properti === void 0 ? void 0 : _customRange$properti.url)) return null;
 	const linkObj = parserHyperLinkService.parseHyperLink(customRange.properties.url);
+	const tooltip = customRange.properties.tooltip ?? customRange.properties._xlsxHyperlinkTooltip;
 	const isError = linkObj.type === SheetHyperLinkType.INVALID;
 	const close = () => popupService.hideCurrentPopup(void 0, true);
 	return /* @__PURE__ */ jsxs("div", {
@@ -2186,6 +2227,10 @@ function MobileCellLinkPopupPure(props) {
 					close();
 				}
 			}),
+			typeof tooltip === "string" && tooltip && /* @__PURE__ */ jsx("div", {
+				className: "univer-max-h-32 univer-overflow-y-auto univer-whitespace-pre-wrap univer-break-words univer-text-sm univer-text-gray-500",
+				children: tooltip
+			}),
 			copyPermission && /* @__PURE__ */ jsx(MobileActionRow, {
 				title: localeService.t("sheets-hyper-link-ui.popup.copy"),
 				"aria-label": localeService.t("sheets-hyper-link-ui.popup.copy"),
@@ -2242,7 +2287,7 @@ function MobileCellLinkPopupPure(props) {
 	});
 }
 function MobileCellLinkPopup() {
-	const popupService = useDependency(SheetsHyperLinkPopupService);
+	const popupService = useDependency(ISheetsHyperLinkPopupService);
 	const currentPopup = useObservable(popupService.currentPopup$, popupService.currentPopup);
 	const univerInstanceService = useDependency(IUniverInstanceService);
 	if (!currentPopup) return null;
@@ -2480,7 +2525,7 @@ let SheetsHyperLinkMobilePopupController = class SheetsHyperLinkMobilePopupContr
 };
 SheetsHyperLinkMobilePopupController = __decorate([
 	__decorateParam(0, Inject(HoverManagerService)),
-	__decorateParam(1, Inject(SheetsHyperLinkPopupService)),
+	__decorateParam(1, Inject(ISheetsHyperLinkPopupService)),
 	__decorateParam(2, Inject(IRenderManagerService)),
 	__decorateParam(3, Inject(IPermissionService)),
 	__decorateParam(4, Inject(SheetPermissionCheckController)),
@@ -2529,13 +2574,11 @@ SheetsHyperLinkRenderController = __decorate([__decorateParam(1, Inject(HyperLin
 * limitations under the License.
 */
 let SheetsHyperLinkUIController = class SheetsHyperLinkUIController extends Disposable {
-	constructor(_commandService, _menuManagerService, _shortcutService) {
+	constructor(_commandService, _shortcutService) {
 		super();
 		this._commandService = _commandService;
-		this._menuManagerService = _menuManagerService;
 		this._shortcutService = _shortcutService;
 		this._initCommands();
-		this._initMenus();
 		this._initShortCut();
 	}
 	_initCommands() {
@@ -2545,21 +2588,14 @@ let SheetsHyperLinkUIController = class SheetsHyperLinkUIController extends Disp
 			InsertHyperLinkOperation,
 			InsertHyperLinkToolbarOperation
 		].forEach((command) => {
-			this._commandService.registerCommand(command);
+			this.disposeWithMe(this._commandService.registerCommand(command));
 		});
 	}
-	_initMenus() {
-		this._menuManagerService.mergeMenu(menuSchema);
-	}
 	_initShortCut() {
-		this._shortcutService.registerShortcut(InsertLinkShortcut);
+		this.disposeWithMe(this._shortcutService.registerShortcut(InsertLinkShortcut));
 	}
 };
-SheetsHyperLinkUIController = __decorate([
-	__decorateParam(0, ICommandService),
-	__decorateParam(1, IMenuManagerService),
-	__decorateParam(2, Inject(IShortcutService))
-], SheetsHyperLinkUIController);
+SheetsHyperLinkUIController = __decorate([__decorateParam(0, ICommandService), __decorateParam(1, Inject(IShortcutService))], SheetsHyperLinkUIController);
 
 //#endregion
 //#region src/controllers/url.controller.ts
@@ -2595,6 +2631,47 @@ let SheetHyperLinkUrlController = class SheetHyperLinkUrlController extends Disp
 };
 SheetHyperLinkUrlController = __decorate([__decorateParam(0, Inject(SheetsHyperLinkParserService)), __decorateParam(1, Inject(SheetsHyperLinkResolverService))], SheetHyperLinkUrlController);
 
+//#endregion
+//#region src/menu/mobile-schema.ts
+const mobileMenuSchema = {
+	[RibbonInsertGroup.MEDIA]: { [InsertHyperLinkToolbarOperation.id]: {
+		order: 1,
+		menuItemFactory: insertLinkMenuToolbarFactory
+	} },
+	[ContextMenuPosition.MAIN_AREA]: { [ContextMenuGroup.OTHERS]: {
+		order: 1,
+		[InsertHyperLinkToolbarOperation.id]: {
+			order: 0,
+			menuItemFactory: insertLinkMenuFactory
+		}
+	} }
+};
+
+//#endregion
+//#region src/menu/mobile-hyper-link-menu.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 SheetsHyperLinkMobileMenuController = class SheetsHyperLinkMobileMenuController extends Disposable {
+	constructor(menuManagerService) {
+		super();
+		menuManagerService.mergeMenu(mobileMenuSchema);
+	}
+};
+SheetsHyperLinkMobileMenuController = __decorate([__decorateParam(0, IMenuManagerService)], SheetsHyperLinkMobileMenuController);
+
 //#endregion
 //#region src/services/mobile-popup.service.ts
 const MOBILE_HYPER_LINK_EDITOR_DIALOG_ID = "sheet-mobile-hyper-link-editor";
@@ -2728,10 +2805,10 @@ let UniverSheetsHyperLinkMobileUIPlugin = class UniverSheetsHyperLinkMobileUIPlu
 			[MobileComponentsController],
 			[SheetsHyperLinkResolverService],
 			[ISheetsHyperLinkPopupService, { useClass: SheetsHyperLinkMobilePopupService }],
-			[SheetsHyperLinkPopupService, { useExisting: ISheetsHyperLinkPopupService }],
 			[SheetsHyperLinkSidePanelService],
 			[SheetsHyperLinkMobilePopupController],
 			[SheetsHyperLinkUIController],
+			[SheetsHyperLinkMobileMenuController],
 			[SheetsHyperLinkAutoFillController],
 			[SheetsHyperLinkCopyPasteController],
 			[SheetsHyperLinkPermissionController],
@@ -2747,6 +2824,7 @@ let UniverSheetsHyperLinkMobileUIPlugin = class UniverSheetsHyperLinkMobileUIPlu
 		this._injector.get(SheetsHyperLinkAutoFillController);
 		this._injector.get(SheetsHyperLinkCopyPasteController);
 		this._injector.get(SheetsHyperLinkUIController);
+		this._injector.get(SheetsHyperLinkMobileMenuController);
 	}
 	onRendered() {
 		this._injector.get(SheetsHyperLinkPermissionController);
@@ -2992,7 +3070,7 @@ let SheetsHyperLinkPopupController = class SheetsHyperLinkPopupController extend
 };
 SheetsHyperLinkPopupController = __decorate([
 	__decorateParam(0, Inject(HoverManagerService)),
-	__decorateParam(1, Inject(SheetsHyperLinkPopupService)),
+	__decorateParam(1, Inject(ISheetsHyperLinkPopupService)),
 	__decorateParam(2, Inject(IRenderManagerService)),
 	__decorateParam(3, Inject(IPermissionService)),
 	__decorateParam(4, Inject(SheetPermissionCheckController)),
@@ -3002,6 +3080,31 @@ SheetsHyperLinkPopupController = __decorate([
 	__decorateParam(8, IUniverInstanceService)
 ], SheetsHyperLinkPopupController);
 
+//#endregion
+//#region src/menu/hyper-link-menu.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 SheetsHyperLinkMenuController = class SheetsHyperLinkMenuController extends Disposable {
+	constructor(menuManagerService) {
+		super();
+		menuManagerService.mergeMenu(menuSchema);
+	}
+};
+SheetsHyperLinkMenuController = __decorate([__decorateParam(0, IMenuManagerService)], SheetsHyperLinkMenuController);
+
 //#endregion
 //#region src/plugin.ts
 let UniverSheetsHyperLinkUIPlugin = class UniverSheetsHyperLinkUIPlugin extends Plugin {
@@ -3020,10 +3123,10 @@ let UniverSheetsHyperLinkUIPlugin = class UniverSheetsHyperLinkUIPlugin extends
 		[
 			[SheetsHyperLinkResolverService],
 			[ISheetsHyperLinkPopupService, { useClass: SheetsHyperLinkPopupService }],
-			[SheetsHyperLinkPopupService, { useExisting: ISheetsHyperLinkPopupService }],
 			[SheetsHyperLinkSidePanelService],
 			[SheetsHyperLinkPopupController],
 			[SheetsHyperLinkUIController],
+			[SheetsHyperLinkMenuController],
 			[SheetsHyperLinkAutoFillController],
 			[SheetsHyperLinkCopyPasteController],
 			[SheetsHyperLinkPermissionController],
@@ -3035,6 +3138,7 @@ let UniverSheetsHyperLinkUIPlugin = class UniverSheetsHyperLinkUIPlugin extends
 		this._injector.get(SheetsHyperLinkAutoFillController);
 		this._injector.get(SheetsHyperLinkCopyPasteController);
 		this._injector.get(SheetsHyperLinkUIController);
+		this._injector.get(SheetsHyperLinkMenuController);
 	}
 	onRendered() {
 		this._injector.get(SheetsHyperLinkPermissionController);