Vue Form Craft is an AI-driven form design system for Vue 3 applications, comprising a visual drag-and-drop designer (FormDesign) and a schema-based renderer (FormRender). It targets Vue.js developers seeking to accelerate form creation by leveraging visual tools, schema definitions, and AI assistance for generating and modifying form structures, ultimately simplifying complex form development.

How It Works

The core architecture separates design from rendering. FormDesign allows users to visually construct forms, outputting a JSON Schema. FormRender then takes this schema to dynamically render the form components. This approach supports complex conditional logic through JavaScript expressions and data/attribute bindings, handles array fields and deep nesting via FormList, and integrates AI for schema generation or modification, offering a flexible and powerful form development paradigm.

Quick Start & Requirements

• Install: npm i vue-form-craft
• Prerequisites: Vue 3, Node.js. The default Element Plus UI adapter requires Element Plus to be installed and registered separately. Ant Design Vue is also supported via an adapter.
• Usage: Global registration of the plugin, optionally configuring the UI adapter. AI functionality can be integrated by providing a custom AI function during setup.
• Links: Online Demo: https://elin521.cn:3006/form-design.html, Documentation: https://elin521.cn:3006/

Highlighted Details

• AI-assisted generation and modification of form JSON Schemas.
• Robust support for complex dynamic behavior, including JS expressions for logic and data/attribute linkage.
• FormList component enables handling of array fields and deep form nesting.
• Comprehensive validation capabilities, supporting built-in rules, custom validators, and JS expressions.
• Extensible component system with adapters for popular UI libraries like Element Plus and Ant Design Vue.

Maintenance & Community

No specific details regarding maintainers, community channels (e.g., Discord, Slack), or project roadmap were provided in the README content.

Licensing & Compatibility

The specific open-source license for this project is not explicitly stated in the provided README content. This omission requires further investigation before commercial adoption or integration into closed-source projects.

Limitations & Caveats

The AI integration requires a backend API endpoint and configuration, as demonstrated in the provided example. No other explicit limitations, such as alpha status or known bugs, were mentioned.