What problem does it solve? Building consistent forms in the Toollab Nuxt frontend is error-prone: floating labels drift when error messages appear, deep watchers accidentally erase validation errors, and Laravel 422 responses need correct mapping to fields. This Skill codifies the project's locked-in decisions so new or fixed forms behave consistently. ## Core Features & Use Cases - Floating-label inputs: Use the components/form/* components (InputText, InputSelect, InputNumber) or a CSS-only peer/placeholder-shown pattern anchored at top-[19px] for custom fields like autocomplete. - Local validation in two styles: flat error objects for simple pages, or Laravel-compatible { field: [message] } arrays for modals so server errors overwrite local ones without transformation. - 422 error handling: Map err.response.data.errors onto fields, rephrase confusing server messages client-side, and follow the rule of field-level error OR banner — never both. - Use Case: When adding a payment form with a bank autocomplete, amount input with € suffix, and exoneration justification, apply this Skill to get the stepper, native time input, mousedown-based suggestion selection, and double-submit guard right the first time. ## Quick Start Ask the AI to create or fix a Nuxt form in Toollab following the formulaires-validation conventions, including validation and 422 error display.
