@inploi/plugin-collaborate 0.0.1 → 0.0.3

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
package/README.md CHANGED
@@ -1,13 +1,13 @@
1
1
  # @inploi/plugin-collaborate
2
2
 
3
- Zero dependency plugin for enabling inploi’s Collaborate product on any website.
3
+ Plugin for enabling inploi’s Collaborate product on any website.
4
4
 
5
5
  ## Installation
6
6
 
7
7
  If you want to use it in your javascript project, you can install it via npm:
8
8
 
9
9
  ```bash
10
- npm install @inploi/plugin-collaborate
10
+ npm install @inploi/sdk @inploi/plugin-collaborate
11
11
  ```
12
12
 
13
13
  ## Usage
@@ -18,21 +18,37 @@ E.g.:
18
18
 
19
19
  ```javascript
20
20
  import { setupCollaborate } from '@inploi/plugin-collaborate';
21
+ import { initialiseSdk } from '@inploi/sdk';
22
+
23
+ const sdk = initialiseInploiSdk({
24
+ publishableKey: 'your-publishable-key',
25
+ env: 'sandbox',
26
+ });
27
+
28
+ const collaborate = sdk.register(collaboratePlugin());
21
29
 
22
30
  window.addEventListener('DOMContentLoaded', () => {
23
- setupCollaborate();
31
+ collaborate.setupBridge();
24
32
  });
25
33
  ```
26
34
 
27
35
  React:
28
36
 
29
37
  ````javascript
30
- import { setupCollaborate } from '@inploi/plugin-collaborate';
38
+ import { collaboratePlugin } from '@inploi/plugin-collaborate';
39
+ import { initialiseSdk } from '@inploi/sdk';
40
+
41
+ // somewhere in your codebase
42
+ const sdk = initialiseInploiSdk({
43
+ publishableKey: 'your-publishable-key',
44
+ env: 'sandbox',
45
+ });
46
+ const collaborate = sdk.register(collaboratePlugin());
31
47
 
