From 16afad673e0e07b7a47d10e5b026f0f294336f3d Mon Sep 17 00:00:00 2001
From: Peter Savchenko <specc.dev@gmail.com>
Date: Mon, 17 Nov 2025 20:11:52 +0300
Subject: [PATCH 1/8] update ui playground to make it buildable

---
 @codexteam/ui/dev/Playground.vue    |  8 +--
 @codexteam/ui/dev/index.html        | 10 ++--
 @codexteam/ui/dev/package.json      | 26 ++++++++++
 @codexteam/ui/dev/postcss.config.js | 17 +++++++
 @codexteam/ui/dev/vite.config.ts    | 34 +++++++++++++
 package.json                        |  3 +-
 yarn.lock                           | 79 +++++++++++++++++++++++++++--
 7 files changed, 163 insertions(+), 14 deletions(-)
 create mode 100644 @codexteam/ui/dev/package.json
 create mode 100644 @codexteam/ui/dev/postcss.config.js
 create mode 100644 @codexteam/ui/dev/vite.config.ts

diff --git a/@codexteam/ui/dev/Playground.vue b/@codexteam/ui/dev/Playground.vue
index 7ae71961..d6acc68f 100644
--- a/@codexteam/ui/dev/Playground.vue
+++ b/@codexteam/ui/dev/Playground.vue
@@ -38,10 +38,10 @@ import {
   Tabbar,
   Popover,
   Popup
-} from '../src/vue';
-import { useTheme } from '../src/vue/composables/useTheme';
-import { Navbar } from '../src/vue/layout/navbar';
-import { PageBlock } from '../src/vue/layout/page-block';
+} from '@';
+import { useTheme } from '@/vue/composables/useTheme';
+import { Navbar } from '@/vue/layout/navbar';
+import { PageBlock } from '@/vue/layout/page-block';
 
 import { useRouter, useRoute } from 'vue-router';
 
diff --git a/@codexteam/ui/dev/index.html b/@codexteam/ui/dev/index.html
index f5cea430..aa1fe81c 100644
--- a/@codexteam/ui/dev/index.html
+++ b/@codexteam/ui/dev/index.html
@@ -6,15 +6,13 @@
   theme-base="graphite"
   theme-accent="sky"
 >
-  <link
-    rel="stylesheet"
-    href="../src/styles/index.pcss"
-  />
   <div id="app"></div>
   <script type="module">
-    import { createApp, h } from 'vue';
-    import Playground from './Playground.vue';
+    import { createApp } from 'vue';
     import { createRouter, createWebHashHistory } from 'vue-router';
