lk-text-select-highlight 1.0.0 → 1.0.2

package/index.js

@@ -20,6 +20,18 @@ class TextHighlighter {
 		this.highlights = [];
 	}
 
+	/**
+	 * Generate a simple UUID
+	 */
+	generateUUID() {
+		return (
+			"highlight-" +
+			Date.now() +
+			"-" +
+			Math.random().toString(36).substr(2, 9)
+		);
+	}
+
 	/**
 	 * Highlight selected text
 	 */
@@ -54,10 +66,11 @@ class TextHighlighter {
 		}
 
 		try {
-			const highlightedElement = this.wrapRange(range);
+			const uuid = this.generateUUID();
+			const highlightedElement = this.wrapRange(range, uuid);
 
 			this.highlights.push({
-				element: highlightedElement,
+				uuid: uuid,
 				text: selection.toString(),
 			});
 
@@ -114,14 +127,18 @@ class TextHighlighter {
 	/**
 	 * Wrap a range with highlight element
 	 * @param {Range} range - The range to wrap
+	 * @param {string} uuid - Unique identifier for the highlight
 	 */
-	wrapRange(range) {
+	wrapRange(range, uuid) {
 		const highlightEl = document.createElement("span");
 		highlightEl.className = this.options.className;
 		highlightEl.style.backgroundColor = this.options.color;
 		highlightEl.style.padding = "0";
 		highlightEl.style.margin = "0";
 
+		// Add UUID as data attribute
+		highlightEl.setAttribute("data-uuid", uuid);
+
 		// Clone the range and insert the highlight element
 		range.surroundContents(highlightEl);
 
@@ -133,12 +150,12 @@ class TextHighlighter {
 	 */
 	removeAllHighlights() {
 		this.highlights.forEach((highlight) => {
-			if (highlight.element.parentNode) {
+			const element = document.querySelector(
+				`[data-uuid="${highlight.uuid}"]`,
+			);
+			if (element && element.parentNode) {
 				const textNode = document.createTextNode(highlight.text);
-				highlight.element.parentNode.replaceChild(
-					textNode,
-					highlight.element,
-				);
+				element.parentNode.replaceChild(textNode, element);
 			}
 		});
 
@@ -149,23 +166,26 @@ class TextHighlighter {
 	 * Get all highlighted elements
 	 */
 	getHighlights() {
+		// Return highlights with uuid and text
 		return [...this.highlights];
 	}
 
 	/**
 	 * Remove a specific highlight
-	 * @param {Object} highlight - The highlight object to remove
+	 * @param {Object} highlight - The highlight object to remove (containing uuid)
 	 */
 	removeHighlight(highlight) {
-		const index = this.highlights.indexOf(highlight);
+		const index = this.highlights.findIndex(
+			(h) => h.uuid === highlight.uuid,
+		);
 		if (index !== -1) {
 			// Restore the original text
-			if (highlight.element.parentNode) {
+			const element = document.querySelector(
+				`[data-uuid="${highlight.uuid}"]`,
+			);
+			if (element && element.parentNode) {
 				const textNode = document.createTextNode(highlight.text);
-				highlight.element.parentNode.replaceChild(
-					textNode,
-					highlight.element,
-				);
+				element.parentNode.replaceChild(textNode, element);
 			}
 
 			// Remove from the highlights array

package/package.json

@@ -1,6 +1,6 @@
 {
 	"name": "lk-text-select-highlight",
-	"version": "1.0.0",
+	"version": "1.0.2",
 	"description": "A lightweight JavaScript library for highlighting selected text on web pages",
 	"main": "dist/lk-text-select-highlight.cjs.js",
 	"module": "dist/lk-text-select-highlight.esm.js",
@@ -13,7 +13,8 @@
 		".": {
 			"import": "./dist/lk-text-select-highlight.esm.js",
 			"require": "./dist/lk-text-select-highlight.cjs.js",
-			"umd": "./dist/lk-text-select-highlight.umd.js"
+			"umd": "./dist/lk-text-select-highlight.umd.js",
+			"types": "./types/index.d.ts"
 		}
 	},
 	"scripts": {
@@ -33,12 +34,12 @@
 	"license": "MIT",
 	"repository": {
 		"type": "git",
-		"url": "https://github.com/yourusername/lk-text-select-highlight.git"
+		"url": "https://gitee.com/liu_k41/lk-text-select-highlight.git"
 	},
 	"bugs": {
-		"url": "https://github.com/yourusername/lk-text-select-highlight/issues"
+		"url": "https://gitee.com/liu_k41/lk-text-select-highlight/issues"
 	},
-	"homepage": "https://github.com/yourusername/lk-text-select-highlight#readme",
+	"homepage": "https://gitee.com/liu_k41/lk-text-select-highlight#readme",
 	"devDependencies": {
 		"@rollup/plugin-commonjs": "^25.0.7",
 		"@rollup/plugin-node-resolve": "^15.2.3",

package/types/index.d.ts

@@ -31,8 +31,8 @@ declare interface TextHighlighterOptions {
 }
 
 declare interface HighlightObject {
-	/** 高亮的DOM元素 */
-	element: HTMLElement;
+	/** 高亮的唯一标识符 */
+	uuid: string;
 	/** 高亮的文本内容 */
 	text: string;
 }