import{$ as e,C as t,Ct as n,Et as r,Mt as i,P as a,Q as o,Qt as s,S as c,T as l,V as u,W as d,X as f,Y as p,Z as m,_ as h,ct as g,dt as _,ft as v,g as y,h as b,m as x,p as S,s as C,tn as w,vt as T}from"./vendor/json-editor-vue-9tyg6b65.js";import{D as ee,b as te,c as E,i as D,n as O,w as ne}from"./utils-ivfwadyv.js";import{et as k,r as A,t as re}from"./client-kfvz1zfh.js";import{t as j}from"./storage-options-k70ge3wv.js";import{t as M}from"./_plugin-vue_export-helper-d9irwgla.js";import{t as N}from"./nicon-hgcqr03x.js";import{t as P}from"./nbutton-g8ropw1z.js";import{t as F}from"./ncard-d0lyv7bx.js";import{s as I,u as L}from"#entry";import{t as R}from"./ndrawer-hxlw4o37.js";import{t as z}from"./pages-dm1j9w83.js";import{t as ie}from"./ncheckbox-oir9zn2f.js";import{t as B}from"./filepath-item-evfn93g6.js";import{t as V}from"./help-fab-myoje00l.js";import{t as H}from"./nnavbar-eonyi8yr.js";import{t as U}from"./nicon-title-hifk5b9y.js";import{t as W}from"./nsection-block-lfx32fn0.js";import{n as G}from"./dist-das2ggjj.js";import{t as K}from"./nbadge-nhg3871m.js";import{n as q,t as J}from"./vendor/vis-g93dt5xg.js";import{t as Y}from"./nselect-tabs-x0ru7ijw.js";import{n as X,t as ae}from"./state-components-dvlju1e9.js";var oe={},se={class:`markdown-body`};function ce(e,t){return d(),h(`div`,se,[...t[0]||=[x(`template`,null,[x(`div`,{class:`markdown-body`},[x(`h1`,null,`Components`),x(`p`,null,`Vue Components allow us to split the UI into independent and reusable pieces, and think about each piece in isolation. This is very similar to how we nest native HTML elements, but Vue implements its own component model that allow us to encapsulate custom content and logic in each component.`),x(`p`,null,`Components placed in the components/ directory are automatically registered by Nuxt. They can be used in your templates without importing them.`),x(`p`,null,[x(`a`,{href:`https://nuxt.com/docs/guide/directory-structure/components`,target:`_blank`,rel:`noopener`},`Learn more in the documentation`)])])],-1)]])}var le=M(oe,[[`render`,ce]]),ue={"text-sm":``,"font-mono":``},Z=Object.assign(l({__name:`ComponentName`,props:{component:{}},setup(e){let t=e,n=S(()=>t.component.pascalName||G(t.component.name||t.component.__name||t.component.kebabName||``));return(e,t)=>(d(),h(`code`,ue,[t[0]||=x(`span`,{mr1:``,op20:``},`<`,-1),c(w(n.value),1),t[1]||=x(`span`,{ml1:``,op20:``},`/>`,-1)]))}}),{__name:`ComponentName`}),de={flex:`~ col gap1`,"items-start":``,"of-hidden":``},Q={flex:`~ gap2 items-center`,px3:``},fe={px3:``,pb2:``},pe={key:0,border:`t base`,"max-h-60":``,"w-full":``,"of-auto":``,px3:``,py3:``},me={"text-sm":``},he={"text-primary":``},ge={key:0,flex:`~ col gap-2`,"items-start":``,pt3:``,"text-sm":``,op75:``},_e={key:1,border:`t base`,"max-h-60":``,"w-full":``,"of-auto":``,px3:``,py3:``},ve={"text-sm":``},ye={"text-primary":``},be={key:0,flex:`~ col gap-2`,"items-start":``,pt3:``,"text-sm":``,op75:``},$=Object.assign(l({__name:`ComponentDetails`,props:{component:{},dependencies:{},dependents:{}},setup(e){let n=e,r=S(()=>n.component.pascalName||G(n.component.name||n.component.__name||n.component.kebabName||``)),a=S(()=>n.component.filePath||n.component.file||n.component.__file||``),o=L();return(n,s)=>{let l=Z,u=P,m=K,g=B;return d(),h(`div`,de,[x(`div`,Q,[t(l,{component:e.component},null,8,[`component`]),e.component.meta?.docs&&typeof e.component.meta.docs==`string`?(d(),b(u,{key:0,title:`Open docs`,"flex-none":``,n:`xs`,to:e.component.meta.docs,target:`_blank`,icon:`carbon-catalog`},{default:_(()=>[...s[1]||=[c(` Docs `,-1)]]),_:1},8,[`to`])):y(``,!0),t(u,{title:`Copy name`,"flex-none":``,n:`xs`,icon:`carbon-copy`,onClick:s[0]||=e=>i(o)(`<${r.value}>`,`component-name`)},{default:_(()=>[...s[2]||=[c(` Copy `,-1)]]),_:1}),e.component.global?(d(),b(m,{key:1,n:`green`,title:`Registered at runtime as a global component`,textContent:`runtime`})):y(``,!0)]),x(`div`,fe,[a.value?(d(),b(g,{key:0,filepath:a.value,"w-full":``,"text-sm":``,op40:``,"group-hover:op75":``},null,8,[`filepath`])):y(``,!0)]),e.dependents?(d(),h(`div`,pe,[x(`div`,me,[x(`strong`,he,w(e.dependents.length),1),s[3]||=x(`span`,{op50:``},` references`,-1)]),e.dependents.length?(d(),h(`div`,ge,[(d(!0),h(C,null,p(e.dependents,e=>(d(),b(g,{key:e,filepath:e},null,8,[`filepath`]))),128))])):y(``,!0)])):y(``,!0),e.dependencies?(d(),h(`div`,_e,[x(`div`,ve,[x(`strong`,ye,w(e.dependencies.length),1),s[4]||=x(`span`,{op50:``},` dependencies`,-1)]),e.dependencies.length?(d(),h(`div`,be,[(d(!0),h(C,null,p(e.dependencies,e=>(d(),b(g,{key:e,filepath:e},null,8,[`filepath`]))),128))])):y(``,!0)])):y(``,!0),f(n.$slots,`default`)])}}}),{__name:`ComponentDetails`}),xe={flex:`~ gap-x-3 gap-y-1 wrap`,"w-full":``},Se={relative:``,"h-full":``,"w-full":``},Ce={key:0,py4:``,pt3:``,flex:`~ col`},we={border:`t base`,p4:``},Te=Object.assign(l({__name:`ComponentsGraph`,props:{components:{},relationships:{}},setup(e){let a=e,o=n(),s=n(),l=re(),p=r(),m=ee(),v=ne(),b=te(),{componentsGraphShowNodeModules:w,componentsGraphShowGlobalComponents:E,componentsGraphShowPages:D,componentsGraphShowLayouts:O,componentsGraphShowWorkspace:A}=j(`ui`),M=n(),N=n(``),I=k(N,300),L=S(()=>{let e=a.relationships||[];if(M.value){let t=new Set;function n(r){r&&!t.has(r)&&(t.add(r),r.deps.forEach(t=>{n(e.find(e=>e.id===t))}))}return n(M.value),[...t]}return e}),z=S(()=>{let e=L.value.map(e=>{let t=a.components.find(t=>t.filePath===e.id),n=m.value?.find(t=>t.file===e.id),r=b.value?.find(t=>t.file===e.id),i=e.id.includes(`/node_modules/`)?`lib`:t?t.global?`global`:`user`:r?`layout`:n?`page`:`unknown`;if(!w.value&&i===`lib`||!D.value&&i===`page`||!O.value&&i===`layout`||!A.value&&i===`user`&&v.value&&!e.id.startsWith(v.value.rootDir)||!E.value&&i===`global`)return null;let o=i===`layout`?`hexagon`:i===`page`?`square`:`dot`,s=I.value&&!e.id.toLowerCase().includes(I.value.toLowerCase());return{id:e.id,label:Y(e.id),group:i,shape:o,size:15+Math.min(e.deps.length/2,8),font:{color:s?`#8885`:l.value===`dark`?`white`:`black`},color:s?`#8885`:M.value?.id===e.id?`#82c742`:void 0,extra:{id:e.id,component:t,page:n,layout:r,relationship:e}}}).filter(e=>!!e),t=L.value.flatMap(e=>e.deps.map(t=>({from:e.id,to:t,arrows:{to:{enabled:!0,scaleFactor:.8}}})));return{nodes:new q(e),edges:t}}),B=S(()=>p.value?.component?(a.relationships?.find(e=>e.id===p.value?.component?.filePath)?.deps)?.map(e=>a.relationships?.find(t=>t.id===e)?.id).filter(Boolean):[]),V=S(()=>p.value?.component?(a.relationships?.filter(e=>e.deps.includes(p.value.component.filePath)))?.map(e=>a.relationships?.find(t=>t.id===e.id)?.id).filter(Boolean):[]);u(()=>{let e=new J(o.value,z.value,{nodes:{shape:`dot`,size:16},physics:{repulsion:{centralGravity:.7,springLength:100,springConstant:.01},maxVelocity:146,solver:`forceAtlas2Based`,timestep:.35,stabilization:{enabled:!0,iterations:200}},groups:{user:{color:`#42b883`},unknown:{color:`#b86542`},lib:{color:`#b4b842`},page:{color:`#42b2b8`},layout:{color:`#4256b8`}}});e.on(`click`,e=>{let t=e.nodes?.[0],n=z.value.nodes.get(t).extra;p.value=n}),g(z,()=>{e.setData(z.value)})});function U(){p.value=void 0}let W=/.*\/components\//,G=/\.vue$/,K=/\/index$/;function Y(e){let t=a.components.find(t=>t.filePath===e);return t?t.pascalName:e.replace(W,``).replace(G,``).replace(K,``).split(`/`).map(e=>e.charAt(0).toUpperCase()+e.slice(1)).join(``)}function X(){M.value=p.value?.relationship,p.value=void 0}return(e,n)=>{let r=ie,a=H,l=F,u=$,m=P,g=R;return d(),h(C,null,[t(a,{ref_key:`navbar`,ref:s,search:N.value,"onUpdate:search":n[6]||=e=>N.value=e,absolute:``,"left-0":``,"right-0":``,"top-0":``},{actions:_(()=>[x(`div`,xe,[t(r,{modelValue:i(D),"onUpdate:modelValue":n[0]||=e=>T(D)?D.value=e:null,n:`primary sm`},{default:_(()=>[...n[8]||=[x(`span`,{op75:``},`Show pages`,-1)]]),_:1},8,[`modelValue`]),t(r,{modelValue:i(O),"onUpdate:modelValue":n[1]||=e=>T(O)?O.value=e:null,n:`primary sm`},{default:_(()=>[...n[9]||=[x(`span`,{op75:``},`Show layouts`,-1)]]),_:1},8,[`modelValue`]),t(r,{modelValue:i(A),"onUpdate:modelValue":n[2]||=e=>T(A)?A.value=e:null,n:`primary sm`},{default:_(()=>[...n[10]||=[x(`span`,{op75:``},`Show workspace`,-1)]]),_:1},8,[`modelValue`]),t(r,{modelValue:i(w),"onUpdate:modelValue":n[3]||=e=>T(w)?w.value=e:null,n:`primary sm`},{default:_(()=>[...n[11]||=[x(`span`,{op75:``},`Show node_modules`,-1)]]),_:1},8,[`modelValue`]),t(r,{modelValue:i(E),"onUpdate:modelValue":n[4]||=e=>T(E)?E.value=e:null,n:`primary sm`},{default:_(()=>[...n[12]||=[x(`span`,{op75:``},`Show global components`,-1)]]),_:1},8,[`modelValue`])]),M.value?(d(),h(`button`,{key:0,flex:`~ gap-1`,"flex-none":``,"items-center":``,"rounded-full":``,"bg-gray:20":``,py1:``,pl3:``,pr2:``,"text-xs":``,op50:``,"hover:op100":``,onClick:n[5]||=e=>M.value=void 0},[...n[13]||=[c(` Clear filter `,-1),x(`div`,{"i-carbon-close":``},null,-1)]])):y(``,!0),n[14]||=x(`div`,{"flex-auto":``},null,-1),f(e.$slots,`default`)]),_:3},8,[`search`]),x(`div`,Se,[x(`div`,{ref_key:`container`,ref:o,"h-full":``,"w-full":``},null,512),t(l,{absolute:``,"bottom-3":``,"left-3":``,"border-0":``,"n-glass-effect":``,p2:``,px3:``,"text-sm":``},{default:_(()=>[...n[15]||=[x(`div`,{grid:`~ cols-[20px_1fr] items-center gap-y-1`},[x(`div`,{"h-3":``,"w-3":``,"rounded-full":``,"bg-hex-42b883":``}),x(`div`,{op50:``},` Component `),x(`div`,{"h-3":``,"w-3":``,"rounded-full":``,"bg-hex-97c2fc":``}),x(`div`,{op50:``},` Global Component `),x(`div`,{"h-3":``,"w-3":``,"bg-hex-42b2b8":``}),x(`div`,{op50:``},` Page `),x(`svg`,{xmlns:`http://www.w3.org/2000/svg`,viewBox:`0 0 726 628`,"ml--1px":``,"h-3":``},[x(`path`,{fill:`#4256b8`,"stroke-width":`4`,d:`M723 314 543 625.8H183L3 314 183 2.2h360L723 314z`})]),x(`div`,{op50:``},` Layout `),x(`div`,{"h-3":``,"w-3":``,"rounded-full":``,"bg-hex-b4b842":``}),x(`div`,{op50:``},` Library Component `),x(`div`,{"h-3":``,"w-3":``,"rounded-full":``,"bg-hex-b86542":``}),x(`div`,{op50:``},` Unknown `)],-1)]]),_:1}),t(g,{"model-value":!!(p.value&&p.value.component),top:s.value,border:`t l base`,"w-80":``,onClose:U},{default:_(()=>[p.value&&p.value.component?(d(),h(`div`,Ce,[t(u,{component:p.value.component,dependencies:B.value,dependents:V.value},null,8,[`component`,`dependencies`,`dependents`]),x(`div`,we,[t(m,{n:`primary solid`,onClick:n[7]||=e=>X()},{default:_(()=>[...n[16]||=[c(` Filter to this component `,-1)]]),_:1})])])):y(``,!0)]),_:1},8,[`model-value`,`top`])])],64)}}}),{__name:`ComponentsGraph`}),Ee={hover:`bg-active`,class:`group`,flex:`~ gap2`,"w-full":``,"items-center":``,rounded:``,px2:``,py1:``},De={key:0,"ml--1":``,"text-primary":``},Oe=Object.assign(l({__name:`ComponentItem`,props:{component:{},dependencies:{},dependents:{}},setup(e){let n=e,r=S(()=>n.component.filePath||n.component.file||n.component.__file||``);return(n,i)=>{let a=Z,o=$,c=m(`VDropdown`),l=K,u=B;return d(),h(`div`,Ee,[t(c,null,{popper:_(()=>[t(o,{component:e.component,dependencies:e.dependencies,dependents:e.dependents,"w-100":``,pt3:``},null,8,[`component`,`dependencies`,`dependents`])]),default:_(()=>[x(`button`,{"hover:text-primary":``,class:s(e.dependents&&e.dependents.length===0?`op50`:``)},[t(a,{component:e.component},null,8,[`component`])],2)]),_:1}),e.dependents?.length?(d(),h(`sup`,De,` x`+w(e.dependents?.length),1)):y(``,!0),e.component.global?(d(),b(l,{key:1,n:`green`,title:`Registered at runtime as a global component`,textContent:`runtime`})):y(``,!0),f(n.$slots,`default`),r.value?(d(),b(u,{key:2,filepath:r.value,"text-sm":``,op25:``,"group-hover:op75":``},null,8,[`filepath`])):y(``,!0)])}}}),{__name:`ComponentItem`}),ke={flex:`~ gap-2 items-center`},Ae={pl4:``},je=Object.assign(l({__name:`ComponentsList`,props:{components:{},relationships:{}},setup(e){let r=e,o=n(``),s=n(`all`),c=S(()=>{let e=r.components.map(e=>O(e,r.relationships));return s.value===`using`?e.filter(e=>e.dependents?.length):s.value===`not-used`?e.filter(e=>!e.dependents?.length):e}),l={ClientOnly:`https://nuxt.com/docs/api/components/client-only`,DevOnly:`https://nuxt.com/docs/api/components/dev-only`,NuxtClientFallback:`https://nuxt.com/docs/api/components/nuxt-client-fallback`,NuxtPicture:`https://nuxt.com/docs/api/components/nuxt-picture`,NuxtRouteAnnouncer:`https://nuxt.com/docs/api/components/nuxt-route-announcer`,NuxtTime:`https://nuxt.com/docs/api/components/nuxt-time`,NuxtPage:`https://nuxt.com/docs/api/components/nuxt-page`,NuxtLayout:`https://nuxt.com/docs/api/components/nuxt-layout`,NuxtLink:`https://nuxt.com/docs/api/components/nuxt-link`,NuxtLoadingIndicator:`https://nuxt.com/docs/api/components/nuxt-loading-indicator`,NuxtErrorBoundary:`https://nuxt.com/docs/api/components/nuxt-error-boundary`,NuxtWelcome:`https://nuxt.com/docs/api/components/nuxt-welcome`,NuxtIsland:`https://nuxt.com/docs/api/components/nuxt-island`,NuxtImg:`https://nuxt.com/docs/api/components/nuxt-img`},u=S(()=>new I(c.value,{keys:[`component.pascalName`,`component.filePath`,`component.kebabName`]})),m=S(()=>{let e=[],t=new Map,n=[],r=[],i={user:0,lib:0,builtin:0,runtime:0};return(o.value?u.value.search(o.value).map(e=>e.item):c.value).forEach(a=>{let o=a.component;if(o.filePath&&E(o.filePath)){let e=D(o.filePath);if(!e)return;e===`nuxt`?(o.meta??={},o.meta.docs??=l?.[o.pascalName],n.push(a),i.builtin++):(t.has(e)||t.set(e,[]),t.get(e).push(a),i.lib++)}else o.global&&!o.filePath?(r.push(a),i.runtime++):(e.push(a),i.user++)}),{count:i,user:e,builtin:n,lib:t,runtime:r}});return(e,n)=>{let r=N,c=Y,l=H,u=Oe,g=W,v=U;return d(),h(C,null,[t(l,{search:o.value,"onUpdate:search":n[1]||=e=>o.value=e,pb3:``},{actions:_(()=>[f(e.$slots,`default`)]),default:_(()=>[x(`div`,ke,[t(r,{icon:`carbon-filter`,op50:``}),t(c,{modelValue:s.value,"onUpdate:modelValue":n[0]||=e=>s.value=e,n:`primary sm`,options:[{label:`All`,value:`all`},{label:`Using`,value:`using`},{label:`Not used`,value:`not-used`}]},null,8,[`modelValue`])])]),_:3},8,[`search`]),m.value.user.length?(d(),b(g,{key:0,icon:`carbon-nominal`,text:`User components`,open:m.value.user.length<=i(50),description:`Total components: ${m.value.count.user}`},{default:_(()=>[(d(!0),h(C,null,p(m.value.user,e=>(d(),b(u,a({key:e.component.filePath},{ref_for:!0},e),null,16))),128))]),_:1},8,[`open`,`description`])):y(``,!0),m.value.runtime.length?(d(),b(g,{key:1,icon:`carbon-load-balancer-global`,open:m.value.runtime.length<=i(50),text:`Runtime components`,description:`Total components: ${m.value.count.runtime}`},{default:_(()=>[(d(!0),h(C,null,p(m.value.runtime,e=>(d(),b(u,a({key:e.component.filePath},{ref_for:!0},e),null,16))),128))]),_:1},8,[`open`,`description`])):y(``,!0),m.value.builtin.length?(d(),b(g,{key:2,icon:`simple-icons-nuxtdotjs`,text:`Built-in components`,description:`Total components: ${m.value.count.builtin}`},{default:_(()=>[(d(!0),h(C,null,p(m.value.builtin,e=>(d(),b(u,a({key:e.component.filePath},{ref_for:!0},e),null,16))),128))]),_:1},8,[`description`])):y(``,!0),m.value.lib.size?(d(),b(g,{key:3,open:m.value.count.lib<=i(50),icon:`carbon-3d-mpr-toggle`,text:`Components from libraries`,description:`${m.value.count.lib} components from ${m.value.lib.size} packages`},{default:_(()=>[(d(!0),h(C,null,p(m.value.lib.entries(),([e,n])=>(d(),h(`div`,{key:e,"ml-2":``},[t(v,{text:`${e} (${n.length})`,py1:``,op50:``},null,8,[`text`]),x(`div`,Ae,[(d(!0),h(C,null,p(n,e=>(d(),b(u,a({key:e.component.filePath},{ref_for:!0},e),null,16))),128))])]))),128))]),_:1},8,[`open`,`description`])):y(``,!0)],64)}}}),{__name:`ComponentsList`}),Me={relative:``,"h-full":``,"of-auto":``},Ne={"flex-none":``,flex:`~ gap3`},Pe=l({__name:`components`,setup(n){z({icon:`i-carbon-assembly-cluster`,title:`Components`,order:2});let r=A(),a=ae(),s=X(),{componentsView:c}=j(`ui`);function l(){r.value?.inspector?.enable()}function u(){c.value=c.value===`list`?`graph`:`list`}return(n,f)=>{let p=P,m=le,g=V,S=o(`tooltip`);return d(),h(C,null,[x(`div`,Me,[(d(),b(e(i(c)===`list`?je:Te),{components:i(a),relationships:i(s)},{default:_(()=>[x(`div`,Ne,[v(t(p,{"text-lg":``,border:!1,icon:i(c)===`graph`?`i-carbon-list`:`i-carbon-network-4`,title:`Toggle view`,onClick:u},null,8,[`icon`]),[[S,`Toggle View`,void 0,{"bottom-end":!0}]]),i(r)?.inspector?.isAvailable?v((d(),b(p,{key:0,"text-lg":``,border:!1,icon:`i-tabler-focus-2`,title:`Inspect Vue components`,onClick:l},null,512)),[[S,`Inspect Vue components`,void 0,{"bottom-end":!0}]]):y(``,!0)])]),_:1},8,[`components`,`relationships`]))]),t(g,null,{default:_(()=>[t(m)]),_:1})],64)}}});export{Pe as default};