+    import "../src/styles/index.pcss";
+
+    import Playground from './Playground.vue';
     import routes from './routes';
 
     const router = createRouter({
diff --git a/@codexteam/ui/dev/package.json b/@codexteam/ui/dev/package.json
new file mode 100644
index 00000000..e7751a67
--- /dev/null
+++ b/@codexteam/ui/dev/package.json
@@ -0,0 +1,26 @@
+{
+  "name": "@codexteam/ui-demo",
+  "version": "0.1.1",
+  "type": "module",
+  "private": true,
+  "scripts": {
+    "dev": "vite",
+    "build": "vite build",
+    "preview": "vite preview"
+  },
+  "dependencies": {
+    "@codexteam/ui": "workspace:*",
+    "vue": "^3.4.16",
+    "vue-router": "^4.4.0"
+  },
+  "devDependencies": {
+    "@vitejs/plugin-vue": "^5.0.3",
+    "postcss": "^8.4.26",
+    "postcss-apply": "^0.12.0",
+    "postcss-hover-media-feature": "^1.0.2",
+    "postcss-import": "^16.0.0",
+    "postcss-nested": "^6.0.1",
+    "postcss-preset-env": "^9.3.0",
+    "vite": "^5.0.12"
+  }
+}
diff --git a/@codexteam/ui/dev/postcss.config.js b/@codexteam/ui/dev/postcss.config.js
new file mode 100644
index 00000000..d1774120
--- /dev/null
+++ b/@codexteam/ui/dev/postcss.config.js
@@ -0,0 +1,17 @@
+import postcssNested from 'postcss-nested';
+import postcssPresetEnv from 'postcss-preset-env';
+import postcssApply from 'postcss-apply';
+import postcssHoverMediaFeature from 'postcss-hover-media-feature';
+
+/**
+ * Returns PostCSS config for dev package
+ * Uses the same config as parent package
+ * Vite will resolve @/ alias automatically
+ *
+ * @returns {object} PostCSS config
+ */
+export default function () {
+  return {
+    plugins: [postcssNested(), postcssPresetEnv(), postcssApply(), postcssHoverMediaFeature()],
+  };
+}
diff --git a/@codexteam/ui/dev/vite.config.ts b/@codexteam/ui/dev/vite.config.ts
new file mode 100644
index 00000000..4873b92c
--- /dev/null
+++ b/@codexteam/ui/dev/vite.config.ts
@@ -0,0 +1,34 @@
+import { resolve } from 'path';
+import { defineConfig } from 'vite';
+import vue from '@vitejs/plugin-vue';
+
+export default defineConfig({
+  plugins: [vue()],
+  root: __dirname,
+  build: {
+    outDir: resolve(__dirname, 'dist'),
+    emptyOutDir: true,
+    rollupOptions: {
+      /* Externalize Vue and vue-router (loaded from CDN) */
+      external: ['vue', 'vue-router'],
+      output: {
+        /* Ensure relative paths work for static demo */
+        assetFileNames: 'assets/[name].[ext]',
+        globals: {
+          vue: 'Vue',
+          // eslint-disable-next-line @typescript-eslint/naming-convention
+          'vue-router': 'VueRouter',
+        },
+      },
+    },
+  },
+  resolve: {
+    alias: {
+      // eslint-disable-next-line @typescript-eslint/naming-convention
+      '@': resolve(__dirname, '../src'),
+    },
+  },
+  server: {
+    open: '/index.html',
+  },
+});
diff --git a/package.json b/package.json
index caedca36..fa4ae470 100644
--- a/package.json
+++ b/package.json
@@ -15,7 +15,8 @@
   },
   "private": true,
   "workspaces": [
-    "@codexteam/ui"
+    "@codexteam/ui",
+    "@codexteam/ui/**"
   ],
   "dependencies": {
     "@codexteam/icons": "^0.3.3",
diff --git a/yarn.lock b/yarn.lock
index adaf4116..cf6f3c8b 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -95,7 +95,25 @@ __metadata:
   languageName: node
   linkType: hard
 
-"@codexteam/ui@workspace:@codexteam/ui, @codexteam/ui@workspace:^":
+"@codexteam/ui-demo@workspace:@codexteam/ui/dev":
+  version: 0.0.0-use.local
+  resolution: "@codexteam/ui-demo@workspace:@codexteam/ui/dev"
+  dependencies:
+    "@codexteam/ui": "workspace:*"
+    "@vitejs/plugin-vue": ^5.0.3
+    postcss: ^8.4.26
+    postcss-apply: ^0.12.0
+    postcss-hover-media-feature: ^1.0.2
+    postcss-import: ^16.0.0
+    postcss-nested: ^6.0.1
+    postcss-preset-env: ^9.3.0
+    vite: ^5.0.12
+    vue: ^3.4.16
+    vue-router: ^4.4.0
+  languageName: unknown
+  linkType: soft
+
+"@codexteam/ui@workspace:*, @codexteam/ui@workspace:@codexteam/ui, @codexteam/ui@workspace:^":
   version: 0.0.0-use.local
   resolution: "@codexteam/ui@workspace:@codexteam/ui"
   dependencies:
@@ -4171,7 +4189,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"is-core-module@npm:^2.16.0":
+"is-core-module@npm:^2.16.0, is-core-module@npm:^2.16.1":
   version: 2.16.1
   resolution: "is-core-module@npm:2.16.1"
   dependencies:
@@ -5120,6 +5138,13 @@ __metadata:
   languageName: node
   linkType: hard
 
+"pify@npm:^2.3.0":
+  version: 2.3.0
+  resolution: "pify@npm:2.3.0"
+  checksum: 9503aaeaf4577acc58642ad1d25c45c6d90288596238fb68f82811c08104c800e5a7870398e9f015d82b44ecbcbef3dc3d4251a1cbb582f6e5959fe09884b2ba
+  languageName: node
+  linkType: hard
+
 "pkg-types@npm:^1.3.0":
   version: 1.3.1
   resolution: "pkg-types@npm:1.3.1"
@@ -5350,6 +5375,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"postcss-import@npm:^16.0.0":
+  version: 16.1.1
+  resolution: "postcss-import@npm:16.1.1"
+  dependencies:
+    postcss-value-parser: ^4.0.0
+    read-cache: ^1.0.0
+    resolve: ^1.1.7
+  peerDependencies:
+    postcss: ^8.0.0
+  checksum: 7652c42b63a2752584aa08a6e78445bd7d93f47ab392843157c3e21970595750f3c0f2eec02bd283d2820ccfbda0b4f4423debcad761cf64dd48128dcc2b33c1
+  languageName: node
+  linkType: hard
+
 "postcss-lab-function@npm:^6.0.16":
   version: 6.0.16
   resolution: "postcss-lab-function@npm:6.0.16"
@@ -5551,7 +5589,7 @@ __metadata:
   languageName: node
   linkType: hard
 
-"postcss-value-parser@npm:^4.2.0":
+"postcss-value-parser@npm:^4.0.0, postcss-value-parser@npm:^4.2.0":
   version: 4.2.0
   resolution: "postcss-value-parser@npm:4.2.0"
   checksum: 819ffab0c9d51cf0acbabf8996dffbfafbafa57afc0e4c98db88b67f2094cb44488758f06e5da95d7036f19556a4a732525e84289a425f4f6fd8e412a9d7442f
@@ -5649,6 +5687,15 @@ __metadata:
   languageName: node
   linkType: hard
 
+"read-cache@npm:^1.0.0":
+  version: 1.0.0
+  resolution: "read-cache@npm:1.0.0"
+  dependencies:
+    pify: ^2.3.0
+  checksum: cffc728b9ede1e0667399903f9ecaf3789888b041c46ca53382fa3a06303e5132774dc0a96d0c16aa702dbac1ea0833d5a868d414f5ab2af1e1438e19e6657c6
+  languageName: node
+  linkType: hard
+
 "regexp.prototype.flags@npm:^1.5.2":
   version: 1.5.2
   resolution: "regexp.prototype.flags@npm:1.5.2"
@@ -5682,6 +5729,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"resolve@npm:^1.1.7":
+  version: 1.22.11
+  resolution: "resolve@npm:1.22.11"
+  dependencies:
+    is-core-module: ^2.16.1
+    path-parse: ^1.0.7
+    supports-preserve-symlinks-flag: ^1.0.0
+  bin:
+    resolve: bin/resolve
+  checksum: 6d5baa2156b95a65ac431e7642e21106584e9f4194da50871cae8bc1bbd2b53bb7cee573c92543d83bb999620b224a087f62379d800ed1ccb189da6df5d78d50
+  languageName: node
+  linkType: hard
+
 "resolve@npm:^1.22.4":
   version: 1.22.8
   resolution: "resolve@npm:1.22.8"
@@ -5708,6 +5768,19 @@ __metadata:
   languageName: node
   linkType: hard
 
+"resolve@patch:resolve@^1.1.7#~builtin<compat/resolve>":
+  version: 1.22.11
+  resolution: "resolve@patch:resolve@npm%3A1.22.11#~builtin<compat/resolve>::version=1.22.11&hash=c3c19d"
+  dependencies:
+    is-core-module: ^2.16.1
+    path-parse: ^1.0.7
+    supports-preserve-symlinks-flag: ^1.0.0
+  bin:
+    resolve: bin/resolve
+  checksum: 1462da84ac3410d7c2e12e4f5f25c1423d8a174c3b4245c43eafea85e7bbe6af3eb7ec10a4850b5e518e8531608604742b8cbd761e1acd7ad1035108b7c98013
+  languageName: node
+  linkType: hard
+
 "resolve@patch:resolve@^1.22.4#~builtin<compat/resolve>":
   version: 1.22.8
   resolution: "resolve@patch:resolve@npm%3A1.22.8#~builtin<compat/resolve>::version=1.22.8&hash=c3c19d"

From d4893250ef2013d11578d9fed8e2394f5de09656 Mon Sep 17 00:00:00 2001
From: Peter Savchenko <specc.dev@gmail.com>
Date: Mon, 17 Nov 2025 20:19:24 +0300
Subject: [PATCH 2/8] fix production build

---
 @codexteam/ui/dev/vite.config.ts | 7 -------
 1 file changed, 7 deletions(-)

diff --git a/@codexteam/ui/dev/vite.config.ts b/@codexteam/ui/dev/vite.config.ts
index 4873b92c..36e5a53c 100644
--- a/@codexteam/ui/dev/vite.config.ts
+++ b/@codexteam/ui/dev/vite.config.ts
@@ -9,16 +9,9 @@ export default defineConfig({
     outDir: resolve(__dirname, 'dist'),
     emptyOutDir: true,
     rollupOptions: {
-      /* Externalize Vue and vue-router (loaded from CDN) */
-      external: ['vue', 'vue-router'],
       output: {
         /* Ensure relative paths work for static demo */
         assetFileNames: 'assets/[name].[ext]',
-        globals: {
-          vue: 'Vue',
-          // eslint-disable-next-line @typescript-eslint/naming-convention
-          'vue-router': 'VueRouter',
-        },
       },
     },
   },

From 9c9ec94ef661bf35b2577ee58900177a6df9e010 Mon Sep 17 00:00:00 2001
From: Peter Savchenko <specc.dev@gmail.com>
Date: Mon, 17 Nov 2025 20:23:10 +0300
Subject: [PATCH 3/8] Update package.json

---
 package.json | 2 +-
 1 file changed, 1 insertion(+), 1 deletion(-)

diff --git a/package.json b/package.json
index fa4ae470..d95cd8f9 100644
--- a/package.json
+++ b/package.json
@@ -16,7 +16,7 @@
   "private": true,
   "workspaces": [
     "@codexteam/ui",
-    "@codexteam/ui/**"
+    "@codexteam/ui/dev"
   ],
   "dependencies": {
     "@codexteam/icons": "^0.3.3",

From 2faee01f1580c5b551d177cdc35fc070765e1238 Mon Sep 17 00:00:00 2001
From: Peter Savchenko <specc.dev@gmail.com>
Date: Mon, 17 Nov 2025 20:26:06 +0300
Subject: [PATCH 4/8] update paths

---
 @codexteam/ui/dev/Playground.vue | 8 ++++----
 package.json                     | 2 +-
 2 files changed, 5 insertions(+), 5 deletions(-)

diff --git a/@codexteam/ui/dev/Playground.vue b/@codexteam/ui/dev/Playground.vue
index d6acc68f..d459ed9b 100644
--- a/@codexteam/ui/dev/Playground.vue
+++ b/@codexteam/ui/dev/Playground.vue
@@ -38,10 +38,10 @@ import {
   Tabbar,
   Popover,
   Popup
-} from '@';
-import { useTheme } from '@/vue/composables/useTheme';
-import { Navbar } from '@/vue/layout/navbar';
-import { PageBlock } from '@/vue/layout/page-block';
+} from '../src';
+import { useTheme } from '../src/vue/composables/useTheme';
+import { Navbar } from '../src/vue/layout/navbar';
+import { PageBlock } from '../src/vue/layout/page-block';
 
 import { useRouter, useRoute } from 'vue-router';
 
diff --git a/package.json b/package.json
index d95cd8f9..fa4ae470 100644
--- a/package.json
+++ b/package.json
@@ -16,7 +16,7 @@
   "private": true,
   "workspaces": [
     "@codexteam/ui",
-    "@codexteam/ui/dev"
+    "@codexteam/ui/**"
   ],
   "dependencies": {
     "@codexteam/icons": "^0.3.3",

From 3988f27bf4880f649f72b6612c1fbb7c026514ab Mon Sep 17 00:00:00 2001
From: Peter Savchenko <specc.dev@gmail.com>
Date: Mon, 17 Nov 2025 20:31:00 +0300
Subject: [PATCH 5/8] Update package.json

---
 @codexteam/ui/dev/package.json | 5 ++++-
 1 file changed, 4 insertions(+), 1 deletion(-)

diff --git a/@codexteam/ui/dev/package.json b/@codexteam/ui/dev/package.json
index e7751a67..460c615c 100644
--- a/@codexteam/ui/dev/package.json
+++ b/@codexteam/ui/dev/package.json
@@ -1,6 +1,6 @@
 {
   "name": "@codexteam/ui-demo",
-  "version": "0.1.1",
+  "version": "1.0.0",
   "type": "module",
   "private": true,
   "scripts": {
@@ -10,6 +10,9 @@
   },
   "dependencies": {
     "@codexteam/ui": "workspace:*",
+    "@editorjs/editorjs": "2.30.2",
+    "@editorjs/header": "^2.8.6",
+    "@editorjs/nested-list": "^1.4.2",
     "vue": "^3.4.16",
     "vue-router": "^4.4.0"
   },

From 13280c3becc8b7f87fb8838ec369d9ec0899d280 Mon Sep 17 00:00:00 2001
From: Peter Savchenko <specc.dev@gmail.com>
Date: Mon, 17 Nov 2025 20:33:02 +0300
Subject: [PATCH 6/8] Update yarn.lock

---
 yarn.lock | 3 +++
 1 file changed, 3 insertions(+)

diff --git a/yarn.lock b/yarn.lock
index cf6f3c8b..17244429 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -100,6 +100,9 @@ __metadata:
   resolution: "@codexteam/ui-demo@workspace:@codexteam/ui/dev"
   dependencies:
     "@codexteam/ui": "workspace:*"
+    "@editorjs/editorjs": 2.30.2
+    "@editorjs/header": ^2.8.6
+    "@editorjs/nested-list": ^1.4.2
     "@vitejs/plugin-vue": ^5.0.3
     postcss: ^8.4.26
     postcss-apply: ^0.12.0

From 414161c7e6b19949fe90bcd7ea158db9a7f83710 Mon Sep 17 00:00:00 2001
From: Peter Savchenko <specc.dev@gmail.com>
Date: Mon, 17 Nov 2025 20:35:19 +0300
Subject: [PATCH 7/8] add @codexteam/icons package

---
 @codexteam/ui/dev/package.json | 1 +
 yarn.lock                      | 1 +
 2 files changed, 2 insertions(+)

diff --git a/@codexteam/ui/dev/package.json b/@codexteam/ui/dev/package.json
index 460c615c..d04b5f9c 100644
--- a/@codexteam/ui/dev/package.json
+++ b/@codexteam/ui/dev/package.json
@@ -9,6 +9,7 @@
     "preview": "vite preview"
   },
   "dependencies": {
+    "@codexteam/icons": "^0.3.3",
     "@codexteam/ui": "workspace:*",
     "@editorjs/editorjs": "2.30.2",
     "@editorjs/header": "^2.8.6",
diff --git a/yarn.lock b/yarn.lock
index 17244429..8332c665 100644
--- a/yarn.lock
+++ b/yarn.lock
@@ -99,6 +99,7 @@ __metadata:
   version: 0.0.0-use.local
   resolution: "@codexteam/ui-demo@workspace:@codexteam/ui/dev"
   dependencies:
+    "@codexteam/icons": ^0.3.3
     "@codexteam/ui": "workspace:*"
     "@editorjs/editorjs": 2.30.2
     "@editorjs/header": ^2.8.6

From 78bce79132142a56d4edc9de744b1705e1b1c54b Mon Sep 17 00:00:00 2001
From: Peter Savchenko <specc.dev@gmail.com>
Date: Mon, 17 Nov 2025 20:39:16 +0300
Subject: [PATCH 8/8] add build:ui-demo script

---
 package.json | 1 +
 1 file changed, 1 insertion(+)

diff --git a/package.json b/package.json
index fa4ae470..4d005a77 100644
--- a/package.json
+++ b/package.json
@@ -7,6 +7,7 @@
     "dev": "vite",
     "build": "yarn build:ui && vue-tsc && vite build",
     "build:ui": "yarn workspace @codexteam/ui run build",
+    "build:ui-demo": "yarn workspace @codexteam/ui-demo run build",
     "preview": "vite preview",
     "lint": "eslint",
     "lint:fix": "yarn lint --fix",