@visulima/dev-toolbar 1.0.0-alpha.4 → 1.0.0-alpha.5

package/CHANGELOG.md

@@ -1,3 +1,50 @@
+## @visulima/dev-toolbar [1.0.0-alpha.5](https://github.com/visulima/visulima/compare/@visulima/dev-toolbar@1.0.0-alpha.4...@visulima/dev-toolbar@1.0.0-alpha.5) (2026-03-06)
+
+### Features
+
+* **dev-toolbar:** add assets app export and make axe-core an optional peer dependency ([812bc8d](https://github.com/visulima/visulima/commit/812bc8d45ef760862d43f59665e1f86c7d4a5008))
+* **dev-toolbar:** add singleton guard, SEO JSON-LD validation, editor preference, and tests ([7584425](https://github.com/visulima/visulima/commit/758442518f8390b1faa0fd553d7ed1aaa4d9c037))
+* **dev-toolbar:** implement iframe app rendering and custom app registration ([a1585a8](https://github.com/visulima/visulima/commit/a1585a8bd3624ae13b40fa386cd66b62c29ca08f))
+* **dev-toolbar:** keep inspector active after element click and fix UX issues ([8f7e88a](https://github.com/visulima/visulima/commit/8f7e88a874f6412a15bf2adde9ddd95948b07c22))
+* **dev-toolbar:** overhaul vite config app UI with env masking and improved layout ([7cfee9d](https://github.com/visulima/visulima/commit/7cfee9da5957fb9ffbcc940d9948909c4677efb6))
+* **dev-toolbar:** redesign vite config app with tabbed interface ([087df63](https://github.com/visulima/visulima/commit/087df630dc378933e54d1587d40c99f19fca0df0))
+* **dev-toolbar:** remove more overflow app ([cd3f369](https://github.com/visulima/visulima/commit/cd3f369c176c598d2e9a2bcdef194b7d457d343f))
+
+### Bug Fixes
+
+* **dev-toolbar:** move removePopupOutsideHandler declaration before first use ([d734a84](https://github.com/visulima/visulima/commit/d734a847b7f0b4574f081b9b78b2fce3d2b0e698))
+* **dev-toolbar:** resolve all ESLint errors across src files ([165b471](https://github.com/visulima/visulima/commit/165b471c95099bff76ba78d054664e79cfcdcb9a))
+* **dev-toolbar:** resolve ESLint errors in test files and config ([ea7e46c](https://github.com/visulima/visulima/commit/ea7e46c13db73431738a8f75febb847f3e7e530b))
+* **dev-toolbar:** resolve ESLint errors in vite-config app and RPC function ([fedce68](https://github.com/visulima/visulima/commit/fedce686ca59ba5d5b82cd10abfffa8d91a738c1))
+* **dev-toolbar:** split single-line mock factories to satisfy max-statements-per-line ([025b972](https://github.com/visulima/visulima/commit/025b9722b6e854cf1ae53694597e64c63493f730))
+* **dev-toolbar:** update packem to 2.0.0-alpha.54 ([f9779c9](https://github.com/visulima/visulima/commit/f9779c9e8dc7637db3bfef341cb66233469f653f))
+* removed old test ([bfa9e78](https://github.com/visulima/visulima/commit/bfa9e784b2e183ed481d432290070ee554b357ac))
+
+### Performance Improvements
+
+* **dev-toolbar:** replace tailwind-merge with clsx in cn() utility ([6c4740c](https://github.com/visulima/visulima/commit/6c4740c8ce890d955cecbf634dada65fd8a99769))
+
+### Documentation
+
+* **dev-toolbar:** add assets app documentation ([bea25b9](https://github.com/visulima/visulima/commit/bea25b96f7f7dbb2f3952b6c04d38d032569760d))
+* **dev-toolbar:** add iframe app documentation and remove more app references ([03dab85](https://github.com/visulima/visulima/commit/03dab85a92c5ee27b18db018c9dc263a1a3f1ea4))
+* **dev-toolbar:** add vite-overlay integration guide ([8f6f25a](https://github.com/visulima/visulima/commit/8f6f25aae43f0c32380ede56a93915897a4a939f))
+* **dev-toolbar:** update a11y docs to reflect optional axe-core peer dependency ([50396e8](https://github.com/visulima/visulima/commit/50396e8b18c56e716d119a468fa0b1219e789dff))
+* **dev-toolbar:** update built-in app docs for opt-in defaults and add SEO structured data section ([e95050a](https://github.com/visulima/visulima/commit/e95050aa419fe1a85664ccd5c88a3967de70b113))
+
+### Miscellaneous Chores
+
+* **dev-toolbar:** enable a11y in tanstack-start-cloudflare example and fix LICENSE whitespace ([e02cd3e](https://github.com/visulima/visulima/commit/e02cd3edf2426c709d8247cc77f999f56315438e))
+* **dev-toolbar:** update dependencies ([1be313b](https://github.com/visulima/visulima/commit/1be313bf37cd32739ddbb275e1af58dcf029e9a1))
+* **dev-toolbar:** update examples to enable assets and inspector apps ([b3dc74d](https://github.com/visulima/visulima/commit/b3dc74d999acbfe4ee564a141dea47cf5ea2f71a))
+* update dependencies and fix vite-react-rolldown example ([8811909](https://github.com/visulima/visulima/commit/8811909e90877b0041e4b08cdd797d58749464e9))
+* year update ([47f4105](https://github.com/visulima/visulima/commit/47f410596ce7190cfea36a073db32e0cec50bbcd))
+
+### Code Refactoring
+
+* **dev-toolbar:** replace cn wrapper with direct clsx imports ([6ac069b](https://github.com/visulima/visulima/commit/6ac069bf0f2e772f0a5626a47d9034b824a5b23a))
+* **dev-toolbar:** replace cn() wrapper with clsx() directly ([e774b36](https://github.com/visulima/visulima/commit/e774b367f9270dd9e43fcf0b7147a8cd23a1734a))
+
 ## @visulima/dev-toolbar [1.0.0-alpha.4](https://github.com/visulima/visulima/compare/@visulima/dev-toolbar@1.0.0-alpha.3...@visulima/dev-toolbar@1.0.0-alpha.4) (2026-03-04)
 
 ### Bug Fixes

package/LICENSE.md

@@ -1,6 +1,6 @@
 MIT License
 
-Copyright (c) 2025 visulima
+Copyright (c) 2026 visulima
 
 Permission is hereby granted, free of charge, to any person obtaining a copy
 of this software and associated documentation files (the "Software"), to deal
@@ -24,9 +24,116 @@ SOFTWARE.
 
 # Licenses of bundled dependencies
 The published @visulima/dev-toolbar artifact additionally contains code with the following licenses:
-ISC
+ISC, MIT
 
 # Bundled dependencies:
+## @babel/helper-string-parser
+License: MIT
+By: The Babel Team
+Repository: https://github.com/babel/babel.git
+
+> MIT License
+>
+> Copyright (c) 2014-present Sebastian McKenzie and other contributors
+>
+> Permission is hereby granted, free of charge, to any person obtaining
+> a copy of this software and associated documentation files (the
+> "Software"), to deal in the Software without restriction, including
+> without limitation the rights to use, copy, modify, merge, publish,
+> distribute, sublicense, and/or sell copies of the Software, and to
+> permit persons to whom the Software is furnished to do so, subject to
+> the following conditions:
+>
+> The above copyright notice and this permission notice shall be
+> included in all copies or substantial portions of the Software.
+>
+> THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+> EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+> MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+> NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+> LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+> OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+> WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+---------------------------------------
+
+## @babel/helper-validator-identifier
+License: MIT
+By: The Babel Team
+Repository: https://github.com/babel/babel.git
+
+> MIT License
+>
+> Copyright (c) 2014-present Sebastian McKenzie and other contributors
+>
+> Permission is hereby granted, free of charge, to any person obtaining
+> a copy of this software and associated documentation files (the
+> "Software"), to deal in the Software without restriction, including
+> without limitation the rights to use, copy, modify, merge, publish,
+> distribute, sublicense, and/or sell copies of the Software, and to
+> permit persons to whom the Software is furnished to do so, subject to
+> the following conditions:
+>
+> The above copyright notice and this permission notice shall be
+> included in all copies or substantial portions of the Software.
+>
+> THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+> EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+> MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+> NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+> LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+> OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+> WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+---------------------------------------
+
+## @babel/types
+License: MIT
+By: The Babel Team
+Repository: https://github.com/babel/babel.git
+
+> MIT License
+>
+> Copyright (c) 2014-present Sebastian McKenzie and other contributors
+>
+> Permission is hereby granted, free of charge, to any person obtaining
+> a copy of this software and associated documentation files (the
+> "Software"), to deal in the Software without restriction, including
+> without limitation the rights to use, copy, modify, merge, publish,
+> distribute, sublicense, and/or sell copies of the Software, and to
+> permit persons to whom the Software is furnished to do so, subject to
+> the following conditions:
+>
+> The above copyright notice and this permission notice shall be
+> included in all copies or substantial portions of the Software.
+>
+> THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND,
+> EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF
+> MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND
+> NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE
+> LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION
+> OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION
+> WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+---------------------------------------
+
+## clsx
+License: MIT
+By: Luke Edwards
+Repository: lukeed/clsx
+
+> MIT License
+>
+> Copyright (c) Luke Edwards <luke.edwards05@gmail.com> (lukeed.com)
+>
+> Permission is hereby granted, free of charge, to any person obtaining a copy of this software and associated documentation files (the "Software"), to deal in the Software without restriction, including without limitation the rights to use, copy, modify, merge, publish, distribute, sublicense, and/or sell copies of the Software, and to permit persons to whom the Software is furnished to do so, subject to the following conditions:
+>
+> The above copyright notice and this permission notice shall be included in all copies or substantial portions of the Software.
+>
+> THE SOFTWARE IS PROVIDED "AS IS", WITHOUT WARRANTY OF ANY KIND, EXPRESS OR IMPLIED, INCLUDING BUT NOT LIMITED TO THE WARRANTIES OF MERCHANTABILITY, FITNESS FOR A PARTICULAR PURPOSE AND NONINFRINGEMENT. IN NO EVENT SHALL THE AUTHORS OR COPYRIGHT HOLDERS BE LIABLE FOR ANY CLAIM, DAMAGES OR OTHER LIABILITY, WHETHER IN AN ACTION OF CONTRACT, TORT OR OTHERWISE, ARISING FROM, OUT OF OR IN CONNECTION WITH THE SOFTWARE OR THE USE OR OTHER DEALINGS IN THE SOFTWARE.
+
+---------------------------------------
+
 ## lucide-static
 License: ISC
 Repository: https://github.com/lucide-icons/lucide.git

package/dist/apps/a11y/a11y-app.d.ts

@@ -1,4 +1,3 @@
-/** @jsxImportSource preact */
 import type { ComponentChildren } from "preact";
 import type { AppComponentProps } from "../../types/app.d.ts";
 declare const A11yApp: (_props: AppComponentProps) => ComponentChildren;

package/dist/apps/a11y/a11y-tooltip.d.ts

@@ -1,4 +1,3 @@
-/** @jsxImportSource preact */
 import type { ComponentChildren } from "preact";
 import type { AppTooltipProps } from "../../types/app.d.ts";
 /**

package/dist/apps/a11y/index.js

@@ -1,2 +1,21 @@
-var X=Object.defineProperty;var O=(n,e)=>X(n,"name",{value:e,configurable:!0});import Y from"lucide-static/icons/accessibility.svg?raw";import{addHookName as k}from"preact/devtools";import{useState as C,useEffect as L}from"preact/hooks";import d from"../../packem_shared/cn-DWLJYh3h.js";import{jsxs as i,jsx as t,Fragment as W}from"preact/jsx-runtime";import S from"../../packem_shared/Button-DODNCTPZ.js";import{Alert as Z,AlertDescription as ee}from"../../packem_shared/Alert-H-x1JuZ0.js";var te=Object.defineProperty,x=O((n,e)=>te(n,"name",{value:e,configurable:!0}),"i$3");const E=["critical","serious","moderate","minor"],re={critical:"rgb(239,68,68)",minor:"rgb(100,116,139)",moderate:"rgb(249,115,22)",serious:"rgb(234,179,8)"},se={"best-practice":["best-practice"],wcag2a:["wcag2a"],wcag21aa:["wcag2a","wcag2aa","wcag21a","wcag21aa"],wcag22aa:["wcag2a","wcag2aa","wcag21a","wcag21aa","wcag22a","wcag22aa"]},_="__vdt_a11y__",ae=x(()=>{try{const n=sessionStorage.getItem(_);if(n){const e=JSON.parse(n);if(Array.isArray(e.issues))return{issues:e.issues,lastScan:e.lastScan??void 0}}}catch{}return{issues:[],lastScan:void 0}},"loadFromSession"),z=x((n,e)=>{const a=n;a.dataset.vdtA11y=e,a.style.setProperty("outline",`2px solid ${re[e]}`,"important"),a.style.setProperty("outline-offset","2px","important")},"setHighlight"),N=x(()=>{for(const n of document.querySelectorAll("[data-vdt-a11y]")){const e=n;delete e.dataset.vdtA11y,e.style.removeProperty("outline"),e.style.removeProperty("outline-offset")}},"clearHighlightsDOM"),B=x(n=>{N();for(const e of n)for(const a of e.nodes)try{const r=document.querySelector(a.selector);r&&z(r,e.impact)}catch{}},"applyOverlaysDOM"),ne=x(n=>{const e=n.at(-1);return Array.isArray(e)?e.join(" "):String(e??"")},"nodeSelector"),ie=x((n,e)=>{const a=[];for(const r of n)e.includes(r.id)||a.push({helpUrl:r.helpUrl,id:r.id,impact:r.impact??"minor",message:r.help,nodes:r.nodes.map(o=>({html:o.html,selector:ne(o.target)})),wcagTags:r.tags.filter(o=>o.startsWith("wcag")||o==="best-practice")});return a},"convertViolations"),oe=x(async n=>{const e=await import("axe-core"),a=typeof e.default?.run=="function"?e.default:e;if(typeof a.run!="function")throw new TypeError("axe-core could not be loaded — .run is not available");return a.run(document,{exclude:[["dev-toolbar"]],runOnly:{type:"tag",values:se[n]}})},"runAxeScan");class le{static{O(this,"v")}static{x(this,"A11yStore")}listeners=new Set;state;constructor(){const{issues:e,lastScan:a}=ae();this.state={isScanning:!1,issues:e,lastScan:a,scanError:void 0,showOverlays:!1,standard:"wcag21aa"}}clearHighlights(){N()}getState(){return this.state}highlightIssue(e){N();let a=!1;for(const r of e.nodes)try{const o=document.querySelector(r.selector);o&&(z(o,e.impact),a||(o.scrollIntoView({behavior:"smooth",block:"center"}),a=!0))}catch{}}async scan(e=[]){if(!this.state.isScanning){this.update({isScanning:!0,scanError:void 0});try{const a=await oe(this.state.standard),r=ie(a.violations,e);this.update({isScanning:!1,issues:r,lastScan:new Date().toISOString()}),this.persist(),this.state.showOverlays&&B(r)}catch(a){this.update({isScanning:!1,scanError:a instanceof Error?a.message:String(a)})}}}setShowOverlays(e){this.update({showOverlays:e}),e?B(this.state.issues):N()}setStandard(e){this.update({standard:e})}subscribe(e){return this.listeners.add(e),()=>{this.listeners.delete(e)}}notify(){for(const e of this.listeners)e()}persist(){try{sessionStorage.setItem(_,JSON.stringify({issues:this.state.issues,lastScan:this.state.lastScan}))}catch{}}update(e){this.state={...this.state,...e},this.notify()}}const c=new le;var ce=Object.defineProperty,l=O((n,e)=>ce(n,"name",{value:e,configurable:!0}),"i$2");const I={critical:"Critical",minor:"Minor",moderate:"Moderate",serious:"Serious"},J={critical:"text-destructive",minor:"text-muted-foreground",moderate:"text-warning-foreground",serious:"text-warning-foreground"},de={critical:"bg-destructive/10 border-destructive/30",minor:"bg-foreground/4 border-border",moderate:"bg-warning/10 border-warning/30",serious:"bg-warning/10 border-warning/30"},ue={critical:"bg-destructive",minor:"bg-muted-foreground/50",moderate:"bg-warning",serious:"bg-warning"},ge=l(({count:n,isActive:e,onClick:a,severity:r})=>i("button",{class:d("flex flex-col items-center gap-1 px-3 py-2.5 border cursor-pointer transition-colors",e?"ring-1 ring-inset ring-primary/40":"hover:bg-foreground/6",de[r]),onClick:a,title:`${e?"Clear":"Filter by"} ${I[r]}`,type:"button",children:[t("span",{class:d("text-xl font-bold tabular-nums leading-none",J[r]),children:n}),t("span",{class:"text-[0.6rem] font-semibold uppercase tracking-wider text-muted-foreground",children:I[r]})]}),"SeverityBucket"),me=l(({isSelected:n,issue:e,onClick:a,onDisable:r})=>i("div",{class:d("p-3 border cursor-pointer transition-colors",n?"bg-foreground/6 border-primary/30":"border-border hover:bg-foreground/3"),onClick:a,children:[i("div",{class:"flex items-start gap-2 mb-1.5",children:[t("span",{class:d("mt-1 size-2 rounded-full shrink-0",ue[e.impact])}),t("span",{class:"text-[0.75rem] font-semibold text-foreground flex-1 leading-snug",children:e.id}),t("span",{class:d("text-[0.6rem] font-bold uppercase tracking-wide shrink-0",J[e.impact]),children:I[e.impact]})]}),t("p",{class:"text-[0.7rem] text-muted-foreground leading-relaxed mb-2 ml-4",children:e.message}),e.nodes.length>0&&i("div",{class:"mb-2 ml-4 space-y-0.5",children:[e.nodes.slice(0,3).map((o,m)=>t("code",{class:"block text-[0.65rem] text-foreground/70 font-mono bg-foreground/5 px-2 py-1 truncate",children:o.selector},m)),e.nodes.length>3&&i("span",{class:"text-[0.62rem] text-muted-foreground/60",children:["+",e.nodes.length-3," more element",e.nodes.length>4?"s":""]})]}),i("div",{class:"flex items-center gap-2 flex-wrap ml-4",children:[e.wcagTags.slice(0,3).map(o=>t("span",{class:"text-[0.58rem] font-mono uppercase bg-primary/8 text-primary/70 border border-primary/20 px-1.5 py-0.5",children:o},o)),t("span",{class:"flex-1"}),t("a",{class:"text-[0.62rem] text-primary/70 hover:text-primary transition-colors",href:e.helpUrl,onClick:l(o=>o.stopPropagation(),"onClick"),rel:"noopener noreferrer",target:"_blank",children:"Learn more ↗"}),t("button",{class:"text-[0.62rem] text-muted-foreground/60 hover:text-muted-foreground transition-colors cursor-pointer bg-transparent border-0 p-0",onClick:l(o=>{o.stopPropagation(),r(e.id)},"onClick"),title:"Disable this rule for current session",type:"button",children:"Disable"})]})]}),"IssueCard"),pe=l(n=>{const[e,a]=k(C(()=>c.getState()),"storeState"),[r,o]=k(C([]),"disabledRules"),[m,$]=k(C(void 0),"minSeverity"),[w,v]=k(C(void 0),"activeIssueId"),[p,f]=k(C(void 0),"filterSeverity");L(()=>c.subscribe(()=>a(c.getState())),[]),L(()=>c.clearHighlights.bind(c),[]);const{isScanning:b,issues:h,lastScan:u,scanError:M,showOverlays:T,standard:q}=e,U=u!==void 0||M!==void 0,P=l(()=>{f(void 0),v(void 0),c.scan(r).catch(()=>{})},"handleScan"),V=l(s=>{w===s.id?(v(void 0),c.clearHighlights(),T&&c.setShowOverlays(!0)):(v(s.id),c.highlightIssue(s))},"handleIssueClick"),F=l(s=>{o(g=>[...g,s])},"handleDisableRule"),R=h.filter(s=>!(r.includes(s.id)||p&&s.impact!==p||m&&E.indexOf(s.impact)>E.indexOf(m))),K=l(s=>h.filter(g=>!r.includes(g.id)&&g.impact===s).length,"countBy");return i("div",{class:"flex flex-col h-full",children:[i("div",{class:"shrink-0 flex items-center gap-2 px-4 py-2.5 border-b border-border bg-foreground/2 flex-wrap",children:[t(S,{class:d(b?"border-primary/30 text-primary/50 bg-primary/5":""),disabled:b,onClick:P,size:"sm",variant:"outline",children:b?"Scanning…":"Scan page"}),i("label",{class:"flex items-center gap-1.5 text-[0.7rem] text-muted-foreground",children:["Standard",i("select",{class:"bg-card border border-border text-foreground text-[0.7rem] px-1.5 py-1 cursor-pointer",onChange:l(s=>c.setStandard(s.target.value),"onChange"),style:"color-scheme: dark",value:q,children:[t("option",{value:"wcag21aa",children:"WCAG 2.1 AA"}),t("option",{value:"wcag22aa",children:"WCAG 2.2 AA"}),t("option",{value:"wcag2a",children:"WCAG 2.0 A"}),t("option",{value:"best-practice",children:"Best Practice"})]})]}),i("label",{class:"flex items-center gap-1.5 text-[0.7rem] text-muted-foreground",children:["Min",i("select",{class:"bg-card border border-border text-foreground text-[0.7rem] px-1.5 py-1 cursor-pointer",onChange:l(s=>{const{value:g}=s.target;$(g||void 0)},"onChange"),style:"color-scheme: dark",value:m??"",children:[t("option",{value:"",children:"All"}),t("option",{value:"critical",children:"Critical only"}),t("option",{value:"serious",children:"Serious+"}),t("option",{value:"moderate",children:"Moderate+"})]})]}),t(S,{class:d(T?"border-primary/30 text-primary bg-primary/8":""),onClick:l(()=>c.setShowOverlays(!T),"onClick"),size:"sm",title:"Toggle visual highlights on affected elements",variant:"outline",children:"Overlays"}),U&&h.length>0&&i(W,{children:[t(S,{class:"ml-auto",onClick:l(()=>{const s=new Blob([JSON.stringify(h,void 0,2)],{type:"application/json"}),g=URL.createObjectURL(s),A=document.createElement("a");A.href=g,A.download="a11y-audit.json",A.click(),URL.revokeObjectURL(g)},"onClick"),size:"sm",title:"Export audit results as JSON",variant:"outline",children:"JSON"}),t(S,{onClick:l(()=>{const s=l(y=>`"${y.replaceAll('"','""')}"`,"q"),g=["Rule ID","Severity","Message","Selector","HTML","WCAG Tags"].join(","),A=h.flatMap(y=>y.nodes.map(H=>[s(y.id),s(y.impact),s(y.message),s(H.selector),s(H.html),s(y.wcagTags.join("; "))].join(","))),Q=new Blob([[g,...A].join(`
-`)],{type:"text/csv"}),G=URL.createObjectURL(Q),D=document.createElement("a");D.href=G,D.download="a11y-audit.csv",D.click(),URL.revokeObjectURL(G)},"onClick"),size:"sm",title:"Export audit results as CSV",variant:"outline",children:"CSV"})]})]}),i("div",{class:"flex-1 overflow-y-auto devtools-content-scroll",children:[M&&t(Z,{class:"rounded-none border-x-0 border-t-0",variant:"destructive",children:i(ee,{children:["Scan failed: ",M]})}),!U&&!b&&i("div",{class:"flex flex-col items-center justify-center gap-4 p-8 min-h-48 text-center",children:[t("p",{class:"text-[0.8125rem] text-muted-foreground max-w-sm",children:"Run an accessibility audit using axe-core to detect WCAG violations on this page."}),t(S,{onClick:P,variant:"outline",children:"Start scan"})]}),b&&t("div",{class:"flex items-center justify-center gap-3 p-8 min-h-48",children:t("span",{class:"text-[0.8rem] text-muted-foreground",children:"Scanning for accessibility issues…"})}),U&&!b&&!M&&i("div",{class:"p-5 space-y-4",children:[t("div",{class:"grid grid-cols-4 gap-2",children:E.map(s=>t(ge,{count:K(s),isActive:p===s,onClick:l(()=>f(p===s?void 0:s),"onClick"),severity:s},s))}),R.length===0?i("div",{class:"p-6 text-center border border-border",children:[t("p",{class:"text-[0.8125rem] font-medium text-foreground/70",children:h.length===0?"No violations found!":"No issues match the current filters."}),h.length===0&&t("p",{class:"mt-1 text-[0.7rem] text-muted-foreground",children:"Great — the page passes all rules for the selected standard."})]}):i("section",{children:[i("div",{class:"flex items-center gap-2 mb-2",children:[i("span",{class:"text-[0.65rem] font-bold uppercase tracking-[0.1em] text-muted-foreground",children:[t("span",{"aria-hidden":"true",class:"text-primary/50",children:"//"})," ",R.length," issue",R.length===1?"":"s",p?` · ${I[p]} only`:""]}),p&&t(S,{class:"h-auto p-0 text-[0.62rem]",onClick:l(()=>f(void 0),"onClick"),variant:"link",children:"Clear ×"})]}),t("div",{class:"space-y-2",children:R.map(s=>t(me,{isSelected:w===s.id,issue:s,onClick:l(()=>V(s),"onClick"),onDisable:F},s.id))})]}),r.length>0&&i("div",{class:"flex items-center gap-2 text-[0.65rem] text-muted-foreground/60",children:[i("span",{children:[r.length," rule",r.length===1?"":"s"," disabled this session."]}),t(S,{class:"h-auto p-0 text-[0.62rem]",onClick:l(()=>o([]),"onClick"),variant:"link",children:"Reset"})]})]})]})]})},"A11yApp");var he=Object.defineProperty,j=O((n,e)=>he(n,"name",{value:e,configurable:!0}),"i$1");const fe={critical:"text-destructive",minor:"text-muted-foreground",moderate:"text-warning-foreground",serious:"text-warning-foreground"},be={critical:"Crit",minor:"Min",moderate:"Mod",serious:"Ser"},xe=j(n=>{const e=new Date(n).getTime();if(Number.isNaN(e))return"unknown";const a=Math.max(0,Math.floor((Date.now()-e)/1e3));if(a<10)return"just now";if(a<60)return`${a}s ago`;const r=Math.floor(a/60);return r<60?`${r} min ago`:`${Math.floor(r/60)} hr ago`},"formatElapsed"),ve=j(n=>{const[e,a]=k(C(()=>c.getState()),"state");L(()=>c.subscribe(()=>a(c.getState())),[]);const{isScanning:r,issues:o,lastScan:m,showOverlays:$}=e,w=o.length,v={critical:0,minor:0,moderate:0,serious:0};for(const u of o)v[u.impact]=(v[u.impact]??0)+1;const p=j(u=>v[u],"countBy");let f;r?f="Scanning…":m?f="Re-scan":f="Scan";const b=$?"border-primary/30 text-primary bg-primary/8":"border-border text-muted-foreground bg-transparent hover:text-foreground",h=o.length===0?"border-border/50 text-muted-foreground/40 bg-transparent cursor-not-allowed":d("cursor-pointer",b);return i("div",{class:"space-y-3 min-w-[200px]",children:[m?i(W,{children:[i("div",{class:"flex items-baseline gap-2",children:[t("span",{class:d("text-2xl font-bold tabular-nums leading-none",w>0?"text-destructive":"text-success-foreground"),children:w}),i("span",{class:"text-[0.65rem] text-muted-foreground",children:["violation",w===1?"":"s"]})]}),t("div",{class:"grid grid-cols-4 gap-1.5",children:E.map(u=>i("div",{class:"flex flex-col items-center gap-0.5",children:[t("span",{class:d("text-[0.85rem] font-bold tabular-nums leading-none",fe[u]),children:p(u)}),t("span",{class:"text-[0.55rem] uppercase tracking-wide text-muted-foreground/70",children:be[u]})]},u))}),i("p",{class:"text-[0.62rem] text-muted-foreground/50",children:["Scanned ",xe(m)]})]}):i("div",{children:[t("p",{class:"text-[0.72rem] text-muted-foreground",children:"No scan run yet."}),t("p",{class:"text-[0.65rem] text-muted-foreground/50 mt-0.5",children:"Scan this page to detect WCAG violations."})]}),i("div",{class:"flex items-center gap-2 pt-2 border-t border-border/50",children:[t("button",{class:d("flex-1 px-2.5 py-1.5 text-[0.7rem] font-medium border transition-colors cursor-pointer",r?"border-primary/30 text-primary/50 bg-primary/5 cursor-not-allowed":"border-border text-foreground bg-transparent hover:bg-foreground/5"),disabled:r,onClick:j(()=>{c.scan().catch(()=>{})},"onClick"),type:"button",children:f}),t("button",{class:d("px-2.5 py-1.5 text-[0.7rem] border transition-colors",h),disabled:o.length===0,onClick:j(()=>c.setShowOverlays(!$),"onClick"),title:"Toggle visual highlights on affected elements",type:"button",children:"Overlays"})]})]})},"A11yTooltip"),$e={component:pe,icon:Y,id:"dev-toolbar:a11y",name:"Accessibility",tooltip:ve};export{$e as default};
+var X=Object.defineProperty;var O=(a,e)=>X(a,"name",{value:e,configurable:!0});import{addHookName as k}from"preact/devtools";import{clsx as d}from"../../packem_shared/clsx-wGlvpUfw.js";import{useState as C,useEffect as L}from"preact/hooks";import{jsxs as i,jsx as t,Fragment as W}from"preact/jsx-runtime";import w from"../../packem_shared/Button-Bkx66Co7.js";import{Alert as Y,AlertDescription as Z}from"../../packem_shared/Alert-D2CvX4fw.js";const ee=`<!-- @license lucide-static v0.577.0 - ISC -->
+<svg
+  class="lucide lucide-accessibility"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <circle cx="16" cy="4" r="1" />
+  <path d="m18 19 1-7-6 1" />
+  <path d="m5 8 3-3 5.5 3-2.36 3.5" />
+  <path d="M4.24 14.5a5 5 0 0 0 6.88 6" />
+  <path d="M13.76 17.5a5 5 0 0 0-6.88-6" />
+</svg>
+`;var te=Object.defineProperty,x=O((a,e)=>te(a,"name",{value:e,configurable:!0}),"i$3");const E=["critical","serious","moderate","minor"],re={critical:"rgb(239,68,68)",minor:"rgb(100,116,139)",moderate:"rgb(249,115,22)",serious:"rgb(234,179,8)"},se={"best-practice":["best-practice"],wcag2a:["wcag2a"],wcag21aa:["wcag2a","wcag2aa","wcag21a","wcag21aa"],wcag22aa:["wcag2a","wcag2aa","wcag21a","wcag21aa","wcag22a","wcag22aa"]},_="__vdt_a11y__",ne=x(()=>{try{const a=sessionStorage.getItem(_);if(a){const e=JSON.parse(a);if(Array.isArray(e.issues))return{issues:e.issues,lastScan:e.lastScan??void 0}}}catch{}return{issues:[],lastScan:void 0}},"loadFromSession"),z=x((a,e)=>{const n=a;n.dataset.vdtA11y=e,n.style.setProperty("outline",`2px solid ${re[e]}`,"important"),n.style.setProperty("outline-offset","2px","important")},"setHighlight"),I=x(()=>{for(const a of document.querySelectorAll("[data-vdt-a11y]")){const e=a;delete e.dataset.vdtA11y,e.style.removeProperty("outline"),e.style.removeProperty("outline-offset")}},"clearHighlightsDOM"),H=x(a=>{I();for(const e of a)for(const n of e.nodes)try{const r=document.querySelector(n.selector);r&&z(r,e.impact)}catch{}},"applyOverlaysDOM"),ae=x(a=>{const e=a.at(-1);return Array.isArray(e)?e.join(" "):String(e??"")},"nodeSelector"),ie=x((a,e)=>{const n=[];for(const r of a)e.includes(r.id)||n.push({helpUrl:r.helpUrl,id:r.id,impact:r.impact??"minor",message:r.help,nodes:r.nodes.map(o=>({html:o.html,selector:ae(o.target)})),wcagTags:r.tags.filter(o=>o.startsWith("wcag")||o==="best-practice")});return n},"convertViolations"),oe=x(async a=>{const e=await import("axe-core"),n=typeof e.default?.run=="function"?e.default:e;if(typeof n.run!="function")throw new TypeError("axe-core could not be loaded — .run is not available");return n.run(document,{exclude:[["dev-toolbar"]],runOnly:{type:"tag",values:se[a]}})},"runAxeScan");class ce{static{O(this,"v")}static{x(this,"A11yStore")}listeners=new Set;state;constructor(){const{issues:e,lastScan:n}=ne();this.state={isScanning:!1,issues:e,lastScan:n,scanError:void 0,showOverlays:!1,standard:"wcag21aa"}}clearHighlights(){I()}getState(){return this.state}highlightIssue(e){I();let n=!1;for(const r of e.nodes)try{const o=document.querySelector(r.selector);o&&(z(o,e.impact),n||(o.scrollIntoView({behavior:"smooth",block:"center"}),n=!0))}catch{}}async scan(e=[]){if(!this.state.isScanning){this.update({isScanning:!0,scanError:void 0});try{const n=await oe(this.state.standard),r=ie(n.violations,e);this.update({isScanning:!1,issues:r,lastScan:new Date().toISOString()}),this.persist(),this.state.showOverlays&&H(r)}catch(n){this.update({isScanning:!1,scanError:n instanceof Error?n.message:String(n)})}}}setShowOverlays(e){this.update({showOverlays:e}),e?H(this.state.issues):I()}setStandard(e){this.update({standard:e})}subscribe(e){return this.listeners.add(e),()=>{this.listeners.delete(e)}}notify(){for(const e of this.listeners)e()}persist(){try{sessionStorage.setItem(_,JSON.stringify({issues:this.state.issues,lastScan:this.state.lastScan}))}catch{}}update(e){this.state={...this.state,...e},this.notify()}}const l=new ce;var le=Object.defineProperty,c=O((a,e)=>le(a,"name",{value:e,configurable:!0}),"i$2");const N={critical:"Critical",minor:"Minor",moderate:"Moderate",serious:"Serious"},J={critical:"text-destructive",minor:"text-muted-foreground",moderate:"text-warning-foreground",serious:"text-warning-foreground"},de={critical:"bg-destructive/10 border-destructive/30",minor:"bg-foreground/4 border-border",moderate:"bg-warning/10 border-warning/30",serious:"bg-warning/10 border-warning/30"},ue={critical:"bg-destructive",minor:"bg-muted-foreground/50",moderate:"bg-warning",serious:"bg-warning"},ge=c(({count:a,isActive:e,onClick:n,severity:r})=>i("button",{class:d("flex flex-col items-center gap-1 px-3 py-2.5 border cursor-pointer transition-colors",e?"ring-1 ring-inset ring-primary/40":"hover:bg-foreground/6",de[r]),onClick:n,title:`${e?"Clear":"Filter by"} ${N[r]}`,type:"button",children:[t("span",{class:d("text-xl font-bold tabular-nums leading-none",J[r]),children:a}),t("span",{class:"text-[0.6rem] font-semibold uppercase tracking-wider text-muted-foreground",children:N[r]})]}),"SeverityBucket"),pe=c(({isSelected:a,issue:e,onClick:n,onDisable:r})=>i("div",{class:d("p-3 border cursor-pointer transition-colors",a?"bg-foreground/6 border-primary/30":"border-border hover:bg-foreground/3"),onClick:n,children:[i("div",{class:"flex items-start gap-2 mb-1.5",children:[t("span",{class:d("mt-1 size-2 rounded-full shrink-0",ue[e.impact])}),t("span",{class:"text-[0.75rem] font-semibold text-foreground flex-1 leading-snug",children:e.id}),t("span",{class:d("text-[0.6rem] font-bold uppercase tracking-wide shrink-0",J[e.impact]),children:N[e.impact]})]}),t("p",{class:"text-[0.7rem] text-muted-foreground leading-relaxed mb-2 ml-4",children:e.message}),e.nodes.length>0&&i("div",{class:"mb-2 ml-4 space-y-0.5",children:[e.nodes.slice(0,3).map((o,p)=>t("code",{class:"block text-[0.65rem] text-foreground/70 font-mono bg-foreground/5 px-2 py-1 truncate",children:o.selector},p)),e.nodes.length>3&&i("span",{class:"text-[0.62rem] text-muted-foreground/60",children:["+",e.nodes.length-3," more element",e.nodes.length>4?"s":""]})]}),i("div",{class:"flex items-center gap-2 flex-wrap ml-4",children:[e.wcagTags.slice(0,3).map(o=>t("span",{class:"text-[0.58rem] font-mono uppercase bg-primary/8 text-primary/70 border border-primary/20 px-1.5 py-0.5",children:o},o)),t("span",{class:"flex-1"}),t("a",{class:"text-[0.62rem] text-primary/70 hover:text-primary transition-colors",href:e.helpUrl,onClick:c(o=>o.stopPropagation(),"onClick"),rel:"noopener noreferrer",target:"_blank",children:"Learn more ↗"}),t("button",{class:"text-[0.62rem] text-muted-foreground/60 hover:text-muted-foreground transition-colors cursor-pointer bg-transparent border-0 p-0",onClick:c(o=>{o.stopPropagation(),r(e.id)},"onClick"),title:"Disable this rule for current session",type:"button",children:"Disable"})]})]}),"IssueCard"),me=c(a=>{const[e,n]=k(C(()=>l.getState()),"storeState"),[r,o]=k(C([]),"disabledRules"),[p,M]=k(C(void 0),"minSeverity"),[S,v]=k(C(void 0),"activeIssueId"),[m,f]=k(C(void 0),"filterSeverity");L(()=>l.subscribe(()=>n(l.getState())),[]),L(()=>l.clearHighlights.bind(l),[]);const{isScanning:b,issues:h,lastScan:u,scanError:$,showOverlays:T,standard:q}=e,U=u!==void 0||$!==void 0,P=c(()=>{f(void 0),v(void 0),l.scan(r).catch(()=>{})},"handleScan"),V=c(s=>{S===s.id?(v(void 0),l.clearHighlights(),T&&l.setShowOverlays(!0)):(v(s.id),l.highlightIssue(s))},"handleIssueClick"),F=c(s=>{o(g=>[...g,s])},"handleDisableRule"),R=h.filter(s=>!(r.includes(s.id)||m&&s.impact!==m||p&&E.indexOf(s.impact)>E.indexOf(p))),K=c(s=>h.filter(g=>!r.includes(g.id)&&g.impact===s).length,"countBy");return i("div",{class:"flex flex-col h-full",children:[i("div",{class:"shrink-0 flex items-center gap-2 px-4 py-2.5 border-b border-border bg-foreground/2 flex-wrap",children:[t(w,{class:d(b?"border-primary/30 text-primary/50 bg-primary/5":""),disabled:b,onClick:P,size:"sm",variant:"outline",children:b?"Scanning…":"Scan page"}),i("label",{class:"flex items-center gap-1.5 text-[0.7rem] text-muted-foreground",children:["Standard",i("select",{class:"bg-card border border-border text-foreground text-[0.7rem] px-1.5 py-1 cursor-pointer",onChange:c(s=>l.setStandard(s.target.value),"onChange"),style:"color-scheme: dark",value:q,children:[t("option",{value:"wcag21aa",children:"WCAG 2.1 AA"}),t("option",{value:"wcag22aa",children:"WCAG 2.2 AA"}),t("option",{value:"wcag2a",children:"WCAG 2.0 A"}),t("option",{value:"best-practice",children:"Best Practice"})]})]}),i("label",{class:"flex items-center gap-1.5 text-[0.7rem] text-muted-foreground",children:["Min",i("select",{class:"bg-card border border-border text-foreground text-[0.7rem] px-1.5 py-1 cursor-pointer",onChange:c(s=>{const{value:g}=s.target;M(g||void 0)},"onChange"),style:"color-scheme: dark",value:p??"",children:[t("option",{value:"",children:"All"}),t("option",{value:"critical",children:"Critical only"}),t("option",{value:"serious",children:"Serious+"}),t("option",{value:"moderate",children:"Moderate+"})]})]}),t(w,{class:d(T?"border-primary/30 text-primary bg-primary/8":""),onClick:c(()=>l.setShowOverlays(!T),"onClick"),size:"sm",title:"Toggle visual highlights on affected elements",variant:"outline",children:"Overlays"}),U&&h.length>0&&i(W,{children:[t(w,{class:"ml-auto",onClick:c(()=>{const s=new Blob([JSON.stringify(h,void 0,2)],{type:"application/json"}),g=URL.createObjectURL(s),A=document.createElement("a");A.href=g,A.download="a11y-audit.json",A.click(),URL.revokeObjectURL(g)},"onClick"),size:"sm",title:"Export audit results as JSON",variant:"outline",children:"JSON"}),t(w,{onClick:c(()=>{const s=c(y=>`"${y.replaceAll('"','""')}"`,"q"),g=["Rule ID","Severity","Message","Selector","HTML","WCAG Tags"].join(","),A=h.flatMap(y=>y.nodes.map(G=>[s(y.id),s(y.impact),s(y.message),s(G.selector),s(G.html),s(y.wcagTags.join("; "))].join(","))),Q=new Blob([[g,...A].join(`
+`)],{type:"text/csv"}),B=URL.createObjectURL(Q),D=document.createElement("a");D.href=B,D.download="a11y-audit.csv",D.click(),URL.revokeObjectURL(B)},"onClick"),size:"sm",title:"Export audit results as CSV",variant:"outline",children:"CSV"})]})]}),i("div",{class:"flex-1 overflow-y-auto devtools-content-scroll",children:[$&&t(Y,{class:"rounded-none border-x-0 border-t-0",variant:"destructive",children:i(Z,{children:["Scan failed: ",$]})}),!U&&!b&&i("div",{class:"flex flex-col items-center justify-center gap-4 p-8 min-h-48 text-center",children:[t("p",{class:"text-[0.8125rem] text-muted-foreground max-w-sm",children:"Run an accessibility audit using axe-core to detect WCAG violations on this page."}),t(w,{onClick:P,variant:"outline",children:"Start scan"})]}),b&&t("div",{class:"flex items-center justify-center gap-3 p-8 min-h-48",children:t("span",{class:"text-[0.8rem] text-muted-foreground",children:"Scanning for accessibility issues…"})}),U&&!b&&!$&&i("div",{class:"p-5 space-y-4",children:[t("div",{class:"grid grid-cols-4 gap-2",children:E.map(s=>t(ge,{count:K(s),isActive:m===s,onClick:c(()=>f(m===s?void 0:s),"onClick"),severity:s},s))}),R.length===0?i("div",{class:"p-6 text-center border border-border",children:[t("p",{class:"text-[0.8125rem] font-medium text-foreground/70",children:h.length===0?"No violations found!":"No issues match the current filters."}),h.length===0&&t("p",{class:"mt-1 text-[0.7rem] text-muted-foreground",children:"Great — the page passes all rules for the selected standard."})]}):i("section",{children:[i("div",{class:"flex items-center gap-2 mb-2",children:[i("span",{class:"text-[0.65rem] font-bold uppercase tracking-[0.1em] text-muted-foreground",children:[t("span",{"aria-hidden":"true",class:"text-primary/50",children:"//"})," ",R.length," issue",R.length===1?"":"s",m?` · ${N[m]} only`:""]}),m&&t(w,{class:"h-auto p-0 text-[0.62rem]",onClick:c(()=>f(void 0),"onClick"),variant:"link",children:"Clear ×"})]}),t("div",{class:"space-y-2",children:R.map(s=>t(pe,{isSelected:S===s.id,issue:s,onClick:c(()=>V(s),"onClick"),onDisable:F},s.id))})]}),r.length>0&&i("div",{class:"flex items-center gap-2 text-[0.65rem] text-muted-foreground/60",children:[i("span",{children:[r.length," rule",r.length===1?"":"s"," disabled this session."]}),t(w,{class:"h-auto p-0 text-[0.62rem]",onClick:c(()=>o([]),"onClick"),variant:"link",children:"Reset"})]})]})]})]})},"A11yApp");var he=Object.defineProperty,j=O((a,e)=>he(a,"name",{value:e,configurable:!0}),"i$1");const fe={critical:"text-destructive",minor:"text-muted-foreground",moderate:"text-warning-foreground",serious:"text-warning-foreground"},be={critical:"Crit",minor:"Min",moderate:"Mod",serious:"Ser"},xe=j(a=>{const e=new Date(a).getTime();if(Number.isNaN(e))return"unknown";const n=Math.max(0,Math.floor((Date.now()-e)/1e3));if(n<10)return"just now";if(n<60)return`${n}s ago`;const r=Math.floor(n/60);return r<60?`${r} min ago`:`${Math.floor(r/60)} hr ago`},"formatElapsed"),ve=j(a=>{const[e,n]=k(C(()=>l.getState()),"state");L(()=>l.subscribe(()=>n(l.getState())),[]);const{isScanning:r,issues:o,lastScan:p,showOverlays:M}=e,S=o.length,v={critical:0,minor:0,moderate:0,serious:0};for(const u of o)v[u.impact]=(v[u.impact]??0)+1;const m=j(u=>v[u],"countBy");let f;r?f="Scanning…":p?f="Re-scan":f="Scan";const b=M?"border-primary/30 text-primary bg-primary/8":"border-border text-muted-foreground bg-transparent hover:text-foreground",h=o.length===0?"border-border/50 text-muted-foreground/40 bg-transparent cursor-not-allowed":d("cursor-pointer",b);return i("div",{class:"space-y-3 min-w-[200px]",children:[p?i(W,{children:[i("div",{class:"flex items-baseline gap-2",children:[t("span",{class:d("text-2xl font-bold tabular-nums leading-none",S>0?"text-destructive":"text-success-foreground"),children:S}),i("span",{class:"text-[0.65rem] text-muted-foreground",children:["violation",S===1?"":"s"]})]}),t("div",{class:"grid grid-cols-4 gap-1.5",children:E.map(u=>i("div",{class:"flex flex-col items-center gap-0.5",children:[t("span",{class:d("text-[0.85rem] font-bold tabular-nums leading-none",fe[u]),children:m(u)}),t("span",{class:"text-[0.55rem] uppercase tracking-wide text-muted-foreground/70",children:be[u]})]},u))}),i("p",{class:"text-[0.62rem] text-muted-foreground/50",children:["Scanned ",xe(p)]})]}):i("div",{children:[t("p",{class:"text-[0.72rem] text-muted-foreground",children:"No scan run yet."}),t("p",{class:"text-[0.65rem] text-muted-foreground/50 mt-0.5",children:"Scan this page to detect WCAG violations."})]}),i("div",{class:"flex items-center gap-2 pt-2 border-t border-border/50",children:[t("button",{class:d("flex-1 px-2.5 py-1.5 text-[0.7rem] font-medium border transition-colors cursor-pointer",r?"border-primary/30 text-primary/50 bg-primary/5 cursor-not-allowed":"border-border text-foreground bg-transparent hover:bg-foreground/5"),disabled:r,onClick:j(()=>{l.scan().catch(()=>{})},"onClick"),type:"button",children:f}),t("button",{class:d("px-2.5 py-1.5 text-[0.7rem] border transition-colors",h),disabled:o.length===0,onClick:j(()=>l.setShowOverlays(!M),"onClick"),title:"Toggle visual highlights on affected elements",type:"button",children:"Overlays"})]})]})},"A11yTooltip"),je={component:me,icon:ee,id:"dev-toolbar:a11y",name:"Accessibility",tooltip:ve};export{je as default};

package/dist/apps/assets/assets-app.d.ts

@@ -0,0 +1,4 @@
+import type { ComponentChildren } from "preact";
+import type { AppComponentProps } from "../../types/app.d.ts";
+declare const AssetsApp: ({ helpers }: AppComponentProps) => ComponentChildren;
+export default AssetsApp;

package/dist/apps/assets/index.d.ts

@@ -0,0 +1,3 @@
+import type { DevToolbarApp } from "../../types/app.d.ts";
+declare const assetsApp: DevToolbarApp;
+export default assetsApp;

package/dist/apps/assets/index.js

@@ -0,0 +1,16 @@
+var B=Object.defineProperty;var P=(t,i)=>B(t,"name",{value:i,configurable:!0});import{addHookName as a}from"preact/devtools";import{clsx as u}from"../../packem_shared/clsx-wGlvpUfw.js";import{useState as s,useRef as N,useEffect as C}from"preact/hooks";import{jsx as e,jsxs as l}from"preact/jsx-runtime";import c from"../../packem_shared/Button-Bkx66Co7.js";import E from"../../packem_shared/Input-Cs6aduTi.js";const H=`<!-- @license lucide-static v0.577.0 - ISC -->
+<svg
+  class="lucide lucide-folder-open"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="m6 14 1.5-2.9A2 2 0 0 1 9.24 10H20a2 2 0 0 1 1.94 2.5l-1.54 6a2 2 0 0 1-1.95 1.5H4a2 2 0 0 1-2-2V5a2 2 0 0 1 2-2h3.9a2 2 0 0 1 1.69.9l.81 1.2a2 2 0 0 0 1.67.9H18a2 2 0 0 1 2 2v2" />
+</svg>
+`;var O=Object.defineProperty,o=P((t,i)=>O(t,"name",{value:i,configurable:!0}),"o");const j=o(t=>!Number.isFinite(t)||t<0?"–":t<1024?`${t} B`:t<1024*1024?`${(t/1024).toFixed(1)} KB`:`${(t/(1024*1024)).toFixed(1)} MB`,"formatSize"),A=o(t=>t.startsWith("/")&&!t.includes(":")?t:"#","safePublicPath"),M=[{label:"All",value:"all"},{label:"Images",value:"image"},{label:"Videos",value:"video"},{label:"Audio",value:"audio"},{label:"Fonts",value:"font"},{label:"Text",value:"text"},{label:"Other",value:"other"}],D={audio:"bg-yellow-500/15 text-yellow-400 border-yellow-500/30",font:"bg-orange-500/15 text-orange-400 border-orange-500/30",image:"bg-blue-500/15 text-blue-400 border-blue-500/30",other:"bg-foreground/6 text-muted-foreground border-border",text:"bg-emerald-500/15 text-emerald-400 border-emerald-500/30",video:"bg-purple-500/15 text-purple-400 border-purple-500/30"},z=o(({type:t})=>e("span",{class:u("inline-flex px-1.5 py-0.5 text-[0.6rem] font-mono font-bold uppercase border",D[t]),children:t}),"TypeBadge"),V=o(({asset:t})=>{const i=A(t.publicPath);if(i!=="#"){if(t.type==="image")return e("div",{class:"flex items-center justify-center bg-foreground/4 border border-border h-32 overflow-hidden",children:e("img",{alt:t.publicPath,class:"max-w-full max-h-full object-contain",onError:o(p=>{p.target.style.display="none"},"onError"),src:i})});if(t.type==="video")return e("div",{class:"flex items-center justify-center bg-foreground/4 border border-border h-32 overflow-hidden",children:e("video",{class:"max-w-full max-h-full",preload:"metadata",src:i})});if(t.type==="audio")return e("div",{class:"flex items-center justify-center bg-foreground/4 border border-border h-14 px-2",children:e("audio",{class:"w-full",controls:!0,preload:"none",src:i})})}},"AssetPreview"),K=o(({helpers:t})=>{const[i,p]=a(s([]),"assets"),[F,f]=a(s(!0),"loading"),[g,v]=a(s(void 0),"error"),[y,T]=a(s(""),"search"),[d,S]=a(s("all"),"typeFilter"),[n,b]=a(s(void 0),"selected"),[I,w]=a(s(!1),"copied"),m=a(N(void 0),"copyTimerRef");C(()=>()=>clearTimeout(m.current),[]);const h=o(()=>{f(!0),v(void 0),b(void 0),t.rpc.getStaticAssets().then(r=>{p(r),f(!1)}).catch(r=>{v(r.message??"Failed to load assets"),f(!1)})},"load");C(()=>{h()},[]);const x=i.filter(r=>{const k=y.toLowerCase(),R=!k||r.publicPath.toLowerCase().includes(k),$=d==="all"||r.type===d;return R&&$}),L=o(r=>{navigator.clipboard.writeText(r.publicPath).then(()=>{clearTimeout(m.current),w(!0),m.current=setTimeout(w,1500,!1)}).catch(()=>{})},"copyPath");return F?l("div",{class:"flex flex-col items-center justify-center h-full gap-3 p-8 select-none",children:[e("div",{"aria-hidden":"true",class:"flex gap-1.5 items-center",children:[0,160,320].map(r=>e("span",{class:"size-1.5 bg-primary/50 rounded-full animate-pulse",style:{animationDelay:`${r}ms`}},r))}),e("span",{class:"text-[0.75rem] text-muted-foreground",children:"Scanning assets…"})]}):g?l("div",{class:"flex flex-col items-center justify-center h-full gap-3 p-8 text-center",children:[e("p",{class:"text-[0.8rem] text-destructive",children:g}),e(c,{onClick:h,size:"sm",variant:"outline",children:"Retry"})]}):l("div",{class:"flex flex-col h-full",children:[l("div",{class:"flex items-center gap-2 px-4 py-2.5 border-b border-border shrink-0 flex-wrap",children:[e(E,{class:"flex-1 min-w-32 bg-foreground/4 font-mono text-[0.8rem] placeholder:text-muted-foreground/50 focus-visible:border-primary/50 border-border",onInput:o(r=>T(r.target.value),"onInput"),placeholder:"Filter assets…",type:"text",value:y}),l("span",{class:"text-[0.7rem] text-muted-foreground shrink-0",children:[x.length," / ",i.length]}),e(c,{onClick:h,size:"sm",variant:"outline",children:"Refresh"})]}),e("div",{"aria-label":"Filter by type",class:"flex items-center gap-1.5 px-4 py-2 border-b border-border shrink-0 flex-wrap",role:"group",children:M.map(r=>e("button",{"aria-pressed":d===r.value,class:u("px-2.5 py-0.5 text-[0.7rem] font-medium border cursor-pointer transition-colors duration-100",d===r.value?"bg-primary/15 text-primary border-primary/30":"bg-foreground/4 text-muted-foreground border-border hover:bg-foreground/8 hover:text-foreground"),onClick:o(()=>S(r.value),"onClick"),type:"button",children:r.label},r.value))}),l("div",{class:"flex flex-1 min-h-0 overflow-hidden",children:[e("div",{class:"flex-1 overflow-auto divide-y divide-border/30",role:"list",children:x.length===0?e("div",{class:"flex items-center justify-center p-8 text-[0.8rem] text-muted-foreground",children:i.length===0?"No assets found in public directory.":"No assets match the current filter."}):x.map(r=>l("button",{"aria-label":r.publicPath,"aria-selected":n?.publicPath===r.publicPath,class:u("w-full flex items-center gap-3 px-4 py-2.5 text-left border-0 bg-transparent cursor-pointer","hover:bg-foreground/4 transition-colors duration-100",n?.publicPath===r.publicPath&&"bg-primary/6"),onClick:o(()=>b(n?.publicPath===r.publicPath?void 0:r),"onClick"),role:"option",type:"button",children:[e(z,{type:r.type}),e("span",{class:"flex-1 text-[0.775rem] font-mono text-foreground/80 truncate min-w-0",children:r.publicPath}),e("span",{class:"shrink-0 text-[0.65rem] text-muted-foreground",children:j(r.size)})]},r.publicPath))}),n&&l("div",{class:"border-l border-border bg-background w-72 shrink-0 flex flex-col overflow-hidden",children:[l("div",{class:"flex items-center justify-between gap-2 px-4 py-3 border-b border-border shrink-0",children:[e("span",{class:"text-[0.7rem] font-semibold text-foreground uppercase tracking-wide",children:"Asset Info"}),e(c,{"aria-label":"Close",class:"h-6 w-6 text-xs",onClick:o(()=>b(void 0),"onClick"),size:"icon",variant:"ghost",children:"✕"})]}),l("div",{class:"flex-1 overflow-auto p-4 space-y-4",children:[e(V,{asset:n}),l("div",{children:[e("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Path"}),e("code",{class:"text-[0.7rem] font-mono text-foreground/80 break-all",children:n.publicPath})]}),l("div",{children:[e("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Type"}),e(z,{type:n.type})]}),l("div",{children:[e("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Size"}),e("span",{class:"text-[0.8rem] font-mono text-foreground",children:j(n.size)})]}),l("div",{children:[e("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Last Modified"}),e("span",{class:"text-[0.75rem] text-foreground/80",children:new Date(n.mtime).toLocaleString()})]}),l("div",{class:"flex flex-col gap-2 pt-1",children:[e(c,{class:"w-full text-[0.75rem]",onClick:o(()=>L(n),"onClick"),size:"sm",variant:"outline",children:I?"Copied!":"Copy URL"}),e("a",{class:u("w-full text-[0.75rem] inline-flex items-center justify-center","px-3 py-1.5 border border-border bg-transparent","text-foreground hover:bg-foreground/6 transition-colors duration-100"),href:A(n.publicPath),rel:"noopener noreferrer",target:"_blank",children:"Open in browser"})]})]})]})]})]})},"AssetsApp"),X={component:K,icon:H,id:"dev-toolbar:assets",name:"Assets"};export{X as default};

package/dist/apps/inspector/index.js

@@ -1 +1,17 @@
-var I=Object.defineProperty;var w=(t,e)=>I(t,"name",{value:e,configurable:!0});import A from"lucide-static/icons/inspect.svg?raw";var q=Object.defineProperty,s=w((t,e)=>q(t,"name",{value:e,configurable:!0}),"s");const E={bg:"#18181b",btnBg:"rgba(196,181,253,0.08)",btnBgHover:"rgba(196,181,253,0.16)",btnBorder:"rgba(196,181,253,0.25)",btnBorderHover:"rgba(196,181,253,0.5)",fg:"#fafafa",muted:"#a1a1aa",overlayBg:"rgba(196,181,253,0.06)",overlayBorder:"rgba(196,181,253,0.7)",primary:"#c4b5fd",shadow:"0 8px 32px rgba(0,0,0,.75)"},k={bg:"#ffffff",btnBg:"rgba(124,58,237,0.08)",btnBgHover:"rgba(124,58,237,0.16)",btnBorder:"rgba(124,58,237,0.25)",btnBorderHover:"rgba(124,58,237,0.5)",fg:"#18181b",muted:"#52525b",overlayBg:"rgba(124,58,237,0.06)",overlayBorder:"rgba(124,58,237,0.7)",primary:"#7c3aed",shadow:"0 8px 32px rgba(0,0,0,.15)"},y=s(()=>{try{const t=localStorage.getItem("__v_dt__theme");if(t==="light")return k;if(t==="dark")return E}catch{}return globalThis.window?.matchMedia("(prefers-color-scheme: dark)").matches?E:k},"getThemePalette"),v="__vdt_inspector_overlay",T="__vdt_inspector_label",h="__vdt_inspector_cursor",$="__vdt_inspector_badge",B="__vdt_inspector_kf",S="__vdt_inspector_result",j=s(()=>{let t=document.querySelector(`#${v}`);if(!t){const e=y();t=document.createElement("div"),t.id=v,t.style.cssText=["position:fixed","pointer-events:none","z-index:2147483644","box-sizing:border-box",`border:1px solid ${e.overlayBorder}`,`background:${e.overlayBg}`,"transition:top 60ms,left 60ms,width 60ms,height 60ms","display:none"].join(";");const o=document.createElement("div");o.id=T,o.style.cssText=["position:absolute","bottom:calc(100% + 2px)","left:0",`background:${e.bg}`,`color:${e.primary}`,"font:11px/1.2 'JetBrains Mono',monospace","padding:2px 6px","white-space:nowrap","pointer-events:none",`border:1px solid ${e.btnBorder}`].join(";"),t.append(o),document.body.append(t)}return t},"getOrCreateOverlay"),M=s(t=>{let e=t;for(;e;){const o=e.dataset.vdtSource;if(o)return o;e=e.parentElement??void 0}},"findSource"),D=s(t=>{const e=t.split(":");if(e.length<3)return t;const o=e[e.length-2],n=e.slice(0,-2).join(":");return`${n.split("/").pop()??n}:${o}`},"formatSourceShort"),H=s(t=>{const e=document.querySelector(`#${v}`);if(!e)return;const o=t.getBoundingClientRect();e.style.display="block",e.style.top=`${o.top}px`,e.style.left=`${o.left}px`,e.style.width=`${o.width}px`,e.style.height=`${o.height}px`;const n=document.querySelector(`#${T}`);if(n){const r=t.tagName.toLowerCase(),c=t.id?`#${t.id}`:"",d=t.classList.length>0?`.${[...t.classList].slice(0,3).join(".")}`:"",l=`${r}${c}${d}`,g=M(t);n.textContent=g?`${l}  ·  ${D(g)}`:l,o.top<28?(n.style.bottom="auto",n.style.top="calc(100% + 2px)"):(n.style.top="",n.style.bottom="calc(100% + 2px)")}},"updateOverlayPosition"),L=s(()=>{const t=document.querySelector(`#${v}`);t&&(t.style.display="none")},"hideOverlay"),P=s(()=>{document.querySelector(`#${v}`)?.remove(),document.querySelector(`#${h}`)?.remove()},"removeOverlay"),C=s(t=>{let e=document.querySelector(`#${h}`);t?(e||(e=document.createElement("style"),e.id=h,document.head.append(e)),e.textContent="*, *::before, *::after { cursor: crosshair !important; }"):e&&e.remove()},"setCrosshairCursor"),O=s(()=>{document.querySelector(`#${$}`)?.remove()},"removeFloatingBadge"),R=s(t=>{if(!document.querySelector(`#${B}`)){const l=document.createElement("style");l.id=B,l.textContent="@keyframes __vdt_pulse{0%,100%{opacity:1}50%{opacity:.3}}",document.head.append(l)}O();const e=y(),o=document.createElement("div");o.id=$,o.style.cssText=["position:fixed","bottom:4rem","left:50%","transform:translateX(-50%)","z-index:2147483645","display:flex","align-items:center","gap:8px","padding:6px 14px 6px 10px",`background:${e.bg}`,`border:1px solid ${e.btnBorder}`,`box-shadow:${e.shadow}`,"font:12px/1 'JetBrains Mono',monospace",`color:${e.fg}`,"pointer-events:auto","user-select:none","white-space:nowrap"].join(";");const n=document.createElement("span");n.style.cssText=`display:inline-block;width:7px;height:7px;border-radius:50%;background:${e.primary};animation:__vdt_pulse 1.4s ease-in-out infinite;flex-shrink:0;`;const r=document.createElement("span");r.textContent="Click any element to inspect";const c=document.createElement("span");c.style.cssText=`color:${e.muted};margin:0 4px;`,c.textContent="·";const d=document.createElement("button");d.textContent="Cancel",d.style.cssText=`background:transparent;border:none;color:${e.primary};cursor:pointer;padding:0;font:12px/1 'JetBrains Mono',monospace;text-decoration:underline;text-underline-offset:3px;`,d.addEventListener("click",l=>{l.stopPropagation(),t()}),o.append(n,r,c,d),document.body.append(o)},"createFloatingBadge"),J=s(t=>{const e=t.split(":"),o=Number.parseInt(e.at(-1)??"0",10)||void 0,n=Number.parseInt(e.at(-2)??"0",10)||void 0,r=e.slice(0,-2).join(":");globalThis.__VISULIMA_DEVTOOLS__?.rpc?.openInEditor?.(r,n,o).catch(()=>{})},"openInEditor"),b=s(()=>{document.querySelector(`#${S}`)?.remove()},"removeResultPopup"),f=s((t,e)=>{const o=y(),n=document.createElement("button");return n.textContent=t,n.style.cssText=[`background:${o.btnBg}`,`border:1px solid ${o.btnBorder}`,`color:${o.primary}`,"cursor:pointer","font:11px/1 'JetBrains Mono',monospace","padding:5px 10px","white-space:nowrap"].join(";"),n.addEventListener("pointerover",()=>{n.style.background=o.btnBgHover,n.style.borderColor=o.btnBorderHover}),n.addEventListener("pointerout",()=>{n.style.background=o.btnBg,n.style.borderColor=o.btnBorder}),n.addEventListener("click",r=>{r.stopPropagation(),e()}),n},"makeActionButton"),N=s((t,e,o)=>{b();const n=y(),r=document.createElement("div");r.id=S,r.style.cssText=["position:fixed","z-index:2147483646",`background:${n.bg}`,`border:1px solid ${n.btnBorder}`,"padding:10px 32px 10px 12px","font:12px/1.4 'JetBrains Mono',monospace",`color:${n.fg}`,`box-shadow:${n.shadow}`,"min-width:200px","max-width:400px","pointer-events:auto"].join(";");let c=e.bottom+8;c+110>window.innerHeight&&(c=e.top-110-8);let{left:d}=e;d+280>window.innerWidth&&(d=Math.max(8,window.innerWidth-288)),r.style.top=`${c}px`,r.style.left=`${d}px`;const l=t.tagName.toLowerCase(),g=t.id?`#${t.id}`:"",i=t.classList.length>0?`.${[...t.classList].slice(0,3).join(".")}`:"",a=document.createElement("div");if(a.style.cssText=`color:${n.primary};font-weight:bold;margin-bottom:4px;word-break:break-all;`,a.textContent=`${l}${g}${i}`,r.append(a),o){const m=document.createElement("div");m.style.cssText=`color:${n.muted};margin-bottom:10px;word-break:break-all;font-size:10px;`,m.textContent=o,r.append(m)}const u=document.createElement("div");u.style.cssText="display:flex;gap:6px;flex-wrap:wrap;",o&&u.append(f("Open in editor",()=>{J(o),b()})),u.append(f("Copy HTML",()=>{navigator.clipboard.writeText(t.outerHTML).catch(()=>{}),b()})),o&&u.append(f("Copy path",()=>{navigator.clipboard.writeText(o).catch(()=>{}),b()})),r.append(u);const p=document.createElement("button");p.textContent="×",p.style.cssText=["position:absolute","top:6px","right:8px","background:transparent","border:none",`color:${n.muted}`,"cursor:pointer","font:16px/1 'JetBrains Mono',monospace","padding:0","line-height:1","transition:color 0.15s"].join(";"),p.addEventListener("pointerover",()=>{p.style.color=n.fg}),p.addEventListener("pointerout",()=>{p.style.color=n.muted}),p.addEventListener("click",m=>{m.stopPropagation(),b()}),r.append(p),document.body.append(r);const _=s(m=>{r.contains(m.target)||(b(),document.removeEventListener("click",_,!0))},"handleOutside");setTimeout(()=>{document.addEventListener("click",_,!0)},100)},"showResultPopup");let x;const V=s((t,e)=>{x?.(),j(),C(!0);const o=s(()=>document.querySelector(`#${$}`)??void 0,"badgeElement"),n=s(i=>{if(!i)return!1;const a=o();return!!(a&&(i===a||a.contains(i)))},"isOverBadge"),r={cleanup(){document.removeEventListener("mousemove",r.handleMouseMove),document.removeEventListener("click",r.handleClick,!0),document.removeEventListener("keydown",r.handleKeyDown),L(),P(),C(!1),O(),x=void 0},handleClick(i){const a=i.target;if(!a||a.tagName==="DEV-TOOLBAR"||n(a))return;i.preventDefault(),i.stopPropagation();const u=a.getBoundingClientRect(),p=M(a);r.cleanup(),t(),N(a,u,p)},handleKeyDown(i){i.key==="Escape"&&(r.cleanup(),e())},handleMouseMove(i){const a=i.target;if(!a||a.tagName==="DEV-TOOLBAR"||n(a)){L();return}H(a)}},{cleanup:c,handleClick:d,handleKeyDown:l,handleMouseMove:g}=r;R(()=>{c(),e()}),document.addEventListener("mousemove",g),document.addEventListener("click",d,!0),document.addEventListener("keydown",l),x=c},"startGlobalInspection"),z=s(()=>{x?.(),b()},"stopGlobalInspection"),F={icon:A,id:"dev-toolbar:inspector",name:"Inspector",onClick(){const t=globalThis.__VISULIMA_DEVTOOLS__;V(()=>{t?.setAppActive&&t.setAppActive("dev-toolbar:inspector",!1)},()=>{t?.setAppActive&&t.setAppActive("dev-toolbar:inspector",!1)})},onDeactivate(){z()}};export{F as default};
+var q=Object.defineProperty;var B=(t,e)=>q(t,"name",{value:e,configurable:!0});import{b as H}from"../../packem_shared/use-frame-state-CxrlPUM5.js";const P=`<!-- @license lucide-static v0.577.0 - ISC -->
+<svg
+  class="lucide lucide-inspect"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="M12.034 12.681a.498.498 0 0 1 .647-.647l9 3.5a.5.5 0 0 1-.033.943l-3.444 1.068a1 1 0 0 0-.66.66l-1.067 3.443a.5.5 0 0 1-.943.033z" />
+  <path d="M21 11V5a2 2 0 0 0-2-2H5a2 2 0 0 0-2 2v14a2 2 0 0 0 2 2h6" />
+</svg>
+`;var A=Object.defineProperty,s=B((t,e)=>A(t,"name",{value:e,configurable:!0}),"i$1");const L={bg:"#18181b",btnBg:"rgba(196,181,253,0.08)",btnBgHover:"rgba(196,181,253,0.16)",btnBorder:"rgba(196,181,253,0.25)",btnBorderHover:"rgba(196,181,253,0.5)",fg:"#fafafa",muted:"#a1a1aa",overlayBg:"rgba(196,181,253,0.06)",overlayBorder:"rgba(196,181,253,0.7)",primary:"#c4b5fd",shadow:"0 8px 32px rgba(0,0,0,.75)"},C={bg:"#ffffff",btnBg:"rgba(124,58,237,0.08)",btnBgHover:"rgba(124,58,237,0.16)",btnBorder:"rgba(124,58,237,0.25)",btnBorderHover:"rgba(124,58,237,0.5)",fg:"#18181b",muted:"#52525b",overlayBg:"rgba(124,58,237,0.06)",overlayBorder:"rgba(124,58,237,0.7)",primary:"#7c3aed",shadow:"0 8px 32px rgba(0,0,0,.15)"},$=s(()=>{try{const t=localStorage.getItem("__v_dt__theme");if(t==="light")return C;if(t==="dark")return L}catch{}return globalThis.window?.matchMedia("(prefers-color-scheme: dark)").matches?L:C},"getThemePalette"),x="__vdt_inspector_overlay",M="__vdt_inspector_label",E="__vdt_inspector_cursor",y="__vdt_inspector_badge",T="__vdt_inspector_kf",h="__vdt_inspector_result",D=s(()=>{let t=document.querySelector(`#${x}`);if(!t){const e=$();t=document.createElement("div"),t.id=x,t.style.cssText=["position:fixed","pointer-events:none","z-index:2147483644","box-sizing:border-box",`border:1px solid ${e.overlayBorder}`,`background:${e.overlayBg}`,"transition:top 60ms,left 60ms,width 60ms,height 60ms","display:none"].join(";");const o=document.createElement("div");o.id=M,o.style.cssText=["position:absolute","bottom:calc(100% + 2px)","left:0",`background:${e.bg}`,`color:${e.primary}`,"font:11px/1.2 'JetBrains Mono',monospace","padding:2px 6px","white-space:nowrap","pointer-events:none",`border:1px solid ${e.btnBorder}`].join(";"),t.append(o),document.body.append(t)}return t},"getOrCreateOverlay"),O=s(t=>{let e=t;for(;e;){const o=e.dataset.vdtSource;if(o)return o;e=e.parentElement??void 0}},"findSource"),R=s(t=>{const e=t.split(":");if(e.length<3)return t;const o=e[e.length-2],n=e.slice(0,-2).join(":");return`${n.split("/").pop()??n}:${o}`},"formatSourceShort"),N=s(t=>{const e=document.querySelector(`#${x}`);if(!e)return;const o=t.getBoundingClientRect();e.style.display="block",e.style.top=`${o.top}px`,e.style.left=`${o.left}px`,e.style.width=`${o.width}px`,e.style.height=`${o.height}px`;const n=document.querySelector(`#${M}`);if(n){const r=t.tagName.toLowerCase(),c=t.id?`#${t.id}`:"",l=t.classList.length>0?`.${[...t.classList].slice(0,3).join(".")}`:"",d=`${r}${c}${l}`,g=O(t);n.textContent=g?`${d}  ·  ${R(g)}`:d,o.top<28?(n.style.bottom="auto",n.style.top="calc(100% + 2px)"):(n.style.top="",n.style.bottom="calc(100% + 2px)")}},"updateOverlayPosition"),_=s(()=>{const t=document.querySelector(`#${x}`);t&&(t.style.display="none")},"hideOverlay"),V=s(()=>{document.querySelector(`#${x}`)?.remove(),document.querySelector(`#${E}`)?.remove()},"removeOverlay"),S=s(t=>{let e=document.querySelector(`#${E}`);t?(e||(e=document.createElement("style"),e.id=E,document.head.append(e)),e.textContent=`*, *::before, *::after { cursor: crosshair !important; } #${y}, #${y} *, #${h}, #${h} * { cursor: pointer !important; }`):e&&e.remove()},"setCrosshairCursor"),I=s(()=>{document.querySelector(`#${y}`)?.remove()},"removeFloatingBadge"),z=s(t=>{if(!document.querySelector(`#${T}`)){const d=document.createElement("style");d.id=T,d.textContent="@keyframes __vdt_pulse{0%,100%{opacity:1}50%{opacity:.3}}",document.head.append(d)}I();const e=$(),o=document.createElement("div");o.id=y,o.style.cssText=["position:fixed","bottom:4rem","left:50%","transform:translateX(-50%)","z-index:2147483645","display:flex","align-items:center","gap:8px","padding:6px 14px 6px 10px",`background:${e.bg}`,`border:1px solid ${e.btnBorder}`,`box-shadow:${e.shadow}`,"font:12px/1 'JetBrains Mono',monospace",`color:${e.fg}`,"pointer-events:auto","user-select:none","white-space:nowrap"].join(";"),o.addEventListener("click",d=>{d.stopPropagation(),t()});const n=document.createElement("span");n.style.cssText=`display:inline-block;width:7px;height:7px;border-radius:50%;background:${e.primary};animation:__vdt_pulse 1.4s ease-in-out infinite;flex-shrink:0;`;const r=document.createElement("span");r.textContent="Click any element to inspect";const c=document.createElement("span");c.style.cssText=`color:${e.muted};margin:0 4px;`,c.textContent="·";const l=document.createElement("span");l.textContent="Cancel",l.style.cssText=`color:${e.primary};text-decoration:underline;text-underline-offset:3px;`,o.append(n,r,c,l),document.body.append(o)},"createFloatingBadge");let v;const J=s(t=>{const e=t.split(":"),o=Number.parseInt(e.at(-1)??"0",10)||void 0,n=Number.parseInt(e.at(-2)??"0",10)||void 0,r=e.slice(0,-2).join(":");globalThis.__VISULIMA_DEVTOOLS__?.rpc?.openInEditor?.(r,n,o,H()).catch(()=>{})},"openInEditor"),b=s(()=>{v?.(),v=void 0,document.querySelector(`#${h}`)?.remove()},"removeResultPopup"),k=s((t,e)=>{const o=$(),n=document.createElement("button");return n.textContent=t,n.style.cssText=[`background:${o.btnBg}`,`border:1px solid ${o.btnBorder}`,`color:${o.primary}`,"cursor:pointer","font:11px/1 'JetBrains Mono',monospace","padding:5px 10px","white-space:nowrap"].join(";"),n.addEventListener("pointerover",()=>{n.style.background=o.btnBgHover,n.style.borderColor=o.btnBorderHover}),n.addEventListener("pointerout",()=>{n.style.background=o.btnBg,n.style.borderColor=o.btnBorder}),n.addEventListener("click",r=>{r.stopPropagation(),e()}),n},"makeActionButton"),G=s((t,e,o)=>{v?.(),v=void 0,b();const n=$(),r=document.createElement("div");r.id=h,r.style.cssText=["position:fixed","z-index:2147483646",`background:${n.bg}`,`border:1px solid ${n.btnBorder}`,"padding:10px 32px 10px 12px","font:12px/1.4 'JetBrains Mono',monospace",`color:${n.fg}`,`box-shadow:${n.shadow}`,"min-width:200px","max-width:400px","pointer-events:auto"].join(";");let c=e.bottom+8;c+110>window.innerHeight&&(c=e.top-110-8);let{left:l}=e;l+280>window.innerWidth&&(l=Math.max(8,window.innerWidth-288)),r.style.top=`${c}px`,r.style.left=`${l}px`;const d=t.tagName.toLowerCase(),g=t.id?`#${t.id}`:"",i=t.classList.length>0?`.${[...t.classList].slice(0,3).join(".")}`:"",a=document.createElement("div");if(a.style.cssText=`color:${n.primary};font-weight:bold;margin-bottom:4px;word-break:break-all;`,a.textContent=`${d}${g}${i}`,r.append(a),o){const m=document.createElement("div");m.style.cssText=`color:${n.muted};margin-bottom:10px;word-break:break-all;font-size:10px;`,m.textContent=o,r.append(m)}const u=document.createElement("div");u.style.cssText="display:flex;gap:6px;flex-wrap:wrap;",o&&u.append(k("Open in editor",()=>{J(o),b()})),u.append(k("Copy HTML",()=>{navigator.clipboard.writeText(t.outerHTML).catch(()=>{}),b()})),o&&u.append(k("Copy path",()=>{navigator.clipboard.writeText(o).catch(()=>{}),b()})),r.append(u);const p=document.createElement("button");p.textContent="×",p.style.cssText=["position:absolute","top:6px","right:8px","background:transparent","border:none",`color:${n.muted}`,"cursor:pointer","font:16px/1 'JetBrains Mono',monospace","padding:0","line-height:1","transition:color 0.15s"].join(";"),p.addEventListener("pointerover",()=>{p.style.color=n.fg}),p.addEventListener("pointerout",()=>{p.style.color=n.muted}),p.addEventListener("click",m=>{m.stopPropagation(),b()}),r.append(p),document.body.append(r);const w=s(m=>{r.contains(m.target)||(b(),document.removeEventListener("click",w,!0),v=void 0)},"handleOutside"),j=setTimeout(()=>{document.addEventListener("click",w,!0)},100);v=s(()=>{clearTimeout(j),document.removeEventListener("click",w,!0)},"removePopupOutsideHandler")},"showResultPopup");let f;const K=s(t=>{f?.(),D(),S(!0);const e=s(()=>document.querySelector(`#${y}`)??void 0,"badgeElement"),o=s(i=>{if(!i)return!1;const a=e();return!!(a&&(i===a||a.contains(i)))},"isOverBadge"),n=s(i=>{if(!i)return!1;const a=document.querySelector(`#${h}`);return!!(a&&(i===a||a.contains(i)))},"isOverResultPopup"),r={cleanup(){document.removeEventListener("mousemove",r.handleMouseMove),document.removeEventListener("click",r.handleClick,!0),document.removeEventListener("keydown",r.handleKeyDown),_(),V(),S(!1),I(),f=void 0},handleClick(i){const a=i.target;if(!a||a.tagName==="DEV-TOOLBAR"||o(a)||n(a))return;i.preventDefault(),i.stopPropagation();const u=a.getBoundingClientRect(),p=O(a);_(),G(a,u,p)},handleKeyDown(i){i.key==="Escape"&&(r.cleanup(),t())},handleMouseMove(i){const a=i.target;if(!a||a.tagName==="DEV-TOOLBAR"||o(a)||n(a)){_();return}N(a)}},{cleanup:c,handleClick:l,handleKeyDown:d,handleMouseMove:g}=r;z(()=>{c(),t()}),document.addEventListener("mousemove",g),document.addEventListener("click",l,!0),document.addEventListener("keydown",d),f=c},"startGlobalInspection"),F=s(()=>{f?.(),b()},"stopGlobalInspection"),X={icon:P,id:"dev-toolbar:inspector",name:"Inspector",onClick(){const t=globalThis.__VISULIMA_DEVTOOLS__;K(()=>{t?.setAppActive&&t.setAppActive("dev-toolbar:inspector",!1)})},onDeactivate(){F()}};export{X as default};

package/dist/apps/inspector/inspector-app.d.ts

@@ -1,11 +1,13 @@
 /**
  * Start element inspection mode.
  * Attaches crosshair cursor, hover highlight overlay, and a floating badge.
+ * Inspection stays active after each click so the user can inspect multiple
+ * elements without re-activating. Only stops on explicit cancel (Escape,
+ * badge Cancel button) or via {@link stopGlobalInspection}.
  * Survives component unmounts — state lives at module level.
- * @param onComplete Called when the user clicks an element (after cleanup).
  * @param onCancel Called when the user cancels via badge button or Escape.
  */
-export declare const startGlobalInspection: (onComplete: () => void, onCancel: () => void) => void;
+export declare const startGlobalInspection: (onCancel: () => void) => void;
 /**
  * Cancel any in-progress inspection and clean up all DOM side-effects.
  */

package/dist/apps/module-graph/index.js

@@ -1 +1,20 @@
-var U=Object.defineProperty;var w=(o,i)=>U(o,"name",{value:i,configurable:!0});import $ from"lucide-static/icons/network.svg?raw";import{addHookName as n}from"preact/devtools";import{useState as s,useRef as E,useEffect as A}from"preact/hooks";import C from"../../packem_shared/cn-DWLJYh3h.js";import{jsx as r,jsxs as t}from"preact/jsx-runtime";import h from"../../packem_shared/Button-DODNCTPZ.js";import G from"../../packem_shared/Input-GfbOwAkK.js";var S=Object.defineProperty,d=w((o,i)=>S(o,"name",{value:i,configurable:!0}),"o");const F={css:"bg-purple-500/15 text-purple-400 border-purple-500/30",js:"bg-green-500/15 text-green-400 border-green-500/30",json:"bg-yellow-500/15 text-yellow-400 border-yellow-500/30",jsx:"bg-green-500/15 text-green-400 border-green-500/30",svg:"bg-orange-500/15 text-orange-400 border-orange-500/30",ts:"bg-blue-500/15 text-blue-400 border-blue-500/30",tsx:"bg-blue-500/15 text-blue-400 border-blue-500/30",vue:"bg-emerald-500/15 text-emerald-400 border-emerald-500/30"},H=/\.([a-z]+)(?:\?|$)/i,N=d(o=>o.match(H)?.[1]?.toLowerCase()??"?","getExtension"),j=d(({ext:o})=>r("span",{class:C("inline-flex px-1.5 py-0.5 text-[0.6rem] font-mono font-bold uppercase border",F[o]??"bg-foreground/6 text-muted-foreground border-border"),children:o}),"ExtensionBadge"),T=d(({helpers:o})=>{const[i,I]=n(s([]),"modules"),[L,p]=n(s(!0),"loading"),[v,y]=n(s(void 0),"error"),[f,R]=n(s(""),"search"),[c,u]=n(s(void 0),"selectedId"),[k,x]=n(s([]),"importersList"),z=n(E(null),"searchRef"),g=d(()=>{p(!0),y(void 0),u(void 0),o.rpc.getModuleGraph().then(e=>{const a=e.map(l=>({ext:N(l.url??l.id??""),id:l.id??l.url??"",importers:l.importerCount??0,importerUrls:Array.isArray(l.importerUrls)?l.importerUrls:[],url:l.url??l.id??""}));I(a),p(!1)}).catch(e=>{y(e.message??"Failed to load module graph"),p(!1)})},"load");A(()=>{g()},[]);const b=i.filter(e=>{const a=f.toLowerCase();return!a||e.url.toLowerCase().includes(a)||e.ext.includes(a)}),m=c?i.find(e=>e.id===c):void 0,M=d(e=>{if(c===e.id){u(void 0),x([]);return}u(e.id),x(e.importerUrls)},"showImporters");return L?t("div",{class:"flex flex-col items-center justify-center h-full gap-3 p-8 select-none",children:[r("div",{"aria-hidden":"true",class:"flex gap-1.5 items-center",children:[0,160,320].map(e=>r("span",{class:"size-1.5 bg-primary/50 rounded-full animate-pulse",style:{animationDelay:`${e}ms`}},e))}),r("span",{class:"text-[0.75rem] text-muted-foreground",children:"Scanning module graph…"})]}):v?t("div",{class:"flex flex-col items-center justify-center h-full gap-3 p-8 text-center",children:[r("p",{class:"text-[0.8rem] text-destructive",children:v}),r(h,{onClick:g,size:"sm",variant:"outline",children:"Retry"})]}):t("div",{class:"flex flex-col h-full",children:[t("div",{class:"flex items-center gap-2 px-4 py-2.5 border-b border-border shrink-0",children:[r(G,{class:"flex-1 bg-foreground/4 font-mono text-[0.8rem] placeholder:text-muted-foreground/50 focus-visible:border-primary/50 border-border",onInput:d(e=>R(e.target.value),"onInput"),placeholder:"Filter modules…",ref:z,type:"text",value:f}),t("span",{class:"text-[0.7rem] text-muted-foreground shrink-0",children:[b.length," / ",i.length]}),r(h,{onClick:g,size:"sm",variant:"outline",children:"Refresh"})]}),t("div",{class:"flex flex-1 min-h-0 overflow-hidden",children:[r("div",{class:"flex-1 overflow-auto divide-y divide-border/30",children:b.length===0?t("div",{class:"flex items-center justify-center p-8 text-[0.8rem] text-muted-foreground",children:['No modules match "',f,'"']}):b.map(e=>t("button",{class:C("w-full flex items-center gap-3 px-4 py-2.5 text-left border-0 bg-transparent cursor-pointer","hover:bg-foreground/4 transition-colors duration-100",c===e.id&&"bg-primary/6"),onClick:d(()=>M(e),"onClick"),type:"button",children:[r(j,{ext:e.ext}),r("span",{class:"flex-1 text-[0.775rem] font-mono text-foreground/80 truncate min-w-0",children:e.url}),e.importers>0&&t("span",{class:"shrink-0 text-[0.65rem] text-muted-foreground px-1.5 py-0.5 bg-foreground/6 border border-border/50",children:[e.importers,"↑"]})]},e.id))}),m&&t("div",{class:"border-l border-border bg-background w-72 shrink-0 flex flex-col overflow-hidden",children:[t("div",{class:"flex items-center justify-between gap-2 px-4 py-3 border-b border-border shrink-0",children:[r("span",{class:"text-[0.7rem] font-semibold text-foreground uppercase tracking-wide",children:"Module Info"}),r(h,{"aria-label":"Close",class:"h-6 w-6 text-xs",onClick:d(()=>{u(void 0),x([])},"onClick"),size:"icon",variant:"ghost",children:"✕"})]}),t("div",{class:"flex-1 overflow-auto p-4 space-y-3",children:[t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"URL"}),r("code",{class:"text-[0.7rem] font-mono text-foreground/80 break-all",children:m.url})]}),t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Type"}),r(j,{ext:m.ext})]}),t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Importers"}),r("span",{class:"text-[0.8rem] font-mono text-foreground",children:m.importers})]}),k.length>0&&t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Imported by"}),r("div",{class:"space-y-1",children:k.map(e=>r("code",{class:"block text-[0.65rem] font-mono text-muted-foreground break-all",children:e},e))})]})]})]})]})]})},"ModuleGraphApp"),V={component:T,icon:$,id:"dev-toolbar:module-graph",name:"Modules"};export{V as default};
+var U=Object.defineProperty;var k=(o,d)=>U(o,"name",{value:d,configurable:!0});import{addHookName as i}from"preact/devtools";import{clsx as j}from"../../packem_shared/clsx-wGlvpUfw.js";import{useState as s,useRef as E,useEffect as S}from"preact/hooks";import{jsx as r,jsxs as t}from"preact/jsx-runtime";import b from"../../packem_shared/Button-Bkx66Co7.js";import A from"../../packem_shared/Input-Cs6aduTi.js";const G=`<!-- @license lucide-static v0.577.0 - ISC -->
+<svg
+  class="lucide lucide-network"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <rect x="16" y="16" width="6" height="6" rx="1" />
+  <rect x="2" y="16" width="6" height="6" rx="1" />
+  <rect x="9" y="2" width="6" height="6" rx="1" />
+  <path d="M5 16v-3a1 1 0 0 1 1-1h12a1 1 0 0 1 1 1v3" />
+  <path d="M12 12V8" />
+</svg>
+`;var $=Object.defineProperty,n=k((o,d)=>$(o,"name",{value:d,configurable:!0}),"o");const B={css:"bg-purple-500/15 text-purple-400 border-purple-500/30",js:"bg-green-500/15 text-green-400 border-green-500/30",json:"bg-yellow-500/15 text-yellow-400 border-yellow-500/30",jsx:"bg-green-500/15 text-green-400 border-green-500/30",svg:"bg-orange-500/15 text-orange-400 border-orange-500/30",ts:"bg-blue-500/15 text-blue-400 border-blue-500/30",tsx:"bg-blue-500/15 text-blue-400 border-blue-500/30",vue:"bg-emerald-500/15 text-emerald-400 border-emerald-500/30"},F=/\.([a-z]+)(?:\?|$)/i,H=n(o=>o.match(F)?.[1]?.toLowerCase()??"?","getExtension"),C=n(({ext:o})=>r("span",{class:j("inline-flex px-1.5 py-0.5 text-[0.6rem] font-mono font-bold uppercase border",B[o]??"bg-foreground/6 text-muted-foreground border-border"),children:o}),"ExtensionBadge"),N=n(({helpers:o})=>{const[d,I]=i(s([]),"modules"),[M,p]=i(s(!0),"loading"),[v,w]=i(s(void 0),"error"),[x,L]=i(s(""),"search"),[c,u]=i(s(void 0),"selectedId"),[y,h]=i(s([]),"importersList"),R=i(E(null),"searchRef"),f=n(()=>{p(!0),w(void 0),u(void 0),o.rpc.getModuleGraph().then(e=>{const a=e.map(l=>({ext:H(l.url??l.id??""),id:l.id??l.url??"",importers:l.importerCount??0,importerUrls:Array.isArray(l.importerUrls)?l.importerUrls:[],url:l.url??l.id??""}));I(a),p(!1)}).catch(e=>{w(e.message??"Failed to load module graph"),p(!1)})},"load");S(()=>{f()},[]);const g=d.filter(e=>{const a=x.toLowerCase();return!a||e.url.toLowerCase().includes(a)||e.ext.includes(a)}),m=c?d.find(e=>e.id===c):void 0,z=n(e=>{if(c===e.id){u(void 0),h([]);return}u(e.id),h(e.importerUrls)},"showImporters");return M?t("div",{class:"flex flex-col items-center justify-center h-full gap-3 p-8 select-none",children:[r("div",{"aria-hidden":"true",class:"flex gap-1.5 items-center",children:[0,160,320].map(e=>r("span",{class:"size-1.5 bg-primary/50 rounded-full animate-pulse",style:{animationDelay:`${e}ms`}},e))}),r("span",{class:"text-[0.75rem] text-muted-foreground",children:"Scanning module graph…"})]}):v?t("div",{class:"flex flex-col items-center justify-center h-full gap-3 p-8 text-center",children:[r("p",{class:"text-[0.8rem] text-destructive",children:v}),r(b,{onClick:f,size:"sm",variant:"outline",children:"Retry"})]}):t("div",{class:"flex flex-col h-full",children:[t("div",{class:"flex items-center gap-2 px-4 py-2.5 border-b border-border shrink-0",children:[r(A,{class:"flex-1 bg-foreground/4 font-mono text-[0.8rem] placeholder:text-muted-foreground/50 focus-visible:border-primary/50 border-border",onInput:n(e=>L(e.target.value),"onInput"),placeholder:"Filter modules…",ref:R,type:"text",value:x}),t("span",{class:"text-[0.7rem] text-muted-foreground shrink-0",children:[g.length," / ",d.length]}),r(b,{onClick:f,size:"sm",variant:"outline",children:"Refresh"})]}),t("div",{class:"flex flex-1 min-h-0 overflow-hidden",children:[r("div",{class:"flex-1 overflow-auto divide-y divide-border/30",children:g.length===0?t("div",{class:"flex items-center justify-center p-8 text-[0.8rem] text-muted-foreground",children:['No modules match "',x,'"']}):g.map(e=>t("button",{class:j("w-full flex items-center gap-3 px-4 py-2.5 text-left border-0 bg-transparent cursor-pointer","hover:bg-foreground/4 transition-colors duration-100",c===e.id&&"bg-primary/6"),onClick:n(()=>z(e),"onClick"),type:"button",children:[r(C,{ext:e.ext}),r("span",{class:"flex-1 text-[0.775rem] font-mono text-foreground/80 truncate min-w-0",children:e.url}),e.importers>0&&t("span",{class:"shrink-0 text-[0.65rem] text-muted-foreground px-1.5 py-0.5 bg-foreground/6 border border-border/50",children:[e.importers,"↑"]})]},e.id))}),m&&t("div",{class:"border-l border-border bg-background w-72 shrink-0 flex flex-col overflow-hidden",children:[t("div",{class:"flex items-center justify-between gap-2 px-4 py-3 border-b border-border shrink-0",children:[r("span",{class:"text-[0.7rem] font-semibold text-foreground uppercase tracking-wide",children:"Module Info"}),r(b,{"aria-label":"Close",class:"h-6 w-6 text-xs",onClick:n(()=>{u(void 0),h([])},"onClick"),size:"icon",variant:"ghost",children:"✕"})]}),t("div",{class:"flex-1 overflow-auto p-4 space-y-3",children:[t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"URL"}),r("code",{class:"text-[0.7rem] font-mono text-foreground/80 break-all",children:m.url})]}),t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Type"}),r(C,{ext:m.ext})]}),t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Importers"}),r("span",{class:"text-[0.8rem] font-mono text-foreground",children:m.importers})]}),y.length>0&&t("div",{children:[r("div",{class:"text-[0.6rem] uppercase tracking-wider text-muted-foreground mb-1",children:"Imported by"}),r("div",{class:"space-y-1",children:y.map(e=>r("code",{class:"block text-[0.65rem] font-mono text-muted-foreground break-all",children:e},e))})]})]})]})]})]})},"ModuleGraphApp"),K={component:N,icon:G,id:"dev-toolbar:module-graph",name:"Modules"};export{K as default};

package/dist/apps/module-graph/module-graph-app.d.ts

@@ -1,4 +1,3 @@
-/** @jsxImportSource preact */
 import type { ComponentChildren } from "preact";
 import type { AppComponentProps } from "../../types/app.d.ts";
 declare const ModuleGraphApp: ({ helpers }: AppComponentProps) => ComponentChildren;

package/dist/apps/performance/index.js

@@ -1 +1,17 @@
-var L=Object.defineProperty;var f=(t,e)=>L(t,"name",{value:e,configurable:!0});import j from"lucide-static/icons/gauge.svg?raw";import{addHookName as w}from"preact/devtools";import{useState as M,useRef as H,useEffect as C}from"preact/hooks";import c from"../../packem_shared/cn-DWLJYh3h.js";import{jsx as r,jsxs as n}from"preact/jsx-runtime";var I=Object.defineProperty,x=f((t,e)=>I(t,"name",{value:e,configurable:!0}),"n");const z={cls:{good:.1,poor:.25},fcp:{good:1800,poor:3e3},fid:{good:100,poor:300},lcp:{good:2500,poor:4e3},ttfb:{good:800,poor:1800}},y=x((t,e)=>{const{good:s,poor:i}=z[t];return e<=s?"good":e<=i?"needs-improvement":"poor"},"getCwvRating");class P{static{f(this,"f")}static{x(this,"PerformanceMonitor")}clsValue=0;fpsSamples=[];listeners=new Set;longTaskIdCounter=0;longTasks=[];memory=void 0;memoryInterval=void 0;observers=[];rafId=void 0;running=!1;vitals={cls:void 0,fcp:void 0,fid:void 0,lcp:void 0,ttfb:void 0};clearLongTasks(){this.longTasks=[],this.emit()}getSnapshot(){return{fps:this.currentFps(),longTasks:[...this.longTasks],memory:this.memory,vitals:{...this.vitals}}}start(){this.running||globalThis.window===void 0||(this.running=!0,this.startFps(),this.startMemory(),this.startCwv(),this.startLongTasks(),this.loadTtfb())}stop(){if(this.running){this.running=!1,this.rafId!==void 0&&(cancelAnimationFrame(this.rafId),this.rafId=void 0),this.memoryInterval!==void 0&&(clearInterval(this.memoryInterval),this.memoryInterval=void 0);for(const e of this.observers)e.disconnect();this.observers=[]}}subscribe(e){return this.listeners.add(e),()=>{this.listeners.delete(e)}}currentFps(){if(this.fpsSamples.length<2)return 0;const e=this.fpsSamples.slice(-Math.min(this.fpsSamples.length,10));if(e.length<2)return 0;let s=0,i=0;for(let o=1;o<e.length;o+=1){const a=e[o]-e[o-1];a>0&&a<500&&(s+=a,i+=1)}return i===0?0:Math.min(60,Math.round(1e3/(s/i)))}emit(){const e=this.getSnapshot();for(const s of this.listeners)s(e)}loadTtfb(){const e=performance.getEntriesByType("navigation");e.length>0&&e[0]&&(this.vitals.ttfb=Math.round(e[0].responseStart-e[0].requestStart),this.emit())}startCwv(){this.tryObserve("largest-contentful-paint",e=>{const s=e.getEntries().at(-1);s&&(this.vitals.lcp=Math.round(s.startTime),this.emit())}),this.tryObserve("layout-shift",e=>{for(const s of e.getEntries()){const i=s;i.hadRecentInput||(this.clsValue+=i.value,this.vitals.cls=Math.round(this.clsValue*1e3)/1e3)}this.emit()}),this.tryObserve("first-input",e=>{const s=e.getEntries()[0];s&&(this.vitals.fid=Math.round(s.processingStart-s.startTime),this.emit())}),this.tryObserve("paint",e=>{for(const s of e.getEntries())s.name==="first-contentful-paint"&&(this.vitals.fcp=Math.round(s.startTime),this.emit())})}startFps(){let e;const s=x(i=>{this.running&&(e!==void 0&&(this.fpsSamples.push(i),this.fpsSamples.length>60&&this.fpsSamples.shift(),this.fpsSamples.length%16===0&&this.emit()),e=i,this.rafId=requestAnimationFrame(s))},"tick");this.rafId=requestAnimationFrame(s)}startLongTasks(){this.tryObserve("longtask",e=>{for(const s of e.getEntries())this.longTaskIdCounter+=1,this.longTasks.push({duration:Math.round(s.duration),id:`lt-${this.longTaskIdCounter}`,startTime:Math.round(s.startTime)}),this.longTasks.length>100&&this.longTasks.shift();this.emit()})}startMemory(){const e=performance;if(!e.memory)return;const s=x(()=>{e.memory&&(this.memory={jsHeapSizeLimit:e.memory.jsHeapSizeLimit,totalJSHeapSize:e.memory.totalJSHeapSize,usedJSHeapSize:e.memory.usedJSHeapSize},this.emit())},"read");s(),this.memoryInterval=setInterval(s,1e3)}tryObserve(e,s){try{const i=new PerformanceObserver(s);i.observe({buffered:!0,type:e}),this.observers.push(i)}catch{}}}const p=new P;var J=Object.defineProperty,m=f((t,e)=>J(t,"name",{value:e,configurable:!0}),"i");const k=m(t=>t<1024?`${t} B`:t<1024*1024?`${(t/1024).toFixed(1)} KB`:`${(t/(1024*1024)).toFixed(1)} MB`,"formatBytes"),B=m(t=>`${t} ms`,"formatMs"),T={good:"text-success-foreground","needs-improvement":"text-warning-foreground",poor:"text-destructive"},O={good:"bg-success/10 border-success/30","needs-improvement":"bg-warning/10 border-warning/30",poor:"bg-destructive/10 border-destructive/30"},R=m(({samples:t})=>{if(t.length<2)return r("svg",{height:36,width:120});const e=120/(t.length-1),s=t.map((i,o)=>{const a=o*e,l=36-i/60*36;return`${a.toFixed(1)},${l.toFixed(1)}`}).join(" ");return r("svg",{height:36,style:"overflow: visible",width:120,children:r("polyline",{fill:"none",points:s,stroke:"currentColor","stroke-linejoin":"round","stroke-width":"1.5"})})},"FpsSparkline"),E=m(({memory:t})=>{const e=t.usedJSHeapSize/t.jsHeapSizeLimit*100,s=t.totalJSHeapSize/t.jsHeapSizeLimit*100,i=e>50?"bg-warning":"bg-success",o=e>80?"bg-destructive":i;return n("div",{class:"space-y-1.5",children:[n("div",{class:"relative h-2 bg-foreground/8 rounded-full overflow-hidden",children:[r("div",{class:"absolute left-0 top-0 h-full bg-foreground/12 rounded-full",style:{width:`${s}%`}}),r("div",{class:c("absolute left-0 top-0 h-full rounded-full",o),style:{width:`${e}%`}})]}),n("div",{class:"flex justify-between text-[0.65rem] text-muted-foreground",children:[n("span",{children:["Used: ",r("span",{class:"text-foreground font-medium",children:k(t.usedJSHeapSize)})]}),n("span",{children:["Total: ",r("span",{class:"text-foreground font-medium",children:k(t.totalJSHeapSize)})]}),n("span",{children:["Limit: ",r("span",{class:"text-foreground font-medium",children:k(t.jsHeapSizeLimit)})]})]})]})},"MemoryBar"),A=m(({label:t,metric:e,unit:s,value:i})=>{if(i===void 0)return n("div",{class:"flex flex-col items-center gap-1 p-3 border border-border bg-foreground/2 min-w-0",children:[r("span",{class:"text-[0.6rem] text-muted-foreground uppercase tracking-wider font-semibold truncate w-full text-center",children:t}),r("span",{class:"text-[0.7rem] text-muted-foreground/50",children:"—"})]});const o=y(e,i),a=e==="cls"?i.toFixed(3):B(i);return n("div",{class:c("flex flex-col items-center gap-1 p-3 border min-w-0",O[o]),children:[r("span",{class:"text-[0.6rem] text-muted-foreground uppercase tracking-wider font-semibold truncate w-full text-center",children:t}),r("span",{class:c("text-[0.9rem] font-bold tabular-nums",T[o]),children:a}),r("span",{class:"text-[0.6rem] text-muted-foreground/70 uppercase tracking-wide",children:s})]})},"CwvCard"),V=m(({task:t})=>n("div",{class:"flex items-center gap-3 px-3 py-2 border-b border-border/50 last:border-0 text-[0.7rem]",children:[n("span",{class:"text-muted-foreground tabular-nums w-20 shrink-0",children:[t.startTime.toLocaleString()," ms"]}),r("div",{class:"flex-1 bg-foreground/6 rounded-sm overflow-hidden h-2",children:r("div",{class:"h-full bg-warning",style:{width:`${Math.min(100,t.duration/200*100)}%`},title:`${t.duration} ms`})}),n("span",{class:"text-warning-foreground font-semibold tabular-nums w-16 text-right shrink-0",children:[t.duration," ms"]})]}),"LongTaskRow"),g=m(({action:t,children:e,title:s})=>n("section",{class:"border border-border",children:[n("div",{class:"flex items-center justify-between px-4 py-2.5 bg-foreground/3 border-b border-border",children:[r("span",{class:"text-[0.7rem] font-semibold text-foreground uppercase tracking-wide",children:s}),t]}),r("div",{class:"p-4",children:e})]}),"Section"),q=120,N=m(t=>{const[e,s]=w(M(()=>p.getSnapshot()),"snapshot"),i=w(H([]),"fpsHistoryRef");C(()=>(p.start(),p.subscribe(d=>{i.current.push(d.fps),i.current.length>q&&i.current.shift(),s(d)})),[]);const{fps:o,longTasks:a,memory:l,vitals:u}=e,b=o>=30?"needs-improvement":"poor",h=o>=50?"good":b,$=[{label:"LCP",metric:"lcp",unit:"ms",value:u.lcp},{label:"FID",metric:"fid",unit:"ms",value:u.fid},{label:"CLS",metric:"cls",unit:"score",value:u.cls},{label:"FCP",metric:"fcp",unit:"ms",value:u.fcp},{label:"TTFB",metric:"ttfb",unit:"ms",value:u.ttfb}];return n("div",{class:"p-5 space-y-4",children:[r(g,{title:"FPS",children:n("div",{class:"flex items-end gap-5",children:[n("div",{class:"flex flex-col items-center gap-0.5 shrink-0",children:[r("span",{class:c("text-3xl font-bold tabular-nums leading-none",T[h]),children:o}),r("span",{class:"text-[0.6rem] text-muted-foreground uppercase tracking-wide",children:"fps"})]}),r("div",{class:c("flex-1 min-w-0",T[h]),children:r(R,{samples:i.current})}),n("div",{class:"flex flex-col justify-between h-9 text-[0.6rem] text-muted-foreground/50 shrink-0 tabular-nums",children:[r("span",{children:"60"}),r("span",{children:"30"}),r("span",{children:"0"})]})]})}),l?r(g,{title:"JS Heap Memory",children:r(E,{memory:l})}):r(g,{title:"JS Heap Memory",children:n("p",{class:"text-[0.72rem] text-muted-foreground text-center py-2",children:["Not available — enable ",r("code",{class:"font-mono text-foreground/70",children:"--enable-precise-memory-info"})," in Chrome flags."]})}),n(g,{title:"Core Web Vitals",children:[r("div",{class:"grid grid-cols-3 gap-2",children:$.map(d=>r(A,{label:d.label,metric:d.metric,unit:d.unit,value:d.value},d.metric))}),r("p",{class:"mt-2 text-[0.62rem] text-muted-foreground/60",children:"Measured from page load. Reload to refresh. LCP and FID update as the page is interacted with."})]}),r(g,{action:a.length>0?r("button",{class:"px-2 py-0.5 text-[0.65rem] border border-border text-muted-foreground hover:text-foreground cursor-pointer bg-transparent transition-colors",onClick:m(()=>p.clearLongTasks(),"onClick"),type:"button",children:"Clear"}):void 0,title:`Long Tasks${a.length>0?` (${a.length})`:""}`,children:a.length===0?r("p",{class:"text-[0.72rem] text-muted-foreground text-center py-2",children:"No long tasks detected yet."}):r("div",{class:"max-h-48 overflow-y-auto devtools-content-scroll",children:a.map(d=>r(V,{task:d},d.id))})})]})},"PerformanceApp");var D=Object.defineProperty,S=f((t,e)=>D(t,"name",{value:e,configurable:!0}),"l");const F=S(t=>t<1024*1024?`${(t/1024).toFixed(0)} KB`:`${(t/(1024*1024)).toFixed(1)} MB`,"formatBytes"),v={good:"text-success-foreground","needs-improvement":"text-warning-foreground",poor:"text-destructive"},K=S(({samples:t})=>{if(t.length<2)return r("svg",{height:24,width:60});const e=60/(t.length-1),s=t.map((i,o)=>`${(o*e).toFixed(1)},${(24-i/60*24).toFixed(1)}`).join(" ");return r("svg",{height:24,style:"overflow:visible",width:60,children:r("polyline",{fill:"none",points:s,stroke:"currentColor","stroke-linejoin":"round","stroke-width":"1.5"})})},"MiniSparkline"),W=S(({memory:t})=>{const e=t.usedJSHeapSize/t.jsHeapSizeLimit*100,s=e>50?"bg-warning":"bg-success",i=e>80?"bg-destructive":s;return n("div",{class:"flex items-center gap-2",children:[r("div",{class:"flex-1 h-1.5 bg-foreground/8 rounded-full overflow-hidden",children:r("div",{class:c("h-full rounded-full",i),style:{width:`${e}%`}})}),n("span",{class:"text-[0.65rem] tabular-nums text-muted-foreground shrink-0",children:[F(t.usedJSHeapSize)," / ",F(t.jsHeapSizeLimit)]})]})},"MiniMemoryBar"),U=60,G=S(t=>{const[e,s]=w(M(()=>p.getSnapshot()),"snapshot"),i=w(H([]),"fpsHistoryRef");C(()=>(p.start(),p.subscribe(h=>{i.current.push(h.fps),i.current.length>U&&i.current.shift(),s(h)})),[]);const{fps:o,memory:a,vitals:l}=e,u=o>=30?"needs-improvement":"poor",b=o>=50?"good":u;return n("div",{class:"space-y-3 min-w-[200px]",children:[n("div",{class:"flex items-end gap-3",children:[n("div",{class:"flex flex-col items-center gap-0 shrink-0",children:[r("span",{class:c("text-2xl font-bold tabular-nums leading-none",v[b]),children:o}),r("span",{class:"text-[0.55rem] text-muted-foreground uppercase tracking-wide",children:"fps"})]}),r("div",{class:c("flex-1 min-w-0",v[b]),children:r(K,{samples:i.current})})]}),n("div",{class:"flex gap-3",children:[l.lcp!==void 0&&n("div",{class:"flex flex-col gap-0.5",children:[r("span",{class:"text-[0.55rem] text-muted-foreground uppercase tracking-wide",children:"LCP"}),n("span",{class:c("text-[0.8rem] font-semibold tabular-nums",v[y("lcp",l.lcp)]),children:[l.lcp," ms"]})]}),l.fcp!==void 0&&n("div",{class:"flex flex-col gap-0.5",children:[r("span",{class:"text-[0.55rem] text-muted-foreground uppercase tracking-wide",children:"FCP"}),n("span",{class:c("text-[0.8rem] font-semibold tabular-nums",v[y("fcp",l.fcp)]),children:[l.fcp," ms"]})]}),l.cls!==void 0&&n("div",{class:"flex flex-col gap-0.5",children:[r("span",{class:"text-[0.55rem] text-muted-foreground uppercase tracking-wide",children:"CLS"}),r("span",{class:c("text-[0.8rem] font-semibold tabular-nums",v[y("cls",l.cls)]),children:l.cls.toFixed(3)})]}),l.lcp===void 0&&l.fcp===void 0&&l.cls===void 0&&r("span",{class:"text-[0.65rem] text-muted-foreground/50",children:"Collecting metrics…"})]}),a&&n("div",{children:[r("span",{class:"text-[0.55rem] text-muted-foreground uppercase tracking-wide block mb-1",children:"Heap"}),r(W,{memory:a})]})]})},"PerformanceTooltip"),te={component:N,icon:j,id:"dev-toolbar:performance",name:"Performance",tooltip:G};export{te as default};
+var j=Object.defineProperty;var f=(t,e)=>j(t,"name",{value:e,configurable:!0});import{addHookName as w}from"preact/devtools";import{clsx as c}from"../../packem_shared/clsx-wGlvpUfw.js";import{useState as C,useRef as F,useEffect as H}from"preact/hooks";import{jsx as r,jsxs as i}from"preact/jsx-runtime";const L=`<!-- @license lucide-static v0.577.0 - ISC -->
+<svg
+  class="lucide lucide-gauge"
+  xmlns="http://www.w3.org/2000/svg"
+  width="24"
+  height="24"
+  viewBox="0 0 24 24"
+  fill="none"
+  stroke="currentColor"
+  stroke-width="2"
+  stroke-linecap="round"
+  stroke-linejoin="round"
+>
+  <path d="m12 14 4-4" />
+  <path d="M3.34 19a10 10 0 1 1 17.32 0" />
+</svg>
+`;var I=Object.defineProperty,x=f((t,e)=>I(t,"name",{value:e,configurable:!0}),"n");const z={cls:{good:.1,poor:.25},fcp:{good:1800,poor:3e3},fid:{good:100,poor:300},lcp:{good:2500,poor:4e3},ttfb:{good:800,poor:1800}},y=x((t,e)=>{const{good:s,poor:n}=z[t];return e<=s?"good":e<=n?"needs-improvement":"poor"},"getCwvRating");class P{static{f(this,"f")}static{x(this,"PerformanceMonitor")}clsValue=0;fpsSamples=[];listeners=new Set;longTaskIdCounter=0;longTasks=[];memory=void 0;memoryInterval=void 0;observers=[];rafId=void 0;running=!1;vitals={cls:void 0,fcp:void 0,fid:void 0,lcp:void 0,ttfb:void 0};clearLongTasks(){this.longTasks=[],this.emit()}getSnapshot(){return{fps:this.currentFps(),longTasks:[...this.longTasks],memory:this.memory,vitals:{...this.vitals}}}start(){this.running||globalThis.window===void 0||(this.running=!0,this.startFps(),this.startMemory(),this.startCwv(),this.startLongTasks(),this.loadTtfb())}stop(){if(this.running){this.running=!1,this.rafId!==void 0&&(cancelAnimationFrame(this.rafId),this.rafId=void 0),this.memoryInterval!==void 0&&(clearInterval(this.memoryInterval),this.memoryInterval=void 0);for(const e of this.observers)e.disconnect();this.observers=[]}}subscribe(e){return this.listeners.add(e),()=>{this.listeners.delete(e)}}currentFps(){if(this.fpsSamples.length<2)return 0;const e=this.fpsSamples.slice(-Math.min(this.fpsSamples.length,10));if(e.length<2)return 0;let s=0,n=0;for(let o=1;o<e.length;o+=1){const a=e[o]-e[o-1];a>0&&a<500&&(s+=a,n+=1)}return n===0?0:Math.min(60,Math.round(1e3/(s/n)))}emit(){const e=this.getSnapshot();for(const s of this.listeners)s(e)}loadTtfb(){const e=performance.getEntriesByType("navigation");e.length>0&&e[0]&&(this.vitals.ttfb=Math.round(e[0].responseStart-e[0].requestStart),this.emit())}startCwv(){this.tryObserve("largest-contentful-paint",e=>{const s=e.getEntries().at(-1);s&&(this.vitals.lcp=Math.round(s.startTime),this.emit())}),this.tryObserve("layout-shift",e=>{for(const s of e.getEntries()){const n=s;n.hadRecentInput||(this.clsValue+=n.value,this.vitals.cls=Math.round(this.clsValue*1e3)/1e3)}this.emit()}),this.tryObserve("first-input",e=>{const s=e.getEntries()[0];s&&(this.vitals.fid=Math.round(s.processingStart-s.startTime),this.emit())}),this.tryObserve("paint",e=>{for(const s of e.getEntries())s.name==="first-contentful-paint"&&(this.vitals.fcp=Math.round(s.startTime),this.emit())})}startFps(){let e;const s=x(n=>{this.running&&(e!==void 0&&(this.fpsSamples.push(n),this.fpsSamples.length>60&&this.fpsSamples.shift(),this.fpsSamples.length%16===0&&this.emit()),e=n,this.rafId=requestAnimationFrame(s))},"tick");this.rafId=requestAnimationFrame(s)}startLongTasks(){this.tryObserve("longtask",e=>{for(const s of e.getEntries())this.longTaskIdCounter+=1,this.longTasks.push({duration:Math.round(s.duration),id:`lt-${this.longTaskIdCounter}`,startTime:Math.round(s.startTime)}),this.longTasks.length>100&&this.longTasks.shift();this.emit()})}startMemory(){const e=performance;if(!e.memory)return;const s=x(()=>{e.memory&&(this.memory={jsHeapSizeLimit:e.memory.jsHeapSizeLimit,totalJSHeapSize:e.memory.totalJSHeapSize,usedJSHeapSize:e.memory.usedJSHeapSize},this.emit())},"read");s(),this.memoryInterval=setInterval(s,1e3)}tryObserve(e,s){try{const n=new PerformanceObserver(s);n.observe({buffered:!0,type:e}),this.observers.push(n)}catch{}}}const p=new P;var B=Object.defineProperty,u=f((t,e)=>B(t,"name",{value:e,configurable:!0}),"i");const S=u(t=>t<1024?`${t} B`:t<1024*1024?`${(t/1024).toFixed(1)} KB`:`${(t/(1024*1024)).toFixed(1)} MB`,"formatBytes"),J=u(t=>`${t} ms`,"formatMs"),T={good:"text-success-foreground","needs-improvement":"text-warning-foreground",poor:"text-destructive"},O={good:"bg-success/10 border-success/30","needs-improvement":"bg-warning/10 border-warning/30",poor:"bg-destructive/10 border-destructive/30"},R=u(({samples:t})=>{if(t.length<2)return r("svg",{height:36,width:120});const e=120/(t.length-1),s=t.map((n,o)=>{const a=o*e,l=36-n/60*36;return`${a.toFixed(1)},${l.toFixed(1)}`}).join(" ");return r("svg",{height:36,style:"overflow: visible",width:120,children:r("polyline",{fill:"none",points:s,stroke:"currentColor","stroke-linejoin":"round","stroke-width":"1.5"})})},"FpsSparkline"),E=u(({memory:t})=>{const e=t.usedJSHeapSize/t.jsHeapSizeLimit*100,s=t.totalJSHeapSize/t.jsHeapSizeLimit*100,n=e>50?"bg-warning":"bg-success",o=e>80?"bg-destructive":n;return i("div",{class:"space-y-1.5",children:[i("div",{class:"relative h-2 bg-foreground/8 rounded-full overflow-hidden",children:[r("div",{class:"absolute left-0 top-0 h-full bg-foreground/12 rounded-full",style:{width:`${s}%`}}),r("div",{class:c("absolute left-0 top-0 h-full rounded-full",o),style:{width:`${e}%`}})]}),i("div",{class:"flex justify-between text-[0.65rem] text-muted-foreground",children:[i("span",{children:["Used: ",r("span",{class:"text-foreground font-medium",children:S(t.usedJSHeapSize)})]}),i("span",{children:["Total: ",r("span",{class:"text-foreground font-medium",children:S(t.totalJSHeapSize)})]}),i("span",{children:["Limit: ",r("span",{class:"text-foreground font-medium",children:S(t.jsHeapSizeLimit)})]})]})]})},"MemoryBar"),A=u(({label:t,metric:e,unit:s,value:n})=>{if(n===void 0)return i("div",{class:"flex flex-col items-center gap-1 p-3 border border-border bg-foreground/2 min-w-0",children:[r("span",{class:"text-[0.6rem] text-muted-foreground uppercase tracking-wider font-semibold truncate w-full text-center",children:t}),r("span",{class:"text-[0.7rem] text-muted-foreground/50",children:"—"})]});const o=y(e,n),a=e==="cls"?n.toFixed(3):J(n);return i("div",{class:c("flex flex-col items-center gap-1 p-3 border min-w-0",O[o]),children:[r("span",{class:"text-[0.6rem] text-muted-foreground uppercase tracking-wider font-semibold truncate w-full text-center",children:t}),r("span",{class:c("text-[0.9rem] font-bold tabular-nums",T[o]),children:a}),r("span",{class:"text-[0.6rem] text-muted-foreground/70 uppercase tracking-wide",children:s})]})},"CwvCard"),V=u(({task:t})=>i("div",{class:"flex items-center gap-3 px-3 py-2 border-b border-border/50 last:border-0 text-[0.7rem]",children:[i("span",{class:"text-muted-foreground tabular-nums w-20 shrink-0",children:[t.startTime.toLocaleString()," ms"]}),r("div",{class:"flex-1 bg-foreground/6 rounded-sm overflow-hidden h-2",children:r("div",{class:"h-full bg-warning",style:{width:`${Math.min(100,t.duration/200*100)}%`},title:`${t.duration} ms`})}),i("span",{class:"text-warning-foreground font-semibold tabular-nums w-16 text-right shrink-0",children:[t.duration," ms"]})]}),"LongTaskRow"),g=u(({action:t,children:e,title:s})=>i("section",{class:"border border-border",children:[i("div",{class:"flex items-center justify-between px-4 py-2.5 bg-foreground/3 border-b border-border",children:[r("span",{class:"text-[0.7rem] font-semibold text-foreground uppercase tracking-wide",children:s}),t]}),r("div",{class:"p-4",children:e})]}),"Section"),q=120,N=u(t=>{const[e,s]=w(C(()=>p.getSnapshot()),"snapshot"),n=w(F([]),"fpsHistoryRef");H(()=>(p.start(),p.subscribe(d=>{n.current.push(d.fps),n.current.length>q&&n.current.shift(),s(d)})),[]);const{fps:o,longTasks:a,memory:l,vitals:m}=e,b=o>=30?"needs-improvement":"poor",h=o>=50?"good":b,$=[{label:"LCP",metric:"lcp",unit:"ms",value:m.lcp},{label:"FID",metric:"fid",unit:"ms",value:m.fid},{label:"CLS",metric:"cls",unit:"score",value:m.cls},{label:"FCP",metric:"fcp",unit:"ms",value:m.fcp},{label:"TTFB",metric:"ttfb",unit:"ms",value:m.ttfb}];return i("div",{class:"p-5 space-y-4",children:[r(g,{title:"FPS",children:i("div",{class:"flex items-end gap-5",children:[i("div",{class:"flex flex-col items-center gap-0.5 shrink-0",children:[r("span",{class:c("text-3xl font-bold tabular-nums leading-none",T[h]),children:o}),r("span",{class:"text-[0.6rem] text-muted-foreground uppercase tracking-wide",children:"fps"})]}),r("div",{class:c("flex-1 min-w-0",T[h]),children:r(R,{samples:n.current})}),i("div",{class:"flex flex-col justify-between h-9 text-[0.6rem] text-muted-foreground/50 shrink-0 tabular-nums",children:[r("span",{children:"60"}),r("span",{children:"30"}),r("span",{children:"0"})]})]})}),l?r(g,{title:"JS Heap Memory",children:r(E,{memory:l})}):r(g,{title:"JS Heap Memory",children:i("p",{class:"text-[0.72rem] text-muted-foreground text-center py-2",children:["Not available — enable ",r("code",{class:"font-mono text-foreground/70",children:"--enable-precise-memory-info"})," in Chrome flags."]})}),i(g,{title:"Core Web Vitals",children:[r("div",{class:"grid grid-cols-3 gap-2",children:$.map(d=>r(A,{label:d.label,metric:d.metric,unit:d.unit,value:d.value},d.metric))}),r("p",{class:"mt-2 text-[0.62rem] text-muted-foreground/60",children:"Measured from page load. Reload to refresh. LCP and FID update as the page is interacted with."})]}),r(g,{action:a.length>0?r("button",{class:"px-2 py-0.5 text-[0.65rem] border border-border text-muted-foreground hover:text-foreground cursor-pointer bg-transparent transition-colors",onClick:u(()=>p.clearLongTasks(),"onClick"),type:"button",children:"Clear"}):void 0,title:`Long Tasks${a.length>0?` (${a.length})`:""}`,children:a.length===0?r("p",{class:"text-[0.72rem] text-muted-foreground text-center py-2",children:"No long tasks detected yet."}):r("div",{class:"max-h-48 overflow-y-auto devtools-content-scroll",children:a.map(d=>r(V,{task:d},d.id))})})]})},"PerformanceApp");var D=Object.defineProperty,k=f((t,e)=>D(t,"name",{value:e,configurable:!0}),"l");const M=k(t=>t<1024*1024?`${(t/1024).toFixed(0)} KB`:`${(t/(1024*1024)).toFixed(1)} MB`,"formatBytes"),v={good:"text-success-foreground","needs-improvement":"text-warning-foreground",poor:"text-destructive"},K=k(({samples:t})=>{if(t.length<2)return r("svg",{height:24,width:60});const e=60/(t.length-1),s=t.map((n,o)=>`${(o*e).toFixed(1)},${(24-n/60*24).toFixed(1)}`).join(" ");return r("svg",{height:24,style:"overflow:visible",width:60,children:r("polyline",{fill:"none",points:s,stroke:"currentColor","stroke-linejoin":"round","stroke-width":"1.5"})})},"MiniSparkline"),W=k(({memory:t})=>{const e=t.usedJSHeapSize/t.jsHeapSizeLimit*100,s=e>50?"bg-warning":"bg-success",n=e>80?"bg-destructive":s;return i("div",{class:"flex items-center gap-2",children:[r("div",{class:"flex-1 h-1.5 bg-foreground/8 rounded-full overflow-hidden",children:r("div",{class:c("h-full rounded-full",n),style:{width:`${e}%`}})}),i("span",{class:"text-[0.65rem] tabular-nums text-muted-foreground shrink-0",children:[M(t.usedJSHeapSize)," / ",M(t.jsHeapSizeLimit)]})]})},"MiniMemoryBar"),U=60,G=k(t=>{const[e,s]=w(C(()=>p.getSnapshot()),"snapshot"),n=w(F([]),"fpsHistoryRef");H(()=>(p.start(),p.subscribe(h=>{n.current.push(h.fps),n.current.length>U&&n.current.shift(),s(h)})),[]);const{fps:o,memory:a,vitals:l}=e,m=o>=30?"needs-improvement":"poor",b=o>=50?"good":m;return i("div",{class:"space-y-3 min-w-[200px]",children:[i("div",{class:"flex items-end gap-3",children:[i("div",{class:"flex flex-col items-center gap-0 shrink-0",children:[r("span",{class:c("text-2xl font-bold tabular-nums leading-none",v[b]),children:o}),r("span",{class:"text-[0.55rem] text-muted-foreground uppercase tracking-wide",children:"fps"})]}),r("div",{class:c("flex-1 min-w-0",v[b]),children:r(K,{samples:n.current})})]}),i("div",{class:"flex gap-3",children:[l.lcp!==void 0&&i("div",{class:"flex flex-col gap-0.5",children:[r("span",{class:"text-[0.55rem] text-muted-foreground uppercase tracking-wide",children:"LCP"}),i("span",{class:c("text-[0.8rem] font-semibold tabular-nums",v[y("lcp",l.lcp)]),children:[l.lcp," ms"]})]}),l.fcp!==void 0&&i("div",{class:"flex flex-col gap-0.5",children:[r("span",{class:"text-[0.55rem] text-muted-foreground uppercase tracking-wide",children:"FCP"}),i("span",{class:c("text-[0.8rem] font-semibold tabular-nums",v[y("fcp",l.fcp)]),children:[l.fcp," ms"]})]}),l.cls!==void 0&&i("div",{class:"flex flex-col gap-0.5",children:[r("span",{class:"text-[0.55rem] text-muted-foreground uppercase tracking-wide",children:"CLS"}),r("span",{class:c("text-[0.8rem] font-semibold tabular-nums",v[y("cls",l.cls)]),children:l.cls.toFixed(3)})]}),l.lcp===void 0&&l.fcp===void 0&&l.cls===void 0&&r("span",{class:"text-[0.65rem] text-muted-foreground/50",children:"Collecting metrics…"})]}),a&&i("div",{children:[r("span",{class:"text-[0.55rem] text-muted-foreground uppercase tracking-wide block mb-1",children:"Heap"}),r(W,{memory:a})]})]})},"PerformanceTooltip"),ee={component:N,icon:L,id:"dev-toolbar:performance",name:"Performance",tooltip:G};export{ee as default};

package/dist/apps/performance/performance-app.d.ts

@@ -1,4 +1,3 @@
-/** @jsxImportSource preact */
 import type { ComponentChildren } from "preact";
 import type { AppComponentProps } from "../../types/app.d.ts";
 declare const PerformanceApp: (_props: AppComponentProps) => ComponentChildren;

package/dist/apps/performance/performance-tooltip.d.ts

@@ -1,4 +1,3 @@
-/** @jsxImportSource preact */
 import type { ComponentChildren } from "preact";
 import type { AppTooltipProps } from "../../types/app.d.ts";
 declare const PerformanceTooltip: (_props: AppTooltipProps) => ComponentChildren;