32
48
  const App = () => {
33
49
  React.useEffect(() => {
34
50
  const abortController = new AbortController();
35
- setupCollaborate({signal: abortController.signal});
51
+ collaborate.setupBridge({ signal: abortController.signal });
36
52
  return () => abortController.abort();
37
53
  }, []);
38
54
 
@@ -44,7 +60,14 @@ const App = () => {
44
60
  You can also use the plugin from the CDN by adding the following script tag to your HTML:
45
61
 
46
62
  ```html
63
+ <script src="https://unpkg.com/@inploi/plugin-sdk@latest/cdn/index.js"></script>
47
64
  <script src="https://unpkg.com/@inploi/plugin-collaborate@latest/cdn/index.js"></script>
65
+ <script>
66
+ const collaborate = sdk.register(collaboratePlugin());
67
+ window.addEventListener('DOMContentLoaded', () => {
68
+ collaborate.setupBridge();
69
+ });
70
+ </script>
48
71
  ```
49
72
 
50
73
  This will already setup the plugin when the DOM is ready.
package/cdn/index.js CHANGED
@@ -1,3 +1,3 @@
1
1
  // This is an inploi sdk script. Learn more at https://inploi.com
2
2
 
3
- "use strict";(()=>{var E=Object.defineProperty;var u=Object.getOwnPropertySymbols;var y=Object.prototype.hasOwnProperty,D=Object.prototype.propertyIsEnumerable;var b=(e,t,n)=>t in e?E(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,m=(e,t)=>{for(var n in t||(t={}))y.call(t,n)&&b(e,n,t[n]);if(u)for(var n of u(t))D.call(t,n)&&b(e,n,t[n]);return e};var h=e=>{var l,i,s,c,o,r,g,I;if(((l=e.element)==null?void 0:l.getAttribute("id"))!==null&&!((i=e.id)!=null&&i.length))return e.id=`#${(s=e.element)==null?void 0:s.getAttribute("id")}`,e;if(e.element&&e.element.className.length>0&&!((c=e.classes)!=null&&c.length))return e.classes=`.${e.element.className.split(" ").join(".")}`,e;let t=[e.classes,e.id].filter(Boolean).join("")||((o=e.element)==null?void 0:o.tagName),n=(r=e.element)==null?void 0:r.parentElement;if(n){let A=Array.from(n.children).findIndex(C=>C===e.element);return{element:(g=e.element)==null?void 0:g.parentElement,children:[`${t}:nth-child(${A+1})`,...(I=e.children)!=null?I:[]]}}throw new Error("Unable to uniquely identify selector: not unique enough")},M=(e,t)=>{let n=l=>{var o;let i=h(l),s=[[i.classes,i.id].filter(Boolean).join(""),...(o=i.children)!=null?o:[]].filter(Boolean).join(">"),c=t.querySelectorAll(s);return c.length>1&&c.length<100?n(i):c.length===1?s:null};return n({element:e,children:[]})};var Z=e=>{e.preventDefault(),e.stopPropagation()},S=["mousedown","mouseup","blur","input","mouseenter","mouseleave","mouseover","pointerdown","pointerup","pointerenter","pointerleave","pointerover","pointermove","beforeinput","dblclick","focus","focusin","keydown","keypress","touchend","touchmove","touchstart","touchcancel","transitionstart","transitionend"],a=e=>{window.parent.postMessage(m({source:"inploi-collaborate"},e),"*")};var N=e=>e.data.source==="inploi-collaborate";var P="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==",w=()=>{let e="isdk-collaborate-cursor";if(document.getElementById(e))return;let t=document.createElement("style");t.id=e,t.innerHTML=`* { cursor: url(${P}) 6 2, crosshair !important; }`,document.head.appendChild(t)},d=e=>{let t=e.getBoundingClientRect();return{_brand:"pin",x:e.scrollLeft,y:e.scrollTop,width:t.width,height:t.height}},R=e=>{let t={};for(let n of e){let l=document.querySelector(n);t[n]=l?d(l):null}return t};function x(e,t){let n;return(...l)=>{clearTimeout(n),n=setTimeout(()=>e(...l),t)}}var p=e=>{var i;let t=(i=e==null?void 0:e.signal)!=null?i:new AbortController().signal,n=[];a({type:"READY"});let l=x(()=>{a({type:"SELECTOR_RECTS",selectorRects:R(n)})},50);window.addEventListener("message",s=>{if(N(s)===!1)return;let c=s.data;switch(c.type){case"WATCH_SELECTORS":{n=c.selectors,l();break}case"SETUP_EVENT_HANDLERS":w(),window.addEventListener("resize",()=>{l(),a({type:"RESIZE",scrollHeight:document.body.scrollHeight})},{signal:t}),document.body.addEventListener("mousemove",o=>{o.preventDefault(),o.stopPropagation();let r=document.elementsFromPoint(o.clientX,o.clientY)[0];a({type:"HOVER_ELEMENT",rect:r?d(r):null})},{signal:t}),document.body.addEventListener("click",o=>{o.preventDefault(),o.stopPropagation();let r=document.elementsFromPoint(o.clientX,o.clientY)[0];if(!r)return;let g=M(r,document.body);if(!g)return;let I=r.getBoundingClientRect();a({type:"DROP_PIN",pin:{rect:d(r),selector:g,xPercent:(o.clientX-I.x)/I.width,yPercent:(o.clientY-I.y)/I.height}})},{signal:t}),window.addEventListener("scroll",()=>{l(),a({type:"SCROLL",scrollY:window.scrollY,scrollX:window.scrollX})},{signal:t}),S.map(o=>document.addEventListener(o,Z,{signal:t}))}},{signal:t})};window.addEventListener("DOMContentLoaded",()=>{p()});})();
3
+ "use strict";(()=>{var C=Object.defineProperty;var p=Object.getOwnPropertySymbols;var M=Object.prototype.hasOwnProperty,A=Object.prototype.propertyIsEnumerable;var I=(e,t,n)=>t in e?C(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,m=(e,t)=>{for(var n in t||(t={}))M.call(t,n)&&I(e,n,t[n]);if(p)for(var n of p(t))A.call(t,n)&&I(e,n,t[n]);return e};var b=e=>e;var v="isdk_session";var z=new RegExp(`${v}=([^;]+)`);var P=e=>{var r,i,l,a,o,s,u,c;if(((r=e.element)==null?void 0:r.getAttribute("id"))!==null&&!((i=e.id)!=null&&i.length))return e.id=`#${(l=e.element)==null?void 0:l.getAttribute("id")}`,e;if(e.element&&e.element.className.length>0&&!((a=e.classes)!=null&&a.length))return e.classes=`.${e.element.className.split(" ").join(".")}`,e;let t=[e.classes,e.id].filter(Boolean).join("")||((o=e.element)==null?void 0:o.tagName),n=(s=e.element)==null?void 0:s.parentElement;if(n){let E=Array.from(n.children).findIndex(w=>w===e.element);return{element:(u=e.element)==null?void 0:u.parentElement,children:[`${t}:nth-child(${E+1})`,...(c=e.children)!=null?c:[]]}}throw new Error("Unable to uniquely identify selector: not unique enough")},y=(e,t)=>{let n=r=>{var o;let i=P(r),l=[[i.classes,i.id].filter(Boolean).join(""),...(o=i.children)!=null?o:[]].filter(Boolean).join(">"),a=t.querySelectorAll(l);return a.length>1&&a.length<100?n(i):a.length===1?l:null};return n({element:e,children:[]})};var S=e=>{e.preventDefault(),e.stopPropagation()},D=["mousedown","mouseup","blur","input","mouseenter","mouseleave","mouseover","pointerdown","pointerup","pointerenter","pointerleave","pointerover","pointermove","beforeinput","dblclick","focus","focusin","keydown","keypress","touchend","touchmove","touchstart","touchcancel","transitionstart","transitionend"],d=e=>{window.parent.postMessage(m({source:"inploi-collaborate"},e),"*")};var f=e=>e.data.source==="inploi-collaborate";var x="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==",N=()=>{let e="isdk-collaborate-cursor";if(document.getElementById(e))return;let t=document.createElement("style");t.id=e,t.innerHTML=`* { cursor: url(${x}) 6 2, crosshair !important; }`,document.head.appendChild(t)},g=e=>{let t=e.getBoundingClientRect();return{_brand:"pin",x:e.scrollLeft,y:e.scrollTop,width:t.width,height:t.height}},Z=e=>{let t={};for(let n of e){let r=document.querySelector(n);t[n]=r?g(r):null}return t};function R(e,t){let n;return(...r)=>{clearTimeout(n),n=setTimeout(()=>e(...r),t)}}var j=({logger:e,signal:t})=>{let n=[];d({type:"READY"}),e.info("Collaborate bridge: Ready");let r=R(()=>{d({type:"SELECTOR_RECTS",selectorRects:Z(n)})},50),i=l=>{if(f(l)===!1)return;e.info("Collaborate bridge: received ",l.data);let a=l.data;switch(a.type){case"WATCH_SELECTORS":{n=a.selectors,r();break}case"SETUP_EVENT_HANDLERS":e.info("Collaborate bridge: Setting up event handlers"),N(),window.addEventListener("resize",()=>{r(),d({type:"RESIZE",scrollHeight:document.body.scrollHeight})},{signal:t}),document.body.addEventListener("mousemove",o=>{o.preventDefault(),o.stopPropagation();let s=document.elementsFromPoint(o.clientX,o.clientY)[0];d({type:"HOVER_ELEMENT",rect:s?g(s):null})},{signal:t}),document.body.addEventListener("click",o=>{o.preventDefault(),o.stopPropagation();let s=document.elementsFromPoint(o.clientX,o.clientY)[0];if(!s)return;let u=y(s,document.body);if(!u)return;let c=s.getBoundingClientRect();d({type:"DROP_PIN",pin:{rect:g(s),selector:u,xPercent:(o.clientX-c.x)/c.width,yPercent:(o.clientY-c.y)/c.height}})},{signal:t}),window.addEventListener("scroll",()=>{r(),d({type:"SCROLL",scrollY:window.scrollY,scrollX:window.scrollX})},{signal:t}),D.map(o=>document.addEventListener(o,S,{signal:t})),e.info("Collaborate bridge: Event handlers set up")}};window.addEventListener("message",i,{signal:t}),t==null||t.addEventListener("abort",()=>{e.info("Collaborate bridge: disposing"),window.removeEventListener("message",i)})},h=()=>b(({logger:e})=>({setupBridge:t=>j({logger:e,signal:t==null?void 0:t.signal})}));if(!window.inploi)throw new Error("Please insert the SDK script tag above the plugins.");window.inploi.collaboratePlugin=h;})();
package/dist/index.d.mts CHANGED
@@ -1,3 +1,6 @@
1
+ import * as _inploi_sdk from '@inploi/sdk';
2
+ import { Logger } from '@inploi/sdk';
3
+
1
4
  type CollaborateInboundEvent = {
2
5
  type: 'SETUP_EVENT_HANDLERS';
3
6
  } | {
@@ -29,8 +32,8 @@ type DroppedPin = {
29
32
  yPercent: number;
30
33
  rect: PinRect;
31
34
  };
32
- declare const createInboundEventSender: (source: MessageEventSource) => {
33
- sendInboundEvent: (data: CollaborateInboundEvent) => void;
35
+ declare const createInboundEventSender: (e: MessageEvent) => {
36
+ sendInboundEvent: (data: CollaborateInboundEvent) => void | undefined;
34
37
  };
35
38
  declare const isCollaborateOutboundEvent: (event: MessageEvent) => event is MessageEvent<CollaborateOutboundEvent>;
36
39
  declare const PIN_CURSOR_BASE64 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==";
@@ -44,8 +47,14 @@ type PinRect = {
44
47
  type SelectorRects = {
45
48
  [selector: string]: PinRect | null;
46
49
  };
47
- declare const setupCollaborate: (params?: {
48
- signal?: AbortSignal;
49
- }) => void;
50
+ declare const collaboratePlugin: () => ({ logger }: {
51
+ apiClient: _inploi_sdk.ApiClient;
52
+ logger: Logger;
53
+ analytics: _inploi_sdk.AnalyticsService;
54
+ }) => {
55
+ setupBridge: (params?: {
56
+ signal?: AbortSignal;
57
+ }) => void;
58
+ };
50
59
 
51
- export { CollaborateInboundEvent, CollaborateOutboundEvent, DroppedPin, PIN_CURSOR_BASE64, PinRect, SelectorRects, createInboundEventSender, isCollaborateOutboundEvent, setupCollaborate };
60
+ export { CollaborateInboundEvent, CollaborateOutboundEvent, DroppedPin, PIN_CURSOR_BASE64, PinRect, SelectorRects, collaboratePlugin, createInboundEventSender, isCollaborateOutboundEvent };
package/dist/index.d.ts CHANGED
@@ -1,3 +1,6 @@
1
+ import * as _inploi_sdk from '@inploi/sdk';
2
+ import { Logger } from '@inploi/sdk';
3
+
1
4
  type CollaborateInboundEvent = {
2
5
  type: 'SETUP_EVENT_HANDLERS';
3
6
  } | {
@@ -29,8 +32,8 @@ type DroppedPin = {
29
32
  yPercent: number;
30
33
  rect: PinRect;
31
34
  };
32
- declare const createInboundEventSender: (source: MessageEventSource) => {
33
- sendInboundEvent: (data: CollaborateInboundEvent) => void;
35
+ declare const createInboundEventSender: (e: MessageEvent) => {
36
+ sendInboundEvent: (data: CollaborateInboundEvent) => void | undefined;
34
37
  };
35
38
  declare const isCollaborateOutboundEvent: (event: MessageEvent) => event is MessageEvent<CollaborateOutboundEvent>;
36
39
  declare const PIN_CURSOR_BASE64 = "data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==";
@@ -44,8 +47,14 @@ type PinRect = {
44
47
  type SelectorRects = {
45
48
  [selector: string]: PinRect | null;
46
49
  };
47
- declare const setupCollaborate: (params?: {
48
- signal?: AbortSignal;
49
- }) => void;
50
+ declare const collaboratePlugin: () => ({ logger }: {
51
+ apiClient: _inploi_sdk.ApiClient;
52
+ logger: Logger;
53
+ analytics: _inploi_sdk.AnalyticsService;
54
+ }) => {
55
+ setupBridge: (params?: {
56
+ signal?: AbortSignal;
57
+ }) => void;
58
+ };
50
59
 
51
- export { CollaborateInboundEvent, CollaborateOutboundEvent, DroppedPin, PIN_CURSOR_BASE64, PinRect, SelectorRects, createInboundEventSender, isCollaborateOutboundEvent, setupCollaborate };
60
+ export { CollaborateInboundEvent, CollaborateOutboundEvent, DroppedPin, PIN_CURSOR_BASE64, PinRect, SelectorRects, collaboratePlugin, createInboundEventSender, isCollaborateOutboundEvent };
package/dist/index.js CHANGED
@@ -1,2 +1,2 @@
1
- "use strict";var d=Object.defineProperty;var D=Object.getOwnPropertyDescriptor;var h=Object.getOwnPropertyNames,m=Object.getOwnPropertySymbols;var p=Object.prototype.hasOwnProperty,Z=Object.prototype.propertyIsEnumerable;var M=(e,t,n)=>t in e?d(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,u=(e,t)=>{for(var n in t||(t={}))p.call(t,n)&&M(e,n,t[n]);if(m)for(var n of m(t))Z.call(t,n)&&M(e,n,t[n]);return e};var S=(e,t)=>{for(var n in t)d(e,n,{get:t[n],enumerable:!0})},N=(e,t,n,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let i of h(t))!p.call(e,i)&&i!==n&&d(e,i,{get:()=>t[i],enumerable:!(l=D(t,i))||l.enumerable});return e};var P=e=>N(d({},"__esModule",{value:!0}),e);var Y={};S(Y,{PIN_CURSOR_BASE64:()=>y,createInboundEventSender:()=>j,isCollaborateOutboundEvent:()=>z,setupCollaborate:()=>V});module.exports=P(Y);var w=e=>{var l,i,s,c,o,r,a,I;if(((l=e.element)==null?void 0:l.getAttribute("id"))!==null&&!((i=e.id)!=null&&i.length))return e.id=`#${(s=e.element)==null?void 0:s.getAttribute("id")}`,e;if(e.element&&e.element.className.length>0&&!((c=e.classes)!=null&&c.length))return e.classes=`.${e.element.className.split(" ").join(".")}`,e;let t=[e.classes,e.id].filter(Boolean).join("")||((o=e.element)==null?void 0:o.tagName),n=(r=e.element)==null?void 0:r.parentElement;if(n){let E=Array.from(n.children).findIndex(C=>C===e.element);return{element:(a=e.element)==null?void 0:a.parentElement,children:[`${t}:nth-child(${E+1})`,...(I=e.children)!=null?I:[]]}}throw new Error("Unable to uniquely identify selector: not unique enough")},A=(e,t)=>{let n=l=>{var o;let i=w(l),s=[[i.classes,i.id].filter(Boolean).join(""),...(o=i.children)!=null?o:[]].filter(Boolean).join(">"),c=t.querySelectorAll(s);return c.length>1&&c.length<100?n(i):c.length===1?s:null};return n({element:e,children:[]})};var R=e=>{e.preventDefault(),e.stopPropagation()},x=["mousedown","mouseup","blur","input","mouseenter","mouseleave","mouseover","pointerdown","pointerup","pointerenter","pointerleave","pointerover","pointermove","beforeinput","dblclick","focus","focusin","keydown","keypress","touchend","touchmove","touchstart","touchcancel","transitionstart","transitionend"],g=e=>{window.parent.postMessage(u({source:"inploi-collaborate"},e),"*")},j=e=>({sendInboundEvent:t=>e.postMessage(u({source:"inploi-collaborate"},t))}),v=e=>e.data.source==="inploi-collaborate",z=e=>e.data.source==="inploi-collaborate",y="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==",T=()=>{let e="isdk-collaborate-cursor";if(document.getElementById(e))return;let t=document.createElement("style");t.id=e,t.innerHTML=`* { cursor: url(${y}) 6 2, crosshair !important; }`,document.head.appendChild(t)},b=e=>{let t=e.getBoundingClientRect();return{_brand:"pin",x:e.scrollLeft,y:e.scrollTop,width:t.width,height:t.height}},X=e=>{let t={};for(let n of e){let l=document.querySelector(n);t[n]=l?b(l):null}return t};function B(e,t){let n;return(...l)=>{clearTimeout(n),n=setTimeout(()=>e(...l),t)}}var V=e=>{var i;let t=(i=e==null?void 0:e.signal)!=null?i:new AbortController().signal,n=[];g({type:"READY"});let l=B(()=>{g({type:"SELECTOR_RECTS",selectorRects:X(n)})},50);window.addEventListener("message",s=>{if(v(s)===!1)return;let c=s.data;switch(c.type){case"WATCH_SELECTORS":{n=c.selectors,l();break}case"SETUP_EVENT_HANDLERS":T(),window.addEventListener("resize",()=>{l(),g({type:"RESIZE",scrollHeight:document.body.scrollHeight})},{signal:t}),document.body.addEventListener("mousemove",o=>{o.preventDefault(),o.stopPropagation();let r=document.elementsFromPoint(o.clientX,o.clientY)[0];g({type:"HOVER_ELEMENT",rect:r?b(r):null})},{signal:t}),document.body.addEventListener("click",o=>{o.preventDefault(),o.stopPropagation();let r=document.elementsFromPoint(o.clientX,o.clientY)[0];if(!r)return;let a=A(r,document.body);if(!a)return;let I=r.getBoundingClientRect();g({type:"DROP_PIN",pin:{rect:b(r),selector:a,xPercent:(o.clientX-I.x)/I.width,yPercent:(o.clientY-I.y)/I.height}})},{signal:t}),window.addEventListener("scroll",()=>{l(),g({type:"SCROLL",scrollY:window.scrollY,scrollX:window.scrollX})},{signal:t}),x.map(o=>document.addEventListener(o,R,{signal:t}))}},{signal:t})};0&&(module.exports={PIN_CURSOR_BASE64,createInboundEventSender,isCollaborateOutboundEvent,setupCollaborate});
1
+ "use strict";var g=Object.defineProperty;var h=Object.getOwnPropertyDescriptor;var S=Object.getOwnPropertyNames,m=Object.getOwnPropertySymbols;var M=Object.prototype.hasOwnProperty,Z=Object.prototype.propertyIsEnumerable;var p=(e,t,n)=>t in e?g(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,u=(e,t)=>{for(var n in t||(t={}))M.call(t,n)&&p(e,n,t[n]);if(m)for(var n of m(t))Z.call(t,n)&&p(e,n,t[n]);return e};var P=(e,t)=>{for(var n in t)g(e,n,{get:t[n],enumerable:!0})},N=(e,t,n,l)=>{if(t&&typeof t=="object"||typeof t=="function")for(let r of S(t))!M.call(e,r)&&r!==n&&g(e,r,{get:()=>t[r],enumerable:!(l=h(t,r))||l.enumerable});return e};var w=e=>N(g({},"__esModule",{value:!0}),e);var W={};P(W,{PIN_CURSOR_BASE64:()=>y,collaboratePlugin:()=>Y,createInboundEventSender:()=>j,isCollaborateOutboundEvent:()=>T});module.exports=w(W);var C=require("@inploi/sdk");var R=e=>{var l,r,c,s,o,i,a,I;if(((l=e.element)==null?void 0:l.getAttribute("id"))!==null&&!((r=e.id)!=null&&r.length))return e.id=`#${(c=e.element)==null?void 0:c.getAttribute("id")}`,e;if(e.element&&e.element.className.length>0&&!((s=e.classes)!=null&&s.length))return e.classes=`.${e.element.className.split(" ").join(".")}`,e;let t=[e.classes,e.id].filter(Boolean).join("")||((o=e.element)==null?void 0:o.tagName),n=(i=e.element)==null?void 0:i.parentElement;if(n){let A=Array.from(n.children).findIndex(D=>D===e.element);return{element:(a=e.element)==null?void 0:a.parentElement,children:[`${t}:nth-child(${A+1})`,...(I=e.children)!=null?I:[]]}}throw new Error("Unable to uniquely identify selector: not unique enough")},E=(e,t)=>{let n=l=>{var o;let r=R(l),c=[[r.classes,r.id].filter(Boolean).join(""),...(o=r.children)!=null?o:[]].filter(Boolean).join(">"),s=t.querySelectorAll(c);return s.length>1&&s.length<100?n(r):s.length===1?c:null};return n({element:e,children:[]})};var v=e=>{e.preventDefault(),e.stopPropagation()},x=["mousedown","mouseup","blur","input","mouseenter","mouseleave","mouseover","pointerdown","pointerup","pointerenter","pointerleave","pointerover","pointermove","beforeinput","dblclick","focus","focusin","keydown","keypress","touchend","touchmove","touchstart","touchcancel","transitionstart","transitionend"],d=e=>{window.parent.postMessage(u({source:"inploi-collaborate"},e),"*")},j=e=>({sendInboundEvent:t=>{var n;return(n=e.source)==null?void 0:n.postMessage(u({source:"inploi-collaborate"},t),{targetOrigin:e.origin})}}),z=e=>e.data.source==="inploi-collaborate",T=e=>e.data.source==="inploi-collaborate",y="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==",B=()=>{let e="isdk-collaborate-cursor";if(document.getElementById(e))return;let t=document.createElement("style");t.id=e,t.innerHTML=`* { cursor: url(${y}) 6 2, crosshair !important; }`,document.head.appendChild(t)},b=e=>{let t=e.getBoundingClientRect();return{_brand:"pin",x:e.scrollLeft,y:e.scrollTop,width:t.width,height:t.height}},X=e=>{let t={};for(let n of e){let l=document.querySelector(n);t[n]=l?b(l):null}return t};function L(e,t){let n;return(...l)=>{clearTimeout(n),n=setTimeout(()=>e(...l),t)}}var V=({logger:e,signal:t})=>{let n=[];d({type:"READY"}),e.info("Collaborate bridge: Ready");let l=L(()=>{d({type:"SELECTOR_RECTS",selectorRects:X(n)})},50),r=c=>{if(z(c)===!1)return;e.info("Collaborate bridge: received ",c.data);let s=c.data;switch(s.type){case"WATCH_SELECTORS":{n=s.selectors,l();break}case"SETUP_EVENT_HANDLERS":e.info("Collaborate bridge: Setting up event handlers"),B(),window.addEventListener("resize",()=>{l(),d({type:"RESIZE",scrollHeight:document.body.scrollHeight})},{signal:t}),document.body.addEventListener("mousemove",o=>{o.preventDefault(),o.stopPropagation();let i=document.elementsFromPoint(o.clientX,o.clientY)[0];d({type:"HOVER_ELEMENT",rect:i?b(i):null})},{signal:t}),document.body.addEventListener("click",o=>{o.preventDefault(),o.stopPropagation();let i=document.elementsFromPoint(o.clientX,o.clientY)[0];if(!i)return;let a=E(i,document.body);if(!a)return;let I=i.getBoundingClientRect();d({type:"DROP_PIN",pin:{rect:b(i),selector:a,xPercent:(o.clientX-I.x)/I.width,yPercent:(o.clientY-I.y)/I.height}})},{signal:t}),window.addEventListener("scroll",()=>{l(),d({type:"SCROLL",scrollY:window.scrollY,scrollX:window.scrollX})},{signal:t}),x.map(o=>document.addEventListener(o,v,{signal:t})),e.info("Collaborate bridge: Event handlers set up")}};window.addEventListener("message",r,{signal:t}),t==null||t.addEventListener("abort",()=>{e.info("Collaborate bridge: disposing"),window.removeEventListener("message",r)})},Y=()=>(0,C.createPlugin)(({logger:e})=>({setupBridge:t=>V({logger:e,signal:t==null?void 0:t.signal})}));0&&(module.exports={PIN_CURSOR_BASE64,collaboratePlugin,createInboundEventSender,isCollaborateOutboundEvent});
2
2
  //# sourceMappingURL=index.js.map
package/dist/index.js.map CHANGED
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/index.ts","../src/collaborate.selector.ts","../src/collaborate.ts"],"sourcesContent":["export * from './collaborate';\n","type SelectorProperties = {\n\telement: Element | null | undefined;\n\tid?: string;\n\tclasses?: string;\n\tchildren?: string[];\n};\n\nconst getSelectorProperties = (from: SelectorProperties): SelectorProperties => {\n\tif (from.element?.getAttribute('id') !== null && !from.id?.length) {\n\t\tfrom.id = `#${from.element?.getAttribute('id')}`;\n\t\treturn from;\n\t}\n\n\tif (from.element && from.element.className.length > 0 && !from.classes?.length) {\n\t\tfrom.classes = `.${from.element.className.split(' ').join('.')}`;\n\t\treturn from;\n\t}\n\n\tconst newSelector = [from.classes, from.id].filter(Boolean).join('') || from.element?.tagName;\n\n\tconst parent = from.element?.parentElement;\n\tif (parent) {\n\t\tconst childIndex = Array.from(parent.children).findIndex(child => child === from.element);\n\t\treturn {\n\t\t\telement: from.element?.parentElement,\n\t\t\tchildren: [`${newSelector}:nth-child(${childIndex + 1})`, ...(from.children ?? [])],\n\t\t};\n\t}\n\tthrow new Error('Unable to uniquely identify selector: not unique enough');\n};\n\nexport const getElementUniqueSelector = (element: Element, context: Element) => {\n\tconst getSelector = (prefilled: SelectorProperties): string | null => {\n\t\tconst properties = getSelectorProperties(prefilled);\n\n\t\tconst newSelector = [[properties.classes, properties.id].filter(Boolean).join(''), ...(properties.children ?? [])]\n\t\t\t.filter(Boolean)\n\t\t\t.join('>');\n\n\t\tconst matchingSelectors = context.querySelectorAll(newSelector);\n\n\t\tif (matchingSelectors.length > 1 && matchingSelectors.length < 100) return getSelector(properties);\n\t\tif (matchingSelectors.length === 1) return newSelector;\n\n\t\treturn null;\n\t};\n\n\treturn getSelector({ element, children: [] });\n};\n","import { getElementUniqueSelector } from './collaborate.selector';\n\nconst preventIt = (e: Event) => {\n\te.preventDefault();\n\te.stopPropagation();\n};\n\nconst eventsToPrevent: (keyof HTMLElementEventMap)[] = [\n\t'mousedown',\n\t'mouseup',\n\t'blur',\n\t'input',\n\t'mouseenter',\n\t'mouseleave',\n\t'mouseover',\n\t'pointerdown',\n\t'pointerup',\n\t'pointerenter',\n\t'pointerleave',\n\t'pointerover',\n\t'pointermove',\n\t'beforeinput',\n\t'dblclick',\n\t'focus',\n\t'focusin',\n\t'keydown',\n\t'keypress',\n\t'touchend',\n\t'touchmove',\n\t'touchstart',\n\t'touchcancel',\n\t'transitionstart',\n\t'transitionend',\n];\n\nexport type CollaborateInboundEvent =\n\t| {\n\t\t\ttype: 'SETUP_EVENT_HANDLERS';\n\t }\n\t| { type: 'WATCH_SELECTORS'; selectors: string[] };\n\nexport type CollaborateOutboundEvent =\n\t| { type: 'READY' }\n\t| {\n\t\t\ttype: 'RESIZE';\n\t\t\tscrollHeight: number;\n\t }\n\t| { type: 'SCROLL'; scrollY: number; scrollX: number }\n\t| {\n\t\t\ttype: 'HOVER_ELEMENT';\n\t\t\trect: PinRect | null;\n\t }\n\t| {\n\t\t\ttype: 'DROP_PIN';\n\t\t\tpin: DroppedPin;\n\t }\n\t| {\n\t\t\ttype: 'SELECTOR_RECTS';\n\t\t\tselectorRects: SelectorRects;\n\t };\n\nexport type DroppedPin = { selector: string; xPercent: number; yPercent: number; rect: PinRect };\n\nconst sendOutboundEvent = (data: CollaborateOutboundEvent) => {\n\twindow.parent.postMessage({ source: 'inploi-collaborate', ...data }, '*');\n};\n\nexport const createInboundEventSender = (source: MessageEventSource) => {\n\treturn {\n\t\tsendInboundEvent: (data: CollaborateInboundEvent) => source.postMessage({ source: 'inploi-collaborate', ...data }),\n\t};\n};\n\nconst isCollaborateInboundEvent = (event: MessageEvent): event is MessageEvent<CollaborateInboundEvent> => {\n\treturn event.data.source === 'inploi-collaborate';\n};\n\nexport const isCollaborateOutboundEvent = (event: MessageEvent): event is MessageEvent<CollaborateOutboundEvent> => {\n\treturn event.data.source === 'inploi-collaborate';\n};\n\nexport const PIN_CURSOR_BASE64 =\n\t'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==';\n\nconst setCursor = () => {\n\tconst id = 'isdk-collaborate-cursor';\n\tif (document.getElementById(id)) return;\n\tconst style = document.createElement('style');\n\tstyle.id = id;\n\tstyle.innerHTML = `* { cursor: url(${PIN_CURSOR_BASE64}) 6 2, crosshair !important; }`;\n\tdocument.head.appendChild(style);\n};\n\nexport type PinRect = {\n\t_brand: 'pin';\n\tx: number;\n\ty: number;\n\twidth: number;\n\theight: number;\n};\n\nconst getElementPinRect = (element: Element): PinRect => {\n\tconst boundingBox = element.getBoundingClientRect();\n\treturn {\n\t\t_brand: 'pin',\n\t\tx: element.scrollLeft,\n\t\ty: element.scrollTop,\n\t\twidth: boundingBox.width,\n\t\theight: boundingBox.height,\n\t};\n};\n\nexport type SelectorRects = { [selector: string]: PinRect | null };\n\nconst getSelectorRects = (selectors: string[]) => {\n\tconst selectorRects: SelectorRects = {};\n\tfor (const selector of selectors) {\n\t\tconst element = document.querySelector(selector);\n\t\tselectorRects[selector] = element ? getElementPinRect(element) : null;\n\t}\n\treturn selectorRects;\n};\n\nfunction debounce<F extends (...args: Parameters<F>) => ReturnType<F>>(\n\tfunc: F,\n\twaitFor: number,\n): (...args: Parameters<F>) => void {\n\tlet timeout: ReturnType<typeof setTimeout>;\n\n\treturn (...args: Parameters<F>): void => {\n\t\tclearTimeout(timeout);\n\t\ttimeout = setTimeout(() => func(...args), waitFor);\n\t};\n}\n\nexport const setupCollaborate = (params?: { signal?: AbortSignal }) => {\n\tconst signal = params?.signal ?? new AbortController().signal;\n\n\tlet watchedSelectors: string[] = [];\n\tsendOutboundEvent({ type: 'READY' });\n\tconst broadcastSelectors = debounce(() => {\n\t\tsendOutboundEvent({ type: 'SELECTOR_RECTS', selectorRects: getSelectorRects(watchedSelectors) });\n\t}, 50);\n\n\twindow.addEventListener(\n\t\t'message',\n\t\tmessageEvent => {\n\t\t\tif (isCollaborateInboundEvent(messageEvent) === false) return;\n\t\t\tconst collaborateEvent = messageEvent.data;\n\t\t\tswitch (collaborateEvent.type) {\n\t\t\t\tcase 'WATCH_SELECTORS': {\n\t\t\t\t\twatchedSelectors = collaborateEvent.selectors;\n\t\t\t\t\tbroadcastSelectors();\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase 'SETUP_EVENT_HANDLERS': {\n\t\t\t\t\tsetCursor();\n\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t'resize',\n\t\t\t\t\t\t() => {\n\t\t\t\t\t\t\tbroadcastSelectors();\n\t\t\t\t\t\t\tsendOutboundEvent({ type: 'RESIZE', scrollHeight: document.body.scrollHeight });\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{ signal },\n\t\t\t\t\t);\n\t\t\t\t\tdocument.body.addEventListener(\n\t\t\t\t\t\t'mousemove',\n\t\t\t\t\t\tevent => {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\tconst hoveredElement = document.elementsFromPoint(event.clientX, event.clientY)[0];\n\t\t\t\t\t\t\tsendOutboundEvent({\n\t\t\t\t\t\t\t\ttype: 'HOVER_ELEMENT',\n\t\t\t\t\t\t\t\trect: hoveredElement ? getElementPinRect(hoveredElement) : null,\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{ signal },\n\t\t\t\t\t);\n\t\t\t\t\tdocument.body.addEventListener(\n\t\t\t\t\t\t'click',\n\t\t\t\t\t\tevent => {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\tconst hoveredElement = document.elementsFromPoint(event.clientX, event.clientY)[0];\n\t\t\t\t\t\t\tif (!hoveredElement) return;\n\t\t\t\t\t\t\tconst selector = getElementUniqueSelector(hoveredElement, document.body);\n\t\t\t\t\t\t\tif (!selector) return;\n\t\t\t\t\t\t\tconst rect = hoveredElement.getBoundingClientRect();\n\t\t\t\t\t\t\tsendOutboundEvent({\n\t\t\t\t\t\t\t\ttype: 'DROP_PIN',\n\t\t\t\t\t\t\t\tpin: {\n\t\t\t\t\t\t\t\t\trect: getElementPinRect(hoveredElement),\n\t\t\t\t\t\t\t\t\tselector,\n\t\t\t\t\t\t\t\t\txPercent: (event.clientX - rect.x) / rect.width,\n\t\t\t\t\t\t\t\t\tyPercent: (event.clientY - rect.y) / rect.height,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{ signal },\n\t\t\t\t\t);\n\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t'scroll',\n\t\t\t\t\t\t() => {\n\t\t\t\t\t\t\tbroadcastSelectors();\n\t\t\t\t\t\t\tsendOutboundEvent({ type: 'SCROLL', scrollY: window.scrollY, scrollX: window.scrollX });\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{ signal },\n\t\t\t\t\t);\n\t\t\t\t\teventsToPrevent.map(type => document.addEventListener(type, preventIt, { signal }));\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t{ signal },\n\t);\n};\n"],"mappings":"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","names":["src_exports","__export","PIN_CURSOR_BASE64","createInboundEventSender","isCollaborateOutboundEvent","setupCollaborate","__toCommonJS","getSelectorProperties","from","_a","_b","_c","_d","_e","_f","_g","_h","newSelector","parent","childIndex","child","getElementUniqueSelector","element","context","getSelector","prefilled","properties","matchingSelectors","preventIt","eventsToPrevent","sendOutboundEvent","data","__spreadValues","createInboundEventSender","source","isCollaborateInboundEvent","event","isCollaborateOutboundEvent","PIN_CURSOR_BASE64","setCursor","id","style","getElementPinRect","element","boundingBox","getSelectorRects","selectors","selectorRects","selector","debounce","func","waitFor","timeout","args","setupCollaborate","params","_a","signal","watchedSelectors","broadcastSelectors","messageEvent","collaborateEvent","hoveredElement","getElementUniqueSelector","rect","type"]}
1
+ {"version":3,"sources":["../src/index.ts","../src/collaborate.ts","../src/collaborate.selector.ts"],"sourcesContent":["export * from './collaborate';\n","import { Logger, createPlugin } from '@inploi/sdk';\n\nimport { getElementUniqueSelector } from './collaborate.selector';\n\nconst preventIt = (e: Event) => {\n\te.preventDefault();\n\te.stopPropagation();\n};\n\nconst eventsToPrevent: (keyof HTMLElementEventMap)[] = [\n\t'mousedown',\n\t'mouseup',\n\t'blur',\n\t'input',\n\t'mouseenter',\n\t'mouseleave',\n\t'mouseover',\n\t'pointerdown',\n\t'pointerup',\n\t'pointerenter',\n\t'pointerleave',\n\t'pointerover',\n\t'pointermove',\n\t'beforeinput',\n\t'dblclick',\n\t'focus',\n\t'focusin',\n\t'keydown',\n\t'keypress',\n\t'touchend',\n\t'touchmove',\n\t'touchstart',\n\t'touchcancel',\n\t'transitionstart',\n\t'transitionend',\n];\n\nexport type CollaborateInboundEvent =\n\t| {\n\t\t\ttype: 'SETUP_EVENT_HANDLERS';\n\t }\n\t| { type: 'WATCH_SELECTORS'; selectors: string[] };\n\nexport type CollaborateOutboundEvent =\n\t| { type: 'READY' }\n\t| {\n\t\t\ttype: 'RESIZE';\n\t\t\tscrollHeight: number;\n\t }\n\t| { type: 'SCROLL'; scrollY: number; scrollX: number }\n\t| {\n\t\t\ttype: 'HOVER_ELEMENT';\n\t\t\trect: PinRect | null;\n\t }\n\t| {\n\t\t\ttype: 'DROP_PIN';\n\t\t\tpin: DroppedPin;\n\t }\n\t| {\n\t\t\ttype: 'SELECTOR_RECTS';\n\t\t\tselectorRects: SelectorRects;\n\t };\n\nexport type DroppedPin = { selector: string; xPercent: number; yPercent: number; rect: PinRect };\n\nconst sendOutboundEvent = (data: CollaborateOutboundEvent) => {\n\twindow.parent.postMessage({ source: 'inploi-collaborate', ...data }, '*');\n};\n\nexport const createInboundEventSender = (e: MessageEvent) => {\n\treturn {\n\t\tsendInboundEvent: (data: CollaborateInboundEvent) =>\n\t\t\te.source?.postMessage({ source: 'inploi-collaborate', ...data }, { targetOrigin: e.origin }),\n\t};\n};\n\nconst isCollaborateInboundEvent = (event: MessageEvent): event is MessageEvent<CollaborateInboundEvent> => {\n\treturn event.data.source === 'inploi-collaborate';\n};\n\nexport const isCollaborateOutboundEvent = (event: MessageEvent): event is MessageEvent<CollaborateOutboundEvent> => {\n\treturn event.data.source === 'inploi-collaborate';\n};\n\nexport const PIN_CURSOR_BASE64 =\n\t'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==';\n\nconst setCursor = () => {\n\tconst id = 'isdk-collaborate-cursor';\n\tif (document.getElementById(id)) return;\n\tconst style = document.createElement('style');\n\tstyle.id = id;\n\tstyle.innerHTML = `* { cursor: url(${PIN_CURSOR_BASE64}) 6 2, crosshair !important; }`;\n\tdocument.head.appendChild(style);\n};\n\nexport type PinRect = {\n\t_brand: 'pin';\n\tx: number;\n\ty: number;\n\twidth: number;\n\theight: number;\n};\n\nconst getElementPinRect = (element: Element): PinRect => {\n\tconst boundingBox = element.getBoundingClientRect();\n\treturn {\n\t\t_brand: 'pin',\n\t\tx: element.scrollLeft,\n\t\ty: element.scrollTop,\n\t\twidth: boundingBox.width,\n\t\theight: boundingBox.height,\n\t};\n};\n\nexport type SelectorRects = { [selector: string]: PinRect | null };\n\nconst getSelectorRects = (selectors: string[]) => {\n\tconst selectorRects: SelectorRects = {};\n\tfor (const selector of selectors) {\n\t\tconst element = document.querySelector(selector);\n\t\tselectorRects[selector] = element ? getElementPinRect(element) : null;\n\t}\n\treturn selectorRects;\n};\n\nfunction debounce<F extends (...args: Parameters<F>) => ReturnType<F>>(\n\tfunc: F,\n\twaitFor: number,\n): (...args: Parameters<F>) => void {\n\tlet timeout: ReturnType<typeof setTimeout>;\n\n\treturn (...args: Parameters<F>): void => {\n\t\tclearTimeout(timeout);\n\t\ttimeout = setTimeout(() => func(...args), waitFor);\n\t};\n}\n\n/** Sets up the bridge for Collaborate to be able to communicate with the host page */\nconst setupBridge = ({ logger, signal }: { signal?: AbortSignal; logger: Logger }) => {\n\tlet watchedSelectors: string[] = [];\n\tsendOutboundEvent({ type: 'READY' });\n\tlogger.info('Collaborate bridge: Ready');\n\tconst broadcastSelectors = debounce(() => {\n\t\tsendOutboundEvent({ type: 'SELECTOR_RECTS', selectorRects: getSelectorRects(watchedSelectors) });\n\t}, 50);\n\n\tconst handleEvent = (messageEvent: MessageEvent) => {\n\t\tif (isCollaborateInboundEvent(messageEvent) === false) return;\n\t\tlogger.info('Collaborate bridge: received ', messageEvent.data);\n\t\tconst collaborateEvent = messageEvent.data;\n\t\tswitch (collaborateEvent.type) {\n\t\t\tcase 'WATCH_SELECTORS': {\n\t\t\t\twatchedSelectors = collaborateEvent.selectors;\n\t\t\t\tbroadcastSelectors();\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tcase 'SETUP_EVENT_HANDLERS': {\n\t\t\t\tlogger.info('Collaborate bridge: Setting up event handlers');\n\t\t\t\tsetCursor();\n\t\t\t\twindow.addEventListener(\n\t\t\t\t\t'resize',\n\t\t\t\t\t() => {\n\t\t\t\t\t\tbroadcastSelectors();\n\t\t\t\t\t\tsendOutboundEvent({ type: 'RESIZE', scrollHeight: document.body.scrollHeight });\n\t\t\t\t\t},\n\t\t\t\t\t{ signal },\n\t\t\t\t);\n\t\t\t\tdocument.body.addEventListener(\n\t\t\t\t\t'mousemove',\n\t\t\t\t\tevent => {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tconst hoveredElement = document.elementsFromPoint(event.clientX, event.clientY)[0];\n\t\t\t\t\t\tsendOutboundEvent({\n\t\t\t\t\t\t\ttype: 'HOVER_ELEMENT',\n\t\t\t\t\t\t\trect: hoveredElement ? getElementPinRect(hoveredElement) : null,\n\t\t\t\t\t\t});\n\t\t\t\t\t},\n\t\t\t\t\t{ signal },\n\t\t\t\t);\n\t\t\t\tdocument.body.addEventListener(\n\t\t\t\t\t'click',\n\t\t\t\t\tevent => {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tconst hoveredElement = document.elementsFromPoint(event.clientX, event.clientY)[0];\n\t\t\t\t\t\tif (!hoveredElement) return;\n\t\t\t\t\t\tconst selector = getElementUniqueSelector(hoveredElement, document.body);\n\t\t\t\t\t\tif (!selector) return;\n\t\t\t\t\t\tconst rect = hoveredElement.getBoundingClientRect();\n\t\t\t\t\t\tsendOutboundEvent({\n\t\t\t\t\t\t\ttype: 'DROP_PIN',\n\t\t\t\t\t\t\tpin: {\n\t\t\t\t\t\t\t\trect: getElementPinRect(hoveredElement),\n\t\t\t\t\t\t\t\tselector,\n\t\t\t\t\t\t\t\txPercent: (event.clientX - rect.x) / rect.width,\n\t\t\t\t\t\t\t\tyPercent: (event.clientY - rect.y) / rect.height,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t});\n\t\t\t\t\t},\n\t\t\t\t\t{ signal },\n\t\t\t\t);\n\t\t\t\twindow.addEventListener(\n\t\t\t\t\t'scroll',\n\t\t\t\t\t() => {\n\t\t\t\t\t\tbroadcastSelectors();\n\t\t\t\t\t\tsendOutboundEvent({ type: 'SCROLL', scrollY: window.scrollY, scrollX: window.scrollX });\n\t\t\t\t\t},\n\t\t\t\t\t{ signal },\n\t\t\t\t);\n\t\t\t\teventsToPrevent.map(type => document.addEventListener(type, preventIt, { signal }));\n\t\t\t\tlogger.info('Collaborate bridge: Event handlers set up');\n\t\t\t}\n\t\t}\n\t};\n\n\twindow.addEventListener('message', handleEvent, { signal });\n\tsignal?.addEventListener('abort', () => {\n\t\tlogger.info('Collaborate bridge: disposing');\n\t\twindow.removeEventListener('message', handleEvent);\n\t});\n};\n\nexport const collaboratePlugin = () =>\n\tcreatePlugin(({ logger }) => ({\n\t\tsetupBridge: (params?: { signal?: AbortSignal }) =>\n\t\t\tsetupBridge({\n\t\t\t\tlogger,\n\t\t\t\tsignal: params?.signal,\n\t\t\t}),\n\t}));\n","type SelectorProperties = {\n\telement: Element | null | undefined;\n\tid?: string;\n\tclasses?: string;\n\tchildren?: string[];\n};\n\nconst getSelectorProperties = (from: SelectorProperties): SelectorProperties => {\n\tif (from.element?.getAttribute('id') !== null && !from.id?.length) {\n\t\tfrom.id = `#${from.element?.getAttribute('id')}`;\n\t\treturn from;\n\t}\n\n\tif (from.element && from.element.className.length > 0 && !from.classes?.length) {\n\t\tfrom.classes = `.${from.element.className.split(' ').join('.')}`;\n\t\treturn from;\n\t}\n\n\tconst newSelector = [from.classes, from.id].filter(Boolean).join('') || from.element?.tagName;\n\n\tconst parent = from.element?.parentElement;\n\tif (parent) {\n\t\tconst childIndex = Array.from(parent.children).findIndex(child => child === from.element);\n\t\treturn {\n\t\t\telement: from.element?.parentElement,\n\t\t\tchildren: [`${newSelector}:nth-child(${childIndex + 1})`, ...(from.children ?? [])],\n\t\t};\n\t}\n\tthrow new Error('Unable to uniquely identify selector: not unique enough');\n};\n\nexport const getElementUniqueSelector = (element: Element, context: Element) => {\n\tconst getSelector = (prefilled: SelectorProperties): string | null => {\n\t\tconst properties = getSelectorProperties(prefilled);\n\n\t\tconst newSelector = [[properties.classes, properties.id].filter(Boolean).join(''), ...(properties.children ?? [])]\n\t\t\t.filter(Boolean)\n\t\t\t.join('>');\n\n\t\tconst matchingSelectors = context.querySelectorAll(newSelector);\n\n\t\tif (matchingSelectors.length > 1 && matchingSelectors.length < 100) return getSelector(properties);\n\t\tif (matchingSelectors.length === 1) return newSelector;\n\n\t\treturn null;\n\t};\n\n\treturn getSelector({ element, children: [] });\n};\n"],"mappings":"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","names":["src_exports","__export","PIN_CURSOR_BASE64","collaboratePlugin","createInboundEventSender","isCollaborateOutboundEvent","__toCommonJS","import_sdk","getSelectorProperties","from","_a","_b","_c","_d","_e","_f","_g","_h","newSelector","parent","childIndex","child","getElementUniqueSelector","element","context","getSelector","prefilled","properties","matchingSelectors","preventIt","eventsToPrevent","sendOutboundEvent","data","__spreadValues","createInboundEventSender","_a","isCollaborateInboundEvent","event","isCollaborateOutboundEvent","PIN_CURSOR_BASE64","setCursor","id","style","getElementPinRect","element","boundingBox","getSelectorRects","selectors","selectorRects","selector","debounce","func","waitFor","timeout","args","setupBridge","logger","signal","watchedSelectors","broadcastSelectors","handleEvent","messageEvent","collaborateEvent","hoveredElement","getElementUniqueSelector","rect","type","collaboratePlugin","params"]}
package/dist/index.mjs CHANGED
@@ -1,2 +1,2 @@
1
- var y=Object.defineProperty;var b=Object.getOwnPropertySymbols;var E=Object.prototype.hasOwnProperty,C=Object.prototype.propertyIsEnumerable;var m=(e,t,n)=>t in e?y(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,d=(e,t)=>{for(var n in t||(t={}))E.call(t,n)&&m(e,n,t[n]);if(b)for(var n of b(t))C.call(t,n)&&m(e,n,t[n]);return e};var D=e=>{var l,i,s,c,o,r,a,I;if(((l=e.element)==null?void 0:l.getAttribute("id"))!==null&&!((i=e.id)!=null&&i.length))return e.id=`#${(s=e.element)==null?void 0:s.getAttribute("id")}`,e;if(e.element&&e.element.className.length>0&&!((c=e.classes)!=null&&c.length))return e.classes=`.${e.element.className.split(" ").join(".")}`,e;let t=[e.classes,e.id].filter(Boolean).join("")||((o=e.element)==null?void 0:o.tagName),n=(r=e.element)==null?void 0:r.parentElement;if(n){let p=Array.from(n.children).findIndex(A=>A===e.element);return{element:(a=e.element)==null?void 0:a.parentElement,children:[`${t}:nth-child(${p+1})`,...(I=e.children)!=null?I:[]]}}throw new Error("Unable to uniquely identify selector: not unique enough")},M=(e,t)=>{let n=l=>{var o;let i=D(l),s=[[i.classes,i.id].filter(Boolean).join(""),...(o=i.children)!=null?o:[]].filter(Boolean).join(">"),c=t.querySelectorAll(s);return c.length>1&&c.length<100?n(i):c.length===1?s:null};return n({element:e,children:[]})};var h=e=>{e.preventDefault(),e.stopPropagation()},Z=["mousedown","mouseup","blur","input","mouseenter","mouseleave","mouseover","pointerdown","pointerup","pointerenter","pointerleave","pointerover","pointermove","beforeinput","dblclick","focus","focusin","keydown","keypress","touchend","touchmove","touchstart","touchcancel","transitionstart","transitionend"],g=e=>{window.parent.postMessage(d({source:"inploi-collaborate"},e),"*")},z=e=>({sendInboundEvent:t=>e.postMessage(d({source:"inploi-collaborate"},t))}),S=e=>e.data.source==="inploi-collaborate",T=e=>e.data.source==="inploi-collaborate",N="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==",P=()=>{let e="isdk-collaborate-cursor";if(document.getElementById(e))return;let t=document.createElement("style");t.id=e,t.innerHTML=`* { cursor: url(${N}) 6 2, crosshair !important; }`,document.head.appendChild(t)},u=e=>{let t=e.getBoundingClientRect();return{_brand:"pin",x:e.scrollLeft,y:e.scrollTop,width:t.width,height:t.height}},w=e=>{let t={};for(let n of e){let l=document.querySelector(n);t[n]=l?u(l):null}return t};function R(e,t){let n;return(...l)=>{clearTimeout(n),n=setTimeout(()=>e(...l),t)}}var X=e=>{var i;let t=(i=e==null?void 0:e.signal)!=null?i:new AbortController().signal,n=[];g({type:"READY"});let l=R(()=>{g({type:"SELECTOR_RECTS",selectorRects:w(n)})},50);window.addEventListener("message",s=>{if(S(s)===!1)return;let c=s.data;switch(c.type){case"WATCH_SELECTORS":{n=c.selectors,l();break}case"SETUP_EVENT_HANDLERS":P(),window.addEventListener("resize",()=>{l(),g({type:"RESIZE",scrollHeight:document.body.scrollHeight})},{signal:t}),document.body.addEventListener("mousemove",o=>{o.preventDefault(),o.stopPropagation();let r=document.elementsFromPoint(o.clientX,o.clientY)[0];g({type:"HOVER_ELEMENT",rect:r?u(r):null})},{signal:t}),document.body.addEventListener("click",o=>{o.preventDefault(),o.stopPropagation();let r=document.elementsFromPoint(o.clientX,o.clientY)[0];if(!r)return;let a=M(r,document.body);if(!a)return;let I=r.getBoundingClientRect();g({type:"DROP_PIN",pin:{rect:u(r),selector:a,xPercent:(o.clientX-I.x)/I.width,yPercent:(o.clientY-I.y)/I.height}})},{signal:t}),window.addEventListener("scroll",()=>{l(),g({type:"SCROLL",scrollY:window.scrollY,scrollX:window.scrollX})},{signal:t}),Z.map(o=>document.addEventListener(o,h,{signal:t}))}},{signal:t})};export{N as PIN_CURSOR_BASE64,z as createInboundEventSender,T as isCollaborateOutboundEvent,X as setupCollaborate};
1
+ var C=Object.defineProperty;var b=Object.getOwnPropertySymbols;var y=Object.prototype.hasOwnProperty,A=Object.prototype.propertyIsEnumerable;var m=(e,t,n)=>t in e?C(e,t,{enumerable:!0,configurable:!0,writable:!0,value:n}):e[t]=n,g=(e,t)=>{for(var n in t||(t={}))y.call(t,n)&&m(e,n,t[n]);if(b)for(var n of b(t))A.call(t,n)&&m(e,n,t[n]);return e};import{createPlugin as h}from"@inploi/sdk";var D=e=>{var l,r,c,s,o,i,a,I;if(((l=e.element)==null?void 0:l.getAttribute("id"))!==null&&!((r=e.id)!=null&&r.length))return e.id=`#${(c=e.element)==null?void 0:c.getAttribute("id")}`,e;if(e.element&&e.element.className.length>0&&!((s=e.classes)!=null&&s.length))return e.classes=`.${e.element.className.split(" ").join(".")}`,e;let t=[e.classes,e.id].filter(Boolean).join("")||((o=e.element)==null?void 0:o.tagName),n=(i=e.element)==null?void 0:i.parentElement;if(n){let M=Array.from(n.children).findIndex(E=>E===e.element);return{element:(a=e.element)==null?void 0:a.parentElement,children:[`${t}:nth-child(${M+1})`,...(I=e.children)!=null?I:[]]}}throw new Error("Unable to uniquely identify selector: not unique enough")},p=(e,t)=>{let n=l=>{var o;let r=D(l),c=[[r.classes,r.id].filter(Boolean).join(""),...(o=r.children)!=null?o:[]].filter(Boolean).join(">"),s=t.querySelectorAll(c);return s.length>1&&s.length<100?n(r):s.length===1?c:null};return n({element:e,children:[]})};var S=e=>{e.preventDefault(),e.stopPropagation()},Z=["mousedown","mouseup","blur","input","mouseenter","mouseleave","mouseover","pointerdown","pointerup","pointerenter","pointerleave","pointerover","pointermove","beforeinput","dblclick","focus","focusin","keydown","keypress","touchend","touchmove","touchstart","touchcancel","transitionstart","transitionend"],d=e=>{window.parent.postMessage(g({source:"inploi-collaborate"},e),"*")},L=e=>({sendInboundEvent:t=>{var n;return(n=e.source)==null?void 0:n.postMessage(g({source:"inploi-collaborate"},t),{targetOrigin:e.origin})}}),P=e=>e.data.source==="inploi-collaborate",V=e=>e.data.source==="inploi-collaborate",N="data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==",w=()=>{let e="isdk-collaborate-cursor";if(document.getElementById(e))return;let t=document.createElement("style");t.id=e,t.innerHTML=`* { cursor: url(${N}) 6 2, crosshair !important; }`,document.head.appendChild(t)},u=e=>{let t=e.getBoundingClientRect();return{_brand:"pin",x:e.scrollLeft,y:e.scrollTop,width:t.width,height:t.height}},R=e=>{let t={};for(let n of e){let l=document.querySelector(n);t[n]=l?u(l):null}return t};function v(e,t){let n;return(...l)=>{clearTimeout(n),n=setTimeout(()=>e(...l),t)}}var x=({logger:e,signal:t})=>{let n=[];d({type:"READY"}),e.info("Collaborate bridge: Ready");let l=v(()=>{d({type:"SELECTOR_RECTS",selectorRects:R(n)})},50),r=c=>{if(P(c)===!1)return;e.info("Collaborate bridge: received ",c.data);let s=c.data;switch(s.type){case"WATCH_SELECTORS":{n=s.selectors,l();break}case"SETUP_EVENT_HANDLERS":e.info("Collaborate bridge: Setting up event handlers"),w(),window.addEventListener("resize",()=>{l(),d({type:"RESIZE",scrollHeight:document.body.scrollHeight})},{signal:t}),document.body.addEventListener("mousemove",o=>{o.preventDefault(),o.stopPropagation();let i=document.elementsFromPoint(o.clientX,o.clientY)[0];d({type:"HOVER_ELEMENT",rect:i?u(i):null})},{signal:t}),document.body.addEventListener("click",o=>{o.preventDefault(),o.stopPropagation();let i=document.elementsFromPoint(o.clientX,o.clientY)[0];if(!i)return;let a=p(i,document.body);if(!a)return;let I=i.getBoundingClientRect();d({type:"DROP_PIN",pin:{rect:u(i),selector:a,xPercent:(o.clientX-I.x)/I.width,yPercent:(o.clientY-I.y)/I.height}})},{signal:t}),window.addEventListener("scroll",()=>{l(),d({type:"SCROLL",scrollY:window.scrollY,scrollX:window.scrollX})},{signal:t}),Z.map(o=>document.addEventListener(o,S,{signal:t})),e.info("Collaborate bridge: Event handlers set up")}};window.addEventListener("message",r,{signal:t}),t==null||t.addEventListener("abort",()=>{e.info("Collaborate bridge: disposing"),window.removeEventListener("message",r)})},Y=()=>h(({logger:e})=>({setupBridge:t=>x({logger:e,signal:t==null?void 0:t.signal})}));export{N as PIN_CURSOR_BASE64,Y as collaboratePlugin,L as createInboundEventSender,V as isCollaborateOutboundEvent};
2
2
  //# sourceMappingURL=index.mjs.map
@@ -1 +1 @@
1
- {"version":3,"sources":["../src/collaborate.selector.ts","../src/collaborate.ts"],"sourcesContent":["type SelectorProperties = {\n\telement: Element | null | undefined;\n\tid?: string;\n\tclasses?: string;\n\tchildren?: string[];\n};\n\nconst getSelectorProperties = (from: SelectorProperties): SelectorProperties => {\n\tif (from.element?.getAttribute('id') !== null && !from.id?.length) {\n\t\tfrom.id = `#${from.element?.getAttribute('id')}`;\n\t\treturn from;\n\t}\n\n\tif (from.element && from.element.className.length > 0 && !from.classes?.length) {\n\t\tfrom.classes = `.${from.element.className.split(' ').join('.')}`;\n\t\treturn from;\n\t}\n\n\tconst newSelector = [from.classes, from.id].filter(Boolean).join('') || from.element?.tagName;\n\n\tconst parent = from.element?.parentElement;\n\tif (parent) {\n\t\tconst childIndex = Array.from(parent.children).findIndex(child => child === from.element);\n\t\treturn {\n\t\t\telement: from.element?.parentElement,\n\t\t\tchildren: [`${newSelector}:nth-child(${childIndex + 1})`, ...(from.children ?? [])],\n\t\t};\n\t}\n\tthrow new Error('Unable to uniquely identify selector: not unique enough');\n};\n\nexport const getElementUniqueSelector = (element: Element, context: Element) => {\n\tconst getSelector = (prefilled: SelectorProperties): string | null => {\n\t\tconst properties = getSelectorProperties(prefilled);\n\n\t\tconst newSelector = [[properties.classes, properties.id].filter(Boolean).join(''), ...(properties.children ?? [])]\n\t\t\t.filter(Boolean)\n\t\t\t.join('>');\n\n\t\tconst matchingSelectors = context.querySelectorAll(newSelector);\n\n\t\tif (matchingSelectors.length > 1 && matchingSelectors.length < 100) return getSelector(properties);\n\t\tif (matchingSelectors.length === 1) return newSelector;\n\n\t\treturn null;\n\t};\n\n\treturn getSelector({ element, children: [] });\n};\n","import { getElementUniqueSelector } from './collaborate.selector';\n\nconst preventIt = (e: Event) => {\n\te.preventDefault();\n\te.stopPropagation();\n};\n\nconst eventsToPrevent: (keyof HTMLElementEventMap)[] = [\n\t'mousedown',\n\t'mouseup',\n\t'blur',\n\t'input',\n\t'mouseenter',\n\t'mouseleave',\n\t'mouseover',\n\t'pointerdown',\n\t'pointerup',\n\t'pointerenter',\n\t'pointerleave',\n\t'pointerover',\n\t'pointermove',\n\t'beforeinput',\n\t'dblclick',\n\t'focus',\n\t'focusin',\n\t'keydown',\n\t'keypress',\n\t'touchend',\n\t'touchmove',\n\t'touchstart',\n\t'touchcancel',\n\t'transitionstart',\n\t'transitionend',\n];\n\nexport type CollaborateInboundEvent =\n\t| {\n\t\t\ttype: 'SETUP_EVENT_HANDLERS';\n\t }\n\t| { type: 'WATCH_SELECTORS'; selectors: string[] };\n\nexport type CollaborateOutboundEvent =\n\t| { type: 'READY' }\n\t| {\n\t\t\ttype: 'RESIZE';\n\t\t\tscrollHeight: number;\n\t }\n\t| { type: 'SCROLL'; scrollY: number; scrollX: number }\n\t| {\n\t\t\ttype: 'HOVER_ELEMENT';\n\t\t\trect: PinRect | null;\n\t }\n\t| {\n\t\t\ttype: 'DROP_PIN';\n\t\t\tpin: DroppedPin;\n\t }\n\t| {\n\t\t\ttype: 'SELECTOR_RECTS';\n\t\t\tselectorRects: SelectorRects;\n\t };\n\nexport type DroppedPin = { selector: string; xPercent: number; yPercent: number; rect: PinRect };\n\nconst sendOutboundEvent = (data: CollaborateOutboundEvent) => {\n\twindow.parent.postMessage({ source: 'inploi-collaborate', ...data }, '*');\n};\n\nexport const createInboundEventSender = (source: MessageEventSource) => {\n\treturn {\n\t\tsendInboundEvent: (data: CollaborateInboundEvent) => source.postMessage({ source: 'inploi-collaborate', ...data }),\n\t};\n};\n\nconst isCollaborateInboundEvent = (event: MessageEvent): event is MessageEvent<CollaborateInboundEvent> => {\n\treturn event.data.source === 'inploi-collaborate';\n};\n\nexport const isCollaborateOutboundEvent = (event: MessageEvent): event is MessageEvent<CollaborateOutboundEvent> => {\n\treturn event.data.source === 'inploi-collaborate';\n};\n\nexport const PIN_CURSOR_BASE64 =\n\t'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==';\n\nconst setCursor = () => {\n\tconst id = 'isdk-collaborate-cursor';\n\tif (document.getElementById(id)) return;\n\tconst style = document.createElement('style');\n\tstyle.id = id;\n\tstyle.innerHTML = `* { cursor: url(${PIN_CURSOR_BASE64}) 6 2, crosshair !important; }`;\n\tdocument.head.appendChild(style);\n};\n\nexport type PinRect = {\n\t_brand: 'pin';\n\tx: number;\n\ty: number;\n\twidth: number;\n\theight: number;\n};\n\nconst getElementPinRect = (element: Element): PinRect => {\n\tconst boundingBox = element.getBoundingClientRect();\n\treturn {\n\t\t_brand: 'pin',\n\t\tx: element.scrollLeft,\n\t\ty: element.scrollTop,\n\t\twidth: boundingBox.width,\n\t\theight: boundingBox.height,\n\t};\n};\n\nexport type SelectorRects = { [selector: string]: PinRect | null };\n\nconst getSelectorRects = (selectors: string[]) => {\n\tconst selectorRects: SelectorRects = {};\n\tfor (const selector of selectors) {\n\t\tconst element = document.querySelector(selector);\n\t\tselectorRects[selector] = element ? getElementPinRect(element) : null;\n\t}\n\treturn selectorRects;\n};\n\nfunction debounce<F extends (...args: Parameters<F>) => ReturnType<F>>(\n\tfunc: F,\n\twaitFor: number,\n): (...args: Parameters<F>) => void {\n\tlet timeout: ReturnType<typeof setTimeout>;\n\n\treturn (...args: Parameters<F>): void => {\n\t\tclearTimeout(timeout);\n\t\ttimeout = setTimeout(() => func(...args), waitFor);\n\t};\n}\n\nexport const setupCollaborate = (params?: { signal?: AbortSignal }) => {\n\tconst signal = params?.signal ?? new AbortController().signal;\n\n\tlet watchedSelectors: string[] = [];\n\tsendOutboundEvent({ type: 'READY' });\n\tconst broadcastSelectors = debounce(() => {\n\t\tsendOutboundEvent({ type: 'SELECTOR_RECTS', selectorRects: getSelectorRects(watchedSelectors) });\n\t}, 50);\n\n\twindow.addEventListener(\n\t\t'message',\n\t\tmessageEvent => {\n\t\t\tif (isCollaborateInboundEvent(messageEvent) === false) return;\n\t\t\tconst collaborateEvent = messageEvent.data;\n\t\t\tswitch (collaborateEvent.type) {\n\t\t\t\tcase 'WATCH_SELECTORS': {\n\t\t\t\t\twatchedSelectors = collaborateEvent.selectors;\n\t\t\t\t\tbroadcastSelectors();\n\t\t\t\t\tbreak;\n\t\t\t\t}\n\t\t\t\tcase 'SETUP_EVENT_HANDLERS': {\n\t\t\t\t\tsetCursor();\n\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t'resize',\n\t\t\t\t\t\t() => {\n\t\t\t\t\t\t\tbroadcastSelectors();\n\t\t\t\t\t\t\tsendOutboundEvent({ type: 'RESIZE', scrollHeight: document.body.scrollHeight });\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{ signal },\n\t\t\t\t\t);\n\t\t\t\t\tdocument.body.addEventListener(\n\t\t\t\t\t\t'mousemove',\n\t\t\t\t\t\tevent => {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\tconst hoveredElement = document.elementsFromPoint(event.clientX, event.clientY)[0];\n\t\t\t\t\t\t\tsendOutboundEvent({\n\t\t\t\t\t\t\t\ttype: 'HOVER_ELEMENT',\n\t\t\t\t\t\t\t\trect: hoveredElement ? getElementPinRect(hoveredElement) : null,\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{ signal },\n\t\t\t\t\t);\n\t\t\t\t\tdocument.body.addEventListener(\n\t\t\t\t\t\t'click',\n\t\t\t\t\t\tevent => {\n\t\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\t\tconst hoveredElement = document.elementsFromPoint(event.clientX, event.clientY)[0];\n\t\t\t\t\t\t\tif (!hoveredElement) return;\n\t\t\t\t\t\t\tconst selector = getElementUniqueSelector(hoveredElement, document.body);\n\t\t\t\t\t\t\tif (!selector) return;\n\t\t\t\t\t\t\tconst rect = hoveredElement.getBoundingClientRect();\n\t\t\t\t\t\t\tsendOutboundEvent({\n\t\t\t\t\t\t\t\ttype: 'DROP_PIN',\n\t\t\t\t\t\t\t\tpin: {\n\t\t\t\t\t\t\t\t\trect: getElementPinRect(hoveredElement),\n\t\t\t\t\t\t\t\t\tselector,\n\t\t\t\t\t\t\t\t\txPercent: (event.clientX - rect.x) / rect.width,\n\t\t\t\t\t\t\t\t\tyPercent: (event.clientY - rect.y) / rect.height,\n\t\t\t\t\t\t\t\t},\n\t\t\t\t\t\t\t});\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{ signal },\n\t\t\t\t\t);\n\t\t\t\t\twindow.addEventListener(\n\t\t\t\t\t\t'scroll',\n\t\t\t\t\t\t() => {\n\t\t\t\t\t\t\tbroadcastSelectors();\n\t\t\t\t\t\t\tsendOutboundEvent({ type: 'SCROLL', scrollY: window.scrollY, scrollX: window.scrollX });\n\t\t\t\t\t\t},\n\t\t\t\t\t\t{ signal },\n\t\t\t\t\t);\n\t\t\t\t\teventsToPrevent.map(type => document.addEventListener(type, preventIt, { signal }));\n\t\t\t\t}\n\t\t\t}\n\t\t},\n\t\t{ signal },\n\t);\n};\n"],"mappings":"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","names":["getSelectorProperties","from","_a","_b","_c","_d","_e","_f","_g","_h","newSelector","parent","childIndex","child","getElementUniqueSelector","element","context","getSelector","prefilled","properties","matchingSelectors","preventIt","eventsToPrevent","sendOutboundEvent","data","__spreadValues","createInboundEventSender","source","isCollaborateInboundEvent","event","isCollaborateOutboundEvent","PIN_CURSOR_BASE64","setCursor","id","style","getElementPinRect","element","boundingBox","getSelectorRects","selectors","selectorRects","selector","debounce","func","waitFor","timeout","args","setupCollaborate","params","_a","signal","watchedSelectors","broadcastSelectors","messageEvent","collaborateEvent","hoveredElement","getElementUniqueSelector","rect","type"]}
1
+ {"version":3,"sources":["../src/collaborate.ts","../src/collaborate.selector.ts"],"sourcesContent":["import { Logger, createPlugin } from '@inploi/sdk';\n\nimport { getElementUniqueSelector } from './collaborate.selector';\n\nconst preventIt = (e: Event) => {\n\te.preventDefault();\n\te.stopPropagation();\n};\n\nconst eventsToPrevent: (keyof HTMLElementEventMap)[] = [\n\t'mousedown',\n\t'mouseup',\n\t'blur',\n\t'input',\n\t'mouseenter',\n\t'mouseleave',\n\t'mouseover',\n\t'pointerdown',\n\t'pointerup',\n\t'pointerenter',\n\t'pointerleave',\n\t'pointerover',\n\t'pointermove',\n\t'beforeinput',\n\t'dblclick',\n\t'focus',\n\t'focusin',\n\t'keydown',\n\t'keypress',\n\t'touchend',\n\t'touchmove',\n\t'touchstart',\n\t'touchcancel',\n\t'transitionstart',\n\t'transitionend',\n];\n\nexport type CollaborateInboundEvent =\n\t| {\n\t\t\ttype: 'SETUP_EVENT_HANDLERS';\n\t }\n\t| { type: 'WATCH_SELECTORS'; selectors: string[] };\n\nexport type CollaborateOutboundEvent =\n\t| { type: 'READY' }\n\t| {\n\t\t\ttype: 'RESIZE';\n\t\t\tscrollHeight: number;\n\t }\n\t| { type: 'SCROLL'; scrollY: number; scrollX: number }\n\t| {\n\t\t\ttype: 'HOVER_ELEMENT';\n\t\t\trect: PinRect | null;\n\t }\n\t| {\n\t\t\ttype: 'DROP_PIN';\n\t\t\tpin: DroppedPin;\n\t }\n\t| {\n\t\t\ttype: 'SELECTOR_RECTS';\n\t\t\tselectorRects: SelectorRects;\n\t };\n\nexport type DroppedPin = { selector: string; xPercent: number; yPercent: number; rect: PinRect };\n\nconst sendOutboundEvent = (data: CollaborateOutboundEvent) => {\n\twindow.parent.postMessage({ source: 'inploi-collaborate', ...data }, '*');\n};\n\nexport const createInboundEventSender = (e: MessageEvent) => {\n\treturn {\n\t\tsendInboundEvent: (data: CollaborateInboundEvent) =>\n\t\t\te.source?.postMessage({ source: 'inploi-collaborate', ...data }, { targetOrigin: e.origin }),\n\t};\n};\n\nconst isCollaborateInboundEvent = (event: MessageEvent): event is MessageEvent<CollaborateInboundEvent> => {\n\treturn event.data.source === 'inploi-collaborate';\n};\n\nexport const isCollaborateOutboundEvent = (event: MessageEvent): event is MessageEvent<CollaborateOutboundEvent> => {\n\treturn event.data.source === 'inploi-collaborate';\n};\n\nexport const PIN_CURSOR_BASE64 =\n\t'data:image/svg+xml;base64,PHN2ZyB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIHZpZXdCb3g9IjAgMCAzNiAzNiIgZmlsbD0ibm9uZSIgeG1sbnM9Imh0dHA6Ly93d3cudzMub3JnLzIwMDAvc3ZnIj4KPHBhdGggZD0iTTcgM0gxOEMyNC4wNzUxIDMgMjkgNy45MjQ4NyAyOSAxNEMyOSAyMC4wNzUxIDI0LjA3NTEgMjUgMTggMjVDMTEuOTI0OSAyNSA3IDIwLjA3NTEgNyAxNFYzWiIgZmlsbD0iIzNFNjNERCIvPgo8ZyBmaWx0ZXI9InVybCgjZmlsdGVyMF9kZF84NV8xMSkiPgo8cGF0aCBkPSJNNiAySDE4QzI0LjYyNzQgMiAzMCA3LjM3MjU4IDMwIDE0QzMwIDIwLjYyNzQgMjQuNjI3NCAyNiAxOCAyNkMxMS4zNzI2IDI2IDYgMjAuNjI3NCA2IDE0VjJaIiBmaWxsPSIjM0U2M0REIiBmaWxsLW9wYWNpdHk9IjAuMDEiIHNoYXBlLXJlbmRlcmluZz0iY3Jpc3BFZGdlcyIvPgo8L2c+CjxwYXRoIGZpbGwtcnVsZT0iZXZlbm9kZCIgY2xpcC1ydWxlPSJldmVub2RkIiBkPSJNMTggNEg4VjE0QzggMTkuNTIyOCAxMi40NzcyIDI0IDE4IDI0QzIzLjUyMjggMjQgMjggMTkuNTIyOCAyOCAxNEMyOCA4LjQ3NzE1IDIzLjUyMjggNCAxOCA0Wk02IDJWMTRDNiAyMC42Mjc0IDExLjM3MjYgMjYgMTggMjZDMjQuNjI3NCAyNiAzMCAyMC42Mjc0IDMwIDE0QzMwIDcuMzcyNTggMjQuNjI3NCAyIDE4IDJINloiIGZpbGw9IndoaXRlIi8+CjxkZWZzPgo8ZmlsdGVyIGlkPSJmaWx0ZXIwX2RkXzg1XzExIiB4PSIwIiB5PSIwIiB3aWR0aD0iMzYiIGhlaWdodD0iMzYiIGZpbHRlclVuaXRzPSJ1c2VyU3BhY2VPblVzZSIgY29sb3ItaW50ZXJwb2xhdGlvbi1maWx0ZXJzPSJzUkdCIj4KPGZlRmxvb2QgZmxvb2Qtb3BhY2l0eT0iMCIgcmVzdWx0PSJCYWNrZ3JvdW5kSW1hZ2VGaXgiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iNCIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIzIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9IkJhY2tncm91bmRJbWFnZUZpeCIgcmVzdWx0PSJlZmZlY3QxX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQ29sb3JNYXRyaXggaW49IlNvdXJjZUFscGhhIiB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMTI3IDAiIHJlc3VsdD0iaGFyZEFscGhhIi8+CjxmZU9mZnNldCBkeT0iMiIvPgo8ZmVHYXVzc2lhbkJsdXIgc3RkRGV2aWF0aW9uPSIyIi8+CjxmZUNvbXBvc2l0ZSBpbjI9ImhhcmRBbHBoYSIgb3BlcmF0b3I9Im91dCIvPgo8ZmVDb2xvck1hdHJpeCB0eXBlPSJtYXRyaXgiIHZhbHVlcz0iMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMCAwIDAgMC4xIDAiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbjI9ImVmZmVjdDFfZHJvcFNoYWRvd184NV8xMSIgcmVzdWx0PSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiLz4KPGZlQmxlbmQgbW9kZT0ibm9ybWFsIiBpbj0iU291cmNlR3JhcGhpYyIgaW4yPSJlZmZlY3QyX2Ryb3BTaGFkb3dfODVfMTEiIHJlc3VsdD0ic2hhcGUiLz4KPC9maWx0ZXI+CjwvZGVmcz4KPC9zdmc+Cg==';\n\nconst setCursor = () => {\n\tconst id = 'isdk-collaborate-cursor';\n\tif (document.getElementById(id)) return;\n\tconst style = document.createElement('style');\n\tstyle.id = id;\n\tstyle.innerHTML = `* { cursor: url(${PIN_CURSOR_BASE64}) 6 2, crosshair !important; }`;\n\tdocument.head.appendChild(style);\n};\n\nexport type PinRect = {\n\t_brand: 'pin';\n\tx: number;\n\ty: number;\n\twidth: number;\n\theight: number;\n};\n\nconst getElementPinRect = (element: Element): PinRect => {\n\tconst boundingBox = element.getBoundingClientRect();\n\treturn {\n\t\t_brand: 'pin',\n\t\tx: element.scrollLeft,\n\t\ty: element.scrollTop,\n\t\twidth: boundingBox.width,\n\t\theight: boundingBox.height,\n\t};\n};\n\nexport type SelectorRects = { [selector: string]: PinRect | null };\n\nconst getSelectorRects = (selectors: string[]) => {\n\tconst selectorRects: SelectorRects = {};\n\tfor (const selector of selectors) {\n\t\tconst element = document.querySelector(selector);\n\t\tselectorRects[selector] = element ? getElementPinRect(element) : null;\n\t}\n\treturn selectorRects;\n};\n\nfunction debounce<F extends (...args: Parameters<F>) => ReturnType<F>>(\n\tfunc: F,\n\twaitFor: number,\n): (...args: Parameters<F>) => void {\n\tlet timeout: ReturnType<typeof setTimeout>;\n\n\treturn (...args: Parameters<F>): void => {\n\t\tclearTimeout(timeout);\n\t\ttimeout = setTimeout(() => func(...args), waitFor);\n\t};\n}\n\n/** Sets up the bridge for Collaborate to be able to communicate with the host page */\nconst setupBridge = ({ logger, signal }: { signal?: AbortSignal; logger: Logger }) => {\n\tlet watchedSelectors: string[] = [];\n\tsendOutboundEvent({ type: 'READY' });\n\tlogger.info('Collaborate bridge: Ready');\n\tconst broadcastSelectors = debounce(() => {\n\t\tsendOutboundEvent({ type: 'SELECTOR_RECTS', selectorRects: getSelectorRects(watchedSelectors) });\n\t}, 50);\n\n\tconst handleEvent = (messageEvent: MessageEvent) => {\n\t\tif (isCollaborateInboundEvent(messageEvent) === false) return;\n\t\tlogger.info('Collaborate bridge: received ', messageEvent.data);\n\t\tconst collaborateEvent = messageEvent.data;\n\t\tswitch (collaborateEvent.type) {\n\t\t\tcase 'WATCH_SELECTORS': {\n\t\t\t\twatchedSelectors = collaborateEvent.selectors;\n\t\t\t\tbroadcastSelectors();\n\t\t\t\tbreak;\n\t\t\t}\n\t\t\tcase 'SETUP_EVENT_HANDLERS': {\n\t\t\t\tlogger.info('Collaborate bridge: Setting up event handlers');\n\t\t\t\tsetCursor();\n\t\t\t\twindow.addEventListener(\n\t\t\t\t\t'resize',\n\t\t\t\t\t() => {\n\t\t\t\t\t\tbroadcastSelectors();\n\t\t\t\t\t\tsendOutboundEvent({ type: 'RESIZE', scrollHeight: document.body.scrollHeight });\n\t\t\t\t\t},\n\t\t\t\t\t{ signal },\n\t\t\t\t);\n\t\t\t\tdocument.body.addEventListener(\n\t\t\t\t\t'mousemove',\n\t\t\t\t\tevent => {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tconst hoveredElement = document.elementsFromPoint(event.clientX, event.clientY)[0];\n\t\t\t\t\t\tsendOutboundEvent({\n\t\t\t\t\t\t\ttype: 'HOVER_ELEMENT',\n\t\t\t\t\t\t\trect: hoveredElement ? getElementPinRect(hoveredElement) : null,\n\t\t\t\t\t\t});\n\t\t\t\t\t},\n\t\t\t\t\t{ signal },\n\t\t\t\t);\n\t\t\t\tdocument.body.addEventListener(\n\t\t\t\t\t'click',\n\t\t\t\t\tevent => {\n\t\t\t\t\t\tevent.preventDefault();\n\t\t\t\t\t\tevent.stopPropagation();\n\t\t\t\t\t\tconst hoveredElement = document.elementsFromPoint(event.clientX, event.clientY)[0];\n\t\t\t\t\t\tif (!hoveredElement) return;\n\t\t\t\t\t\tconst selector = getElementUniqueSelector(hoveredElement, document.body);\n\t\t\t\t\t\tif (!selector) return;\n\t\t\t\t\t\tconst rect = hoveredElement.getBoundingClientRect();\n\t\t\t\t\t\tsendOutboundEvent({\n\t\t\t\t\t\t\ttype: 'DROP_PIN',\n\t\t\t\t\t\t\tpin: {\n\t\t\t\t\t\t\t\trect: getElementPinRect(hoveredElement),\n\t\t\t\t\t\t\t\tselector,\n\t\t\t\t\t\t\t\txPercent: (event.clientX - rect.x) / rect.width,\n\t\t\t\t\t\t\t\tyPercent: (event.clientY - rect.y) / rect.height,\n\t\t\t\t\t\t\t},\n\t\t\t\t\t\t});\n\t\t\t\t\t},\n\t\t\t\t\t{ signal },\n\t\t\t\t);\n\t\t\t\twindow.addEventListener(\n\t\t\t\t\t'scroll',\n\t\t\t\t\t() => {\n\t\t\t\t\t\tbroadcastSelectors();\n\t\t\t\t\t\tsendOutboundEvent({ type: 'SCROLL', scrollY: window.scrollY, scrollX: window.scrollX });\n\t\t\t\t\t},\n\t\t\t\t\t{ signal },\n\t\t\t\t);\n\t\t\t\teventsToPrevent.map(type => document.addEventListener(type, preventIt, { signal }));\n\t\t\t\tlogger.info('Collaborate bridge: Event handlers set up');\n\t\t\t}\n\t\t}\n\t};\n\n\twindow.addEventListener('message', handleEvent, { signal });\n\tsignal?.addEventListener('abort', () => {\n\t\tlogger.info('Collaborate bridge: disposing');\n\t\twindow.removeEventListener('message', handleEvent);\n\t});\n};\n\nexport const collaboratePlugin = () =>\n\tcreatePlugin(({ logger }) => ({\n\t\tsetupBridge: (params?: { signal?: AbortSignal }) =>\n\t\t\tsetupBridge({\n\t\t\t\tlogger,\n\t\t\t\tsignal: params?.signal,\n\t\t\t}),\n\t}));\n","type SelectorProperties = {\n\telement: Element | null | undefined;\n\tid?: string;\n\tclasses?: string;\n\tchildren?: string[];\n};\n\nconst getSelectorProperties = (from: SelectorProperties): SelectorProperties => {\n\tif (from.element?.getAttribute('id') !== null && !from.id?.length) {\n\t\tfrom.id = `#${from.element?.getAttribute('id')}`;\n\t\treturn from;\n\t}\n\n\tif (from.element && from.element.className.length > 0 && !from.classes?.length) {\n\t\tfrom.classes = `.${from.element.className.split(' ').join('.')}`;\n\t\treturn from;\n\t}\n\n\tconst newSelector = [from.classes, from.id].filter(Boolean).join('') || from.element?.tagName;\n\n\tconst parent = from.element?.parentElement;\n\tif (parent) {\n\t\tconst childIndex = Array.from(parent.children).findIndex(child => child === from.element);\n\t\treturn {\n\t\t\telement: from.element?.parentElement,\n\t\t\tchildren: [`${newSelector}:nth-child(${childIndex + 1})`, ...(from.children ?? [])],\n\t\t};\n\t}\n\tthrow new Error('Unable to uniquely identify selector: not unique enough');\n};\n\nexport const getElementUniqueSelector = (element: Element, context: Element) => {\n\tconst getSelector = (prefilled: SelectorProperties): string | null => {\n\t\tconst properties = getSelectorProperties(prefilled);\n\n\t\tconst newSelector = [[properties.classes, properties.id].filter(Boolean).join(''), ...(properties.children ?? [])]\n\t\t\t.filter(Boolean)\n\t\t\t.join('>');\n\n\t\tconst matchingSelectors = context.querySelectorAll(newSelector);\n\n\t\tif (matchingSelectors.length > 1 && matchingSelectors.length < 100) return getSelector(properties);\n\t\tif (matchingSelectors.length === 1) return newSelector;\n\n\t\treturn null;\n\t};\n\n\treturn getSelector({ element, children: [] });\n};\n"],"mappings":"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","names":["createPlugin","getSelectorProperties","from","_a","_b","_c","_d","_e","_f","_g","_h","newSelector","parent","childIndex","child","getElementUniqueSelector","element","context","getSelector","prefilled","properties","matchingSelectors","preventIt","eventsToPrevent","sendOutboundEvent","data","__spreadValues","createInboundEventSender","_a","isCollaborateInboundEvent","event","isCollaborateOutboundEvent","PIN_CURSOR_BASE64","setCursor","id","style","getElementPinRect","element","boundingBox","getSelectorRects","selectors","selectorRects","selector","debounce","func","waitFor","timeout","args","setupBridge","logger","signal","watchedSelectors","broadcastSelectors","handleEvent","messageEvent","collaborateEvent","hoveredElement","getElementUniqueSelector","rect","type","collaboratePlugin","createPlugin","params"]}
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@inploi/plugin-collaborate",
3
- "version": "0.0.1",
3
+ "version": "0.0.3",
4
4
  "main": "dist/index.js",
5
5
  "types": "dist/index.d.ts",
6
6
  "license": "MIT",
@@ -16,15 +16,18 @@
16
16
  }
17
17
  },
18
18
  "dependencies": {},
19
- "peerDependencies": {},
19
+ "peerDependencies": {
20
+ "@inploi/sdk": "*"
21
+ },
20
22
  "devDependencies": {
21
23
  "@happy-dom/global-registrator": "^13.6.2",
22
24
  "@types/bun": "^1.0.8",
23
25
  "eslint": "^7.32.0",
24
26
  "happy-dom": "^12.6.0",
25
27
  "tsup": "^7.2.0",
28
+ "eslint-config-custom": "0.1.0",
26
29
  "tsconfig": "0.1.0",
27
- "eslint-config-custom": "0.1.0"
30
+ "@inploi/sdk": "1.14.4"
28
31
  },
29
32
  "scripts": {
30
33
  "build:npm": "tsup --dts --dts-resolve",