notemend 0.1.12 → 0.1.13
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/package.json +1 -1
- package/src/client/field-menu.js +1 -1
- package/src/client/notemend.css +1 -1
- package/src/client/run.js +70 -69
- package/src/store/thread.mjs +1 -1
package/package.json
CHANGED
|
@@ -1,6 +1,6 @@
|
|
|
1
1
|
{
|
|
2
2
|
"name": "notemend",
|
|
3
|
-
"version": "0.1.
|
|
3
|
+
"version": "0.1.13",
|
|
4
4
|
"mcpName": "io.github.zharkodv-cmd/notemend",
|
|
5
5
|
"description": "A dev-only toolbar for Astro and Next.js sites: pinned page comments Claude Code can read and answer, spacing/size/type inspectors in design px, a layout grid, breakpoint canvas and device preview.",
|
|
6
6
|
"keywords": [
|
package/src/client/field-menu.js
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const p=(o,d)=>`<svg class="dt-bars" viewBox="0 0 12 12" width="12" height="12" aria-hidden="true">${[0,1,2,3].map(i=>`<rect x="${.5+i*3}" y="${8.5-i*2.5}" width="2" height="${3+i*2.5}" rx="0.6" fill="${d}" stroke="none" opacity="${i<o?1:.28}"/>`).join("")}</svg>`;function f(o,d,i){const t=document.createElement("div");t.className="dt-field-menu",t.setAttribute("role","listbox"),t.hidden=!0,document.body.append(t);for(const e of["pointerdown","mousedown","pointerup","mouseup","click","focusin","focusout"])t.addEventListener(e,a=>a.stopPropagation());let r=null;const l=()=>{t.hidden=!0,r=null};o.addEventListener("mousedown",e=>{const a=e.target.closest(".dt-cat-select, .dt-for-select");if(!a){t.contains(e.target)||l();return}if(e.preventDefault(),r===a){l();return}r=a,t.innerHTML=[...a.options].map((n,u)
|
|
1
|
+
const p=(o,d)=>`<svg class="dt-bars" viewBox="0 0 12 12" width="12" height="12" aria-hidden="true">${[0,1,2,3].map(i=>`<rect x="${.5+i*3}" y="${8.5-i*2.5}" width="2" height="${3+i*2.5}" rx="0.6" fill="${d}" stroke="none" opacity="${i<o?1:.28}"/>`).join("")}</svg>`;function f(o,d,i){const t=document.createElement("div");t.className="dt-field-menu",t.setAttribute("role","listbox"),t.hidden=!0,document.body.append(t);for(const e of["pointerdown","mousedown","pointerup","mouseup","click","focusin","focusout"])t.addEventListener(e,a=>a.stopPropagation());let r=null;const l=()=>{t.hidden=!0,r=null};o.addEventListener("mousedown",e=>{const a=e.target.closest(".dt-cat-select, .dt-for-select, .dt-status-select");if(!a){t.contains(e.target)||l();return}if(e.preventDefault(),r===a){l();return}r=a,t.innerHTML=[...a.options].map((n,u)=>`${n.dataset.sep!=null?"<hr>":""}<button type="button" role="option" data-i="${u}" aria-selected="${n.selected}">${n.dataset.bars?p(Number(n.dataset.bars),d(n.dataset.c||"#717171")):n.dataset.initial!=null?n.dataset.face?`<img class="dt-face${n.dataset.agent!=null?" dt-face--agent":""}" src="${d(n.dataset.face)}" alt="">`:`<b class="dt-face${n.dataset.agent!=null?" dt-face--agent":""}" aria-hidden="true">${d(n.dataset.initial)}</b>`:`<i style="background:${d(n.dataset.c||"#717171")}"></i>`}<span>${d(n.dataset.label||n.text)}</span>${n.selected?i:""}</button>`).join("");const s=a.parentElement.getBoundingClientRect();t.style.left=`${s.left}px`,t.style.top=`${s.bottom+4}px`,t.style.minWidth=`${s.width}px`,t.hidden=!1;const c=t.getBoundingClientRect();c.bottom>innerHeight-8&&(t.style.top=`${s.top-4-c.height}px`)}),t.addEventListener("click",e=>{const a=e.target.closest("[data-i]");if(!a||!r)return;const s=r;l(),s.selectedIndex!==Number(a.dataset.i)&&(s.selectedIndex=Number(a.dataset.i),s.dispatchEvent(new Event("change",{bubbles:!0})))}),document.addEventListener("keydown",e=>{e.key==="Escape"&&!t.hidden&&(e.stopPropagation(),l())},!0),document.addEventListener("pointerdown",e=>{!t.hidden&&!t.contains(e.target)&&!e.target.closest?.(".dt-cat-select, .dt-for-select, .dt-status-select")&&l()},!0),addEventListener("scroll",e=>{t.contains(e.target)||l()},!0)}export{p as bars,f as fieldMenus};
|
package/src/client/notemend.css
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
:root{--dt-bg: #121212;--dt-panel: #171717;--dt-raised: #1d1d1d;--dt-ink: #ffffff;--dt-ink-2: #d6d6d6;--dt-muted: #afafaf;--dt-faint: #717171;--dt-accent: #ff5a00;--dt-accent-ink: #000000}.devtools{position:fixed;bottom:16px;left:50%;transform:translate(-50%);z-index:calc(var(--dt-z) + 2);display:flex;align-items:center;gap:6px;padding:5px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .08);border-radius:999px;box-shadow:0 1px #ffffff0f inset,0 10px 34px #00000080;font:500 11px/1 ui-sans-serif,system-ui,sans-serif}.devtools[data-ready]{transition:transform .24s cubic-bezier(.22,1,.36,1)}.devtools[data-collapsed]{transform:translate(-50%,calc(100% + 16px))}.dt-tab{position:fixed;bottom:0;left:50%;z-index:calc(var(--dt-z) + 3);transform:translate(-50%);display:grid;place-items:center;width:44px;height:12px;padding:0;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .1);border-bottom:0;border-radius:8px 8px 0 0;color:var(--dt-muted);cursor:pointer;transition:color .14s cubic-bezier(.22,1,.36,1),height .14s cubic-bezier(.22,1,.36,1)}.dt-tab:hover{height:14px;color:#fff}.dt-tab:focus-visible{outline:2px solid var(--dt-accent);outline-offset:1px}html.dt-in-frame .dt-tab{display:none}.dt-tab svg{display:block;width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .24s cubic-bezier(.22,1,.36,1)}.dt-tab[data-collapsed] svg{transform:rotate(180deg)}@media(prefers-reduced-motion:reduce){.devtools[data-ready],.dt-tab svg{transition:none}}.dt-group{position:relative;display:flex;align-items:center;gap:2px;padding:2px;background:#ffffff0d;border-radius:999px}.dt-group--menus{background:transparent;padding:0;gap:4px}.dt-icon[data-tip]:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);z-index:1;width:max-content;max-width:220px;padding:6px 8px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);border-radius:6px;box-shadow:0 6px 18px #00000080;color:var(--dt-ink-2);font:400 11px/1.4 ui-sans-serif,system-ui,sans-serif;text-align:left;white-space:normal;pointer-events:none;opacity:0;transition:opacity .12s cubic-bezier(.22,1,.36,1)}.dt-icon[data-tip]:hover:after,.dt-icon[data-tip]:focus-visible:after{opacity:1}.dt-icon{display:inline-flex;align-items:center;justify-content:center;position:relative;width:28px;height:28px;padding:0;background:transparent;border:0;border-radius:999px;color:var(--dt-muted);cursor:pointer;transition:color .16s cubic-bezier(.22,1,.36,1),background-color .16s cubic-bezier(.22,1,.36,1)}.dt-icon svg,.dt-devices summary svg,.dt-pages summary svg{flex:none;max-width:none;width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}.dt-bp svg{width:16px;height:16px}.dt-icon:hover{color:var(--dt-ink);background:#ffffff1a}.dt-icon:focus-visible{outline:2px solid var(--dt-accent);outline-offset:1px}.dt-icon:active{transform:scale(.94)}.dt-icon[aria-pressed=true]{color:var(--dt-accent-ink);background:var(--dt-accent)}.dt-icon[hidden]{display:none}@media(prefers-reduced-motion:reduce){.dt-icon{transition:none}.dt-icon:active{transform:none}}.dt-pages summary::-webkit-details-marker,.dt-devices summary::-webkit-details-marker{display:none}.dt-pages{position:relative}.dt-pages ul,.dt-devices-menu,.dt-keys-menu{color-scheme:dark;scrollbar-width:thin;scrollbar-color:rgb(255 255 255 / .22) transparent}.dt-pages ul{position:absolute;left:0;bottom:calc(100% + 10px);width:320px;max-height:60vh;padding:8px 4px 12px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .1);border-radius:12px;box-shadow:0 12px 40px #0000008c;overflow-y:auto;overscroll-behavior:contain}.dt-pages-group,.dt-devices-group{margin:12px -4px;padding:12px 16px 0;border-top:1px solid rgb(255 255 255 / .08);color:var(--dt-muted);font:600 9px/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:.5px;text-transform:uppercase}.dt-pages-group:first-child,.dt-devices-group:first-child{margin-top:0;padding-top:4px;border-top:0}.dt-pages a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 12px;border-radius:8px;color:var(--dt-ink-2);font:500 11px/1.3 ui-sans-serif,system-ui,sans-serif;transition:background-color .14s cubic-bezier(.22,1,.36,1)}.dt-pages a:hover{background:#ffffff14;color:#fff}.dt-pages a[aria-current]{color:#fff}.dt-turbo{all:unset;position:absolute;left:calc(100% + 8px);top:50%;transform:translateY(-50%);display:grid;place-items:center;height:40px;padding:0 6px;box-sizing:border-box;border-radius:999px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .08);box-shadow:0 1px #ffffff0f inset,0 10px 34px #00000080;cursor:pointer}.dt-turbo[hidden]{display:none}.dt-turbo:focus-visible{outline:2px solid var(--dt-accent);outline-offset:2px}.dt-turbo-switch{position:relative;display:block;width:46px;height:26px;border-radius:999px;background:#ffffff24;transition:background .16s ease-out}.dt-turbo:hover .dt-turbo-switch{background:#fff3}.dt-turbo-knob{position:absolute;top:3px;left:3px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#fff;color:#8d8d8d;box-shadow:0 1px 2px #0006;transition:transform .18s cubic-bezier(.22,1,.36,1),color .16s ease-out}.dt-turbo-knob svg{fill:currentColor;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round}.dt-turbo[data-state=on] .dt-turbo-switch{background:var(--dt-accent)}.dt-turbo[data-state=on] .dt-turbo-knob{transform:translate(20px);color:var(--dt-accent)}.dt-turbo[data-state=none] .dt-turbo-switch{opacity:.4}@media(prefers-reduced-motion:reduce){.dt-turbo-switch,.dt-turbo-knob{transition:none}}.dt-turbo[data-tip]:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 10px);right:0;width:max-content;max-width:240px;padding:6px 8px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);border-radius:6px;box-shadow:0 6px 18px #00000080;color:var(--dt-ink-2);font:400 11px/1.4 ui-sans-serif,system-ui,sans-serif;text-align:left;white-space:normal;pointer-events:none;opacity:0;transition:opacity .12s cubic-bezier(.22,1,.36,1)}.dt-turbo:hover:after,.dt-turbo:focus-visible:after{opacity:1}.dt-brand{display:block;height:22px;max-width:88px;margin:0 4px 0 8px;object-fit:contain;flex:none}.dt-notes-count{position:absolute;top:-3px;right:-3px;pointer-events:none;display:grid;place-items:center;min-width:14px;height:14px;padding:0;box-sizing:border-box;background:#f5c451;border:2px solid var(--dt-bg);border-radius:999px;color:#121212;font:700 9px/10px ui-sans-serif,system-ui,sans-serif;text-align:center}.dt-notes-count[data-state=claude]{background:#d97757;color:#fff}.dt-notes-count[data-state=done]{background:#4f8f41;color:#fff}.dt-notes-count svg{display:block;width:8px;height:8px}.dt-notes-count[hidden]{display:none}.dt-host{position:fixed;inset:0 auto auto 0;width:0;height:0;margin:0;padding:0;border:0;background:none;color:inherit;overflow:visible}.dt-frame[hidden]{display:none}html.dt-framing,html.dt-framing body{overflow:hidden}.dt-frame{position:fixed;inset:0;z-index:var(--dt-z);cursor:default;display:grid;place-items:center;place-content:center;background:var(--dt-bg)}.dt-frame[data-mode=device] .dt-ruler{display:none}.dt-device{max-height:calc(100vh - 32px);border-radius:4px;overflow:hidden}.dt-frame iframe{display:block;max-height:calc(100vh - 64px);border:0;background:#fff}.dt-device[data-shell]{position:relative;overflow:visible;max-height:none;border-radius:0;transform-origin:center}.dt-device[data-shell] iframe{z-index:1;max-height:none}.dt-shell{position:absolute;inset:0;pointer-events:none}.dt-shell svg{display:block}.dt-shell-body{fill:#1c1c1e;stroke:#4a4a4e;stroke-width:1.5}.dt-shell-body--light{fill:#d8d8dd;stroke:#aeaeb2}.dt-shell-bezel{fill:#050505}.dt-shell-btn{fill:#3a3a3c}.dt-shell-slot{fill:#2c2c2e}.dt-shell-homebtn{fill:#0c0c0d;stroke:#3a3a3c;stroke-width:2}.dt-shell-screen{fill:var(--dt-top, #fff)}.dt-shell-base{fill:#2c2c2e}.dt-shell-base--silver{fill:#c9c9ce}.dt-shell-lip{fill:#8e8e93}.dt-shell-stand{fill:#c7c7cc}.dt-chrome{position:absolute;z-index:2;box-sizing:border-box;overflow:hidden;pointer-events:none;font-family:-apple-system,system-ui,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased}.dt-chrome:empty{display:none}.dt-chrome[data-at=top]{border-radius:var(--dt-r) var(--dt-r) 0 0;background:var(--dt-top, #fff);color:var(--dt-top-ink, #000)}.dt-chrome[data-at=bottom]{border-radius:0 0 var(--dt-rb) var(--dt-rb);background:var(--dt-bottom, #fff);color:var(--dt-bottom-ink, #000)}.dt-chrome button{display:grid;place-items:center;padding:0;background:none;border:0;color:inherit;cursor:pointer;pointer-events:auto}.dt-i{flex:none;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.dt-i--fill{fill:currentColor;stroke:none}.dt-i--batt{width:26px;height:13px;stroke:none}.dt-bar-group{display:flex;align-items:center;gap:14px}.dt-sb{position:relative}.dt-island{position:absolute;background:#000;border-radius:19px}.dt-sb-time,.dt-sb-icons{position:absolute;display:flex;align-items:center;justify-content:center}.dt-sb-time{left:0;right:calc(50% + 64px);font:600 17px/1 -apple-system,system-ui,sans-serif}.dt-sb-icons{left:calc(50% + 64px);right:0;gap:6px}.dt-sb-icons .dt-i{width:17px;height:17px}.dt-sb--mini{display:flex;align-items:center;justify-content:space-between;padding:0 6px;font:600 12px/1 -apple-system,system-ui,sans-serif}.dt-sb--mini .dt-i{width:13px;height:13px}.dt-sb--mini .dt-i--batt{width:22px;height:11px}.dt-sb-l,.dt-sb-r{display:flex;align-items:center;gap:5px}.dt-ios-bar{position:relative}.dt-ios-row{position:absolute;top:8px;left:14px;right:14px;display:flex;align-items:center;gap:8px;height:48px}.dt-device[data-shell=home] .dt-ios-row{top:auto;bottom:22px}.dt-chrome .dt-glass{background:#ffffffbd;-webkit-backdrop-filter:blur(16px) saturate(180%);backdrop-filter:blur(16px) saturate(180%);box-shadow:0 2px 12px #00000024,inset 0 0 0 .5px #ffffffb3;color:#111}.dt-glass--round{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%}.dt-ios-url{position:relative;display:flex;align-items:center;justify-content:center;flex:1;min-width:0;height:48px;border-radius:24px;font:500 15px/1 -apple-system,system-ui,sans-serif}.dt-ios-url>span{overflow:hidden;padding:0 34px;white-space:nowrap;text-overflow:ellipsis}.dt-ios-url button{position:absolute;right:12px}.dt-ios-mini{position:absolute;top:6px;left:50%;transform:translate(-50%);max-width:70%;padding:7px 14px;overflow:hidden;border-radius:14px;font:500 12px/1 -apple-system,system-ui,sans-serif;white-space:nowrap;text-overflow:ellipsis;background:#ffffffbd;box-shadow:0 1px 8px #0000001f;color:#111}.dt-home-ind{position:absolute;bottom:8px;left:50%;width:134px;height:5px;transform:translate(-50%);border-radius:3px;background:currentColor}.dt-sb--android{display:flex;align-items:center;justify-content:space-between;padding:0 18px;font:500 13px/1 Roboto,system-ui,sans-serif}.dt-sb--android .dt-i{width:14px;height:14px}.dt-sb--android .dt-i--batt{width:22px;height:11px}.dt-punch{position:absolute;top:12px;left:50%;width:12px;height:12px;transform:translate(-50%);border-radius:50%;background:#000}.dt-and-bar{display:flex;align-items:center;gap:10px;height:56px;padding:0 8px 0 10px}.dt-and-url{display:flex;align-items:center;gap:10px;flex:1;min-width:0;height:40px;padding:0 14px;border-radius:24px;background:color-mix(in srgb,currentColor 8%,transparent);font:400 15px/1 Roboto,system-ui,sans-serif}.dt-and-url span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dt-and-tabs{display:grid;place-items:center;width:18px;height:18px;border:2px solid currentColor;border-radius:4px;font:700 10px/1 Roboto,system-ui,sans-serif}.dt-and-nav{display:flex;align-items:center;justify-content:space-around;height:48px;color:#3c3c3c}.dt-device[data-browser=chrome-android] .dt-chrome[data-at=bottom]{background:#fff}.dt-sb--flat{display:flex;align-items:center;justify-content:space-between;padding:0 22px;font:600 12px/1 -apple-system,system-ui,sans-serif}.dt-sb--flat .dt-i{width:14px;height:14px}.dt-ipad-bar{display:flex;align-items:center;justify-content:space-between;height:50px;padding:0 18px}.dt-ipad-url,.dt-mac-url{position:relative;display:flex;align-items:center;justify-content:center;gap:6px;width:44%;height:34px;border-radius:10px;background:color-mix(in srgb,currentColor 8%,transparent);font:500 13px/1 -apple-system,system-ui,sans-serif}.dt-ipad-url .dt-i,.dt-mac-url .dt-i{width:13px;height:13px}.dt-ipad-url button,.dt-mac-url button{position:absolute;right:10px}.dt-ipad-foot{position:relative;height:100%}.dt-ipad-foot .dt-home-ind{bottom:6px;width:180px}.dt-device[data-browser=safari-mac] .dt-chrome[data-at=top]{background:#f6f6f6;color:#1d1d1f}.dt-mac-menu{position:relative;display:flex;align-items:center;justify-content:space-between;height:33px;padding:0 18px;background:#ececec;font:400 13px/1 -apple-system,system-ui,sans-serif}.dt-mac-apps{display:flex;gap:20px}.dt-mac-notch{position:absolute;top:0;left:50%;width:196px;height:33px;transform:translate(-50%);border-radius:0 0 10px 10px;background:#000}.dt-mac-menu .dt-sb-r{gap:12px}.dt-mac-menu .dt-i{width:15px;height:15px}.dt-mac-bar{display:flex;align-items:center;gap:18px;height:52px;padding:0 18px;border-bottom:1px solid #d9d9d9;color:#555}.dt-mac-url{margin:0 auto;background:#fff;box-shadow:inset 0 0 0 1px #dcdcdc;color:#1d1d1f}.dt-lights{display:flex;gap:9px}.dt-lights i{width:14px;height:14px;border-radius:50%;background:#ff5f57}.dt-lights i:nth-child(2){background:#febc2e}.dt-lights i:nth-child(3){background:#28c840}.dt-mac-dock{display:grid;place-items:center;height:100%;background:linear-gradient(135deg,#5b7fd1,#8a4fd0 55%,#d06a8a)}.dt-dock,.dt-win-apps{display:flex;align-items:center;gap:6px}.dt-dock{padding:5px 8px;border-radius:16px;background:#ffffff4d;box-shadow:inset 0 0 0 .5px #ffffff80}.dt-dock i,.dt-win-apps i{width:40px;height:40px;border-radius:10px;background:linear-gradient(160deg,hsl(var(--hue) 75% 62%),hsl(var(--hue) 70% 45%))}.dt-device[data-browser=chrome-windows] .dt-chrome[data-at=top]{background:#dfe3e8;color:#202124}.dt-device[data-browser=chrome-windows] .dt-chrome[data-at=bottom]{background:#eef1f5;color:#1d1d1f}.dt-win-tabs{display:flex;align-items:flex-end;height:41px;padding-left:8px}.dt-win-tab{display:flex;align-items:center;gap:8px;width:240px;height:34px;box-sizing:border-box;padding:0 10px;border-radius:8px 8px 0 0;background:#fff;font:400 12px/1 Segoe UI,system-ui,sans-serif}.dt-win-tab span{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dt-win-tab .dt-i{width:14px;height:14px}.dt-fav{flex:none;width:16px;height:16px;border-radius:50%;background:#9aa0a6}.dt-win-new{display:grid;place-items:center;align-self:center;width:28px;height:28px;margin-left:6px}.dt-win-ctrl{display:flex;align-self:stretch;margin-left:auto}.dt-win-ctrl .dt-i{width:46px;height:41px;padding:12px 14px;box-sizing:border-box;stroke-width:1.2}.dt-win-bar{display:flex;align-items:center;gap:12px;height:46px;padding:0 12px;border-bottom:1px solid #dadce0;background:#fff;color:#5f6368}.dt-win-url{display:flex;align-items:center;gap:10px;flex:1;height:34px;padding:0 14px;border-radius:17px;background:#f1f3f4;color:#202124;font:400 14px/1 Segoe UI,system-ui,sans-serif}.dt-win-url span{flex:1}.dt-win-task{position:relative;display:flex;align-items:center;justify-content:center;height:100%;border-top:1px solid #d3d7dd}.dt-win-apps i{width:32px;height:32px;border-radius:6px}.dt-win-tray{position:absolute;right:14px;display:flex;align-items:center;gap:10px;font:400 11px/1.35 Segoe UI,system-ui,sans-serif;text-align:right}.dt-win-tray .dt-i{width:15px;height:15px}html.dt-in-frame .devtools{display:none}html.dt-in-frame,html.dt-in-frame body{scrollbar-width:none}html.dt-in-frame::-webkit-scrollbar,html.dt-in-frame body::-webkit-scrollbar{display:none}html.dt-in-frame.dt-sb-classic{scrollbar-width:auto}html.dt-in-frame.dt-sb-classic::-webkit-scrollbar{display:block;width:15px;background:#f1f1f1}html.dt-in-frame.dt-sb-classic::-webkit-scrollbar-thumb{background:#c1c1c1;border:4px solid #f1f1f1;border-radius:8px}html.dt-in-frame astro-dev-toolbar,html.dt-in-frame sanity-visual-editing{display:none}.dt-ruler{position:relative;height:22px;margin-top:6px;border-top:1px solid rgb(255 255 255 / .14)}.dt-ruler span{position:absolute;top:0}.dt-tick{width:1px;height:5px;background:#ffffff40}.dt-tick.is-major{height:9px;background:#ffffff73}.dt-edge{width:1px;height:22px;background:#0d99ff;opacity:.7}.dt-frame-size{position:fixed;top:12px;left:50%;transform:translate(-50%);padding:4px 10px;background:#0009;border:1px solid rgb(255 255 255 / .12);border-radius:999px;color:var(--dt-ink);font:500 11px/1 ui-sans-serif,system-ui,sans-serif;pointer-events:none}.dt-frame-btn{position:fixed;top:12px;left:calc(50% + var(--dt-badge-w, 0px) / 2 + 8px);display:grid;place-items:center;width:24px;height:24px;padding:0;background:#0009;border:1px solid rgb(255 255 255 / .12);border-radius:50%;color:var(--dt-ink);cursor:pointer}.dt-frame-btn:hover,.dt-frame-btn[aria-pressed=true]{background:var(--dt-accent);border-color:var(--dt-accent);color:var(--dt-accent-ink)}.dt-frame-btn[hidden]{display:none}.dt-frame-btn svg{display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.dt-stage{display:flex;align-items:stretch;gap:6px}.dt-frame-handle{flex:none;align-self:center;width:6px;height:72px;background:#ffffff47;border-radius:999px;cursor:ew-resize;touch-action:none;transition:background-color .12s,height .12s}.dt-frame[data-mode=device] .dt-frame-handle{visibility:hidden}.dt-frame-handle:hover,.dt-frame[data-dragging] .dt-frame-handle{background:var(--dt-accent);height:120px}.dt-devices,.dt-keys{position:relative}.dt-devices summary,.dt-pages summary{display:inline-flex;align-items:center;gap:6px;height:28px;padding-inline:10px;background:#ffffff0d;border-radius:999px;color:var(--dt-ink);font:500 11px/1 ui-sans-serif,system-ui,sans-serif;white-space:nowrap;list-style:none;cursor:pointer;transition:background-color .16s cubic-bezier(.22,1,.36,1)}.dt-devices summary:hover,.dt-pages summary:hover,.dt-devices[open] summary,.dt-pages[open] summary{background:#ffffff1f}.dt-devices-menu,.dt-keys-menu{position:absolute;right:0;bottom:calc(100% + 10px);width:264px;max-height:60vh;padding:8px 4px 12px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .1);border-radius:12px;box-shadow:0 12px 40px #0000008c;overflow-y:auto;overscroll-behavior:contain}.dt-keys summary{list-style:none}.dt-keys summary::-webkit-details-marker{display:none}.dt-keys[open] summary{color:var(--dt-accent-ink);background:var(--dt-accent)}.dt-keys[open] summary:after{display:none}.dt-key-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 12px;color:var(--dt-ink-2);font:500 11px/1.3 ui-sans-serif,system-ui,sans-serif}.dt-key-row kbd{flex:none;min-width:12px;padding:2px 5px;background:#ffffff14;border:1px solid rgb(255 255 255 / .12);border-radius:4px;color:var(--dt-ink);font:500 10px/1.2 ui-monospace,monospace;text-align:center}.dt-menu-tabs{display:flex;gap:2px;margin:0 4px 8px;padding:2px;background:#ffffff0f;border-radius:8px}.dt-devices-menu .dt-menu-tabs button{flex:1;justify-content:center;width:auto;padding:5px 8px;border-radius:6px;color:var(--dt-muted);font-weight:600}.dt-devices-menu .dt-menu-tabs button:hover{background:#ffffff0f;color:var(--dt-ink)}.dt-devices-menu .dt-menu-tabs button[aria-selected=true]{background:#ffffff24;color:#fff}.dt-menu-panel[hidden]{display:none}.dt-menu-note{margin:0 12px 10px;color:var(--dt-muted);font:400 10px/1.4 ui-sans-serif,system-ui,sans-serif}.dt-emu-search{display:block;box-sizing:border-box;width:calc(100% - 8px);margin:0 4px 6px;padding:6px 10px;background:#ffffff0f;border:1px solid rgb(255 255 255 / .1);border-radius:8px;outline:none;color:var(--dt-ink);font:500 11px/1.3 ui-sans-serif,system-ui,sans-serif}.dt-emu-search:focus{border-color:var(--dt-accent)}.dt-emu-search::placeholder{color:var(--dt-muted)}.dt-devices-menu [data-emu][hidden],.dt-devices-menu .dt-devices-group[hidden]{display:none}.dt-devices-menu button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:4px 12px;background:transparent;border:0;border-radius:8px;color:var(--dt-ink-2);font:500 11px/1.3 ui-sans-serif,system-ui,sans-serif;text-align:left;cursor:pointer;transition:background-color .14s cubic-bezier(.22,1,.36,1)}.dt-devices-menu button em{flex:none;color:var(--dt-muted);font:500 10px/1 ui-monospace,monospace;font-style:normal}.dt-devices-menu button:hover{background:#ffffff14;color:#fff}.dt-devices-menu button:focus-visible{outline:2px solid var(--dt-accent);outline-offset:-2px}.dt-devices-menu button[aria-pressed=true]{color:#fff}.dt-pages-n{flex:none;display:flex;gap:3px;font-style:normal}.dt-pages-n b{display:inline-flex;align-items:center;gap:3px;padding:2px 5px 2px 4px;border-radius:999px;font:600 9px/1.4 ui-sans-serif,system-ui,sans-serif;font-variant-numeric:tabular-nums}.dt-pages-n b i{font-style:normal}.dt-pages-n[hidden],.dt-pages-n b[hidden]{display:none}.dt-pages-n svg{display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.dt-pages-n b[data-state=open]{background:#0d99ff;color:#fff}.dt-pages-n b[data-state=claude]{background:#d97757;color:#fff}.dt-pages-n b[data-state=done]{background:#4f8f4138;color:#8fd07f}.dt-menu-label{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dt-devices-menu button[aria-pressed=true] .dt-menu-label:after,.dt-pages a[aria-current] .dt-menu-label:after{content:"";display:inline-block;width:5px;height:9px;margin-left:8px;border-right:1.5px solid var(--dt-accent);border-bottom:1.5px solid var(--dt-accent);transform:rotate(45deg) translate(-1px,-1px)}.dt-notes-overlay{position:fixed;inset:0;z-index:calc(var(--dt-z) + 1);pointer-events:none}.dt-notes-overlay>*{pointer-events:auto}html.dt-noting body{cursor:crosshair}.dt-notes-hi{position:fixed;inset:0;z-index:calc(var(--dt-z) + 1);pointer-events:none}.dt-hi-box{position:fixed;box-sizing:border-box;border:1px solid #0d99ff;background:#0d99ff14}.dt-hi-tag{position:fixed;padding:2px 5px;background:#0d99ff;border-radius:3px;color:#fff;font:500 10px/1.4 ui-monospace,monospace;white-space:pre}html.dt-no-studio sanity-visual-editing{display:none}.dt-pad-overlay{position:fixed;inset:0;z-index:calc(var(--dt-z) - 5);pointer-events:none}.dt-pad-overlay .dt-pad-zone{position:fixed;background:#22a06b47}.dt-pad-overlay .dt-pad-outline{position:fixed;outline:1px dashed rgba(34,160,107,.9);outline-offset:-1px}.dt-pad-overlay .dt-pad-zone--m{background:#ec962e4d}.dt-pad-overlay .dt-pad-chip--m{background:#b5691c}.dt-pad-overlay .dt-pad-zone--g{background:#0d99ff4d}.dt-pad-overlay .dt-pad-chip--g{background:#0d6ec4}.dt-pad-overlay .dt-pad-chip{position:fixed;transform:translate(-50%,-50%);background:#4f8f41;color:#fff;font-size:11px;font-weight:500;line-height:1;padding:3px 6px;border-radius:4px;white-space:nowrap}.dt-pad-overlay .dt-type-card{position:fixed;display:grid;gap:3px;width:200px;box-sizing:border-box;padding:8px 10px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .12);border-radius:8px;box-shadow:0 8px 24px #00000073;color:var(--dt-ink);font:400 11px/1.35 ui-sans-serif,system-ui,sans-serif}.dt-pad-overlay .dt-type-row{display:flex;gap:8px}.dt-pad-overlay .dt-type-row b{flex:none;width:44px;color:var(--dt-muted);font-weight:400}.dt-pad-overlay .dt-type-row span{display:flex;align-items:center;gap:5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-pad-overlay .dt-type-row em{color:var(--dt-muted);font-style:normal}.dt-pad-overlay .dt-style-card{width:220px}.dt-pad-overlay .dt-type-row b.dt-var{width:auto;flex:initial;color:var(--dt-ink);font-weight:500;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10.5px}.dt-pad-overlay .dt-type-sw{flex:none;width:10px;height:10px;border:1px solid rgb(255 255 255 / .25);border-radius:2px}.dt-pad-overlay .dt-pad-tag{position:fixed;background:var(--dt-panel);color:var(--dt-ink);font-size:11px;line-height:1;padding:4px 7px;border-radius:4px;white-space:nowrap}.dt-grid-overlay{position:fixed;inset:0;z-index:calc(var(--dt-z) - 10);pointer-events:none}.dt-overlay-container,.dt-overlay-grid{height:100%}.dt-overlay-col{background:#ff000014}@media(max-width:767px){.devtools{flex-wrap:wrap;justify-content:center;box-sizing:border-box;width:max-content;max-width:calc(100vw - 24px);border-radius:24px}}.dt-pin{position:absolute;z-index:1;display:grid;place-items:center;width:18px;height:18px;margin:-18px 0 0;padding:0;border:0;border-radius:50%;background:var(--cat, #0d99ff);box-shadow:0 0 0 2px #ffffffe6,0 2px 8px #00000059;color:#fff;font:600 10px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer}.dt-pin--claude{background:#d97757}.dt-pin--working:before{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px solid #d97757;animation:dt-working 1.6s ease-in-out infinite;pointer-events:none}@keyframes dt-working{50%{transform:scale(1.25);opacity:.35}}@media(prefers-reduced-motion:reduce){.dt-pin--working:before{animation:none}}.dt-pin--done{background:var(--dt-faint);color:var(--dt-ink);box-shadow:0 0 0 2px #ffffff80;opacity:.55}.dt-pin--done:hover{opacity:1}.dt-pin--draft{background:#f0f0f0;color:#121212}.dt-pin--draft svg{display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}.dt-note-draft{flex:none;padding:2px 6px;background:#ffffff1a;border-radius:4px;color:var(--dt-ink-2);font:600 10px/1.2 ui-sans-serif,system-ui,sans-serif}.dt-note{position:absolute;z-index:2;box-sizing:border-box;width:288px;margin:6px 0 0 14px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .08);border-radius:12px;box-shadow:0 12px 40px #0000008c;color:var(--dt-ink);font:12px/1.45 ui-sans-serif,system-ui,sans-serif;cursor:default;overflow:hidden}.dt-note[data-flip]{margin-top:0;transform:translateY(calc(-100% - 24px))}.dt-note[data-flipx]{margin-left:0;transform:translate(calc(-100% - 6px))}.dt-note[data-flip][data-flipx]{transform:translate(calc(-100% - 6px),calc(-100% - 24px))}@media(max-width:479px){.dt-note{left:50%!important;margin-left:0;transform:translate(-50%)}.dt-note[data-flipx],.dt-note[data-flip][data-flipx],.dt-note[data-flip]{margin-left:0;transform:translate(-50%)}.dt-note[data-flip],.dt-note[data-flip][data-flipx]{margin-top:0;transform:translate(-50%,calc(-100% - 24px))}}.dt-note-el{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-family:ui-monospace,monospace;font-size:11px;color:var(--dt-muted)}.dt-note p{margin:0}.dt-note-bar{position:relative;display:flex;align-items:center;gap:6px;padding:12px;border-bottom:1px solid rgb(255 255 255 / .08);font-weight:600}.dt-note-tools{margin-left:auto;display:flex;gap:2px}.dt-note-tools button{display:grid;place-items:center;width:22px;height:22px;padding:0;background:transparent;border:0;border-radius:50%;color:var(--dt-muted);font:12px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer}.dt-note-tools button svg{display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-note-tools button:hover{background:#ffffff1a;color:#fff}.dt-note-resolve.is-on{color:#5fa850}.dt-note-tools .dt-note-state,.dt-note-tools .dt-note-state:hover{color:#d97757}.dt-note-tools .dt-note-resolve.is-on:hover{color:#5fa850}.dt-note-sep{flex:none;align-self:center;width:1px;height:14px;margin:0 4px;background:#ffffff24}.dt-msg p:after{content:none}.dt-note-info:after{content:attr(data-tip);position:absolute;left:12px;right:12px;top:calc(100% + 6px);z-index:2;padding:6px 8px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);border-radius:6px;box-shadow:0 6px 18px #00000080;color:var(--dt-ink-2);font:400 11px/1.4 ui-sans-serif,system-ui,sans-serif;white-space:normal;pointer-events:none;opacity:0;transition:opacity .12s cubic-bezier(.22,1,.36,1)}.dt-note-info:hover:after{opacity:1}.dt-note-info{display:grid;place-items:center;flex:none;width:16px;height:16px;margin-left:-2px;color:var(--dt-faint);cursor:help}.dt-note-state svg{display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-note-info:hover{color:var(--dt-ink-2)}.dt-note-info svg{display:block;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round}.dt-note-thread,.dt-hist-list,.dt-note-input,.dt-note-reply-input{color-scheme:dark;scrollbar-width:thin;scrollbar-color:rgb(255 255 255 / .22) transparent}.dt-note-thread{max-height:260px;padding:12px 12px 2px;overflow-y:auto}.dt-msg+.dt-msg{margin-top:12px}.dt-msg-head{display:flex;align-items:baseline;gap:6px;min-height:18px;line-height:18px}.dt-msg-edit{align-self:center;display:grid;place-items:center;width:20px;height:20px;margin-left:auto;padding:0;background:transparent;border:0;border-radius:50%;color:var(--dt-muted);cursor:pointer}.dt-msg-edit:hover{background:#ffffff1a;color:#fff}.dt-msg-edit:focus-visible,.dt-edit-cancel:focus-visible{outline:2px solid var(--dt-accent);outline-offset:1px}.dt-msg-edit svg{display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}.dt-msg .dt-compose{margin-top:6px}.dt-edit-cancel{height:28px;padding:0 10px;background:transparent;border:0;border-radius:14px;color:var(--dt-ink-2);font:12px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer}.dt-edit-cancel:hover{background:#ffffff1a;color:#fff}.dt-msg-face{width:16px;height:16px;border-radius:50%;object-fit:cover;align-self:center}.dt-msg-head b{color:var(--dt-muted);font-size:11px;font-weight:600}.dt-msg-head time{color:var(--dt-muted);font-size:11px}.dt-msg p{margin-top:6px!important;color:var(--dt-ink);font-size:13px;line-height:1.5;cursor:text;user-select:text}.dt-note--orphan{left:50%!important;top:72px!important;margin:0;transform:translate(-50%)!important}.dt-note .dt-note-twin{margin:12px 12px 0;padding:6px 8px;border-radius:5px;background:#0d99ff1f;color:var(--dt-ink-2);font-size:11px;line-height:1.45}.dt-note-twin button{margin-left:4px;padding:0;border:0;background:none;color:#5cb8ff;font:inherit;text-decoration:underline;text-underline-offset:2px;cursor:pointer}.dt-note-host{display:inline-flex;align-items:center;height:22px;padding:0 8px;border:1px solid var(--dt-line, rgb(255 255 255 / .12));border-radius:999px;color:var(--dt-muted);font-size:11px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-note .dt-note-working{display:flex;align-items:center;gap:6px;margin:12px 12px 0 20px;font-size:12px;color:#d97757}.dt-note-working i{width:6px;height:6px;border-radius:50%;background:currentColor;animation:dt-working 1.6s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.dt-note-working i{animation:none}}.dt-note-orphan{margin:12px 12px 0;padding:6px 8px;background:#e5402c24;border-radius:5px;color:#ff8a7a;font-size:11px}.dt-note-shots{display:flex;flex-wrap:wrap;gap:6px;margin:10px 12px 0}.dt-msg .dt-note-shots{margin:8px 0 0}.dt-shot{position:relative;display:inline-flex}.dt-shot-rm{position:absolute;top:4px;right:4px;display:grid;place-items:center;width:17px;height:17px;padding:0;background:#141414d1;border:1px solid rgb(255 255 255 / .22);border-radius:50%;color:var(--dt-ink);cursor:pointer;transition:background-color .12s cubic-bezier(.22,1,.36,1)}.dt-shot-rm:hover{background:#e5402c;border-color:#e5402c}.dt-shot-rm svg{display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.dt-note-shots img{display:block;width:76px;height:56px;object-fit:cover;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);border-radius:6px}.dt-note-shots a:hover img{border-color:var(--dt-accent)}.dt-note-foot{padding:12px}.dt-compose{position:relative;background:var(--dt-raised);border:1px solid rgb(255 255 255 / .14);border-radius:10px;transition:border-color .14s cubic-bezier(.22,1,.36,1),box-shadow .14s cubic-bezier(.22,1,.36,1)}.dt-compose:focus-within,.dt-compose[data-drop]{border-color:var(--dt-accent);box-shadow:0 0 0 3px #ff5a0033}.dt-compose .dt-note-shots{margin:2px 12px 10px}.dt-note-input,.dt-note-reply-input,.dt-note-edit-input{display:block;width:100%;box-sizing:border-box;min-height:38px;max-height:50vh;overflow-y:hidden;margin:0;padding:10px 12px 6px;background:transparent;border:0;outline:none;color:var(--dt-ink);font:13px/1.45 ui-sans-serif,system-ui,sans-serif;resize:none}.dt-note-input::placeholder,.dt-note-reply-input::placeholder,.dt-note-edit-input::placeholder{color:var(--dt-muted)}.dt-compose-bar{display:flex;align-items:center;justify-content:space-between;padding:6px;border-top:1px solid rgb(255 255 255 / .08)}.dt-attach,.dt-send{display:grid;place-items:center;flex:none;width:28px;height:28px;padding:0;border:0;border-radius:50%;cursor:pointer;transition:background-color .14s cubic-bezier(.22,1,.36,1),color .14s}.dt-attach{background:transparent;color:var(--dt-muted)}.dt-attach:hover{background:#ffffff1a;color:#fff}.dt-send{background:#ffffff24;color:var(--dt-ink-2)}.dt-send.is-ready,.dt-send:hover{background:var(--dt-accent);color:var(--dt-accent-ink)}.dt-attach svg,.dt-send svg{display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.dt-attach:focus-visible,.dt-send:focus-visible{outline:2px solid var(--dt-accent);outline-offset:1px}.dt-history{position:fixed;top:12px;right:12px;bottom:68px;z-index:calc(var(--dt-z) + 2);display:flex;flex-direction:column;box-sizing:border-box;width:300px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .08);border-radius:12px;box-shadow:0 12px 40px #0000008c;color:var(--dt-ink);font:12px/1.45 ui-sans-serif,system-ui,sans-serif;cursor:default;overflow:hidden}.dt-history[hidden],html.dt-in-frame .dt-history{display:none}.dt-history[data-collapsed]{bottom:auto}.dt-history[data-collapsed] .dt-hist-list,.dt-history[data-collapsed] .dt-hist-empty{display:none}.dt-history[data-collapsed] .dt-hist-head{border-bottom:0}.dt-history:not([data-collapsed]) .dt-hist-fold svg{transform:rotate(180deg)}.dt-hist-head{flex:none;display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid rgb(255 255 255 / .08)}.dt-hist-refresh,.dt-hist-fold{display:grid;place-items:center;width:20px;height:20px;padding:0;background:transparent;border:0;border-radius:5px;color:var(--dt-muted);cursor:pointer}.dt-hist-refresh{margin-left:auto}.dt-hist-foot{flex:none;margin-top:auto;padding:6px;border-top:1px solid rgb(255 255 255 / .08)}.dt-history[data-collapsed] .dt-hist-foot{display:none}.dt-hist-resolved{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:8px;width:100%;height:32px;padding:0 8px;border-radius:7px;color:var(--dt-muted);font:400 12px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer}.dt-hist-resolved:hover,.dt-hist-resolved:focus-visible{background:#ffffff0f;color:var(--dt-ink)}.dt-hist-resolved svg{flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-hist-resolved[aria-checked=true] svg{stroke:#7ee2a8}.dt-hist-resolved span{flex:1}.dt-hist-resolved kbd{all:unset;font:500 10px/1 ui-monospace,monospace;padding:2px 5px;border-radius:4px;border:1px solid rgb(255 255 255 / .14);color:var(--dt-muted)}.dt-hist-switch{position:relative;flex:none;width:26px;height:15px;border-radius:999px;background:#ffffff29;transition:background .16s ease-out}.dt-hist-switch:after{content:"";position:absolute;top:2px;left:2px;width:11px;height:11px;border-radius:50%;background:#fff;transition:transform .16s cubic-bezier(.22,1,.36,1)}.dt-hist-resolved[aria-checked=true] .dt-hist-switch{background:var(--dt-accent)}.dt-hist-resolved[aria-checked=true] .dt-hist-switch:after{transform:translate(11px)}.dt-hist-refresh:hover,.dt-hist-fold:hover{background:#ffffff14;color:#fff}.dt-hist-refresh[data-spin] svg{animation:dt-spin .5s cubic-bezier(.22,1,.36,1)}@keyframes dt-spin{to{transform:rotate(360deg)}}.dt-hist-refresh svg,.dt-hist-fold svg{display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .16s cubic-bezier(.22,1,.36,1)}.dt-hist-list{flex:1;min-height:0;padding:6px;overflow-y:auto}.dt-hist-row{position:relative;display:flex;align-items:flex-start;border-radius:8px}.dt-hist-row:hover{background:#ffffff0f}.dt-hist-tools{position:absolute;top:-8px;right:8px;z-index:1;padding:2px;background:var(--dt-raised);border:1px solid rgb(255 255 255 / .12);border-radius:8px;box-shadow:0 4px 12px #0006;opacity:0;transition:opacity .14s cubic-bezier(.22,1,.36,1)}.dt-hist-row:hover .dt-hist-tools,.dt-hist-tools:focus-within{opacity:1}.dt-hist-tools [data-rm]:hover,.dt-hist-tools [data-draft-rm]:hover{color:#e5402c}.dt-hist-go{display:flex;gap:8px;flex:1;min-width:0;padding:8px;background:transparent;border:0;border-radius:8px;color:inherit;font:inherit;text-align:left;cursor:pointer}.dt-hist-here{display:grid;place-items:center;flex:none;color:var(--dt-ink)}.dt-hist-here svg{display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.dt-hist-title{color:var(--dt-ink);font-weight:600}.dt-hist-sep{flex:none;align-self:center;width:1px;height:14px;margin:0 2px;background:#ffffff24}.dt-hist-bands{display:flex;flex-wrap:wrap;gap:4px}.dt-hist-bands button{display:inline-flex;align-items:center;gap:3px;padding:2px 6px 2px 5px;background:transparent;border:1px solid rgb(255 255 255 / .16);border-radius:999px;color:var(--dt-muted);font:600 9px/1.4 ui-sans-serif,system-ui,sans-serif;font-variant-numeric:tabular-nums;cursor:pointer}.dt-hist-bands button svg{display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.dt-hist-bands button i{font-style:normal}.dt-hist-bands button[data-state=open]{background:#0d99ff;border-color:#0d99ff;color:#fff}.dt-hist-bands button[data-state=claude]{background:#d97757;border-color:#d97757;color:#fff}.dt-hist-group{display:flex;gap:6px;margin:0;padding:10px 12px 4px;color:var(--dt-muted);font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}.dt-hist-group:first-child{padding-top:4px}.dt-hist-group em{color:var(--dt-faint);font-style:normal}.dt-hist-row.is-done{opacity:.5}.dt-hist-row.is-done:hover{opacity:1}.dt-hist-n{flex:none;display:grid;place-items:center;width:12px;height:12px;margin-top:4px;background:var(--cat, #0d99ff);border-radius:50%;color:#fff;font:600 8px/1 ui-sans-serif,system-ui,sans-serif}.dt-hist-row.is-done .dt-hist-n{background:var(--dt-faint)}.dt-hist-row.is-claude .dt-hist-n{background:#d97757}.dt-hist-row.is-draft .dt-hist-n{background:#f0f0f0;color:#121212}.dt-hist-n svg:not(.dt-claude){width:8px;height:8px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}.dt-hist-orphan{color:var(--dt-muted);font-weight:500;font-style:italic}.dt-hist-claude{display:inline-flex;align-items:center;gap:3px;margin:-1px 0;padding:1px 5px 1px 3px;border-radius:999px;color:#d97757;font-weight:600;cursor:pointer;transition:background .12s ease-out}.dt-hist-claude i{font-style:normal;font-weight:400;opacity:0;margin-left:1px;transition:opacity .12s ease-out}.dt-hist-claude:hover,.dt-hist-claude:focus-visible{background:#d9775729;outline:none}.dt-hist-claude:hover i,.dt-hist-claude:focus-visible i{opacity:1}svg.dt-claude{fill:currentColor!important;stroke:none!important}.dt-hist-n .dt-claude{color:#fff}.dt-hist-body{display:grid;gap:2px;min-width:0}.dt-hist-id{display:flex;gap:6px;color:var(--dt-muted);font-size:11px}.dt-hist-id em{color:var(--dt-faint);font-style:normal}.dt-hist-text b{color:#d97757;font-weight:600}.dt-hist-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.dt-hist-meta{color:var(--dt-muted);font-size:11px}.dt-hist-empty{margin:0;padding:16px 12px;color:var(--dt-muted)}.dt-toast{position:fixed;left:50%;bottom:68px;transform:translate(-50%);z-index:calc(var(--dt-z) + 5);padding:8px 12px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .14);border-radius:8px;box-shadow:0 8px 24px #00000073;color:var(--dt-ink);font:400 12px/1.4 ui-sans-serif,system-ui,sans-serif}.dt-mentions{display:grid;margin:0 8px 6px;padding:4px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .1);border-radius:8px}.dt-mentions button{all:unset;display:flex;gap:6px;align-items:baseline;padding:6px 8px;border-radius:6px;color:var(--dt-ink);font-size:12px;cursor:pointer}.dt-mentions button span{color:var(--dt-faint);font-size:11px}.dt-mentions button:hover,.dt-mentions button:focus-visible,.dt-mentions button[aria-selected=true]{background:#ffffff14}.dt-msg--new{animation:dt-msg-in .32s cubic-bezier(.22,1,.36,1)}@keyframes dt-msg-in{0%{opacity:0;transform:translateY(4px)}}@media(prefers-reduced-motion:reduce){.dt-msg--new{animation:none}}.dt-pin[data-off]{opacity:.7}.dt-pin[data-off]:after{content:"";position:absolute;border:4px solid transparent}.dt-pin[data-off=r]:after{left:100%;top:50%;margin-top:-4px;border-left-color:var(--cat, #0d99ff)}.dt-pin[data-off=l]:after{right:100%;top:50%;margin-top:-4px;border-right-color:var(--cat, #0d99ff)}.dt-pin[data-off=t]:after{bottom:100%;left:50%;margin-left:-4px;border-bottom-color:var(--cat, #0d99ff)}.dt-pin[data-off=b]:after{top:100%;left:50%;margin-left:-4px;border-top-color:var(--cat, #0d99ff)}.dt-pad-overlay .dt-type-row em.dt-type-bad{color:#ff6b5e;opacity:1}.dt-suggest{margin:0 12px 8px;display:grid;gap:4px}.dt-suggest-head{display:flex;justify-content:space-between;align-items:center;color:var(--dt-muted);font:500 11px/1.4 ui-sans-serif,system-ui,sans-serif}.dt-suggest-head button{all:unset;cursor:pointer;display:grid;color:var(--dt-faint)}.dt-suggest-was{color:var(--dt-faint);font:400 12px/1.4 ui-sans-serif,system-ui,sans-serif;overflow-wrap:anywhere}.dt-suggest-was del{color:var(--dt-muted);text-decoration-color:#ffffff59}.dt-suggest-hint{color:var(--dt-faint);font:400 11px/1.4 ui-sans-serif,system-ui,sans-serif}.dt-suggest-input{width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid rgb(255 255 255 / .14);border-radius:8px;background:var(--dt-raised);color:var(--dt-ink);font:400 13px/1.45 ui-sans-serif,system-ui,sans-serif;resize:vertical}.dt-suggest--read{margin:6px 0 0;padding:8px 10px;border-radius:8px;background:#ffffff0d;font-size:13px;line-height:1.45}.dt-suggest--read del{color:var(--dt-faint)}.dt-suggest--read ins{text-decoration:none;color:#7ee2a8}.dt-review{position:fixed;top:12px;left:50%;transform:translate(-50%);z-index:calc(var(--dt-z) + 3);display:flex;align-items:center;gap:10px;max-width:min(720px,calc(100vw - 24px));padding:6px 6px 6px 14px;border-radius:999px;background:var(--dt-bg);color:var(--dt-ink);box-shadow:0 0 0 1px color-mix(in srgb,var(--dt-accent) 55%,transparent),0 0 0 5px color-mix(in srgb,var(--dt-accent) 14%,transparent),0 10px 32px #0006;font:400 12px/1.4 ui-sans-serif,system-ui,sans-serif;animation:dt-review-in .26s cubic-bezier(.22,1,.36,1)}@keyframes dt-review-in{0%{opacity:0;transform:translate(-50%,-8px)}}.dt-review[hidden]{display:none}.dt-review b{font-weight:600;white-space:nowrap;display:inline-flex;align-items:center;gap:8px}.dt-review-dot{width:7px;height:7px;border-radius:50%;background:var(--dt-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--dt-accent) 30%,transparent);animation:dt-review-dot 1.6s ease-in-out infinite}@keyframes dt-review-dot{50%{box-shadow:0 0 0 6px color-mix(in srgb,var(--dt-accent) 0%,transparent)}}@media(prefers-reduced-motion:reduce){.dt-review,.dt-review-dot{animation:none}}.dt-review-nav{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:999px;background:#ffffff0f}.dt-review-nav .dt-review-n{padding:0 4px;font-variant-numeric:tabular-nums}.dt-review-n{color:var(--dt-muted);white-space:nowrap}.dt-review-text{color:var(--dt-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1}.dt-review button{all:unset;position:relative;display:inline-grid;place-items:center;width:28px;height:28px;flex:none;border-radius:999px;background:#ffffff14;cursor:pointer;transition:background .12s ease-out}.dt-review-nav button{width:24px;height:24px;background:none}.dt-review button:hover,.dt-review button:focus-visible{background:#ffffff29}.dt-review button:disabled{opacity:.35;cursor:default;background:none}.dt-review .dt-review-ok{background:var(--dt-accent);color:var(--dt-accent-ink)}.dt-review .dt-review-ok:hover{background:color-mix(in srgb,var(--dt-accent) 85%,white)}.dt-review svg{width:14px;height:14px}.dt-review [data-tip]:after,.dt-review-btn[data-tip]:after{content:attr(data-tip);position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%);width:max-content;max-width:220px;padding:6px 8px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);border-radius:6px;box-shadow:0 6px 18px #00000080;color:var(--dt-ink-2);font:400 11px/1.4 ui-sans-serif,system-ui,sans-serif;pointer-events:none;opacity:0;transition:opacity .12s cubic-bezier(.22,1,.36,1)}.dt-review [data-tip]:hover:after,.dt-review [data-tip]:focus-visible:after,.dt-review-btn[data-tip]:hover:after,.dt-review-btn[data-tip]:focus-visible:after{opacity:1}.dt-review-btn[data-tip]:after{left:auto;right:-40px;transform:none;z-index:2;font-weight:400}.dt-review-btn svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;width:12px;height:12px}.dt-review [data-r=stop][data-tip]:after{left:auto;right:0;transform:none}.dt-review-btn{all:unset;position:relative;display:inline-flex;align-items:center;gap:3px;flex:none;white-space:nowrap;padding:2px 8px 2px 6px;border-radius:999px;background:var(--dt-accent);color:var(--dt-accent-ink);font:600 11px/1.5 ui-sans-serif,system-ui,sans-serif;cursor:pointer}.dt-review svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-record{all:unset;display:grid;place-items:center;min-width:28px;height:28px;padding:0 6px;box-sizing:border-box;border-radius:999px;color:var(--dt-muted);cursor:pointer;font:600 11px/1 ui-sans-serif,system-ui,sans-serif}.dt-record svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round}.dt-record:hover{color:var(--dt-ink);background:#ffffff14}.dt-record.is-on{background:#e5484d;color:#fff;animation:dt-rec 1.2s ease-in-out infinite}@keyframes dt-rec{50%{opacity:.7}}.dt-rec{position:absolute;inset:0;z-index:2;display:flex;align-items:center;gap:10px;padding:0 8px 0 6px;border-radius:inherit;background:var(--dt-raised)}.dt-rec button{all:unset;cursor:pointer;display:grid;place-items:center;flex:none}.dt-rec svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.dt-rec .dt-rec-x{width:26px;height:26px;border-radius:6px;color:var(--dt-muted)}.dt-rec .dt-rec-x:hover{color:var(--dt-ink);background:#ffffff14}.dt-rec-time{display:inline-flex;align-items:center;gap:7px;flex:none;color:var(--dt-ink);font:500 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;font-variant-numeric:tabular-nums}.dt-rec-time i{width:8px;height:8px;border-radius:50%;background:#e5484d;box-shadow:0 0 0 3px #e5484d38;animation:dt-rec 1.2s ease-in-out infinite}.dt-rec.is-busy .dt-rec-time i{display:none}.dt-rec-wave{flex:1;min-width:0;height:22px;display:flex;align-items:center;gap:2px}.dt-rec-wave i{flex:1;max-width:3px;height:100%;border-radius:2px;background:var(--dt-ink-2);transform:scaleY(.1);transition:transform 90ms linear}.dt-rec-wave i.is-empty,.dt-rec.is-busy .dt-rec-wave i{background:#ffffff2e}.dt-rec .dt-rec-done{width:28px;height:28px;border-radius:50%;background:var(--dt-accent);color:var(--dt-accent-ink)}.dt-rec .dt-rec-done:active{transform:scale(.94)}.dt-rec.is-busy .dt-rec-done{opacity:.5;pointer-events:none}.dt-attach.is-asking{color:#e5484d;animation:dt-rec 1.2s ease-in-out infinite}.dt-voice-rm.is-asking{color:var(--dt-accent);animation:dt-rec 1.2s ease-in-out infinite;pointer-events:none}.dt-voice-rm{all:unset;cursor:pointer;display:grid;place-items:center;flex:none;width:18px;height:18px;border-radius:50%;color:var(--dt-faint)}.dt-voice-rm:hover{color:var(--dt-ink);background:#ffffff1a}.dt-voice-rm svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}@media(prefers-reduced-motion:reduce){.dt-rec-time i{animation:none}.dt-rec-wave i{transition:none}}.dt-voice{display:flex;align-items:center;gap:8px;flex-basis:100%;max-width:260px;padding:4px 10px 4px 4px;border-radius:999px;background:#ffffff0f;border:1px solid rgb(255 255 255 / .08)}.dt-voice-play{flex:none;display:grid;place-items:center;width:26px;height:26px;padding:0 0 0 1px;border:0;border-radius:50%;background:var(--dt-accent);color:var(--dt-accent-ink);cursor:pointer}.dt-voice.is-playing .dt-voice-play{padding:0}.dt-voice-play svg{fill:currentColor}.dt-voice-play:active{transform:scale(.94)}.dt-voice-track{flex:1;min-width:0;height:18px;padding:0;border:0;background:none;cursor:pointer;position:relative}.dt-voice-track:before,.dt-voice-track i{content:"";position:absolute;left:0;top:50%;height:3px;margin-top:-1.5px;border-radius:3px}.dt-voice-track:before{right:0;background:#ffffff29}.dt-voice-track i{width:0;background:var(--dt-accent);transition:width .25s linear}.dt-voice-time{flex:none;font:500 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;font-variant-numeric:tabular-nums;color:var(--dt-muted)}.dt-shot--video video{display:block;max-width:100%;max-height:180px;border-radius:6px;background:#000}.dt-note-meta{display:flex;flex-wrap:wrap;gap:4px;margin:0 12px 12px}.dt-note>.dt-note-meta{margin:14px 12px 10px}.dt-note-meta .dt-field-box{height:22px;padding-left:18px}.dt-note-meta .dt-field-box:before{left:8px;width:6px;height:6px}.dt-note-meta .dt-field select{padding-right:17px;background-position:right 5px center}.dt-note-meta .dt-field-box--bars,.dt-field-box--bars{padding-left:21px}.dt-field-box--bars:before{content:none}.dt-field-box--bars .dt-bars{position:absolute;left:7px;pointer-events:none}.dt-prio-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-2px 12px 10px}.dt-hand{display:inline-flex;align-items:center;gap:2px;min-width:0;padding:2px;border-radius:999px;background:#00000059;box-shadow:inset 0 0 0 1px #ffffff1f}.dt-hand-stop{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:26px;height:22px;padding:0 7px;border:0;border-radius:999px;background:none;color:var(--dt-faint);font:500 11px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:background .14s,color .14s}.dt-hand-stop svg{flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-hand-stop .dt-claude{fill:currentColor;stroke:none}button.dt-hand-stop:hover{background:#ffffff0f;color:var(--dt-ink)}button.dt-hand-stop:disabled{opacity:.35;cursor:not-allowed;background:none}.dt-hand-stop:focus-visible{outline:none;box-shadow:inset 0 0 0 1px var(--dt-accent)}.dt-hand-stop.is-on{min-width:0;padding:0;cursor:default;color:var(--dt-ink)}.dt-hand-stop--nobody.is-on{padding:0 9px;background:#ffffff1a;color:var(--dt-muted)}.dt-hand .dt-field-box{height:22px;padding-left:18px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--cat) 55%,transparent);background:color-mix(in srgb,var(--cat) 16%,transparent)}.dt-hand .dt-field-box:before{left:8px;width:6px;height:6px}.dt-hand .dt-field-box[data-face]{padding-left:24px}.dt-hand .dt-field-box[data-face]:before{left:3px;width:16px;height:16px}.dt-hand .dt-field select{padding-right:17px;background-position:right 5px center;max-width:110px}.dt-hand-stop--agent.is-on select{color:#e8a083}.dt-prio{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 4px;margin-left:-4px;border:0;border-radius:6px;background:none;color:var(--cat);font:500 11px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:background .14s}.dt-prio:hover{background:#ffffff0f}.dt-prio:focus-visible{outline:none;box-shadow:inset 0 0 0 1px var(--dt-accent)}.dt-field-menu .dt-bars{margin:0;flex:none}.dt-field{display:inline-flex;min-width:0;margin:0;cursor:pointer}.dt-field-box{position:relative;display:flex;align-items:center;min-width:0;height:26px;padding-left:20px;border-radius:999px;box-shadow:inset 0 0 0 1px #ffffff1f;transition:box-shadow .14s cubic-bezier(.22,1,.36,1)}.dt-field-box:before{content:"";position:absolute;left:9px;width:8px;height:8px;border-radius:50%;background:var(--cat)}.dt-field-box:hover{box-shadow:inset 0 0 0 1px #ffffff47}.dt-field-box:focus-within{box-shadow:inset 0 0 0 1px var(--dt-accent)}.dt-field select{appearance:none;-webkit-appearance:none;color-scheme:dark;box-sizing:border-box;width:100%;height:100%;margin:0;padding:0 21px 0 0;field-sizing:content;max-width:120px;border:0;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 8l4 4 4-4' fill='none' stroke='%23afafaf' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 7px center / 10px;color:var(--dt-ink);font:500 11px/1 ui-sans-serif,system-ui,sans-serif;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;outline:none}.dt-field select option{background:var(--dt-raised);color:var(--dt-ink)}.dt-field-box--unset:before{background:#ffffff40!important}.dt-field-box--unset select{color:var(--dt-muted)}.dt-field-menu{pointer-events:auto;position:fixed;z-index:calc(var(--dt-z) + 6);display:grid;padding:4px;max-height:260px;overflow-y:auto;border-radius:10px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);box-shadow:0 12px 32px #00000080;animation:dt-field-menu .14s cubic-bezier(.22,1,.36,1)}.dt-field-menu{color-scheme:dark;scrollbar-width:thin;scrollbar-color:rgb(255 255 255 / .18) transparent}.dt-field-menu[hidden]{display:none}@keyframes dt-field-menu{0%{opacity:0;transform:translateY(-3px)}}.dt-field-menu button{all:unset;display:flex;align-items:center;gap:10px;height:34px;padding:0 10px;border-radius:6px;color:var(--dt-ink);font:400 13px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer;white-space:nowrap}.dt-field-menu button:hover,.dt-field-menu button:focus-visible{background:#ffffff14}.dt-field-menu i{width:8px;height:8px;border-radius:50%;flex:none}.dt-field-menu span{flex:1}.dt-field-menu svg{fill:none;stroke:var(--dt-muted);stroke-width:1.8;stroke-linecap:round;margin-left:12px}.dt-pill{position:relative;display:inline-flex;align-items:center;gap:4px;margin:0;padding:0 0 0 8px;border-radius:999px;box-shadow:inset 0 0 0 1px #ffffff1f;color:var(--dt-faint);font:600 10px/1.4 ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:box-shadow .14s cubic-bezier(.22,1,.36,1)}.dt-pill:hover{box-shadow:inset 0 0 0 1px #ffffff4d}.dt-pill:focus-within{box-shadow:inset 0 0 0 1px var(--dt-accent)}.dt-pill[style*=--cat]:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cat)}.dt-pill select{appearance:none;-webkit-appearance:none;color-scheme:dark;box-sizing:border-box;height:auto;max-width:150px;margin:0;padding:3px 20px 3px 0;border:0;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 8l4 4 4-4' fill='none' stroke='%23afafaf' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 6px center / 11px;color:var(--dt-ink);font:inherit;text-overflow:ellipsis;cursor:pointer;outline:none}.dt-pill select option{background:var(--dt-raised);color:var(--dt-ink)}.dt-compose-tools{display:flex;align-items:center;gap:2px}.dt-pin--review{--cat: #8e4ec6 !important;box-shadow:0 0 0 2px #8e4ec6}.dt-note-tools button.dt-share svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-note-tools button.dt-share.is-on{color:#30a46c}.dt-face{display:grid;place-items:center;flex:none;width:20px;height:20px;border-radius:50%;object-fit:cover;background:#ffffff1f;color:var(--dt-ink);font:600 10px/1 ui-sans-serif,system-ui,sans-serif}.dt-face--agent{box-shadow:0 0 0 1.5px #d97757}.dt-mentions button{align-items:center}.dt-mentions .dt-face{width:18px;height:18px}.dt-field-box[data-face]{padding-left:26px}.dt-field-box[data-face]:before{left:4px;width:18px;height:18px;background:var(--face) center / cover}.dt-pin:has(>.dt-face){width:22px;height:22px;margin-top:-22px;box-shadow:0 0 0 2px var(--cat, #0d99ff),0 2px 8px #00000059}.dt-pin>.dt-face{width:100%;height:100%;background:var(--cat, #0d99ff);color:#fff}.dt-pin--review:has(>.dt-face){box-shadow:0 0 0 2px #8e4ec6,0 2px 8px #00000059}
|
|
1
|
+
:root{--dt-bg: #121212;--dt-panel: #171717;--dt-raised: #1d1d1d;--dt-ink: #ffffff;--dt-ink-2: #d6d6d6;--dt-muted: #afafaf;--dt-faint: #717171;--dt-accent: #ff5a00;--dt-accent-ink: #000000}.devtools{position:fixed;bottom:16px;left:50%;transform:translate(-50%);z-index:calc(var(--dt-z) + 2);display:flex;align-items:center;gap:6px;padding:5px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .08);border-radius:999px;box-shadow:0 1px #ffffff0f inset,0 10px 34px #00000080;font:500 11px/1 ui-sans-serif,system-ui,sans-serif}.devtools[data-ready]{transition:transform .24s cubic-bezier(.22,1,.36,1)}.devtools[data-collapsed]{transform:translate(-50%,calc(100% + 16px))}.dt-tab{position:fixed;bottom:0;left:50%;z-index:calc(var(--dt-z) + 3);transform:translate(-50%);display:grid;place-items:center;width:44px;height:12px;padding:0;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .1);border-bottom:0;border-radius:8px 8px 0 0;color:var(--dt-muted);cursor:pointer;transition:color .14s cubic-bezier(.22,1,.36,1),height .14s cubic-bezier(.22,1,.36,1)}.dt-tab:hover{height:14px;color:#fff}.dt-tab:focus-visible{outline:2px solid var(--dt-accent);outline-offset:1px}html.dt-in-frame .dt-tab{display:none}.dt-tab svg{display:block;width:12px;height:12px;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round;stroke-linejoin:round;transition:transform .24s cubic-bezier(.22,1,.36,1)}.dt-tab[data-collapsed] svg{transform:rotate(180deg)}@media(prefers-reduced-motion:reduce){.devtools[data-ready],.dt-tab svg{transition:none}}.dt-group{position:relative;display:flex;align-items:center;gap:2px;padding:2px;background:#ffffff0d;border-radius:999px}.dt-group--menus{background:transparent;padding:0;gap:4px}.dt-icon[data-tip]:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 10px);left:50%;transform:translate(-50%);z-index:1;width:max-content;max-width:220px;padding:6px 8px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);border-radius:6px;box-shadow:0 6px 18px #00000080;color:var(--dt-ink-2);font:400 11px/1.4 ui-sans-serif,system-ui,sans-serif;text-align:left;white-space:normal;pointer-events:none;opacity:0;transition:opacity .12s cubic-bezier(.22,1,.36,1)}.dt-icon[data-tip]:hover:after,.dt-icon[data-tip]:focus-visible:after{opacity:1}.dt-icon{display:inline-flex;align-items:center;justify-content:center;position:relative;width:28px;height:28px;padding:0;background:transparent;border:0;border-radius:999px;color:var(--dt-muted);cursor:pointer;transition:color .16s cubic-bezier(.22,1,.36,1),background-color .16s cubic-bezier(.22,1,.36,1)}.dt-icon svg,.dt-devices summary svg,.dt-pages summary svg{flex:none;max-width:none;width:15px;height:15px;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}.dt-bp svg{width:16px;height:16px}.dt-icon:hover{color:var(--dt-ink);background:#ffffff1a}.dt-icon:focus-visible{outline:2px solid var(--dt-accent);outline-offset:1px}.dt-icon:active{transform:scale(.94)}.dt-icon[aria-pressed=true]{color:var(--dt-accent-ink);background:var(--dt-accent)}.dt-icon[hidden]{display:none}@media(prefers-reduced-motion:reduce){.dt-icon{transition:none}.dt-icon:active{transform:none}}.dt-pages summary::-webkit-details-marker,.dt-devices summary::-webkit-details-marker{display:none}.dt-pages{position:relative}.dt-pages ul,.dt-devices-menu,.dt-keys-menu{color-scheme:dark;scrollbar-width:thin;scrollbar-color:rgb(255 255 255 / .22) transparent}.dt-pages ul{position:absolute;left:0;bottom:calc(100% + 10px);width:320px;max-height:60vh;padding:8px 4px 12px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .1);border-radius:12px;box-shadow:0 12px 40px #0000008c;overflow-y:auto;overscroll-behavior:contain}.dt-pages-group,.dt-devices-group{margin:12px -4px;padding:12px 16px 0;border-top:1px solid rgb(255 255 255 / .08);color:var(--dt-muted);font:600 9px/1.2 ui-sans-serif,system-ui,sans-serif;letter-spacing:.5px;text-transform:uppercase}.dt-pages-group:first-child,.dt-devices-group:first-child{margin-top:0;padding-top:4px;border-top:0}.dt-pages a{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 12px;border-radius:8px;color:var(--dt-ink-2);font:500 11px/1.3 ui-sans-serif,system-ui,sans-serif;transition:background-color .14s cubic-bezier(.22,1,.36,1)}.dt-pages a:hover{background:#ffffff14;color:#fff}.dt-pages a[aria-current]{color:#fff}.dt-turbo{all:unset;position:absolute;left:calc(100% + 8px);top:50%;transform:translateY(-50%);display:grid;place-items:center;height:40px;padding:0 6px;box-sizing:border-box;border-radius:999px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .08);box-shadow:0 1px #ffffff0f inset,0 10px 34px #00000080;cursor:pointer}.dt-turbo[hidden]{display:none}.dt-turbo:focus-visible{outline:2px solid var(--dt-accent);outline-offset:2px}.dt-turbo-switch{position:relative;display:block;width:46px;height:26px;border-radius:999px;background:#ffffff24;transition:background .16s ease-out}.dt-turbo:hover .dt-turbo-switch{background:#fff3}.dt-turbo-knob{position:absolute;top:3px;left:3px;display:grid;place-items:center;width:20px;height:20px;border-radius:50%;background:#fff;color:#8d8d8d;box-shadow:0 1px 2px #0006;transition:transform .18s cubic-bezier(.22,1,.36,1),color .16s ease-out}.dt-turbo-knob svg{fill:currentColor;stroke:currentColor;stroke-width:1.4;stroke-linejoin:round}.dt-turbo[data-state=on] .dt-turbo-switch{background:var(--dt-accent)}.dt-turbo[data-state=on] .dt-turbo-knob{transform:translate(20px);color:var(--dt-accent)}.dt-turbo[data-state=none] .dt-turbo-switch{opacity:.4}@media(prefers-reduced-motion:reduce){.dt-turbo-switch,.dt-turbo-knob{transition:none}}.dt-turbo[data-tip]:after{content:attr(data-tip);position:absolute;bottom:calc(100% + 10px);right:0;width:max-content;max-width:240px;padding:6px 8px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);border-radius:6px;box-shadow:0 6px 18px #00000080;color:var(--dt-ink-2);font:400 11px/1.4 ui-sans-serif,system-ui,sans-serif;text-align:left;white-space:normal;pointer-events:none;opacity:0;transition:opacity .12s cubic-bezier(.22,1,.36,1)}.dt-turbo:hover:after,.dt-turbo:focus-visible:after{opacity:1}.dt-brand{display:block;height:22px;max-width:88px;margin:0 4px 0 8px;object-fit:contain;flex:none}.dt-notes-count{position:absolute;top:-3px;right:-3px;pointer-events:none;display:grid;place-items:center;min-width:14px;height:14px;padding:0;box-sizing:border-box;background:#f5c451;border:2px solid var(--dt-bg);border-radius:999px;color:#121212;font:700 9px/10px ui-sans-serif,system-ui,sans-serif;text-align:center}.dt-notes-count[data-state=claude]{background:#d97757;color:#fff}.dt-notes-count[data-state=done]{background:#4f8f41;color:#fff}.dt-notes-count svg{display:block;width:8px;height:8px}.dt-notes-count[hidden]{display:none}.dt-host{position:fixed;inset:0 auto auto 0;width:0;height:0;margin:0;padding:0;border:0;background:none;color:inherit;overflow:visible}.dt-frame[hidden]{display:none}html.dt-framing,html.dt-framing body{overflow:hidden}.dt-frame{position:fixed;inset:0;z-index:var(--dt-z);cursor:default;display:grid;place-items:center;place-content:center;background:var(--dt-bg)}.dt-frame[data-mode=device] .dt-ruler{display:none}.dt-device{max-height:calc(100vh - 32px);border-radius:4px;overflow:hidden}.dt-frame iframe{display:block;max-height:calc(100vh - 64px);border:0;background:#fff}.dt-device[data-shell]{position:relative;overflow:visible;max-height:none;border-radius:0;transform-origin:center}.dt-device[data-shell] iframe{z-index:1;max-height:none}.dt-shell{position:absolute;inset:0;pointer-events:none}.dt-shell svg{display:block}.dt-shell-body{fill:#1c1c1e;stroke:#4a4a4e;stroke-width:1.5}.dt-shell-body--light{fill:#d8d8dd;stroke:#aeaeb2}.dt-shell-bezel{fill:#050505}.dt-shell-btn{fill:#3a3a3c}.dt-shell-slot{fill:#2c2c2e}.dt-shell-homebtn{fill:#0c0c0d;stroke:#3a3a3c;stroke-width:2}.dt-shell-screen{fill:var(--dt-top, #fff)}.dt-shell-base{fill:#2c2c2e}.dt-shell-base--silver{fill:#c9c9ce}.dt-shell-lip{fill:#8e8e93}.dt-shell-stand{fill:#c7c7cc}.dt-chrome{position:absolute;z-index:2;box-sizing:border-box;overflow:hidden;pointer-events:none;font-family:-apple-system,system-ui,Segoe UI,Roboto,sans-serif;-webkit-font-smoothing:antialiased}.dt-chrome:empty{display:none}.dt-chrome[data-at=top]{border-radius:var(--dt-r) var(--dt-r) 0 0;background:var(--dt-top, #fff);color:var(--dt-top-ink, #000)}.dt-chrome[data-at=bottom]{border-radius:0 0 var(--dt-rb) var(--dt-rb);background:var(--dt-bottom, #fff);color:var(--dt-bottom-ink, #000)}.dt-chrome button{display:grid;place-items:center;padding:0;background:none;border:0;color:inherit;cursor:pointer;pointer-events:auto}.dt-i{flex:none;width:18px;height:18px;fill:none;stroke:currentColor;stroke-width:1.7;stroke-linecap:round;stroke-linejoin:round}.dt-i--fill{fill:currentColor;stroke:none}.dt-i--batt{width:26px;height:13px;stroke:none}.dt-bar-group{display:flex;align-items:center;gap:14px}.dt-sb{position:relative}.dt-island{position:absolute;background:#000;border-radius:19px}.dt-sb-time,.dt-sb-icons{position:absolute;display:flex;align-items:center;justify-content:center}.dt-sb-time{left:0;right:calc(50% + 64px);font:600 17px/1 -apple-system,system-ui,sans-serif}.dt-sb-icons{left:calc(50% + 64px);right:0;gap:6px}.dt-sb-icons .dt-i{width:17px;height:17px}.dt-sb--mini{display:flex;align-items:center;justify-content:space-between;padding:0 6px;font:600 12px/1 -apple-system,system-ui,sans-serif}.dt-sb--mini .dt-i{width:13px;height:13px}.dt-sb--mini .dt-i--batt{width:22px;height:11px}.dt-sb-l,.dt-sb-r{display:flex;align-items:center;gap:5px}.dt-ios-bar{position:relative}.dt-ios-row{position:absolute;top:8px;left:14px;right:14px;display:flex;align-items:center;gap:8px;height:48px}.dt-device[data-shell=home] .dt-ios-row{top:auto;bottom:22px}.dt-chrome .dt-glass{background:#ffffffbd;-webkit-backdrop-filter:blur(16px) saturate(180%);backdrop-filter:blur(16px) saturate(180%);box-shadow:0 2px 12px #00000024,inset 0 0 0 .5px #ffffffb3;color:#111}.dt-glass--round{display:grid;place-items:center;flex:none;width:48px;height:48px;border-radius:50%}.dt-ios-url{position:relative;display:flex;align-items:center;justify-content:center;flex:1;min-width:0;height:48px;border-radius:24px;font:500 15px/1 -apple-system,system-ui,sans-serif}.dt-ios-url>span{overflow:hidden;padding:0 34px;white-space:nowrap;text-overflow:ellipsis}.dt-ios-url button{position:absolute;right:12px}.dt-ios-mini{position:absolute;top:6px;left:50%;transform:translate(-50%);max-width:70%;padding:7px 14px;overflow:hidden;border-radius:14px;font:500 12px/1 -apple-system,system-ui,sans-serif;white-space:nowrap;text-overflow:ellipsis;background:#ffffffbd;box-shadow:0 1px 8px #0000001f;color:#111}.dt-home-ind{position:absolute;bottom:8px;left:50%;width:134px;height:5px;transform:translate(-50%);border-radius:3px;background:currentColor}.dt-sb--android{display:flex;align-items:center;justify-content:space-between;padding:0 18px;font:500 13px/1 Roboto,system-ui,sans-serif}.dt-sb--android .dt-i{width:14px;height:14px}.dt-sb--android .dt-i--batt{width:22px;height:11px}.dt-punch{position:absolute;top:12px;left:50%;width:12px;height:12px;transform:translate(-50%);border-radius:50%;background:#000}.dt-and-bar{display:flex;align-items:center;gap:10px;height:56px;padding:0 8px 0 10px}.dt-and-url{display:flex;align-items:center;gap:10px;flex:1;min-width:0;height:40px;padding:0 14px;border-radius:24px;background:color-mix(in srgb,currentColor 8%,transparent);font:400 15px/1 Roboto,system-ui,sans-serif}.dt-and-url span{overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dt-and-tabs{display:grid;place-items:center;width:18px;height:18px;border:2px solid currentColor;border-radius:4px;font:700 10px/1 Roboto,system-ui,sans-serif}.dt-and-nav{display:flex;align-items:center;justify-content:space-around;height:48px;color:#3c3c3c}.dt-device[data-browser=chrome-android] .dt-chrome[data-at=bottom]{background:#fff}.dt-sb--flat{display:flex;align-items:center;justify-content:space-between;padding:0 22px;font:600 12px/1 -apple-system,system-ui,sans-serif}.dt-sb--flat .dt-i{width:14px;height:14px}.dt-ipad-bar{display:flex;align-items:center;justify-content:space-between;height:50px;padding:0 18px}.dt-ipad-url,.dt-mac-url{position:relative;display:flex;align-items:center;justify-content:center;gap:6px;width:44%;height:34px;border-radius:10px;background:color-mix(in srgb,currentColor 8%,transparent);font:500 13px/1 -apple-system,system-ui,sans-serif}.dt-ipad-url .dt-i,.dt-mac-url .dt-i{width:13px;height:13px}.dt-ipad-url button,.dt-mac-url button{position:absolute;right:10px}.dt-ipad-foot{position:relative;height:100%}.dt-ipad-foot .dt-home-ind{bottom:6px;width:180px}.dt-device[data-browser=safari-mac] .dt-chrome[data-at=top]{background:#f6f6f6;color:#1d1d1f}.dt-mac-menu{position:relative;display:flex;align-items:center;justify-content:space-between;height:33px;padding:0 18px;background:#ececec;font:400 13px/1 -apple-system,system-ui,sans-serif}.dt-mac-apps{display:flex;gap:20px}.dt-mac-notch{position:absolute;top:0;left:50%;width:196px;height:33px;transform:translate(-50%);border-radius:0 0 10px 10px;background:#000}.dt-mac-menu .dt-sb-r{gap:12px}.dt-mac-menu .dt-i{width:15px;height:15px}.dt-mac-bar{display:flex;align-items:center;gap:18px;height:52px;padding:0 18px;border-bottom:1px solid #d9d9d9;color:#555}.dt-mac-url{margin:0 auto;background:#fff;box-shadow:inset 0 0 0 1px #dcdcdc;color:#1d1d1f}.dt-lights{display:flex;gap:9px}.dt-lights i{width:14px;height:14px;border-radius:50%;background:#ff5f57}.dt-lights i:nth-child(2){background:#febc2e}.dt-lights i:nth-child(3){background:#28c840}.dt-mac-dock{display:grid;place-items:center;height:100%;background:linear-gradient(135deg,#5b7fd1,#8a4fd0 55%,#d06a8a)}.dt-dock,.dt-win-apps{display:flex;align-items:center;gap:6px}.dt-dock{padding:5px 8px;border-radius:16px;background:#ffffff4d;box-shadow:inset 0 0 0 .5px #ffffff80}.dt-dock i,.dt-win-apps i{width:40px;height:40px;border-radius:10px;background:linear-gradient(160deg,hsl(var(--hue) 75% 62%),hsl(var(--hue) 70% 45%))}.dt-device[data-browser=chrome-windows] .dt-chrome[data-at=top]{background:#dfe3e8;color:#202124}.dt-device[data-browser=chrome-windows] .dt-chrome[data-at=bottom]{background:#eef1f5;color:#1d1d1f}.dt-win-tabs{display:flex;align-items:flex-end;height:41px;padding-left:8px}.dt-win-tab{display:flex;align-items:center;gap:8px;width:240px;height:34px;box-sizing:border-box;padding:0 10px;border-radius:8px 8px 0 0;background:#fff;font:400 12px/1 Segoe UI,system-ui,sans-serif}.dt-win-tab span{flex:1;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dt-win-tab .dt-i{width:14px;height:14px}.dt-fav{flex:none;width:16px;height:16px;border-radius:50%;background:#9aa0a6}.dt-win-new{display:grid;place-items:center;align-self:center;width:28px;height:28px;margin-left:6px}.dt-win-ctrl{display:flex;align-self:stretch;margin-left:auto}.dt-win-ctrl .dt-i{width:46px;height:41px;padding:12px 14px;box-sizing:border-box;stroke-width:1.2}.dt-win-bar{display:flex;align-items:center;gap:12px;height:46px;padding:0 12px;border-bottom:1px solid #dadce0;background:#fff;color:#5f6368}.dt-win-url{display:flex;align-items:center;gap:10px;flex:1;height:34px;padding:0 14px;border-radius:17px;background:#f1f3f4;color:#202124;font:400 14px/1 Segoe UI,system-ui,sans-serif}.dt-win-url span{flex:1}.dt-win-task{position:relative;display:flex;align-items:center;justify-content:center;height:100%;border-top:1px solid #d3d7dd}.dt-win-apps i{width:32px;height:32px;border-radius:6px}.dt-win-tray{position:absolute;right:14px;display:flex;align-items:center;gap:10px;font:400 11px/1.35 Segoe UI,system-ui,sans-serif;text-align:right}.dt-win-tray .dt-i{width:15px;height:15px}html.dt-in-frame .devtools{display:none}html.dt-in-frame,html.dt-in-frame body{scrollbar-width:none}html.dt-in-frame::-webkit-scrollbar,html.dt-in-frame body::-webkit-scrollbar{display:none}html.dt-in-frame.dt-sb-classic{scrollbar-width:auto}html.dt-in-frame.dt-sb-classic::-webkit-scrollbar{display:block;width:15px;background:#f1f1f1}html.dt-in-frame.dt-sb-classic::-webkit-scrollbar-thumb{background:#c1c1c1;border:4px solid #f1f1f1;border-radius:8px}html.dt-in-frame astro-dev-toolbar,html.dt-in-frame sanity-visual-editing{display:none}.dt-ruler{position:relative;height:22px;margin-top:6px;border-top:1px solid rgb(255 255 255 / .14)}.dt-ruler span{position:absolute;top:0}.dt-tick{width:1px;height:5px;background:#ffffff40}.dt-tick.is-major{height:9px;background:#ffffff73}.dt-edge{width:1px;height:22px;background:#0d99ff;opacity:.7}.dt-frame-size{position:fixed;top:12px;left:50%;transform:translate(-50%);padding:4px 10px;background:#0009;border:1px solid rgb(255 255 255 / .12);border-radius:999px;color:var(--dt-ink);font:500 11px/1 ui-sans-serif,system-ui,sans-serif;pointer-events:none}.dt-frame-btn{position:fixed;top:12px;left:calc(50% + var(--dt-badge-w, 0px) / 2 + 8px);display:grid;place-items:center;width:24px;height:24px;padding:0;background:#0009;border:1px solid rgb(255 255 255 / .12);border-radius:50%;color:var(--dt-ink);cursor:pointer}.dt-frame-btn:hover,.dt-frame-btn[aria-pressed=true]{background:var(--dt-accent);border-color:var(--dt-accent);color:var(--dt-accent-ink)}.dt-frame-btn[hidden]{display:none}.dt-frame-btn svg{display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.dt-stage{display:flex;align-items:stretch;gap:6px}.dt-frame-handle{flex:none;align-self:center;width:6px;height:72px;background:#ffffff47;border-radius:999px;cursor:ew-resize;touch-action:none;transition:background-color .12s,height .12s}.dt-frame[data-mode=device] .dt-frame-handle{visibility:hidden}.dt-frame-handle:hover,.dt-frame[data-dragging] .dt-frame-handle{background:var(--dt-accent);height:120px}.dt-devices,.dt-keys{position:relative}.dt-devices summary,.dt-pages summary{display:inline-flex;align-items:center;gap:6px;height:28px;padding-inline:10px;background:#ffffff0d;border-radius:999px;color:var(--dt-ink);font:500 11px/1 ui-sans-serif,system-ui,sans-serif;white-space:nowrap;list-style:none;cursor:pointer;transition:background-color .16s cubic-bezier(.22,1,.36,1)}.dt-devices summary:hover,.dt-pages summary:hover,.dt-devices[open] summary,.dt-pages[open] summary{background:#ffffff1f}.dt-devices-menu,.dt-keys-menu{position:absolute;right:0;bottom:calc(100% + 10px);width:264px;max-height:60vh;padding:8px 4px 12px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .1);border-radius:12px;box-shadow:0 12px 40px #0000008c;overflow-y:auto;overscroll-behavior:contain}.dt-keys summary{list-style:none}.dt-keys summary::-webkit-details-marker{display:none}.dt-keys[open] summary{color:var(--dt-accent-ink);background:var(--dt-accent)}.dt-keys[open] summary:after{display:none}.dt-key-row{display:flex;align-items:center;justify-content:space-between;gap:10px;padding:4px 12px;color:var(--dt-ink-2);font:500 11px/1.3 ui-sans-serif,system-ui,sans-serif}.dt-key-row kbd{flex:none;min-width:12px;padding:2px 5px;background:#ffffff14;border:1px solid rgb(255 255 255 / .12);border-radius:4px;color:var(--dt-ink);font:500 10px/1.2 ui-monospace,monospace;text-align:center}.dt-menu-tabs{display:flex;gap:2px;margin:0 4px 8px;padding:2px;background:#ffffff0f;border-radius:8px}.dt-devices-menu .dt-menu-tabs button{flex:1;justify-content:center;width:auto;padding:5px 8px;border-radius:6px;color:var(--dt-muted);font-weight:600}.dt-devices-menu .dt-menu-tabs button:hover{background:#ffffff0f;color:var(--dt-ink)}.dt-devices-menu .dt-menu-tabs button[aria-selected=true]{background:#ffffff24;color:#fff}.dt-menu-panel[hidden]{display:none}.dt-menu-note{margin:0 12px 10px;color:var(--dt-muted);font:400 10px/1.4 ui-sans-serif,system-ui,sans-serif}.dt-emu-search{display:block;box-sizing:border-box;width:calc(100% - 8px);margin:0 4px 6px;padding:6px 10px;background:#ffffff0f;border:1px solid rgb(255 255 255 / .1);border-radius:8px;outline:none;color:var(--dt-ink);font:500 11px/1.3 ui-sans-serif,system-ui,sans-serif}.dt-emu-search:focus{border-color:var(--dt-accent)}.dt-emu-search::placeholder{color:var(--dt-muted)}.dt-devices-menu [data-emu][hidden],.dt-devices-menu .dt-devices-group[hidden]{display:none}.dt-devices-menu button{display:flex;align-items:center;justify-content:space-between;gap:10px;width:100%;padding:4px 12px;background:transparent;border:0;border-radius:8px;color:var(--dt-ink-2);font:500 11px/1.3 ui-sans-serif,system-ui,sans-serif;text-align:left;cursor:pointer;transition:background-color .14s cubic-bezier(.22,1,.36,1)}.dt-devices-menu button em{flex:none;color:var(--dt-muted);font:500 10px/1 ui-monospace,monospace;font-style:normal}.dt-devices-menu button:hover{background:#ffffff14;color:#fff}.dt-devices-menu button:focus-visible{outline:2px solid var(--dt-accent);outline-offset:-2px}.dt-devices-menu button[aria-pressed=true]{color:#fff}.dt-pages-n{flex:none;display:flex;gap:3px;font-style:normal}.dt-pages-n b{display:inline-flex;align-items:center;gap:3px;padding:2px 5px 2px 4px;border-radius:999px;font:600 9px/1.4 ui-sans-serif,system-ui,sans-serif;font-variant-numeric:tabular-nums}.dt-pages-n b i{font-style:normal}.dt-pages-n[hidden],.dt-pages-n b[hidden]{display:none}.dt-pages-n svg{display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.dt-pages-n b[data-state=open]{background:#0d99ff;color:#fff}.dt-pages-n b[data-state=claude]{background:#d97757;color:#fff}.dt-pages-n b[data-state=done]{background:#4f8f4138;color:#8fd07f}.dt-menu-label{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis}.dt-devices-menu button[aria-pressed=true] .dt-menu-label:after,.dt-pages a[aria-current] .dt-menu-label:after{content:"";display:inline-block;width:5px;height:9px;margin-left:8px;border-right:1.5px solid var(--dt-accent);border-bottom:1.5px solid var(--dt-accent);transform:rotate(45deg) translate(-1px,-1px)}.dt-notes-overlay{position:fixed;inset:0;z-index:calc(var(--dt-z) + 1);pointer-events:none}.dt-notes-overlay>*{pointer-events:auto}html.dt-noting body{cursor:crosshair}.dt-notes-hi{position:fixed;inset:0;z-index:calc(var(--dt-z) + 1);pointer-events:none}.dt-hi-box{position:fixed;box-sizing:border-box;border:1px solid #0d99ff;background:#0d99ff14}.dt-hi-tag{position:fixed;padding:2px 5px;background:#0d99ff;border-radius:3px;color:#fff;font:500 10px/1.4 ui-monospace,monospace;white-space:pre}html.dt-no-studio sanity-visual-editing{display:none}.dt-pad-overlay{position:fixed;inset:0;z-index:calc(var(--dt-z) - 5);pointer-events:none}.dt-pad-overlay .dt-pad-zone{position:fixed;background:#22a06b47}.dt-pad-overlay .dt-pad-outline{position:fixed;outline:1px dashed rgba(34,160,107,.9);outline-offset:-1px}.dt-pad-overlay .dt-pad-zone--m{background:#ec962e4d}.dt-pad-overlay .dt-pad-chip--m{background:#b5691c}.dt-pad-overlay .dt-pad-zone--g{background:#0d99ff4d}.dt-pad-overlay .dt-pad-chip--g{background:#0d6ec4}.dt-pad-overlay .dt-pad-chip{position:fixed;transform:translate(-50%,-50%);background:#4f8f41;color:#fff;font-size:11px;font-weight:500;line-height:1;padding:3px 6px;border-radius:4px;white-space:nowrap}.dt-pad-overlay .dt-type-card{position:fixed;display:grid;gap:3px;width:200px;box-sizing:border-box;padding:8px 10px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .12);border-radius:8px;box-shadow:0 8px 24px #00000073;color:var(--dt-ink);font:400 11px/1.35 ui-sans-serif,system-ui,sans-serif}.dt-pad-overlay .dt-type-row{display:flex;gap:8px}.dt-pad-overlay .dt-type-row b{flex:none;width:44px;color:var(--dt-muted);font-weight:400}.dt-pad-overlay .dt-type-row span{display:flex;align-items:center;gap:5px;min-width:0;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-pad-overlay .dt-type-row em{color:var(--dt-muted);font-style:normal}.dt-pad-overlay .dt-style-card{width:220px}.dt-pad-overlay .dt-type-row b.dt-var{width:auto;flex:initial;color:var(--dt-ink);font-weight:500;font-family:ui-monospace,SFMono-Regular,Menlo,monospace;font-size:10.5px}.dt-pad-overlay .dt-type-sw{flex:none;width:10px;height:10px;border:1px solid rgb(255 255 255 / .25);border-radius:2px}.dt-pad-overlay .dt-pad-tag{position:fixed;background:var(--dt-panel);color:var(--dt-ink);font-size:11px;line-height:1;padding:4px 7px;border-radius:4px;white-space:nowrap}.dt-grid-overlay{position:fixed;inset:0;z-index:calc(var(--dt-z) - 10);pointer-events:none}.dt-overlay-container,.dt-overlay-grid{height:100%}.dt-overlay-col{background:#ff000014}@media(max-width:767px){.devtools{flex-wrap:wrap;justify-content:center;box-sizing:border-box;width:max-content;max-width:calc(100vw - 24px);border-radius:24px}}.dt-pin{position:absolute;z-index:1;display:grid;place-items:center;width:16px;height:16px;margin:-16px 0 0;padding:0;border:0;border-radius:50%;background:var(--cat, #0d99ff);box-shadow:0 0 0 2px #ffffffe6,0 2px 8px #00000059;color:#fff;font:600 10px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer}.dt-pin--claude{background:#d97757}.dt-pin--working:before{content:"";position:absolute;inset:-4px;border-radius:50%;border:1.5px solid #d97757;animation:dt-working 1.6s ease-in-out infinite;pointer-events:none}@keyframes dt-working{50%{transform:scale(1.25);opacity:.35}}@media(prefers-reduced-motion:reduce){.dt-pin--working:before{animation:none}}.dt-pin--done{background:var(--dt-faint);color:var(--dt-ink);box-shadow:0 0 0 2px #ffffff80;opacity:.55}.dt-pin--done:hover{opacity:1}.dt-pin--draft{background:#f0f0f0;color:#121212}.dt-pin--draft svg{display:block;fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}.dt-note-draft{flex:none;padding:2px 6px;background:#ffffff1a;border-radius:4px;color:var(--dt-ink-2);font:600 10px/1.2 ui-sans-serif,system-ui,sans-serif}.dt-note{position:absolute;z-index:2;box-sizing:border-box;width:288px;margin:6px 0 0 14px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .08);border-radius:12px;box-shadow:0 12px 40px #0000008c;color:var(--dt-ink);font:12px/1.45 ui-sans-serif,system-ui,sans-serif;cursor:default;overflow:hidden}.dt-note[data-flip]{margin-top:0;transform:translateY(calc(-100% - 24px))}.dt-note[data-flipx]{margin-left:0;transform:translate(calc(-100% - 6px))}.dt-note[data-flip][data-flipx]{transform:translate(calc(-100% - 6px),calc(-100% - 24px))}@media(max-width:479px){.dt-note{left:50%!important;margin-left:0;transform:translate(-50%)}.dt-note[data-flipx],.dt-note[data-flip][data-flipx],.dt-note[data-flip]{margin-left:0;transform:translate(-50%)}.dt-note[data-flip],.dt-note[data-flip][data-flipx]{margin-top:0;transform:translate(-50%,calc(-100% - 24px))}}.dt-note-el{min-width:0;overflow:hidden;white-space:nowrap;text-overflow:ellipsis;font-family:ui-monospace,monospace;font-size:11px;color:var(--dt-muted)}.dt-note p{margin:0}.dt-note-bar{position:relative;display:flex;align-items:center;gap:6px;padding:12px;border-bottom:1px solid rgb(255 255 255 / .08);font-weight:600}.dt-note-tools{margin-left:auto;display:flex;gap:2px}.dt-note-tools button{display:grid;place-items:center;width:22px;height:22px;padding:0;background:transparent;border:0;border-radius:50%;color:var(--dt-muted);font:12px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer}.dt-note-tools button svg{display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-note-tools button:hover{background:#ffffff1a;color:#fff}.dt-note-resolve.is-on{color:#5fa850}.dt-note-tools .dt-note-state,.dt-note-tools .dt-note-state:hover{color:#d97757}.dt-note-tools .dt-note-resolve.is-on:hover{color:#5fa850}.dt-note-sep{flex:none;align-self:center;width:1px;height:14px;margin:0 4px;background:#ffffff24}.dt-msg p:after{content:none}.dt-note-info:after{content:attr(data-tip);position:absolute;left:12px;right:12px;top:calc(100% + 6px);z-index:2;padding:6px 8px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);border-radius:6px;box-shadow:0 6px 18px #00000080;color:var(--dt-ink-2);font:400 11px/1.4 ui-sans-serif,system-ui,sans-serif;white-space:normal;pointer-events:none;opacity:0;transition:opacity .12s cubic-bezier(.22,1,.36,1)}.dt-note-info:hover:after{opacity:1}.dt-note-info{display:grid;place-items:center;flex:none;width:16px;height:16px;margin-left:-2px;color:var(--dt-faint);cursor:help}.dt-note-state svg{display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-note-info:hover{color:var(--dt-ink-2)}.dt-note-info svg{display:block;fill:none;stroke:currentColor;stroke-width:1.4;stroke-linecap:round}.dt-note-thread,.dt-hist-list,.dt-note-input,.dt-note-reply-input{color-scheme:dark;scrollbar-width:thin;scrollbar-color:rgb(255 255 255 / .22) transparent}.dt-note-thread{max-height:260px;padding:12px 12px 2px;overflow-y:auto}.dt-msg+.dt-msg{margin-top:12px}.dt-msg-head{display:flex;align-items:baseline;gap:6px;min-height:18px;line-height:18px}.dt-msg-edit{align-self:center;display:grid;place-items:center;width:20px;height:20px;margin-left:auto;padding:0;background:transparent;border:0;border-radius:50%;color:var(--dt-muted);cursor:pointer}.dt-msg-edit:hover{background:#ffffff1a;color:#fff}.dt-msg-edit:focus-visible,.dt-edit-cancel:focus-visible{outline:2px solid var(--dt-accent);outline-offset:1px}.dt-msg-edit svg{display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round}.dt-msg .dt-compose{margin-top:6px}.dt-edit-cancel{height:28px;padding:0 10px;background:transparent;border:0;border-radius:14px;color:var(--dt-ink-2);font:12px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer}.dt-edit-cancel:hover{background:#ffffff1a;color:#fff}.dt-msg-face{width:16px;height:16px;border-radius:50%;object-fit:cover;align-self:center}.dt-msg-head b{color:var(--dt-muted);font-size:11px;font-weight:600}.dt-msg-head time{color:var(--dt-muted);font-size:11px}.dt-msg p{margin-top:6px!important;color:var(--dt-ink);font-size:13px;line-height:1.5;cursor:text;user-select:text}.dt-note--orphan{left:50%!important;top:72px!important;margin:0;transform:translate(-50%)!important}.dt-note .dt-note-twin{margin:12px 12px 0;padding:6px 8px;border-radius:5px;background:#0d99ff1f;color:var(--dt-ink-2);font-size:11px;line-height:1.45}.dt-note-twin button{margin-left:4px;padding:0;border:0;background:none;color:#5cb8ff;font:inherit;text-decoration:underline;text-underline-offset:2px;cursor:pointer}.dt-note-host{display:inline-flex;align-items:center;height:22px;padding:0 8px;border:1px solid var(--dt-line, rgb(255 255 255 / .12));border-radius:999px;color:var(--dt-muted);font-size:11px;max-width:160px;overflow:hidden;text-overflow:ellipsis;white-space:nowrap}.dt-note .dt-note-working{display:flex;align-items:center;gap:6px;margin:12px 12px 0 20px;font-size:12px;color:#d97757}.dt-note-working i{width:6px;height:6px;border-radius:50%;background:currentColor;animation:dt-working 1.6s ease-in-out infinite}@media(prefers-reduced-motion:reduce){.dt-note-working i{animation:none}}.dt-note-orphan{margin:12px 12px 0;padding:6px 8px;background:#e5402c24;border-radius:5px;color:#ff8a7a;font-size:11px}.dt-note-shots{display:flex;flex-wrap:wrap;gap:6px;margin:10px 12px 0}.dt-msg .dt-note-shots{margin:8px 0 0}.dt-shot{position:relative;display:inline-flex}.dt-shot-rm{position:absolute;top:4px;right:4px;display:grid;place-items:center;width:17px;height:17px;padding:0;background:#141414d1;border:1px solid rgb(255 255 255 / .22);border-radius:50%;color:var(--dt-ink);cursor:pointer;transition:background-color .12s cubic-bezier(.22,1,.36,1)}.dt-shot-rm:hover{background:#e5402c;border-color:#e5402c}.dt-shot-rm svg{display:block;fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round}.dt-note-shots img{display:block;width:76px;height:56px;object-fit:cover;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);border-radius:6px}.dt-note-shots a:hover img{border-color:var(--dt-accent)}.dt-note-foot{padding:12px}.dt-compose{position:relative;background:var(--dt-raised);border:1px solid rgb(255 255 255 / .14);border-radius:10px;transition:border-color .14s cubic-bezier(.22,1,.36,1),box-shadow .14s cubic-bezier(.22,1,.36,1)}.dt-compose:focus-within,.dt-compose[data-drop]{border-color:var(--dt-accent);box-shadow:0 0 0 3px #ff5a0033}.dt-compose .dt-note-shots{margin:2px 12px 10px}.dt-note-input,.dt-note-reply-input,.dt-note-edit-input{display:block;width:100%;box-sizing:border-box;min-height:38px;max-height:50vh;overflow-y:hidden;margin:0;padding:10px 12px 6px;background:transparent;border:0;outline:none;color:var(--dt-ink);font:13px/1.45 ui-sans-serif,system-ui,sans-serif;resize:none}.dt-note-input::placeholder,.dt-note-reply-input::placeholder,.dt-note-edit-input::placeholder{color:var(--dt-muted)}.dt-compose-bar{display:flex;align-items:center;justify-content:space-between;padding:6px;border-top:1px solid rgb(255 255 255 / .08)}.dt-attach,.dt-send{display:grid;place-items:center;flex:none;width:28px;height:28px;padding:0;border:0;border-radius:50%;cursor:pointer;transition:background-color .14s cubic-bezier(.22,1,.36,1),color .14s}.dt-attach{background:transparent;color:var(--dt-muted)}.dt-attach:hover{background:#ffffff1a;color:#fff}.dt-send{background:#ffffff24;color:var(--dt-ink-2)}.dt-send.is-ready,.dt-send:hover{background:var(--dt-accent);color:var(--dt-accent-ink)}.dt-attach svg,.dt-send svg{display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.dt-attach:focus-visible,.dt-send:focus-visible{outline:2px solid var(--dt-accent);outline-offset:1px}.dt-history{position:fixed;top:12px;right:12px;bottom:68px;z-index:calc(var(--dt-z) + 2);display:flex;flex-direction:column;box-sizing:border-box;width:300px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .08);border-radius:12px;box-shadow:0 12px 40px #0000008c;color:var(--dt-ink);font:12px/1.45 ui-sans-serif,system-ui,sans-serif;cursor:default;overflow:hidden}.dt-history[hidden],html.dt-in-frame .dt-history{display:none}.dt-history[data-collapsed]{bottom:auto}.dt-history[data-collapsed] .dt-hist-list,.dt-history[data-collapsed] .dt-hist-empty{display:none}.dt-history[data-collapsed] .dt-hist-head{border-bottom:0}.dt-history:not([data-collapsed]) .dt-hist-fold svg{transform:rotate(180deg)}.dt-hist-head{flex:none;display:flex;align-items:center;gap:8px;padding:10px 12px;border-bottom:1px solid rgb(255 255 255 / .08)}.dt-hist-refresh,.dt-hist-fold{display:grid;place-items:center;width:20px;height:20px;padding:0;background:transparent;border:0;border-radius:5px;color:var(--dt-muted);cursor:pointer}.dt-hist-refresh{margin-left:auto}.dt-hist-foot{flex:none;margin-top:auto;padding:6px;border-top:1px solid rgb(255 255 255 / .08)}.dt-history[data-collapsed] .dt-hist-foot{display:none}.dt-hist-resolved{all:unset;box-sizing:border-box;display:flex;align-items:center;gap:8px;width:100%;height:32px;padding:0 8px;border-radius:7px;color:var(--dt-muted);font:400 12px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer}.dt-hist-resolved:hover,.dt-hist-resolved:focus-visible{background:#ffffff0f;color:var(--dt-ink)}.dt-hist-resolved svg{flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-hist-resolved[aria-checked=true] svg{stroke:#7ee2a8}.dt-hist-resolved span{flex:1}.dt-hist-resolved kbd{all:unset;font:500 10px/1 ui-monospace,monospace;padding:2px 5px;border-radius:4px;border:1px solid rgb(255 255 255 / .14);color:var(--dt-muted)}.dt-hist-switch{position:relative;flex:none;width:26px;height:15px;border-radius:999px;background:#ffffff29;transition:background .16s ease-out}.dt-hist-switch:after{content:"";position:absolute;top:2px;left:2px;width:11px;height:11px;border-radius:50%;background:#fff;transition:transform .16s cubic-bezier(.22,1,.36,1)}.dt-hist-resolved[aria-checked=true] .dt-hist-switch{background:var(--dt-accent)}.dt-hist-resolved[aria-checked=true] .dt-hist-switch:after{transform:translate(11px)}.dt-hist-refresh:hover,.dt-hist-fold:hover{background:#ffffff14;color:#fff}.dt-hist-refresh[data-spin] svg{animation:dt-spin .5s cubic-bezier(.22,1,.36,1)}@keyframes dt-spin{to{transform:rotate(360deg)}}.dt-hist-refresh svg,.dt-hist-fold svg{display:block;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round;transition:transform .16s cubic-bezier(.22,1,.36,1)}.dt-hist-list{flex:1;min-height:0;padding:6px;overflow-y:auto}.dt-hist-row{position:relative;display:flex;align-items:flex-start;border-radius:8px}.dt-hist-row:hover{background:#ffffff0f}.dt-hist-tools{position:absolute;top:-8px;right:8px;z-index:1;padding:2px;background:var(--dt-raised);border:1px solid rgb(255 255 255 / .12);border-radius:8px;box-shadow:0 4px 12px #0006;opacity:0;transition:opacity .14s cubic-bezier(.22,1,.36,1)}.dt-hist-row:hover .dt-hist-tools,.dt-hist-tools:focus-within{opacity:1}.dt-hist-tools [data-rm]:hover,.dt-hist-tools [data-draft-rm]:hover{color:#e5402c}.dt-hist-go{display:flex;gap:8px;flex:1;min-width:0;padding:8px;background:transparent;border:0;border-radius:8px;color:inherit;font:inherit;text-align:left;cursor:pointer}.dt-hist-here{display:grid;place-items:center;flex:none;color:var(--dt-ink)}.dt-hist-here svg{display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.dt-hist-title{color:var(--dt-ink);font-weight:600}.dt-hist-sep{flex:none;align-self:center;width:1px;height:14px;margin:0 2px;background:#ffffff24}.dt-hist-bands{display:flex;flex-wrap:wrap;gap:4px}.dt-hist-bands button{display:inline-flex;align-items:center;gap:3px;padding:2px 6px 2px 5px;background:transparent;border:1px solid rgb(255 255 255 / .16);border-radius:999px;color:var(--dt-muted);font:600 9px/1.4 ui-sans-serif,system-ui,sans-serif;font-variant-numeric:tabular-nums;cursor:pointer}.dt-hist-bands button svg{display:block;fill:none;stroke:currentColor;stroke-width:1.5;stroke-linecap:round;stroke-linejoin:round}.dt-hist-bands button i{font-style:normal}.dt-hist-bands button[data-state=open]{background:#0d99ff;border-color:#0d99ff;color:#fff}.dt-hist-bands button[data-state=claude]{background:#d97757;border-color:#d97757;color:#fff}.dt-hist-group{display:flex;gap:6px;margin:0;padding:10px 12px 4px;color:var(--dt-muted);font-size:10px;font-weight:600;letter-spacing:.06em;text-transform:uppercase}.dt-hist-group:first-child{padding-top:4px}.dt-hist-group em{color:var(--dt-faint);font-style:normal}.dt-hist-row.is-done{opacity:.5}.dt-hist-row.is-done:hover{opacity:1}.dt-hist-n{flex:none;display:grid;place-items:center;width:12px;height:12px;margin-top:4px;background:var(--cat, #0d99ff);border-radius:50%;color:#fff;font:600 8px/1 ui-sans-serif,system-ui,sans-serif}.dt-hist-row.is-done .dt-hist-n{background:var(--dt-faint)}.dt-hist-row.is-claude .dt-hist-n{background:#d97757}.dt-hist-row.is-draft .dt-hist-n{background:#f0f0f0;color:#121212}.dt-hist-n svg:not(.dt-claude){width:8px;height:8px;fill:none;stroke:currentColor;stroke-width:2.2;stroke-linecap:round}.dt-hist-orphan{color:var(--dt-muted);font-weight:500;font-style:italic}.dt-hist-claude{display:inline-flex;align-items:center;gap:3px;margin:-1px 0;padding:1px 5px 1px 3px;border-radius:999px;color:#d97757;font-weight:600;cursor:pointer;transition:background .12s ease-out}.dt-hist-claude i{font-style:normal;font-weight:400;opacity:0;margin-left:1px;transition:opacity .12s ease-out}.dt-hist-claude:hover,.dt-hist-claude:focus-visible{background:#d9775729;outline:none}.dt-hist-claude:hover i,.dt-hist-claude:focus-visible i{opacity:1}svg.dt-claude{fill:currentColor!important;stroke:none!important}.dt-hist-n .dt-claude{color:#fff}.dt-hist-body{display:grid;gap:2px;min-width:0}.dt-hist-id{display:flex;gap:6px;color:var(--dt-muted);font-size:11px}.dt-hist-id em{color:var(--dt-faint);font-style:normal}.dt-hist-text b{color:#d97757;font-weight:600}.dt-hist-text{display:-webkit-box;-webkit-box-orient:vertical;-webkit-line-clamp:2;overflow:hidden}.dt-hist-meta{color:var(--dt-muted);font-size:11px}.dt-hist-empty{margin:0;padding:16px 12px;color:var(--dt-muted)}.dt-toast{position:fixed;left:50%;bottom:68px;transform:translate(-50%);z-index:calc(var(--dt-z) + 5);padding:8px 12px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .14);border-radius:8px;box-shadow:0 8px 24px #00000073;color:var(--dt-ink);font:400 12px/1.4 ui-sans-serif,system-ui,sans-serif}.dt-mentions{display:grid;margin:0 8px 6px;padding:4px;background:var(--dt-panel);border:1px solid rgb(255 255 255 / .1);border-radius:8px}.dt-mentions button{all:unset;display:flex;gap:6px;align-items:baseline;padding:6px 8px;border-radius:6px;color:var(--dt-ink);font-size:12px;cursor:pointer}.dt-mentions button span{color:var(--dt-faint);font-size:11px}.dt-mentions button:hover,.dt-mentions button:focus-visible,.dt-mentions button[aria-selected=true]{background:#ffffff14}.dt-msg--new{animation:dt-msg-in .32s cubic-bezier(.22,1,.36,1)}@keyframes dt-msg-in{0%{opacity:0;transform:translateY(4px)}}@media(prefers-reduced-motion:reduce){.dt-msg--new{animation:none}}.dt-pin[data-off]{opacity:.7}.dt-pin[data-off]:after{content:"";position:absolute;border:4px solid transparent}.dt-pin[data-off=r]:after{left:100%;top:50%;margin-top:-4px;border-left-color:var(--cat, #0d99ff)}.dt-pin[data-off=l]:after{right:100%;top:50%;margin-top:-4px;border-right-color:var(--cat, #0d99ff)}.dt-pin[data-off=t]:after{bottom:100%;left:50%;margin-left:-4px;border-bottom-color:var(--cat, #0d99ff)}.dt-pin[data-off=b]:after{top:100%;left:50%;margin-left:-4px;border-top-color:var(--cat, #0d99ff)}.dt-pad-overlay .dt-type-row em.dt-type-bad{color:#ff6b5e;opacity:1}.dt-suggest{margin:0 12px 8px;display:grid;gap:4px}.dt-suggest-head{display:flex;justify-content:space-between;align-items:center;color:var(--dt-muted);font:500 11px/1.4 ui-sans-serif,system-ui,sans-serif}.dt-suggest-head button{all:unset;cursor:pointer;display:grid;color:var(--dt-faint)}.dt-suggest-was{color:var(--dt-faint);font:400 12px/1.4 ui-sans-serif,system-ui,sans-serif;overflow-wrap:anywhere}.dt-suggest-was del{color:var(--dt-muted);text-decoration-color:#ffffff59}.dt-suggest-hint{color:var(--dt-faint);font:400 11px/1.4 ui-sans-serif,system-ui,sans-serif}.dt-suggest-input{width:100%;box-sizing:border-box;padding:8px 10px;border:1px solid rgb(255 255 255 / .14);border-radius:8px;background:var(--dt-raised);color:var(--dt-ink);font:400 13px/1.45 ui-sans-serif,system-ui,sans-serif;resize:vertical}.dt-suggest--read{margin:6px 0 0;padding:8px 10px;border-radius:8px;background:#ffffff0d;font-size:13px;line-height:1.45}.dt-suggest--read del{color:var(--dt-faint)}.dt-suggest--read ins{text-decoration:none;color:#7ee2a8}.dt-review{position:fixed;top:12px;left:50%;transform:translate(-50%);z-index:calc(var(--dt-z) + 3);display:flex;align-items:center;gap:10px;max-width:min(720px,calc(100vw - 24px));padding:6px 6px 6px 14px;border-radius:999px;background:var(--dt-bg);color:var(--dt-ink);box-shadow:0 0 0 1px color-mix(in srgb,var(--dt-accent) 55%,transparent),0 0 0 5px color-mix(in srgb,var(--dt-accent) 14%,transparent),0 10px 32px #0006;font:400 12px/1.4 ui-sans-serif,system-ui,sans-serif;animation:dt-review-in .26s cubic-bezier(.22,1,.36,1)}@keyframes dt-review-in{0%{opacity:0;transform:translate(-50%,-8px)}}.dt-review[hidden]{display:none}.dt-review b{font-weight:600;white-space:nowrap;display:inline-flex;align-items:center;gap:8px}.dt-review-dot{width:7px;height:7px;border-radius:50%;background:var(--dt-accent);box-shadow:0 0 0 3px color-mix(in srgb,var(--dt-accent) 30%,transparent);animation:dt-review-dot 1.6s ease-in-out infinite}@keyframes dt-review-dot{50%{box-shadow:0 0 0 6px color-mix(in srgb,var(--dt-accent) 0%,transparent)}}@media(prefers-reduced-motion:reduce){.dt-review,.dt-review-dot{animation:none}}.dt-review-nav{display:inline-flex;align-items:center;gap:2px;padding:2px;border-radius:999px;background:#ffffff0f}.dt-review-nav .dt-review-n{padding:0 4px;font-variant-numeric:tabular-nums}.dt-review-n{color:var(--dt-muted);white-space:nowrap}.dt-review-text{color:var(--dt-muted);overflow:hidden;text-overflow:ellipsis;white-space:nowrap;min-width:0;flex:1}.dt-review button{all:unset;position:relative;display:inline-grid;place-items:center;width:28px;height:28px;flex:none;border-radius:999px;background:#ffffff14;cursor:pointer;transition:background .12s ease-out}.dt-review-nav button{width:24px;height:24px;background:none}.dt-review button:hover,.dt-review button:focus-visible{background:#ffffff29}.dt-review button:disabled{opacity:.35;cursor:default;background:none}.dt-review .dt-review-ok{background:var(--dt-accent);color:var(--dt-accent-ink)}.dt-review .dt-review-ok:hover{background:color-mix(in srgb,var(--dt-accent) 85%,white)}.dt-review svg{width:14px;height:14px}.dt-review [data-tip]:after,.dt-review-btn[data-tip]:after{content:attr(data-tip);position:absolute;top:calc(100% + 10px);left:50%;transform:translate(-50%);width:max-content;max-width:220px;padding:6px 8px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);border-radius:6px;box-shadow:0 6px 18px #00000080;color:var(--dt-ink-2);font:400 11px/1.4 ui-sans-serif,system-ui,sans-serif;pointer-events:none;opacity:0;transition:opacity .12s cubic-bezier(.22,1,.36,1)}.dt-review [data-tip]:hover:after,.dt-review [data-tip]:focus-visible:after,.dt-review-btn[data-tip]:hover:after,.dt-review-btn[data-tip]:focus-visible:after{opacity:1}.dt-review-btn[data-tip]:after{left:auto;right:-40px;transform:none;z-index:2;font-weight:400}.dt-review-btn svg{fill:none;stroke:currentColor;stroke-width:2;stroke-linecap:round;width:12px;height:12px}.dt-review [data-r=stop][data-tip]:after{left:auto;right:0;transform:none}.dt-review-btn{all:unset;position:relative;display:inline-flex;align-items:center;gap:3px;flex:none;white-space:nowrap;padding:2px 8px 2px 6px;border-radius:999px;background:var(--dt-accent);color:var(--dt-accent-ink);font:600 11px/1.5 ui-sans-serif,system-ui,sans-serif;cursor:pointer}.dt-review svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-record{all:unset;display:grid;place-items:center;min-width:28px;height:28px;padding:0 6px;box-sizing:border-box;border-radius:999px;color:var(--dt-muted);cursor:pointer;font:600 11px/1 ui-sans-serif,system-ui,sans-serif}.dt-record svg{fill:none;stroke:currentColor;stroke-width:1.5;stroke-linejoin:round}.dt-record:hover{color:var(--dt-ink);background:#ffffff14}.dt-record.is-on{background:#e5484d;color:#fff;animation:dt-rec 1.2s ease-in-out infinite}@keyframes dt-rec{50%{opacity:.7}}.dt-rec{position:absolute;inset:0;z-index:2;display:flex;align-items:center;gap:10px;padding:0 8px 0 6px;border-radius:inherit;background:var(--dt-raised)}.dt-rec button{all:unset;cursor:pointer;display:grid;place-items:center;flex:none}.dt-rec svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round;stroke-linejoin:round}.dt-rec .dt-rec-x{width:26px;height:26px;border-radius:6px;color:var(--dt-muted)}.dt-rec .dt-rec-x:hover{color:var(--dt-ink);background:#ffffff14}.dt-rec-time{display:inline-flex;align-items:center;gap:7px;flex:none;color:var(--dt-ink);font:500 12px/1 ui-monospace,SFMono-Regular,Menlo,monospace;font-variant-numeric:tabular-nums}.dt-rec-time i{width:8px;height:8px;border-radius:50%;background:#e5484d;box-shadow:0 0 0 3px #e5484d38;animation:dt-rec 1.2s ease-in-out infinite}.dt-rec.is-busy .dt-rec-time i{display:none}.dt-rec-wave{flex:1;min-width:0;height:22px;display:flex;align-items:center;gap:2px}.dt-rec-wave i{flex:1;max-width:3px;height:100%;border-radius:2px;background:var(--dt-ink-2);transform:scaleY(.1);transition:transform 90ms linear}.dt-rec-wave i.is-empty,.dt-rec.is-busy .dt-rec-wave i{background:#ffffff2e}.dt-rec .dt-rec-done{width:28px;height:28px;border-radius:50%;background:var(--dt-accent);color:var(--dt-accent-ink)}.dt-rec .dt-rec-done:active{transform:scale(.94)}.dt-rec.is-busy .dt-rec-done{opacity:.5;pointer-events:none}.dt-attach.is-asking{color:#e5484d;animation:dt-rec 1.2s ease-in-out infinite}.dt-voice-rm.is-asking{color:var(--dt-accent);animation:dt-rec 1.2s ease-in-out infinite;pointer-events:none}.dt-voice-rm{all:unset;cursor:pointer;display:grid;place-items:center;flex:none;width:18px;height:18px;border-radius:50%;color:var(--dt-faint)}.dt-voice-rm:hover{color:var(--dt-ink);background:#ffffff1a}.dt-voice-rm svg{fill:none;stroke:currentColor;stroke-width:1.8;stroke-linecap:round}@media(prefers-reduced-motion:reduce){.dt-rec-time i{animation:none}.dt-rec-wave i{transition:none}}.dt-voice{display:flex;align-items:center;gap:8px;flex-basis:100%;max-width:260px;padding:4px 10px 4px 4px;border-radius:999px;background:#ffffff0f;border:1px solid rgb(255 255 255 / .08)}.dt-voice-play{flex:none;display:grid;place-items:center;width:26px;height:26px;padding:0 0 0 1px;border:0;border-radius:50%;background:var(--dt-accent);color:var(--dt-accent-ink);cursor:pointer}.dt-voice.is-playing .dt-voice-play{padding:0}.dt-voice-play svg{fill:currentColor}.dt-voice-play:active{transform:scale(.94)}.dt-voice-track{flex:1;min-width:0;height:18px;padding:0;border:0;background:none;cursor:pointer;position:relative}.dt-voice-track:before,.dt-voice-track i{content:"";position:absolute;left:0;top:50%;height:3px;margin-top:-1.5px;border-radius:3px}.dt-voice-track:before{right:0;background:#ffffff29}.dt-voice-track i{width:0;background:var(--dt-accent);transition:width .25s linear}.dt-voice-time{flex:none;font:500 11px/1 ui-monospace,SFMono-Regular,Menlo,monospace;font-variant-numeric:tabular-nums;color:var(--dt-muted)}.dt-shot--video video{display:block;max-width:100%;max-height:180px;border-radius:6px;background:#000}.dt-note-meta{display:flex;flex-wrap:wrap;gap:4px;margin:0 12px 12px}.dt-note>.dt-note-meta{margin:14px 12px 10px}.dt-note-meta .dt-field-box{height:22px;padding-left:18px}.dt-note-meta .dt-field-box:before{left:8px;width:6px;height:6px}.dt-note-meta .dt-field select{padding-right:17px;background-position:right 5px center}.dt-note-meta .dt-field-box--bars,.dt-field-box--bars{padding-left:21px}.dt-field-box--bars:before{content:none}.dt-field-box--bars .dt-bars{position:absolute;left:7px;pointer-events:none}.dt-prio-row{display:flex;align-items:center;justify-content:space-between;gap:10px;margin:-2px 12px 10px}.dt-hand{display:inline-flex;align-items:center;gap:2px;min-width:0;padding:2px;border-radius:999px;background:#00000059;box-shadow:inset 0 0 0 1px #ffffff1f}.dt-hand-stop{display:inline-flex;align-items:center;justify-content:center;gap:5px;min-width:26px;height:22px;padding:0 7px;border:0;border-radius:999px;background:none;color:var(--dt-faint);font:500 11px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:background .14s,color .14s}.dt-hand-stop svg{flex:none;fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-hand-stop .dt-claude{fill:currentColor;stroke:none}button.dt-hand-stop:hover{background:#ffffff0f;color:var(--dt-ink)}button.dt-hand-stop:disabled{opacity:.35;cursor:not-allowed;background:none}.dt-hand-stop:focus-visible{outline:none;box-shadow:inset 0 0 0 1px var(--dt-accent)}.dt-hand-stop.is-on{min-width:0;padding:0;cursor:default;color:var(--dt-ink)}.dt-hand-stop--nobody.is-on{padding:0 9px;background:#ffffff1a;color:var(--dt-muted)}.dt-hand .dt-field-box{height:22px;padding-left:18px;box-shadow:inset 0 0 0 1px color-mix(in srgb,var(--cat) 55%,transparent);background:color-mix(in srgb,var(--cat) 16%,transparent)}.dt-hand .dt-field-box:before{left:8px;width:6px;height:6px}.dt-hand .dt-field-box[data-face]{padding-left:24px}.dt-hand .dt-field-box[data-face]:before{left:3px;width:16px;height:16px}.dt-hand .dt-field select{padding-right:17px;background-position:right 5px center;max-width:110px}.dt-hand-stop--agent.is-on select{color:#e8a083}.dt-prio{display:inline-flex;align-items:center;gap:6px;height:22px;padding:0 4px;margin-left:-4px;border:0;border-radius:6px;background:none;color:var(--cat);font:500 11px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:background .14s}.dt-prio:hover{background:#ffffff0f}.dt-prio:focus-visible{outline:none;box-shadow:inset 0 0 0 1px var(--dt-accent)}.dt-field-menu .dt-bars{margin:0;flex:none}.dt-field{display:inline-flex;min-width:0;margin:0;cursor:pointer}.dt-field-box{position:relative;display:flex;align-items:center;min-width:0;height:26px;padding-left:20px;border-radius:999px;box-shadow:inset 0 0 0 1px #ffffff1f;transition:box-shadow .14s cubic-bezier(.22,1,.36,1)}.dt-field-box:before{content:"";position:absolute;left:9px;width:8px;height:8px;border-radius:50%;background:var(--cat)}.dt-field-box:hover{box-shadow:inset 0 0 0 1px #ffffff47}.dt-field-box:focus-within{box-shadow:inset 0 0 0 1px var(--dt-accent)}.dt-field select{appearance:none;-webkit-appearance:none;color-scheme:dark;box-sizing:border-box;width:100%;height:100%;margin:0;padding:0 21px 0 0;field-sizing:content;max-width:120px;border:0;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 8l4 4 4-4' fill='none' stroke='%23afafaf' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 7px center / 10px;color:var(--dt-ink);font:500 11px/1 ui-sans-serif,system-ui,sans-serif;text-overflow:ellipsis;white-space:nowrap;cursor:pointer;outline:none}.dt-field select option{background:var(--dt-raised);color:var(--dt-ink)}.dt-field-box--unset:before{background:#ffffff40!important}.dt-field-box--unset select{color:var(--dt-muted)}.dt-field-menu{pointer-events:auto;position:fixed;z-index:calc(var(--dt-z) + 6);display:grid;padding:4px;max-height:260px;overflow-y:auto;border-radius:10px;background:var(--dt-bg);border:1px solid rgb(255 255 255 / .12);box-shadow:0 12px 32px #00000080;animation:dt-field-menu .14s cubic-bezier(.22,1,.36,1)}.dt-field-menu{color-scheme:dark;scrollbar-width:thin;scrollbar-color:rgb(255 255 255 / .18) transparent}.dt-field-menu[hidden]{display:none}@keyframes dt-field-menu{0%{opacity:0;transform:translateY(-3px)}}.dt-field-menu button{all:unset;display:flex;align-items:center;gap:10px;height:34px;padding:0 10px;border-radius:6px;color:var(--dt-ink);font:400 13px/1 ui-sans-serif,system-ui,sans-serif;cursor:pointer;white-space:nowrap}.dt-field-menu button:hover,.dt-field-menu button:focus-visible{background:#ffffff14}.dt-field-menu hr{margin:4px 6px;border:0;border-top:1px solid rgb(255 255 255 / .1)}.dt-field-menu i{width:8px;height:8px;border-radius:50%;flex:none}.dt-field-menu span{flex:1}.dt-field-menu svg{fill:none;stroke:var(--dt-muted);stroke-width:1.8;stroke-linecap:round;margin-left:12px}.dt-pill{position:relative;display:inline-flex;align-items:center;gap:4px;margin:0;padding:0 0 0 8px;border-radius:999px;box-shadow:inset 0 0 0 1px #ffffff1f;color:var(--dt-faint);font:600 10px/1.4 ui-sans-serif,system-ui,sans-serif;cursor:pointer;transition:box-shadow .14s cubic-bezier(.22,1,.36,1)}.dt-pill:hover{box-shadow:inset 0 0 0 1px #ffffff4d}.dt-pill:focus-within{box-shadow:inset 0 0 0 1px var(--dt-accent)}.dt-pill[style*=--cat]:before{content:"";width:6px;height:6px;border-radius:50%;background:var(--cat)}.dt-pill select{appearance:none;-webkit-appearance:none;color-scheme:dark;box-sizing:border-box;height:auto;max-width:150px;margin:0;padding:3px 20px 3px 0;border:0;background:transparent url("data:image/svg+xml,%3Csvg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 20 20'%3E%3Cpath d='M6 8l4 4 4-4' fill='none' stroke='%23afafaf' stroke-width='2' stroke-linecap='round' stroke-linejoin='round'/%3E%3C/svg%3E") no-repeat right 6px center / 11px;color:var(--dt-ink);font:inherit;text-overflow:ellipsis;cursor:pointer;outline:none}.dt-pill select option{background:var(--dt-raised);color:var(--dt-ink)}.dt-compose-tools{display:flex;align-items:center;gap:2px}.dt-pin--review{--cat: #8e4ec6 !important;box-shadow:0 0 0 2px #8e4ec6}.dt-note-tools button.dt-share svg{fill:none;stroke:currentColor;stroke-width:1.6;stroke-linecap:round}.dt-note-tools button.dt-share.is-on{color:#30a46c}.dt-face{display:grid;place-items:center;flex:none;width:20px;height:20px;border-radius:50%;object-fit:cover;background:#ffffff1f;color:var(--dt-ink);font:600 10px/1 ui-sans-serif,system-ui,sans-serif}.dt-face--agent{box-shadow:0 0 0 1.5px #d97757}.dt-mentions button{align-items:center}.dt-mentions .dt-face{width:18px;height:18px}.dt-field-box[data-face]{padding-left:26px}.dt-field-box[data-face]:before{left:4px;width:18px;height:18px;background:var(--face) center / cover}.dt-pin:has(>.dt-face){width:18px;height:18px;margin-top:-18px;box-shadow:0 0 0 2px var(--cat, #0d99ff),0 2px 8px #00000059}.dt-pin>.dt-face{width:100%;height:100%;background:var(--cat, #0d99ff);color:#fff}.dt-pin--review:has(>.dt-face){box-shadow:0 0 0 2px #8e4ec6,0 2px 8px #00000059}
|
package/src/client/run.js
CHANGED
|
@@ -1,120 +1,121 @@
|
|
|
1
|
-
import{categoryOf as $e}from"../store/categories.mjs";import{stateOf as q,STATE_LABEL as ea}from"../store/status.mjs";import{agentLabel as na,agentName as Rs,agentOwner as At,handleOf as sa,held as oa,stageOf as Is,threadOf as aa,toAgent as W,workingOn as ia}from"../store/thread.mjs";import{api as B,canvasCopy as ra,host as la,imageUrl as da}from"./api";import{DEVTOOLS_DEVICES as Ds}from"../devtools-devices.mjs";import{drawDevice as ca,pageTints as ua,inkFor as Os}from"./devices";import{recentLogs as pa}from"./logs";import{inspectors as ma}from"./inspect";import{anchors as ga,clean as wt}from"./anchor";import{bars as ha,fieldMenus as fa}from"./field-menu";function xa(g){const R=g.breakpoints,gn=g.categories,we=(R.find(t=>!Number.isFinite(t.max))??R[0]).id,Nt=t=>R.find(e=>t>=e.min&&t<=e.max)?.id??we,ot=t=>t.breakpoint||we,Xt=t=>g.devices.find(e=>e.id===t),w=ra,J=(t,e)=>{w||localStorage.setItem(t,e)},Ee=t=>t.replace(/\/+$/,"")||"/";let _=Ee(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 hn=document.querySelector(".dt-grid-btn"),Zt=document.querySelector(".dt-grid-overlay"),fn="dt-grid",Se=t=>{Zt.hidden=!t,hn.setAttribute("aria-pressed",String(t)),J(fn,t?"1":"0"),P({grid:t})};hn.addEventListener("click",()=>Se(Zt.hidden===!0));const bn=document.querySelector(".dt-pages-name"),yn=()=>{let t=null;for(const s of document.querySelectorAll(".dt-pages a"))Ee(new URL(s.href).pathname)===_?(s.setAttribute("aria-current","page"),t=s):s.removeAttribute("aria-current");const e=document.title.split("\u2014").pop()?.trim(),n=t?.querySelector(".dt-menu-label")?.textContent?.trim();bn.textContent=n||e||bn.textContent};yn();const vn=[...document.querySelectorAll(".devtools details")];let Le=!1;const Ct=()=>{const t=vn.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]=Ct();e&&(e.querySelector("summary")?.focus(),t.preventDefault(),t.stopImmediatePropagation())},!0),document.addEventListener("pointerdown",t=>{Le=vn.some(e=>e.open&&!e.contains(t.target))&&Ct().length>0},!0),addEventListener("blur",Ct);const Et=document.querySelector(".dt-pad-overlay"),$n="dt-inspect",Ps=[".devtools",".dt-pad-overlay",".dt-grid-overlay",".dt-frame",".dt-history",".dt-review",".dt-field-menu",...g.ignore].join(", "),Te=[".devtools",".dt-notes-overlay",".dt-history",".dt-frame",".dt-review",".dt-field-menu",'[aria-modal="true"]',...g.ignore].join(", "),Me={pads:document.querySelector(".dt-pad-btn"),sizes:document.querySelector(".dt-size-btn"),type:document.querySelector(".dt-type-btn"),color:document.querySelector(".dt-color-btn"),border:document.querySelector(".dt-border-btn")};let at="",xe=0;const{spacer:js,drawPads:Fs,drawSize:Ks,drawType:Ws,drawColor:_s,drawBorder:zs}=ma(Et),wn=t=>{xe||(xe=requestAnimationFrame(()=>{xe=0,Et.hidden=!0;let e=document.elementFromPoint(t.clientX,t.clientY);if(Et.hidden=!1,!e||e.closest(Ps)){Et.innerHTML="";return}t.altKey&&e.parentElement&&e.parentElement!==document.body&&(e=e.parentElement),at==="sizes"?Ks(e):at==="type"?Ws(e):at==="color"?_s(e):at==="border"?zs(e):Fs(t.altKey?e:js(e))}))},Qt=t=>{at=t;for(const[e,n]of Object.entries(Me))n.setAttribute("aria-pressed",String(e===t));J($n,t),P({inspect:t}),Et.hidden=!t,Et.innerHTML="",t?document.addEventListener("mousemove",wn):document.removeEventListener("mousemove",wn)};for(const[t,e]of Object.entries(Me))e.addEventListener("click",()=>{t!==at&&pt(!1),Qt(at===t?"":t)});const En=document.querySelector(".dt-notes-btn"),ke=[...document.querySelectorAll(".dt-bp")],te=document.querySelector(".dt-history-btn"),K=document.querySelector(".dt-history"),He=document.querySelector(".dt-studio-btn"),L=document.querySelector(".dt-device"),Sn=document.querySelector(".dt-shell"),Bt=document.querySelector('.dt-chrome[data-at="top"]'),ee=document.querySelector('.dt-chrome[data-at="bottom"]'),qt=document.querySelector(".dt-ruler"),G=document.querySelector(".dt-devices"),ht=document.querySelector(".dt-notes-hi"),Us=ht.querySelector(".dt-hi-box"),Ln=ht.querySelector(".dt-hi-tag"),Vs=[...document.querySelectorAll(".dt-frame-handle")],Tn=document.querySelector(".dt-frame-size"),Ae=document.querySelector(".dt-frame-rotate"),Rt=document.querySelector(".dt-frame-bars"),C=document.querySelector(".dt-frame"),M=C.querySelector("iframe"),Ne=document.querySelector(".dt-notes-count"),f=document.querySelector(".dt-notes-overlay"),Mn=".devtools, .dt-tab, .dt-notes-overlay, .dt-history, .dt-frame, .dt-review";for(const t of document.querySelectorAll(Mn))for(const e of["pointerdown","mousedown","pointerup","mouseup","touchstart","touchend","click","focusin","focusout"])t.addEventListener(e,n=>n.stopPropagation());const xn="dt-notes";let b=[],A=!1,v=null,c=null,Ce=0,z="",U=[],x=null,I=[];const ne=(t=c)=>!!(t&&(t.text?.trim()||t.images?.length)),V=()=>{c&&ne()&&I.push(c),c=null};let It=null,it=null;const kn=()=>`dt-draft:${_}${w?":canvas":""}`;let St=kn(),se=0;const Be=()=>{if(!c&&!I.length&&!z){localStorage.removeItem(St);return}const t={draft:c,parked:I,reply:z?{for:It,text:z}:null};try{localStorage.setItem(St,JSON.stringify(t))}catch{const e=n=>({...n,images:void 0});try{localStorage.setItem(St,JSON.stringify({...t,draft:c&&e(c),parked:I.map(e)}))}catch{}}},ft=()=>{clearTimeout(se),se=setTimeout(Be,200)};addEventListener("pagehide",()=>{clearTimeout(se),Be()});let X=localStorage.getItem("dt-resolved")!=="0";const Ys=[[/Edg\/(\d+)/,"Edge"],[/OPR\/(\d+)/,"Opera"],[/Firefox\/(\d+)/,"Firefox"],[/Chrome\/(\d+)/,"Chrome"],[/Version\/(\d+).*Safari/,"Safari"]],Js=[[/iPhone|iPad/,"iOS"],[/Android/,"Android"],[/Mac OS X/,"macOS"],[/Windows/,"Windows"],[/Linux/,"Linux"]],Gs=()=>{const t=navigator.userAgent,e=a=>a.find(([d])=>d.test(t)),n=e(Ys),s=e(Js),o=n?n[0].exec(t)?.[1]:null;return[n?`${n[1]}${o?" "+o:""}`:"unknown browser",s?.[1]].filter(Boolean).join(" \xB7 ")},lt=()=>Nt(innerWidth),oe=()=>it??lt(),Dt=()=>{const t=oe();for(const e of ke)e.setAttribute("aria-pressed",String(e.dataset.bp===t))},{cssPath:Xs,poolOf:Zs,contextOf:Qs,resolveEl:Y,anchorOf:Z}=ga(),Hn=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 ae=[];const qe=t=>{for(const e of ae)e.play();ae=[];for(let e=t;e&&e!==document.body;e=e.parentElement)for(const n of e.getAnimations())n.playState==="running"&&(n.pause(),ae.push(n))},An=()=>{if(c)return Y(c);const t=v!=null?b.find(n=>n.id===v):null;if(!t)return null;const e=Z(t);return e&&!e.off?Y(t):null},Nn=t=>t?new Date(t).toLocaleString(void 0,{day:"numeric",month:"short",hour:"2-digit",minute:"2-digit"}):"",Ot='<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>',Pt='<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>',ie='<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>',to='<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>',eo='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M8 5l5 5-5 5" stroke-linejoin="round"/></svg>',no='<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>',Lt=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>`,jt=()=>g.me?`agent:${g.me.email}`:"claude",so='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><circle cx="10" cy="10" r="6" stroke-dasharray="2.4 2.4"/></svg>',Ie=()=>(g.team??[]).filter(t=>t.email!==g.me?.email),Cn=(t,e,n=!1)=>{const s=W(t)?"agent":t?"person":"nobody";return`<span class="dt-hand" role="radiogroup" aria-label="Who takes it">${[...Ie().length||s==="person"?[["person",Kn,"A person"]]:[],["nobody",so,"Nobody yet \u2014 a note for now"],["agent",Lt(12),n?"Waits for the studio to approve it":"An agent \u2014 approves it for AI"]].map(([a,d,u])=>a===s?`<span class="dt-hand-stop dt-hand-stop--${a} is-on" role="radio" aria-checked="true" title="${u}">${a==="nobody"?`${d}<span>Nobody</span>`:io(t,e,a)}</span>`:`<button type="button" class="dt-hand-stop dt-hand-stop--${a}" role="radio" aria-checked="false" data-act="hand" data-v="${a}"${e?` data-id="${e}"`:""} title="${u}"${a==="agent"&&n?" disabled":""}>${d}</button>`).join("")}</span>`},oo=(t,e)=>{const n=re(),s=e==="agent"?W(n)?n:jt():e==="person"?n&&!W(n)&&Ie().some(d=>d.email===n)?n:Ie()[0]?.email??"":"";if(!t){if(!c)return;c.assignee=s,c.stage=W(s)?"approved":c.stage==="review"?"review":"new";try{localStorage.setItem("nm-for",s)}catch{}ft(),h();return}const o=b.find(d=>d.id===t),a=W(s)?"approved":o&&Is(o)==="review"?"review":"new";ct(d=>d.map(u=>u.id===t?{...u,assignee:s||void 0,stage:a}:u),()=>B("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:t,assignee:s||null,stage:a})}),W(s)?"Approving it for the agent":"Reassigning")},re=()=>{try{return localStorage.getItem("nm-for")??jt()}catch{return jt()}},Ft=t=>W(t)?"#d97757":t?"#0d99ff":"#717171",De=t=>t===g.me?.email?"you":g.team?.find(e=>e.email===t)?.name||t.split("@")[0],le=t=>t?g.team?.find(e=>e.email===t):void 0,Bn=t=>m((wt(t??"")[0]??"?").toUpperCase()),qn=(t,e,n="dt-face")=>t?`<img class="${n}" src="${m(t)}" alt="">`:`<b class="${n}" aria-hidden="true">${Bn(e)}</b>`,ao=t=>{const e=le(t.by);return e||t.byName?qn(e?.avatar_url,e?.name||t.byName||t.by):""},Rn=t=>{const e=le(t);return e?` data-face="${m(e.avatar_url??"")}" data-initial="${Bn(e.name||e.email)}"`:""},dt=(t,e)=>na(t,e,De),In=t=>{const e=le(t)?.avatar_url;return e?`;--face:url("${m(e)}")`:""},Dn=t=>le(t)?.avatar_url?" data-face":"",io=(t,e,n)=>{const s=(r,p)=>`<option value="${m(r)}" data-c="${Ft(r)}"${Rn(At(r)??(W(r)?null:r))}${At(r)?" data-agent":""}${t===r?" selected":""}>${m(p)}</option>`,o=(g.team??[]).filter(r=>r.email!==g.me?.email),a=n!=="person",d=n!=="agent",u=o.filter(r=>!g.studio||g.studio.includes(r.email)),i=At(t)&&t!==jt()&&!u.some(r=>`agent:${r.email}`===t)?s(t,`${De(At(t))}'s agent`):"";return`<label class="dt-field" title="Who it is for"><span class="dt-field-box"${Dn(At(t)??(W(t)?null:t))} style="--cat:${Ft(t)}${In(At(t)??(W(t)?null:t))}"><select class="dt-for-select"${e?` data-id="${e}"`:""} aria-label="Who this is for">
|
|
2
|
-
${a&&
|
|
3
|
-
${a?s("claude",g.me?"Any agent":"AI agent"):""}
|
|
1
|
+
import{categoryOf as $e}from"../store/categories.mjs";import{stateOf as q,STATE_LABEL as ia}from"../store/status.mjs";import{agentLabel as ra,agentName as Ds,agentOwner as Nt,handleOf as la,held as da,stageOf as we,threadOf as ca,toAgent as K,workingOn as Os}from"../store/thread.mjs";import{api as C,canvasCopy as ua,host as ma,imageUrl as pa}from"./api";import{DEVTOOLS_DEVICES as Ps}from"../devtools-devices.mjs";import{drawDevice as ga,pageTints as ha,inkFor as js}from"./devices";import{recentLogs as fa}from"./logs";import{inspectors as ba}from"./inspect";import{anchors as ya,clean as wt}from"./anchor";import{bars as va,fieldMenus as $a}from"./field-menu";function Na(p){const R=p.breakpoints,hn=p.categories,Ee=(R.find(t=>!Number.isFinite(t.max))??R[0]).id,Ct=t=>R.find(e=>t>=e.min&&t<=e.max)?.id??Ee,ot=t=>t.breakpoint||Ee,Xt=t=>p.devices.find(e=>e.id===t),w=ua,J=(t,e)=>{w||localStorage.setItem(t,e)},Se=t=>t.replace(/\/+$/,"")||"/";let _=Se(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 fn=document.querySelector(".dt-grid-btn"),Zt=document.querySelector(".dt-grid-overlay"),bn="dt-grid",Le=t=>{Zt.hidden=!t,fn.setAttribute("aria-pressed",String(t)),J(bn,t?"1":"0"),P({grid:t})};fn.addEventListener("click",()=>Le(Zt.hidden===!0));const yn=document.querySelector(".dt-pages-name"),vn=()=>{let t=null;for(const s of document.querySelectorAll(".dt-pages a"))Se(new URL(s.href).pathname)===_?(s.setAttribute("aria-current","page"),t=s):s.removeAttribute("aria-current");const e=document.title.split("\u2014").pop()?.trim(),n=t?.querySelector(".dt-menu-label")?.textContent?.trim();yn.textContent=n||e||yn.textContent};vn();const $n=[...document.querySelectorAll(".devtools details")];let Te=!1;const Bt=()=>{const t=$n.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]=Bt();e&&(e.querySelector("summary")?.focus(),t.preventDefault(),t.stopImmediatePropagation())},!0),document.addEventListener("pointerdown",t=>{Te=$n.some(e=>e.open&&!e.contains(t.target))&&Bt().length>0},!0),addEventListener("blur",Bt);const Et=document.querySelector(".dt-pad-overlay"),wn="dt-inspect",Fs=[".devtools",".dt-pad-overlay",".dt-grid-overlay",".dt-frame",".dt-history",".dt-review",".dt-field-menu",...p.ignore].join(", "),Me=[".devtools",".dt-notes-overlay",".dt-history",".dt-frame",".dt-review",".dt-field-menu",'[aria-modal="true"]',...p.ignore].join(", "),xe={pads:document.querySelector(".dt-pad-btn"),sizes:document.querySelector(".dt-size-btn"),type:document.querySelector(".dt-type-btn"),color:document.querySelector(".dt-color-btn"),border:document.querySelector(".dt-border-btn")};let at="",ke=0;const{spacer:Ks,drawPads:Ws,drawSize:_s,drawType:Us,drawColor:zs,drawBorder:Vs}=ba(Et),En=t=>{ke||(ke=requestAnimationFrame(()=>{ke=0,Et.hidden=!0;let e=document.elementFromPoint(t.clientX,t.clientY);if(Et.hidden=!1,!e||e.closest(Fs)){Et.innerHTML="";return}t.altKey&&e.parentElement&&e.parentElement!==document.body&&(e=e.parentElement),at==="sizes"?_s(e):at==="type"?Us(e):at==="color"?zs(e):at==="border"?Vs(e):Ws(t.altKey?e:Ks(e))}))},Qt=t=>{at=t;for(const[e,n]of Object.entries(xe))n.setAttribute("aria-pressed",String(e===t));J(wn,t),P({inspect:t}),Et.hidden=!t,Et.innerHTML="",t?document.addEventListener("mousemove",En):document.removeEventListener("mousemove",En)};for(const[t,e]of Object.entries(xe))e.addEventListener("click",()=>{t!==at&&mt(!1),Qt(at===t?"":t)});const Sn=document.querySelector(".dt-notes-btn"),He=[...document.querySelectorAll(".dt-bp")],te=document.querySelector(".dt-history-btn"),W=document.querySelector(".dt-history"),Ae=document.querySelector(".dt-studio-btn"),T=document.querySelector(".dt-device"),Ln=document.querySelector(".dt-shell"),qt=document.querySelector('.dt-chrome[data-at="top"]'),ee=document.querySelector('.dt-chrome[data-at="bottom"]'),Rt=document.querySelector(".dt-ruler"),G=document.querySelector(".dt-devices"),ht=document.querySelector(".dt-notes-hi"),Ys=ht.querySelector(".dt-hi-box"),Tn=ht.querySelector(".dt-hi-tag"),Js=[...document.querySelectorAll(".dt-frame-handle")],Mn=document.querySelector(".dt-frame-size"),Ne=document.querySelector(".dt-frame-rotate"),It=document.querySelector(".dt-frame-bars"),B=document.querySelector(".dt-frame"),M=B.querySelector("iframe"),Ce=document.querySelector(".dt-notes-count"),f=document.querySelector(".dt-notes-overlay"),xn=".devtools, .dt-tab, .dt-notes-overlay, .dt-history, .dt-frame, .dt-review";for(const t of document.querySelectorAll(xn))for(const e of["pointerdown","mousedown","pointerup","mouseup","touchstart","touchend","click","focusin","focusout"])t.addEventListener(e,n=>n.stopPropagation());const kn="dt-notes";let b=[],A=!1,v=null,c=null,Be=0,U="",z=[],x=null,I=[];const ne=(t=c)=>!!(t&&(t.text?.trim()||t.images?.length)),V=()=>{c&&ne()&&I.push(c),c=null};let Dt=null,it=null;const Hn=()=>`dt-draft:${_}${w?":canvas":""}`;let St=Hn(),se=0;const qe=()=>{if(!c&&!I.length&&!U){localStorage.removeItem(St);return}const t={draft:c,parked:I,reply:U?{for:Dt,text:U}:null};try{localStorage.setItem(St,JSON.stringify(t))}catch{const e=n=>({...n,images:void 0});try{localStorage.setItem(St,JSON.stringify({...t,draft:c&&e(c),parked:I.map(e)}))}catch{}}},ft=()=>{clearTimeout(se),se=setTimeout(qe,200)};addEventListener("pagehide",()=>{clearTimeout(se),qe()});let X=localStorage.getItem("dt-resolved")!=="0";const Gs=[[/Edg\/(\d+)/,"Edge"],[/OPR\/(\d+)/,"Opera"],[/Firefox\/(\d+)/,"Firefox"],[/Chrome\/(\d+)/,"Chrome"],[/Version\/(\d+).*Safari/,"Safari"]],Xs=[[/iPhone|iPad/,"iOS"],[/Android/,"Android"],[/Mac OS X/,"macOS"],[/Windows/,"Windows"],[/Linux/,"Linux"]],Zs=()=>{const t=navigator.userAgent,e=a=>a.find(([l])=>l.test(t)),n=e(Gs),s=e(Xs),o=n?n[0].exec(t)?.[1]:null;return[n?`${n[1]}${o?" "+o:""}`:"unknown browser",s?.[1]].filter(Boolean).join(" \xB7 ")},dt=()=>Ct(innerWidth),oe=()=>it??dt(),Ot=()=>{const t=oe();for(const e of He)e.setAttribute("aria-pressed",String(e.dataset.bp===t))},{cssPath:Qs,poolOf:to,contextOf:eo,resolveEl:Y,anchorOf:Z}=ya(),An=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 ae=[];const Re=t=>{for(const e of ae)e.play();ae=[];for(let e=t;e&&e!==document.body;e=e.parentElement)for(const n of e.getAnimations())n.playState==="running"&&(n.pause(),ae.push(n))},Nn=()=>{if(c)return Y(c);const t=v!=null?b.find(n=>n.id===v):null;if(!t)return null;const e=Z(t);return e&&!e.off?Y(t):null},Cn=t=>t?new Date(t).toLocaleString(void 0,{day:"numeric",month:"short",hour:"2-digit",minute:"2-digit"}):"",Pt='<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>',jt='<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>',Ie='<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>',ie='<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>',no='<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>',so='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><path d="M8 5l5 5-5 5" stroke-linejoin="round"/></svg>',oo='<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>',Lt=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>`,Ft=()=>p.me?`agent:${p.me.email}`:"claude",ao=()=>(p.team??[]).filter(t=>t.email!==p.me?.email),De=()=>[...p.me?(p.team??[]).filter(t=>t.email===p.me.email):[],...ao()],Bn=(t,e,n=!1)=>{const s=K(t)?"agent":t?"person":"";return`<span class="dt-hand" role="radiogroup" aria-label="Who takes it">${[...De().length||s==="person"?[["person",_n,"A person"]]:[],["agent",Lt(12),n?"Waits for the studio to approve it":"An agent \u2014 approves it for AI"]].map(([a,l,u])=>a===s?`<span class="dt-hand-stop dt-hand-stop--${a} is-on" role="radio" aria-checked="true" title="${u}">${lo(t,e,a)}</span>`:`<button type="button" class="dt-hand-stop dt-hand-stop--${a}" role="radio" aria-checked="false" data-act="hand" data-v="${a}"${e?` data-id="${e}"`:""} title="${u}"${a==="agent"&&n?" disabled":""}>${l}</button>`).join("")}</span>`},io=(t,e)=>{const n=re(),s=e==="agent"?K(n)?n:Ft():e==="person"?n&&!K(n)&&De().some(l=>l.email===n)?n:De()[0]?.email??"":"";if(!t){if(!c)return;c.assignee=s,c.stage=K(s)?"approved":c.stage==="review"?"review":"new";try{localStorage.setItem("nm-for",s)}catch{}ft(),h();return}const o=b.find(l=>l.id===t),a=K(s)?"approved":o&&we(o)==="review"?"review":"new";rt(l=>l.map(u=>u.id===t?{...u,assignee:s||void 0,stage:a}:u),()=>C("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:t,assignee:s||null,stage:a})}),K(s)?"Approving it for the agent":"Reassigning")},re=()=>{try{return localStorage.getItem("nm-for")??Ft()}catch{return Ft()}},Kt=t=>K(t)?"#d97757":t?"#0d99ff":"#717171",Oe=t=>t===p.me?.email?"you":p.team?.find(e=>e.email===t)?.name||t.split("@")[0],le=t=>t?p.team?.find(e=>e.email===t):void 0,qn=t=>g((wt(t??"")[0]??"?").toUpperCase()),Rn=(t,e,n="dt-face")=>t?`<img class="${n}" src="${g(t)}" alt="">`:`<b class="${n}" aria-hidden="true">${qn(e)}</b>`,ro=t=>{const e=le(t.by);return e||t.byName?Rn(e?.avatar_url,e?.name||t.byName||t.by):""},In=t=>{const e=le(t);return e?` data-face="${g(e.avatar_url??"")}" data-initial="${qn(e.name||e.email)}"`:""},ct=(t,e)=>ra(t,e,Oe),Dn=t=>{const e=le(t)?.avatar_url;return e?`;--face:url("${g(e)}")`:""},On=t=>le(t)?.avatar_url?" data-face":"",lo=(t,e,n)=>{const s=(r,m,E=!1)=>`<option value="${g(r)}" data-c="${Kt(r)}"${In(Nt(r)??(K(r)?null:r))}${Nt(r)?" data-agent":""}${E?" data-sep":""}${t===r?" selected":""}>${g(m)}</option>`,o=(p.team??[]).filter(r=>r.email!==p.me?.email),a=n!=="person",l=n!=="agent",u=o.filter(r=>!p.studio||p.studio.includes(r.email)),i=Nt(t)&&t!==Ft()&&!u.some(r=>`agent:${r.email}`===t)?s(t,`${Oe(Nt(t))}'s agent`):"";return`<label class="dt-field" title="Who it is for"><span class="dt-field-box"${On(Nt(t)??(K(t)?null:t))} style="--cat:${Kt(t)}${Dn(Nt(t)??(K(t)?null:t))}"><select class="dt-for-select"${e?` data-id="${e}"`:""} aria-label="Who this is for">
|
|
2
|
+
${a&&p.me?s(Ft(),"My agent"):""}
|
|
4
3
|
${a?u.map(r=>s(`agent:${r.email}`,`${(r.name||r.email).split(" ")[0]}'s agent`)).join("")+i:""}
|
|
4
|
+
${a?s("claude",p.me?"Any agent \u2014 the shared queue":"AI agent",!!p.me):""}
|
|
5
5
|
${n?"":s("","Nobody")}
|
|
6
|
-
${
|
|
7
|
-
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
${
|
|
11
|
-
|
|
12
|
-
|
|
6
|
+
${l&&p.me?s(p.me.email,`${p.me.name||p.me.email} (you)`):""}
|
|
7
|
+
${l?o.map(r=>s(r.email,r.name||r.email)).join(""):""}${l&&t&&!K(t)&&t!==p.me?.email&&!o.some(r=>r.email===t)?s(t,Oe(t)):""}
|
|
8
|
+
</select></span></label>`},Pn=t=>{const e=wt(t?.textContent).replace(/\s+/g," ");return e&&e.length<=2e3?e:""},co=t=>`<div class="dt-suggest dt-suggest--read"><del>${g(t.from)}</del><ins>${g(t.to)}</ins></div>`,jn=t=>wt(t)?`<span class="dt-note-info" data-tip="${g(wt(t))}"
|
|
9
|
+
><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>`:"",Fn=(t,e)=>`<label class="dt-field" title="Type"><span class="dt-field-box" style="--cat:${$e(t).color}"><select class="dt-cat-select"${e?` data-id="${e}"`:""} aria-label="Type">${hn.map(n=>`<option value="${n.id}" data-c="${n.color}"${n.id===t?" selected":""}>${n.label}</option>`).join("")}</select></span></label>`,Kn=[["open","Open","#0d99ff"],["progress","In progress","#f5a623"],["review","Needs review","#8e4ec6"],["done","Resolved","#30a46c"]],uo=t=>t.status==="done"?"done":Os(t)||we(t)==="progress"?"progress":we(t)==="review"?"review":"open",mo=t=>{const e=uo(t);return`<label class="dt-field" title="Status"><span class="dt-field-box" style="--cat:${Kn.find(n=>n[0]===e)[2]}"><select class="dt-status-select" data-id="${t.id}" aria-label="Status">${Kn.map(([n,s,o])=>`<option value="${n}" data-c="${o}"${n===e?" selected":""}>${s}</option>`).join("")}</select></span></label>`},po=(t,e)=>{const n=b.find(a=>a.id===t);if(!n)return;if(e==="done"){Tt(t,!0);return}const s=e==="open"?K(n.assignee)?"approved":"new":e,o=n.status==="done"?{status:"open",doneBy:null}:{};rt(a=>a.map(l=>l.id===t?{...l,...o,stage:s}:l),()=>C("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:t,...o,stage:s})}),"Setting the status")},de=[["low","Low","#30a46c",1],["normal","Mid","#f5c451",2],["high","High","#ff5a00",3],["urgent","Urgent","#e5484d",4]],Wn=(t,e)=>{const n=Math.max(0,de.findIndex(u=>u[0]===t)),[,s,o,a]=de[n],l=de[(n+1)%de.length];return`<button type="button" class="dt-prio" style="--cat:${o}" data-act="prio" data-v="${l[0]}"${e?` data-id="${e}"`:""} title="Priority: ${s} \u2014 click for ${l[1]}" aria-label="Priority ${s}">${va(a,o)}<span>${s}</span></button>`},_n='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><circle cx="10" cy="6.8" r="3"/><path d="M4.2 16.5c.6-3 3-4.8 5.8-4.8s5.2 1.8 5.8 4.8" stroke-linejoin="round"/></svg>',go='<svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true"><circle cx="10" cy="6.8" r="3"/><path d="M4.2 16.5c.6-3 3-4.8 5.8-4.8s5.2 1.8 5.8 4.8" stroke-linejoin="round"/><path d="M3.5 3.5l13 13"/></svg>',Un=(t,e)=>`<button type="button" class="dt-share${t?" is-on":""}" data-act="share" data-v="${t?"":"1"}"${e?` data-id="${e}"`:""}
|
|
10
|
+
aria-pressed="${!!t}" title="${t?"Shared with the client \u2014 click to keep it to the team":"Team only \u2014 click to share it with the client"}">${t?_n:go}</button>`,ho=()=>(p.team??[]).filter(t=>!p.studio||p.studio.includes(t.email)),fo=t=>{const e=t||p.lead||"",n=ho();return n.length?`<label class="dt-field" title="Who it is for"><span class="dt-field-box"${On(e)} style="--cat:${Kt(e||"x@x")}${Dn(e)}"><select class="dt-for-select" aria-label="Who this is for">
|
|
11
|
+
${n.map(s=>`<option value="${g(s.email)}" data-c="${Kt(s.email)}"${In(s.email)}${e===s.email?" selected":""}>${g(s.name||s.email)}</option>`).join("")}
|
|
12
|
+
</select></span></label>`:""},zn='<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>',bo=!1,yo=!1,Vn='<svg viewBox="0 0 12 12" width="10" height="10" aria-hidden="true"><path d="M3 1.8v8.4L10 6z"/></svg>',vo='<svg viewBox="0 0 12 12" width="10" height="10" aria-hidden="true"><path d="M2.5 1.5h2.5v9H2.5zM7 1.5h2.5v9H7z"/></svg>',$o=t=>`${Math.floor(t/60)}:${String(Math.floor(t%60)).padStart(2,"0")}`,wo=(t,e)=>{const n=t.closest(".dt-voice"),s=n.querySelector("audio"),o=n.querySelector(".dt-voice-play");if(!s.dataset.wired){s.dataset.wired="1";const u=n.querySelector(".dt-voice-track i"),i=n.querySelector(".dt-voice-time"),r=()=>Number.isFinite(s.duration)?s.duration:0;s.addEventListener("timeupdate",()=>{u.style.width=`${r()?Math.min(100,s.currentTime/r()*100):0}%`,i.textContent=$o(s.currentTime)}),s.addEventListener("play",()=>{o.innerHTML=vo,o.setAttribute("aria-label","Pause"),n.classList.add("is-playing")}),s.addEventListener("pause",()=>{o.innerHTML=Vn,o.setAttribute("aria-label","Play the voice note"),n.classList.remove("is-playing")}),s.addEventListener("ended",()=>{s.currentTime=0})}const a=()=>{if(e){const u=n.querySelector(".dt-voice-track").getBoundingClientRect();Number.isFinite(s.duration)&&(s.currentTime=Math.max(0,Math.min(1,(e.clientX-u.left)/u.width))*s.duration);return}if(!s.paused){s.pause();return}f.querySelectorAll(".dt-voice audio").forEach(u=>{u!==s&&u.pause()}),s.play().catch(()=>{})};if(Number.isFinite(s.duration)||s.readyState<1){s.readyState<1?s.addEventListener("loadedmetadata",()=>Number.isFinite(s.duration)?a():l(),{once:!0}):a();return}l();function l(){s.addEventListener("timeupdate",()=>{s.currentTime=0,a()},{once:!0}),s.currentTime=1e9}},Pe=t=>t.startsWith("data:audio/")||/(^|\/)voice-[^/?]*\.(webm|m4a)(\?|$)/i.test(t),Yn=t=>t.startsWith("data:video/")||/\.webm(\?|$)/i.test(t),Jn=new Map,Eo=t=>{if(!t.startsWith("data:"))return t;let e=Jn.get(t);if(!e){const[n,s]=t.split(",",2);e=URL.createObjectURL(new Blob([Uint8Array.from(atob(s),o=>o.charCodeAt(0))],{type:n.slice(5).split(";")[0]})),Jn.set(t,e)}return e},So=(t,e)=>`<span class="dt-voice"><button type="button" class="dt-voice-play" data-act="voice" aria-label="Play the voice note">${Vn}</button><button type="button" class="dt-voice-track" data-act="voice-seek" aria-label="Jump"><i></i></button><span class="dt-voice-time">0:00</span><audio src="${Eo(t)}" preload="metadata"></audio>${e===void 0?"":`<button class="dt-voice-rm" data-act="voice-write" ${e} aria-label="Write it out" title="Write it out \u2014 its words go in the box">${Bo}</button>`}${e===void 0?"":`<button class="dt-voice-rm" data-act="unshot" ${e} aria-label="Remove the recording" title="Remove the recording">${zn}</button>`}</span>`,Gn=(t,e,n=t)=>Pe(n)?So(t,e):`<span class="dt-shot${Yn(n)?" dt-shot--video":""}">${Yn(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">${zn}</button>`}</span>`,Xn=(t=[],e)=>t.length?`<div class="dt-note-shots">${t.map(n=>{const s=n.split("/").pop(),o=pa(s);return Gn(o,e===void 0?void 0:`data-id="${e}" data-img="${g(s)}"`,s)}).join("")}</div>`:"",Zn=(t=[])=>t.length?`<div class="dt-note-shots">${t.map((e,n)=>Gn(e,`data-i="${n}"`)).join("")}</div>`:"",Lo='<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>',To='<svg viewBox="0 0 20 20" width="15" height="15" aria-hidden="true"><path d="M3.5 5.5h8M7.5 5.5v10M11 15.5l5-5 1.5 1.5-5 5H11z" stroke-linejoin="round"/></svg>',Mo=!!navigator.mediaDevices?.getDisplayMedia&&typeof MediaRecorder<"u";let bt=null;const xo=async t=>{if(bt){bt.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),s=new MediaStream([...e.getVideoTracks(),...n?.getAudioTracks()??[]]),o=["video/webm;codecs=vp9,opus","video/webm;codecs=vp8,opus","video/webm"].find(r=>MediaRecorder.isTypeSupported(r));if(!o){for(const r of e.getTracks())r.stop();O("This browser cannot record WebM video.");return}const a=new MediaRecorder(s,{mimeType:o,videoBitsPerSecond:6e5,audioBitsPerSecond:32e3}),l=[],u=!!Number(t?.dataset.id);a.ondataavailable=r=>{r.data.size&&l.push(r.data)};const i=setTimeout(()=>{a.state!=="inactive"&&a.stop()},3e4);a.onstop=async()=>{clearTimeout(i);for(const E of[...e.getTracks(),...n?.getTracks()??[]])E.stop();bt=null;const r=new Blob(l,{type:"video/webm"});if(r.size>32e5){O("That recording is too big to send \u2014 keep it shorter."),h();return}const m=await new Promise(E=>{const d=new FileReader;d.onload=()=>E(String(d.result)),d.readAsDataURL(r)});u?z.push(m):c&&(c.images??=[]).push(m),h()},e.getVideoTracks()[0]?.addEventListener("ended",()=>{a.state!=="inactive"&&a.stop()}),bt=a,a.start(1e3),h()},ko='<svg viewBox="0 0 20 20" width="15" height="15" aria-hidden="true"><rect x="7.5" y="3" width="5" height="9" rx="2.5"/><path d="M5 9.5a5 5 0 0 0 10 0M10 14.5V17"/></svg>',Ho='<svg viewBox="0 0 20 20" width="14" height="14" aria-hidden="true"><path d="m5 10.5 3.2 3L15 6.5"/></svg>',Ao=90,je=32,No=()=>!!p.voice&&!!navigator.mediaDevices?.getUserMedia&&typeof MediaRecorder<"u";let ce=!1;const Co=async(t,e)=>{if(ce||!t)return;const n=Number(t.dataset.id)||0;ce=!0,e.classList.add("is-asking"),e.title="Waiting for the microphone \u2014 allow it in the browser";let s;try{s=await navigator.mediaDevices.getUserMedia({audio:!0})}catch(y){ce=!1,e.classList.remove("is-asking");const F=y?.name;O(F==="NotAllowedError"?"The microphone is blocked for this site \u2014 allow it from the icon left of the address, then try again.":F==="NotFoundError"?"No microphone found \u2014 plug one in or pick it in the system settings.":F==="NotReadableError"?"The microphone is busy in another app \u2014 close it there and try again.":`The microphone did not start: ${y?.message||F||"unknown error"}`);return}e.classList.remove("is-asking");const o=()=>f.querySelector(n?`.dt-note[data-id="${n}"] .dt-compose`:".dt-note[data-draft] .dt-compose"),a=document.createElement("div");a.className="dt-rec",a.innerHTML=`<button type="button" class="dt-rec-x" title="Discard (Esc)" aria-label="Discard">${Pt}</button><span class="dt-rec-time"><i></i><b>0:00</b></span><span class="dt-rec-wave">${"<i></i>".repeat(je)}</span><button type="button" class="dt-rec-done" title="Done \u2014 write it out" aria-label="Done">${Ho}</button>`;const l=a.querySelector("b"),u=[...a.querySelectorAll(".dt-rec-wave i")],i=new AudioContext,r=i.createAnalyser();r.fftSize=512,i.createMediaStreamSource(s).connect(r);const m=new Uint8Array(r.fftSize),E=[],d=new MediaRecorder(s,{audioBitsPerSecond:32e3}),$=[],H=Date.now();let k=!0;const et=setInterval(()=>{const y=o();y&&a.parentElement!==y&&y.appendChild(a),r.getByteTimeDomainData(m);let F=0;for(const gt of m)F+=((gt-128)/128)**2;E.push(Math.min(1,Math.sqrt(F/m.length)*4));const nt=E.slice(-je);u.forEach((gt,mn)=>{const pn=nt[mn-(je-nt.length)];gt.style.transform=`scaleY(${Math.max(.1,pn??0).toFixed(2)})`,gt.classList.toggle("is-empty",pn===void 0)});const st=Math.floor((Date.now()-H)/1e3);l.textContent=`${Math.floor(st/60)}:${String(st%60).padStart(2,"0")}`,st>=Ao&&d.state!=="inactive"&&d.stop()},90),S=y=>{k=y,d.state!=="inactive"&&d.stop()};a.querySelector(".dt-rec-x").addEventListener("click",y=>{y.stopPropagation(),S(!1)}),a.querySelector(".dt-rec-done").addEventListener("click",y=>{y.stopPropagation(),S(!0)}),a.addEventListener("keydown",y=>{y.key==="Escape"&&(y.stopPropagation(),S(!1))}),d.ondataavailable=y=>{y.data.size&&$.push(y.data)},d.onstop=async()=>{if(clearInterval(et),s.getTracks().forEach(nt=>nt.stop()),i.close().catch(()=>{}),a.remove(),ce=!1,!k)return;const y=new Blob($,{type:d.mimeType||"audio/webm"}),F=await new Promise(nt=>{const st=new FileReader;st.onload=()=>nt(String(st.result)),st.readAsDataURL(y)});n?z.push(F):c&&(c.images??=[]).push(F),h(),o()?.querySelector("textarea")?.focus()},d.start(1e3),o()?.appendChild(a),a.querySelector(".dt-rec-done").focus()},Qn="\u{1F3A4} Voice note",Bo='<svg viewBox="0 0 20 20" width="12" height="12" aria-hidden="true"><rect x="2.5" y="4.5" width="15" height="11" rx="2"/><path d="M6 11.5h3M11 11.5h3M6 8.5h8"/></svg>',qo=async t=>{const e=t.closest(".dt-note"),s=(e?.hasAttribute("data-draft")?c?.images??[]:z)[Number(t.dataset.i)];if(!s||t.classList.contains("is-asking"))return;t.classList.add("is-asking");const o=await C("transcribe",{method:"POST",headers:{"content-type":"application/json"},body:JSON.stringify({audio:s})}).catch(()=>null),a=o?await o.json().catch(()=>({})):{};if(t.classList.remove("is-asking"),!o?.ok||!a.text){O(a.error||(o?.ok?"Didn't hear any words in it.":"Could not make out the words \u2014 try again, or type it."));return}const l=e?.querySelector("textarea.dt-note-input, textarea.dt-note-reply-input");l&&(l.value=l.value.trim()?`${l.value.trimEnd()} ${a.text}`:a.text,l.dispatchEvent(new Event("input",{bubbles:!0})),l.focus())},Ro='<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>',ts=(t,e,n,s,o="",a="")=>`<div class="dt-note-foot"><div class="dt-compose">
|
|
13
|
+
<textarea class="${t}" rows="1" placeholder="${e}">${g(n)}</textarea>
|
|
13
14
|
${o}
|
|
14
15
|
<div class="dt-compose-bar">
|
|
15
|
-
<span class="dt-compose-tools"><button class="dt-attach" data-act="attach" title="Attach a screenshot \u2014 or paste or drop one">${
|
|
16
|
-
${a}${
|
|
16
|
+
<span class="dt-compose-tools"><button class="dt-attach" data-act="attach" title="Attach a screenshot \u2014 or paste or drop one">${Ro}</button>
|
|
17
|
+
${a}${yo&&Mo?`<button class="dt-record${bt?" is-on":""}" data-act="record" title="${bt?"Stop recording":"Record the screen, up to 30 seconds"}">${bt?"Stop":Lo}</button>`:""}${No()?`<button class="dt-attach" data-act="speak" title="Speak \u2014 sent with its words as a voice note">${ko}</button>`:""}</span>
|
|
17
18
|
<button class="dt-send${n.trim()?" is-ready":""}" ${s} title="Send (Enter)"
|
|
18
19
|
><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>
|
|
19
20
|
</div>
|
|
20
|
-
</div></div>`,
|
|
21
|
-
title="Resolved by ${
|
|
22
|
-
class="dt-note-resolve${n?" is-on":""}" title="${n?"Reopen":t==="claude"?"Looks right \u2014 mark it resolved":"Resolve"}">${
|
|
21
|
+
</div></div>`,Fe=(t,e)=>(t||"element")+(e?.[0]?"."+e[0]:""),es=()=>I.map((t,e)=>({i:e,el:Fe(t.tag,t.classes),text:wt(t.text??""),shots:t.images?.length??0,orphan:!Z(t)}));let Ke=[],ns="";const Io=(t,e)=>t!=="claude"?"":`<button class="dt-note-state" data-act="reopen" data-id="${e}"
|
|
22
|
+
title="Resolved by ${g((n=>ct(n?.doneAgent,n?.doneFor))(b.find(n=>n.id===e)))} \u2014 click to clear">${Lt(13)}</button>`,ss=(t,e)=>{const n=t==="done";return`${Io(t,e)}<button data-act="${n?"reopen":"done"}" data-id="${e}"
|
|
23
|
+
class="dt-note-resolve${n?" is-on":""}" title="${n?"Reopen":t==="claude"?"Looks right \u2014 mark it resolved":"Resolve"}">${jt}</button>`},Do=async(t,e)=>{const n=e?b.find(o=>o.id===t):void 0,s=n?await Ze(Y(n)):null;return C("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify(e?{id:t,status:"done",doneBy:"you",...s?{after:s}:{}}:{id:t,status:"open",doneBy:null})})},rt=async(t,e,n)=>{const s=b,o=Q;b=t(b),Q=t(Q),h();const a=await e().catch(()=>null);if(!a?.ok){b=s,Q=o,h(),O(`${n} did not go through${a?` (${a.status})`:""}.`);return}he()},Tt=(t,e)=>rt(n=>n.map(s=>s.id===t?{...s,status:e?"done":"open",doneBy:e?"you":null}:s),()=>Do(t,e),e?"Resolving":"Reopening"),os=t=>rt(e=>e.filter(n=>n.id!==t),()=>C(`comments?id=${t}`,{method:"DELETE"}),"Deleting"),g=t=>t.replace(/[&<>"]/g,e=>({"&":"&","<":"<",">":">",'"':"""})[e]),Oo=t=>{const e=b.filter(o=>ot(o)===t),n=e.filter(o=>q(o)==="open").length,s=e.filter(o=>q(o)==="claude").length;Ce.innerHTML=n?String(n):s?Lt(9):"\u2713",Ce.dataset.state=n?"open":s?"claude":"done",Ce.hidden=e.length===0},h=()=>{if(ft(),w){const i=es(),r=JSON.stringify(i);r!==ns&&(ns=r,parent.postMessage({dt:!0,drafts:i},location.origin))}Ot(),v!==Dt&&(U="",z=[],Dt=v),x&&x.id!==v&&(x=null);const t=oe();if(Oo(t),!A){f.innerHTML="",Re(null);return}const e=t;let n="";const s=b.filter(i=>ot(i)===e&&(X||q(i)!=="done"));for(const i of s){const r=Z(i);if(!r&&v!==i.id)continue;const m=q(i),E=m==="done",d=!r,$=r??{x:0,y:0},H=$e(i.category),k=Os(i);if(d||(n+=`<button class="dt-pin dt-pin--${m}${k?" dt-pin--working":""}${m==="open"&&we(i)==="review"?" dt-pin--review":""}" data-id="${i.id}"${r?.off?` data-off="${r.off}"`:""} aria-label="Comment ${i.id}, ${m==="open"?"open":m==="claude"?`resolved by ${g(ct(i.doneAgent,i.doneFor))}`:"resolved"}" aria-expanded="${v===i.id}"
|
|
23
24
|
style="left:${$.x}px;top:${$.y}px;--cat:${H.color}"
|
|
24
|
-
title="${
|
|
25
|
+
title="${g(i.text.slice(0,80))} \xB7 ${H.label}${k?` \xB7 ${g(ct(k.agent,k.by))} is on it`:""}${m==="claude"?` \xB7 resolved by ${g(ct(i.doneAgent,i.doneFor))} \u2014 tick to confirm`:m==="done"?" \xB7 resolved":""}">${m==="done"?"\u2713":m==="claude"?Lt(11):ro(i)}</button>`),v===i.id){const et=ca(i);n+=`<div class="dt-note${d?" dt-note--orphan":""}" data-id="${i.id}" role="dialog" aria-label="Comment ${i.id}"
|
|
25
26
|
style="left:${$.x}px;top:${$.y}px">
|
|
26
27
|
<div class="dt-note-bar">
|
|
27
|
-
<span class="dt-note-el">${
|
|
28
|
-
${
|
|
28
|
+
<span class="dt-note-el">${p.client?`Comment #${jo(i)}`:g(Fe(i.tag,i.classes))}</span>
|
|
29
|
+
${jn(i.label)}
|
|
29
30
|
<span class="dt-note-tools">
|
|
30
|
-
${
|
|
31
|
+
${ss(m,i.id)}
|
|
31
32
|
<i class="dt-note-sep"></i>
|
|
32
|
-
${
|
|
33
|
-
<button data-act="rm" data-id="${i.id}" title="Delete this thread">${
|
|
33
|
+
${p.client?"":Un(i.shared,i.id)}
|
|
34
|
+
<button data-act="rm" data-id="${i.id}" title="Delete this thread">${Pt}</button>
|
|
34
35
|
<button data-act="close" data-id="${i.id}" title="Close">${ie}</button>
|
|
35
36
|
</span>
|
|
36
37
|
</div>
|
|
37
|
-
${k?`<p class="dt-note-working"><i></i>${
|
|
38
|
-
${
|
|
39
|
-
${(()=>{const
|
|
38
|
+
${k?`<p class="dt-note-working"><i></i>${g(ct(k.agent,k.by))} is on it</p>`:""}
|
|
39
|
+
${d?'<p class="dt-note-orphan">The element this was pinned to is not on the page right now.</p>':""}
|
|
40
|
+
${(()=>{const S=Fn($e(i.category).id,i.id)+(p.client?"":mo(i))+(i.host&&i.host!==location.host?`<span class="dt-note-host" title="Written on ${g(i.host)}">${g(i.host)}</span>`:"");return S?`<div class="dt-note-meta">${S}</div>`:""})()}
|
|
40
41
|
<div class="dt-note-thread">
|
|
41
|
-
${et.map((
|
|
42
|
-
<textarea class="dt-note-edit-input" rows="1">${
|
|
43
|
-
${
|
|
42
|
+
${et.map((S,y)=>{const F=y===0?null:S.at??null,nt=S.author==="you"&&(!S.by||S.by===p.me?.email),st=nt&&x?.id===i.id&&x.at===F,gt=p.team?.find(gn=>gn.email===S.by),mn=S.author==="claude"?ct(S.agent,S.by):nt?"You":gt?.name||S.byName||S.by||"You",Is=`<div class="dt-msg-head">${gt?.avatar_url?`<img class="dt-msg-face" src="${g(gt.avatar_url)}" alt="">`:""}<b>${g(mn)}</b><time>${Cn(S.at)}</time>${nt&&!st?`<button class="dt-msg-edit" data-act="edit" data-id="${i.id}" data-at="${g(F??"")}" title="Edit">${Ie}</button>`:""}</div>`;return st?`<div class="dt-msg">${Is}<div class="dt-compose">
|
|
43
|
+
<textarea class="dt-note-edit-input" rows="1">${g(x.text)}</textarea>
|
|
44
|
+
${Xn(S.images.filter(gn=>!x.drop.includes(gn.split("/").pop())),i.id)}
|
|
44
45
|
<div class="dt-compose-bar">
|
|
45
46
|
<button class="dt-edit-cancel" data-act="edit-cancel">Cancel</button>
|
|
46
|
-
<button class="dt-send${x.text.trim()?" is-ready":""}" data-act="edit-save" title="Save (Enter)">${
|
|
47
|
+
<button class="dt-send${x.text.trim()?" is-ready":""}" data-act="edit-save" title="Save (Enter)">${jt}</button>
|
|
47
48
|
</div>
|
|
48
|
-
</div></div>`:`<div class="dt-msg" data-msg="${i.id}:${
|
|
49
|
+
</div></div>`:`<div class="dt-msg" data-msg="${i.id}:${g(S.at??"0")}">${Is}<p>${g(S.text)}</p>${y===0&&i.suggest?co(i.suggest):""}${Xn(S.images)}</div>`}).join("")}
|
|
49
50
|
</div>
|
|
50
|
-
${
|
|
51
|
-
${
|
|
52
|
-
</div>`}}I.forEach((i,r)=>{const
|
|
53
|
-
style="left:${
|
|
51
|
+
${ts("dt-note-reply-input","Reply",U,`data-act="reply" data-id="${i.id}"`,Zn(z))}
|
|
52
|
+
${p.client?"":`<div class="dt-prio-row">${Wn(i.priority,i.id)}${Bn(i.assignee??"",i.id,da(i))}</div>`}
|
|
53
|
+
</div>`}}I.forEach((i,r)=>{const m=Z(i);m&&(n+=`<button class="dt-pin dt-pin--draft" data-parked="${r}" data-act="draft-open" data-i="${r}"
|
|
54
|
+
style="left:${m.x}px;top:${m.y}px" title="Draft, not sent \u2014 click to finish it">${Ie}</button>`)});const o=c&&Z(c);if(c){const i=o?.x??0,r=o?.y??0;n+=`${o?`<span class="dt-pin dt-pin--draft" data-draft style="left:${i}px;top:${r}px"></span>`:""}
|
|
54
55
|
<div class="dt-note${o?"":" dt-note--orphan"}" data-draft style="left:${i}px;top:${r}px">
|
|
55
56
|
<div class="dt-note-bar">
|
|
56
|
-
<span class="dt-note-el">${
|
|
57
|
-
${
|
|
57
|
+
<span class="dt-note-el">${p.client?"New comment":g(Fe(c.tag,c.classes))}</span>
|
|
58
|
+
${jn(c.label)}
|
|
58
59
|
${ne()?'<span class="dt-note-draft">Draft</span>':""}
|
|
59
60
|
<span class="dt-note-tools">
|
|
60
|
-
${
|
|
61
|
-
<button data-act="discard" title="Discard this draft">${
|
|
61
|
+
${p.client?"":Un(c.shared)}
|
|
62
|
+
<button data-act="discard" title="Discard this draft">${Pt}</button>
|
|
62
63
|
<button data-act="cancel" title="Close \u2014 the draft stays">${ie}</button>
|
|
63
64
|
</span>
|
|
64
65
|
</div>
|
|
65
66
|
${o?"":'<p class="dt-note-orphan">The element this was pinned to is not on the page right now.</p>'}
|
|
66
|
-
${(()=>{const
|
|
67
|
-
<div class="dt-note-meta">${
|
|
67
|
+
${(()=>{const m=o?Y(c):null,E=m&&b.find(d=>d.id>0&&q(d)==="open"&&Y(d)===m);return E?`<p class="dt-note-twin">Already open here: \u201C${g(E.text.slice(0,60))}${E.text.length>60?"\u2026":""}\u201D <button data-act="twin" data-id="${E.id}">Open it</button></p>`:""})()}
|
|
68
|
+
<div class="dt-note-meta">${Fn(c.category)}${p.client?fo(c.assignee):""}</div>
|
|
68
69
|
${c.suggest?`<div class="dt-suggest"><span class="dt-suggest-head">New wording for this text<button data-act="unsuggest" title="Keep the text as it is">${ie}</button></span>
|
|
69
|
-
<span class="dt-suggest-was">Now: <del>${
|
|
70
|
-
<textarea class="dt-suggest-input" rows="2" placeholder="Type how it should read" aria-label="How it should read">${
|
|
70
|
+
<span class="dt-suggest-was">Now: <del>${g(c.suggest.from.slice(0,160))}${c.suggest.from.length>160?"\u2026":""}</del></span>
|
|
71
|
+
<textarea class="dt-suggest-input" rows="2" placeholder="Type how it should read" aria-label="How it should read">${g(c.suggest.to)}</textarea>
|
|
71
72
|
<span class="dt-suggest-hint">Change the words in the box \u2014 the agent puts in exactly what you write.</span></div>`:""}
|
|
72
|
-
${
|
|
73
|
-
${
|
|
74
|
-
</div>`}const a=new Map([...f.querySelectorAll(".dt-note[data-id] .dt-note-thread")].map(i=>[i.closest(".dt-note").dataset.id,{top:i.scrollTop,end:i.scrollTop+i.clientHeight>=i.scrollHeight-4}])),
|
|
75
|
-
<button class="dt-hist-go" data-go="${
|
|
73
|
+
${ts("dt-note-input",c.suggest?"Why (optional)":"Comment",c.text??"",'data-act="save"',Zn(c.images),bo&&!c.suggest&&Pn(o?Y(c):null)?`<button class="dt-attach" data-act="suggest" title="Rewrite this text: start from its current words and change them">${To}</button>`:"")}
|
|
74
|
+
${p.client?"":`<div class="dt-prio-row">${Wn(c.priority)}${Bn(c.assignee??re())}</div>`}
|
|
75
|
+
</div>`}const a=new Map([...f.querySelectorAll(".dt-note[data-id] .dt-note-thread")].map(i=>[i.closest(".dt-note").dataset.id,{top:i.scrollTop,end:i.scrollTop+i.clientHeight>=i.scrollHeight-4}])),l=new Set([...f.querySelectorAll("[data-msg]")].map(i=>i.dataset.msg));f.innerHTML=n;for(const i of f.querySelectorAll(".dt-note[data-id] .dt-note-thread")){const r=i.closest(".dt-note").dataset.id,m=a.get(r);if(!m)continue;const E=[...i.querySelectorAll("[data-msg]")].filter(d=>!l.has(d.dataset.msg));for(const d of E)d.classList.add("dt-msg--new");i.scrollTop=m.end&&E.length?i.scrollHeight:m.top}for(const i of f.querySelectorAll(".dt-note")){const r=i.getBoundingClientRect();r.bottom>innerHeight-8&&(i.dataset.flip="1"),r.right>innerWidth-8&&(i.dataset.flipx="1")}as(e),Re(Nn()),ut();for(const i of f.querySelectorAll(".dt-note-input, .dt-note-reply-input, .dt-note-edit-input"))tn(i);const u=f.querySelector(".dt-note-input");u&&(u.focus(),u.setSelectionRange(u.value.length,u.value.length))},Po=()=>{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=b.find(o=>o.id===Number(e.dataset.id)),s=n&&Z(n);if(!s){e.style.visibility="hidden";continue}e.style.visibility="",e.style.left=`${s.x}px`,e.style.top=`${s.y}px`,e.classList.contains("dt-pin")&&(s.off?e.dataset.off=s.off:delete e.dataset.off),n&&An(Y(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?I[Number(e.dataset.parked)]:c,s=n&&Z(n);if(!s){e.style.visibility="hidden";continue}e.style.visibility="",e.style.left=`${s.x}px`,e.style.top=`${s.y}px`}if(!ae.length&&(c||v!=null)){const e=Nn();e&&An(e)&&Re(e)}t&&ut()},jo=t=>b.filter(e=>ot(e)===ot(t)).findIndex(e=>e.id===t.id)+1,as=t=>{if(W.hidden)return;const e=b.filter(d=>ot(d)===t),n=new Map(e.map((d,$)=>[d.id,$+1])),s={open:[],claude:[],done:[]};for(const d of e)s[q(d)].push(d);const o=d=>{const $=(d.replies?.length??0)+(d.note?1:0),H=$e(d.category),k=q(d),et=k==="claude",S=!Z(d),y=d.replies?.length?d.replies[d.replies.length-1]:d.note?{author:"claude",text:d.note}:{author:"you",text:d.text};return`<div class="dt-hist-row is-${k}${S?" is-orphan":""}">
|
|
76
|
+
<button class="dt-hist-go" data-go="${d.id}">
|
|
76
77
|
<span class="dt-hist-n" style="--cat:${H.color}">${et?Lt(8):""}</span>
|
|
77
78
|
<span class="dt-hist-body">
|
|
78
|
-
<span class="dt-hist-id">#${n.get(
|
|
79
|
-
<span class="dt-hist-text">${y.author==="claude"?`<b>${
|
|
80
|
-
<span class="dt-hist-meta">${
|
|
79
|
+
<span class="dt-hist-id">#${n.get(d.id)}<em>${H.label}</em>${et?`<b class="dt-hist-claude" data-unmark="${d.id}" role="button" tabindex="0" title="Resolved by ${g(ct(d.doneAgent,d.doneFor))} \u2014 click to clear: back to open">${Lt(9)}${g(Ds(d.doneAgent))}<i aria-hidden="true">\xD7</i></b>`:""}${S?'<b class="dt-hist-orphan" title="The element this was pinned to is not on the page right now">no pin</b>':""}</span>
|
|
80
|
+
<span class="dt-hist-text">${y.author==="claude"?`<b>${g(ct(y.agent,y.by))}:</b> `:""}${g(y.text)}</span>
|
|
81
|
+
<span class="dt-hist-meta">${Cn(d.updatedAt||d.createdAt)}${d.device?` \xB7 ${g(d.device)}`:d.browser?` \xB7 ${g(d.browser)}`:""}${$?` \xB7 ${$} repl${$===1?"y":"ies"}`:""}</span>
|
|
81
82
|
</span>
|
|
82
83
|
</button>
|
|
83
|
-
<span class="dt-note-tools dt-hist-tools">${
|
|
84
|
-
><button data-rm="${
|
|
85
|
-
</div>`},a=R.find(
|
|
86
|
-
title="${
|
|
87
|
-
><svg viewBox="0 0 20 20" width="11" height="11" aria-hidden="true">${
|
|
88
|
-
<button class="dt-hist-go" data-draft-go="${
|
|
89
|
-
<span class="dt-hist-n">${
|
|
84
|
+
<span class="dt-note-tools dt-hist-tools">${ss(k,d.id)}<i class="dt-note-sep"></i
|
|
85
|
+
><button data-rm="${d.id}" title="Delete this comment">${Pt}</button></span>
|
|
86
|
+
</div>`},a=R.find(d=>d.id===t),l=R.map(d=>{const $=b.filter(H=>ot(H)===d.id&&q(H)!=="done");return{band:d,open:$.filter(H=>q(H)==="open").length,total:$.length}}).filter(d=>d.total&&d.band.id!==t),u=l.length?`<i class="dt-hist-sep"></i><div class="dt-hist-bands">${l.map(({band:d,open:$,total:H})=>`<button data-bp="${d.id}" data-state="${$?"open":"claude"}"
|
|
87
|
+
title="${d.label}: ${$} open \xB7 ${H-$} to check"
|
|
88
|
+
><svg viewBox="0 0 20 20" width="11" height="11" aria-hidden="true">${d.icon}</svg><i>${H}</i></button>`).join("")}</div>`:"",r=["open","claude","done"].filter(d=>s[d].length&&(d!=="done"||X)),m=B.hidden?es():Ke,E=d=>`<div class="dt-hist-row is-draft">
|
|
89
|
+
<button class="dt-hist-go" data-draft-go="${d.i}">
|
|
90
|
+
<span class="dt-hist-n">${Ie}</span>
|
|
90
91
|
<span class="dt-hist-body">
|
|
91
|
-
<span class="dt-hist-id">${
|
|
92
|
-
<span class="dt-hist-text">${
|
|
92
|
+
<span class="dt-hist-id">${g(d.el)}${d.orphan?'<b class="dt-hist-orphan" title="The element this was pinned to is not on the page right now">no pin</b>':""}</span>
|
|
93
|
+
<span class="dt-hist-text">${d.text?g(d.text):`${d.shots} screenshot${d.shots===1?"":"s"}`}</span>
|
|
93
94
|
</span>
|
|
94
95
|
</button>
|
|
95
|
-
<span class="dt-note-tools dt-hist-tools"><button data-draft-rm="${
|
|
96
|
-
</div>`;
|
|
96
|
+
<span class="dt-note-tools dt-hist-tools"><button data-draft-rm="${d.i}" title="Discard this draft">${Pt}</button></span>
|
|
97
|
+
</div>`;W.innerHTML=`<div class="dt-hist-head">
|
|
97
98
|
<span class="dt-hist-here" title="${a?.label??t}"
|
|
98
99
|
><svg viewBox="0 0 20 20" width="13" height="13" aria-hidden="true">${a?.icon??""}</svg></span>
|
|
99
100
|
<span class="dt-hist-title">Comments</span>
|
|
100
101
|
${u}
|
|
101
|
-
${yt().length&&!w?`<button class="dt-review-btn" data-review aria-label="Check all ${yt().length} ${yt().length===1?"fix":"fixes"}" data-tip="${yt().length} ${yt().length===1?"fix waits":"fixes wait"} for a look across every page \u2014 walk through them">${
|
|
102
|
+
${yt().length&&!w?`<button class="dt-review-btn" data-review aria-label="Check all ${yt().length} ${yt().length===1?"fix":"fixes"}" data-tip="${yt().length} ${yt().length===1?"fix waits":"fixes wait"} for a look across every page \u2014 walk through them">${jt}${yt().length}</button>`:""}
|
|
102
103
|
<button class="dt-hist-refresh" data-refresh aria-label="Reload comments from the file">
|
|
103
104
|
<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>
|
|
104
105
|
</button>
|
|
105
106
|
<button class="dt-hist-fold" data-fold aria-label="Collapse or expand the panel">
|
|
106
107
|
<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>
|
|
107
108
|
</button>
|
|
108
|
-
</div>`+(r.length||
|
|
109
|
+
</div>`+(r.length||m.length?`<div class="dt-hist-list">${m.length?`<p class="dt-hist-group">Drafts<em>${m.length}</em></p>${m.map(E).join("")}`:""}${r.map(d=>`<p class="dt-hist-group">${ia[d]}<em>${s[d].length}</em></p>`+s[d].map(o).join("")).join("")}</div>`:`<p class="dt-hist-empty">${s.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">
|
|
109
110
|
<button class="dt-hist-resolved" data-resolved role="switch" aria-checked="${X}"
|
|
110
111
|
><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
|
|
111
112
|
><span>Show resolved</span><kbd>R</kbd><i class="dt-hist-switch" aria-hidden="true"></i></button>
|
|
112
|
-
</div>`},
|
|
113
|
-
<span class="dt-review-nav"><button data-r="prev" aria-label="Previous fix" data-tip="Previous \xB7 \u2190"${n?"":" disabled"}>${
|
|
113
|
+
</div>`},We=t=>W.toggleAttribute("data-collapsed",t);W.addEventListener("click",async t=>{const e=t.target.closest("[data-refresh]");if(e){e.dataset.spin="1",await he(),setTimeout(()=>delete e.dataset.spin,500);return}if(W.hasAttribute("data-collapsed")&&t.target.closest(".dt-hist-head")){We(!1);return}if(t.target.closest("[data-fold]")){We(!W.hasAttribute("data-collapsed"));return}const n=t.target.closest(".dt-hist-bands [data-bp]");if(n){rn(n.dataset.bp);return}const s=t.target.closest("[data-draft-go], [data-draft-rm]");if(s){const r=s.dataset.draftRm!==void 0,m=Number(r?s.dataset.draftRm:s.dataset.draftGo);B.hidden?r?is(m):Ue(m):P(r?{dropDraft:m}:{openDraft:m});return}const o=t.target.closest("[data-unmark]");if(o){t.stopPropagation(),await Tt(Number(o.dataset.unmark),!1);return}const a=t.target.closest(".dt-hist-tools [data-act]");if(a){await Tt(Number(a.dataset.id),a.dataset.act==="done");return}const l=t.target.closest("[data-rm]");if(l){v=null,await os(Number(l.dataset.rm));return}if(t.target.closest("[data-review]")){Fo();return}if(t.target.closest("[data-resolved]")){Ye(!X);return}const u=t.target.closest("[data-go]");if(!u)return;const i=Number(u.dataset.go);if(!B.hidden){P({open:i});return}_e(i)});const _e=t=>{v=t,V(),h();const e=b.find(s=>s.id===t),n=e&&Z(e);n?scrollTo({top:scrollY+n.y-innerHeight/2,behavior:"smooth"}):e&&Y(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)},Ue=t=>{const[e]=I.splice(t,1);if(!e)return;V(),c=e,v=null;const n=Z(e);n&&(n.y<0||n.y>innerHeight)&&scrollTo({top:scrollY+n.y-innerHeight/3,behavior:"instant"}),h()},is=t=>{I.splice(t,1),h()},ze="nm-review",ue=()=>{try{return JSON.parse(sessionStorage.getItem(ze)||"null")}catch{return null}},Mt=t=>{try{t?sessionStorage.setItem(ze,JSON.stringify(t)):sessionStorage.removeItem(ze)}catch{}},D=document.createElement("div");D.className="dt-review",D.setAttribute("role","region"),D.setAttribute("aria-label","Checking fixes"),D.hidden=!0,w||document.body.append(D);const yt=()=>Q.filter(t=>q(t)==="claude"),Fo=()=>{const t=yt().sort((e,n)=>+(n.route===_)-+(e.route===_)||String(e.route).localeCompare(String(n.route))||e.id-n.id).map(e=>e.id);t.length&&(Mt({ids:t,i:0}),me())},me=()=>{const t=ue();if(!t||w){D.hidden=!0;return}for(;t.i<t.ids.length&&q(Q.find(s=>s.id===t.ids[t.i])??{status:"done"})!=="claude";)t.i++;if(t.i>=t.ids.length){Mt(null),D.hidden=!0,O("Every fix is checked.");return}Mt(t);const e=Q.find(s=>s.id===t.ids[t.i]);if(e.route&&e.route!==_){location.assign(e.route+location.search);return}if(A||mt(!0),ot(e)!==oe()){rn(ot(e));for(const s of[600,1500])setTimeout(()=>P({open:e.id}),s)}else _e(e.id);const n=t.ids.slice(0,t.i).some(s=>q(Q.find(o=>o.id===s)??{status:"done"})==="claude");D.innerHTML=`<b><span class="dt-review-dot" aria-hidden="true"></span>Check fixes</b>
|
|
114
|
+
<span class="dt-review-nav"><button data-r="prev" aria-label="Previous fix" data-tip="Previous \xB7 \u2190"${n?"":" disabled"}>${no}</button>
|
|
114
115
|
<span class="dt-review-n">${t.i+1} of ${t.ids.length}</span>
|
|
115
|
-
<button data-r="skip" aria-label="Next fix" data-tip="Next \xB7 \u2192">${
|
|
116
|
-
<span class="dt-review-text">${
|
|
117
|
-
<button data-r="ok" class="dt-review-ok" aria-label="Looks right \u2014 mark it resolved" data-tip="Looks right \u2014 resolve it">${
|
|
118
|
-
<button data-r="no" aria-label="Reopen" data-tip="Not yet \u2014 reopen it">${
|
|
119
|
-
<button data-r="stop" aria-label="Stop checking" data-tip="Stop checking">${ie}</button>`,D.hidden=!1};D.addEventListener("click",async t=>{const e=t.target.closest("[data-r]"),n=ue();if(!e||!n)return;if(e.dataset.r==="stop"){
|
|
120
|
-
${T}`:""}},Wt=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"):[]})),me=async()=>{try{ls(Wt((await(await B("comments")).json()).comments)),!K.hidden&&!w&&h()}catch{}};let _t=null,zt=null;const vt=document.querySelector(".dt-turbo"),Ye="/notemend:turbo",Ut=()=>{const t=!!_t&&Date.now()-Date.parse(_t.at)<18e4,e=t?zt?.paused?"paused":"on":"none",n=t?Rs(_t.agent):"",s=e==="none"?`Turbo is off. Run ${Ye} 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`;vt.dataset.state=e,vt.dataset.tip=s,vt.setAttribute("aria-label",s),vt.setAttribute("aria-checked",String(e==="on")),w&&(vt.hidden=!0)};setInterval(Ut,3e4),vt.addEventListener("click",async()=>{const t=vt.dataset.state;if(t==="none"){await navigator.clipboard?.writeText(Ye).catch(()=>{}),O(`Copied ${Ye} \u2014 paste it in Claude Code`);return}const e=t==="on"?"off":"on";zt={paused:e==="off"},Ut();try{const n=await B("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({turbo:e})});if(!n.ok)throw new Error(String(n.status));O(e==="off"?"Turbo paused":"Turbo on")}catch{zt={paused:e==="on"},Ut(),O("Could not switch turbo \u2014 try again")}});let ge="",Je=!1;const Vt=async()=>{if(!(document.hidden||Je)){Je=!0;try{const t=await B(`comments${ge?`?since=${ge}`:""}`);if(t.status!==200)return;const e=await t.json();ge=e.version??"",_t=e.listening??null,zt=e.turbo??null,Ut();const n=Wt(e.comments);ls(n);const s=n.filter(o=>o.route===_);if(JSON.stringify(s)===JSON.stringify(b))return;if(f.contains(document.activeElement)&&document.activeElement.matches("textarea, input")){ge="",setTimeout(Vt,5e3);return}b=s,h(),P({reload:!0})}catch{}finally{Je=!1}}},$t=async()=>{try{const e=await(await B(`comments?route=${encodeURIComponent(_)}`)).json();b=Wt(e.comments),_t=e.listening??null,zt=e.turbo??null,Ut()}catch{b=[]}h()};let Ge=0;const ds=t=>{Ge||(Ge=requestAnimationFrame(()=>{Ge=0;const e=t.target;if(!A||e.closest(Te)){ht.hidden=!0;return}ht.hidden=!0;const n=document.elementFromPoint(t.clientX,t.clientY);if(ht.hidden=!1,!n)return;const s=n.getBoundingClientRect();Us.style.cssText=`left:${s.left}px;top:${s.top}px;width:${s.width}px;height:${s.height}px`,Ln.textContent=n.tagName.toLowerCase()+([...n.classList].find(o=>!/^(astro|svelte)-/.test(o))?"."+[...n.classList].find(o=>!/^(astro|svelte)-/.test(o)):"")+` ${Math.round(s.width)}\xD7${Math.round(s.height)}`,Ln.style.cssText=`left:${s.left}px;top:${Math.max(2,s.top-20)}px`}))},cs=t=>{if(!(t.key!=="Escape"||t.isComposing)){if(t.preventDefault(),x){x=null,h();return}if(c){V(),h();return}if(v!==null){v=null,h();return}pt(!1)}},us=["pointerdown","mousedown","pointerup","mouseup","touchstart","touchend"],ps=t=>{t.target.closest?.(Te)||t.stopPropagation()},ms=t=>{if(t.target.closest(Te))return;if(t.preventDefault(),t.stopPropagation(),Le){Le=!1;return}if(!getSelection()?.isCollapsed)return;f.hidden=!0;const n=document.elementFromPoint(t.clientX,t.clientY);if(f.hidden=!1,!n)return;V();const s=n.getBoundingClientRect(),o=n.tagName.toLowerCase(),a=[...n.classList].filter(d=>!/^(astro|svelte|css)-/.test(d)).slice(0,2);c={selector:Xs(n),tag:o,classes:a,nth:Zs({tag:o,classes:a}).indexOf(n),rx:s.width?(t.clientX-s.left)/s.width:.5,ry:s.height?(t.clientY-s.top)/s.height:.5,label:wt(n.textContent||"").slice(0,60),ctx:Qs(n),category:gn[0].id},hs.set(c,Xe(n)),v=null,ht.hidden=!0,h()},Oo=2200,Po=900*1024,gs=8*1024*1024,jo=1200,Fo=1600,Xe=async t=>{let e=t instanceof HTMLElement?t:null;for(let o=0;e&&o<4&&e.parentElement&&e.parentElement!==document.body;o++){const a=e.getBoundingClientRect();if(a.width>=360&&a.height>=140)break;e=e.parentElement}const n=e?.getBoundingClientRect();if(!e||!n?.width||!n.height)return null;let s="";for(let o=e;o&&!s;o=o.parentElement){const a=getComputedStyle(o).backgroundColor;a&&a!=="transparent"&&!/rgba\(.*,\s*0\)$/.test(a)&&(s=a)}if(!s){const[o,a,d]=(getComputedStyle(e).color.match(/[\d.]+/g)??["0","0","0"]).map(Number);s=.299*o+.587*a+.114*d>140?"#111":"#fff"}try{const{domToWebp:o}=await import("modern-screenshot"),a=Math.min(devicePixelRatio||1,2,jo/n.width,Fo/n.height),d=await Promise.race([o(e,{scale:a,quality:.8,timeout:4e3,backgroundColor:s,filter:u=>!(u instanceof Element&&u.closest(Mn))}),new Promise(u=>setTimeout(()=>u(null),8e3))]);return d&&d.length<gs?d:null}catch{return null}},hs=new WeakMap,O=t=>{const e=document.createElement("div");e.className="dt-toast",e.textContent=t,document.body.append(e),setTimeout(()=>e.remove(),2800)},Ko=t=>new Promise(e=>{const n=new FileReader;n.onload=()=>e(String(n.result)),n.readAsDataURL(t)}),Wo=async t=>{const e=await createImageBitmap(t),n=Math.min(1,Oo/Math.max(e.width,e.height));if(n===1&&t.size<=Po)return e.close(),Ko(t);const s=document.createElement("canvas");return s.width=Math.round(e.width*n),s.height=Math.round(e.height*n),s.getContext("2d").drawImage(e,0,0,s.width,s.height),e.close(),s.toDataURL("image/jpeg",.85)},Ze=async(t,e)=>{const n=[];for(const s of t){let o;try{o=await Wo(s)}catch{O("That image could not be read.");continue}if(o.length>gs){O("Screenshot is too large even after shrinking.");continue}n.push(o)}if(n.length){if(!Number(e?.dataset.id)){c&&((c.images??=[]).push(...n),h());return}U.push(...n),h(),bs(".dt-note-reply-input")}},fs=t=>[...t??[]].filter(e=>e.kind==="file"&&e.type.startsWith("image/")).map(e=>e.getAsFile()).filter(Boolean);f.addEventListener("paste",t=>{const e=fs(t.clipboardData?.items);e.length&&(t.preventDefault(),Ze(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=fs(t.dataTransfer?.items);n.length&&Ze(n,e)});const bs=t=>{const e=f.querySelector(t);e?.focus(),e?.setSelectionRange(e.value.length,e.value.length)},ys=()=>{bs(".dt-note-edit-input"),f.querySelector(".dt-msg .dt-compose")?.scrollIntoView({block:"nearest"})},Qe=t=>{t.style.overflowY="hidden",t.style.height="auto",t.style.height=`${t.scrollHeight}px`,t.style.overflowY=t.scrollHeight>t.clientHeight?"auto":"hidden"},_o=t=>/(?:^|\s)@([^\s@]*)$/.exec(t.value.slice(0,t.selectionStart??t.value.length)),zo=t=>{t.closest(".dt-compose").querySelector(".dt-mentions")?.remove();const n=_o(t);if(!n||!g.team?.length)return;const s=n[1].toLowerCase(),o=g.team.filter(a=>[a.name,a.nickname,a.email].some(d=>d?.toLowerCase().startsWith(s))).slice(0,5);o.length&&t.insertAdjacentHTML("afterend",`<div class="dt-mentions" role="listbox" aria-label="Mention someone">${o.map((a,d)=>`<button type="button" role="option" aria-selected="${d===0}" data-act="mention" data-handle="${m(sa(a))}">${qn(a.avatar_url,a.name||a.email)}${m(a.name||a.email)}${a.name?` <span>${m(a.email)}</span>`:""}</button>`).join("")}</div>`)},vs=(t,e)=>{const n=t.selectionStart??t.value.length,s=t.value.slice(0,n).lastIndexOf("@");t.value=`${t.value.slice(0,s)}@${e} ${t.value.slice(n)}`,t.selectionStart=t.selectionEnd=s+e.length+2,t.closest(".dt-compose")?.querySelector(".dt-mentions")?.remove(),t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus()},Uo=(t,e)=>{if(!t){c&&(c.category=e),h();return}ct(n=>n.map(s=>s.id===t?{...s,category:e}:s),()=>B("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:t,category:e})}),"Changing the type")};fa(f,m,Pt),f.addEventListener("change",t=>{const e=t.target.closest(".dt-cat-select");if(e){Uo(Number(e.dataset.id)||0,e.value);return}const n=t.target.closest(".dt-for-select");if(!n)return;n.parentElement?.style.setProperty("--cat",Ft(n.value));const s=Number(n.dataset.id);if(s){const o=n.value||null;ct(a=>a.map(d=>d.id===s?{...d,assignee:o??void 0}:d),()=>B("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:s,assignee:o})}),"Reassigning");return}if(c){c.assignee=n.value;try{localStorage.setItem("nm-for",n.value)}catch{}ft()}}),f.addEventListener("input",t=>{const e=t.target.closest(".dt-suggest-input");if(e&&c?.suggest){c.suggest.to=e.value,ft(),Qe(e);return}const n=t.target.closest(".dt-note-input, .dt-note-reply-input, .dt-note-edit-input");n&&(zo(n),n.classList.contains("dt-note-input")?c&&(c.text=n.value):n.classList.contains("dt-note-edit-input")?x&&(x.text=n.value):z=n.value,ft(),n.closest(".dt-compose")?.querySelector(".dt-send")?.classList.toggle("is-ready",n.value.trim()!==""),Qe(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(),vs(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,s=Number(e.dataset.id);if(n==="share"){const o=e.dataset.v==="1";s?ct(a=>a.map(d=>d.id===s?{...d,shared:o||void 0}:d),()=>B("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:s,shared:o})}),o?"Sharing with the client":"Keeping it to the team"):c&&(c.shared=o||void 0,ft(),h());return}if(n==="prio"){const o=e.dataset.v||null;s?ct(a=>a.map(d=>d.id===s?{...d,priority:o??void 0}:d),()=>B("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:s,priority:o})}),"Setting the priority"):c&&(c.priority=o??void 0,ft(),h());return}if(n==="mention"){const o=e.closest(".dt-compose")?.querySelector("textarea");o&&vs(o,e.dataset.handle);return}if(!n){if(v=v===s?null:s,v!=null&&e.dataset.off){const o=b.find(d=>d.id===s);(o&&Y(o))?.scrollIntoView({block:"nearest",inline:"center",behavior:"smooth"})}V(),h();return}if(n==="record"){Eo(e.closest(".dt-note"));return}if(n==="speak"){xo(e.closest(".dt-note"),e);return}if(n==="voice-write"){Ho(e);return}if(n==="voice"||n==="voice-seek"){fo(e,n==="voice-seek"?t:null);return}if(n==="attach"){const o=Object.assign(document.createElement("input"),{type:"file",accept:"image/*",multiple:!0}),a=e.closest(".dt-note");o.addEventListener("change",()=>{o.files?.length&&Ze([...o.files],a)}),o.click();return}if(n==="unshot"){s?x&&x.drop.push(e.dataset.img):(e.closest("[data-draft]")?c?.images??[]:U).splice(Number(e.dataset.i),1),h(),x&&ys();return}if(n==="edit"){const o=b.find(u=>u.id===s),a=e.dataset.at||null,d=a?o?.replies?.find(u=>u.at===a)?.text:o?.text;if(d===void 0)return;x={id:s,at:a,text:d,drop:[]},h(),ys();return}if(n==="edit-cancel"){x=null,h();return}if(n==="edit-save"){const o=x;if(!o)return;const a=o.text.trim();if(!a){f.querySelector(".dt-note-edit-input")?.focus();return}x=null;const d=u=>o.drop.includes(u.split("/").pop());await ct(u=>u.map(i=>i.id!==o.id?i:{...i,...o.at==null?{text:a}:{replies:(i.replies??[]).map(r=>r.at===o.at?{...r,text:a}:r)},images:(i.images??[]).filter(r=>!d(r))}),()=>B("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:o.id,edit:{at:o.at,text:a},...o.drop.length?{removeImage:o.drop}:{}})}).then(u=>(u.ok||(x=o),u)),"Saving the edit");return}if(n==="cancel"){V(),h();return}if(n==="twin"){V(),v=Number(e.dataset.id),h();return}if(n==="discard"){c=null,h();return}if(n==="draft-open"){_e(Number(e.dataset.i));return}if(n==="close"){v=null,h();return}if(n==="suggest"&&c){const o=On(Y(c));c.suggest={from:o,to:o},h();const a=f.querySelector(".dt-suggest-input");a?.focus(),a?.select();return}if(n==="unsuggest"&&c){c.suggest=null,h();return}if(n==="save"){if(!c)return;const o=c.suggest&&c.suggest.to.trim()!==c.suggest.from?{from:c.suggest.from,to:c.suggest.to.trim()}:null,a=f.querySelector(".dt-note-input").value.trim()||(o?"Change the text":"")||(c.images?.some(Oe)?Xn:"");if(!a){f.querySelector(".dt-note-input")?.focus();return}const d=c,u=hs.get(d)??Xe(Y(d)),i={...d,route:_,text:a,suggest:o,assignee:g.client?d.assignee||g.lead||void 0:d.assignee??re(),shared:g.client?!0:d.shared===!0,stage:g.client?"new":d.stage??(W(d.assignee??re())?"approved":"new"),breakpoint:lt(),browser:Gs(),device:w?$s:"",viewport:{w:innerWidth,h:innerHeight},logs:pa(),host:location.host},r={...d,id:-Date.now(),text:a,route:_,status:"open",note:"",doneBy:null,breakpoint:i.breakpoint,replies:[],images:[],createdAt:new Date().toISOString(),...o?{suggest:o}:{},by:g.me?.email,byName:g.me?.name};b=[...b,r],c=null,h();const p=await u,T=await B("comments",{method:"POST",headers:{"content-type":"application/json"},body:JSON.stringify({...i,...p?{before:p}:{}})});if(!T.ok){b=b.filter($=>$!==r),c=d,h(),O(`Comment was not saved (${T.status}).`);return}const l=Wt([await T.json().catch(()=>null)])[0];b=b.map($=>$===r&&l?l:$),h(),he();return}if(n==="reply"){const o=f.querySelector(".dt-note-reply-input"),a=o.value.trim()||(U.some(Oe)?Xn:"");if(!a){o.focus();return}const d=U;z="",U=[];const u=b;b=b.map(p=>p.id===s?{...p,replies:[...p.replies??[],{author:"you",text:a,at:new Date().toISOString(),by:g.me?.email}]}:p),h();const i=await B("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:s,reply:a,images:d})});if(!i.ok){b=u,z=a,U=d,h(),O(`Reply was not sent (${i.status}).`);return}const r=Wt([await i.json().catch(()=>null)])[0];r&&(b=b.map(p=>p.id===r.id?r:p),h()),he();return}if(n==="hand"){oo(s,e.dataset.v);return}v=null,n==="rm"?await ns(s):await Kt(s,n==="done")});let Yt="overlay",Mt="",$s="";const P=t=>{C.hidden||M.contentWindow?.postMessage({dt:!0,...t},location.origin)},Vo=()=>({notes:A,grid:!Zt.hidden,inspect:at,resolved:X,scrollbar:Yt,device:Mt});addEventListener("message",t=>{if(t.origin!==location.origin||!t.data?.dt)return;const e=t.data;if(!w&&t.source===M.contentWindow){if(e.key){Ns(e.key[0],e.key[1])?.run();return}if(e.closeMenus){Ct();return}if(e.drafts){Fe=e.drafts,ss(oe());return}}if(w&&typeof e.openDraft=="number"){_e(e.openDraft);return}if(w&&typeof e.dropDraft=="number"){os(e.dropDraft);return}if(w&&typeof e.device=="string"&&($s=e.device),w&&e.scrollbar&&document.documentElement.classList.toggle("dt-sb-classic",e.scrollbar==="classic"),e.hello&&t.source===M.contentWindow){P(Vo());return}typeof e.notes=="boolean"&&e.notes!==A&&pt(e.notes,!1),typeof e.open=="number"&&We(e.open),typeof e.grid=="boolean"&&e.grid===Zt.hidden&&Se(e.grid),typeof e.inspect=="string"&&e.inspect!==at&&Qt(e.inspect),typeof e.resolved=="boolean"&&e.resolved!==X&&Ve(e.resolved),e.reload&&($t(),me())});const he=async()=>{await $t(),me(),P({reload:!0}),w&&parent.postMessage({dt:!0,reload:!0},location.origin)},pt=(t,e=!0)=>{if(A=t,En.setAttribute("aria-pressed",String(t)),t?!w&&K.hidden&&localStorage.getItem("dt-history")!=="0"&&(K.hidden=!1,te.setAttribute("aria-pressed","true")):(K.hidden=!0,te.setAttribute("aria-pressed","false")),J(xn,t?"1":"0"),P({notes:t}),w&&e&&parent.postMessage({dt:!0,notes:t},location.origin),f.hidden=!t||!C.hidden,document.documentElement.classList.toggle("dt-noting",t),t){Qt(""),document.addEventListener("click",ms,!0);for(const n of us)document.addEventListener(n,ps,!0);document.addEventListener("keydown",cs),document.addEventListener("mousemove",ds),addEventListener("scroll",ut,!0),addEventListener("resize",ut),is.observe(document.body,{childList:!0,subtree:!0,characterData:!0}),rs.observe(document.body),$t()}else{V(),v=null,document.removeEventListener("click",ms,!0);for(const n of us)document.removeEventListener(n,ps,!0);document.removeEventListener("keydown",cs),document.removeEventListener("mousemove",ds),ht.hidden=!0,removeEventListener("scroll",ut,!0),removeEventListener("resize",ut),is.disconnect(),rs.disconnect(),f.innerHTML=""}},fe="dt-w",tn="dt-canvas",xt="dt-device";let mt=localStorage.getItem(tn)==="1",S=localStorage.getItem(xt)||"";S&&!Xt(S)&&(S="",localStorage.setItem(xt,""));let N=Number(localStorage.getItem(fe))||0;const ws="dt-emu";let j=(()=>{try{return JSON.parse(localStorage.getItem(ws)||"null")}catch{return null}})();const be=()=>j?Ds.find(t=>t.id===j.id)??null:null,Yo=()=>{const t=be();return t?j.turned?{w:t.h,h:t.w}:{w:t.w,h:t.h}:null};let Jt=localStorage.getItem("dt-bars-min")==="1";const kt=t=>{j=t,J(ws,t?JSON.stringify(t):"")},en=t=>{Tn.textContent=t,C.style.setProperty("--dt-badge-w",`${Tn.offsetWidth}px`)},Es=t=>{if(!t){qt.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 R)for(const s of[n.min,n.max])s>0&&Number.isFinite(s)&&s<=t&&(e+=`<span class="dt-edge" style="left:${s}px" title="${n.label} edge"></span>`);qt.innerHTML=e,qt.style.width=`${t}px`},nn=()=>{const t=parseFloat(L.style.width)||0,e=parseFloat(L.style.height)||0;if(!t||!e){L.style.transform="",delete L.dataset.scaled;return}const n=S||j?Math.min(1,(innerWidth-80)/t,(innerHeight-120)/e):Math.min(1,(innerWidth-80)/t);L.style.transform=n<1?`scale(${n})`:"",L.dataset.scaled=n<1?String(Math.round(n*100)):""},Jo=t=>Ds.find(e=>e.w===t.w&&e.h===t.h&&e.cutout?.shape==="pill")?.cutout,ye=()=>{try{return M.contentDocument}catch{return null}},Ss=()=>ye()?.title.split("\u2014").pop()?.trim()||"",sn=()=>{const t=ye(),e=S?Xt(S):null;if(!t?.body||!e)return;const n=ua(t),s=e.browser==="chrome-android"?n.theme||"rgb(255, 255, 255)":n.top,o=e.browser==="chrome-android"?"rgb(255, 255, 255)":n.bottom;L.style.setProperty("--dt-top",s),L.style.setProperty("--dt-top-ink",Os(s)),L.style.setProperty("--dt-bottom",o),L.style.setProperty("--dt-bottom-ink",Os(o));const a=Bt.querySelector(".dt-win-tab > span");a&&(a.textContent=Ss()||location.host)};let on=0;M.addEventListener("load",()=>{ye()&&(sn(),M.contentWindow?.addEventListener("scroll",()=>{on||(on=requestAnimationFrame(()=>{on=0,sn()}))},{passive:!0}))});for(const t of[Bt,ee])t.addEventListener("click",e=>{const n=e.target.closest("[data-nav]")?.dataset.nav;if(n)try{const s=M.contentWindow?.navigation;if(!ye()||!s)throw new Error("foreign");n==="back"?s.canGoBack&&s.back():n==="fwd"?s.canGoForward&&s.forward():s.reload()}catch{(n==="reload"||n==="back")&&(M.src=location.href)}});Rt.addEventListener("click",()=>{Jt=!Jt,J("dt-bars-min",Jt?"1":"0"),rt()});const rt=()=>{if(w)return;const t=S?Xt(S)??null:null;if(S&&!t&&(S="",localStorage.setItem(xt,"")),!t&&!mt){C.hidden=!0,M.removeAttribute("src"),document.documentElement.classList.remove("dt-framing"),f.hidden=!A,qt.innerHTML="",Dt(),Ae.hidden=!0,Rt.hidden=!0,it=null,Mt="",Fe=[],Dt(),ln(),A?$t():h();return}if(C.hidden=!1,document.documentElement.classList.add("dt-framing"),f.hidden=!0,M.src||(M.src=location.href),t){const e=ca(t,{host:location.host,title:Ss(),now:new Date,min:Jt,cutout:Jo(t)}),{screen:n}=e;C.dataset.mode="device",L.dataset.shell=t.shell,L.dataset.browser=t.browser,L.style.width=`${e.footprint.w}px`,L.style.height=`${e.footprint.h}px`,L.style.setProperty("--dt-r",`${n.r}px`),L.style.setProperty("--dt-rb",`${n.rb}px`),Sn.innerHTML=e.shell;const s=(d,u,i,r)=>{d.innerHTML=r,d.style.cssText=`left:${n.x}px;top:${u}px;width:${n.w}px;height:${i}px`};s(Bt,n.y,e.topH,e.top),s(ee,n.y+n.h-e.bottomH,e.bottomH,e.bottom);const o=n.h-e.topH-e.bottomH;M.style.position="absolute",M.style.left=`${n.x}px`,M.style.top=`${n.y+e.topH}px`,M.style.width=`${n.w}px`,M.style.height=`${o}px`,qt.innerHTML="";const a=Jt&&e.canMinimize;Yt=e.scrollbar,Mt=`${t.label}${a?" \xB7 bars folded":""}`,it=Nt(t.w),P({notes:A,scrollbar:Yt,device:Mt}),Rt.hidden=!e.canMinimize,Rt.setAttribute("aria-pressed",String(a)),en(`${t.label} \xB7 page ${t.w}\xD7${o} of ${t.w}\xD7${t.h}${a?" \xB7 bars folded":""} \xB7 ${R.find(d=>d.id===it)?.label??""}`),sn()}else{const e=Yo();e||kt(null);const n=e?.w||N||R.find(a=>a.id===lt()).ideal;N=n,C.dataset.mode="canvas",delete L.dataset.shell,delete L.dataset.browser,Sn.innerHTML=Bt.innerHTML=ee.innerHTML="",Bt.style.cssText=ee.style.cssText="",Rt.hidden=!0,Yt="overlay",L.style.width=`${n}px`,L.style.height=`${e?.h??innerHeight-84}px`,M.style.position="",M.style.left=M.style.top="",M.style.width="100%",M.style.height="100%",Es(n),P({notes:A});const s=R.find(a=>a.id===Nt(n)),o=be();Mt=o?`${o.label}${j?.turned?" \xB7 landscape":""}`:"",P({scrollbar:Yt,device:Mt}),en(o&&e?`${o.label} \xB7 ${e.w}\xD7${e.h} \xB7 ${s.label}`:`${n}px \xB7 ${s.label}`),it=Nt(n)}Ae.hidden=!(be()?.rotates&&!t),ln(),nn(),Dt(),A?$t():h()},an=t=>{const e=R.find(n=>n.id===t);S="",localStorage.setItem(xt,""),kt(null),mt=t!==we,N=mt?e.ideal:0,it=mt?t:null,localStorage.setItem(tn,mt?"1":"0"),localStorage.setItem(fe,String(N)),v=null,V(),rt()};for(const t of ke)t.addEventListener("click",()=>an(t.dataset.bp));for(const t of document.querySelectorAll("[data-device]"))t.addEventListener("click",()=>{S=t.dataset.device===S?"":t.dataset.device,localStorage.setItem(xt,S),G.open=!1,rt()});for(const t of document.querySelectorAll("[data-emu]"))t.addEventListener("click",()=>{const e=j?.id===t.dataset.emu&&!S;S="",localStorage.setItem(xt,""),kt(e?null:{id:t.dataset.emu,turned:!1}),mt=!e,N=0,localStorage.setItem(tn,mt?"1":"0"),it=null,v=null,V(),G.open=!1,rt()});Ae.addEventListener("click",()=>{j&&(kt({...j,turned:!j.turned}),v=null,V(),rt())});const Ls=[...G.querySelectorAll("[data-tab]")],Go=[...G.querySelectorAll("[data-panel]")],Ts=t=>{for(const e of Ls)e.setAttribute("aria-selected",String(e.dataset.tab===t));for(const e of Go)e.hidden=e.dataset.panel!==t;J("dt-devices-tab",t)};for(const t of Ls)t.addEventListener("click",()=>Ts(t.dataset.tab));Ts(localStorage.getItem("dt-devices-tab")==="devtools"?"devtools":"preview");const rn=G.querySelector(".dt-emu-search");rn.addEventListener("input",()=>{const t=rn.value.trim().toLowerCase();let e=null,n=!1;const s=()=>{e&&(e.hidden=!n)};for(const o of rn.parentElement.children){if(o.classList.contains("dt-devices-group")){s(),e=o,n=!1;continue}o.dataset.emu&&(o.hidden=!!t&&!o.textContent.toLowerCase().includes(t),n||=!o.hidden)}s()});const Xo=G.querySelector(".dt-devices-name");function ln(){for(const e of G.querySelectorAll("[data-device]"))e.setAttribute("aria-pressed",String(e.dataset.device===S));const t=!S&&!C.hidden?j?.id:void 0;for(const e of G.querySelectorAll("[data-emu]"))e.setAttribute("aria-pressed",String(e.dataset.emu===t));Xo.textContent=S&&Xt(S)?.label||t&&be()?.label||"Device"}const dn=t=>R.find(e=>e.id===t),Zo=t=>{const e=dn(it??lt());return Math.max(e.min||320,Math.min(Number.isFinite(e.max)?e.max:2560,Math.round(t)))};for(const t of Vs){const e=t.dataset.edge==="l"?-1:1;t.addEventListener("pointerdown",n=>{if(S)return;n.preventDefault(),j&&(kt(null),rt()),t.setPointerCapture(n.pointerId);const s=n.clientX,o=N,a=Number(L.dataset.scaled||100)/100;C.dataset.dragging="1";const d=i=>{N=Zo(o+e*(i.clientX-s)*2/a),L.style.width=`${N}px`,Es(N),en(`${N}px \xB7 ${dn(Nt(N)).label}`),nn()},u=()=>{t.removeEventListener("pointermove",d),t.removeEventListener("pointerup",u),delete C.dataset.dragging,localStorage.setItem(fe,String(N)),rt()};t.addEventListener("pointermove",d),t.addEventListener("pointerup",u)}),t.addEventListener("dblclick",()=>{if(S)return;kt(null);const n=dn(it??lt()),s=[n.min||320,Number.isFinite(n.max)?n.max:n.ideal];N=Math.abs(N-s[0])<Math.abs(N-s[1])?s[0]:s[1],localStorage.setItem(fe,String(N)),rt()})}let Ms=lt();addEventListener("resize",()=>{Dt(),lt()!==Ms&&(Ms=lt(),h()),C.hidden||(!S&&!j&&(L.style.height=`${innerHeight-84}px`),nn())});const xs="dt-studio",ks=t=>{He.setAttribute("aria-pressed",String(t)),document.documentElement.classList.toggle("dt-no-studio",!t),J(xs,t?"1":"0")};He.addEventListener("click",()=>ks(He.getAttribute("aria-pressed")!=="true")),ks(localStorage.getItem(xs)!=="0"),En.addEventListener("click",()=>pt(!A));const Ht=document.querySelector(".devtools"),Gt=document.querySelector(".dt-tab"),Hs=t=>{Ht.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 Ht.querySelectorAll(".dt-group"))e.inert=t;t&&Ct(),J("dt-collapsed",t?"1":"0")};Gt.addEventListener("click",()=>Hs(!Ht.hasAttribute("data-collapsed")));const cn=document.querySelector(".dt-keys"),tt=t=>()=>Ht.querySelector(t)?.click(),As=t=>()=>{const e=[...document.querySelectorAll(".dt-pages a")];e[e.findIndex(n=>n.hasAttribute("aria-current"))+t]?.click()},ve=[{group:"Comments",code:"KeyC",hint:"C",label:"Comment mode",el:".dt-notes-btn",run:tt(".dt-notes-btn")},{group:"Comments",code:"KeyC",shift:!0,hint:"\u21E7C",label:"Comments panel",el:".dt-history-btn",run:tt(".dt-history-btn")},{group:"Comments",code:"KeyR",hint:"R",label:"Show resolved",el:".dt-resolved-btn",run:tt(".dt-resolved-btn")},{group:"Inspect",code:"KeyG",hint:"G",label:"Grid",el:".dt-grid-btn",run:tt(".dt-grid-btn")},{group:"Inspect",code:"KeyP",hint:"P",label:"Spacing",el:".dt-pad-btn",run:tt(".dt-pad-btn")},{group:"Inspect",code:"KeyS",hint:"S",label:"Size",el:".dt-size-btn",run:tt(".dt-size-btn")},{group:"Inspect",code:"KeyT",hint:"T",label:"Typography",el:".dt-type-btn",run:tt(".dt-type-btn")},{group:"Inspect",code:"KeyO",hint:"O",label:"Color",el:".dt-color-btn",run:tt(".dt-color-btn")},{group:"Inspect",code:"KeyB",hint:"B",label:"Border & radius",el:".dt-border-btn",run:tt(".dt-border-btn")},...g.sanity?[{group:"Inspect",code:"KeyE",hint:"E",label:"Sanity overlay",el:".dt-studio-btn",run:tt(".dt-studio-btn")}]:[],...ke.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:As(-1)},{group:"View",code:"BracketRight",hint:"]",label:"Next page",run:As(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:()=>{cn.open=!cn.open}}].filter(t=>!g.client||t.group!=="Inspect"),Ns=(t,e)=>ve.find(n=>n.code===t&&!n.shift==!e),Qo=t=>t instanceof HTMLElement&&(t.isContentEditable||/^(INPUT|TEXTAREA|SELECT)$/.test(t.tagName)||!!t.closest('[role="menu"], [role="listbox"], [role="dialog"][aria-modal="true"], [role="combobox"]'));if(g.shortcuts){for(const e of ve){const n=e.el&&Ht.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(cn.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(ve.map(e=>e.group))].map(e=>`<p class="dt-devices-group">${e}</p>`+ve.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||Qo(e.target))return;const n=Ns(e.code,e.shiftKey);n&&(e.preventDefault(),w?parent.postMessage({dt:!0,key:[e.code,e.shiftKey]},location.origin):n.run())}),w){const e=()=>parent.postMessage({dt:!0,closeMenus:!0},location.origin);document.addEventListener("pointerdown",e,!0),document.addEventListener("keydown",n=>{n.key==="Escape"&&e()})}}if(!w){Hs(localStorage.getItem("dt-collapsed")==="1"),requestAnimationFrame(()=>requestAnimationFrame(()=>Ht.setAttribute("data-ready",""))),mt||S?rt():ln(),Se(localStorage.getItem(fn)==="1");const t=localStorage.getItem($n);t&&t in Me&&Qt(t),pt(localStorage.getItem(xn)==="1")}const Cs=()=>{try{const t=JSON.parse(localStorage.getItem(St)||"null");I=(t?.parked??[]).filter(e=>ne(e)),t?.draft&&document.querySelector(t.draft.selector)?(c=t.draft,!A&&!w&&pt(!0)):ne(t?.draft)&&I.push(t.draft),t?.reply?.text&&(z=t.reply.text,It=v=t.reply.for??null),(c||I.length||z)&&h()}catch{localStorage.removeItem(St)}};Cs();const Bs=()=>setTimeout(()=>{const t=Ee(location.pathname);t!==_&&(clearTimeout(se),Be(),_=t,St=kn(),c=null,I=[],z="",It=null,v=null,x=null,b=[],yn(),Cs(),$t())});for(const t of["pushState","replaceState"]){const e=window.history[t];window.history[t]=function(...n){e.apply(this,n),Bs()}}addEventListener("popstate",Bs),A||$t(),me().then(()=>{ue()&&pe()}),document.addEventListener("visibilitychange",()=>{document.hidden||Vt()}),addEventListener("focus",Vt),addEventListener("notemend:changed",()=>{w||Vt()});let ta=0;w||setInterval(()=>{(!la.live||++ta%6===0)&&Vt()},2e4),w&&parent.postMessage({dt:!0,hello:!0},location.origin)}export{xa as run};
|
|
116
|
+
<button data-r="skip" aria-label="Next fix" data-tip="Next \xB7 \u2192">${so}</button></span>
|
|
117
|
+
<span class="dt-review-text">${g(wt(e.text).slice(0,90))}</span>
|
|
118
|
+
<button data-r="ok" class="dt-review-ok" aria-label="Looks right \u2014 mark it resolved" data-tip="Looks right \u2014 resolve it">${jt}</button>
|
|
119
|
+
<button data-r="no" aria-label="Reopen" data-tip="Not yet \u2014 reopen it">${oo}</button>
|
|
120
|
+
<button data-r="stop" aria-label="Stop checking" data-tip="Stop checking">${ie}</button>`,D.hidden=!1};D.addEventListener("click",async t=>{const e=t.target.closest("[data-r]"),n=ue();if(!e||!n)return;if(e.dataset.r==="stop"){Mt(null),D.hidden=!0;return}if(e.dataset.r==="prev"){rs();return}const s=n.ids[n.i];Mt({...n,i:n.i+1});const o=e.dataset.r==="ok"?Tt(s,!0):e.dataset.r==="no"?Tt(s,!1):null;me(),await o});const rs=()=>{const t=ue();if(t){for(let e=t.i-1;e>=0;e--)if(q(Q.find(n=>n.id===t.ids[e])??{status:"done"})==="claude"){Mt({...t,i:e}),me();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"?rs():D.querySelector('[data-r="skip"]')?.click())});const Ko=t=>{W.hidden=!t,te.setAttribute("aria-pressed",String(t)),J("dt-history",t?"1":"0"),h()},Ve=document.querySelector(".dt-resolved-btn"),Ye=t=>{X=t,Ve.setAttribute("aria-pressed",String(t)),J("dt-resolved",t?"1":"0"),P({resolved:t}),h(),pe()};Ve.addEventListener("click",()=>Ye(!X)),Ve.setAttribute("aria-pressed",String(X)),te.addEventListener("click",()=>{const t=W.hidden===!0;t&&!A&&mt(!0),t&&We(!1),Ko(t)});const ut=()=>{Be||!A||(Be=requestAnimationFrame(()=>{Be=0,Po()}))},ls=new MutationObserver(t=>{t.every(e=>e.target.closest?.(".dt-notes-overlay"))||ut()}),ds=new ResizeObserver(()=>ut());let Q=[];const cs=t=>{Q=t;const e=()=>({open:0,claude:0,done:0}),n={};for(const u of t){const i=q(u),r=n[u.route??""]??={...e(),bands:{}};r[i]++;const m=ot(u);(r.bands[m]??=e())[i]++}const s=["open","claude","done"],o={open:"open",claude:"resolved by an agent, to check",done:"resolved"},a=u=>s.map(i=>[i,i==="done"&&!X?0:u[i]]),l=u=>a(u).reduce((i,[,r])=>i+r,0);for(const u of document.querySelectorAll(".dt-pages a")){const i=u.querySelector(".dt-pages-n");if(!i)continue;const r=n[new URL(u.href).pathname.replace(/\/+$/,"")||"/"];for(const d of R){const $=r?.bands[d.id];for(const[H,k]of a($??e())){const et=i.querySelector(`[data-bp="${d.id}"][data-state="${H}"]`);et.hidden=!k,k&&(et.querySelector("i").textContent=String(k),et.title=`${d.label}: ${k} ${o[H]}`)}}const m=r?l(r):0;i.hidden=!m;const E=r?R.filter(d=>r.bands[d.id]&&l(r.bands[d.id])).map(d=>`${d.label} ${l(r.bands[d.id])}`).join(" \xB7 "):"";i.title=m?`${r.open} open \xB7 ${r.claude} resolved by an agent, to check \xB7 ${r.done} resolved
|
|
121
|
+
${E}`:""}},Wt=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"):[]})),pe=async()=>{try{cs(Wt((await(await C("comments")).json()).comments)),!W.hidden&&!w&&h()}catch{}};let _t=null,Ut=null;const vt=document.querySelector(".dt-turbo"),Je="/notemend:turbo",zt=()=>{const t=!!_t&&Date.now()-Date.parse(_t.at)<18e4,e=t?Ut?.paused?"paused":"on":"none",n=t?Ds(_t.agent):"",s=e==="none"?`Turbo is off. Run ${Je} 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`;vt.dataset.state=e,vt.dataset.tip=s,vt.setAttribute("aria-label",s),vt.setAttribute("aria-checked",String(e==="on")),w&&(vt.hidden=!0)};setInterval(zt,3e4),vt.addEventListener("click",async()=>{const t=vt.dataset.state;if(t==="none"){await navigator.clipboard?.writeText(Je).catch(()=>{}),O(`Copied ${Je} \u2014 paste it in Claude Code`);return}const e=t==="on"?"off":"on";Ut={paused:e==="off"},zt();try{const n=await C("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({turbo:e})});if(!n.ok)throw new Error(String(n.status));O(e==="off"?"Turbo paused":"Turbo on")}catch{Ut={paused:e==="on"},zt(),O("Could not switch turbo \u2014 try again")}});let ge="",Ge=!1;const Vt=async()=>{if(!(document.hidden||Ge)){Ge=!0;try{const t=await C(`comments${ge?`?since=${ge}`:""}`);if(t.status!==200)return;const e=await t.json();ge=e.version??"",_t=e.listening??null,Ut=e.turbo??null,zt();const n=Wt(e.comments);cs(n);const s=n.filter(o=>o.route===_);if(JSON.stringify(s)===JSON.stringify(b))return;if(f.contains(document.activeElement)&&document.activeElement.matches("textarea, input")){ge="",setTimeout(Vt,5e3);return}b=s,h(),P({reload:!0})}catch{}finally{Ge=!1}}},$t=async()=>{try{const e=await(await C(`comments?route=${encodeURIComponent(_)}`)).json();b=Wt(e.comments),_t=e.listening??null,Ut=e.turbo??null,zt()}catch{b=[]}h()};let Xe=0;const us=t=>{Xe||(Xe=requestAnimationFrame(()=>{Xe=0;const e=t.target;if(!A||e.closest(Me)){ht.hidden=!0;return}ht.hidden=!0;const n=document.elementFromPoint(t.clientX,t.clientY);if(ht.hidden=!1,!n)return;const s=n.getBoundingClientRect();Ys.style.cssText=`left:${s.left}px;top:${s.top}px;width:${s.width}px;height:${s.height}px`,Tn.textContent=n.tagName.toLowerCase()+([...n.classList].find(o=>!/^(astro|svelte)-/.test(o))?"."+[...n.classList].find(o=>!/^(astro|svelte)-/.test(o)):"")+` ${Math.round(s.width)}\xD7${Math.round(s.height)}`,Tn.style.cssText=`left:${s.left}px;top:${Math.max(2,s.top-20)}px`}))},ms=t=>{if(!(t.key!=="Escape"||t.isComposing)){if(t.preventDefault(),x){x=null,h();return}if(c){V(),h();return}if(v!==null){v=null,h();return}mt(!1)}},ps=["pointerdown","mousedown","pointerup","mouseup","touchstart","touchend"],gs=t=>{t.target.closest?.(Me)||t.stopPropagation()},hs=t=>{if(t.target.closest(Me))return;if(t.preventDefault(),t.stopPropagation(),Te){Te=!1;return}if(!getSelection()?.isCollapsed)return;f.hidden=!0;const n=document.elementFromPoint(t.clientX,t.clientY);if(f.hidden=!1,!n)return;V();const s=n.getBoundingClientRect(),o=n.tagName.toLowerCase(),a=[...n.classList].filter(l=>!/^(astro|svelte|css)-/.test(l)).slice(0,2);c={selector:Qs(n),tag:o,classes:a,nth:to({tag:o,classes:a}).indexOf(n),rx:s.width?(t.clientX-s.left)/s.width:.5,ry:s.height?(t.clientY-s.top)/s.height:.5,label:wt(n.textContent||"").slice(0,60),ctx:eo(n),category:hn[0].id},bs.set(c,Ze(n)),v=null,ht.hidden=!0,h()},Wo=2200,_o=900*1024,fs=8*1024*1024,Uo=1200,zo=1600,Ze=async t=>{let e=t instanceof HTMLElement?t:null;for(let o=0;e&&o<4&&e.parentElement&&e.parentElement!==document.body;o++){const a=e.getBoundingClientRect();if(a.width>=360&&a.height>=140)break;e=e.parentElement}const n=e?.getBoundingClientRect();if(!e||!n?.width||!n.height)return null;let s="";for(let o=e;o&&!s;o=o.parentElement){const a=getComputedStyle(o).backgroundColor;a&&a!=="transparent"&&!/rgba\(.*,\s*0\)$/.test(a)&&(s=a)}if(!s){const[o,a,l]=(getComputedStyle(e).color.match(/[\d.]+/g)??["0","0","0"]).map(Number);s=.299*o+.587*a+.114*l>140?"#111":"#fff"}try{const{domToWebp:o}=await import("modern-screenshot"),a=Math.min(devicePixelRatio||1,2,Uo/n.width,zo/n.height),l=await Promise.race([o(e,{scale:a,quality:.8,timeout:4e3,backgroundColor:s,filter:u=>!(u instanceof Element&&u.closest(xn))}),new Promise(u=>setTimeout(()=>u(null),8e3))]);return l&&l.length<fs?l:null}catch{return null}},bs=new WeakMap,O=t=>{const e=document.createElement("div");e.className="dt-toast",e.textContent=t,document.body.append(e),setTimeout(()=>e.remove(),2800)},Vo=t=>new Promise(e=>{const n=new FileReader;n.onload=()=>e(String(n.result)),n.readAsDataURL(t)}),Yo=async t=>{const e=await createImageBitmap(t),n=Math.min(1,Wo/Math.max(e.width,e.height));if(n===1&&t.size<=_o)return e.close(),Vo(t);const s=document.createElement("canvas");return s.width=Math.round(e.width*n),s.height=Math.round(e.height*n),s.getContext("2d").drawImage(e,0,0,s.width,s.height),e.close(),s.toDataURL("image/jpeg",.85)},Qe=async(t,e)=>{const n=[];for(const s of t){let o;try{o=await Yo(s)}catch{O("That image could not be read.");continue}if(o.length>fs){O("Screenshot is too large even after shrinking.");continue}n.push(o)}if(n.length){if(!Number(e?.dataset.id)){c&&((c.images??=[]).push(...n),h());return}z.push(...n),h(),vs(".dt-note-reply-input")}},ys=t=>[...t??[]].filter(e=>e.kind==="file"&&e.type.startsWith("image/")).map(e=>e.getAsFile()).filter(Boolean);f.addEventListener("paste",t=>{const e=ys(t.clipboardData?.items);e.length&&(t.preventDefault(),Qe(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=ys(t.dataTransfer?.items);n.length&&Qe(n,e)});const vs=t=>{const e=f.querySelector(t);e?.focus(),e?.setSelectionRange(e.value.length,e.value.length)},$s=()=>{vs(".dt-note-edit-input"),f.querySelector(".dt-msg .dt-compose")?.scrollIntoView({block:"nearest"})},tn=t=>{t.style.overflowY="hidden",t.style.height="auto",t.style.height=`${t.scrollHeight}px`,t.style.overflowY=t.scrollHeight>t.clientHeight?"auto":"hidden"},Jo=t=>/(?:^|\s)@([^\s@]*)$/.exec(t.value.slice(0,t.selectionStart??t.value.length)),Go=t=>{t.closest(".dt-compose").querySelector(".dt-mentions")?.remove();const n=Jo(t);if(!n||!p.team?.length)return;const s=n[1].toLowerCase(),o=p.team.filter(a=>[a.name,a.nickname,a.email].some(l=>l?.toLowerCase().startsWith(s))).slice(0,5);o.length&&t.insertAdjacentHTML("afterend",`<div class="dt-mentions" role="listbox" aria-label="Mention someone">${o.map((a,l)=>`<button type="button" role="option" aria-selected="${l===0}" data-act="mention" data-handle="${g(la(a))}">${Rn(a.avatar_url,a.name||a.email)}${g(a.name||a.email)}${a.name?` <span>${g(a.email)}</span>`:""}</button>`).join("")}</div>`)},ws=(t,e)=>{const n=t.selectionStart??t.value.length,s=t.value.slice(0,n).lastIndexOf("@");t.value=`${t.value.slice(0,s)}@${e} ${t.value.slice(n)}`,t.selectionStart=t.selectionEnd=s+e.length+2,t.closest(".dt-compose")?.querySelector(".dt-mentions")?.remove(),t.dispatchEvent(new Event("input",{bubbles:!0})),t.focus()},Xo=(t,e)=>{if(!t){c&&(c.category=e),h();return}rt(n=>n.map(s=>s.id===t?{...s,category:e}:s),()=>C("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:t,category:e})}),"Changing the type")};$a(f,g,jt),f.addEventListener("change",t=>{const e=t.target.closest(".dt-cat-select");if(e){Xo(Number(e.dataset.id)||0,e.value);return}const n=t.target.closest(".dt-status-select");if(n){po(Number(n.dataset.id),n.value);return}const s=t.target.closest(".dt-for-select");if(!s)return;s.parentElement?.style.setProperty("--cat",Kt(s.value));const o=Number(s.dataset.id);if(o){const a=s.value||null;rt(l=>l.map(u=>u.id===o?{...u,assignee:a??void 0}:u),()=>C("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:o,assignee:a})}),"Reassigning");return}if(c){c.assignee=s.value;try{localStorage.setItem("nm-for",s.value)}catch{}ft()}}),f.addEventListener("input",t=>{const e=t.target.closest(".dt-suggest-input");if(e&&c?.suggest){c.suggest.to=e.value,ft(),tn(e);return}const n=t.target.closest(".dt-note-input, .dt-note-reply-input, .dt-note-edit-input");n&&(Go(n),n.classList.contains("dt-note-input")?c&&(c.text=n.value):n.classList.contains("dt-note-edit-input")?x&&(x.text=n.value):U=n.value,ft(),n.closest(".dt-compose")?.querySelector(".dt-send")?.classList.toggle("is-ready",n.value.trim()!==""),tn(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(),ws(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,s=Number(e.dataset.id);if(n==="share"){const o=e.dataset.v==="1";s?rt(a=>a.map(l=>l.id===s?{...l,shared:o||void 0}:l),()=>C("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:s,shared:o})}),o?"Sharing with the client":"Keeping it to the team"):c&&(c.shared=o||void 0,ft(),h());return}if(n==="prio"){const o=e.dataset.v||null;s?rt(a=>a.map(l=>l.id===s?{...l,priority:o??void 0}:l),()=>C("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:s,priority:o})}),"Setting the priority"):c&&(c.priority=o??void 0,ft(),h());return}if(n==="mention"){const o=e.closest(".dt-compose")?.querySelector("textarea");o&&ws(o,e.dataset.handle);return}if(!n){if(v=v===s?null:s,v!=null&&e.dataset.off){const o=b.find(l=>l.id===s);(o&&Y(o))?.scrollIntoView({block:"nearest",inline:"center",behavior:"smooth"})}V(),h();return}if(n==="record"){xo(e.closest(".dt-note"));return}if(n==="speak"){Co(e.closest(".dt-note"),e);return}if(n==="voice-write"){qo(e);return}if(n==="voice"||n==="voice-seek"){wo(e,n==="voice-seek"?t:null);return}if(n==="attach"){const o=Object.assign(document.createElement("input"),{type:"file",accept:"image/*",multiple:!0}),a=e.closest(".dt-note");o.addEventListener("change",()=>{o.files?.length&&Qe([...o.files],a)}),o.click();return}if(n==="unshot"){s?x&&x.drop.push(e.dataset.img):(e.closest("[data-draft]")?c?.images??[]:z).splice(Number(e.dataset.i),1),h(),x&&$s();return}if(n==="edit"){const o=b.find(u=>u.id===s),a=e.dataset.at||null,l=a?o?.replies?.find(u=>u.at===a)?.text:o?.text;if(l===void 0)return;x={id:s,at:a,text:l,drop:[]},h(),$s();return}if(n==="edit-cancel"){x=null,h();return}if(n==="edit-save"){const o=x;if(!o)return;const a=o.text.trim();if(!a){f.querySelector(".dt-note-edit-input")?.focus();return}x=null;const l=u=>o.drop.includes(u.split("/").pop());await rt(u=>u.map(i=>i.id!==o.id?i:{...i,...o.at==null?{text:a}:{replies:(i.replies??[]).map(r=>r.at===o.at?{...r,text:a}:r)},images:(i.images??[]).filter(r=>!l(r))}),()=>C("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:o.id,edit:{at:o.at,text:a},...o.drop.length?{removeImage:o.drop}:{}})}).then(u=>(u.ok||(x=o),u)),"Saving the edit");return}if(n==="cancel"){V(),h();return}if(n==="twin"){V(),v=Number(e.dataset.id),h();return}if(n==="discard"){c=null,h();return}if(n==="draft-open"){Ue(Number(e.dataset.i));return}if(n==="close"){v=null,h();return}if(n==="suggest"&&c){const o=Pn(Y(c));c.suggest={from:o,to:o},h();const a=f.querySelector(".dt-suggest-input");a?.focus(),a?.select();return}if(n==="unsuggest"&&c){c.suggest=null,h();return}if(n==="save"){if(!c)return;const o=c.suggest&&c.suggest.to.trim()!==c.suggest.from?{from:c.suggest.from,to:c.suggest.to.trim()}:null,a=f.querySelector(".dt-note-input").value.trim()||(o?"Change the text":"")||(c.images?.some(Pe)?Qn:"");if(!a){f.querySelector(".dt-note-input")?.focus();return}const l=c,u=bs.get(l)??Ze(Y(l)),i={...l,route:_,text:a,suggest:o,assignee:p.client?l.assignee||p.lead||void 0:l.assignee??re(),shared:p.client?!0:l.shared===!0,stage:p.client?"new":l.stage??(K(l.assignee??re())?"approved":"new"),breakpoint:dt(),browser:Zs(),device:w?Es:"",viewport:{w:innerWidth,h:innerHeight},logs:fa(),host:location.host},r={...l,id:-Date.now(),text:a,route:_,status:"open",note:"",doneBy:null,breakpoint:i.breakpoint,replies:[],images:[],createdAt:new Date().toISOString(),...o?{suggest:o}:{},by:p.me?.email,byName:p.me?.name};b=[...b,r],c=null,h();const m=await u,E=await C("comments",{method:"POST",headers:{"content-type":"application/json"},body:JSON.stringify({...i,...m?{before:m}:{}})});if(!E.ok){b=b.filter($=>$!==r),c=l,h(),O(`Comment was not saved (${E.status}).`);return}const d=Wt([await E.json().catch(()=>null)])[0];b=b.map($=>$===r&&d?d:$),h(),he();return}if(n==="reply"){const o=f.querySelector(".dt-note-reply-input"),a=o.value.trim()||(z.some(Pe)?Qn:"");if(!a){o.focus();return}const l=z;U="",z=[];const u=b;b=b.map(m=>m.id===s?{...m,replies:[...m.replies??[],{author:"you",text:a,at:new Date().toISOString(),by:p.me?.email}]}:m),h();const i=await C("comments",{method:"PATCH",headers:{"content-type":"application/json"},body:JSON.stringify({id:s,reply:a,images:l})});if(!i.ok){b=u,U=a,z=l,h(),O(`Reply was not sent (${i.status}).`);return}const r=Wt([await i.json().catch(()=>null)])[0];r&&(b=b.map(m=>m.id===r.id?r:m),h()),he();return}if(n==="hand"){io(s,e.dataset.v);return}v=null,n==="rm"?await os(s):await Tt(s,n==="done")});let Yt="overlay",xt="",Es="";const P=t=>{B.hidden||M.contentWindow?.postMessage({dt:!0,...t},location.origin)},Zo=()=>({notes:A,grid:!Zt.hidden,inspect:at,resolved:X,scrollbar:Yt,device:xt});addEventListener("message",t=>{if(t.origin!==location.origin||!t.data?.dt)return;const e=t.data;if(!w&&t.source===M.contentWindow){if(e.key){Bs(e.key[0],e.key[1])?.run();return}if(e.closeMenus){Bt();return}if(e.drafts){Ke=e.drafts,as(oe());return}}if(w&&typeof e.openDraft=="number"){Ue(e.openDraft);return}if(w&&typeof e.dropDraft=="number"){is(e.dropDraft);return}if(w&&typeof e.device=="string"&&(Es=e.device),w&&e.scrollbar&&document.documentElement.classList.toggle("dt-sb-classic",e.scrollbar==="classic"),e.hello&&t.source===M.contentWindow){P(Zo());return}typeof e.notes=="boolean"&&e.notes!==A&&mt(e.notes,!1),typeof e.open=="number"&&_e(e.open),typeof e.grid=="boolean"&&e.grid===Zt.hidden&&Le(e.grid),typeof e.inspect=="string"&&e.inspect!==at&&Qt(e.inspect),typeof e.resolved=="boolean"&&e.resolved!==X&&Ye(e.resolved),e.reload&&($t(),pe())});const he=async()=>{await $t(),pe(),P({reload:!0}),w&&parent.postMessage({dt:!0,reload:!0},location.origin)},mt=(t,e=!0)=>{if(A=t,Sn.setAttribute("aria-pressed",String(t)),t?!w&&W.hidden&&localStorage.getItem("dt-history")!=="0"&&(W.hidden=!1,te.setAttribute("aria-pressed","true")):(W.hidden=!0,te.setAttribute("aria-pressed","false")),J(kn,t?"1":"0"),P({notes:t}),w&&e&&parent.postMessage({dt:!0,notes:t},location.origin),f.hidden=!t||!B.hidden,document.documentElement.classList.toggle("dt-noting",t),t){Qt(""),document.addEventListener("click",hs,!0);for(const n of ps)document.addEventListener(n,gs,!0);document.addEventListener("keydown",ms),document.addEventListener("mousemove",us),addEventListener("scroll",ut,!0),addEventListener("resize",ut),ls.observe(document.body,{childList:!0,subtree:!0,characterData:!0}),ds.observe(document.body),$t()}else{V(),v=null,document.removeEventListener("click",hs,!0);for(const n of ps)document.removeEventListener(n,gs,!0);document.removeEventListener("keydown",ms),document.removeEventListener("mousemove",us),ht.hidden=!0,removeEventListener("scroll",ut,!0),removeEventListener("resize",ut),ls.disconnect(),ds.disconnect(),f.innerHTML=""}},fe="dt-w",en="dt-canvas",kt="dt-device";let pt=localStorage.getItem(en)==="1",L=localStorage.getItem(kt)||"";L&&!Xt(L)&&(L="",localStorage.setItem(kt,""));let N=Number(localStorage.getItem(fe))||0;const Ss="dt-emu";let j=(()=>{try{return JSON.parse(localStorage.getItem(Ss)||"null")}catch{return null}})();const be=()=>j?Ps.find(t=>t.id===j.id)??null:null,Qo=()=>{const t=be();return t?j.turned?{w:t.h,h:t.w}:{w:t.w,h:t.h}:null};let Jt=localStorage.getItem("dt-bars-min")==="1";const Ht=t=>{j=t,J(Ss,t?JSON.stringify(t):"")},nn=t=>{Mn.textContent=t,B.style.setProperty("--dt-badge-w",`${Mn.offsetWidth}px`)},Ls=t=>{if(!t){Rt.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 R)for(const s of[n.min,n.max])s>0&&Number.isFinite(s)&&s<=t&&(e+=`<span class="dt-edge" style="left:${s}px" title="${n.label} edge"></span>`);Rt.innerHTML=e,Rt.style.width=`${t}px`},sn=()=>{const t=parseFloat(T.style.width)||0,e=parseFloat(T.style.height)||0;if(!t||!e){T.style.transform="",delete T.dataset.scaled;return}const n=L||j?Math.min(1,(innerWidth-80)/t,(innerHeight-120)/e):Math.min(1,(innerWidth-80)/t);T.style.transform=n<1?`scale(${n})`:"",T.dataset.scaled=n<1?String(Math.round(n*100)):""},ta=t=>Ps.find(e=>e.w===t.w&&e.h===t.h&&e.cutout?.shape==="pill")?.cutout,ye=()=>{try{return M.contentDocument}catch{return null}},Ts=()=>ye()?.title.split("\u2014").pop()?.trim()||"",on=()=>{const t=ye(),e=L?Xt(L):null;if(!t?.body||!e)return;const n=ha(t),s=e.browser==="chrome-android"?n.theme||"rgb(255, 255, 255)":n.top,o=e.browser==="chrome-android"?"rgb(255, 255, 255)":n.bottom;T.style.setProperty("--dt-top",s),T.style.setProperty("--dt-top-ink",js(s)),T.style.setProperty("--dt-bottom",o),T.style.setProperty("--dt-bottom-ink",js(o));const a=qt.querySelector(".dt-win-tab > span");a&&(a.textContent=Ts()||location.host)};let an=0;M.addEventListener("load",()=>{ye()&&(on(),M.contentWindow?.addEventListener("scroll",()=>{an||(an=requestAnimationFrame(()=>{an=0,on()}))},{passive:!0}))});for(const t of[qt,ee])t.addEventListener("click",e=>{const n=e.target.closest("[data-nav]")?.dataset.nav;if(n)try{const s=M.contentWindow?.navigation;if(!ye()||!s)throw new Error("foreign");n==="back"?s.canGoBack&&s.back():n==="fwd"?s.canGoForward&&s.forward():s.reload()}catch{(n==="reload"||n==="back")&&(M.src=location.href)}});It.addEventListener("click",()=>{Jt=!Jt,J("dt-bars-min",Jt?"1":"0"),lt()});const lt=()=>{if(w)return;const t=L?Xt(L)??null:null;if(L&&!t&&(L="",localStorage.setItem(kt,"")),!t&&!pt){B.hidden=!0,M.removeAttribute("src"),document.documentElement.classList.remove("dt-framing"),f.hidden=!A,Rt.innerHTML="",Ot(),Ne.hidden=!0,It.hidden=!0,it=null,xt="",Ke=[],Ot(),dn(),A?$t():h();return}if(B.hidden=!1,document.documentElement.classList.add("dt-framing"),f.hidden=!0,M.src||(M.src=location.href),t){const e=ga(t,{host:location.host,title:Ts(),now:new Date,min:Jt,cutout:ta(t)}),{screen:n}=e;B.dataset.mode="device",T.dataset.shell=t.shell,T.dataset.browser=t.browser,T.style.width=`${e.footprint.w}px`,T.style.height=`${e.footprint.h}px`,T.style.setProperty("--dt-r",`${n.r}px`),T.style.setProperty("--dt-rb",`${n.rb}px`),Ln.innerHTML=e.shell;const s=(l,u,i,r)=>{l.innerHTML=r,l.style.cssText=`left:${n.x}px;top:${u}px;width:${n.w}px;height:${i}px`};s(qt,n.y,e.topH,e.top),s(ee,n.y+n.h-e.bottomH,e.bottomH,e.bottom);const o=n.h-e.topH-e.bottomH;M.style.position="absolute",M.style.left=`${n.x}px`,M.style.top=`${n.y+e.topH}px`,M.style.width=`${n.w}px`,M.style.height=`${o}px`,Rt.innerHTML="";const a=Jt&&e.canMinimize;Yt=e.scrollbar,xt=`${t.label}${a?" \xB7 bars folded":""}`,it=Ct(t.w),P({notes:A,scrollbar:Yt,device:xt}),It.hidden=!e.canMinimize,It.setAttribute("aria-pressed",String(a)),nn(`${t.label} \xB7 page ${t.w}\xD7${o} of ${t.w}\xD7${t.h}${a?" \xB7 bars folded":""} \xB7 ${R.find(l=>l.id===it)?.label??""}`),on()}else{const e=Qo();e||Ht(null);const n=e?.w||N||R.find(a=>a.id===dt()).ideal;N=n,B.dataset.mode="canvas",delete T.dataset.shell,delete T.dataset.browser,Ln.innerHTML=qt.innerHTML=ee.innerHTML="",qt.style.cssText=ee.style.cssText="",It.hidden=!0,Yt="overlay",T.style.width=`${n}px`,T.style.height=`${e?.h??innerHeight-84}px`,M.style.position="",M.style.left=M.style.top="",M.style.width="100%",M.style.height="100%",Ls(n),P({notes:A});const s=R.find(a=>a.id===Ct(n)),o=be();xt=o?`${o.label}${j?.turned?" \xB7 landscape":""}`:"",P({scrollbar:Yt,device:xt}),nn(o&&e?`${o.label} \xB7 ${e.w}\xD7${e.h} \xB7 ${s.label}`:`${n}px \xB7 ${s.label}`),it=Ct(n)}Ne.hidden=!(be()?.rotates&&!t),dn(),sn(),Ot(),A?$t():h()},rn=t=>{const e=R.find(n=>n.id===t);L="",localStorage.setItem(kt,""),Ht(null),pt=t!==Ee,N=pt?e.ideal:0,it=pt?t:null,localStorage.setItem(en,pt?"1":"0"),localStorage.setItem(fe,String(N)),v=null,V(),lt()};for(const t of He)t.addEventListener("click",()=>rn(t.dataset.bp));for(const t of document.querySelectorAll("[data-device]"))t.addEventListener("click",()=>{L=t.dataset.device===L?"":t.dataset.device,localStorage.setItem(kt,L),G.open=!1,lt()});for(const t of document.querySelectorAll("[data-emu]"))t.addEventListener("click",()=>{const e=j?.id===t.dataset.emu&&!L;L="",localStorage.setItem(kt,""),Ht(e?null:{id:t.dataset.emu,turned:!1}),pt=!e,N=0,localStorage.setItem(en,pt?"1":"0"),it=null,v=null,V(),G.open=!1,lt()});Ne.addEventListener("click",()=>{j&&(Ht({...j,turned:!j.turned}),v=null,V(),lt())});const Ms=[...G.querySelectorAll("[data-tab]")],ea=[...G.querySelectorAll("[data-panel]")],xs=t=>{for(const e of Ms)e.setAttribute("aria-selected",String(e.dataset.tab===t));for(const e of ea)e.hidden=e.dataset.panel!==t;J("dt-devices-tab",t)};for(const t of Ms)t.addEventListener("click",()=>xs(t.dataset.tab));xs(localStorage.getItem("dt-devices-tab")==="devtools"?"devtools":"preview");const ln=G.querySelector(".dt-emu-search");ln.addEventListener("input",()=>{const t=ln.value.trim().toLowerCase();let e=null,n=!1;const s=()=>{e&&(e.hidden=!n)};for(const o of ln.parentElement.children){if(o.classList.contains("dt-devices-group")){s(),e=o,n=!1;continue}o.dataset.emu&&(o.hidden=!!t&&!o.textContent.toLowerCase().includes(t),n||=!o.hidden)}s()});const na=G.querySelector(".dt-devices-name");function dn(){for(const e of G.querySelectorAll("[data-device]"))e.setAttribute("aria-pressed",String(e.dataset.device===L));const t=!L&&!B.hidden?j?.id:void 0;for(const e of G.querySelectorAll("[data-emu]"))e.setAttribute("aria-pressed",String(e.dataset.emu===t));na.textContent=L&&Xt(L)?.label||t&&be()?.label||"Device"}const cn=t=>R.find(e=>e.id===t),sa=t=>{const e=cn(it??dt());return Math.max(e.min||320,Math.min(Number.isFinite(e.max)?e.max:2560,Math.round(t)))};for(const t of Js){const e=t.dataset.edge==="l"?-1:1;t.addEventListener("pointerdown",n=>{if(L)return;n.preventDefault(),j&&(Ht(null),lt()),t.setPointerCapture(n.pointerId);const s=n.clientX,o=N,a=Number(T.dataset.scaled||100)/100;B.dataset.dragging="1";const l=i=>{N=sa(o+e*(i.clientX-s)*2/a),T.style.width=`${N}px`,Ls(N),nn(`${N}px \xB7 ${cn(Ct(N)).label}`),sn()},u=()=>{t.removeEventListener("pointermove",l),t.removeEventListener("pointerup",u),delete B.dataset.dragging,localStorage.setItem(fe,String(N)),lt()};t.addEventListener("pointermove",l),t.addEventListener("pointerup",u)}),t.addEventListener("dblclick",()=>{if(L)return;Ht(null);const n=cn(it??dt()),s=[n.min||320,Number.isFinite(n.max)?n.max:n.ideal];N=Math.abs(N-s[0])<Math.abs(N-s[1])?s[0]:s[1],localStorage.setItem(fe,String(N)),lt()})}let ks=dt();addEventListener("resize",()=>{Ot(),dt()!==ks&&(ks=dt(),h()),B.hidden||(!L&&!j&&(T.style.height=`${innerHeight-84}px`),sn())});const Hs="dt-studio",As=t=>{Ae.setAttribute("aria-pressed",String(t)),document.documentElement.classList.toggle("dt-no-studio",!t),J(Hs,t?"1":"0")};Ae.addEventListener("click",()=>As(Ae.getAttribute("aria-pressed")!=="true")),As(localStorage.getItem(Hs)!=="0"),Sn.addEventListener("click",()=>mt(!A));const At=document.querySelector(".devtools"),Gt=document.querySelector(".dt-tab"),Ns=t=>{At.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 At.querySelectorAll(".dt-group"))e.inert=t;t&&Bt(),J("dt-collapsed",t?"1":"0")};Gt.addEventListener("click",()=>Ns(!At.hasAttribute("data-collapsed")));const un=document.querySelector(".dt-keys"),tt=t=>()=>At.querySelector(t)?.click(),Cs=t=>()=>{const e=[...document.querySelectorAll(".dt-pages a")];e[e.findIndex(n=>n.hasAttribute("aria-current"))+t]?.click()},ve=[{group:"Comments",code:"KeyC",hint:"C",label:"Comment mode",el:".dt-notes-btn",run:tt(".dt-notes-btn")},{group:"Comments",code:"KeyC",shift:!0,hint:"\u21E7C",label:"Comments panel",el:".dt-history-btn",run:tt(".dt-history-btn")},{group:"Comments",code:"KeyR",hint:"R",label:"Show resolved",el:".dt-resolved-btn",run:tt(".dt-resolved-btn")},{group:"Inspect",code:"KeyG",hint:"G",label:"Grid",el:".dt-grid-btn",run:tt(".dt-grid-btn")},{group:"Inspect",code:"KeyP",hint:"P",label:"Spacing",el:".dt-pad-btn",run:tt(".dt-pad-btn")},{group:"Inspect",code:"KeyS",hint:"S",label:"Size",el:".dt-size-btn",run:tt(".dt-size-btn")},{group:"Inspect",code:"KeyT",hint:"T",label:"Typography",el:".dt-type-btn",run:tt(".dt-type-btn")},{group:"Inspect",code:"KeyO",hint:"O",label:"Color",el:".dt-color-btn",run:tt(".dt-color-btn")},{group:"Inspect",code:"KeyB",hint:"B",label:"Border & radius",el:".dt-border-btn",run:tt(".dt-border-btn")},...p.sanity?[{group:"Inspect",code:"KeyE",hint:"E",label:"Sanity overlay",el:".dt-studio-btn",run:tt(".dt-studio-btn")}]:[],...He.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:Cs(-1)},{group:"View",code:"BracketRight",hint:"]",label:"Next page",run:Cs(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:()=>{un.open=!un.open}}].filter(t=>!p.client||t.group!=="Inspect"),Bs=(t,e)=>ve.find(n=>n.code===t&&!n.shift==!e),oa=t=>t instanceof HTMLElement&&(t.isContentEditable||/^(INPUT|TEXTAREA|SELECT)$/.test(t.tagName)||!!t.closest('[role="menu"], [role="listbox"], [role="dialog"][aria-modal="true"], [role="combobox"]'));if(p.shortcuts){for(const e of ve){const n=e.el&&At.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(un.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(ve.map(e=>e.group))].map(e=>`<p class="dt-devices-group">${e}</p>`+ve.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||oa(e.target))return;const n=Bs(e.code,e.shiftKey);n&&(e.preventDefault(),w?parent.postMessage({dt:!0,key:[e.code,e.shiftKey]},location.origin):n.run())}),w){const e=()=>parent.postMessage({dt:!0,closeMenus:!0},location.origin);document.addEventListener("pointerdown",e,!0),document.addEventListener("keydown",n=>{n.key==="Escape"&&e()})}}if(!w){Ns(localStorage.getItem("dt-collapsed")==="1"),requestAnimationFrame(()=>requestAnimationFrame(()=>At.setAttribute("data-ready",""))),pt||L?lt():dn(),Le(localStorage.getItem(bn)==="1");const t=localStorage.getItem(wn);t&&t in xe&&Qt(t),mt(localStorage.getItem(kn)==="1")}const qs=()=>{try{const t=JSON.parse(localStorage.getItem(St)||"null");I=(t?.parked??[]).filter(e=>ne(e)),t?.draft&&document.querySelector(t.draft.selector)?(c=t.draft,!A&&!w&&mt(!0)):ne(t?.draft)&&I.push(t.draft),t?.reply?.text&&(U=t.reply.text,Dt=v=t.reply.for??null),(c||I.length||U)&&h()}catch{localStorage.removeItem(St)}};qs();const Rs=()=>setTimeout(()=>{const t=Se(location.pathname);t!==_&&(clearTimeout(se),qe(),_=t,St=Hn(),c=null,I=[],U="",Dt=null,v=null,x=null,b=[],vn(),qs(),$t())});for(const t of["pushState","replaceState"]){const e=window.history[t];window.history[t]=function(...n){e.apply(this,n),Rs()}}addEventListener("popstate",Rs),A||$t(),pe().then(()=>{ue()&&me()}),document.addEventListener("visibilitychange",()=>{document.hidden||Vt()}),addEventListener("focus",Vt),addEventListener("notemend:changed",()=>{w||Vt()});let aa=0;w||setInterval(()=>{(!ma.live||++aa%6===0)&&Vt()},2e4),w&&parent.postMessage({dt:!0,hello:!0},location.origin)}export{Na as run};
|
package/src/store/thread.mjs
CHANGED
|
@@ -1 +1 @@
|
|
|
1
|
-
const h=["before","after"],i=e=>/(?:^|\/)(before|after)-[^/]*$/.exec(String(e))?.[1]??null,A=e=>{const t={};for(const n of e?.images||[]){const o=i(n);o&&(t[o]=n)}return t},y=e=>{const t=[{author:"you",text:e.text,at:e.createdAt,by:e.by,byName:e.byName,images:[]},...e.note?[{author:"claude",text:e.note,at:e.updatedAt,images:[]}]:[],...(e.replies||[]).map(n=>({...n,images:[]}))];for(const n of e.images||[]){if(i(n))continue;const o=Number(/-(\d+)\.\w+$/.exec(n)?.[1]);let r=0;t.forEach((s,p)=>{Date.parse(s.at)<=o&&(r=p)}),t[r].images.push(n)}return t},b=e=>e.nickname||e.name||e.email,C=(e,t)=>{const n=String(e||"").toLowerCase();return n.includes("@")?[...new Set(t.filter(o=>[o.name,o.nickname,o.email].some(r=>{if(!r)return!1;const s=n.indexOf("@"+r.toLowerCase());return s!==-1&&!/[\p{L}\p{N}_.-]/u.test(n[s+r.length+1]??"")})).map(o=>o.email))]:[]},l={claude:"Claude",codex:"Codex",gemini:"Gemini",cursor:"Cursor",copilot:"Copilot",windsurf:"Windsurf",amp:"Amp",aider:"Aider",opencode:"OpenCode",agent:"AI agent"},u=e=>l[e]||(e?"AI agent":"Claude"),a=e=>typeof e=="string"&&e.startsWith("agent:")?e.slice(6):null,d=e=>e==="claude"||a(e)!=null,g=/^[^\s@]+@[^\s@]+$/,O=e=>{if(e==="claude")return e;if(typeof e!="string"||e.length>210)return null;const t=e.toLowerCase();return g.test(a(t)??t)?t:null},m=["new","approved","review"],c=e=>m.includes(e?.stage)?e.stage:d(e?.assignee)?"approved":"new",k=(e,t)=>{const n=a(e.assignee);return c(e)==="approved"&&(!e.assignee||e.assignee==="claude"||n!=null&&(t===void 0||n===t))&&!w(e)},S=(e,t,n=o=>o)=>u(e)+(t?` \xB7 ${n(t)}`:""),f=2*36e5,N=(e,t=Date.now())=>e?.working&&e.status!=="done"&&t-Date.parse(e.working.at)<f?e.working:null,x=e=>/@guest\.notemend\.com$/i.test(String(e||"")),w=e=>x(e.by)&&!e.approvedBy,L={plugin:"Claude Code: /plugin \u2192 Installed \u2192 notemend \u2192 Update now, then /reload-plugins",npx:'run it as npx -y notemend@latest (npx keeps an old copy of plain "notemend"), then restart the agent',project:"npm i -D notemend@latest in the site, then restart the agent",desktop:"Claude Desktop: download app.notemend.com/notemend.mcpb again and open it",source:"pull the notemend repository"},D=(e,t)=>{const n=String(e).split(".").map(Number),o=String(t).split(".").map(Number);for(let r=0;r<3;r++)if((n[r]||0)!==(o[r]||0))return(n[r]||0)>(o[r]||0);return!1};export{l as AGENTS,h as FRAMES,m as STAGES,L as UPDATE_HOW,f as WORKING_TTL,S as agentLabel,u as agentName,a as agentOwner,O as cleanAssignee,k as forAgentOf,i as frameOf,A as framesOf,b as handleOf,w as held,x as isGuest,C as mentionsIn,D as newer,c as stageOf,y as threadOf,d as toAgent,N as workingOn};
|
|
1
|
+
const h=["before","after"],i=e=>/(?:^|\/)(before|after)-[^/]*$/.exec(String(e))?.[1]??null,A=e=>{const t={};for(const n of e?.images||[]){const o=i(n);o&&(t[o]=n)}return t},y=e=>{const t=[{author:"you",text:e.text,at:e.createdAt,by:e.by,byName:e.byName,images:[]},...e.note?[{author:"claude",text:e.note,at:e.updatedAt,images:[]}]:[],...(e.replies||[]).map(n=>({...n,images:[]}))];for(const n of e.images||[]){if(i(n))continue;const o=Number(/-(\d+)\.\w+$/.exec(n)?.[1]);let r=0;t.forEach((s,p)=>{Date.parse(s.at)<=o&&(r=p)}),t[r].images.push(n)}return t},b=e=>e.nickname||e.name||e.email,C=(e,t)=>{const n=String(e||"").toLowerCase();return n.includes("@")?[...new Set(t.filter(o=>[o.name,o.nickname,o.email].some(r=>{if(!r)return!1;const s=n.indexOf("@"+r.toLowerCase());return s!==-1&&!/[\p{L}\p{N}_.-]/u.test(n[s+r.length+1]??"")})).map(o=>o.email))]:[]},l={claude:"Claude",codex:"Codex",gemini:"Gemini",cursor:"Cursor",copilot:"Copilot",windsurf:"Windsurf",amp:"Amp",aider:"Aider",opencode:"OpenCode",agent:"AI agent"},u=e=>l[e]||(e?"AI agent":"Claude"),a=e=>typeof e=="string"&&e.startsWith("agent:")?e.slice(6):null,d=e=>e==="claude"||a(e)!=null,g=/^[^\s@]+@[^\s@]+$/,O=e=>{if(e==="claude")return e;if(typeof e!="string"||e.length>210)return null;const t=e.toLowerCase();return g.test(a(t)??t)?t:null},m=["new","approved","progress","review"],c=e=>m.includes(e?.stage)?e.stage:d(e?.assignee)?"approved":"new",k=(e,t)=>{const n=a(e.assignee);return c(e)==="approved"&&(!e.assignee||e.assignee==="claude"||n!=null&&(t===void 0||n===t))&&!w(e)},S=(e,t,n=o=>o)=>u(e)+(t?` \xB7 ${n(t)}`:""),f=2*36e5,N=(e,t=Date.now())=>e?.working&&e.status!=="done"&&t-Date.parse(e.working.at)<f?e.working:null,x=e=>/@guest\.notemend\.com$/i.test(String(e||"")),w=e=>x(e.by)&&!e.approvedBy,L={plugin:"Claude Code: /plugin \u2192 Installed \u2192 notemend \u2192 Update now, then /reload-plugins",npx:'run it as npx -y notemend@latest (npx keeps an old copy of plain "notemend"), then restart the agent',project:"npm i -D notemend@latest in the site, then restart the agent",desktop:"Claude Desktop: download app.notemend.com/notemend.mcpb again and open it",source:"pull the notemend repository"},D=(e,t)=>{const n=String(e).split(".").map(Number),o=String(t).split(".").map(Number);for(let r=0;r<3;r++)if((n[r]||0)!==(o[r]||0))return(n[r]||0)>(o[r]||0);return!1};export{l as AGENTS,h as FRAMES,m as STAGES,L as UPDATE_HOW,f as WORKING_TTL,S as agentLabel,u as agentName,a as agentOwner,O as cleanAssignee,k as forAgentOf,i as frameOf,A as framesOf,b as handleOf,w as held,x as isGuest,C as mentionsIn,D as newer,c as stageOf,y as threadOf,d as toAgent,N as workingOn};
|