commerce-kit
Version:
2 lines • 8.27 kB
JavaScript
function E(){typeof window>"u"||(console.log("[YNS Sandbox Inspectors] module evaluated"),L(),S())}E();var w=new Set(["HEAD","SCRIPT","STYLE","NOSCRIPT","HTML"]);function C(o){if(o.id)return`${o.tagName.toLowerCase()}#${CSS.escape(o.id)}`;let l=[],e=o;for(;e&&e!==document.body&&e!==document.documentElement;){let t=e.tagName.toLowerCase();if(e.id){l.unshift(`${t}#${CSS.escape(e.id)}`);break}let n=Array.from(e.classList).filter(u=>!u.startsWith("data-yns-"));n.length>0&&(t+=`.${n.map(u=>CSS.escape(u)).join(".")}`);let a=e.parentElement,f=e.tagName;if(a&&Array.from(a.children).filter(m=>m.tagName===f&&(n.length===0||n.every(y=>m.classList.contains(y)))).length>1){let m=Array.from(a.children).indexOf(e)+1;t+=`:nth-child(${m})`}l.unshift(t),e=e.parentElement}return l.join(" > ")}function x(o,l){let e=o.getBoundingClientRect(),t=window.getComputedStyle(o),n=(o.textContent??"").trim();return{tag:o.tagName.toLowerCase(),id:o.id||void 0,classes:Array.from(o.classList).filter(a=>!a.startsWith("data-yns-")),textContent:n.length>l?`${n.slice(0,l)}\u2026`:n,cssSelector:C(o),boundingRect:{top:e.top,left:e.left,width:e.width,height:e.height},computedStyles:{color:t.color,backgroundColor:t.backgroundColor,fontSize:t.fontSize,fontFamily:t.fontFamily,padding:t.padding,margin:t.margin}}}function v(o,l){if(!o?.tagName||w.has(o.tagName))return!0;for(let e of l)if(o.hasAttribute?.(e))return!0;return!1}function L(){let o=!1,l=null,e=null,t=document.createElement("div");t.setAttribute("data-yns-design-overlay","hover"),t.style.cssText=["position: fixed","pointer-events: none","z-index: 2147483646","border: 2px solid #3b82f6","background: rgba(59, 130, 246, 0.08)","border-radius: 3px","display: none","transition: top 0.05s, left 0.05s, width 0.05s, height 0.05s"].join(";");let n=document.createElement("div");n.setAttribute("data-yns-design-overlay","label"),n.style.cssText=["position: fixed","pointer-events: none","z-index: 2147483647","background: #3b82f6","color: #fff","font-size: 11px","font-family: ui-monospace, monospace","padding: 2px 6px","border-radius: 3px","white-space: nowrap","display: none"].join(";"),document.documentElement.appendChild(t),document.documentElement.appendChild(n);let a=document.createElement("style");a.setAttribute("data-yns-design-overlay","style"),a.textContent="[data-yns-selected] { outline: 2px solid #3b82f6 !important; outline-offset: 1px; }",document.head.appendChild(a);function f(d){let i=d.getBoundingClientRect();t.style.top=`${i.top}px`,t.style.left=`${i.left}px`,t.style.width=`${i.width}px`,t.style.height=`${i.height}px`,t.style.display="block";let r=Array.from(d.classList).filter(c=>!c.startsWith("data-yns-")),s=d.tagName.toLowerCase()+(r.length?`.${r[0]}`:"");n.textContent=s,n.style.left=`${i.left}px`,n.style.top=`${Math.max(0,i.top-22)}px`,n.style.display="block"}let u=d=>{let i=document.elementFromPoint(d.clientX,d.clientY);if(v(i,["data-yns-design-overlay"])){t.style.display="none",n.style.display="none",l=null;return}l=i,requestAnimationFrame(()=>{l===i&&o&&i&&f(i)})},m=()=>{t.style.display="none",n.style.display="none",l=null},y=d=>{if(!o||!l)return;d.preventDefault(),d.stopPropagation(),d.stopImmediatePropagation();let i=l;if(v(i,["data-yns-design-overlay"]))return;let r=x(i,120),s=r.cssSelector;e&&e.el.removeAttribute("data-yns-selected"),e&&e.cssSelector===s?(e=null,window.parent.postMessage({type:"element-deselected",data:r},"*")):(e={el:i,cssSelector:s},i.setAttribute("data-yns-selected",""),window.parent.postMessage({type:"element-selected",data:r},"*"))},g=d=>{d.key==="Escape"&&o&&(h(),window.parent.postMessage({type:"design-mode-cleared"},"*"))};function b(){o=!0,document.addEventListener("mousemove",u,!0),document.addEventListener("mouseleave",m),document.addEventListener("click",y,!0),document.addEventListener("keydown",g,!0)}function h(){o=!1,document.removeEventListener("mousemove",u,!0),document.removeEventListener("mouseleave",m),document.removeEventListener("click",y,!0),document.removeEventListener("keydown",g,!0),t.style.display="none",n.style.display="none",l=null,e&&(e.el.removeAttribute("data-yns-selected"),e=null)}window.addEventListener("message",d=>{let i=d.data;!i||typeof i!="object"||(i.type==="design-mode-toggle"&&(i.enabled?b():(h(),window.parent.postMessage({type:"design-mode-cleared"},"*"))),i.type==="design-mode-deselect"&&e&&(e.el.removeAttribute("data-yns-selected"),e=null))})}function S(){let o=!1,l=null,e=[],t=document.createElement("div");t.setAttribute("data-yns-comment-overlay","hover"),t.style.cssText=["position: fixed","pointer-events: none","z-index: 2147483644","border: 2px dashed #10b981","background: rgba(16, 185, 129, 0.06)","border-radius: 3px","display: none","transition: top 0.05s, left 0.05s, width 0.05s, height 0.05s"].join(";");let n=document.createElement("div");n.setAttribute("data-yns-comment-overlay","cursor-label"),n.textContent="Click to comment",n.style.cssText=["position: fixed","pointer-events: none","z-index: 2147483645","background: #059669","color: #fff","font-size: 11px","font-family: ui-sans-serif, system-ui, sans-serif","padding: 3px 8px","border-radius: 4px","white-space: nowrap","display: none","box-shadow: 0 2px 6px rgba(0,0,0,0.15)"].join(";");let a=document.createElement("div");a.setAttribute("data-yns-comment-overlay","pins"),a.style.cssText="position: fixed; top: 0; left: 0; width: 100%; height: 100%; pointer-events: none; z-index: 2147483643;",document.documentElement.appendChild(t),document.documentElement.appendChild(n),document.documentElement.appendChild(a);function f(){a.innerHTML="";for(let r of e){let s=null;try{s=document.querySelector(r.selector)}catch{s=null}if(!s)continue;let c=s.getBoundingClientRect(),p=document.createElement("div");p.style.cssText=["position: fixed",`top: ${c.top-12}px`,`left: ${c.left+c.width/2-12}px`,"width: 24px","height: 24px","border-radius: 50%","background: #059669","color: #fff","display: flex","align-items: center","justify-content: center","font-size: 12px","font-weight: 600","font-family: ui-sans-serif, system-ui, sans-serif","box-shadow: 0 2px 8px rgba(0,0,0,0.2)","pointer-events: none"].join(";"),p.textContent=String(r.number),a.appendChild(p)}}let u=r=>{let s=document.elementFromPoint(r.clientX,r.clientY);if(v(s,["data-yns-comment-overlay","data-yns-design-overlay"])){t.style.display="none",n.style.display="none",l=null;return}l=s,requestAnimationFrame(()=>{if(l===s&&o&&s){let c=s.getBoundingClientRect();t.style.top=`${c.top}px`,t.style.left=`${c.left}px`,t.style.width=`${c.width}px`,t.style.height=`${c.height}px`,t.style.display="block",n.style.left=`${r.clientX+14}px`,n.style.top=`${r.clientY+14}px`,n.style.display="block"}})},m=()=>{t.style.display="none",n.style.display="none",l=null},y=r=>{if(!o||!l)return;r.preventDefault(),r.stopPropagation(),r.stopImmediatePropagation();let s=l;if(v(s,["data-yns-comment-overlay","data-yns-design-overlay"]))return;let c=x(s,200),p=s.getBoundingClientRect();window.parent.postMessage({type:"comment-click",data:{element:c,clickPosition:{x:r.clientX,y:r.clientY},elementRect:{top:p.top,left:p.left,width:p.width,height:p.height},pagePath:window.location.pathname}},"*")},g=r=>{r.key==="Escape"&&o&&(h(),window.parent.postMessage({type:"comment-mode-cleared"},"*"))};function b(){o=!0,document.body.style.cursor="crosshair",document.addEventListener("mousemove",u,!0),document.addEventListener("mouseleave",m),document.addEventListener("click",y,!0),document.addEventListener("keydown",g,!0)}function h(){o=!1,document.body.style.cursor="",document.removeEventListener("mousemove",u,!0),document.removeEventListener("mouseleave",m),document.removeEventListener("click",y,!0),document.removeEventListener("keydown",g,!0),t.style.display="none",n.style.display="none",l=null}let d=!1,i=()=>{d||(d=!0,requestAnimationFrame(()=>{d=!1,f()}))};window.addEventListener("scroll",i,{passive:!0}),window.addEventListener("resize",i,{passive:!0}),window.addEventListener("message",r=>{let s=r.data;!s||typeof s!="object"||(s.type==="comment-mode-toggle"&&(s.enabled?b():h()),s.type==="comment-pins-update"&&(e=s.pins??[],f()),s.type==="comment-pin-remove"&&(e=e.filter(c=>c.id!==s.pinId),f()))})}export{E as startSandboxInspectors};
//# sourceMappingURL=sandbox-inspectors.js.map