directix 1.5.0 → 1.7.0

package/README.md

@@ -29,6 +29,19 @@ Try it online with StackBlitz or CodeSandbox:
 | Vue 3 | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/saqqdy/directix/tree/master/examples/vue3) | [![Open in CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/saqqdy/directix/tree/master/examples/vue3) |
 | Vue 2 | [![Open in StackBlitz](https://developer.stackblitz.com/img/open_in_stackblitz.svg)](https://stackblitz.com/github/saqqdy/directix/tree/master/examples/vue2) | [![Open in CodeSandbox](https://codesandbox.io/static/img/play-codesandbox.svg)](https://codesandbox.io/p/sandbox/github/saqqdy/directix/tree/master/examples/vue2) |
 
+## Playground
+
+Try the interactive [Playground](https://saqqdy.github.io/directix/playground/) to configure directives and generate code:
+
+- **57+ Directives** - Full coverage of all Directix directives
+- **Vue 2 & Vue 3** - Generate code for either version
+- **Composables** - Generate composable API code
+- **TypeScript Ready** - Full type definitions included
+- **Monaco Editor** - Full-featured code editor with syntax highlighting
+- **Live Preview** - See directive effects in real-time
+
+Each directive documentation page also includes a code generator for quick code snippets.
+
 ## Installation
 
 ```bash
@@ -128,6 +141,66 @@ const { run: debouncedSearch } = useDebounce({ handler: search, wait: 500 })
 
 See the [Composables](#composables) section below for all available composables.
 
+## Nuxt Integration
+
+Directix provides a Nuxt module for seamless integration with Nuxt 3 applications.
+
+### Installation
+
+The Nuxt module is included in the main package. Simply add it to your `nuxt.config.ts`:
+
+```typescript
+// nuxt.config.ts
+export default defineNuxtConfig({
+  modules: ['directix/nuxt'],
+  
+  directix: {
+    // Enable/disable the module (default: true)
+    enabled: true,
+    
+    // Only include specific directives (optional)
+    include: ['v-click-outside', 'v-copy', 'v-debounce'],
+    
+    // Or exclude specific directives (optional)
+    exclude: ['v-ripple'],
+    
+    // Default options for directives (optional)
+    directiveOptions: {
+      'v-permission': {
+        config: {
+          getPermissions: () => ['read', 'write']
+        }
+      }
+    },
+    
+    // Auto-import composables (default: true)
+    autoImportComposables: true
+  }
+})
+```
+
+### Usage in Nuxt
+
+Directives are automatically registered and composables are auto-imported:
+
+```vue
+<template>
+  <div v-click-outside="handleClose">
+    <button v-copy="text">Copy</button>
+  </div>
+</template>
+
+<script setup>
+// Composables are auto-imported, no need to import manually
+const { copy, copied } = useCopy({ source: text })
+const { isHovering } = useHover({ onEnter: handleEnter })
+</script>
+```
+
+### SSR Compatibility
+
+Directives that are not SSR-compatible will only run on the client side. The Nuxt module handles this automatically.
+
 ## Available Directives
 
 ### Event Directives
@@ -1714,6 +1787,51 @@ interface DirectiveInstallOptions {
 
 Each directive accepts different options. See the [documentation](https://github.com/saqqdy/directix#usage-examples) for detailed API.
 
+## Roadmap
+
+### v1.7.0 (2026-04-15) - Visual Configuration Tool ✅
+
+- **Online Playground** - Live editing environment with Vue 2/3 support
+- **Visual Configurator** - Interactive parameter configuration panel
+- **Code Generator** - Generate Vue 2/3/Composable/Nuxt code snippets
+- **Configuration Presets** - Quick-start templates for common use cases
+- **Monaco Editor** - CDN-loaded code editor with syntax highlighting
+- **Live Preview** - Real-time directive effect preview
+
+### v1.8.0 (Planned - 2026-04-22) - Quality & Ecosystem
+
+- **Test Coverage** - 90%+ unit test coverage, E2E testing with Playwright
+- **Performance Optimization** - Bundle size optimization, tree-shaking improvements
+- **VS Code Extension** - Autocompletion, hover documentation, code snippets
+- **CLI Tool** - `directix create`, `directix init`, `directix doctor`, `directix migrate`
+
+### v1.9.0 (Planned - 2026-04-29) - Documentation & Community
+
+- **Interactive Documentation** - Live editing with instant preview
+- **Real-world Examples** - 10+ practical scenario examples
+- **i18n Support** - English, Chinese, Japanese documentation
+- **Developer Experience** - Improved error messages, DevTools integration
+- **Plugin System** - Community extension support
+
+### v1.10.0 (Planned - 2026-05-06) - Vue 3 Optimization & Security
+
+- **Vue 3 Optimization Preview** - Suspense, Teleport support
+- **Mobile Optimization** - Touch gestures, PWA support
+- **Accessibility (A11y)** - ARIA attributes, keyboard navigation
+- **Security Enhancements** - XSS protection, CSP compatibility
+
+### v1.11.0 (Planned - 2026-05-13) - Stability & Enterprise
+
+- **Stability** - Browser compatibility, edge case fixes
+- **Performance Limits** - Bundle ≤ 25KB, memory optimization
+- **Enterprise Features** - Permissions, audit logs, config center
+- **v2.0 Migration Prep** - Migration tool, breaking changes warnings
+
+### v2.0.0 (Future)
+
+- Vue 3 exclusive optimizations
+- Web Components support
+
 ## Browser Support
 
 | Browser | Version |

package/dist/index.cjs

@@ -1,5 +1,5 @@
 /*!
- * directix v1.5.0
+ * directix v1.7.0
  * A comprehensive, easy-to-use, and high-performance Vue custom directives library supporting both Vue 2 and Vue 3
  * (c) 2021-present saqqdy <https://github.com/saqqdy>
  * Released under the MIT License.
@@ -78,7 +78,7 @@ var __async = (__this, __arguments, generator) => {
   });
 };
 /*!
- * directix v1.5.0
+ * directix v1.7.0
  * A comprehensive, easy-to-use, and high-performance Vue custom directives library supporting both Vue 2 and Vue 3
  * (c) 2021-present saqqdy <https://github.com/saqqdy>
  * Released under the MIT License.