word-marker/dist/index.umd.js

The library used to tag web page text, which can store tag information.

(function(C,I){typeof exports=="object"&&typeof module<"u"?I(exports):typeof define=="function"&&define.amd?define(["exports"],I):(C=typeof globalThis<"u"?globalThis:C||self,I(C.wordMarker={}))})(this,function(C){"use strict";/** wordMarker v1.1.16
  * (c) 2025-7-23
  * @license MIT
  */const I=Object.freeze(Object.defineProperty({__proto__:null},Symbol.toStringTag,{value:"Module"})),u="data-mark-id",L=t=>{let r="";for(let e=0;e<t;e++){const s=Math.random()*62|0;s<10?r+=s:s<36?r+=String.fromCharCode(65+s-10):r+=String.fromCharCode(97+s-36)}return r},p=t=>Object.prototype.toString.call(t)==="[object Text]",V=(t,r=50)=>{let e=null;return()=>{e&&clearTimeout(e),e=setTimeout(()=>{t(),e=null},r)}},j=t=>{const r=/translateY\((\d+(\.\d+)?)px\)/.exec(t.style.transform);return r?Number(r[1]):0},q=(t,r)=>{let e=t.parentElement;return e!=null&&e.parentElement&&e.parentElement!==r&&(e=e.parentElement),Array.from(e.children).map(s=>s.localName).join(",")},F=(t,r)=>{var s;let e=t.parentElement;return(e==null?void 0:e.parentElement)===r?"":((s=e.parentElement)==null?void 0:s.textContent)||""},Z=(t,r,e=1)=>{const s=document.createElement("div");s.setAttribute("style",`position: absolute; top: 0; left: 0; z-index: ${e}; pointer-events: none;`);const n=document.createElement("canvas");return n.width=t.scrollWidth,n.height=r?window.innerHeight*3:t.scrollHeight,s.appendChild(n),t.appendChild(s),n},ee=t=>{const r=[];let e=t.parentElement;for(;e;)r.push(e),e=(e==null?void 0:e.parentElement)||null;return r},te=(t,r)=>{let e=t.parentElement;for(;e;){if(r.includes(e))return e;e=(e==null?void 0:e.parentElement)||null}return null},J=(t,r)=>{let e=t==null?void 0:t.parentElement;for(;e;){if(e===r)return e;e=(e==null?void 0:e.parentElement)||null}return null};let R=!1,M=!1;const U=(t,r,e,s)=>{const n=[];return!t||R||Array.from(t.childNodes).forEach(o=>{R||(o.nodeType===1?n.push(...U(o,r,e,s)):o.nodeType===3&&!(s!=null&&s(o))&&(!M&&o===r&&(M=!0),M&&n.push(o)),o===e&&(R=!0))}),n},ne=(t,r,e)=>{if(!t||!r)return[];if(t===r)return[t];const s=ee(t),n=te(r,s),i=J(t,n),o=J(r,n);if(!i||!o)return[];const l=[];let f=i;for(;f!==o.nextSibling;)R=!1,M=!1,l.push(...U(f,t,r,e)),f=f==null?void 0:f.nextSibling;return l},O=(t,r,e)=>{const s=t.canvas;t.fillStyle=e.color,t.globalAlpha=e.globalAlpha,t.clearRect(0,0,s.width,s.height);const n=j(s);r.forEach(i=>{i.range.forEach(o=>{const{x:l,y:f,width:h,height:d}=o;if(f>=n&&f<=n+window.innerHeight*3){const w=f-n;e.mark?e.mark(t,{x:l,y:w,width:h,height:d}):t.fillRect(l,w,h,d)}})})},W=(t,r,e,s,n)=>{const i=r.findIndex(l=>l.id===s);if(i>-1){const l=r.splice(i,1)[0];if(l.startEle){const f=b(l.startEle.parentElement,n.attribute||u);r.find(h=>h.startEleId===f)||D(l.startEle.parentElement,u)}if(l.endEle){const f=b(l.endEle.parentElement,n.attribute||u);r.find(h=>h.endEleId===f)||D(l.endEle.parentElement,u)}}const o=e.findIndex(l=>l.id===s);o>-1&&(e.splice(o,1),O(t,e,n))},X=(t,r,e,s)=>{const n=r.getBoundingClientRect(),i=e.getClientRects(),o=[];for(let l=0;l<i.length;l++){const f=i[l],h=f.left-n.left,d=f.top-n.top,w=f.right-f.left,v=f.bottom-f.top;if(w===0||v===0)continue;const A=j(t.canvas),a=d-A;s==null||s({x:h,y:a,width:w,height:v}),o.push({x:h,y:d,width:w,height:v})}return o},$=(t,r,e,s,n)=>{const i=ne(r.startEle,r.endEle,n.ignoreNode),o=[];i.forEach((l,f)=>{const h=document.createRange();h.setStart(l,f===0?r.startOffset:0);let d=f===i.length-1?r.endOffset:l.data.length;d>l.length&&(d=l.length),h.setEnd(l,d);const w=X(t,s,h,v=>{const{x:A,y:a,width:c,height:g}=v;n.mark?n.mark(t,{x:A,y:a,width:c,height:g}):t.fillRect(A,a,c,g)});o.push(...w)}),e.push({id:r.id,range:o,message:r.message})},b=(t,r)=>{var e;return!t||!r?"":((e=t.getAttribute)==null?void 0:e.call(t,r))||""},D=(t,r)=>{if(!(!t||!r))return t.removeAttribute(r)},G=(t=u,r)=>!!document.querySelector(`[${t}="${r}"]`),P=(t,r,e)=>{t&&r&&(t==null||t.setAttribute(r,e||""))};function re(t,r){const e=le(t,r);if(!e)return;const{firstNode:s,endNode:n}=e;let i=document.createRange();i.setStart(s.node,s.index),i.setEnd(n.node,n.index);let o=window.getSelection();o&&(o.removeAllRanges(),o.addRange(i))}function Y(t,r){var e;if((e=t.textContent)!=null&&e.includes(r)){for(const s of Array.from(t.children)){let n=Y(s,r);if(n)return Y(n,r)}return t}}function _(t,r,e,s=0){var n,i,o;for(const l of Array.from(t.childNodes)){if(p(l))s+=((n=l.textContent)==null?void 0:n.length)||0;else{const f=_(l,r,e,s);if(typeof f=="number")s=f;else return f}if(p(l)){if(e==="start"&&s>r)return{index:r-(s-(((i=l.textContent)==null?void 0:i.length)||0)),node:l};if(e==="end"&&s>=r)return{index:r-(s-(((o=l.textContent)==null?void 0:o.length)||0)),node:l}}}return s}function le(t,r){var o,l;if(!r||!((o=t.textContent)!=null&&o.includes(r)))return;const e=Y(t,r);if(!e)return;const s=((l=e.textContent)==null?void 0:l.indexOf(r))||0,n=_(e,s,"start"),i=_(e,s+r.length,"end");if(!(typeof n=="number"||typeof i=="number"))return{firstNode:n,endNode:i}}const K=(t,r)=>{const{startEle:e,endEle:s}=t;if(!e||!s||!p(e)||!p(s))return;let n="",i="";r?(n=b(e.parentElement,r),i=b(s.parentElement,r)):(n=b(e.parentElement,u),n||(n=L(10),P(e.parentElement,u,n)),i=b(s.parentElement,u),i||(i=L(10),P(s.parentElement,u,i))),t.startEleId=n,t.endEleId=i},se=(t,r)=>{const e=r.getRangeAt(0),s=e.startContainer,n=e.endContainer;return!p(s)||!p(n)?void 0:{id:L(10),startEle:s,startOffset:e.startOffset,startText:s.data,startBrother:q(s,t),startParentText:F(s,t),endEle:n,endOffset:e.endOffset,endText:n.data,endBrother:q(n,t),endParentText:F(n,t),text:r.toString(),message:"",single:s===n}},S=t=>{const r=[];return Array.from(t.childNodes).forEach(s=>{s.nodeType===1?r.push(...S(s)):s.nodeType===3&&r.push(s)}),r},H=(t,r)=>{const{startEle:e,startEleId:s,endEle:n,endEleId:i}=t;if(e&&n&&p(e)&&p(n)&&r===u){const o=b(e.parentElement,u);s&&!o&&P(e.parentElement,u,s);const l=b(n.parentElement,u);i&&!l&&P(n.parentElement,u,i)}},Q=(t,r,e)=>{if(t.nodeType!==1)return;const s=t.textContent;for(const n of r){if(!p(n.startEle)){if(n.startEleId&&G(e,n.startEleId)){if(n.startEleId===b(t,e)){const i=S(t);for(const o of i)if(o.data===n.startText){n.startEle=o,n.single&&(n.endEle=n.startEle,H(n,e));break}}}else if(!n.startParentText||n.startParentText===s){if(Array.from(t==null?void 0:t.children).map(l=>l.localName).join(",")!==n.startBrother)continue;const o=S(t);for(const l of o)if(l.data===n.startText){n.startEle=l,n.single&&(n.endEle=n.startEle,H(n,e));break}}}if(!n.single&&!p(n.endEle)){if(n.endEleId&&G(e,n.endEleId)){if(n.endEleId===b(t,e)){const i=S(t);for(const o of i)if(o.data===n.endText){n.endEle=o,H(n,e);break}}}else if(!n.endParentText||n.endParentText===s){if(Array.from(t==null?void 0:t.children).map(l=>l.localName).join(",")!==n.endBrother)continue;const o=S(t);for(const l of o)if(l.data===n.endText){n.endEle=l,H(n,e);break}}}}},z=(t,r,e)=>{var o;const s=e.attribute||u;let n=!1;if(r.forEach(l=>{const f=t.querySelector(`[${s}="${l.startEleId}"]`),h=t.querySelector(`[${s}="${l.endEleId}"]`);f&&f.childNodes.forEach(d=>{p(d)&&d.textContent===l.startText&&(l.startEle=d,l.single&&(l.endEle=d))}),h&&!l.endEle&&h.childNodes.forEach(d=>{p(d)&&d.textContent===l.endText&&(l.endEle=d)}),(!l.startEle||!l.endEle)&&(n=!0)}),!n&&!e.tag&&!e.attribute)return;const i=Array.from(t.childNodes);for(r.length&&Q(t,r,e.attribute||u);i.length;){const l=i.shift();l&&((o=e.tag)==null||o.call(e,l)),r.length&&Q(l,r,e.attribute||u);for(let f=0;f<(l==null?void 0:l.childNodes.length);f++)i.push(l==null?void 0:l.childNodes[f])}},oe=(t,r,e,s,n)=>{const i=t.getContext("2d");i.clearRect(0,0,t.width,t.height),r.forEach(o=>{$(i,o,e,s,n)})},ie={scrollBy:document,color:"rgba(224, 108, 117)",globalAlpha:.3,data:[]};function ae(t,r){const e={...ie,...r};let s=e.lazy===void 0?t.scrollHeight/4>window.innerHeight:e.lazy;s&&t.scrollHeight<=window.innerHeight*3&&(s=!1);const n=[],i=Z(t,s,e.zIndex),o=i.getContext("2d");o.fillStyle=e.color,o.globalAlpha=e.globalAlpha;let l=JSON.parse(JSON.stringify(e.data));(e.tag||l.length)&&(z(t,l,e),l=l.filter(a=>a.startEle&&a.endEle)),l.length&&oe(i,l,n,t,e);let f="",h=!1;const d=()=>{var c,g,x;const a=window.getSelection();if(a!=null&&a.toString()){h=!0;const y=se(t,a);if(!y)(c=e.callback)==null||c.call(e);else{const m=t.getBoundingClientRect(),k=a.getRangeAt(0),E=k.getBoundingClientRect(),T=X(o,t,k);(g=e.callback)==null||g.call(e,y,{x:E.x-m.x,y:E.y-m.y,width:E.width,height:E.height,range:T})}}else(x=e.callback)==null||x.call(e)},w=(a,c)=>{var g;if(f!==a||c){if(O(o,n,e),a){const x=n.find(m=>m.id===a),y=j(i);if(x)for(const m of x.range){const{x:k,y:E,width:T,height:N}=m;let B=E;E>=y&&E<=y+window.innerHeight*3&&(B=E-y),(g=e.highlight)==null||g.call(e,o,{x:k,y:B,width:T,height:N})}}f=a}},v=V(()=>{const a=t.getBoundingClientRect();let c=0;a.y>=-window.innerHeight?c=0:a.y<=window.innerHeight*3-t.scrollHeight?c=t.scrollHeight-window.innerHeight*3:c=-window.innerHeight-a.y,i.style.transform=`translateY(${c}px)`,O(o,n,e),f&&w(f,!0)});e.callback&&t.addEventListener("mouseup",d),s&&(e.scrollBy.addEventListener("scroll",v),v());let A="";return{selectText:re,triggerMarker:d,getActualMarkData(){return l.map(a=>({...a}))},getMarkData(){return JSON.parse(JSON.stringify(l,(a,c)=>{if((c==null?void 0:c.nodeType)!==3)return c}))},addMark(a){if(Array.isArray(a)){l.push(...a);for(const c of a)(!p(c.startEle)||!p(c.endEle))&&z(t,l,e),K(c,e.attribute),$(o,c,n,t,e)}else l.push(a),(!p(a.startEle)||!p(a.endEle))&&z(t,l,e),K(a,e.attribute),$(o,a,n,t,e)},modifyMark(a,c){const g=l.find(y=>y.id===a);g&&(g.message=c);const x=n.find(y=>y.id===a);x&&(x.message=c)},getPosition(a){const c=n.find(g=>g.id===a);if(c){let g=1/0,x=1/0;for(const y of c.range)g=Math.min(g,y.x),x=Math.min(x,y.y);return{x:g,y:x,range:c.range}}},deleteMark(a){if(Array.isArray(a))for(const c of a)W(o,l,n,c,e);else W(o,l,n,a,e)},checkMark(a,c){if(h){h=!1;return}const g=t.getBoundingClientRect(),x=a-window.scrollX-g.left,y=c-window.scrollY-g.top,m=[];let k=!1;for(const E of n)for(const T of E.range)if(x>=T.x&&x<=T.x+T.width&&y>=T.y&&y<=T.y+T.height){const N=l.find(B=>B.id===E.id);N&&(m.push(N),k||(k=A===N.id))}if(!m.length){A="";return}if(!k)return A=m[0].id,{...m[0]};for(let E=0;E<m.length;E++)if(m[E].id===A)return E===m.length-1?(A=m[0].id,{...m[0]}):(A=m[E+1].id,{...m[E+1]})},highlightMark:w,refresh(){O(o,n,e)},clear(){l=[],n.length=0,o.clearRect(0,0,i.width,i.height);const a=document.querySelectorAll(`[${u}]`);a.length&&Array.from(a).forEach(c=>{D(c,u)})},destroy(){var a;e.callback&&t.removeEventListener("mouseup",d),s&&e.scrollBy.removeEventListener("scroll",v),this.clear(),(a=i.parentElement)==null||a.remove()},destory(){var a;e.callback&&t.removeEventListener("mouseup",d),s&&e.scrollBy.removeEventListener("scroll",v),this.clear(),(a=i.parentElement)==null||a.remove()}}}C.WordMarker=I,C.default=ae,Object.defineProperties(C,{__esModule:{value:!0},[Symbol.toStringTag]:{value:"Module"}})});