diff --git a/examples/commands-example/demo-config.json b/examples/commands-example/demo-config.json
new file mode 100644
index 000000000..6a0cd7e53
--- /dev/null
+++ b/examples/commands-example/demo-config.json
@@ -0,0 +1,9 @@
+{
+ "dirname": "commands-example",
+ "tags": [
+ "editing",
+ "commands",
+ "vue"
+ ],
+ "title": "Commands Explorer"
+}
diff --git a/examples/commands-example/index.html b/examples/commands-example/index.html
new file mode 100644
index 000000000..5fcbb3a75
--- /dev/null
+++ b/examples/commands-example/index.html
@@ -0,0 +1,12 @@
+
+
+
+
+
+ SuperDoc Commands Explorer
+
+
+
+
+
+
diff --git a/examples/commands-example/package.json b/examples/commands-example/package.json
new file mode 100644
index 000000000..c891cc220
--- /dev/null
+++ b/examples/commands-example/package.json
@@ -0,0 +1,20 @@
+{
+ "name": "commands-superdoc-example",
+ "private": true,
+ "version": "0.0.1",
+ "type": "module",
+ "scripts": {
+ "dev": "vite",
+ "build": "vite build",
+ "preview": "vite preview",
+ "deploy": "npm run build && wrangler pages deploy dist"
+ },
+ "dependencies": {
+ "superdoc": "0.35.3",
+ "vue": "^3.5.13"
+ },
+ "devDependencies": {
+ "@vitejs/plugin-vue": "^4.2.3",
+ "vite": "^4.4.6"
+ }
+}
diff --git a/examples/commands-example/src/App.vue b/examples/commands-example/src/App.vue
new file mode 100644
index 000000000..aab51912c
--- /dev/null
+++ b/examples/commands-example/src/App.vue
@@ -0,0 +1,114 @@
+
+
+
+
+
+
+
diff --git a/examples/commands-example/src/components/CommandsPanel.vue b/examples/commands-example/src/components/CommandsPanel.vue
new file mode 100644
index 000000000..6345e9360
--- /dev/null
+++ b/examples/commands-example/src/components/CommandsPanel.vue
@@ -0,0 +1,725 @@
+
+
+
Commands Explorer
+
+
+
+
+
+
+
+
+
+
+
+
+
+
{{ currentCommand.name }}
+
{{ currentCommand.description }}
+
+
+
+
+
+
+
+
+
+
+ Result:
+
+ {{ lastResult ? 'Success' : 'Failed' }}
+
+
+
+
+
Code:
+
{{ generatedCode }}
+
+
+
+
+
+
+
+
diff --git a/examples/commands-example/src/components/DocumentEditor.vue b/examples/commands-example/src/components/DocumentEditor.vue
new file mode 100644
index 000000000..adbdcbc42
--- /dev/null
+++ b/examples/commands-example/src/components/DocumentEditor.vue
@@ -0,0 +1,114 @@
+
+
+
+
+
+
+
diff --git a/examples/commands-example/src/main.js b/examples/commands-example/src/main.js
new file mode 100644
index 000000000..684d04215
--- /dev/null
+++ b/examples/commands-example/src/main.js
@@ -0,0 +1,4 @@
+import { createApp } from 'vue';
+import App from './App.vue';
+
+createApp(App).mount('#app');
diff --git a/examples/commands-example/vite.config.js b/examples/commands-example/vite.config.js
new file mode 100644
index 000000000..b3f8c4107
--- /dev/null
+++ b/examples/commands-example/vite.config.js
@@ -0,0 +1,9 @@
+import { defineConfig } from 'vite';
+import vue from '@vitejs/plugin-vue';
+
+export default defineConfig({
+ plugins: [vue()],
+ optimizeDeps: {
+ include: ['superdoc']
+ }
+});
\ No newline at end of file
diff --git a/examples/commands-example/wrangler.toml b/examples/commands-example/wrangler.toml
new file mode 100644
index 000000000..403429dcb
--- /dev/null
+++ b/examples/commands-example/wrangler.toml
@@ -0,0 +1,27 @@
+# Cloudflare Pages Configuration
+# Documentation: https://developers.cloudflare.com/pages/
+
+name = "commands-example"
+
+# Uncomment and set if you want to use a custom domain
+# routes = [
+# { pattern = "your-domain.com", custom_domain = true }
+# ]
+
+[build]
+command = "npm run build"
+cwd = "."
+
+[build.upload]
+dir = "dist"
+
+# Environment variables for production
+# [vars]
+# API_URL = "https://api.example.com"
+
+# Preview/staging environment (optional)
+# [env.preview]
+# name = "commands-example-preview"
+
+# Compatibility settings
+compatibility_date = "2024-01-01"