@mcpc-tech/unplugin-dev-inspector-mcp 0.1.7 → 0.1.8

This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
@@ -352,7 +352,7 @@ Available Terminal Logs (Recent 50):
352
352
  ${i||`None`}
353
353
 
354
354
  IMPORTANT: For this task, you MUST call the "context_selector" tool to return your selection. Do NOT use inspector tools like list_inspections, capture_element_context, update_inspection_status, or execute_page_script - the context is already provided above. You may read files if needed to understand the context better. Even if you select nothing, still call context_selector with empty arrays. Do not reply with text only. Note: You can ignore logs from dev-inspector itself.
355
- `,o=f.find(e=>e.name===c)||f[0];await fe({text:a},{body:{agent:o,envVars:{},inferContext:!0,isAutomated:!0}})},ge=e=>{switch(e){case`error`:return`bg-red-500/20 text-red-500`;case`warn`:return`bg-yellow-500/20 text-yellow-600`;case`info`:return`bg-blue-500/20 text-blue-500`;case`debug`:return`bg-purple-500/20 text-purple-500`;default:return`bg-muted text-muted-foreground`}},_e=n?.elementInfo?.computedStyles?.typography,ve=[{id:`code`,label:`Code`,selectedCount:r.includeElement?1:0},{id:`styles`,label:`Styles`,selectedCount:r.includeStyles?1:0},{id:`page`,label:`Page`,selectedCount:r.includePageInfo?1:0},{id:`screenshot`,label:`Visual`,selectedCount:r.includeScreenshot?1:0},{id:`console`,label:`Console`,totalCount:w.length,selectedCount:r.consoleIds.length},{id:`network`,label:`Network`,totalCount:T.length,selectedCount:r.networkIds.length},{id:`stdio`,label:`Terminal`,totalCount:E.length,selectedCount:r.stdioIds.length}];return(0,M.jsxs)(`div`,{className:`border border-border rounded-md overflow-hidden`,children:[(0,M.jsxs)(`div`,{className:`w-full flex items-center justify-between px-3 py-2 text-sm bg-muted/30 border-b border-border`,children:[(0,M.jsxs)(`div`,{className:`flex items-center gap-2 text-muted-foreground font-medium`,children:[(0,M.jsx)(`span`,{children:`Context`}),A>0&&(0,M.jsx)(`span`,{className:`px-1.5 py-0.5 text-xs bg-primary text-primary-foreground rounded-full`,children:A})]}),(0,M.jsxs)(`div`,{className:`flex items-center gap-1`,children:[(0,M.jsxs)(`button`,{type:`button`,onClick:e=>{e.stopPropagation(),he()},disabled:D||me,className:N(`flex items-center gap-1.5 px-2 py-1 text-xs font-medium rounded transition-colors border shadow-sm`,me?`bg-blue-100 text-blue-700 border-blue-200`:`bg-blue-50 text-blue-600 border-blue-200 hover:bg-blue-100 hover:text-blue-700 hover:border-blue-300`),title:`Let AI analyze logs and network to select relevant context`,children:[(0,M.jsx)(xn,{className:N(`w-3.5 h-3.5`,me&&`animate-pulse`)}),(0,M.jsx)(`span`,{children:me?`Analyzing...`:`Smart Select`})]}),(0,M.jsx)(`button`,{type:`button`,onClick:e=>{e.stopPropagation(),k()},disabled:D,className:`p-1 hover:bg-accent rounded transition-colors`,title:`Refresh`,children:(0,M.jsx)(yn,{className:N(`w-3.5 h-3.5`,D&&`animate-spin`)})})]})]}),(0,M.jsxs)(`div`,{children:[(0,M.jsx)(`div`,{className:`flex gap-1 border-b border-border px-2 pt-1`,children:ve.map(e=>(0,M.jsx)(O$,{tab:e,isActive:u===e.id,onClick:()=>d(e.id)},e.id))}),(0,M.jsxs)(`div`,{className:`max-h-[200px] overflow-auto relative ${me?`min-h-[150px]`:``}`,children:[me&&(()=>{let e=ue[ue.length-1],t=e?.role===`assistant`?Bh(e):``,n=e?.role===`assistant`?Uh(e):null;return(0,M.jsxs)(`div`,{className:`absolute inset-0 z-10 bg-background/95 backdrop-blur-sm flex flex-col items-center justify-center p-4 min-h-[120px]`,children:[(0,M.jsx)(xn,{className:`w-6 h-6 text-blue-500 animate-pulse mb-3`}),(0,M.jsx)(`span`,{className:`text-sm font-medium text-foreground text-center max-w-full truncate px-2`,children:n?`Running: ${w$(n)}`:`Analyzing context...`}),t&&(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground leading-relaxed text-center mt-2 line-clamp-2 max-w-[280px]`,children:t})]})})(),O&&(u===`console`||u===`network`)&&(0,M.jsx)(`div`,{className:`p-2 text-xs text-destructive`,children:O}),r.reasoning&&!me&&(0,M.jsx)(`div`,{className:`bg-blue-50/50 p-2 border-b border-border`,children:(0,M.jsxs)(`div`,{className:`flex items-start gap-2`,children:[(0,M.jsx)(xn,{className:`w-3.5 h-3.5 text-blue-500 mt-0.5 flex-shrink-0`}),(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground leading-relaxed italic`,children:r.reasoning})]})}),u===`code`&&(0,M.jsx)(`div`,{className:`p-2 space-y-1`,children:(()=>{let e=n?.relatedElements&&n.relatedElements.length>0?n.relatedElements:n?[n]:[],t=n?.relatedElements&&n.relatedElements.length>0,a=e.reduce((e,t,n)=>{let r=t.file||`unknown`;return e[r]||(e[r]=[]),e[r].push({el:t,idx:n}),e},{});return(0,M.jsxs)(`div`,{children:[(0,M.jsxs)(`div`,{className:`flex items-center gap-1.5 px-2 mb-2`,children:[(0,M.jsx)(cn,{className:t?`w-3.5 h-3.5 text-muted-foreground`:`w-4 h-4 text-blue-500`}),(0,M.jsx)(`div`,{className:`text-xs font-medium text-muted-foreground`,children:t?`Related Elements`:`Source Location`}),t&&(0,M.jsx)(`span`,{className:`ml-auto px-1.5 py-0.5 text-[10px] bg-muted text-muted-foreground rounded-full`,children:e.length})]}),(0,M.jsx)(`div`,{className:`space-y-2 max-h-60 overflow-y-auto`,children:Object.entries(a).map(([e,n])=>(0,M.jsxs)(`div`,{className:`space-y-0.5`,children:[(0,M.jsxs)(`div`,{className:`px-2 py-1 text-[11px] font-medium text-muted-foreground/70 bg-muted/30 rounded sticky top-0`,children:[e,` (`,n.length,`)`]}),n.map(({el:e,idx:n})=>(0,M.jsxs)(`div`,{className:`group relative`,children:[(0,M.jsxs)(`label`,{className:`flex items-start gap-2 pl-4 pr-8 py-1.5 rounded hover:bg-accent/50 cursor-pointer transition-colors relative`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:t?r.relatedElementIds.includes(n):r.includeElement,onChange:()=>t?le(n):j(),className:`mt-0.5 rounded border-border`}),(0,M.jsxs)(`div`,{className:`flex-1 min-w-0 text-xs font-mono`,children:[(0,M.jsxs)(`div`,{className:`flex items-center gap-1.5`,children:[(0,M.jsx)(`span`,{className:`text-foreground/80 font-medium`,children:e.component}),(0,M.jsx)(`span`,{className:`text-muted-foreground/50`,children:`•`}),(0,M.jsxs)(`span`,{className:`text-muted-foreground`,children:[e.line,`:`,e.column]})]}),e.elementInfo&&(0,M.jsxs)(`div`,{className:`text-[10px] text-muted-foreground/60 mt-0.5 space-x-2`,children:[e.elementInfo.className&&(0,M.jsxs)(`span`,{children:[`.`,e.elementInfo.className.split(` `)[0]]}),e.elementInfo.id&&(0,M.jsxs)(`span`,{children:[`#`,e.elementInfo.id]}),e.elementInfo.textContent&&(0,M.jsxs)(`span`,{className:`italic`,children:[`"`,e.elementInfo.textContent.trim().slice(0,20),e.elementInfo.textContent.length>20?`...`:``,`"`]})]}),r.elementNotes[n]&&(0,M.jsxs)(`div`,{className:`mt-1.5 text-[11px] text-yellow-600 dark:text-yellow-500 bg-yellow-50 dark:bg-yellow-900/20 px-1.5 py-0.5 rounded border border-yellow-200 dark:border-yellow-900/40 flex items-start gap-1`,children:[(0,M.jsx)(gn,{className:`w-3 h-3 mt-0.5 flex-shrink-0`}),(0,M.jsx)(`span`,{className:`break-words`,children:r.elementNotes[n]})]})]})]}),(0,M.jsx)(`button`,{onClick:e=>{e.stopPropagation(),e.preventDefault(),S(n)},className:N(`absolute right-1 top-1.5 p-1 rounded transition-colors`,r.elementNotes[n]?`text-yellow-600 hover:bg-yellow-100 opacity-100`:`text-muted-foreground/40 hover:text-foreground hover:bg-accent opacity-0 group-hover:opacity-100`),title:`Add note to element`,children:(0,M.jsx)(gn,{className:`w-3.5 h-3.5`})}),x===n&&(0,M.jsx)(`div`,{className:`px-4 py-2 bg-muted/30 border-t border-b border-border`,children:(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`input`,{type:`text`,autoFocus:!0,placeholder:`Describe issue with this element...`,className:`flex-1 text-xs bg-background border border-input rounded px-2 py-1 focus:outline-none focus:ring-1 focus:ring-primary`,defaultValue:r.elementNotes[n]||``,onKeyDown:e=>{if(e.key===`Enter`){e.preventDefault();let t=e.currentTarget.value.trim();i(e=>{let r={...e.elementNotes};return t?r[n]=t:delete r[n],{...e,elementNotes:r}}),S(null)}else e.key===`Escape`&&S(null)},onBlur:e=>{let t=e.currentTarget.value.trim();t!==(r.elementNotes[n]||``)&&i(e=>{let r={...e.elementNotes};return t?r[n]=t:delete r[n],{...e,elementNotes:r}}),S(null)}}),(0,M.jsx)(`button`,{onClick:()=>S(null),className:`text-muted-foreground hover:text-foreground`,children:(0,M.jsx)(On,{className:`w-3.5 h-3.5`})})]})})]},n))]},e))})]})})()}),u===`styles`&&(0,M.jsx)(`div`,{className:`p-2 space-y-1`,children:(0,M.jsxs)(`label`,{className:`flex items-start gap-2 p-2 rounded hover:bg-accent/50 cursor-pointer transition-colors`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:r.includeStyles,onChange:ie,className:`mt-0.5 rounded border-border`}),(0,M.jsx)(En,{className:`w-4 h-4 text-purple-500 flex-shrink-0`}),(0,M.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,M.jsx)(`div`,{className:`text-xs font-medium text-foreground`,children:`Computed Styles`}),_e&&(0,M.jsxs)(`div`,{className:`text-xs text-muted-foreground space-y-0.5 mt-1`,children:[(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Font:`}),(0,M.jsx)(`span`,{className:`font-mono truncate`,children:_e.fontFamily})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Size:`}),(0,M.jsx)(`span`,{className:`font-mono`,children:_e.fontSize}),(0,M.jsx)(`span`,{className:`text-muted-foreground/70 ml-2`,children:`Weight:`}),(0,M.jsx)(`span`,{className:`font-mono`,children:_e.fontWeight})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Color:`}),(0,M.jsxs)(`span`,{className:`font-mono flex items-center gap-1`,children:[(0,M.jsx)(`span`,{className:`inline-block w-3 h-3 rounded border border-border`,style:{backgroundColor:_e.color}}),_e.color]})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Line Height:`}),(0,M.jsx)(`span`,{className:`font-mono`,children:_e.lineHeight})]})]}),!_e&&(0,M.jsx)(`div`,{className:`text-xs text-muted-foreground/50 italic`,children:`No style data available`})]})]})}),u===`screenshot`&&(0,M.jsx)(`div`,{className:`p-2 space-y-1`,children:a?(0,M.jsxs)(`label`,{className:`flex items-start gap-2 p-2 rounded hover:bg-accent/50 cursor-pointer transition-colors`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:r.includeScreenshot,onChange:ae,className:`mt-0.5 rounded border-border`}),(0,M.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,M.jsx)(`div`,{className:`text-xs font-medium text-foreground mb-1`,children:`Element Visual`}),(0,M.jsx)(`div`,{className:`text-[10px] text-muted-foreground/70 mb-2`,children:`Note: Copy & Go only copies text (IDEs don't support mixed text/image paste). To include the image, please right-click and copy it manually.`}),(0,M.jsx)(`div`,{className:`rounded border border-border overflow-hidden bg-muted/30`,children:(0,M.jsx)(`img`,{src:a,alt:`Element Visual`,className:`w-full h-auto max-h-[150px] object-contain`})})]})]}):(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground text-center py-4`,children:`No visual available`})}),u===`page`&&(0,M.jsx)(`div`,{className:`p-2 space-y-1`,children:C?(0,M.jsxs)(`label`,{className:`flex items-start gap-2 p-2 rounded hover:bg-accent/50 cursor-pointer transition-colors`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:r.includePageInfo,onChange:oe,className:`mt-0.5 rounded border-border`}),(0,M.jsx)(dn,{className:`w-4 h-4 text-green-500 flex-shrink-0`}),(0,M.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,M.jsx)(`div`,{className:`text-xs font-medium text-foreground mb-1`,children:`Page Information`}),(0,M.jsxs)(`div`,{className:`text-xs text-muted-foreground space-y-1`,children:[(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`URL:`}),(0,M.jsx)(`span`,{className:`font-mono truncate`,children:C.url})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Title:`}),(0,M.jsx)(`span`,{className:`truncate`,children:C.title})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Viewport:`}),(0,M.jsxs)(`span`,{className:`font-mono`,children:[C.viewport.width,` × `,C.viewport.height]})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Language:`}),(0,M.jsx)(`span`,{className:`font-mono`,children:C.language})]})]})]})]}):(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground text-center py-4`,children:`Loading page info...`})}),D&&u!==`code`&&u!==`styles`&&u!==`screenshot`&&u!==`page`&&(0,M.jsx)(`div`,{className:`flex items-center justify-center py-6`,children:(0,M.jsx)(mn,{className:`w-5 h-5 animate-spin text-muted-foreground`})}),!D&&u===`console`&&(0,M.jsxs)(`div`,{className:`p-2 space-y-1`,children:[(0,M.jsxs)(`div`,{className:`relative mb-2`,children:[(0,M.jsx)(bn,{className:`absolute left-2 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-muted-foreground`}),(0,M.jsx)(`input`,{type:`text`,value:m,onChange:e=>h(e.target.value),placeholder:`Filter logs...`,className:`w-full pl-7 pr-7 py-1.5 text-xs rounded border border-border bg-background focus:outline-none focus:ring-1 focus:ring-ring`}),m&&(0,M.jsx)(`button`,{type:`button`,onClick:()=>h(``),className:`absolute right-2 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground`,children:(0,M.jsx)(On,{className:`w-3.5 h-3.5`})})]}),ee.length===0?(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground text-center py-4`,children:m?`No matching logs`:`No console logs`}):ee.map(e=>(0,M.jsxs)(`label`,{className:`flex items-start gap-2 p-2 rounded hover:bg-accent/50 cursor-pointer transition-colors`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:r.consoleIds.includes(e.msgid),onChange:()=>se(e.msgid),className:`mt-0.5 rounded border-border`}),(0,M.jsx)(`span`,{className:N(`px-1.5 py-0.5 text-[10px] font-medium rounded flex-shrink-0`,ge(e.level)),children:e.level}),(0,M.jsx)(`span`,{className:`text-xs text-foreground/90 flex-1 font-mono break-all line-clamp-2`,children:e.text})]},e.msgid))]}),!D&&u===`network`&&(0,M.jsxs)(`div`,{className:`p-2 space-y-1`,children:[(0,M.jsxs)(`div`,{className:`relative mb-2`,children:[(0,M.jsx)(bn,{className:`absolute left-2 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-muted-foreground`}),(0,M.jsx)(`input`,{type:`text`,value:_,onChange:e=>v(e.target.value),placeholder:`Filter requests...`,className:`w-full pl-7 pr-7 py-1.5 text-xs rounded border border-border bg-background focus:outline-none focus:ring-1 focus:ring-ring`}),_&&(0,M.jsx)(`button`,{type:`button`,onClick:()=>v(``),className:`absolute right-2 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground`,children:(0,M.jsx)(On,{className:`w-3.5 h-3.5`})})]}),te.length===0?(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground text-center py-4`,children:_?`No matching requests`:`No network requests`}):te.map(n=>(0,M.jsx)(ra,{request:n,client:e,isClientReady:t,mode:`select`,isSelected:r.networkIds.includes(n.reqid),onSelectionChange:re,onDetailsFetched:ne,cachedDetails:y[n.reqid]},n.reqid))]}),!D&&u===`stdio`&&(0,M.jsx)(`div`,{className:`p-2 space-y-1`,children:E.length===0?(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground text-center py-4`,children:`No terminal logs`}):E.map(e=>(0,M.jsxs)(`label`,{className:`flex items-start gap-2 p-2 rounded hover:bg-accent/50 cursor-pointer transition-colors`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:r.stdioIds.includes(e.stdioid),onChange:()=>ce(e.stdioid),className:`mt-0.5 rounded border-border`}),(0,M.jsx)(`span`,{className:N(`px-1.5 py-0.5 text-[10px] font-medium rounded flex-shrink-0 border`,e.stream===`stderr`?`bg-red-500/10 text-red-500 border-red-500/20`:`bg-zinc-500/10 text-zinc-500 border-zinc-500/20`),children:e.stream}),(0,M.jsx)(`span`,{className:`text-xs text-foreground/90 flex-1 font-mono break-all whitespace-pre-wrap`,children:e.data})]},e.stdioid))})]})]})]})};function A$(e){if(!e)return``;let{tagName:t,textContent:n,className:r,id:i,domPath:a,boundingBox:o}=e,s=`### DOM Element
355
+ `,o=f.find(e=>e.name===c)||f[0];await fe({text:a},{body:{agent:o,envVars:{},inferContext:!0,isAutomated:!0}})},ge=e=>{switch(e){case`error`:return`bg-red-500/20 text-red-500`;case`warn`:return`bg-yellow-500/20 text-yellow-600`;case`info`:return`bg-blue-500/20 text-blue-500`;case`debug`:return`bg-purple-500/20 text-purple-500`;default:return`bg-muted text-muted-foreground`}},_e=n?.elementInfo?.computedStyles?.typography,ve=[{id:`code`,label:`Code`,selectedCount:r.includeElement?1:0},{id:`styles`,label:`Styles`,selectedCount:r.includeStyles?1:0},{id:`page`,label:`Page`,selectedCount:r.includePageInfo?1:0},{id:`screenshot`,label:`Visual`,selectedCount:r.includeScreenshot?1:0},{id:`console`,label:`Console`,totalCount:w.length,selectedCount:r.consoleIds.length},{id:`network`,label:`Network`,totalCount:T.length,selectedCount:r.networkIds.length},{id:`stdio`,label:`Terminal`,totalCount:E.length,selectedCount:r.stdioIds.length}];return(0,M.jsxs)(`div`,{className:`border border-border rounded-md overflow-hidden`,children:[(0,M.jsxs)(`div`,{className:`w-full flex items-center justify-between px-3 py-2 text-sm bg-muted/30 border-b border-border`,children:[(0,M.jsxs)(`div`,{className:`flex items-center gap-2 text-muted-foreground font-medium`,children:[(0,M.jsx)(`span`,{children:`Context`}),A>0&&(0,M.jsx)(`span`,{className:`px-1.5 py-0.5 text-xs bg-primary text-primary-foreground rounded-full`,children:A})]}),(0,M.jsxs)(`div`,{className:`flex items-center gap-1`,children:[(0,M.jsxs)(`button`,{type:`button`,onClick:e=>{e.stopPropagation(),he()},disabled:D||me,className:N(`flex items-center gap-1.5 px-2 py-1 text-xs font-medium rounded transition-colors border shadow-sm`,me?`bg-blue-100 text-blue-700 border-blue-200`:`bg-blue-50 text-blue-600 border-blue-200 hover:bg-blue-100 hover:text-blue-700 hover:border-blue-300`),title:`Let AI analyze logs and network to select relevant context`,children:[(0,M.jsx)(xn,{className:N(`w-3.5 h-3.5`,me&&`animate-pulse`)}),(0,M.jsx)(`span`,{children:me?`Analyzing...`:`Smart Select`})]}),(0,M.jsx)(`button`,{type:`button`,onClick:e=>{e.stopPropagation(),k()},disabled:D,className:`p-1 hover:bg-accent rounded transition-colors`,title:`Refresh`,children:(0,M.jsx)(yn,{className:N(`w-3.5 h-3.5`,D&&`animate-spin`)})})]})]}),(0,M.jsxs)(`div`,{children:[(0,M.jsx)(`div`,{className:`flex gap-1 border-b border-border px-2 pt-1`,children:ve.map(e=>(0,M.jsx)(O$,{tab:e,isActive:u===e.id,onClick:()=>d(e.id)},e.id))}),(0,M.jsxs)(`div`,{className:`max-h-[200px] overflow-auto relative ${me?`min-h-[150px]`:``}`,children:[me&&(()=>{let e=ue[ue.length-1],t=e?.role===`assistant`?Bh(e):``,n=e?.role===`assistant`?Uh(e):null;return(0,M.jsxs)(`div`,{className:`absolute inset-0 z-10 bg-background/95 backdrop-blur-sm flex flex-col items-center justify-center p-4 min-h-[120px]`,children:[(0,M.jsx)(xn,{className:`w-6 h-6 text-blue-500 animate-pulse mb-3`}),(0,M.jsx)(`span`,{className:`text-sm font-medium text-foreground text-center max-w-full truncate px-2`,children:n?`Running: ${w$(n)}`:`Analyzing context...`}),t&&(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground leading-relaxed text-center mt-2 line-clamp-2 max-w-[280px]`,children:t})]})})(),O&&(u===`console`||u===`network`)&&(0,M.jsx)(`div`,{className:`p-2 text-xs text-destructive`,children:O}),r.reasoning&&!me&&(0,M.jsx)(`div`,{className:`bg-blue-50/50 p-2 border-b border-border`,children:(0,M.jsxs)(`div`,{className:`flex items-start gap-2`,children:[(0,M.jsx)(xn,{className:`w-3.5 h-3.5 text-blue-500 mt-0.5 flex-shrink-0`}),(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground leading-relaxed italic`,children:r.reasoning})]})}),u===`code`&&(0,M.jsx)(`div`,{className:`p-2 space-y-1`,children:(()=>{let e=n?.relatedElements&&n.relatedElements.length>0?n.relatedElements:n?[n]:[],t=n?.relatedElements&&n.relatedElements.length>0,a=e.reduce((e,t,n)=>{let r=t.file||`unknown`;return e[r]||(e[r]=[]),e[r].push({el:t,idx:n}),e},{});return(0,M.jsxs)(`div`,{children:[(0,M.jsxs)(`div`,{className:`flex items-center gap-1.5 px-2 mb-2`,children:[(0,M.jsx)(cn,{className:t?`w-3.5 h-3.5 text-muted-foreground`:`w-4 h-4 text-blue-500`}),(0,M.jsx)(`div`,{className:`text-xs font-medium text-muted-foreground`,children:t?`Related Elements`:`Source Location`}),t&&(0,M.jsx)(`span`,{className:`ml-auto px-1.5 py-0.5 text-[10px] bg-muted text-muted-foreground rounded-full`,children:e.length})]}),(0,M.jsx)(`div`,{className:`space-y-2 max-h-60 overflow-y-auto`,children:Object.entries(a).map(([e,n])=>(0,M.jsxs)(`div`,{className:`space-y-0.5`,children:[(0,M.jsxs)(`div`,{className:`px-2 py-1 text-[11px] font-medium text-muted-foreground/70 bg-muted/30 rounded sticky top-0`,children:[e,` (`,n.length,`)`]}),n.map(({el:e,idx:n})=>(0,M.jsxs)(`div`,{className:`group relative`,children:[(0,M.jsxs)(`label`,{className:`flex items-start gap-2 pl-4 pr-8 py-1.5 rounded hover:bg-accent/50 cursor-pointer transition-colors relative`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:t?r.relatedElementIds.includes(n):r.includeElement,onChange:()=>t?le(n):j(),className:`mt-0.5 rounded border-border`}),(0,M.jsxs)(`div`,{className:`flex-1 min-w-0 text-xs font-mono`,children:[(0,M.jsxs)(`div`,{className:`flex items-center gap-1.5`,children:[(0,M.jsx)(`span`,{className:`text-foreground/80 font-medium`,children:e.component}),(0,M.jsx)(`span`,{className:`text-muted-foreground/50`,children:`•`}),(0,M.jsxs)(`span`,{className:`text-muted-foreground`,children:[e.line,`:`,e.column]})]}),e.elementInfo&&(0,M.jsxs)(`div`,{className:`text-[10px] text-muted-foreground/60 mt-0.5 space-x-2`,children:[typeof e.elementInfo.className==`string`&&e.elementInfo.className&&(0,M.jsxs)(`span`,{children:[`.`,e.elementInfo.className.split(` `)[0]]}),e.elementInfo.id&&(0,M.jsxs)(`span`,{children:[`#`,e.elementInfo.id]}),e.elementInfo.textContent&&(0,M.jsxs)(`span`,{className:`italic`,children:[`"`,e.elementInfo.textContent.trim().slice(0,20),e.elementInfo.textContent.length>20?`...`:``,`"`]})]}),r.elementNotes[n]&&(0,M.jsxs)(`div`,{className:`mt-1.5 text-[11px] text-yellow-600 dark:text-yellow-500 bg-yellow-50 dark:bg-yellow-900/20 px-1.5 py-0.5 rounded border border-yellow-200 dark:border-yellow-900/40 flex items-start gap-1`,children:[(0,M.jsx)(gn,{className:`w-3 h-3 mt-0.5 flex-shrink-0`}),(0,M.jsx)(`span`,{className:`break-words`,children:r.elementNotes[n]})]})]})]}),(0,M.jsx)(`button`,{onClick:e=>{e.stopPropagation(),e.preventDefault(),S(n)},className:N(`absolute right-1 top-1.5 p-1 rounded transition-colors`,r.elementNotes[n]?`text-yellow-600 hover:bg-yellow-100 opacity-100`:`text-muted-foreground/40 hover:text-foreground hover:bg-accent opacity-0 group-hover:opacity-100`),title:`Add note to element`,children:(0,M.jsx)(gn,{className:`w-3.5 h-3.5`})}),x===n&&(0,M.jsx)(`div`,{className:`px-4 py-2 bg-muted/30 border-t border-b border-border`,children:(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`input`,{type:`text`,autoFocus:!0,placeholder:`Describe issue with this element...`,className:`flex-1 text-xs bg-background border border-input rounded px-2 py-1 focus:outline-none focus:ring-1 focus:ring-primary`,defaultValue:r.elementNotes[n]||``,onKeyDown:e=>{if(e.key===`Enter`){e.preventDefault();let t=e.currentTarget.value.trim();i(e=>{let r={...e.elementNotes};return t?r[n]=t:delete r[n],{...e,elementNotes:r}}),S(null)}else e.key===`Escape`&&S(null)},onBlur:e=>{let t=e.currentTarget.value.trim();t!==(r.elementNotes[n]||``)&&i(e=>{let r={...e.elementNotes};return t?r[n]=t:delete r[n],{...e,elementNotes:r}}),S(null)}}),(0,M.jsx)(`button`,{onClick:()=>S(null),className:`text-muted-foreground hover:text-foreground`,children:(0,M.jsx)(On,{className:`w-3.5 h-3.5`})})]})})]},n))]},e))})]})})()}),u===`styles`&&(0,M.jsx)(`div`,{className:`p-2 space-y-1`,children:(0,M.jsxs)(`label`,{className:`flex items-start gap-2 p-2 rounded hover:bg-accent/50 cursor-pointer transition-colors`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:r.includeStyles,onChange:ie,className:`mt-0.5 rounded border-border`}),(0,M.jsx)(En,{className:`w-4 h-4 text-purple-500 flex-shrink-0`}),(0,M.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,M.jsx)(`div`,{className:`text-xs font-medium text-foreground`,children:`Computed Styles`}),_e&&(0,M.jsxs)(`div`,{className:`text-xs text-muted-foreground space-y-0.5 mt-1`,children:[(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Font:`}),(0,M.jsx)(`span`,{className:`font-mono truncate`,children:_e.fontFamily})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Size:`}),(0,M.jsx)(`span`,{className:`font-mono`,children:_e.fontSize}),(0,M.jsx)(`span`,{className:`text-muted-foreground/70 ml-2`,children:`Weight:`}),(0,M.jsx)(`span`,{className:`font-mono`,children:_e.fontWeight})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Color:`}),(0,M.jsxs)(`span`,{className:`font-mono flex items-center gap-1`,children:[(0,M.jsx)(`span`,{className:`inline-block w-3 h-3 rounded border border-border`,style:{backgroundColor:_e.color}}),_e.color]})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Line Height:`}),(0,M.jsx)(`span`,{className:`font-mono`,children:_e.lineHeight})]})]}),!_e&&(0,M.jsx)(`div`,{className:`text-xs text-muted-foreground/50 italic`,children:`No style data available`})]})]})}),u===`screenshot`&&(0,M.jsx)(`div`,{className:`p-2 space-y-1`,children:a?(0,M.jsxs)(`label`,{className:`flex items-start gap-2 p-2 rounded hover:bg-accent/50 cursor-pointer transition-colors`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:r.includeScreenshot,onChange:ae,className:`mt-0.5 rounded border-border`}),(0,M.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,M.jsx)(`div`,{className:`text-xs font-medium text-foreground mb-1`,children:`Element Visual`}),(0,M.jsx)(`div`,{className:`text-[10px] text-muted-foreground/70 mb-2`,children:`Note: Copy & Go only copies text (IDEs don't support mixed text/image paste). To include the image, please right-click and copy it manually.`}),(0,M.jsx)(`div`,{className:`rounded border border-border overflow-hidden bg-muted/30`,children:(0,M.jsx)(`img`,{src:a,alt:`Element Visual`,className:`w-full h-auto max-h-[150px] object-contain`})})]})]}):(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground text-center py-4`,children:`No visual available`})}),u===`page`&&(0,M.jsx)(`div`,{className:`p-2 space-y-1`,children:C?(0,M.jsxs)(`label`,{className:`flex items-start gap-2 p-2 rounded hover:bg-accent/50 cursor-pointer transition-colors`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:r.includePageInfo,onChange:oe,className:`mt-0.5 rounded border-border`}),(0,M.jsx)(dn,{className:`w-4 h-4 text-green-500 flex-shrink-0`}),(0,M.jsxs)(`div`,{className:`flex-1 min-w-0`,children:[(0,M.jsx)(`div`,{className:`text-xs font-medium text-foreground mb-1`,children:`Page Information`}),(0,M.jsxs)(`div`,{className:`text-xs text-muted-foreground space-y-1`,children:[(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`URL:`}),(0,M.jsx)(`span`,{className:`font-mono truncate`,children:C.url})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Title:`}),(0,M.jsx)(`span`,{className:`truncate`,children:C.title})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Viewport:`}),(0,M.jsxs)(`span`,{className:`font-mono`,children:[C.viewport.width,` × `,C.viewport.height]})]}),(0,M.jsxs)(`div`,{className:`flex gap-2`,children:[(0,M.jsx)(`span`,{className:`text-muted-foreground/70`,children:`Language:`}),(0,M.jsx)(`span`,{className:`font-mono`,children:C.language})]})]})]})]}):(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground text-center py-4`,children:`Loading page info...`})}),D&&u!==`code`&&u!==`styles`&&u!==`screenshot`&&u!==`page`&&(0,M.jsx)(`div`,{className:`flex items-center justify-center py-6`,children:(0,M.jsx)(mn,{className:`w-5 h-5 animate-spin text-muted-foreground`})}),!D&&u===`console`&&(0,M.jsxs)(`div`,{className:`p-2 space-y-1`,children:[(0,M.jsxs)(`div`,{className:`relative mb-2`,children:[(0,M.jsx)(bn,{className:`absolute left-2 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-muted-foreground`}),(0,M.jsx)(`input`,{type:`text`,value:m,onChange:e=>h(e.target.value),placeholder:`Filter logs...`,className:`w-full pl-7 pr-7 py-1.5 text-xs rounded border border-border bg-background focus:outline-none focus:ring-1 focus:ring-ring`}),m&&(0,M.jsx)(`button`,{type:`button`,onClick:()=>h(``),className:`absolute right-2 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground`,children:(0,M.jsx)(On,{className:`w-3.5 h-3.5`})})]}),ee.length===0?(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground text-center py-4`,children:m?`No matching logs`:`No console logs`}):ee.map(e=>(0,M.jsxs)(`label`,{className:`flex items-start gap-2 p-2 rounded hover:bg-accent/50 cursor-pointer transition-colors`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:r.consoleIds.includes(e.msgid),onChange:()=>se(e.msgid),className:`mt-0.5 rounded border-border`}),(0,M.jsx)(`span`,{className:N(`px-1.5 py-0.5 text-[10px] font-medium rounded flex-shrink-0`,ge(e.level)),children:e.level}),(0,M.jsx)(`span`,{className:`text-xs text-foreground/90 flex-1 font-mono break-all line-clamp-2`,children:e.text})]},e.msgid))]}),!D&&u===`network`&&(0,M.jsxs)(`div`,{className:`p-2 space-y-1`,children:[(0,M.jsxs)(`div`,{className:`relative mb-2`,children:[(0,M.jsx)(bn,{className:`absolute left-2 top-1/2 -translate-y-1/2 w-3.5 h-3.5 text-muted-foreground`}),(0,M.jsx)(`input`,{type:`text`,value:_,onChange:e=>v(e.target.value),placeholder:`Filter requests...`,className:`w-full pl-7 pr-7 py-1.5 text-xs rounded border border-border bg-background focus:outline-none focus:ring-1 focus:ring-ring`}),_&&(0,M.jsx)(`button`,{type:`button`,onClick:()=>v(``),className:`absolute right-2 top-1/2 -translate-y-1/2 text-muted-foreground hover:text-foreground`,children:(0,M.jsx)(On,{className:`w-3.5 h-3.5`})})]}),te.length===0?(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground text-center py-4`,children:_?`No matching requests`:`No network requests`}):te.map(n=>(0,M.jsx)(ra,{request:n,client:e,isClientReady:t,mode:`select`,isSelected:r.networkIds.includes(n.reqid),onSelectionChange:re,onDetailsFetched:ne,cachedDetails:y[n.reqid]},n.reqid))]}),!D&&u===`stdio`&&(0,M.jsx)(`div`,{className:`p-2 space-y-1`,children:E.length===0?(0,M.jsx)(`p`,{className:`text-xs text-muted-foreground text-center py-4`,children:`No terminal logs`}):E.map(e=>(0,M.jsxs)(`label`,{className:`flex items-start gap-2 p-2 rounded hover:bg-accent/50 cursor-pointer transition-colors`,children:[(0,M.jsx)(`input`,{type:`checkbox`,checked:r.stdioIds.includes(e.stdioid),onChange:()=>ce(e.stdioid),className:`mt-0.5 rounded border-border`}),(0,M.jsx)(`span`,{className:N(`px-1.5 py-0.5 text-[10px] font-medium rounded flex-shrink-0 border`,e.stream===`stderr`?`bg-red-500/10 text-red-500 border-red-500/20`:`bg-zinc-500/10 text-zinc-500 border-zinc-500/20`),children:e.stream}),(0,M.jsx)(`span`,{className:`text-xs text-foreground/90 flex-1 font-mono break-all whitespace-pre-wrap`,children:e.data})]},e.stdioid))})]})]})]})};function A$(e){if(!e)return``;let{tagName:t,textContent:n,className:r,id:i,domPath:a,boundingBox:o}=e,s=`### DOM Element
356
356
  \`\`\`
357
357
  Tag: <${t}${i?` id="${i}"`:``}${r?` class="${r}"`:``}>
358
358
  Text: ${n||`(empty)`}
package/dist/cli.cjs CHANGED
@@ -412,6 +412,49 @@ function transformConfig(options) {
412
412
  };
413
413
  }
414
414
  }
415
+ /**
416
+ * Transform entry file to add DevInspector import
417
+ */
418
+ function transformEntryFile(options) {
419
+ const { entryPath } = options;
420
+ try {
421
+ const code = (0, fs.readFileSync)(entryPath, "utf-8");
422
+ if (code.includes("virtual:dev-inspector-mcp")) return {
423
+ success: true,
424
+ modified: false,
425
+ message: "DevInspector is already imported in this file"
426
+ };
427
+ const s = new magic_string.default(code);
428
+ const ast = (0, _babel_parser.parse)(code, {
429
+ sourceType: "module",
430
+ plugins: ["typescript", "jsx"]
431
+ });
432
+ let lastImportEnd = 0;
433
+ traverse(ast, { ImportDeclaration(path$1) {
434
+ if (path$1.node.loc) lastImportEnd = Math.max(lastImportEnd, path$1.node.loc.end.line);
435
+ } });
436
+ const lines = code.split("\n");
437
+ const importLine = "import 'virtual:dev-inspector-mcp';\n";
438
+ if (lastImportEnd > 0) {
439
+ let insertPos = 0;
440
+ for (let i = 0; i < lastImportEnd; i++) insertPos += lines[i].length + 1;
441
+ s.appendLeft(insertPos, importLine);
442
+ } else s.prepend(importLine);
443
+ return {
444
+ success: true,
445
+ modified: true,
446
+ code: s.toString(),
447
+ message: "Successfully added DevInspector import to entry file"
448
+ };
449
+ } catch (error) {
450
+ return {
451
+ success: false,
452
+ modified: false,
453
+ error: error instanceof Error ? error.message : String(error),
454
+ message: "Failed to transform entry file"
455
+ };
456
+ }
457
+ }
415
458
 
416
459
  //#endregion
417
460
  //#region src/utils/package-manager.ts
@@ -474,10 +517,14 @@ async function runSetupCommand() {
474
517
  let dryRun = false;
475
518
  let configPath;
476
519
  let bundlerType;
520
+ let entryPath;
477
521
  for (let i = 0; i < args.length; i++) if (args[i] === "--dry-run") dryRun = true;
478
522
  else if (args[i] === "--config" && args[i + 1]) {
479
523
  configPath = args[i + 1];
480
524
  i++;
525
+ } else if (args[i] === "--entry" && args[i + 1]) {
526
+ entryPath = args[i + 1];
527
+ i++;
481
528
  } else if (args[i] === "--bundler" && args[i + 1]) {
482
529
  bundlerType = args[i + 1];
483
530
  i++;
@@ -485,10 +532,6 @@ async function runSetupCommand() {
485
532
  console.log(`
486
533
  ╔══════════════════════════════════════════════════════════╗
487
534
  ║ 🔧 DevInspector Setup Command ║
488
- ╠══════════════════════════════════════════════════════════╣
489
- ║ ║
490
- ║ Automatically add DevInspector to your bundler config ║
491
- ║ ║
492
535
  ╚══════════════════════════════════════════════════════════╝
493
536
 
494
537
  Usage:
@@ -496,6 +539,7 @@ Usage:
496
539
 
497
540
  Options:
498
541
  --config <path> Specify config file path (auto-detect by default)
542
+ --entry <path> Specify entry file path to add import (optional)
499
543
  --bundler <type> Specify bundler type: vite, webpack, nextjs
500
544
  --dry-run Preview changes without applying them
501
545
  --help, -h Show this help message
@@ -504,14 +548,11 @@ Examples:
504
548
  # Auto-detect and setup
505
549
  npx @mcpc-tech/unplugin-dev-inspector-mcp setup
506
550
 
551
+ # Setup defining entry file (for React Router v7 / non-HTML apps)
552
+ npx @mcpc-tech/unplugin-dev-inspector-mcp setup --entry src/main.tsx
553
+
507
554
  # Preview changes without applying
508
555
  npx @mcpc-tech/unplugin-dev-inspector-mcp setup --dry-run
509
-
510
- # Setup specific config
511
- npx @mcpc-tech/unplugin-dev-inspector-mcp setup --config vite.config.ts
512
-
513
- # Setup for specific bundler
514
- npx @mcpc-tech/unplugin-dev-inspector-mcp setup --bundler vite
515
556
  `);
516
557
  process.exit(0);
517
558
  }
@@ -565,23 +606,48 @@ Examples:
565
606
  if (result.error) console.error(` Error: ${result.error}`);
566
607
  process.exit(1);
567
608
  }
568
- if (!result.modified) {
569
- console.log(`\n✅ ${result.message}`);
570
- process.exit(0);
609
+ let entryResult;
610
+ if (entryPath) {
611
+ console.log(`\n${dryRun ? "🔍 Previewing" : "🔧 Transforming"} entry file: ${entryPath}...`);
612
+ const { transformEntryFile: transformEntryFile$1 } = await Promise.resolve().then(() => require("./codemod-transformer.cjs"));
613
+ entryResult = transformEntryFile$1({
614
+ entryPath,
615
+ dryRun
616
+ });
617
+ if (!entryResult.success) {
618
+ console.error(`\n❌ ${entryResult.message}`);
619
+ if (entryResult.error) console.error(` Error: ${entryResult.error}`);
620
+ }
571
621
  }
572
622
  if (dryRun) {
573
- console.log("\n📄 Preview of changes:");
574
- console.log("".repeat(60));
575
- console.log(result.code);
576
- console.log("─".repeat(60));
623
+ if (result.modified) {
624
+ console.log("\n📄 Preview of config changes:");
625
+ console.log("─".repeat(60));
626
+ console.log(result.code);
627
+ console.log("─".repeat(60));
628
+ } else console.log(`\n✅ Config: ${result.message}`);
629
+ if (entryPath && entryResult) {
630
+ if (entryResult.modified) {
631
+ console.log("\n📄 Preview of entry file changes:");
632
+ console.log("─".repeat(60));
633
+ console.log(entryResult.code);
634
+ console.log("─".repeat(60));
635
+ } else if (entryResult.success) console.log(`\n✅ Entry file: ${entryResult.message}`);
636
+ }
577
637
  console.log("\n💡 Run without --dry-run to apply these changes");
578
638
  process.exit(0);
579
639
  }
580
- (0, fs.writeFileSync)(targetConfig.path, result.code, "utf-8");
581
- console.log(`\n✅ ${result.message}`);
582
640
  const installed = installPackage("@mcpc-tech/unplugin-dev-inspector-mcp", true);
641
+ if (result.modified) {
642
+ (0, fs.writeFileSync)(targetConfig.path, result.code, "utf-8");
643
+ console.log(`\n✅ ${result.message}`);
644
+ } else console.log(`\n✅ ${result.message}`);
645
+ if (entryPath && entryResult && entryResult.success) if (entryResult.modified) {
646
+ (0, fs.writeFileSync)(entryPath, entryResult.code, "utf-8");
647
+ console.log(`✅ ${entryResult.message}`);
648
+ } else console.log(`✅ ${entryResult.message}`);
583
649
  console.log(`\n📝 Next steps:`);
584
- console.log(` 1. Review the changes in ${targetConfig.path} and package.json`);
650
+ console.log(` 1. Review the changes in ${targetConfig.path}${entryPath ? ` and ${entryPath}` : ""} and package.json`);
585
651
  if (!installed) {
586
652
  console.log(` 2. Install the package: npm i -D @mcpc-tech/unplugin-dev-inspector-mcp`);
587
653
  console.log(` 3. Start your dev server`);
@@ -682,4 +748,9 @@ main();
682
748
 
683
749
  //#endregion
684
750
  exports.StandaloneServer = StandaloneServer;
685
- exports.startStandaloneServer = startStandaloneServer;
751
+ exports.startStandaloneServer = startStandaloneServer;
752
+ exports.transformConfig = transformConfig;
753
+ exports.transformEntryFile = transformEntryFile;
754
+ exports.transformNextConfig = transformNextConfig;
755
+ exports.transformViteConfig = transformViteConfig;
756
+ exports.transformWebpackConfig = transformWebpackConfig;
package/dist/cli.js CHANGED
@@ -408,6 +408,49 @@ function transformConfig(options) {
408
408
  };
409
409
  }
410
410
  }
411
+ /**
412
+ * Transform entry file to add DevInspector import
413
+ */
414
+ function transformEntryFile(options) {
415
+ const { entryPath } = options;
416
+ try {
417
+ const code = readFileSync(entryPath, "utf-8");
418
+ if (code.includes("virtual:dev-inspector-mcp")) return {
419
+ success: true,
420
+ modified: false,
421
+ message: "DevInspector is already imported in this file"
422
+ };
423
+ const s = new MagicString(code);
424
+ const ast = parse(code, {
425
+ sourceType: "module",
426
+ plugins: ["typescript", "jsx"]
427
+ });
428
+ let lastImportEnd = 0;
429
+ traverse(ast, { ImportDeclaration(path$1) {
430
+ if (path$1.node.loc) lastImportEnd = Math.max(lastImportEnd, path$1.node.loc.end.line);
431
+ } });
432
+ const lines = code.split("\n");
433
+ const importLine = "import 'virtual:dev-inspector-mcp';\n";
434
+ if (lastImportEnd > 0) {
435
+ let insertPos = 0;
436
+ for (let i = 0; i < lastImportEnd; i++) insertPos += lines[i].length + 1;
437
+ s.appendLeft(insertPos, importLine);
438
+ } else s.prepend(importLine);
439
+ return {
440
+ success: true,
441
+ modified: true,
442
+ code: s.toString(),
443
+ message: "Successfully added DevInspector import to entry file"
444
+ };
445
+ } catch (error) {
446
+ return {
447
+ success: false,
448
+ modified: false,
449
+ error: error instanceof Error ? error.message : String(error),
450
+ message: "Failed to transform entry file"
451
+ };
452
+ }
453
+ }
411
454
 
412
455
  //#endregion
413
456
  //#region src/utils/package-manager.ts
@@ -470,10 +513,14 @@ async function runSetupCommand() {
470
513
  let dryRun = false;
471
514
  let configPath;
472
515
  let bundlerType;
516
+ let entryPath;
473
517
  for (let i = 0; i < args.length; i++) if (args[i] === "--dry-run") dryRun = true;
474
518
  else if (args[i] === "--config" && args[i + 1]) {
475
519
  configPath = args[i + 1];
476
520
  i++;
521
+ } else if (args[i] === "--entry" && args[i + 1]) {
522
+ entryPath = args[i + 1];
523
+ i++;
477
524
  } else if (args[i] === "--bundler" && args[i + 1]) {
478
525
  bundlerType = args[i + 1];
479
526
  i++;
@@ -481,10 +528,6 @@ async function runSetupCommand() {
481
528
  console.log(`
482
529
  ╔══════════════════════════════════════════════════════════╗
483
530
  ║ 🔧 DevInspector Setup Command ║
484
- ╠══════════════════════════════════════════════════════════╣
485
- ║ ║
486
- ║ Automatically add DevInspector to your bundler config ║
487
- ║ ║
488
531
  ╚══════════════════════════════════════════════════════════╝
489
532
 
490
533
  Usage:
@@ -492,6 +535,7 @@ Usage:
492
535
 
493
536
  Options:
494
537
  --config <path> Specify config file path (auto-detect by default)
538
+ --entry <path> Specify entry file path to add import (optional)
495
539
  --bundler <type> Specify bundler type: vite, webpack, nextjs
496
540
  --dry-run Preview changes without applying them
497
541
  --help, -h Show this help message
@@ -500,14 +544,11 @@ Examples:
500
544
  # Auto-detect and setup
501
545
  npx @mcpc-tech/unplugin-dev-inspector-mcp setup
502
546
 
547
+ # Setup defining entry file (for React Router v7 / non-HTML apps)
548
+ npx @mcpc-tech/unplugin-dev-inspector-mcp setup --entry src/main.tsx
549
+
503
550
  # Preview changes without applying
504
551
  npx @mcpc-tech/unplugin-dev-inspector-mcp setup --dry-run
505
-
506
- # Setup specific config
507
- npx @mcpc-tech/unplugin-dev-inspector-mcp setup --config vite.config.ts
508
-
509
- # Setup for specific bundler
510
- npx @mcpc-tech/unplugin-dev-inspector-mcp setup --bundler vite
511
552
  `);
512
553
  process.exit(0);
513
554
  }
@@ -561,23 +602,48 @@ Examples:
561
602
  if (result.error) console.error(` Error: ${result.error}`);
562
603
  process.exit(1);
563
604
  }
564
- if (!result.modified) {
565
- console.log(`\n✅ ${result.message}`);
566
- process.exit(0);
605
+ let entryResult;
606
+ if (entryPath) {
607
+ console.log(`\n${dryRun ? "🔍 Previewing" : "🔧 Transforming"} entry file: ${entryPath}...`);
608
+ const { transformEntryFile: transformEntryFile$1 } = await import("./codemod-transformer.js");
609
+ entryResult = transformEntryFile$1({
610
+ entryPath,
611
+ dryRun
612
+ });
613
+ if (!entryResult.success) {
614
+ console.error(`\n❌ ${entryResult.message}`);
615
+ if (entryResult.error) console.error(` Error: ${entryResult.error}`);
616
+ }
567
617
  }
568
618
  if (dryRun) {
569
- console.log("\n📄 Preview of changes:");
570
- console.log("".repeat(60));
571
- console.log(result.code);
572
- console.log("─".repeat(60));
619
+ if (result.modified) {
620
+ console.log("\n📄 Preview of config changes:");
621
+ console.log("─".repeat(60));
622
+ console.log(result.code);
623
+ console.log("─".repeat(60));
624
+ } else console.log(`\n✅ Config: ${result.message}`);
625
+ if (entryPath && entryResult) {
626
+ if (entryResult.modified) {
627
+ console.log("\n📄 Preview of entry file changes:");
628
+ console.log("─".repeat(60));
629
+ console.log(entryResult.code);
630
+ console.log("─".repeat(60));
631
+ } else if (entryResult.success) console.log(`\n✅ Entry file: ${entryResult.message}`);
632
+ }
573
633
  console.log("\n💡 Run without --dry-run to apply these changes");
574
634
  process.exit(0);
575
635
  }
576
- writeFileSync(targetConfig.path, result.code, "utf-8");
577
- console.log(`\n✅ ${result.message}`);
578
636
  const installed = installPackage("@mcpc-tech/unplugin-dev-inspector-mcp", true);
637
+ if (result.modified) {
638
+ writeFileSync(targetConfig.path, result.code, "utf-8");
639
+ console.log(`\n✅ ${result.message}`);
640
+ } else console.log(`\n✅ ${result.message}`);
641
+ if (entryPath && entryResult && entryResult.success) if (entryResult.modified) {
642
+ writeFileSync(entryPath, entryResult.code, "utf-8");
643
+ console.log(`✅ ${entryResult.message}`);
644
+ } else console.log(`✅ ${entryResult.message}`);
579
645
  console.log(`\n📝 Next steps:`);
580
- console.log(` 1. Review the changes in ${targetConfig.path} and package.json`);
646
+ console.log(` 1. Review the changes in ${targetConfig.path}${entryPath ? ` and ${entryPath}` : ""} and package.json`);
581
647
  if (!installed) {
582
648
  console.log(` 2. Install the package: npm i -D @mcpc-tech/unplugin-dev-inspector-mcp`);
583
649
  console.log(` 3. Start your dev server`);
@@ -677,4 +743,4 @@ Run with --help for more information:
677
743
  main();
678
744
 
679
745
  //#endregion
680
- export { startStandaloneServer as n, StandaloneServer as t };
746
+ export { transformWebpackConfig as a, transformViteConfig as i, transformEntryFile as n, StandaloneServer as o, transformNextConfig as r, startStandaloneServer as s, transformConfig as t };
@@ -0,0 +1,4 @@
1
+ const require_chunk = require('./chunk.cjs');
2
+ const require_cli = require('./cli.cjs');
3
+
4
+ exports.transformEntryFile = require_cli.transformEntryFile;
@@ -0,0 +1,3 @@
1
+ import { a as transformWebpackConfig, i as transformViteConfig, n as transformEntryFile, r as transformNextConfig, t as transformConfig } from "./cli.js";
2
+
3
+ export { transformEntryFile };
package/dist/index.d.cts CHANGED
@@ -1,4 +1,4 @@
1
- import * as unplugin0 from "unplugin";
1
+ import * as unplugin1 from "unplugin";
2
2
 
3
3
  //#region src/utils/config-updater.d.ts
4
4
  type EditorId = "cursor" | "vscode" | "windsurf" | "claude-code" | "antigravity";
@@ -183,10 +183,10 @@ interface DevInspectorOptions extends McpConfigOptions, AcpOptions {
183
183
  }
184
184
  //#endregion
185
185
  //#region src/core.d.ts
186
- declare const unplugin: unplugin0.UnpluginInstance<DevInspectorOptions | undefined, boolean>;
186
+ declare const unplugin: unplugin1.UnpluginInstance<DevInspectorOptions | undefined, boolean>;
187
187
  //#endregion
188
188
  //#region src/core-external.d.ts
189
- declare const unpluginExternal: unplugin0.UnpluginInstance<DevInspectorOptions | undefined, boolean>;
189
+ declare const unpluginExternal: unplugin1.UnpluginInstance<DevInspectorOptions | undefined, boolean>;
190
190
  //#endregion
191
191
  //#region src/turbopack.d.ts
192
192
  interface TurbopackDevInspectorOptions extends DevInspectorOptions {
@@ -211,7 +211,7 @@ interface TurbopackDevInspectorOptions extends DevInspectorOptions {
211
211
  declare function turbopackDevInspector(options?: TurbopackDevInspectorOptions): any;
212
212
  //#endregion
213
213
  //#region src/index.d.ts
214
- declare const external: unplugin0.UnpluginInstance<DevInspectorOptions | undefined, boolean>;
214
+ declare const external: unplugin1.UnpluginInstance<DevInspectorOptions | undefined, boolean>;
215
215
  declare module "virtual:dev-inspector-mcp" {}
216
216
  //#endregion
217
217
  export { type CustomEditorConfig, type DevInspectorOptions, type EditorId, type McpConfigOptions, type TurbopackDevInspectorOptions, unplugin as default, unplugin, external, turbopackDevInspector, unpluginExternal };
@@ -1,3 +1,3 @@
1
- import { n as startStandaloneServer, t as StandaloneServer } from "./cli.js";
1
+ import { o as StandaloneServer, s as startStandaloneServer } from "./cli.js";
2
2
 
3
3
  export { startStandaloneServer };
package/package.json CHANGED
@@ -1,6 +1,6 @@
1
1
  {
2
2
  "name": "@mcpc-tech/unplugin-dev-inspector-mcp",
3
- "version": "0.1.7",
3
+ "version": "0.1.8",
4
4
  "description": "Universal dev inspector plugin for React/Vue - inspect component sources and API calls in any bundler",
5
5
  "type": "module",
6
6
  "license": "MIT",