with one click
form-patterns
// DaisyUI v5 form patterns. Use for inputs, selects, textareas, validation, and form structure with fieldset/legend.
// DaisyUI v5 form patterns. Use for inputs, selects, textareas, validation, and form structure with fieldset/legend.
Database migration patterns for SQLite. Use when creating migrations, modifying schema, or running database changes.
Remote functions reactive UI patterns. Use for smooth in-place updates, preventing page jumps, and managing loading states with .current property.
SvelteKit patterns for devhub-crm. Use for remote functions (query, form, command), routing, and server-side logic.
Better-auth integration for authentication. Use when implementing login, registration, protected routes, or email verification.
Vitest browser mode component testing. Use for testing Svelte 5 components with real browsers, locators, accessibility patterns, and reactive state.
SQLite operations using better-sqlite3 with prepared statements. Use when implementing CRUD operations, timestamps, and user-scoped queries with row-level security.
| name | form-patterns |
| description | DaisyUI v5 form patterns. Use for inputs, selects, textareas, validation, and form structure with fieldset/legend. |
<form {...my_form} class="space-y-4">
<fieldset class="fieldset">
<legend class="fieldset-legend">Name</legend>
<label class="validator input w-full">
<input
type="text"
name="name"
placeholder="Your name"
class="grow"
required
/>
</label>
</fieldset>
{#if my_form.error}
<div class="alert alert-error">{my_form.error}</div>
{/if}
<button class="btn btn-block btn-primary" type="submit"
>Submit</button
>
</form>
fieldset/fieldset-legend (NOT old
form-control/label-text)<label class="input w-full"> contains
<input class="grow">validator class to label for automatic
validation UIselect w-full) - no wrapper.error property
automaticallyspace-y-4 on forms for consistent spacing