chore: up

playground-vue/package.json

@@ -16,6 +16,7 @@
     "zod": "^3.24.2"
   },
   "devDependencies": {
+    "@compodium/vue": "https://pkg.pr.new/romhml/compodium/@compodium/vue@18f083d",
     "@vitejs/plugin-vue": "^5.2.3",
     "typescript": "^5.6.3",
     "vite": "^6.2.3",

playground-vue/src/main.ts

@@ -10,7 +10,7 @@ const pages = import.meta.glob('../../playground/app/pages/**/*.vue')
 const components = import.meta.glob('../../playground/app/components/**/*.vue')
 
 const routes = Object.keys(pages).map((path) => {
-  const name = path.match(/\.\.\/\.\.\/playground\/app\/pages(.*)\.vue$/)![1].toLowerCase()
+  const name = path.match(/\.\.\/\.\.\/playground\/app\/pages(.*)\.vue$/)!.[1].toLowerCase()
   return {
     path: name === '/index' ? '/' : name,
     component: pages[path]

playground-vue/vite.config.ts

@@ -1,6 +1,7 @@
 import { defineConfig } from 'vite'
 import vue from '@vitejs/plugin-vue'
 
+import { compodium } from '@compodium/vue'
 import ui from '../src/vite'
 
 // https://vitejs.dev/config/
@@ -25,7 +26,21 @@ export default defineConfig({
       components: {
         dirs: ['../playground/app/components']
       }
+    }),
+    compodium({
+      dir: '../playground/compodium',
+      includeLibraryCollections: false,
+
+      componentDirs: [
+        { path: '../src/runtime/components', prefix: 'U', pathPrefix: false }
+      ],
+      extras: {
+        colors: {
+          neutral: 'slate'
+        }
+      }
     })
+
   ],
   optimizeDeps: {
     // prevents reloading page when navigating between components