Themes

Theme and optional modules

Conditionally loading filesystem, explorer kits, and bundled apps from a theme.

Themes stay installable without a virtual filesystem. Heavy features gate on whether the user added @owdproject/module-fs to desktop.config.ts.

Layering

flowchart LR
  modFs[module-fs ZenFS & headless explorer]
  kitPV[kit-primevue components & dialogs]
  theme[Theme module]
  modFs --> kitPV
  kitPV --> theme
  • module-fs — ZenFS virtual filesystem runtime and headless explorer state/stores (useExplorerStore, useExplorerWindow).
  • kit-primevue — Nuxt PrimeVue configuration, dialog provider bridge, and UI explorer components (Workspace, Toolbar, FileEntry).

Core does not include explorer UI — do not import useDesktopExplorerStore from core; use useExplorerStore from @owdproject/module-fs.

Conditional pattern

Themes can conditionally register filesystem-dependent components or plugins based on whether @owdproject/module-fs is active:

if (nuxt.options.modules.includes('@owdproject/module-fs')) {
  // Add explorer-specific theme components or custom plugins
  addPlugin({ src: resolve('./runtime/apps/explorer/plugin.ts'), mode: 'client' })
  addComponentsDir({ path: resolve('./runtime/apps/explorer/components') })
}

Benefits:

  • Lighter desktop when the user skips filesystem modules.
  • Self-contained theme demos when the playground lists module-fs in config.

Dependencies in package.json

StyleWhen
@owdproject/kit-primevue: npm ^3.4.0Standalone theme repo / publish
workspace:* for kitsTheme cloned under client themes/*
No module-fs in theme dependenciesPrefer playground + user desktop to add module-fs via npm

Do not use workspace:* for module-fs unless you cloned it into the workspace with desktop add module-fs --dev.

When the playground enables explorer demos, align playground/package.json with desktop.config.ts — see Create from scratch.

Coupling checklist for theme README

Document:

  • Which optional modules unlock explorer / media apps.
  • peerDependencies on @owdproject/core version.
  • Behaviour without module-fs (explorer entries hidden vs disabled).