form-patterns
About
This Claude Skill provides DaisyUI v5 form components and patterns for building styled forms with Svelte. It includes ready-to-use templates for inputs, selects, textareas, and validation with proper fieldset/legend structure. Use it when you need pre-built form layouts that follow DaisyUI v5's updated class conventions.
Quick Install
Claude Code
Recommended/plugin add https://github.com/spences10/devhub-crmgit clone https://github.com/spences10/devhub-crm.git ~/.claude/skills/form-patternsCopy and paste this command in Claude Code to install this skill
Documentation
Form Patterns
Quick Start
<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>
Core Principles
- v5 structure: Use
fieldset/fieldset-legend(NOT oldform-control/label-text) - Input wrapper:
<label class="input w-full">contains<input class="grow"> - Validation: Add
validatorclass to label for automatic validation UI - Selects/textareas: Apply classes directly (e.g.,
select w-full) - no wrapper - Error handling: Remote functions provide
.errorproperty automatically - Spacing: Use
space-y-4on forms for consistent spacing
Reference Files
- forms-guide.md - Complete DaisyUI v5 form patterns and examples
GitHub Repository
Related Skills
content-collections
MetaThis skill provides a production-tested setup for Content Collections, a TypeScript-first tool that transforms Markdown/MDX files into type-safe data collections with Zod validation. Use it when building blogs, documentation sites, or content-heavy Vite + React applications to ensure type safety and automatic content validation. It covers everything from Vite plugin configuration and MDX compilation to deployment optimization and schema validation.
creating-opencode-plugins
MetaThis skill provides the structure and API specifications for creating OpenCode plugins that hook into 25+ event types like commands, files, and LSP operations. It offers implementation patterns for JavaScript/TypeScript modules that intercept and extend the AI assistant's lifecycle. Use it when you need to build event-driven plugins for monitoring, custom handling, or extending OpenCode's capabilities.
sglang
MetaSGLang is a high-performance LLM serving framework that specializes in fast, structured generation for JSON, regex, and agentic workflows using its RadixAttention prefix caching. It delivers significantly faster inference, especially for tasks with repeated prefixes, making it ideal for complex, structured outputs and multi-turn conversations. Choose SGLang over alternatives like vLLM when you need constrained decoding or are building applications with extensive prefix sharing.
evaluating-llms-harness
TestingThis Claude Skill runs the lm-evaluation-harness to benchmark LLMs across 60+ standardized academic tasks like MMLU and GSM8K. It's designed for developers to compare model quality, track training progress, or report academic results. The tool supports various backends including HuggingFace and vLLM models.
