Create forms and data collection UIs with @cleen/ui components.
npx skills add https://github.com/shawnlivermore/cleen-ui-skills --skill cleen-ui-forms
Please help me install this Agent Skill. Skill: cleen-ui-forms Source: https://github.com/shawnlivermore/cleen-ui-skills/tree/main/skills/cleen-ui-forms Command: npx skills add https://github.com/shawnlivermore/cleen-ui-skills --skill cleen-ui-forms
This Skill streamlines the process of creating user interfaces for data collection, eliminating the need to manually manage form state, validation, and component rendering.
Input, Select, DatePicker, Switch, CheckboxGroup, and more.useForm for efficient form state tracking and updates.useValidation for robust per-field error handling and display.FormGroup for consistent form row structuring.Use the cleen-ui-forms skill to create a form with fields for name and email, including validation for both.
High-intent search queries and answers about installing and using this skill.
To build forms with state management and input validation, use the cleen-ui-forms skill to leverage `useForm` for state tracking and `useValidation` for per-field error handling, eliminating manual state management. It provides ready-to-use input components like `Input`, `Select`, and `DatePicker`.
The best way to create a multi-step wizard or settings panel UI is using the cleen-ui-forms skill, which offers `FormGroup` layout helpers for consistent row structuring and comprehensive data collection components to ensure a user-friendly experience without manual rendering.
Yes, you can use this approach for edit dialogs, filter forms, settings panels, and multi-step wizards. The cleen-ui-forms skill enables the creation of any UI requiring user input by providing ready-to-use components like `Switch`, `CheckboxGroup`, and `DatePicker`.
To handle per-field errors when creating data collection UIs, use the `useValidation` hook provided by the cleen-ui-forms skill. It offers robust error handling and display capabilities, ensuring consistent validation across form components without manual error tracking logic.
No, you do not need to manually manage component rendering for form layouts. The cleen-ui-forms skill includes `FormGroup` layout helpers for consistent form row structuring and integrates `useForm` to handle efficient form state updates automatically.
shawnlivermoreInstall and configure Cleen UI monorepo packages with React 18 and react-router-dom v6.
Moksa1123Generate and validate payment orders for ECPay, NewebPay, and PAYUNi.
shawnlivermoreSelect the appropriate @cleen/ui component for UI elements using component-index.md and decision-guide.md.
vaadinBind Vaadin 25 UI fields to Java beans with Binder validation.