[{"data":1,"prerenderedAt":1831},["ShallowReactive",2],{"navigation_docs":3,"-themes-create-from-scratch":217,"-themes-create-from-scratch-surround":1826},[4,25,41,84,126,165,201],{"title":5,"icon":6,"path":7,"stem":8,"children":9,"page":24},"Overview","i-lucide-house","\u002Fgetting-started","1.getting-started",[10,14,19],{"title":11,"path":12,"stem":13,"icon":6},"Introduction","\u002Fgetting-started\u002Fintroduction","1.getting-started\u002F2.introduction",{"title":15,"path":16,"stem":17,"icon":18},"Installation","\u002Fgetting-started\u002Finstallation","1.getting-started\u002F3.installation","i-lucide-download",{"title":20,"path":21,"stem":22,"icon":23},"Project structure","\u002Fgetting-started\u002Fproject-structure","1.getting-started\u002F4.project-structure","i-lucide-folder-tree",false,{"title":26,"icon":27,"path":28,"stem":29,"children":30,"page":24},"Architecture","i-lucide-cpu","\u002Farchitecture","3.architecture",[31,36],{"title":32,"path":33,"stem":34,"icon":35},"Core, themes, and apps","\u002Farchitecture\u002Foverview","3.architecture\u002F1.overview","i-lucide-layers",{"title":37,"path":38,"stem":39,"icon":40},"Kits and extension modules","\u002Farchitecture\u002Fkits","3.architecture\u002F3.kits","i-lucide-puzzle",{"title":42,"icon":43,"path":44,"stem":45,"children":46,"page":24},"Apps","i-lucide-app-window","\u002Fapps","4.apps",[47,51,55,60,64,69,74,79],{"title":5,"path":48,"stem":49,"icon":50},"\u002Fapps\u002Foverview","4.apps\u002F1.overview","i-lucide-info",{"title":52,"path":53,"stem":54,"icon":23},"Package layout","\u002Fapps\u002Fpackage-layout","4.apps\u002F2.package-layout",{"title":56,"path":57,"stem":58,"icon":59},"Create from scratch","\u002Fapps\u002Fcreate-from-scratch","4.apps\u002F3.create-from-scratch","i-lucide-list-checks",{"title":61,"path":62,"stem":63,"icon":40},"Module and runtime","\u002Fapps\u002Fmodule-and-runtime","4.apps\u002F4.module-and-runtime",{"title":65,"path":66,"stem":67,"icon":68},"Plugins","\u002Fapps\u002Fplugins","4.apps\u002F5.plugins","i-lucide-plug",{"title":70,"path":71,"stem":72,"icon":73},"Windows and commands","\u002Fapps\u002Fwindows-and-commands","4.apps\u002F6.windows-and-commands","i-lucide-layout-panel-top",{"title":75,"path":76,"stem":77,"icon":78},"Playground","\u002Fapps\u002Fplayground","4.apps\u002F7.playground","i-lucide-flask-conical",{"title":80,"path":81,"stem":82,"icon":83},"Build and publish","\u002Fapps\u002Fbuild-and-publish","4.apps\u002F8.build-and-publish","i-lucide-package",{"title":85,"icon":86,"path":87,"stem":88,"children":89,"page":24},"Themes","i-lucide-palette","\u002Fthemes","5.themes",[90,93,98,102,106,111,116,121],{"title":5,"path":91,"stem":92,"icon":50},"\u002Fthemes\u002Foverview","5.themes\u002F1.overview",{"title":94,"path":95,"stem":96,"icon":97},"Theme anatomy","\u002Fthemes\u002Ftheme-anatomy","5.themes\u002F2.theme-anatomy","i-lucide-component",{"title":99,"path":100,"stem":101},"Create From Scratch","\u002Fthemes\u002Fcreate-from-scratch","5.themes\u002F3.create-from-scratch",{"title":103,"path":104,"stem":105,"icon":68},"Theme plugins","\u002Fthemes\u002Fplugins","5.themes\u002F4.plugins",{"title":107,"path":108,"stem":109,"icon":110},"Styling and Tailwind","\u002Fthemes\u002Fstyling-and-tailwind","5.themes\u002F5.styling-and-tailwind","i-lucide-brush",{"title":112,"path":113,"stem":114,"icon":115},"Pages and boot flow","\u002Fthemes\u002Fpages-and-boot-flow","5.themes\u002F6.pages-and-boot-flow","i-lucide-power",{"title":117,"path":118,"stem":119,"icon":120},"Theme and optional modules","\u002Fthemes\u002Ftheme-and-optional-modules","5.themes\u002F7.theme-and-optional-modules","i-lucide-link",{"title":122,"path":123,"stem":124,"icon":125},"Window chrome and nav buttons","\u002Fthemes\u002Fwindow-chrome-and-nav-buttons","5.themes\u002F8.window-chrome-and-nav-buttons","i-lucide-square-mouse-pointer",{"title":127,"icon":128,"path":129,"stem":130,"children":131,"page":24},"Client & CLI","i-lucide-terminal","\u002Fsetup","6.setup",[132,136,141,146,151,156,161],{"title":133,"path":134,"stem":135,"icon":128},"desktop CLI","\u002Fsetup\u002Fdesktop-cli","6.setup\u002F1.desktop-cli",{"title":137,"path":138,"stem":139,"icon":140},"Package linking","\u002Fsetup\u002Fpackage-linking","6.setup\u002F2.package-linking","i-lucide-link-2",{"title":142,"path":143,"stem":144,"icon":145},"Monorepo and workspace","\u002Fsetup\u002Fmonorepo-workspace","6.setup\u002F3.monorepo-workspace","i-lucide-blocks",{"title":147,"path":148,"stem":149,"icon":150},"desktop.config.ts","\u002Fsetup\u002Fdesktop-config","6.setup\u002F4.desktop-config","i-lucide-file-code",{"title":152,"path":153,"stem":154,"icon":155},"Migrate themes, apps, and modules (3.3.2)","\u002Fsetup\u002Fmigrate-packages-3.3.2","6.setup\u002F5.migrate-packages-3.3.2","i-lucide-arrow-right-left",{"title":157,"path":158,"stem":159,"icon":160},"Migrate themes, apps, and modules (3.4)","\u002Fsetup\u002Fmigrate-packages-3.4","6.setup\u002F6.migrate-packages-3.4","i-lucide-arrow-up-right",{"title":162,"path":163,"stem":164},"Troubleshooting","\u002Fsetup\u002Ftroubleshooting","6.setup\u002F7.troubleshooting",{"title":166,"icon":167,"path":168,"stem":169,"children":170,"page":24},"Internals","i-lucide-book-open","\u002Finternals","7.internals",[171,176,181,186,191,196],{"title":172,"path":173,"stem":174,"icon":175},"Boot sequence","\u002Finternals\u002Fboot-sequence","7.internals\u002F1.boot-sequence","i-lucide-list-ordered",{"title":177,"path":178,"stem":179,"icon":180},"Stores and composables","\u002Finternals\u002Fstores-and-composables","7.internals\u002F2.stores-and-composables","i-lucide-database",{"title":182,"path":183,"stem":184,"icon":185},"Core components","\u002Finternals\u002Fcore-components","7.internals\u002F3.core-components","i-lucide-layout-grid",{"title":187,"path":188,"stem":189,"icon":190},"Dialog provider","\u002Finternals\u002Fdialog-provider","7.internals\u002F4.dialog-provider","i-lucide-message-square",{"title":192,"path":193,"stem":194,"icon":195},"Kernel contract","\u002Finternals\u002Fkernel-contract","7.internals\u002F5.kernel-contract","i-lucide-shield-check",{"title":197,"path":198,"stem":199,"icon":200},"Shell identity","\u002Finternals\u002Fshell-identity","7.internals\u002F6.shell-identity","i-lucide-user",{"title":202,"icon":203,"path":204,"stem":205,"children":206,"page":24},"Reference","i-lucide-book-marked","\u002Freference","8.reference",[207,212],{"title":208,"path":209,"stem":210,"icon":211},"Glossary","\u002Freference\u002Fglossary","8.reference\u002F1.glossary","i-lucide-book-a",{"title":213,"path":214,"stem":215,"icon":216},"Ecosystem","\u002Freference\u002Fuseful-links","8.reference\u002F2.useful-links","i-lucide-external-link",{"id":218,"title":99,"body":219,"description":394,"extension":1821,"links":1822,"meta":1823,"navigation":656,"path":100,"seo":1824,"stem":101,"__hash__":1825},"docs\u002F5.themes\u002F3.create-from-scratch.md",{"type":220,"value":221,"toc":1802},"minimark",[222,225,230,234,246,250,380,384,387,397,403,514,521,549,552,947,950,976,984,991,1002,1013,1017,1075,1082,1086,1096,1154,1159,1163,1168,1241,1247,1412,1422,1601,1609,1628,1641,1672,1676,1692,1703,1707,1721,1725,1780,1784,1798],[223,224],"hr",{},[226,227,229],"h2",{"id":228},"title-create-from-scratch","title: Create from scratch",[231,232,233],"p",{},"description: End-to-end guide to building an OWD theme — minimal Paper vs full Nova, playground deps, PrimeVue.\nnavigation:\nicon: i-lucide-list-checks",[231,235,236,237,241,242,245],{},"This guide walks through creating a theme module from zero. Compare ",[238,239,240],"code",{},"**[theme-paper](https:\u002F\u002Fgithub.com\u002Fowdproject\u002Ftheme-paper)**"," (minimal) and ",[238,243,244],{},"**[theme-nova](https:\u002F\u002Fgithub.com\u002Fowdproject\u002Ftheme-nova)**"," (full shell).",[226,247,249],{"id":248},"paper-vs-nova-at-a-glance","Paper vs Nova at a glance",[251,252,253,269],"table",{},[254,255,256],"thead",{},[257,258,259,263,266],"tr",{},[260,261,262],"th",{},"Aspect",[260,264,265],{},"Paper (minimal)",[260,267,268],{},"Nova (full)",[270,271,272,285,302,318,332,348,365],"tbody",{},[257,273,274,280,283],{},[275,276,277],"td",{},[238,278,279],{},"**@owdproject\u002Fkit-theme**",[275,281,282],{},"Yes",[275,284,282],{},[257,286,287,296,299],{},[275,288,289,292,293],{},[238,290,291],{},"**defaults"," + ",[238,294,295],{},"defu**",[275,297,298],{},"Small shell config",[275,300,301],{},"systemBar, dockBar, explorer flags",[257,303,304,310,313],{},[275,305,306],{},[307,308,309],"strong",{},"Extra plugins",[275,311,312],{},"None or minimal",[275,314,315],{},[238,316,317],{},"50.desktop-theme-nova-dialogs.client.ts",[257,319,320,326,329],{},[275,321,322,325],{},[238,323,324],{},"**Desktop.vue","**",[275,327,328],{},"Simple layout",[275,330,331],{},"Full shell + slots",[257,333,334,339,342],{},[275,335,336],{},[307,337,338],{},"Explorer UI",[275,340,341],{},"No",[275,343,344,345],{},"Conditional on ",[238,346,347],{},"@owdproject\u002Fmodule-fs",[257,349,350,359,362],{},[275,351,352],{},[307,353,354,355,358],{},"Direct ",[238,356,357],{},"primevue"," imports",[275,360,361],{},"Unlikely",[275,363,364],{},"Yes (ContextMenu, DataTable, …)",[257,366,367,372,374],{},[275,368,369],{},[307,370,371],{},"Boot pages",[275,373,341],{},[275,375,376,377],{},"Optional — see ",[238,378,379],{},"[theme-win95](https:\u002F\u002Fgithub.com\u002Fowdproject\u002Ftheme-win95)",[226,381,383],{"id":382},"_1-scaffold-the-repository","1. Scaffold the repository",[231,385,386],{},"Typical tree:",[388,389,395],"pre",{"className":390,"code":392,"language":393,"meta":394},[391],"language-text","@owdproject\u002Ftheme-mytheme\u002F\n├── package.json\n├── src\u002F\n│   ├── module.ts\n│   └── runtime\u002F\n│       ├── components\u002F\n│       │   ├── Desktop.vue\n│       │   ├── SystemBar.vue\n│       │   ├── Background.vue\n│       │   └── Window\u002F\n│       ├── composables\u002F\n│       └── plugins\u002F          # optional client plugins\n├── playground\u002F\n│   ├── nuxt.config.ts\n│   ├── desktop.config.ts\n│   └── package.json\n└── dist\u002F\n","text","",[238,396,392],{"__ignoreMap":394},[231,398,399,402],{},[238,400,401],{},"**peerDependencies",":**",[388,404,408],{"className":405,"code":406,"language":407,"meta":394,"style":394},"language-json shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","{\n  \"@owdproject\u002Fcore\": \"^3.4.0\",\n  \"@owdproject\u002Fkit-primevue\": \"^3.4.0\",\n  \"@owdproject\u002Fkit-tailwind\": \"^0.1.0\",\n  \"nuxt\": \"^4.4.4\"\n}\n","json",[238,409,410,419,447,467,488,508],{"__ignoreMap":394},[411,412,415],"span",{"class":413,"line":414},"line",1,[411,416,418],{"class":417},"sMK4o","{\n",[411,420,422,425,429,432,435,438,442,444],{"class":413,"line":421},2,[411,423,424],{"class":417},"  \"",[411,426,428],{"class":427},"spNyl","@owdproject\u002Fcore",[411,430,431],{"class":417},"\"",[411,433,434],{"class":417},":",[411,436,437],{"class":417}," \"",[411,439,441],{"class":440},"sfazB","^3.4.0",[411,443,431],{"class":417},[411,445,446],{"class":417},",\n",[411,448,450,452,455,457,459,461,463,465],{"class":413,"line":449},3,[411,451,424],{"class":417},[411,453,454],{"class":427},"@owdproject\u002Fkit-primevue",[411,456,431],{"class":417},[411,458,434],{"class":417},[411,460,437],{"class":417},[411,462,441],{"class":440},[411,464,431],{"class":417},[411,466,446],{"class":417},[411,468,470,472,475,477,479,481,484,486],{"class":413,"line":469},4,[411,471,424],{"class":417},[411,473,474],{"class":427},"@owdproject\u002Fkit-tailwind",[411,476,431],{"class":417},[411,478,434],{"class":417},[411,480,437],{"class":417},[411,482,483],{"class":440},"^0.1.0",[411,485,431],{"class":417},[411,487,446],{"class":417},[411,489,491,493,496,498,500,502,505],{"class":413,"line":490},5,[411,492,424],{"class":417},[411,494,495],{"class":427},"nuxt",[411,497,431],{"class":417},[411,499,434],{"class":417},[411,501,437],{"class":417},[411,503,504],{"class":440},"^4.4.4",[411,506,507],{"class":417},"\"\n",[411,509,511],{"class":413,"line":510},6,[411,512,513],{"class":417},"}\n",[226,515,517,518],{"id":516},"_2-write-srcmodulets","2. Write ",[238,519,520],{},"src\u002Fmodule.ts",[522,523,524,527,528,533,534,537,538,541,542,548],"callout",{"icon":155},[307,525,526],{},"Since core 3.3.2:"," use ",[307,529,530],{},[238,531,532],{},"defineDesktopTheme"," instead of hand-rolling ",[238,535,536],{},"defu"," on ",[238,539,540],{},"public.desktop",". See ",[307,543,544],{},[545,546,547],"a",{"href":153},"Migrate packages (3.3.2)",".",[231,550,551],{},"Minimal pattern (Paper-like):",[388,553,557],{"className":554,"code":555,"language":556,"meta":394,"style":394},"language-ts shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","import { createResolver, addComponentsDir } from '@nuxt\u002Fkit'\nimport { installModule } from '@nuxt\u002Fkit'\nimport { defineDesktopTheme } from '@owdproject\u002Fcore\u002Fkit\u002Fauthoring'\nimport { registerThemeTailwindPath } from '@owdproject\u002Fkit-tailwind\u002Fkit\u002FregisterTailwindPath'\n\nexport default defineDesktopTheme({\n  meta: { name: 'owd-theme-mytheme' },\n  defaults: {\n    name: 'mytheme',\n    systemBar: { enabled: true, position: 'top', startButton: true },\n  },\n  async setup(_options, nuxt) {\n    const { resolve } = createResolver(import.meta.url)\n\n    await installModule('@owdproject\u002Fkit-primevue')\n    registerThemeTailwindPath(nuxt, import.meta.url)\n\n    addComponentsDir({ path: resolve('.\u002Fruntime\u002Fcomponents'), global: true })\n  },\n})\n","ts",[238,558,559,593,612,632,652,658,674,701,712,729,773,779,804,839,844,862,887,892,934,939],{"__ignoreMap":394},[411,560,561,565,568,572,575,578,581,584,587,590],{"class":413,"line":414},[411,562,564],{"class":563},"s7zQu","import",[411,566,567],{"class":417}," {",[411,569,571],{"class":570},"sTEyZ"," createResolver",[411,573,574],{"class":417},",",[411,576,577],{"class":570}," addComponentsDir",[411,579,580],{"class":417}," }",[411,582,583],{"class":563}," from",[411,585,586],{"class":417}," '",[411,588,589],{"class":440},"@nuxt\u002Fkit",[411,591,592],{"class":417},"'\n",[411,594,595,597,599,602,604,606,608,610],{"class":413,"line":421},[411,596,564],{"class":563},[411,598,567],{"class":417},[411,600,601],{"class":570}," installModule",[411,603,580],{"class":417},[411,605,583],{"class":563},[411,607,586],{"class":417},[411,609,589],{"class":440},[411,611,592],{"class":417},[411,613,614,616,618,621,623,625,627,630],{"class":413,"line":449},[411,615,564],{"class":563},[411,617,567],{"class":417},[411,619,620],{"class":570}," defineDesktopTheme",[411,622,580],{"class":417},[411,624,583],{"class":563},[411,626,586],{"class":417},[411,628,629],{"class":440},"@owdproject\u002Fcore\u002Fkit\u002Fauthoring",[411,631,592],{"class":417},[411,633,634,636,638,641,643,645,647,650],{"class":413,"line":469},[411,635,564],{"class":563},[411,637,567],{"class":417},[411,639,640],{"class":570}," registerThemeTailwindPath",[411,642,580],{"class":417},[411,644,583],{"class":563},[411,646,586],{"class":417},[411,648,649],{"class":440},"@owdproject\u002Fkit-tailwind\u002Fkit\u002FregisterTailwindPath",[411,651,592],{"class":417},[411,653,654],{"class":413,"line":490},[411,655,657],{"emptyLinePlaceholder":656},true,"\n",[411,659,660,663,666,669,672],{"class":413,"line":510},[411,661,662],{"class":563},"export",[411,664,665],{"class":563}," default",[411,667,620],{"class":668},"s2Zo4",[411,670,671],{"class":570},"(",[411,673,418],{"class":417},[411,675,677,681,683,685,688,690,692,695,698],{"class":413,"line":676},7,[411,678,680],{"class":679},"swJcz","  meta",[411,682,434],{"class":417},[411,684,567],{"class":417},[411,686,687],{"class":679}," name",[411,689,434],{"class":417},[411,691,586],{"class":417},[411,693,694],{"class":440},"owd-theme-mytheme",[411,696,697],{"class":417},"'",[411,699,700],{"class":417}," },\n",[411,702,704,707,709],{"class":413,"line":703},8,[411,705,706],{"class":679},"  defaults",[411,708,434],{"class":417},[411,710,711],{"class":417}," {\n",[411,713,715,718,720,722,725,727],{"class":413,"line":714},9,[411,716,717],{"class":679},"    name",[411,719,434],{"class":417},[411,721,586],{"class":417},[411,723,724],{"class":440},"mytheme",[411,726,697],{"class":417},[411,728,446],{"class":417},[411,730,732,735,737,739,742,744,748,750,753,755,757,760,762,764,767,769,771],{"class":413,"line":731},10,[411,733,734],{"class":679},"    systemBar",[411,736,434],{"class":417},[411,738,567],{"class":417},[411,740,741],{"class":679}," enabled",[411,743,434],{"class":417},[411,745,747],{"class":746},"sfNiH"," true",[411,749,574],{"class":417},[411,751,752],{"class":679}," position",[411,754,434],{"class":417},[411,756,586],{"class":417},[411,758,759],{"class":440},"top",[411,761,697],{"class":417},[411,763,574],{"class":417},[411,765,766],{"class":679}," startButton",[411,768,434],{"class":417},[411,770,747],{"class":746},[411,772,700],{"class":417},[411,774,776],{"class":413,"line":775},11,[411,777,778],{"class":417},"  },\n",[411,780,782,785,788,790,794,796,799,802],{"class":413,"line":781},12,[411,783,784],{"class":427},"  async",[411,786,787],{"class":679}," setup",[411,789,671],{"class":417},[411,791,793],{"class":792},"sHdIc","_options",[411,795,574],{"class":417},[411,797,798],{"class":792}," nuxt",[411,800,801],{"class":417},")",[411,803,711],{"class":417},[411,805,807,810,812,815,817,820,822,824,826,828,831,833,836],{"class":413,"line":806},13,[411,808,809],{"class":427},"    const",[411,811,567],{"class":417},[411,813,814],{"class":570}," resolve",[411,816,580],{"class":417},[411,818,819],{"class":417}," =",[411,821,571],{"class":668},[411,823,671],{"class":679},[411,825,564],{"class":563},[411,827,548],{"class":417},[411,829,830],{"class":570},"meta",[411,832,548],{"class":417},[411,834,835],{"class":570},"url",[411,837,838],{"class":679},")\n",[411,840,842],{"class":413,"line":841},14,[411,843,657],{"emptyLinePlaceholder":656},[411,845,847,850,852,854,856,858,860],{"class":413,"line":846},15,[411,848,849],{"class":563},"    await",[411,851,601],{"class":668},[411,853,671],{"class":679},[411,855,697],{"class":417},[411,857,454],{"class":440},[411,859,697],{"class":417},[411,861,838],{"class":679},[411,863,865,868,870,872,874,877,879,881,883,885],{"class":413,"line":864},16,[411,866,867],{"class":668},"    registerThemeTailwindPath",[411,869,671],{"class":679},[411,871,495],{"class":570},[411,873,574],{"class":417},[411,875,876],{"class":563}," import",[411,878,548],{"class":417},[411,880,830],{"class":570},[411,882,548],{"class":417},[411,884,835],{"class":570},[411,886,838],{"class":679},[411,888,890],{"class":413,"line":889},17,[411,891,657],{"emptyLinePlaceholder":656},[411,893,895,898,900,903,906,908,910,912,914,917,919,921,923,926,928,930,932],{"class":413,"line":894},18,[411,896,897],{"class":668},"    addComponentsDir",[411,899,671],{"class":679},[411,901,902],{"class":417},"{",[411,904,905],{"class":679}," path",[411,907,434],{"class":417},[411,909,814],{"class":668},[411,911,671],{"class":679},[411,913,697],{"class":417},[411,915,916],{"class":440},".\u002Fruntime\u002Fcomponents",[411,918,697],{"class":417},[411,920,801],{"class":679},[411,922,574],{"class":417},[411,924,925],{"class":679}," global",[411,927,434],{"class":417},[411,929,747],{"class":746},[411,931,580],{"class":417},[411,933,838],{"class":679},[411,935,937],{"class":413,"line":936},19,[411,938,778],{"class":417},[411,940,942,945],{"class":413,"line":941},20,[411,943,944],{"class":417},"}",[411,946,838],{"class":570},[231,948,949],{},"Nova adds:",[951,952,953,960,965],"ul",{},[954,955,956,957],"li",{},"PrimeVue preset options on ",[238,958,959],{},"nuxt.options.primevue",[954,961,962],{},[238,963,964],{},"**addPlugin({ src: resolve('.\u002Fruntime\u002Fplugins\u002F50....client.ts'), mode: 'client' })**",[954,966,967,968,971,972,975],{},"Conditional ",[238,969,970],{},"**installModule('@owdproject\u002Fkit-primevue')**"," when ",[238,973,974],{},"module-fs"," is loaded",[231,977,978,979,981,982,548],{},"See ",[545,980,94],{"href":95}," and ",[545,983,103],{"href":104},[226,985,987,988],{"id":986},"_3-implement-desktopvue","3. Implement ",[238,989,990],{},"Desktop.vue",[231,992,993,994,997,998,548],{},"The theme root wraps ",[238,995,996],{},"**DesktopCore**"," from core — see ",[545,999,1001],{"href":1000},"\u002Fthemes\u002Ftheme-anatomy#desktopvue","Theme anatomy — Desktop.vue",[231,1003,1004,1005,1008,1009,1012],{},"Consumer ",[238,1006,1007],{},"**app.vue**"," renders ",[238,1010,1011],{},"**\u003CDesktop \u002F>**"," (auto-imported globally from your components dir).",[226,1014,1016],{"id":1015},"_4-window-and-shell-components","4. Window and shell components",[251,1018,1019,1029],{},[254,1020,1021],{},[257,1022,1023,1026],{},[260,1024,1025],{},"Component",[260,1027,1028],{},"Role",[270,1030,1031,1045,1055,1065],{},[257,1032,1033,1038],{},[275,1034,1035],{},[238,1036,1037],{},"**Window*.vue**",[275,1039,1040,1041,1044],{},"Chrome around ",[238,1042,1043],{},"**DesktopWindow**"," \u002F content slots",[257,1046,1047,1052],{},[275,1048,1049],{},[238,1050,1051],{},"**SystemBar**",[275,1053,1054],{},"Taskbar \u002F menu bar",[257,1056,1057,1062],{},[275,1058,1059],{},[238,1060,1061],{},"**Background**",[275,1063,1064],{},"Wallpaper \u002F desktop surface",[257,1066,1067,1072],{},[275,1068,1069],{},[238,1070,1071],{},"**DockBar**",[275,1073,1074],{},"Optional (Nova)",[231,1076,1077,1078,1081],{},"Apps render ",[307,1079,1080],{},"inside"," window content areas — keep window wrappers in the theme, business UI in apps.",[226,1083,1085],{"id":1084},"_5-add-theme-plugins-nova-win95","5. Add theme plugins (Nova \u002F Win95)",[231,1087,1088,1089,1092,1093,434],{},"Dialog confirmation flows use a ",[307,1090,1091],{},"client plugin"," registered from ",[238,1094,1095],{},"module.ts",[388,1097,1099],{"className":554,"code":1098,"language":556,"meta":394,"style":394},"addPlugin({\n  src: resolve('.\u002Fruntime\u002Fplugins\u002F50.desktop-theme-nova-dialogs.client.ts'),\n  mode: 'client',\n})\n",[238,1100,1101,1110,1132,1148],{"__ignoreMap":394},[411,1102,1103,1106,1108],{"class":413,"line":414},[411,1104,1105],{"class":668},"addPlugin",[411,1107,671],{"class":570},[411,1109,418],{"class":417},[411,1111,1112,1115,1117,1119,1121,1123,1126,1128,1130],{"class":413,"line":421},[411,1113,1114],{"class":679},"  src",[411,1116,434],{"class":417},[411,1118,814],{"class":668},[411,1120,671],{"class":570},[411,1122,697],{"class":417},[411,1124,1125],{"class":440},".\u002Fruntime\u002Fplugins\u002F50.desktop-theme-nova-dialogs.client.ts",[411,1127,697],{"class":417},[411,1129,801],{"class":570},[411,1131,446],{"class":417},[411,1133,1134,1137,1139,1141,1144,1146],{"class":413,"line":449},[411,1135,1136],{"class":679},"  mode",[411,1138,434],{"class":417},[411,1140,586],{"class":417},[411,1142,1143],{"class":440},"client",[411,1145,697],{"class":417},[411,1147,446],{"class":417},[411,1149,1150,1152],{"class":413,"line":469},[411,1151,944],{"class":417},[411,1153,838],{"class":570},[231,1155,1156,1157,548],{},"Details: ",[545,1158,103],{"href":104},[226,1160,1162],{"id":1161},"_6-configure-the-playground","6. Configure the playground",[231,1164,1165,402],{},[238,1166,1167],{},"**playground\u002Fnuxt.config.ts",[388,1169,1171],{"className":554,"code":1170,"language":556,"meta":394,"style":394},"export default defineNuxtConfig({\n  modules: ['@owdproject\u002Fcore'],\n  ssr: false,\n  compatibilityDate: 'latest',\n})\n",[238,1172,1173,1186,1207,1219,1235],{"__ignoreMap":394},[411,1174,1175,1177,1179,1182,1184],{"class":413,"line":414},[411,1176,662],{"class":563},[411,1178,665],{"class":563},[411,1180,1181],{"class":668}," defineNuxtConfig",[411,1183,671],{"class":570},[411,1185,418],{"class":417},[411,1187,1188,1191,1193,1196,1198,1200,1202,1205],{"class":413,"line":421},[411,1189,1190],{"class":679},"  modules",[411,1192,434],{"class":417},[411,1194,1195],{"class":570}," [",[411,1197,697],{"class":417},[411,1199,428],{"class":440},[411,1201,697],{"class":417},[411,1203,1204],{"class":570},"]",[411,1206,446],{"class":417},[411,1208,1209,1212,1214,1217],{"class":413,"line":449},[411,1210,1211],{"class":679},"  ssr",[411,1213,434],{"class":417},[411,1215,1216],{"class":746}," false",[411,1218,446],{"class":417},[411,1220,1221,1224,1226,1228,1231,1233],{"class":413,"line":469},[411,1222,1223],{"class":679},"  compatibilityDate",[411,1225,434],{"class":417},[411,1227,586],{"class":417},[411,1229,1230],{"class":440},"latest",[411,1232,697],{"class":417},[411,1234,446],{"class":417},[411,1236,1237,1239],{"class":413,"line":490},[411,1238,944],{"class":417},[411,1240,838],{"class":570},[231,1242,1243,1246],{},[238,1244,1245],{},"**playground\u002Fdesktop.config.ts**"," (Nova demo):",[388,1248,1250],{"className":554,"code":1249,"language":556,"meta":394,"style":394},"import { defineDesktopConfig } from '@owdproject\u002Fcore'\n\nexport default defineDesktopConfig({\n  theme: '@owdproject\u002Ftheme-nova',\n  modules: ['@owdproject\u002Fmodule-fs'],\n  apps: ['@owdproject\u002Fapp-classic-audioplayer'],\n  systemBar: { enabled: true, startButton: true },\n  fs: {\n    mounts: { '\u002Fmnt\u002Ftest': '\u002Ftest-small.zip' },\n  },\n})\n",[238,1251,1252,1271,1275,1287,1303,1321,1341,1366,1375,1402,1406],{"__ignoreMap":394},[411,1253,1254,1256,1258,1261,1263,1265,1267,1269],{"class":413,"line":414},[411,1255,564],{"class":563},[411,1257,567],{"class":417},[411,1259,1260],{"class":570}," defineDesktopConfig",[411,1262,580],{"class":417},[411,1264,583],{"class":563},[411,1266,586],{"class":417},[411,1268,428],{"class":440},[411,1270,592],{"class":417},[411,1272,1273],{"class":413,"line":421},[411,1274,657],{"emptyLinePlaceholder":656},[411,1276,1277,1279,1281,1283,1285],{"class":413,"line":449},[411,1278,662],{"class":563},[411,1280,665],{"class":563},[411,1282,1260],{"class":668},[411,1284,671],{"class":570},[411,1286,418],{"class":417},[411,1288,1289,1292,1294,1296,1299,1301],{"class":413,"line":469},[411,1290,1291],{"class":679},"  theme",[411,1293,434],{"class":417},[411,1295,586],{"class":417},[411,1297,1298],{"class":440},"@owdproject\u002Ftheme-nova",[411,1300,697],{"class":417},[411,1302,446],{"class":417},[411,1304,1305,1307,1309,1311,1313,1315,1317,1319],{"class":413,"line":490},[411,1306,1190],{"class":679},[411,1308,434],{"class":417},[411,1310,1195],{"class":570},[411,1312,697],{"class":417},[411,1314,347],{"class":440},[411,1316,697],{"class":417},[411,1318,1204],{"class":570},[411,1320,446],{"class":417},[411,1322,1323,1326,1328,1330,1332,1335,1337,1339],{"class":413,"line":510},[411,1324,1325],{"class":679},"  apps",[411,1327,434],{"class":417},[411,1329,1195],{"class":570},[411,1331,697],{"class":417},[411,1333,1334],{"class":440},"@owdproject\u002Fapp-classic-audioplayer",[411,1336,697],{"class":417},[411,1338,1204],{"class":570},[411,1340,446],{"class":417},[411,1342,1343,1346,1348,1350,1352,1354,1356,1358,1360,1362,1364],{"class":413,"line":676},[411,1344,1345],{"class":679},"  systemBar",[411,1347,434],{"class":417},[411,1349,567],{"class":417},[411,1351,741],{"class":679},[411,1353,434],{"class":417},[411,1355,747],{"class":746},[411,1357,574],{"class":417},[411,1359,766],{"class":679},[411,1361,434],{"class":417},[411,1363,747],{"class":746},[411,1365,700],{"class":417},[411,1367,1368,1371,1373],{"class":413,"line":703},[411,1369,1370],{"class":679},"  fs",[411,1372,434],{"class":417},[411,1374,711],{"class":417},[411,1376,1377,1380,1382,1384,1386,1389,1391,1393,1395,1398,1400],{"class":413,"line":714},[411,1378,1379],{"class":679},"    mounts",[411,1381,434],{"class":417},[411,1383,567],{"class":417},[411,1385,586],{"class":417},[411,1387,1388],{"class":679},"\u002Fmnt\u002Ftest",[411,1390,697],{"class":417},[411,1392,434],{"class":417},[411,1394,586],{"class":417},[411,1396,1397],{"class":440},"\u002Ftest-small.zip",[411,1399,697],{"class":417},[411,1401,700],{"class":417},[411,1403,1404],{"class":413,"line":731},[411,1405,778],{"class":417},[411,1407,1408,1410],{"class":413,"line":775},[411,1409,944],{"class":417},[411,1411,838],{"class":570},[231,1413,1414,1417,1418,1421],{},[238,1415,1416],{},"**playground\u002Fpackage.json**"," must list ",[307,1419,1420],{},"every"," dependency above, plus PrimeVue when the theme imports it:",[388,1423,1425],{"className":405,"code":1424,"language":407,"meta":394,"style":394},"{\n  \"dependencies\": {\n    \"@owdproject\u002Fapp-classic-audioplayer\": \"^3.4.0\",\n    \"@owdproject\u002Fcore\": \"^3.4.0\",\n    \"@owdproject\u002Fmodule-fs\": \"^3.4.0\",\n    \"@owdproject\u002Fmodule-persistence\": \"^3.4.0\",\n    \"@owdproject\u002Ftheme-nova\": \"^3.4.0\",\n    \"@primeuix\u002Fthemes\": \"^2.0.3\",\n    \"nuxt\": \"^4.4.4\",\n    \"primevue\": \"^4.5.5\"\n  }\n}\n",[238,1426,1427,1431,1444,1464,1482,1500,1519,1537,1557,1575,1592,1597],{"__ignoreMap":394},[411,1428,1429],{"class":413,"line":414},[411,1430,418],{"class":417},[411,1432,1433,1435,1438,1440,1442],{"class":413,"line":421},[411,1434,424],{"class":417},[411,1436,1437],{"class":427},"dependencies",[411,1439,431],{"class":417},[411,1441,434],{"class":417},[411,1443,711],{"class":417},[411,1445,1446,1449,1452,1454,1456,1458,1460,1462],{"class":413,"line":449},[411,1447,1448],{"class":417},"    \"",[411,1450,1334],{"class":1451},"sBMFI",[411,1453,431],{"class":417},[411,1455,434],{"class":417},[411,1457,437],{"class":417},[411,1459,441],{"class":440},[411,1461,431],{"class":417},[411,1463,446],{"class":417},[411,1465,1466,1468,1470,1472,1474,1476,1478,1480],{"class":413,"line":469},[411,1467,1448],{"class":417},[411,1469,428],{"class":1451},[411,1471,431],{"class":417},[411,1473,434],{"class":417},[411,1475,437],{"class":417},[411,1477,441],{"class":440},[411,1479,431],{"class":417},[411,1481,446],{"class":417},[411,1483,1484,1486,1488,1490,1492,1494,1496,1498],{"class":413,"line":490},[411,1485,1448],{"class":417},[411,1487,347],{"class":1451},[411,1489,431],{"class":417},[411,1491,434],{"class":417},[411,1493,437],{"class":417},[411,1495,441],{"class":440},[411,1497,431],{"class":417},[411,1499,446],{"class":417},[411,1501,1502,1504,1507,1509,1511,1513,1515,1517],{"class":413,"line":510},[411,1503,1448],{"class":417},[411,1505,1506],{"class":1451},"@owdproject\u002Fmodule-persistence",[411,1508,431],{"class":417},[411,1510,434],{"class":417},[411,1512,437],{"class":417},[411,1514,441],{"class":440},[411,1516,431],{"class":417},[411,1518,446],{"class":417},[411,1520,1521,1523,1525,1527,1529,1531,1533,1535],{"class":413,"line":676},[411,1522,1448],{"class":417},[411,1524,1298],{"class":1451},[411,1526,431],{"class":417},[411,1528,434],{"class":417},[411,1530,437],{"class":417},[411,1532,441],{"class":440},[411,1534,431],{"class":417},[411,1536,446],{"class":417},[411,1538,1539,1541,1544,1546,1548,1550,1553,1555],{"class":413,"line":703},[411,1540,1448],{"class":417},[411,1542,1543],{"class":1451},"@primeuix\u002Fthemes",[411,1545,431],{"class":417},[411,1547,434],{"class":417},[411,1549,437],{"class":417},[411,1551,1552],{"class":440},"^2.0.3",[411,1554,431],{"class":417},[411,1556,446],{"class":417},[411,1558,1559,1561,1563,1565,1567,1569,1571,1573],{"class":413,"line":714},[411,1560,1448],{"class":417},[411,1562,495],{"class":1451},[411,1564,431],{"class":417},[411,1566,434],{"class":417},[411,1568,437],{"class":417},[411,1570,504],{"class":440},[411,1572,431],{"class":417},[411,1574,446],{"class":417},[411,1576,1577,1579,1581,1583,1585,1587,1590],{"class":413,"line":731},[411,1578,1448],{"class":417},[411,1580,357],{"class":1451},[411,1582,431],{"class":417},[411,1584,434],{"class":417},[411,1586,437],{"class":417},[411,1588,1589],{"class":440},"^4.5.5",[411,1591,507],{"class":417},[411,1593,1594],{"class":413,"line":775},[411,1595,1596],{"class":417},"  }\n",[411,1598,1599],{"class":413,"line":781},[411,1600,513],{"class":417},[1602,1603,1605,1606,1608],"h3",{"id":1604},"why-primevue-explicitly","Why ",[238,1607,357],{}," explicitly?",[231,1610,1611,1612,1614,1615,1618,1619,981,1621,1623,1624,1627],{},"While ",[238,1613,454],{}," configures PrimeVue during boot, themes that import ",[238,1616,1617],{},"primevue\u002F..."," components directly in their templates must declare ",[238,1620,357],{},[238,1622,1543],{}," as ",[238,1625,1626],{},"peerDependencies"," (and have them in playground dependencies for local development) to ensure pnpm resolves them correctly.",[231,1629,1630,1631,1634,1635,1640],{},"Reference upstream: ",[238,1632,1633],{},"[theme-nova"," playground](",[545,1636,1637],{"href":1637,"rel":1638},"https:\u002F\u002Fgithub.com\u002Fowdproject\u002Ftheme-nova\u002Fblob\u002Fmain\u002Fplayground\u002Fpackage.json",[1639],"nofollow",") — add PrimeVue packages if missing locally.",[388,1642,1646],{"className":1643,"code":1644,"language":1645,"meta":394,"style":394},"language-bash shiki shiki-themes material-theme-lighter material-theme material-theme-palenight","cd playground && pnpm install && pnpm dev\n","bash",[238,1647,1648],{"__ignoreMap":394},[411,1649,1650,1653,1656,1659,1662,1665,1667,1669],{"class":413,"line":414},[411,1651,1652],{"class":668},"cd",[411,1654,1655],{"class":440}," playground",[411,1657,1658],{"class":417}," &&",[411,1660,1661],{"class":1451}," pnpm",[411,1663,1664],{"class":440}," install",[411,1666,1658],{"class":417},[411,1668,1661],{"class":1451},[411,1670,1671],{"class":440}," dev\n",[226,1673,1675],{"id":1674},"_7-validate","7. Validate",[388,1677,1679],{"className":1643,"code":1678,"language":1645,"meta":394,"style":394},"desktop validate .\n",[238,1680,1681],{"__ignoreMap":394},[411,1682,1683,1686,1689],{"class":413,"line":414},[411,1684,1685],{"class":1451},"desktop",[411,1687,1688],{"class":440}," validate",[411,1690,1691],{"class":440}," .\n",[231,1693,1694,1695,1698,1699,1702],{},"Wire into ",[307,1696,1697],{},"client\u002Fdesktop"," with ",[238,1700,1701],{},"workspace:*"," when developing inside the monorepo.",[226,1704,1706],{"id":1705},"boot-flow-win95","Boot flow (Win95)",[231,1708,1709,1710,1713,1714,541,1717,981,1719,548],{},"For start\u002Fboot screens, add ",[238,1711,1712],{},"**runtime\u002Fpages\u002F","** routes and composables like ",[238,1715,1716],{},"**useSystemLifecycle**",[545,1718,112],{"href":113},[238,1720,379],{},[226,1722,1724],{"id":1723},"known-issues","Known issues",[251,1726,1727,1737],{},[254,1728,1729],{},[257,1730,1731,1734],{},[260,1732,1733],{},"Issue",[260,1735,1736],{},"Workaround",[270,1738,1739,1754],{},[257,1740,1741,1746],{},[275,1742,1743,1745],{},[238,1744,357],{}," not found in playground",[275,1747,1748,1749,292,1751,1753],{},"Add ",[238,1750,357],{},[238,1752,1543],{}," to playground deps",[257,1755,1756,1762],{},[275,1757,1758,1761],{},[238,1759,1760],{},"desktop.config"," lists modules not in playground",[275,1763,1764,1765,1768,1769,1772,1773,1772,1776,1779],{},"Align ",[238,1766,1767],{},"package.json"," with every ",[238,1770,1771],{},"apps"," \u002F ",[238,1774,1775],{},"modules",[238,1777,1778],{},"theme"," entry",[226,1781,1783],{"id":1782},"next","Next",[951,1785,1786,1790,1794],{},[954,1787,1788],{},[545,1789,94],{"href":95},[954,1791,1792],{},[545,1793,103],{"href":104},[954,1795,1796],{},[545,1797,107],{"href":108},[1799,1800,1801],"style",{},"html pre.shiki code .sMK4o, html code.shiki .sMK4o{--shiki-light:#39ADB5;--shiki-default:#89DDFF;--shiki-dark:#89DDFF}html pre.shiki code .spNyl, html code.shiki .spNyl{--shiki-light:#9C3EDA;--shiki-default:#C792EA;--shiki-dark:#C792EA}html pre.shiki code .sfazB, html code.shiki .sfazB{--shiki-light:#91B859;--shiki-default:#C3E88D;--shiki-dark:#C3E88D}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);}html pre.shiki code .s7zQu, html code.shiki .s7zQu{--shiki-light:#39ADB5;--shiki-light-font-style:italic;--shiki-default:#89DDFF;--shiki-default-font-style:italic;--shiki-dark:#89DDFF;--shiki-dark-font-style:italic}html pre.shiki code .sTEyZ, html code.shiki .sTEyZ{--shiki-light:#90A4AE;--shiki-default:#EEFFFF;--shiki-dark:#BABED8}html pre.shiki code .s2Zo4, html code.shiki .s2Zo4{--shiki-light:#6182B8;--shiki-default:#82AAFF;--shiki-dark:#82AAFF}html pre.shiki code .swJcz, html code.shiki .swJcz{--shiki-light:#E53935;--shiki-default:#F07178;--shiki-dark:#F07178}html pre.shiki code .sfNiH, html code.shiki .sfNiH{--shiki-light:#FF5370;--shiki-default:#FF9CAC;--shiki-dark:#FF9CAC}html pre.shiki code .sHdIc, html code.shiki .sHdIc{--shiki-light:#90A4AE;--shiki-light-font-style:italic;--shiki-default:#EEFFFF;--shiki-default-font-style:italic;--shiki-dark:#BABED8;--shiki-dark-font-style:italic}html pre.shiki code .sBMFI, html code.shiki .sBMFI{--shiki-light:#E2931D;--shiki-default:#FFCB6B;--shiki-dark:#FFCB6B}",{"title":394,"searchDepth":421,"depth":421,"links":1803},[1804,1805,1806,1807,1809,1811,1812,1813,1817,1818,1819,1820],{"id":228,"depth":421,"text":229},{"id":248,"depth":421,"text":249},{"id":382,"depth":421,"text":383},{"id":516,"depth":421,"text":1808},"2. Write src\u002Fmodule.ts",{"id":986,"depth":421,"text":1810},"3. Implement Desktop.vue",{"id":1015,"depth":421,"text":1016},{"id":1084,"depth":421,"text":1085},{"id":1161,"depth":421,"text":1162,"children":1814},[1815],{"id":1604,"depth":449,"text":1816},"Why primevue explicitly?",{"id":1674,"depth":421,"text":1675},{"id":1705,"depth":421,"text":1706},{"id":1723,"depth":421,"text":1724},{"id":1782,"depth":421,"text":1783},"md",null,{},{"description":394},"RjCUIFzrt5WcUzWVTz7UrOxRL1zfRF2DxoxJPWaT9ko",[1827,1829],{"title":94,"path":95,"stem":96,"description":1828,"icon":97,"children":-1},"module.ts, desktop runtimeConfig, Desktop.vue, defu merge, and kit dependencies.",{"title":103,"path":104,"stem":105,"description":1830,"icon":68,"children":-1},"Client Nuxt plugins in themes — dialogs, addPlugin, ordering, and what not to put in plugins.",1782171656295]