[{"data":1,"prerenderedAt":5882},["ShallowReactive",2],{"navigation":3,"docs-/module/utils-kit":37,"docs-/module/utils-kit-surround":2296},[4,17,30],{"title":5,"_path":6,"children":7},"Guide","/guide",[8,11,14],{"title":9,"_path":10},"Getting Started","/guide/getting-started",{"title":12,"_path":13},"Features","/guide/features",{"title":15,"_path":16},"Composables","/guide/composables",{"title":18,"_path":19,"children":20},"Module","/module",[21,24,27],{"title":22,"_path":23},"Module Authors","/module/guide",{"title":25,"_path":26},"Utility Kit","/module/utils-kit",{"title":28,"_path":29},"UI Kit","/module/ui-kit",{"title":31,"_path":32,"children":33},"Development","/development",[34],{"title":35,"_path":36},"Contribution Guide","/development/contributing",{"_path":26,"_dir":38,"_draft":39,"_partial":39,"_locale":40,"title":25,"description":41,"body":42,"_type":2290,"_id":2291,"_source":2292,"_file":2293,"_stem":2294,"_extension":2295},"module",false,"","Utility kit for easier DevTools integrations.",{"type":43,"children":44,"toc":2274},"root",[45,62,95,150,170,180,191,203,523,528,589,770,780,793,803,816,1170,1219,1229,1234,1388,1401,1411,1416,1421,1501,1522,1531,1552,1562,1587,1597,1602,1710,1720,1732,1907,1917,1929,1939,1957,2144,2154,2164,2268],{"type":46,"tag":47,"props":48,"children":49},"element","p",{},[50,53,60],{"type":51,"value":52},"text","Since v0.3.0, we are now providing a utility kit for easier DevTools integrations, similar to ",{"type":46,"tag":54,"props":55,"children":57},"code",{"className":56},[],[58],{"type":51,"value":59},"@nuxt/kit",{"type":51,"value":61},".",{"type":46,"tag":63,"props":64,"children":68},"pre",{"className":65,"code":66,"language":67,"meta":40,"style":40},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","npm i @nuxt/devtools-kit\n","bash",[69],{"type":46,"tag":54,"props":70,"children":71},{"__ignoreMap":40},[72],{"type":46,"tag":73,"props":74,"children":77},"span",{"class":75,"line":76},"line",1,[78,84,90],{"type":46,"tag":73,"props":79,"children":81},{"style":80},"--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B",[82],{"type":51,"value":83},"npm",{"type":46,"tag":73,"props":85,"children":87},{"style":86},"--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D",[88],{"type":51,"value":89}," i",{"type":46,"tag":73,"props":91,"children":92},{"style":86},[93],{"type":51,"value":94}," @nuxt/devtools-kit\n",{"type":46,"tag":63,"props":96,"children":100},{"className":97,"code":98,"language":99,"meta":40,"style":40},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { addCustomTab } from '@nuxt/devtools-kit'\n","ts",[101],{"type":46,"tag":54,"props":102,"children":103},{"__ignoreMap":40},[104],{"type":46,"tag":73,"props":105,"children":106},{"class":75,"line":76},[107,113,119,125,130,135,140,145],{"type":46,"tag":73,"props":108,"children":110},{"style":109},"--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic",[111],{"type":51,"value":112},"import",{"type":46,"tag":73,"props":114,"children":116},{"style":115},"--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF",[117],{"type":51,"value":118}," {",{"type":46,"tag":73,"props":120,"children":122},{"style":121},"--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8",[123],{"type":51,"value":124}," addCustomTab",{"type":46,"tag":73,"props":126,"children":127},{"style":115},[128],{"type":51,"value":129}," }",{"type":46,"tag":73,"props":131,"children":132},{"style":109},[133],{"type":51,"value":134}," from",{"type":46,"tag":73,"props":136,"children":137},{"style":115},[138],{"type":51,"value":139}," '",{"type":46,"tag":73,"props":141,"children":142},{"style":86},[143],{"type":51,"value":144},"@nuxt/devtools-kit",{"type":46,"tag":73,"props":146,"children":147},{"style":115},[148],{"type":51,"value":149},"'\n",{"type":46,"tag":47,"props":151,"children":152},{},[153,155,160,162,168],{"type":51,"value":154},"We recommend module authors to install ",{"type":46,"tag":54,"props":156,"children":158},{"className":157},[],[159],{"type":51,"value":144},{"type":51,"value":161}," as a dependency and ",{"type":46,"tag":54,"props":163,"children":165},{"className":164},[],[166],{"type":51,"value":167},"@nuxt/devtools",{"type":51,"value":169}," as a dev dependency.",{"type":46,"tag":171,"props":172,"children":174},"h2",{"id":173},"nuxtdevtools-kit",[175],{"type":46,"tag":54,"props":176,"children":178},{"className":177},[],[179],{"type":51,"value":144},{"type":46,"tag":181,"props":182,"children":184},"h3",{"id":183},"addcustomtab",[185],{"type":46,"tag":54,"props":186,"children":188},{"className":187},[],[189],{"type":51,"value":190},"addCustomTab()",{"type":46,"tag":47,"props":192,"children":193},{},[194,196,202],{"type":51,"value":195},"A shorthand for calling the hook ",{"type":46,"tag":54,"props":197,"children":199},{"className":198},[],[200],{"type":51,"value":201},"devtools:customTabs",{"type":51,"value":61},{"type":46,"tag":63,"props":204,"children":206},{"className":97,"code":205,"language":99,"meta":40,"style":40},"import { addCustomTab } from '@nuxt/devtools-kit'\n\naddCustomTab(() => ({\n  // unique identifier\n  name: 'my-module',\n  // title to display in the tab\n  title: 'My Module',\n  // any icon from Iconify, or a URL to an image\n  icon: 'carbon:apps',\n  // iframe view\n  view: {\n    type: 'iframe',\n    src: '/url-to-your-module-view',\n  },\n}))\n",[207],{"type":46,"tag":54,"props":208,"children":209},{"__ignoreMap":40},[210,245,255,291,301,335,344,374,383,413,422,440,470,500,509],{"type":46,"tag":73,"props":211,"children":212},{"class":75,"line":76},[213,217,221,225,229,233,237,241],{"type":46,"tag":73,"props":214,"children":215},{"style":109},[216],{"type":51,"value":112},{"type":46,"tag":73,"props":218,"children":219},{"style":115},[220],{"type":51,"value":118},{"type":46,"tag":73,"props":222,"children":223},{"style":121},[224],{"type":51,"value":124},{"type":46,"tag":73,"props":226,"children":227},{"style":115},[228],{"type":51,"value":129},{"type":46,"tag":73,"props":230,"children":231},{"style":109},[232],{"type":51,"value":134},{"type":46,"tag":73,"props":234,"children":235},{"style":115},[236],{"type":51,"value":139},{"type":46,"tag":73,"props":238,"children":239},{"style":86},[240],{"type":51,"value":144},{"type":46,"tag":73,"props":242,"children":243},{"style":115},[244],{"type":51,"value":149},{"type":46,"tag":73,"props":246,"children":248},{"class":75,"line":247},2,[249],{"type":46,"tag":73,"props":250,"children":252},{"emptyLinePlaceholder":251},true,[253],{"type":51,"value":254},"\n",{"type":46,"tag":73,"props":256,"children":258},{"class":75,"line":257},3,[259,265,270,275,281,286],{"type":46,"tag":73,"props":260,"children":262},{"style":261},"--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF",[263],{"type":51,"value":264},"addCustomTab",{"type":46,"tag":73,"props":266,"children":267},{"style":121},[268],{"type":51,"value":269},"(",{"type":46,"tag":73,"props":271,"children":272},{"style":115},[273],{"type":51,"value":274},"()",{"type":46,"tag":73,"props":276,"children":278},{"style":277},"--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA",[279],{"type":51,"value":280}," =>",{"type":46,"tag":73,"props":282,"children":283},{"style":121},[284],{"type":51,"value":285}," (",{"type":46,"tag":73,"props":287,"children":288},{"style":115},[289],{"type":51,"value":290},"{\n",{"type":46,"tag":73,"props":292,"children":294},{"class":75,"line":293},4,[295],{"type":46,"tag":73,"props":296,"children":298},{"style":297},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#546E7A;--shiki-default-font-style:italic;--shiki-dark:#676E95;--shiki-dark-font-style:italic",[299],{"type":51,"value":300},"  // unique identifier\n",{"type":46,"tag":73,"props":302,"children":304},{"class":75,"line":303},5,[305,311,316,320,325,330],{"type":46,"tag":73,"props":306,"children":308},{"style":307},"--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178",[309],{"type":51,"value":310},"  name",{"type":46,"tag":73,"props":312,"children":313},{"style":115},[314],{"type":51,"value":315},":",{"type":46,"tag":73,"props":317,"children":318},{"style":115},[319],{"type":51,"value":139},{"type":46,"tag":73,"props":321,"children":322},{"style":86},[323],{"type":51,"value":324},"my-module",{"type":46,"tag":73,"props":326,"children":327},{"style":115},[328],{"type":51,"value":329},"'",{"type":46,"tag":73,"props":331,"children":332},{"style":115},[333],{"type":51,"value":334},",\n",{"type":46,"tag":73,"props":336,"children":338},{"class":75,"line":337},6,[339],{"type":46,"tag":73,"props":340,"children":341},{"style":297},[342],{"type":51,"value":343},"  // title to display in the tab\n",{"type":46,"tag":73,"props":345,"children":347},{"class":75,"line":346},7,[348,353,357,361,366,370],{"type":46,"tag":73,"props":349,"children":350},{"style":307},[351],{"type":51,"value":352},"  title",{"type":46,"tag":73,"props":354,"children":355},{"style":115},[356],{"type":51,"value":315},{"type":46,"tag":73,"props":358,"children":359},{"style":115},[360],{"type":51,"value":139},{"type":46,"tag":73,"props":362,"children":363},{"style":86},[364],{"type":51,"value":365},"My Module",{"type":46,"tag":73,"props":367,"children":368},{"style":115},[369],{"type":51,"value":329},{"type":46,"tag":73,"props":371,"children":372},{"style":115},[373],{"type":51,"value":334},{"type":46,"tag":73,"props":375,"children":377},{"class":75,"line":376},8,[378],{"type":46,"tag":73,"props":379,"children":380},{"style":297},[381],{"type":51,"value":382},"  // any icon from Iconify, or a URL to an image\n",{"type":46,"tag":73,"props":384,"children":386},{"class":75,"line":385},9,[387,392,396,400,405,409],{"type":46,"tag":73,"props":388,"children":389},{"style":307},[390],{"type":51,"value":391},"  icon",{"type":46,"tag":73,"props":393,"children":394},{"style":115},[395],{"type":51,"value":315},{"type":46,"tag":73,"props":397,"children":398},{"style":115},[399],{"type":51,"value":139},{"type":46,"tag":73,"props":401,"children":402},{"style":86},[403],{"type":51,"value":404},"carbon:apps",{"type":46,"tag":73,"props":406,"children":407},{"style":115},[408],{"type":51,"value":329},{"type":46,"tag":73,"props":410,"children":411},{"style":115},[412],{"type":51,"value":334},{"type":46,"tag":73,"props":414,"children":416},{"class":75,"line":415},10,[417],{"type":46,"tag":73,"props":418,"children":419},{"style":297},[420],{"type":51,"value":421},"  // iframe view\n",{"type":46,"tag":73,"props":423,"children":425},{"class":75,"line":424},11,[426,431,435],{"type":46,"tag":73,"props":427,"children":428},{"style":307},[429],{"type":51,"value":430},"  view",{"type":46,"tag":73,"props":432,"children":433},{"style":115},[434],{"type":51,"value":315},{"type":46,"tag":73,"props":436,"children":437},{"style":115},[438],{"type":51,"value":439}," {\n",{"type":46,"tag":73,"props":441,"children":443},{"class":75,"line":442},12,[444,449,453,457,462,466],{"type":46,"tag":73,"props":445,"children":446},{"style":307},[447],{"type":51,"value":448},"    type",{"type":46,"tag":73,"props":450,"children":451},{"style":115},[452],{"type":51,"value":315},{"type":46,"tag":73,"props":454,"children":455},{"style":115},[456],{"type":51,"value":139},{"type":46,"tag":73,"props":458,"children":459},{"style":86},[460],{"type":51,"value":461},"iframe",{"type":46,"tag":73,"props":463,"children":464},{"style":115},[465],{"type":51,"value":329},{"type":46,"tag":73,"props":467,"children":468},{"style":115},[469],{"type":51,"value":334},{"type":46,"tag":73,"props":471,"children":473},{"class":75,"line":472},13,[474,479,483,487,492,496],{"type":46,"tag":73,"props":475,"children":476},{"style":307},[477],{"type":51,"value":478},"    src",{"type":46,"tag":73,"props":480,"children":481},{"style":115},[482],{"type":51,"value":315},{"type":46,"tag":73,"props":484,"children":485},{"style":115},[486],{"type":51,"value":139},{"type":46,"tag":73,"props":488,"children":489},{"style":86},[490],{"type":51,"value":491},"/url-to-your-module-view",{"type":46,"tag":73,"props":493,"children":494},{"style":115},[495],{"type":51,"value":329},{"type":46,"tag":73,"props":497,"children":498},{"style":115},[499],{"type":51,"value":334},{"type":46,"tag":73,"props":501,"children":503},{"class":75,"line":502},14,[504],{"type":46,"tag":73,"props":505,"children":506},{"style":115},[507],{"type":51,"value":508},"  },\n",{"type":46,"tag":73,"props":510,"children":512},{"class":75,"line":511},15,[513,518],{"type":46,"tag":73,"props":514,"children":515},{"style":115},[516],{"type":51,"value":517},"}",{"type":46,"tag":73,"props":519,"children":520},{"style":121},[521],{"type":51,"value":522},"))\n",{"type":46,"tag":47,"props":524,"children":525},{},[526],{"type":51,"value":527},"The iframe view supports the following options:",{"type":46,"tag":529,"props":530,"children":531},"ul",{},[532,544,563],{"type":46,"tag":533,"props":534,"children":535},"li",{},[536,542],{"type":46,"tag":54,"props":537,"children":539},{"className":538},[],[540],{"type":51,"value":541},"src",{"type":51,"value":543},": URL of the iframe",{"type":46,"tag":533,"props":545,"children":546},{},[547,553,555,561],{"type":46,"tag":54,"props":548,"children":550},{"className":549},[],[551],{"type":51,"value":552},"persistent",{"type":51,"value":554},": Whether to persist the iframe instance when switching tabs (default: ",{"type":46,"tag":54,"props":556,"children":558},{"className":557},[],[559],{"type":51,"value":560},"true",{"type":51,"value":562},")",{"type":46,"tag":533,"props":564,"children":565},{},[566,572,574,580,582,588],{"type":46,"tag":54,"props":567,"children":569},{"className":568},[],[570],{"type":51,"value":571},"permissions",{"type":51,"value":573},": Additional permissions to allow in the iframe (merged with default ",{"type":46,"tag":54,"props":575,"children":577},{"className":576},[],[578],{"type":51,"value":579},"clipboard-write",{"type":51,"value":581}," and ",{"type":46,"tag":54,"props":583,"children":585},{"className":584},[],[586],{"type":51,"value":587},"clipboard-read",{"type":51,"value":562},{"type":46,"tag":63,"props":590,"children":592},{"className":97,"code":591,"language":99,"meta":40,"style":40},"const view: ModuleIframeView = {\n  type: 'iframe',\n  src: '/url-to-your-module-view',\n  persistent: true,\n  permissions: ['camera', 'microphone'],\n}\n",[593],{"type":46,"tag":54,"props":594,"children":595},{"__ignoreMap":40},[596,627,655,683,705,762],{"type":46,"tag":73,"props":597,"children":598},{"class":75,"line":76},[599,604,609,613,618,623],{"type":46,"tag":73,"props":600,"children":601},{"style":277},[602],{"type":51,"value":603},"const",{"type":46,"tag":73,"props":605,"children":606},{"style":121},[607],{"type":51,"value":608}," view",{"type":46,"tag":73,"props":610,"children":611},{"style":115},[612],{"type":51,"value":315},{"type":46,"tag":73,"props":614,"children":615},{"style":80},[616],{"type":51,"value":617}," ModuleIframeView",{"type":46,"tag":73,"props":619,"children":620},{"style":115},[621],{"type":51,"value":622}," =",{"type":46,"tag":73,"props":624,"children":625},{"style":115},[626],{"type":51,"value":439},{"type":46,"tag":73,"props":628,"children":629},{"class":75,"line":247},[630,635,639,643,647,651],{"type":46,"tag":73,"props":631,"children":632},{"style":307},[633],{"type":51,"value":634},"  type",{"type":46,"tag":73,"props":636,"children":637},{"style":115},[638],{"type":51,"value":315},{"type":46,"tag":73,"props":640,"children":641},{"style":115},[642],{"type":51,"value":139},{"type":46,"tag":73,"props":644,"children":645},{"style":86},[646],{"type":51,"value":461},{"type":46,"tag":73,"props":648,"children":649},{"style":115},[650],{"type":51,"value":329},{"type":46,"tag":73,"props":652,"children":653},{"style":115},[654],{"type":51,"value":334},{"type":46,"tag":73,"props":656,"children":657},{"class":75,"line":257},[658,663,667,671,675,679],{"type":46,"tag":73,"props":659,"children":660},{"style":307},[661],{"type":51,"value":662},"  src",{"type":46,"tag":73,"props":664,"children":665},{"style":115},[666],{"type":51,"value":315},{"type":46,"tag":73,"props":668,"children":669},{"style":115},[670],{"type":51,"value":139},{"type":46,"tag":73,"props":672,"children":673},{"style":86},[674],{"type":51,"value":491},{"type":46,"tag":73,"props":676,"children":677},{"style":115},[678],{"type":51,"value":329},{"type":46,"tag":73,"props":680,"children":681},{"style":115},[682],{"type":51,"value":334},{"type":46,"tag":73,"props":684,"children":685},{"class":75,"line":293},[686,691,695,701],{"type":46,"tag":73,"props":687,"children":688},{"style":307},[689],{"type":51,"value":690},"  persistent",{"type":46,"tag":73,"props":692,"children":693},{"style":115},[694],{"type":51,"value":315},{"type":46,"tag":73,"props":696,"children":698},{"style":697},"--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC",[699],{"type":51,"value":700}," true",{"type":46,"tag":73,"props":702,"children":703},{"style":115},[704],{"type":51,"value":334},{"type":46,"tag":73,"props":706,"children":707},{"class":75,"line":303},[708,713,717,722,726,731,735,740,744,749,753,758],{"type":46,"tag":73,"props":709,"children":710},{"style":307},[711],{"type":51,"value":712},"  permissions",{"type":46,"tag":73,"props":714,"children":715},{"style":115},[716],{"type":51,"value":315},{"type":46,"tag":73,"props":718,"children":719},{"style":121},[720],{"type":51,"value":721}," [",{"type":46,"tag":73,"props":723,"children":724},{"style":115},[725],{"type":51,"value":329},{"type":46,"tag":73,"props":727,"children":728},{"style":86},[729],{"type":51,"value":730},"camera",{"type":46,"tag":73,"props":732,"children":733},{"style":115},[734],{"type":51,"value":329},{"type":46,"tag":73,"props":736,"children":737},{"style":115},[738],{"type":51,"value":739},",",{"type":46,"tag":73,"props":741,"children":742},{"style":115},[743],{"type":51,"value":139},{"type":46,"tag":73,"props":745,"children":746},{"style":86},[747],{"type":51,"value":748},"microphone",{"type":46,"tag":73,"props":750,"children":751},{"style":115},[752],{"type":51,"value":329},{"type":46,"tag":73,"props":754,"children":755},{"style":121},[756],{"type":51,"value":757},"]",{"type":46,"tag":73,"props":759,"children":760},{"style":115},[761],{"type":51,"value":334},{"type":46,"tag":73,"props":763,"children":764},{"class":75,"line":337},[765],{"type":46,"tag":73,"props":766,"children":767},{"style":115},[768],{"type":51,"value":769},"}\n",{"type":46,"tag":181,"props":771,"children":773},{"id":772},"refreshcustomtabs",[774],{"type":46,"tag":54,"props":775,"children":777},{"className":776},[],[778],{"type":51,"value":779},"refreshCustomTabs()",{"type":46,"tag":47,"props":781,"children":782},{},[783,785,791],{"type":51,"value":784},"A shorthand for call hook ",{"type":46,"tag":54,"props":786,"children":788},{"className":787},[],[789],{"type":51,"value":790},"devtools:customTabs:refresh",{"type":51,"value":792},". It will refresh all custom tabs.",{"type":46,"tag":181,"props":794,"children":796},{"id":795},"startsubprocess",[797],{"type":46,"tag":54,"props":798,"children":800},{"className":799},[],[801],{"type":51,"value":802},"startSubprocess()",{"type":46,"tag":47,"props":804,"children":805},{},[806,808,814],{"type":51,"value":807},"Start a sub process using ",{"type":46,"tag":54,"props":809,"children":811},{"className":810},[],[812],{"type":51,"value":813},"execa",{"type":51,"value":815}," and create a terminal tab in DevTools.",{"type":46,"tag":63,"props":817,"children":819},{"className":97,"code":818,"language":99,"meta":40,"style":40},"import { startSubprocess } from '@nuxt/devtools-kit'\n\nconst subprocess = startSubprocess(\n  {\n    command: 'code-server',\n    args: [\n      'serve-local',\n      '--accept-server-license-terms',\n      '--without-connection-token',\n      `--port=${port}`,\n    ],\n  },\n  {\n    id: 'devtools:vscode',\n    name: 'VS Code Server',\n    icon: 'logos-visual-studio-code',\n  },\n)\n",[820],{"type":46,"tag":54,"props":821,"children":822},{"__ignoreMap":40},[823,859,866,892,900,929,946,967,987,1007,1039,1051,1058,1065,1094,1123,1153,1161],{"type":46,"tag":73,"props":824,"children":825},{"class":75,"line":76},[826,830,834,839,843,847,851,855],{"type":46,"tag":73,"props":827,"children":828},{"style":109},[829],{"type":51,"value":112},{"type":46,"tag":73,"props":831,"children":832},{"style":115},[833],{"type":51,"value":118},{"type":46,"tag":73,"props":835,"children":836},{"style":121},[837],{"type":51,"value":838}," startSubprocess",{"type":46,"tag":73,"props":840,"children":841},{"style":115},[842],{"type":51,"value":129},{"type":46,"tag":73,"props":844,"children":845},{"style":109},[846],{"type":51,"value":134},{"type":46,"tag":73,"props":848,"children":849},{"style":115},[850],{"type":51,"value":139},{"type":46,"tag":73,"props":852,"children":853},{"style":86},[854],{"type":51,"value":144},{"type":46,"tag":73,"props":856,"children":857},{"style":115},[858],{"type":51,"value":149},{"type":46,"tag":73,"props":860,"children":861},{"class":75,"line":247},[862],{"type":46,"tag":73,"props":863,"children":864},{"emptyLinePlaceholder":251},[865],{"type":51,"value":254},{"type":46,"tag":73,"props":867,"children":868},{"class":75,"line":257},[869,873,878,883,887],{"type":46,"tag":73,"props":870,"children":871},{"style":277},[872],{"type":51,"value":603},{"type":46,"tag":73,"props":874,"children":875},{"style":121},[876],{"type":51,"value":877}," subprocess ",{"type":46,"tag":73,"props":879,"children":880},{"style":115},[881],{"type":51,"value":882},"=",{"type":46,"tag":73,"props":884,"children":885},{"style":261},[886],{"type":51,"value":838},{"type":46,"tag":73,"props":888,"children":889},{"style":121},[890],{"type":51,"value":891},"(\n",{"type":46,"tag":73,"props":893,"children":894},{"class":75,"line":293},[895],{"type":46,"tag":73,"props":896,"children":897},{"style":115},[898],{"type":51,"value":899},"  {\n",{"type":46,"tag":73,"props":901,"children":902},{"class":75,"line":303},[903,908,912,916,921,925],{"type":46,"tag":73,"props":904,"children":905},{"style":307},[906],{"type":51,"value":907},"    command",{"type":46,"tag":73,"props":909,"children":910},{"style":115},[911],{"type":51,"value":315},{"type":46,"tag":73,"props":913,"children":914},{"style":115},[915],{"type":51,"value":139},{"type":46,"tag":73,"props":917,"children":918},{"style":86},[919],{"type":51,"value":920},"code-server",{"type":46,"tag":73,"props":922,"children":923},{"style":115},[924],{"type":51,"value":329},{"type":46,"tag":73,"props":926,"children":927},{"style":115},[928],{"type":51,"value":334},{"type":46,"tag":73,"props":930,"children":931},{"class":75,"line":337},[932,937,941],{"type":46,"tag":73,"props":933,"children":934},{"style":307},[935],{"type":51,"value":936},"    args",{"type":46,"tag":73,"props":938,"children":939},{"style":115},[940],{"type":51,"value":315},{"type":46,"tag":73,"props":942,"children":943},{"style":121},[944],{"type":51,"value":945}," [\n",{"type":46,"tag":73,"props":947,"children":948},{"class":75,"line":346},[949,954,959,963],{"type":46,"tag":73,"props":950,"children":951},{"style":115},[952],{"type":51,"value":953},"      '",{"type":46,"tag":73,"props":955,"children":956},{"style":86},[957],{"type":51,"value":958},"serve-local",{"type":46,"tag":73,"props":960,"children":961},{"style":115},[962],{"type":51,"value":329},{"type":46,"tag":73,"props":964,"children":965},{"style":115},[966],{"type":51,"value":334},{"type":46,"tag":73,"props":968,"children":969},{"class":75,"line":376},[970,974,979,983],{"type":46,"tag":73,"props":971,"children":972},{"style":115},[973],{"type":51,"value":953},{"type":46,"tag":73,"props":975,"children":976},{"style":86},[977],{"type":51,"value":978},"--accept-server-license-terms",{"type":46,"tag":73,"props":980,"children":981},{"style":115},[982],{"type":51,"value":329},{"type":46,"tag":73,"props":984,"children":985},{"style":115},[986],{"type":51,"value":334},{"type":46,"tag":73,"props":988,"children":989},{"class":75,"line":385},[990,994,999,1003],{"type":46,"tag":73,"props":991,"children":992},{"style":115},[993],{"type":51,"value":953},{"type":46,"tag":73,"props":995,"children":996},{"style":86},[997],{"type":51,"value":998},"--without-connection-token",{"type":46,"tag":73,"props":1000,"children":1001},{"style":115},[1002],{"type":51,"value":329},{"type":46,"tag":73,"props":1004,"children":1005},{"style":115},[1006],{"type":51,"value":334},{"type":46,"tag":73,"props":1008,"children":1009},{"class":75,"line":415},[1010,1015,1020,1025,1030,1035],{"type":46,"tag":73,"props":1011,"children":1012},{"style":115},[1013],{"type":51,"value":1014},"      `",{"type":46,"tag":73,"props":1016,"children":1017},{"style":86},[1018],{"type":51,"value":1019},"--port=",{"type":46,"tag":73,"props":1021,"children":1022},{"style":115},[1023],{"type":51,"value":1024},"${",{"type":46,"tag":73,"props":1026,"children":1027},{"style":121},[1028],{"type":51,"value":1029},"port",{"type":46,"tag":73,"props":1031,"children":1032},{"style":115},[1033],{"type":51,"value":1034},"}`",{"type":46,"tag":73,"props":1036,"children":1037},{"style":115},[1038],{"type":51,"value":334},{"type":46,"tag":73,"props":1040,"children":1041},{"class":75,"line":424},[1042,1047],{"type":46,"tag":73,"props":1043,"children":1044},{"style":121},[1045],{"type":51,"value":1046},"    ]",{"type":46,"tag":73,"props":1048,"children":1049},{"style":115},[1050],{"type":51,"value":334},{"type":46,"tag":73,"props":1052,"children":1053},{"class":75,"line":442},[1054],{"type":46,"tag":73,"props":1055,"children":1056},{"style":115},[1057],{"type":51,"value":508},{"type":46,"tag":73,"props":1059,"children":1060},{"class":75,"line":472},[1061],{"type":46,"tag":73,"props":1062,"children":1063},{"style":115},[1064],{"type":51,"value":899},{"type":46,"tag":73,"props":1066,"children":1067},{"class":75,"line":502},[1068,1073,1077,1081,1086,1090],{"type":46,"tag":73,"props":1069,"children":1070},{"style":307},[1071],{"type":51,"value":1072},"    id",{"type":46,"tag":73,"props":1074,"children":1075},{"style":115},[1076],{"type":51,"value":315},{"type":46,"tag":73,"props":1078,"children":1079},{"style":115},[1080],{"type":51,"value":139},{"type":46,"tag":73,"props":1082,"children":1083},{"style":86},[1084],{"type":51,"value":1085},"devtools:vscode",{"type":46,"tag":73,"props":1087,"children":1088},{"style":115},[1089],{"type":51,"value":329},{"type":46,"tag":73,"props":1091,"children":1092},{"style":115},[1093],{"type":51,"value":334},{"type":46,"tag":73,"props":1095,"children":1096},{"class":75,"line":511},[1097,1102,1106,1110,1115,1119],{"type":46,"tag":73,"props":1098,"children":1099},{"style":307},[1100],{"type":51,"value":1101},"    name",{"type":46,"tag":73,"props":1103,"children":1104},{"style":115},[1105],{"type":51,"value":315},{"type":46,"tag":73,"props":1107,"children":1108},{"style":115},[1109],{"type":51,"value":139},{"type":46,"tag":73,"props":1111,"children":1112},{"style":86},[1113],{"type":51,"value":1114},"VS Code Server",{"type":46,"tag":73,"props":1116,"children":1117},{"style":115},[1118],{"type":51,"value":329},{"type":46,"tag":73,"props":1120,"children":1121},{"style":115},[1122],{"type":51,"value":334},{"type":46,"tag":73,"props":1124,"children":1126},{"class":75,"line":1125},16,[1127,1132,1136,1140,1145,1149],{"type":46,"tag":73,"props":1128,"children":1129},{"style":307},[1130],{"type":51,"value":1131},"    icon",{"type":46,"tag":73,"props":1133,"children":1134},{"style":115},[1135],{"type":51,"value":315},{"type":46,"tag":73,"props":1137,"children":1138},{"style":115},[1139],{"type":51,"value":139},{"type":46,"tag":73,"props":1141,"children":1142},{"style":86},[1143],{"type":51,"value":1144},"logos-visual-studio-code",{"type":46,"tag":73,"props":1146,"children":1147},{"style":115},[1148],{"type":51,"value":329},{"type":46,"tag":73,"props":1150,"children":1151},{"style":115},[1152],{"type":51,"value":334},{"type":46,"tag":73,"props":1154,"children":1156},{"class":75,"line":1155},17,[1157],{"type":46,"tag":73,"props":1158,"children":1159},{"style":115},[1160],{"type":51,"value":508},{"type":46,"tag":73,"props":1162,"children":1164},{"class":75,"line":1163},18,[1165],{"type":46,"tag":73,"props":1166,"children":1167},{"style":121},[1168],{"type":51,"value":1169},")\n",{"type":46,"tag":63,"props":1171,"children":1173},{"className":97,"code":1172,"language":99,"meta":40,"style":40},"subprocess.restart()\nsubprocess.terminate()\n",[1174],{"type":46,"tag":54,"props":1175,"children":1176},{"__ignoreMap":40},[1177,1199],{"type":46,"tag":73,"props":1178,"children":1179},{"class":75,"line":76},[1180,1185,1189,1194],{"type":46,"tag":73,"props":1181,"children":1182},{"style":121},[1183],{"type":51,"value":1184},"subprocess",{"type":46,"tag":73,"props":1186,"children":1187},{"style":115},[1188],{"type":51,"value":61},{"type":46,"tag":73,"props":1190,"children":1191},{"style":261},[1192],{"type":51,"value":1193},"restart",{"type":46,"tag":73,"props":1195,"children":1196},{"style":121},[1197],{"type":51,"value":1198},"()\n",{"type":46,"tag":73,"props":1200,"children":1201},{"class":75,"line":247},[1202,1206,1210,1215],{"type":46,"tag":73,"props":1203,"children":1204},{"style":121},[1205],{"type":51,"value":1184},{"type":46,"tag":73,"props":1207,"children":1208},{"style":115},[1209],{"type":51,"value":61},{"type":46,"tag":73,"props":1211,"children":1212},{"style":261},[1213],{"type":51,"value":1214},"terminate",{"type":46,"tag":73,"props":1216,"children":1217},{"style":121},[1218],{"type":51,"value":1198},{"type":46,"tag":181,"props":1220,"children":1222},{"id":1221},"extendserverrpc",[1223],{"type":46,"tag":54,"props":1224,"children":1226},{"className":1225},[],[1227],{"type":51,"value":1228},"extendServerRpc()",{"type":46,"tag":47,"props":1230,"children":1231},{},[1232],{"type":51,"value":1233},"Extend the server RPC with your own methods.",{"type":46,"tag":63,"props":1235,"children":1237},{"className":97,"code":1236,"language":99,"meta":40,"style":40},"import { extendServerRpc } from '@nuxt/devtools-kit'\n\nconst rpc = extendServerRpc('my-module', {\n  async myMethod() {\n    return 'hello'\n  },\n})\n",[1238],{"type":46,"tag":54,"props":1239,"children":1240},{"__ignoreMap":40},[1241,1277,1284,1328,1349,1370,1377],{"type":46,"tag":73,"props":1242,"children":1243},{"class":75,"line":76},[1244,1248,1252,1257,1261,1265,1269,1273],{"type":46,"tag":73,"props":1245,"children":1246},{"style":109},[1247],{"type":51,"value":112},{"type":46,"tag":73,"props":1249,"children":1250},{"style":115},[1251],{"type":51,"value":118},{"type":46,"tag":73,"props":1253,"children":1254},{"style":121},[1255],{"type":51,"value":1256}," extendServerRpc",{"type":46,"tag":73,"props":1258,"children":1259},{"style":115},[1260],{"type":51,"value":129},{"type":46,"tag":73,"props":1262,"children":1263},{"style":109},[1264],{"type":51,"value":134},{"type":46,"tag":73,"props":1266,"children":1267},{"style":115},[1268],{"type":51,"value":139},{"type":46,"tag":73,"props":1270,"children":1271},{"style":86},[1272],{"type":51,"value":144},{"type":46,"tag":73,"props":1274,"children":1275},{"style":115},[1276],{"type":51,"value":149},{"type":46,"tag":73,"props":1278,"children":1279},{"class":75,"line":247},[1280],{"type":46,"tag":73,"props":1281,"children":1282},{"emptyLinePlaceholder":251},[1283],{"type":51,"value":254},{"type":46,"tag":73,"props":1285,"children":1286},{"class":75,"line":257},[1287,1291,1296,1300,1304,1308,1312,1316,1320,1324],{"type":46,"tag":73,"props":1288,"children":1289},{"style":277},[1290],{"type":51,"value":603},{"type":46,"tag":73,"props":1292,"children":1293},{"style":121},[1294],{"type":51,"value":1295}," rpc ",{"type":46,"tag":73,"props":1297,"children":1298},{"style":115},[1299],{"type":51,"value":882},{"type":46,"tag":73,"props":1301,"children":1302},{"style":261},[1303],{"type":51,"value":1256},{"type":46,"tag":73,"props":1305,"children":1306},{"style":121},[1307],{"type":51,"value":269},{"type":46,"tag":73,"props":1309,"children":1310},{"style":115},[1311],{"type":51,"value":329},{"type":46,"tag":73,"props":1313,"children":1314},{"style":86},[1315],{"type":51,"value":324},{"type":46,"tag":73,"props":1317,"children":1318},{"style":115},[1319],{"type":51,"value":329},{"type":46,"tag":73,"props":1321,"children":1322},{"style":115},[1323],{"type":51,"value":739},{"type":46,"tag":73,"props":1325,"children":1326},{"style":115},[1327],{"type":51,"value":439},{"type":46,"tag":73,"props":1329,"children":1330},{"class":75,"line":293},[1331,1336,1341,1345],{"type":46,"tag":73,"props":1332,"children":1333},{"style":277},[1334],{"type":51,"value":1335},"  async",{"type":46,"tag":73,"props":1337,"children":1338},{"style":307},[1339],{"type":51,"value":1340}," myMethod",{"type":46,"tag":73,"props":1342,"children":1343},{"style":115},[1344],{"type":51,"value":274},{"type":46,"tag":73,"props":1346,"children":1347},{"style":115},[1348],{"type":51,"value":439},{"type":46,"tag":73,"props":1350,"children":1351},{"class":75,"line":303},[1352,1357,1361,1366],{"type":46,"tag":73,"props":1353,"children":1354},{"style":109},[1355],{"type":51,"value":1356},"    return",{"type":46,"tag":73,"props":1358,"children":1359},{"style":115},[1360],{"type":51,"value":139},{"type":46,"tag":73,"props":1362,"children":1363},{"style":86},[1364],{"type":51,"value":1365},"hello",{"type":46,"tag":73,"props":1367,"children":1368},{"style":115},[1369],{"type":51,"value":149},{"type":46,"tag":73,"props":1371,"children":1372},{"class":75,"line":337},[1373],{"type":46,"tag":73,"props":1374,"children":1375},{"style":115},[1376],{"type":51,"value":508},{"type":46,"tag":73,"props":1378,"children":1379},{"class":75,"line":346},[1380,1384],{"type":46,"tag":73,"props":1381,"children":1382},{"style":115},[1383],{"type":51,"value":517},{"type":46,"tag":73,"props":1385,"children":1386},{"style":121},[1387],{"type":51,"value":1169},{"type":46,"tag":47,"props":1389,"children":1390},{},[1391,1393,1400],{"type":51,"value":1392},"Learn more about ",{"type":46,"tag":1394,"props":1395,"children":1397},"a",{"href":1396},"/module/guide#custom-rpc-functions",[1398],{"type":51,"value":1399},"Custom RPC functions",{"type":51,"value":61},{"type":46,"tag":171,"props":1402,"children":1404},{"id":1403},"nuxtdevtools-kitiframe-client",[1405],{"type":46,"tag":54,"props":1406,"children":1408},{"className":1407},[],[1409],{"type":51,"value":1410},"@nuxt/devtools-kit/iframe-client",{"type":46,"tag":47,"props":1412,"children":1413},{},[1414],{"type":51,"value":1415},"To provide complex interactions for your module integrations, we recommend to host your own view and display it in devtools via iframe.",{"type":46,"tag":47,"props":1417,"children":1418},{},[1419],{"type":51,"value":1420},"To get the infomation from the devtools and the client app, you can do this in your client app:",{"type":46,"tag":63,"props":1422,"children":1424},{"className":97,"code":1423,"language":99,"meta":40,"style":40},"import { useDevtoolsClient } from '@nuxt/devtools-kit/iframe-client'\n\nexport const devtoolsClient = useDevtoolsClient()\n",[1425],{"type":46,"tag":54,"props":1426,"children":1427},{"__ignoreMap":40},[1428,1464,1471],{"type":46,"tag":73,"props":1429,"children":1430},{"class":75,"line":76},[1431,1435,1439,1444,1448,1452,1456,1460],{"type":46,"tag":73,"props":1432,"children":1433},{"style":109},[1434],{"type":51,"value":112},{"type":46,"tag":73,"props":1436,"children":1437},{"style":115},[1438],{"type":51,"value":118},{"type":46,"tag":73,"props":1440,"children":1441},{"style":121},[1442],{"type":51,"value":1443}," useDevtoolsClient",{"type":46,"tag":73,"props":1445,"children":1446},{"style":115},[1447],{"type":51,"value":129},{"type":46,"tag":73,"props":1449,"children":1450},{"style":109},[1451],{"type":51,"value":134},{"type":46,"tag":73,"props":1453,"children":1454},{"style":115},[1455],{"type":51,"value":139},{"type":46,"tag":73,"props":1457,"children":1458},{"style":86},[1459],{"type":51,"value":1410},{"type":46,"tag":73,"props":1461,"children":1462},{"style":115},[1463],{"type":51,"value":149},{"type":46,"tag":73,"props":1465,"children":1466},{"class":75,"line":247},[1467],{"type":46,"tag":73,"props":1468,"children":1469},{"emptyLinePlaceholder":251},[1470],{"type":51,"value":254},{"type":46,"tag":73,"props":1472,"children":1473},{"class":75,"line":257},[1474,1479,1484,1489,1493,1497],{"type":46,"tag":73,"props":1475,"children":1476},{"style":109},[1477],{"type":51,"value":1478},"export",{"type":46,"tag":73,"props":1480,"children":1481},{"style":277},[1482],{"type":51,"value":1483}," const",{"type":46,"tag":73,"props":1485,"children":1486},{"style":121},[1487],{"type":51,"value":1488}," devtoolsClient ",{"type":46,"tag":73,"props":1490,"children":1491},{"style":115},[1492],{"type":51,"value":882},{"type":46,"tag":73,"props":1494,"children":1495},{"style":261},[1496],{"type":51,"value":1443},{"type":46,"tag":73,"props":1498,"children":1499},{"style":121},[1500],{"type":51,"value":1198},{"type":46,"tag":47,"props":1502,"children":1503},{},[1504,1506,1512,1514,1520],{"type":51,"value":1505},"When the iframe been served with the same origin (CORS limitation), devtools will automatically inject ",{"type":46,"tag":54,"props":1507,"children":1509},{"className":1508},[],[1510],{"type":51,"value":1511},"__NUXT_DEVTOOLS__",{"type":51,"value":1513}," to the iframe's window object. You can access it as a ref using ",{"type":46,"tag":54,"props":1515,"children":1517},{"className":1516},[],[1518],{"type":51,"value":1519},"useDevtoolsClient()",{"type":51,"value":1521}," utility.",{"type":46,"tag":181,"props":1523,"children":1525},{"id":1524},"usedevtoolsclient",[1526],{"type":46,"tag":54,"props":1527,"children":1529},{"className":1528},[],[1530],{"type":51,"value":1519},{"type":46,"tag":47,"props":1532,"children":1533},{},[1534,1536,1542,1544,1550],{"type":51,"value":1535},"It will return a ref of ",{"type":46,"tag":54,"props":1537,"children":1539},{"className":1538},[],[1540],{"type":51,"value":1541},"NuxtDevtoolsIframeClient",{"type":51,"value":1543}," object that are intially ",{"type":46,"tag":54,"props":1545,"children":1547},{"className":1546},[],[1548],{"type":51,"value":1549},"null",{"type":51,"value":1551}," and will be updated when the connection is ready.",{"type":46,"tag":47,"props":1553,"children":1554},{},[1555,1560],{"type":46,"tag":54,"props":1556,"children":1558},{"className":1557},[],[1559],{"type":51,"value":1541},{"type":51,"value":1561}," contains two properties:",{"type":46,"tag":529,"props":1563,"children":1564},{},[1565,1576],{"type":46,"tag":533,"props":1566,"children":1567},{},[1568,1574],{"type":46,"tag":54,"props":1569,"children":1571},{"className":1570},[],[1572],{"type":51,"value":1573},"host",{"type":51,"value":1575},": APIs to communicate with the main app in browser",{"type":46,"tag":533,"props":1577,"children":1578},{},[1579,1585],{"type":46,"tag":54,"props":1580,"children":1582},{"className":1581},[],[1583],{"type":51,"value":1584},"devtools",{"type":51,"value":1586},": APIs to communicate with the devtools",{"type":46,"tag":47,"props":1588,"children":1589},{},[1590,1595],{"type":46,"tag":54,"props":1591,"children":1593},{"className":1592},[],[1594],{"type":51,"value":1573},{"type":51,"value":1596}," can be undefined when devtools are accessed standalone or from a different origin.",{"type":46,"tag":47,"props":1598,"children":1599},{},[1600],{"type":51,"value":1601},"For example, you can get the router instance from the client app:",{"type":46,"tag":63,"props":1603,"children":1605},{"className":97,"code":1604,"language":99,"meta":40,"style":40},"const router = computed(() => devtoolsClient.value?.host?.nuxt.vueApp.config.globalProperties?.$router)\n",[1606],{"type":46,"tag":54,"props":1607,"children":1608},{"__ignoreMap":40},[1609],{"type":46,"tag":73,"props":1610,"children":1611},{"class":75,"line":76},[1612,1616,1621,1625,1630,1634,1638,1642,1647,1651,1656,1661,1665,1669,1674,1678,1683,1687,1692,1696,1701,1705],{"type":46,"tag":73,"props":1613,"children":1614},{"style":277},[1615],{"type":51,"value":603},{"type":46,"tag":73,"props":1617,"children":1618},{"style":121},[1619],{"type":51,"value":1620}," router ",{"type":46,"tag":73,"props":1622,"children":1623},{"style":115},[1624],{"type":51,"value":882},{"type":46,"tag":73,"props":1626,"children":1627},{"style":261},[1628],{"type":51,"value":1629}," computed",{"type":46,"tag":73,"props":1631,"children":1632},{"style":121},[1633],{"type":51,"value":269},{"type":46,"tag":73,"props":1635,"children":1636},{"style":115},[1637],{"type":51,"value":274},{"type":46,"tag":73,"props":1639,"children":1640},{"style":277},[1641],{"type":51,"value":280},{"type":46,"tag":73,"props":1643,"children":1644},{"style":121},[1645],{"type":51,"value":1646}," devtoolsClient",{"type":46,"tag":73,"props":1648,"children":1649},{"style":115},[1650],{"type":51,"value":61},{"type":46,"tag":73,"props":1652,"children":1653},{"style":121},[1654],{"type":51,"value":1655},"value",{"type":46,"tag":73,"props":1657,"children":1658},{"style":115},[1659],{"type":51,"value":1660},"?.",{"type":46,"tag":73,"props":1662,"children":1663},{"style":121},[1664],{"type":51,"value":1573},{"type":46,"tag":73,"props":1666,"children":1667},{"style":115},[1668],{"type":51,"value":1660},{"type":46,"tag":73,"props":1670,"children":1671},{"style":121},[1672],{"type":51,"value":1673},"nuxt",{"type":46,"tag":73,"props":1675,"children":1676},{"style":115},[1677],{"type":51,"value":61},{"type":46,"tag":73,"props":1679,"children":1680},{"style":121},[1681],{"type":51,"value":1682},"vueApp",{"type":46,"tag":73,"props":1684,"children":1685},{"style":115},[1686],{"type":51,"value":61},{"type":46,"tag":73,"props":1688,"children":1689},{"style":121},[1690],{"type":51,"value":1691},"config",{"type":46,"tag":73,"props":1693,"children":1694},{"style":115},[1695],{"type":51,"value":61},{"type":46,"tag":73,"props":1697,"children":1698},{"style":121},[1699],{"type":51,"value":1700},"globalProperties",{"type":46,"tag":73,"props":1702,"children":1703},{"style":115},[1704],{"type":51,"value":1660},{"type":46,"tag":73,"props":1706,"children":1707},{"style":121},[1708],{"type":51,"value":1709},"$router)\n",{"type":46,"tag":181,"props":1711,"children":1713},{"id":1712},"ondevtoolsclientconnected",[1714],{"type":46,"tag":54,"props":1715,"children":1717},{"className":1716},[],[1718],{"type":51,"value":1719},"onDevtoolsClientConnected()",{"type":46,"tag":47,"props":1721,"children":1722},{},[1723,1725,1730],{"type":51,"value":1724},"Similiar to ",{"type":46,"tag":54,"props":1726,"children":1728},{"className":1727},[],[1729],{"type":51,"value":1519},{"type":51,"value":1731}," but as a callback style:",{"type":46,"tag":63,"props":1733,"children":1735},{"className":97,"code":1734,"language":99,"meta":40,"style":40},"import { onDevtoolsClientConnected } from '@nuxt/devtools-kit/iframe-client'\n\nonDevtoolsClientConnected(async (client) => {\n  // client is NuxtDevtoolsIframeClient\n\n  const config = client.devtools.rpc.getServerConfig()\n  // ...\n})\n",[1736],{"type":46,"tag":54,"props":1737,"children":1738},{"__ignoreMap":40},[1739,1775,1782,1821,1829,1836,1888,1896],{"type":46,"tag":73,"props":1740,"children":1741},{"class":75,"line":76},[1742,1746,1750,1755,1759,1763,1767,1771],{"type":46,"tag":73,"props":1743,"children":1744},{"style":109},[1745],{"type":51,"value":112},{"type":46,"tag":73,"props":1747,"children":1748},{"style":115},[1749],{"type":51,"value":118},{"type":46,"tag":73,"props":1751,"children":1752},{"style":121},[1753],{"type":51,"value":1754}," onDevtoolsClientConnected",{"type":46,"tag":73,"props":1756,"children":1757},{"style":115},[1758],{"type":51,"value":129},{"type":46,"tag":73,"props":1760,"children":1761},{"style":109},[1762],{"type":51,"value":134},{"type":46,"tag":73,"props":1764,"children":1765},{"style":115},[1766],{"type":51,"value":139},{"type":46,"tag":73,"props":1768,"children":1769},{"style":86},[1770],{"type":51,"value":1410},{"type":46,"tag":73,"props":1772,"children":1773},{"style":115},[1774],{"type":51,"value":149},{"type":46,"tag":73,"props":1776,"children":1777},{"class":75,"line":247},[1778],{"type":46,"tag":73,"props":1779,"children":1780},{"emptyLinePlaceholder":251},[1781],{"type":51,"value":254},{"type":46,"tag":73,"props":1783,"children":1784},{"class":75,"line":257},[1785,1790,1794,1799,1803,1809,1813,1817],{"type":46,"tag":73,"props":1786,"children":1787},{"style":261},[1788],{"type":51,"value":1789},"onDevtoolsClientConnected",{"type":46,"tag":73,"props":1791,"children":1792},{"style":121},[1793],{"type":51,"value":269},{"type":46,"tag":73,"props":1795,"children":1796},{"style":277},[1797],{"type":51,"value":1798},"async",{"type":46,"tag":73,"props":1800,"children":1801},{"style":115},[1802],{"type":51,"value":285},{"type":46,"tag":73,"props":1804,"children":1806},{"style":1805},"--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic",[1807],{"type":51,"value":1808},"client",{"type":46,"tag":73,"props":1810,"children":1811},{"style":115},[1812],{"type":51,"value":562},{"type":46,"tag":73,"props":1814,"children":1815},{"style":277},[1816],{"type":51,"value":280},{"type":46,"tag":73,"props":1818,"children":1819},{"style":115},[1820],{"type":51,"value":439},{"type":46,"tag":73,"props":1822,"children":1823},{"class":75,"line":293},[1824],{"type":46,"tag":73,"props":1825,"children":1826},{"style":297},[1827],{"type":51,"value":1828},"  // client is NuxtDevtoolsIframeClient\n",{"type":46,"tag":73,"props":1830,"children":1831},{"class":75,"line":303},[1832],{"type":46,"tag":73,"props":1833,"children":1834},{"emptyLinePlaceholder":251},[1835],{"type":51,"value":254},{"type":46,"tag":73,"props":1837,"children":1838},{"class":75,"line":337},[1839,1844,1849,1853,1858,1862,1866,1870,1875,1879,1884],{"type":46,"tag":73,"props":1840,"children":1841},{"style":277},[1842],{"type":51,"value":1843},"  const",{"type":46,"tag":73,"props":1845,"children":1846},{"style":121},[1847],{"type":51,"value":1848}," config",{"type":46,"tag":73,"props":1850,"children":1851},{"style":115},[1852],{"type":51,"value":622},{"type":46,"tag":73,"props":1854,"children":1855},{"style":121},[1856],{"type":51,"value":1857}," client",{"type":46,"tag":73,"props":1859,"children":1860},{"style":115},[1861],{"type":51,"value":61},{"type":46,"tag":73,"props":1863,"children":1864},{"style":121},[1865],{"type":51,"value":1584},{"type":46,"tag":73,"props":1867,"children":1868},{"style":115},[1869],{"type":51,"value":61},{"type":46,"tag":73,"props":1871,"children":1872},{"style":121},[1873],{"type":51,"value":1874},"rpc",{"type":46,"tag":73,"props":1876,"children":1877},{"style":115},[1878],{"type":51,"value":61},{"type":46,"tag":73,"props":1880,"children":1881},{"style":261},[1882],{"type":51,"value":1883},"getServerConfig",{"type":46,"tag":73,"props":1885,"children":1886},{"style":307},[1887],{"type":51,"value":1198},{"type":46,"tag":73,"props":1889,"children":1890},{"class":75,"line":346},[1891],{"type":46,"tag":73,"props":1892,"children":1893},{"style":297},[1894],{"type":51,"value":1895},"  // ...\n",{"type":46,"tag":73,"props":1897,"children":1898},{"class":75,"line":376},[1899,1903],{"type":46,"tag":73,"props":1900,"children":1901},{"style":115},[1902],{"type":51,"value":517},{"type":46,"tag":73,"props":1904,"children":1905},{"style":121},[1906],{"type":51,"value":1169},{"type":46,"tag":171,"props":1908,"children":1910},{"id":1909},"nuxtdevtools-kithost-client",[1911],{"type":46,"tag":54,"props":1912,"children":1914},{"className":1913},[],[1915],{"type":51,"value":1916},"@nuxt/devtools-kit/host-client",{"type":46,"tag":47,"props":1918,"children":1919},{},[1920,1922,1927],{"type":51,"value":1921},"When you have iframe for your devtools view, sometimes you need to communicate with the devtools host (the main app in browser) with a runtime plugin. You can use ",{"type":46,"tag":54,"props":1923,"children":1925},{"className":1924},[],[1926],{"type":51,"value":1916},{"type":51,"value":1928}," to do that.",{"type":46,"tag":181,"props":1930,"children":1932},{"id":1931},"usedevtoolshostclient",[1933],{"type":46,"tag":54,"props":1934,"children":1936},{"className":1935},[],[1937],{"type":51,"value":1938},"useDevtoolsHostClient()",{"type":46,"tag":47,"props":1940,"children":1941},{},[1942,1943,1949,1950,1955],{"type":51,"value":1535},{"type":46,"tag":54,"props":1944,"children":1946},{"className":1945},[],[1947],{"type":51,"value":1948},"NuxtDevtoolsHostClient",{"type":51,"value":1543},{"type":46,"tag":54,"props":1951,"children":1953},{"className":1952},[],[1954],{"type":51,"value":1549},{"type":51,"value":1956}," and will be updated when the host is initialized by NuxtDevtools.",{"type":46,"tag":63,"props":1958,"children":1960},{"className":97,"code":1959,"language":99,"meta":40,"style":40},"import { useDevtoolsHostClient } from '@nuxt/devtools-kit/host-client'\n\nexport default defineNuxtPlugin({\n  name: 'my-module:devtools',\n  setup(nuxtApp) {\n    const devtoolsHost = useDevtoolsHostClient()\n\n    // ...\n  }\n})\n",[1961],{"type":46,"tag":54,"props":1962,"children":1963},{"__ignoreMap":40},[1964,2000,2007,2032,2060,2085,2110,2117,2125,2133],{"type":46,"tag":73,"props":1965,"children":1966},{"class":75,"line":76},[1967,1971,1975,1980,1984,1988,1992,1996],{"type":46,"tag":73,"props":1968,"children":1969},{"style":109},[1970],{"type":51,"value":112},{"type":46,"tag":73,"props":1972,"children":1973},{"style":115},[1974],{"type":51,"value":118},{"type":46,"tag":73,"props":1976,"children":1977},{"style":121},[1978],{"type":51,"value":1979}," useDevtoolsHostClient",{"type":46,"tag":73,"props":1981,"children":1982},{"style":115},[1983],{"type":51,"value":129},{"type":46,"tag":73,"props":1985,"children":1986},{"style":109},[1987],{"type":51,"value":134},{"type":46,"tag":73,"props":1989,"children":1990},{"style":115},[1991],{"type":51,"value":139},{"type":46,"tag":73,"props":1993,"children":1994},{"style":86},[1995],{"type":51,"value":1916},{"type":46,"tag":73,"props":1997,"children":1998},{"style":115},[1999],{"type":51,"value":149},{"type":46,"tag":73,"props":2001,"children":2002},{"class":75,"line":247},[2003],{"type":46,"tag":73,"props":2004,"children":2005},{"emptyLinePlaceholder":251},[2006],{"type":51,"value":254},{"type":46,"tag":73,"props":2008,"children":2009},{"class":75,"line":257},[2010,2014,2019,2024,2028],{"type":46,"tag":73,"props":2011,"children":2012},{"style":109},[2013],{"type":51,"value":1478},{"type":46,"tag":73,"props":2015,"children":2016},{"style":109},[2017],{"type":51,"value":2018}," default",{"type":46,"tag":73,"props":2020,"children":2021},{"style":261},[2022],{"type":51,"value":2023}," defineNuxtPlugin",{"type":46,"tag":73,"props":2025,"children":2026},{"style":121},[2027],{"type":51,"value":269},{"type":46,"tag":73,"props":2029,"children":2030},{"style":115},[2031],{"type":51,"value":290},{"type":46,"tag":73,"props":2033,"children":2034},{"class":75,"line":293},[2035,2039,2043,2047,2052,2056],{"type":46,"tag":73,"props":2036,"children":2037},{"style":307},[2038],{"type":51,"value":310},{"type":46,"tag":73,"props":2040,"children":2041},{"style":115},[2042],{"type":51,"value":315},{"type":46,"tag":73,"props":2044,"children":2045},{"style":115},[2046],{"type":51,"value":139},{"type":46,"tag":73,"props":2048,"children":2049},{"style":86},[2050],{"type":51,"value":2051},"my-module:devtools",{"type":46,"tag":73,"props":2053,"children":2054},{"style":115},[2055],{"type":51,"value":329},{"type":46,"tag":73,"props":2057,"children":2058},{"style":115},[2059],{"type":51,"value":334},{"type":46,"tag":73,"props":2061,"children":2062},{"class":75,"line":303},[2063,2068,2072,2077,2081],{"type":46,"tag":73,"props":2064,"children":2065},{"style":307},[2066],{"type":51,"value":2067},"  setup",{"type":46,"tag":73,"props":2069,"children":2070},{"style":115},[2071],{"type":51,"value":269},{"type":46,"tag":73,"props":2073,"children":2074},{"style":1805},[2075],{"type":51,"value":2076},"nuxtApp",{"type":46,"tag":73,"props":2078,"children":2079},{"style":115},[2080],{"type":51,"value":562},{"type":46,"tag":73,"props":2082,"children":2083},{"style":115},[2084],{"type":51,"value":439},{"type":46,"tag":73,"props":2086,"children":2087},{"class":75,"line":337},[2088,2093,2098,2102,2106],{"type":46,"tag":73,"props":2089,"children":2090},{"style":277},[2091],{"type":51,"value":2092},"    const",{"type":46,"tag":73,"props":2094,"children":2095},{"style":121},[2096],{"type":51,"value":2097}," devtoolsHost",{"type":46,"tag":73,"props":2099,"children":2100},{"style":115},[2101],{"type":51,"value":622},{"type":46,"tag":73,"props":2103,"children":2104},{"style":261},[2105],{"type":51,"value":1979},{"type":46,"tag":73,"props":2107,"children":2108},{"style":307},[2109],{"type":51,"value":1198},{"type":46,"tag":73,"props":2111,"children":2112},{"class":75,"line":346},[2113],{"type":46,"tag":73,"props":2114,"children":2115},{"emptyLinePlaceholder":251},[2116],{"type":51,"value":254},{"type":46,"tag":73,"props":2118,"children":2119},{"class":75,"line":376},[2120],{"type":46,"tag":73,"props":2121,"children":2122},{"style":297},[2123],{"type":51,"value":2124},"    // ...\n",{"type":46,"tag":73,"props":2126,"children":2127},{"class":75,"line":385},[2128],{"type":46,"tag":73,"props":2129,"children":2130},{"style":115},[2131],{"type":51,"value":2132},"  }\n",{"type":46,"tag":73,"props":2134,"children":2135},{"class":75,"line":415},[2136,2140],{"type":46,"tag":73,"props":2137,"children":2138},{"style":115},[2139],{"type":51,"value":517},{"type":46,"tag":73,"props":2141,"children":2142},{"style":121},[2143],{"type":51,"value":1169},{"type":46,"tag":181,"props":2145,"children":2147},{"id":2146},"ondevtoolshostclientconnected",[2148],{"type":46,"tag":54,"props":2149,"children":2151},{"className":2150},[],[2152],{"type":51,"value":2153},"onDevtoolsHostClientConnected()",{"type":46,"tag":47,"props":2155,"children":2156},{},[2157,2158,2163],{"type":51,"value":1724},{"type":46,"tag":54,"props":2159,"children":2161},{"className":2160},[],[2162],{"type":51,"value":1938},{"type":51,"value":1731},{"type":46,"tag":63,"props":2165,"children":2167},{"className":97,"code":2166,"language":99,"meta":40,"style":40},"import { onDevtoolsHostClientConnected } from '@nuxt/devtools-kit/host-client'\n\nonDevtoolsHostClientConnected(async (host) => {\n\n})\n",[2168],{"type":46,"tag":54,"props":2169,"children":2170},{"__ignoreMap":40},[2171,2207,2214,2250,2257],{"type":46,"tag":73,"props":2172,"children":2173},{"class":75,"line":76},[2174,2178,2182,2187,2191,2195,2199,2203],{"type":46,"tag":73,"props":2175,"children":2176},{"style":109},[2177],{"type":51,"value":112},{"type":46,"tag":73,"props":2179,"children":2180},{"style":115},[2181],{"type":51,"value":118},{"type":46,"tag":73,"props":2183,"children":2184},{"style":121},[2185],{"type":51,"value":2186}," onDevtoolsHostClientConnected",{"type":46,"tag":73,"props":2188,"children":2189},{"style":115},[2190],{"type":51,"value":129},{"type":46,"tag":73,"props":2192,"children":2193},{"style":109},[2194],{"type":51,"value":134},{"type":46,"tag":73,"props":2196,"children":2197},{"style":115},[2198],{"type":51,"value":139},{"type":46,"tag":73,"props":2200,"children":2201},{"style":86},[2202],{"type":51,"value":1916},{"type":46,"tag":73,"props":2204,"children":2205},{"style":115},[2206],{"type":51,"value":149},{"type":46,"tag":73,"props":2208,"children":2209},{"class":75,"line":247},[2210],{"type":46,"tag":73,"props":2211,"children":2212},{"emptyLinePlaceholder":251},[2213],{"type":51,"value":254},{"type":46,"tag":73,"props":2215,"children":2216},{"class":75,"line":257},[2217,2222,2226,2230,2234,2238,2242,2246],{"type":46,"tag":73,"props":2218,"children":2219},{"style":261},[2220],{"type":51,"value":2221},"onDevtoolsHostClientConnected",{"type":46,"tag":73,"props":2223,"children":2224},{"style":121},[2225],{"type":51,"value":269},{"type":46,"tag":73,"props":2227,"children":2228},{"style":277},[2229],{"type":51,"value":1798},{"type":46,"tag":73,"props":2231,"children":2232},{"style":115},[2233],{"type":51,"value":285},{"type":46,"tag":73,"props":2235,"children":2236},{"style":1805},[2237],{"type":51,"value":1573},{"type":46,"tag":73,"props":2239,"children":2240},{"style":115},[2241],{"type":51,"value":562},{"type":46,"tag":73,"props":2243,"children":2244},{"style":277},[2245],{"type":51,"value":280},{"type":46,"tag":73,"props":2247,"children":2248},{"style":115},[2249],{"type":51,"value":439},{"type":46,"tag":73,"props":2251,"children":2252},{"class":75,"line":293},[2253],{"type":46,"tag":73,"props":2254,"children":2255},{"emptyLinePlaceholder":251},[2256],{"type":51,"value":254},{"type":46,"tag":73,"props":2258,"children":2259},{"class":75,"line":303},[2260,2264],{"type":46,"tag":73,"props":2261,"children":2262},{"style":115},[2263],{"type":51,"value":517},{"type":46,"tag":73,"props":2265,"children":2266},{"style":121},[2267],{"type":51,"value":1169},{"type":46,"tag":2269,"props":2270,"children":2271},"style",{},[2272],{"type":51,"value":2273},"html .light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html.light .shiki span {color: var(--shiki-light);background: var(--shiki-light-bg);font-style: var(--shiki-light-font-style);font-weight: var(--shiki-light-font-weight);text-decoration: var(--shiki-light-text-decoration);}html .default .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .shiki span {color: var(--shiki-default);background: var(--shiki-default-bg);font-style: var(--shiki-default-font-style);font-weight: var(--shiki-default-font-weight);text-decoration: var(--shiki-default-text-decoration);}html .dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}html.dark .shiki span {color: var(--shiki-dark);background: var(--shiki-dark-bg);font-style: var(--shiki-dark-font-style);font-weight: var(--shiki-dark-font-weight);text-decoration: var(--shiki-dark-text-decoration);}",{"title":40,"searchDepth":247,"depth":247,"links":2275},[2276,2282,2286],{"id":173,"depth":247,"text":144,"children":2277},[2278,2279,2280,2281],{"id":183,"depth":257,"text":190},{"id":772,"depth":257,"text":779},{"id":795,"depth":257,"text":802},{"id":1221,"depth":257,"text":1228},{"id":1403,"depth":247,"text":1410,"children":2283},[2284,2285],{"id":1524,"depth":257,"text":1519},{"id":1712,"depth":257,"text":1719},{"id":1909,"depth":247,"text":1916,"children":2287},[2288,2289],{"id":1931,"depth":257,"text":1938},{"id":2146,"depth":257,"text":2153},"markdown","content:2.module:1.utils-kit.md","content","2.module/1.utils-kit.md","2.module/1.utils-kit","md",[2297,5012],{"_path":23,"_dir":38,"_draft":39,"_partial":39,"_locale":40,"title":22,"description":2298,"body":2299,"_type":2290,"_id":5009,"_source":2292,"_file":5010,"_stem":5011,"_extension":2295},"Add your own modules integration to the Nuxt DevTools.",{"type":43,"children":2300,"toc":4998},[2301,2306,2312,2317,2357,2362,2368,2373,2378,2638,2643,2949,2955,2980,3151,3164,3174,3180,3185,3826,3839,3859,3865,3877,3883,3888,3893,4046,4051,4541,4546,4898,4904,4909,4919,4925,4930,4994],{"type":46,"tag":47,"props":2302,"children":2303},{},[2304],{"type":51,"value":2305},"Nuxt DevTools is designed to be extensible. You can add your own modules integration to the DevTools.",{"type":46,"tag":171,"props":2307,"children":2309},{"id":2308},"starter-template",[2310],{"type":51,"value":2311},"Starter Template",{"type":46,"tag":47,"props":2313,"children":2314},{},[2315],{"type":51,"value":2316},"If you want to try integrating with Nuxt DevTools, you can run",{"type":46,"tag":63,"props":2318,"children":2320},{"className":65,"code":2319,"language":67,"meta":40,"style":40},"npx nuxi init my-module -t module-devtools\n",[2321],{"type":46,"tag":54,"props":2322,"children":2323},{"__ignoreMap":40},[2324],{"type":46,"tag":73,"props":2325,"children":2326},{"class":75,"line":76},[2327,2332,2337,2342,2347,2352],{"type":46,"tag":73,"props":2328,"children":2329},{"style":80},[2330],{"type":51,"value":2331},"npx",{"type":46,"tag":73,"props":2333,"children":2334},{"style":86},[2335],{"type":51,"value":2336}," nuxi",{"type":46,"tag":73,"props":2338,"children":2339},{"style":86},[2340],{"type":51,"value":2341}," init",{"type":46,"tag":73,"props":2343,"children":2344},{"style":86},[2345],{"type":51,"value":2346}," my-module",{"type":46,"tag":73,"props":2348,"children":2349},{"style":86},[2350],{"type":51,"value":2351}," -t",{"type":46,"tag":73,"props":2353,"children":2354},{"style":86},[2355],{"type":51,"value":2356}," module-devtools\n",{"type":46,"tag":47,"props":2358,"children":2359},{},[2360],{"type":51,"value":2361},"to create a new module starter with Nuxt DevTools integration pre-configured (contributing a fully custom view as a tab).",{"type":46,"tag":171,"props":2363,"children":2365},{"id":2364},"contributing-to-view",[2366],{"type":51,"value":2367},"Contributing to View",{"type":46,"tag":47,"props":2369,"children":2370},{},[2371],{"type":51,"value":2372},"Currently the only way to contribute to Nuxt DevTools View is via iframe. You need to serve your module's view yourself and then register it to the DevTools.",{"type":46,"tag":47,"props":2374,"children":2375},{},[2376],{"type":51,"value":2377},"You can use the utility kit provided by Nuxt DevTools to register your custom tab:",{"type":46,"tag":63,"props":2379,"children":2381},{"className":97,"code":2380,"language":99,"meta":40,"style":40},"import { addCustomTab } from '@nuxt/devtools-kit'\n\naddCustomTab({\n  // unique identifier\n  name: 'my-module',\n  // title to display in the tab\n  title: 'My Module',\n  // any icon from Iconify, or a URL to an image\n  icon: 'carbon:apps',\n  // iframe view\n  view: {\n    type: 'iframe',\n    src: '/url-to-your-module-view',\n  },\n})\n",[2382],{"type":46,"tag":54,"props":2383,"children":2384},{"__ignoreMap":40},[2385,2420,2427,2442,2449,2476,2483,2510,2517,2544,2551,2566,2593,2620,2627],{"type":46,"tag":73,"props":2386,"children":2387},{"class":75,"line":76},[2388,2392,2396,2400,2404,2408,2412,2416],{"type":46,"tag":73,"props":2389,"children":2390},{"style":109},[2391],{"type":51,"value":112},{"type":46,"tag":73,"props":2393,"children":2394},{"style":115},[2395],{"type":51,"value":118},{"type":46,"tag":73,"props":2397,"children":2398},{"style":121},[2399],{"type":51,"value":124},{"type":46,"tag":73,"props":2401,"children":2402},{"style":115},[2403],{"type":51,"value":129},{"type":46,"tag":73,"props":2405,"children":2406},{"style":109},[2407],{"type":51,"value":134},{"type":46,"tag":73,"props":2409,"children":2410},{"style":115},[2411],{"type":51,"value":139},{"type":46,"tag":73,"props":2413,"children":2414},{"style":86},[2415],{"type":51,"value":144},{"type":46,"tag":73,"props":2417,"children":2418},{"style":115},[2419],{"type":51,"value":149},{"type":46,"tag":73,"props":2421,"children":2422},{"class":75,"line":247},[2423],{"type":46,"tag":73,"props":2424,"children":2425},{"emptyLinePlaceholder":251},[2426],{"type":51,"value":254},{"type":46,"tag":73,"props":2428,"children":2429},{"class":75,"line":257},[2430,2434,2438],{"type":46,"tag":73,"props":2431,"children":2432},{"style":261},[2433],{"type":51,"value":264},{"type":46,"tag":73,"props":2435,"children":2436},{"style":121},[2437],{"type":51,"value":269},{"type":46,"tag":73,"props":2439,"children":2440},{"style":115},[2441],{"type":51,"value":290},{"type":46,"tag":73,"props":2443,"children":2444},{"class":75,"line":293},[2445],{"type":46,"tag":73,"props":2446,"children":2447},{"style":297},[2448],{"type":51,"value":300},{"type":46,"tag":73,"props":2450,"children":2451},{"class":75,"line":303},[2452,2456,2460,2464,2468,2472],{"type":46,"tag":73,"props":2453,"children":2454},{"style":307},[2455],{"type":51,"value":310},{"type":46,"tag":73,"props":2457,"children":2458},{"style":115},[2459],{"type":51,"value":315},{"type":46,"tag":73,"props":2461,"children":2462},{"style":115},[2463],{"type":51,"value":139},{"type":46,"tag":73,"props":2465,"children":2466},{"style":86},[2467],{"type":51,"value":324},{"type":46,"tag":73,"props":2469,"children":2470},{"style":115},[2471],{"type":51,"value":329},{"type":46,"tag":73,"props":2473,"children":2474},{"style":115},[2475],{"type":51,"value":334},{"type":46,"tag":73,"props":2477,"children":2478},{"class":75,"line":337},[2479],{"type":46,"tag":73,"props":2480,"children":2481},{"style":297},[2482],{"type":51,"value":343},{"type":46,"tag":73,"props":2484,"children":2485},{"class":75,"line":346},[2486,2490,2494,2498,2502,2506],{"type":46,"tag":73,"props":2487,"children":2488},{"style":307},[2489],{"type":51,"value":352},{"type":46,"tag":73,"props":2491,"children":2492},{"style":115},[2493],{"type":51,"value":315},{"type":46,"tag":73,"props":2495,"children":2496},{"style":115},[2497],{"type":51,"value":139},{"type":46,"tag":73,"props":2499,"children":2500},{"style":86},[2501],{"type":51,"value":365},{"type":46,"tag":73,"props":2503,"children":2504},{"style":115},[2505],{"type":51,"value":329},{"type":46,"tag":73,"props":2507,"children":2508},{"style":115},[2509],{"type":51,"value":334},{"type":46,"tag":73,"props":2511,"children":2512},{"class":75,"line":376},[2513],{"type":46,"tag":73,"props":2514,"children":2515},{"style":297},[2516],{"type":51,"value":382},{"type":46,"tag":73,"props":2518,"children":2519},{"class":75,"line":385},[2520,2524,2528,2532,2536,2540],{"type":46,"tag":73,"props":2521,"children":2522},{"style":307},[2523],{"type":51,"value":391},{"type":46,"tag":73,"props":2525,"children":2526},{"style":115},[2527],{"type":51,"value":315},{"type":46,"tag":73,"props":2529,"children":2530},{"style":115},[2531],{"type":51,"value":139},{"type":46,"tag":73,"props":2533,"children":2534},{"style":86},[2535],{"type":51,"value":404},{"type":46,"tag":73,"props":2537,"children":2538},{"style":115},[2539],{"type":51,"value":329},{"type":46,"tag":73,"props":2541,"children":2542},{"style":115},[2543],{"type":51,"value":334},{"type":46,"tag":73,"props":2545,"children":2546},{"class":75,"line":415},[2547],{"type":46,"tag":73,"props":2548,"children":2549},{"style":297},[2550],{"type":51,"value":421},{"type":46,"tag":73,"props":2552,"children":2553},{"class":75,"line":424},[2554,2558,2562],{"type":46,"tag":73,"props":2555,"children":2556},{"style":307},[2557],{"type":51,"value":430},{"type":46,"tag":73,"props":2559,"children":2560},{"style":115},[2561],{"type":51,"value":315},{"type":46,"tag":73,"props":2563,"children":2564},{"style":115},[2565],{"type":51,"value":439},{"type":46,"tag":73,"props":2567,"children":2568},{"class":75,"line":442},[2569,2573,2577,2581,2585,2589],{"type":46,"tag":73,"props":2570,"children":2571},{"style":307},[2572],{"type":51,"value":448},{"type":46,"tag":73,"props":2574,"children":2575},{"style":115},[2576],{"type":51,"value":315},{"type":46,"tag":73,"props":2578,"children":2579},{"style":115},[2580],{"type":51,"value":139},{"type":46,"tag":73,"props":2582,"children":2583},{"style":86},[2584],{"type":51,"value":461},{"type":46,"tag":73,"props":2586,"children":2587},{"style":115},[2588],{"type":51,"value":329},{"type":46,"tag":73,"props":2590,"children":2591},{"style":115},[2592],{"type":51,"value":334},{"type":46,"tag":73,"props":2594,"children":2595},{"class":75,"line":472},[2596,2600,2604,2608,2612,2616],{"type":46,"tag":73,"props":2597,"children":2598},{"style":307},[2599],{"type":51,"value":478},{"type":46,"tag":73,"props":2601,"children":2602},{"style":115},[2603],{"type":51,"value":315},{"type":46,"tag":73,"props":2605,"children":2606},{"style":115},[2607],{"type":51,"value":139},{"type":46,"tag":73,"props":2609,"children":2610},{"style":86},[2611],{"type":51,"value":491},{"type":46,"tag":73,"props":2613,"children":2614},{"style":115},[2615],{"type":51,"value":329},{"type":46,"tag":73,"props":2617,"children":2618},{"style":115},[2619],{"type":51,"value":334},{"type":46,"tag":73,"props":2621,"children":2622},{"class":75,"line":502},[2623],{"type":46,"tag":73,"props":2624,"children":2625},{"style":115},[2626],{"type":51,"value":508},{"type":46,"tag":73,"props":2628,"children":2629},{"class":75,"line":511},[2630,2634],{"type":46,"tag":73,"props":2631,"children":2632},{"style":115},[2633],{"type":51,"value":517},{"type":46,"tag":73,"props":2635,"children":2636},{"style":121},[2637],{"type":51,"value":1169},{"type":46,"tag":47,"props":2639,"children":2640},{},[2641],{"type":51,"value":2642},"Or if you prefer to use Nuxt hooks:",{"type":46,"tag":63,"props":2644,"children":2646},{"className":97,"code":2645,"language":99,"meta":40,"style":40},"nuxt.hook('devtools:customTabs', (tabs) => {\n  tabs.push({\n    // unique identifier\n    name: 'my-module',\n    // title to display in the tab\n    title: 'My Module',\n    // any icon from Iconify, or a URL to an image\n    icon: 'carbon:apps',\n    // iframe view\n    view: {\n      type: 'iframe',\n      src: '/url-to-your-module-view',\n    },\n  })\n})\n",[2647],{"type":46,"tag":54,"props":2648,"children":2649},{"__ignoreMap":40},[2650,2707,2732,2740,2767,2775,2803,2811,2838,2846,2862,2890,2918,2926,2938],{"type":46,"tag":73,"props":2651,"children":2652},{"class":75,"line":76},[2653,2657,2661,2666,2670,2674,2678,2682,2686,2690,2695,2699,2703],{"type":46,"tag":73,"props":2654,"children":2655},{"style":121},[2656],{"type":51,"value":1673},{"type":46,"tag":73,"props":2658,"children":2659},{"style":115},[2660],{"type":51,"value":61},{"type":46,"tag":73,"props":2662,"children":2663},{"style":261},[2664],{"type":51,"value":2665},"hook",{"type":46,"tag":73,"props":2667,"children":2668},{"style":121},[2669],{"type":51,"value":269},{"type":46,"tag":73,"props":2671,"children":2672},{"style":115},[2673],{"type":51,"value":329},{"type":46,"tag":73,"props":2675,"children":2676},{"style":86},[2677],{"type":51,"value":201},{"type":46,"tag":73,"props":2679,"children":2680},{"style":115},[2681],{"type":51,"value":329},{"type":46,"tag":73,"props":2683,"children":2684},{"style":115},[2685],{"type":51,"value":739},{"type":46,"tag":73,"props":2687,"children":2688},{"style":115},[2689],{"type":51,"value":285},{"type":46,"tag":73,"props":2691,"children":2692},{"style":1805},[2693],{"type":51,"value":2694},"tabs",{"type":46,"tag":73,"props":2696,"children":2697},{"style":115},[2698],{"type":51,"value":562},{"type":46,"tag":73,"props":2700,"children":2701},{"style":277},[2702],{"type":51,"value":280},{"type":46,"tag":73,"props":2704,"children":2705},{"style":115},[2706],{"type":51,"value":439},{"type":46,"tag":73,"props":2708,"children":2709},{"class":75,"line":247},[2710,2715,2719,2724,2728],{"type":46,"tag":73,"props":2711,"children":2712},{"style":121},[2713],{"type":51,"value":2714},"  tabs",{"type":46,"tag":73,"props":2716,"children":2717},{"style":115},[2718],{"type":51,"value":61},{"type":46,"tag":73,"props":2720,"children":2721},{"style":261},[2722],{"type":51,"value":2723},"push",{"type":46,"tag":73,"props":2725,"children":2726},{"style":307},[2727],{"type":51,"value":269},{"type":46,"tag":73,"props":2729,"children":2730},{"style":115},[2731],{"type":51,"value":290},{"type":46,"tag":73,"props":2733,"children":2734},{"class":75,"line":257},[2735],{"type":46,"tag":73,"props":2736,"children":2737},{"style":297},[2738],{"type":51,"value":2739},"    // unique identifier\n",{"type":46,"tag":73,"props":2741,"children":2742},{"class":75,"line":293},[2743,2747,2751,2755,2759,2763],{"type":46,"tag":73,"props":2744,"children":2745},{"style":307},[2746],{"type":51,"value":1101},{"type":46,"tag":73,"props":2748,"children":2749},{"style":115},[2750],{"type":51,"value":315},{"type":46,"tag":73,"props":2752,"children":2753},{"style":115},[2754],{"type":51,"value":139},{"type":46,"tag":73,"props":2756,"children":2757},{"style":86},[2758],{"type":51,"value":324},{"type":46,"tag":73,"props":2760,"children":2761},{"style":115},[2762],{"type":51,"value":329},{"type":46,"tag":73,"props":2764,"children":2765},{"style":115},[2766],{"type":51,"value":334},{"type":46,"tag":73,"props":2768,"children":2769},{"class":75,"line":303},[2770],{"type":46,"tag":73,"props":2771,"children":2772},{"style":297},[2773],{"type":51,"value":2774},"    // title to display in the tab\n",{"type":46,"tag":73,"props":2776,"children":2777},{"class":75,"line":337},[2778,2783,2787,2791,2795,2799],{"type":46,"tag":73,"props":2779,"children":2780},{"style":307},[2781],{"type":51,"value":2782},"    title",{"type":46,"tag":73,"props":2784,"children":2785},{"style":115},[2786],{"type":51,"value":315},{"type":46,"tag":73,"props":2788,"children":2789},{"style":115},[2790],{"type":51,"value":139},{"type":46,"tag":73,"props":2792,"children":2793},{"style":86},[2794],{"type":51,"value":365},{"type":46,"tag":73,"props":2796,"children":2797},{"style":115},[2798],{"type":51,"value":329},{"type":46,"tag":73,"props":2800,"children":2801},{"style":115},[2802],{"type":51,"value":334},{"type":46,"tag":73,"props":2804,"children":2805},{"class":75,"line":346},[2806],{"type":46,"tag":73,"props":2807,"children":2808},{"style":297},[2809],{"type":51,"value":2810},"    // any icon from Iconify, or a URL to an image\n",{"type":46,"tag":73,"props":2812,"children":2813},{"class":75,"line":376},[2814,2818,2822,2826,2830,2834],{"type":46,"tag":73,"props":2815,"children":2816},{"style":307},[2817],{"type":51,"value":1131},{"type":46,"tag":73,"props":2819,"children":2820},{"style":115},[2821],{"type":51,"value":315},{"type":46,"tag":73,"props":2823,"children":2824},{"style":115},[2825],{"type":51,"value":139},{"type":46,"tag":73,"props":2827,"children":2828},{"style":86},[2829],{"type":51,"value":404},{"type":46,"tag":73,"props":2831,"children":2832},{"style":115},[2833],{"type":51,"value":329},{"type":46,"tag":73,"props":2835,"children":2836},{"style":115},[2837],{"type":51,"value":334},{"type":46,"tag":73,"props":2839,"children":2840},{"class":75,"line":385},[2841],{"type":46,"tag":73,"props":2842,"children":2843},{"style":297},[2844],{"type":51,"value":2845},"    // iframe view\n",{"type":46,"tag":73,"props":2847,"children":2848},{"class":75,"line":415},[2849,2854,2858],{"type":46,"tag":73,"props":2850,"children":2851},{"style":307},[2852],{"type":51,"value":2853},"    view",{"type":46,"tag":73,"props":2855,"children":2856},{"style":115},[2857],{"type":51,"value":315},{"type":46,"tag":73,"props":2859,"children":2860},{"style":115},[2861],{"type":51,"value":439},{"type":46,"tag":73,"props":2863,"children":2864},{"class":75,"line":424},[2865,2870,2874,2878,2882,2886],{"type":46,"tag":73,"props":2866,"children":2867},{"style":307},[2868],{"type":51,"value":2869},"      type",{"type":46,"tag":73,"props":2871,"children":2872},{"style":115},[2873],{"type":51,"value":315},{"type":46,"tag":73,"props":2875,"children":2876},{"style":115},[2877],{"type":51,"value":139},{"type":46,"tag":73,"props":2879,"children":2880},{"style":86},[2881],{"type":51,"value":461},{"type":46,"tag":73,"props":2883,"children":2884},{"style":115},[2885],{"type":51,"value":329},{"type":46,"tag":73,"props":2887,"children":2888},{"style":115},[2889],{"type":51,"value":334},{"type":46,"tag":73,"props":2891,"children":2892},{"class":75,"line":442},[2893,2898,2902,2906,2910,2914],{"type":46,"tag":73,"props":2894,"children":2895},{"style":307},[2896],{"type":51,"value":2897},"      src",{"type":46,"tag":73,"props":2899,"children":2900},{"style":115},[2901],{"type":51,"value":315},{"type":46,"tag":73,"props":2903,"children":2904},{"style":115},[2905],{"type":51,"value":139},{"type":46,"tag":73,"props":2907,"children":2908},{"style":86},[2909],{"type":51,"value":491},{"type":46,"tag":73,"props":2911,"children":2912},{"style":115},[2913],{"type":51,"value":329},{"type":46,"tag":73,"props":2915,"children":2916},{"style":115},[2917],{"type":51,"value":334},{"type":46,"tag":73,"props":2919,"children":2920},{"class":75,"line":472},[2921],{"type":46,"tag":73,"props":2922,"children":2923},{"style":115},[2924],{"type":51,"value":2925},"    },\n",{"type":46,"tag":73,"props":2927,"children":2928},{"class":75,"line":502},[2929,2934],{"type":46,"tag":73,"props":2930,"children":2931},{"style":115},[2932],{"type":51,"value":2933},"  }",{"type":46,"tag":73,"props":2935,"children":2936},{"style":307},[2937],{"type":51,"value":1169},{"type":46,"tag":73,"props":2939,"children":2940},{"class":75,"line":511},[2941,2945],{"type":46,"tag":73,"props":2942,"children":2943},{"style":115},[2944],{"type":51,"value":517},{"type":46,"tag":73,"props":2946,"children":2947},{"style":121},[2948],{"type":51,"value":1169},{"type":46,"tag":181,"props":2950,"children":2952},{"id":2951},"iframe-permissions",[2953],{"type":51,"value":2954},"Iframe Permissions",{"type":46,"tag":47,"props":2956,"children":2957},{},[2958,2960,2965,2966,2971,2973,2978],{"type":51,"value":2959},"By default, iframes have ",{"type":46,"tag":54,"props":2961,"children":2963},{"className":2962},[],[2964],{"type":51,"value":579},{"type":51,"value":581},{"type":46,"tag":54,"props":2967,"children":2969},{"className":2968},[],[2970],{"type":51,"value":587},{"type":51,"value":2972}," permissions enabled. You can add additional permissions using the ",{"type":46,"tag":54,"props":2974,"children":2976},{"className":2975},[],[2977],{"type":51,"value":571},{"type":51,"value":2979}," option:",{"type":46,"tag":63,"props":2981,"children":2983},{"className":97,"code":2982,"language":99,"meta":40,"style":40},"const view: ModuleIframeView = {\n  type: 'iframe',\n  src: '/url-to-your-module-view',\n  // Additional permissions to allow in the iframe\n  permissions: ['camera', 'microphone', 'geolocation'],\n}\n",[2984],{"type":46,"tag":54,"props":2985,"children":2986},{"__ignoreMap":40},[2987,3014,3041,3068,3076,3144],{"type":46,"tag":73,"props":2988,"children":2989},{"class":75,"line":76},[2990,2994,2998,3002,3006,3010],{"type":46,"tag":73,"props":2991,"children":2992},{"style":277},[2993],{"type":51,"value":603},{"type":46,"tag":73,"props":2995,"children":2996},{"style":121},[2997],{"type":51,"value":608},{"type":46,"tag":73,"props":2999,"children":3000},{"style":115},[3001],{"type":51,"value":315},{"type":46,"tag":73,"props":3003,"children":3004},{"style":80},[3005],{"type":51,"value":617},{"type":46,"tag":73,"props":3007,"children":3008},{"style":115},[3009],{"type":51,"value":622},{"type":46,"tag":73,"props":3011,"children":3012},{"style":115},[3013],{"type":51,"value":439},{"type":46,"tag":73,"props":3015,"children":3016},{"class":75,"line":247},[3017,3021,3025,3029,3033,3037],{"type":46,"tag":73,"props":3018,"children":3019},{"style":307},[3020],{"type":51,"value":634},{"type":46,"tag":73,"props":3022,"children":3023},{"style":115},[3024],{"type":51,"value":315},{"type":46,"tag":73,"props":3026,"children":3027},{"style":115},[3028],{"type":51,"value":139},{"type":46,"tag":73,"props":3030,"children":3031},{"style":86},[3032],{"type":51,"value":461},{"type":46,"tag":73,"props":3034,"children":3035},{"style":115},[3036],{"type":51,"value":329},{"type":46,"tag":73,"props":3038,"children":3039},{"style":115},[3040],{"type":51,"value":334},{"type":46,"tag":73,"props":3042,"children":3043},{"class":75,"line":257},[3044,3048,3052,3056,3060,3064],{"type":46,"tag":73,"props":3045,"children":3046},{"style":307},[3047],{"type":51,"value":662},{"type":46,"tag":73,"props":3049,"children":3050},{"style":115},[3051],{"type":51,"value":315},{"type":46,"tag":73,"props":3053,"children":3054},{"style":115},[3055],{"type":51,"value":139},{"type":46,"tag":73,"props":3057,"children":3058},{"style":86},[3059],{"type":51,"value":491},{"type":46,"tag":73,"props":3061,"children":3062},{"style":115},[3063],{"type":51,"value":329},{"type":46,"tag":73,"props":3065,"children":3066},{"style":115},[3067],{"type":51,"value":334},{"type":46,"tag":73,"props":3069,"children":3070},{"class":75,"line":293},[3071],{"type":46,"tag":73,"props":3072,"children":3073},{"style":297},[3074],{"type":51,"value":3075},"  // Additional permissions to allow in the iframe\n",{"type":46,"tag":73,"props":3077,"children":3078},{"class":75,"line":303},[3079,3083,3087,3091,3095,3099,3103,3107,3111,3115,3119,3123,3127,3132,3136,3140],{"type":46,"tag":73,"props":3080,"children":3081},{"style":307},[3082],{"type":51,"value":712},{"type":46,"tag":73,"props":3084,"children":3085},{"style":115},[3086],{"type":51,"value":315},{"type":46,"tag":73,"props":3088,"children":3089},{"style":121},[3090],{"type":51,"value":721},{"type":46,"tag":73,"props":3092,"children":3093},{"style":115},[3094],{"type":51,"value":329},{"type":46,"tag":73,"props":3096,"children":3097},{"style":86},[3098],{"type":51,"value":730},{"type":46,"tag":73,"props":3100,"children":3101},{"style":115},[3102],{"type":51,"value":329},{"type":46,"tag":73,"props":3104,"children":3105},{"style":115},[3106],{"type":51,"value":739},{"type":46,"tag":73,"props":3108,"children":3109},{"style":115},[3110],{"type":51,"value":139},{"type":46,"tag":73,"props":3112,"children":3113},{"style":86},[3114],{"type":51,"value":748},{"type":46,"tag":73,"props":3116,"children":3117},{"style":115},[3118],{"type":51,"value":329},{"type":46,"tag":73,"props":3120,"children":3121},{"style":115},[3122],{"type":51,"value":739},{"type":46,"tag":73,"props":3124,"children":3125},{"style":115},[3126],{"type":51,"value":139},{"type":46,"tag":73,"props":3128,"children":3129},{"style":86},[3130],{"type":51,"value":3131},"geolocation",{"type":46,"tag":73,"props":3133,"children":3134},{"style":115},[3135],{"type":51,"value":329},{"type":46,"tag":73,"props":3137,"children":3138},{"style":121},[3139],{"type":51,"value":757},{"type":46,"tag":73,"props":3141,"children":3142},{"style":115},[3143],{"type":51,"value":334},{"type":46,"tag":73,"props":3145,"children":3146},{"class":75,"line":337},[3147],{"type":46,"tag":73,"props":3148,"children":3149},{"style":115},[3150],{"type":51,"value":769},{"type":46,"tag":47,"props":3152,"children":3153},{},[3154,3156,3162],{"type":51,"value":3155},"These permissions will be merged with the default ones and set on the iframe's ",{"type":46,"tag":54,"props":3157,"children":3159},{"className":3158},[],[3160],{"type":51,"value":3161},"allow",{"type":51,"value":3163}," attribute.",{"type":46,"tag":47,"props":3165,"children":3166},{},[3167,3168,3173],{"type":51,"value":1392},{"type":46,"tag":1394,"props":3169,"children":3170},{"href":26},[3171],{"type":51,"value":3172},"DevTools Utility Kit",{"type":51,"value":61},{"type":46,"tag":171,"props":3175,"children":3177},{"id":3176},"lazy-service-launching",[3178],{"type":51,"value":3179},"Lazy Service Launching",{"type":46,"tag":47,"props":3181,"children":3182},{},[3183],{"type":51,"value":3184},"If the view you are contributing is heavy to load, you can have the tab first and let user launch it when they need it.",{"type":46,"tag":63,"props":3186,"children":3188},{"className":97,"code":3187,"language":99,"meta":40,"style":40},"let isReady = false\nconst promise: Promise\u003Cany> | null = null\n\nasync function launchService() {\n  // ...launch your service\n  isReady = true\n}\n\nnuxt.hook('devtools:customTabs', (tabs) => {\n  tabs.push({\n    name: 'my-module',\n    title: 'My Module',\n    view: isReady\n      ? {\n          type: 'iframe',\n          src: '/url-to-your-module-view',\n        }\n      : {\n          type: 'launch',\n          description: 'Launch My Module',\n          actions: [{\n            label: 'Start',\n            async handle() {\n              if (!promise)\n                promise = launchService()\n              await promise\n            },\n          }]\n        },\n  })\n})\n",[3189],{"type":46,"tag":54,"props":3190,"children":3191},{"__ignoreMap":40},[3192,3214,3269,3276,3301,3309,3326,3333,3340,3395,3418,3445,3472,3488,3500,3528,3556,3564,3576,3605,3635,3656,3686,3708,3735,3756,3770,3779,3793,3802,3814],{"type":46,"tag":73,"props":3193,"children":3194},{"class":75,"line":76},[3195,3200,3205,3209],{"type":46,"tag":73,"props":3196,"children":3197},{"style":277},[3198],{"type":51,"value":3199},"let",{"type":46,"tag":73,"props":3201,"children":3202},{"style":121},[3203],{"type":51,"value":3204}," isReady ",{"type":46,"tag":73,"props":3206,"children":3207},{"style":115},[3208],{"type":51,"value":882},{"type":46,"tag":73,"props":3210,"children":3211},{"style":697},[3212],{"type":51,"value":3213}," false\n",{"type":46,"tag":73,"props":3215,"children":3216},{"class":75,"line":247},[3217,3221,3226,3230,3235,3240,3245,3250,3255,3260,3264],{"type":46,"tag":73,"props":3218,"children":3219},{"style":277},[3220],{"type":51,"value":603},{"type":46,"tag":73,"props":3222,"children":3223},{"style":121},[3224],{"type":51,"value":3225}," promise",{"type":46,"tag":73,"props":3227,"children":3228},{"style":115},[3229],{"type":51,"value":315},{"type":46,"tag":73,"props":3231,"children":3232},{"style":80},[3233],{"type":51,"value":3234}," Promise",{"type":46,"tag":73,"props":3236,"children":3237},{"style":115},[3238],{"type":51,"value":3239},"\u003C",{"type":46,"tag":73,"props":3241,"children":3242},{"style":80},[3243],{"type":51,"value":3244},"any",{"type":46,"tag":73,"props":3246,"children":3247},{"style":115},[3248],{"type":51,"value":3249},">",{"type":46,"tag":73,"props":3251,"children":3252},{"style":115},[3253],{"type":51,"value":3254}," |",{"type":46,"tag":73,"props":3256,"children":3257},{"style":80},[3258],{"type":51,"value":3259}," null",{"type":46,"tag":73,"props":3261,"children":3262},{"style":115},[3263],{"type":51,"value":622},{"type":46,"tag":73,"props":3265,"children":3266},{"style":115},[3267],{"type":51,"value":3268}," null\n",{"type":46,"tag":73,"props":3270,"children":3271},{"class":75,"line":257},[3272],{"type":46,"tag":73,"props":3273,"children":3274},{"emptyLinePlaceholder":251},[3275],{"type":51,"value":254},{"type":46,"tag":73,"props":3277,"children":3278},{"class":75,"line":293},[3279,3283,3288,3293,3297],{"type":46,"tag":73,"props":3280,"children":3281},{"style":277},[3282],{"type":51,"value":1798},{"type":46,"tag":73,"props":3284,"children":3285},{"style":277},[3286],{"type":51,"value":3287}," function",{"type":46,"tag":73,"props":3289,"children":3290},{"style":261},[3291],{"type":51,"value":3292}," launchService",{"type":46,"tag":73,"props":3294,"children":3295},{"style":115},[3296],{"type":51,"value":274},{"type":46,"tag":73,"props":3298,"children":3299},{"style":115},[3300],{"type":51,"value":439},{"type":46,"tag":73,"props":3302,"children":3303},{"class":75,"line":303},[3304],{"type":46,"tag":73,"props":3305,"children":3306},{"style":297},[3307],{"type":51,"value":3308},"  // ...launch your service\n",{"type":46,"tag":73,"props":3310,"children":3311},{"class":75,"line":337},[3312,3317,3321],{"type":46,"tag":73,"props":3313,"children":3314},{"style":121},[3315],{"type":51,"value":3316},"  isReady",{"type":46,"tag":73,"props":3318,"children":3319},{"style":115},[3320],{"type":51,"value":622},{"type":46,"tag":73,"props":3322,"children":3323},{"style":697},[3324],{"type":51,"value":3325}," true\n",{"type":46,"tag":73,"props":3327,"children":3328},{"class":75,"line":346},[3329],{"type":46,"tag":73,"props":3330,"children":3331},{"style":115},[3332],{"type":51,"value":769},{"type":46,"tag":73,"props":3334,"children":3335},{"class":75,"line":376},[3336],{"type":46,"tag":73,"props":3337,"children":3338},{"emptyLinePlaceholder":251},[3339],{"type":51,"value":254},{"type":46,"tag":73,"props":3341,"children":3342},{"class":75,"line":385},[3343,3347,3351,3355,3359,3363,3367,3371,3375,3379,3383,3387,3391],{"type":46,"tag":73,"props":3344,"children":3345},{"style":121},[3346],{"type":51,"value":1673},{"type":46,"tag":73,"props":3348,"children":3349},{"style":115},[3350],{"type":51,"value":61},{"type":46,"tag":73,"props":3352,"children":3353},{"style":261},[3354],{"type":51,"value":2665},{"type":46,"tag":73,"props":3356,"children":3357},{"style":121},[3358],{"type":51,"value":269},{"type":46,"tag":73,"props":3360,"children":3361},{"style":115},[3362],{"type":51,"value":329},{"type":46,"tag":73,"props":3364,"children":3365},{"style":86},[3366],{"type":51,"value":201},{"type":46,"tag":73,"props":3368,"children":3369},{"style":115},[3370],{"type":51,"value":329},{"type":46,"tag":73,"props":3372,"children":3373},{"style":115},[3374],{"type":51,"value":739},{"type":46,"tag":73,"props":3376,"children":3377},{"style":115},[3378],{"type":51,"value":285},{"type":46,"tag":73,"props":3380,"children":3381},{"style":1805},[3382],{"type":51,"value":2694},{"type":46,"tag":73,"props":3384,"children":3385},{"style":115},[3386],{"type":51,"value":562},{"type":46,"tag":73,"props":3388,"children":3389},{"style":277},[3390],{"type":51,"value":280},{"type":46,"tag":73,"props":3392,"children":3393},{"style":115},[3394],{"type":51,"value":439},{"type":46,"tag":73,"props":3396,"children":3397},{"class":75,"line":415},[3398,3402,3406,3410,3414],{"type":46,"tag":73,"props":3399,"children":3400},{"style":121},[3401],{"type":51,"value":2714},{"type":46,"tag":73,"props":3403,"children":3404},{"style":115},[3405],{"type":51,"value":61},{"type":46,"tag":73,"props":3407,"children":3408},{"style":261},[3409],{"type":51,"value":2723},{"type":46,"tag":73,"props":3411,"children":3412},{"style":307},[3413],{"type":51,"value":269},{"type":46,"tag":73,"props":3415,"children":3416},{"style":115},[3417],{"type":51,"value":290},{"type":46,"tag":73,"props":3419,"children":3420},{"class":75,"line":424},[3421,3425,3429,3433,3437,3441],{"type":46,"tag":73,"props":3422,"children":3423},{"style":307},[3424],{"type":51,"value":1101},{"type":46,"tag":73,"props":3426,"children":3427},{"style":115},[3428],{"type":51,"value":315},{"type":46,"tag":73,"props":3430,"children":3431},{"style":115},[3432],{"type":51,"value":139},{"type":46,"tag":73,"props":3434,"children":3435},{"style":86},[3436],{"type":51,"value":324},{"type":46,"tag":73,"props":3438,"children":3439},{"style":115},[3440],{"type":51,"value":329},{"type":46,"tag":73,"props":3442,"children":3443},{"style":115},[3444],{"type":51,"value":334},{"type":46,"tag":73,"props":3446,"children":3447},{"class":75,"line":442},[3448,3452,3456,3460,3464,3468],{"type":46,"tag":73,"props":3449,"children":3450},{"style":307},[3451],{"type":51,"value":2782},{"type":46,"tag":73,"props":3453,"children":3454},{"style":115},[3455],{"type":51,"value":315},{"type":46,"tag":73,"props":3457,"children":3458},{"style":115},[3459],{"type":51,"value":139},{"type":46,"tag":73,"props":3461,"children":3462},{"style":86},[3463],{"type":51,"value":365},{"type":46,"tag":73,"props":3465,"children":3466},{"style":115},[3467],{"type":51,"value":329},{"type":46,"tag":73,"props":3469,"children":3470},{"style":115},[3471],{"type":51,"value":334},{"type":46,"tag":73,"props":3473,"children":3474},{"class":75,"line":472},[3475,3479,3483],{"type":46,"tag":73,"props":3476,"children":3477},{"style":307},[3478],{"type":51,"value":2853},{"type":46,"tag":73,"props":3480,"children":3481},{"style":115},[3482],{"type":51,"value":315},{"type":46,"tag":73,"props":3484,"children":3485},{"style":121},[3486],{"type":51,"value":3487}," isReady\n",{"type":46,"tag":73,"props":3489,"children":3490},{"class":75,"line":502},[3491,3496],{"type":46,"tag":73,"props":3492,"children":3493},{"style":115},[3494],{"type":51,"value":3495},"      ?",{"type":46,"tag":73,"props":3497,"children":3498},{"style":115},[3499],{"type":51,"value":439},{"type":46,"tag":73,"props":3501,"children":3502},{"class":75,"line":511},[3503,3508,3512,3516,3520,3524],{"type":46,"tag":73,"props":3504,"children":3505},{"style":307},[3506],{"type":51,"value":3507},"          type",{"type":46,"tag":73,"props":3509,"children":3510},{"style":115},[3511],{"type":51,"value":315},{"type":46,"tag":73,"props":3513,"children":3514},{"style":115},[3515],{"type":51,"value":139},{"type":46,"tag":73,"props":3517,"children":3518},{"style":86},[3519],{"type":51,"value":461},{"type":46,"tag":73,"props":3521,"children":3522},{"style":115},[3523],{"type":51,"value":329},{"type":46,"tag":73,"props":3525,"children":3526},{"style":115},[3527],{"type":51,"value":334},{"type":46,"tag":73,"props":3529,"children":3530},{"class":75,"line":1125},[3531,3536,3540,3544,3548,3552],{"type":46,"tag":73,"props":3532,"children":3533},{"style":307},[3534],{"type":51,"value":3535},"          src",{"type":46,"tag":73,"props":3537,"children":3538},{"style":115},[3539],{"type":51,"value":315},{"type":46,"tag":73,"props":3541,"children":3542},{"style":115},[3543],{"type":51,"value":139},{"type":46,"tag":73,"props":3545,"children":3546},{"style":86},[3547],{"type":51,"value":491},{"type":46,"tag":73,"props":3549,"children":3550},{"style":115},[3551],{"type":51,"value":329},{"type":46,"tag":73,"props":3553,"children":3554},{"style":115},[3555],{"type":51,"value":334},{"type":46,"tag":73,"props":3557,"children":3558},{"class":75,"line":1155},[3559],{"type":46,"tag":73,"props":3560,"children":3561},{"style":115},[3562],{"type":51,"value":3563},"        }\n",{"type":46,"tag":73,"props":3565,"children":3566},{"class":75,"line":1163},[3567,3572],{"type":46,"tag":73,"props":3568,"children":3569},{"style":115},[3570],{"type":51,"value":3571},"      :",{"type":46,"tag":73,"props":3573,"children":3574},{"style":115},[3575],{"type":51,"value":439},{"type":46,"tag":73,"props":3577,"children":3579},{"class":75,"line":3578},19,[3580,3584,3588,3592,3597,3601],{"type":46,"tag":73,"props":3581,"children":3582},{"style":307},[3583],{"type":51,"value":3507},{"type":46,"tag":73,"props":3585,"children":3586},{"style":115},[3587],{"type":51,"value":315},{"type":46,"tag":73,"props":3589,"children":3590},{"style":115},[3591],{"type":51,"value":139},{"type":46,"tag":73,"props":3593,"children":3594},{"style":86},[3595],{"type":51,"value":3596},"launch",{"type":46,"tag":73,"props":3598,"children":3599},{"style":115},[3600],{"type":51,"value":329},{"type":46,"tag":73,"props":3602,"children":3603},{"style":115},[3604],{"type":51,"value":334},{"type":46,"tag":73,"props":3606,"children":3608},{"class":75,"line":3607},20,[3609,3614,3618,3622,3627,3631],{"type":46,"tag":73,"props":3610,"children":3611},{"style":307},[3612],{"type":51,"value":3613},"          description",{"type":46,"tag":73,"props":3615,"children":3616},{"style":115},[3617],{"type":51,"value":315},{"type":46,"tag":73,"props":3619,"children":3620},{"style":115},[3621],{"type":51,"value":139},{"type":46,"tag":73,"props":3623,"children":3624},{"style":86},[3625],{"type":51,"value":3626},"Launch My Module",{"type":46,"tag":73,"props":3628,"children":3629},{"style":115},[3630],{"type":51,"value":329},{"type":46,"tag":73,"props":3632,"children":3633},{"style":115},[3634],{"type":51,"value":334},{"type":46,"tag":73,"props":3636,"children":3638},{"class":75,"line":3637},21,[3639,3644,3648,3652],{"type":46,"tag":73,"props":3640,"children":3641},{"style":307},[3642],{"type":51,"value":3643},"          actions",{"type":46,"tag":73,"props":3645,"children":3646},{"style":115},[3647],{"type":51,"value":315},{"type":46,"tag":73,"props":3649,"children":3650},{"style":307},[3651],{"type":51,"value":721},{"type":46,"tag":73,"props":3653,"children":3654},{"style":115},[3655],{"type":51,"value":290},{"type":46,"tag":73,"props":3657,"children":3659},{"class":75,"line":3658},22,[3660,3665,3669,3673,3678,3682],{"type":46,"tag":73,"props":3661,"children":3662},{"style":307},[3663],{"type":51,"value":3664},"            label",{"type":46,"tag":73,"props":3666,"children":3667},{"style":115},[3668],{"type":51,"value":315},{"type":46,"tag":73,"props":3670,"children":3671},{"style":115},[3672],{"type":51,"value":139},{"type":46,"tag":73,"props":3674,"children":3675},{"style":86},[3676],{"type":51,"value":3677},"Start",{"type":46,"tag":73,"props":3679,"children":3680},{"style":115},[3681],{"type":51,"value":329},{"type":46,"tag":73,"props":3683,"children":3684},{"style":115},[3685],{"type":51,"value":334},{"type":46,"tag":73,"props":3687,"children":3689},{"class":75,"line":3688},23,[3690,3695,3700,3704],{"type":46,"tag":73,"props":3691,"children":3692},{"style":277},[3693],{"type":51,"value":3694},"            async",{"type":46,"tag":73,"props":3696,"children":3697},{"style":307},[3698],{"type":51,"value":3699}," handle",{"type":46,"tag":73,"props":3701,"children":3702},{"style":115},[3703],{"type":51,"value":274},{"type":46,"tag":73,"props":3705,"children":3706},{"style":115},[3707],{"type":51,"value":439},{"type":46,"tag":73,"props":3709,"children":3711},{"class":75,"line":3710},24,[3712,3717,3721,3726,3731],{"type":46,"tag":73,"props":3713,"children":3714},{"style":109},[3715],{"type":51,"value":3716},"              if",{"type":46,"tag":73,"props":3718,"children":3719},{"style":307},[3720],{"type":51,"value":285},{"type":46,"tag":73,"props":3722,"children":3723},{"style":115},[3724],{"type":51,"value":3725},"!",{"type":46,"tag":73,"props":3727,"children":3728},{"style":121},[3729],{"type":51,"value":3730},"promise",{"type":46,"tag":73,"props":3732,"children":3733},{"style":307},[3734],{"type":51,"value":1169},{"type":46,"tag":73,"props":3736,"children":3738},{"class":75,"line":3737},25,[3739,3744,3748,3752],{"type":46,"tag":73,"props":3740,"children":3741},{"style":121},[3742],{"type":51,"value":3743},"                promise",{"type":46,"tag":73,"props":3745,"children":3746},{"style":115},[3747],{"type":51,"value":622},{"type":46,"tag":73,"props":3749,"children":3750},{"style":261},[3751],{"type":51,"value":3292},{"type":46,"tag":73,"props":3753,"children":3754},{"style":307},[3755],{"type":51,"value":1198},{"type":46,"tag":73,"props":3757,"children":3759},{"class":75,"line":3758},26,[3760,3765],{"type":46,"tag":73,"props":3761,"children":3762},{"style":109},[3763],{"type":51,"value":3764},"              await",{"type":46,"tag":73,"props":3766,"children":3767},{"style":121},[3768],{"type":51,"value":3769}," promise\n",{"type":46,"tag":73,"props":3771,"children":3773},{"class":75,"line":3772},27,[3774],{"type":46,"tag":73,"props":3775,"children":3776},{"style":115},[3777],{"type":51,"value":3778},"            },\n",{"type":46,"tag":73,"props":3780,"children":3782},{"class":75,"line":3781},28,[3783,3788],{"type":46,"tag":73,"props":3784,"children":3785},{"style":115},[3786],{"type":51,"value":3787},"          }",{"type":46,"tag":73,"props":3789,"children":3790},{"style":307},[3791],{"type":51,"value":3792},"]\n",{"type":46,"tag":73,"props":3794,"children":3796},{"class":75,"line":3795},29,[3797],{"type":46,"tag":73,"props":3798,"children":3799},{"style":115},[3800],{"type":51,"value":3801},"        },\n",{"type":46,"tag":73,"props":3803,"children":3805},{"class":75,"line":3804},30,[3806,3810],{"type":46,"tag":73,"props":3807,"children":3808},{"style":115},[3809],{"type":51,"value":2933},{"type":46,"tag":73,"props":3811,"children":3812},{"style":307},[3813],{"type":51,"value":1169},{"type":46,"tag":73,"props":3815,"children":3817},{"class":75,"line":3816},31,[3818,3822],{"type":46,"tag":73,"props":3819,"children":3820},{"style":115},[3821],{"type":51,"value":517},{"type":46,"tag":73,"props":3823,"children":3824},{"style":121},[3825],{"type":51,"value":1169},{"type":46,"tag":47,"props":3827,"children":3828},{},[3829,3831,3837],{"type":51,"value":3830},"It will first display a launch page with a button to start the service. When user click the button, the ",{"type":46,"tag":54,"props":3832,"children":3834},{"className":3833},[],[3835],{"type":51,"value":3836},"handle()",{"type":51,"value":3838}," will be called, and the view will be updated to iframe.",{"type":46,"tag":47,"props":3840,"children":3841},{},[3842,3844,3850,3852,3857],{"type":51,"value":3843},"When you need to refresh the custom tabs, you can call ",{"type":46,"tag":54,"props":3845,"children":3847},{"className":3846},[],[3848],{"type":51,"value":3849},"nuxt.callHook('devtools:customTabs:refresh')",{"type":51,"value":3851}," and the hooks on ",{"type":46,"tag":54,"props":3853,"children":3855},{"className":3854},[],[3856],{"type":51,"value":201},{"type":51,"value":3858}," will be revaluated again.",{"type":46,"tag":171,"props":3860,"children":3862},{"id":3861},"api-for-custom-view",[3863],{"type":51,"value":3864},"API for Custom View",{"type":46,"tag":47,"props":3866,"children":3867},{},[3868,3870,3876],{"type":51,"value":3869},"Please refer to ",{"type":46,"tag":1394,"props":3871,"children":3873},{"href":3872},"/module/utils-kit#nuxtdevtools-kitiframe-client",[3874],{"type":51,"value":3875},"Iframe Client",{"type":51,"value":61},{"type":46,"tag":171,"props":3878,"children":3880},{"id":3879},"custom-rpc-functions",[3881],{"type":51,"value":3882},"Custom RPC Functions",{"type":46,"tag":47,"props":3884,"children":3885},{},[3886],{"type":51,"value":3887},"Nuxt DevTools uses Remote Procedure Call (RPC) to communicate between the server and client. For modules you can also leverage that to communicate your server code.",{"type":46,"tag":47,"props":3889,"children":3890},{},[3891],{"type":51,"value":3892},"To do that, we recommend to define your types in a shared TypeScript file first:",{"type":46,"tag":63,"props":3894,"children":3896},{"className":97,"code":3895,"language":99,"meta":40,"style":40},"// rpc-types.ts\n\nexport interface ServerFunctions {\n  getMyModuleOptions: () => MyModuleOptions\n}\n\nexport interface ClientFunctions {\n  showNotification: (message: string) => void\n}\n",[3897],{"type":46,"tag":54,"props":3898,"children":3899},{"__ignoreMap":40},[3900,3908,3915,3936,3962,3969,3976,3996,4039],{"type":46,"tag":73,"props":3901,"children":3902},{"class":75,"line":76},[3903],{"type":46,"tag":73,"props":3904,"children":3905},{"style":297},[3906],{"type":51,"value":3907},"// rpc-types.ts\n",{"type":46,"tag":73,"props":3909,"children":3910},{"class":75,"line":247},[3911],{"type":46,"tag":73,"props":3912,"children":3913},{"emptyLinePlaceholder":251},[3914],{"type":51,"value":254},{"type":46,"tag":73,"props":3916,"children":3917},{"class":75,"line":257},[3918,3922,3927,3932],{"type":46,"tag":73,"props":3919,"children":3920},{"style":109},[3921],{"type":51,"value":1478},{"type":46,"tag":73,"props":3923,"children":3924},{"style":277},[3925],{"type":51,"value":3926}," interface",{"type":46,"tag":73,"props":3928,"children":3929},{"style":80},[3930],{"type":51,"value":3931}," ServerFunctions",{"type":46,"tag":73,"props":3933,"children":3934},{"style":115},[3935],{"type":51,"value":439},{"type":46,"tag":73,"props":3937,"children":3938},{"class":75,"line":293},[3939,3944,3948,3953,3957],{"type":46,"tag":73,"props":3940,"children":3941},{"style":307},[3942],{"type":51,"value":3943},"  getMyModuleOptions",{"type":46,"tag":73,"props":3945,"children":3946},{"style":115},[3947],{"type":51,"value":315},{"type":46,"tag":73,"props":3949,"children":3950},{"style":115},[3951],{"type":51,"value":3952}," ()",{"type":46,"tag":73,"props":3954,"children":3955},{"style":277},[3956],{"type":51,"value":280},{"type":46,"tag":73,"props":3958,"children":3959},{"style":80},[3960],{"type":51,"value":3961}," MyModuleOptions\n",{"type":46,"tag":73,"props":3963,"children":3964},{"class":75,"line":303},[3965],{"type":46,"tag":73,"props":3966,"children":3967},{"style":115},[3968],{"type":51,"value":769},{"type":46,"tag":73,"props":3970,"children":3971},{"class":75,"line":337},[3972],{"type":46,"tag":73,"props":3973,"children":3974},{"emptyLinePlaceholder":251},[3975],{"type":51,"value":254},{"type":46,"tag":73,"props":3977,"children":3978},{"class":75,"line":346},[3979,3983,3987,3992],{"type":46,"tag":73,"props":3980,"children":3981},{"style":109},[3982],{"type":51,"value":1478},{"type":46,"tag":73,"props":3984,"children":3985},{"style":277},[3986],{"type":51,"value":3926},{"type":46,"tag":73,"props":3988,"children":3989},{"style":80},[3990],{"type":51,"value":3991}," ClientFunctions",{"type":46,"tag":73,"props":3993,"children":3994},{"style":115},[3995],{"type":51,"value":439},{"type":46,"tag":73,"props":3997,"children":3998},{"class":75,"line":376},[3999,4004,4008,4012,4017,4021,4026,4030,4034],{"type":46,"tag":73,"props":4000,"children":4001},{"style":307},[4002],{"type":51,"value":4003},"  showNotification",{"type":46,"tag":73,"props":4005,"children":4006},{"style":115},[4007],{"type":51,"value":315},{"type":46,"tag":73,"props":4009,"children":4010},{"style":115},[4011],{"type":51,"value":285},{"type":46,"tag":73,"props":4013,"children":4014},{"style":1805},[4015],{"type":51,"value":4016},"message",{"type":46,"tag":73,"props":4018,"children":4019},{"style":115},[4020],{"type":51,"value":315},{"type":46,"tag":73,"props":4022,"children":4023},{"style":80},[4024],{"type":51,"value":4025}," string",{"type":46,"tag":73,"props":4027,"children":4028},{"style":115},[4029],{"type":51,"value":562},{"type":46,"tag":73,"props":4031,"children":4032},{"style":277},[4033],{"type":51,"value":280},{"type":46,"tag":73,"props":4035,"children":4036},{"style":80},[4037],{"type":51,"value":4038}," void\n",{"type":46,"tag":73,"props":4040,"children":4041},{"class":75,"line":385},[4042],{"type":46,"tag":73,"props":4043,"children":4044},{"style":115},[4045],{"type":51,"value":769},{"type":46,"tag":47,"props":4047,"children":4048},{},[4049],{"type":51,"value":4050},"And then in your module code:",{"type":46,"tag":63,"props":4052,"children":4054},{"className":97,"code":4053,"language":99,"meta":40,"style":40},"import type { ClientFunctions, ServerFunctions } from './rpc-types'\nimport { extendServerRpc, onDevToolsInitialized } from '@nuxt/devtools-kit'\nimport { defineNuxtModule } from '@nuxt/kit'\n\nconst RPC_NAMESPACE = 'my-module-rpc'\n\nexport default defineNuxtModule({\n  setup(options, nuxt) {\n    // wait for DevTools to be initialized\n    onDevToolsInitialized(async () => {\n      const rpc = extendServerRpc\u003CClientFunctions, ServerFunctions>(RPC_NAMESPACE, {\n        // register server RPC functions\n        getMyModuleOptions() {\n          return options\n        },\n      })\n\n      // call client RPC functions\n      // since it might have multiple clients connected, we use `broadcast` to call all of them\n      await rpc.broadcast.showNotification('Hello from My Module!')\n    })\n  }\n})\n",[4055],{"type":46,"tag":54,"props":4056,"children":4057},{"__ignoreMap":40},[4058,4107,4151,4187,4194,4223,4230,4253,4286,4294,4322,4381,4389,4405,4418,4425,4437,4444,4452,4460,4511,4523,4530],{"type":46,"tag":73,"props":4059,"children":4060},{"class":75,"line":76},[4061,4065,4070,4074,4078,4082,4086,4090,4094,4098,4103],{"type":46,"tag":73,"props":4062,"children":4063},{"style":109},[4064],{"type":51,"value":112},{"type":46,"tag":73,"props":4066,"children":4067},{"style":109},[4068],{"type":51,"value":4069}," type",{"type":46,"tag":73,"props":4071,"children":4072},{"style":115},[4073],{"type":51,"value":118},{"type":46,"tag":73,"props":4075,"children":4076},{"style":121},[4077],{"type":51,"value":3991},{"type":46,"tag":73,"props":4079,"children":4080},{"style":115},[4081],{"type":51,"value":739},{"type":46,"tag":73,"props":4083,"children":4084},{"style":121},[4085],{"type":51,"value":3931},{"type":46,"tag":73,"props":4087,"children":4088},{"style":115},[4089],{"type":51,"value":129},{"type":46,"tag":73,"props":4091,"children":4092},{"style":109},[4093],{"type":51,"value":134},{"type":46,"tag":73,"props":4095,"children":4096},{"style":115},[4097],{"type":51,"value":139},{"type":46,"tag":73,"props":4099,"children":4100},{"style":86},[4101],{"type":51,"value":4102},"./rpc-types",{"type":46,"tag":73,"props":4104,"children":4105},{"style":115},[4106],{"type":51,"value":149},{"type":46,"tag":73,"props":4108,"children":4109},{"class":75,"line":247},[4110,4114,4118,4122,4126,4131,4135,4139,4143,4147],{"type":46,"tag":73,"props":4111,"children":4112},{"style":109},[4113],{"type":51,"value":112},{"type":46,"tag":73,"props":4115,"children":4116},{"style":115},[4117],{"type":51,"value":118},{"type":46,"tag":73,"props":4119,"children":4120},{"style":121},[4121],{"type":51,"value":1256},{"type":46,"tag":73,"props":4123,"children":4124},{"style":115},[4125],{"type":51,"value":739},{"type":46,"tag":73,"props":4127,"children":4128},{"style":121},[4129],{"type":51,"value":4130}," onDevToolsInitialized",{"type":46,"tag":73,"props":4132,"children":4133},{"style":115},[4134],{"type":51,"value":129},{"type":46,"tag":73,"props":4136,"children":4137},{"style":109},[4138],{"type":51,"value":134},{"type":46,"tag":73,"props":4140,"children":4141},{"style":115},[4142],{"type":51,"value":139},{"type":46,"tag":73,"props":4144,"children":4145},{"style":86},[4146],{"type":51,"value":144},{"type":46,"tag":73,"props":4148,"children":4149},{"style":115},[4150],{"type":51,"value":149},{"type":46,"tag":73,"props":4152,"children":4153},{"class":75,"line":257},[4154,4158,4162,4167,4171,4175,4179,4183],{"type":46,"tag":73,"props":4155,"children":4156},{"style":109},[4157],{"type":51,"value":112},{"type":46,"tag":73,"props":4159,"children":4160},{"style":115},[4161],{"type":51,"value":118},{"type":46,"tag":73,"props":4163,"children":4164},{"style":121},[4165],{"type":51,"value":4166}," defineNuxtModule",{"type":46,"tag":73,"props":4168,"children":4169},{"style":115},[4170],{"type":51,"value":129},{"type":46,"tag":73,"props":4172,"children":4173},{"style":109},[4174],{"type":51,"value":134},{"type":46,"tag":73,"props":4176,"children":4177},{"style":115},[4178],{"type":51,"value":139},{"type":46,"tag":73,"props":4180,"children":4181},{"style":86},[4182],{"type":51,"value":59},{"type":46,"tag":73,"props":4184,"children":4185},{"style":115},[4186],{"type":51,"value":149},{"type":46,"tag":73,"props":4188,"children":4189},{"class":75,"line":293},[4190],{"type":46,"tag":73,"props":4191,"children":4192},{"emptyLinePlaceholder":251},[4193],{"type":51,"value":254},{"type":46,"tag":73,"props":4195,"children":4196},{"class":75,"line":303},[4197,4201,4206,4210,4214,4219],{"type":46,"tag":73,"props":4198,"children":4199},{"style":277},[4200],{"type":51,"value":603},{"type":46,"tag":73,"props":4202,"children":4203},{"style":121},[4204],{"type":51,"value":4205}," RPC_NAMESPACE ",{"type":46,"tag":73,"props":4207,"children":4208},{"style":115},[4209],{"type":51,"value":882},{"type":46,"tag":73,"props":4211,"children":4212},{"style":115},[4213],{"type":51,"value":139},{"type":46,"tag":73,"props":4215,"children":4216},{"style":86},[4217],{"type":51,"value":4218},"my-module-rpc",{"type":46,"tag":73,"props":4220,"children":4221},{"style":115},[4222],{"type":51,"value":149},{"type":46,"tag":73,"props":4224,"children":4225},{"class":75,"line":337},[4226],{"type":46,"tag":73,"props":4227,"children":4228},{"emptyLinePlaceholder":251},[4229],{"type":51,"value":254},{"type":46,"tag":73,"props":4231,"children":4232},{"class":75,"line":346},[4233,4237,4241,4245,4249],{"type":46,"tag":73,"props":4234,"children":4235},{"style":109},[4236],{"type":51,"value":1478},{"type":46,"tag":73,"props":4238,"children":4239},{"style":109},[4240],{"type":51,"value":2018},{"type":46,"tag":73,"props":4242,"children":4243},{"style":261},[4244],{"type":51,"value":4166},{"type":46,"tag":73,"props":4246,"children":4247},{"style":121},[4248],{"type":51,"value":269},{"type":46,"tag":73,"props":4250,"children":4251},{"style":115},[4252],{"type":51,"value":290},{"type":46,"tag":73,"props":4254,"children":4255},{"class":75,"line":376},[4256,4260,4264,4269,4273,4278,4282],{"type":46,"tag":73,"props":4257,"children":4258},{"style":307},[4259],{"type":51,"value":2067},{"type":46,"tag":73,"props":4261,"children":4262},{"style":115},[4263],{"type":51,"value":269},{"type":46,"tag":73,"props":4265,"children":4266},{"style":1805},[4267],{"type":51,"value":4268},"options",{"type":46,"tag":73,"props":4270,"children":4271},{"style":115},[4272],{"type":51,"value":739},{"type":46,"tag":73,"props":4274,"children":4275},{"style":1805},[4276],{"type":51,"value":4277}," nuxt",{"type":46,"tag":73,"props":4279,"children":4280},{"style":115},[4281],{"type":51,"value":562},{"type":46,"tag":73,"props":4283,"children":4284},{"style":115},[4285],{"type":51,"value":439},{"type":46,"tag":73,"props":4287,"children":4288},{"class":75,"line":385},[4289],{"type":46,"tag":73,"props":4290,"children":4291},{"style":297},[4292],{"type":51,"value":4293},"    // wait for DevTools to be initialized\n",{"type":46,"tag":73,"props":4295,"children":4296},{"class":75,"line":415},[4297,4302,4306,4310,4314,4318],{"type":46,"tag":73,"props":4298,"children":4299},{"style":261},[4300],{"type":51,"value":4301},"    onDevToolsInitialized",{"type":46,"tag":73,"props":4303,"children":4304},{"style":307},[4305],{"type":51,"value":269},{"type":46,"tag":73,"props":4307,"children":4308},{"style":277},[4309],{"type":51,"value":1798},{"type":46,"tag":73,"props":4311,"children":4312},{"style":115},[4313],{"type":51,"value":3952},{"type":46,"tag":73,"props":4315,"children":4316},{"style":277},[4317],{"type":51,"value":280},{"type":46,"tag":73,"props":4319,"children":4320},{"style":115},[4321],{"type":51,"value":439},{"type":46,"tag":73,"props":4323,"children":4324},{"class":75,"line":424},[4325,4330,4335,4339,4343,4347,4352,4356,4360,4364,4368,4373,4377],{"type":46,"tag":73,"props":4326,"children":4327},{"style":277},[4328],{"type":51,"value":4329},"      const",{"type":46,"tag":73,"props":4331,"children":4332},{"style":121},[4333],{"type":51,"value":4334}," rpc",{"type":46,"tag":73,"props":4336,"children":4337},{"style":115},[4338],{"type":51,"value":622},{"type":46,"tag":73,"props":4340,"children":4341},{"style":261},[4342],{"type":51,"value":1256},{"type":46,"tag":73,"props":4344,"children":4345},{"style":115},[4346],{"type":51,"value":3239},{"type":46,"tag":73,"props":4348,"children":4349},{"style":80},[4350],{"type":51,"value":4351},"ClientFunctions",{"type":46,"tag":73,"props":4353,"children":4354},{"style":115},[4355],{"type":51,"value":739},{"type":46,"tag":73,"props":4357,"children":4358},{"style":80},[4359],{"type":51,"value":3931},{"type":46,"tag":73,"props":4361,"children":4362},{"style":115},[4363],{"type":51,"value":3249},{"type":46,"tag":73,"props":4365,"children":4366},{"style":307},[4367],{"type":51,"value":269},{"type":46,"tag":73,"props":4369,"children":4370},{"style":121},[4371],{"type":51,"value":4372},"RPC_NAMESPACE",{"type":46,"tag":73,"props":4374,"children":4375},{"style":115},[4376],{"type":51,"value":739},{"type":46,"tag":73,"props":4378,"children":4379},{"style":115},[4380],{"type":51,"value":439},{"type":46,"tag":73,"props":4382,"children":4383},{"class":75,"line":442},[4384],{"type":46,"tag":73,"props":4385,"children":4386},{"style":297},[4387],{"type":51,"value":4388},"        // register server RPC functions\n",{"type":46,"tag":73,"props":4390,"children":4391},{"class":75,"line":472},[4392,4397,4401],{"type":46,"tag":73,"props":4393,"children":4394},{"style":307},[4395],{"type":51,"value":4396},"        getMyModuleOptions",{"type":46,"tag":73,"props":4398,"children":4399},{"style":115},[4400],{"type":51,"value":274},{"type":46,"tag":73,"props":4402,"children":4403},{"style":115},[4404],{"type":51,"value":439},{"type":46,"tag":73,"props":4406,"children":4407},{"class":75,"line":502},[4408,4413],{"type":46,"tag":73,"props":4409,"children":4410},{"style":109},[4411],{"type":51,"value":4412},"          return",{"type":46,"tag":73,"props":4414,"children":4415},{"style":121},[4416],{"type":51,"value":4417}," options\n",{"type":46,"tag":73,"props":4419,"children":4420},{"class":75,"line":511},[4421],{"type":46,"tag":73,"props":4422,"children":4423},{"style":115},[4424],{"type":51,"value":3801},{"type":46,"tag":73,"props":4426,"children":4427},{"class":75,"line":1125},[4428,4433],{"type":46,"tag":73,"props":4429,"children":4430},{"style":115},[4431],{"type":51,"value":4432},"      }",{"type":46,"tag":73,"props":4434,"children":4435},{"style":307},[4436],{"type":51,"value":1169},{"type":46,"tag":73,"props":4438,"children":4439},{"class":75,"line":1155},[4440],{"type":46,"tag":73,"props":4441,"children":4442},{"emptyLinePlaceholder":251},[4443],{"type":51,"value":254},{"type":46,"tag":73,"props":4445,"children":4446},{"class":75,"line":1163},[4447],{"type":46,"tag":73,"props":4448,"children":4449},{"style":297},[4450],{"type":51,"value":4451},"      // call client RPC functions\n",{"type":46,"tag":73,"props":4453,"children":4454},{"class":75,"line":3578},[4455],{"type":46,"tag":73,"props":4456,"children":4457},{"style":297},[4458],{"type":51,"value":4459},"      // since it might have multiple clients connected, we use `broadcast` to call all of them\n",{"type":46,"tag":73,"props":4461,"children":4462},{"class":75,"line":3607},[4463,4468,4472,4476,4481,4485,4490,4494,4498,4503,4507],{"type":46,"tag":73,"props":4464,"children":4465},{"style":109},[4466],{"type":51,"value":4467},"      await",{"type":46,"tag":73,"props":4469,"children":4470},{"style":121},[4471],{"type":51,"value":4334},{"type":46,"tag":73,"props":4473,"children":4474},{"style":115},[4475],{"type":51,"value":61},{"type":46,"tag":73,"props":4477,"children":4478},{"style":121},[4479],{"type":51,"value":4480},"broadcast",{"type":46,"tag":73,"props":4482,"children":4483},{"style":115},[4484],{"type":51,"value":61},{"type":46,"tag":73,"props":4486,"children":4487},{"style":261},[4488],{"type":51,"value":4489},"showNotification",{"type":46,"tag":73,"props":4491,"children":4492},{"style":307},[4493],{"type":51,"value":269},{"type":46,"tag":73,"props":4495,"children":4496},{"style":115},[4497],{"type":51,"value":329},{"type":46,"tag":73,"props":4499,"children":4500},{"style":86},[4501],{"type":51,"value":4502},"Hello from My Module!",{"type":46,"tag":73,"props":4504,"children":4505},{"style":115},[4506],{"type":51,"value":329},{"type":46,"tag":73,"props":4508,"children":4509},{"style":307},[4510],{"type":51,"value":1169},{"type":46,"tag":73,"props":4512,"children":4513},{"class":75,"line":3637},[4514,4519],{"type":46,"tag":73,"props":4515,"children":4516},{"style":115},[4517],{"type":51,"value":4518},"    }",{"type":46,"tag":73,"props":4520,"children":4521},{"style":307},[4522],{"type":51,"value":1169},{"type":46,"tag":73,"props":4524,"children":4525},{"class":75,"line":3658},[4526],{"type":46,"tag":73,"props":4527,"children":4528},{"style":115},[4529],{"type":51,"value":2132},{"type":46,"tag":73,"props":4531,"children":4532},{"class":75,"line":3688},[4533,4537],{"type":46,"tag":73,"props":4534,"children":4535},{"style":115},[4536],{"type":51,"value":517},{"type":46,"tag":73,"props":4538,"children":4539},{"style":121},[4540],{"type":51,"value":1169},{"type":46,"tag":47,"props":4542,"children":4543},{},[4544],{"type":51,"value":4545},"And on the embedded iframe client side, you can do:",{"type":46,"tag":63,"props":4547,"children":4549},{"className":97,"code":4548,"language":99,"meta":40,"style":40},"import type { ClientFunctions, ServerFunctions } from './rpc-types'\nimport { onDevtoolsClientConnected } from '@nuxt/devtools-kit/iframe-client'\n\nconst RPC_NAMESPACE = 'my-module-rpc'\n\nonDevtoolsClientConnected(async (client) => {\n  const rpc = client.devtools.extendClientRpc(RPC_NAMESPACE, {\n    showNotification(message) {\n      console.log(message)\n    },\n  })\n\n  // call server RPC functions\n  const options = await rpc.getMyModuleOptions()\n})\n",[4550],{"type":46,"tag":54,"props":4551,"children":4552},{"__ignoreMap":40},[4553,4600,4635,4642,4669,4676,4711,4763,4787,4816,4823,4834,4841,4849,4887],{"type":46,"tag":73,"props":4554,"children":4555},{"class":75,"line":76},[4556,4560,4564,4568,4572,4576,4580,4584,4588,4592,4596],{"type":46,"tag":73,"props":4557,"children":4558},{"style":109},[4559],{"type":51,"value":112},{"type":46,"tag":73,"props":4561,"children":4562},{"style":109},[4563],{"type":51,"value":4069},{"type":46,"tag":73,"props":4565,"children":4566},{"style":115},[4567],{"type":51,"value":118},{"type":46,"tag":73,"props":4569,"children":4570},{"style":121},[4571],{"type":51,"value":3991},{"type":46,"tag":73,"props":4573,"children":4574},{"style":115},[4575],{"type":51,"value":739},{"type":46,"tag":73,"props":4577,"children":4578},{"style":121},[4579],{"type":51,"value":3931},{"type":46,"tag":73,"props":4581,"children":4582},{"style":115},[4583],{"type":51,"value":129},{"type":46,"tag":73,"props":4585,"children":4586},{"style":109},[4587],{"type":51,"value":134},{"type":46,"tag":73,"props":4589,"children":4590},{"style":115},[4591],{"type":51,"value":139},{"type":46,"tag":73,"props":4593,"children":4594},{"style":86},[4595],{"type":51,"value":4102},{"type":46,"tag":73,"props":4597,"children":4598},{"style":115},[4599],{"type":51,"value":149},{"type":46,"tag":73,"props":4601,"children":4602},{"class":75,"line":247},[4603,4607,4611,4615,4619,4623,4627,4631],{"type":46,"tag":73,"props":4604,"children":4605},{"style":109},[4606],{"type":51,"value":112},{"type":46,"tag":73,"props":4608,"children":4609},{"style":115},[4610],{"type":51,"value":118},{"type":46,"tag":73,"props":4612,"children":4613},{"style":121},[4614],{"type":51,"value":1754},{"type":46,"tag":73,"props":4616,"children":4617},{"style":115},[4618],{"type":51,"value":129},{"type":46,"tag":73,"props":4620,"children":4621},{"style":109},[4622],{"type":51,"value":134},{"type":46,"tag":73,"props":4624,"children":4625},{"style":115},[4626],{"type":51,"value":139},{"type":46,"tag":73,"props":4628,"children":4629},{"style":86},[4630],{"type":51,"value":1410},{"type":46,"tag":73,"props":4632,"children":4633},{"style":115},[4634],{"type":51,"value":149},{"type":46,"tag":73,"props":4636,"children":4637},{"class":75,"line":257},[4638],{"type":46,"tag":73,"props":4639,"children":4640},{"emptyLinePlaceholder":251},[4641],{"type":51,"value":254},{"type":46,"tag":73,"props":4643,"children":4644},{"class":75,"line":293},[4645,4649,4653,4657,4661,4665],{"type":46,"tag":73,"props":4646,"children":4647},{"style":277},[4648],{"type":51,"value":603},{"type":46,"tag":73,"props":4650,"children":4651},{"style":121},[4652],{"type":51,"value":4205},{"type":46,"tag":73,"props":4654,"children":4655},{"style":115},[4656],{"type":51,"value":882},{"type":46,"tag":73,"props":4658,"children":4659},{"style":115},[4660],{"type":51,"value":139},{"type":46,"tag":73,"props":4662,"children":4663},{"style":86},[4664],{"type":51,"value":4218},{"type":46,"tag":73,"props":4666,"children":4667},{"style":115},[4668],{"type":51,"value":149},{"type":46,"tag":73,"props":4670,"children":4671},{"class":75,"line":303},[4672],{"type":46,"tag":73,"props":4673,"children":4674},{"emptyLinePlaceholder":251},[4675],{"type":51,"value":254},{"type":46,"tag":73,"props":4677,"children":4678},{"class":75,"line":337},[4679,4683,4687,4691,4695,4699,4703,4707],{"type":46,"tag":73,"props":4680,"children":4681},{"style":261},[4682],{"type":51,"value":1789},{"type":46,"tag":73,"props":4684,"children":4685},{"style":121},[4686],{"type":51,"value":269},{"type":46,"tag":73,"props":4688,"children":4689},{"style":277},[4690],{"type":51,"value":1798},{"type":46,"tag":73,"props":4692,"children":4693},{"style":115},[4694],{"type":51,"value":285},{"type":46,"tag":73,"props":4696,"children":4697},{"style":1805},[4698],{"type":51,"value":1808},{"type":46,"tag":73,"props":4700,"children":4701},{"style":115},[4702],{"type":51,"value":562},{"type":46,"tag":73,"props":4704,"children":4705},{"style":277},[4706],{"type":51,"value":280},{"type":46,"tag":73,"props":4708,"children":4709},{"style":115},[4710],{"type":51,"value":439},{"type":46,"tag":73,"props":4712,"children":4713},{"class":75,"line":346},[4714,4718,4722,4726,4730,4734,4738,4742,4747,4751,4755,4759],{"type":46,"tag":73,"props":4715,"children":4716},{"style":277},[4717],{"type":51,"value":1843},{"type":46,"tag":73,"props":4719,"children":4720},{"style":121},[4721],{"type":51,"value":4334},{"type":46,"tag":73,"props":4723,"children":4724},{"style":115},[4725],{"type":51,"value":622},{"type":46,"tag":73,"props":4727,"children":4728},{"style":121},[4729],{"type":51,"value":1857},{"type":46,"tag":73,"props":4731,"children":4732},{"style":115},[4733],{"type":51,"value":61},{"type":46,"tag":73,"props":4735,"children":4736},{"style":121},[4737],{"type":51,"value":1584},{"type":46,"tag":73,"props":4739,"children":4740},{"style":115},[4741],{"type":51,"value":61},{"type":46,"tag":73,"props":4743,"children":4744},{"style":261},[4745],{"type":51,"value":4746},"extendClientRpc",{"type":46,"tag":73,"props":4748,"children":4749},{"style":307},[4750],{"type":51,"value":269},{"type":46,"tag":73,"props":4752,"children":4753},{"style":121},[4754],{"type":51,"value":4372},{"type":46,"tag":73,"props":4756,"children":4757},{"style":115},[4758],{"type":51,"value":739},{"type":46,"tag":73,"props":4760,"children":4761},{"style":115},[4762],{"type":51,"value":439},{"type":46,"tag":73,"props":4764,"children":4765},{"class":75,"line":376},[4766,4771,4775,4779,4783],{"type":46,"tag":73,"props":4767,"children":4768},{"style":307},[4769],{"type":51,"value":4770},"    showNotification",{"type":46,"tag":73,"props":4772,"children":4773},{"style":115},[4774],{"type":51,"value":269},{"type":46,"tag":73,"props":4776,"children":4777},{"style":1805},[4778],{"type":51,"value":4016},{"type":46,"tag":73,"props":4780,"children":4781},{"style":115},[4782],{"type":51,"value":562},{"type":46,"tag":73,"props":4784,"children":4785},{"style":115},[4786],{"type":51,"value":439},{"type":46,"tag":73,"props":4788,"children":4789},{"class":75,"line":385},[4790,4795,4799,4804,4808,4812],{"type":46,"tag":73,"props":4791,"children":4792},{"style":121},[4793],{"type":51,"value":4794},"      console",{"type":46,"tag":73,"props":4796,"children":4797},{"style":115},[4798],{"type":51,"value":61},{"type":46,"tag":73,"props":4800,"children":4801},{"style":261},[4802],{"type":51,"value":4803},"log",{"type":46,"tag":73,"props":4805,"children":4806},{"style":307},[4807],{"type":51,"value":269},{"type":46,"tag":73,"props":4809,"children":4810},{"style":121},[4811],{"type":51,"value":4016},{"type":46,"tag":73,"props":4813,"children":4814},{"style":307},[4815],{"type":51,"value":1169},{"type":46,"tag":73,"props":4817,"children":4818},{"class":75,"line":415},[4819],{"type":46,"tag":73,"props":4820,"children":4821},{"style":115},[4822],{"type":51,"value":2925},{"type":46,"tag":73,"props":4824,"children":4825},{"class":75,"line":424},[4826,4830],{"type":46,"tag":73,"props":4827,"children":4828},{"style":115},[4829],{"type":51,"value":2933},{"type":46,"tag":73,"props":4831,"children":4832},{"style":307},[4833],{"type":51,"value":1169},{"type":46,"tag":73,"props":4835,"children":4836},{"class":75,"line":442},[4837],{"type":46,"tag":73,"props":4838,"children":4839},{"emptyLinePlaceholder":251},[4840],{"type":51,"value":254},{"type":46,"tag":73,"props":4842,"children":4843},{"class":75,"line":472},[4844],{"type":46,"tag":73,"props":4845,"children":4846},{"style":297},[4847],{"type":51,"value":4848},"  // call server RPC functions\n",{"type":46,"tag":73,"props":4850,"children":4851},{"class":75,"line":502},[4852,4856,4861,4865,4870,4874,4878,4883],{"type":46,"tag":73,"props":4853,"children":4854},{"style":277},[4855],{"type":51,"value":1843},{"type":46,"tag":73,"props":4857,"children":4858},{"style":121},[4859],{"type":51,"value":4860}," options",{"type":46,"tag":73,"props":4862,"children":4863},{"style":115},[4864],{"type":51,"value":622},{"type":46,"tag":73,"props":4866,"children":4867},{"style":109},[4868],{"type":51,"value":4869}," await",{"type":46,"tag":73,"props":4871,"children":4872},{"style":121},[4873],{"type":51,"value":4334},{"type":46,"tag":73,"props":4875,"children":4876},{"style":115},[4877],{"type":51,"value":61},{"type":46,"tag":73,"props":4879,"children":4880},{"style":261},[4881],{"type":51,"value":4882},"getMyModuleOptions",{"type":46,"tag":73,"props":4884,"children":4885},{"style":307},[4886],{"type":51,"value":1198},{"type":46,"tag":73,"props":4888,"children":4889},{"class":75,"line":511},[4890,4894],{"type":46,"tag":73,"props":4891,"children":4892},{"style":115},[4893],{"type":51,"value":517},{"type":46,"tag":73,"props":4895,"children":4896},{"style":121},[4897],{"type":51,"value":1169},{"type":46,"tag":171,"props":4899,"children":4901},{"id":4900},"trying-local-changes",[4902],{"type":51,"value":4903},"Trying Local Changes",{"type":46,"tag":47,"props":4905,"children":4906},{},[4907],{"type":51,"value":4908},"You can clone Nuxt DevTools repo and try your changes locally.",{"type":46,"tag":47,"props":4910,"children":4911},{},[4912,4913,4918],{"type":51,"value":3869},{"type":46,"tag":1394,"props":4914,"children":4916},{"href":4915},"/development/contributing#trying-local-changes",[4917],{"type":51,"value":4903},{"type":51,"value":61},{"type":46,"tag":171,"props":4920,"children":4922},{"id":4921},"examples",[4923],{"type":51,"value":4924},"Examples",{"type":46,"tag":47,"props":4926,"children":4927},{},[4928],{"type":51,"value":4929},"Here are a few examples of how to integrate Nuxt DevTools in modules:",{"type":46,"tag":529,"props":4931,"children":4932},{},[4933,4944,4954,4964,4974,4984],{"type":46,"tag":533,"props":4934,"children":4935},{},[4936],{"type":46,"tag":1394,"props":4937,"children":4941},{"href":4938,"rel":4939},"https://github.com/nuxt/devtools/blob/a8d372bd10d34d8c2fba2613558df2b9b99d6ff9/packages/devtools/src/integrations/vscode.ts#L140-L172",[4940],"nofollow",[4942],{"type":51,"value":4943},"Built-in VS Code integration with lazy initialize",{"type":46,"tag":533,"props":4945,"children":4946},{},[4947],{"type":46,"tag":1394,"props":4948,"children":4951},{"href":4949,"rel":4950},"https://github.com/vueuse/vueuse/blob/ce28cef154489c73abe308104bef8568594a9bcd/packages/nuxt/index.ts#L89-L99",[4940],[4952],{"type":51,"value":4953},"VueUse adds a docs tab",{"type":46,"tag":533,"props":4955,"children":4956},{},[4957],{"type":46,"tag":1394,"props":4958,"children":4961},{"href":4959,"rel":4960},"https://github.com/unocss/unocss/blob/25021a751494e99e85cfd82cca3855cdf78f6a12/packages/nuxt/src/index.ts#L81-L94",[4940],[4962],{"type":51,"value":4963},"UnoCSS Inspector",{"type":46,"tag":533,"props":4965,"children":4966},{},[4967],{"type":46,"tag":1394,"props":4968,"children":4971},{"href":4969,"rel":4970},"https://github.com/nuxt/test-utils/blob/fd024f45f752c2faa4c9e0cc1fc1f8b3eae59553/src/module.ts#L150-L192",[4940],[4972],{"type":51,"value":4973},"Nuxt Test Utils",{"type":46,"tag":533,"props":4975,"children":4976},{},[4977],{"type":46,"tag":1394,"props":4978,"children":4981},{"href":4979,"rel":4980},"https://github.com/nuxt-modules/og-image/blob/551b5474b44b8ff3190643e861c0b453813683b0/src/build/devtools.ts#L65-L80",[4940],[4982],{"type":51,"value":4983},"Nuxt OG Image Playground",{"type":46,"tag":533,"props":4985,"children":4986},{},[4987],{"type":46,"tag":1394,"props":4988,"children":4991},{"href":4989,"rel":4990},"https://github.com/arashsheyda/nuxt-mongoose/blob/89d50bd977de0f4edfdbe3ed150d0dca4d040709/src/devtools.ts#L38-L48",[4940],[4992],{"type":51,"value":4993},"Nuxt Mongoose",{"type":46,"tag":2269,"props":4995,"children":4996},{},[4997],{"type":51,"value":2273},{"title":40,"searchDepth":247,"depth":247,"links":4999},[5000,5001,5004,5005,5006,5007,5008],{"id":2308,"depth":247,"text":2311},{"id":2364,"depth":247,"text":2367,"children":5002},[5003],{"id":2951,"depth":257,"text":2954},{"id":3176,"depth":247,"text":3179},{"id":3861,"depth":247,"text":3864},{"id":3879,"depth":247,"text":3882},{"id":4900,"depth":247,"text":4903},{"id":4921,"depth":247,"text":4924},"content:2.module:0.guide.md","2.module/0.guide.md","2.module/0.guide",{"_path":29,"_dir":38,"_draft":39,"_partial":39,"_locale":40,"title":28,"description":5013,"body":5014,"_type":2290,"_id":5879,"_source":2292,"_file":5880,"_stem":5881,"_extension":2295},"UI Kit is for module authors to build a custom view.",{"type":43,"children":5015,"toc":5871},[5016,5032,5049,5055,5067,5073,5096,5179,5185,5214,5227,5276,5318,5361,5366,5409,5414,5548,5562,5568,5581,5587,5600,5605,5854,5867],{"type":46,"tag":5017,"props":5018,"children":5019},"callout",{},[5020],{"type":46,"tag":47,"props":5021,"children":5022},{},[5023,5025,5030],{"type":51,"value":5024},"We suggest you to read the ",{"type":46,"tag":1394,"props":5026,"children":5027},{"href":23},[5028],{"type":51,"value":5029},"Module Authors Guide",{"type":51,"value":5031}," first.",{"type":46,"tag":47,"props":5033,"children":5034},{},[5035,5037,5048],{"type":51,"value":5036},"DevTools UI Kit is for module authors to build the custom view with the similiar look and feel as built-in DevTools UI. The source code can be found under ",{"type":46,"tag":1394,"props":5038,"children":5041},{"href":5039,"rel":5040},"https://github.com/nuxt/devtools/tree/main/packages/devtools-ui-kit",[4940],[5042],{"type":46,"tag":54,"props":5043,"children":5045},{"className":5044},[],[5046],{"type":51,"value":5047},"packages/devtools-ui-kit",{"type":51,"value":61},{"type":46,"tag":171,"props":5050,"children":5052},{"id":5051},"installation",[5053],{"type":51,"value":5054},"Installation",{"type":46,"tag":47,"props":5056,"children":5057},{},[5058,5060,5065],{"type":51,"value":5059},"We recommend to use the ",{"type":46,"tag":1394,"props":5061,"children":5063},{"href":5062},"/module/guide#starter-template",[5064],{"type":51,"value":2311},{"type":51,"value":5066}," for authoring a DevTools integration for your module, which has the set up built in and ready to use.",{"type":46,"tag":181,"props":5068,"children":5070},{"id":5069},"manual-install",[5071],{"type":51,"value":5072},"Manual Install",{"type":46,"tag":63,"props":5074,"children":5076},{"className":65,"code":5075,"language":67,"meta":40,"style":40},"npm i @nuxt/devtools-ui-kit\n",[5077],{"type":46,"tag":54,"props":5078,"children":5079},{"__ignoreMap":40},[5080],{"type":46,"tag":73,"props":5081,"children":5082},{"class":75,"line":76},[5083,5087,5091],{"type":46,"tag":73,"props":5084,"children":5085},{"style":80},[5086],{"type":51,"value":83},{"type":46,"tag":73,"props":5088,"children":5089},{"style":86},[5090],{"type":51,"value":89},{"type":46,"tag":73,"props":5092,"children":5093},{"style":86},[5094],{"type":51,"value":5095}," @nuxt/devtools-ui-kit\n",{"type":46,"tag":63,"props":5097,"children":5099},{"className":97,"code":5098,"language":99,"meta":40,"style":40},"export default defineNuxtConfig({\n  modules: [\n    '@nuxt/devtools-ui-kit'\n  ]\n})\n",[5100],{"type":46,"tag":54,"props":5101,"children":5102},{"__ignoreMap":40},[5103,5127,5143,5160,5168],{"type":46,"tag":73,"props":5104,"children":5105},{"class":75,"line":76},[5106,5110,5114,5119,5123],{"type":46,"tag":73,"props":5107,"children":5108},{"style":109},[5109],{"type":51,"value":1478},{"type":46,"tag":73,"props":5111,"children":5112},{"style":109},[5113],{"type":51,"value":2018},{"type":46,"tag":73,"props":5115,"children":5116},{"style":261},[5117],{"type":51,"value":5118}," defineNuxtConfig",{"type":46,"tag":73,"props":5120,"children":5121},{"style":121},[5122],{"type":51,"value":269},{"type":46,"tag":73,"props":5124,"children":5125},{"style":115},[5126],{"type":51,"value":290},{"type":46,"tag":73,"props":5128,"children":5129},{"class":75,"line":247},[5130,5135,5139],{"type":46,"tag":73,"props":5131,"children":5132},{"style":307},[5133],{"type":51,"value":5134},"  modules",{"type":46,"tag":73,"props":5136,"children":5137},{"style":115},[5138],{"type":51,"value":315},{"type":46,"tag":73,"props":5140,"children":5141},{"style":121},[5142],{"type":51,"value":945},{"type":46,"tag":73,"props":5144,"children":5145},{"class":75,"line":257},[5146,5151,5156],{"type":46,"tag":73,"props":5147,"children":5148},{"style":115},[5149],{"type":51,"value":5150},"    '",{"type":46,"tag":73,"props":5152,"children":5153},{"style":86},[5154],{"type":51,"value":5155},"@nuxt/devtools-ui-kit",{"type":46,"tag":73,"props":5157,"children":5158},{"style":115},[5159],{"type":51,"value":149},{"type":46,"tag":73,"props":5161,"children":5162},{"class":75,"line":293},[5163],{"type":46,"tag":73,"props":5164,"children":5165},{"style":121},[5166],{"type":51,"value":5167},"  ]\n",{"type":46,"tag":73,"props":5169,"children":5170},{"class":75,"line":303},[5171,5175],{"type":46,"tag":73,"props":5172,"children":5173},{"style":115},[5174],{"type":51,"value":517},{"type":46,"tag":73,"props":5176,"children":5177},{"style":121},[5178],{"type":51,"value":1169},{"type":46,"tag":171,"props":5180,"children":5182},{"id":5181},"usage",[5183],{"type":51,"value":5184},"Usage",{"type":46,"tag":47,"props":5186,"children":5187},{},[5188,5190,5195,5197,5204,5205,5212],{"type":51,"value":5189},"Under the hood, ",{"type":46,"tag":54,"props":5191,"children":5193},{"className":5192},[],[5194],{"type":51,"value":5155},{"type":51,"value":5196}," is an unbundled component library powered by ",{"type":46,"tag":1394,"props":5198,"children":5201},{"href":5199,"rel":5200},"https://github.com/unocss/unocss",[4940],[5202],{"type":51,"value":5203},"UnoCSS",{"type":51,"value":581},{"type":46,"tag":1394,"props":5206,"children":5209},{"href":5207,"rel":5208},"https://vueuse.org/",[4940],[5210],{"type":51,"value":5211},"VueUse",{"type":51,"value":5213},". Components are auto imported.",{"type":46,"tag":47,"props":5215,"children":5216},{},[5217,5219,5225],{"type":51,"value":5218},"In this library, we introduced the ",{"type":46,"tag":54,"props":5220,"children":5222},{"className":5221},[],[5223],{"type":51,"value":5224},"n",{"type":51,"value":5226}," attribute for every component to customize the styles and variations. For example, to make a red button:",{"type":46,"tag":63,"props":5228,"children":5232},{"className":5229,"code":5230,"language":5231,"meta":40,"style":40},"language-html shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","\u003CNButton n=\"red\" />\n","html",[5233],{"type":46,"tag":54,"props":5234,"children":5235},{"__ignoreMap":40},[5236],{"type":46,"tag":73,"props":5237,"children":5238},{"class":75,"line":76},[5239,5243,5248,5253,5257,5262,5267,5271],{"type":46,"tag":73,"props":5240,"children":5241},{"style":115},[5242],{"type":51,"value":3239},{"type":46,"tag":73,"props":5244,"children":5245},{"style":307},[5246],{"type":51,"value":5247},"NButton",{"type":46,"tag":73,"props":5249,"children":5250},{"style":277},[5251],{"type":51,"value":5252}," n",{"type":46,"tag":73,"props":5254,"children":5255},{"style":115},[5256],{"type":51,"value":882},{"type":46,"tag":73,"props":5258,"children":5259},{"style":115},[5260],{"type":51,"value":5261},"\"",{"type":46,"tag":73,"props":5263,"children":5264},{"style":86},[5265],{"type":51,"value":5266},"red",{"type":46,"tag":73,"props":5268,"children":5269},{"style":115},[5270],{"type":51,"value":5261},{"type":46,"tag":73,"props":5272,"children":5273},{"style":115},[5274],{"type":51,"value":5275}," />\n",{"type":46,"tag":47,"props":5277,"children":5278},{},[5279,5281,5287,5289,5294,5295,5301,5303,5309,5311,5316],{"type":51,"value":5280},"to make it larger, add the size specifier (",{"type":46,"tag":54,"props":5282,"children":5284},{"className":5283},[],[5285],{"type":51,"value":5286},"sm",{"type":51,"value":5288},", ",{"type":46,"tag":54,"props":5290,"children":5292},{"className":5291},[],[5293],{"type":51,"value":2295},{"type":51,"value":5288},{"type":46,"tag":54,"props":5296,"children":5298},{"className":5297},[],[5299],{"type":51,"value":5300},"lg",{"type":51,"value":5302}," or ",{"type":46,"tag":54,"props":5304,"children":5306},{"className":5305},[],[5307],{"type":51,"value":5308},"xl",{"type":51,"value":5310},") the ",{"type":46,"tag":54,"props":5312,"children":5314},{"className":5313},[],[5315],{"type":51,"value":5224},{"type":51,"value":5317}," attribute:",{"type":46,"tag":63,"props":5319,"children":5321},{"className":5229,"code":5320,"language":5231,"meta":40,"style":40},"\u003CNButton n=\"red xl\" />\n",[5322],{"type":46,"tag":54,"props":5323,"children":5324},{"__ignoreMap":40},[5325],{"type":46,"tag":73,"props":5326,"children":5327},{"class":75,"line":76},[5328,5332,5336,5340,5344,5348,5353,5357],{"type":46,"tag":73,"props":5329,"children":5330},{"style":115},[5331],{"type":51,"value":3239},{"type":46,"tag":73,"props":5333,"children":5334},{"style":307},[5335],{"type":51,"value":5247},{"type":46,"tag":73,"props":5337,"children":5338},{"style":277},[5339],{"type":51,"value":5252},{"type":46,"tag":73,"props":5341,"children":5342},{"style":115},[5343],{"type":51,"value":882},{"type":46,"tag":73,"props":5345,"children":5346},{"style":115},[5347],{"type":51,"value":5261},{"type":46,"tag":73,"props":5349,"children":5350},{"style":86},[5351],{"type":51,"value":5352},"red xl",{"type":46,"tag":73,"props":5354,"children":5355},{"style":115},[5356],{"type":51,"value":5261},{"type":46,"tag":73,"props":5358,"children":5359},{"style":115},[5360],{"type":51,"value":5275},{"type":46,"tag":47,"props":5362,"children":5363},{},[5364],{"type":51,"value":5365},"You can apply the same specifiers to any other component, for example:",{"type":46,"tag":63,"props":5367,"children":5369},{"className":5229,"code":5368,"language":5231,"meta":40,"style":40},"\u003CNCheckbox n=\"red xl\" />\n",[5370],{"type":46,"tag":54,"props":5371,"children":5372},{"__ignoreMap":40},[5373],{"type":46,"tag":73,"props":5374,"children":5375},{"class":75,"line":76},[5376,5380,5385,5389,5393,5397,5401,5405],{"type":46,"tag":73,"props":5377,"children":5378},{"style":115},[5379],{"type":51,"value":3239},{"type":46,"tag":73,"props":5381,"children":5382},{"style":307},[5383],{"type":51,"value":5384},"NCheckbox",{"type":46,"tag":73,"props":5386,"children":5387},{"style":277},[5388],{"type":51,"value":5252},{"type":46,"tag":73,"props":5390,"children":5391},{"style":115},[5392],{"type":51,"value":882},{"type":46,"tag":73,"props":5394,"children":5395},{"style":115},[5396],{"type":51,"value":5261},{"type":46,"tag":73,"props":5398,"children":5399},{"style":86},[5400],{"type":51,"value":5352},{"type":46,"tag":73,"props":5402,"children":5403},{"style":115},[5404],{"type":51,"value":5261},{"type":46,"tag":73,"props":5406,"children":5407},{"style":115},[5408],{"type":51,"value":5275},{"type":46,"tag":47,"props":5410,"children":5411},{},[5412],{"type":51,"value":5413},"Apply it to parent components could make a local theme scope",{"type":46,"tag":63,"props":5415,"children":5417},{"className":5229,"code":5416,"language":5231,"meta":40,"style":40},"\u003CNCard n=\"green-500\">\n  \u003C!-- both of them are themed green -->\n  \u003CNCheckbox>i accept the terms & conditions\u003C/NCheckbox>\n  \u003CNButton>Submit\u003C/NButton>\n\u003C/NCard>\n",[5418],{"type":46,"tag":54,"props":5419,"children":5420},{"__ignoreMap":40},[5421,5459,5467,5501,5533],{"type":46,"tag":73,"props":5422,"children":5423},{"class":75,"line":76},[5424,5428,5433,5437,5441,5445,5450,5454],{"type":46,"tag":73,"props":5425,"children":5426},{"style":115},[5427],{"type":51,"value":3239},{"type":46,"tag":73,"props":5429,"children":5430},{"style":307},[5431],{"type":51,"value":5432},"NCard",{"type":46,"tag":73,"props":5434,"children":5435},{"style":277},[5436],{"type":51,"value":5252},{"type":46,"tag":73,"props":5438,"children":5439},{"style":115},[5440],{"type":51,"value":882},{"type":46,"tag":73,"props":5442,"children":5443},{"style":115},[5444],{"type":51,"value":5261},{"type":46,"tag":73,"props":5446,"children":5447},{"style":86},[5448],{"type":51,"value":5449},"green-500",{"type":46,"tag":73,"props":5451,"children":5452},{"style":115},[5453],{"type":51,"value":5261},{"type":46,"tag":73,"props":5455,"children":5456},{"style":115},[5457],{"type":51,"value":5458},">\n",{"type":46,"tag":73,"props":5460,"children":5461},{"class":75,"line":247},[5462],{"type":46,"tag":73,"props":5463,"children":5464},{"style":297},[5465],{"type":51,"value":5466},"  \u003C!-- both of them are themed green -->\n",{"type":46,"tag":73,"props":5468,"children":5469},{"class":75,"line":257},[5470,5475,5479,5483,5488,5493,5497],{"type":46,"tag":73,"props":5471,"children":5472},{"style":115},[5473],{"type":51,"value":5474},"  \u003C",{"type":46,"tag":73,"props":5476,"children":5477},{"style":307},[5478],{"type":51,"value":5384},{"type":46,"tag":73,"props":5480,"children":5481},{"style":115},[5482],{"type":51,"value":3249},{"type":46,"tag":73,"props":5484,"children":5485},{"style":121},[5486],{"type":51,"value":5487},"i accept the terms & conditions",{"type":46,"tag":73,"props":5489,"children":5490},{"style":115},[5491],{"type":51,"value":5492},"\u003C/",{"type":46,"tag":73,"props":5494,"children":5495},{"style":307},[5496],{"type":51,"value":5384},{"type":46,"tag":73,"props":5498,"children":5499},{"style":115},[5500],{"type":51,"value":5458},{"type":46,"tag":73,"props":5502,"children":5503},{"class":75,"line":293},[5504,5508,5512,5516,5521,5525,5529],{"type":46,"tag":73,"props":5505,"children":5506},{"style":115},[5507],{"type":51,"value":5474},{"type":46,"tag":73,"props":5509,"children":5510},{"style":307},[5511],{"type":51,"value":5247},{"type":46,"tag":73,"props":5513,"children":5514},{"style":115},[5515],{"type":51,"value":3249},{"type":46,"tag":73,"props":5517,"children":5518},{"style":121},[5519],{"type":51,"value":5520},"Submit",{"type":46,"tag":73,"props":5522,"children":5523},{"style":115},[5524],{"type":51,"value":5492},{"type":46,"tag":73,"props":5526,"children":5527},{"style":307},[5528],{"type":51,"value":5247},{"type":46,"tag":73,"props":5530,"children":5531},{"style":115},[5532],{"type":51,"value":5458},{"type":46,"tag":73,"props":5534,"children":5535},{"class":75,"line":303},[5536,5540,5544],{"type":46,"tag":73,"props":5537,"children":5538},{"style":115},[5539],{"type":51,"value":5492},{"type":46,"tag":73,"props":5541,"children":5542},{"style":307},[5543],{"type":51,"value":5432},{"type":46,"tag":73,"props":5545,"children":5546},{"style":115},[5547],{"type":51,"value":5458},{"type":46,"tag":47,"props":5549,"children":5550},{},[5551,5553,5560],{"type":51,"value":5552},"Please check our ",{"type":46,"tag":1394,"props":5554,"children":5557},{"href":5555,"rel":5556},"https://ui-kit.devtools.nuxtjs.org/",[4940],[5558],{"type":51,"value":5559},"Online Demo",{"type":51,"value":5561}," for more components usages.",{"type":46,"tag":171,"props":5563,"children":5565},{"id":5564},"components",[5566],{"type":51,"value":5567},"Components",{"type":46,"tag":47,"props":5569,"children":5570},{},[5571,5573,5580],{"type":51,"value":5572},"Check ",{"type":46,"tag":1394,"props":5574,"children":5577},{"href":5575,"rel":5576},"https://github.com/nuxt/devtools/blob/main/packages/devtools-ui-kit/src/components",[4940],[5578],{"type":51,"value":5579},"all components",{"type":51,"value":61},{"type":46,"tag":171,"props":5582,"children":5584},{"id":5583},"theming",[5585],{"type":51,"value":5586},"Theming",{"type":46,"tag":47,"props":5588,"children":5589},{},[5590,5592,5598],{"type":51,"value":5591},"Powered by ",{"type":46,"tag":1394,"props":5593,"children":5596},{"href":5594,"rel":5595},"https://github.com/antfu/unocss",[4940],[5597],{"type":51,"value":5203},{"type":51,"value":5599},", you can use Tailwind/Windi CSS utilities to quickly customize the look and feel of components.",{"type":46,"tag":47,"props":5601,"children":5602},{},[5603],{"type":51,"value":5604},"It's also possible to override the default theme globally, for example:",{"type":46,"tag":63,"props":5606,"children":5608},{"className":97,"code":5607,"language":99,"meta":40,"style":40},"// nuxt.config.js\nexport default defineNuxtConfig({\n  modules: [\n    '@nuxt/devtools-ui-kit'\n  ],\n  unocss: {\n    shortcuts: {\n      'n-button-base': 'border n-border-base rounded shadow-sm op80 !outline-none',\n      'n-button-hover': 'op100 !border-context text-context',\n      'n-button-active': 'n-active-base bg-context/5',\n    }\n  }\n})\n",[5609],{"type":46,"tag":54,"props":5610,"children":5611},{"__ignoreMap":40},[5612,5620,5643,5658,5673,5685,5701,5717,5754,5791,5828,5836,5843],{"type":46,"tag":73,"props":5613,"children":5614},{"class":75,"line":76},[5615],{"type":46,"tag":73,"props":5616,"children":5617},{"style":297},[5618],{"type":51,"value":5619},"// nuxt.config.js\n",{"type":46,"tag":73,"props":5621,"children":5622},{"class":75,"line":247},[5623,5627,5631,5635,5639],{"type":46,"tag":73,"props":5624,"children":5625},{"style":109},[5626],{"type":51,"value":1478},{"type":46,"tag":73,"props":5628,"children":5629},{"style":109},[5630],{"type":51,"value":2018},{"type":46,"tag":73,"props":5632,"children":5633},{"style":261},[5634],{"type":51,"value":5118},{"type":46,"tag":73,"props":5636,"children":5637},{"style":121},[5638],{"type":51,"value":269},{"type":46,"tag":73,"props":5640,"children":5641},{"style":115},[5642],{"type":51,"value":290},{"type":46,"tag":73,"props":5644,"children":5645},{"class":75,"line":257},[5646,5650,5654],{"type":46,"tag":73,"props":5647,"children":5648},{"style":307},[5649],{"type":51,"value":5134},{"type":46,"tag":73,"props":5651,"children":5652},{"style":115},[5653],{"type":51,"value":315},{"type":46,"tag":73,"props":5655,"children":5656},{"style":121},[5657],{"type":51,"value":945},{"type":46,"tag":73,"props":5659,"children":5660},{"class":75,"line":293},[5661,5665,5669],{"type":46,"tag":73,"props":5662,"children":5663},{"style":115},[5664],{"type":51,"value":5150},{"type":46,"tag":73,"props":5666,"children":5667},{"style":86},[5668],{"type":51,"value":5155},{"type":46,"tag":73,"props":5670,"children":5671},{"style":115},[5672],{"type":51,"value":149},{"type":46,"tag":73,"props":5674,"children":5675},{"class":75,"line":303},[5676,5681],{"type":46,"tag":73,"props":5677,"children":5678},{"style":121},[5679],{"type":51,"value":5680},"  ]",{"type":46,"tag":73,"props":5682,"children":5683},{"style":115},[5684],{"type":51,"value":334},{"type":46,"tag":73,"props":5686,"children":5687},{"class":75,"line":337},[5688,5693,5697],{"type":46,"tag":73,"props":5689,"children":5690},{"style":307},[5691],{"type":51,"value":5692},"  unocss",{"type":46,"tag":73,"props":5694,"children":5695},{"style":115},[5696],{"type":51,"value":315},{"type":46,"tag":73,"props":5698,"children":5699},{"style":115},[5700],{"type":51,"value":439},{"type":46,"tag":73,"props":5702,"children":5703},{"class":75,"line":346},[5704,5709,5713],{"type":46,"tag":73,"props":5705,"children":5706},{"style":307},[5707],{"type":51,"value":5708},"    shortcuts",{"type":46,"tag":73,"props":5710,"children":5711},{"style":115},[5712],{"type":51,"value":315},{"type":46,"tag":73,"props":5714,"children":5715},{"style":115},[5716],{"type":51,"value":439},{"type":46,"tag":73,"props":5718,"children":5719},{"class":75,"line":376},[5720,5724,5729,5733,5737,5741,5746,5750],{"type":46,"tag":73,"props":5721,"children":5722},{"style":115},[5723],{"type":51,"value":953},{"type":46,"tag":73,"props":5725,"children":5726},{"style":307},[5727],{"type":51,"value":5728},"n-button-base",{"type":46,"tag":73,"props":5730,"children":5731},{"style":115},[5732],{"type":51,"value":329},{"type":46,"tag":73,"props":5734,"children":5735},{"style":115},[5736],{"type":51,"value":315},{"type":46,"tag":73,"props":5738,"children":5739},{"style":115},[5740],{"type":51,"value":139},{"type":46,"tag":73,"props":5742,"children":5743},{"style":86},[5744],{"type":51,"value":5745},"border n-border-base rounded shadow-sm op80 !outline-none",{"type":46,"tag":73,"props":5747,"children":5748},{"style":115},[5749],{"type":51,"value":329},{"type":46,"tag":73,"props":5751,"children":5752},{"style":115},[5753],{"type":51,"value":334},{"type":46,"tag":73,"props":5755,"children":5756},{"class":75,"line":385},[5757,5761,5766,5770,5774,5778,5783,5787],{"type":46,"tag":73,"props":5758,"children":5759},{"style":115},[5760],{"type":51,"value":953},{"type":46,"tag":73,"props":5762,"children":5763},{"style":307},[5764],{"type":51,"value":5765},"n-button-hover",{"type":46,"tag":73,"props":5767,"children":5768},{"style":115},[5769],{"type":51,"value":329},{"type":46,"tag":73,"props":5771,"children":5772},{"style":115},[5773],{"type":51,"value":315},{"type":46,"tag":73,"props":5775,"children":5776},{"style":115},[5777],{"type":51,"value":139},{"type":46,"tag":73,"props":5779,"children":5780},{"style":86},[5781],{"type":51,"value":5782},"op100 !border-context text-context",{"type":46,"tag":73,"props":5784,"children":5785},{"style":115},[5786],{"type":51,"value":329},{"type":46,"tag":73,"props":5788,"children":5789},{"style":115},[5790],{"type":51,"value":334},{"type":46,"tag":73,"props":5792,"children":5793},{"class":75,"line":415},[5794,5798,5803,5807,5811,5815,5820,5824],{"type":46,"tag":73,"props":5795,"children":5796},{"style":115},[5797],{"type":51,"value":953},{"type":46,"tag":73,"props":5799,"children":5800},{"style":307},[5801],{"type":51,"value":5802},"n-button-active",{"type":46,"tag":73,"props":5804,"children":5805},{"style":115},[5806],{"type":51,"value":329},{"type":46,"tag":73,"props":5808,"children":5809},{"style":115},[5810],{"type":51,"value":315},{"type":46,"tag":73,"props":5812,"children":5813},{"style":115},[5814],{"type":51,"value":139},{"type":46,"tag":73,"props":5816,"children":5817},{"style":86},[5818],{"type":51,"value":5819},"n-active-base bg-context/5",{"type":46,"tag":73,"props":5821,"children":5822},{"style":115},[5823],{"type":51,"value":329},{"type":46,"tag":73,"props":5825,"children":5826},{"style":115},[5827],{"type":51,"value":334},{"type":46,"tag":73,"props":5829,"children":5830},{"class":75,"line":424},[5831],{"type":46,"tag":73,"props":5832,"children":5833},{"style":115},[5834],{"type":51,"value":5835},"    }\n",{"type":46,"tag":73,"props":5837,"children":5838},{"class":75,"line":442},[5839],{"type":46,"tag":73,"props":5840,"children":5841},{"style":115},[5842],{"type":51,"value":2132},{"type":46,"tag":73,"props":5844,"children":5845},{"class":75,"line":472},[5846,5850],{"type":46,"tag":73,"props":5847,"children":5848},{"style":115},[5849],{"type":51,"value":517},{"type":46,"tag":73,"props":5851,"children":5852},{"style":121},[5853],{"type":51,"value":1169},{"type":46,"tag":47,"props":5855,"children":5856},{},[5857,5859,5866],{"type":51,"value":5858},"You can find all the default values and available entries in ",{"type":46,"tag":1394,"props":5860,"children":5863},{"href":5861,"rel":5862},"https://github.com/nuxt/devtools/blob/main/packages/devtools-ui-kit/src/unocss.ts",[4940],[5864],{"type":51,"value":5865},"src/unocss.ts",{"type":51,"value":61},{"type":46,"tag":2269,"props":5868,"children":5869},{},[5870],{"type":51,"value":2273},{"title":40,"searchDepth":247,"depth":247,"links":5872},[5873,5876,5877,5878],{"id":5051,"depth":247,"text":5054,"children":5874},[5875],{"id":5069,"depth":257,"text":5072},{"id":5181,"depth":247,"text":5184},{"id":5564,"depth":247,"text":5567},{"id":5583,"depth":247,"text":5586},"content:2.module:2.ui-kit.md","2.module/2.ui-kit.md","2.module/2.ui-kit",1785314835651]