@univerjs/docs-hyper-link-ui 1.0.0-beta.0 → 1.0.0-beta.2

package/lib/cjs/index.js

@@ -171,7 +171,7 @@ const DocHyperLinkEdit = () => {
 	};
 	if (!doc) return;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: (0, _univerjs_design.clsx)("univer-box-border univer-w-[328px] univer-rounded-xl univer-bg-white univer-px-6 univer-py-5 univer-shadow dark:!univer-bg-gray-900", _univerjs_design.borderClassName),
+		className: (0, _univerjs_design.clsx)("univer-box-border univer-w-[328px] univer-rounded-xl univer-bg-gray-0 univer-px-6 univer-py-5 univer-shadow dark:!univer-bg-gray-900", _univerjs_design.borderClassName),
 		children: [/* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", { children: [editing ? /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_univerjs_design.FormLayout, {
 			label: localeService.t("docs-hyper-link-ui.edit.label"),
 			error: showError && isBlankInput(label) ? localeService.t("docs-hyper-link-ui.edit.labelError") : "",
@@ -247,7 +247,7 @@ const DocLinkPopup = () => {
 	if (!link) return null;
 	const url = (_link$properties = link.properties) === null || _link$properties === void 0 ? void 0 : _link$properties.url;
 	return /* @__PURE__ */ (0, react_jsx_runtime.jsxs)("div", {
-		className: (0, _univerjs_design.clsx)("univer-box-border univer-flex univer-max-w-80 univer-items-center univer-justify-between univer-overflow-hidden univer-rounded-lg univer-bg-white univer-p-3 univer-shadow dark:!univer-bg-gray-900", _univerjs_design.borderClassName),
+		className: (0, _univerjs_design.clsx)("univer-box-border univer-flex univer-max-w-80 univer-items-center univer-justify-between univer-overflow-hidden univer-rounded-lg univer-bg-gray-0 univer-p-3 univer-shadow dark:!univer-bg-gray-900", _univerjs_design.borderClassName),
 		onClick: () => {
 			hyperLinkService.hideInfoPopup();
 		},
@@ -255,7 +255,7 @@ const DocLinkPopup = () => {
 			className: "univer-flex univer-h-6 univer-flex-1 univer-cursor-pointer univer-items-center univer-truncate univer-text-sm univer-leading-5 univer-text-primary-500",
 			onClick: () => window.open(url, void 0, "noopener noreferrer"),
 			children: [/* @__PURE__ */ (0, react_jsx_runtime.jsx)("div", {
-				className: "univer-mr-2 univer-flex univer-size-5 univer-flex-[0_0_auto] univer-items-center univer-justify-center univer-text-base univer-text-gray-900 dark:!univer-text-white",
+				className: "univer-mr-2 univer-flex univer-size-5 univer-flex-[0_0_auto] univer-items-center univer-justify-center univer-text-base univer-text-gray-900 dark:!univer-text-gray-0",
 				children: /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_univerjs_icons.LinkIcon, {})
 			}), /* @__PURE__ */ (0, react_jsx_runtime.jsx)(_univerjs_design.Tooltip, {
 				showIfEllipsis: true,
@@ -388,7 +388,10 @@ let DocHyperLinkPopupService = class DocHyperLinkPopupService extends _univerjs_
 		_defineProperty(this, "showingLink$", this._showingLink$.asObservable());
 		_defineProperty(this, "_editPopup", null);
 		_defineProperty(this, "_infoPopup", null);
+		_defineProperty(this, "_infoPopupSuppressed", false);
+		_defineProperty(this, "_infoPopupSuppressionTimer", null);
 		this.disposeWithMe(() => {
+			if (this._infoPopupSuppressionTimer !== null) clearTimeout(this._infoPopupSuppressionTimer);
 			this._editingLink$.complete();
 			this._showingLink$.complete();
 		});
@@ -424,7 +427,8 @@ let DocHyperLinkPopupService = class DocHyperLinkPopupService extends _univerjs_
 		if (activeRange) {
 			this._editPopup = this._docCanvasPopupManagerService.attachPopupToRange(activeRange, {
 				componentKey: DocHyperLinkEdit.componentKey,
-				direction: "bottom"
+				direction: "bottom",
+				offset: [0, 10]
 			}, unitId);
 			return this._editPopup;
 		}
@@ -437,6 +441,7 @@ let DocHyperLinkPopupService = class DocHyperLinkPopupService extends _univerjs_
 	}
 	showInfoPopup(info) {
 		var _this$showing, _this$showing2, _this$showing3, _this$showing4, _this$showing5, _this$showing6;
+		if (this._infoPopupSuppressed) return;
 		const { linkId, unitId, segmentId, segmentPage, startIndex, endIndex } = info;
 		if (((_this$showing = this.showing) === null || _this$showing === void 0 ? void 0 : _this$showing.linkId) === linkId && ((_this$showing2 = this.showing) === null || _this$showing2 === void 0 ? void 0 : _this$showing2.unitId) === unitId && ((_this$showing3 = this.showing) === null || _this$showing3 === void 0 ? void 0 : _this$showing3.segmentId) === segmentId && ((_this$showing4 = this.showing) === null || _this$showing4 === void 0 ? void 0 : _this$showing4.segmentPage) === segmentPage && ((_this$showing5 = this.showing) === null || _this$showing5 === void 0 ? void 0 : _this$showing5.startIndex) === startIndex && ((_this$showing6 = this.showing) === null || _this$showing6 === void 0 ? void 0 : _this$showing6.endIndex) === endIndex) return;
 		if (this._infoPopup) this._infoPopup.dispose();
@@ -459,6 +464,7 @@ let DocHyperLinkPopupService = class DocHyperLinkPopupService extends _univerjs_
 			componentKey: DocLinkPopup.componentKey,
 			direction: "top-center",
 			multipleDirection: "top",
+			offset: [0, 10],
 			onClickOutside: () => {
 				this.hideInfoPopup();
 			}
@@ -470,6 +476,15 @@ let DocHyperLinkPopupService = class DocHyperLinkPopupService extends _univerjs_
 		this._showingLink$.next(null);
 		(_this$_infoPopup = this._infoPopup) === null || _this$_infoPopup === void 0 || _this$_infoPopup.dispose();
 	}
+	hideInfoPopupOnPointerDown() {
+		this._infoPopupSuppressed = true;
+		if (this._infoPopupSuppressionTimer !== null) clearTimeout(this._infoPopupSuppressionTimer);
+		this.hideInfoPopup();
+		this._infoPopupSuppressionTimer = setTimeout(() => {
+			this._infoPopupSuppressed = false;
+			this._infoPopupSuppressionTimer = null;
+		}, 0);
+	}
 };
 DocHyperLinkPopupService = __decorate([
 	__decorateParam(0, (0, _univerjs_core.Inject)(_univerjs_docs_ui.DocCanvasPopManagerService)),
@@ -589,7 +604,7 @@ const menuSchema = {
 //#endregion
 //#region package.json
 var name = "@univerjs/docs-hyper-link-ui";
-var version = "1.0.0-beta.0";
+var version = "1.0.0-beta.2";
 
 //#endregion
 //#region src/config/config.ts
@@ -649,25 +664,21 @@ let DocHyperLinkSelectionController = class DocHyperLinkSelectionController exte
 				const { unitId, ranges, segmentId } = commandInfo.params;
 				const doc = this._univerInstanceService.getUnit(unitId, _univerjs_core.UniverInstanceType.UNIVER_DOC);
 				const primary = ranges[0];
-				if (primary && doc) {
+				if ((primary === null || primary === void 0 ? void 0 : primary.collapsed) && doc) {
 					var _doc$getSelfOrHeaderF;
-					const { startOffset, endOffset, collapsed, segmentPage } = primary;
-					const customRanges = (_doc$getSelfOrHeaderF = doc.getSelfOrHeaderFooterModel(segmentId)) === null || _doc$getSelfOrHeaderF === void 0 || (_doc$getSelfOrHeaderF = _doc$getSelfOrHeaderF.getBody()) === null || _doc$getSelfOrHeaderF === void 0 ? void 0 : _doc$getSelfOrHeaderF.customRanges;
-					if (collapsed) {
-						const index = (customRanges === null || customRanges === void 0 ? void 0 : customRanges.findIndex((value) => value.startIndex < startOffset && value.endIndex > endOffset - 1)) ?? -1;
-						if (index > -1) {
-							const customRange = customRanges[index];
-							this._docHyperLinkService.showInfoPopup({
-								unitId,
-								linkId: customRange.rangeId,
-								segmentId,
-								segmentPage,
-								startIndex: customRange.startIndex,
-								endIndex: customRange.endIndex
-							});
-							return;
-						}
-					} else if (customRanges === null || customRanges === void 0 ? void 0 : customRanges.find((value) => value.startIndex <= startOffset && value.endIndex >= endOffset - 1)) return;
+					const { startOffset, endOffset, segmentPage } = primary;
+					const customRange = (_doc$getSelfOrHeaderF = doc.getSelfOrHeaderFooterModel(segmentId)) === null || _doc$getSelfOrHeaderF === void 0 || (_doc$getSelfOrHeaderF = _doc$getSelfOrHeaderF.getBody()) === null || _doc$getSelfOrHeaderF === void 0 || (_doc$getSelfOrHeaderF = _doc$getSelfOrHeaderF.customRanges) === null || _doc$getSelfOrHeaderF === void 0 ? void 0 : _doc$getSelfOrHeaderF.find((value) => value.rangeType === _univerjs_core.CustomRangeType.HYPERLINK && value.startIndex < startOffset && value.endIndex > endOffset - 1);
+					if (customRange) {
+						this._docHyperLinkService.showInfoPopup({
+							unitId,
+							linkId: customRange.rangeId,
+							segmentId,
+							segmentPage,
+							startIndex: customRange.startIndex,
+							endIndex: customRange.endIndex
+						});
+						return;
+					}
 				}
 				this._docHyperLinkService.hideInfoPopup();
 				this._docHyperLinkService.hideEditPopup();
@@ -696,12 +707,18 @@ let DocHyperLinkEventRenderController = class DocHyperLinkEventRenderController
 		this._docSkeletonManagerService = _docSkeletonManagerService;
 		this._docSelectionManagerService = _docSelectionManagerService;
 		if (this._context.unitId === _univerjs_core.DOCS_NORMAL_EDITOR_UNIT_ID_KEY) return;
+		this._initPointerDown();
 		this._initHover();
 		this._initClick();
 	}
 	_hideInfoPopup() {
 		if (this._hyperLinkPopupService.showing) this._commandService.executeCommand(ToggleDocHyperLinkInfoPopupOperation.id);
 	}
+	_initPointerDown() {
+		this.disposeWithMe(this._docEventManagerService.pointerDownCustomRanges$.subscribe((ranges) => {
+			if (!ranges.some((range) => range.range.rangeType === _univerjs_core.CustomRangeType.HYPERLINK)) this._hyperLinkPopupService.hideInfoPopupOnPointerDown();
+		}));
+	}
 	_initHover() {
 		this.disposeWithMe(this._docEventManagerService.hoverCustomRanges$.subscribe((ranges) => {
 			var _activeRanges$;
@@ -727,7 +744,8 @@ let DocHyperLinkEventRenderController = class DocHyperLinkEventRenderController
 	_initClick() {
 		this.disposeWithMe(this._docEventManagerService.clickCustomRanges$.subscribe((range) => {
 			const link = range.range;
-			if (link) this._commandService.executeCommand(ClickDocHyperLinkOperation.id, {
+			if (link.rangeType !== _univerjs_core.CustomRangeType.HYPERLINK || !range.ctrlKey && !range.metaKey) return;
+			this._commandService.executeCommand(ClickDocHyperLinkOperation.id, {
 				unitId: this._context.unitId,
 				linkId: link.rangeId,
 				segmentId: range.segmentId

package/lib/cjs/locale/ar-SA.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "تأكيد",
 		cancel: "إلغاء",
-		title: "ارتباط",
 		address: "ارتباط",
-		placeholder: "يُرجى إدخال عنوان URL للارتباط",
 		addressError: "عنوان URL غير قانوني!",
 		label: "تسمية",
 		labelError: "يُرجى إدخال تسمية الارتباط"

package/lib/cjs/locale/ca-ES.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Confirma",
 		cancel: "Cancel·la",
-		title: "Enllaç",
 		address: "Enllaç",
-		placeholder: "Si us plau, introdueix una URL",
 		addressError: "La URL no és vàlida!",
 		label: "Etiqueta",
 		labelError: "Si us plau, introdueix l'etiqueta de l'enllaç"

package/lib/cjs/locale/de-DE.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Bestätigen",
 		cancel: "Abbrechen",
-		title: "Link",
 		address: "Link",
-		placeholder: "Bitte eine Link-URL eingeben",
 		addressError: "URL ist ungültig!",
 		label: "Bezeichnung",
 		labelError: "Bitte die Bezeichnung des Links eingeben"

package/lib/cjs/locale/en-US.js

@@ -19,9 +19,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Confirm",
 		cancel: "Cancel",
-		title: "Link",
 		address: "Link",
-		placeholder: "Please input a link url",
 		addressError: "Url is illegal!",
 		label: "Label",
 		labelError: "Please input label of link"

package/lib/cjs/locale/es-ES.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Confirmar",
 		cancel: "Cancelar",
-		title: "Enlace",
 		address: "Enlace",
-		placeholder: "Por favor, introduce una URL",
 		addressError: "¡La URL no es válida!",
 		label: "Etiqueta",
 		labelError: "Por favor, introduce la etiqueta del enlace"

package/lib/cjs/locale/fa-IR.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "تایید",
 		cancel: "انصراف",
-		title: "لینک",
 		address: "لینک",
-		placeholder: "لطفا یک آدرس لینک وارد کنید",
 		addressError: "آدرس غیرمجاز است!",
 		label: "برچسب",
 		labelError: "لطفا برچسب لینک را وارد کنید"

package/lib/cjs/locale/fr-FR.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Confirmer",
 		cancel: "Annuler",
-		title: "Lien",
 		address: "Lien",
-		placeholder: "Veuillez entrer un lien",
 		addressError: "L'url est illégal!",
 		label: "Libellé",
 		labelError: "Veuillez entrer le label du lien"

package/lib/cjs/locale/id-ID.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Konfirmasi",
 		cancel: "Batal",
-		title: "Tautan",
 		address: "Tautan",
-		placeholder: "Silakan masukkan URL tautan",
 		addressError: "URL tidak valid!",
 		label: "Label",
 		labelError: "Silakan masukkan label tautan"

package/lib/cjs/locale/it-IT.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Conferma",
 		cancel: "Annulla",
-		title: "Collegamento",
 		address: "Collegamento",
-		placeholder: "Inserisci un URL di collegamento",
 		addressError: "URL non valido!",
 		label: "Etichetta",
 		labelError: "Inserisci l'etichetta del collegamento"

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

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "OK",
 		cancel: "キャンセル",
-		title: "リンク",
 		address: "アドレス",
-		placeholder: "リンクのURLを入力してください",
 		addressError: "URLが正しくありません！",
 		label: "表示文字列",
 		labelError: "リンクの表示文字列を入力してください"

package/lib/cjs/locale/ko-KR.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "확인",
 		cancel: "취소",
-		title: "링크",
 		address: "링크",
-		placeholder: "링크 URL을 입력해주세요",
 		addressError: "URL이 올바르지 않습니다!",
 		label: "라벨",
 		labelError: "링크 라벨을 입력해주세요"

package/lib/cjs/locale/pl-PL.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Potwierdź",
 		cancel: "Anuluj",
-		title: "Łącze",
 		address: "Łącze",
-		placeholder: "Wprowadź adres URL",
 		addressError: "Adres URL jest nieprawidłowy!",
 		label: "Etykieta",
 		labelError: "Wprowadź etykietę łącza"

package/lib/cjs/locale/pt-BR.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Confirmar",
 		cancel: "Cancelar",
-		title: "Link",
 		address: "Link",
-		placeholder: "Insira uma URL de link",
 		addressError: "URL inválida!",
 		label: "Rótulo",
 		labelError: "Insira o rótulo do link"

package/lib/cjs/locale/ru-RU.js

@@ -4,11 +4,9 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Подтвердить",
 		cancel: "Отменить",
-		title: "Ссылка",
 		address: "Ссылка",
 		label: "Текст",
 		labelError: "Введите текст ссылки",
-		placeholder: "Пожалуйста, введите ссылку",
 		addressError: "Пожалуйста, введите корректную ссылку"
 	},
 	info: {

package/lib/cjs/locale/sk-SK.js

@@ -4,9 +4,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Potvrdiť",
 		cancel: "Zrušiť",
-		title: "Odkaz",
 		address: "Odkaz",
-		placeholder: "Zadajte URL odkazu",
 		addressError: "URL je neplatná!",
 		label: "Popisok",
 		labelError: "Zadajte popis odkazu"

package/lib/cjs/locale/vi-VN.js

@@ -4,11 +4,9 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Xác nhận",
 		cancel: "Hủy",
-		title: "Liên kết",
 		address: "Liên kết",
 		label: "Nhãn",
 		labelError: "Vui lòng nhập nhãn liên kết",
-		placeholder: "Vui lòng nhập liên kết hợp lệ",
 		addressError: "Vui lòng nhập liên kết hợp lệ"
 	},
 	info: {

package/lib/cjs/locale/zh-CN.js

@@ -4,11 +4,9 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "确认",
 		cancel: "取消",
-		title: "链接",
 		address: "链接",
 		label: "文本",
 		labelError: "请输入链接文本",
-		placeholder: "请输入合法的链接",
 		addressError: "请输入合法的链接"
 	},
 	info: {

package/lib/cjs/locale/zh-HK.js

@@ -4,11 +4,9 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "確認",
 		cancel: "取消",
-		title: "連結",
 		address: "連結",
 		label: "文字",
 		labelError: "請輸入連結文字",
-		placeholder: "請輸入合法的連結",
 		addressError: "請輸入合法的連結"
 	},
 	info: {

package/lib/cjs/locale/zh-TW.js

@@ -4,11 +4,9 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "確認",
 		cancel: "取消",
-		title: "連結",
 		address: "連結",
 		label: "文字",
 		labelError: "請輸入連結文字",
-		placeholder: "請輸入合法的連結",
 		addressError: "請輸入合法的連結"
 	},
 	info: {

package/lib/es/index.js

@@ -170,7 +170,7 @@ const DocHyperLinkEdit = () => {
 	};
 	if (!doc) return;
 	return /* @__PURE__ */ jsxs("div", {
-		className: clsx("univer-box-border univer-w-[328px] univer-rounded-xl univer-bg-white univer-px-6 univer-py-5 univer-shadow dark:!univer-bg-gray-900", borderClassName),
+		className: clsx("univer-box-border univer-w-[328px] univer-rounded-xl univer-bg-gray-0 univer-px-6 univer-py-5 univer-shadow dark:!univer-bg-gray-900", borderClassName),
 		children: [/* @__PURE__ */ jsxs("div", { children: [editing ? /* @__PURE__ */ jsx(FormLayout, {
 			label: localeService.t("docs-hyper-link-ui.edit.label"),
 			error: showError && isBlankInput(label) ? localeService.t("docs-hyper-link-ui.edit.labelError") : "",
@@ -246,7 +246,7 @@ const DocLinkPopup = () => {
 	if (!link) return null;
 	const url = (_link$properties = link.properties) === null || _link$properties === void 0 ? void 0 : _link$properties.url;
 	return /* @__PURE__ */ jsxs("div", {
-		className: clsx("univer-box-border univer-flex univer-max-w-80 univer-items-center univer-justify-between univer-overflow-hidden univer-rounded-lg univer-bg-white univer-p-3 univer-shadow dark:!univer-bg-gray-900", borderClassName),
+		className: clsx("univer-box-border univer-flex univer-max-w-80 univer-items-center univer-justify-between univer-overflow-hidden univer-rounded-lg univer-bg-gray-0 univer-p-3 univer-shadow dark:!univer-bg-gray-900", borderClassName),
 		onClick: () => {
 			hyperLinkService.hideInfoPopup();
 		},
@@ -254,7 +254,7 @@ const DocLinkPopup = () => {
 			className: "univer-flex univer-h-6 univer-flex-1 univer-cursor-pointer univer-items-center univer-truncate univer-text-sm univer-leading-5 univer-text-primary-500",
 			onClick: () => window.open(url, void 0, "noopener noreferrer"),
 			children: [/* @__PURE__ */ jsx("div", {
-				className: "univer-mr-2 univer-flex univer-size-5 univer-flex-[0_0_auto] univer-items-center univer-justify-center univer-text-base univer-text-gray-900 dark:!univer-text-white",
+				className: "univer-mr-2 univer-flex univer-size-5 univer-flex-[0_0_auto] univer-items-center univer-justify-center univer-text-base univer-text-gray-900 dark:!univer-text-gray-0",
 				children: /* @__PURE__ */ jsx(LinkIcon, {})
 			}), /* @__PURE__ */ jsx(Tooltip, {
 				showIfEllipsis: true,
@@ -387,7 +387,10 @@ let DocHyperLinkPopupService = class DocHyperLinkPopupService extends Disposable
 		_defineProperty(this, "showingLink$", this._showingLink$.asObservable());
 		_defineProperty(this, "_editPopup", null);
 		_defineProperty(this, "_infoPopup", null);
+		_defineProperty(this, "_infoPopupSuppressed", false);
+		_defineProperty(this, "_infoPopupSuppressionTimer", null);
 		this.disposeWithMe(() => {
+			if (this._infoPopupSuppressionTimer !== null) clearTimeout(this._infoPopupSuppressionTimer);
 			this._editingLink$.complete();
 			this._showingLink$.complete();
 		});
@@ -423,7 +426,8 @@ let DocHyperLinkPopupService = class DocHyperLinkPopupService extends Disposable
 		if (activeRange) {
 			this._editPopup = this._docCanvasPopupManagerService.attachPopupToRange(activeRange, {
 				componentKey: DocHyperLinkEdit.componentKey,
-				direction: "bottom"
+				direction: "bottom",
+				offset: [0, 10]
 			}, unitId);
 			return this._editPopup;
 		}
@@ -436,6 +440,7 @@ let DocHyperLinkPopupService = class DocHyperLinkPopupService extends Disposable
 	}
 	showInfoPopup(info) {
 		var _this$showing, _this$showing2, _this$showing3, _this$showing4, _this$showing5, _this$showing6;
+		if (this._infoPopupSuppressed) return;
 		const { linkId, unitId, segmentId, segmentPage, startIndex, endIndex } = info;
 		if (((_this$showing = this.showing) === null || _this$showing === void 0 ? void 0 : _this$showing.linkId) === linkId && ((_this$showing2 = this.showing) === null || _this$showing2 === void 0 ? void 0 : _this$showing2.unitId) === unitId && ((_this$showing3 = this.showing) === null || _this$showing3 === void 0 ? void 0 : _this$showing3.segmentId) === segmentId && ((_this$showing4 = this.showing) === null || _this$showing4 === void 0 ? void 0 : _this$showing4.segmentPage) === segmentPage && ((_this$showing5 = this.showing) === null || _this$showing5 === void 0 ? void 0 : _this$showing5.startIndex) === startIndex && ((_this$showing6 = this.showing) === null || _this$showing6 === void 0 ? void 0 : _this$showing6.endIndex) === endIndex) return;
 		if (this._infoPopup) this._infoPopup.dispose();
@@ -458,6 +463,7 @@ let DocHyperLinkPopupService = class DocHyperLinkPopupService extends Disposable
 			componentKey: DocLinkPopup.componentKey,
 			direction: "top-center",
 			multipleDirection: "top",
+			offset: [0, 10],
 			onClickOutside: () => {
 				this.hideInfoPopup();
 			}
@@ -469,6 +475,15 @@ let DocHyperLinkPopupService = class DocHyperLinkPopupService extends Disposable
 		this._showingLink$.next(null);
 		(_this$_infoPopup = this._infoPopup) === null || _this$_infoPopup === void 0 || _this$_infoPopup.dispose();
 	}
+	hideInfoPopupOnPointerDown() {
+		this._infoPopupSuppressed = true;
+		if (this._infoPopupSuppressionTimer !== null) clearTimeout(this._infoPopupSuppressionTimer);
+		this.hideInfoPopup();
+		this._infoPopupSuppressionTimer = setTimeout(() => {
+			this._infoPopupSuppressed = false;
+			this._infoPopupSuppressionTimer = null;
+		}, 0);
+	}
 };
 DocHyperLinkPopupService = __decorate([
 	__decorateParam(0, Inject(DocCanvasPopManagerService)),
@@ -588,7 +603,7 @@ const menuSchema = {
 //#endregion
 //#region package.json
 var name = "@univerjs/docs-hyper-link-ui";
-var version = "1.0.0-beta.0";
+var version = "1.0.0-beta.2";
 
 //#endregion
 //#region src/config/config.ts
@@ -648,25 +663,21 @@ let DocHyperLinkSelectionController = class DocHyperLinkSelectionController exte
 				const { unitId, ranges, segmentId } = commandInfo.params;
 				const doc = this._univerInstanceService.getUnit(unitId, UniverInstanceType.UNIVER_DOC);
 				const primary = ranges[0];
-				if (primary && doc) {
+				if ((primary === null || primary === void 0 ? void 0 : primary.collapsed) && doc) {
 					var _doc$getSelfOrHeaderF;
-					const { startOffset, endOffset, collapsed, segmentPage } = primary;
-					const customRanges = (_doc$getSelfOrHeaderF = doc.getSelfOrHeaderFooterModel(segmentId)) === null || _doc$getSelfOrHeaderF === void 0 || (_doc$getSelfOrHeaderF = _doc$getSelfOrHeaderF.getBody()) === null || _doc$getSelfOrHeaderF === void 0 ? void 0 : _doc$getSelfOrHeaderF.customRanges;
-					if (collapsed) {
-						const index = (customRanges === null || customRanges === void 0 ? void 0 : customRanges.findIndex((value) => value.startIndex < startOffset && value.endIndex > endOffset - 1)) ?? -1;
-						if (index > -1) {
-							const customRange = customRanges[index];
-							this._docHyperLinkService.showInfoPopup({
-								unitId,
-								linkId: customRange.rangeId,
-								segmentId,
-								segmentPage,
-								startIndex: customRange.startIndex,
-								endIndex: customRange.endIndex
-							});
-							return;
-						}
-					} else if (customRanges === null || customRanges === void 0 ? void 0 : customRanges.find((value) => value.startIndex <= startOffset && value.endIndex >= endOffset - 1)) return;
+					const { startOffset, endOffset, segmentPage } = primary;
+					const customRange = (_doc$getSelfOrHeaderF = doc.getSelfOrHeaderFooterModel(segmentId)) === null || _doc$getSelfOrHeaderF === void 0 || (_doc$getSelfOrHeaderF = _doc$getSelfOrHeaderF.getBody()) === null || _doc$getSelfOrHeaderF === void 0 || (_doc$getSelfOrHeaderF = _doc$getSelfOrHeaderF.customRanges) === null || _doc$getSelfOrHeaderF === void 0 ? void 0 : _doc$getSelfOrHeaderF.find((value) => value.rangeType === CustomRangeType.HYPERLINK && value.startIndex < startOffset && value.endIndex > endOffset - 1);
+					if (customRange) {
+						this._docHyperLinkService.showInfoPopup({
+							unitId,
+							linkId: customRange.rangeId,
+							segmentId,
+							segmentPage,
+							startIndex: customRange.startIndex,
+							endIndex: customRange.endIndex
+						});
+						return;
+					}
 				}
 				this._docHyperLinkService.hideInfoPopup();
 				this._docHyperLinkService.hideEditPopup();
@@ -695,12 +706,18 @@ let DocHyperLinkEventRenderController = class DocHyperLinkEventRenderController
 		this._docSkeletonManagerService = _docSkeletonManagerService;
 		this._docSelectionManagerService = _docSelectionManagerService;
 		if (this._context.unitId === DOCS_NORMAL_EDITOR_UNIT_ID_KEY) return;
+		this._initPointerDown();
 		this._initHover();
 		this._initClick();
 	}
 	_hideInfoPopup() {
 		if (this._hyperLinkPopupService.showing) this._commandService.executeCommand(ToggleDocHyperLinkInfoPopupOperation.id);
 	}
+	_initPointerDown() {
+		this.disposeWithMe(this._docEventManagerService.pointerDownCustomRanges$.subscribe((ranges) => {
+			if (!ranges.some((range) => range.range.rangeType === CustomRangeType.HYPERLINK)) this._hyperLinkPopupService.hideInfoPopupOnPointerDown();
+		}));
+	}
 	_initHover() {
 		this.disposeWithMe(this._docEventManagerService.hoverCustomRanges$.subscribe((ranges) => {
 			var _activeRanges$;
@@ -726,7 +743,8 @@ let DocHyperLinkEventRenderController = class DocHyperLinkEventRenderController
 	_initClick() {
 		this.disposeWithMe(this._docEventManagerService.clickCustomRanges$.subscribe((range) => {
 			const link = range.range;
-			if (link) this._commandService.executeCommand(ClickDocHyperLinkOperation.id, {
+			if (link.rangeType !== CustomRangeType.HYPERLINK || !range.ctrlKey && !range.metaKey) return;
+			this._commandService.executeCommand(ClickDocHyperLinkOperation.id, {
 				unitId: this._context.unitId,
 				linkId: link.rangeId,
 				segmentId: range.segmentId

package/lib/es/locale/ar-SA.js

@@ -3,9 +3,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "تأكيد",
 		cancel: "إلغاء",
-		title: "ارتباط",
 		address: "ارتباط",
-		placeholder: "يُرجى إدخال عنوان URL للارتباط",
 		addressError: "عنوان URL غير قانوني!",
 		label: "تسمية",
 		labelError: "يُرجى إدخال تسمية الارتباط"

package/lib/es/locale/ca-ES.js

@@ -3,9 +3,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Confirma",
 		cancel: "Cancel·la",
-		title: "Enllaç",
 		address: "Enllaç",
-		placeholder: "Si us plau, introdueix una URL",
 		addressError: "La URL no és vàlida!",
 		label: "Etiqueta",
 		labelError: "Si us plau, introdueix l'etiqueta de l'enllaç"

package/lib/es/locale/de-DE.js

@@ -3,9 +3,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Bestätigen",
 		cancel: "Abbrechen",
-		title: "Link",
 		address: "Link",
-		placeholder: "Bitte eine Link-URL eingeben",
 		addressError: "URL ist ungültig!",
 		label: "Bezeichnung",
 		labelError: "Bitte die Bezeichnung des Links eingeben"

package/lib/es/locale/en-US.js

@@ -18,9 +18,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Confirm",
 		cancel: "Cancel",
-		title: "Link",
 		address: "Link",
-		placeholder: "Please input a link url",
 		addressError: "Url is illegal!",
 		label: "Label",
 		labelError: "Please input label of link"

package/lib/es/locale/es-ES.js

@@ -3,9 +3,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Confirmar",
 		cancel: "Cancelar",
-		title: "Enlace",
 		address: "Enlace",
-		placeholder: "Por favor, introduce una URL",
 		addressError: "¡La URL no es válida!",
 		label: "Etiqueta",
 		labelError: "Por favor, introduce la etiqueta del enlace"

package/lib/es/locale/fa-IR.js

@@ -3,9 +3,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "تایید",
 		cancel: "انصراف",
-		title: "لینک",
 		address: "لینک",
-		placeholder: "لطفا یک آدرس لینک وارد کنید",
 		addressError: "آدرس غیرمجاز است!",
 		label: "برچسب",
 		labelError: "لطفا برچسب لینک را وارد کنید"

package/lib/es/locale/fr-FR.js

@@ -3,9 +3,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Confirmer",
 		cancel: "Annuler",
-		title: "Lien",
 		address: "Lien",
-		placeholder: "Veuillez entrer un lien",
 		addressError: "L'url est illégal!",
 		label: "Libellé",
 		labelError: "Veuillez entrer le label du lien"

package/lib/es/locale/id-ID.js

@@ -3,9 +3,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Konfirmasi",
 		cancel: "Batal",
-		title: "Tautan",
 		address: "Tautan",
-		placeholder: "Silakan masukkan URL tautan",
 		addressError: "URL tidak valid!",
 		label: "Label",
 		labelError: "Silakan masukkan label tautan"

package/lib/es/locale/it-IT.js

@@ -3,9 +3,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "Conferma",
 		cancel: "Annulla",
-		title: "Collegamento",
 		address: "Collegamento",
-		placeholder: "Inserisci un URL di collegamento",
 		addressError: "URL non valido!",
 		label: "Etichetta",
 		labelError: "Inserisci l'etichetta del collegamento"

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

@@ -3,9 +3,7 @@ const locale = { "docs-hyper-link-ui": {
 	edit: {
 		confirm: "OK",
 		cancel: "キャンセル",
-		title: "リンク",
 		address: "アドレス",
-		placeholder: "リンクのURLを入力してください",
 		addressError: "URLが正しくありません！",
 		label: "表示文字列",
 		labelError: "リンクの表示文字列を入力してください"