notemend 0.1.7 → 0.1.8
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/.claude-plugin/plugin.json +1 -1
- package/bin/init.mjs +6 -6
- package/bin/notemend.mjs +18 -14
- package/commands/turbo.md +22 -0
- package/package.json +3 -2
- package/src/client/config.js +1 -1
- package/src/client/markup.js +18 -12
- package/src/client/notemend.css +1 -1
- package/src/client/run.js +73 -64
- package/src/server/middleware.mjs +1 -1
- package/src/store/cloud.mjs +1 -1
- package/src/store/comments.mjs +3 -3
- package/store.d.ts +2 -0
package/src/client/run.js
CHANGED
|
@@ -1,101 +1,110 @@
|
|
|
1
|
-
import{categoryOf as oe}from"../store/categories.mjs";import{stateOf as O,STATE_LABEL as hs}from"../store/status.mjs";import{agentName as dt,handleOf as bs,threadOf as ys,workingOn as vs}from"../store/thread.mjs";import{api as U,canvasCopy as $s,host as Es,imageUrl as ws}from"./api";import{DEVTOOLS_DEVICES as fo}from"../devtools-devices.mjs";import{drawDevice as Ss,pageTints as Ls,inkFor as ho}from"./devices";import{recentLogs as xs}from"./logs";function Rs(M){const B=M.breakpoints,Xe=M.categories,se=(B.find(t=>!Number.isFinite(t.max))??B[0]).id,Et=t=>B.find(e=>t>=e.min&&t<=e.max)?.id??se,ct=t=>t.breakpoint||se,Dt=t=>M.devices.find(e=>e.id===t),$=$s,z=(t,e)=>{$||localStorage.setItem(t,e)},re=t=>t.replace(/\/+$/,"")||"/";let P=re(location.pathname);for(const t of document.querySelectorAll(".devtools .dt-icon[title]"))t.dataset.tip=t.title,t.getAttribute("aria-label")||t.setAttribute("aria-label",t.title),t.removeAttribute("title");const Ze=document.querySelector(".dt-grid-btn"),Ot=document.querySelector(".dt-grid-overlay"),Qe="dt-grid",ae=t=>{Ot.hidden=!t,Ze.setAttribute("aria-pressed",String(t)),z(Qe,t?"1":"0"),q({grid:t})};Ze.addEventListener("click",()=>ae(Ot.hidden===!0));const tn=document.querySelector(".dt-pages-name"),en=()=>{let t=null;for(const o of document.querySelectorAll(".dt-pages a"))re(new URL(o.href).pathname)===P?(o.setAttribute("aria-current","page"),t=o):o.removeAttribute("aria-current");const e=document.title.split("\u2014").pop()?.trim(),n=t?.querySelector(".dt-menu-label")?.textContent?.trim();tn.textContent=n||e||tn.textContent};en();const nn=[...document.querySelectorAll(".devtools details")];let ie=!1;const wt=()=>{const t=nn.filter(e=>e.open);for(const e of t)e.open=!1;return t};document.addEventListener("keydown",t=>{if(t.key!=="Escape")return;const[e]=wt();e&&(e.querySelector("summary")?.focus(),t.preventDefault(),t.stopImmediatePropagation())},!0),document.addEventListener("pointerdown",t=>{ie=nn.some(e=>e.open&&!e.contains(t.target))&&wt().length>0},!0),addEventListener("blur",wt);const Z=document.querySelector(".dt-pad-overlay"),on="dt-inspect",bo=[".devtools",".dt-pad-overlay",".dt-grid-overlay",".dt-frame",".dt-history",".dt-review",...M.ignore].join(", "),le=[".devtools",".dt-notes-overlay",".dt-history",".dt-frame",".dt-review",...M.ignore].join(", "),de={pads:document.querySelector(".dt-pad-btn"),sizes:document.querySelector(".dt-size-btn"),type:document.querySelector(".dt-type-btn")};let ut="",ce=0;const k=t=>{const e=parseFloat(getComputedStyle(document.documentElement).fontSize)/16,n=t/e;return Math.round(n*10)%10===0?String(Math.round(n)):n.toFixed(1)},_=(t,e,n,o,s,r="p")=>{if(n<=0||o<=0)return"";const c=s!==""?`<span class="dt-pad-chip dt-pad-chip--${r}" style="left:${t+n/2}px;top:${e+o/2}px">${s}</span>`:"";return`<span class="dt-pad-zone dt-pad-zone--${r}" style="left:${t}px;top:${e}px;width:${n}px;height:${o}px"></span>${c}`},yo=["paddingTop","paddingRight","paddingBottom","paddingLeft","marginTop","marginRight","marginBottom","marginLeft","columnGap","rowGap"],vo=t=>{let e=t;for(let n=0;e&&n<6;n++,e=e.parentElement){const o=getComputedStyle(e);if(yo.some(s=>parseFloat(o[s])>=2))return e}return t},$o=(t,e)=>{const n=parseFloat(e.columnGap)||0,o=parseFloat(e.rowGap)||0;if(!(e.display.includes("flex")||e.display.includes("grid"))||!n&&!o)return"";const s=[...t.children].map(c=>c.getBoundingClientRect()).filter(c=>c.width||c.height);let r="";for(let c=1;c<s.length;c++){const d=s[c-1],a=s[c];if(n&&a.left>=d.right-1){const l=Math.max(d.top,a.top);r+=_(d.right,l,a.left-d.right,Math.min(d.bottom,a.bottom)-l,k(n),"g")}else if(o&&a.top>=d.bottom-1){const l=Math.min(d.left,a.left);r+=_(l,d.bottom,Math.max(d.right,a.right)-l,a.top-d.bottom,k(o),"g")}}return r},ue=t=>`<span class="dt-pad-outline" style="left:${t.left}px;top:${t.top}px;width:${t.width}px;height:${t.height}px"></span>`,me=(t,e,n="")=>`<span class="dt-pad-tag" style="left:${e.left}px;top:${Math.max(2,e.top-22)}px">${t.tagName.toLowerCase()+(t.classList[0]?"."+t.classList[0]:"")}${n}</span>`,Eo=t=>{const e=t.getBoundingClientRect(),n=getComputedStyle(t),o=parseFloat(n.paddingTop),s=parseFloat(n.paddingRight),r=parseFloat(n.paddingBottom),c=parseFloat(n.paddingLeft);let d=ue(e);d+=_(e.left,e.top,e.width,o,o>=2?k(o):""),d+=_(e.left,e.bottom-r,e.width,r,r>=2?k(r):""),d+=_(e.left,e.top+o,c,e.height-o-r,c>=2?k(c):""),d+=_(e.right-s,e.top+o,s,e.height-o-r,s>=2?k(s):"");const a=parseFloat(n.marginTop),l=parseFloat(n.marginRight),m=parseFloat(n.marginBottom),b=parseFloat(n.marginLeft);d+=_(e.left,e.top-a,e.width,a,a>=2?k(a):"","m"),d+=_(e.left,e.bottom,e.width,m,m>=2?k(m):"","m"),d+=_(e.left-b,e.top,b,e.height,b>=2?k(b):"","m"),d+=_(e.right,e.top,l,e.height,l>=2?k(l):"","m"),d+=$o(t,n);const i=parseFloat(n.columnGap)||0,v=parseFloat(n.rowGap)||0,x=(n.display.includes("flex")||n.display.includes("grid"))&&(i||v)?` \xB7 gap ${k(i)}${v&&v!==i?"/"+k(v):""}`:"";Z.innerHTML=d+me(t,e,x)},wo=t=>{const e=t.getBoundingClientRect();Z.innerHTML=ue(e)+`<span class="dt-pad-chip" style="left:${e.left+e.width/2}px;top:${e.top+e.height/2}px">${k(e.width)} \xD7 ${k(e.height)}</span>`+me(t,e)},sn=t=>{const e=(t.match(/[\d.]+/g)||[]).map(Number);if(e.length<3)return t;const n="#"+e.slice(0,3).map(o=>Math.round(o).toString(16).padStart(2,"0")).join("");return e[3]!==void 0&&e[3]<1?`${n} \xB7 ${Math.round(e[3]*100)}%`:n};let pe=null;const So=()=>{if(pe)return pe;const t=getComputedStyle(document.documentElement),e=document.createElement("span");e.style.display="none",document.body.append(e);const n=[];for(const o of Array.from(t)){if(!o.startsWith("--"))continue;const s=t.getPropertyValue(o).trim();if(!/^(#|rgb|hsl|oklch|lab|color\()/i.test(s))continue;e.style.color="rgb(1, 2, 3)",e.style.color=s;const r=getComputedStyle(e).color;r&&r!=="rgb(1, 2, 3)"&&n.push([r,o])}return e.remove(),n.sort((o,s)=>o[1].length-s[1].length),pe=n,n},Lo=t=>So().find(([e])=>e===t)?.[1]??"",xo={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"},rn=t=>(t.match(/[\d.]+/g)??[]).map(Number).concat([1]).slice(0,4),an=(t,e)=>t.slice(0,3).map((n,o)=>n*t[3]+e[o]*(1-t[3])).concat([1]),To=t=>{const e=[];for(let n=t;n;n=n.parentElement){const o=getComputedStyle(n);if(o.backgroundImage!=="none")return null;const s=rn(o.backgroundColor);if(s[3]>0&&(e.push(s),s[3]>=1))break}return e.reduceRight((n,o)=>an(o,n),[255,255,255,1])},ln=t=>{const[e,n,o]=t.slice(0,3).map(s=>(s/=255,s<=.03928?s/12.92:((s+.055)/1.055)**2.4));return .2126*e+.7152*n+.0722*o},Mo=(t,e,n)=>{const o=To(t);if(!o)return["Contrast","<em>on an image</em>"];const s=an(rn(e.color),o),[r,c]=[ln(s),ln(o)].sort((m,b)=>b-m),d=(r+.05)/(c+.05),a=n>=24||n>=18.66&&Number(e.fontWeight)>=700,l=d>=(a?4.5:7)?"AAA":d>=(a?3:4.5)?"AA":"fails AA";return["Contrast",`${d.toFixed(2)}:1 <em class="${l==="fails AA"?"dt-type-bad":""}">${l}${a?" \xB7 large":""}</em>`]},ko=t=>{const e=t.getBoundingClientRect(),n=getComputedStyle(t),o=parseFloat(n.fontSize),s=n.lineHeight==="normal"?0:parseFloat(n.lineHeight),r=parseFloat(n.letterSpacing)||0,c=Lo(n.color),d=i=>`${(i*100).toFixed(1).replace(/\.0$/,"")}%`,a=[["Font",n.fontFamily.split(",")[0].replace(/["']/g,"")+(n.fontStyle!=="normal"?` ${n.fontStyle}`:"")],["Weight",`${xo[n.fontWeight]??""} <em>${n.fontWeight}</em>`],["Size",`${k(o)}px`],["Line",s?`${d(s/o)} <em>${k(s)}px</em>`:"normal"],["Letter",r?`${d(r/o)} <em>${r.toFixed(2).replace(/\.?0+$/,"")}px</em>`:"0"],["Color",`<i class="dt-type-sw" style="background:${n.color}"></i>${c?`${c} <em>${sn(n.color)}</em>`:sn(n.color)}`],Mo(t,n,o)],m=e.bottom+150<innerHeight?e.bottom+8:Math.max(8,e.top-158),b=Math.min(Math.max(8,e.left),innerWidth-210);Z.innerHTML=ue(e)+me(t,e)+`<div class="dt-type-card" style="left:${b}px;top:${m}px">${a.map(([i,v])=>`<span class="dt-type-row"><b>${i}</b><span>${v}</span></span>`).join("")}</div>`},dn=t=>{ce||(ce=requestAnimationFrame(()=>{ce=0,Z.hidden=!0;let e=document.elementFromPoint(t.clientX,t.clientY);if(Z.hidden=!1,!e||e.closest(bo)){Z.innerHTML="";return}t.altKey&&e.parentElement&&e.parentElement!==document.body&&(e=e.parentElement),ut==="sizes"?wo(e):ut==="type"?ko(e):Eo(t.altKey?e:vo(e))}))},Pt=t=>{ut=t;for(const[e,n]of Object.entries(de))n.setAttribute("aria-pressed",String(e===t));z(on,t),q({inspect:t}),Z.hidden=!t,Z.innerHTML="",t?document.addEventListener("mousemove",dn):document.removeEventListener("mousemove",dn)};for(const[t,e]of Object.entries(de))e.addEventListener("click",()=>{t!==ut&&rt(!1),Pt(ut===t?"":t)});const cn=document.querySelector(".dt-notes-btn"),ge=[...document.querySelectorAll(".dt-bp")],Ft=document.querySelector(".dt-history-btn"),D=document.querySelector(".dt-history"),fe=document.querySelector(".dt-studio-btn"),w=document.querySelector(".dt-device"),un=document.querySelector(".dt-shell"),St=document.querySelector('.dt-chrome[data-at="top"]'),jt=document.querySelector('.dt-chrome[data-at="bottom"]'),Lt=document.querySelector(".dt-ruler"),G=document.querySelector(".dt-devices"),mt=document.querySelector(".dt-notes-hi"),Ho=mt.querySelector(".dt-hi-box"),mn=mt.querySelector(".dt-hi-tag"),Ao=[...document.querySelectorAll(".dt-frame-handle")],pn=document.querySelector(".dt-frame-size"),he=document.querySelector(".dt-frame-rotate"),xt=document.querySelector(".dt-frame-bars"),C=document.querySelector(".dt-frame"),S=C.querySelector("iframe"),be=document.querySelector(".dt-notes-count"),f=document.querySelector(".dt-notes-overlay"),Co=".devtools, .dt-tab, .dt-notes-overlay, .dt-history, .dt-frame, .dt-review";for(const t of document.querySelectorAll(Co))for(const e of["pointerdown","mousedown","pointerup","mouseup","touchstart","touchend","click","focusin","focusout"])t.addEventListener(e,n=>n.stopPropagation());const gn="dt-notes";let h=[],H=!1,y=null,u=null,ye=0,F="",Q=[],L=null,R=[];const Kt=(t=u)=>!!(t&&(t.text?.trim()||t.images?.length)),j=()=>{u&&Kt()&&R.push(u),u=null};let Tt=null,J=null;const fn=()=>`dt-draft:${P}${$?":canvas":""}`;let ft=fn(),Wt=0;const ve=()=>{if(!u&&!R.length&&!F){localStorage.removeItem(ft);return}const t={draft:u,parked:R,reply:F?{for:Tt,text:F}:null};try{localStorage.setItem(ft,JSON.stringify(t))}catch{const e=n=>({...n,images:void 0});try{localStorage.setItem(ft,JSON.stringify({...t,draft:u&&e(u),parked:R.map(e)}))}catch{}}},zt=()=>{clearTimeout(Wt),Wt=setTimeout(ve,200)};addEventListener("pagehide",()=>{clearTimeout(Wt),ve()});let tt=localStorage.getItem("dt-resolved")!=="0";const No=[[/Edg\/(\d+)/,"Edge"],[/OPR\/(\d+)/,"Opera"],[/Firefox\/(\d+)/,"Firefox"],[/Chrome\/(\d+)/,"Chrome"],[/Version\/(\d+).*Safari/,"Safari"]],Bo=[[/iPhone|iPad/,"iOS"],[/Android/,"Android"],[/Mac OS X/,"macOS"],[/Windows/,"Windows"],[/Linux/,"Linux"]],Ro=()=>{const t=navigator.userAgent,e=r=>r.find(([c])=>c.test(t)),n=e(No),o=e(Bo),s=n?n[0].exec(t)?.[1]:null;return[n?`${n[1]}${s?" "+s:""}`:"unknown browser",o?.[1]].filter(Boolean).join(" \xB7 ")},et=()=>Et(innerWidth),_t=()=>J??et(),Mt=()=>{const t=_t();for(const e of ge)e.setAttribute("aria-pressed",String(e.dataset.bp===t))},qo=t=>{const e=[];let n=t;for(;n&&n.tagName!=="HTML"&&e.length<8;){if(n.id){e.unshift("#"+CSS.escape(n.id));break}const o=n.parentElement,s=n.tagName.toLowerCase(),r=o?[...o.children].filter(c=>c.tagName===n.tagName):[];e.unshift(r.length>1?`${s}:nth-of-type(${r.indexOf(n)+1})`:s),n=o}return e.join(">")},$e=(t,e)=>!e||K(t.textContent||"").slice(0,60)===e,Io=(t,e)=>[t||"*",...(e||[]).map(n=>"."+CSS.escape(n))].join(""),hn=t=>{try{return[...document.querySelectorAll(Io(t.tag,t.classes))]}catch{return[]}},bn=t=>{const e=K(t.textContent||"").replace(/\s+/g," ");for(let n=t.parentElement,o=0;n&&n!==document.body&&o<4;n=n.parentElement,o++){const s=K(n.textContent||"").replace(/\s+/g," ");if(s&&s!==e)return s}return""},Do=t=>bn(t).slice(0,80),Ee=(t,e)=>!e||bn(t).startsWith(e),Y=t=>{let e=null;try{e=document.querySelector(t.selector)}catch{e=null}if(e&&$e(e,t.label)&&Ee(e,t.ctx))return e;const n=hn(t),o=K(t.label)?n.filter(r=>$e(r,t.label)):[];return(o.find(r=>Ee(r,t.ctx))??n.find(r=>t.ctx&&Ee(r,t.ctx)&&!K(t.label)))||o[0]||(e&&$e(e,t.label)?e:null)||(t.nth!=null?n[t.nth]:null)||n[0]||e},Oo=t=>{let e=null;for(let n=t.parentElement;n&&n!==document.body;n=n.parentElement){const o=getComputedStyle(n);if(o.overflowX==="visible"&&o.overflowY==="visible")continue;const s=n.getBoundingClientRect();e=e?{l:Math.max(e.l,s.left),t:Math.max(e.t,s.top),r:Math.min(e.r,s.right),b:Math.min(e.b,s.bottom)}:{l:s.left,t:s.top,r:s.right,b:s.bottom}}return e},V=t=>{const e=Y(t);if(!e)return null;const n=e.getBoundingClientRect();if(!n.width&&!n.height)return null;const o=n.left+n.width*t.rx,s=n.top+n.height*t.ry,r=Oo(e);if(!r)return{x:o,y:s,off:""};if(r.r-r.l<18||r.b-r.t<18)return null;const c=Math.min(Math.max(o,r.l),r.r-18),d=Math.min(Math.max(s,r.t+18),r.b),a=o<r.l?"l":o>r.r-18?"r":s<r.t+18?"t":s>r.b?"b":"";return{x:c,y:d,off:a}},yn=t=>{for(let e=t;e&&e!==document.body;e=e.parentElement)if(e.getAnimations().some(n=>n.playState==="running"))return!0;return!1};let Gt=[];const we=t=>{for(const e of Gt)e.play();Gt=[];for(let e=t;e&&e!==document.body;e=e.parentElement)for(const n of e.getAnimations())n.playState==="running"&&(n.pause(),Gt.push(n))},vn=()=>{if(u)return Y(u);const t=y!=null?h.find(n=>n.id===y):null;if(!t)return null;const e=V(t);return e&&!e.off?Y(t):null},$n=t=>t?new Date(t).toLocaleString(void 0,{day:"numeric",month:"short",hour:"2-digit",minute:"2-digit"}):"",Yt='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M4 6h12M8 6V4.2h4V6M6.6 6l.55 9.8h5.7L13.4 6"/></svg>',Se='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M4.8 10.4 8.2 13.8l7-7.6" stroke-linejoin="round"/></svg>',Le='<svg viewBox="0 0 20 20" width="12" height="12" aria-hidden="true"><path d="M12.6 4.4l3 3-8.4 8.4H4.2v-3z" stroke-linejoin="round"/></svg>',Vt='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M5.4 5.4l9.2 9.2M14.6 5.4l-9.2 9.2"/></svg>',kt=t=>`<svg viewBox="0 0 24 24" width="${t}" height="${t}" aria-hidden="true" class="dt-claude"><path d="m4.7144 15.9555 4.7174-2.6471.079-.2307-.079-.1275h-.2307l-.7893-.0486-2.6956-.0729-2.3375-.0971-2.2646-.1214-.5707-.1215-.5343-.7042.0546-.3522.4797-.3218.686.0608 1.5179.1032 2.2767.1578 1.6514.0972 2.4468.255h.3886l.0546-.1579-.1336-.0971-.1032-.0972L6.973 9.8356l-2.55-1.6879-1.3356-.9714-.7225-.4918-.3643-.4614-.1578-1.0078.6557-.7225.8803.0607.2246.0607.8925.686 1.9064 1.4754 2.4893 1.8336.3643.3035.1457-.1032.0182-.0728-.164-.2733-1.3539-2.4467-1.445-2.4893-.6435-1.032-.17-.6194c-.0607-.255-.1032-.4674-.1032-.7285L6.287.1335 6.6997 0l.9957.1336.419.3642.6192 1.4147 1.0018 2.2282 1.5543 3.0296.4553.8985.2429.8318.091.255h.1579v-.1457l.1275-1.706.2368-2.0947.2307-2.6957.0789-.7589.3764-.9107.7468-.4918.5828.2793.4797.686-.0668.4433-.2853 1.8517-.5586 2.9021-.3643 1.9429h.2125l.2429-.2429.9835-1.3053 1.6514-2.0643.7286-.8196.85-.9046.5464-.4311h1.0321l.759 1.1293-.34 1.1657-1.0625 1.3478-.8804 1.1414-1.2628 1.7-.7893 1.36.0729.1093.1882-.0183 2.8535-.607 1.5421-.2794 1.8396-.3157.8318.3886.091.3946-.3278.8075-1.967.4857-2.3072.4614-3.4364.8136-.0425.0304.0486.0607 1.5482.1457.6618.0364h1.621l3.0175.2247.7892.522.4736.6376-.079.4857-1.2142.6193-1.6393-.3886-3.825-.9107-1.3113-.3279h-.1822v.1093l1.0929 1.0686 2.0035 1.8092 2.5075 2.3314.1275.5768-.3218.4554-.34-.0486-2.2039-1.6575-.85-.7468-1.9246-1.621h-.1275v.17l.4432.6496 2.3436 3.5214.1214 1.0807-.17.3521-.6071.2125-.6679-.1214-1.3721-1.9246L14.38 17.959l-1.1414-1.9428-.1397.079-.674 7.2552-.3156.3703-.7286.2793-.6071-.4614-.3218-.7468.3218-1.4753.3886-1.9246.3157-1.53.2853-1.9004.17-.6314-.0121-.0425-.1397.0182-1.4328 1.9672-2.1796 2.9446-1.7243 1.8456-.4128.164-.7164-.3704.0667-.6618.4008-.5889 2.386-3.0357 1.4389-1.882.929-1.0868-.0062-.1579h-.0546l-6.3385 4.1164-1.1293.1457-.4857-.4554.0608-.7467.2307-.2429 1.9064-1.3114Z"/></svg>`,En=()=>{try{return localStorage.getItem("nm-for")??"claude"}catch{return"claude"}},wn=t=>t==="claude"?"#d97757":t?"#0d99ff":"#717171",Sn=(t,e)=>`<label class="dt-pill" style="--cat:${wn(t)}"><select class="dt-for-select"${e?` data-id="${e}"`:""} aria-label="Who this is for">
|
|
2
|
-
<option value="claude"${t==="claude"?" selected":""}>AI agent</option>
|
|
3
|
-
<option value=""${t?"":" selected"}>Anyone</option>
|
|
4
|
-
${(
|
|
5
|
-
</select></label>`,
|
|
6
|
-
><svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><circle cx="10" cy="10" r="7.4"/><path d="M10 9.2v4.4M10 6.4v.6"/></svg></span>`:"",
|
|
7
|
-
<textarea class="${t}" rows="1" placeholder="${e}">${
|
|
1
|
+
import{categoryOf as ge}from"../store/categories.mjs";import{stateOf as R,STATE_LABEL as Cs}from"../store/status.mjs";import{agentName as tt,handleOf as Ns,threadOf as Bs,workingOn as Rs}from"../store/thread.mjs";import{api as j,canvasCopy as Is,host as qs,imageUrl as Ds}from"./api";import{DEVTOOLS_DEVICES as Lo}from"../devtools-devices.mjs";import{drawDevice as Os,pageTints as Ps,inkFor as xo}from"./devices";import{recentLogs as Fs}from"./logs";function Ys(v){const I=v.breakpoints,ln=v.categories,fe=(I.find(t=>!Number.isFinite(t.max))??I[0]).id,Mt=t=>I.find(e=>t>=e.min&&t<=e.max)?.id??fe,et=t=>t.breakpoint||fe,Vt=t=>v.devices.find(e=>e.id===t),E=Is,V=(t,e)=>{E||localStorage.setItem(t,e)},he=t=>t.replace(/\/+$/,"")||"/";let K=he(location.pathname);for(const t of document.querySelectorAll(".devtools .dt-icon[title]"))t.dataset.tip=t.title,t.getAttribute("aria-label")||t.setAttribute("aria-label",t.title),t.removeAttribute("title");const dn=document.querySelector(".dt-grid-btn"),Ut=document.querySelector(".dt-grid-overlay"),cn="dt-grid",be=t=>{Ut.hidden=!t,dn.setAttribute("aria-pressed",String(t)),V(cn,t?"1":"0"),O({grid:t})};dn.addEventListener("click",()=>be(Ut.hidden===!0));const un=document.querySelector(".dt-pages-name"),pn=()=>{let t=null;for(const o of document.querySelectorAll(".dt-pages a"))he(new URL(o.href).pathname)===K?(o.setAttribute("aria-current","page"),t=o):o.removeAttribute("aria-current");const e=document.title.split("\u2014").pop()?.trim(),n=t?.querySelector(".dt-menu-label")?.textContent?.trim();un.textContent=n||e||un.textContent};pn();const mn=[...document.querySelectorAll(".devtools details")];let ye=!1;const kt=()=>{const t=mn.filter(e=>e.open);for(const e of t)e.open=!1;return t};document.addEventListener("keydown",t=>{if(t.key!=="Escape")return;const[e]=kt();e&&(e.querySelector("summary")?.focus(),t.preventDefault(),t.stopImmediatePropagation())},!0),document.addEventListener("pointerdown",t=>{ye=mn.some(e=>e.open&&!e.contains(t.target))&&kt().length>0},!0),addEventListener("blur",kt);const st=document.querySelector(".dt-pad-overlay"),gn="dt-inspect",To=[".devtools",".dt-pad-overlay",".dt-grid-overlay",".dt-frame",".dt-history",".dt-review",".dt-field-menu",...v.ignore].join(", "),ve=[".devtools",".dt-notes-overlay",".dt-history",".dt-frame",".dt-review",".dt-field-menu",...v.ignore].join(", "),$e={pads:document.querySelector(".dt-pad-btn"),sizes:document.querySelector(".dt-size-btn"),type:document.querySelector(".dt-type-btn")};let pt="",Ee=0;const H=t=>{const e=parseFloat(getComputedStyle(document.documentElement).fontSize)/16,n=t/e;return Math.round(n*10)%10===0?String(Math.round(n)):n.toFixed(1)},U=(t,e,n,o,s,a="p")=>{if(n<=0||o<=0)return"";const c=s!==""?`<span class="dt-pad-chip dt-pad-chip--${a}" style="left:${t+n/2}px;top:${e+o/2}px">${s}</span>`:"";return`<span class="dt-pad-zone dt-pad-zone--${a}" style="left:${t}px;top:${e}px;width:${n}px;height:${o}px"></span>${c}`},Mo=["paddingTop","paddingRight","paddingBottom","paddingLeft","marginTop","marginRight","marginBottom","marginLeft","columnGap","rowGap"],ko=t=>{let e=t;for(let n=0;e&&n<6;n++,e=e.parentElement){const o=getComputedStyle(e);if(Mo.some(s=>parseFloat(o[s])>=2))return e}return t},Ho=(t,e)=>{const n=parseFloat(e.columnGap)||0,o=parseFloat(e.rowGap)||0;if(!(e.display.includes("flex")||e.display.includes("grid"))||!n&&!o)return"";const s=[...t.children].map(c=>c.getBoundingClientRect()).filter(c=>c.width||c.height);let a="";for(let c=1;c<s.length;c++){const d=s[c-1],r=s[c];if(n&&r.left>=d.right-1){const l=Math.max(d.top,r.top);a+=U(d.right,l,r.left-d.right,Math.min(d.bottom,r.bottom)-l,H(n),"g")}else if(o&&r.top>=d.bottom-1){const l=Math.min(d.left,r.left);a+=U(l,d.bottom,Math.max(d.right,r.right)-l,r.top-d.bottom,H(o),"g")}}return a},we=t=>`<span class="dt-pad-outline" style="left:${t.left}px;top:${t.top}px;width:${t.width}px;height:${t.height}px"></span>`,Se=(t,e,n="")=>`<span class="dt-pad-tag" style="left:${e.left}px;top:${Math.max(2,e.top-22)}px">${t.tagName.toLowerCase()+(t.classList[0]?"."+t.classList[0]:"")}${n}</span>`,Ao=t=>{const e=t.getBoundingClientRect(),n=getComputedStyle(t),o=parseFloat(n.paddingTop),s=parseFloat(n.paddingRight),a=parseFloat(n.paddingBottom),c=parseFloat(n.paddingLeft);let d=we(e);d+=U(e.left,e.top,e.width,o,o>=2?H(o):""),d+=U(e.left,e.bottom-a,e.width,a,a>=2?H(a):""),d+=U(e.left,e.top+o,c,e.height-o-a,c>=2?H(c):""),d+=U(e.right-s,e.top+o,s,e.height-o-a,s>=2?H(s):"");const r=parseFloat(n.marginTop),l=parseFloat(n.marginRight),p=parseFloat(n.marginBottom),b=parseFloat(n.marginLeft);d+=U(e.left,e.top-r,e.width,r,r>=2?H(r):"","m"),d+=U(e.left,e.bottom,e.width,p,p>=2?H(p):"","m"),d+=U(e.left-b,e.top,b,e.height,b>=2?H(b):"","m"),d+=U(e.right,e.top,l,e.height,l>=2?H(l):"","m"),d+=Ho(t,n);const i=parseFloat(n.columnGap)||0,$=parseFloat(n.rowGap)||0,k=(n.display.includes("flex")||n.display.includes("grid"))&&(i||$)?` \xB7 gap ${H(i)}${$&&$!==i?"/"+H($):""}`:"";st.innerHTML=d+Se(t,e,k)},Co=t=>{const e=t.getBoundingClientRect();st.innerHTML=we(e)+`<span class="dt-pad-chip" style="left:${e.left+e.width/2}px;top:${e.top+e.height/2}px">${H(e.width)} \xD7 ${H(e.height)}</span>`+Se(t,e)},fn=t=>{const e=(t.match(/[\d.]+/g)||[]).map(Number);if(e.length<3)return t;const n="#"+e.slice(0,3).map(o=>Math.round(o).toString(16).padStart(2,"0")).join("");return e[3]!==void 0&&e[3]<1?`${n} \xB7 ${Math.round(e[3]*100)}%`:n};let Le=null;const No=()=>{if(Le)return Le;const t=getComputedStyle(document.documentElement),e=document.createElement("span");e.style.display="none",document.body.append(e);const n=[];for(const o of Array.from(t)){if(!o.startsWith("--"))continue;const s=t.getPropertyValue(o).trim();if(!/^(#|rgb|hsl|oklch|lab|color\()/i.test(s))continue;e.style.color="rgb(1, 2, 3)",e.style.color=s;const a=getComputedStyle(e).color;a&&a!=="rgb(1, 2, 3)"&&n.push([a,o])}return e.remove(),n.sort((o,s)=>o[1].length-s[1].length),Le=n,n},Bo=t=>No().find(([e])=>e===t)?.[1]??"",Ro={100:"Thin",200:"Extra Light",300:"Light",400:"Regular",500:"Medium",600:"Semi Bold",700:"Bold",800:"Extra Bold",900:"Black"},hn=t=>(t.match(/[\d.]+/g)??[]).map(Number).concat([1]).slice(0,4),bn=(t,e)=>t.slice(0,3).map((n,o)=>n*t[3]+e[o]*(1-t[3])).concat([1]),Io=t=>{const e=[];for(let n=t;n;n=n.parentElement){const o=getComputedStyle(n);if(o.backgroundImage!=="none")return null;const s=hn(o.backgroundColor);if(s[3]>0&&(e.push(s),s[3]>=1))break}return e.reduceRight((n,o)=>bn(o,n),[255,255,255,1])},yn=t=>{const[e,n,o]=t.slice(0,3).map(s=>(s/=255,s<=.03928?s/12.92:((s+.055)/1.055)**2.4));return .2126*e+.7152*n+.0722*o},qo=(t,e,n)=>{const o=Io(t);if(!o)return["Contrast","<em>on an image</em>"];const s=bn(hn(e.color),o),[a,c]=[yn(s),yn(o)].sort((p,b)=>b-p),d=(a+.05)/(c+.05),r=n>=24||n>=18.66&&Number(e.fontWeight)>=700,l=d>=(r?4.5:7)?"AAA":d>=(r?3:4.5)?"AA":"fails AA";return["Contrast",`${d.toFixed(2)}:1 <em class="${l==="fails AA"?"dt-type-bad":""}">${l}${r?" \xB7 large":""}</em>`]},Do=t=>{const e=t.getBoundingClientRect(),n=getComputedStyle(t),o=parseFloat(n.fontSize),s=n.lineHeight==="normal"?0:parseFloat(n.lineHeight),a=parseFloat(n.letterSpacing)||0,c=Bo(n.color),d=i=>`${(i*100).toFixed(1).replace(/\.0$/,"")}%`,r=[["Font",n.fontFamily.split(",")[0].replace(/["']/g,"")+(n.fontStyle!=="normal"?` ${n.fontStyle}`:"")],["Weight",`${Ro[n.fontWeight]??""} <em>${n.fontWeight}</em>`],["Size",`${H(o)}px`],["Line",s?`${d(s/o)} <em>${H(s)}px</em>`:"normal"],["Letter",a?`${d(a/o)} <em>${a.toFixed(2).replace(/\.?0+$/,"")}px</em>`:"0"],["Color",`<i class="dt-type-sw" style="background:${n.color}"></i>${c?`${c} <em>${fn(n.color)}</em>`:fn(n.color)}`],qo(t,n,o)],p=e.bottom+150<innerHeight?e.bottom+8:Math.max(8,e.top-158),b=Math.min(Math.max(8,e.left),innerWidth-210);st.innerHTML=we(e)+Se(t,e)+`<div class="dt-type-card" style="left:${b}px;top:${p}px">${r.map(([i,$])=>`<span class="dt-type-row"><b>${i}</b><span>${$}</span></span>`).join("")}</div>`},vn=t=>{Ee||(Ee=requestAnimationFrame(()=>{Ee=0,st.hidden=!0;let e=document.elementFromPoint(t.clientX,t.clientY);if(st.hidden=!1,!e||e.closest(To)){st.innerHTML="";return}t.altKey&&e.parentElement&&e.parentElement!==document.body&&(e=e.parentElement),pt==="sizes"?Co(e):pt==="type"?Do(e):Ao(t.altKey?e:ko(e))}))},Yt=t=>{pt=t;for(const[e,n]of Object.entries($e))n.setAttribute("aria-pressed",String(e===t));V(gn,t),O({inspect:t}),st.hidden=!t,st.innerHTML="",t?document.addEventListener("mousemove",vn):document.removeEventListener("mousemove",vn)};for(const[t,e]of Object.entries($e))e.addEventListener("click",()=>{t!==pt&<(!1),Yt(pt===t?"":t)});const $n=document.querySelector(".dt-notes-btn"),xe=[...document.querySelectorAll(".dt-bp")],Jt=document.querySelector(".dt-history-btn"),F=document.querySelector(".dt-history"),Te=document.querySelector(".dt-studio-btn"),S=document.querySelector(".dt-device"),En=document.querySelector(".dt-shell"),Ht=document.querySelector('.dt-chrome[data-at="top"]'),Xt=document.querySelector('.dt-chrome[data-at="bottom"]'),At=document.querySelector(".dt-ruler"),Y=document.querySelector(".dt-devices"),mt=document.querySelector(".dt-notes-hi"),Oo=mt.querySelector(".dt-hi-box"),wn=mt.querySelector(".dt-hi-tag"),Po=[...document.querySelectorAll(".dt-frame-handle")],Sn=document.querySelector(".dt-frame-size"),Me=document.querySelector(".dt-frame-rotate"),Ct=document.querySelector(".dt-frame-bars"),N=document.querySelector(".dt-frame"),L=N.querySelector("iframe"),ke=document.querySelector(".dt-notes-count"),f=document.querySelector(".dt-notes-overlay"),Fo=".devtools, .dt-tab, .dt-notes-overlay, .dt-history, .dt-frame, .dt-review";for(const t of document.querySelectorAll(Fo))for(const e of["pointerdown","mousedown","pointerup","mouseup","touchstart","touchend","click","focusin","focusout"])t.addEventListener(e,n=>n.stopPropagation());const Ln="dt-notes";let h=[],A=!1,y=null,u=null,He=0,W="",at=[],x=null,q=[];const Zt=(t=u)=>!!(t&&(t.text?.trim()||t.images?.length)),z=()=>{u&&Zt()&&q.push(u),u=null};let Nt=null,nt=null;const xn=()=>`dt-draft:${K}${E?":canvas":""}`;let yt=xn(),Qt=0;const Ae=()=>{if(!u&&!q.length&&!W){localStorage.removeItem(yt);return}const t={draft:u,parked:q,reply:W?{for:Nt,text:W}:null};try{localStorage.setItem(yt,JSON.stringify(t))}catch{const e=n=>({...n,images:void 0});try{localStorage.setItem(yt,JSON.stringify({...t,draft:u&&e(u),parked:q.map(e)}))}catch{}}},te=()=>{clearTimeout(Qt),Qt=setTimeout(Ae,200)};addEventListener("pagehide",()=>{clearTimeout(Qt),Ae()});let J=localStorage.getItem("dt-resolved")!=="0";const jo=[[/Edg\/(\d+)/,"Edge"],[/OPR\/(\d+)/,"Opera"],[/Firefox\/(\d+)/,"Firefox"],[/Chrome\/(\d+)/,"Chrome"],[/Version\/(\d+).*Safari/,"Safari"]],Ko=[[/iPhone|iPad/,"iOS"],[/Android/,"Android"],[/Mac OS X/,"macOS"],[/Windows/,"Windows"],[/Linux/,"Linux"]],Wo=()=>{const t=navigator.userAgent,e=a=>a.find(([c])=>c.test(t)),n=e(jo),o=e(Ko),s=n?n[0].exec(t)?.[1]:null;return[n?`${n[1]}${s?" "+s:""}`:"unknown browser",o?.[1]].filter(Boolean).join(" \xB7 ")},rt=()=>Mt(innerWidth),ee=()=>nt??rt(),Bt=()=>{const t=ee();for(const e of xe)e.setAttribute("aria-pressed",String(e.dataset.bp===t))},zo=t=>{const e=[];let n=t;for(;n&&n.tagName!=="HTML"&&e.length<8;){if(n.id){e.unshift("#"+CSS.escape(n.id));break}const o=n.parentElement,s=n.tagName.toLowerCase(),a=o?[...o.children].filter(c=>c.tagName===n.tagName):[];e.unshift(a.length>1?`${s}:nth-of-type(${a.indexOf(n)+1})`:s),n=o}return e.join(">")},Ce=(t,e)=>!e||_(t.textContent||"").slice(0,60)===e,_o=(t,e)=>[t||"*",...(e||[]).map(n=>"."+CSS.escape(n))].join(""),Tn=t=>{try{return[...document.querySelectorAll(_o(t.tag,t.classes))]}catch{return[]}},Mn=t=>{const e=_(t.textContent||"").replace(/\s+/g," ");for(let n=t.parentElement,o=0;n&&n!==document.body&&o<4;n=n.parentElement,o++){const s=_(n.textContent||"").replace(/\s+/g," ");if(s&&s!==e)return s}return""},Go=t=>Mn(t).slice(0,80),Ne=(t,e)=>!e||Mn(t).startsWith(e),X=t=>{let e=null;try{e=document.querySelector(t.selector)}catch{e=null}if(e&&Ce(e,t.label)&&Ne(e,t.ctx))return e;const n=Tn(t),o=_(t.label)?n.filter(a=>Ce(a,t.label)):[];return(o.find(a=>Ne(a,t.ctx))??n.find(a=>t.ctx&&Ne(a,t.ctx)&&!_(t.label)))||o[0]||(e&&Ce(e,t.label)?e:null)||(t.nth!=null?n[t.nth]:null)||n[0]||e},Vo=t=>{let e=null;for(let n=t,o=t.parentElement;o&&o!==document.body&&getComputedStyle(n).position!=="fixed";n=o,o=o.parentElement){const s=getComputedStyle(o);if(s.overflowX==="visible"&&s.overflowY==="visible")continue;const a=o.getBoundingClientRect();e=e?{l:Math.max(e.l,a.left),t:Math.max(e.t,a.top),r:Math.min(e.r,a.right),b:Math.min(e.b,a.bottom)}:{l:a.left,t:a.top,r:a.right,b:a.bottom}}return e},Z=t=>{const e=X(t);if(!e)return null;const n=e.getBoundingClientRect();if(!n.width&&!n.height)return null;const o=n.left+n.width*t.rx,s=n.top+n.height*t.ry,a=Vo(e);if(!a)return{x:o,y:s,off:""};if(a.r-a.l<18||a.b-a.t<18)return null;const c=Math.min(Math.max(o,a.l),a.r-18),d=Math.min(Math.max(s,a.t+18),a.b),r=o<a.l?"l":o>a.r-18?"r":s<a.t+18?"t":s>a.b?"b":"";return{x:c,y:d,off:r}},kn=t=>{for(let e=t;e&&e!==document.body;e=e.parentElement)if(e.getAnimations().some(n=>n.playState==="running"))return!0;return!1};let ne=[];const Be=t=>{for(const e of ne)e.play();ne=[];for(let e=t;e&&e!==document.body;e=e.parentElement)for(const n of e.getAnimations())n.playState==="running"&&(n.pause(),ne.push(n))},Hn=()=>{if(u)return X(u);const t=y!=null?h.find(n=>n.id===y):null;if(!t)return null;const e=Z(t);return e&&!e.off?X(t):null},An=t=>t?new Date(t).toLocaleString(void 0,{day:"numeric",month:"short",hour:"2-digit",minute:"2-digit"}):"",oe='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M4 6h12M8 6V4.2h4V6M6.6 6l.55 9.8h5.7L13.4 6"/></svg>',Uo='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M3.5 4.5h13v3h-13zM4.8 7.5v8h10.4v-8M8.2 10.5h3.6"/></svg>',Rt='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M4.8 10.4 8.2 13.8l7-7.6" stroke-linejoin="round"/></svg>',Re='<svg viewBox="0 0 20 20" width="12" height="12" aria-hidden="true"><path d="M12.6 4.4l3 3-8.4 8.4H4.2v-3z" stroke-linejoin="round"/></svg>',se='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M5.4 5.4l9.2 9.2M14.6 5.4l-9.2 9.2"/></svg>',Yo='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M12 5l-5 5 5 5" stroke-linejoin="round"/></svg>',Jo='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M8 5l5 5-5 5" stroke-linejoin="round"/></svg>',Xo='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M4.5 8.5h7.5a3.5 3.5 0 0 1 0 7H8.5M7.5 5.5l-3 3 3 3" stroke-linejoin="round"/></svg>',It=t=>`<svg viewBox="0 0 24 24" width="${t}" height="${t}" aria-hidden="true" class="dt-claude"><path d="m4.7144 15.9555 4.7174-2.6471.079-.2307-.079-.1275h-.2307l-.7893-.0486-2.6956-.0729-2.3375-.0971-2.2646-.1214-.5707-.1215-.5343-.7042.0546-.3522.4797-.3218.686.0608 1.5179.1032 2.2767.1578 1.6514.0972 2.4468.255h.3886l.0546-.1579-.1336-.0971-.1032-.0972L6.973 9.8356l-2.55-1.6879-1.3356-.9714-.7225-.4918-.3643-.4614-.1578-1.0078.6557-.7225.8803.0607.2246.0607.8925.686 1.9064 1.4754 2.4893 1.8336.3643.3035.1457-.1032.0182-.0728-.164-.2733-1.3539-2.4467-1.445-2.4893-.6435-1.032-.17-.6194c-.0607-.255-.1032-.4674-.1032-.7285L6.287.1335 6.6997 0l.9957.1336.419.3642.6192 1.4147 1.0018 2.2282 1.5543 3.0296.4553.8985.2429.8318.091.255h.1579v-.1457l.1275-1.706.2368-2.0947.2307-2.6957.0789-.7589.3764-.9107.7468-.4918.5828.2793.4797.686-.0668.4433-.2853 1.8517-.5586 2.9021-.3643 1.9429h.2125l.2429-.2429.9835-1.3053 1.6514-2.0643.7286-.8196.85-.9046.5464-.4311h1.0321l.759 1.1293-.34 1.1657-1.0625 1.3478-.8804 1.1414-1.2628 1.7-.7893 1.36.0729.1093.1882-.0183 2.8535-.607 1.5421-.2794 1.8396-.3157.8318.3886.091.3946-.3278.8075-1.967.4857-2.3072.4614-3.4364.8136-.0425.0304.0486.0607 1.5482.1457.6618.0364h1.621l3.0175.2247.7892.522.4736.6376-.079.4857-1.2142.6193-1.6393-.3886-3.825-.9107-1.3113-.3279h-.1822v.1093l1.0929 1.0686 2.0035 1.8092 2.5075 2.3314.1275.5768-.3218.4554-.34-.0486-2.2039-1.6575-.85-.7468-1.9246-1.621h-.1275v.17l.4432.6496 2.3436 3.5214.1214 1.0807-.17.3521-.6071.2125-.6679-.1214-1.3721-1.9246L14.38 17.959l-1.1414-1.9428-.1397.079-.674 7.2552-.3156.3703-.7286.2793-.6071-.4614-.3218-.7468.3218-1.4753.3886-1.9246.3157-1.53.2853-1.9004.17-.6314-.0121-.0425-.1397.0182-1.4328 1.9672-2.1796 2.9446-1.7243 1.8456-.4128.164-.7164-.3704.0667-.6618.4008-.5889 2.386-3.0357 1.4389-1.882.929-1.0868-.0062-.1579h-.0546l-6.3385 4.1164-1.1293.1457-.4857-.4554.0608-.7467.2307-.2429 1.9064-1.3114Z"/></svg>`,Cn=()=>{try{return localStorage.getItem("nm-for")??"claude"}catch{return"claude"}},qt=t=>t==="claude"?"#d97757":t?"#0d99ff":"#717171",Nn=(t,e)=>`<label class="dt-field"><span class="dt-field-label">For</span><span class="dt-field-box" style="--cat:${qt(t)}"><select class="dt-for-select"${e?` data-id="${e}"`:""} aria-label="Who this is for">
|
|
2
|
+
<option value="claude" data-c="${qt("claude")}"${t==="claude"?" selected":""}>AI agent</option>
|
|
3
|
+
<option value="" data-c="${qt("")}"${t?"":" selected"}>Anyone</option>
|
|
4
|
+
${(v.team??[]).filter(n=>n.email!==v.me?.email).map(n=>`<option value="${m(n.email)}" data-c="${qt(n.email)}"${t===n.email?" selected":""}>${m(n.name||n.email)}</option>`).join("")}
|
|
5
|
+
</select></span></label>`,Bn=t=>{const e=_(t?.textContent).replace(/\s+/g," ");return e&&e.length<=2e3?e:""},Zo=t=>`<div class="dt-suggest dt-suggest--read"><del>${m(t.from)}</del><ins>${m(t.to)}</ins></div>`,_=t=>(t??"").replace(/[\u200B-\u200D\uFEFF\u2060]/g,"").trim(),Rn=t=>_(t)?`<span class="dt-note-info" data-tip="${m(_(t))}"
|
|
6
|
+
><svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><circle cx="10" cy="10" r="7.4"/><path d="M10 9.2v4.4M10 6.4v.6"/></svg></span>`:"",In=(t,e)=>`<label class="dt-field"><span class="dt-field-label">Type</span><span class="dt-field-box" style="--cat:${ge(t).color}"><select class="dt-cat-select"${e?` data-id="${e}"`:""} aria-label="Type">${ln.map(n=>`<option value="${n.id}" data-c="${n.color}"${n.id===t?" selected":""}>${n.label}</option>`).join("")}</select></span></label>`,Qo='<svg viewBox="0 0 20 20" width="9" height="9" aria-hidden="true"><path d="M5.5 5.5l9 9M14.5 5.5l-9 9"/></svg>',qn=t=>t.startsWith("data:video/")||/\.webm(\?|$)/i.test(t),Dn=(t,e,n=t)=>`<span class="dt-shot${qn(n)?" dt-shot--video":""}">${qn(n)?`<video src="${t}" controls preload="metadata" playsinline></video>`:`<a href="${t}" target="_blank"><img src="${t}" alt="" loading="lazy" /></a>`}${e===void 0?"":`<button class="dt-shot-rm" data-act="unshot" ${e} aria-label="Remove">${Qo}</button>`}</span>`,On=(t=[],e)=>t.length?`<div class="dt-note-shots">${t.map(n=>{const o=n.split("/").pop(),s=Ds(o);return Dn(s,e===void 0?void 0:`data-id="${e}" data-img="${m(o)}"`,o)}).join("")}</div>`:"",Pn=(t=[])=>t.length?`<div class="dt-note-shots">${t.map((e,n)=>Dn(e,`data-i="${n}"`)).join("")}</div>`:"",ts='<svg viewBox="0 0 20 20" width="15" height="15" aria-hidden="true"><rect x="2.5" y="5.5" width="11" height="9" rx="2"/><path d="m13.5 9 4-2.5v7l-4-2.5"/></svg>',es=!1,ns=!1,os=!!navigator.mediaDevices?.getDisplayMedia&&typeof MediaRecorder<"u";let gt=null;const ss=async t=>{if(gt){gt.stop();return}let e;try{e=await navigator.mediaDevices.getDisplayMedia({video:{frameRate:12},audio:!1})}catch{return}const n=await navigator.mediaDevices.getUserMedia({audio:!0}).catch(()=>null),o=new MediaStream([...e.getVideoTracks(),...n?.getAudioTracks()??[]]),s=["video/webm;codecs=vp9,opus","video/webm;codecs=vp8,opus","video/webm"].find(l=>MediaRecorder.isTypeSupported(l));if(!s){for(const l of e.getTracks())l.stop();G("This browser cannot record WebM video.");return}const a=new MediaRecorder(o,{mimeType:s,videoBitsPerSecond:6e5,audioBitsPerSecond:32e3}),c=[],d=!!Number(t?.dataset.id);a.ondataavailable=l=>{l.data.size&&c.push(l.data)};const r=setTimeout(()=>{a.state!=="inactive"&&a.stop()},3e4);a.onstop=async()=>{clearTimeout(r);for(const b of[...e.getTracks(),...n?.getTracks()??[]])b.stop();gt=null;const l=new Blob(c,{type:"video/webm"});if(l.size>32e5){G("That recording is too big to send \u2014 keep it shorter."),g();return}const p=await new Promise(b=>{const i=new FileReader;i.onload=()=>b(String(i.result)),i.readAsDataURL(l)});d?at.push(p):u&&(u.images??=[]).push(p),g()},e.getVideoTracks()[0]?.addEventListener("ended",()=>{a.state!=="inactive"&&a.stop()}),gt=a,a.start(1e3),g()},as='<svg viewBox="0 0 20 20" width="15" height="15" aria-hidden="true"><rect x="3" y="4" width="14" height="12" rx="2"/><circle cx="7.5" cy="8.5" r="1.4"/><path d="m3.5 14.5 4-4 3 3 2-2 4 4"/></svg>',Fn=(t,e,n,o,s="")=>`<div class="dt-note-foot"><div class="dt-compose">
|
|
7
|
+
<textarea class="${t}" rows="1" placeholder="${e}">${m(n)}</textarea>
|
|
8
8
|
${s}
|
|
9
9
|
<div class="dt-compose-bar">
|
|
10
|
-
<span class="dt-compose-tools"><button class="dt-attach" data-act="attach" title="Attach a screenshot \u2014 or paste or drop one">${
|
|
11
|
-
${
|
|
10
|
+
<span class="dt-compose-tools"><button class="dt-attach" data-act="attach" title="Attach a screenshot \u2014 or paste or drop one">${as}</button>
|
|
11
|
+
${ns&&os?`<button class="dt-record${gt?" is-on":""}" data-act="record" title="${gt?"Stop recording":"Record the screen, up to 30 seconds"}">${gt?"Stop":ts}</button>`:""}</span>
|
|
12
12
|
<button class="dt-send${n.trim()?" is-ready":""}" ${o} title="Send (Enter)"
|
|
13
13
|
><svg viewBox="0 0 20 20" width="14" height="14" aria-hidden="true"><path d="M10 15.5v-11M5.5 9 10 4.5 14.5 9"/></svg></button>
|
|
14
14
|
</div>
|
|
15
|
-
</div></div>`,
|
|
16
|
-
title="Resolved by ${
|
|
17
|
-
class="dt-note-resolve${n?" is-on":""}" title="${n?"Reopen":t==="claude"?"Looks right \u2014 mark it resolved":"Resolve"}">${
|
|
18
|
-
style="left:${
|
|
19
|
-
title="${
|
|
20
|
-
style="left:${
|
|
15
|
+
</div></div>`,Ie=(t,e)=>(t||"element")+(e?.[0]?"."+e[0]:""),jn=()=>q.map((t,e)=>({i:e,el:Ie(t.tag,t.classes),text:_(t.text??""),shots:t.images?.length??0,orphan:!Z(t)}));let qe=[],Kn="";const rs=(t,e)=>t!=="claude"?"":`<button class="dt-note-state" data-act="reopen" data-id="${e}"
|
|
16
|
+
title="Resolved by ${m(tt(h.find(n=>n.id===e)?.doneAgent))} \u2014 click to clear">${It(13)}</button>`,Wn=(t,e)=>{const n=t==="done";return`${rs(t,e)}<button data-act="${n?"reopen":"done"}" data-id="${e}"
|
|
17
|
+
class="dt-note-resolve${n?" is-on":""}" title="${n?"Reopen":t==="claude"?"Looks right \u2014 mark it resolved":"Resolve"}">${Rt}</button>`},is=(t,e)=>j("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify(e?{id:t,status:"done",doneBy:"you"}:{id:t,status:"open",doneBy:null})}),vt=async(t,e,n)=>{const o=h,s=Q;h=t(h),Q=t(Q),g();const a=await e().catch(()=>null);if(!a?.ok){h=o,Q=s,g(),G(`${n} did not go through${a?` (${a.status})`:""}.`);return}de()},Dt=(t,e)=>vt(n=>n.map(o=>o.id===t?{...o,status:e?"done":"open",doneBy:e?"you":null}:o),()=>is(t,e),e?"Resolving":"Reopening"),ls=t=>vt(e=>e.map(n=>n.id===t?{...n,status:"done",doneBy:n.status==="done"?n.doneBy:"you",archivedAt:new Date().toISOString()}:n),()=>j("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:t,archive:!0})}),"Archiving"),zn=t=>vt(e=>e.filter(n=>n.id!==t),()=>j(`comments?id=${t}`,{method:"DELETE"}),"Deleting"),m=t=>t.replace(/[&<>"]/g,e=>({"&":"&","<":"<",">":">",'"':"""})[e]),ds=t=>{const e=h.filter(s=>et(s)===t),n=e.filter(s=>R(s)==="open").length,o=e.filter(s=>R(s)==="claude").length;ke.innerHTML=n?String(n):o?It(9):"\u2713",ke.dataset.state=n?"open":o?"claude":"done",ke.hidden=e.length===0},g=()=>{if(te(),E){const r=jn(),l=JSON.stringify(r);l!==Kn&&(Kn=l,parent.postMessage({dt:!0,drafts:r},location.origin))}Bt(),y!==Nt&&(W="",at=[],Nt=y),x&&x.id!==y&&(x=null);const t=ee();if(ds(t),!A){f.innerHTML="",Be(null);return}const e=t;let n="";const o=h.filter(r=>et(r)===e&&(J||R(r)!=="done"));for(const r of o){const l=Z(r);if(!l&&y!==r.id)continue;const p=R(r),b=p==="done",i=!l,$=l??{x:0,y:0},k=ge(r.category),B=Rs(r);if(i||(n+=`<button class="dt-pin dt-pin--${p}${B?" dt-pin--working":""}" data-id="${r.id}"${l?.off?` data-off="${l.off}"`:""} aria-label="Comment ${r.id}, ${p==="open"?"open":p==="claude"?`resolved by ${m(tt(r.doneAgent))}`:"resolved"}" aria-expanded="${y===r.id}"
|
|
18
|
+
style="left:${$.x}px;top:${$.y}px;--cat:${k.color}"
|
|
19
|
+
title="${m(r.text.slice(0,80))} \xB7 ${k.label}${B?` \xB7 ${m(tt(B.agent))} is on it`:""}${p==="claude"?` \xB7 resolved by ${m(tt(r.doneAgent))} \u2014 tick to confirm`:p==="done"?" \xB7 resolved":""}">${p==="done"?"\u2713":p==="claude"?It(11):""}</button>`),y===r.id){const ut=Bs(r);n+=`<div class="dt-note${i?" dt-note--orphan":""}" data-id="${r.id}" role="dialog" aria-label="Comment ${r.id}"
|
|
20
|
+
style="left:${$.x}px;top:${$.y}px">
|
|
21
21
|
<div class="dt-note-bar">
|
|
22
|
-
<span class="dt-note-el">${
|
|
23
|
-
${
|
|
22
|
+
<span class="dt-note-el">${v.client?`Comment #${us(r)}`:m(Ie(r.tag,r.classes))}</span>
|
|
23
|
+
${Rn(r.label)}
|
|
24
24
|
<span class="dt-note-tools">
|
|
25
|
-
${
|
|
25
|
+
${Wn(p,r.id)}
|
|
26
26
|
<i class="dt-note-sep"></i>
|
|
27
|
-
|
|
28
|
-
<button data-act="
|
|
27
|
+
${v.client?"":`<button data-act="archive" data-id="${r.id}" title="Archive \u2014 resolved and put away">${Uo}</button>`}
|
|
28
|
+
<button data-act="rm" data-id="${r.id}" title="Delete this thread">${oe}</button>
|
|
29
|
+
<button data-act="close" data-id="${r.id}" title="Close">${se}</button>
|
|
29
30
|
</span>
|
|
30
31
|
</div>
|
|
31
|
-
${
|
|
32
|
+
${B?`<p class="dt-note-working"><i></i>${m(tt(B.agent))} is on it</p>`:""}
|
|
32
33
|
${i?'<p class="dt-note-orphan">The element this was pinned to is not on the page right now.</p>':""}
|
|
33
|
-
|
|
34
|
+
${(()=>{const T=In(ge(r.category).id,r.id)+(v.client?"":Nn(r.assignee??"",r.id))+(r.host&&r.host!==location.host?`<span class="dt-note-host" title="Written on ${m(r.host)}">${m(r.host)}</span>`:"");return T?`<div class="dt-note-meta">${T}</div>`:""})()}
|
|
34
35
|
<div class="dt-note-thread">
|
|
35
|
-
${
|
|
36
|
-
<textarea class="dt-note-edit-input" rows="1">${
|
|
37
|
-
${
|
|
36
|
+
${ut.map((T,Tt)=>{const Eo=Tt===0?null:T.at??null,sn=T.author==="you"&&(!T.by||T.by===v.me?.email),wo=sn&&x?.id===r.id&&x.at===Eo,an=T.author==="claude"?null:v.team?.find(rn=>rn.email===T.by),As=T.author==="claude"?tt(T.agent):sn?"You":an?.name||T.byName||T.by||"You",So=`<div class="dt-msg-head">${an?.avatar_url?`<img class="dt-msg-face" src="${m(an.avatar_url)}" alt="">`:""}<b>${m(As)}</b><time>${An(T.at)}</time>${sn&&!wo?`<button class="dt-msg-edit" data-act="edit" data-id="${r.id}" data-at="${m(Eo??"")}" title="Edit">${Re}</button>`:""}</div>`;return wo?`<div class="dt-msg">${So}<div class="dt-compose">
|
|
37
|
+
<textarea class="dt-note-edit-input" rows="1">${m(x.text)}</textarea>
|
|
38
|
+
${On(T.images.filter(rn=>!x.drop.includes(rn.split("/").pop())),r.id)}
|
|
38
39
|
<div class="dt-compose-bar">
|
|
39
40
|
<button class="dt-edit-cancel" data-act="edit-cancel">Cancel</button>
|
|
40
|
-
<button class="dt-send${
|
|
41
|
+
<button class="dt-send${x.text.trim()?" is-ready":""}" data-act="edit-save" title="Save (Enter)">${Rt}</button>
|
|
41
42
|
</div>
|
|
42
|
-
</div></div>`:`<div class="dt-msg" data-msg="${
|
|
43
|
+
</div></div>`:`<div class="dt-msg" data-msg="${r.id}:${m(T.at??"0")}">${So}<p>${m(T.text)}</p>${Tt===0&&r.suggest?Zo(r.suggest):""}${On(T.images)}</div>`}).join("")}
|
|
43
44
|
</div>
|
|
44
|
-
${
|
|
45
|
-
</div>`}}
|
|
46
|
-
style="left:${
|
|
47
|
-
<div class="dt-note${s?"":" dt-note--orphan"}" data-draft style="left:${
|
|
45
|
+
${Fn("dt-note-reply-input","Reply",W,`data-act="reply" data-id="${r.id}"`,Pn(at))}
|
|
46
|
+
</div>`}}q.forEach((r,l)=>{const p=Z(r);p&&(n+=`<button class="dt-pin dt-pin--draft" data-parked="${l}" data-act="draft-open" data-i="${l}"
|
|
47
|
+
style="left:${p.x}px;top:${p.y}px" title="Draft, not sent \u2014 click to finish it">${Re}</button>`)});const s=u&&Z(u);if(u){const r=s?.x??0,l=s?.y??0;n+=`${s?`<span class="dt-pin dt-pin--draft" data-draft style="left:${r}px;top:${l}px"></span>`:""}
|
|
48
|
+
<div class="dt-note${s?"":" dt-note--orphan"}" data-draft style="left:${r}px;top:${l}px">
|
|
48
49
|
<div class="dt-note-bar">
|
|
49
|
-
<span class="dt-note-el">${
|
|
50
|
-
${
|
|
51
|
-
${
|
|
50
|
+
<span class="dt-note-el">${v.client?"New comment":m(Ie(u.tag,u.classes))}</span>
|
|
51
|
+
${Rn(u.label)}
|
|
52
|
+
${Zt()?'<span class="dt-note-draft">Draft</span>':""}
|
|
52
53
|
<span class="dt-note-tools">
|
|
53
|
-
<button data-act="discard" title="Discard this draft">${
|
|
54
|
-
<button data-act="cancel" title="Close \u2014 the draft stays">${
|
|
54
|
+
<button data-act="discard" title="Discard this draft">${oe}</button>
|
|
55
|
+
<button data-act="cancel" title="Close \u2014 the draft stays">${se}</button>
|
|
55
56
|
</span>
|
|
56
57
|
</div>
|
|
57
58
|
${s?"":'<p class="dt-note-orphan">The element this was pinned to is not on the page right now.</p>'}
|
|
58
|
-
${(()=>{const
|
|
59
|
-
<div class="dt-note-meta">${
|
|
60
|
-
${u.suggest?`<div class="dt-suggest"><span class="dt-suggest-head">Should read<button data-act="unsuggest" title="No text change">${
|
|
61
|
-
<textarea class="dt-suggest-input" rows="2">${
|
|
62
|
-
${
|
|
63
|
-
</div>`}const
|
|
59
|
+
${(()=>{const p=s?X(u):null,b=p&&h.find(i=>i.id>0&&R(i)==="open"&&X(i)===p);return b?`<p class="dt-note-twin">Already open here: \u201C${m(b.text.slice(0,60))}${b.text.length>60?"\u2026":""}\u201D <button data-act="twin" data-id="${b.id}">Open it</button></p>`:""})()}
|
|
60
|
+
<div class="dt-note-meta">${In(u.category)}${v.client?"":Nn(u.assignee??Cn())}</div>
|
|
61
|
+
${u.suggest?`<div class="dt-suggest"><span class="dt-suggest-head">Should read<button data-act="unsuggest" title="No text change">${se}</button></span>
|
|
62
|
+
<textarea class="dt-suggest-input" rows="2">${m(u.suggest.to)}</textarea></div>`:es&&Bn(s?X(u):null)?'<button class="dt-suggest-btn" data-act="suggest">Suggest the text</button>':""}
|
|
63
|
+
${Fn("dt-note-input",u.suggest?"Why (optional)":"Comment",u.text??"",'data-act="save"',Pn(u.images))}
|
|
64
|
+
</div>`}const a=new Map([...f.querySelectorAll(".dt-note[data-id] .dt-note-thread")].map(r=>[r.closest(".dt-note").dataset.id,{top:r.scrollTop,end:r.scrollTop+r.clientHeight>=r.scrollHeight-4}])),c=new Set([...f.querySelectorAll("[data-msg]")].map(r=>r.dataset.msg));f.innerHTML=n;for(const r of f.querySelectorAll(".dt-note[data-id] .dt-note-thread")){const l=r.closest(".dt-note").dataset.id,p=a.get(l);if(!p)continue;const b=[...r.querySelectorAll("[data-msg]")].filter(i=>!c.has(i.dataset.msg));for(const i of b)i.classList.add("dt-msg--new");r.scrollTop=p.end&&b.length?r.scrollHeight:p.top}for(const r of f.querySelectorAll(".dt-note")){const l=r.getBoundingClientRect();l.bottom>innerHeight-8&&(r.dataset.flip="1"),l.right>innerWidth-8&&(r.dataset.flipx="1")}_n(e),Be(Hn()),it();for(const r of f.querySelectorAll(".dt-note-input, .dt-note-reply-input, .dt-note-edit-input"))Ve(r);const d=f.querySelector(".dt-note-input");d&&(d.focus(),d.setSelectionRange(d.value.length,d.value.length))},cs=()=>{let t=!1;for(const e of f.querySelectorAll(".dt-pin[data-id], .dt-note[data-id]")){if(e.classList.contains("dt-note--orphan"))continue;const n=h.find(s=>s.id===Number(e.dataset.id)),o=n&&Z(n);if(!o){e.style.visibility="hidden";continue}e.style.visibility="",e.style.left=`${o.x}px`,e.style.top=`${o.y}px`,e.classList.contains("dt-pin")&&(o.off?e.dataset.off=o.off:delete e.dataset.off),n&&kn(X(n))&&(t=!0)}for(const e of f.querySelectorAll("[data-draft], [data-parked]")){if(e.classList.contains("dt-note--orphan"))continue;const n=e.dataset.parked?q[Number(e.dataset.parked)]:u,o=n&&Z(n);if(!o){e.style.visibility="hidden";continue}e.style.visibility="",e.style.left=`${o.x}px`,e.style.top=`${o.y}px`}if(!ne.length&&(u||y!=null)){const e=Hn();e&&kn(e)&&Be(e)}t&&it()},us=t=>h.filter(e=>et(e)===et(t)).findIndex(e=>e.id===t.id)+1,_n=t=>{if(F.hidden)return;const e=h.filter(i=>et(i)===t),n=new Map(e.map((i,$)=>[i.id,$+1])),o={open:[],claude:[],done:[]};for(const i of e)o[R(i)].push(i);const s=i=>{const $=(i.replies?.length??0)+(i.note?1:0),k=ge(i.category),B=R(i),ut=B==="claude",T=!Z(i),Tt=i.replies?.length?i.replies[i.replies.length-1]:i.note?{author:"claude",text:i.note}:{author:"you",text:i.text};return`<div class="dt-hist-row is-${B}${T?" is-orphan":""}">
|
|
64
65
|
<button class="dt-hist-go" data-go="${i.id}">
|
|
65
|
-
<span class="dt-hist-n" style="--cat:${
|
|
66
|
+
<span class="dt-hist-n" style="--cat:${k.color}">${ut?It(8):""}</span>
|
|
66
67
|
<span class="dt-hist-body">
|
|
67
|
-
<span class="dt-hist-id">#${n.get(i.id)}<em>${
|
|
68
|
-
<span class="dt-hist-text">${
|
|
69
|
-
<span class="dt-hist-meta">${
|
|
68
|
+
<span class="dt-hist-id">#${n.get(i.id)}<em>${k.label}</em>${ut?`<b class="dt-hist-claude" data-unmark="${i.id}" role="button" tabindex="0" title="Resolved by ${m(tt(i.doneAgent))} \u2014 click to clear: back to open">${It(9)}${m(tt(i.doneAgent))}<i aria-hidden="true">\xD7</i></b>`:""}${T?'<b class="dt-hist-orphan" title="The element this was pinned to is not on the page right now">no pin</b>':""}</span>
|
|
69
|
+
<span class="dt-hist-text">${Tt.author==="claude"?`<b>${m(tt(Tt.agent))}:</b> `:""}${m(Tt.text)}</span>
|
|
70
|
+
<span class="dt-hist-meta">${An(i.updatedAt||i.createdAt)}${i.device?` \xB7 ${m(i.device)}`:i.browser?` \xB7 ${m(i.browser)}`:""}${$?` \xB7 ${$} repl${$===1?"y":"ies"}`:""}</span>
|
|
70
71
|
</span>
|
|
71
72
|
</button>
|
|
72
|
-
<span class="dt-note-tools dt-hist-tools">${
|
|
73
|
-
><button data-rm="${i.id}" title="Delete this comment">${
|
|
74
|
-
</div>`},
|
|
75
|
-
title="${i.label}: ${
|
|
76
|
-
><svg viewBox="0 0 20 20" width="11" height="11" aria-hidden="true">${i.icon}</svg><i>${
|
|
73
|
+
<span class="dt-note-tools dt-hist-tools">${Wn(B,i.id)}<i class="dt-note-sep"></i
|
|
74
|
+
><button data-rm="${i.id}" title="Delete this comment">${oe}</button></span>
|
|
75
|
+
</div>`},a=I.find(i=>i.id===t),c=I.map(i=>{const $=h.filter(k=>et(k)===i.id&&R(k)!=="done");return{band:i,open:$.filter(k=>R(k)==="open").length,total:$.length}}).filter(i=>i.total&&i.band.id!==t),d=c.length?`<i class="dt-hist-sep"></i><div class="dt-hist-bands">${c.map(({band:i,open:$,total:k})=>`<button data-bp="${i.id}" data-state="${$?"open":"claude"}"
|
|
76
|
+
title="${i.label}: ${$} open \xB7 ${k-$} to check"
|
|
77
|
+
><svg viewBox="0 0 20 20" width="11" height="11" aria-hidden="true">${i.icon}</svg><i>${k}</i></button>`).join("")}</div>`:"",l=["open","claude","done"].filter(i=>o[i].length&&(i!=="done"||J)),p=N.hidden?jn():qe,b=i=>`<div class="dt-hist-row is-draft">
|
|
77
78
|
<button class="dt-hist-go" data-draft-go="${i.i}">
|
|
78
|
-
<span class="dt-hist-n">${
|
|
79
|
+
<span class="dt-hist-n">${Re}</span>
|
|
79
80
|
<span class="dt-hist-body">
|
|
80
|
-
<span class="dt-hist-id">${
|
|
81
|
-
<span class="dt-hist-text">${i.text?
|
|
81
|
+
<span class="dt-hist-id">${m(i.el)}${i.orphan?'<b class="dt-hist-orphan" title="The element this was pinned to is not on the page right now">no pin</b>':""}</span>
|
|
82
|
+
<span class="dt-hist-text">${i.text?m(i.text):`${i.shots} screenshot${i.shots===1?"":"s"}`}</span>
|
|
82
83
|
</span>
|
|
83
84
|
</button>
|
|
84
|
-
<span class="dt-note-tools dt-hist-tools"><button data-draft-rm="${i.i}" title="Discard this draft">${
|
|
85
|
-
</div>`;
|
|
86
|
-
<span class="dt-hist-here" title="${
|
|
87
|
-
><svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true">${
|
|
85
|
+
<span class="dt-note-tools dt-hist-tools"><button data-draft-rm="${i.i}" title="Discard this draft">${oe}</button></span>
|
|
86
|
+
</div>`;F.innerHTML=`<div class="dt-hist-head">
|
|
87
|
+
<span class="dt-hist-here" title="${a?.label??t}"
|
|
88
|
+
><svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true">${a?.icon??""}</svg></span>
|
|
88
89
|
<span class="dt-hist-title">Comments</span>
|
|
89
90
|
${d}
|
|
90
|
-
${
|
|
91
|
+
${ft().length&&!E?`<button class="dt-review-btn" data-review aria-label="Check all ${ft().length} ${ft().length===1?"fix":"fixes"}" data-tip="${ft().length} ${ft().length===1?"fix waits":"fixes wait"} for a look across every page \u2014 walk through them">${Rt}${ft().length}</button>`:""}
|
|
91
92
|
<button class="dt-hist-refresh" data-refresh aria-label="Reload comments from the file">
|
|
92
93
|
<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M16 10a6 6 0 1 1-1.8-4.3"/><path d="M16.3 3.4v3.4h-3.4"/></svg>
|
|
93
94
|
</button>
|
|
94
95
|
<button class="dt-hist-fold" data-fold aria-label="Collapse or expand the panel">
|
|
95
96
|
<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M5.5 8.5 10 12.5l4.5-4"/></svg>
|
|
96
97
|
</button>
|
|
97
|
-
</div>`+(l.length||
|
|
98
|
-
|
|
99
|
-
|
|
100
|
-
|
|
101
|
-
${b}`:""}},Nt=t=>(Array.isArray(t)?t:[]).filter(e=>e&&Number.isInteger(Number(e.id))&&typeof e.text=="string").map(e=>({...e,id:Number(e.id),rx:Number(e.rx)||0,ry:Number(e.ry)||0,route:typeof e.route=="string"&&/^\/(?!\/)/.test(e.route)?e.route:"/",replies:Array.isArray(e.replies)?e.replies.filter(n=>typeof n?.text=="string"):[],images:Array.isArray(e.images)?e.images.filter(n=>typeof n=="string"):[]})),Jt=async()=>{try{jn(Nt((await(await U("comments")).json()).comments)),!D.hidden&&!$&&p()}catch{}};let Xt="",Re=!1;const Bt=async()=>{if(!(document.hidden||Re)){Re=!0;try{const t=await U(`comments${Xt?`?since=${Xt}`:""}`);if(t.status!==200)return;const e=await t.json();Xt=e.version??"";const n=Nt(e.comments);jn(n);const o=n.filter(s=>s.route===P);if(JSON.stringify(o)===JSON.stringify(h))return;if(f.contains(document.activeElement)&&document.activeElement.matches("textarea, input")){Xt="",setTimeout(Bt,5e3);return}h=o,p(),q({reload:!0})}catch{}finally{Re=!1}}},gt=async()=>{try{const t=await U(`comments?route=${encodeURIComponent(P)}`);h=Nt((await t.json()).comments)}catch{h=[]}p()};let qe=0;const Kn=t=>{qe||(qe=requestAnimationFrame(()=>{qe=0;const e=t.target;if(!H||e.closest(le)){mt.hidden=!0;return}mt.hidden=!0;const n=document.elementFromPoint(t.clientX,t.clientY);if(mt.hidden=!1,!n)return;const o=n.getBoundingClientRect();Ho.style.cssText=`left:${o.left}px;top:${o.top}px;width:${o.width}px;height:${o.height}px`,mn.textContent=n.tagName.toLowerCase()+([...n.classList].find(s=>!/^(astro|svelte)-/.test(s))?"."+[...n.classList].find(s=>!/^(astro|svelte)-/.test(s)):"")+` ${Math.round(o.width)}\xD7${Math.round(o.height)}`,mn.style.cssText=`left:${o.left}px;top:${Math.max(2,o.top-20)}px`}))},Wn=t=>{if(!(t.key!=="Escape"||t.isComposing)){if(t.preventDefault(),L){L=null,p();return}if(u){j(),p();return}if(y!==null){y=null,p();return}rt(!1)}},zn=["pointerdown","mousedown","pointerup","mouseup","touchstart","touchend"],_n=t=>{t.target.closest?.(le)||t.stopPropagation()},Gn=t=>{if(t.target.closest(le))return;if(t.preventDefault(),t.stopPropagation(),ie){ie=!1;return}if(!getSelection()?.isCollapsed)return;f.hidden=!0;const n=document.elementFromPoint(t.clientX,t.clientY);if(f.hidden=!1,!n)return;j();const o=n.getBoundingClientRect(),s=n.tagName.toLowerCase(),r=[...n.classList].filter(c=>!/^(astro|svelte|css)-/.test(c)).slice(0,2);u={selector:qo(n),tag:s,classes:r,nth:hn({tag:s,classes:r}).indexOf(n),rx:o.width?(t.clientX-o.left)/o.width:.5,ry:o.height?(t.clientY-o.top)/o.height:.5,label:K(n.textContent||"").slice(0,60),ctx:Do(n),category:Xe[0].id},y=null,mt.hidden=!0,p()},Qo=2200,ts=900*1024,es=8*1024*1024,st=t=>{const e=document.createElement("div");e.className="dt-toast",e.textContent=t,document.body.append(e),setTimeout(()=>e.remove(),2800)},ns=t=>new Promise(e=>{const n=new FileReader;n.onload=()=>e(String(n.result)),n.readAsDataURL(t)}),os=async t=>{const e=await createImageBitmap(t),n=Math.min(1,Qo/Math.max(e.width,e.height));if(n===1&&t.size<=ts)return e.close(),ns(t);const o=document.createElement("canvas");return o.width=Math.round(e.width*n),o.height=Math.round(e.height*n),o.getContext("2d").drawImage(e,0,0,o.width,o.height),e.close(),o.toDataURL("image/jpeg",.85)},Ie=async(t,e)=>{const n=[];for(const o of t){let s;try{s=await os(o)}catch{st("That image could not be read.");continue}if(s.length>es){st("Screenshot is too large even after shrinking.");continue}n.push(s)}if(n.length){if(!Number(e?.dataset.id)){u&&((u.images??=[]).push(...n),p());return}Q.push(...n),p(),Vn(".dt-note-reply-input")}},Yn=t=>[...t??[]].filter(e=>e.kind==="file"&&e.type.startsWith("image/")).map(e=>e.getAsFile()).filter(Boolean);f.addEventListener("paste",t=>{const e=Yn(t.clipboardData?.items);e.length&&(t.preventDefault(),Ie(e,t.target.closest(".dt-note")))}),f.addEventListener("dragover",t=>{t.target.closest(".dt-note")&&(t.preventDefault(),t.target.closest(".dt-note").querySelector(".dt-compose")?.setAttribute("data-drop",""))}),f.addEventListener("dragleave",t=>{t.target.closest(".dt-note")?.querySelector(".dt-compose")?.removeAttribute("data-drop")}),f.addEventListener("drop",t=>{const e=t.target.closest(".dt-note");if(!e)return;t.preventDefault(),e.querySelector(".dt-compose")?.removeAttribute("data-drop");const n=Yn(t.dataTransfer?.items);n.length&&Ie(n,e)});const Vn=t=>{const e=f.querySelector(t);e?.focus(),e?.setSelectionRange(e.value.length,e.value.length)},Un=()=>{Vn(".dt-note-edit-input"),f.querySelector(".dt-msg .dt-compose")?.scrollIntoView({block:"nearest"})},De=t=>{t.style.overflowY="hidden",t.style.height="auto",t.style.height=`${t.scrollHeight}px`,t.style.overflowY=t.scrollHeight>t.clientHeight?"auto":"hidden"},ss=t=>/(?:^|\s)@([^\s@]*)$/.exec(t.value.slice(0,t.selectionStart??t.value.length)),rs=t=>{t.closest(".dt-compose").querySelector(".dt-mentions")?.remove();const n=ss(t);if(!n||!M.team?.length)return;const o=n[1].toLowerCase(),s=M.team.filter(r=>[r.name,r.nickname,r.email].some(c=>c?.toLowerCase().startsWith(o))).slice(0,5);s.length&&t.insertAdjacentHTML("afterend",`<div class="dt-mentions" role="listbox" aria-label="Mention someone">${s.map((r,c)=>`<button type="button" role="option" aria-selected="${c===0}" data-act="mention" data-handle="${g(bs(r))}">${g(r.name||r.email)}${r.name?` <span>${g(r.email)}</span>`:""}</button>`).join("")}</div>`)},Jn=(t,e)=>{const n=t.selectionStart??t.value.length,o=t.value.slice(0,n).lastIndexOf("@");t.value=`${t.value.slice(0,o)}@${e} ${t.value.slice(n)}`,t.selectionStart=t.selectionEnd=o+e.length+2,t.closest(".dt-compose")?.querySelector(".dt-mentions")?.remove(),t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus()},as=(t,e)=>{if(!t){u&&(u.category=e),p();return}Ht(n=>n.map(o=>o.id===t?{...o,category:e}:o),()=>U("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:t,category:e})}),"Changing the type")};f.addEventListener("change",t=>{const e=t.target.closest(".dt-cat-select");if(e){as(Number(e.dataset.id)||0,e.value);return}const n=t.target.closest(".dt-for-select");if(!n)return;n.parentElement?.style.setProperty("--cat",wn(n.value));const o=Number(n.dataset.id);if(o){const s=n.value||null;Ht(r=>r.map(c=>c.id===o?{...c,assignee:s??void 0}:c),()=>U("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:o,assignee:s})}),"Reassigning");return}if(u){u.assignee=n.value;try{localStorage.setItem("nm-for",n.value)}catch{}zt()}}),f.addEventListener("input",t=>{const e=t.target.closest(".dt-suggest-input");if(e&&u?.suggest){u.suggest.to=e.value,zt(),De(e);return}const n=t.target.closest(".dt-note-input, .dt-note-reply-input, .dt-note-edit-input");n&&(rs(n),n.classList.contains("dt-note-input")?u&&(u.text=n.value):n.classList.contains("dt-note-edit-input")?L&&(L.text=n.value):F=n.value,zt(),n.closest(".dt-compose")?.querySelector(".dt-send")?.classList.toggle("is-ready",n.value.trim()!==""),De(n))}),f.addEventListener("keydown",t=>{const e=t.target.closest(".dt-note-input, .dt-note-reply-input, .dt-note-edit-input");if(!e)return;const n=e.closest(".dt-compose")?.querySelector(".dt-mentions button");if(n&&(t.key==="Enter"||t.key==="Tab")&&!t.isComposing){t.preventDefault(),Jn(e,n.dataset.handle);return}if(n&&t.key==="Escape"){t.stopPropagation(),n.parentElement.remove();return}t.key!=="Enter"||t.shiftKey||t.isComposing||(t.preventDefault(),e.closest(".dt-compose")?.querySelector(".dt-send")?.click())}),f.addEventListener("click",async t=>{const e=t.target.closest("button");if(!e)return;const n=e.dataset.act,o=Number(e.dataset.id);if(n==="mention"){const s=e.closest(".dt-compose")?.querySelector("textarea");s&&Jn(s,e.dataset.handle);return}if(!n){if(y=y===o?null:o,y!=null&&e.dataset.off){const s=h.find(c=>c.id===o);(s&&Y(s))?.scrollIntoView({block:"nearest",inline:"center",behavior:"smooth"})}j(),p();return}if(n==="record"){_o(e.closest(".dt-note"));return}if(n==="attach"){const s=Object.assign(document.createElement("input"),{type:"file",accept:"image/*",multiple:!0}),r=e.closest(".dt-note");s.addEventListener("change",()=>{s.files?.length&&Ie([...s.files],r)}),s.click();return}if(n==="unshot"){o?L&&L.drop.push(e.dataset.img):(e.closest("[data-draft]")?u?.images??[]:Q).splice(Number(e.dataset.i),1),p(),L&&Un();return}if(n==="edit"){const s=h.find(d=>d.id===o),r=e.dataset.at||null,c=r?s?.replies?.find(d=>d.at===r)?.text:s?.text;if(c===void 0)return;L={id:o,at:r,text:c,drop:[]},p(),Un();return}if(n==="edit-cancel"){L=null,p();return}if(n==="edit-save"){const s=L;if(!s)return;const r=s.text.trim();if(!r){f.querySelector(".dt-note-edit-input")?.focus();return}L=null;const c=d=>s.drop.includes(d.split("/").pop());await Ht(d=>d.map(a=>a.id!==s.id?a:{...a,...s.at==null?{text:r}:{replies:(a.replies??[]).map(l=>l.at===s.at?{...l,text:r}:l)},images:(a.images??[]).filter(l=>!c(l))}),()=>U("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:s.id,edit:{at:s.at,text:r},...s.drop.length?{removeImage:s.drop}:{}})}).then(d=>(d.ok||(L=s),d)),"Saving the edit");return}if(n==="cancel"){j(),p();return}if(n==="twin"){j(),y=Number(e.dataset.id),p();return}if(n==="discard"){u=null,p();return}if(n==="draft-open"){He(Number(e.dataset.i));return}if(n==="close"){y=null,p();return}if(n==="suggest"&&u){const s=Ln(Y(u));u.suggest={from:s,to:s},p();const r=f.querySelector(".dt-suggest-input");r?.focus(),r?.select();return}if(n==="unsuggest"&&u){u.suggest=null,p();return}if(n==="save"){if(!u)return;const s=u.suggest&&u.suggest.to.trim()!==u.suggest.from?{from:u.suggest.from,to:u.suggest.to.trim()}:null,r=f.querySelector(".dt-note-input").value.trim()||(s?"Change the text":"");if(!r){f.querySelector(".dt-note-input")?.focus();return}const c=u,d={...c,route:P,text:r,suggest:s,assignee:c.assignee??En(),breakpoint:et(),browser:Ro(),device:$?Xn:"",viewport:{w:innerWidth,h:innerHeight},logs:xs()},a={...c,id:-Date.now(),text:r,route:P,status:"open",note:"",doneBy:null,breakpoint:d.breakpoint,replies:[],images:[],createdAt:new Date().toISOString(),...s?{suggest:s}:{},by:M.me?.email,byName:M.me?.name};h=[...h,a],u=null,p();const l=await U("comments",{method:"POST",headers:{"content-type":"application/json"},body:JSON.stringify(d)});if(!l.ok){h=h.filter(b=>b!==a),u=c,p(),st(`Comment was not saved (${l.status}).`);return}const m=Nt([await l.json().catch(()=>null)])[0];h=h.map(b=>b===a&&m?m:b),p(),Zt();return}if(n==="reply"){const s=f.querySelector(".dt-note-reply-input"),r=s.value.trim();if(!r){s.focus();return}const c=Q;F="",Q=[];const d=h;h=h.map(m=>m.id===o?{...m,replies:[...m.replies??[],{author:"you",text:r,at:new Date().toISOString(),by:M.me?.email}]}:m),p();const a=await U("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:o,reply:r,images:c})});if(!a.ok){h=d,F=r,Q=c,p(),st(`Reply was not sent (${a.status}).`);return}const l=Nt([await a.json().catch(()=>null)])[0];l&&(h=h.map(m=>m.id===l.id?l:m),p()),Zt();return}y=null,n==="rm"?await qn(o):await Ut(o,n==="done")});let Rt="overlay",ht="",Xn="";const q=t=>{C.hidden||S.contentWindow?.postMessage({dt:!0,...t},location.origin)},is=()=>({notes:H,grid:!Ot.hidden,inspect:ut,resolved:tt,scrollbar:Rt,device:ht});addEventListener("message",t=>{if(t.origin!==location.origin||!t.data?.dt)return;const e=t.data;if(!$&&t.source===S.contentWindow){if(e.key){lo(e.key[0],e.key[1])?.run();return}if(e.closeMenus){wt();return}if(e.drafts){Te=e.drafts,In(_t());return}}if($&&typeof e.openDraft=="number"){He(e.openDraft);return}if($&&typeof e.dropDraft=="number"){Dn(e.dropDraft);return}if($&&typeof e.device=="string"&&(Xn=e.device),$&&e.scrollbar&&document.documentElement.classList.toggle("dt-sb-classic",e.scrollbar==="classic"),e.hello&&t.source===S.contentWindow){q(is());return}typeof e.notes=="boolean"&&e.notes!==H&&rt(e.notes,!1),typeof e.open=="number"&&ke(e.open),typeof e.grid=="boolean"&&e.grid===Ot.hidden&&ae(e.grid),typeof e.inspect=="string"&&e.inspect!==ut&&Pt(e.inspect),typeof e.resolved=="boolean"&&e.resolved!==tt&&On(e.resolved),e.reload&&(gt(),Jt())});const Zt=async()=>{await gt(),Jt(),q({reload:!0}),$&&parent.postMessage({dt:!0,reload:!0},location.origin)},rt=(t,e=!0)=>{if(H=t,cn.setAttribute("aria-pressed",String(t)),t?!$&&D.hidden&&localStorage.getItem("dt-history")!=="0"&&(D.hidden=!1,Ft.setAttribute("aria-pressed","true")):(D.hidden=!0,Ft.setAttribute("aria-pressed","false")),z(gn,t?"1":"0"),q({notes:t}),$&&e&&parent.postMessage({dt:!0,notes:t},location.origin),f.hidden=!t||!C.hidden,document.documentElement.classList.toggle("dt-noting",t),t){Pt(""),document.addEventListener("click",Gn,!0);for(const n of zn)document.addEventListener(n,_n,!0);document.addEventListener("keydown",Wn),document.addEventListener("mousemove",Kn),addEventListener("scroll",nt,!0),addEventListener("resize",nt),Pn.observe(document.body,{childList:!0,subtree:!0,characterData:!0}),Fn.observe(document.body),gt()}else{j(),y=null,document.removeEventListener("click",Gn,!0);for(const n of zn)document.removeEventListener(n,_n,!0);document.removeEventListener("keydown",Wn),document.removeEventListener("mousemove",Kn),mt.hidden=!0,removeEventListener("scroll",nt,!0),removeEventListener("resize",nt),Pn.disconnect(),Fn.disconnect(),f.innerHTML=""}},Qt="dt-w",Oe="dt-canvas",bt="dt-device";let at=localStorage.getItem(Oe)==="1",E=localStorage.getItem(bt)||"";E&&!Dt(E)&&(E="",localStorage.setItem(bt,""));let A=Number(localStorage.getItem(Qt))||0;const Zn="dt-emu";let I=(()=>{try{return JSON.parse(localStorage.getItem(Zn)||"null")}catch{return null}})();const te=()=>I?fo.find(t=>t.id===I.id)??null:null,ls=()=>{const t=te();return t?I.turned?{w:t.h,h:t.w}:{w:t.w,h:t.h}:null};let qt=localStorage.getItem("dt-bars-min")==="1";const yt=t=>{I=t,z(Zn,t?JSON.stringify(t):"")},Pe=t=>{pn.textContent=t,C.style.setProperty("--dt-badge-w",`${pn.offsetWidth}px`)},Qn=t=>{if(!t){Lt.innerHTML="";return}let e="";for(let n=0;n<=t;n+=50)e+=`<span class="dt-tick${n%200===0?" is-major":""}" style="left:${n}px"></span>`;for(const n of B)for(const o of[n.min,n.max])o>0&&Number.isFinite(o)&&o<=t&&(e+=`<span class="dt-edge" style="left:${o}px" title="${n.label} edge"></span>`);Lt.innerHTML=e,Lt.style.width=`${t}px`},Fe=()=>{const t=parseFloat(w.style.width)||0,e=parseFloat(w.style.height)||0;if(!t||!e){w.style.transform="",delete w.dataset.scaled;return}const n=E||I?Math.min(1,(innerWidth-80)/t,(innerHeight-120)/e):Math.min(1,(innerWidth-80)/t);w.style.transform=n<1?`scale(${n})`:"",w.dataset.scaled=n<1?String(Math.round(n*100)):""},ds=t=>fo.find(e=>e.w===t.w&&e.h===t.h&&e.cutout?.shape==="pill")?.cutout,ee=()=>{try{return S.contentDocument}catch{return null}},to=()=>ee()?.title.split("\u2014").pop()?.trim()||"",je=()=>{const t=ee(),e=E?Dt(E):null;if(!t?.body||!e)return;const n=Ls(t),o=e.browser==="chrome-android"?n.theme||"rgb(255, 255, 255)":n.top,s=e.browser==="chrome-android"?"rgb(255, 255, 255)":n.bottom;w.style.setProperty("--dt-top",o),w.style.setProperty("--dt-top-ink",ho(o)),w.style.setProperty("--dt-bottom",s),w.style.setProperty("--dt-bottom-ink",ho(s));const r=St.querySelector(".dt-win-tab > span");r&&(r.textContent=to()||location.host)};let Ke=0;S.addEventListener("load",()=>{ee()&&(je(),S.contentWindow?.addEventListener("scroll",()=>{Ke||(Ke=requestAnimationFrame(()=>{Ke=0,je()}))},{passive:!0}))});for(const t of[St,jt])t.addEventListener("click",e=>{const n=e.target.closest("[data-nav]")?.dataset.nav;if(n)try{const o=S.contentWindow?.navigation;if(!ee()||!o)throw new Error("foreign");n==="back"?o.canGoBack&&o.back():n==="fwd"?o.canGoForward&&o.forward():o.reload()}catch{(n==="reload"||n==="back")&&(S.src=location.href)}});xt.addEventListener("click",()=>{qt=!qt,z("dt-bars-min",qt?"1":"0"),X()});const X=()=>{if($)return;const t=E?Dt(E)??null:null;if(E&&!t&&(E="",localStorage.setItem(bt,"")),!t&&!at){C.hidden=!0,S.removeAttribute("src"),document.documentElement.classList.remove("dt-framing"),f.hidden=!H,Lt.innerHTML="",Mt(),he.hidden=!0,xt.hidden=!0,J=null,ht="",Te=[],Mt(),_e(),H?gt():p();return}if(C.hidden=!1,document.documentElement.classList.add("dt-framing"),f.hidden=!0,S.src||(S.src=location.href),t){const e=Ss(t,{host:location.host,title:to(),now:new Date,min:qt,cutout:ds(t)}),{screen:n}=e;C.dataset.mode="device",w.dataset.shell=t.shell,w.dataset.browser=t.browser,w.style.width=`${e.footprint.w}px`,w.style.height=`${e.footprint.h}px`,w.style.setProperty("--dt-r",`${n.r}px`),w.style.setProperty("--dt-rb",`${n.rb}px`),un.innerHTML=e.shell;const o=(c,d,a,l)=>{c.innerHTML=l,c.style.cssText=`left:${n.x}px;top:${d}px;width:${n.w}px;height:${a}px`};o(St,n.y,e.topH,e.top),o(jt,n.y+n.h-e.bottomH,e.bottomH,e.bottom);const s=n.h-e.topH-e.bottomH;S.style.position="absolute",S.style.left=`${n.x}px`,S.style.top=`${n.y+e.topH}px`,S.style.width=`${n.w}px`,S.style.height=`${s}px`,Lt.innerHTML="";const r=qt&&e.canMinimize;Rt=e.scrollbar,ht=`${t.label}${r?" \xB7 bars folded":""}`,J=Et(t.w),q({notes:H,scrollbar:Rt,device:ht}),xt.hidden=!e.canMinimize,xt.setAttribute("aria-pressed",String(r)),Pe(`${t.label} \xB7 page ${t.w}\xD7${s} of ${t.w}\xD7${t.h}${r?" \xB7 bars folded":""} \xB7 ${B.find(c=>c.id===J)?.label??""}`),je()}else{const e=ls();e||yt(null);const n=e?.w||A||B.find(r=>r.id===et()).ideal;A=n,C.dataset.mode="canvas",delete w.dataset.shell,delete w.dataset.browser,un.innerHTML=St.innerHTML=jt.innerHTML="",St.style.cssText=jt.style.cssText="",xt.hidden=!0,Rt="overlay",w.style.width=`${n}px`,w.style.height=`${e?.h??innerHeight-84}px`,S.style.position="",S.style.left=S.style.top="",S.style.width="100%",S.style.height="100%",Qn(n),q({notes:H});const o=B.find(r=>r.id===Et(n)),s=te();ht=s?`${s.label}${I?.turned?" \xB7 landscape":""}`:"",q({scrollbar:Rt,device:ht}),Pe(s&&e?`${s.label} \xB7 ${e.w}\xD7${e.h} \xB7 ${o.label}`:`${n}px \xB7 ${o.label}`),J=Et(n)}he.hidden=!(te()?.rotates&&!t),_e(),Fe(),Mt(),H?gt():p()},We=t=>{const e=B.find(n=>n.id===t);E="",localStorage.setItem(bt,""),yt(null),at=t!==se,A=at?e.ideal:0,J=at?t:null,localStorage.setItem(Oe,at?"1":"0"),localStorage.setItem(Qt,String(A)),y=null,j(),X()};for(const t of ge)t.addEventListener("click",()=>We(t.dataset.bp));for(const t of document.querySelectorAll("[data-device]"))t.addEventListener("click",()=>{E=t.dataset.device===E?"":t.dataset.device,localStorage.setItem(bt,E),G.open=!1,X()});for(const t of document.querySelectorAll("[data-emu]"))t.addEventListener("click",()=>{const e=I?.id===t.dataset.emu&&!E;E="",localStorage.setItem(bt,""),yt(e?null:{id:t.dataset.emu,turned:!1}),at=!e,A=0,localStorage.setItem(Oe,at?"1":"0"),J=null,y=null,j(),G.open=!1,X()});he.addEventListener("click",()=>{I&&(yt({...I,turned:!I.turned}),y=null,j(),X())});const eo=[...G.querySelectorAll("[data-tab]")],cs=[...G.querySelectorAll("[data-panel]")],no=t=>{for(const e of eo)e.setAttribute("aria-selected",String(e.dataset.tab===t));for(const e of cs)e.hidden=e.dataset.panel!==t;z("dt-devices-tab",t)};for(const t of eo)t.addEventListener("click",()=>no(t.dataset.tab));no(localStorage.getItem("dt-devices-tab")==="devtools"?"devtools":"preview");const ze=G.querySelector(".dt-emu-search");ze.addEventListener("input",()=>{const t=ze.value.trim().toLowerCase();let e=null,n=!1;const o=()=>{e&&(e.hidden=!n)};for(const s of ze.parentElement.children){if(s.classList.contains("dt-devices-group")){o(),e=s,n=!1;continue}s.dataset.emu&&(s.hidden=!!t&&!s.textContent.toLowerCase().includes(t),n||=!s.hidden)}o()});const us=G.querySelector(".dt-devices-name");function _e(){for(const e of G.querySelectorAll("[data-device]"))e.setAttribute("aria-pressed",String(e.dataset.device===E));const t=!E&&!C.hidden?I?.id:void 0;for(const e of G.querySelectorAll("[data-emu]"))e.setAttribute("aria-pressed",String(e.dataset.emu===t));us.textContent=E&&Dt(E)?.label||t&&te()?.label||"Device"}const Ge=t=>B.find(e=>e.id===t),ms=t=>{const e=Ge(J??et());return Math.max(e.min||320,Math.min(Number.isFinite(e.max)?e.max:2560,Math.round(t)))};for(const t of Ao){const e=t.dataset.edge==="l"?-1:1;t.addEventListener("pointerdown",n=>{if(E)return;n.preventDefault(),I&&(yt(null),X()),t.setPointerCapture(n.pointerId);const o=n.clientX,s=A,r=Number(w.dataset.scaled||100)/100;C.dataset.dragging="1";const c=a=>{A=ms(s+e*(a.clientX-o)*2/r),w.style.width=`${A}px`,Qn(A),Pe(`${A}px \xB7 ${Ge(Et(A)).label}`),Fe()},d=()=>{t.removeEventListener("pointermove",c),t.removeEventListener("pointerup",d),delete C.dataset.dragging,localStorage.setItem(Qt,String(A)),X()};t.addEventListener("pointermove",c),t.addEventListener("pointerup",d)}),t.addEventListener("dblclick",()=>{if(E)return;yt(null);const n=Ge(J??et()),o=[n.min||320,Number.isFinite(n.max)?n.max:n.ideal];A=Math.abs(A-o[0])<Math.abs(A-o[1])?o[0]:o[1],localStorage.setItem(Qt,String(A)),X()})}let oo=et();addEventListener("resize",()=>{Mt(),et()!==oo&&(oo=et(),p()),C.hidden||(!E&&!I&&(w.style.height=`${innerHeight-84}px`),Fe())});const so="dt-studio",ro=t=>{fe.setAttribute("aria-pressed",String(t)),document.documentElement.classList.toggle("dt-no-studio",!t),z(so,t?"1":"0")};fe.addEventListener("click",()=>ro(fe.getAttribute("aria-pressed")!=="true")),ro(localStorage.getItem(so)!=="0"),cn.addEventListener("click",()=>rt(!H));const vt=document.querySelector(".devtools"),It=document.querySelector(".dt-tab"),ao=t=>{vt.toggleAttribute("data-collapsed",t),It.toggleAttribute("data-collapsed",t),It.setAttribute("aria-expanded",String(!t)),It.setAttribute("aria-label",t?"Show the bar":"Hide the bar");for(const e of vt.querySelectorAll(".dt-group"))e.inert=t;t&&wt(),z("dt-collapsed",t?"1":"0")};It.addEventListener("click",()=>ao(!vt.hasAttribute("data-collapsed")));const Ye=document.querySelector(".dt-keys"),it=t=>()=>vt.querySelector(t)?.click(),io=t=>()=>{const e=[...document.querySelectorAll(".dt-pages a")];e[e.findIndex(n=>n.hasAttribute("aria-current"))+t]?.click()},ne=[{group:"Comments",code:"KeyC",hint:"C",label:"Comment mode",el:".dt-notes-btn",run:it(".dt-notes-btn")},{group:"Comments",code:"KeyC",shift:!0,hint:"\u21E7C",label:"Comments panel",el:".dt-history-btn",run:it(".dt-history-btn")},{group:"Comments",code:"KeyR",hint:"R",label:"Show resolved",el:".dt-resolved-btn",run:it(".dt-resolved-btn")},{group:"Inspect",code:"KeyG",hint:"G",label:"Grid",el:".dt-grid-btn",run:it(".dt-grid-btn")},{group:"Inspect",code:"KeyP",hint:"P",label:"Spacing",el:".dt-pad-btn",run:it(".dt-pad-btn")},{group:"Inspect",code:"KeyS",hint:"S",label:"Size",el:".dt-size-btn",run:it(".dt-size-btn")},{group:"Inspect",code:"KeyT",hint:"T",label:"Typography",el:".dt-type-btn",run:it(".dt-type-btn")},...M.sanity?[{group:"Inspect",code:"KeyE",hint:"E",label:"Sanity overlay",el:".dt-studio-btn",run:it(".dt-studio-btn")}]:[],...ge.slice(0,9).map((t,e)=>({group:"Breakpoints",code:`Digit${e+1}`,hint:String(e+1),label:t.dataset.tip??t.title,el:`.dt-bp[data-bp="${t.dataset.bp}"]`,run:()=>t.click()})),{group:"View",code:"KeyD",hint:"D",label:"Devices",run:()=>{G.open=!G.open}},{group:"View",code:"BracketLeft",hint:"[",label:"Previous page",run:io(-1)},{group:"View",code:"BracketRight",hint:"]",label:"Next page",run:io(1)},{group:"View",code:"Backslash",hint:"\\",label:"Hide the bar",run:()=>It.click()},{group:"View",code:"Slash",shift:!0,hint:"?",label:"This list",el:".dt-keys summary",run:()=>{Ye.open=!Ye.open}}],lo=(t,e)=>ne.find(n=>n.code===t&&!n.shift==!e),ps=t=>t instanceof HTMLElement&&(t.isContentEditable||/^(INPUT|TEXTAREA|SELECT)$/.test(t.tagName));if(M.shortcuts){for(const e of ne){const n=e.el&&vt.querySelector(e.el);n&&(n.dataset.tip=`${n.dataset.tip??e.label} \xB7 ${e.hint}`,n.setAttribute("aria-keyshortcuts",e.hint.startsWith("\u21E7")?`Shift+${e.hint.slice(1)}`:e.hint))}const t=(e,n)=>`<div class="dt-key-row"><span>${g(e)}</span><kbd>${g(n)}</kbd></div>`;if(Ye.querySelector(".dt-keys-menu").innerHTML='<p class="dt-menu-note">One key, no modifier, in any keyboard layout. Not while you type.</p>'+[...new Set(ne.map(e=>e.group))].map(e=>`<p class="dt-devices-group">${e}</p>`+ne.filter(n=>n.group===e).map(n=>t(n.label,n.hint)).join("")).join("")+'<p class="dt-devices-group">In a comment</p>'+t("Send","Enter")+t("New line","\u21E7Enter")+t("Close, cancel, back out","Esc"),document.addEventListener("keydown",e=>{if(e.repeat||e.isComposing||e.metaKey||e.ctrlKey||e.altKey||e.defaultPrevented||ps(e.target))return;const n=lo(e.code,e.shiftKey);n&&(e.preventDefault(),$?parent.postMessage({dt:!0,key:[e.code,e.shiftKey]},location.origin):n.run())}),$){const e=()=>parent.postMessage({dt:!0,closeMenus:!0},location.origin);document.addEventListener("pointerdown",e,!0),document.addEventListener("keydown",n=>{n.key==="Escape"&&e()})}}if(!$){ao(localStorage.getItem("dt-collapsed")==="1"),requestAnimationFrame(()=>requestAnimationFrame(()=>vt.setAttribute("data-ready",""))),at||E?X():_e(),ae(localStorage.getItem(Qe)==="1");const t=localStorage.getItem(on);t&&t in de&&Pt(t),rt(localStorage.getItem(gn)==="1")}const co=()=>{try{const t=JSON.parse(localStorage.getItem(ft)||"null");R=(t?.parked??[]).filter(e=>Kt(e)),t?.draft&&document.querySelector(t.draft.selector)?(u=t.draft,!H&&!$&&rt(!0)):Kt(t?.draft)&&R.push(t.draft),t?.reply?.text&&(F=t.reply.text,Tt=y=t.reply.for??null),(u||R.length||F)&&p()}catch{localStorage.removeItem(ft)}};co();const uo=()=>setTimeout(()=>{const t=re(location.pathname);t!==P&&(clearTimeout(Wt),ve(),P=t,ft=fn(),u=null,R=[],F="",Tt=null,y=null,L=null,h=[],en(),co(),gt())});for(const t of["pushState","replaceState"]){const e=window.history[t];window.history[t]=function(...n){e.apply(this,n),uo()}}addEventListener("popstate",uo),H||gt(),Jt().then(()=>{Ce()&&Ne()}),document.addEventListener("visibilitychange",()=>{document.hidden||Bt()}),addEventListener("focus",Bt),addEventListener("notemend:changed",()=>{$||Bt()});let gs=0;$||setInterval(()=>{(!Es.live||++gs%6===0)&&Bt()},2e4),$&&parent.postMessage({dt:!0,hello:!0},location.origin)}export{Rs as run};
|
|
98
|
+
</div>`+(l.length||p.length?`<div class="dt-hist-list">${p.length?`<p class="dt-hist-group">Drafts<em>${p.length}</em></p>${p.map(b).join("")}`:""}${l.map(i=>`<p class="dt-hist-group">${Cs[i]}<em>${o[i].length}</em></p>`+o[i].map(s).join("")).join("")}</div>`:`<p class="dt-hist-empty">${o.done.length?"Everything here is resolved.":"No comments at this breakpoint yet. Click anything on the page to leave one."}</p>`)+`<div class="dt-hist-foot">
|
|
99
|
+
<button class="dt-hist-resolved" data-resolved role="switch" aria-checked="${J}"
|
|
100
|
+
><svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><circle cx="10" cy="10" r="7.5"/><path d="M6.8 10.2 9 12.4l4-4.4" stroke-linejoin="round"/></svg
|
|
101
|
+
><span>Show resolved</span><kbd>R</kbd><i class="dt-hist-switch" aria-hidden="true"></i></button>
|
|
102
|
+
</div>`},De=t=>F.toggleAttribute("data-collapsed",t);F.addEventListener("click",async t=>{const e=t.target.closest("[data-refresh]");if(e){e.dataset.spin="1",await de(),setTimeout(()=>delete e.dataset.spin,500);return}if(F.hasAttribute("data-collapsed")&&t.target.closest(".dt-hist-head")){De(!1);return}if(t.target.closest("[data-fold]")){De(!F.hasAttribute("data-collapsed"));return}const n=t.target.closest(".dt-hist-bands [data-bp]");if(n){Qe(n.dataset.bp);return}const o=t.target.closest("[data-draft-go], [data-draft-rm]");if(o){const l=o.dataset.draftRm!==void 0,p=Number(l?o.dataset.draftRm:o.dataset.draftGo);N.hidden?l?Gn(p):Pe(p):O(l?{dropDraft:p}:{openDraft:p});return}const s=t.target.closest("[data-unmark]");if(s){t.stopPropagation(),await Dt(Number(s.dataset.unmark),!1);return}const a=t.target.closest(".dt-hist-tools [data-act]");if(a){await Dt(Number(a.dataset.id),a.dataset.act==="done");return}const c=t.target.closest("[data-rm]");if(c){y=null,await zn(Number(c.dataset.rm));return}if(t.target.closest("[data-review]")){ps();return}if(t.target.closest("[data-resolved]")){Ke(!J);return}const d=t.target.closest("[data-go]");if(!d)return;const r=Number(d.dataset.go);if(!N.hidden){O({open:r});return}Oe(r)});const Oe=t=>{y=t,z(),g();const e=h.find(o=>o.id===t),n=e&&Z(e);n?scrollTo({top:scrollY+n.y-innerHeight/2,behavior:"smooth"}):e&&X(e)?.scrollIntoView({block:"center",behavior:"smooth"}),f.querySelector(`.dt-pin[data-id="${t}"]`)?.animate([{transform:"scale(1)"},{transform:"scale(1.5)"},{transform:"scale(1)"}],400)},Pe=t=>{const[e]=q.splice(t,1);if(!e)return;z(),u=e,y=null;const n=Z(e);n&&(n.y<0||n.y>innerHeight)&&scrollTo({top:scrollY+n.y-innerHeight/3,behavior:"instant"}),g()},Gn=t=>{q.splice(t,1),g()},Fe="nm-review",ae=()=>{try{return JSON.parse(sessionStorage.getItem(Fe)||"null")}catch{return null}},$t=t=>{try{t?sessionStorage.setItem(Fe,JSON.stringify(t)):sessionStorage.removeItem(Fe)}catch{}},D=document.createElement("div");D.className="dt-review",D.setAttribute("role","region"),D.setAttribute("aria-label","Checking fixes"),D.hidden=!0,E||document.body.append(D);const ft=()=>Q.filter(t=>R(t)==="claude"),ps=()=>{const t=ft().sort((e,n)=>+(n.route===K)-+(e.route===K)||String(e.route).localeCompare(String(n.route))||e.id-n.id).map(e=>e.id);t.length&&($t({ids:t,i:0}),re())},re=()=>{const t=ae();if(!t||E){D.hidden=!0;return}for(;t.i<t.ids.length&&R(Q.find(o=>o.id===t.ids[t.i])??{status:"done"})!=="claude";)t.i++;if(t.i>=t.ids.length){$t(null),D.hidden=!0,G("Every fix is checked.");return}$t(t);const e=Q.find(o=>o.id===t.ids[t.i]);if(e.route&&e.route!==K){location.assign(e.route+location.search);return}if(A||lt(!0),et(e)!==ee()){Qe(et(e));for(const o of[600,1500])setTimeout(()=>O({open:e.id}),o)}else Oe(e.id);const n=t.ids.slice(0,t.i).some(o=>R(Q.find(s=>s.id===o)??{status:"done"})==="claude");D.innerHTML=`<b><span class="dt-review-dot" aria-hidden="true"></span>Check fixes</b>
|
|
103
|
+
<span class="dt-review-nav"><button data-r="prev" aria-label="Previous fix" data-tip="Previous \xB7 \u2190"${n?"":" disabled"}>${Yo}</button>
|
|
104
|
+
<span class="dt-review-n">${t.i+1} of ${t.ids.length}</span>
|
|
105
|
+
<button data-r="skip" aria-label="Next fix" data-tip="Next \xB7 \u2192">${Jo}</button></span>
|
|
106
|
+
<span class="dt-review-text">${m(_(e.text).slice(0,90))}</span>
|
|
107
|
+
<button data-r="ok" class="dt-review-ok" aria-label="Looks right \u2014 mark it resolved" data-tip="Looks right \u2014 resolve it">${Rt}</button>
|
|
108
|
+
<button data-r="no" aria-label="Reopen" data-tip="Not yet \u2014 reopen it">${Xo}</button>
|
|
109
|
+
<button data-r="stop" aria-label="Stop checking" data-tip="Stop checking">${se}</button>`,D.hidden=!1};D.addEventListener("click",async t=>{const e=t.target.closest("[data-r]"),n=ae();if(!e||!n)return;if(e.dataset.r==="stop"){$t(null),D.hidden=!0;return}if(e.dataset.r==="prev"){Vn();return}const o=n.ids[n.i];$t({...n,i:n.i+1});const s=e.dataset.r==="ok"?Dt(o,!0):e.dataset.r==="no"?Dt(o,!1):null;re(),await s});const Vn=()=>{const t=ae();if(t){for(let e=t.i-1;e>=0;e--)if(R(Q.find(n=>n.id===t.ids[e])??{status:"done"})==="claude"){$t({...t,i:e}),re();return}}};document.addEventListener("keydown",t=>{D.hidden||t.metaKey||t.ctrlKey||t.altKey||t.key!=="ArrowLeft"&&t.key!=="ArrowRight"||t.target.closest?.("input, textarea, select, [contenteditable]")||(t.preventDefault(),t.key==="ArrowLeft"?Vn():D.querySelector('[data-r="skip"]')?.click())});const ms=t=>{F.hidden=!t,Jt.setAttribute("aria-pressed",String(t)),V("dt-history",t?"1":"0"),g()},je=document.querySelector(".dt-resolved-btn"),Ke=t=>{J=t,je.setAttribute("aria-pressed",String(t)),V("dt-resolved",t?"1":"0"),O({resolved:t}),g(),ie()};je.addEventListener("click",()=>Ke(!J)),je.setAttribute("aria-pressed",String(J)),Jt.addEventListener("click",()=>{const t=F.hidden===!0;t&&!A&<(!0),t&&De(!1),ms(t)});const it=()=>{He||!A||(He=requestAnimationFrame(()=>{He=0,cs()}))},Un=new MutationObserver(t=>{t.every(e=>e.target.closest?.(".dt-notes-overlay"))||it()}),Yn=new ResizeObserver(()=>it());let Q=[];const Jn=t=>{Q=t;const e=()=>({open:0,claude:0,done:0}),n={};for(const d of t){const r=R(d),l=n[d.route??""]??={...e(),bands:{}};l[r]++;const p=et(d);(l.bands[p]??=e())[r]++}const o=["open","claude","done"],s={open:"open",claude:"resolved by an agent, to check",done:"resolved"},a=d=>o.map(r=>[r,r==="done"&&!J?0:d[r]]),c=d=>a(d).reduce((r,[,l])=>r+l,0);for(const d of document.querySelectorAll(".dt-pages a")){const r=d.querySelector(".dt-pages-n");if(!r)continue;const l=n[new URL(d.href).pathname.replace(/\/+$/,"")||"/"];for(const i of I){const $=l?.bands[i.id];for(const[k,B]of a($??e())){const ut=r.querySelector(`[data-bp="${i.id}"][data-state="${k}"]`);ut.hidden=!B,B&&(ut.querySelector("i").textContent=String(B),ut.title=`${i.label}: ${B} ${s[k]}`)}}const p=l?c(l):0;r.hidden=!p;const b=l?I.filter(i=>l.bands[i.id]&&c(l.bands[i.id])).map(i=>`${i.label} ${c(l.bands[i.id])}`).join(" \xB7 "):"";r.title=p?`${l.open} open \xB7 ${l.claude} resolved by an agent, to check \xB7 ${l.done} resolved
|
|
110
|
+
${b}`:""}},Ot=t=>(Array.isArray(t)?t:[]).filter(e=>e&&Number.isInteger(Number(e.id))&&typeof e.text=="string").filter(e=>!v.client||e.by===v.me?.email||e.assignee===v.me?.email).map(e=>({...e,id:Number(e.id),rx:Number(e.rx)||0,ry:Number(e.ry)||0,route:typeof e.route=="string"&&/^\/(?!\/)/.test(e.route)?e.route:"/",replies:Array.isArray(e.replies)?e.replies.filter(n=>typeof n?.text=="string"):[],images:Array.isArray(e.images)?e.images.filter(n=>typeof n=="string"):[]})),ie=async()=>{try{Jn(Ot((await(await j("comments")).json()).comments)),!F.hidden&&!E&&g()}catch{}};let Pt=null,Ft=null;const ht=document.querySelector(".dt-turbo"),We="/notemend:turbo",jt=()=>{const t=!!Pt&&Date.now()-Date.parse(Pt.at)<18e4,e=t?Ft?.paused?"paused":"on":"none",n=t?tt(Pt.agent):"",o=e==="none"?`Turbo is off. Run ${We} in Claude Code and comments for the agent are taken as they land \u2014 click to copy it`:e==="on"?`Turbo on: ${n} takes comments for the agent as they land \u2014 click to pause`:`Turbo paused: ${n} is listening but waits \u2014 click to resume`;ht.dataset.state=e,ht.dataset.tip=o,ht.setAttribute("aria-label",o),ht.setAttribute("aria-checked",String(e==="on")),E&&(ht.hidden=!0)};setInterval(jt,3e4),ht.addEventListener("click",async()=>{const t=ht.dataset.state;if(t==="none"){await navigator.clipboard?.writeText(We).catch(()=>{}),G(`Copied ${We} \u2014 paste it in Claude Code`);return}const e=t==="on"?"off":"on";Ft={paused:e==="off"},jt();try{const n=await j("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({turbo:e})});if(!n.ok)throw new Error(String(n.status));G(e==="off"?"Turbo paused":"Turbo on")}catch{Ft={paused:e==="on"},jt(),G("Could not switch turbo \u2014 try again")}});let le="",ze=!1;const Kt=async()=>{if(!(document.hidden||ze)){ze=!0;try{const t=await j(`comments${le?`?since=${le}`:""}`);if(t.status!==200)return;const e=await t.json();le=e.version??"",Pt=e.listening??null,Ft=e.turbo??null,jt();const n=Ot(e.comments);Jn(n);const o=n.filter(s=>s.route===K);if(JSON.stringify(o)===JSON.stringify(h))return;if(f.contains(document.activeElement)&&document.activeElement.matches("textarea, input")){le="",setTimeout(Kt,5e3);return}h=o,g(),O({reload:!0})}catch{}finally{ze=!1}}},bt=async()=>{try{const e=await(await j(`comments?route=${encodeURIComponent(K)}`)).json();h=Ot(e.comments),Pt=e.listening??null,Ft=e.turbo??null,jt()}catch{h=[]}g()};let _e=0;const Xn=t=>{_e||(_e=requestAnimationFrame(()=>{_e=0;const e=t.target;if(!A||e.closest(ve)){mt.hidden=!0;return}mt.hidden=!0;const n=document.elementFromPoint(t.clientX,t.clientY);if(mt.hidden=!1,!n)return;const o=n.getBoundingClientRect();Oo.style.cssText=`left:${o.left}px;top:${o.top}px;width:${o.width}px;height:${o.height}px`,wn.textContent=n.tagName.toLowerCase()+([...n.classList].find(s=>!/^(astro|svelte)-/.test(s))?"."+[...n.classList].find(s=>!/^(astro|svelte)-/.test(s)):"")+` ${Math.round(o.width)}\xD7${Math.round(o.height)}`,wn.style.cssText=`left:${o.left}px;top:${Math.max(2,o.top-20)}px`}))},Zn=t=>{if(!(t.key!=="Escape"||t.isComposing)){if(t.preventDefault(),x){x=null,g();return}if(u){z(),g();return}if(y!==null){y=null,g();return}lt(!1)}},Qn=["pointerdown","mousedown","pointerup","mouseup","touchstart","touchend"],to=t=>{t.target.closest?.(ve)||t.stopPropagation()},eo=t=>{if(t.target.closest(ve))return;if(t.preventDefault(),t.stopPropagation(),ye){ye=!1;return}if(!getSelection()?.isCollapsed)return;f.hidden=!0;const n=document.elementFromPoint(t.clientX,t.clientY);if(f.hidden=!1,!n)return;z();const o=n.getBoundingClientRect(),s=n.tagName.toLowerCase(),a=[...n.classList].filter(c=>!/^(astro|svelte|css)-/.test(c)).slice(0,2);u={selector:zo(n),tag:s,classes:a,nth:Tn({tag:s,classes:a}).indexOf(n),rx:o.width?(t.clientX-o.left)/o.width:.5,ry:o.height?(t.clientY-o.top)/o.height:.5,label:_(n.textContent||"").slice(0,60),ctx:Go(n),category:ln[0].id},y=null,mt.hidden=!0,g()},gs=2200,fs=900*1024,hs=8*1024*1024,G=t=>{const e=document.createElement("div");e.className="dt-toast",e.textContent=t,document.body.append(e),setTimeout(()=>e.remove(),2800)},bs=t=>new Promise(e=>{const n=new FileReader;n.onload=()=>e(String(n.result)),n.readAsDataURL(t)}),ys=async t=>{const e=await createImageBitmap(t),n=Math.min(1,gs/Math.max(e.width,e.height));if(n===1&&t.size<=fs)return e.close(),bs(t);const o=document.createElement("canvas");return o.width=Math.round(e.width*n),o.height=Math.round(e.height*n),o.getContext("2d").drawImage(e,0,0,o.width,o.height),e.close(),o.toDataURL("image/jpeg",.85)},Ge=async(t,e)=>{const n=[];for(const o of t){let s;try{s=await ys(o)}catch{G("That image could not be read.");continue}if(s.length>hs){G("Screenshot is too large even after shrinking.");continue}n.push(s)}if(n.length){if(!Number(e?.dataset.id)){u&&((u.images??=[]).push(...n),g());return}at.push(...n),g(),oo(".dt-note-reply-input")}},no=t=>[...t??[]].filter(e=>e.kind==="file"&&e.type.startsWith("image/")).map(e=>e.getAsFile()).filter(Boolean);f.addEventListener("paste",t=>{const e=no(t.clipboardData?.items);e.length&&(t.preventDefault(),Ge(e,t.target.closest(".dt-note")))}),f.addEventListener("dragover",t=>{t.target.closest(".dt-note")&&(t.preventDefault(),t.target.closest(".dt-note").querySelector(".dt-compose")?.setAttribute("data-drop",""))}),f.addEventListener("dragleave",t=>{t.target.closest(".dt-note")?.querySelector(".dt-compose")?.removeAttribute("data-drop")}),f.addEventListener("drop",t=>{const e=t.target.closest(".dt-note");if(!e)return;t.preventDefault(),e.querySelector(".dt-compose")?.removeAttribute("data-drop");const n=no(t.dataTransfer?.items);n.length&&Ge(n,e)});const oo=t=>{const e=f.querySelector(t);e?.focus(),e?.setSelectionRange(e.value.length,e.value.length)},so=()=>{oo(".dt-note-edit-input"),f.querySelector(".dt-msg .dt-compose")?.scrollIntoView({block:"nearest"})},Ve=t=>{t.style.overflowY="hidden",t.style.height="auto",t.style.height=`${t.scrollHeight}px`,t.style.overflowY=t.scrollHeight>t.clientHeight?"auto":"hidden"},vs=t=>/(?:^|\s)@([^\s@]*)$/.exec(t.value.slice(0,t.selectionStart??t.value.length)),$s=t=>{t.closest(".dt-compose").querySelector(".dt-mentions")?.remove();const n=vs(t);if(!n||!v.team?.length)return;const o=n[1].toLowerCase(),s=v.team.filter(a=>[a.name,a.nickname,a.email].some(c=>c?.toLowerCase().startsWith(o))).slice(0,5);s.length&&t.insertAdjacentHTML("afterend",`<div class="dt-mentions" role="listbox" aria-label="Mention someone">${s.map((a,c)=>`<button type="button" role="option" aria-selected="${c===0}" data-act="mention" data-handle="${m(Ns(a))}">${m(a.name||a.email)}${a.name?` <span>${m(a.email)}</span>`:""}</button>`).join("")}</div>`)},ao=(t,e)=>{const n=t.selectionStart??t.value.length,o=t.value.slice(0,n).lastIndexOf("@");t.value=`${t.value.slice(0,o)}@${e} ${t.value.slice(n)}`,t.selectionStart=t.selectionEnd=o+e.length+2,t.closest(".dt-compose")?.querySelector(".dt-mentions")?.remove(),t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus()},Es=(t,e)=>{if(!t){u&&(u.category=e),g();return}vt(n=>n.map(o=>o.id===t?{...o,category:e}:o),()=>j("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:t,category:e})}),"Changing the type")},M=document.createElement("div");M.className="dt-field-menu",M.setAttribute("role","listbox"),M.hidden=!0,document.body.append(M);for(const t of["pointerdown","mousedown","pointerup","mouseup","click","focusin","focusout"])M.addEventListener(t,e=>e.stopPropagation());let Wt=null;const Et=()=>{M.hidden=!0,Wt=null};f.addEventListener("mousedown",t=>{const e=t.target.closest(".dt-cat-select, .dt-for-select");if(!e){M.contains(t.target)||Et();return}if(t.preventDefault(),Wt===e){Et();return}Wt=e,M.innerHTML=[...e.options].map((s,a)=>`<button type="button" role="option" data-i="${a}" aria-selected="${s.selected}"><i style="background:${m(s.dataset.c||"#717171")}"></i><span>${m(s.text)}</span>${s.selected?Rt:""}</button>`).join("");const n=e.parentElement.getBoundingClientRect();M.style.left=`${n.left}px`,M.style.top=`${n.bottom+4}px`,M.style.minWidth=`${n.width}px`,M.hidden=!1;const o=M.getBoundingClientRect();o.bottom>innerHeight-8&&(M.style.top=`${n.top-4-o.height}px`)}),M.addEventListener("click",t=>{const e=t.target.closest("[data-i]");if(!e||!Wt)return;const n=Wt;Et(),n.selectedIndex!==Number(e.dataset.i)&&(n.selectedIndex=Number(e.dataset.i),n.dispatchEvent(new Event("change",{bubbles:!0})))}),document.addEventListener("keydown",t=>{t.key==="Escape"&&!M.hidden&&(t.stopPropagation(),Et())},!0),document.addEventListener("pointerdown",t=>{!M.hidden&&!M.contains(t.target)&&!t.target.closest?.(".dt-cat-select, .dt-for-select")&&Et()},!0),addEventListener("scroll",t=>{M.contains(t.target)||Et()},!0),f.addEventListener("change",t=>{const e=t.target.closest(".dt-cat-select");if(e){Es(Number(e.dataset.id)||0,e.value);return}const n=t.target.closest(".dt-for-select");if(!n)return;n.parentElement?.style.setProperty("--cat",qt(n.value));const o=Number(n.dataset.id);if(o){const s=n.value||null;vt(a=>a.map(c=>c.id===o?{...c,assignee:s??void 0}:c),()=>j("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:o,assignee:s})}),"Reassigning");return}if(u){u.assignee=n.value;try{localStorage.setItem("nm-for",n.value)}catch{}te()}}),f.addEventListener("input",t=>{const e=t.target.closest(".dt-suggest-input");if(e&&u?.suggest){u.suggest.to=e.value,te(),Ve(e);return}const n=t.target.closest(".dt-note-input, .dt-note-reply-input, .dt-note-edit-input");n&&($s(n),n.classList.contains("dt-note-input")?u&&(u.text=n.value):n.classList.contains("dt-note-edit-input")?x&&(x.text=n.value):W=n.value,te(),n.closest(".dt-compose")?.querySelector(".dt-send")?.classList.toggle("is-ready",n.value.trim()!==""),Ve(n))}),f.addEventListener("keydown",t=>{const e=t.target.closest(".dt-note-input, .dt-note-reply-input, .dt-note-edit-input");if(!e)return;const n=e.closest(".dt-compose")?.querySelector(".dt-mentions button");if(n&&(t.key==="Enter"||t.key==="Tab")&&!t.isComposing){t.preventDefault(),ao(e,n.dataset.handle);return}if(n&&t.key==="Escape"){t.stopPropagation(),n.parentElement.remove();return}t.key!=="Enter"||t.shiftKey||t.isComposing||(t.preventDefault(),e.closest(".dt-compose")?.querySelector(".dt-send")?.click())}),f.addEventListener("click",async t=>{const e=t.target.closest("button");if(!e)return;const n=e.dataset.act,o=Number(e.dataset.id);if(n==="mention"){const s=e.closest(".dt-compose")?.querySelector("textarea");s&&ao(s,e.dataset.handle);return}if(!n){if(y=y===o?null:o,y!=null&&e.dataset.off){const s=h.find(c=>c.id===o);(s&&X(s))?.scrollIntoView({block:"nearest",inline:"center",behavior:"smooth"})}z(),g();return}if(n==="record"){ss(e.closest(".dt-note"));return}if(n==="attach"){const s=Object.assign(document.createElement("input"),{type:"file",accept:"image/*",multiple:!0}),a=e.closest(".dt-note");s.addEventListener("change",()=>{s.files?.length&&Ge([...s.files],a)}),s.click();return}if(n==="unshot"){o?x&&x.drop.push(e.dataset.img):(e.closest("[data-draft]")?u?.images??[]:at).splice(Number(e.dataset.i),1),g(),x&&so();return}if(n==="edit"){const s=h.find(d=>d.id===o),a=e.dataset.at||null,c=a?s?.replies?.find(d=>d.at===a)?.text:s?.text;if(c===void 0)return;x={id:o,at:a,text:c,drop:[]},g(),so();return}if(n==="edit-cancel"){x=null,g();return}if(n==="edit-save"){const s=x;if(!s)return;const a=s.text.trim();if(!a){f.querySelector(".dt-note-edit-input")?.focus();return}x=null;const c=d=>s.drop.includes(d.split("/").pop());await vt(d=>d.map(r=>r.id!==s.id?r:{...r,...s.at==null?{text:a}:{replies:(r.replies??[]).map(l=>l.at===s.at?{...l,text:a}:l)},images:(r.images??[]).filter(l=>!c(l))}),()=>j("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:s.id,edit:{at:s.at,text:a},...s.drop.length?{removeImage:s.drop}:{}})}).then(d=>(d.ok||(x=s),d)),"Saving the edit");return}if(n==="cancel"){z(),g();return}if(n==="twin"){z(),y=Number(e.dataset.id),g();return}if(n==="discard"){u=null,g();return}if(n==="draft-open"){Pe(Number(e.dataset.i));return}if(n==="close"){y=null,g();return}if(n==="suggest"&&u){const s=Bn(X(u));u.suggest={from:s,to:s},g();const a=f.querySelector(".dt-suggest-input");a?.focus(),a?.select();return}if(n==="unsuggest"&&u){u.suggest=null,g();return}if(n==="save"){if(!u)return;const s=u.suggest&&u.suggest.to.trim()!==u.suggest.from?{from:u.suggest.from,to:u.suggest.to.trim()}:null,a=f.querySelector(".dt-note-input").value.trim()||(s?"Change the text":"");if(!a){f.querySelector(".dt-note-input")?.focus();return}const c=u,d={...c,route:K,text:a,suggest:s,assignee:v.client?void 0:c.assignee??Cn(),breakpoint:rt(),browser:Wo(),device:E?ro:"",viewport:{w:innerWidth,h:innerHeight},logs:Fs(),host:location.host},r={...c,id:-Date.now(),text:a,route:K,status:"open",note:"",doneBy:null,breakpoint:d.breakpoint,replies:[],images:[],createdAt:new Date().toISOString(),...s?{suggest:s}:{},by:v.me?.email,byName:v.me?.name};h=[...h,r],u=null,g();const l=await j("comments",{method:"POST",headers:{"content-type":"application/json"},body:JSON.stringify(d)});if(!l.ok){h=h.filter(b=>b!==r),u=c,g(),G(`Comment was not saved (${l.status}).`);return}const p=Ot([await l.json().catch(()=>null)])[0];h=h.map(b=>b===r&&p?p:b),g(),de();return}if(n==="reply"){const s=f.querySelector(".dt-note-reply-input"),a=s.value.trim();if(!a){s.focus();return}const c=at;W="",at=[];const d=h;h=h.map(p=>p.id===o?{...p,replies:[...p.replies??[],{author:"you",text:a,at:new Date().toISOString(),by:v.me?.email}]}:p),g();const r=await j("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:o,reply:a,images:c})});if(!r.ok){h=d,W=a,at=c,g(),G(`Reply was not sent (${r.status}).`);return}const l=Ot([await r.json().catch(()=>null)])[0];l&&(h=h.map(p=>p.id===l.id?l:p),g()),de();return}y=null,n==="rm"?await zn(o):n==="archive"?await ls(o):await Dt(o,n==="done")});let zt="overlay",wt="",ro="";const O=t=>{N.hidden||L.contentWindow?.postMessage({dt:!0,...t},location.origin)},ws=()=>({notes:A,grid:!Ut.hidden,inspect:pt,resolved:J,scrollbar:zt,device:wt});addEventListener("message",t=>{if(t.origin!==location.origin||!t.data?.dt)return;const e=t.data;if(!E&&t.source===L.contentWindow){if(e.key){yo(e.key[0],e.key[1])?.run();return}if(e.closeMenus){kt();return}if(e.drafts){qe=e.drafts,_n(ee());return}}if(E&&typeof e.openDraft=="number"){Pe(e.openDraft);return}if(E&&typeof e.dropDraft=="number"){Gn(e.dropDraft);return}if(E&&typeof e.device=="string"&&(ro=e.device),E&&e.scrollbar&&document.documentElement.classList.toggle("dt-sb-classic",e.scrollbar==="classic"),e.hello&&t.source===L.contentWindow){O(ws());return}typeof e.notes=="boolean"&&e.notes!==A&<(e.notes,!1),typeof e.open=="number"&&Oe(e.open),typeof e.grid=="boolean"&&e.grid===Ut.hidden&&be(e.grid),typeof e.inspect=="string"&&e.inspect!==pt&&Yt(e.inspect),typeof e.resolved=="boolean"&&e.resolved!==J&&Ke(e.resolved),e.reload&&(bt(),ie())});const de=async()=>{await bt(),ie(),O({reload:!0}),E&&parent.postMessage({dt:!0,reload:!0},location.origin)},lt=(t,e=!0)=>{if(A=t,$n.setAttribute("aria-pressed",String(t)),t?!E&&F.hidden&&localStorage.getItem("dt-history")!=="0"&&(F.hidden=!1,Jt.setAttribute("aria-pressed","true")):(F.hidden=!0,Jt.setAttribute("aria-pressed","false")),V(Ln,t?"1":"0"),O({notes:t}),E&&e&&parent.postMessage({dt:!0,notes:t},location.origin),f.hidden=!t||!N.hidden,document.documentElement.classList.toggle("dt-noting",t),t){Yt(""),document.addEventListener("click",eo,!0);for(const n of Qn)document.addEventListener(n,to,!0);document.addEventListener("keydown",Zn),document.addEventListener("mousemove",Xn),addEventListener("scroll",it,!0),addEventListener("resize",it),Un.observe(document.body,{childList:!0,subtree:!0,characterData:!0}),Yn.observe(document.body),bt()}else{z(),y=null,document.removeEventListener("click",eo,!0);for(const n of Qn)document.removeEventListener(n,to,!0);document.removeEventListener("keydown",Zn),document.removeEventListener("mousemove",Xn),mt.hidden=!0,removeEventListener("scroll",it,!0),removeEventListener("resize",it),Un.disconnect(),Yn.disconnect(),f.innerHTML=""}},ce="dt-w",Ue="dt-canvas",St="dt-device";let dt=localStorage.getItem(Ue)==="1",w=localStorage.getItem(St)||"";w&&!Vt(w)&&(w="",localStorage.setItem(St,""));let C=Number(localStorage.getItem(ce))||0;const io="dt-emu";let P=(()=>{try{return JSON.parse(localStorage.getItem(io)||"null")}catch{return null}})();const ue=()=>P?Lo.find(t=>t.id===P.id)??null:null,Ss=()=>{const t=ue();return t?P.turned?{w:t.h,h:t.w}:{w:t.w,h:t.h}:null};let _t=localStorage.getItem("dt-bars-min")==="1";const Lt=t=>{P=t,V(io,t?JSON.stringify(t):"")},Ye=t=>{Sn.textContent=t,N.style.setProperty("--dt-badge-w",`${Sn.offsetWidth}px`)},lo=t=>{if(!t){At.innerHTML="";return}let e="";for(let n=0;n<=t;n+=50)e+=`<span class="dt-tick${n%200===0?" is-major":""}" style="left:${n}px"></span>`;for(const n of I)for(const o of[n.min,n.max])o>0&&Number.isFinite(o)&&o<=t&&(e+=`<span class="dt-edge" style="left:${o}px" title="${n.label} edge"></span>`);At.innerHTML=e,At.style.width=`${t}px`},Je=()=>{const t=parseFloat(S.style.width)||0,e=parseFloat(S.style.height)||0;if(!t||!e){S.style.transform="",delete S.dataset.scaled;return}const n=w||P?Math.min(1,(innerWidth-80)/t,(innerHeight-120)/e):Math.min(1,(innerWidth-80)/t);S.style.transform=n<1?`scale(${n})`:"",S.dataset.scaled=n<1?String(Math.round(n*100)):""},Ls=t=>Lo.find(e=>e.w===t.w&&e.h===t.h&&e.cutout?.shape==="pill")?.cutout,pe=()=>{try{return L.contentDocument}catch{return null}},co=()=>pe()?.title.split("\u2014").pop()?.trim()||"",Xe=()=>{const t=pe(),e=w?Vt(w):null;if(!t?.body||!e)return;const n=Ps(t),o=e.browser==="chrome-android"?n.theme||"rgb(255, 255, 255)":n.top,s=e.browser==="chrome-android"?"rgb(255, 255, 255)":n.bottom;S.style.setProperty("--dt-top",o),S.style.setProperty("--dt-top-ink",xo(o)),S.style.setProperty("--dt-bottom",s),S.style.setProperty("--dt-bottom-ink",xo(s));const a=Ht.querySelector(".dt-win-tab > span");a&&(a.textContent=co()||location.host)};let Ze=0;L.addEventListener("load",()=>{pe()&&(Xe(),L.contentWindow?.addEventListener("scroll",()=>{Ze||(Ze=requestAnimationFrame(()=>{Ze=0,Xe()}))},{passive:!0}))});for(const t of[Ht,Xt])t.addEventListener("click",e=>{const n=e.target.closest("[data-nav]")?.dataset.nav;if(n)try{const o=L.contentWindow?.navigation;if(!pe()||!o)throw new Error("foreign");n==="back"?o.canGoBack&&o.back():n==="fwd"?o.canGoForward&&o.forward():o.reload()}catch{(n==="reload"||n==="back")&&(L.src=location.href)}});Ct.addEventListener("click",()=>{_t=!_t,V("dt-bars-min",_t?"1":"0"),ot()});const ot=()=>{if(E)return;const t=w?Vt(w)??null:null;if(w&&!t&&(w="",localStorage.setItem(St,"")),!t&&!dt){N.hidden=!0,L.removeAttribute("src"),document.documentElement.classList.remove("dt-framing"),f.hidden=!A,At.innerHTML="",Bt(),Me.hidden=!0,Ct.hidden=!0,nt=null,wt="",qe=[],Bt(),en(),A?bt():g();return}if(N.hidden=!1,document.documentElement.classList.add("dt-framing"),f.hidden=!0,L.src||(L.src=location.href),t){const e=Os(t,{host:location.host,title:co(),now:new Date,min:_t,cutout:Ls(t)}),{screen:n}=e;N.dataset.mode="device",S.dataset.shell=t.shell,S.dataset.browser=t.browser,S.style.width=`${e.footprint.w}px`,S.style.height=`${e.footprint.h}px`,S.style.setProperty("--dt-r",`${n.r}px`),S.style.setProperty("--dt-rb",`${n.rb}px`),En.innerHTML=e.shell;const o=(c,d,r,l)=>{c.innerHTML=l,c.style.cssText=`left:${n.x}px;top:${d}px;width:${n.w}px;height:${r}px`};o(Ht,n.y,e.topH,e.top),o(Xt,n.y+n.h-e.bottomH,e.bottomH,e.bottom);const s=n.h-e.topH-e.bottomH;L.style.position="absolute",L.style.left=`${n.x}px`,L.style.top=`${n.y+e.topH}px`,L.style.width=`${n.w}px`,L.style.height=`${s}px`,At.innerHTML="";const a=_t&&e.canMinimize;zt=e.scrollbar,wt=`${t.label}${a?" \xB7 bars folded":""}`,nt=Mt(t.w),O({notes:A,scrollbar:zt,device:wt}),Ct.hidden=!e.canMinimize,Ct.setAttribute("aria-pressed",String(a)),Ye(`${t.label} \xB7 page ${t.w}\xD7${s} of ${t.w}\xD7${t.h}${a?" \xB7 bars folded":""} \xB7 ${I.find(c=>c.id===nt)?.label??""}`),Xe()}else{const e=Ss();e||Lt(null);const n=e?.w||C||I.find(a=>a.id===rt()).ideal;C=n,N.dataset.mode="canvas",delete S.dataset.shell,delete S.dataset.browser,En.innerHTML=Ht.innerHTML=Xt.innerHTML="",Ht.style.cssText=Xt.style.cssText="",Ct.hidden=!0,zt="overlay",S.style.width=`${n}px`,S.style.height=`${e?.h??innerHeight-84}px`,L.style.position="",L.style.left=L.style.top="",L.style.width="100%",L.style.height="100%",lo(n),O({notes:A});const o=I.find(a=>a.id===Mt(n)),s=ue();wt=s?`${s.label}${P?.turned?" \xB7 landscape":""}`:"",O({scrollbar:zt,device:wt}),Ye(s&&e?`${s.label} \xB7 ${e.w}\xD7${e.h} \xB7 ${o.label}`:`${n}px \xB7 ${o.label}`),nt=Mt(n)}Me.hidden=!(ue()?.rotates&&!t),en(),Je(),Bt(),A?bt():g()},Qe=t=>{const e=I.find(n=>n.id===t);w="",localStorage.setItem(St,""),Lt(null),dt=t!==fe,C=dt?e.ideal:0,nt=dt?t:null,localStorage.setItem(Ue,dt?"1":"0"),localStorage.setItem(ce,String(C)),y=null,z(),ot()};for(const t of xe)t.addEventListener("click",()=>Qe(t.dataset.bp));for(const t of document.querySelectorAll("[data-device]"))t.addEventListener("click",()=>{w=t.dataset.device===w?"":t.dataset.device,localStorage.setItem(St,w),Y.open=!1,ot()});for(const t of document.querySelectorAll("[data-emu]"))t.addEventListener("click",()=>{const e=P?.id===t.dataset.emu&&!w;w="",localStorage.setItem(St,""),Lt(e?null:{id:t.dataset.emu,turned:!1}),dt=!e,C=0,localStorage.setItem(Ue,dt?"1":"0"),nt=null,y=null,z(),Y.open=!1,ot()});Me.addEventListener("click",()=>{P&&(Lt({...P,turned:!P.turned}),y=null,z(),ot())});const uo=[...Y.querySelectorAll("[data-tab]")],xs=[...Y.querySelectorAll("[data-panel]")],po=t=>{for(const e of uo)e.setAttribute("aria-selected",String(e.dataset.tab===t));for(const e of xs)e.hidden=e.dataset.panel!==t;V("dt-devices-tab",t)};for(const t of uo)t.addEventListener("click",()=>po(t.dataset.tab));po(localStorage.getItem("dt-devices-tab")==="devtools"?"devtools":"preview");const tn=Y.querySelector(".dt-emu-search");tn.addEventListener("input",()=>{const t=tn.value.trim().toLowerCase();let e=null,n=!1;const o=()=>{e&&(e.hidden=!n)};for(const s of tn.parentElement.children){if(s.classList.contains("dt-devices-group")){o(),e=s,n=!1;continue}s.dataset.emu&&(s.hidden=!!t&&!s.textContent.toLowerCase().includes(t),n||=!s.hidden)}o()});const Ts=Y.querySelector(".dt-devices-name");function en(){for(const e of Y.querySelectorAll("[data-device]"))e.setAttribute("aria-pressed",String(e.dataset.device===w));const t=!w&&!N.hidden?P?.id:void 0;for(const e of Y.querySelectorAll("[data-emu]"))e.setAttribute("aria-pressed",String(e.dataset.emu===t));Ts.textContent=w&&Vt(w)?.label||t&&ue()?.label||"Device"}const nn=t=>I.find(e=>e.id===t),Ms=t=>{const e=nn(nt??rt());return Math.max(e.min||320,Math.min(Number.isFinite(e.max)?e.max:2560,Math.round(t)))};for(const t of Po){const e=t.dataset.edge==="l"?-1:1;t.addEventListener("pointerdown",n=>{if(w)return;n.preventDefault(),P&&(Lt(null),ot()),t.setPointerCapture(n.pointerId);const o=n.clientX,s=C,a=Number(S.dataset.scaled||100)/100;N.dataset.dragging="1";const c=r=>{C=Ms(s+e*(r.clientX-o)*2/a),S.style.width=`${C}px`,lo(C),Ye(`${C}px \xB7 ${nn(Mt(C)).label}`),Je()},d=()=>{t.removeEventListener("pointermove",c),t.removeEventListener("pointerup",d),delete N.dataset.dragging,localStorage.setItem(ce,String(C)),ot()};t.addEventListener("pointermove",c),t.addEventListener("pointerup",d)}),t.addEventListener("dblclick",()=>{if(w)return;Lt(null);const n=nn(nt??rt()),o=[n.min||320,Number.isFinite(n.max)?n.max:n.ideal];C=Math.abs(C-o[0])<Math.abs(C-o[1])?o[0]:o[1],localStorage.setItem(ce,String(C)),ot()})}let mo=rt();addEventListener("resize",()=>{Bt(),rt()!==mo&&(mo=rt(),g()),N.hidden||(!w&&!P&&(S.style.height=`${innerHeight-84}px`),Je())});const go="dt-studio",fo=t=>{Te.setAttribute("aria-pressed",String(t)),document.documentElement.classList.toggle("dt-no-studio",!t),V(go,t?"1":"0")};Te.addEventListener("click",()=>fo(Te.getAttribute("aria-pressed")!=="true")),fo(localStorage.getItem(go)!=="0"),$n.addEventListener("click",()=>lt(!A));const xt=document.querySelector(".devtools"),Gt=document.querySelector(".dt-tab"),ho=t=>{xt.toggleAttribute("data-collapsed",t),Gt.toggleAttribute("data-collapsed",t),Gt.setAttribute("aria-expanded",String(!t)),Gt.setAttribute("aria-label",t?"Show the bar":"Hide the bar");for(const e of xt.querySelectorAll(".dt-group"))e.inert=t;t&&kt(),V("dt-collapsed",t?"1":"0")};Gt.addEventListener("click",()=>ho(!xt.hasAttribute("data-collapsed")));const on=document.querySelector(".dt-keys"),ct=t=>()=>xt.querySelector(t)?.click(),bo=t=>()=>{const e=[...document.querySelectorAll(".dt-pages a")];e[e.findIndex(n=>n.hasAttribute("aria-current"))+t]?.click()},me=[{group:"Comments",code:"KeyC",hint:"C",label:"Comment mode",el:".dt-notes-btn",run:ct(".dt-notes-btn")},{group:"Comments",code:"KeyC",shift:!0,hint:"\u21E7C",label:"Comments panel",el:".dt-history-btn",run:ct(".dt-history-btn")},{group:"Comments",code:"KeyR",hint:"R",label:"Show resolved",el:".dt-resolved-btn",run:ct(".dt-resolved-btn")},{group:"Inspect",code:"KeyG",hint:"G",label:"Grid",el:".dt-grid-btn",run:ct(".dt-grid-btn")},{group:"Inspect",code:"KeyP",hint:"P",label:"Spacing",el:".dt-pad-btn",run:ct(".dt-pad-btn")},{group:"Inspect",code:"KeyS",hint:"S",label:"Size",el:".dt-size-btn",run:ct(".dt-size-btn")},{group:"Inspect",code:"KeyT",hint:"T",label:"Typography",el:".dt-type-btn",run:ct(".dt-type-btn")},...v.sanity?[{group:"Inspect",code:"KeyE",hint:"E",label:"Sanity overlay",el:".dt-studio-btn",run:ct(".dt-studio-btn")}]:[],...xe.slice(0,9).map((t,e)=>({group:"Breakpoints",code:`Digit${e+1}`,hint:String(e+1),label:t.dataset.tip??t.title,el:`.dt-bp[data-bp="${t.dataset.bp}"]`,run:()=>t.click()})),{group:"View",code:"KeyD",hint:"D",label:"Devices",run:()=>{Y.open=!Y.open}},{group:"View",code:"BracketLeft",hint:"[",label:"Previous page",run:bo(-1)},{group:"View",code:"BracketRight",hint:"]",label:"Next page",run:bo(1)},{group:"View",code:"Backslash",hint:"\\",label:"Hide the bar",run:()=>Gt.click()},{group:"View",code:"Slash",shift:!0,hint:"?",label:"This list",el:".dt-keys summary",run:()=>{on.open=!on.open}}].filter(t=>!v.client||t.group!=="Inspect"),yo=(t,e)=>me.find(n=>n.code===t&&!n.shift==!e),ks=t=>t instanceof HTMLElement&&(t.isContentEditable||/^(INPUT|TEXTAREA|SELECT)$/.test(t.tagName));if(v.shortcuts){for(const e of me){const n=e.el&&xt.querySelector(e.el);n&&(n.dataset.tip=`${n.dataset.tip??e.label} \xB7 ${e.hint}`,n.setAttribute("aria-keyshortcuts",e.hint.startsWith("\u21E7")?`Shift+${e.hint.slice(1)}`:e.hint))}const t=(e,n)=>`<div class="dt-key-row"><span>${m(e)}</span><kbd>${m(n)}</kbd></div>`;if(on.querySelector(".dt-keys-menu").innerHTML='<p class="dt-menu-note">One key, no modifier, in any keyboard layout. Not while you type.</p>'+[...new Set(me.map(e=>e.group))].map(e=>`<p class="dt-devices-group">${e}</p>`+me.filter(n=>n.group===e).map(n=>t(n.label,n.hint)).join("")).join("")+'<p class="dt-devices-group">In a comment</p>'+t("Send","Enter")+t("New line","\u21E7Enter")+t("Close, cancel, back out","Esc"),document.addEventListener("keydown",e=>{if(e.repeat||e.isComposing||e.metaKey||e.ctrlKey||e.altKey||e.defaultPrevented||ks(e.target))return;const n=yo(e.code,e.shiftKey);n&&(e.preventDefault(),E?parent.postMessage({dt:!0,key:[e.code,e.shiftKey]},location.origin):n.run())}),E){const e=()=>parent.postMessage({dt:!0,closeMenus:!0},location.origin);document.addEventListener("pointerdown",e,!0),document.addEventListener("keydown",n=>{n.key==="Escape"&&e()})}}if(!E){ho(localStorage.getItem("dt-collapsed")==="1"),requestAnimationFrame(()=>requestAnimationFrame(()=>xt.setAttribute("data-ready",""))),dt||w?ot():en(),be(localStorage.getItem(cn)==="1");const t=localStorage.getItem(gn);t&&t in $e&&Yt(t),lt(localStorage.getItem(Ln)==="1")}const vo=()=>{try{const t=JSON.parse(localStorage.getItem(yt)||"null");q=(t?.parked??[]).filter(e=>Zt(e)),t?.draft&&document.querySelector(t.draft.selector)?(u=t.draft,!A&&!E&<(!0)):Zt(t?.draft)&&q.push(t.draft),t?.reply?.text&&(W=t.reply.text,Nt=y=t.reply.for??null),(u||q.length||W)&&g()}catch{localStorage.removeItem(yt)}};vo();const $o=()=>setTimeout(()=>{const t=he(location.pathname);t!==K&&(clearTimeout(Qt),Ae(),K=t,yt=xn(),u=null,q=[],W="",Nt=null,y=null,x=null,h=[],pn(),vo(),bt())});for(const t of["pushState","replaceState"]){const e=window.history[t];window.history[t]=function(...n){e.apply(this,n),$o()}}addEventListener("popstate",$o),A||bt(),ie().then(()=>{ae()&&re()}),document.addEventListener("visibilitychange",()=>{document.hidden||Kt()}),addEventListener("focus",Kt),addEventListener("notemend:changed",()=>{E||Kt()});let Hs=0;E||setInterval(()=>{(!qs.live||++Hs%6===0)&&Kt()},2e4),E&&parent.postMessage({dt:!0,hello:!0},location.origin)}export{Ys as run};
|