feat: Generate from web-types.json

AGENTS.md

@@ -0,0 +1,151 @@
+# AGENTS.md - Nebula Code Generator
+
+> **Project**: Nebula - WebAwesome UI Library code generator for Go Templ
+> **Module**: `github.com/sonr-io/nebula`
+> **Go Version**: 1.25.5
+
+## Build Commands
+
+```bash
+go build -o nebula ./cmd/generate                           # Build binary
+go run ./cmd/generate -input config.json -output pkg/wa     # Run generator
+go run ./cmd/generate -input config.json -output pkg/wa -verbose  # Verbose
+```
+
+## Test Commands
+
+```bash
+go test ./...                                    # Run all tests
+go test -v ./internal/generator                  # Single package
+go test -v ./internal/generator -run TestToPascalCase  # Single test by name
+go test -cover ./...                             # With coverage
+go test -coverprofile=coverage.out ./... && go tool cover -html=coverage.out
+```
+
+## Lint/Format
+
+```bash
+go fmt ./...          # Format
+gofmt -s -w .         # Format with simplify
+go vet ./...          # Vet
+staticcheck ./...     # Static analysis (if installed)
+golangci-lint run     # Comprehensive lint (if installed)
+```
+
+## Project Structure
+
+```
+cmd/generate/main.go              # CLI entry point
+internal/generator/generator.go   # Code generation with text/template
+internal/generator/strings.go     # String utilities (case conversion)
+internal/parser/types.go          # JSON schema types
+config.json                       # WebAwesome web-types.json input
+```
+
+## Code Style
+
+### Naming
+
+| Element | Style | Example |
+|---------|-------|---------|
+| Exported | PascalCase | `Generator`, `ToPascalCase` |
+| Unexported | camelCase | `funcMap`, `hasSlots` |
+| Struct fields | PascalCase | `Element.Name` |
+| JSON tags | kebab-case | `json:"doc-url"` |
+| Files | lowercase | `strings.go` |
+| Packages | lowercase, single word | `generator` |
+
+### Imports
+
+Standard library → blank line → external → blank line → internal:
+
+```go
+import (
+    "bytes"
+    "fmt"
+    "os"
+
+    "github.com/sonr-io/nebula/internal/parser"
+)
+```
+
+### Error Handling
+
+```go
+// Good: wrap with context
+if err := tmpl.Execute(&buf, data); err != nil {
+    return fmt.Errorf("executing template: %w", err)
+}
+
+// Bad: don't just log
+if err != nil { log.Println(err) }
+```
+
+### Documentation
+
+All exported functions MUST have doc comments starting with function name:
+
+```go
+// ToPascalCase converts kebab-case or snake_case to PascalCase
+func ToPascalCase(s string) string {
+```
+
+### Struct Tags
+
+```go
+type Attribute struct {
+    Name        string         `json:"name"`
+    Description string         `json:"description,omitempty"`
+}
+```
+
+## Generator CLI Flags
+
+| Flag | Default | Description |
+|------|---------|-------------|
+| `-input` | `web-types.json` | Input web-types.json path |
+| `-output` | `pkg/wa` | Output directory |
+| `-package` | `wa` | Generated package name |
+| `-verbose` | `false` | Verbose output |
+
+## Template Conventions
+
+- Templates defined as string constants in `generator.go`
+- Register functions via `template.FuncMap` in `generator.New()`
+- Generated files header: `// Code generated by wa-generator. DO NOT EDIT.`
+
+## Testing
+
+Use table-driven tests:
+
+```go
+func TestToPascalCase(t *testing.T) {
+    tests := []struct{ input, want string }{
+        {"wa-button", "WaButton"},
+        {"", ""},
+    }
+    for _, tt := range tests {
+        if got := ToPascalCase(tt.input); got != tt.want {
+            t.Errorf("ToPascalCase(%q) = %q, want %q", tt.input, got, tt.want)
+        }
+    }
+}
+```
+
+## Generated Outputs
+
+| File | Purpose |
+|------|---------|
+| `{component}.templ` | Individual component files |
+| `types.go` | Shared types (Variant, Size, etc.) |
+| `builders.go` | Builder pattern helpers |
+| `cdn.templ` | CDN loader templates |
+| `events.go` | Event constants and handlers |
+
+## Do NOT
+
+- Use `panic()` for recoverable errors - return errors
+- Modify generated files - edit templates instead
+- Use global variables - use struct methods
+- Commit generated files without running generator
+- Suppress type errors with unsafe patterns

devbox.json

@@ -0,0 +1,14 @@
+{
+  "$schema":  "https://raw.githubusercontent.com/jetify-com/devbox/0.16.0/.schema/devbox.schema.json",
+  "packages": ["templ@latest"],
+  "shell": {
+    "init_hook": [
+      "echo 'Welcome to devbox!' > /dev/null"
+    ],
+    "scripts": {
+      "test": [
+        "echo \"Error: no test specified\" && exit 1"
+      ]
+    }
+  }
+}

devbox.lock

@@ -0,0 +1,53 @@
+{
+  "lockfile_version": "1",
+  "packages": {
+    "templ@latest": {
+      "last_modified": "2025-11-23T21:50:36Z",
+      "resolved": "github:NixOS/nixpkgs/ee09932cedcef15aaf476f9343d1dea2cb77e261#templ",
+      "source": "devbox-search",
+      "version": "0.3.960",
+      "systems": {
+        "aarch64-darwin": {
+          "outputs": [
+            {
+              "name": "out",
+              "path": "/nix/store/lk4nhispzqgdahrwjhy2gvsb5s0ba47k-templ-0.3.960",
+              "default": true
+            }
+          ],
+          "store_path": "/nix/store/lk4nhispzqgdahrwjhy2gvsb5s0ba47k-templ-0.3.960"
+        },
+        "aarch64-linux": {
+          "outputs": [
+            {
+              "name": "out",
+              "path": "/nix/store/yybzygyj99dhf256dk346z8hxv8vsai5-templ-0.3.960",
+              "default": true
+            }
+          ],
+          "store_path": "/nix/store/yybzygyj99dhf256dk346z8hxv8vsai5-templ-0.3.960"
+        },
+        "x86_64-darwin": {
+          "outputs": [
+            {
+              "name": "out",
+              "path": "/nix/store/lzm0pclc2axwh0v6vyqinp98ikl52csf-templ-0.3.960",
+              "default": true
+            }
+          ],
+          "store_path": "/nix/store/lzm0pclc2axwh0v6vyqinp98ikl52csf-templ-0.3.960"
+        },
+        "x86_64-linux": {
+          "outputs": [
+            {
+              "name": "out",
+              "path": "/nix/store/arv446admjsgwr64gxam4s4m02kmy3bs-templ-0.3.960",
+              "default": true
+            }
+          ],
+          "store_path": "/nix/store/arv446admjsgwr64gxam4s4m02kmy3bs-templ-0.3.960"
+        }
+      }
+    }
+  }
+}

go.mod

@@ -1,3 +1,5 @@
 module github.com/sonr-io/nebula
 
 go 1.25.5
+
+require github.com/a-h/templ v0.3.977 // indirect

go.sum

@@ -0,0 +1,2 @@
+github.com/a-h/templ v0.3.977 h1:kiKAPXTZE2Iaf8JbtM21r54A8bCNsncrfnokZZSrSDg=
+github.com/a-h/templ v0.3.977/go.mod h1:oCZcnKRf5jjsGpf2yELzQfodLphd2mwecwG4Crk5HBo=

internal/generator/generator.go

@@ -85,7 +85,7 @@ var componentTemplate = `// Code generated by wa-generator. DO NOT EDIT.
 package {{ .Package }}
 
 import (
-	"github.com/a]h/templ"
+	"github.com/a-h/templ"
 )
 
 {{- $name := stripWa .Element.Name | toPascal }}

pkg/wa/animated-image.templ

@@ -0,0 +1,173 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-animated-image
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// A component for displaying animated GIFs and WEBPs that play and pause on interaction.
+//
+// Web Awesome component: <wa-animated-image>
+
+// AnimatedImageProps holds all properties for the wa-animated-image component
+type AnimatedImageProps struct {
+	// The path to the image to load.
+	Src string `attr:"src"`
+	// A description of the image used by assistive devices.
+	Alt string `attr:"alt"`
+	// Plays the animation. When this attribute is remove, the animation will pause.
+	Play bool `attr:"play"`
+
+	// Events
+	// Emitted when the image loads successfully.
+	OnLoad string `attr:"x-on:wa-load"`
+	// Emitted when the image fails to load.
+	OnError string `attr:"x-on:wa-error"`
+
+	// Slots contains named slot content
+	Slots AnimatedImageSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// AnimatedImageSlots holds named slot content for the component
+type AnimatedImageSlots struct {
+	// Optional play icon to use instead of the default. Works best with <wa-icon>.
+	PlayIcon templ.Component
+	// Optional pause icon to use instead of the default. Works best with <wa-icon>.
+	PauseIcon templ.Component
+}
+
+// AnimatedImageBuilder provides a fluent API for constructing AnimatedImageProps
+type AnimatedImageBuilder struct {
+	props AnimatedImageProps
+}
+
+// NewAnimatedImage creates a new builder for wa-animated-image
+func NewAnimatedImage() *AnimatedImageBuilder {
+	return &AnimatedImageBuilder{}
+}
+
+// Src sets the src attribute
+// The path to the image to load.
+func (b *AnimatedImageBuilder) Src(v string) *AnimatedImageBuilder {
+	b.props.Src = v
+	return b
+}
+
+// Alt sets the alt attribute
+// A description of the image used by assistive devices.
+func (b *AnimatedImageBuilder) Alt(v string) *AnimatedImageBuilder {
+	b.props.Alt = v
+	return b
+}
+
+// Play sets the play attribute
+// Plays the animation. When this attribute is remove, the animation will pause.
+func (b *AnimatedImageBuilder) Play(v bool) *AnimatedImageBuilder {
+	b.props.Play = v
+	return b
+}
+
+// OnLoad sets the handler for wa-load event
+// Emitted when the image loads successfully.
+func (b *AnimatedImageBuilder) OnLoad(handler string) *AnimatedImageBuilder {
+	b.props.OnLoad = handler
+	return b
+}
+
+// OnError sets the handler for wa-error event
+// Emitted when the image fails to load.
+func (b *AnimatedImageBuilder) OnError(handler string) *AnimatedImageBuilder {
+	b.props.OnError = handler
+	return b
+}
+
+// PlayIconSlot sets the play-icon slot content
+// Optional play icon to use instead of the default. Works best with <wa-icon>.
+func (b *AnimatedImageBuilder) PlayIconSlot(c templ.Component) *AnimatedImageBuilder {
+	b.props.Slots.PlayIcon = c
+	return b
+}
+
+// PauseIconSlot sets the pause-icon slot content
+// Optional pause icon to use instead of the default. Works best with <wa-icon>.
+func (b *AnimatedImageBuilder) PauseIconSlot(c templ.Component) *AnimatedImageBuilder {
+	b.props.Slots.PauseIcon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *AnimatedImageBuilder) Attr(name, value string) *AnimatedImageBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *AnimatedImageBuilder) Attrs(attrs templ.Attributes) *AnimatedImageBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *AnimatedImageBuilder) Props() AnimatedImageProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *AnimatedImageBuilder) Build() AnimatedImageProps {
+	return b.props
+}
+
+// AnimatedImage renders the wa-animated-image component
+templ AnimatedImage(props AnimatedImageProps) {
+	<wa-animated-image
+		if props.Src != "" {
+			src={ props.Src }
+		}
+		if props.Alt != "" {
+			alt={ props.Alt }
+		}
+		if props.Play {
+			play
+		}
+		if props.OnLoad != "" {
+			x-on:wa-load={ props.OnLoad }
+		}
+		if props.OnError != "" {
+			x-on:wa-error={ props.OnError }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.PlayIcon != nil {
+			<div slot="play-icon">
+				@props.Slots.PlayIcon
+			</div>
+		}
+		if props.Slots.PauseIcon != nil {
+			<div slot="pause-icon">
+				@props.Slots.PauseIcon
+			</div>
+		}
+		{ children... }
+	</wa-animated-image>
+}
+
+// AnimatedImageFunc renders with a builder function for inline configuration
+templ AnimatedImageFunc(fn func(*AnimatedImageBuilder)) {
+	{{ b := NewAnimatedImage(); fn(b) }}
+	@AnimatedImage(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/animated-image_templ.go

@@ -0,0 +1,348 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-animated-image
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// A component for displaying animated GIFs and WEBPs that play and pause on interaction.
+//
+// Web Awesome component: <wa-animated-image>
+
+// AnimatedImageProps holds all properties for the wa-animated-image component
+type AnimatedImageProps struct {
+	// The path to the image to load.
+	Src string `attr:"src"`
+	// A description of the image used by assistive devices.
+	Alt string `attr:"alt"`
+	// Plays the animation. When this attribute is remove, the animation will pause.
+	Play bool `attr:"play"`
+
+	// Events
+	// Emitted when the image loads successfully.
+	OnLoad string `attr:"x-on:wa-load"`
+	// Emitted when the image fails to load.
+	OnError string `attr:"x-on:wa-error"`
+
+	// Slots contains named slot content
+	Slots AnimatedImageSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// AnimatedImageSlots holds named slot content for the component
+type AnimatedImageSlots struct {
+	// Optional play icon to use instead of the default. Works best with <wa-icon>.
+	PlayIcon templ.Component
+	// Optional pause icon to use instead of the default. Works best with <wa-icon>.
+	PauseIcon templ.Component
+}
+
+// AnimatedImageBuilder provides a fluent API for constructing AnimatedImageProps
+type AnimatedImageBuilder struct {
+	props AnimatedImageProps
+}
+
+// NewAnimatedImage creates a new builder for wa-animated-image
+func NewAnimatedImage() *AnimatedImageBuilder {
+	return &AnimatedImageBuilder{}
+}
+
+// Src sets the src attribute
+// The path to the image to load.
+func (b *AnimatedImageBuilder) Src(v string) *AnimatedImageBuilder {
+	b.props.Src = v
+	return b
+}
+
+// Alt sets the alt attribute
+// A description of the image used by assistive devices.
+func (b *AnimatedImageBuilder) Alt(v string) *AnimatedImageBuilder {
+	b.props.Alt = v
+	return b
+}
+
+// Play sets the play attribute
+// Plays the animation. When this attribute is remove, the animation will pause.
+func (b *AnimatedImageBuilder) Play(v bool) *AnimatedImageBuilder {
+	b.props.Play = v
+	return b
+}
+
+// OnLoad sets the handler for wa-load event
+// Emitted when the image loads successfully.
+func (b *AnimatedImageBuilder) OnLoad(handler string) *AnimatedImageBuilder {
+	b.props.OnLoad = handler
+	return b
+}
+
+// OnError sets the handler for wa-error event
+// Emitted when the image fails to load.
+func (b *AnimatedImageBuilder) OnError(handler string) *AnimatedImageBuilder {
+	b.props.OnError = handler
+	return b
+}
+
+// PlayIconSlot sets the play-icon slot content
+// Optional play icon to use instead of the default. Works best with <wa-icon>.
+func (b *AnimatedImageBuilder) PlayIconSlot(c templ.Component) *AnimatedImageBuilder {
+	b.props.Slots.PlayIcon = c
+	return b
+}
+
+// PauseIconSlot sets the pause-icon slot content
+// Optional pause icon to use instead of the default. Works best with <wa-icon>.
+func (b *AnimatedImageBuilder) PauseIconSlot(c templ.Component) *AnimatedImageBuilder {
+	b.props.Slots.PauseIcon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *AnimatedImageBuilder) Attr(name, value string) *AnimatedImageBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *AnimatedImageBuilder) Attrs(attrs templ.Attributes) *AnimatedImageBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *AnimatedImageBuilder) Props() AnimatedImageProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *AnimatedImageBuilder) Build() AnimatedImageProps {
+	return b.props
+}
+
+// AnimatedImage renders the wa-animated-image component
+func AnimatedImage(props AnimatedImageProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-animated-image")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Src != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " src=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Src)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animated-image.templ`, Line: 137, Col: 18}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Alt != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " alt=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Alt)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animated-image.templ`, Line: 140, Col: 18}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Play {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " play")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnLoad != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " x-on:wa-load=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnLoad)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animated-image.templ`, Line: 146, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnError != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " x-on:wa-error=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnError)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animated-image.templ`, Line: 149, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.PlayIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "<div slot=\"play-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.PlayIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.PauseIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "<div slot=\"pause-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.PauseIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "</wa-animated-image>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// AnimatedImageFunc renders with a builder function for inline configuration
+func AnimatedImageFunc(fn func(*AnimatedImageBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var6 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var6 == nil {
+			templ_7745c5c3_Var6 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewAnimatedImage()
+		fn(b)
+		templ_7745c5c3_Var7 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var6.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = AnimatedImage(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var7), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/animation.templ

@@ -0,0 +1,249 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-animation
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Animate elements declaratively with nearly 100 baked-in presets, or roll your own with custom keyframes. Powered by t...
+//
+// Web Awesome component: <wa-animation>
+
+// AnimationProps holds all properties for the wa-animation component
+type AnimationProps struct {
+	// The name of the built-in animation to use. For custom animations, use the keyframes prop.
+	Name string `attr:"name"`
+	// Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when
+	Play bool `attr:"play"`
+	// The number of milliseconds to delay the start of the animation.
+	Delay float64 `attr:"delay"`
+	// Determines the direction of playback as well as the behavior when reaching the end of an iteration.
+	Direction string `attr:"direction"`
+	// The number of milliseconds each iteration of the animation takes to complete.
+	Duration float64 `attr:"duration"`
+	// The easing function to use for the animation. This can be a Web Awesome easing function or a custom easing function
+	Easing string `attr:"easing"`
+	// The number of milliseconds to delay after the active period of an animation sequence.
+	EndDelay float64 `attr:"end-delay"`
+	// Sets how the animation applies styles to its target before and after its execution.
+	Fill string `attr:"fill"`
+	// The number of iterations to run before the animation completes. Defaults to Infinity, which loops.
+	Iterations float64 `attr:"iterations"`
+	// The offset at which to start the animation, usually between 0 (start) and 1 (end).
+	IterationStart float64 `attr:"iteration-start"`
+	// Sets the animation's playback rate. The default is 1, which plays the animation at a normal speed. Setting this
+	PlaybackRate float64 `attr:"playback-rate"`
+
+	// Events
+	// Emitted when the animation is canceled.
+	OnCancel string `attr:"x-on:wa-cancel"`
+	// Emitted when the animation finishes.
+	OnFinish string `attr:"x-on:wa-finish"`
+	// Emitted when the animation starts or restarts.
+	OnStart string `attr:"x-on:wa-start"`
+
+	// Slots contains named slot content
+	Slots AnimationSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// AnimationBuilder provides a fluent API for constructing AnimationProps
+type AnimationBuilder struct {
+	props AnimationProps
+}
+
+// NewAnimation creates a new builder for wa-animation
+func NewAnimation() *AnimationBuilder {
+	return &AnimationBuilder{}
+}
+
+// Name sets the name attribute
+// The name of the built-in animation to use. For custom animations, use the keyframes prop.
+func (b *AnimationBuilder) Name(v string) *AnimationBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Play sets the play attribute
+// Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when
+func (b *AnimationBuilder) Play(v bool) *AnimationBuilder {
+	b.props.Play = v
+	return b
+}
+
+// Delay sets the delay attribute
+// The number of milliseconds to delay the start of the animation.
+func (b *AnimationBuilder) Delay(v float64) *AnimationBuilder {
+	b.props.Delay = v
+	return b
+}
+
+// Direction sets the direction attribute
+// Determines the direction of playback as well as the behavior when reaching the end of an iteration.
+func (b *AnimationBuilder) Direction(v string) *AnimationBuilder {
+	b.props.Direction = v
+	return b
+}
+
+// Duration sets the duration attribute
+// The number of milliseconds each iteration of the animation takes to complete.
+func (b *AnimationBuilder) Duration(v float64) *AnimationBuilder {
+	b.props.Duration = v
+	return b
+}
+
+// Easing sets the easing attribute
+// The easing function to use for the animation. This can be a Web Awesome easing function or a custom easing function
+func (b *AnimationBuilder) Easing(v string) *AnimationBuilder {
+	b.props.Easing = v
+	return b
+}
+
+// EndDelay sets the end-delay attribute
+// The number of milliseconds to delay after the active period of an animation sequence.
+func (b *AnimationBuilder) EndDelay(v float64) *AnimationBuilder {
+	b.props.EndDelay = v
+	return b
+}
+
+// Fill sets the fill attribute
+// Sets how the animation applies styles to its target before and after its execution.
+func (b *AnimationBuilder) Fill(v string) *AnimationBuilder {
+	b.props.Fill = v
+	return b
+}
+
+// Iterations sets the iterations attribute
+// The number of iterations to run before the animation completes. Defaults to Infinity, which loops.
+func (b *AnimationBuilder) Iterations(v float64) *AnimationBuilder {
+	b.props.Iterations = v
+	return b
+}
+
+// IterationStart sets the iteration-start attribute
+// The offset at which to start the animation, usually between 0 (start) and 1 (end).
+func (b *AnimationBuilder) IterationStart(v float64) *AnimationBuilder {
+	b.props.IterationStart = v
+	return b
+}
+
+// PlaybackRate sets the playback-rate attribute
+// Sets the animation's playback rate. The default is 1, which plays the animation at a normal speed. Setting this
+func (b *AnimationBuilder) PlaybackRate(v float64) *AnimationBuilder {
+	b.props.PlaybackRate = v
+	return b
+}
+
+// OnCancel sets the handler for wa-cancel event
+// Emitted when the animation is canceled.
+func (b *AnimationBuilder) OnCancel(handler string) *AnimationBuilder {
+	b.props.OnCancel = handler
+	return b
+}
+
+// OnFinish sets the handler for wa-finish event
+// Emitted when the animation finishes.
+func (b *AnimationBuilder) OnFinish(handler string) *AnimationBuilder {
+	b.props.OnFinish = handler
+	return b
+}
+
+// OnStart sets the handler for wa-start event
+// Emitted when the animation starts or restarts.
+func (b *AnimationBuilder) OnStart(handler string) *AnimationBuilder {
+	b.props.OnStart = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *AnimationBuilder) Attr(name, value string) *AnimationBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *AnimationBuilder) Attrs(attrs templ.Attributes) *AnimationBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *AnimationBuilder) Props() AnimationProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *AnimationBuilder) Build() AnimationProps {
+	return b.props
+}
+
+// Animation renders the wa-animation component
+templ Animation(props AnimationProps) {
+	<wa-animation
+		if props.Name != "" {
+			name={ props.Name }
+		}
+		if props.Play {
+			play
+		}
+		if props.Delay != 0 {
+			delay={ templ.Sprintf("%v", props.Delay) }
+		}
+		if props.Direction != "" {
+			direction={ props.Direction }
+		}
+		if props.Duration != 0 {
+			duration={ templ.Sprintf("%v", props.Duration) }
+		}
+		if props.Easing != "" {
+			easing={ props.Easing }
+		}
+		if props.EndDelay != 0 {
+			end-delay={ templ.Sprintf("%v", props.EndDelay) }
+		}
+		if props.Fill != "" {
+			fill={ props.Fill }
+		}
+		if props.Iterations != 0 {
+			iterations={ templ.Sprintf("%v", props.Iterations) }
+		}
+		if props.IterationStart != 0 {
+			iteration-start={ templ.Sprintf("%v", props.IterationStart) }
+		}
+		if props.PlaybackRate != 0 {
+			playback-rate={ templ.Sprintf("%v", props.PlaybackRate) }
+		}
+		if props.OnCancel != "" {
+			x-on:wa-cancel={ props.OnCancel }
+		}
+		if props.OnFinish != "" {
+			x-on:wa-finish={ props.OnFinish }
+		}
+		if props.OnStart != "" {
+			x-on:wa-start={ props.OnStart }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-animation>
+}
+
+// AnimationFunc renders with a builder function for inline configuration
+templ AnimationFunc(fn func(*AnimationBuilder)) {
+	{{ b := NewAnimation(); fn(b) }}
+	@Animation(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/animation_templ.go

@@ -0,0 +1,550 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-animation
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Animate elements declaratively with nearly 100 baked-in presets, or roll your own with custom keyframes. Powered by t...
+//
+// Web Awesome component: <wa-animation>
+
+// AnimationProps holds all properties for the wa-animation component
+type AnimationProps struct {
+	// The name of the built-in animation to use. For custom animations, use the keyframes prop.
+	Name string `attr:"name"`
+	// Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when
+	Play bool `attr:"play"`
+	// The number of milliseconds to delay the start of the animation.
+	Delay float64 `attr:"delay"`
+	// Determines the direction of playback as well as the behavior when reaching the end of an iteration.
+	Direction string `attr:"direction"`
+	// The number of milliseconds each iteration of the animation takes to complete.
+	Duration float64 `attr:"duration"`
+	// The easing function to use for the animation. This can be a Web Awesome easing function or a custom easing function
+	Easing string `attr:"easing"`
+	// The number of milliseconds to delay after the active period of an animation sequence.
+	EndDelay float64 `attr:"end-delay"`
+	// Sets how the animation applies styles to its target before and after its execution.
+	Fill string `attr:"fill"`
+	// The number of iterations to run before the animation completes. Defaults to Infinity, which loops.
+	Iterations float64 `attr:"iterations"`
+	// The offset at which to start the animation, usually between 0 (start) and 1 (end).
+	IterationStart float64 `attr:"iteration-start"`
+	// Sets the animation's playback rate. The default is 1, which plays the animation at a normal speed. Setting this
+	PlaybackRate float64 `attr:"playback-rate"`
+
+	// Events
+	// Emitted when the animation is canceled.
+	OnCancel string `attr:"x-on:wa-cancel"`
+	// Emitted when the animation finishes.
+	OnFinish string `attr:"x-on:wa-finish"`
+	// Emitted when the animation starts or restarts.
+	OnStart string `attr:"x-on:wa-start"`
+
+	// Slots contains named slot content
+	Slots AnimationSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// AnimationBuilder provides a fluent API for constructing AnimationProps
+type AnimationBuilder struct {
+	props AnimationProps
+}
+
+// NewAnimation creates a new builder for wa-animation
+func NewAnimation() *AnimationBuilder {
+	return &AnimationBuilder{}
+}
+
+// Name sets the name attribute
+// The name of the built-in animation to use. For custom animations, use the keyframes prop.
+func (b *AnimationBuilder) Name(v string) *AnimationBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Play sets the play attribute
+// Plays the animation. When omitted, the animation will be paused. This attribute will be automatically removed when
+func (b *AnimationBuilder) Play(v bool) *AnimationBuilder {
+	b.props.Play = v
+	return b
+}
+
+// Delay sets the delay attribute
+// The number of milliseconds to delay the start of the animation.
+func (b *AnimationBuilder) Delay(v float64) *AnimationBuilder {
+	b.props.Delay = v
+	return b
+}
+
+// Direction sets the direction attribute
+// Determines the direction of playback as well as the behavior when reaching the end of an iteration.
+func (b *AnimationBuilder) Direction(v string) *AnimationBuilder {
+	b.props.Direction = v
+	return b
+}
+
+// Duration sets the duration attribute
+// The number of milliseconds each iteration of the animation takes to complete.
+func (b *AnimationBuilder) Duration(v float64) *AnimationBuilder {
+	b.props.Duration = v
+	return b
+}
+
+// Easing sets the easing attribute
+// The easing function to use for the animation. This can be a Web Awesome easing function or a custom easing function
+func (b *AnimationBuilder) Easing(v string) *AnimationBuilder {
+	b.props.Easing = v
+	return b
+}
+
+// EndDelay sets the end-delay attribute
+// The number of milliseconds to delay after the active period of an animation sequence.
+func (b *AnimationBuilder) EndDelay(v float64) *AnimationBuilder {
+	b.props.EndDelay = v
+	return b
+}
+
+// Fill sets the fill attribute
+// Sets how the animation applies styles to its target before and after its execution.
+func (b *AnimationBuilder) Fill(v string) *AnimationBuilder {
+	b.props.Fill = v
+	return b
+}
+
+// Iterations sets the iterations attribute
+// The number of iterations to run before the animation completes. Defaults to Infinity, which loops.
+func (b *AnimationBuilder) Iterations(v float64) *AnimationBuilder {
+	b.props.Iterations = v
+	return b
+}
+
+// IterationStart sets the iteration-start attribute
+// The offset at which to start the animation, usually between 0 (start) and 1 (end).
+func (b *AnimationBuilder) IterationStart(v float64) *AnimationBuilder {
+	b.props.IterationStart = v
+	return b
+}
+
+// PlaybackRate sets the playback-rate attribute
+// Sets the animation's playback rate. The default is 1, which plays the animation at a normal speed. Setting this
+func (b *AnimationBuilder) PlaybackRate(v float64) *AnimationBuilder {
+	b.props.PlaybackRate = v
+	return b
+}
+
+// OnCancel sets the handler for wa-cancel event
+// Emitted when the animation is canceled.
+func (b *AnimationBuilder) OnCancel(handler string) *AnimationBuilder {
+	b.props.OnCancel = handler
+	return b
+}
+
+// OnFinish sets the handler for wa-finish event
+// Emitted when the animation finishes.
+func (b *AnimationBuilder) OnFinish(handler string) *AnimationBuilder {
+	b.props.OnFinish = handler
+	return b
+}
+
+// OnStart sets the handler for wa-start event
+// Emitted when the animation starts or restarts.
+func (b *AnimationBuilder) OnStart(handler string) *AnimationBuilder {
+	b.props.OnStart = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *AnimationBuilder) Attr(name, value string) *AnimationBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *AnimationBuilder) Attrs(attrs templ.Attributes) *AnimationBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *AnimationBuilder) Props() AnimationProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *AnimationBuilder) Build() AnimationProps {
+	return b.props
+}
+
+// Animation renders the wa-animation component
+func Animation(props AnimationProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-animation")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Name != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 196, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Play {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " play")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Delay != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " delay=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Delay))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 202, Col: 43}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Direction != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " direction=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Direction)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 205, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Duration != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " duration=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Duration))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 208, Col: 49}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Easing != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " easing=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.Easing)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 211, Col: 24}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.EndDelay != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " end-delay=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.EndDelay))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 214, Col: 50}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Fill != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, " fill=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.Fill)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 217, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Iterations != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, " iterations=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Iterations))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 220, Col: 53}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.IterationStart != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, " iteration-start=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.IterationStart))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 223, Col: 62}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.PlaybackRate != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, " playback-rate=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var11 string
+			templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.PlaybackRate))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 226, Col: 58}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnCancel != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, " x-on:wa-cancel=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var12 string
+			templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnCancel)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 229, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnFinish != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, " x-on:wa-finish=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var13 string
+			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnFinish)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 232, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnStart != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, " x-on:wa-start=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var14 string
+			templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnStart)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/animation.templ`, Line: 235, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, "</wa-animation>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// AnimationFunc renders with a builder function for inline configuration
+func AnimationFunc(fn func(*AnimationBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var15 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var15 == nil {
+			templ_7745c5c3_Var15 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewAnimation()
+		fn(b)
+		templ_7745c5c3_Var16 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var15.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Animation(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var16), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/avatar.templ

@@ -0,0 +1,173 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-avatar
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Avatars are used to represent a person or object.
+//
+// Web Awesome component: <wa-avatar>
+
+// AvatarProps holds all properties for the wa-avatar component
+type AvatarProps struct {
+	// The image source to use for the avatar.
+	Image string `attr:"image"`
+	// A label to use to describe the avatar to assistive devices.
+	Label string `attr:"label"`
+	// Initials to use as a fallback when no image is available (1-2 characters max recommended).
+	Initials string `attr:"initials"`
+	// Indicates how the browser should load the image.
+	// Valid values: "eager", "lazy"
+	Loading string `attr:"loading"`
+	// The shape of the avatar.
+	// Valid values: "circle", "square", "rounded"
+	Shape string `attr:"shape"`
+
+	// Events
+	// The image could not be loaded. This may because of an invalid URL, a temporary network condition, or some unknown cause.
+	OnError string `attr:"x-on:wa-error"`
+
+	// Slots contains named slot content
+	Slots AvatarSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// AvatarSlots holds named slot content for the component
+type AvatarSlots struct {
+	// The default icon to use when no image or initials are present. Works best with <wa-icon>.
+	Icon templ.Component
+}
+
+// AvatarBuilder provides a fluent API for constructing AvatarProps
+type AvatarBuilder struct {
+	props AvatarProps
+}
+
+// NewAvatar creates a new builder for wa-avatar
+func NewAvatar() *AvatarBuilder {
+	return &AvatarBuilder{}
+}
+
+// Image sets the image attribute
+// The image source to use for the avatar.
+func (b *AvatarBuilder) Image(v string) *AvatarBuilder {
+	b.props.Image = v
+	return b
+}
+
+// Label sets the label attribute
+// A label to use to describe the avatar to assistive devices.
+func (b *AvatarBuilder) Label(v string) *AvatarBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Initials sets the initials attribute
+// Initials to use as a fallback when no image is available (1-2 characters max recommended).
+func (b *AvatarBuilder) Initials(v string) *AvatarBuilder {
+	b.props.Initials = v
+	return b
+}
+
+// Loading sets the loading attribute
+// Indicates how the browser should load the image.
+func (b *AvatarBuilder) Loading(v string) *AvatarBuilder {
+	b.props.Loading = v
+	return b
+}
+
+// Shape sets the shape attribute
+// The shape of the avatar.
+func (b *AvatarBuilder) Shape(v string) *AvatarBuilder {
+	b.props.Shape = v
+	return b
+}
+
+// OnError sets the handler for wa-error event
+// The image could not be loaded. This may because of an invalid URL, a temporary network condition, or some unknown cause.
+func (b *AvatarBuilder) OnError(handler string) *AvatarBuilder {
+	b.props.OnError = handler
+	return b
+}
+
+// IconSlot sets the icon slot content
+// The default icon to use when no image or initials are present. Works best with <wa-icon>.
+func (b *AvatarBuilder) IconSlot(c templ.Component) *AvatarBuilder {
+	b.props.Slots.Icon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *AvatarBuilder) Attr(name, value string) *AvatarBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *AvatarBuilder) Attrs(attrs templ.Attributes) *AvatarBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *AvatarBuilder) Props() AvatarProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *AvatarBuilder) Build() AvatarProps {
+	return b.props
+}
+
+// Avatar renders the wa-avatar component
+templ Avatar(props AvatarProps) {
+	<wa-avatar
+		if props.Image != "" {
+			image={ props.Image }
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.Initials != "" {
+			initials={ props.Initials }
+		}
+		if props.Loading != "" {
+			loading={ props.Loading }
+		}
+		if props.Shape != "" {
+			shape={ props.Shape }
+		}
+		if props.OnError != "" {
+			x-on:wa-error={ props.OnError }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Icon != nil {
+			<div slot="icon">
+				@props.Slots.Icon
+			</div>
+		}
+		{ children... }
+	</wa-avatar>
+}
+
+// AvatarFunc renders with a builder function for inline configuration
+templ AvatarFunc(fn func(*AvatarBuilder)) {
+	{{ b := NewAvatar(); fn(b) }}
+	@Avatar(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/avatar_templ.go

@@ -0,0 +1,368 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-avatar
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Avatars are used to represent a person or object.
+//
+// Web Awesome component: <wa-avatar>
+
+// AvatarProps holds all properties for the wa-avatar component
+type AvatarProps struct {
+	// The image source to use for the avatar.
+	Image string `attr:"image"`
+	// A label to use to describe the avatar to assistive devices.
+	Label string `attr:"label"`
+	// Initials to use as a fallback when no image is available (1-2 characters max recommended).
+	Initials string `attr:"initials"`
+	// Indicates how the browser should load the image.
+	// Valid values: "eager", "lazy"
+	Loading string `attr:"loading"`
+	// The shape of the avatar.
+	// Valid values: "circle", "square", "rounded"
+	Shape string `attr:"shape"`
+
+	// Events
+	// The image could not be loaded. This may because of an invalid URL, a temporary network condition, or some unknown cause.
+	OnError string `attr:"x-on:wa-error"`
+
+	// Slots contains named slot content
+	Slots AvatarSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// AvatarSlots holds named slot content for the component
+type AvatarSlots struct {
+	// The default icon to use when no image or initials are present. Works best with <wa-icon>.
+	Icon templ.Component
+}
+
+// AvatarBuilder provides a fluent API for constructing AvatarProps
+type AvatarBuilder struct {
+	props AvatarProps
+}
+
+// NewAvatar creates a new builder for wa-avatar
+func NewAvatar() *AvatarBuilder {
+	return &AvatarBuilder{}
+}
+
+// Image sets the image attribute
+// The image source to use for the avatar.
+func (b *AvatarBuilder) Image(v string) *AvatarBuilder {
+	b.props.Image = v
+	return b
+}
+
+// Label sets the label attribute
+// A label to use to describe the avatar to assistive devices.
+func (b *AvatarBuilder) Label(v string) *AvatarBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Initials sets the initials attribute
+// Initials to use as a fallback when no image is available (1-2 characters max recommended).
+func (b *AvatarBuilder) Initials(v string) *AvatarBuilder {
+	b.props.Initials = v
+	return b
+}
+
+// Loading sets the loading attribute
+// Indicates how the browser should load the image.
+func (b *AvatarBuilder) Loading(v string) *AvatarBuilder {
+	b.props.Loading = v
+	return b
+}
+
+// Shape sets the shape attribute
+// The shape of the avatar.
+func (b *AvatarBuilder) Shape(v string) *AvatarBuilder {
+	b.props.Shape = v
+	return b
+}
+
+// OnError sets the handler for wa-error event
+// The image could not be loaded. This may because of an invalid URL, a temporary network condition, or some unknown cause.
+func (b *AvatarBuilder) OnError(handler string) *AvatarBuilder {
+	b.props.OnError = handler
+	return b
+}
+
+// IconSlot sets the icon slot content
+// The default icon to use when no image or initials are present. Works best with <wa-icon>.
+func (b *AvatarBuilder) IconSlot(c templ.Component) *AvatarBuilder {
+	b.props.Slots.Icon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *AvatarBuilder) Attr(name, value string) *AvatarBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *AvatarBuilder) Attrs(attrs templ.Attributes) *AvatarBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *AvatarBuilder) Props() AvatarProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *AvatarBuilder) Build() AvatarProps {
+	return b.props
+}
+
+// Avatar renders the wa-avatar component
+func Avatar(props AvatarProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-avatar")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Image != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " image=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Image)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/avatar.templ`, Line: 139, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/avatar.templ`, Line: 142, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Initials != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " initials=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Initials)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/avatar.templ`, Line: 145, Col: 28}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Loading != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " loading=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.Loading)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/avatar.templ`, Line: 148, Col: 26}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Shape != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " shape=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.Shape)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/avatar.templ`, Line: 151, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnError != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " x-on:wa-error=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnError)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/avatar.templ`, Line: 154, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Icon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "<div slot=\"icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Icon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "</wa-avatar>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// AvatarFunc renders with a builder function for inline configuration
+func AvatarFunc(fn func(*AvatarBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var8 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var8 == nil {
+			templ_7745c5c3_Var8 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewAvatar()
+		fn(b)
+		templ_7745c5c3_Var9 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var8.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Avatar(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var9), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/badge.templ

@@ -0,0 +1,132 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-badge
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Badges are used to draw attention and display statuses or counts.
+//
+// Web Awesome component: <wa-badge>
+
+// BadgeProps holds all properties for the wa-badge component
+type BadgeProps struct {
+	// The badge's theme variant. Defaults to brand if not within another element with a variant.
+	// Valid values: "brand", "neutral", "success", "warning", "danger"
+	Variant string `attr:"variant"`
+	// The badge's visual appearance.
+	// Valid values: "accent", "filled", "outlined", "filled-outlined"
+	Appearance string `attr:"appearance"`
+	// Draws a pill-style badge with rounded edges.
+	Pill bool `attr:"pill"`
+	// Adds an animation to draw attention to the badge.
+	// Valid values: "none", "pulse", "bounce"
+	Attention string `attr:"attention"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots BadgeSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// BadgeBuilder provides a fluent API for constructing BadgeProps
+type BadgeBuilder struct {
+	props BadgeProps
+}
+
+// NewBadge creates a new builder for wa-badge
+func NewBadge() *BadgeBuilder {
+	return &BadgeBuilder{}
+}
+
+// Variant sets the variant attribute
+// The badge's theme variant. Defaults to brand if not within another element with a variant.
+func (b *BadgeBuilder) Variant(v string) *BadgeBuilder {
+	b.props.Variant = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The badge's visual appearance.
+func (b *BadgeBuilder) Appearance(v string) *BadgeBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Pill sets the pill attribute
+// Draws a pill-style badge with rounded edges.
+func (b *BadgeBuilder) Pill(v bool) *BadgeBuilder {
+	b.props.Pill = v
+	return b
+}
+
+// Attention sets the attention attribute
+// Adds an animation to draw attention to the badge.
+func (b *BadgeBuilder) Attention(v string) *BadgeBuilder {
+	b.props.Attention = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *BadgeBuilder) Attr(name, value string) *BadgeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *BadgeBuilder) Attrs(attrs templ.Attributes) *BadgeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *BadgeBuilder) Props() BadgeProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *BadgeBuilder) Build() BadgeProps {
+	return b.props
+}
+
+// Badge renders the wa-badge component
+templ Badge(props BadgeProps) {
+	<wa-badge
+		if props.Variant != "" {
+			variant={ props.Variant }
+		}
+		if props.Appearance != "" {
+			appearance={ props.Appearance }
+		}
+		if props.Pill {
+			pill
+		}
+		if props.Attention != "" {
+			attention={ props.Attention }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-badge>
+}
+
+// BadgeFunc renders with a builder function for inline configuration
+templ BadgeFunc(fn func(*BadgeBuilder)) {
+	{{ b := NewBadge(); fn(b) }}
+	@Badge(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/badge_templ.go

@@ -0,0 +1,273 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-badge
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Badges are used to draw attention and display statuses or counts.
+//
+// Web Awesome component: <wa-badge>
+
+// BadgeProps holds all properties for the wa-badge component
+type BadgeProps struct {
+	// The badge's theme variant. Defaults to brand if not within another element with a variant.
+	// Valid values: "brand", "neutral", "success", "warning", "danger"
+	Variant string `attr:"variant"`
+	// The badge's visual appearance.
+	// Valid values: "accent", "filled", "outlined", "filled-outlined"
+	Appearance string `attr:"appearance"`
+	// Draws a pill-style badge with rounded edges.
+	Pill bool `attr:"pill"`
+	// Adds an animation to draw attention to the badge.
+	// Valid values: "none", "pulse", "bounce"
+	Attention string `attr:"attention"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots BadgeSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// BadgeBuilder provides a fluent API for constructing BadgeProps
+type BadgeBuilder struct {
+	props BadgeProps
+}
+
+// NewBadge creates a new builder for wa-badge
+func NewBadge() *BadgeBuilder {
+	return &BadgeBuilder{}
+}
+
+// Variant sets the variant attribute
+// The badge's theme variant. Defaults to brand if not within another element with a variant.
+func (b *BadgeBuilder) Variant(v string) *BadgeBuilder {
+	b.props.Variant = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The badge's visual appearance.
+func (b *BadgeBuilder) Appearance(v string) *BadgeBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Pill sets the pill attribute
+// Draws a pill-style badge with rounded edges.
+func (b *BadgeBuilder) Pill(v bool) *BadgeBuilder {
+	b.props.Pill = v
+	return b
+}
+
+// Attention sets the attention attribute
+// Adds an animation to draw attention to the badge.
+func (b *BadgeBuilder) Attention(v string) *BadgeBuilder {
+	b.props.Attention = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *BadgeBuilder) Attr(name, value string) *BadgeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *BadgeBuilder) Attrs(attrs templ.Attributes) *BadgeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *BadgeBuilder) Props() BadgeProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *BadgeBuilder) Build() BadgeProps {
+	return b.props
+}
+
+// Badge renders the wa-badge component
+func Badge(props BadgeProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-badge")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Variant != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " variant=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Variant)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/badge.templ`, Line: 109, Col: 26}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Appearance != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " appearance=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Appearance)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/badge.templ`, Line: 112, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Pill {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " pill")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Attention != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " attention=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Attention)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/badge.templ`, Line: 118, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "</wa-badge>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// BadgeFunc renders with a builder function for inline configuration
+func BadgeFunc(fn func(*BadgeBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var5 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var5 == nil {
+			templ_7745c5c3_Var5 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewBadge()
+		fn(b)
+		templ_7745c5c3_Var6 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var5.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Badge(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var6), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/breadcrumb-item.templ

@@ -0,0 +1,164 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-breadcrumb-item
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Breadcrumb Items are used inside breadcrumbs to represent different links.
+//
+// Web Awesome component: <wa-breadcrumb-item>
+
+// BreadcrumbItemProps holds all properties for the wa-breadcrumb-item component
+type BreadcrumbItemProps struct {
+	// Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered
+	Href string `attr:"href"`
+	// Tells the browser where to open the link. Only used when href is set.
+	// Valid values: "_blank", "_parent", "_self", "_top"
+	Target string `attr:"target"`
+	// The rel attribute to use on the link. Only used when href is set.
+	Rel string `attr:"rel"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots BreadcrumbItemSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// BreadcrumbItemSlots holds named slot content for the component
+type BreadcrumbItemSlots struct {
+	// An element, such as <wa-icon>, placed before the label.
+	Start templ.Component
+	// An element, such as <wa-icon>, placed after the label.
+	End templ.Component
+	// The separator to use for the breadcrumb item. This will only change the separator for this item. If you want to chang...
+	Separator templ.Component
+}
+
+// BreadcrumbItemBuilder provides a fluent API for constructing BreadcrumbItemProps
+type BreadcrumbItemBuilder struct {
+	props BreadcrumbItemProps
+}
+
+// NewBreadcrumbItem creates a new builder for wa-breadcrumb-item
+func NewBreadcrumbItem() *BreadcrumbItemBuilder {
+	return &BreadcrumbItemBuilder{}
+}
+
+// Href sets the href attribute
+// Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered
+func (b *BreadcrumbItemBuilder) Href(v string) *BreadcrumbItemBuilder {
+	b.props.Href = v
+	return b
+}
+
+// Target sets the target attribute
+// Tells the browser where to open the link. Only used when href is set.
+func (b *BreadcrumbItemBuilder) Target(v string) *BreadcrumbItemBuilder {
+	b.props.Target = v
+	return b
+}
+
+// Rel sets the rel attribute
+// The rel attribute to use on the link. Only used when href is set.
+func (b *BreadcrumbItemBuilder) Rel(v string) *BreadcrumbItemBuilder {
+	b.props.Rel = v
+	return b
+}
+
+// StartSlot sets the start slot content
+// An element, such as <wa-icon>, placed before the label.
+func (b *BreadcrumbItemBuilder) StartSlot(c templ.Component) *BreadcrumbItemBuilder {
+	b.props.Slots.Start = c
+	return b
+}
+
+// EndSlot sets the end slot content
+// An element, such as <wa-icon>, placed after the label.
+func (b *BreadcrumbItemBuilder) EndSlot(c templ.Component) *BreadcrumbItemBuilder {
+	b.props.Slots.End = c
+	return b
+}
+
+// SeparatorSlot sets the separator slot content
+// The separator to use for the breadcrumb item. This will only change the separator for this item. If you want to chang...
+func (b *BreadcrumbItemBuilder) SeparatorSlot(c templ.Component) *BreadcrumbItemBuilder {
+	b.props.Slots.Separator = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *BreadcrumbItemBuilder) Attr(name, value string) *BreadcrumbItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *BreadcrumbItemBuilder) Attrs(attrs templ.Attributes) *BreadcrumbItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *BreadcrumbItemBuilder) Props() BreadcrumbItemProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *BreadcrumbItemBuilder) Build() BreadcrumbItemProps {
+	return b.props
+}
+
+// BreadcrumbItem renders the wa-breadcrumb-item component
+templ BreadcrumbItem(props BreadcrumbItemProps) {
+	<wa-breadcrumb-item
+		if props.Href != "" {
+			href={ props.Href }
+		}
+		if props.Target != "" {
+			target={ props.Target }
+		}
+		if props.Rel != "" {
+			rel={ props.Rel }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Start != nil {
+			<div slot="start">
+				@props.Slots.Start
+			</div>
+		}
+		if props.Slots.End != nil {
+			<div slot="end">
+				@props.Slots.End
+			</div>
+		}
+		if props.Slots.Separator != nil {
+			<div slot="separator">
+				@props.Slots.Separator
+			</div>
+		}
+		{ children... }
+	</wa-breadcrumb-item>
+}
+
+// BreadcrumbItemFunc renders with a builder function for inline configuration
+templ BreadcrumbItemFunc(fn func(*BreadcrumbItemBuilder)) {
+	{{ b := NewBreadcrumbItem(); fn(b) }}
+	@BreadcrumbItem(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/breadcrumb-item_templ.go

@@ -0,0 +1,329 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-breadcrumb-item
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Breadcrumb Items are used inside breadcrumbs to represent different links.
+//
+// Web Awesome component: <wa-breadcrumb-item>
+
+// BreadcrumbItemProps holds all properties for the wa-breadcrumb-item component
+type BreadcrumbItemProps struct {
+	// Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered
+	Href string `attr:"href"`
+	// Tells the browser where to open the link. Only used when href is set.
+	// Valid values: "_blank", "_parent", "_self", "_top"
+	Target string `attr:"target"`
+	// The rel attribute to use on the link. Only used when href is set.
+	Rel string `attr:"rel"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots BreadcrumbItemSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// BreadcrumbItemSlots holds named slot content for the component
+type BreadcrumbItemSlots struct {
+	// An element, such as <wa-icon>, placed before the label.
+	Start templ.Component
+	// An element, such as <wa-icon>, placed after the label.
+	End templ.Component
+	// The separator to use for the breadcrumb item. This will only change the separator for this item. If you want to chang...
+	Separator templ.Component
+}
+
+// BreadcrumbItemBuilder provides a fluent API for constructing BreadcrumbItemProps
+type BreadcrumbItemBuilder struct {
+	props BreadcrumbItemProps
+}
+
+// NewBreadcrumbItem creates a new builder for wa-breadcrumb-item
+func NewBreadcrumbItem() *BreadcrumbItemBuilder {
+	return &BreadcrumbItemBuilder{}
+}
+
+// Href sets the href attribute
+// Optional URL to direct the user to when the breadcrumb item is activated. When set, a link will be rendered
+func (b *BreadcrumbItemBuilder) Href(v string) *BreadcrumbItemBuilder {
+	b.props.Href = v
+	return b
+}
+
+// Target sets the target attribute
+// Tells the browser where to open the link. Only used when href is set.
+func (b *BreadcrumbItemBuilder) Target(v string) *BreadcrumbItemBuilder {
+	b.props.Target = v
+	return b
+}
+
+// Rel sets the rel attribute
+// The rel attribute to use on the link. Only used when href is set.
+func (b *BreadcrumbItemBuilder) Rel(v string) *BreadcrumbItemBuilder {
+	b.props.Rel = v
+	return b
+}
+
+// StartSlot sets the start slot content
+// An element, such as <wa-icon>, placed before the label.
+func (b *BreadcrumbItemBuilder) StartSlot(c templ.Component) *BreadcrumbItemBuilder {
+	b.props.Slots.Start = c
+	return b
+}
+
+// EndSlot sets the end slot content
+// An element, such as <wa-icon>, placed after the label.
+func (b *BreadcrumbItemBuilder) EndSlot(c templ.Component) *BreadcrumbItemBuilder {
+	b.props.Slots.End = c
+	return b
+}
+
+// SeparatorSlot sets the separator slot content
+// The separator to use for the breadcrumb item. This will only change the separator for this item. If you want to chang...
+func (b *BreadcrumbItemBuilder) SeparatorSlot(c templ.Component) *BreadcrumbItemBuilder {
+	b.props.Slots.Separator = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *BreadcrumbItemBuilder) Attr(name, value string) *BreadcrumbItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *BreadcrumbItemBuilder) Attrs(attrs templ.Attributes) *BreadcrumbItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *BreadcrumbItemBuilder) Props() BreadcrumbItemProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *BreadcrumbItemBuilder) Build() BreadcrumbItemProps {
+	return b.props
+}
+
+// BreadcrumbItem renders the wa-breadcrumb-item component
+func BreadcrumbItem(props BreadcrumbItemProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-breadcrumb-item")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Href != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " href=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Href)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/breadcrumb-item.templ`, Line: 129, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Target != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " target=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Target)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/breadcrumb-item.templ`, Line: 132, Col: 24}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Rel != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " rel=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Rel)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/breadcrumb-item.templ`, Line: 135, Col: 18}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Start != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "<div slot=\"start\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Start.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.End != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "<div slot=\"end\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.End.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Separator != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "<div slot=\"separator\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Separator.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "</wa-breadcrumb-item>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// BreadcrumbItemFunc renders with a builder function for inline configuration
+func BreadcrumbItemFunc(fn func(*BreadcrumbItemBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var5 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var5 == nil {
+			templ_7745c5c3_Var5 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewBreadcrumbItem()
+		fn(b)
+		templ_7745c5c3_Var6 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var5.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = BreadcrumbItem(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var6), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/breadcrumb.templ

@@ -0,0 +1,111 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-breadcrumb
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.
+//
+// Web Awesome component: <wa-breadcrumb>
+
+// BreadcrumbProps holds all properties for the wa-breadcrumb component
+type BreadcrumbProps struct {
+	// The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by
+	Label string `attr:"label"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots BreadcrumbSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// BreadcrumbSlots holds named slot content for the component
+type BreadcrumbSlots struct {
+	// The separator to use between breadcrumb items. Works best with <wa-icon>.
+	Separator templ.Component
+}
+
+// BreadcrumbBuilder provides a fluent API for constructing BreadcrumbProps
+type BreadcrumbBuilder struct {
+	props BreadcrumbProps
+}
+
+// NewBreadcrumb creates a new builder for wa-breadcrumb
+func NewBreadcrumb() *BreadcrumbBuilder {
+	return &BreadcrumbBuilder{}
+}
+
+// Label sets the label attribute
+// The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by
+func (b *BreadcrumbBuilder) Label(v string) *BreadcrumbBuilder {
+	b.props.Label = v
+	return b
+}
+
+// SeparatorSlot sets the separator slot content
+// The separator to use between breadcrumb items. Works best with <wa-icon>.
+func (b *BreadcrumbBuilder) SeparatorSlot(c templ.Component) *BreadcrumbBuilder {
+	b.props.Slots.Separator = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *BreadcrumbBuilder) Attr(name, value string) *BreadcrumbBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *BreadcrumbBuilder) Attrs(attrs templ.Attributes) *BreadcrumbBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *BreadcrumbBuilder) Props() BreadcrumbProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *BreadcrumbBuilder) Build() BreadcrumbProps {
+	return b.props
+}
+
+// Breadcrumb renders the wa-breadcrumb component
+templ Breadcrumb(props BreadcrumbProps) {
+	<wa-breadcrumb
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Separator != nil {
+			<div slot="separator">
+				@props.Slots.Separator
+			</div>
+		}
+		{ children... }
+	</wa-breadcrumb>
+}
+
+// BreadcrumbFunc renders with a builder function for inline configuration
+templ BreadcrumbFunc(fn func(*BreadcrumbBuilder)) {
+	{{ b := NewBreadcrumb(); fn(b) }}
+	@Breadcrumb(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/breadcrumb_templ.go

@@ -0,0 +1,226 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-breadcrumb
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Breadcrumbs provide a group of links so users can easily navigate a website's hierarchy.
+//
+// Web Awesome component: <wa-breadcrumb>
+
+// BreadcrumbProps holds all properties for the wa-breadcrumb component
+type BreadcrumbProps struct {
+	// The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by
+	Label string `attr:"label"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots BreadcrumbSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// BreadcrumbSlots holds named slot content for the component
+type BreadcrumbSlots struct {
+	// The separator to use between breadcrumb items. Works best with <wa-icon>.
+	Separator templ.Component
+}
+
+// BreadcrumbBuilder provides a fluent API for constructing BreadcrumbProps
+type BreadcrumbBuilder struct {
+	props BreadcrumbProps
+}
+
+// NewBreadcrumb creates a new builder for wa-breadcrumb
+func NewBreadcrumb() *BreadcrumbBuilder {
+	return &BreadcrumbBuilder{}
+}
+
+// Label sets the label attribute
+// The label to use for the breadcrumb control. This will not be shown on the screen, but it will be announced by
+func (b *BreadcrumbBuilder) Label(v string) *BreadcrumbBuilder {
+	b.props.Label = v
+	return b
+}
+
+// SeparatorSlot sets the separator slot content
+// The separator to use between breadcrumb items. Works best with <wa-icon>.
+func (b *BreadcrumbBuilder) SeparatorSlot(c templ.Component) *BreadcrumbBuilder {
+	b.props.Slots.Separator = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *BreadcrumbBuilder) Attr(name, value string) *BreadcrumbBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *BreadcrumbBuilder) Attrs(attrs templ.Attributes) *BreadcrumbBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *BreadcrumbBuilder) Props() BreadcrumbProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *BreadcrumbBuilder) Build() BreadcrumbProps {
+	return b.props
+}
+
+// Breadcrumb renders the wa-breadcrumb component
+func Breadcrumb(props BreadcrumbProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-breadcrumb")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/breadcrumb.templ`, Line: 92, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Separator != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "<div slot=\"separator\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Separator.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</wa-breadcrumb>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// BreadcrumbFunc renders with a builder function for inline configuration
+func BreadcrumbFunc(fn func(*BreadcrumbBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var3 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var3 == nil {
+			templ_7745c5c3_Var3 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewBreadcrumb()
+		fn(b)
+		templ_7745c5c3_Var4 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var3.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Breadcrumb(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var4), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/builders.go

@@ -0,0 +1,146 @@
+// Code generated by wa-generator. DO NOT EDIT.
+
+package wa
+
+import "github.com/a]h/templ"
+
+// PropsBuilder is the interface all component builders implement
+type PropsBuilder[T any] interface {
+	Attr(name, value string) PropsBuilder[T]
+	Attrs(attrs templ.Attributes) PropsBuilder[T]
+	Build() T
+}
+
+// BaseBuilder provides common builder functionality
+type BaseBuilder struct {
+	attrs templ.Attributes
+}
+
+// SetAttr sets a single attribute
+func (b *BaseBuilder) SetAttr(name, value string) {
+	if b.attrs == nil {
+		b.attrs = templ.Attributes{}
+	}
+	b.attrs[name] = value
+}
+
+// MergeAttrs merges attributes
+func (b *BaseBuilder) MergeAttrs(attrs templ.Attributes) {
+	if b.attrs == nil {
+		b.attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.attrs[k] = v
+	}
+}
+
+// GetAttrs returns the attributes
+func (b *BaseBuilder) GetAttrs() templ.Attributes {
+	if b.attrs == nil {
+		return templ.Attributes{}
+	}
+	return b.attrs
+}
+
+// Common builder method helpers
+
+// WithClass is a helper to add CSS classes
+func WithClass[B interface{ Attr(string, string) B }](b B, classes ...string) B {
+	return b.Attr("class", strings.Join(classes, " "))
+}
+
+// WithID is a helper to set element ID
+func WithID[B interface{ Attr(string, string) B }](b B, id string) B {
+	return b.Attr("id", id)
+}
+
+// WithStyle is a helper to add inline styles
+func WithStyle[B interface{ Attr(string, string) B }](b B, style string) B {
+	return b.Attr("style", style)
+}
+
+// WithData is a helper to add data attributes
+func WithData[B interface{ Attr(string, string) B }](b B, key, value string) B {
+	return b.Attr("data-"+key, value)
+}
+
+// Component registry for dynamic component creation
+var componentRegistry = map[string]func() interface{}{
+	"wa-animated-image": func() interface{} { return NewAnimatedImage() },
+	"wa-animation": func() interface{} { return NewAnimation() },
+	"wa-avatar": func() interface{} { return NewAvatar() },
+	"wa-badge": func() interface{} { return NewBadge() },
+	"wa-breadcrumb-item": func() interface{} { return NewBreadcrumbItem() },
+	"wa-breadcrumb": func() interface{} { return NewBreadcrumb() },
+	"wa-button-group": func() interface{} { return NewButtonGroup() },
+	"wa-button": func() interface{} { return NewButton() },
+	"wa-callout": func() interface{} { return NewCallout() },
+	"wa-card": func() interface{} { return NewCard() },
+	"wa-carousel": func() interface{} { return NewCarousel() },
+	"wa-carousel-item": func() interface{} { return NewCarouselItem() },
+	"wa-checkbox": func() interface{} { return NewCheckbox() },
+	"wa-color-picker": func() interface{} { return NewColorPicker() },
+	"wa-combobox": func() interface{} { return NewCombobox() },
+	"wa-comparison": func() interface{} { return NewComparison() },
+	"wa-copy-button": func() interface{} { return NewCopyButton() },
+	"wa-details": func() interface{} { return NewDetails() },
+	"wa-dialog": func() interface{} { return NewDialog() },
+	"wa-divider": func() interface{} { return NewDivider() },
+	"wa-drawer": func() interface{} { return NewDrawer() },
+	"wa-dropdown": func() interface{} { return NewDropdown() },
+	"wa-dropdown-item": func() interface{} { return NewDropdownItem() },
+	"wa-format-bytes": func() interface{} { return NewFormatBytes() },
+	"wa-format-date": func() interface{} { return NewFormatDate() },
+	"wa-format-number": func() interface{} { return NewFormatNumber() },
+	"wa-icon": func() interface{} { return NewIcon() },
+	"wa-include": func() interface{} { return NewInclude() },
+	"wa-input": func() interface{} { return NewInput() },
+	"wa-intersection-observer": func() interface{} { return NewIntersectionObserver() },
+	"wa-mutation-observer": func() interface{} { return NewMutationObserver() },
+	"wa-option": func() interface{} { return NewOption() },
+	"wa-page": func() interface{} { return NewPage() },
+	"wa-popover": func() interface{} { return NewPopover() },
+	"wa-popup": func() interface{} { return NewPopup() },
+	"wa-progress-bar": func() interface{} { return NewProgressBar() },
+	"wa-qr-code": func() interface{} { return NewQrCode() },
+	"wa-progress-ring": func() interface{} { return NewProgressRing() },
+	"wa-radio": func() interface{} { return NewRadio() },
+	"wa-radio-group": func() interface{} { return NewRadioGroup() },
+	"wa-rating": func() interface{} { return NewRating() },
+	"wa-relative-time": func() interface{} { return NewRelativeTime() },
+	"wa-resize-observer": func() interface{} { return NewResizeObserver() },
+	"wa-scroller": func() interface{} { return NewScroller() },
+	"wa-skeleton": func() interface{} { return NewSkeleton() },
+	"wa-select": func() interface{} { return NewSelect() },
+	"wa-slider": func() interface{} { return NewSlider() },
+	"wa-spinner": func() interface{} { return NewSpinner() },
+	"wa-split-panel": func() interface{} { return NewSplitPanel() },
+	"wa-switch": func() interface{} { return NewSwitch() },
+	"wa-tab": func() interface{} { return NewTab() },
+	"wa-tab-group": func() interface{} { return NewTabGroup() },
+	"wa-tab-panel": func() interface{} { return NewTabPanel() },
+	"wa-tag": func() interface{} { return NewTag() },
+	"wa-textarea": func() interface{} { return NewTextarea() },
+	"wa-tooltip": func() interface{} { return NewTooltip() },
+	"wa-tree": func() interface{} { return NewTree() },
+	"wa-tree-item": func() interface{} { return NewTreeItem() },
+	"wa-zoomable-frame": func() interface{} { return NewZoomableFrame() },
+}
+
+// GetBuilder returns a builder for the given component name
+func GetBuilder(name string) interface{} {
+	if fn, ok := componentRegistry[name]; ok {
+		return fn()
+	}
+	return nil
+}
+
+// ComponentNames returns all available component names
+func ComponentNames() []string {
+	names := make([]string, 0, len(componentRegistry))
+	for name := range componentRegistry {
+		names = append(names, name)
+	}
+	sort.Strings(names)
+	return names
+}

pkg/wa/button-group.templ

@@ -0,0 +1,106 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-button-group
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Button groups can be used to group related buttons into sections.
+//
+// Web Awesome component: <wa-button-group>
+
+// ButtonGroupProps holds all properties for the wa-button-group component
+type ButtonGroupProps struct {
+	// A label to use for the button group. This won't be displayed on the screen, but it will be announced by assistive
+	Label string `attr:"label"`
+	// The button group's orientation.
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots ButtonGroupSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ButtonGroupBuilder provides a fluent API for constructing ButtonGroupProps
+type ButtonGroupBuilder struct {
+	props ButtonGroupProps
+}
+
+// NewButtonGroup creates a new builder for wa-button-group
+func NewButtonGroup() *ButtonGroupBuilder {
+	return &ButtonGroupBuilder{}
+}
+
+// Label sets the label attribute
+// A label to use for the button group. This won't be displayed on the screen, but it will be announced by assistive
+func (b *ButtonGroupBuilder) Label(v string) *ButtonGroupBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Orientation sets the orientation attribute
+// The button group's orientation.
+func (b *ButtonGroupBuilder) Orientation(v string) *ButtonGroupBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ButtonGroupBuilder) Attr(name, value string) *ButtonGroupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ButtonGroupBuilder) Attrs(attrs templ.Attributes) *ButtonGroupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ButtonGroupBuilder) Props() ButtonGroupProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ButtonGroupBuilder) Build() ButtonGroupProps {
+	return b.props
+}
+
+// ButtonGroup renders the wa-button-group component
+templ ButtonGroup(props ButtonGroupProps) {
+	<wa-button-group
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.Orientation != "" {
+			orientation={ props.Orientation }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-button-group>
+}
+
+// ButtonGroupFunc renders with a builder function for inline configuration
+templ ButtonGroupFunc(fn func(*ButtonGroupBuilder)) {
+	{{ b := NewButtonGroup(); fn(b) }}
+	@ButtonGroup(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/button-group_templ.go

@@ -0,0 +1,228 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-button-group
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Button groups can be used to group related buttons into sections.
+//
+// Web Awesome component: <wa-button-group>
+
+// ButtonGroupProps holds all properties for the wa-button-group component
+type ButtonGroupProps struct {
+	// A label to use for the button group. This won't be displayed on the screen, but it will be announced by assistive
+	Label string `attr:"label"`
+	// The button group's orientation.
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots ButtonGroupSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ButtonGroupBuilder provides a fluent API for constructing ButtonGroupProps
+type ButtonGroupBuilder struct {
+	props ButtonGroupProps
+}
+
+// NewButtonGroup creates a new builder for wa-button-group
+func NewButtonGroup() *ButtonGroupBuilder {
+	return &ButtonGroupBuilder{}
+}
+
+// Label sets the label attribute
+// A label to use for the button group. This won't be displayed on the screen, but it will be announced by assistive
+func (b *ButtonGroupBuilder) Label(v string) *ButtonGroupBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Orientation sets the orientation attribute
+// The button group's orientation.
+func (b *ButtonGroupBuilder) Orientation(v string) *ButtonGroupBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ButtonGroupBuilder) Attr(name, value string) *ButtonGroupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ButtonGroupBuilder) Attrs(attrs templ.Attributes) *ButtonGroupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ButtonGroupBuilder) Props() ButtonGroupProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ButtonGroupBuilder) Build() ButtonGroupProps {
+	return b.props
+}
+
+// ButtonGroup renders the wa-button-group component
+func ButtonGroup(props ButtonGroupProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-button-group")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button-group.templ`, Line: 89, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Orientation != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " orientation=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Orientation)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button-group.templ`, Line: 92, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</wa-button-group>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// ButtonGroupFunc renders with a builder function for inline configuration
+func ButtonGroupFunc(fn func(*ButtonGroupBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var4 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var4 == nil {
+			templ_7745c5c3_Var4 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewButtonGroup()
+		fn(b)
+		templ_7745c5c3_Var5 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var4.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = ButtonGroup(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var5), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/button.templ

@@ -0,0 +1,385 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-button
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Buttons represent actions that are available to the user.
+//
+// Web Awesome component: <wa-button>
+
+// ButtonProps holds all properties for the wa-button component
+type ButtonProps struct {
+	// The button's theme variant. Defaults to neutral if not within another element with a variant.
+	// Valid values: "neutral", "brand", "success", "warning", "danger"
+	Variant string `attr:"variant"`
+	// The button's visual appearance.
+	// Valid values: "accent", "filled", "outlined", "filled-outlined", "plain"
+	Appearance string `attr:"appearance"`
+	// The button's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior.
+	WithCaret bool `attr:"with-caret"`
+	// Disables the button. Does not apply to link buttons.
+	Disabled bool `attr:"disabled"`
+	// Draws the button in a loading state.
+	Loading bool `attr:"loading"`
+	// Draws a pill-style button with rounded edges.
+	Pill bool `attr:"pill"`
+	// The type of button. Note that the default value is button instead of submit, which is opposite of how native
+	// Valid values: "button", "submit", "reset"
+	Type string `attr:"type"`
+	// The name of the button, submitted as a name/value pair with form data, but only when this button is the submitter.
+	Name string `attr:"name"`
+	// The value of the button, submitted as a pair with the button's name as part of the form data, but only when this
+	Value string `attr:"value"`
+	// When set, the underlying button will be rendered as an <a> with this href instead of a <button>.
+	Href string `attr:"href"`
+	// Tells the browser where to open the link. Only used when href is present.
+	// Valid values: "_blank", "_parent", "_self", "_top"
+	Target string `attr:"target"`
+	// When using href, this attribute will map to the underlying link's rel attribute.
+	Rel string `attr:"rel"`
+	// Tells the browser to download the linked file as this filename. Only used when href is present.
+	Download string `attr:"download"`
+	// Used to override the form owner's action attribute.
+	Formaction string `attr:"formaction"`
+	// Used to override the form owner's enctype attribute.
+	// Valid values: "application/x-www-form-urlencoded", "multipart/form-data", "text/plain"
+	Formenctype string `attr:"formenctype"`
+	// Used to override the form owner's method attribute.
+	// Valid values: "post", "get"
+	Formmethod string `attr:"formmethod"`
+	// Used to override the form owner's novalidate attribute.
+	Formnovalidate bool `attr:"formnovalidate"`
+	// Used to override the form owner's target attribute.
+	// Valid values: "_self", "_blank", "_parent", "_top"
+	Formtarget string `attr:"formtarget"`
+
+	// Events
+	// Emitted when the button loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the button gains focus.
+	OnFocus string `attr:"x-on:focus"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots ButtonSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ButtonSlots holds named slot content for the component
+type ButtonSlots struct {
+	// An element, such as <wa-icon>, placed before the label.
+	Start templ.Component
+	// An element, such as <wa-icon>, placed after the label.
+	End templ.Component
+}
+
+// ButtonBuilder provides a fluent API for constructing ButtonProps
+type ButtonBuilder struct {
+	props ButtonProps
+}
+
+// NewButton creates a new builder for wa-button
+func NewButton() *ButtonBuilder {
+	return &ButtonBuilder{}
+}
+
+// Variant sets the variant attribute
+// The button's theme variant. Defaults to neutral if not within another element with a variant.
+func (b *ButtonBuilder) Variant(v string) *ButtonBuilder {
+	b.props.Variant = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The button's visual appearance.
+func (b *ButtonBuilder) Appearance(v string) *ButtonBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Size sets the size attribute
+// The button's size.
+func (b *ButtonBuilder) Size(v string) *ButtonBuilder {
+	b.props.Size = v
+	return b
+}
+
+// WithCaret sets the with-caret attribute
+// Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior.
+func (b *ButtonBuilder) WithCaret(v bool) *ButtonBuilder {
+	b.props.WithCaret = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the button. Does not apply to link buttons.
+func (b *ButtonBuilder) Disabled(v bool) *ButtonBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Loading sets the loading attribute
+// Draws the button in a loading state.
+func (b *ButtonBuilder) Loading(v bool) *ButtonBuilder {
+	b.props.Loading = v
+	return b
+}
+
+// Pill sets the pill attribute
+// Draws a pill-style button with rounded edges.
+func (b *ButtonBuilder) Pill(v bool) *ButtonBuilder {
+	b.props.Pill = v
+	return b
+}
+
+// Type sets the type attribute
+// The type of button. Note that the default value is button instead of submit, which is opposite of how native
+func (b *ButtonBuilder) Type(v string) *ButtonBuilder {
+	b.props.Type = v
+	return b
+}
+
+// Name sets the name attribute
+// The name of the button, submitted as a name/value pair with form data, but only when this button is the submitter.
+func (b *ButtonBuilder) Name(v string) *ButtonBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Value sets the value attribute
+// The value of the button, submitted as a pair with the button's name as part of the form data, but only when this
+func (b *ButtonBuilder) Value(v string) *ButtonBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Href sets the href attribute
+// When set, the underlying button will be rendered as an <a> with this href instead of a <button>.
+func (b *ButtonBuilder) Href(v string) *ButtonBuilder {
+	b.props.Href = v
+	return b
+}
+
+// Target sets the target attribute
+// Tells the browser where to open the link. Only used when href is present.
+func (b *ButtonBuilder) Target(v string) *ButtonBuilder {
+	b.props.Target = v
+	return b
+}
+
+// Rel sets the rel attribute
+// When using href, this attribute will map to the underlying link's rel attribute.
+func (b *ButtonBuilder) Rel(v string) *ButtonBuilder {
+	b.props.Rel = v
+	return b
+}
+
+// Download sets the download attribute
+// Tells the browser to download the linked file as this filename. Only used when href is present.
+func (b *ButtonBuilder) Download(v string) *ButtonBuilder {
+	b.props.Download = v
+	return b
+}
+
+// Formaction sets the formaction attribute
+// Used to override the form owner's action attribute.
+func (b *ButtonBuilder) Formaction(v string) *ButtonBuilder {
+	b.props.Formaction = v
+	return b
+}
+
+// Formenctype sets the formenctype attribute
+// Used to override the form owner's enctype attribute.
+func (b *ButtonBuilder) Formenctype(v string) *ButtonBuilder {
+	b.props.Formenctype = v
+	return b
+}
+
+// Formmethod sets the formmethod attribute
+// Used to override the form owner's method attribute.
+func (b *ButtonBuilder) Formmethod(v string) *ButtonBuilder {
+	b.props.Formmethod = v
+	return b
+}
+
+// Formnovalidate sets the formnovalidate attribute
+// Used to override the form owner's novalidate attribute.
+func (b *ButtonBuilder) Formnovalidate(v bool) *ButtonBuilder {
+	b.props.Formnovalidate = v
+	return b
+}
+
+// Formtarget sets the formtarget attribute
+// Used to override the form owner's target attribute.
+func (b *ButtonBuilder) Formtarget(v string) *ButtonBuilder {
+	b.props.Formtarget = v
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the button loses focus.
+func (b *ButtonBuilder) OnBlur(handler string) *ButtonBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the button gains focus.
+func (b *ButtonBuilder) OnFocus(handler string) *ButtonBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *ButtonBuilder) OnInvalid(handler string) *ButtonBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// StartSlot sets the start slot content
+// An element, such as <wa-icon>, placed before the label.
+func (b *ButtonBuilder) StartSlot(c templ.Component) *ButtonBuilder {
+	b.props.Slots.Start = c
+	return b
+}
+
+// EndSlot sets the end slot content
+// An element, such as <wa-icon>, placed after the label.
+func (b *ButtonBuilder) EndSlot(c templ.Component) *ButtonBuilder {
+	b.props.Slots.End = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ButtonBuilder) Attr(name, value string) *ButtonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ButtonBuilder) Attrs(attrs templ.Attributes) *ButtonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ButtonBuilder) Props() ButtonProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ButtonBuilder) Build() ButtonProps {
+	return b.props
+}
+
+// Button renders the wa-button component
+templ Button(props ButtonProps) {
+	<wa-button
+		if props.Variant != "" {
+			variant={ props.Variant }
+		}
+		if props.Appearance != "" {
+			appearance={ props.Appearance }
+		}
+		if props.Size != "" {
+			size={ props.Size }
+		}
+		if props.WithCaret {
+			with-caret
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.Loading {
+			loading
+		}
+		if props.Pill {
+			pill
+		}
+		if props.Type != "" {
+			type={ props.Type }
+		}
+		if props.Name != "" {
+			name={ props.Name }
+		}
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.Href != "" {
+			href={ props.Href }
+		}
+		if props.Target != "" {
+			target={ props.Target }
+		}
+		if props.Rel != "" {
+			rel={ props.Rel }
+		}
+		if props.Download != "" {
+			download={ props.Download }
+		}
+		if props.Formaction != "" {
+			formaction={ props.Formaction }
+		}
+		if props.Formenctype != "" {
+			formenctype={ props.Formenctype }
+		}
+		if props.Formmethod != "" {
+			formmethod={ props.Formmethod }
+		}
+		if props.Formnovalidate {
+			formnovalidate
+		}
+		if props.Formtarget != "" {
+			formtarget={ props.Formtarget }
+		}
+		if props.OnBlur != "" {
+			x-on:blur={ props.OnBlur }
+		}
+		if props.OnFocus != "" {
+			x-on:focus={ props.OnFocus }
+		}
+		if props.OnInvalid != "" {
+			x-on:wa-invalid={ props.OnInvalid }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Start != nil {
+			<div slot="start">
+				@props.Slots.Start
+			</div>
+		}
+		if props.Slots.End != nil {
+			<div slot="end">
+				@props.Slots.End
+			</div>
+		}
+		{ children... }
+	</wa-button>
+}
+
+// ButtonFunc renders with a builder function for inline configuration
+templ ButtonFunc(fn func(*ButtonBuilder)) {
+	{{ b := NewButton(); fn(b) }}
+	@Button(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/button_templ.go

@@ -0,0 +1,780 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-button
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Buttons represent actions that are available to the user.
+//
+// Web Awesome component: <wa-button>
+
+// ButtonProps holds all properties for the wa-button component
+type ButtonProps struct {
+	// The button's theme variant. Defaults to neutral if not within another element with a variant.
+	// Valid values: "neutral", "brand", "success", "warning", "danger"
+	Variant string `attr:"variant"`
+	// The button's visual appearance.
+	// Valid values: "accent", "filled", "outlined", "filled-outlined", "plain"
+	Appearance string `attr:"appearance"`
+	// The button's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior.
+	WithCaret bool `attr:"with-caret"`
+	// Disables the button. Does not apply to link buttons.
+	Disabled bool `attr:"disabled"`
+	// Draws the button in a loading state.
+	Loading bool `attr:"loading"`
+	// Draws a pill-style button with rounded edges.
+	Pill bool `attr:"pill"`
+	// The type of button. Note that the default value is button instead of submit, which is opposite of how native
+	// Valid values: "button", "submit", "reset"
+	Type string `attr:"type"`
+	// The name of the button, submitted as a name/value pair with form data, but only when this button is the submitter.
+	Name string `attr:"name"`
+	// The value of the button, submitted as a pair with the button's name as part of the form data, but only when this
+	Value string `attr:"value"`
+	// When set, the underlying button will be rendered as an <a> with this href instead of a <button>.
+	Href string `attr:"href"`
+	// Tells the browser where to open the link. Only used when href is present.
+	// Valid values: "_blank", "_parent", "_self", "_top"
+	Target string `attr:"target"`
+	// When using href, this attribute will map to the underlying link's rel attribute.
+	Rel string `attr:"rel"`
+	// Tells the browser to download the linked file as this filename. Only used when href is present.
+	Download string `attr:"download"`
+	// Used to override the form owner's action attribute.
+	Formaction string `attr:"formaction"`
+	// Used to override the form owner's enctype attribute.
+	// Valid values: "application/x-www-form-urlencoded", "multipart/form-data", "text/plain"
+	Formenctype string `attr:"formenctype"`
+	// Used to override the form owner's method attribute.
+	// Valid values: "post", "get"
+	Formmethod string `attr:"formmethod"`
+	// Used to override the form owner's novalidate attribute.
+	Formnovalidate bool `attr:"formnovalidate"`
+	// Used to override the form owner's target attribute.
+	// Valid values: "_self", "_blank", "_parent", "_top"
+	Formtarget string `attr:"formtarget"`
+
+	// Events
+	// Emitted when the button loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the button gains focus.
+	OnFocus string `attr:"x-on:focus"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots ButtonSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ButtonSlots holds named slot content for the component
+type ButtonSlots struct {
+	// An element, such as <wa-icon>, placed before the label.
+	Start templ.Component
+	// An element, such as <wa-icon>, placed after the label.
+	End templ.Component
+}
+
+// ButtonBuilder provides a fluent API for constructing ButtonProps
+type ButtonBuilder struct {
+	props ButtonProps
+}
+
+// NewButton creates a new builder for wa-button
+func NewButton() *ButtonBuilder {
+	return &ButtonBuilder{}
+}
+
+// Variant sets the variant attribute
+// The button's theme variant. Defaults to neutral if not within another element with a variant.
+func (b *ButtonBuilder) Variant(v string) *ButtonBuilder {
+	b.props.Variant = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The button's visual appearance.
+func (b *ButtonBuilder) Appearance(v string) *ButtonBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Size sets the size attribute
+// The button's size.
+func (b *ButtonBuilder) Size(v string) *ButtonBuilder {
+	b.props.Size = v
+	return b
+}
+
+// WithCaret sets the with-caret attribute
+// Draws the button with a caret. Used to indicate that the button triggers a dropdown menu or similar behavior.
+func (b *ButtonBuilder) WithCaret(v bool) *ButtonBuilder {
+	b.props.WithCaret = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the button. Does not apply to link buttons.
+func (b *ButtonBuilder) Disabled(v bool) *ButtonBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Loading sets the loading attribute
+// Draws the button in a loading state.
+func (b *ButtonBuilder) Loading(v bool) *ButtonBuilder {
+	b.props.Loading = v
+	return b
+}
+
+// Pill sets the pill attribute
+// Draws a pill-style button with rounded edges.
+func (b *ButtonBuilder) Pill(v bool) *ButtonBuilder {
+	b.props.Pill = v
+	return b
+}
+
+// Type sets the type attribute
+// The type of button. Note that the default value is button instead of submit, which is opposite of how native
+func (b *ButtonBuilder) Type(v string) *ButtonBuilder {
+	b.props.Type = v
+	return b
+}
+
+// Name sets the name attribute
+// The name of the button, submitted as a name/value pair with form data, but only when this button is the submitter.
+func (b *ButtonBuilder) Name(v string) *ButtonBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Value sets the value attribute
+// The value of the button, submitted as a pair with the button's name as part of the form data, but only when this
+func (b *ButtonBuilder) Value(v string) *ButtonBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Href sets the href attribute
+// When set, the underlying button will be rendered as an <a> with this href instead of a <button>.
+func (b *ButtonBuilder) Href(v string) *ButtonBuilder {
+	b.props.Href = v
+	return b
+}
+
+// Target sets the target attribute
+// Tells the browser where to open the link. Only used when href is present.
+func (b *ButtonBuilder) Target(v string) *ButtonBuilder {
+	b.props.Target = v
+	return b
+}
+
+// Rel sets the rel attribute
+// When using href, this attribute will map to the underlying link's rel attribute.
+func (b *ButtonBuilder) Rel(v string) *ButtonBuilder {
+	b.props.Rel = v
+	return b
+}
+
+// Download sets the download attribute
+// Tells the browser to download the linked file as this filename. Only used when href is present.
+func (b *ButtonBuilder) Download(v string) *ButtonBuilder {
+	b.props.Download = v
+	return b
+}
+
+// Formaction sets the formaction attribute
+// Used to override the form owner's action attribute.
+func (b *ButtonBuilder) Formaction(v string) *ButtonBuilder {
+	b.props.Formaction = v
+	return b
+}
+
+// Formenctype sets the formenctype attribute
+// Used to override the form owner's enctype attribute.
+func (b *ButtonBuilder) Formenctype(v string) *ButtonBuilder {
+	b.props.Formenctype = v
+	return b
+}
+
+// Formmethod sets the formmethod attribute
+// Used to override the form owner's method attribute.
+func (b *ButtonBuilder) Formmethod(v string) *ButtonBuilder {
+	b.props.Formmethod = v
+	return b
+}
+
+// Formnovalidate sets the formnovalidate attribute
+// Used to override the form owner's novalidate attribute.
+func (b *ButtonBuilder) Formnovalidate(v bool) *ButtonBuilder {
+	b.props.Formnovalidate = v
+	return b
+}
+
+// Formtarget sets the formtarget attribute
+// Used to override the form owner's target attribute.
+func (b *ButtonBuilder) Formtarget(v string) *ButtonBuilder {
+	b.props.Formtarget = v
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the button loses focus.
+func (b *ButtonBuilder) OnBlur(handler string) *ButtonBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the button gains focus.
+func (b *ButtonBuilder) OnFocus(handler string) *ButtonBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *ButtonBuilder) OnInvalid(handler string) *ButtonBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// StartSlot sets the start slot content
+// An element, such as <wa-icon>, placed before the label.
+func (b *ButtonBuilder) StartSlot(c templ.Component) *ButtonBuilder {
+	b.props.Slots.Start = c
+	return b
+}
+
+// EndSlot sets the end slot content
+// An element, such as <wa-icon>, placed after the label.
+func (b *ButtonBuilder) EndSlot(c templ.Component) *ButtonBuilder {
+	b.props.Slots.End = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ButtonBuilder) Attr(name, value string) *ButtonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ButtonBuilder) Attrs(attrs templ.Attributes) *ButtonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ButtonBuilder) Props() ButtonProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ButtonBuilder) Build() ButtonProps {
+	return b.props
+}
+
+// Button renders the wa-button component
+func Button(props ButtonProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-button")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Variant != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " variant=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Variant)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 298, Col: 26}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Appearance != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " appearance=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Appearance)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 301, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Size != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " size=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Size)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 304, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithCaret {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " with-caret")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Loading {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " loading")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Pill {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " pill")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Type != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " type=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.Type)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 319, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Name != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 322, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 325, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Href != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, " href=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.Href)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 328, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Target != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, " target=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.Target)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 331, Col: 24}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Rel != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, " rel=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(props.Rel)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 334, Col: 18}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Download != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, " download=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var11 string
+			templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(props.Download)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 337, Col: 28}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Formaction != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, " formaction=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var12 string
+			templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(props.Formaction)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 340, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Formenctype != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, " formenctype=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var13 string
+			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(props.Formenctype)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 343, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Formmethod != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, " formmethod=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var14 string
+			templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(props.Formmethod)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 346, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Formnovalidate {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, " formnovalidate")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Formtarget != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, " formtarget=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var15 string
+			templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(props.Formtarget)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 352, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnBlur != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, " x-on:blur=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var16 string
+			templ_7745c5c3_Var16, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnBlur)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 355, Col: 27}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var16))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnFocus != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, " x-on:focus=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var17 string
+			templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnFocus)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 358, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnInvalid != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, " x-on:wa-invalid=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var18 string
+			templ_7745c5c3_Var18, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnInvalid)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/button.templ`, Line: 361, Col: 36}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var18))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 40, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 41, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Start != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 42, "<div slot=\"start\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Start.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 43, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.End != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 44, "<div slot=\"end\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.End.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 45, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 46, "</wa-button>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// ButtonFunc renders with a builder function for inline configuration
+func ButtonFunc(fn func(*ButtonBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var19 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var19 == nil {
+			templ_7745c5c3_Var19 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewButton()
+		fn(b)
+		templ_7745c5c3_Var20 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var19.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Button(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var20), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/callout.templ

@@ -0,0 +1,138 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-callout
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Callouts are used to display important messages inline.
+//
+// Web Awesome component: <wa-callout>
+
+// CalloutProps holds all properties for the wa-callout component
+type CalloutProps struct {
+	// The callout's theme variant. Defaults to brand if not within another element with a variant.
+	// Valid values: "brand", "neutral", "success", "warning", "danger"
+	Variant string `attr:"variant"`
+	// The callout's visual appearance.
+	// Valid values: "accent", "filled", "outlined", "plain", "filled-outlined"
+	Appearance string `attr:"appearance"`
+	// The callout's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots CalloutSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CalloutSlots holds named slot content for the component
+type CalloutSlots struct {
+	// An icon to show in the callout. Works best with <wa-icon>.
+	Icon templ.Component
+}
+
+// CalloutBuilder provides a fluent API for constructing CalloutProps
+type CalloutBuilder struct {
+	props CalloutProps
+}
+
+// NewCallout creates a new builder for wa-callout
+func NewCallout() *CalloutBuilder {
+	return &CalloutBuilder{}
+}
+
+// Variant sets the variant attribute
+// The callout's theme variant. Defaults to brand if not within another element with a variant.
+func (b *CalloutBuilder) Variant(v string) *CalloutBuilder {
+	b.props.Variant = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The callout's visual appearance.
+func (b *CalloutBuilder) Appearance(v string) *CalloutBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Size sets the size attribute
+// The callout's size.
+func (b *CalloutBuilder) Size(v string) *CalloutBuilder {
+	b.props.Size = v
+	return b
+}
+
+// IconSlot sets the icon slot content
+// An icon to show in the callout. Works best with <wa-icon>.
+func (b *CalloutBuilder) IconSlot(c templ.Component) *CalloutBuilder {
+	b.props.Slots.Icon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *CalloutBuilder) Attr(name, value string) *CalloutBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CalloutBuilder) Attrs(attrs templ.Attributes) *CalloutBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CalloutBuilder) Props() CalloutProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CalloutBuilder) Build() CalloutProps {
+	return b.props
+}
+
+// Callout renders the wa-callout component
+templ Callout(props CalloutProps) {
+	<wa-callout
+		if props.Variant != "" {
+			variant={ props.Variant }
+		}
+		if props.Appearance != "" {
+			appearance={ props.Appearance }
+		}
+		if props.Size != "" {
+			size={ props.Size }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Icon != nil {
+			<div slot="icon">
+				@props.Slots.Icon
+			</div>
+		}
+		{ children... }
+	</wa-callout>
+}
+
+// CalloutFunc renders with a builder function for inline configuration
+templ CalloutFunc(fn func(*CalloutBuilder)) {
+	{{ b := NewCallout(); fn(b) }}
+	@Callout(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/callout_templ.go

@@ -0,0 +1,285 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-callout
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Callouts are used to display important messages inline.
+//
+// Web Awesome component: <wa-callout>
+
+// CalloutProps holds all properties for the wa-callout component
+type CalloutProps struct {
+	// The callout's theme variant. Defaults to brand if not within another element with a variant.
+	// Valid values: "brand", "neutral", "success", "warning", "danger"
+	Variant string `attr:"variant"`
+	// The callout's visual appearance.
+	// Valid values: "accent", "filled", "outlined", "plain", "filled-outlined"
+	Appearance string `attr:"appearance"`
+	// The callout's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots CalloutSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CalloutSlots holds named slot content for the component
+type CalloutSlots struct {
+	// An icon to show in the callout. Works best with <wa-icon>.
+	Icon templ.Component
+}
+
+// CalloutBuilder provides a fluent API for constructing CalloutProps
+type CalloutBuilder struct {
+	props CalloutProps
+}
+
+// NewCallout creates a new builder for wa-callout
+func NewCallout() *CalloutBuilder {
+	return &CalloutBuilder{}
+}
+
+// Variant sets the variant attribute
+// The callout's theme variant. Defaults to brand if not within another element with a variant.
+func (b *CalloutBuilder) Variant(v string) *CalloutBuilder {
+	b.props.Variant = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The callout's visual appearance.
+func (b *CalloutBuilder) Appearance(v string) *CalloutBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Size sets the size attribute
+// The callout's size.
+func (b *CalloutBuilder) Size(v string) *CalloutBuilder {
+	b.props.Size = v
+	return b
+}
+
+// IconSlot sets the icon slot content
+// An icon to show in the callout. Works best with <wa-icon>.
+func (b *CalloutBuilder) IconSlot(c templ.Component) *CalloutBuilder {
+	b.props.Slots.Icon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *CalloutBuilder) Attr(name, value string) *CalloutBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CalloutBuilder) Attrs(attrs templ.Attributes) *CalloutBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CalloutBuilder) Props() CalloutProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CalloutBuilder) Build() CalloutProps {
+	return b.props
+}
+
+// Callout renders the wa-callout component
+func Callout(props CalloutProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-callout")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Variant != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " variant=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Variant)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/callout.templ`, Line: 113, Col: 26}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Appearance != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " appearance=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Appearance)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/callout.templ`, Line: 116, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Size != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " size=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Size)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/callout.templ`, Line: 119, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Icon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "<div slot=\"icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Icon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "</wa-callout>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// CalloutFunc renders with a builder function for inline configuration
+func CalloutFunc(fn func(*CalloutBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var5 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var5 == nil {
+			templ_7745c5c3_Var5 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewCallout()
+		fn(b)
+		templ_7745c5c3_Var6 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var5.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Callout(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var6), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/card.templ

@@ -0,0 +1,231 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-card
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Cards can be used to group related subjects in a container.
+//
+// Web Awesome component: <wa-card>
+
+// CardProps holds all properties for the wa-card component
+type CardProps struct {
+	// The card's visual appearance.
+	// Valid values: "accent", "filled", "outlined", "filled-outlined", "plain"
+	Appearance string `attr:"appearance"`
+	// Renders the card with a header. Only needed for SSR, otherwise is automatically added.
+	WithHeader bool `attr:"with-header"`
+	// Renders the card with an image. Only needed for SSR, otherwise is automatically added.
+	WithMedia bool `attr:"with-media"`
+	// Renders the card with a footer. Only needed for SSR, otherwise is automatically added.
+	WithFooter bool `attr:"with-footer"`
+	// Renders the card's orientation *
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots CardSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CardSlots holds named slot content for the component
+type CardSlots struct {
+	// An optional header for the card.
+	Header templ.Component
+	// An optional footer for the card.
+	Footer templ.Component
+	// An optional media section to render at the start of the card.
+	Media templ.Component
+	// An optional actions section to render at the end for the horizontal card.
+	Actions templ.Component
+	// An optional actions section to render in the header of the vertical card.
+	HeaderActions templ.Component
+	// An optional actions section to render in the footer of the vertical card.
+	FooterActions templ.Component
+}
+
+// CardBuilder provides a fluent API for constructing CardProps
+type CardBuilder struct {
+	props CardProps
+}
+
+// NewCard creates a new builder for wa-card
+func NewCard() *CardBuilder {
+	return &CardBuilder{}
+}
+
+// Appearance sets the appearance attribute
+// The card's visual appearance.
+func (b *CardBuilder) Appearance(v string) *CardBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// WithHeader sets the with-header attribute
+// Renders the card with a header. Only needed for SSR, otherwise is automatically added.
+func (b *CardBuilder) WithHeader(v bool) *CardBuilder {
+	b.props.WithHeader = v
+	return b
+}
+
+// WithMedia sets the with-media attribute
+// Renders the card with an image. Only needed for SSR, otherwise is automatically added.
+func (b *CardBuilder) WithMedia(v bool) *CardBuilder {
+	b.props.WithMedia = v
+	return b
+}
+
+// WithFooter sets the with-footer attribute
+// Renders the card with a footer. Only needed for SSR, otherwise is automatically added.
+func (b *CardBuilder) WithFooter(v bool) *CardBuilder {
+	b.props.WithFooter = v
+	return b
+}
+
+// Orientation sets the orientation attribute
+// Renders the card's orientation *
+func (b *CardBuilder) Orientation(v string) *CardBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// HeaderSlot sets the header slot content
+// An optional header for the card.
+func (b *CardBuilder) HeaderSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.Header = c
+	return b
+}
+
+// FooterSlot sets the footer slot content
+// An optional footer for the card.
+func (b *CardBuilder) FooterSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.Footer = c
+	return b
+}
+
+// MediaSlot sets the media slot content
+// An optional media section to render at the start of the card.
+func (b *CardBuilder) MediaSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.Media = c
+	return b
+}
+
+// ActionsSlot sets the actions slot content
+// An optional actions section to render at the end for the horizontal card.
+func (b *CardBuilder) ActionsSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.Actions = c
+	return b
+}
+
+// HeaderActionsSlot sets the header-actions slot content
+// An optional actions section to render in the header of the vertical card.
+func (b *CardBuilder) HeaderActionsSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.HeaderActions = c
+	return b
+}
+
+// FooterActionsSlot sets the footer-actions slot content
+// An optional actions section to render in the footer of the vertical card.
+func (b *CardBuilder) FooterActionsSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.FooterActions = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *CardBuilder) Attr(name, value string) *CardBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CardBuilder) Attrs(attrs templ.Attributes) *CardBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CardBuilder) Props() CardProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CardBuilder) Build() CardProps {
+	return b.props
+}
+
+// Card renders the wa-card component
+templ Card(props CardProps) {
+	<wa-card
+		if props.Appearance != "" {
+			appearance={ props.Appearance }
+		}
+		if props.WithHeader {
+			with-header
+		}
+		if props.WithMedia {
+			with-media
+		}
+		if props.WithFooter {
+			with-footer
+		}
+		if props.Orientation != "" {
+			orientation={ props.Orientation }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Header != nil {
+			<div slot="header">
+				@props.Slots.Header
+			</div>
+		}
+		if props.Slots.Footer != nil {
+			<div slot="footer">
+				@props.Slots.Footer
+			</div>
+		}
+		if props.Slots.Media != nil {
+			<div slot="media">
+				@props.Slots.Media
+			</div>
+		}
+		if props.Slots.Actions != nil {
+			<div slot="actions">
+				@props.Slots.Actions
+			</div>
+		}
+		if props.Slots.HeaderActions != nil {
+			<div slot="header-actions">
+				@props.Slots.HeaderActions
+			</div>
+		}
+		if props.Slots.FooterActions != nil {
+			<div slot="footer-actions">
+				@props.Slots.FooterActions
+			</div>
+		}
+		{ children... }
+	</wa-card>
+}
+
+// CardFunc renders with a builder function for inline configuration
+templ CardFunc(fn func(*CardBuilder)) {
+	{{ b := NewCard(); fn(b) }}
+	@Card(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/card_templ.go

@@ -0,0 +1,416 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-card
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Cards can be used to group related subjects in a container.
+//
+// Web Awesome component: <wa-card>
+
+// CardProps holds all properties for the wa-card component
+type CardProps struct {
+	// The card's visual appearance.
+	// Valid values: "accent", "filled", "outlined", "filled-outlined", "plain"
+	Appearance string `attr:"appearance"`
+	// Renders the card with a header. Only needed for SSR, otherwise is automatically added.
+	WithHeader bool `attr:"with-header"`
+	// Renders the card with an image. Only needed for SSR, otherwise is automatically added.
+	WithMedia bool `attr:"with-media"`
+	// Renders the card with a footer. Only needed for SSR, otherwise is automatically added.
+	WithFooter bool `attr:"with-footer"`
+	// Renders the card's orientation *
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots CardSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CardSlots holds named slot content for the component
+type CardSlots struct {
+	// An optional header for the card.
+	Header templ.Component
+	// An optional footer for the card.
+	Footer templ.Component
+	// An optional media section to render at the start of the card.
+	Media templ.Component
+	// An optional actions section to render at the end for the horizontal card.
+	Actions templ.Component
+	// An optional actions section to render in the header of the vertical card.
+	HeaderActions templ.Component
+	// An optional actions section to render in the footer of the vertical card.
+	FooterActions templ.Component
+}
+
+// CardBuilder provides a fluent API for constructing CardProps
+type CardBuilder struct {
+	props CardProps
+}
+
+// NewCard creates a new builder for wa-card
+func NewCard() *CardBuilder {
+	return &CardBuilder{}
+}
+
+// Appearance sets the appearance attribute
+// The card's visual appearance.
+func (b *CardBuilder) Appearance(v string) *CardBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// WithHeader sets the with-header attribute
+// Renders the card with a header. Only needed for SSR, otherwise is automatically added.
+func (b *CardBuilder) WithHeader(v bool) *CardBuilder {
+	b.props.WithHeader = v
+	return b
+}
+
+// WithMedia sets the with-media attribute
+// Renders the card with an image. Only needed for SSR, otherwise is automatically added.
+func (b *CardBuilder) WithMedia(v bool) *CardBuilder {
+	b.props.WithMedia = v
+	return b
+}
+
+// WithFooter sets the with-footer attribute
+// Renders the card with a footer. Only needed for SSR, otherwise is automatically added.
+func (b *CardBuilder) WithFooter(v bool) *CardBuilder {
+	b.props.WithFooter = v
+	return b
+}
+
+// Orientation sets the orientation attribute
+// Renders the card's orientation *
+func (b *CardBuilder) Orientation(v string) *CardBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// HeaderSlot sets the header slot content
+// An optional header for the card.
+func (b *CardBuilder) HeaderSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.Header = c
+	return b
+}
+
+// FooterSlot sets the footer slot content
+// An optional footer for the card.
+func (b *CardBuilder) FooterSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.Footer = c
+	return b
+}
+
+// MediaSlot sets the media slot content
+// An optional media section to render at the start of the card.
+func (b *CardBuilder) MediaSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.Media = c
+	return b
+}
+
+// ActionsSlot sets the actions slot content
+// An optional actions section to render at the end for the horizontal card.
+func (b *CardBuilder) ActionsSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.Actions = c
+	return b
+}
+
+// HeaderActionsSlot sets the header-actions slot content
+// An optional actions section to render in the header of the vertical card.
+func (b *CardBuilder) HeaderActionsSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.HeaderActions = c
+	return b
+}
+
+// FooterActionsSlot sets the footer-actions slot content
+// An optional actions section to render in the footer of the vertical card.
+func (b *CardBuilder) FooterActionsSlot(c templ.Component) *CardBuilder {
+	b.props.Slots.FooterActions = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *CardBuilder) Attr(name, value string) *CardBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CardBuilder) Attrs(attrs templ.Attributes) *CardBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CardBuilder) Props() CardProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CardBuilder) Build() CardProps {
+	return b.props
+}
+
+// Card renders the wa-card component
+func Card(props CardProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-card")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Appearance != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " appearance=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Appearance)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/card.templ`, Line: 175, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithHeader {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " with-header")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithMedia {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " with-media")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithFooter {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " with-footer")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Orientation != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " orientation=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Orientation)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/card.templ`, Line: 187, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Header != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "<div slot=\"header\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Header.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Footer != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "<div slot=\"footer\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Footer.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Media != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "<div slot=\"media\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Media.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Actions != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "<div slot=\"actions\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Actions.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.HeaderActions != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "<div slot=\"header-actions\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.HeaderActions.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.FooterActions != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "<div slot=\"footer-actions\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.FooterActions.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "</wa-card>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// CardFunc renders with a builder function for inline configuration
+func CardFunc(fn func(*CardBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var4 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var4 == nil {
+			templ_7745c5c3_Var4 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewCard()
+		fn(b)
+		templ_7745c5c3_Var5 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var4.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Card(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var5), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/carousel-item.templ

@@ -0,0 +1,81 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-carousel-item
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// A carousel item represent a slide within a carousel.
+//
+// Web Awesome component: <wa-carousel-item>
+
+// CarouselItemProps holds all properties for the wa-carousel-item component
+type CarouselItemProps struct {
+
+	// Events
+
+	// Slots contains named slot content
+	Slots CarouselItemSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CarouselItemBuilder provides a fluent API for constructing CarouselItemProps
+type CarouselItemBuilder struct {
+	props CarouselItemProps
+}
+
+// NewCarouselItem creates a new builder for wa-carousel-item
+func NewCarouselItem() *CarouselItemBuilder {
+	return &CarouselItemBuilder{}
+}
+
+// Attr adds a custom HTML attribute
+func (b *CarouselItemBuilder) Attr(name, value string) *CarouselItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CarouselItemBuilder) Attrs(attrs templ.Attributes) *CarouselItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CarouselItemBuilder) Props() CarouselItemProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CarouselItemBuilder) Build() CarouselItemProps {
+	return b.props
+}
+
+// CarouselItem renders the wa-carousel-item component
+templ CarouselItem(props CarouselItemProps) {
+	<wa-carousel-item
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-carousel-item>
+}
+
+// CarouselItemFunc renders with a builder function for inline configuration
+templ CarouselItemFunc(fn func(*CarouselItemBuilder)) {
+	{{ b := NewCarouselItem(); fn(b) }}
+	@CarouselItem(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/carousel-item_templ.go

@@ -0,0 +1,171 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-carousel-item
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// A carousel item represent a slide within a carousel.
+//
+// Web Awesome component: <wa-carousel-item>
+
+// CarouselItemProps holds all properties for the wa-carousel-item component
+type CarouselItemProps struct {
+
+	// Events
+
+	// Slots contains named slot content
+	Slots CarouselItemSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CarouselItemBuilder provides a fluent API for constructing CarouselItemProps
+type CarouselItemBuilder struct {
+	props CarouselItemProps
+}
+
+// NewCarouselItem creates a new builder for wa-carousel-item
+func NewCarouselItem() *CarouselItemBuilder {
+	return &CarouselItemBuilder{}
+}
+
+// Attr adds a custom HTML attribute
+func (b *CarouselItemBuilder) Attr(name, value string) *CarouselItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CarouselItemBuilder) Attrs(attrs templ.Attributes) *CarouselItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CarouselItemBuilder) Props() CarouselItemProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CarouselItemBuilder) Build() CarouselItemProps {
+	return b.props
+}
+
+// CarouselItem renders the wa-carousel-item component
+func CarouselItem(props CarouselItemProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-carousel-item")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "</wa-carousel-item>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// CarouselItemFunc renders with a builder function for inline configuration
+func CarouselItemFunc(fn func(*CarouselItemBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var2 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var2 == nil {
+			templ_7745c5c3_Var2 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewCarouselItem()
+		fn(b)
+		templ_7745c5c3_Var3 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var2.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = CarouselItem(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var3), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/carousel.templ

@@ -0,0 +1,256 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-carousel
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Carousels display an arbitrary number of content slides along a horizontal or vertical axis.
+//
+// Web Awesome component: <wa-carousel>
+
+// CarouselProps holds all properties for the wa-carousel component
+type CarouselProps struct {
+	// When set, allows the user to navigate the carousel in the same direction indefinitely.
+	Loop bool `attr:"loop"`
+	// 
+	Slides float64 `attr:"slides"`
+	// 
+	CurrentSlide float64 `attr:"currentSlide"`
+	// When set, show the carousel's navigation.
+	Navigation bool `attr:"navigation"`
+	// When set, show the carousel's pagination indicators.
+	Pagination bool `attr:"pagination"`
+	// When set, the slides will scroll automatically when the user is not interacting with them.
+	Autoplay bool `attr:"autoplay"`
+	// Specifies the amount of time, in milliseconds, between each automatic scroll.
+	AutoplayInterval float64 `attr:"autoplay-interval"`
+	// Specifies how many slides should be shown at a given time.
+	SlidesPerPage float64 `attr:"slides-per-page"`
+	// Specifies the number of slides the carousel will advance when scrolling, useful when specifying a slides-per-page
+	SlidesPerMove float64 `attr:"slides-per-move"`
+	// Specifies the orientation in which the carousel will lay out.
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+	// When set, it is possible to scroll through the slides by dragging them with the mouse.
+	MouseDragging bool `attr:"mouse-dragging"`
+
+	// Events
+	// Emitted when the active slide changes.
+	OnSlideChange string `attr:"x-on:wa-slide-change"`
+
+	// Slots contains named slot content
+	Slots CarouselSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CarouselSlots holds named slot content for the component
+type CarouselSlots struct {
+	// Optional next icon to use instead of the default. Works best with <wa-icon>.
+	NextIcon templ.Component
+	// Optional previous icon to use instead of the default. Works best with <wa-icon>.
+	PreviousIcon templ.Component
+}
+
+// CarouselBuilder provides a fluent API for constructing CarouselProps
+type CarouselBuilder struct {
+	props CarouselProps
+}
+
+// NewCarousel creates a new builder for wa-carousel
+func NewCarousel() *CarouselBuilder {
+	return &CarouselBuilder{}
+}
+
+// Loop sets the loop attribute
+// When set, allows the user to navigate the carousel in the same direction indefinitely.
+func (b *CarouselBuilder) Loop(v bool) *CarouselBuilder {
+	b.props.Loop = v
+	return b
+}
+
+// Slides sets the slides attribute
+func (b *CarouselBuilder) Slides(v float64) *CarouselBuilder {
+	b.props.Slides = v
+	return b
+}
+
+// CurrentSlide sets the currentSlide attribute
+func (b *CarouselBuilder) CurrentSlide(v float64) *CarouselBuilder {
+	b.props.CurrentSlide = v
+	return b
+}
+
+// Navigation sets the navigation attribute
+// When set, show the carousel's navigation.
+func (b *CarouselBuilder) Navigation(v bool) *CarouselBuilder {
+	b.props.Navigation = v
+	return b
+}
+
+// Pagination sets the pagination attribute
+// When set, show the carousel's pagination indicators.
+func (b *CarouselBuilder) Pagination(v bool) *CarouselBuilder {
+	b.props.Pagination = v
+	return b
+}
+
+// Autoplay sets the autoplay attribute
+// When set, the slides will scroll automatically when the user is not interacting with them.
+func (b *CarouselBuilder) Autoplay(v bool) *CarouselBuilder {
+	b.props.Autoplay = v
+	return b
+}
+
+// AutoplayInterval sets the autoplay-interval attribute
+// Specifies the amount of time, in milliseconds, between each automatic scroll.
+func (b *CarouselBuilder) AutoplayInterval(v float64) *CarouselBuilder {
+	b.props.AutoplayInterval = v
+	return b
+}
+
+// SlidesPerPage sets the slides-per-page attribute
+// Specifies how many slides should be shown at a given time.
+func (b *CarouselBuilder) SlidesPerPage(v float64) *CarouselBuilder {
+	b.props.SlidesPerPage = v
+	return b
+}
+
+// SlidesPerMove sets the slides-per-move attribute
+// Specifies the number of slides the carousel will advance when scrolling, useful when specifying a slides-per-page
+func (b *CarouselBuilder) SlidesPerMove(v float64) *CarouselBuilder {
+	b.props.SlidesPerMove = v
+	return b
+}
+
+// Orientation sets the orientation attribute
+// Specifies the orientation in which the carousel will lay out.
+func (b *CarouselBuilder) Orientation(v string) *CarouselBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// MouseDragging sets the mouse-dragging attribute
+// When set, it is possible to scroll through the slides by dragging them with the mouse.
+func (b *CarouselBuilder) MouseDragging(v bool) *CarouselBuilder {
+	b.props.MouseDragging = v
+	return b
+}
+
+// OnSlideChange sets the handler for wa-slide-change event
+// Emitted when the active slide changes.
+func (b *CarouselBuilder) OnSlideChange(handler string) *CarouselBuilder {
+	b.props.OnSlideChange = handler
+	return b
+}
+
+// NextIconSlot sets the next-icon slot content
+// Optional next icon to use instead of the default. Works best with <wa-icon>.
+func (b *CarouselBuilder) NextIconSlot(c templ.Component) *CarouselBuilder {
+	b.props.Slots.NextIcon = c
+	return b
+}
+
+// PreviousIconSlot sets the previous-icon slot content
+// Optional previous icon to use instead of the default. Works best with <wa-icon>.
+func (b *CarouselBuilder) PreviousIconSlot(c templ.Component) *CarouselBuilder {
+	b.props.Slots.PreviousIcon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *CarouselBuilder) Attr(name, value string) *CarouselBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CarouselBuilder) Attrs(attrs templ.Attributes) *CarouselBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CarouselBuilder) Props() CarouselProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CarouselBuilder) Build() CarouselProps {
+	return b.props
+}
+
+// Carousel renders the wa-carousel component
+templ Carousel(props CarouselProps) {
+	<wa-carousel
+		if props.Loop {
+			loop
+		}
+		if props.Slides != 0 {
+			slides={ templ.Sprintf("%v", props.Slides) }
+		}
+		if props.CurrentSlide != 0 {
+			currentSlide={ templ.Sprintf("%v", props.CurrentSlide) }
+		}
+		if props.Navigation {
+			navigation
+		}
+		if props.Pagination {
+			pagination
+		}
+		if props.Autoplay {
+			autoplay
+		}
+		if props.AutoplayInterval != 0 {
+			autoplay-interval={ templ.Sprintf("%v", props.AutoplayInterval) }
+		}
+		if props.SlidesPerPage != 0 {
+			slides-per-page={ templ.Sprintf("%v", props.SlidesPerPage) }
+		}
+		if props.SlidesPerMove != 0 {
+			slides-per-move={ templ.Sprintf("%v", props.SlidesPerMove) }
+		}
+		if props.Orientation != "" {
+			orientation={ props.Orientation }
+		}
+		if props.MouseDragging {
+			mouse-dragging
+		}
+		if props.OnSlideChange != "" {
+			x-on:wa-slide-change={ props.OnSlideChange }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.NextIcon != nil {
+			<div slot="next-icon">
+				@props.Slots.NextIcon
+			</div>
+		}
+		if props.Slots.PreviousIcon != nil {
+			<div slot="previous-icon">
+				@props.Slots.PreviousIcon
+			</div>
+		}
+		{ children... }
+	</wa-carousel>
+}
+
+// CarouselFunc renders with a builder function for inline configuration
+templ CarouselFunc(fn func(*CarouselBuilder)) {
+	{{ b := NewCarousel(); fn(b) }}
+	@Carousel(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/carousel_templ.go

@@ -0,0 +1,491 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-carousel
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Carousels display an arbitrary number of content slides along a horizontal or vertical axis.
+//
+// Web Awesome component: <wa-carousel>
+
+// CarouselProps holds all properties for the wa-carousel component
+type CarouselProps struct {
+	// When set, allows the user to navigate the carousel in the same direction indefinitely.
+	Loop bool `attr:"loop"`
+	//
+	Slides float64 `attr:"slides"`
+	//
+	CurrentSlide float64 `attr:"currentSlide"`
+	// When set, show the carousel's navigation.
+	Navigation bool `attr:"navigation"`
+	// When set, show the carousel's pagination indicators.
+	Pagination bool `attr:"pagination"`
+	// When set, the slides will scroll automatically when the user is not interacting with them.
+	Autoplay bool `attr:"autoplay"`
+	// Specifies the amount of time, in milliseconds, between each automatic scroll.
+	AutoplayInterval float64 `attr:"autoplay-interval"`
+	// Specifies how many slides should be shown at a given time.
+	SlidesPerPage float64 `attr:"slides-per-page"`
+	// Specifies the number of slides the carousel will advance when scrolling, useful when specifying a slides-per-page
+	SlidesPerMove float64 `attr:"slides-per-move"`
+	// Specifies the orientation in which the carousel will lay out.
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+	// When set, it is possible to scroll through the slides by dragging them with the mouse.
+	MouseDragging bool `attr:"mouse-dragging"`
+
+	// Events
+	// Emitted when the active slide changes.
+	OnSlideChange string `attr:"x-on:wa-slide-change"`
+
+	// Slots contains named slot content
+	Slots CarouselSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CarouselSlots holds named slot content for the component
+type CarouselSlots struct {
+	// Optional next icon to use instead of the default. Works best with <wa-icon>.
+	NextIcon templ.Component
+	// Optional previous icon to use instead of the default. Works best with <wa-icon>.
+	PreviousIcon templ.Component
+}
+
+// CarouselBuilder provides a fluent API for constructing CarouselProps
+type CarouselBuilder struct {
+	props CarouselProps
+}
+
+// NewCarousel creates a new builder for wa-carousel
+func NewCarousel() *CarouselBuilder {
+	return &CarouselBuilder{}
+}
+
+// Loop sets the loop attribute
+// When set, allows the user to navigate the carousel in the same direction indefinitely.
+func (b *CarouselBuilder) Loop(v bool) *CarouselBuilder {
+	b.props.Loop = v
+	return b
+}
+
+// Slides sets the slides attribute
+func (b *CarouselBuilder) Slides(v float64) *CarouselBuilder {
+	b.props.Slides = v
+	return b
+}
+
+// CurrentSlide sets the currentSlide attribute
+func (b *CarouselBuilder) CurrentSlide(v float64) *CarouselBuilder {
+	b.props.CurrentSlide = v
+	return b
+}
+
+// Navigation sets the navigation attribute
+// When set, show the carousel's navigation.
+func (b *CarouselBuilder) Navigation(v bool) *CarouselBuilder {
+	b.props.Navigation = v
+	return b
+}
+
+// Pagination sets the pagination attribute
+// When set, show the carousel's pagination indicators.
+func (b *CarouselBuilder) Pagination(v bool) *CarouselBuilder {
+	b.props.Pagination = v
+	return b
+}
+
+// Autoplay sets the autoplay attribute
+// When set, the slides will scroll automatically when the user is not interacting with them.
+func (b *CarouselBuilder) Autoplay(v bool) *CarouselBuilder {
+	b.props.Autoplay = v
+	return b
+}
+
+// AutoplayInterval sets the autoplay-interval attribute
+// Specifies the amount of time, in milliseconds, between each automatic scroll.
+func (b *CarouselBuilder) AutoplayInterval(v float64) *CarouselBuilder {
+	b.props.AutoplayInterval = v
+	return b
+}
+
+// SlidesPerPage sets the slides-per-page attribute
+// Specifies how many slides should be shown at a given time.
+func (b *CarouselBuilder) SlidesPerPage(v float64) *CarouselBuilder {
+	b.props.SlidesPerPage = v
+	return b
+}
+
+// SlidesPerMove sets the slides-per-move attribute
+// Specifies the number of slides the carousel will advance when scrolling, useful when specifying a slides-per-page
+func (b *CarouselBuilder) SlidesPerMove(v float64) *CarouselBuilder {
+	b.props.SlidesPerMove = v
+	return b
+}
+
+// Orientation sets the orientation attribute
+// Specifies the orientation in which the carousel will lay out.
+func (b *CarouselBuilder) Orientation(v string) *CarouselBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// MouseDragging sets the mouse-dragging attribute
+// When set, it is possible to scroll through the slides by dragging them with the mouse.
+func (b *CarouselBuilder) MouseDragging(v bool) *CarouselBuilder {
+	b.props.MouseDragging = v
+	return b
+}
+
+// OnSlideChange sets the handler for wa-slide-change event
+// Emitted when the active slide changes.
+func (b *CarouselBuilder) OnSlideChange(handler string) *CarouselBuilder {
+	b.props.OnSlideChange = handler
+	return b
+}
+
+// NextIconSlot sets the next-icon slot content
+// Optional next icon to use instead of the default. Works best with <wa-icon>.
+func (b *CarouselBuilder) NextIconSlot(c templ.Component) *CarouselBuilder {
+	b.props.Slots.NextIcon = c
+	return b
+}
+
+// PreviousIconSlot sets the previous-icon slot content
+// Optional previous icon to use instead of the default. Works best with <wa-icon>.
+func (b *CarouselBuilder) PreviousIconSlot(c templ.Component) *CarouselBuilder {
+	b.props.Slots.PreviousIcon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *CarouselBuilder) Attr(name, value string) *CarouselBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CarouselBuilder) Attrs(attrs templ.Attributes) *CarouselBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CarouselBuilder) Props() CarouselProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CarouselBuilder) Build() CarouselProps {
+	return b.props
+}
+
+// Carousel renders the wa-carousel component
+func Carousel(props CarouselProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-carousel")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Loop {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " loop")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slides != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, " slides=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Slides))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/carousel.templ`, Line: 202, Col: 45}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.CurrentSlide != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " currentSlide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.CurrentSlide))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/carousel.templ`, Line: 205, Col: 57}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Navigation {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " navigation")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Pagination {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " pagination")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Autoplay {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " autoplay")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.AutoplayInterval != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " autoplay-interval=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.AutoplayInterval))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/carousel.templ`, Line: 217, Col: 66}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.SlidesPerPage != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " slides-per-page=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.SlidesPerPage))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/carousel.templ`, Line: 220, Col: 61}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.SlidesPerMove != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " slides-per-move=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.SlidesPerMove))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/carousel.templ`, Line: 223, Col: 61}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Orientation != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " orientation=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.Orientation)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/carousel.templ`, Line: 226, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.MouseDragging {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, " mouse-dragging")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnSlideChange != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, " x-on:wa-slide-change=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnSlideChange)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/carousel.templ`, Line: 232, Col: 45}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.NextIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "<div slot=\"next-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.NextIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.PreviousIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "<div slot=\"previous-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.PreviousIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "</wa-carousel>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// CarouselFunc renders with a builder function for inline configuration
+func CarouselFunc(fn func(*CarouselBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var9 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var9 == nil {
+			templ_7745c5c3_Var9 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewCarousel()
+		fn(b)
+		templ_7745c5c3_Var10 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var9.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Carousel(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var10), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/cdn.templ

@@ -0,0 +1,36 @@
+// Code generated by wa-generator. DO NOT EDIT.
+
+package wa
+
+// CDNVersion is the Web Awesome version used for CDN assets
+const CDNVersion = "3.1.0"
+
+// CDNHead renders the required CSS and JS for Web Awesome from CDN
+templ CDNHead() {
+	<link rel="stylesheet" href={ "https://cdn.jsdelivr.net/npm/@aspect/web-awesome@" + CDNVersion + "/dist/themes/default.css" }/>
+	<script type="module" src={ "https://cdn.jsdelivr.net/npm/@aspect/web-awesome@" + CDNVersion + "/dist/web-awesome.loader.js" }></script>
+}
+
+// CDNHeadPro renders the required CSS and JS for Web Awesome Pro from CDN
+// Requires a valid license key configured in your environment
+templ CDNHeadPro() {
+	<link rel="stylesheet" href={ "https://cdn.jsdelivr.net/npm/@awesome.me/webawesome-pro@" + CDNVersion + "/dist/themes/default.css" }/>
+	<script type="module" src={ "https://cdn.jsdelivr.net/npm/@awesome.me/webawesome-pro@" + CDNVersion + "/dist/webawesome.loader.js" }></script>
+}
+
+// CDNHeadWithTheme renders CDN assets with a specific theme
+templ CDNHeadWithTheme(theme string) {
+	<link rel="stylesheet" href={ "https://cdn.jsdelivr.net/npm/@aspect/web-awesome@" + CDNVersion + "/dist/themes/" + theme + ".css" }/>
+	<script type="module" src={ "https://cdn.jsdelivr.net/npm/@aspect/web-awesome@" + CDNVersion + "/dist/web-awesome.loader.js" }></script>
+}
+
+// LocalHead renders Web Awesome assets from local paths
+templ LocalHead(cssPath, jsPath string) {
+	<link rel="stylesheet" href={ cssPath }/>
+	<script type="module" src={ jsPath }></script>
+}
+
+// FontAwesomeKit renders Font Awesome kit script
+templ FontAwesomeKit(kitCode string) {
+	<script src={ "https://kit.fontawesome.com/" + kitCode + ".js" } crossorigin="anonymous"></script>
+}

pkg/wa/cdn_templ.go

@@ -0,0 +1,284 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+// CDNVersion is the Web Awesome version used for CDN assets
+const CDNVersion = "3.1.0"
+
+// CDNHead renders the required CSS and JS for Web Awesome from CDN
+func CDNHead() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<link rel=\"stylesheet\" href=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var2 templ.SafeURL
+		templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinURLErrs("https://cdn.jsdelivr.net/npm/@aspect/web-awesome@" + CDNVersion + "/dist/themes/default.css")
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/cdn.templ`, Line: 10, Col: 124}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, "\"><script type=\"module\" src=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var3 string
+		templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs("https://cdn.jsdelivr.net/npm/@aspect/web-awesome@" + CDNVersion + "/dist/web-awesome.loader.js")
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/cdn.templ`, Line: 11, Col: 125}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"></script>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// CDNHeadPro renders the required CSS and JS for Web Awesome Pro from CDN
+// Requires a valid license key configured in your environment
+func CDNHeadPro() templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var4 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var4 == nil {
+			templ_7745c5c3_Var4 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "<link rel=\"stylesheet\" href=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var5 templ.SafeURL
+		templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinURLErrs("https://cdn.jsdelivr.net/npm/@awesome.me/webawesome-pro@" + CDNVersion + "/dist/themes/default.css")
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/cdn.templ`, Line: 17, Col: 131}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"><script type=\"module\" src=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var6 string
+		templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs("https://cdn.jsdelivr.net/npm/@awesome.me/webawesome-pro@" + CDNVersion + "/dist/webawesome.loader.js")
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/cdn.templ`, Line: 18, Col: 131}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "\"></script>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// CDNHeadWithTheme renders CDN assets with a specific theme
+func CDNHeadWithTheme(theme string) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var7 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var7 == nil {
+			templ_7745c5c3_Var7 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "<link rel=\"stylesheet\" href=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var8 templ.SafeURL
+		templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinURLErrs("https://cdn.jsdelivr.net/npm/@aspect/web-awesome@" + CDNVersion + "/dist/themes/" + theme + ".css")
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/cdn.templ`, Line: 23, Col: 130}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"><script type=\"module\" src=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var9 string
+		templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs("https://cdn.jsdelivr.net/npm/@aspect/web-awesome@" + CDNVersion + "/dist/web-awesome.loader.js")
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/cdn.templ`, Line: 24, Col: 125}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"></script>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// LocalHead renders Web Awesome assets from local paths
+func LocalHead(cssPath, jsPath string) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var10 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var10 == nil {
+			templ_7745c5c3_Var10 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "<link rel=\"stylesheet\" href=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var11 templ.SafeURL
+		templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinURLErrs(cssPath)
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/cdn.templ`, Line: 29, Col: 38}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "\"><script type=\"module\" src=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var12 string
+		templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(jsPath)
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/cdn.templ`, Line: 30, Col: 35}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"></script>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// FontAwesomeKit renders Font Awesome kit script
+func FontAwesomeKit(kitCode string) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var13 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var13 == nil {
+			templ_7745c5c3_Var13 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "<script src=\"")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		var templ_7745c5c3_Var14 string
+		templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs("https://kit.fontawesome.com/" + kitCode + ".js")
+		if templ_7745c5c3_Err != nil {
+			return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/cdn.templ`, Line: 35, Col: 63}
+		}
+		_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\" crossorigin=\"anonymous\"></script>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/checkbox.templ

@@ -0,0 +1,256 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-checkbox
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Checkboxes allow the user to toggle an option on or off.
+//
+// Web Awesome component: <wa-checkbox>
+
+// CheckboxProps holds all properties for the wa-checkbox component
+type CheckboxProps struct {
+	// The name of the checkbox, submitted as a name/value pair with form data.
+	Name string `attr:"name"`
+	// The value of the checkbox, submitted as a name/value pair with form data.
+	Value string `attr:"value"`
+	// The checkbox's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Disables the checkbox.
+	Disabled bool `attr:"disabled"`
+	// Draws the checkbox in an indeterminate state. This is usually applied to checkboxes that represents a "select
+	Indeterminate bool `attr:"indeterminate"`
+	// The default value of the form control. Primarily used for resetting the form control.
+	Checked bool `attr:"checked"`
+	// Makes the checkbox a required field.
+	Required bool `attr:"required"`
+	// The checkbox's hint. If you need to display HTML, use the hint slot instead.
+	Hint string `attr:"hint"`
+
+	// Events
+	// Emitted when the checked state changes.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the checkbox loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the checkbox gains focus.
+	OnFocus string `attr:"x-on:focus"`
+	// Emitted when the checkbox receives input.
+	OnInput string `attr:"x-on:input"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots CheckboxSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CheckboxSlots holds named slot content for the component
+type CheckboxSlots struct {
+	// Text that describes how to use the checkbox. Alternatively, you can use the hint attribute.
+	Hint templ.Component
+}
+
+// CheckboxBuilder provides a fluent API for constructing CheckboxProps
+type CheckboxBuilder struct {
+	props CheckboxProps
+}
+
+// NewCheckbox creates a new builder for wa-checkbox
+func NewCheckbox() *CheckboxBuilder {
+	return &CheckboxBuilder{}
+}
+
+// Name sets the name attribute
+// The name of the checkbox, submitted as a name/value pair with form data.
+func (b *CheckboxBuilder) Name(v string) *CheckboxBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Value sets the value attribute
+// The value of the checkbox, submitted as a name/value pair with form data.
+func (b *CheckboxBuilder) Value(v string) *CheckboxBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Size sets the size attribute
+// The checkbox's size.
+func (b *CheckboxBuilder) Size(v string) *CheckboxBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the checkbox.
+func (b *CheckboxBuilder) Disabled(v bool) *CheckboxBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Indeterminate sets the indeterminate attribute
+// Draws the checkbox in an indeterminate state. This is usually applied to checkboxes that represents a "select
+func (b *CheckboxBuilder) Indeterminate(v bool) *CheckboxBuilder {
+	b.props.Indeterminate = v
+	return b
+}
+
+// Checked sets the checked attribute
+// The default value of the form control. Primarily used for resetting the form control.
+func (b *CheckboxBuilder) Checked(v bool) *CheckboxBuilder {
+	b.props.Checked = v
+	return b
+}
+
+// Required sets the required attribute
+// Makes the checkbox a required field.
+func (b *CheckboxBuilder) Required(v bool) *CheckboxBuilder {
+	b.props.Required = v
+	return b
+}
+
+// Hint sets the hint attribute
+// The checkbox's hint. If you need to display HTML, use the hint slot instead.
+func (b *CheckboxBuilder) Hint(v string) *CheckboxBuilder {
+	b.props.Hint = v
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the checked state changes.
+func (b *CheckboxBuilder) OnChange(handler string) *CheckboxBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the checkbox loses focus.
+func (b *CheckboxBuilder) OnBlur(handler string) *CheckboxBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the checkbox gains focus.
+func (b *CheckboxBuilder) OnFocus(handler string) *CheckboxBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// OnInput sets the handler for input event
+// Emitted when the checkbox receives input.
+func (b *CheckboxBuilder) OnInput(handler string) *CheckboxBuilder {
+	b.props.OnInput = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *CheckboxBuilder) OnInvalid(handler string) *CheckboxBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// HintSlot sets the hint slot content
+// Text that describes how to use the checkbox. Alternatively, you can use the hint attribute.
+func (b *CheckboxBuilder) HintSlot(c templ.Component) *CheckboxBuilder {
+	b.props.Slots.Hint = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *CheckboxBuilder) Attr(name, value string) *CheckboxBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CheckboxBuilder) Attrs(attrs templ.Attributes) *CheckboxBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CheckboxBuilder) Props() CheckboxProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CheckboxBuilder) Build() CheckboxProps {
+	return b.props
+}
+
+// Checkbox renders the wa-checkbox component
+templ Checkbox(props CheckboxProps) {
+	<wa-checkbox
+		if props.Name != "" {
+			name={ props.Name }
+		}
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.Size != "" {
+			size={ props.Size }
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.Indeterminate {
+			indeterminate
+		}
+		if props.Checked {
+			checked
+		}
+		if props.Required {
+			required
+		}
+		if props.Hint != "" {
+			hint={ props.Hint }
+		}
+		if props.OnChange != "" {
+			x-on:change={ props.OnChange }
+		}
+		if props.OnBlur != "" {
+			x-on:blur={ props.OnBlur }
+		}
+		if props.OnFocus != "" {
+			x-on:focus={ props.OnFocus }
+		}
+		if props.OnInput != "" {
+			x-on:input={ props.OnInput }
+		}
+		if props.OnInvalid != "" {
+			x-on:wa-invalid={ props.OnInvalid }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Hint != nil {
+			<div slot="hint">
+				@props.Slots.Hint
+			</div>
+		}
+		{ children... }
+	</wa-checkbox>
+}
+
+// CheckboxFunc renders with a builder function for inline configuration
+templ CheckboxFunc(fn func(*CheckboxBuilder)) {
+	{{ b := NewCheckbox(); fn(b) }}
+	@Checkbox(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/checkbox_templ.go

@@ -0,0 +1,511 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-checkbox
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Checkboxes allow the user to toggle an option on or off.
+//
+// Web Awesome component: <wa-checkbox>
+
+// CheckboxProps holds all properties for the wa-checkbox component
+type CheckboxProps struct {
+	// The name of the checkbox, submitted as a name/value pair with form data.
+	Name string `attr:"name"`
+	// The value of the checkbox, submitted as a name/value pair with form data.
+	Value string `attr:"value"`
+	// The checkbox's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Disables the checkbox.
+	Disabled bool `attr:"disabled"`
+	// Draws the checkbox in an indeterminate state. This is usually applied to checkboxes that represents a "select
+	Indeterminate bool `attr:"indeterminate"`
+	// The default value of the form control. Primarily used for resetting the form control.
+	Checked bool `attr:"checked"`
+	// Makes the checkbox a required field.
+	Required bool `attr:"required"`
+	// The checkbox's hint. If you need to display HTML, use the hint slot instead.
+	Hint string `attr:"hint"`
+
+	// Events
+	// Emitted when the checked state changes.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the checkbox loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the checkbox gains focus.
+	OnFocus string `attr:"x-on:focus"`
+	// Emitted when the checkbox receives input.
+	OnInput string `attr:"x-on:input"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots CheckboxSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CheckboxSlots holds named slot content for the component
+type CheckboxSlots struct {
+	// Text that describes how to use the checkbox. Alternatively, you can use the hint attribute.
+	Hint templ.Component
+}
+
+// CheckboxBuilder provides a fluent API for constructing CheckboxProps
+type CheckboxBuilder struct {
+	props CheckboxProps
+}
+
+// NewCheckbox creates a new builder for wa-checkbox
+func NewCheckbox() *CheckboxBuilder {
+	return &CheckboxBuilder{}
+}
+
+// Name sets the name attribute
+// The name of the checkbox, submitted as a name/value pair with form data.
+func (b *CheckboxBuilder) Name(v string) *CheckboxBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Value sets the value attribute
+// The value of the checkbox, submitted as a name/value pair with form data.
+func (b *CheckboxBuilder) Value(v string) *CheckboxBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Size sets the size attribute
+// The checkbox's size.
+func (b *CheckboxBuilder) Size(v string) *CheckboxBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the checkbox.
+func (b *CheckboxBuilder) Disabled(v bool) *CheckboxBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Indeterminate sets the indeterminate attribute
+// Draws the checkbox in an indeterminate state. This is usually applied to checkboxes that represents a "select
+func (b *CheckboxBuilder) Indeterminate(v bool) *CheckboxBuilder {
+	b.props.Indeterminate = v
+	return b
+}
+
+// Checked sets the checked attribute
+// The default value of the form control. Primarily used for resetting the form control.
+func (b *CheckboxBuilder) Checked(v bool) *CheckboxBuilder {
+	b.props.Checked = v
+	return b
+}
+
+// Required sets the required attribute
+// Makes the checkbox a required field.
+func (b *CheckboxBuilder) Required(v bool) *CheckboxBuilder {
+	b.props.Required = v
+	return b
+}
+
+// Hint sets the hint attribute
+// The checkbox's hint. If you need to display HTML, use the hint slot instead.
+func (b *CheckboxBuilder) Hint(v string) *CheckboxBuilder {
+	b.props.Hint = v
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the checked state changes.
+func (b *CheckboxBuilder) OnChange(handler string) *CheckboxBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the checkbox loses focus.
+func (b *CheckboxBuilder) OnBlur(handler string) *CheckboxBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the checkbox gains focus.
+func (b *CheckboxBuilder) OnFocus(handler string) *CheckboxBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// OnInput sets the handler for input event
+// Emitted when the checkbox receives input.
+func (b *CheckboxBuilder) OnInput(handler string) *CheckboxBuilder {
+	b.props.OnInput = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *CheckboxBuilder) OnInvalid(handler string) *CheckboxBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// HintSlot sets the hint slot content
+// Text that describes how to use the checkbox. Alternatively, you can use the hint attribute.
+func (b *CheckboxBuilder) HintSlot(c templ.Component) *CheckboxBuilder {
+	b.props.Slots.Hint = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *CheckboxBuilder) Attr(name, value string) *CheckboxBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CheckboxBuilder) Attrs(attrs templ.Attributes) *CheckboxBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CheckboxBuilder) Props() CheckboxProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CheckboxBuilder) Build() CheckboxProps {
+	return b.props
+}
+
+// Checkbox renders the wa-checkbox component
+func Checkbox(props CheckboxProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-checkbox")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Name != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/checkbox.templ`, Line: 201, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/checkbox.templ`, Line: 204, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Size != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " size=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Size)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/checkbox.templ`, Line: 207, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Indeterminate {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " indeterminate")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Checked {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " checked")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Required {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " required")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Hint != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " hint=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.Hint)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/checkbox.templ`, Line: 222, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnChange != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " x-on:change=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnChange)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/checkbox.templ`, Line: 225, Col: 31}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnBlur != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " x-on:blur=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnBlur)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/checkbox.templ`, Line: 228, Col: 27}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnFocus != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, " x-on:focus=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnFocus)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/checkbox.templ`, Line: 231, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnInput != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, " x-on:input=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnInput)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/checkbox.templ`, Line: 234, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnInvalid != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, " x-on:wa-invalid=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnInvalid)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/checkbox.templ`, Line: 237, Col: 36}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Hint != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "<div slot=\"hint\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Hint.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "</wa-checkbox>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// CheckboxFunc renders with a builder function for inline configuration
+func CheckboxFunc(fn func(*CheckboxBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var11 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var11 == nil {
+			templ_7745c5c3_Var11 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewCheckbox()
+		fn(b)
+		templ_7745c5c3_Var12 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var11.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Checkbox(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var12), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/color-picker.templ

@@ -0,0 +1,401 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-color-picker
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Color pickers allow the user to select a color.
+//
+// Web Awesome component: <wa-color-picker>
+
+// ColorPickerProps holds all properties for the wa-color-picker component
+type ColorPickerProps struct {
+	// The default value of the form control. Primarily used for resetting the form control.
+	Value string `attr:"value"`
+	// 
+	WithLabel bool `attr:"with-label"`
+	// 
+	WithHint bool `attr:"with-hint"`
+	// The color picker's label. This will not be displayed, but it will be announced by assistive devices. If you need to
+	Label string `attr:"label"`
+	// The color picker's hint. If you need to display HTML, use the hint slot instead.
+	Hint string `attr:"hint"`
+	// The format to use. If opacity is enabled, these will translate to HEXA, RGBA, HSLA, and HSVA respectively. The color
+	// Valid values: "hex", "rgb", "hsl", "hsv"
+	Format string `attr:"format"`
+	// Determines the size of the color picker's trigger
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Removes the button that lets users toggle between format.
+	WithoutFormatToggle bool `attr:"without-format-toggle"`
+	// The name of the form control, submitted as a name/value pair with form data.
+	Name string `attr:"name"`
+	// Disables the color picker.
+	Disabled bool `attr:"disabled"`
+	// Indicates whether or not the popup is open. You can toggle this attribute to show and hide the popup, or you
+	Open bool `attr:"open"`
+	// Shows the opacity slider. Enabling this will cause the formatted value to be HEXA, RGBA, or HSLA.
+	Opacity bool `attr:"opacity"`
+	// By default, values are lowercase. With this attribute, values will be uppercase instead.
+	Uppercase bool `attr:"uppercase"`
+	// One or more predefined color swatches to display as presets in the color picker. Can include any format the color
+	Swatches string `attr:"swatches"`
+	// Makes the color picker a required field.
+	Required bool `attr:"required"`
+
+	// Events
+	// Emitted when the color picker's value changes.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the color picker receives input.
+	OnInput string `attr:"x-on:input"`
+	// 
+	OnShow string `attr:"x-on:wa-show"`
+	// 
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// 
+	OnHide string `attr:"x-on:wa-hide"`
+	// 
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+	// Emitted when the color picker loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the color picker receives focus.
+	OnFocus string `attr:"x-on:focus"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots ColorPickerSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ColorPickerSlots holds named slot content for the component
+type ColorPickerSlots struct {
+	// The color picker's form label. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// The color picker's form hint. Alternatively, you can use the hint attribute.
+	Hint templ.Component
+}
+
+// ColorPickerBuilder provides a fluent API for constructing ColorPickerProps
+type ColorPickerBuilder struct {
+	props ColorPickerProps
+}
+
+// NewColorPicker creates a new builder for wa-color-picker
+func NewColorPicker() *ColorPickerBuilder {
+	return &ColorPickerBuilder{}
+}
+
+// Value sets the value attribute
+// The default value of the form control. Primarily used for resetting the form control.
+func (b *ColorPickerBuilder) Value(v string) *ColorPickerBuilder {
+	b.props.Value = v
+	return b
+}
+
+// WithLabel sets the with-label attribute
+func (b *ColorPickerBuilder) WithLabel(v bool) *ColorPickerBuilder {
+	b.props.WithLabel = v
+	return b
+}
+
+// WithHint sets the with-hint attribute
+func (b *ColorPickerBuilder) WithHint(v bool) *ColorPickerBuilder {
+	b.props.WithHint = v
+	return b
+}
+
+// Label sets the label attribute
+// The color picker's label. This will not be displayed, but it will be announced by assistive devices. If you need to
+func (b *ColorPickerBuilder) Label(v string) *ColorPickerBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Hint sets the hint attribute
+// The color picker's hint. If you need to display HTML, use the hint slot instead.
+func (b *ColorPickerBuilder) Hint(v string) *ColorPickerBuilder {
+	b.props.Hint = v
+	return b
+}
+
+// Format sets the format attribute
+// The format to use. If opacity is enabled, these will translate to HEXA, RGBA, HSLA, and HSVA respectively. The color
+func (b *ColorPickerBuilder) Format(v string) *ColorPickerBuilder {
+	b.props.Format = v
+	return b
+}
+
+// Size sets the size attribute
+// Determines the size of the color picker's trigger
+func (b *ColorPickerBuilder) Size(v string) *ColorPickerBuilder {
+	b.props.Size = v
+	return b
+}
+
+// WithoutFormatToggle sets the without-format-toggle attribute
+// Removes the button that lets users toggle between format.
+func (b *ColorPickerBuilder) WithoutFormatToggle(v bool) *ColorPickerBuilder {
+	b.props.WithoutFormatToggle = v
+	return b
+}
+
+// Name sets the name attribute
+// The name of the form control, submitted as a name/value pair with form data.
+func (b *ColorPickerBuilder) Name(v string) *ColorPickerBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the color picker.
+func (b *ColorPickerBuilder) Disabled(v bool) *ColorPickerBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Open sets the open attribute
+// Indicates whether or not the popup is open. You can toggle this attribute to show and hide the popup, or you
+func (b *ColorPickerBuilder) Open(v bool) *ColorPickerBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Opacity sets the opacity attribute
+// Shows the opacity slider. Enabling this will cause the formatted value to be HEXA, RGBA, or HSLA.
+func (b *ColorPickerBuilder) Opacity(v bool) *ColorPickerBuilder {
+	b.props.Opacity = v
+	return b
+}
+
+// Uppercase sets the uppercase attribute
+// By default, values are lowercase. With this attribute, values will be uppercase instead.
+func (b *ColorPickerBuilder) Uppercase(v bool) *ColorPickerBuilder {
+	b.props.Uppercase = v
+	return b
+}
+
+// Swatches sets the swatches attribute
+// One or more predefined color swatches to display as presets in the color picker. Can include any format the color
+func (b *ColorPickerBuilder) Swatches(v string) *ColorPickerBuilder {
+	b.props.Swatches = v
+	return b
+}
+
+// Required sets the required attribute
+// Makes the color picker a required field.
+func (b *ColorPickerBuilder) Required(v bool) *ColorPickerBuilder {
+	b.props.Required = v
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the color picker's value changes.
+func (b *ColorPickerBuilder) OnChange(handler string) *ColorPickerBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnInput sets the handler for input event
+// Emitted when the color picker receives input.
+func (b *ColorPickerBuilder) OnInput(handler string) *ColorPickerBuilder {
+	b.props.OnInput = handler
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// 
+func (b *ColorPickerBuilder) OnShow(handler string) *ColorPickerBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// 
+func (b *ColorPickerBuilder) OnAfterShow(handler string) *ColorPickerBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// 
+func (b *ColorPickerBuilder) OnHide(handler string) *ColorPickerBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// 
+func (b *ColorPickerBuilder) OnAfterHide(handler string) *ColorPickerBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the color picker loses focus.
+func (b *ColorPickerBuilder) OnBlur(handler string) *ColorPickerBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the color picker receives focus.
+func (b *ColorPickerBuilder) OnFocus(handler string) *ColorPickerBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *ColorPickerBuilder) OnInvalid(handler string) *ColorPickerBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The color picker's form label. Alternatively, you can use the label attribute.
+func (b *ColorPickerBuilder) LabelSlot(c templ.Component) *ColorPickerBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// HintSlot sets the hint slot content
+// The color picker's form hint. Alternatively, you can use the hint attribute.
+func (b *ColorPickerBuilder) HintSlot(c templ.Component) *ColorPickerBuilder {
+	b.props.Slots.Hint = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ColorPickerBuilder) Attr(name, value string) *ColorPickerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ColorPickerBuilder) Attrs(attrs templ.Attributes) *ColorPickerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ColorPickerBuilder) Props() ColorPickerProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ColorPickerBuilder) Build() ColorPickerProps {
+	return b.props
+}
+
+// ColorPicker renders the wa-color-picker component
+templ ColorPicker(props ColorPickerProps) {
+	<wa-color-picker
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.WithLabel {
+			with-label
+		}
+		if props.WithHint {
+			with-hint
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.Hint != "" {
+			hint={ props.Hint }
+		}
+		if props.Format != "" {
+			format={ props.Format }
+		}
+		if props.Size != "" {
+			size={ props.Size }
+		}
+		if props.WithoutFormatToggle {
+			without-format-toggle
+		}
+		if props.Name != "" {
+			name={ props.Name }
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.Open {
+			open
+		}
+		if props.Opacity {
+			opacity
+		}
+		if props.Uppercase {
+			uppercase
+		}
+		if props.Swatches != "" {
+			swatches={ props.Swatches }
+		}
+		if props.Required {
+			required
+		}
+		if props.OnChange != "" {
+			x-on:change={ props.OnChange }
+		}
+		if props.OnInput != "" {
+			x-on:input={ props.OnInput }
+		}
+		if props.OnShow != "" {
+			x-on:wa-show={ props.OnShow }
+		}
+		if props.OnAfterShow != "" {
+			x-on:wa-after-show={ props.OnAfterShow }
+		}
+		if props.OnHide != "" {
+			x-on:wa-hide={ props.OnHide }
+		}
+		if props.OnAfterHide != "" {
+			x-on:wa-after-hide={ props.OnAfterHide }
+		}
+		if props.OnBlur != "" {
+			x-on:blur={ props.OnBlur }
+		}
+		if props.OnFocus != "" {
+			x-on:focus={ props.OnFocus }
+		}
+		if props.OnInvalid != "" {
+			x-on:wa-invalid={ props.OnInvalid }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Label != nil {
+			<div slot="label">
+				@props.Slots.Label
+			</div>
+		}
+		if props.Slots.Hint != nil {
+			<div slot="hint">
+				@props.Slots.Hint
+			</div>
+		}
+		{ children... }
+	</wa-color-picker>
+}
+
+// ColorPickerFunc renders with a builder function for inline configuration
+templ ColorPickerFunc(fn func(*ColorPickerBuilder)) {
+	{{ b := NewColorPicker(); fn(b) }}
+	@ColorPicker(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/color-picker_templ.go

@@ -0,0 +1,785 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-color-picker
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Color pickers allow the user to select a color.
+//
+// Web Awesome component: <wa-color-picker>
+
+// ColorPickerProps holds all properties for the wa-color-picker component
+type ColorPickerProps struct {
+	// The default value of the form control. Primarily used for resetting the form control.
+	Value string `attr:"value"`
+	//
+	WithLabel bool `attr:"with-label"`
+	//
+	WithHint bool `attr:"with-hint"`
+	// The color picker's label. This will not be displayed, but it will be announced by assistive devices. If you need to
+	Label string `attr:"label"`
+	// The color picker's hint. If you need to display HTML, use the hint slot instead.
+	Hint string `attr:"hint"`
+	// The format to use. If opacity is enabled, these will translate to HEXA, RGBA, HSLA, and HSVA respectively. The color
+	// Valid values: "hex", "rgb", "hsl", "hsv"
+	Format string `attr:"format"`
+	// Determines the size of the color picker's trigger
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Removes the button that lets users toggle between format.
+	WithoutFormatToggle bool `attr:"without-format-toggle"`
+	// The name of the form control, submitted as a name/value pair with form data.
+	Name string `attr:"name"`
+	// Disables the color picker.
+	Disabled bool `attr:"disabled"`
+	// Indicates whether or not the popup is open. You can toggle this attribute to show and hide the popup, or you
+	Open bool `attr:"open"`
+	// Shows the opacity slider. Enabling this will cause the formatted value to be HEXA, RGBA, or HSLA.
+	Opacity bool `attr:"opacity"`
+	// By default, values are lowercase. With this attribute, values will be uppercase instead.
+	Uppercase bool `attr:"uppercase"`
+	// One or more predefined color swatches to display as presets in the color picker. Can include any format the color
+	Swatches string `attr:"swatches"`
+	// Makes the color picker a required field.
+	Required bool `attr:"required"`
+
+	// Events
+	// Emitted when the color picker's value changes.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the color picker receives input.
+	OnInput string `attr:"x-on:input"`
+	//
+	OnShow string `attr:"x-on:wa-show"`
+	//
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	//
+	OnHide string `attr:"x-on:wa-hide"`
+	//
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+	// Emitted when the color picker loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the color picker receives focus.
+	OnFocus string `attr:"x-on:focus"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots ColorPickerSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ColorPickerSlots holds named slot content for the component
+type ColorPickerSlots struct {
+	// The color picker's form label. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// The color picker's form hint. Alternatively, you can use the hint attribute.
+	Hint templ.Component
+}
+
+// ColorPickerBuilder provides a fluent API for constructing ColorPickerProps
+type ColorPickerBuilder struct {
+	props ColorPickerProps
+}
+
+// NewColorPicker creates a new builder for wa-color-picker
+func NewColorPicker() *ColorPickerBuilder {
+	return &ColorPickerBuilder{}
+}
+
+// Value sets the value attribute
+// The default value of the form control. Primarily used for resetting the form control.
+func (b *ColorPickerBuilder) Value(v string) *ColorPickerBuilder {
+	b.props.Value = v
+	return b
+}
+
+// WithLabel sets the with-label attribute
+func (b *ColorPickerBuilder) WithLabel(v bool) *ColorPickerBuilder {
+	b.props.WithLabel = v
+	return b
+}
+
+// WithHint sets the with-hint attribute
+func (b *ColorPickerBuilder) WithHint(v bool) *ColorPickerBuilder {
+	b.props.WithHint = v
+	return b
+}
+
+// Label sets the label attribute
+// The color picker's label. This will not be displayed, but it will be announced by assistive devices. If you need to
+func (b *ColorPickerBuilder) Label(v string) *ColorPickerBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Hint sets the hint attribute
+// The color picker's hint. If you need to display HTML, use the hint slot instead.
+func (b *ColorPickerBuilder) Hint(v string) *ColorPickerBuilder {
+	b.props.Hint = v
+	return b
+}
+
+// Format sets the format attribute
+// The format to use. If opacity is enabled, these will translate to HEXA, RGBA, HSLA, and HSVA respectively. The color
+func (b *ColorPickerBuilder) Format(v string) *ColorPickerBuilder {
+	b.props.Format = v
+	return b
+}
+
+// Size sets the size attribute
+// Determines the size of the color picker's trigger
+func (b *ColorPickerBuilder) Size(v string) *ColorPickerBuilder {
+	b.props.Size = v
+	return b
+}
+
+// WithoutFormatToggle sets the without-format-toggle attribute
+// Removes the button that lets users toggle between format.
+func (b *ColorPickerBuilder) WithoutFormatToggle(v bool) *ColorPickerBuilder {
+	b.props.WithoutFormatToggle = v
+	return b
+}
+
+// Name sets the name attribute
+// The name of the form control, submitted as a name/value pair with form data.
+func (b *ColorPickerBuilder) Name(v string) *ColorPickerBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the color picker.
+func (b *ColorPickerBuilder) Disabled(v bool) *ColorPickerBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Open sets the open attribute
+// Indicates whether or not the popup is open. You can toggle this attribute to show and hide the popup, or you
+func (b *ColorPickerBuilder) Open(v bool) *ColorPickerBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Opacity sets the opacity attribute
+// Shows the opacity slider. Enabling this will cause the formatted value to be HEXA, RGBA, or HSLA.
+func (b *ColorPickerBuilder) Opacity(v bool) *ColorPickerBuilder {
+	b.props.Opacity = v
+	return b
+}
+
+// Uppercase sets the uppercase attribute
+// By default, values are lowercase. With this attribute, values will be uppercase instead.
+func (b *ColorPickerBuilder) Uppercase(v bool) *ColorPickerBuilder {
+	b.props.Uppercase = v
+	return b
+}
+
+// Swatches sets the swatches attribute
+// One or more predefined color swatches to display as presets in the color picker. Can include any format the color
+func (b *ColorPickerBuilder) Swatches(v string) *ColorPickerBuilder {
+	b.props.Swatches = v
+	return b
+}
+
+// Required sets the required attribute
+// Makes the color picker a required field.
+func (b *ColorPickerBuilder) Required(v bool) *ColorPickerBuilder {
+	b.props.Required = v
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the color picker's value changes.
+func (b *ColorPickerBuilder) OnChange(handler string) *ColorPickerBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnInput sets the handler for input event
+// Emitted when the color picker receives input.
+func (b *ColorPickerBuilder) OnInput(handler string) *ColorPickerBuilder {
+	b.props.OnInput = handler
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+func (b *ColorPickerBuilder) OnShow(handler string) *ColorPickerBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+func (b *ColorPickerBuilder) OnAfterShow(handler string) *ColorPickerBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+func (b *ColorPickerBuilder) OnHide(handler string) *ColorPickerBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+func (b *ColorPickerBuilder) OnAfterHide(handler string) *ColorPickerBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the color picker loses focus.
+func (b *ColorPickerBuilder) OnBlur(handler string) *ColorPickerBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the color picker receives focus.
+func (b *ColorPickerBuilder) OnFocus(handler string) *ColorPickerBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *ColorPickerBuilder) OnInvalid(handler string) *ColorPickerBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The color picker's form label. Alternatively, you can use the label attribute.
+func (b *ColorPickerBuilder) LabelSlot(c templ.Component) *ColorPickerBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// HintSlot sets the hint slot content
+// The color picker's form hint. Alternatively, you can use the hint attribute.
+func (b *ColorPickerBuilder) HintSlot(c templ.Component) *ColorPickerBuilder {
+	b.props.Slots.Hint = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ColorPickerBuilder) Attr(name, value string) *ColorPickerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ColorPickerBuilder) Attrs(attrs templ.Attributes) *ColorPickerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ColorPickerBuilder) Props() ColorPickerProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ColorPickerBuilder) Build() ColorPickerProps {
+	return b.props
+}
+
+// ColorPicker renders the wa-color-picker component
+func ColorPicker(props ColorPickerProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-color-picker")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 308, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithLabel {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " with-label")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithHint {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " with-hint")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 317, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Hint != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " hint=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Hint)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 320, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Format != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " format=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.Format)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 323, Col: 24}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Size != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " size=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.Size)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 326, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithoutFormatToggle {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " without-format-toggle")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Name != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, " name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 332, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Open {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, " open")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Opacity {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, " opacity")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Uppercase {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, " uppercase")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Swatches != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, " swatches=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.Swatches)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 347, Col: 28}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Required {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, " required")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnChange != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, " x-on:change=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnChange)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 353, Col: 31}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnInput != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, " x-on:input=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnInput)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 356, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, " x-on:wa-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var11 string
+			templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 359, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, " x-on:wa-after-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var12 string
+			templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 362, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, " x-on:wa-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var13 string
+			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 365, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, " x-on:wa-after-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var14 string
+			templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 368, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnBlur != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, " x-on:blur=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var15 string
+			templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnBlur)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 371, Col: 27}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnFocus != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, " x-on:focus=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var16 string
+			templ_7745c5c3_Var16, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnFocus)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 374, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var16))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnInvalid != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 40, " x-on:wa-invalid=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var17 string
+			templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnInvalid)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/color-picker.templ`, Line: 377, Col: 36}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 41, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 42, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Label != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 43, "<div slot=\"label\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Label.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 44, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Hint != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 45, "<div slot=\"hint\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Hint.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 46, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 47, "</wa-color-picker>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// ColorPickerFunc renders with a builder function for inline configuration
+func ColorPickerFunc(fn func(*ColorPickerBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var18 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var18 == nil {
+			templ_7745c5c3_Var18 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewColorPicker()
+		fn(b)
+		templ_7745c5c3_Var19 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var18.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = ColorPicker(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var19), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/combobox.templ

@@ -0,0 +1,521 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-combobox
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Comboboxes combine a text input with a listbox, allowing users to filter and select from predefined options or enter ...
+//
+// Web Awesome component: <wa-combobox>
+
+// ComboboxProps holds all properties for the wa-combobox component
+type ComboboxProps struct {
+	// The name of the combobox, submitted as a name/value pair with form data.
+	Name string `attr:"name"`
+	// The combobox's value. This will be a string for single select or an array for multi-select.
+	Value string `attr:"value"`
+	// The combobox's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Placeholder text to show as a hint when the combobox is empty.
+	Placeholder string `attr:"placeholder"`
+	// Allows more than one option to be selected.
+	Multiple bool `attr:"multiple"`
+	// The maximum number of selected options to show when multiple is true. After the maximum, "+n" will be shown to
+	MaxOptionsVisible float64 `attr:"max-options-visible"`
+	// Disables the combobox control.
+	Disabled bool `attr:"disabled"`
+	// Adds a clear button when the combobox is not empty.
+	WithClear bool `attr:"with-clear"`
+	// Indicates whether or not the combobox is open. You can toggle this attribute to show and hide the menu, or you can
+	Open bool `attr:"open"`
+	// The combobox's visual appearance.
+	// Valid values: "filled", "outlined", "filled-outlined"
+	Appearance string `attr:"appearance"`
+	// Draws a pill-style combobox with rounded edges.
+	Pill bool `attr:"pill"`
+	// The combobox's label. If you need to display HTML, use the label slot instead.
+	Label string `attr:"label"`
+	// The preferred placement of the combobox's menu. Note that the actual placement may vary as needed to keep the
+	// Valid values: "top", "bottom"
+	Placement string `attr:"placement"`
+	// The combobox's hint. If you need to display HTML, use the hint slot instead.
+	Hint string `attr:"hint"`
+	// Used for SSR purposes when a label is slotted in. Will show the label on first render.
+	WithLabel bool `attr:"with-label"`
+	// Used for SSR purposes when hint is slotted in. Will show the hint on first render.
+	WithHint bool `attr:"with-hint"`
+	// The combobox's required attribute.
+	Required bool `attr:"required"`
+	// The autocomplete behavior of the combobox.
+	// Valid values: "list", "none"
+	Autocomplete string `attr:"autocomplete"`
+	// When true, allows the user to enter a value that doesn't match any of the options. Only applies to single-select
+	AllowCustomValue bool `attr:"allow-custom-value"`
+
+	// Events
+	// Emitted when the control receives input.
+	OnInput string `attr:"x-on:input"`
+	// Emitted when the control's value changes.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the control gains focus.
+	OnFocus string `attr:"x-on:focus"`
+	// Emitted when the control loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the control's value is cleared.
+	OnClear string `attr:"x-on:wa-clear"`
+	// Emitted when the combobox's menu opens.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the combobox's menu opens and all animations are complete.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the combobox's menu closes.
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the combobox's menu closes and all animations are complete.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots ComboboxSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ComboboxSlots holds named slot content for the component
+type ComboboxSlots struct {
+	// The input's label. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// An element, such as <wa-icon>, placed at the start of the combobox.
+	Start templ.Component
+	// An element, such as <wa-icon>, placed at the end of the combobox.
+	End templ.Component
+	// An icon to use in lieu of the default clear icon.
+	ClearIcon templ.Component
+	// The icon to show when the control is expanded and collapsed. Rotates on open and close.
+	ExpandIcon templ.Component
+	// Text that describes how to use the input. Alternatively, you can use the hint attribute.
+	Hint templ.Component
+}
+
+// ComboboxBuilder provides a fluent API for constructing ComboboxProps
+type ComboboxBuilder struct {
+	props ComboboxProps
+}
+
+// NewCombobox creates a new builder for wa-combobox
+func NewCombobox() *ComboboxBuilder {
+	return &ComboboxBuilder{}
+}
+
+// Name sets the name attribute
+// The name of the combobox, submitted as a name/value pair with form data.
+func (b *ComboboxBuilder) Name(v string) *ComboboxBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Value sets the value attribute
+// The combobox's value. This will be a string for single select or an array for multi-select.
+func (b *ComboboxBuilder) Value(v string) *ComboboxBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Size sets the size attribute
+// The combobox's size.
+func (b *ComboboxBuilder) Size(v string) *ComboboxBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Placeholder sets the placeholder attribute
+// Placeholder text to show as a hint when the combobox is empty.
+func (b *ComboboxBuilder) Placeholder(v string) *ComboboxBuilder {
+	b.props.Placeholder = v
+	return b
+}
+
+// Multiple sets the multiple attribute
+// Allows more than one option to be selected.
+func (b *ComboboxBuilder) Multiple(v bool) *ComboboxBuilder {
+	b.props.Multiple = v
+	return b
+}
+
+// MaxOptionsVisible sets the max-options-visible attribute
+// The maximum number of selected options to show when multiple is true. After the maximum, "+n" will be shown to
+func (b *ComboboxBuilder) MaxOptionsVisible(v float64) *ComboboxBuilder {
+	b.props.MaxOptionsVisible = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the combobox control.
+func (b *ComboboxBuilder) Disabled(v bool) *ComboboxBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// WithClear sets the with-clear attribute
+// Adds a clear button when the combobox is not empty.
+func (b *ComboboxBuilder) WithClear(v bool) *ComboboxBuilder {
+	b.props.WithClear = v
+	return b
+}
+
+// Open sets the open attribute
+// Indicates whether or not the combobox is open. You can toggle this attribute to show and hide the menu, or you can
+func (b *ComboboxBuilder) Open(v bool) *ComboboxBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The combobox's visual appearance.
+func (b *ComboboxBuilder) Appearance(v string) *ComboboxBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Pill sets the pill attribute
+// Draws a pill-style combobox with rounded edges.
+func (b *ComboboxBuilder) Pill(v bool) *ComboboxBuilder {
+	b.props.Pill = v
+	return b
+}
+
+// Label sets the label attribute
+// The combobox's label. If you need to display HTML, use the label slot instead.
+func (b *ComboboxBuilder) Label(v string) *ComboboxBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Placement sets the placement attribute
+// The preferred placement of the combobox's menu. Note that the actual placement may vary as needed to keep the
+func (b *ComboboxBuilder) Placement(v string) *ComboboxBuilder {
+	b.props.Placement = v
+	return b
+}
+
+// Hint sets the hint attribute
+// The combobox's hint. If you need to display HTML, use the hint slot instead.
+func (b *ComboboxBuilder) Hint(v string) *ComboboxBuilder {
+	b.props.Hint = v
+	return b
+}
+
+// WithLabel sets the with-label attribute
+// Used for SSR purposes when a label is slotted in. Will show the label on first render.
+func (b *ComboboxBuilder) WithLabel(v bool) *ComboboxBuilder {
+	b.props.WithLabel = v
+	return b
+}
+
+// WithHint sets the with-hint attribute
+// Used for SSR purposes when hint is slotted in. Will show the hint on first render.
+func (b *ComboboxBuilder) WithHint(v bool) *ComboboxBuilder {
+	b.props.WithHint = v
+	return b
+}
+
+// Required sets the required attribute
+// The combobox's required attribute.
+func (b *ComboboxBuilder) Required(v bool) *ComboboxBuilder {
+	b.props.Required = v
+	return b
+}
+
+// Autocomplete sets the autocomplete attribute
+// The autocomplete behavior of the combobox.
+func (b *ComboboxBuilder) Autocomplete(v string) *ComboboxBuilder {
+	b.props.Autocomplete = v
+	return b
+}
+
+// AllowCustomValue sets the allow-custom-value attribute
+// When true, allows the user to enter a value that doesn't match any of the options. Only applies to single-select
+func (b *ComboboxBuilder) AllowCustomValue(v bool) *ComboboxBuilder {
+	b.props.AllowCustomValue = v
+	return b
+}
+
+// OnInput sets the handler for input event
+// Emitted when the control receives input.
+func (b *ComboboxBuilder) OnInput(handler string) *ComboboxBuilder {
+	b.props.OnInput = handler
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the control's value changes.
+func (b *ComboboxBuilder) OnChange(handler string) *ComboboxBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the control gains focus.
+func (b *ComboboxBuilder) OnFocus(handler string) *ComboboxBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the control loses focus.
+func (b *ComboboxBuilder) OnBlur(handler string) *ComboboxBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnClear sets the handler for wa-clear event
+// Emitted when the control's value is cleared.
+func (b *ComboboxBuilder) OnClear(handler string) *ComboboxBuilder {
+	b.props.OnClear = handler
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the combobox's menu opens.
+func (b *ComboboxBuilder) OnShow(handler string) *ComboboxBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the combobox's menu opens and all animations are complete.
+func (b *ComboboxBuilder) OnAfterShow(handler string) *ComboboxBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the combobox's menu closes.
+func (b *ComboboxBuilder) OnHide(handler string) *ComboboxBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the combobox's menu closes and all animations are complete.
+func (b *ComboboxBuilder) OnAfterHide(handler string) *ComboboxBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *ComboboxBuilder) OnInvalid(handler string) *ComboboxBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The input's label. Alternatively, you can use the label attribute.
+func (b *ComboboxBuilder) LabelSlot(c templ.Component) *ComboboxBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// StartSlot sets the start slot content
+// An element, such as <wa-icon>, placed at the start of the combobox.
+func (b *ComboboxBuilder) StartSlot(c templ.Component) *ComboboxBuilder {
+	b.props.Slots.Start = c
+	return b
+}
+
+// EndSlot sets the end slot content
+// An element, such as <wa-icon>, placed at the end of the combobox.
+func (b *ComboboxBuilder) EndSlot(c templ.Component) *ComboboxBuilder {
+	b.props.Slots.End = c
+	return b
+}
+
+// ClearIconSlot sets the clear-icon slot content
+// An icon to use in lieu of the default clear icon.
+func (b *ComboboxBuilder) ClearIconSlot(c templ.Component) *ComboboxBuilder {
+	b.props.Slots.ClearIcon = c
+	return b
+}
+
+// ExpandIconSlot sets the expand-icon slot content
+// The icon to show when the control is expanded and collapsed. Rotates on open and close.
+func (b *ComboboxBuilder) ExpandIconSlot(c templ.Component) *ComboboxBuilder {
+	b.props.Slots.ExpandIcon = c
+	return b
+}
+
+// HintSlot sets the hint slot content
+// Text that describes how to use the input. Alternatively, you can use the hint attribute.
+func (b *ComboboxBuilder) HintSlot(c templ.Component) *ComboboxBuilder {
+	b.props.Slots.Hint = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ComboboxBuilder) Attr(name, value string) *ComboboxBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ComboboxBuilder) Attrs(attrs templ.Attributes) *ComboboxBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ComboboxBuilder) Props() ComboboxProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ComboboxBuilder) Build() ComboboxProps {
+	return b.props
+}
+
+// Combobox renders the wa-combobox component
+templ Combobox(props ComboboxProps) {
+	<wa-combobox
+		if props.Name != "" {
+			name={ props.Name }
+		}
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.Size != "" {
+			size={ props.Size }
+		}
+		if props.Placeholder != "" {
+			placeholder={ props.Placeholder }
+		}
+		if props.Multiple {
+			multiple
+		}
+		if props.MaxOptionsVisible != 0 {
+			max-options-visible={ templ.Sprintf("%v", props.MaxOptionsVisible) }
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.WithClear {
+			with-clear
+		}
+		if props.Open {
+			open
+		}
+		if props.Appearance != "" {
+			appearance={ props.Appearance }
+		}
+		if props.Pill {
+			pill
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.Placement != "" {
+			placement={ props.Placement }
+		}
+		if props.Hint != "" {
+			hint={ props.Hint }
+		}
+		if props.WithLabel {
+			with-label
+		}
+		if props.WithHint {
+			with-hint
+		}
+		if props.Required {
+			required
+		}
+		if props.Autocomplete != "" {
+			autocomplete={ props.Autocomplete }
+		}
+		if props.AllowCustomValue {
+			allow-custom-value
+		}
+		if props.OnInput != "" {
+			x-on:input={ props.OnInput }
+		}
+		if props.OnChange != "" {
+			x-on:change={ props.OnChange }
+		}
+		if props.OnFocus != "" {
+			x-on:focus={ props.OnFocus }
+		}
+		if props.OnBlur != "" {
+			x-on:blur={ props.OnBlur }
+		}
+		if props.OnClear != "" {
+			x-on:wa-clear={ props.OnClear }
+		}
+		if props.OnShow != "" {
+			x-on:wa-show={ props.OnShow }
+		}
+		if props.OnAfterShow != "" {
+			x-on:wa-after-show={ props.OnAfterShow }
+		}
+		if props.OnHide != "" {
+			x-on:wa-hide={ props.OnHide }
+		}
+		if props.OnAfterHide != "" {
+			x-on:wa-after-hide={ props.OnAfterHide }
+		}
+		if props.OnInvalid != "" {
+			x-on:wa-invalid={ props.OnInvalid }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Label != nil {
+			<div slot="label">
+				@props.Slots.Label
+			</div>
+		}
+		if props.Slots.Start != nil {
+			<div slot="start">
+				@props.Slots.Start
+			</div>
+		}
+		if props.Slots.End != nil {
+			<div slot="end">
+				@props.Slots.End
+			</div>
+		}
+		if props.Slots.ClearIcon != nil {
+			<div slot="clear-icon">
+				@props.Slots.ClearIcon
+			</div>
+		}
+		if props.Slots.ExpandIcon != nil {
+			<div slot="expand-icon">
+				@props.Slots.ExpandIcon
+			</div>
+		}
+		if props.Slots.Hint != nil {
+			<div slot="hint">
+				@props.Slots.Hint
+			</div>
+		}
+		{ children... }
+	</wa-combobox>
+}
+
+// ComboboxFunc renders with a builder function for inline configuration
+templ ComboboxFunc(fn func(*ComboboxBuilder)) {
+	{{ b := NewCombobox(); fn(b) }}
+	@Combobox(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/comparison.templ

@@ -0,0 +1,151 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-comparison
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Compare visual differences between similar content with a sliding panel.
+//
+// Web Awesome component: <wa-comparison>
+
+// ComparisonProps holds all properties for the wa-comparison component
+type ComparisonProps struct {
+	// The position of the divider as a percentage.
+	Position float64 `attr:"position"`
+
+	// Events
+	// Emitted when the position changes.
+	OnChange string `attr:"x-on:change"`
+
+	// Slots contains named slot content
+	Slots ComparisonSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ComparisonSlots holds named slot content for the component
+type ComparisonSlots struct {
+	// The before content, often an <img> or <svg> element.
+	Before templ.Component
+	// The after content, often an <img> or <svg> element.
+	After templ.Component
+	// The icon used inside the handle.
+	Handle templ.Component
+}
+
+// ComparisonBuilder provides a fluent API for constructing ComparisonProps
+type ComparisonBuilder struct {
+	props ComparisonProps
+}
+
+// NewComparison creates a new builder for wa-comparison
+func NewComparison() *ComparisonBuilder {
+	return &ComparisonBuilder{}
+}
+
+// Position sets the position attribute
+// The position of the divider as a percentage.
+func (b *ComparisonBuilder) Position(v float64) *ComparisonBuilder {
+	b.props.Position = v
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the position changes.
+func (b *ComparisonBuilder) OnChange(handler string) *ComparisonBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// BeforeSlot sets the before slot content
+// The before content, often an <img> or <svg> element.
+func (b *ComparisonBuilder) BeforeSlot(c templ.Component) *ComparisonBuilder {
+	b.props.Slots.Before = c
+	return b
+}
+
+// AfterSlot sets the after slot content
+// The after content, often an <img> or <svg> element.
+func (b *ComparisonBuilder) AfterSlot(c templ.Component) *ComparisonBuilder {
+	b.props.Slots.After = c
+	return b
+}
+
+// HandleSlot sets the handle slot content
+// The icon used inside the handle.
+func (b *ComparisonBuilder) HandleSlot(c templ.Component) *ComparisonBuilder {
+	b.props.Slots.Handle = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ComparisonBuilder) Attr(name, value string) *ComparisonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ComparisonBuilder) Attrs(attrs templ.Attributes) *ComparisonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ComparisonBuilder) Props() ComparisonProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ComparisonBuilder) Build() ComparisonProps {
+	return b.props
+}
+
+// Comparison renders the wa-comparison component
+templ Comparison(props ComparisonProps) {
+	<wa-comparison
+		if props.Position != 0 {
+			position={ templ.Sprintf("%v", props.Position) }
+		}
+		if props.OnChange != "" {
+			x-on:change={ props.OnChange }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Before != nil {
+			<div slot="before">
+				@props.Slots.Before
+			</div>
+		}
+		if props.Slots.After != nil {
+			<div slot="after">
+				@props.Slots.After
+			</div>
+		}
+		if props.Slots.Handle != nil {
+			<div slot="handle">
+				@props.Slots.Handle
+			</div>
+		}
+		{ children... }
+	</wa-comparison>
+}
+
+// ComparisonFunc renders with a builder function for inline configuration
+templ ComparisonFunc(fn func(*ComparisonBuilder)) {
+	{{ b := NewComparison(); fn(b) }}
+	@Comparison(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/comparison_templ.go

@@ -0,0 +1,300 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-comparison
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Compare visual differences between similar content with a sliding panel.
+//
+// Web Awesome component: <wa-comparison>
+
+// ComparisonProps holds all properties for the wa-comparison component
+type ComparisonProps struct {
+	// The position of the divider as a percentage.
+	Position float64 `attr:"position"`
+
+	// Events
+	// Emitted when the position changes.
+	OnChange string `attr:"x-on:change"`
+
+	// Slots contains named slot content
+	Slots ComparisonSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ComparisonSlots holds named slot content for the component
+type ComparisonSlots struct {
+	// The before content, often an <img> or <svg> element.
+	Before templ.Component
+	// The after content, often an <img> or <svg> element.
+	After templ.Component
+	// The icon used inside the handle.
+	Handle templ.Component
+}
+
+// ComparisonBuilder provides a fluent API for constructing ComparisonProps
+type ComparisonBuilder struct {
+	props ComparisonProps
+}
+
+// NewComparison creates a new builder for wa-comparison
+func NewComparison() *ComparisonBuilder {
+	return &ComparisonBuilder{}
+}
+
+// Position sets the position attribute
+// The position of the divider as a percentage.
+func (b *ComparisonBuilder) Position(v float64) *ComparisonBuilder {
+	b.props.Position = v
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the position changes.
+func (b *ComparisonBuilder) OnChange(handler string) *ComparisonBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// BeforeSlot sets the before slot content
+// The before content, often an <img> or <svg> element.
+func (b *ComparisonBuilder) BeforeSlot(c templ.Component) *ComparisonBuilder {
+	b.props.Slots.Before = c
+	return b
+}
+
+// AfterSlot sets the after slot content
+// The after content, often an <img> or <svg> element.
+func (b *ComparisonBuilder) AfterSlot(c templ.Component) *ComparisonBuilder {
+	b.props.Slots.After = c
+	return b
+}
+
+// HandleSlot sets the handle slot content
+// The icon used inside the handle.
+func (b *ComparisonBuilder) HandleSlot(c templ.Component) *ComparisonBuilder {
+	b.props.Slots.Handle = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ComparisonBuilder) Attr(name, value string) *ComparisonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ComparisonBuilder) Attrs(attrs templ.Attributes) *ComparisonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ComparisonBuilder) Props() ComparisonProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ComparisonBuilder) Build() ComparisonProps {
+	return b.props
+}
+
+// Comparison renders the wa-comparison component
+func Comparison(props ComparisonProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-comparison")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Position != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " position=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Position))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/comparison.templ`, Line: 119, Col: 49}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnChange != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " x-on:change=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnChange)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/comparison.templ`, Line: 122, Col: 31}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Before != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "<div slot=\"before\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Before.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.After != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "<div slot=\"after\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.After.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Handle != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "<div slot=\"handle\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Handle.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "</wa-comparison>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// ComparisonFunc renders with a builder function for inline configuration
+func ComparisonFunc(fn func(*ComparisonBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var4 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var4 == nil {
+			templ_7745c5c3_Var4 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewComparison()
+		fn(b)
+		templ_7745c5c3_Var5 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var4.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Comparison(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var5), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/copy-button.templ

@@ -0,0 +1,248 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-copy-button
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Copies text data to the clipboard when the user clicks the trigger.
+//
+// Web Awesome component: <wa-copy-button>
+
+// CopyButtonProps holds all properties for the wa-copy-button component
+type CopyButtonProps struct {
+	// The text value to copy.
+	Value string `attr:"value"`
+	// An id that references an element in the same document from which data will be copied. If both this and value are
+	From string `attr:"from"`
+	// Disables the copy button.
+	Disabled bool `attr:"disabled"`
+	// A custom label to show in the tooltip.
+	CopyLabel string `attr:"copy-label"`
+	// A custom label to show in the tooltip after copying.
+	SuccessLabel string `attr:"success-label"`
+	// A custom label to show in the tooltip when a copy error occurs.
+	ErrorLabel string `attr:"error-label"`
+	// The length of time to show feedback before restoring the default trigger.
+	FeedbackDuration float64 `attr:"feedback-duration"`
+	// The preferred placement of the tooltip.
+	// Valid values: "top", "right", "bottom", "left"
+	TooltipPlacement string `attr:"tooltip-placement"`
+
+	// Events
+	// Emitted when the data has been copied.
+	OnCopy string `attr:"x-on:wa-copy"`
+	// Emitted when the data could not be copied.
+	OnError string `attr:"x-on:wa-error"`
+
+	// Slots contains named slot content
+	Slots CopyButtonSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CopyButtonSlots holds named slot content for the component
+type CopyButtonSlots struct {
+	// The icon to show in the default copy state. Works best with <wa-icon>.
+	CopyIcon templ.Component
+	// The icon to show when the content is copied. Works best with <wa-icon>.
+	SuccessIcon templ.Component
+	// The icon to show when a copy error occurs. Works best with <wa-icon>.
+	ErrorIcon templ.Component
+}
+
+// CopyButtonBuilder provides a fluent API for constructing CopyButtonProps
+type CopyButtonBuilder struct {
+	props CopyButtonProps
+}
+
+// NewCopyButton creates a new builder for wa-copy-button
+func NewCopyButton() *CopyButtonBuilder {
+	return &CopyButtonBuilder{}
+}
+
+// Value sets the value attribute
+// The text value to copy.
+func (b *CopyButtonBuilder) Value(v string) *CopyButtonBuilder {
+	b.props.Value = v
+	return b
+}
+
+// From sets the from attribute
+// An id that references an element in the same document from which data will be copied. If both this and value are
+func (b *CopyButtonBuilder) From(v string) *CopyButtonBuilder {
+	b.props.From = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the copy button.
+func (b *CopyButtonBuilder) Disabled(v bool) *CopyButtonBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// CopyLabel sets the copy-label attribute
+// A custom label to show in the tooltip.
+func (b *CopyButtonBuilder) CopyLabel(v string) *CopyButtonBuilder {
+	b.props.CopyLabel = v
+	return b
+}
+
+// SuccessLabel sets the success-label attribute
+// A custom label to show in the tooltip after copying.
+func (b *CopyButtonBuilder) SuccessLabel(v string) *CopyButtonBuilder {
+	b.props.SuccessLabel = v
+	return b
+}
+
+// ErrorLabel sets the error-label attribute
+// A custom label to show in the tooltip when a copy error occurs.
+func (b *CopyButtonBuilder) ErrorLabel(v string) *CopyButtonBuilder {
+	b.props.ErrorLabel = v
+	return b
+}
+
+// FeedbackDuration sets the feedback-duration attribute
+// The length of time to show feedback before restoring the default trigger.
+func (b *CopyButtonBuilder) FeedbackDuration(v float64) *CopyButtonBuilder {
+	b.props.FeedbackDuration = v
+	return b
+}
+
+// TooltipPlacement sets the tooltip-placement attribute
+// The preferred placement of the tooltip.
+func (b *CopyButtonBuilder) TooltipPlacement(v string) *CopyButtonBuilder {
+	b.props.TooltipPlacement = v
+	return b
+}
+
+// OnCopy sets the handler for wa-copy event
+// Emitted when the data has been copied.
+func (b *CopyButtonBuilder) OnCopy(handler string) *CopyButtonBuilder {
+	b.props.OnCopy = handler
+	return b
+}
+
+// OnError sets the handler for wa-error event
+// Emitted when the data could not be copied.
+func (b *CopyButtonBuilder) OnError(handler string) *CopyButtonBuilder {
+	b.props.OnError = handler
+	return b
+}
+
+// CopyIconSlot sets the copy-icon slot content
+// The icon to show in the default copy state. Works best with <wa-icon>.
+func (b *CopyButtonBuilder) CopyIconSlot(c templ.Component) *CopyButtonBuilder {
+	b.props.Slots.CopyIcon = c
+	return b
+}
+
+// SuccessIconSlot sets the success-icon slot content
+// The icon to show when the content is copied. Works best with <wa-icon>.
+func (b *CopyButtonBuilder) SuccessIconSlot(c templ.Component) *CopyButtonBuilder {
+	b.props.Slots.SuccessIcon = c
+	return b
+}
+
+// ErrorIconSlot sets the error-icon slot content
+// The icon to show when a copy error occurs. Works best with <wa-icon>.
+func (b *CopyButtonBuilder) ErrorIconSlot(c templ.Component) *CopyButtonBuilder {
+	b.props.Slots.ErrorIcon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *CopyButtonBuilder) Attr(name, value string) *CopyButtonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CopyButtonBuilder) Attrs(attrs templ.Attributes) *CopyButtonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CopyButtonBuilder) Props() CopyButtonProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CopyButtonBuilder) Build() CopyButtonProps {
+	return b.props
+}
+
+// CopyButton renders the wa-copy-button component
+templ CopyButton(props CopyButtonProps) {
+	<wa-copy-button
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.From != "" {
+			from={ props.From }
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.CopyLabel != "" {
+			copy-label={ props.CopyLabel }
+		}
+		if props.SuccessLabel != "" {
+			success-label={ props.SuccessLabel }
+		}
+		if props.ErrorLabel != "" {
+			error-label={ props.ErrorLabel }
+		}
+		if props.FeedbackDuration != 0 {
+			feedback-duration={ templ.Sprintf("%v", props.FeedbackDuration) }
+		}
+		if props.TooltipPlacement != "" {
+			tooltip-placement={ props.TooltipPlacement }
+		}
+		if props.OnCopy != "" {
+			x-on:wa-copy={ props.OnCopy }
+		}
+		if props.OnError != "" {
+			x-on:wa-error={ props.OnError }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.CopyIcon != nil {
+			<div slot="copy-icon">
+				@props.Slots.CopyIcon
+			</div>
+		}
+		if props.Slots.SuccessIcon != nil {
+			<div slot="success-icon">
+				@props.Slots.SuccessIcon
+			</div>
+		}
+		if props.Slots.ErrorIcon != nil {
+			<div slot="error-icon">
+				@props.Slots.ErrorIcon
+			</div>
+		}
+		{ children... }
+	</wa-copy-button>
+}
+
+// CopyButtonFunc renders with a builder function for inline configuration
+templ CopyButtonFunc(fn func(*CopyButtonBuilder)) {
+	{{ b := NewCopyButton(); fn(b) }}
+	@CopyButton(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/copy-button_templ.go

@@ -0,0 +1,512 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-copy-button
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Copies text data to the clipboard when the user clicks the trigger.
+//
+// Web Awesome component: <wa-copy-button>
+
+// CopyButtonProps holds all properties for the wa-copy-button component
+type CopyButtonProps struct {
+	// The text value to copy.
+	Value string `attr:"value"`
+	// An id that references an element in the same document from which data will be copied. If both this and value are
+	From string `attr:"from"`
+	// Disables the copy button.
+	Disabled bool `attr:"disabled"`
+	// A custom label to show in the tooltip.
+	CopyLabel string `attr:"copy-label"`
+	// A custom label to show in the tooltip after copying.
+	SuccessLabel string `attr:"success-label"`
+	// A custom label to show in the tooltip when a copy error occurs.
+	ErrorLabel string `attr:"error-label"`
+	// The length of time to show feedback before restoring the default trigger.
+	FeedbackDuration float64 `attr:"feedback-duration"`
+	// The preferred placement of the tooltip.
+	// Valid values: "top", "right", "bottom", "left"
+	TooltipPlacement string `attr:"tooltip-placement"`
+
+	// Events
+	// Emitted when the data has been copied.
+	OnCopy string `attr:"x-on:wa-copy"`
+	// Emitted when the data could not be copied.
+	OnError string `attr:"x-on:wa-error"`
+
+	// Slots contains named slot content
+	Slots CopyButtonSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// CopyButtonSlots holds named slot content for the component
+type CopyButtonSlots struct {
+	// The icon to show in the default copy state. Works best with <wa-icon>.
+	CopyIcon templ.Component
+	// The icon to show when the content is copied. Works best with <wa-icon>.
+	SuccessIcon templ.Component
+	// The icon to show when a copy error occurs. Works best with <wa-icon>.
+	ErrorIcon templ.Component
+}
+
+// CopyButtonBuilder provides a fluent API for constructing CopyButtonProps
+type CopyButtonBuilder struct {
+	props CopyButtonProps
+}
+
+// NewCopyButton creates a new builder for wa-copy-button
+func NewCopyButton() *CopyButtonBuilder {
+	return &CopyButtonBuilder{}
+}
+
+// Value sets the value attribute
+// The text value to copy.
+func (b *CopyButtonBuilder) Value(v string) *CopyButtonBuilder {
+	b.props.Value = v
+	return b
+}
+
+// From sets the from attribute
+// An id that references an element in the same document from which data will be copied. If both this and value are
+func (b *CopyButtonBuilder) From(v string) *CopyButtonBuilder {
+	b.props.From = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the copy button.
+func (b *CopyButtonBuilder) Disabled(v bool) *CopyButtonBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// CopyLabel sets the copy-label attribute
+// A custom label to show in the tooltip.
+func (b *CopyButtonBuilder) CopyLabel(v string) *CopyButtonBuilder {
+	b.props.CopyLabel = v
+	return b
+}
+
+// SuccessLabel sets the success-label attribute
+// A custom label to show in the tooltip after copying.
+func (b *CopyButtonBuilder) SuccessLabel(v string) *CopyButtonBuilder {
+	b.props.SuccessLabel = v
+	return b
+}
+
+// ErrorLabel sets the error-label attribute
+// A custom label to show in the tooltip when a copy error occurs.
+func (b *CopyButtonBuilder) ErrorLabel(v string) *CopyButtonBuilder {
+	b.props.ErrorLabel = v
+	return b
+}
+
+// FeedbackDuration sets the feedback-duration attribute
+// The length of time to show feedback before restoring the default trigger.
+func (b *CopyButtonBuilder) FeedbackDuration(v float64) *CopyButtonBuilder {
+	b.props.FeedbackDuration = v
+	return b
+}
+
+// TooltipPlacement sets the tooltip-placement attribute
+// The preferred placement of the tooltip.
+func (b *CopyButtonBuilder) TooltipPlacement(v string) *CopyButtonBuilder {
+	b.props.TooltipPlacement = v
+	return b
+}
+
+// OnCopy sets the handler for wa-copy event
+// Emitted when the data has been copied.
+func (b *CopyButtonBuilder) OnCopy(handler string) *CopyButtonBuilder {
+	b.props.OnCopy = handler
+	return b
+}
+
+// OnError sets the handler for wa-error event
+// Emitted when the data could not be copied.
+func (b *CopyButtonBuilder) OnError(handler string) *CopyButtonBuilder {
+	b.props.OnError = handler
+	return b
+}
+
+// CopyIconSlot sets the copy-icon slot content
+// The icon to show in the default copy state. Works best with <wa-icon>.
+func (b *CopyButtonBuilder) CopyIconSlot(c templ.Component) *CopyButtonBuilder {
+	b.props.Slots.CopyIcon = c
+	return b
+}
+
+// SuccessIconSlot sets the success-icon slot content
+// The icon to show when the content is copied. Works best with <wa-icon>.
+func (b *CopyButtonBuilder) SuccessIconSlot(c templ.Component) *CopyButtonBuilder {
+	b.props.Slots.SuccessIcon = c
+	return b
+}
+
+// ErrorIconSlot sets the error-icon slot content
+// The icon to show when a copy error occurs. Works best with <wa-icon>.
+func (b *CopyButtonBuilder) ErrorIconSlot(c templ.Component) *CopyButtonBuilder {
+	b.props.Slots.ErrorIcon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *CopyButtonBuilder) Attr(name, value string) *CopyButtonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *CopyButtonBuilder) Attrs(attrs templ.Attributes) *CopyButtonBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *CopyButtonBuilder) Props() CopyButtonProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *CopyButtonBuilder) Build() CopyButtonProps {
+	return b.props
+}
+
+// CopyButton renders the wa-copy-button component
+func CopyButton(props CopyButtonProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-copy-button")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/copy-button.templ`, Line: 192, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.From != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " from=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.From)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/copy-button.templ`, Line: 195, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.CopyLabel != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " copy-label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.CopyLabel)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/copy-button.templ`, Line: 201, Col: 31}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.SuccessLabel != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " success-label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.SuccessLabel)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/copy-button.templ`, Line: 204, Col: 37}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.ErrorLabel != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " error-label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.ErrorLabel)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/copy-button.templ`, Line: 207, Col: 33}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.FeedbackDuration != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " feedback-duration=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.FeedbackDuration))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/copy-button.templ`, Line: 210, Col: 66}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.TooltipPlacement != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, " tooltip-placement=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.TooltipPlacement)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/copy-button.templ`, Line: 213, Col: 45}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnCopy != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, " x-on:wa-copy=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnCopy)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/copy-button.templ`, Line: 216, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnError != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, " x-on:wa-error=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnError)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/copy-button.templ`, Line: 219, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.CopyIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "<div slot=\"copy-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.CopyIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.SuccessIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "<div slot=\"success-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.SuccessIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.ErrorIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "<div slot=\"error-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.ErrorIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, "</wa-copy-button>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// CopyButtonFunc renders with a builder function for inline configuration
+func CopyButtonFunc(fn func(*CopyButtonBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var11 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var11 == nil {
+			templ_7745c5c3_Var11 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewCopyButton()
+		fn(b)
+		templ_7745c5c3_Var12 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var11.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = CopyButton(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var12), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/details.templ

@@ -0,0 +1,249 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-details
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Details show a brief summary and expand to show additional content.
+//
+// Web Awesome component: <wa-details>
+
+// DetailsProps holds all properties for the wa-details component
+type DetailsProps struct {
+	// Indicates whether or not the details is open. You can toggle this attribute to show and hide the details, or you
+	Open bool `attr:"open"`
+	// The summary to show in the header. If you need to display HTML, use the summary slot instead.
+	Summary string `attr:"summary"`
+	// Groups related details elements. When one opens, others with the same name will close.
+	Name string `attr:"name"`
+	// Disables the details so it can't be toggled.
+	Disabled bool `attr:"disabled"`
+	// The element's visual appearance.
+	// Valid values: "filled", "outlined", "filled-outlined", "plain"
+	Appearance string `attr:"appearance"`
+	// The location of the expand/collapse icon.
+	// Valid values: "start", "end"
+	IconPlacement string `attr:"icon-placement"`
+
+	// Events
+	// Emitted when the details opens.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the details opens and all animations are complete.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the details closes.
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the details closes and all animations are complete.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+
+	// Slots contains named slot content
+	Slots DetailsSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DetailsSlots holds named slot content for the component
+type DetailsSlots struct {
+	// The details' summary. Alternatively, you can use the summary attribute.
+	Summary templ.Component
+	// Optional expand icon to use instead of the default. Works best with <wa-icon>.
+	ExpandIcon templ.Component
+	// Optional collapse icon to use instead of the default. Works best with <wa-icon>.
+	CollapseIcon templ.Component
+}
+
+// DetailsBuilder provides a fluent API for constructing DetailsProps
+type DetailsBuilder struct {
+	props DetailsProps
+}
+
+// NewDetails creates a new builder for wa-details
+func NewDetails() *DetailsBuilder {
+	return &DetailsBuilder{}
+}
+
+// Open sets the open attribute
+// Indicates whether or not the details is open. You can toggle this attribute to show and hide the details, or you
+func (b *DetailsBuilder) Open(v bool) *DetailsBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Summary sets the summary attribute
+// The summary to show in the header. If you need to display HTML, use the summary slot instead.
+func (b *DetailsBuilder) Summary(v string) *DetailsBuilder {
+	b.props.Summary = v
+	return b
+}
+
+// Name sets the name attribute
+// Groups related details elements. When one opens, others with the same name will close.
+func (b *DetailsBuilder) Name(v string) *DetailsBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the details so it can't be toggled.
+func (b *DetailsBuilder) Disabled(v bool) *DetailsBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The element's visual appearance.
+func (b *DetailsBuilder) Appearance(v string) *DetailsBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// IconPlacement sets the icon-placement attribute
+// The location of the expand/collapse icon.
+func (b *DetailsBuilder) IconPlacement(v string) *DetailsBuilder {
+	b.props.IconPlacement = v
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the details opens.
+func (b *DetailsBuilder) OnShow(handler string) *DetailsBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the details opens and all animations are complete.
+func (b *DetailsBuilder) OnAfterShow(handler string) *DetailsBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the details closes.
+func (b *DetailsBuilder) OnHide(handler string) *DetailsBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the details closes and all animations are complete.
+func (b *DetailsBuilder) OnAfterHide(handler string) *DetailsBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// SummarySlot sets the summary slot content
+// The details' summary. Alternatively, you can use the summary attribute.
+func (b *DetailsBuilder) SummarySlot(c templ.Component) *DetailsBuilder {
+	b.props.Slots.Summary = c
+	return b
+}
+
+// ExpandIconSlot sets the expand-icon slot content
+// Optional expand icon to use instead of the default. Works best with <wa-icon>.
+func (b *DetailsBuilder) ExpandIconSlot(c templ.Component) *DetailsBuilder {
+	b.props.Slots.ExpandIcon = c
+	return b
+}
+
+// CollapseIconSlot sets the collapse-icon slot content
+// Optional collapse icon to use instead of the default. Works best with <wa-icon>.
+func (b *DetailsBuilder) CollapseIconSlot(c templ.Component) *DetailsBuilder {
+	b.props.Slots.CollapseIcon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DetailsBuilder) Attr(name, value string) *DetailsBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DetailsBuilder) Attrs(attrs templ.Attributes) *DetailsBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DetailsBuilder) Props() DetailsProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DetailsBuilder) Build() DetailsProps {
+	return b.props
+}
+
+// Details renders the wa-details component
+templ Details(props DetailsProps) {
+	<wa-details
+		if props.Open {
+			open
+		}
+		if props.Summary != "" {
+			summary={ props.Summary }
+		}
+		if props.Name != "" {
+			name={ props.Name }
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.Appearance != "" {
+			appearance={ props.Appearance }
+		}
+		if props.IconPlacement != "" {
+			icon-placement={ props.IconPlacement }
+		}
+		if props.OnShow != "" {
+			x-on:wa-show={ props.OnShow }
+		}
+		if props.OnAfterShow != "" {
+			x-on:wa-after-show={ props.OnAfterShow }
+		}
+		if props.OnHide != "" {
+			x-on:wa-hide={ props.OnHide }
+		}
+		if props.OnAfterHide != "" {
+			x-on:wa-after-hide={ props.OnAfterHide }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Summary != nil {
+			<div slot="summary">
+				@props.Slots.Summary
+			</div>
+		}
+		if props.Slots.ExpandIcon != nil {
+			<div slot="expand-icon">
+				@props.Slots.ExpandIcon
+			</div>
+		}
+		if props.Slots.CollapseIcon != nil {
+			<div slot="collapse-icon">
+				@props.Slots.CollapseIcon
+			</div>
+		}
+		{ children... }
+	</wa-details>
+}
+
+// DetailsFunc renders with a builder function for inline configuration
+templ DetailsFunc(fn func(*DetailsBuilder)) {
+	{{ b := NewDetails(); fn(b) }}
+	@Details(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/details_templ.go

@@ -0,0 +1,500 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-details
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Details show a brief summary and expand to show additional content.
+//
+// Web Awesome component: <wa-details>
+
+// DetailsProps holds all properties for the wa-details component
+type DetailsProps struct {
+	// Indicates whether or not the details is open. You can toggle this attribute to show and hide the details, or you
+	Open bool `attr:"open"`
+	// The summary to show in the header. If you need to display HTML, use the summary slot instead.
+	Summary string `attr:"summary"`
+	// Groups related details elements. When one opens, others with the same name will close.
+	Name string `attr:"name"`
+	// Disables the details so it can't be toggled.
+	Disabled bool `attr:"disabled"`
+	// The element's visual appearance.
+	// Valid values: "filled", "outlined", "filled-outlined", "plain"
+	Appearance string `attr:"appearance"`
+	// The location of the expand/collapse icon.
+	// Valid values: "start", "end"
+	IconPlacement string `attr:"icon-placement"`
+
+	// Events
+	// Emitted when the details opens.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the details opens and all animations are complete.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the details closes.
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the details closes and all animations are complete.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+
+	// Slots contains named slot content
+	Slots DetailsSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DetailsSlots holds named slot content for the component
+type DetailsSlots struct {
+	// The details' summary. Alternatively, you can use the summary attribute.
+	Summary templ.Component
+	// Optional expand icon to use instead of the default. Works best with <wa-icon>.
+	ExpandIcon templ.Component
+	// Optional collapse icon to use instead of the default. Works best with <wa-icon>.
+	CollapseIcon templ.Component
+}
+
+// DetailsBuilder provides a fluent API for constructing DetailsProps
+type DetailsBuilder struct {
+	props DetailsProps
+}
+
+// NewDetails creates a new builder for wa-details
+func NewDetails() *DetailsBuilder {
+	return &DetailsBuilder{}
+}
+
+// Open sets the open attribute
+// Indicates whether or not the details is open. You can toggle this attribute to show and hide the details, or you
+func (b *DetailsBuilder) Open(v bool) *DetailsBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Summary sets the summary attribute
+// The summary to show in the header. If you need to display HTML, use the summary slot instead.
+func (b *DetailsBuilder) Summary(v string) *DetailsBuilder {
+	b.props.Summary = v
+	return b
+}
+
+// Name sets the name attribute
+// Groups related details elements. When one opens, others with the same name will close.
+func (b *DetailsBuilder) Name(v string) *DetailsBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the details so it can't be toggled.
+func (b *DetailsBuilder) Disabled(v bool) *DetailsBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The element's visual appearance.
+func (b *DetailsBuilder) Appearance(v string) *DetailsBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// IconPlacement sets the icon-placement attribute
+// The location of the expand/collapse icon.
+func (b *DetailsBuilder) IconPlacement(v string) *DetailsBuilder {
+	b.props.IconPlacement = v
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the details opens.
+func (b *DetailsBuilder) OnShow(handler string) *DetailsBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the details opens and all animations are complete.
+func (b *DetailsBuilder) OnAfterShow(handler string) *DetailsBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the details closes.
+func (b *DetailsBuilder) OnHide(handler string) *DetailsBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the details closes and all animations are complete.
+func (b *DetailsBuilder) OnAfterHide(handler string) *DetailsBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// SummarySlot sets the summary slot content
+// The details' summary. Alternatively, you can use the summary attribute.
+func (b *DetailsBuilder) SummarySlot(c templ.Component) *DetailsBuilder {
+	b.props.Slots.Summary = c
+	return b
+}
+
+// ExpandIconSlot sets the expand-icon slot content
+// Optional expand icon to use instead of the default. Works best with <wa-icon>.
+func (b *DetailsBuilder) ExpandIconSlot(c templ.Component) *DetailsBuilder {
+	b.props.Slots.ExpandIcon = c
+	return b
+}
+
+// CollapseIconSlot sets the collapse-icon slot content
+// Optional collapse icon to use instead of the default. Works best with <wa-icon>.
+func (b *DetailsBuilder) CollapseIconSlot(c templ.Component) *DetailsBuilder {
+	b.props.Slots.CollapseIcon = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DetailsBuilder) Attr(name, value string) *DetailsBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DetailsBuilder) Attrs(attrs templ.Attributes) *DetailsBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DetailsBuilder) Props() DetailsProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DetailsBuilder) Build() DetailsProps {
+	return b.props
+}
+
+// Details renders the wa-details component
+func Details(props DetailsProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-details")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Open {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " open")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Summary != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, " summary=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Summary)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/details.templ`, Line: 196, Col: 26}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Name != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/details.templ`, Line: 199, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Appearance != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " appearance=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Appearance)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/details.templ`, Line: 205, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.IconPlacement != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " icon-placement=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.IconPlacement)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/details.templ`, Line: 208, Col: 39}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " x-on:wa-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/details.templ`, Line: 211, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " x-on:wa-after-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/details.templ`, Line: 214, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " x-on:wa-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/details.templ`, Line: 217, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, " x-on:wa-after-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/details.templ`, Line: 220, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Summary != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "<div slot=\"summary\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Summary.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.ExpandIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "<div slot=\"expand-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.ExpandIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.CollapseIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "<div slot=\"collapse-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.CollapseIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "</wa-details>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// DetailsFunc renders with a builder function for inline configuration
+func DetailsFunc(fn func(*DetailsBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var10 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var10 == nil {
+			templ_7745c5c3_Var10 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewDetails()
+		fn(b)
+		templ_7745c5c3_Var11 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var10.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Details(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var11), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/dialog.templ

@@ -0,0 +1,223 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-dialog
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Dialogs, sometimes called "modals", appear above the page and require the user's immediate attention.
+//
+// Web Awesome component: <wa-dialog>
+
+// DialogProps holds all properties for the wa-dialog component
+type DialogProps struct {
+	// Indicates whether or not the dialog is open. Toggle this attribute to show and hide the dialog.
+	Open bool `attr:"open"`
+	// The dialog's label as displayed in the header. You should always include a relevant label, as it is required for
+	Label string `attr:"label"`
+	// Disables the header. This will also remove the default close button.
+	WithoutHeader bool `attr:"without-header"`
+	// When enabled, the dialog will be closed when the user clicks outside of it.
+	LightDismiss bool `attr:"light-dismiss"`
+
+	// Events
+	// Emitted when the dialog opens.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the dialog opens and all animations are complete.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the dialog is requested to close. Calling event.preventDefault() will prevent the dialog from closing. Y...
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the dialog closes and all animations are complete.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+
+	// Slots contains named slot content
+	Slots DialogSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DialogSlots holds named slot content for the component
+type DialogSlots struct {
+	// The dialog's label. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// Optional actions to add to the header. Works best with <wa-button>.
+	HeaderActions templ.Component
+	// The dialog's footer, usually one or more buttons representing various options.
+	Footer templ.Component
+}
+
+// DialogBuilder provides a fluent API for constructing DialogProps
+type DialogBuilder struct {
+	props DialogProps
+}
+
+// NewDialog creates a new builder for wa-dialog
+func NewDialog() *DialogBuilder {
+	return &DialogBuilder{}
+}
+
+// Open sets the open attribute
+// Indicates whether or not the dialog is open. Toggle this attribute to show and hide the dialog.
+func (b *DialogBuilder) Open(v bool) *DialogBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Label sets the label attribute
+// The dialog's label as displayed in the header. You should always include a relevant label, as it is required for
+func (b *DialogBuilder) Label(v string) *DialogBuilder {
+	b.props.Label = v
+	return b
+}
+
+// WithoutHeader sets the without-header attribute
+// Disables the header. This will also remove the default close button.
+func (b *DialogBuilder) WithoutHeader(v bool) *DialogBuilder {
+	b.props.WithoutHeader = v
+	return b
+}
+
+// LightDismiss sets the light-dismiss attribute
+// When enabled, the dialog will be closed when the user clicks outside of it.
+func (b *DialogBuilder) LightDismiss(v bool) *DialogBuilder {
+	b.props.LightDismiss = v
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the dialog opens.
+func (b *DialogBuilder) OnShow(handler string) *DialogBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the dialog opens and all animations are complete.
+func (b *DialogBuilder) OnAfterShow(handler string) *DialogBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the dialog is requested to close. Calling event.preventDefault() will prevent the dialog from closing. Y...
+func (b *DialogBuilder) OnHide(handler string) *DialogBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the dialog closes and all animations are complete.
+func (b *DialogBuilder) OnAfterHide(handler string) *DialogBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The dialog's label. Alternatively, you can use the label attribute.
+func (b *DialogBuilder) LabelSlot(c templ.Component) *DialogBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// HeaderActionsSlot sets the header-actions slot content
+// Optional actions to add to the header. Works best with <wa-button>.
+func (b *DialogBuilder) HeaderActionsSlot(c templ.Component) *DialogBuilder {
+	b.props.Slots.HeaderActions = c
+	return b
+}
+
+// FooterSlot sets the footer slot content
+// The dialog's footer, usually one or more buttons representing various options.
+func (b *DialogBuilder) FooterSlot(c templ.Component) *DialogBuilder {
+	b.props.Slots.Footer = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DialogBuilder) Attr(name, value string) *DialogBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DialogBuilder) Attrs(attrs templ.Attributes) *DialogBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DialogBuilder) Props() DialogProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DialogBuilder) Build() DialogProps {
+	return b.props
+}
+
+// Dialog renders the wa-dialog component
+templ Dialog(props DialogProps) {
+	<wa-dialog
+		if props.Open {
+			open
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.WithoutHeader {
+			without-header
+		}
+		if props.LightDismiss {
+			light-dismiss
+		}
+		if props.OnShow != "" {
+			x-on:wa-show={ props.OnShow }
+		}
+		if props.OnAfterShow != "" {
+			x-on:wa-after-show={ props.OnAfterShow }
+		}
+		if props.OnHide != "" {
+			x-on:wa-hide={ props.OnHide }
+		}
+		if props.OnAfterHide != "" {
+			x-on:wa-after-hide={ props.OnAfterHide }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Label != nil {
+			<div slot="label">
+				@props.Slots.Label
+			</div>
+		}
+		if props.Slots.HeaderActions != nil {
+			<div slot="header-actions">
+				@props.Slots.HeaderActions
+			</div>
+		}
+		if props.Slots.Footer != nil {
+			<div slot="footer">
+				@props.Slots.Footer
+			</div>
+		}
+		{ children... }
+	</wa-dialog>
+}
+
+// DialogFunc renders with a builder function for inline configuration
+templ DialogFunc(fn func(*DialogBuilder)) {
+	{{ b := NewDialog(); fn(b) }}
+	@Dialog(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/dialog_templ.go

@@ -0,0 +1,429 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-dialog
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Dialogs, sometimes called "modals", appear above the page and require the user's immediate attention.
+//
+// Web Awesome component: <wa-dialog>
+
+// DialogProps holds all properties for the wa-dialog component
+type DialogProps struct {
+	// Indicates whether or not the dialog is open. Toggle this attribute to show and hide the dialog.
+	Open bool `attr:"open"`
+	// The dialog's label as displayed in the header. You should always include a relevant label, as it is required for
+	Label string `attr:"label"`
+	// Disables the header. This will also remove the default close button.
+	WithoutHeader bool `attr:"without-header"`
+	// When enabled, the dialog will be closed when the user clicks outside of it.
+	LightDismiss bool `attr:"light-dismiss"`
+
+	// Events
+	// Emitted when the dialog opens.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the dialog opens and all animations are complete.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the dialog is requested to close. Calling event.preventDefault() will prevent the dialog from closing. Y...
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the dialog closes and all animations are complete.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+
+	// Slots contains named slot content
+	Slots DialogSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DialogSlots holds named slot content for the component
+type DialogSlots struct {
+	// The dialog's label. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// Optional actions to add to the header. Works best with <wa-button>.
+	HeaderActions templ.Component
+	// The dialog's footer, usually one or more buttons representing various options.
+	Footer templ.Component
+}
+
+// DialogBuilder provides a fluent API for constructing DialogProps
+type DialogBuilder struct {
+	props DialogProps
+}
+
+// NewDialog creates a new builder for wa-dialog
+func NewDialog() *DialogBuilder {
+	return &DialogBuilder{}
+}
+
+// Open sets the open attribute
+// Indicates whether or not the dialog is open. Toggle this attribute to show and hide the dialog.
+func (b *DialogBuilder) Open(v bool) *DialogBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Label sets the label attribute
+// The dialog's label as displayed in the header. You should always include a relevant label, as it is required for
+func (b *DialogBuilder) Label(v string) *DialogBuilder {
+	b.props.Label = v
+	return b
+}
+
+// WithoutHeader sets the without-header attribute
+// Disables the header. This will also remove the default close button.
+func (b *DialogBuilder) WithoutHeader(v bool) *DialogBuilder {
+	b.props.WithoutHeader = v
+	return b
+}
+
+// LightDismiss sets the light-dismiss attribute
+// When enabled, the dialog will be closed when the user clicks outside of it.
+func (b *DialogBuilder) LightDismiss(v bool) *DialogBuilder {
+	b.props.LightDismiss = v
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the dialog opens.
+func (b *DialogBuilder) OnShow(handler string) *DialogBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the dialog opens and all animations are complete.
+func (b *DialogBuilder) OnAfterShow(handler string) *DialogBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the dialog is requested to close. Calling event.preventDefault() will prevent the dialog from closing. Y...
+func (b *DialogBuilder) OnHide(handler string) *DialogBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the dialog closes and all animations are complete.
+func (b *DialogBuilder) OnAfterHide(handler string) *DialogBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The dialog's label. Alternatively, you can use the label attribute.
+func (b *DialogBuilder) LabelSlot(c templ.Component) *DialogBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// HeaderActionsSlot sets the header-actions slot content
+// Optional actions to add to the header. Works best with <wa-button>.
+func (b *DialogBuilder) HeaderActionsSlot(c templ.Component) *DialogBuilder {
+	b.props.Slots.HeaderActions = c
+	return b
+}
+
+// FooterSlot sets the footer slot content
+// The dialog's footer, usually one or more buttons representing various options.
+func (b *DialogBuilder) FooterSlot(c templ.Component) *DialogBuilder {
+	b.props.Slots.Footer = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DialogBuilder) Attr(name, value string) *DialogBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DialogBuilder) Attrs(attrs templ.Attributes) *DialogBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DialogBuilder) Props() DialogProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DialogBuilder) Build() DialogProps {
+	return b.props
+}
+
+// Dialog renders the wa-dialog component
+func Dialog(props DialogProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-dialog")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Open {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " open")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dialog.templ`, Line: 176, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithoutHeader {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " without-header")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.LightDismiss {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " light-dismiss")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " x-on:wa-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dialog.templ`, Line: 185, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " x-on:wa-after-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dialog.templ`, Line: 188, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " x-on:wa-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dialog.templ`, Line: 191, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " x-on:wa-after-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dialog.templ`, Line: 194, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Label != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "<div slot=\"label\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Label.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.HeaderActions != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "<div slot=\"header-actions\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.HeaderActions.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Footer != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "<div slot=\"footer\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Footer.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "</wa-dialog>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// DialogFunc renders with a builder function for inline configuration
+func DialogFunc(fn func(*DialogBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var7 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var7 == nil {
+			templ_7745c5c3_Var7 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewDialog()
+		fn(b)
+		templ_7745c5c3_Var8 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var7.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Dialog(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var8), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/divider.templ

@@ -0,0 +1,94 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-divider
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Dividers are used to visually separate or group elements.
+//
+// Web Awesome component: <wa-divider>
+
+// DividerProps holds all properties for the wa-divider component
+type DividerProps struct {
+	// Sets the divider's orientation.
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots DividerSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DividerBuilder provides a fluent API for constructing DividerProps
+type DividerBuilder struct {
+	props DividerProps
+}
+
+// NewDivider creates a new builder for wa-divider
+func NewDivider() *DividerBuilder {
+	return &DividerBuilder{}
+}
+
+// Orientation sets the orientation attribute
+// Sets the divider's orientation.
+func (b *DividerBuilder) Orientation(v string) *DividerBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DividerBuilder) Attr(name, value string) *DividerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DividerBuilder) Attrs(attrs templ.Attributes) *DividerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DividerBuilder) Props() DividerProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DividerBuilder) Build() DividerProps {
+	return b.props
+}
+
+// Divider renders the wa-divider component
+templ Divider(props DividerProps) {
+	<wa-divider
+		if props.Orientation != "" {
+			orientation={ props.Orientation }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-divider>
+}
+
+// DividerFunc renders with a builder function for inline configuration
+templ DividerFunc(fn func(*DividerBuilder)) {
+	{{ b := NewDivider(); fn(b) }}
+	@Divider(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/divider_templ.go

@@ -0,0 +1,200 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-divider
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Dividers are used to visually separate or group elements.
+//
+// Web Awesome component: <wa-divider>
+
+// DividerProps holds all properties for the wa-divider component
+type DividerProps struct {
+	// Sets the divider's orientation.
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots DividerSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DividerBuilder provides a fluent API for constructing DividerProps
+type DividerBuilder struct {
+	props DividerProps
+}
+
+// NewDivider creates a new builder for wa-divider
+func NewDivider() *DividerBuilder {
+	return &DividerBuilder{}
+}
+
+// Orientation sets the orientation attribute
+// Sets the divider's orientation.
+func (b *DividerBuilder) Orientation(v string) *DividerBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DividerBuilder) Attr(name, value string) *DividerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DividerBuilder) Attrs(attrs templ.Attributes) *DividerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DividerBuilder) Props() DividerProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DividerBuilder) Build() DividerProps {
+	return b.props
+}
+
+// Divider renders the wa-divider component
+func Divider(props DividerProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-divider")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Orientation != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " orientation=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Orientation)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/divider.templ`, Line: 80, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "</wa-divider>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// DividerFunc renders with a builder function for inline configuration
+func DividerFunc(fn func(*DividerBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var3 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var3 == nil {
+			templ_7745c5c3_Var3 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewDivider()
+		fn(b)
+		templ_7745c5c3_Var4 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var3.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Divider(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var4), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/drawer.templ

@@ -0,0 +1,236 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-drawer
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Drawers slide in from a container to expose additional options and information.
+//
+// Web Awesome component: <wa-drawer>
+
+// DrawerProps holds all properties for the wa-drawer component
+type DrawerProps struct {
+	// Indicates whether or not the drawer is open. Toggle this attribute to show and hide the drawer.
+	Open bool `attr:"open"`
+	// The drawer's label as displayed in the header. You should always include a relevant label, as it is required for
+	Label string `attr:"label"`
+	// The direction from which the drawer will open.
+	// Valid values: "top", "end", "bottom", "start"
+	Placement string `attr:"placement"`
+	// Disables the header. This will also remove the default close button.
+	WithoutHeader bool `attr:"without-header"`
+	// When enabled, the drawer will be closed when the user clicks outside of it.
+	LightDismiss bool `attr:"light-dismiss"`
+
+	// Events
+	// Emitted when the drawer opens.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the drawer opens and all animations are complete.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the drawer is requesting to close. Calling event.preventDefault() will prevent the drawer from closing. ...
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the drawer closes and all animations are complete.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+
+	// Slots contains named slot content
+	Slots DrawerSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DrawerSlots holds named slot content for the component
+type DrawerSlots struct {
+	// The drawer's label. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// Optional actions to add to the header. Works best with <wa-button>.
+	HeaderActions templ.Component
+	// The drawer's footer, usually one or more buttons representing various options.
+	Footer templ.Component
+}
+
+// DrawerBuilder provides a fluent API for constructing DrawerProps
+type DrawerBuilder struct {
+	props DrawerProps
+}
+
+// NewDrawer creates a new builder for wa-drawer
+func NewDrawer() *DrawerBuilder {
+	return &DrawerBuilder{}
+}
+
+// Open sets the open attribute
+// Indicates whether or not the drawer is open. Toggle this attribute to show and hide the drawer.
+func (b *DrawerBuilder) Open(v bool) *DrawerBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Label sets the label attribute
+// The drawer's label as displayed in the header. You should always include a relevant label, as it is required for
+func (b *DrawerBuilder) Label(v string) *DrawerBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Placement sets the placement attribute
+// The direction from which the drawer will open.
+func (b *DrawerBuilder) Placement(v string) *DrawerBuilder {
+	b.props.Placement = v
+	return b
+}
+
+// WithoutHeader sets the without-header attribute
+// Disables the header. This will also remove the default close button.
+func (b *DrawerBuilder) WithoutHeader(v bool) *DrawerBuilder {
+	b.props.WithoutHeader = v
+	return b
+}
+
+// LightDismiss sets the light-dismiss attribute
+// When enabled, the drawer will be closed when the user clicks outside of it.
+func (b *DrawerBuilder) LightDismiss(v bool) *DrawerBuilder {
+	b.props.LightDismiss = v
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the drawer opens.
+func (b *DrawerBuilder) OnShow(handler string) *DrawerBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the drawer opens and all animations are complete.
+func (b *DrawerBuilder) OnAfterShow(handler string) *DrawerBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the drawer is requesting to close. Calling event.preventDefault() will prevent the drawer from closing. ...
+func (b *DrawerBuilder) OnHide(handler string) *DrawerBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the drawer closes and all animations are complete.
+func (b *DrawerBuilder) OnAfterHide(handler string) *DrawerBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The drawer's label. Alternatively, you can use the label attribute.
+func (b *DrawerBuilder) LabelSlot(c templ.Component) *DrawerBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// HeaderActionsSlot sets the header-actions slot content
+// Optional actions to add to the header. Works best with <wa-button>.
+func (b *DrawerBuilder) HeaderActionsSlot(c templ.Component) *DrawerBuilder {
+	b.props.Slots.HeaderActions = c
+	return b
+}
+
+// FooterSlot sets the footer slot content
+// The drawer's footer, usually one or more buttons representing various options.
+func (b *DrawerBuilder) FooterSlot(c templ.Component) *DrawerBuilder {
+	b.props.Slots.Footer = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DrawerBuilder) Attr(name, value string) *DrawerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DrawerBuilder) Attrs(attrs templ.Attributes) *DrawerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DrawerBuilder) Props() DrawerProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DrawerBuilder) Build() DrawerProps {
+	return b.props
+}
+
+// Drawer renders the wa-drawer component
+templ Drawer(props DrawerProps) {
+	<wa-drawer
+		if props.Open {
+			open
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.Placement != "" {
+			placement={ props.Placement }
+		}
+		if props.WithoutHeader {
+			without-header
+		}
+		if props.LightDismiss {
+			light-dismiss
+		}
+		if props.OnShow != "" {
+			x-on:wa-show={ props.OnShow }
+		}
+		if props.OnAfterShow != "" {
+			x-on:wa-after-show={ props.OnAfterShow }
+		}
+		if props.OnHide != "" {
+			x-on:wa-hide={ props.OnHide }
+		}
+		if props.OnAfterHide != "" {
+			x-on:wa-after-hide={ props.OnAfterHide }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Label != nil {
+			<div slot="label">
+				@props.Slots.Label
+			</div>
+		}
+		if props.Slots.HeaderActions != nil {
+			<div slot="header-actions">
+				@props.Slots.HeaderActions
+			</div>
+		}
+		if props.Slots.Footer != nil {
+			<div slot="footer">
+				@props.Slots.Footer
+			</div>
+		}
+		{ children... }
+	</wa-drawer>
+}
+
+// DrawerFunc renders with a builder function for inline configuration
+templ DrawerFunc(fn func(*DrawerBuilder)) {
+	{{ b := NewDrawer(); fn(b) }}
+	@Drawer(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/drawer_templ.go

@@ -0,0 +1,458 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-drawer
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Drawers slide in from a container to expose additional options and information.
+//
+// Web Awesome component: <wa-drawer>
+
+// DrawerProps holds all properties for the wa-drawer component
+type DrawerProps struct {
+	// Indicates whether or not the drawer is open. Toggle this attribute to show and hide the drawer.
+	Open bool `attr:"open"`
+	// The drawer's label as displayed in the header. You should always include a relevant label, as it is required for
+	Label string `attr:"label"`
+	// The direction from which the drawer will open.
+	// Valid values: "top", "end", "bottom", "start"
+	Placement string `attr:"placement"`
+	// Disables the header. This will also remove the default close button.
+	WithoutHeader bool `attr:"without-header"`
+	// When enabled, the drawer will be closed when the user clicks outside of it.
+	LightDismiss bool `attr:"light-dismiss"`
+
+	// Events
+	// Emitted when the drawer opens.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the drawer opens and all animations are complete.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the drawer is requesting to close. Calling event.preventDefault() will prevent the drawer from closing. ...
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the drawer closes and all animations are complete.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+
+	// Slots contains named slot content
+	Slots DrawerSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DrawerSlots holds named slot content for the component
+type DrawerSlots struct {
+	// The drawer's label. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// Optional actions to add to the header. Works best with <wa-button>.
+	HeaderActions templ.Component
+	// The drawer's footer, usually one or more buttons representing various options.
+	Footer templ.Component
+}
+
+// DrawerBuilder provides a fluent API for constructing DrawerProps
+type DrawerBuilder struct {
+	props DrawerProps
+}
+
+// NewDrawer creates a new builder for wa-drawer
+func NewDrawer() *DrawerBuilder {
+	return &DrawerBuilder{}
+}
+
+// Open sets the open attribute
+// Indicates whether or not the drawer is open. Toggle this attribute to show and hide the drawer.
+func (b *DrawerBuilder) Open(v bool) *DrawerBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Label sets the label attribute
+// The drawer's label as displayed in the header. You should always include a relevant label, as it is required for
+func (b *DrawerBuilder) Label(v string) *DrawerBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Placement sets the placement attribute
+// The direction from which the drawer will open.
+func (b *DrawerBuilder) Placement(v string) *DrawerBuilder {
+	b.props.Placement = v
+	return b
+}
+
+// WithoutHeader sets the without-header attribute
+// Disables the header. This will also remove the default close button.
+func (b *DrawerBuilder) WithoutHeader(v bool) *DrawerBuilder {
+	b.props.WithoutHeader = v
+	return b
+}
+
+// LightDismiss sets the light-dismiss attribute
+// When enabled, the drawer will be closed when the user clicks outside of it.
+func (b *DrawerBuilder) LightDismiss(v bool) *DrawerBuilder {
+	b.props.LightDismiss = v
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the drawer opens.
+func (b *DrawerBuilder) OnShow(handler string) *DrawerBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the drawer opens and all animations are complete.
+func (b *DrawerBuilder) OnAfterShow(handler string) *DrawerBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the drawer is requesting to close. Calling event.preventDefault() will prevent the drawer from closing. ...
+func (b *DrawerBuilder) OnHide(handler string) *DrawerBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the drawer closes and all animations are complete.
+func (b *DrawerBuilder) OnAfterHide(handler string) *DrawerBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The drawer's label. Alternatively, you can use the label attribute.
+func (b *DrawerBuilder) LabelSlot(c templ.Component) *DrawerBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// HeaderActionsSlot sets the header-actions slot content
+// Optional actions to add to the header. Works best with <wa-button>.
+func (b *DrawerBuilder) HeaderActionsSlot(c templ.Component) *DrawerBuilder {
+	b.props.Slots.HeaderActions = c
+	return b
+}
+
+// FooterSlot sets the footer slot content
+// The drawer's footer, usually one or more buttons representing various options.
+func (b *DrawerBuilder) FooterSlot(c templ.Component) *DrawerBuilder {
+	b.props.Slots.Footer = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DrawerBuilder) Attr(name, value string) *DrawerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DrawerBuilder) Attrs(attrs templ.Attributes) *DrawerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DrawerBuilder) Props() DrawerProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DrawerBuilder) Build() DrawerProps {
+	return b.props
+}
+
+// Drawer renders the wa-drawer component
+func Drawer(props DrawerProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-drawer")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Open {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " open")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/drawer.templ`, Line: 186, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Placement != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " placement=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Placement)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/drawer.templ`, Line: 189, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithoutHeader {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " without-header")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.LightDismiss {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " light-dismiss")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " x-on:wa-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/drawer.templ`, Line: 198, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " x-on:wa-after-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/drawer.templ`, Line: 201, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " x-on:wa-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/drawer.templ`, Line: 204, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, " x-on:wa-after-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/drawer.templ`, Line: 207, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Label != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "<div slot=\"label\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Label.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.HeaderActions != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "<div slot=\"header-actions\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.HeaderActions.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Footer != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "<div slot=\"footer\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Footer.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "</wa-drawer>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// DrawerFunc renders with a builder function for inline configuration
+func DrawerFunc(fn func(*DrawerBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var8 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var8 == nil {
+			templ_7745c5c3_Var8 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewDrawer()
+		fn(b)
+		templ_7745c5c3_Var9 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var8.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Drawer(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var9), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/dropdown-item.templ

@@ -0,0 +1,225 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-dropdown-item
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Represents an individual item within a dropdown menu, supporting standard items, checkboxes, and submenus.
+//
+// Web Awesome component: <wa-dropdown-item>
+
+// DropdownItemProps holds all properties for the wa-dropdown-item component
+type DropdownItemProps struct {
+	// The type of menu item to render.
+	// Valid values: "danger", "default"
+	Variant string `attr:"variant"`
+	// An optional value for the menu item. This is useful for determining which item was selected when listening to the
+	Value string `attr:"value"`
+	// Set to checkbox to make the item a checkbox.
+	// Valid values: "normal", "checkbox"
+	Type string `attr:"type"`
+	// Set to true to check the dropdown item. Only valid when type is checkbox.
+	Checked bool `attr:"checked"`
+	// Disables the dropdown item.
+	Disabled bool `attr:"disabled"`
+	// Whether the submenu is currently open.
+	SubmenuOpen bool `attr:"submenuOpen"`
+
+	// Events
+	// Emitted when the dropdown item loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the dropdown item gains focus.
+	OnFocus string `attr:"x-on:focus"`
+
+	// Slots contains named slot content
+	Slots DropdownItemSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DropdownItemSlots holds named slot content for the component
+type DropdownItemSlots struct {
+	// An optional icon to display before the label.
+	Icon templ.Component
+	// Additional content or details to display after the label.
+	Details templ.Component
+	// Submenu items, typically <wa-dropdown-item> elements, to create a nested menu.
+	Submenu templ.Component
+}
+
+// DropdownItemBuilder provides a fluent API for constructing DropdownItemProps
+type DropdownItemBuilder struct {
+	props DropdownItemProps
+}
+
+// NewDropdownItem creates a new builder for wa-dropdown-item
+func NewDropdownItem() *DropdownItemBuilder {
+	return &DropdownItemBuilder{}
+}
+
+// Variant sets the variant attribute
+// The type of menu item to render.
+func (b *DropdownItemBuilder) Variant(v string) *DropdownItemBuilder {
+	b.props.Variant = v
+	return b
+}
+
+// Value sets the value attribute
+// An optional value for the menu item. This is useful for determining which item was selected when listening to the
+func (b *DropdownItemBuilder) Value(v string) *DropdownItemBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Type sets the type attribute
+// Set to checkbox to make the item a checkbox.
+func (b *DropdownItemBuilder) Type(v string) *DropdownItemBuilder {
+	b.props.Type = v
+	return b
+}
+
+// Checked sets the checked attribute
+// Set to true to check the dropdown item. Only valid when type is checkbox.
+func (b *DropdownItemBuilder) Checked(v bool) *DropdownItemBuilder {
+	b.props.Checked = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the dropdown item.
+func (b *DropdownItemBuilder) Disabled(v bool) *DropdownItemBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// SubmenuOpen sets the submenuOpen attribute
+// Whether the submenu is currently open.
+func (b *DropdownItemBuilder) SubmenuOpen(v bool) *DropdownItemBuilder {
+	b.props.SubmenuOpen = v
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the dropdown item loses focus.
+func (b *DropdownItemBuilder) OnBlur(handler string) *DropdownItemBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the dropdown item gains focus.
+func (b *DropdownItemBuilder) OnFocus(handler string) *DropdownItemBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// IconSlot sets the icon slot content
+// An optional icon to display before the label.
+func (b *DropdownItemBuilder) IconSlot(c templ.Component) *DropdownItemBuilder {
+	b.props.Slots.Icon = c
+	return b
+}
+
+// DetailsSlot sets the details slot content
+// Additional content or details to display after the label.
+func (b *DropdownItemBuilder) DetailsSlot(c templ.Component) *DropdownItemBuilder {
+	b.props.Slots.Details = c
+	return b
+}
+
+// SubmenuSlot sets the submenu slot content
+// Submenu items, typically <wa-dropdown-item> elements, to create a nested menu.
+func (b *DropdownItemBuilder) SubmenuSlot(c templ.Component) *DropdownItemBuilder {
+	b.props.Slots.Submenu = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DropdownItemBuilder) Attr(name, value string) *DropdownItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DropdownItemBuilder) Attrs(attrs templ.Attributes) *DropdownItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DropdownItemBuilder) Props() DropdownItemProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DropdownItemBuilder) Build() DropdownItemProps {
+	return b.props
+}
+
+// DropdownItem renders the wa-dropdown-item component
+templ DropdownItem(props DropdownItemProps) {
+	<wa-dropdown-item
+		if props.Variant != "" {
+			variant={ props.Variant }
+		}
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.Type != "" {
+			type={ props.Type }
+		}
+		if props.Checked {
+			checked
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.SubmenuOpen {
+			submenuOpen
+		}
+		if props.OnBlur != "" {
+			x-on:blur={ props.OnBlur }
+		}
+		if props.OnFocus != "" {
+			x-on:focus={ props.OnFocus }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Icon != nil {
+			<div slot="icon">
+				@props.Slots.Icon
+			</div>
+		}
+		if props.Slots.Details != nil {
+			<div slot="details">
+				@props.Slots.Details
+			</div>
+		}
+		if props.Slots.Submenu != nil {
+			<div slot="submenu">
+				@props.Slots.Submenu
+			</div>
+		}
+		{ children... }
+	</wa-dropdown-item>
+}
+
+// DropdownItemFunc renders with a builder function for inline configuration
+templ DropdownItemFunc(fn func(*DropdownItemBuilder)) {
+	{{ b := NewDropdownItem(); fn(b) }}
+	@DropdownItem(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/dropdown-item_templ.go

@@ -0,0 +1,431 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-dropdown-item
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Represents an individual item within a dropdown menu, supporting standard items, checkboxes, and submenus.
+//
+// Web Awesome component: <wa-dropdown-item>
+
+// DropdownItemProps holds all properties for the wa-dropdown-item component
+type DropdownItemProps struct {
+	// The type of menu item to render.
+	// Valid values: "danger", "default"
+	Variant string `attr:"variant"`
+	// An optional value for the menu item. This is useful for determining which item was selected when listening to the
+	Value string `attr:"value"`
+	// Set to checkbox to make the item a checkbox.
+	// Valid values: "normal", "checkbox"
+	Type string `attr:"type"`
+	// Set to true to check the dropdown item. Only valid when type is checkbox.
+	Checked bool `attr:"checked"`
+	// Disables the dropdown item.
+	Disabled bool `attr:"disabled"`
+	// Whether the submenu is currently open.
+	SubmenuOpen bool `attr:"submenuOpen"`
+
+	// Events
+	// Emitted when the dropdown item loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the dropdown item gains focus.
+	OnFocus string `attr:"x-on:focus"`
+
+	// Slots contains named slot content
+	Slots DropdownItemSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DropdownItemSlots holds named slot content for the component
+type DropdownItemSlots struct {
+	// An optional icon to display before the label.
+	Icon templ.Component
+	// Additional content or details to display after the label.
+	Details templ.Component
+	// Submenu items, typically <wa-dropdown-item> elements, to create a nested menu.
+	Submenu templ.Component
+}
+
+// DropdownItemBuilder provides a fluent API for constructing DropdownItemProps
+type DropdownItemBuilder struct {
+	props DropdownItemProps
+}
+
+// NewDropdownItem creates a new builder for wa-dropdown-item
+func NewDropdownItem() *DropdownItemBuilder {
+	return &DropdownItemBuilder{}
+}
+
+// Variant sets the variant attribute
+// The type of menu item to render.
+func (b *DropdownItemBuilder) Variant(v string) *DropdownItemBuilder {
+	b.props.Variant = v
+	return b
+}
+
+// Value sets the value attribute
+// An optional value for the menu item. This is useful for determining which item was selected when listening to the
+func (b *DropdownItemBuilder) Value(v string) *DropdownItemBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Type sets the type attribute
+// Set to checkbox to make the item a checkbox.
+func (b *DropdownItemBuilder) Type(v string) *DropdownItemBuilder {
+	b.props.Type = v
+	return b
+}
+
+// Checked sets the checked attribute
+// Set to true to check the dropdown item. Only valid when type is checkbox.
+func (b *DropdownItemBuilder) Checked(v bool) *DropdownItemBuilder {
+	b.props.Checked = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the dropdown item.
+func (b *DropdownItemBuilder) Disabled(v bool) *DropdownItemBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// SubmenuOpen sets the submenuOpen attribute
+// Whether the submenu is currently open.
+func (b *DropdownItemBuilder) SubmenuOpen(v bool) *DropdownItemBuilder {
+	b.props.SubmenuOpen = v
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the dropdown item loses focus.
+func (b *DropdownItemBuilder) OnBlur(handler string) *DropdownItemBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the dropdown item gains focus.
+func (b *DropdownItemBuilder) OnFocus(handler string) *DropdownItemBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// IconSlot sets the icon slot content
+// An optional icon to display before the label.
+func (b *DropdownItemBuilder) IconSlot(c templ.Component) *DropdownItemBuilder {
+	b.props.Slots.Icon = c
+	return b
+}
+
+// DetailsSlot sets the details slot content
+// Additional content or details to display after the label.
+func (b *DropdownItemBuilder) DetailsSlot(c templ.Component) *DropdownItemBuilder {
+	b.props.Slots.Details = c
+	return b
+}
+
+// SubmenuSlot sets the submenu slot content
+// Submenu items, typically <wa-dropdown-item> elements, to create a nested menu.
+func (b *DropdownItemBuilder) SubmenuSlot(c templ.Component) *DropdownItemBuilder {
+	b.props.Slots.Submenu = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DropdownItemBuilder) Attr(name, value string) *DropdownItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DropdownItemBuilder) Attrs(attrs templ.Attributes) *DropdownItemBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DropdownItemBuilder) Props() DropdownItemProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DropdownItemBuilder) Build() DropdownItemProps {
+	return b.props
+}
+
+// DropdownItem renders the wa-dropdown-item component
+func DropdownItem(props DropdownItemProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-dropdown-item")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Variant != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " variant=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Variant)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown-item.templ`, Line: 175, Col: 26}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown-item.templ`, Line: 178, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Type != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " type=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Type)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown-item.templ`, Line: 181, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Checked {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " checked")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.SubmenuOpen {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " submenuOpen")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnBlur != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " x-on:blur=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnBlur)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown-item.templ`, Line: 193, Col: 27}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnFocus != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " x-on:focus=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnFocus)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown-item.templ`, Line: 196, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Icon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "<div slot=\"icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Icon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Details != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "<div slot=\"details\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Details.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Submenu != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "<div slot=\"submenu\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Submenu.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "</wa-dropdown-item>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// DropdownItemFunc renders with a builder function for inline configuration
+func DropdownItemFunc(fn func(*DropdownItemBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var7 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var7 == nil {
+			templ_7745c5c3_Var7 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewDropdownItem()
+		fn(b)
+		templ_7745c5c3_Var8 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var7.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = DropdownItem(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var8), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/dropdown.templ

@@ -0,0 +1,221 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-dropdown
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Dropdowns display a list of options that can be triggered by a button or other element. They support
+//
+// Web Awesome component: <wa-dropdown>
+
+// DropdownProps holds all properties for the wa-dropdown component
+type DropdownProps struct {
+	// Opens or closes the dropdown.
+	Open bool `attr:"open"`
+	// The dropdown's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// The placement of the dropdown menu in reference to the trigger. The menu will shift to a more optimal location if
+	// Valid values: "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "right", "right-start", "right-end", "left", "left-start", "left-end"
+	Placement string `attr:"placement"`
+	// The distance of the dropdown menu from its trigger.
+	Distance float64 `attr:"distance"`
+	// The offset of the dropdown menu along its trigger.
+	Skidding float64 `attr:"skidding"`
+
+	// Events
+	// Emitted when the dropdown is about to show.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the dropdown has been shown.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the dropdown is about to hide.
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the dropdown has been hidden.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+	// Emitted when an item in the dropdown is selected.
+	OnSelect string `attr:"x-on:wa-select"`
+
+	// Slots contains named slot content
+	Slots DropdownSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DropdownSlots holds named slot content for the component
+type DropdownSlots struct {
+	// The element that triggers the dropdown, such as a <wa-button> or <button>.
+	Trigger templ.Component
+}
+
+// DropdownBuilder provides a fluent API for constructing DropdownProps
+type DropdownBuilder struct {
+	props DropdownProps
+}
+
+// NewDropdown creates a new builder for wa-dropdown
+func NewDropdown() *DropdownBuilder {
+	return &DropdownBuilder{}
+}
+
+// Open sets the open attribute
+// Opens or closes the dropdown.
+func (b *DropdownBuilder) Open(v bool) *DropdownBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Size sets the size attribute
+// The dropdown's size.
+func (b *DropdownBuilder) Size(v string) *DropdownBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Placement sets the placement attribute
+// The placement of the dropdown menu in reference to the trigger. The menu will shift to a more optimal location if
+func (b *DropdownBuilder) Placement(v string) *DropdownBuilder {
+	b.props.Placement = v
+	return b
+}
+
+// Distance sets the distance attribute
+// The distance of the dropdown menu from its trigger.
+func (b *DropdownBuilder) Distance(v float64) *DropdownBuilder {
+	b.props.Distance = v
+	return b
+}
+
+// Skidding sets the skidding attribute
+// The offset of the dropdown menu along its trigger.
+func (b *DropdownBuilder) Skidding(v float64) *DropdownBuilder {
+	b.props.Skidding = v
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the dropdown is about to show.
+func (b *DropdownBuilder) OnShow(handler string) *DropdownBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the dropdown has been shown.
+func (b *DropdownBuilder) OnAfterShow(handler string) *DropdownBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the dropdown is about to hide.
+func (b *DropdownBuilder) OnHide(handler string) *DropdownBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the dropdown has been hidden.
+func (b *DropdownBuilder) OnAfterHide(handler string) *DropdownBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// OnSelect sets the handler for wa-select event
+// Emitted when an item in the dropdown is selected.
+func (b *DropdownBuilder) OnSelect(handler string) *DropdownBuilder {
+	b.props.OnSelect = handler
+	return b
+}
+
+// TriggerSlot sets the trigger slot content
+// The element that triggers the dropdown, such as a <wa-button> or <button>.
+func (b *DropdownBuilder) TriggerSlot(c templ.Component) *DropdownBuilder {
+	b.props.Slots.Trigger = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DropdownBuilder) Attr(name, value string) *DropdownBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DropdownBuilder) Attrs(attrs templ.Attributes) *DropdownBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DropdownBuilder) Props() DropdownProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DropdownBuilder) Build() DropdownProps {
+	return b.props
+}
+
+// Dropdown renders the wa-dropdown component
+templ Dropdown(props DropdownProps) {
+	<wa-dropdown
+		if props.Open {
+			open
+		}
+		if props.Size != "" {
+			size={ props.Size }
+		}
+		if props.Placement != "" {
+			placement={ props.Placement }
+		}
+		if props.Distance != 0 {
+			distance={ templ.Sprintf("%v", props.Distance) }
+		}
+		if props.Skidding != 0 {
+			skidding={ templ.Sprintf("%v", props.Skidding) }
+		}
+		if props.OnShow != "" {
+			x-on:wa-show={ props.OnShow }
+		}
+		if props.OnAfterShow != "" {
+			x-on:wa-after-show={ props.OnAfterShow }
+		}
+		if props.OnHide != "" {
+			x-on:wa-hide={ props.OnHide }
+		}
+		if props.OnAfterHide != "" {
+			x-on:wa-after-hide={ props.OnAfterHide }
+		}
+		if props.OnSelect != "" {
+			x-on:wa-select={ props.OnSelect }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Trigger != nil {
+			<div slot="trigger">
+				@props.Slots.Trigger
+			</div>
+		}
+		{ children... }
+	</wa-dropdown>
+}
+
+// DropdownFunc renders with a builder function for inline configuration
+templ DropdownFunc(fn func(*DropdownBuilder)) {
+	{{ b := NewDropdown(); fn(b) }}
+	@Dropdown(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/dropdown_templ.go

@@ -0,0 +1,467 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-dropdown
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Dropdowns display a list of options that can be triggered by a button or other element. They support
+//
+// Web Awesome component: <wa-dropdown>
+
+// DropdownProps holds all properties for the wa-dropdown component
+type DropdownProps struct {
+	// Opens or closes the dropdown.
+	Open bool `attr:"open"`
+	// The dropdown's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// The placement of the dropdown menu in reference to the trigger. The menu will shift to a more optimal location if
+	// Valid values: "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "right", "right-start", "right-end", "left", "left-start", "left-end"
+	Placement string `attr:"placement"`
+	// The distance of the dropdown menu from its trigger.
+	Distance float64 `attr:"distance"`
+	// The offset of the dropdown menu along its trigger.
+	Skidding float64 `attr:"skidding"`
+
+	// Events
+	// Emitted when the dropdown is about to show.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the dropdown has been shown.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the dropdown is about to hide.
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the dropdown has been hidden.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+	// Emitted when an item in the dropdown is selected.
+	OnSelect string `attr:"x-on:wa-select"`
+
+	// Slots contains named slot content
+	Slots DropdownSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// DropdownSlots holds named slot content for the component
+type DropdownSlots struct {
+	// The element that triggers the dropdown, such as a <wa-button> or <button>.
+	Trigger templ.Component
+}
+
+// DropdownBuilder provides a fluent API for constructing DropdownProps
+type DropdownBuilder struct {
+	props DropdownProps
+}
+
+// NewDropdown creates a new builder for wa-dropdown
+func NewDropdown() *DropdownBuilder {
+	return &DropdownBuilder{}
+}
+
+// Open sets the open attribute
+// Opens or closes the dropdown.
+func (b *DropdownBuilder) Open(v bool) *DropdownBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Size sets the size attribute
+// The dropdown's size.
+func (b *DropdownBuilder) Size(v string) *DropdownBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Placement sets the placement attribute
+// The placement of the dropdown menu in reference to the trigger. The menu will shift to a more optimal location if
+func (b *DropdownBuilder) Placement(v string) *DropdownBuilder {
+	b.props.Placement = v
+	return b
+}
+
+// Distance sets the distance attribute
+// The distance of the dropdown menu from its trigger.
+func (b *DropdownBuilder) Distance(v float64) *DropdownBuilder {
+	b.props.Distance = v
+	return b
+}
+
+// Skidding sets the skidding attribute
+// The offset of the dropdown menu along its trigger.
+func (b *DropdownBuilder) Skidding(v float64) *DropdownBuilder {
+	b.props.Skidding = v
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the dropdown is about to show.
+func (b *DropdownBuilder) OnShow(handler string) *DropdownBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the dropdown has been shown.
+func (b *DropdownBuilder) OnAfterShow(handler string) *DropdownBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the dropdown is about to hide.
+func (b *DropdownBuilder) OnHide(handler string) *DropdownBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the dropdown has been hidden.
+func (b *DropdownBuilder) OnAfterHide(handler string) *DropdownBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// OnSelect sets the handler for wa-select event
+// Emitted when an item in the dropdown is selected.
+func (b *DropdownBuilder) OnSelect(handler string) *DropdownBuilder {
+	b.props.OnSelect = handler
+	return b
+}
+
+// TriggerSlot sets the trigger slot content
+// The element that triggers the dropdown, such as a <wa-button> or <button>.
+func (b *DropdownBuilder) TriggerSlot(c templ.Component) *DropdownBuilder {
+	b.props.Slots.Trigger = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *DropdownBuilder) Attr(name, value string) *DropdownBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *DropdownBuilder) Attrs(attrs templ.Attributes) *DropdownBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *DropdownBuilder) Props() DropdownProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *DropdownBuilder) Build() DropdownProps {
+	return b.props
+}
+
+// Dropdown renders the wa-dropdown component
+func Dropdown(props DropdownProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-dropdown")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Open {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " open")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Size != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, " size=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Size)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown.templ`, Line: 178, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Placement != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " placement=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Placement)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown.templ`, Line: 181, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Distance != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " distance=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Distance))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown.templ`, Line: 184, Col: 49}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Skidding != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " skidding=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Skidding))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown.templ`, Line: 187, Col: 49}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " x-on:wa-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown.templ`, Line: 190, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " x-on:wa-after-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown.templ`, Line: 193, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, " x-on:wa-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown.templ`, Line: 196, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, " x-on:wa-after-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown.templ`, Line: 199, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnSelect != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, " x-on:wa-select=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnSelect)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/dropdown.templ`, Line: 202, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Trigger != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "<div slot=\"trigger\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Trigger.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "</wa-dropdown>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// DropdownFunc renders with a builder function for inline configuration
+func DropdownFunc(fn func(*DropdownBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var11 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var11 == nil {
+			templ_7745c5c3_Var11 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewDropdown()
+		fn(b)
+		templ_7745c5c3_Var12 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var11.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Dropdown(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var12), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/events.go

@@ -0,0 +1,128 @@
+// Code generated by wa-generator. DO NOT EDIT.
+
+package wa
+
+// Event names for Web Awesome components
+// Use with Alpine.js x-on: directive or vanilla JS addEventListener
+const (
+	// blur - Emitted when the button loses focus.
+	EventBlur = "blur"
+	// change - Emitted when the checked state changes.
+	EventChange = "change"
+	// error - Emitted from the internal iframe when it fails to load.
+	EventError = "error"
+	// focus - Emitted when the button gains focus.
+	EventFocus = "focus"
+	// input - Emitted when the checkbox receives input.
+	EventInput = "input"
+	// load - Emitted when the internal iframe when it finishes loading.
+	EventLoad = "load"
+	// wa-after-collapse - Emitted after the tree item collapses and all animations are complete.
+	EventWaAfterCollapse = "wa-after-collapse"
+	// wa-after-expand - Emitted after the tree item expands and all animations are complete.
+	EventWaAfterExpand = "wa-after-expand"
+	// wa-after-hide - 
+	EventWaAfterHide = "wa-after-hide"
+	// wa-after-show - 
+	EventWaAfterShow = "wa-after-show"
+	// wa-cancel - Emitted when the animation is canceled.
+	EventWaCancel = "wa-cancel"
+	// wa-clear - Emitted when the control's value is cleared.
+	EventWaClear = "wa-clear"
+	// wa-collapse - Emitted when the tree item collapses.
+	EventWaCollapse = "wa-collapse"
+	// wa-copy - Emitted when the data has been copied.
+	EventWaCopy = "wa-copy"
+	// wa-error - Emitted when the image fails to load.
+	EventWaError = "wa-error"
+	// wa-expand - Emitted when the tree item expands.
+	EventWaExpand = "wa-expand"
+	// wa-finish - Emitted when the animation finishes.
+	EventWaFinish = "wa-finish"
+	// wa-hide - 
+	EventWaHide = "wa-hide"
+	// wa-hover - Emitted when the user hovers over a value. The phase property indicates when hovering starts, moves to a new value, o...
+	EventWaHover = "wa-hover"
+	// wa-include-error - Emitted when the included file fails to load due to an error.
+	EventWaIncludeError = "wa-include-error"
+	// wa-intersect - Fired when a tracked element begins or ceases intersecting.
+	EventWaIntersect = "wa-intersect"
+	// wa-invalid - Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	EventWaInvalid = "wa-invalid"
+	// wa-lazy-change - Emitted when the tree item's lazy state changes.
+	EventWaLazyChange = "wa-lazy-change"
+	// wa-lazy-load - Emitted when a lazy item is selected. Use this event to asynchronously load data and append items to the tree before ...
+	EventWaLazyLoad = "wa-lazy-load"
+	// wa-load - Emitted when the image loads successfully.
+	EventWaLoad = "wa-load"
+	// wa-mutation - Emitted when a mutation occurs.
+	EventWaMutation = "wa-mutation"
+	// wa-remove - Emitted when the remove button is activated.
+	EventWaRemove = "wa-remove"
+	// wa-reposition - Emitted when the popup is repositioned. This event can fire a lot, so avoid putting expensive operations in your list...
+	EventWaReposition = "wa-reposition"
+	// wa-resize - Emitted when the element is resized.
+	EventWaResize = "wa-resize"
+	// wa-select - Emitted when an item in the dropdown is selected.
+	EventWaSelect = "wa-select"
+	// wa-selection-change - Emitted when a tree item is selected or deselected.
+	EventWaSelectionChange = "wa-selection-change"
+	// wa-show - 
+	EventWaShow = "wa-show"
+	// wa-slide-change - Emitted when the active slide changes.
+	EventWaSlideChange = "wa-slide-change"
+	// wa-start - Emitted when the animation starts or restarts.
+	EventWaStart = "wa-start"
+	// wa-tab-hide - Emitted when a tab is hidden.
+	EventWaTabHide = "wa-tab-hide"
+	// wa-tab-show - Emitted when a tab is shown.
+	EventWaTabShow = "wa-tab-show"
+)
+
+// EventHandler creates an Alpine.js event handler string
+func EventHandler(jsCode string) string {
+	return jsCode
+}
+
+// EventHandlerPrevent creates a handler that prevents default
+func EventHandlerPrevent(jsCode string) string {
+	return "$event.preventDefault(); " + jsCode
+}
+
+// EventHandlerStop creates a handler that stops propagation
+func EventHandlerStop(jsCode string) string {
+	return "$event.stopPropagation(); " + jsCode
+}
+
+// EventHandlerDebounce wraps handler with debounce
+func EventHandlerDebounce(jsCode string, ms int) string {
+	return fmt.Sprintf("$debounce(() => { %s }, %d)", jsCode, ms)
+}
+
+// Common event handler patterns
+
+// ToggleHandler returns a handler that toggles a boolean value
+func ToggleHandler(varName string) string {
+	return varName + " = !" + varName
+}
+
+// SetValueHandler returns a handler that sets a value
+func SetValueHandler(varName, value string) string {
+	return fmt.Sprintf("%s = %s", varName, value)
+}
+
+// DispatchHandler returns a handler that dispatches a custom event
+func DispatchHandler(eventName string, detail string) string {
+	if detail != "" {
+		return fmt.Sprintf("$dispatch('%s', %s)", eventName, detail)
+	}
+	return fmt.Sprintf("$dispatch('%s')", eventName)
+}
+
+// FetchHandler returns a handler that performs a fetch request
+func FetchHandler(url, method, body string) string {
+	if body != "" {
+		return fmt.Sprintf("fetch('%s', {method: '%s', body: JSON.stringify(%s), headers: {'Content-Type': 'application/json'}})", url, method, body)
+	}
+	return fmt.Sprintf("fetch('%s', {method: '%s'})", url, method)
+}

pkg/wa/format-bytes.templ

@@ -0,0 +1,119 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-format-bytes
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Formats a number as a human readable bytes value.
+//
+// Web Awesome component: <wa-format-bytes>
+
+// FormatBytesProps holds all properties for the wa-format-bytes component
+type FormatBytesProps struct {
+	// The number to format in bytes.
+	Value float64 `attr:"value"`
+	// The type of unit to display.
+	// Valid values: "byte", "bit"
+	Unit string `attr:"unit"`
+	// Determines how to display the result, e.g. "100 bytes", "100 b", or "100b".
+	// Valid values: "long", "short", "narrow"
+	Display string `attr:"display"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots FormatBytesSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// FormatBytesBuilder provides a fluent API for constructing FormatBytesProps
+type FormatBytesBuilder struct {
+	props FormatBytesProps
+}
+
+// NewFormatBytes creates a new builder for wa-format-bytes
+func NewFormatBytes() *FormatBytesBuilder {
+	return &FormatBytesBuilder{}
+}
+
+// Value sets the value attribute
+// The number to format in bytes.
+func (b *FormatBytesBuilder) Value(v float64) *FormatBytesBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Unit sets the unit attribute
+// The type of unit to display.
+func (b *FormatBytesBuilder) Unit(v string) *FormatBytesBuilder {
+	b.props.Unit = v
+	return b
+}
+
+// Display sets the display attribute
+// Determines how to display the result, e.g. "100 bytes", "100 b", or "100b".
+func (b *FormatBytesBuilder) Display(v string) *FormatBytesBuilder {
+	b.props.Display = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *FormatBytesBuilder) Attr(name, value string) *FormatBytesBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *FormatBytesBuilder) Attrs(attrs templ.Attributes) *FormatBytesBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *FormatBytesBuilder) Props() FormatBytesProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *FormatBytesBuilder) Build() FormatBytesProps {
+	return b.props
+}
+
+// FormatBytes renders the wa-format-bytes component
+templ FormatBytes(props FormatBytesProps) {
+	<wa-format-bytes
+		if props.Value != 0 {
+			value={ templ.Sprintf("%v", props.Value) }
+		}
+		if props.Unit != "" {
+			unit={ props.Unit }
+		}
+		if props.Display != "" {
+			display={ props.Display }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-format-bytes>
+}
+
+// FormatBytesFunc renders with a builder function for inline configuration
+templ FormatBytesFunc(fn func(*FormatBytesBuilder)) {
+	{{ b := NewFormatBytes(); fn(b) }}
+	@FormatBytes(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/format-bytes_templ.go

@@ -0,0 +1,257 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-format-bytes
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Formats a number as a human readable bytes value.
+//
+// Web Awesome component: <wa-format-bytes>
+
+// FormatBytesProps holds all properties for the wa-format-bytes component
+type FormatBytesProps struct {
+	// The number to format in bytes.
+	Value float64 `attr:"value"`
+	// The type of unit to display.
+	// Valid values: "byte", "bit"
+	Unit string `attr:"unit"`
+	// Determines how to display the result, e.g. "100 bytes", "100 b", or "100b".
+	// Valid values: "long", "short", "narrow"
+	Display string `attr:"display"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots FormatBytesSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// FormatBytesBuilder provides a fluent API for constructing FormatBytesProps
+type FormatBytesBuilder struct {
+	props FormatBytesProps
+}
+
+// NewFormatBytes creates a new builder for wa-format-bytes
+func NewFormatBytes() *FormatBytesBuilder {
+	return &FormatBytesBuilder{}
+}
+
+// Value sets the value attribute
+// The number to format in bytes.
+func (b *FormatBytesBuilder) Value(v float64) *FormatBytesBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Unit sets the unit attribute
+// The type of unit to display.
+func (b *FormatBytesBuilder) Unit(v string) *FormatBytesBuilder {
+	b.props.Unit = v
+	return b
+}
+
+// Display sets the display attribute
+// Determines how to display the result, e.g. "100 bytes", "100 b", or "100b".
+func (b *FormatBytesBuilder) Display(v string) *FormatBytesBuilder {
+	b.props.Display = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *FormatBytesBuilder) Attr(name, value string) *FormatBytesBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *FormatBytesBuilder) Attrs(attrs templ.Attributes) *FormatBytesBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *FormatBytesBuilder) Props() FormatBytesProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *FormatBytesBuilder) Build() FormatBytesProps {
+	return b.props
+}
+
+// FormatBytes renders the wa-format-bytes component
+func FormatBytes(props FormatBytesProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-format-bytes")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Value != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Value))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-bytes.templ`, Line: 99, Col: 43}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Unit != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " unit=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Unit)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-bytes.templ`, Line: 102, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Display != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " display=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Display)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-bytes.templ`, Line: 105, Col: 26}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "</wa-format-bytes>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// FormatBytesFunc renders with a builder function for inline configuration
+func FormatBytesFunc(fn func(*FormatBytesBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var5 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var5 == nil {
+			templ_7745c5c3_Var5 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewFormatBytes()
+		fn(b)
+		templ_7745c5c3_Var6 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var5.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = FormatBytes(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var6), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/format-date.templ

@@ -0,0 +1,235 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-format-date
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Formats a date/time using the specified locale and options.
+//
+// Web Awesome component: <wa-format-date>
+
+// FormatDateProps holds all properties for the wa-format-date component
+type FormatDateProps struct {
+	// The date/time to format. If not set, the current date and time will be used. When passing a string, it's strongly
+	Date string `attr:"date"`
+	// The format for displaying the weekday.
+	// Valid values: "narrow", "short", "long"
+	Weekday string `attr:"weekday"`
+	// The format for displaying the era.
+	// Valid values: "narrow", "short", "long"
+	Era string `attr:"era"`
+	// The format for displaying the year.
+	// Valid values: "numeric", "2-digit"
+	Year string `attr:"year"`
+	// The format for displaying the month.
+	// Valid values: "numeric", "2-digit", "narrow", "short", "long"
+	Month string `attr:"month"`
+	// The format for displaying the day.
+	// Valid values: "numeric", "2-digit"
+	Day string `attr:"day"`
+	// The format for displaying the hour.
+	// Valid values: "numeric", "2-digit"
+	Hour string `attr:"hour"`
+	// The format for displaying the minute.
+	// Valid values: "numeric", "2-digit"
+	Minute string `attr:"minute"`
+	// The format for displaying the second.
+	// Valid values: "numeric", "2-digit"
+	Second string `attr:"second"`
+	// The format for displaying the time.
+	// Valid values: "short", "long"
+	TimeZoneName string `attr:"time-zone-name"`
+	// The time zone to express the time in.
+	TimeZone string `attr:"time-zone"`
+	// The format for displaying the hour.
+	// Valid values: "auto", "12", "24"
+	HourFormat string `attr:"hour-format"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots FormatDateSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// FormatDateBuilder provides a fluent API for constructing FormatDateProps
+type FormatDateBuilder struct {
+	props FormatDateProps
+}
+
+// NewFormatDate creates a new builder for wa-format-date
+func NewFormatDate() *FormatDateBuilder {
+	return &FormatDateBuilder{}
+}
+
+// Date sets the date attribute
+// The date/time to format. If not set, the current date and time will be used. When passing a string, it's strongly
+func (b *FormatDateBuilder) Date(v string) *FormatDateBuilder {
+	b.props.Date = v
+	return b
+}
+
+// Weekday sets the weekday attribute
+// The format for displaying the weekday.
+func (b *FormatDateBuilder) Weekday(v string) *FormatDateBuilder {
+	b.props.Weekday = v
+	return b
+}
+
+// Era sets the era attribute
+// The format for displaying the era.
+func (b *FormatDateBuilder) Era(v string) *FormatDateBuilder {
+	b.props.Era = v
+	return b
+}
+
+// Year sets the year attribute
+// The format for displaying the year.
+func (b *FormatDateBuilder) Year(v string) *FormatDateBuilder {
+	b.props.Year = v
+	return b
+}
+
+// Month sets the month attribute
+// The format for displaying the month.
+func (b *FormatDateBuilder) Month(v string) *FormatDateBuilder {
+	b.props.Month = v
+	return b
+}
+
+// Day sets the day attribute
+// The format for displaying the day.
+func (b *FormatDateBuilder) Day(v string) *FormatDateBuilder {
+	b.props.Day = v
+	return b
+}
+
+// Hour sets the hour attribute
+// The format for displaying the hour.
+func (b *FormatDateBuilder) Hour(v string) *FormatDateBuilder {
+	b.props.Hour = v
+	return b
+}
+
+// Minute sets the minute attribute
+// The format for displaying the minute.
+func (b *FormatDateBuilder) Minute(v string) *FormatDateBuilder {
+	b.props.Minute = v
+	return b
+}
+
+// Second sets the second attribute
+// The format for displaying the second.
+func (b *FormatDateBuilder) Second(v string) *FormatDateBuilder {
+	b.props.Second = v
+	return b
+}
+
+// TimeZoneName sets the time-zone-name attribute
+// The format for displaying the time.
+func (b *FormatDateBuilder) TimeZoneName(v string) *FormatDateBuilder {
+	b.props.TimeZoneName = v
+	return b
+}
+
+// TimeZone sets the time-zone attribute
+// The time zone to express the time in.
+func (b *FormatDateBuilder) TimeZone(v string) *FormatDateBuilder {
+	b.props.TimeZone = v
+	return b
+}
+
+// HourFormat sets the hour-format attribute
+// The format for displaying the hour.
+func (b *FormatDateBuilder) HourFormat(v string) *FormatDateBuilder {
+	b.props.HourFormat = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *FormatDateBuilder) Attr(name, value string) *FormatDateBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *FormatDateBuilder) Attrs(attrs templ.Attributes) *FormatDateBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *FormatDateBuilder) Props() FormatDateProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *FormatDateBuilder) Build() FormatDateProps {
+	return b.props
+}
+
+// FormatDate renders the wa-format-date component
+templ FormatDate(props FormatDateProps) {
+	<wa-format-date
+		if props.Date != "" {
+			date={ props.Date }
+		}
+		if props.Weekday != "" {
+			weekday={ props.Weekday }
+		}
+		if props.Era != "" {
+			era={ props.Era }
+		}
+		if props.Year != "" {
+			year={ props.Year }
+		}
+		if props.Month != "" {
+			month={ props.Month }
+		}
+		if props.Day != "" {
+			day={ props.Day }
+		}
+		if props.Hour != "" {
+			hour={ props.Hour }
+		}
+		if props.Minute != "" {
+			minute={ props.Minute }
+		}
+		if props.Second != "" {
+			second={ props.Second }
+		}
+		if props.TimeZoneName != "" {
+			time-zone-name={ props.TimeZoneName }
+		}
+		if props.TimeZone != "" {
+			time-zone={ props.TimeZone }
+		}
+		if props.HourFormat != "" {
+			hour-format={ props.HourFormat }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-format-date>
+}
+
+// FormatDateFunc renders with a builder function for inline configuration
+templ FormatDateFunc(fn func(*FormatDateBuilder)) {
+	{{ b := NewFormatDate(); fn(b) }}
+	@FormatDate(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/format-date_templ.go

@@ -0,0 +1,517 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-format-date
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Formats a date/time using the specified locale and options.
+//
+// Web Awesome component: <wa-format-date>
+
+// FormatDateProps holds all properties for the wa-format-date component
+type FormatDateProps struct {
+	// The date/time to format. If not set, the current date and time will be used. When passing a string, it's strongly
+	Date string `attr:"date"`
+	// The format for displaying the weekday.
+	// Valid values: "narrow", "short", "long"
+	Weekday string `attr:"weekday"`
+	// The format for displaying the era.
+	// Valid values: "narrow", "short", "long"
+	Era string `attr:"era"`
+	// The format for displaying the year.
+	// Valid values: "numeric", "2-digit"
+	Year string `attr:"year"`
+	// The format for displaying the month.
+	// Valid values: "numeric", "2-digit", "narrow", "short", "long"
+	Month string `attr:"month"`
+	// The format for displaying the day.
+	// Valid values: "numeric", "2-digit"
+	Day string `attr:"day"`
+	// The format for displaying the hour.
+	// Valid values: "numeric", "2-digit"
+	Hour string `attr:"hour"`
+	// The format for displaying the minute.
+	// Valid values: "numeric", "2-digit"
+	Minute string `attr:"minute"`
+	// The format for displaying the second.
+	// Valid values: "numeric", "2-digit"
+	Second string `attr:"second"`
+	// The format for displaying the time.
+	// Valid values: "short", "long"
+	TimeZoneName string `attr:"time-zone-name"`
+	// The time zone to express the time in.
+	TimeZone string `attr:"time-zone"`
+	// The format for displaying the hour.
+	// Valid values: "auto", "12", "24"
+	HourFormat string `attr:"hour-format"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots FormatDateSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// FormatDateBuilder provides a fluent API for constructing FormatDateProps
+type FormatDateBuilder struct {
+	props FormatDateProps
+}
+
+// NewFormatDate creates a new builder for wa-format-date
+func NewFormatDate() *FormatDateBuilder {
+	return &FormatDateBuilder{}
+}
+
+// Date sets the date attribute
+// The date/time to format. If not set, the current date and time will be used. When passing a string, it's strongly
+func (b *FormatDateBuilder) Date(v string) *FormatDateBuilder {
+	b.props.Date = v
+	return b
+}
+
+// Weekday sets the weekday attribute
+// The format for displaying the weekday.
+func (b *FormatDateBuilder) Weekday(v string) *FormatDateBuilder {
+	b.props.Weekday = v
+	return b
+}
+
+// Era sets the era attribute
+// The format for displaying the era.
+func (b *FormatDateBuilder) Era(v string) *FormatDateBuilder {
+	b.props.Era = v
+	return b
+}
+
+// Year sets the year attribute
+// The format for displaying the year.
+func (b *FormatDateBuilder) Year(v string) *FormatDateBuilder {
+	b.props.Year = v
+	return b
+}
+
+// Month sets the month attribute
+// The format for displaying the month.
+func (b *FormatDateBuilder) Month(v string) *FormatDateBuilder {
+	b.props.Month = v
+	return b
+}
+
+// Day sets the day attribute
+// The format for displaying the day.
+func (b *FormatDateBuilder) Day(v string) *FormatDateBuilder {
+	b.props.Day = v
+	return b
+}
+
+// Hour sets the hour attribute
+// The format for displaying the hour.
+func (b *FormatDateBuilder) Hour(v string) *FormatDateBuilder {
+	b.props.Hour = v
+	return b
+}
+
+// Minute sets the minute attribute
+// The format for displaying the minute.
+func (b *FormatDateBuilder) Minute(v string) *FormatDateBuilder {
+	b.props.Minute = v
+	return b
+}
+
+// Second sets the second attribute
+// The format for displaying the second.
+func (b *FormatDateBuilder) Second(v string) *FormatDateBuilder {
+	b.props.Second = v
+	return b
+}
+
+// TimeZoneName sets the time-zone-name attribute
+// The format for displaying the time.
+func (b *FormatDateBuilder) TimeZoneName(v string) *FormatDateBuilder {
+	b.props.TimeZoneName = v
+	return b
+}
+
+// TimeZone sets the time-zone attribute
+// The time zone to express the time in.
+func (b *FormatDateBuilder) TimeZone(v string) *FormatDateBuilder {
+	b.props.TimeZone = v
+	return b
+}
+
+// HourFormat sets the hour-format attribute
+// The format for displaying the hour.
+func (b *FormatDateBuilder) HourFormat(v string) *FormatDateBuilder {
+	b.props.HourFormat = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *FormatDateBuilder) Attr(name, value string) *FormatDateBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *FormatDateBuilder) Attrs(attrs templ.Attributes) *FormatDateBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *FormatDateBuilder) Props() FormatDateProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *FormatDateBuilder) Build() FormatDateProps {
+	return b.props
+}
+
+// FormatDate renders the wa-format-date component
+func FormatDate(props FormatDateProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-format-date")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Date != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " date=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Date)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 188, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Weekday != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " weekday=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Weekday)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 191, Col: 26}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Era != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " era=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Era)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 194, Col: 18}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Year != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " year=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.Year)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 197, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Month != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " month=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.Month)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 200, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Day != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " day=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.Day)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 203, Col: 18}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Hour != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " hour=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.Hour)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 206, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Minute != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " minute=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.Minute)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 209, Col: 24}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Second != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, " second=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(props.Second)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 212, Col: 24}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.TimeZoneName != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, " time-zone-name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var11 string
+			templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(props.TimeZoneName)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 215, Col: 38}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.TimeZone != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, " time-zone=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var12 string
+			templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(props.TimeZone)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 218, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.HourFormat != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, " hour-format=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var13 string
+			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(props.HourFormat)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-date.templ`, Line: 221, Col: 33}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "</wa-format-date>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// FormatDateFunc renders with a builder function for inline configuration
+func FormatDateFunc(fn func(*FormatDateBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var14 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var14 == nil {
+			templ_7745c5c3_Var14 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewFormatDate()
+		fn(b)
+		templ_7745c5c3_Var15 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var14.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = FormatDate(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var15), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/format-number.templ

@@ -0,0 +1,203 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-format-number
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Formats a number using the specified locale and options.
+//
+// Web Awesome component: <wa-format-number>
+
+// FormatNumberProps holds all properties for the wa-format-number component
+type FormatNumberProps struct {
+	// The number to format.
+	Value float64 `attr:"value"`
+	// The formatting style to use.
+	// Valid values: "currency", "decimal", "percent"
+	Type string `attr:"type"`
+	// Turns off grouping separators.
+	WithoutGrouping bool `attr:"without-grouping"`
+	// The ISO 4217 currency code to use when formatting.
+	Currency string `attr:"currency"`
+	// How to display the currency.
+	// Valid values: "symbol", "narrowSymbol", "code", "name"
+	CurrencyDisplay string `attr:"currency-display"`
+	// The minimum number of integer digits to use. Possible values are 1-21.
+	MinimumIntegerDigits float64 `attr:"minimum-integer-digits"`
+	// The minimum number of fraction digits to use. Possible values are 0-100.
+	MinimumFractionDigits float64 `attr:"minimum-fraction-digits"`
+	// The maximum number of fraction digits to use. Possible values are 0-100.
+	MaximumFractionDigits float64 `attr:"maximum-fraction-digits"`
+	// The minimum number of significant digits to use. Possible values are 1-21.
+	MinimumSignificantDigits float64 `attr:"minimum-significant-digits"`
+	// The maximum number of significant digits to use,. Possible values are 1-21.
+	MaximumSignificantDigits float64 `attr:"maximum-significant-digits"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots FormatNumberSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// FormatNumberBuilder provides a fluent API for constructing FormatNumberProps
+type FormatNumberBuilder struct {
+	props FormatNumberProps
+}
+
+// NewFormatNumber creates a new builder for wa-format-number
+func NewFormatNumber() *FormatNumberBuilder {
+	return &FormatNumberBuilder{}
+}
+
+// Value sets the value attribute
+// The number to format.
+func (b *FormatNumberBuilder) Value(v float64) *FormatNumberBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Type sets the type attribute
+// The formatting style to use.
+func (b *FormatNumberBuilder) Type(v string) *FormatNumberBuilder {
+	b.props.Type = v
+	return b
+}
+
+// WithoutGrouping sets the without-grouping attribute
+// Turns off grouping separators.
+func (b *FormatNumberBuilder) WithoutGrouping(v bool) *FormatNumberBuilder {
+	b.props.WithoutGrouping = v
+	return b
+}
+
+// Currency sets the currency attribute
+// The ISO 4217 currency code to use when formatting.
+func (b *FormatNumberBuilder) Currency(v string) *FormatNumberBuilder {
+	b.props.Currency = v
+	return b
+}
+
+// CurrencyDisplay sets the currency-display attribute
+// How to display the currency.
+func (b *FormatNumberBuilder) CurrencyDisplay(v string) *FormatNumberBuilder {
+	b.props.CurrencyDisplay = v
+	return b
+}
+
+// MinimumIntegerDigits sets the minimum-integer-digits attribute
+// The minimum number of integer digits to use. Possible values are 1-21.
+func (b *FormatNumberBuilder) MinimumIntegerDigits(v float64) *FormatNumberBuilder {
+	b.props.MinimumIntegerDigits = v
+	return b
+}
+
+// MinimumFractionDigits sets the minimum-fraction-digits attribute
+// The minimum number of fraction digits to use. Possible values are 0-100.
+func (b *FormatNumberBuilder) MinimumFractionDigits(v float64) *FormatNumberBuilder {
+	b.props.MinimumFractionDigits = v
+	return b
+}
+
+// MaximumFractionDigits sets the maximum-fraction-digits attribute
+// The maximum number of fraction digits to use. Possible values are 0-100.
+func (b *FormatNumberBuilder) MaximumFractionDigits(v float64) *FormatNumberBuilder {
+	b.props.MaximumFractionDigits = v
+	return b
+}
+
+// MinimumSignificantDigits sets the minimum-significant-digits attribute
+// The minimum number of significant digits to use. Possible values are 1-21.
+func (b *FormatNumberBuilder) MinimumSignificantDigits(v float64) *FormatNumberBuilder {
+	b.props.MinimumSignificantDigits = v
+	return b
+}
+
+// MaximumSignificantDigits sets the maximum-significant-digits attribute
+// The maximum number of significant digits to use,. Possible values are 1-21.
+func (b *FormatNumberBuilder) MaximumSignificantDigits(v float64) *FormatNumberBuilder {
+	b.props.MaximumSignificantDigits = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *FormatNumberBuilder) Attr(name, value string) *FormatNumberBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *FormatNumberBuilder) Attrs(attrs templ.Attributes) *FormatNumberBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *FormatNumberBuilder) Props() FormatNumberProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *FormatNumberBuilder) Build() FormatNumberProps {
+	return b.props
+}
+
+// FormatNumber renders the wa-format-number component
+templ FormatNumber(props FormatNumberProps) {
+	<wa-format-number
+		if props.Value != 0 {
+			value={ templ.Sprintf("%v", props.Value) }
+		}
+		if props.Type != "" {
+			type={ props.Type }
+		}
+		if props.WithoutGrouping {
+			without-grouping
+		}
+		if props.Currency != "" {
+			currency={ props.Currency }
+		}
+		if props.CurrencyDisplay != "" {
+			currency-display={ props.CurrencyDisplay }
+		}
+		if props.MinimumIntegerDigits != 0 {
+			minimum-integer-digits={ templ.Sprintf("%v", props.MinimumIntegerDigits) }
+		}
+		if props.MinimumFractionDigits != 0 {
+			minimum-fraction-digits={ templ.Sprintf("%v", props.MinimumFractionDigits) }
+		}
+		if props.MaximumFractionDigits != 0 {
+			maximum-fraction-digits={ templ.Sprintf("%v", props.MaximumFractionDigits) }
+		}
+		if props.MinimumSignificantDigits != 0 {
+			minimum-significant-digits={ templ.Sprintf("%v", props.MinimumSignificantDigits) }
+		}
+		if props.MaximumSignificantDigits != 0 {
+			maximum-significant-digits={ templ.Sprintf("%v", props.MaximumSignificantDigits) }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-format-number>
+}
+
+// FormatNumberFunc renders with a builder function for inline configuration
+templ FormatNumberFunc(fn func(*FormatNumberBuilder)) {
+	{{ b := NewFormatNumber(); fn(b) }}
+	@FormatNumber(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/format-number_templ.go

@@ -0,0 +1,440 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-format-number
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Formats a number using the specified locale and options.
+//
+// Web Awesome component: <wa-format-number>
+
+// FormatNumberProps holds all properties for the wa-format-number component
+type FormatNumberProps struct {
+	// The number to format.
+	Value float64 `attr:"value"`
+	// The formatting style to use.
+	// Valid values: "currency", "decimal", "percent"
+	Type string `attr:"type"`
+	// Turns off grouping separators.
+	WithoutGrouping bool `attr:"without-grouping"`
+	// The ISO 4217 currency code to use when formatting.
+	Currency string `attr:"currency"`
+	// How to display the currency.
+	// Valid values: "symbol", "narrowSymbol", "code", "name"
+	CurrencyDisplay string `attr:"currency-display"`
+	// The minimum number of integer digits to use. Possible values are 1-21.
+	MinimumIntegerDigits float64 `attr:"minimum-integer-digits"`
+	// The minimum number of fraction digits to use. Possible values are 0-100.
+	MinimumFractionDigits float64 `attr:"minimum-fraction-digits"`
+	// The maximum number of fraction digits to use. Possible values are 0-100.
+	MaximumFractionDigits float64 `attr:"maximum-fraction-digits"`
+	// The minimum number of significant digits to use. Possible values are 1-21.
+	MinimumSignificantDigits float64 `attr:"minimum-significant-digits"`
+	// The maximum number of significant digits to use,. Possible values are 1-21.
+	MaximumSignificantDigits float64 `attr:"maximum-significant-digits"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots FormatNumberSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// FormatNumberBuilder provides a fluent API for constructing FormatNumberProps
+type FormatNumberBuilder struct {
+	props FormatNumberProps
+}
+
+// NewFormatNumber creates a new builder for wa-format-number
+func NewFormatNumber() *FormatNumberBuilder {
+	return &FormatNumberBuilder{}
+}
+
+// Value sets the value attribute
+// The number to format.
+func (b *FormatNumberBuilder) Value(v float64) *FormatNumberBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Type sets the type attribute
+// The formatting style to use.
+func (b *FormatNumberBuilder) Type(v string) *FormatNumberBuilder {
+	b.props.Type = v
+	return b
+}
+
+// WithoutGrouping sets the without-grouping attribute
+// Turns off grouping separators.
+func (b *FormatNumberBuilder) WithoutGrouping(v bool) *FormatNumberBuilder {
+	b.props.WithoutGrouping = v
+	return b
+}
+
+// Currency sets the currency attribute
+// The ISO 4217 currency code to use when formatting.
+func (b *FormatNumberBuilder) Currency(v string) *FormatNumberBuilder {
+	b.props.Currency = v
+	return b
+}
+
+// CurrencyDisplay sets the currency-display attribute
+// How to display the currency.
+func (b *FormatNumberBuilder) CurrencyDisplay(v string) *FormatNumberBuilder {
+	b.props.CurrencyDisplay = v
+	return b
+}
+
+// MinimumIntegerDigits sets the minimum-integer-digits attribute
+// The minimum number of integer digits to use. Possible values are 1-21.
+func (b *FormatNumberBuilder) MinimumIntegerDigits(v float64) *FormatNumberBuilder {
+	b.props.MinimumIntegerDigits = v
+	return b
+}
+
+// MinimumFractionDigits sets the minimum-fraction-digits attribute
+// The minimum number of fraction digits to use. Possible values are 0-100.
+func (b *FormatNumberBuilder) MinimumFractionDigits(v float64) *FormatNumberBuilder {
+	b.props.MinimumFractionDigits = v
+	return b
+}
+
+// MaximumFractionDigits sets the maximum-fraction-digits attribute
+// The maximum number of fraction digits to use. Possible values are 0-100.
+func (b *FormatNumberBuilder) MaximumFractionDigits(v float64) *FormatNumberBuilder {
+	b.props.MaximumFractionDigits = v
+	return b
+}
+
+// MinimumSignificantDigits sets the minimum-significant-digits attribute
+// The minimum number of significant digits to use. Possible values are 1-21.
+func (b *FormatNumberBuilder) MinimumSignificantDigits(v float64) *FormatNumberBuilder {
+	b.props.MinimumSignificantDigits = v
+	return b
+}
+
+// MaximumSignificantDigits sets the maximum-significant-digits attribute
+// The maximum number of significant digits to use,. Possible values are 1-21.
+func (b *FormatNumberBuilder) MaximumSignificantDigits(v float64) *FormatNumberBuilder {
+	b.props.MaximumSignificantDigits = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *FormatNumberBuilder) Attr(name, value string) *FormatNumberBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *FormatNumberBuilder) Attrs(attrs templ.Attributes) *FormatNumberBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *FormatNumberBuilder) Props() FormatNumberProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *FormatNumberBuilder) Build() FormatNumberProps {
+	return b.props
+}
+
+// FormatNumber renders the wa-format-number component
+func FormatNumber(props FormatNumberProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-format-number")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Value != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Value))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-number.templ`, Line: 162, Col: 43}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Type != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " type=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Type)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-number.templ`, Line: 165, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithoutGrouping {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " without-grouping")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Currency != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " currency=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Currency)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-number.templ`, Line: 171, Col: 28}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.CurrencyDisplay != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " currency-display=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.CurrencyDisplay)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-number.templ`, Line: 174, Col: 43}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.MinimumIntegerDigits != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " minimum-integer-digits=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.MinimumIntegerDigits))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-number.templ`, Line: 177, Col: 75}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.MinimumFractionDigits != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " minimum-fraction-digits=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.MinimumFractionDigits))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-number.templ`, Line: 180, Col: 77}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.MaximumFractionDigits != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, " maximum-fraction-digits=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.MaximumFractionDigits))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-number.templ`, Line: 183, Col: 77}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.MinimumSignificantDigits != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, " minimum-significant-digits=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.MinimumSignificantDigits))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-number.templ`, Line: 186, Col: 83}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.MaximumSignificantDigits != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, " maximum-significant-digits=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.MaximumSignificantDigits))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/format-number.templ`, Line: 189, Col: 83}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "</wa-format-number>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// FormatNumberFunc renders with a builder function for inline configuration
+func FormatNumberFunc(fn func(*FormatNumberBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var11 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var11 == nil {
+			templ_7745c5c3_Var11 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewFormatNumber()
+		fn(b)
+		templ_7745c5c3_Var12 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var11.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = FormatNumber(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var12), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/icon.templ

@@ -0,0 +1,201 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-icon
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Icons are symbols that can be used to represent various options within an application.
+//
+// Web Awesome component: <wa-icon>
+
+// IconProps holds all properties for the wa-icon component
+type IconProps struct {
+	// The name of the icon to draw. Available names depend on the icon library being used.
+	Name string `attr:"name"`
+	// The family of icons to choose from. For Font Awesome Free, valid options include classic and brands. For
+	Family string `attr:"family"`
+	// The name of the icon's variant. For Font Awesome, valid options include thin, light, regular, and solid for
+	Variant string `attr:"variant"`
+	// Sets the width of the icon to match the cropped SVG viewBox. This operates like the Font fa-width-auto class.
+	AutoWidth bool `attr:"auto-width"`
+	// Swaps the opacity of duotone icons.
+	SwapOpacity bool `attr:"swap-opacity"`
+	// An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and
+	Src string `attr:"src"`
+	// An alternate description to use for assistive devices. If omitted, the icon will be considered presentational and
+	Label string `attr:"label"`
+	// The name of a registered custom icon library.
+	Library string `attr:"library"`
+
+	// Events
+	// Emitted when the icon has loaded. When using spriteSheet: true this will not emit.
+	OnLoad string `attr:"x-on:wa-load"`
+	// Emitted when the icon fails to load due to an error. When using spriteSheet: true this will not emit.
+	OnError string `attr:"x-on:wa-error"`
+
+	// Slots contains named slot content
+	Slots IconSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// IconBuilder provides a fluent API for constructing IconProps
+type IconBuilder struct {
+	props IconProps
+}
+
+// NewIcon creates a new builder for wa-icon
+func NewIcon() *IconBuilder {
+	return &IconBuilder{}
+}
+
+// Name sets the name attribute
+// The name of the icon to draw. Available names depend on the icon library being used.
+func (b *IconBuilder) Name(v string) *IconBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Family sets the family attribute
+// The family of icons to choose from. For Font Awesome Free, valid options include classic and brands. For
+func (b *IconBuilder) Family(v string) *IconBuilder {
+	b.props.Family = v
+	return b
+}
+
+// Variant sets the variant attribute
+// The name of the icon's variant. For Font Awesome, valid options include thin, light, regular, and solid for
+func (b *IconBuilder) Variant(v string) *IconBuilder {
+	b.props.Variant = v
+	return b
+}
+
+// AutoWidth sets the auto-width attribute
+// Sets the width of the icon to match the cropped SVG viewBox. This operates like the Font fa-width-auto class.
+func (b *IconBuilder) AutoWidth(v bool) *IconBuilder {
+	b.props.AutoWidth = v
+	return b
+}
+
+// SwapOpacity sets the swap-opacity attribute
+// Swaps the opacity of duotone icons.
+func (b *IconBuilder) SwapOpacity(v bool) *IconBuilder {
+	b.props.SwapOpacity = v
+	return b
+}
+
+// Src sets the src attribute
+// An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and
+func (b *IconBuilder) Src(v string) *IconBuilder {
+	b.props.Src = v
+	return b
+}
+
+// Label sets the label attribute
+// An alternate description to use for assistive devices. If omitted, the icon will be considered presentational and
+func (b *IconBuilder) Label(v string) *IconBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Library sets the library attribute
+// The name of a registered custom icon library.
+func (b *IconBuilder) Library(v string) *IconBuilder {
+	b.props.Library = v
+	return b
+}
+
+// OnLoad sets the handler for wa-load event
+// Emitted when the icon has loaded. When using spriteSheet: true this will not emit.
+func (b *IconBuilder) OnLoad(handler string) *IconBuilder {
+	b.props.OnLoad = handler
+	return b
+}
+
+// OnError sets the handler for wa-error event
+// Emitted when the icon fails to load due to an error. When using spriteSheet: true this will not emit.
+func (b *IconBuilder) OnError(handler string) *IconBuilder {
+	b.props.OnError = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *IconBuilder) Attr(name, value string) *IconBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *IconBuilder) Attrs(attrs templ.Attributes) *IconBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *IconBuilder) Props() IconProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *IconBuilder) Build() IconProps {
+	return b.props
+}
+
+// Icon renders the wa-icon component
+templ Icon(props IconProps) {
+	<wa-icon
+		if props.Name != "" {
+			name={ props.Name }
+		}
+		if props.Family != "" {
+			family={ props.Family }
+		}
+		if props.Variant != "" {
+			variant={ props.Variant }
+		}
+		if props.AutoWidth {
+			auto-width
+		}
+		if props.SwapOpacity {
+			swap-opacity
+		}
+		if props.Src != "" {
+			src={ props.Src }
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.Library != "" {
+			library={ props.Library }
+		}
+		if props.OnLoad != "" {
+			x-on:wa-load={ props.OnLoad }
+		}
+		if props.OnError != "" {
+			x-on:wa-error={ props.OnError }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-icon>
+}
+
+// IconFunc renders with a builder function for inline configuration
+templ IconFunc(fn func(*IconBuilder)) {
+	{{ b := NewIcon(); fn(b) }}
+	@Icon(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/icon_templ.go

@@ -0,0 +1,425 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-icon
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Icons are symbols that can be used to represent various options within an application.
+//
+// Web Awesome component: <wa-icon>
+
+// IconProps holds all properties for the wa-icon component
+type IconProps struct {
+	// The name of the icon to draw. Available names depend on the icon library being used.
+	Name string `attr:"name"`
+	// The family of icons to choose from. For Font Awesome Free, valid options include classic and brands. For
+	Family string `attr:"family"`
+	// The name of the icon's variant. For Font Awesome, valid options include thin, light, regular, and solid for
+	Variant string `attr:"variant"`
+	// Sets the width of the icon to match the cropped SVG viewBox. This operates like the Font fa-width-auto class.
+	AutoWidth bool `attr:"auto-width"`
+	// Swaps the opacity of duotone icons.
+	SwapOpacity bool `attr:"swap-opacity"`
+	// An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and
+	Src string `attr:"src"`
+	// An alternate description to use for assistive devices. If omitted, the icon will be considered presentational and
+	Label string `attr:"label"`
+	// The name of a registered custom icon library.
+	Library string `attr:"library"`
+
+	// Events
+	// Emitted when the icon has loaded. When using spriteSheet: true this will not emit.
+	OnLoad string `attr:"x-on:wa-load"`
+	// Emitted when the icon fails to load due to an error. When using spriteSheet: true this will not emit.
+	OnError string `attr:"x-on:wa-error"`
+
+	// Slots contains named slot content
+	Slots IconSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// IconBuilder provides a fluent API for constructing IconProps
+type IconBuilder struct {
+	props IconProps
+}
+
+// NewIcon creates a new builder for wa-icon
+func NewIcon() *IconBuilder {
+	return &IconBuilder{}
+}
+
+// Name sets the name attribute
+// The name of the icon to draw. Available names depend on the icon library being used.
+func (b *IconBuilder) Name(v string) *IconBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Family sets the family attribute
+// The family of icons to choose from. For Font Awesome Free, valid options include classic and brands. For
+func (b *IconBuilder) Family(v string) *IconBuilder {
+	b.props.Family = v
+	return b
+}
+
+// Variant sets the variant attribute
+// The name of the icon's variant. For Font Awesome, valid options include thin, light, regular, and solid for
+func (b *IconBuilder) Variant(v string) *IconBuilder {
+	b.props.Variant = v
+	return b
+}
+
+// AutoWidth sets the auto-width attribute
+// Sets the width of the icon to match the cropped SVG viewBox. This operates like the Font fa-width-auto class.
+func (b *IconBuilder) AutoWidth(v bool) *IconBuilder {
+	b.props.AutoWidth = v
+	return b
+}
+
+// SwapOpacity sets the swap-opacity attribute
+// Swaps the opacity of duotone icons.
+func (b *IconBuilder) SwapOpacity(v bool) *IconBuilder {
+	b.props.SwapOpacity = v
+	return b
+}
+
+// Src sets the src attribute
+// An external URL of an SVG file. Be sure you trust the content you are including, as it will be executed as code and
+func (b *IconBuilder) Src(v string) *IconBuilder {
+	b.props.Src = v
+	return b
+}
+
+// Label sets the label attribute
+// An alternate description to use for assistive devices. If omitted, the icon will be considered presentational and
+func (b *IconBuilder) Label(v string) *IconBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Library sets the library attribute
+// The name of a registered custom icon library.
+func (b *IconBuilder) Library(v string) *IconBuilder {
+	b.props.Library = v
+	return b
+}
+
+// OnLoad sets the handler for wa-load event
+// Emitted when the icon has loaded. When using spriteSheet: true this will not emit.
+func (b *IconBuilder) OnLoad(handler string) *IconBuilder {
+	b.props.OnLoad = handler
+	return b
+}
+
+// OnError sets the handler for wa-error event
+// Emitted when the icon fails to load due to an error. When using spriteSheet: true this will not emit.
+func (b *IconBuilder) OnError(handler string) *IconBuilder {
+	b.props.OnError = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *IconBuilder) Attr(name, value string) *IconBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *IconBuilder) Attrs(attrs templ.Attributes) *IconBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *IconBuilder) Props() IconProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *IconBuilder) Build() IconProps {
+	return b.props
+}
+
+// Icon renders the wa-icon component
+func Icon(props IconProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-icon")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Name != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/icon.templ`, Line: 160, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Family != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " family=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Family)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/icon.templ`, Line: 163, Col: 24}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Variant != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " variant=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Variant)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/icon.templ`, Line: 166, Col: 26}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.AutoWidth {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " auto-width")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.SwapOpacity {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " swap-opacity")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Src != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " src=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.Src)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/icon.templ`, Line: 175, Col: 18}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/icon.templ`, Line: 178, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Library != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " library=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.Library)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/icon.templ`, Line: 181, Col: 26}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnLoad != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " x-on:wa-load=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnLoad)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/icon.templ`, Line: 184, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnError != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, " x-on:wa-error=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnError)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/icon.templ`, Line: 187, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</wa-icon>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// IconFunc renders with a builder function for inline configuration
+func IconFunc(fn func(*IconBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var10 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var10 == nil {
+			templ_7745c5c3_Var10 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewIcon()
+		fn(b)
+		templ_7745c5c3_Var11 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var10.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Icon(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var11), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/include.templ

@@ -0,0 +1,142 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-include
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Includes give you the power to embed external HTML files into the page.
+//
+// Web Awesome component: <wa-include>
+
+// IncludeProps holds all properties for the wa-include component
+type IncludeProps struct {
+	// The location of the HTML file to include. Be sure you trust the content you are including as it will be executed as
+	Src string `attr:"src"`
+	// The fetch mode to use.
+	// Valid values: "cors", "no-cors", "same-origin"
+	Mode string `attr:"mode"`
+	// Allows included scripts to be executed. Be sure you trust the content you are including as it will be executed as
+	AllowScripts bool `attr:"allow-scripts"`
+
+	// Events
+	// Emitted when the included file is loaded.
+	OnLoad string `attr:"x-on:wa-load"`
+	// Emitted when the included file fails to load due to an error.
+	OnIncludeError string `attr:"x-on:wa-include-error"`
+
+	// Slots contains named slot content
+	Slots IncludeSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// IncludeBuilder provides a fluent API for constructing IncludeProps
+type IncludeBuilder struct {
+	props IncludeProps
+}
+
+// NewInclude creates a new builder for wa-include
+func NewInclude() *IncludeBuilder {
+	return &IncludeBuilder{}
+}
+
+// Src sets the src attribute
+// The location of the HTML file to include. Be sure you trust the content you are including as it will be executed as
+func (b *IncludeBuilder) Src(v string) *IncludeBuilder {
+	b.props.Src = v
+	return b
+}
+
+// Mode sets the mode attribute
+// The fetch mode to use.
+func (b *IncludeBuilder) Mode(v string) *IncludeBuilder {
+	b.props.Mode = v
+	return b
+}
+
+// AllowScripts sets the allow-scripts attribute
+// Allows included scripts to be executed. Be sure you trust the content you are including as it will be executed as
+func (b *IncludeBuilder) AllowScripts(v bool) *IncludeBuilder {
+	b.props.AllowScripts = v
+	return b
+}
+
+// OnLoad sets the handler for wa-load event
+// Emitted when the included file is loaded.
+func (b *IncludeBuilder) OnLoad(handler string) *IncludeBuilder {
+	b.props.OnLoad = handler
+	return b
+}
+
+// OnIncludeError sets the handler for wa-include-error event
+// Emitted when the included file fails to load due to an error.
+func (b *IncludeBuilder) OnIncludeError(handler string) *IncludeBuilder {
+	b.props.OnIncludeError = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *IncludeBuilder) Attr(name, value string) *IncludeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *IncludeBuilder) Attrs(attrs templ.Attributes) *IncludeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *IncludeBuilder) Props() IncludeProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *IncludeBuilder) Build() IncludeProps {
+	return b.props
+}
+
+// Include renders the wa-include component
+templ Include(props IncludeProps) {
+	<wa-include
+		if props.Src != "" {
+			src={ props.Src }
+		}
+		if props.Mode != "" {
+			mode={ props.Mode }
+		}
+		if props.AllowScripts {
+			allow-scripts
+		}
+		if props.OnLoad != "" {
+			x-on:wa-load={ props.OnLoad }
+		}
+		if props.OnIncludeError != "" {
+			x-on:wa-include-error={ props.OnIncludeError }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-include>
+}
+
+// IncludeFunc renders with a builder function for inline configuration
+templ IncludeFunc(fn func(*IncludeBuilder)) {
+	{{ b := NewInclude(); fn(b) }}
+	@Include(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/include_templ.go

@@ -0,0 +1,299 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-include
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Includes give you the power to embed external HTML files into the page.
+//
+// Web Awesome component: <wa-include>
+
+// IncludeProps holds all properties for the wa-include component
+type IncludeProps struct {
+	// The location of the HTML file to include. Be sure you trust the content you are including as it will be executed as
+	Src string `attr:"src"`
+	// The fetch mode to use.
+	// Valid values: "cors", "no-cors", "same-origin"
+	Mode string `attr:"mode"`
+	// Allows included scripts to be executed. Be sure you trust the content you are including as it will be executed as
+	AllowScripts bool `attr:"allow-scripts"`
+
+	// Events
+	// Emitted when the included file is loaded.
+	OnLoad string `attr:"x-on:wa-load"`
+	// Emitted when the included file fails to load due to an error.
+	OnIncludeError string `attr:"x-on:wa-include-error"`
+
+	// Slots contains named slot content
+	Slots IncludeSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// IncludeBuilder provides a fluent API for constructing IncludeProps
+type IncludeBuilder struct {
+	props IncludeProps
+}
+
+// NewInclude creates a new builder for wa-include
+func NewInclude() *IncludeBuilder {
+	return &IncludeBuilder{}
+}
+
+// Src sets the src attribute
+// The location of the HTML file to include. Be sure you trust the content you are including as it will be executed as
+func (b *IncludeBuilder) Src(v string) *IncludeBuilder {
+	b.props.Src = v
+	return b
+}
+
+// Mode sets the mode attribute
+// The fetch mode to use.
+func (b *IncludeBuilder) Mode(v string) *IncludeBuilder {
+	b.props.Mode = v
+	return b
+}
+
+// AllowScripts sets the allow-scripts attribute
+// Allows included scripts to be executed. Be sure you trust the content you are including as it will be executed as
+func (b *IncludeBuilder) AllowScripts(v bool) *IncludeBuilder {
+	b.props.AllowScripts = v
+	return b
+}
+
+// OnLoad sets the handler for wa-load event
+// Emitted when the included file is loaded.
+func (b *IncludeBuilder) OnLoad(handler string) *IncludeBuilder {
+	b.props.OnLoad = handler
+	return b
+}
+
+// OnIncludeError sets the handler for wa-include-error event
+// Emitted when the included file fails to load due to an error.
+func (b *IncludeBuilder) OnIncludeError(handler string) *IncludeBuilder {
+	b.props.OnIncludeError = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *IncludeBuilder) Attr(name, value string) *IncludeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *IncludeBuilder) Attrs(attrs templ.Attributes) *IncludeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *IncludeBuilder) Props() IncludeProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *IncludeBuilder) Build() IncludeProps {
+	return b.props
+}
+
+// Include renders the wa-include component
+func Include(props IncludeProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-include")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Src != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " src=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Src)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/include.templ`, Line: 116, Col: 18}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Mode != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " mode=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Mode)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/include.templ`, Line: 119, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.AllowScripts {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " allow-scripts")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnLoad != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " x-on:wa-load=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnLoad)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/include.templ`, Line: 125, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnIncludeError != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " x-on:wa-include-error=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnIncludeError)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/include.templ`, Line: 128, Col: 47}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "</wa-include>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// IncludeFunc renders with a builder function for inline configuration
+func IncludeFunc(fn func(*IncludeBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var6 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var6 == nil {
+			templ_7745c5c3_Var6 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewInclude()
+		fn(b)
+		templ_7745c5c3_Var7 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var6.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Include(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var7), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/input.templ

@@ -0,0 +1,611 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-input
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Inputs collect data from the user.
+//
+// Web Awesome component: <wa-input>
+
+// InputProps holds all properties for the wa-input component
+type InputProps struct {
+	// The type of input. Works the same as a native <input> element, but only a subset of types are supported. Defaults
+	// Valid values: "date", "datetime-local", "email", "number", "password", "search", "tel", "text", "time", "url"
+	Type string `attr:"type"`
+	// The default value of the form control. Primarily used for resetting the form control.
+	Value string `attr:"value"`
+	// The input's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// The input's visual appearance.
+	// Valid values: "filled", "outlined", "filled-outlined"
+	Appearance string `attr:"appearance"`
+	// Draws a pill-style input with rounded edges.
+	Pill bool `attr:"pill"`
+	// The input's label. If you need to display HTML, use the label slot instead.
+	Label string `attr:"label"`
+	// The input's hint. If you need to display HTML, use the hint slot instead.
+	Hint string `attr:"hint"`
+	// Adds a clear button when the input is not empty.
+	WithClear bool `attr:"with-clear"`
+	// Placeholder text to show as a hint when the input is empty.
+	Placeholder string `attr:"placeholder"`
+	// Makes the input readonly.
+	Readonly bool `attr:"readonly"`
+	// Adds a button to toggle the password's visibility. Only applies to password types.
+	PasswordToggle bool `attr:"password-toggle"`
+	// Determines whether or not the password is currently visible. Only applies to password input types.
+	PasswordVisible bool `attr:"password-visible"`
+	// Hides the browser's built-in increment/decrement spin buttons for number inputs.
+	WithoutSpinButtons bool `attr:"without-spin-buttons"`
+	// Makes the input a required field.
+	Required bool `attr:"required"`
+	// A regular expression pattern to validate input against.
+	Pattern string `attr:"pattern"`
+	// The minimum length of input that will be considered valid.
+	Minlength float64 `attr:"minlength"`
+	// The maximum length of input that will be considered valid.
+	Maxlength float64 `attr:"maxlength"`
+	// The input's minimum value. Only applies to date and number input types.
+	Min string `attr:"min"`
+	// The input's maximum value. Only applies to date and number input types.
+	Max string `attr:"max"`
+	// Specifies the granularity that the value must adhere to, or the special value any which means no stepping is
+	// Valid values: "any"
+	Step string `attr:"step"`
+	// Controls whether and how text input is automatically capitalized as it is entered by the user.
+	// Valid values: "off", "none", "on", "sentences", "words", "characters"
+	Autocapitalize string `attr:"autocapitalize"`
+	// Indicates whether the browser's autocorrect feature is on or off.
+	// Valid values: "off", "on"
+	Autocorrect string `attr:"autocorrect"`
+	// Specifies what permission the browser has to provide assistance in filling out form field values. Refer to
+	Autocomplete string `attr:"autocomplete"`
+	// Indicates that the input should receive focus on page load.
+	Autofocus bool `attr:"autofocus"`
+	// Used to customize the label or icon of the Enter key on virtual keyboards.
+	// Valid values: "enter", "done", "go", "next", "previous", "search", "send"
+	Enterkeyhint string `attr:"enterkeyhint"`
+	// Enables spell checking on the input.
+	Spellcheck bool `attr:"spellcheck"`
+	// Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual
+	// Valid values: "none", "text", "decimal", "numeric", "tel", "search", "email", "url"
+	Inputmode string `attr:"inputmode"`
+	// Used for SSR. Will determine if the SSRed component will have the label slot rendered on initial paint.
+	WithLabel bool `attr:"with-label"`
+	// Used for SSR. Will determine if the SSRed component will have the hint slot rendered on initial paint.
+	WithHint bool `attr:"with-hint"`
+
+	// Events
+	// Emitted when the control receives input.
+	OnInput string `attr:"x-on:input"`
+	// Emitted when an alteration to the control's value is committed by the user.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the control loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the control gains focus.
+	OnFocus string `attr:"x-on:focus"`
+	// Emitted when the clear button is activated.
+	OnClear string `attr:"x-on:wa-clear"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots InputSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// InputSlots holds named slot content for the component
+type InputSlots struct {
+	// The input's label. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// An element, such as <wa-icon>, placed at the start of the input control.
+	Start templ.Component
+	// An element, such as <wa-icon>, placed at the end of the input control.
+	End templ.Component
+	// An icon to use in lieu of the default clear icon.
+	ClearIcon templ.Component
+	// An icon to use in lieu of the default show password icon.
+	ShowPasswordIcon templ.Component
+	// An icon to use in lieu of the default hide password icon.
+	HidePasswordIcon templ.Component
+	// Text that describes how to use the input. Alternatively, you can use the hint attribute.
+	Hint templ.Component
+}
+
+// InputBuilder provides a fluent API for constructing InputProps
+type InputBuilder struct {
+	props InputProps
+}
+
+// NewInput creates a new builder for wa-input
+func NewInput() *InputBuilder {
+	return &InputBuilder{}
+}
+
+// Type sets the type attribute
+// The type of input. Works the same as a native <input> element, but only a subset of types are supported. Defaults
+func (b *InputBuilder) Type(v string) *InputBuilder {
+	b.props.Type = v
+	return b
+}
+
+// Value sets the value attribute
+// The default value of the form control. Primarily used for resetting the form control.
+func (b *InputBuilder) Value(v string) *InputBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Size sets the size attribute
+// The input's size.
+func (b *InputBuilder) Size(v string) *InputBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The input's visual appearance.
+func (b *InputBuilder) Appearance(v string) *InputBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Pill sets the pill attribute
+// Draws a pill-style input with rounded edges.
+func (b *InputBuilder) Pill(v bool) *InputBuilder {
+	b.props.Pill = v
+	return b
+}
+
+// Label sets the label attribute
+// The input's label. If you need to display HTML, use the label slot instead.
+func (b *InputBuilder) Label(v string) *InputBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Hint sets the hint attribute
+// The input's hint. If you need to display HTML, use the hint slot instead.
+func (b *InputBuilder) Hint(v string) *InputBuilder {
+	b.props.Hint = v
+	return b
+}
+
+// WithClear sets the with-clear attribute
+// Adds a clear button when the input is not empty.
+func (b *InputBuilder) WithClear(v bool) *InputBuilder {
+	b.props.WithClear = v
+	return b
+}
+
+// Placeholder sets the placeholder attribute
+// Placeholder text to show as a hint when the input is empty.
+func (b *InputBuilder) Placeholder(v string) *InputBuilder {
+	b.props.Placeholder = v
+	return b
+}
+
+// Readonly sets the readonly attribute
+// Makes the input readonly.
+func (b *InputBuilder) Readonly(v bool) *InputBuilder {
+	b.props.Readonly = v
+	return b
+}
+
+// PasswordToggle sets the password-toggle attribute
+// Adds a button to toggle the password's visibility. Only applies to password types.
+func (b *InputBuilder) PasswordToggle(v bool) *InputBuilder {
+	b.props.PasswordToggle = v
+	return b
+}
+
+// PasswordVisible sets the password-visible attribute
+// Determines whether or not the password is currently visible. Only applies to password input types.
+func (b *InputBuilder) PasswordVisible(v bool) *InputBuilder {
+	b.props.PasswordVisible = v
+	return b
+}
+
+// WithoutSpinButtons sets the without-spin-buttons attribute
+// Hides the browser's built-in increment/decrement spin buttons for number inputs.
+func (b *InputBuilder) WithoutSpinButtons(v bool) *InputBuilder {
+	b.props.WithoutSpinButtons = v
+	return b
+}
+
+// Required sets the required attribute
+// Makes the input a required field.
+func (b *InputBuilder) Required(v bool) *InputBuilder {
+	b.props.Required = v
+	return b
+}
+
+// Pattern sets the pattern attribute
+// A regular expression pattern to validate input against.
+func (b *InputBuilder) Pattern(v string) *InputBuilder {
+	b.props.Pattern = v
+	return b
+}
+
+// Minlength sets the minlength attribute
+// The minimum length of input that will be considered valid.
+func (b *InputBuilder) Minlength(v float64) *InputBuilder {
+	b.props.Minlength = v
+	return b
+}
+
+// Maxlength sets the maxlength attribute
+// The maximum length of input that will be considered valid.
+func (b *InputBuilder) Maxlength(v float64) *InputBuilder {
+	b.props.Maxlength = v
+	return b
+}
+
+// Min sets the min attribute
+// The input's minimum value. Only applies to date and number input types.
+func (b *InputBuilder) Min(v string) *InputBuilder {
+	b.props.Min = v
+	return b
+}
+
+// Max sets the max attribute
+// The input's maximum value. Only applies to date and number input types.
+func (b *InputBuilder) Max(v string) *InputBuilder {
+	b.props.Max = v
+	return b
+}
+
+// Step sets the step attribute
+// Specifies the granularity that the value must adhere to, or the special value any which means no stepping is
+func (b *InputBuilder) Step(v string) *InputBuilder {
+	b.props.Step = v
+	return b
+}
+
+// Autocapitalize sets the autocapitalize attribute
+// Controls whether and how text input is automatically capitalized as it is entered by the user.
+func (b *InputBuilder) Autocapitalize(v string) *InputBuilder {
+	b.props.Autocapitalize = v
+	return b
+}
+
+// Autocorrect sets the autocorrect attribute
+// Indicates whether the browser's autocorrect feature is on or off.
+func (b *InputBuilder) Autocorrect(v string) *InputBuilder {
+	b.props.Autocorrect = v
+	return b
+}
+
+// Autocomplete sets the autocomplete attribute
+// Specifies what permission the browser has to provide assistance in filling out form field values. Refer to
+func (b *InputBuilder) Autocomplete(v string) *InputBuilder {
+	b.props.Autocomplete = v
+	return b
+}
+
+// Autofocus sets the autofocus attribute
+// Indicates that the input should receive focus on page load.
+func (b *InputBuilder) Autofocus(v bool) *InputBuilder {
+	b.props.Autofocus = v
+	return b
+}
+
+// Enterkeyhint sets the enterkeyhint attribute
+// Used to customize the label or icon of the Enter key on virtual keyboards.
+func (b *InputBuilder) Enterkeyhint(v string) *InputBuilder {
+	b.props.Enterkeyhint = v
+	return b
+}
+
+// Spellcheck sets the spellcheck attribute
+// Enables spell checking on the input.
+func (b *InputBuilder) Spellcheck(v bool) *InputBuilder {
+	b.props.Spellcheck = v
+	return b
+}
+
+// Inputmode sets the inputmode attribute
+// Tells the browser what type of data will be entered by the user, allowing it to display the appropriate virtual
+func (b *InputBuilder) Inputmode(v string) *InputBuilder {
+	b.props.Inputmode = v
+	return b
+}
+
+// WithLabel sets the with-label attribute
+// Used for SSR. Will determine if the SSRed component will have the label slot rendered on initial paint.
+func (b *InputBuilder) WithLabel(v bool) *InputBuilder {
+	b.props.WithLabel = v
+	return b
+}
+
+// WithHint sets the with-hint attribute
+// Used for SSR. Will determine if the SSRed component will have the hint slot rendered on initial paint.
+func (b *InputBuilder) WithHint(v bool) *InputBuilder {
+	b.props.WithHint = v
+	return b
+}
+
+// OnInput sets the handler for input event
+// Emitted when the control receives input.
+func (b *InputBuilder) OnInput(handler string) *InputBuilder {
+	b.props.OnInput = handler
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when an alteration to the control's value is committed by the user.
+func (b *InputBuilder) OnChange(handler string) *InputBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the control loses focus.
+func (b *InputBuilder) OnBlur(handler string) *InputBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the control gains focus.
+func (b *InputBuilder) OnFocus(handler string) *InputBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// OnClear sets the handler for wa-clear event
+// Emitted when the clear button is activated.
+func (b *InputBuilder) OnClear(handler string) *InputBuilder {
+	b.props.OnClear = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *InputBuilder) OnInvalid(handler string) *InputBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The input's label. Alternatively, you can use the label attribute.
+func (b *InputBuilder) LabelSlot(c templ.Component) *InputBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// StartSlot sets the start slot content
+// An element, such as <wa-icon>, placed at the start of the input control.
+func (b *InputBuilder) StartSlot(c templ.Component) *InputBuilder {
+	b.props.Slots.Start = c
+	return b
+}
+
+// EndSlot sets the end slot content
+// An element, such as <wa-icon>, placed at the end of the input control.
+func (b *InputBuilder) EndSlot(c templ.Component) *InputBuilder {
+	b.props.Slots.End = c
+	return b
+}
+
+// ClearIconSlot sets the clear-icon slot content
+// An icon to use in lieu of the default clear icon.
+func (b *InputBuilder) ClearIconSlot(c templ.Component) *InputBuilder {
+	b.props.Slots.ClearIcon = c
+	return b
+}
+
+// ShowPasswordIconSlot sets the show-password-icon slot content
+// An icon to use in lieu of the default show password icon.
+func (b *InputBuilder) ShowPasswordIconSlot(c templ.Component) *InputBuilder {
+	b.props.Slots.ShowPasswordIcon = c
+	return b
+}
+
+// HidePasswordIconSlot sets the hide-password-icon slot content
+// An icon to use in lieu of the default hide password icon.
+func (b *InputBuilder) HidePasswordIconSlot(c templ.Component) *InputBuilder {
+	b.props.Slots.HidePasswordIcon = c
+	return b
+}
+
+// HintSlot sets the hint slot content
+// Text that describes how to use the input. Alternatively, you can use the hint attribute.
+func (b *InputBuilder) HintSlot(c templ.Component) *InputBuilder {
+	b.props.Slots.Hint = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *InputBuilder) Attr(name, value string) *InputBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *InputBuilder) Attrs(attrs templ.Attributes) *InputBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *InputBuilder) Props() InputProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *InputBuilder) Build() InputProps {
+	return b.props
+}
+
+// Input renders the wa-input component
+templ Input(props InputProps) {
+	<wa-input
+		if props.Type != "" {
+			type={ props.Type }
+		}
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.Size != "" {
+			size={ props.Size }
+		}
+		if props.Appearance != "" {
+			appearance={ props.Appearance }
+		}
+		if props.Pill {
+			pill
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.Hint != "" {
+			hint={ props.Hint }
+		}
+		if props.WithClear {
+			with-clear
+		}
+		if props.Placeholder != "" {
+			placeholder={ props.Placeholder }
+		}
+		if props.Readonly {
+			readonly
+		}
+		if props.PasswordToggle {
+			password-toggle
+		}
+		if props.PasswordVisible {
+			password-visible
+		}
+		if props.WithoutSpinButtons {
+			without-spin-buttons
+		}
+		if props.Required {
+			required
+		}
+		if props.Pattern != "" {
+			pattern={ props.Pattern }
+		}
+		if props.Minlength != 0 {
+			minlength={ templ.Sprintf("%v", props.Minlength) }
+		}
+		if props.Maxlength != 0 {
+			maxlength={ templ.Sprintf("%v", props.Maxlength) }
+		}
+		if props.Min != 0 {
+			min={ templ.Sprintf("%v", props.Min) }
+		}
+		if props.Max != 0 {
+			max={ templ.Sprintf("%v", props.Max) }
+		}
+		if props.Step != 0 {
+			step={ templ.Sprintf("%v", props.Step) }
+		}
+		if props.Autocapitalize != "" {
+			autocapitalize={ props.Autocapitalize }
+		}
+		if props.Autocorrect != "" {
+			autocorrect={ props.Autocorrect }
+		}
+		if props.Autocomplete != "" {
+			autocomplete={ props.Autocomplete }
+		}
+		if props.Autofocus {
+			autofocus
+		}
+		if props.Enterkeyhint != "" {
+			enterkeyhint={ props.Enterkeyhint }
+		}
+		if props.Spellcheck {
+			spellcheck
+		}
+		if props.Inputmode != "" {
+			inputmode={ props.Inputmode }
+		}
+		if props.WithLabel {
+			with-label
+		}
+		if props.WithHint {
+			with-hint
+		}
+		if props.OnInput != "" {
+			x-on:input={ props.OnInput }
+		}
+		if props.OnChange != "" {
+			x-on:change={ props.OnChange }
+		}
+		if props.OnBlur != "" {
+			x-on:blur={ props.OnBlur }
+		}
+		if props.OnFocus != "" {
+			x-on:focus={ props.OnFocus }
+		}
+		if props.OnClear != "" {
+			x-on:wa-clear={ props.OnClear }
+		}
+		if props.OnInvalid != "" {
+			x-on:wa-invalid={ props.OnInvalid }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Label != nil {
+			<div slot="label">
+				@props.Slots.Label
+			</div>
+		}
+		if props.Slots.Start != nil {
+			<div slot="start">
+				@props.Slots.Start
+			</div>
+		}
+		if props.Slots.End != nil {
+			<div slot="end">
+				@props.Slots.End
+			</div>
+		}
+		if props.Slots.ClearIcon != nil {
+			<div slot="clear-icon">
+				@props.Slots.ClearIcon
+			</div>
+		}
+		if props.Slots.ShowPasswordIcon != nil {
+			<div slot="show-password-icon">
+				@props.Slots.ShowPasswordIcon
+			</div>
+		}
+		if props.Slots.HidePasswordIcon != nil {
+			<div slot="hide-password-icon">
+				@props.Slots.HidePasswordIcon
+			</div>
+		}
+		if props.Slots.Hint != nil {
+			<div slot="hint">
+				@props.Slots.Hint
+			</div>
+		}
+		{ children... }
+	</wa-input>
+}
+
+// InputFunc renders with a builder function for inline configuration
+templ InputFunc(fn func(*InputBuilder)) {
+	{{ b := NewInput(); fn(b) }}
+	@Input(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/intersection-observer.templ

@@ -0,0 +1,165 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-intersection-observer
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Tracks immediate child elements and fires events as they move in and out of view.
+//
+// Web Awesome component: <wa-intersection-observer>
+
+// IntersectionObserverProps holds all properties for the wa-intersection-observer component
+type IntersectionObserverProps struct {
+	// Element ID to define the viewport boundaries for tracked targets.
+	Root string `attr:"root"`
+	// Offset space around the root boundary. Accepts values like CSS margin syntax.
+	RootMargin string `attr:"root-margin"`
+	// One or more space-separated values representing visibility percentages that trigger the observer callback.
+	Threshold string `attr:"threshold"`
+	// CSS class applied to elements during intersection. Automatically removed when elements leave
+	IntersectClass string `attr:"intersect-class"`
+	// If enabled, observation ceases after initial intersection.
+	Once bool `attr:"once"`
+	// Deactivates the intersection observer functionality.
+	Disabled bool `attr:"disabled"`
+
+	// Events
+	// Fired when a tracked element begins or ceases intersecting.
+	OnIntersect string `attr:"x-on:wa-intersect"`
+
+	// Slots contains named slot content
+	Slots IntersectionObserverSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// IntersectionObserverBuilder provides a fluent API for constructing IntersectionObserverProps
+type IntersectionObserverBuilder struct {
+	props IntersectionObserverProps
+}
+
+// NewIntersectionObserver creates a new builder for wa-intersection-observer
+func NewIntersectionObserver() *IntersectionObserverBuilder {
+	return &IntersectionObserverBuilder{}
+}
+
+// Root sets the root attribute
+// Element ID to define the viewport boundaries for tracked targets.
+func (b *IntersectionObserverBuilder) Root(v string) *IntersectionObserverBuilder {
+	b.props.Root = v
+	return b
+}
+
+// RootMargin sets the root-margin attribute
+// Offset space around the root boundary. Accepts values like CSS margin syntax.
+func (b *IntersectionObserverBuilder) RootMargin(v string) *IntersectionObserverBuilder {
+	b.props.RootMargin = v
+	return b
+}
+
+// Threshold sets the threshold attribute
+// One or more space-separated values representing visibility percentages that trigger the observer callback.
+func (b *IntersectionObserverBuilder) Threshold(v string) *IntersectionObserverBuilder {
+	b.props.Threshold = v
+	return b
+}
+
+// IntersectClass sets the intersect-class attribute
+// CSS class applied to elements during intersection. Automatically removed when elements leave
+func (b *IntersectionObserverBuilder) IntersectClass(v string) *IntersectionObserverBuilder {
+	b.props.IntersectClass = v
+	return b
+}
+
+// Once sets the once attribute
+// If enabled, observation ceases after initial intersection.
+func (b *IntersectionObserverBuilder) Once(v bool) *IntersectionObserverBuilder {
+	b.props.Once = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Deactivates the intersection observer functionality.
+func (b *IntersectionObserverBuilder) Disabled(v bool) *IntersectionObserverBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// OnIntersect sets the handler for wa-intersect event
+// Fired when a tracked element begins or ceases intersecting.
+func (b *IntersectionObserverBuilder) OnIntersect(handler string) *IntersectionObserverBuilder {
+	b.props.OnIntersect = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *IntersectionObserverBuilder) Attr(name, value string) *IntersectionObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *IntersectionObserverBuilder) Attrs(attrs templ.Attributes) *IntersectionObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *IntersectionObserverBuilder) Props() IntersectionObserverProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *IntersectionObserverBuilder) Build() IntersectionObserverProps {
+	return b.props
+}
+
+// IntersectionObserver renders the wa-intersection-observer component
+templ IntersectionObserver(props IntersectionObserverProps) {
+	<wa-intersection-observer
+		if props.Root != "" {
+			root={ props.Root }
+		}
+		if props.RootMargin != "" {
+			root-margin={ props.RootMargin }
+		}
+		if props.Threshold != "" {
+			threshold={ props.Threshold }
+		}
+		if props.IntersectClass != "" {
+			intersect-class={ props.IntersectClass }
+		}
+		if props.Once {
+			once
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.OnIntersect != "" {
+			x-on:wa-intersect={ props.OnIntersect }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-intersection-observer>
+}
+
+// IntersectionObserverFunc renders with a builder function for inline configuration
+templ IntersectionObserverFunc(fn func(*IntersectionObserverBuilder)) {
+	{{ b := NewIntersectionObserver(); fn(b) }}
+	@IntersectionObserver(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/intersection-observer_templ.go

@@ -0,0 +1,341 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-intersection-observer
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Tracks immediate child elements and fires events as they move in and out of view.
+//
+// Web Awesome component: <wa-intersection-observer>
+
+// IntersectionObserverProps holds all properties for the wa-intersection-observer component
+type IntersectionObserverProps struct {
+	// Element ID to define the viewport boundaries for tracked targets.
+	Root string `attr:"root"`
+	// Offset space around the root boundary. Accepts values like CSS margin syntax.
+	RootMargin string `attr:"root-margin"`
+	// One or more space-separated values representing visibility percentages that trigger the observer callback.
+	Threshold string `attr:"threshold"`
+	// CSS class applied to elements during intersection. Automatically removed when elements leave
+	IntersectClass string `attr:"intersect-class"`
+	// If enabled, observation ceases after initial intersection.
+	Once bool `attr:"once"`
+	// Deactivates the intersection observer functionality.
+	Disabled bool `attr:"disabled"`
+
+	// Events
+	// Fired when a tracked element begins or ceases intersecting.
+	OnIntersect string `attr:"x-on:wa-intersect"`
+
+	// Slots contains named slot content
+	Slots IntersectionObserverSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// IntersectionObserverBuilder provides a fluent API for constructing IntersectionObserverProps
+type IntersectionObserverBuilder struct {
+	props IntersectionObserverProps
+}
+
+// NewIntersectionObserver creates a new builder for wa-intersection-observer
+func NewIntersectionObserver() *IntersectionObserverBuilder {
+	return &IntersectionObserverBuilder{}
+}
+
+// Root sets the root attribute
+// Element ID to define the viewport boundaries for tracked targets.
+func (b *IntersectionObserverBuilder) Root(v string) *IntersectionObserverBuilder {
+	b.props.Root = v
+	return b
+}
+
+// RootMargin sets the root-margin attribute
+// Offset space around the root boundary. Accepts values like CSS margin syntax.
+func (b *IntersectionObserverBuilder) RootMargin(v string) *IntersectionObserverBuilder {
+	b.props.RootMargin = v
+	return b
+}
+
+// Threshold sets the threshold attribute
+// One or more space-separated values representing visibility percentages that trigger the observer callback.
+func (b *IntersectionObserverBuilder) Threshold(v string) *IntersectionObserverBuilder {
+	b.props.Threshold = v
+	return b
+}
+
+// IntersectClass sets the intersect-class attribute
+// CSS class applied to elements during intersection. Automatically removed when elements leave
+func (b *IntersectionObserverBuilder) IntersectClass(v string) *IntersectionObserverBuilder {
+	b.props.IntersectClass = v
+	return b
+}
+
+// Once sets the once attribute
+// If enabled, observation ceases after initial intersection.
+func (b *IntersectionObserverBuilder) Once(v bool) *IntersectionObserverBuilder {
+	b.props.Once = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Deactivates the intersection observer functionality.
+func (b *IntersectionObserverBuilder) Disabled(v bool) *IntersectionObserverBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// OnIntersect sets the handler for wa-intersect event
+// Fired when a tracked element begins or ceases intersecting.
+func (b *IntersectionObserverBuilder) OnIntersect(handler string) *IntersectionObserverBuilder {
+	b.props.OnIntersect = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *IntersectionObserverBuilder) Attr(name, value string) *IntersectionObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *IntersectionObserverBuilder) Attrs(attrs templ.Attributes) *IntersectionObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *IntersectionObserverBuilder) Props() IntersectionObserverProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *IntersectionObserverBuilder) Build() IntersectionObserverProps {
+	return b.props
+}
+
+// IntersectionObserver renders the wa-intersection-observer component
+func IntersectionObserver(props IntersectionObserverProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-intersection-observer")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Root != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " root=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Root)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/intersection-observer.templ`, Line: 133, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.RootMargin != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " root-margin=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.RootMargin)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/intersection-observer.templ`, Line: 136, Col: 33}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Threshold != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " threshold=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Threshold)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/intersection-observer.templ`, Line: 139, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.IntersectClass != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " intersect-class=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.IntersectClass)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/intersection-observer.templ`, Line: 142, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Once {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " once")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnIntersect != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " x-on:wa-intersect=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnIntersect)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/intersection-observer.templ`, Line: 151, Col: 40}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "</wa-intersection-observer>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// IntersectionObserverFunc renders with a builder function for inline configuration
+func IntersectionObserverFunc(fn func(*IntersectionObserverBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var7 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var7 == nil {
+			templ_7745c5c3_Var7 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewIntersectionObserver()
+		fn(b)
+		templ_7745c5c3_Var8 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var7.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = IntersectionObserver(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var8), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/mutation-observer.templ

@@ -0,0 +1,165 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-mutation-observer
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// The Mutation Observer component offers a thin, declarative interface to the MutationObserver API.
+//
+// Web Awesome component: <wa-mutation-observer>
+
+// MutationObserverProps holds all properties for the wa-mutation-observer component
+type MutationObserverProps struct {
+	// Watches for changes to attributes. To watch only specific attributes, separate them by a space, e.g.
+	Attr string `attr:"attr"`
+	// Indicates whether or not the attribute's previous value should be recorded when monitoring changes.
+	AttrOldValue bool `attr:"attr-old-value"`
+	// Watches for changes to the character data contained within the node.
+	CharData bool `attr:"char-data"`
+	// Indicates whether or not the previous value of the node's text should be recorded.
+	CharDataOldValue bool `attr:"char-data-old-value"`
+	// Watches for the addition or removal of new child nodes.
+	ChildList bool `attr:"child-list"`
+	// Disables the observer.
+	Disabled bool `attr:"disabled"`
+
+	// Events
+	// Emitted when a mutation occurs.
+	OnMutation string `attr:"x-on:wa-mutation"`
+
+	// Slots contains named slot content
+	Slots MutationObserverSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// MutationObserverBuilder provides a fluent API for constructing MutationObserverProps
+type MutationObserverBuilder struct {
+	props MutationObserverProps
+}
+
+// NewMutationObserver creates a new builder for wa-mutation-observer
+func NewMutationObserver() *MutationObserverBuilder {
+	return &MutationObserverBuilder{}
+}
+
+// Attr sets the attr attribute
+// Watches for changes to attributes. To watch only specific attributes, separate them by a space, e.g.
+func (b *MutationObserverBuilder) Attr(v string) *MutationObserverBuilder {
+	b.props.Attr = v
+	return b
+}
+
+// AttrOldValue sets the attr-old-value attribute
+// Indicates whether or not the attribute's previous value should be recorded when monitoring changes.
+func (b *MutationObserverBuilder) AttrOldValue(v bool) *MutationObserverBuilder {
+	b.props.AttrOldValue = v
+	return b
+}
+
+// CharData sets the char-data attribute
+// Watches for changes to the character data contained within the node.
+func (b *MutationObserverBuilder) CharData(v bool) *MutationObserverBuilder {
+	b.props.CharData = v
+	return b
+}
+
+// CharDataOldValue sets the char-data-old-value attribute
+// Indicates whether or not the previous value of the node's text should be recorded.
+func (b *MutationObserverBuilder) CharDataOldValue(v bool) *MutationObserverBuilder {
+	b.props.CharDataOldValue = v
+	return b
+}
+
+// ChildList sets the child-list attribute
+// Watches for the addition or removal of new child nodes.
+func (b *MutationObserverBuilder) ChildList(v bool) *MutationObserverBuilder {
+	b.props.ChildList = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the observer.
+func (b *MutationObserverBuilder) Disabled(v bool) *MutationObserverBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// OnMutation sets the handler for wa-mutation event
+// Emitted when a mutation occurs.
+func (b *MutationObserverBuilder) OnMutation(handler string) *MutationObserverBuilder {
+	b.props.OnMutation = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *MutationObserverBuilder) Attr(name, value string) *MutationObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *MutationObserverBuilder) Attrs(attrs templ.Attributes) *MutationObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *MutationObserverBuilder) Props() MutationObserverProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *MutationObserverBuilder) Build() MutationObserverProps {
+	return b.props
+}
+
+// MutationObserver renders the wa-mutation-observer component
+templ MutationObserver(props MutationObserverProps) {
+	<wa-mutation-observer
+		if props.Attr != "" {
+			attr={ props.Attr }
+		}
+		if props.AttrOldValue {
+			attr-old-value
+		}
+		if props.CharData {
+			char-data
+		}
+		if props.CharDataOldValue {
+			char-data-old-value
+		}
+		if props.ChildList {
+			child-list
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.OnMutation != "" {
+			x-on:wa-mutation={ props.OnMutation }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-mutation-observer>
+}
+
+// MutationObserverFunc renders with a builder function for inline configuration
+templ MutationObserverFunc(fn func(*MutationObserverBuilder)) {
+	{{ b := NewMutationObserver(); fn(b) }}
+	@MutationObserver(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/mutation-observer_templ.go

@@ -0,0 +1,302 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-mutation-observer
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// The Mutation Observer component offers a thin, declarative interface to the MutationObserver API.
+//
+// Web Awesome component: <wa-mutation-observer>
+
+// MutationObserverProps holds all properties for the wa-mutation-observer component
+type MutationObserverProps struct {
+	// Watches for changes to attributes. To watch only specific attributes, separate them by a space, e.g.
+	Attr string `attr:"attr"`
+	// Indicates whether or not the attribute's previous value should be recorded when monitoring changes.
+	AttrOldValue bool `attr:"attr-old-value"`
+	// Watches for changes to the character data contained within the node.
+	CharData bool `attr:"char-data"`
+	// Indicates whether or not the previous value of the node's text should be recorded.
+	CharDataOldValue bool `attr:"char-data-old-value"`
+	// Watches for the addition or removal of new child nodes.
+	ChildList bool `attr:"child-list"`
+	// Disables the observer.
+	Disabled bool `attr:"disabled"`
+
+	// Events
+	// Emitted when a mutation occurs.
+	OnMutation string `attr:"x-on:wa-mutation"`
+
+	// Slots contains named slot content
+	Slots MutationObserverSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// MutationObserverBuilder provides a fluent API for constructing MutationObserverProps
+type MutationObserverBuilder struct {
+	props MutationObserverProps
+}
+
+// NewMutationObserver creates a new builder for wa-mutation-observer
+func NewMutationObserver() *MutationObserverBuilder {
+	return &MutationObserverBuilder{}
+}
+
+// Attr sets the attr attribute
+// Watches for changes to attributes. To watch only specific attributes, separate them by a space, e.g.
+func (b *MutationObserverBuilder) Attr(v string) *MutationObserverBuilder {
+	b.props.Attr = v
+	return b
+}
+
+// AttrOldValue sets the attr-old-value attribute
+// Indicates whether or not the attribute's previous value should be recorded when monitoring changes.
+func (b *MutationObserverBuilder) AttrOldValue(v bool) *MutationObserverBuilder {
+	b.props.AttrOldValue = v
+	return b
+}
+
+// CharData sets the char-data attribute
+// Watches for changes to the character data contained within the node.
+func (b *MutationObserverBuilder) CharData(v bool) *MutationObserverBuilder {
+	b.props.CharData = v
+	return b
+}
+
+// CharDataOldValue sets the char-data-old-value attribute
+// Indicates whether or not the previous value of the node's text should be recorded.
+func (b *MutationObserverBuilder) CharDataOldValue(v bool) *MutationObserverBuilder {
+	b.props.CharDataOldValue = v
+	return b
+}
+
+// ChildList sets the child-list attribute
+// Watches for the addition or removal of new child nodes.
+func (b *MutationObserverBuilder) ChildList(v bool) *MutationObserverBuilder {
+	b.props.ChildList = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the observer.
+func (b *MutationObserverBuilder) Disabled(v bool) *MutationObserverBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// OnMutation sets the handler for wa-mutation event
+// Emitted when a mutation occurs.
+func (b *MutationObserverBuilder) OnMutation(handler string) *MutationObserverBuilder {
+	b.props.OnMutation = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *MutationObserverBuilder) Attr(name, value string) *MutationObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *MutationObserverBuilder) Attrs(attrs templ.Attributes) *MutationObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *MutationObserverBuilder) Props() MutationObserverProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *MutationObserverBuilder) Build() MutationObserverProps {
+	return b.props
+}
+
+// MutationObserver renders the wa-mutation-observer component
+func MutationObserver(props MutationObserverProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-mutation-observer")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Attr != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " attr=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Attr)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/mutation-observer.templ`, Line: 133, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.AttrOldValue {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " attr-old-value")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.CharData {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " char-data")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.CharDataOldValue {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " char-data-old-value")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.ChildList {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " child-list")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnMutation != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " x-on:wa-mutation=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnMutation)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/mutation-observer.templ`, Line: 151, Col: 38}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "</wa-mutation-observer>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// MutationObserverFunc renders with a builder function for inline configuration
+func MutationObserverFunc(fn func(*MutationObserverBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var4 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var4 == nil {
+			templ_7745c5c3_Var4 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewMutationObserver()
+		fn(b)
+		templ_7745c5c3_Var5 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var4.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = MutationObserver(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var5), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/option.templ

@@ -0,0 +1,161 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-option
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Options define the selectable items within a select component.
+//
+// Web Awesome component: <wa-option>
+
+// OptionProps holds all properties for the wa-option component
+type OptionProps struct {
+	// The option's value. When selected, the containing form control will receive this value. The value must be unique
+	Value string `attr:"value"`
+	// Draws the option in a disabled state, preventing selection.
+	Disabled bool `attr:"disabled"`
+	// Selects an option initially.
+	Selected bool `attr:"selected"`
+	// The option’s plain text label.
+	Label string `attr:"label"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots OptionSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// OptionSlots holds named slot content for the component
+type OptionSlots struct {
+	// An element, such as <wa-icon>, placed before the label.
+	Start templ.Component
+	// An element, such as <wa-icon>, placed after the label.
+	End templ.Component
+}
+
+// OptionBuilder provides a fluent API for constructing OptionProps
+type OptionBuilder struct {
+	props OptionProps
+}
+
+// NewOption creates a new builder for wa-option
+func NewOption() *OptionBuilder {
+	return &OptionBuilder{}
+}
+
+// Value sets the value attribute
+// The option's value. When selected, the containing form control will receive this value. The value must be unique
+func (b *OptionBuilder) Value(v string) *OptionBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Draws the option in a disabled state, preventing selection.
+func (b *OptionBuilder) Disabled(v bool) *OptionBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Selected sets the selected attribute
+// Selects an option initially.
+func (b *OptionBuilder) Selected(v bool) *OptionBuilder {
+	b.props.Selected = v
+	return b
+}
+
+// Label sets the label attribute
+// The option’s plain text label.
+func (b *OptionBuilder) Label(v string) *OptionBuilder {
+	b.props.Label = v
+	return b
+}
+
+// StartSlot sets the start slot content
+// An element, such as <wa-icon>, placed before the label.
+func (b *OptionBuilder) StartSlot(c templ.Component) *OptionBuilder {
+	b.props.Slots.Start = c
+	return b
+}
+
+// EndSlot sets the end slot content
+// An element, such as <wa-icon>, placed after the label.
+func (b *OptionBuilder) EndSlot(c templ.Component) *OptionBuilder {
+	b.props.Slots.End = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *OptionBuilder) Attr(name, value string) *OptionBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *OptionBuilder) Attrs(attrs templ.Attributes) *OptionBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *OptionBuilder) Props() OptionProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *OptionBuilder) Build() OptionProps {
+	return b.props
+}
+
+// Option renders the wa-option component
+templ Option(props OptionProps) {
+	<wa-option
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.Selected {
+			selected
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Start != nil {
+			<div slot="start">
+				@props.Slots.Start
+			</div>
+		}
+		if props.Slots.End != nil {
+			<div slot="end">
+				@props.Slots.End
+			</div>
+		}
+		{ children... }
+	</wa-option>
+}
+
+// OptionFunc renders with a builder function for inline configuration
+templ OptionFunc(fn func(*OptionBuilder)) {
+	{{ b := NewOption(); fn(b) }}
+	@Option(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/option_templ.go

@@ -0,0 +1,307 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-option
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Options define the selectable items within a select component.
+//
+// Web Awesome component: <wa-option>
+
+// OptionProps holds all properties for the wa-option component
+type OptionProps struct {
+	// The option's value. When selected, the containing form control will receive this value. The value must be unique
+	Value string `attr:"value"`
+	// Draws the option in a disabled state, preventing selection.
+	Disabled bool `attr:"disabled"`
+	// Selects an option initially.
+	Selected bool `attr:"selected"`
+	// The option’s plain text label.
+	Label string `attr:"label"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots OptionSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// OptionSlots holds named slot content for the component
+type OptionSlots struct {
+	// An element, such as <wa-icon>, placed before the label.
+	Start templ.Component
+	// An element, such as <wa-icon>, placed after the label.
+	End templ.Component
+}
+
+// OptionBuilder provides a fluent API for constructing OptionProps
+type OptionBuilder struct {
+	props OptionProps
+}
+
+// NewOption creates a new builder for wa-option
+func NewOption() *OptionBuilder {
+	return &OptionBuilder{}
+}
+
+// Value sets the value attribute
+// The option's value. When selected, the containing form control will receive this value. The value must be unique
+func (b *OptionBuilder) Value(v string) *OptionBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Draws the option in a disabled state, preventing selection.
+func (b *OptionBuilder) Disabled(v bool) *OptionBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Selected sets the selected attribute
+// Selects an option initially.
+func (b *OptionBuilder) Selected(v bool) *OptionBuilder {
+	b.props.Selected = v
+	return b
+}
+
+// Label sets the label attribute
+// The option’s plain text label.
+func (b *OptionBuilder) Label(v string) *OptionBuilder {
+	b.props.Label = v
+	return b
+}
+
+// StartSlot sets the start slot content
+// An element, such as <wa-icon>, placed before the label.
+func (b *OptionBuilder) StartSlot(c templ.Component) *OptionBuilder {
+	b.props.Slots.Start = c
+	return b
+}
+
+// EndSlot sets the end slot content
+// An element, such as <wa-icon>, placed after the label.
+func (b *OptionBuilder) EndSlot(c templ.Component) *OptionBuilder {
+	b.props.Slots.End = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *OptionBuilder) Attr(name, value string) *OptionBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *OptionBuilder) Attrs(attrs templ.Attributes) *OptionBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *OptionBuilder) Props() OptionProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *OptionBuilder) Build() OptionProps {
+	return b.props
+}
+
+// Option renders the wa-option component
+func Option(props OptionProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-option")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/option.templ`, Line: 128, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Selected {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " selected")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/option.templ`, Line: 137, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Start != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "<div slot=\"start\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Start.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.End != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "<div slot=\"end\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.End.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "</wa-option>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// OptionFunc renders with a builder function for inline configuration
+func OptionFunc(fn func(*OptionBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var4 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var4 == nil {
+			templ_7745c5c3_Var4 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewOption()
+		fn(b)
+		templ_7745c5c3_Var5 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var4.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Option(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var5), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/page.templ

@@ -0,0 +1,343 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-page
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Pages offer an easy way to scaffold entire page layouts using minimal markup.
+//
+// Web Awesome component: <wa-page>
+
+// PageProps holds all properties for the wa-page component
+type PageProps struct {
+	// The view is a reflection of the "mobileBreakpoint", when the page is larger than the mobile-breakpoint (768px by
+	// Valid values: "mobile", "desktop"
+	View string `attr:"view"`
+	// Whether or not the navigation drawer is open. Note, the navigation drawer is only "open" on mobile views.
+	NavOpen bool `attr:"nav-open"`
+	// At what page width to hide the "navigation" slot and collapse into a hamburger button.
+	MobileBreakpoint string `attr:"mobile-breakpoint"`
+	// Where to place the navigation when in the mobile viewport.
+	// Valid values: "start", "end"
+	NavigationPlacement string `attr:"navigation-placement"`
+	// Determines whether or not to hide the default hamburger button.
+	DisableNavigationToggle bool `attr:"disable-navigation-toggle"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots PageSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// PageSlots holds named slot content for the component
+type PageSlots struct {
+	// The banner that gets display above the header. The banner will not be shown if no content is provided.
+	Banner templ.Component
+	// The header to display at the top of the page. If a banner is present, the header will appear below the banner. The he...
+	Header templ.Component
+	// A subheader to display below the header. This is a good place to put things like breadcrumbs.
+	Subheader templ.Component
+	// The left side of the page. If you slot an element in here, you will override the default navigation slot and will be ...
+	Menu templ.Component
+	// The header for a navigation area. On mobile this will be the header for <wa-drawer>.
+	NavigationHeader templ.Component
+	// The main content to display in the navigation area. This is displayed on the left side of the page, if menu is not us...
+	Navigation templ.Component
+	// The footer for a navigation area. On mobile this will be the footer for <wa-drawer>.
+	NavigationFooter templ.Component
+	// Use this slot to slot in your own button + icon for toggling the navigation drawer. By default it is a <wa-button> + ...
+	NavigationToggle templ.Component
+	// Use this to slot in your own icon for toggling the navigation drawer. By default it is 3 bars <wa-icon>.
+	NavigationToggleIcon templ.Component
+	// Header to display inline above the main content.
+	MainHeader templ.Component
+	// Footer to display inline below the main content.
+	MainFooter templ.Component
+	// Content to be shown on the right side of the page. Typically contains a table of contents, ads, etc. This section "st...
+	Aside templ.Component
+	// The "skip to content" slot. You can override this If you would like to override the Skip to content button and add ad...
+	SkipToContent templ.Component
+	// The content to display in the footer. This is always displayed underneath the viewport so will always make the page "...
+	Footer templ.Component
+}
+
+// PageBuilder provides a fluent API for constructing PageProps
+type PageBuilder struct {
+	props PageProps
+}
+
+// NewPage creates a new builder for wa-page
+func NewPage() *PageBuilder {
+	return &PageBuilder{}
+}
+
+// View sets the view attribute
+// The view is a reflection of the "mobileBreakpoint", when the page is larger than the mobile-breakpoint (768px by
+func (b *PageBuilder) View(v string) *PageBuilder {
+	b.props.View = v
+	return b
+}
+
+// NavOpen sets the nav-open attribute
+// Whether or not the navigation drawer is open. Note, the navigation drawer is only "open" on mobile views.
+func (b *PageBuilder) NavOpen(v bool) *PageBuilder {
+	b.props.NavOpen = v
+	return b
+}
+
+// MobileBreakpoint sets the mobile-breakpoint attribute
+// At what page width to hide the "navigation" slot and collapse into a hamburger button.
+func (b *PageBuilder) MobileBreakpoint(v string) *PageBuilder {
+	b.props.MobileBreakpoint = v
+	return b
+}
+
+// NavigationPlacement sets the navigation-placement attribute
+// Where to place the navigation when in the mobile viewport.
+func (b *PageBuilder) NavigationPlacement(v string) *PageBuilder {
+	b.props.NavigationPlacement = v
+	return b
+}
+
+// DisableNavigationToggle sets the disable-navigation-toggle attribute
+// Determines whether or not to hide the default hamburger button.
+func (b *PageBuilder) DisableNavigationToggle(v bool) *PageBuilder {
+	b.props.DisableNavigationToggle = v
+	return b
+}
+
+// BannerSlot sets the banner slot content
+// The banner that gets display above the header. The banner will not be shown if no content is provided.
+func (b *PageBuilder) BannerSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Banner = c
+	return b
+}
+
+// HeaderSlot sets the header slot content
+// The header to display at the top of the page. If a banner is present, the header will appear below the banner. The he...
+func (b *PageBuilder) HeaderSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Header = c
+	return b
+}
+
+// SubheaderSlot sets the subheader slot content
+// A subheader to display below the header. This is a good place to put things like breadcrumbs.
+func (b *PageBuilder) SubheaderSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Subheader = c
+	return b
+}
+
+// MenuSlot sets the menu slot content
+// The left side of the page. If you slot an element in here, you will override the default navigation slot and will be ...
+func (b *PageBuilder) MenuSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Menu = c
+	return b
+}
+
+// NavigationHeaderSlot sets the navigation-header slot content
+// The header for a navigation area. On mobile this will be the header for <wa-drawer>.
+func (b *PageBuilder) NavigationHeaderSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.NavigationHeader = c
+	return b
+}
+
+// NavigationSlot sets the navigation slot content
+// The main content to display in the navigation area. This is displayed on the left side of the page, if menu is not us...
+func (b *PageBuilder) NavigationSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Navigation = c
+	return b
+}
+
+// NavigationFooterSlot sets the navigation-footer slot content
+// The footer for a navigation area. On mobile this will be the footer for <wa-drawer>.
+func (b *PageBuilder) NavigationFooterSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.NavigationFooter = c
+	return b
+}
+
+// NavigationToggleSlot sets the navigation-toggle slot content
+// Use this slot to slot in your own button + icon for toggling the navigation drawer. By default it is a <wa-button> + ...
+func (b *PageBuilder) NavigationToggleSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.NavigationToggle = c
+	return b
+}
+
+// NavigationToggleIconSlot sets the navigation-toggle-icon slot content
+// Use this to slot in your own icon for toggling the navigation drawer. By default it is 3 bars <wa-icon>.
+func (b *PageBuilder) NavigationToggleIconSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.NavigationToggleIcon = c
+	return b
+}
+
+// MainHeaderSlot sets the main-header slot content
+// Header to display inline above the main content.
+func (b *PageBuilder) MainHeaderSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.MainHeader = c
+	return b
+}
+
+// MainFooterSlot sets the main-footer slot content
+// Footer to display inline below the main content.
+func (b *PageBuilder) MainFooterSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.MainFooter = c
+	return b
+}
+
+// AsideSlot sets the aside slot content
+// Content to be shown on the right side of the page. Typically contains a table of contents, ads, etc. This section "st...
+func (b *PageBuilder) AsideSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Aside = c
+	return b
+}
+
+// SkipToContentSlot sets the skip-to-content slot content
+// The "skip to content" slot. You can override this If you would like to override the Skip to content button and add ad...
+func (b *PageBuilder) SkipToContentSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.SkipToContent = c
+	return b
+}
+
+// FooterSlot sets the footer slot content
+// The content to display in the footer. This is always displayed underneath the viewport so will always make the page "...
+func (b *PageBuilder) FooterSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Footer = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *PageBuilder) Attr(name, value string) *PageBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *PageBuilder) Attrs(attrs templ.Attributes) *PageBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *PageBuilder) Props() PageProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *PageBuilder) Build() PageProps {
+	return b.props
+}
+
+// Page renders the wa-page component
+templ Page(props PageProps) {
+	<wa-page
+		if props.View != "" {
+			view={ props.View }
+		}
+		if props.NavOpen {
+			nav-open
+		}
+		if props.MobileBreakpoint != "" {
+			mobile-breakpoint={ props.MobileBreakpoint }
+		}
+		if props.NavigationPlacement != "" {
+			navigation-placement={ props.NavigationPlacement }
+		}
+		if props.DisableNavigationToggle {
+			disable-navigation-toggle
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Banner != nil {
+			<div slot="banner">
+				@props.Slots.Banner
+			</div>
+		}
+		if props.Slots.Header != nil {
+			<div slot="header">
+				@props.Slots.Header
+			</div>
+		}
+		if props.Slots.Subheader != nil {
+			<div slot="subheader">
+				@props.Slots.Subheader
+			</div>
+		}
+		if props.Slots.Menu != nil {
+			<div slot="menu">
+				@props.Slots.Menu
+			</div>
+		}
+		if props.Slots.NavigationHeader != nil {
+			<div slot="navigation-header">
+				@props.Slots.NavigationHeader
+			</div>
+		}
+		if props.Slots.Navigation != nil {
+			<div slot="navigation">
+				@props.Slots.Navigation
+			</div>
+		}
+		if props.Slots.NavigationFooter != nil {
+			<div slot="navigation-footer">
+				@props.Slots.NavigationFooter
+			</div>
+		}
+		if props.Slots.NavigationToggle != nil {
+			<div slot="navigation-toggle">
+				@props.Slots.NavigationToggle
+			</div>
+		}
+		if props.Slots.NavigationToggleIcon != nil {
+			<div slot="navigation-toggle-icon">
+				@props.Slots.NavigationToggleIcon
+			</div>
+		}
+		if props.Slots.MainHeader != nil {
+			<div slot="main-header">
+				@props.Slots.MainHeader
+			</div>
+		}
+		if props.Slots.MainFooter != nil {
+			<div slot="main-footer">
+				@props.Slots.MainFooter
+			</div>
+		}
+		if props.Slots.Aside != nil {
+			<div slot="aside">
+				@props.Slots.Aside
+			</div>
+		}
+		if props.Slots.SkipToContent != nil {
+			<div slot="skip-to-content">
+				@props.Slots.SkipToContent
+			</div>
+		}
+		if props.Slots.Footer != nil {
+			<div slot="footer">
+				@props.Slots.Footer
+			</div>
+		}
+		{ children... }
+	</wa-page>
+}
+
+// PageFunc renders with a builder function for inline configuration
+templ PageFunc(fn func(*PageBuilder)) {
+	{{ b := NewPage(); fn(b) }}
+	@Page(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/page_templ.go

@@ -0,0 +1,613 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-page
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Pages offer an easy way to scaffold entire page layouts using minimal markup.
+//
+// Web Awesome component: <wa-page>
+
+// PageProps holds all properties for the wa-page component
+type PageProps struct {
+	// The view is a reflection of the "mobileBreakpoint", when the page is larger than the mobile-breakpoint (768px by
+	// Valid values: "mobile", "desktop"
+	View string `attr:"view"`
+	// Whether or not the navigation drawer is open. Note, the navigation drawer is only "open" on mobile views.
+	NavOpen bool `attr:"nav-open"`
+	// At what page width to hide the "navigation" slot and collapse into a hamburger button.
+	MobileBreakpoint string `attr:"mobile-breakpoint"`
+	// Where to place the navigation when in the mobile viewport.
+	// Valid values: "start", "end"
+	NavigationPlacement string `attr:"navigation-placement"`
+	// Determines whether or not to hide the default hamburger button.
+	DisableNavigationToggle bool `attr:"disable-navigation-toggle"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots PageSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// PageSlots holds named slot content for the component
+type PageSlots struct {
+	// The banner that gets display above the header. The banner will not be shown if no content is provided.
+	Banner templ.Component
+	// The header to display at the top of the page. If a banner is present, the header will appear below the banner. The he...
+	Header templ.Component
+	// A subheader to display below the header. This is a good place to put things like breadcrumbs.
+	Subheader templ.Component
+	// The left side of the page. If you slot an element in here, you will override the default navigation slot and will be ...
+	Menu templ.Component
+	// The header for a navigation area. On mobile this will be the header for <wa-drawer>.
+	NavigationHeader templ.Component
+	// The main content to display in the navigation area. This is displayed on the left side of the page, if menu is not us...
+	Navigation templ.Component
+	// The footer for a navigation area. On mobile this will be the footer for <wa-drawer>.
+	NavigationFooter templ.Component
+	// Use this slot to slot in your own button + icon for toggling the navigation drawer. By default it is a <wa-button> + ...
+	NavigationToggle templ.Component
+	// Use this to slot in your own icon for toggling the navigation drawer. By default it is 3 bars <wa-icon>.
+	NavigationToggleIcon templ.Component
+	// Header to display inline above the main content.
+	MainHeader templ.Component
+	// Footer to display inline below the main content.
+	MainFooter templ.Component
+	// Content to be shown on the right side of the page. Typically contains a table of contents, ads, etc. This section "st...
+	Aside templ.Component
+	// The "skip to content" slot. You can override this If you would like to override the Skip to content button and add ad...
+	SkipToContent templ.Component
+	// The content to display in the footer. This is always displayed underneath the viewport so will always make the page "...
+	Footer templ.Component
+}
+
+// PageBuilder provides a fluent API for constructing PageProps
+type PageBuilder struct {
+	props PageProps
+}
+
+// NewPage creates a new builder for wa-page
+func NewPage() *PageBuilder {
+	return &PageBuilder{}
+}
+
+// View sets the view attribute
+// The view is a reflection of the "mobileBreakpoint", when the page is larger than the mobile-breakpoint (768px by
+func (b *PageBuilder) View(v string) *PageBuilder {
+	b.props.View = v
+	return b
+}
+
+// NavOpen sets the nav-open attribute
+// Whether or not the navigation drawer is open. Note, the navigation drawer is only "open" on mobile views.
+func (b *PageBuilder) NavOpen(v bool) *PageBuilder {
+	b.props.NavOpen = v
+	return b
+}
+
+// MobileBreakpoint sets the mobile-breakpoint attribute
+// At what page width to hide the "navigation" slot and collapse into a hamburger button.
+func (b *PageBuilder) MobileBreakpoint(v string) *PageBuilder {
+	b.props.MobileBreakpoint = v
+	return b
+}
+
+// NavigationPlacement sets the navigation-placement attribute
+// Where to place the navigation when in the mobile viewport.
+func (b *PageBuilder) NavigationPlacement(v string) *PageBuilder {
+	b.props.NavigationPlacement = v
+	return b
+}
+
+// DisableNavigationToggle sets the disable-navigation-toggle attribute
+// Determines whether or not to hide the default hamburger button.
+func (b *PageBuilder) DisableNavigationToggle(v bool) *PageBuilder {
+	b.props.DisableNavigationToggle = v
+	return b
+}
+
+// BannerSlot sets the banner slot content
+// The banner that gets display above the header. The banner will not be shown if no content is provided.
+func (b *PageBuilder) BannerSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Banner = c
+	return b
+}
+
+// HeaderSlot sets the header slot content
+// The header to display at the top of the page. If a banner is present, the header will appear below the banner. The he...
+func (b *PageBuilder) HeaderSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Header = c
+	return b
+}
+
+// SubheaderSlot sets the subheader slot content
+// A subheader to display below the header. This is a good place to put things like breadcrumbs.
+func (b *PageBuilder) SubheaderSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Subheader = c
+	return b
+}
+
+// MenuSlot sets the menu slot content
+// The left side of the page. If you slot an element in here, you will override the default navigation slot and will be ...
+func (b *PageBuilder) MenuSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Menu = c
+	return b
+}
+
+// NavigationHeaderSlot sets the navigation-header slot content
+// The header for a navigation area. On mobile this will be the header for <wa-drawer>.
+func (b *PageBuilder) NavigationHeaderSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.NavigationHeader = c
+	return b
+}
+
+// NavigationSlot sets the navigation slot content
+// The main content to display in the navigation area. This is displayed on the left side of the page, if menu is not us...
+func (b *PageBuilder) NavigationSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Navigation = c
+	return b
+}
+
+// NavigationFooterSlot sets the navigation-footer slot content
+// The footer for a navigation area. On mobile this will be the footer for <wa-drawer>.
+func (b *PageBuilder) NavigationFooterSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.NavigationFooter = c
+	return b
+}
+
+// NavigationToggleSlot sets the navigation-toggle slot content
+// Use this slot to slot in your own button + icon for toggling the navigation drawer. By default it is a <wa-button> + ...
+func (b *PageBuilder) NavigationToggleSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.NavigationToggle = c
+	return b
+}
+
+// NavigationToggleIconSlot sets the navigation-toggle-icon slot content
+// Use this to slot in your own icon for toggling the navigation drawer. By default it is 3 bars <wa-icon>.
+func (b *PageBuilder) NavigationToggleIconSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.NavigationToggleIcon = c
+	return b
+}
+
+// MainHeaderSlot sets the main-header slot content
+// Header to display inline above the main content.
+func (b *PageBuilder) MainHeaderSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.MainHeader = c
+	return b
+}
+
+// MainFooterSlot sets the main-footer slot content
+// Footer to display inline below the main content.
+func (b *PageBuilder) MainFooterSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.MainFooter = c
+	return b
+}
+
+// AsideSlot sets the aside slot content
+// Content to be shown on the right side of the page. Typically contains a table of contents, ads, etc. This section "st...
+func (b *PageBuilder) AsideSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Aside = c
+	return b
+}
+
+// SkipToContentSlot sets the skip-to-content slot content
+// The "skip to content" slot. You can override this If you would like to override the Skip to content button and add ad...
+func (b *PageBuilder) SkipToContentSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.SkipToContent = c
+	return b
+}
+
+// FooterSlot sets the footer slot content
+// The content to display in the footer. This is always displayed underneath the viewport so will always make the page "...
+func (b *PageBuilder) FooterSlot(c templ.Component) *PageBuilder {
+	b.props.Slots.Footer = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *PageBuilder) Attr(name, value string) *PageBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *PageBuilder) Attrs(attrs templ.Attributes) *PageBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *PageBuilder) Props() PageProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *PageBuilder) Build() PageProps {
+	return b.props
+}
+
+// Page renders the wa-page component
+func Page(props PageProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-page")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.View != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " view=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.View)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/page.templ`, Line: 247, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.NavOpen {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " nav-open")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.MobileBreakpoint != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " mobile-breakpoint=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.MobileBreakpoint)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/page.templ`, Line: 253, Col: 45}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.NavigationPlacement != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " navigation-placement=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.NavigationPlacement)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/page.templ`, Line: 256, Col: 51}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.DisableNavigationToggle {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " disable-navigation-toggle")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Banner != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "<div slot=\"banner\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Banner.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Header != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "<div slot=\"header\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Header.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Subheader != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "<div slot=\"subheader\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Subheader.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Menu != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "<div slot=\"menu\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Menu.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.NavigationHeader != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "<div slot=\"navigation-header\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.NavigationHeader.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Navigation != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "<div slot=\"navigation\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Navigation.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.NavigationFooter != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "<div slot=\"navigation-footer\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.NavigationFooter.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.NavigationToggle != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "<div slot=\"navigation-toggle\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.NavigationToggle.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.NavigationToggleIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "<div slot=\"navigation-toggle-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.NavigationToggleIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.MainHeader != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, "<div slot=\"main-header\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.MainHeader.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.MainFooter != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "<div slot=\"main-footer\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.MainFooter.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Aside != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, "<div slot=\"aside\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Aside.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.SkipToContent != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, "<div slot=\"skip-to-content\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.SkipToContent.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Footer != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, "<div slot=\"footer\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Footer.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "</wa-page>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// PageFunc renders with a builder function for inline configuration
+func PageFunc(fn func(*PageBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var5 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var5 == nil {
+			templ_7745c5c3_Var5 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewPage()
+		fn(b)
+		templ_7745c5c3_Var6 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var5.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Page(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var6), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/popover.templ

@@ -0,0 +1,202 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-popover
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Popovers display contextual content and interactive elements in a floating panel.
+//
+// Web Awesome component: <wa-popover>
+
+// PopoverProps holds all properties for the wa-popover component
+type PopoverProps struct {
+	// The preferred placement of the popover. Note that the actual placement may vary as needed to keep the popover
+	// Valid values: "top", "top-start", "top-end", "right", "right-start", "right-end", "bottom", "bottom-start", "bottom-end", "left", "left-start", "left-end"
+	Placement string `attr:"placement"`
+	// Shows or hides the popover.
+	Open bool `attr:"open"`
+	// The distance in pixels from which to offset the popover away from its target.
+	Distance float64 `attr:"distance"`
+	// The distance in pixels from which to offset the popover along its target.
+	Skidding float64 `attr:"skidding"`
+	// The ID of the popover's anchor element. This must be an interactive/focusable element such as a button.
+	For string `attr:"for"`
+	// Removes the arrow from the popover.
+	WithoutArrow bool `attr:"without-arrow"`
+
+	// Events
+	// Emitted when the popover begins to show. Canceling this event will stop the popover from showing.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the popover has shown and all animations are complete.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the popover begins to hide. Canceling this event will stop the popover from hiding.
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the popover has hidden and all animations are complete.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+
+	// Slots contains named slot content
+	Slots PopoverSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// PopoverBuilder provides a fluent API for constructing PopoverProps
+type PopoverBuilder struct {
+	props PopoverProps
+}
+
+// NewPopover creates a new builder for wa-popover
+func NewPopover() *PopoverBuilder {
+	return &PopoverBuilder{}
+}
+
+// Placement sets the placement attribute
+// The preferred placement of the popover. Note that the actual placement may vary as needed to keep the popover
+func (b *PopoverBuilder) Placement(v string) *PopoverBuilder {
+	b.props.Placement = v
+	return b
+}
+
+// Open sets the open attribute
+// Shows or hides the popover.
+func (b *PopoverBuilder) Open(v bool) *PopoverBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Distance sets the distance attribute
+// The distance in pixels from which to offset the popover away from its target.
+func (b *PopoverBuilder) Distance(v float64) *PopoverBuilder {
+	b.props.Distance = v
+	return b
+}
+
+// Skidding sets the skidding attribute
+// The distance in pixels from which to offset the popover along its target.
+func (b *PopoverBuilder) Skidding(v float64) *PopoverBuilder {
+	b.props.Skidding = v
+	return b
+}
+
+// For sets the for attribute
+// The ID of the popover's anchor element. This must be an interactive/focusable element such as a button.
+func (b *PopoverBuilder) For(v string) *PopoverBuilder {
+	b.props.For = v
+	return b
+}
+
+// WithoutArrow sets the without-arrow attribute
+// Removes the arrow from the popover.
+func (b *PopoverBuilder) WithoutArrow(v bool) *PopoverBuilder {
+	b.props.WithoutArrow = v
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the popover begins to show. Canceling this event will stop the popover from showing.
+func (b *PopoverBuilder) OnShow(handler string) *PopoverBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the popover has shown and all animations are complete.
+func (b *PopoverBuilder) OnAfterShow(handler string) *PopoverBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the popover begins to hide. Canceling this event will stop the popover from hiding.
+func (b *PopoverBuilder) OnHide(handler string) *PopoverBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the popover has hidden and all animations are complete.
+func (b *PopoverBuilder) OnAfterHide(handler string) *PopoverBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *PopoverBuilder) Attr(name, value string) *PopoverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *PopoverBuilder) Attrs(attrs templ.Attributes) *PopoverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *PopoverBuilder) Props() PopoverProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *PopoverBuilder) Build() PopoverProps {
+	return b.props
+}
+
+// Popover renders the wa-popover component
+templ Popover(props PopoverProps) {
+	<wa-popover
+		if props.Placement != "" {
+			placement={ props.Placement }
+		}
+		if props.Open {
+			open
+		}
+		if props.Distance != 0 {
+			distance={ templ.Sprintf("%v", props.Distance) }
+		}
+		if props.Skidding != 0 {
+			skidding={ templ.Sprintf("%v", props.Skidding) }
+		}
+		if props.For != "" {
+			for={ props.For }
+		}
+		if props.WithoutArrow {
+			without-arrow
+		}
+		if props.OnShow != "" {
+			x-on:wa-show={ props.OnShow }
+		}
+		if props.OnAfterShow != "" {
+			x-on:wa-after-show={ props.OnAfterShow }
+		}
+		if props.OnHide != "" {
+			x-on:wa-hide={ props.OnHide }
+		}
+		if props.OnAfterHide != "" {
+			x-on:wa-after-hide={ props.OnAfterHide }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-popover>
+}
+
+// PopoverFunc renders with a builder function for inline configuration
+templ PopoverFunc(fn func(*PopoverBuilder)) {
+	{{ b := NewPopover(); fn(b) }}
+	@Popover(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/popover_templ.go

@@ -0,0 +1,426 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-popover
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Popovers display contextual content and interactive elements in a floating panel.
+//
+// Web Awesome component: <wa-popover>
+
+// PopoverProps holds all properties for the wa-popover component
+type PopoverProps struct {
+	// The preferred placement of the popover. Note that the actual placement may vary as needed to keep the popover
+	// Valid values: "top", "top-start", "top-end", "right", "right-start", "right-end", "bottom", "bottom-start", "bottom-end", "left", "left-start", "left-end"
+	Placement string `attr:"placement"`
+	// Shows or hides the popover.
+	Open bool `attr:"open"`
+	// The distance in pixels from which to offset the popover away from its target.
+	Distance float64 `attr:"distance"`
+	// The distance in pixels from which to offset the popover along its target.
+	Skidding float64 `attr:"skidding"`
+	// The ID of the popover's anchor element. This must be an interactive/focusable element such as a button.
+	For string `attr:"for"`
+	// Removes the arrow from the popover.
+	WithoutArrow bool `attr:"without-arrow"`
+
+	// Events
+	// Emitted when the popover begins to show. Canceling this event will stop the popover from showing.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the popover has shown and all animations are complete.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the popover begins to hide. Canceling this event will stop the popover from hiding.
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the popover has hidden and all animations are complete.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+
+	// Slots contains named slot content
+	Slots PopoverSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// PopoverBuilder provides a fluent API for constructing PopoverProps
+type PopoverBuilder struct {
+	props PopoverProps
+}
+
+// NewPopover creates a new builder for wa-popover
+func NewPopover() *PopoverBuilder {
+	return &PopoverBuilder{}
+}
+
+// Placement sets the placement attribute
+// The preferred placement of the popover. Note that the actual placement may vary as needed to keep the popover
+func (b *PopoverBuilder) Placement(v string) *PopoverBuilder {
+	b.props.Placement = v
+	return b
+}
+
+// Open sets the open attribute
+// Shows or hides the popover.
+func (b *PopoverBuilder) Open(v bool) *PopoverBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Distance sets the distance attribute
+// The distance in pixels from which to offset the popover away from its target.
+func (b *PopoverBuilder) Distance(v float64) *PopoverBuilder {
+	b.props.Distance = v
+	return b
+}
+
+// Skidding sets the skidding attribute
+// The distance in pixels from which to offset the popover along its target.
+func (b *PopoverBuilder) Skidding(v float64) *PopoverBuilder {
+	b.props.Skidding = v
+	return b
+}
+
+// For sets the for attribute
+// The ID of the popover's anchor element. This must be an interactive/focusable element such as a button.
+func (b *PopoverBuilder) For(v string) *PopoverBuilder {
+	b.props.For = v
+	return b
+}
+
+// WithoutArrow sets the without-arrow attribute
+// Removes the arrow from the popover.
+func (b *PopoverBuilder) WithoutArrow(v bool) *PopoverBuilder {
+	b.props.WithoutArrow = v
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the popover begins to show. Canceling this event will stop the popover from showing.
+func (b *PopoverBuilder) OnShow(handler string) *PopoverBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the popover has shown and all animations are complete.
+func (b *PopoverBuilder) OnAfterShow(handler string) *PopoverBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the popover begins to hide. Canceling this event will stop the popover from hiding.
+func (b *PopoverBuilder) OnHide(handler string) *PopoverBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the popover has hidden and all animations are complete.
+func (b *PopoverBuilder) OnAfterHide(handler string) *PopoverBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *PopoverBuilder) Attr(name, value string) *PopoverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *PopoverBuilder) Attrs(attrs templ.Attributes) *PopoverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *PopoverBuilder) Props() PopoverProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *PopoverBuilder) Build() PopoverProps {
+	return b.props
+}
+
+// Popover renders the wa-popover component
+func Popover(props PopoverProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-popover")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Placement != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " placement=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Placement)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popover.templ`, Line: 161, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Open {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " open")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Distance != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " distance=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Distance))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popover.templ`, Line: 167, Col: 49}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Skidding != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " skidding=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Skidding))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popover.templ`, Line: 170, Col: 49}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.For != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " for=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.For)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popover.templ`, Line: 173, Col: 18}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithoutArrow {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " without-arrow")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " x-on:wa-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popover.templ`, Line: 179, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " x-on:wa-after-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popover.templ`, Line: 182, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " x-on:wa-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popover.templ`, Line: 185, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, " x-on:wa-after-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popover.templ`, Line: 188, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "</wa-popover>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// PopoverFunc renders with a builder function for inline configuration
+func PopoverFunc(fn func(*PopoverBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var10 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var10 == nil {
+			templ_7745c5c3_Var10 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewPopover()
+		fn(b)
+		templ_7745c5c3_Var11 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var10.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Popover(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var11), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/popup.templ

@@ -0,0 +1,381 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-popup
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Popup is a utility that lets you declaratively anchor "popup" containers to another element.
+//
+// Web Awesome component: <wa-popup>
+
+// PopupProps holds all properties for the wa-popup component
+type PopupProps struct {
+	// The element the popup will be anchored to. If the anchor lives outside of the popup, you can provide the anchor
+	Anchor string `attr:"anchor"`
+	// Activates the positioning logic and shows the popup. When this attribute is removed, the positioning logic is torn
+	Active bool `attr:"active"`
+	// The preferred placement of the popup. Note that the actual placement will vary as configured to keep the
+	// Valid values: "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "right", "right-start", "right-end", "left", "left-start", "left-end"
+	Placement string `attr:"placement"`
+	// The bounding box to use for flipping, shifting, and auto-sizing.
+	// Valid values: "viewport", "scroll"
+	Boundary string `attr:"boundary"`
+	// The distance in pixels from which to offset the panel away from its anchor.
+	Distance float64 `attr:"distance"`
+	// The distance in pixels from which to offset the panel along its anchor.
+	Skidding float64 `attr:"skidding"`
+	// Attaches an arrow to the popup. The arrow's size and color can be customized using the --arrow-size and
+	Arrow bool `attr:"arrow"`
+	// The placement of the arrow. The default is anchor, which will align the arrow as close to the center of the
+	// Valid values: "start", "end", "center", "anchor"
+	ArrowPlacement string `attr:"arrow-placement"`
+	// The amount of padding between the arrow and the edges of the popup. If the popup has a border-radius, for example,
+	ArrowPadding float64 `attr:"arrow-padding"`
+	// When set, placement of the popup will flip to the opposite site to keep it in view. You can use
+	Flip bool `attr:"flip"`
+	// If the preferred placement doesn't fit, popup will be tested in these fallback placements until one fits. Must be a
+	FlipFallbackPlacements string `attr:"flip-fallback-placements"`
+	// When neither the preferred placement nor the fallback placements fit, this value will be used to determine whether
+	// Valid values: "best-fit", "initial"
+	FlipFallbackStrategy string `attr:"flip-fallback-strategy"`
+	// The flip boundary describes clipping element(s) that overflow will be checked relative to when flipping. By
+	FlipBoundary string `attr:"flipBoundary"`
+	// The amount of padding, in pixels, to exceed before the flip behavior will occur.
+	FlipPadding float64 `attr:"flip-padding"`
+	// Moves the popup along the axis to keep it in view when clipped.
+	Shift bool `attr:"shift"`
+	// The shift boundary describes clipping element(s) that overflow will be checked relative to when shifting. By
+	ShiftBoundary string `attr:"shiftBoundary"`
+	// The amount of padding, in pixels, to exceed before the shift behavior will occur.
+	ShiftPadding float64 `attr:"shift-padding"`
+	// When set, this will cause the popup to automatically resize itself to prevent it from overflowing.
+	// Valid values: "horizontal", "vertical", "both"
+	AutoSize string `attr:"auto-size"`
+	// Syncs the popup's width or height to that of the anchor element.
+	// Valid values: "width", "height", "both"
+	Sync string `attr:"sync"`
+	// The auto-size boundary describes clipping element(s) that overflow will be checked relative to when resizing. By
+	AutoSizeBoundary string `attr:"autoSizeBoundary"`
+	// The amount of padding, in pixels, to exceed before the auto-size behavior will occur.
+	AutoSizePadding float64 `attr:"auto-size-padding"`
+	// When a gap exists between the anchor and the popup element, this option will add a "hover bridge" that fills the
+	HoverBridge bool `attr:"hover-bridge"`
+
+	// Events
+	// Emitted when the popup is repositioned. This event can fire a lot, so avoid putting expensive operations in your list...
+	OnReposition string `attr:"x-on:wa-reposition"`
+
+	// Slots contains named slot content
+	Slots PopupSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// PopupSlots holds named slot content for the component
+type PopupSlots struct {
+	// The element the popup will be anchored to. If the anchor lives outside of the popup, you can use the anchor attribute...
+	Anchor templ.Component
+}
+
+// PopupBuilder provides a fluent API for constructing PopupProps
+type PopupBuilder struct {
+	props PopupProps
+}
+
+// NewPopup creates a new builder for wa-popup
+func NewPopup() *PopupBuilder {
+	return &PopupBuilder{}
+}
+
+// Anchor sets the anchor attribute
+// The element the popup will be anchored to. If the anchor lives outside of the popup, you can provide the anchor
+func (b *PopupBuilder) Anchor(v string) *PopupBuilder {
+	b.props.Anchor = v
+	return b
+}
+
+// Active sets the active attribute
+// Activates the positioning logic and shows the popup. When this attribute is removed, the positioning logic is torn
+func (b *PopupBuilder) Active(v bool) *PopupBuilder {
+	b.props.Active = v
+	return b
+}
+
+// Placement sets the placement attribute
+// The preferred placement of the popup. Note that the actual placement will vary as configured to keep the
+func (b *PopupBuilder) Placement(v string) *PopupBuilder {
+	b.props.Placement = v
+	return b
+}
+
+// Boundary sets the boundary attribute
+// The bounding box to use for flipping, shifting, and auto-sizing.
+func (b *PopupBuilder) Boundary(v string) *PopupBuilder {
+	b.props.Boundary = v
+	return b
+}
+
+// Distance sets the distance attribute
+// The distance in pixels from which to offset the panel away from its anchor.
+func (b *PopupBuilder) Distance(v float64) *PopupBuilder {
+	b.props.Distance = v
+	return b
+}
+
+// Skidding sets the skidding attribute
+// The distance in pixels from which to offset the panel along its anchor.
+func (b *PopupBuilder) Skidding(v float64) *PopupBuilder {
+	b.props.Skidding = v
+	return b
+}
+
+// Arrow sets the arrow attribute
+// Attaches an arrow to the popup. The arrow's size and color can be customized using the --arrow-size and
+func (b *PopupBuilder) Arrow(v bool) *PopupBuilder {
+	b.props.Arrow = v
+	return b
+}
+
+// ArrowPlacement sets the arrow-placement attribute
+// The placement of the arrow. The default is anchor, which will align the arrow as close to the center of the
+func (b *PopupBuilder) ArrowPlacement(v string) *PopupBuilder {
+	b.props.ArrowPlacement = v
+	return b
+}
+
+// ArrowPadding sets the arrow-padding attribute
+// The amount of padding between the arrow and the edges of the popup. If the popup has a border-radius, for example,
+func (b *PopupBuilder) ArrowPadding(v float64) *PopupBuilder {
+	b.props.ArrowPadding = v
+	return b
+}
+
+// Flip sets the flip attribute
+// When set, placement of the popup will flip to the opposite site to keep it in view. You can use
+func (b *PopupBuilder) Flip(v bool) *PopupBuilder {
+	b.props.Flip = v
+	return b
+}
+
+// FlipFallbackPlacements sets the flip-fallback-placements attribute
+// If the preferred placement doesn't fit, popup will be tested in these fallback placements until one fits. Must be a
+func (b *PopupBuilder) FlipFallbackPlacements(v string) *PopupBuilder {
+	b.props.FlipFallbackPlacements = v
+	return b
+}
+
+// FlipFallbackStrategy sets the flip-fallback-strategy attribute
+// When neither the preferred placement nor the fallback placements fit, this value will be used to determine whether
+func (b *PopupBuilder) FlipFallbackStrategy(v string) *PopupBuilder {
+	b.props.FlipFallbackStrategy = v
+	return b
+}
+
+// FlipBoundary sets the flipBoundary attribute
+// The flip boundary describes clipping element(s) that overflow will be checked relative to when flipping. By
+func (b *PopupBuilder) FlipBoundary(v string) *PopupBuilder {
+	b.props.FlipBoundary = v
+	return b
+}
+
+// FlipPadding sets the flip-padding attribute
+// The amount of padding, in pixels, to exceed before the flip behavior will occur.
+func (b *PopupBuilder) FlipPadding(v float64) *PopupBuilder {
+	b.props.FlipPadding = v
+	return b
+}
+
+// Shift sets the shift attribute
+// Moves the popup along the axis to keep it in view when clipped.
+func (b *PopupBuilder) Shift(v bool) *PopupBuilder {
+	b.props.Shift = v
+	return b
+}
+
+// ShiftBoundary sets the shiftBoundary attribute
+// The shift boundary describes clipping element(s) that overflow will be checked relative to when shifting. By
+func (b *PopupBuilder) ShiftBoundary(v string) *PopupBuilder {
+	b.props.ShiftBoundary = v
+	return b
+}
+
+// ShiftPadding sets the shift-padding attribute
+// The amount of padding, in pixels, to exceed before the shift behavior will occur.
+func (b *PopupBuilder) ShiftPadding(v float64) *PopupBuilder {
+	b.props.ShiftPadding = v
+	return b
+}
+
+// AutoSize sets the auto-size attribute
+// When set, this will cause the popup to automatically resize itself to prevent it from overflowing.
+func (b *PopupBuilder) AutoSize(v string) *PopupBuilder {
+	b.props.AutoSize = v
+	return b
+}
+
+// Sync sets the sync attribute
+// Syncs the popup's width or height to that of the anchor element.
+func (b *PopupBuilder) Sync(v string) *PopupBuilder {
+	b.props.Sync = v
+	return b
+}
+
+// AutoSizeBoundary sets the autoSizeBoundary attribute
+// The auto-size boundary describes clipping element(s) that overflow will be checked relative to when resizing. By
+func (b *PopupBuilder) AutoSizeBoundary(v string) *PopupBuilder {
+	b.props.AutoSizeBoundary = v
+	return b
+}
+
+// AutoSizePadding sets the auto-size-padding attribute
+// The amount of padding, in pixels, to exceed before the auto-size behavior will occur.
+func (b *PopupBuilder) AutoSizePadding(v float64) *PopupBuilder {
+	b.props.AutoSizePadding = v
+	return b
+}
+
+// HoverBridge sets the hover-bridge attribute
+// When a gap exists between the anchor and the popup element, this option will add a "hover bridge" that fills the
+func (b *PopupBuilder) HoverBridge(v bool) *PopupBuilder {
+	b.props.HoverBridge = v
+	return b
+}
+
+// OnReposition sets the handler for wa-reposition event
+// Emitted when the popup is repositioned. This event can fire a lot, so avoid putting expensive operations in your list...
+func (b *PopupBuilder) OnReposition(handler string) *PopupBuilder {
+	b.props.OnReposition = handler
+	return b
+}
+
+// AnchorSlot sets the anchor slot content
+// The element the popup will be anchored to. If the anchor lives outside of the popup, you can use the anchor attribute...
+func (b *PopupBuilder) AnchorSlot(c templ.Component) *PopupBuilder {
+	b.props.Slots.Anchor = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *PopupBuilder) Attr(name, value string) *PopupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *PopupBuilder) Attrs(attrs templ.Attributes) *PopupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *PopupBuilder) Props() PopupProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *PopupBuilder) Build() PopupProps {
+	return b.props
+}
+
+// Popup renders the wa-popup component
+templ Popup(props PopupProps) {
+	<wa-popup
+		if props.Anchor != "" {
+			anchor={ props.Anchor }
+		}
+		if props.Active {
+			active
+		}
+		if props.Placement != "" {
+			placement={ props.Placement }
+		}
+		if props.Boundary != "" {
+			boundary={ props.Boundary }
+		}
+		if props.Distance != 0 {
+			distance={ templ.Sprintf("%v", props.Distance) }
+		}
+		if props.Skidding != 0 {
+			skidding={ templ.Sprintf("%v", props.Skidding) }
+		}
+		if props.Arrow {
+			arrow
+		}
+		if props.ArrowPlacement != "" {
+			arrow-placement={ props.ArrowPlacement }
+		}
+		if props.ArrowPadding != 0 {
+			arrow-padding={ templ.Sprintf("%v", props.ArrowPadding) }
+		}
+		if props.Flip {
+			flip
+		}
+		if props.FlipFallbackPlacements != "" {
+			flip-fallback-placements={ props.FlipFallbackPlacements }
+		}
+		if props.FlipFallbackStrategy != "" {
+			flip-fallback-strategy={ props.FlipFallbackStrategy }
+		}
+		if props.FlipBoundary != "" {
+			flipBoundary={ props.FlipBoundary }
+		}
+		if props.FlipPadding != 0 {
+			flip-padding={ templ.Sprintf("%v", props.FlipPadding) }
+		}
+		if props.Shift {
+			shift
+		}
+		if props.ShiftBoundary != "" {
+			shiftBoundary={ props.ShiftBoundary }
+		}
+		if props.ShiftPadding != 0 {
+			shift-padding={ templ.Sprintf("%v", props.ShiftPadding) }
+		}
+		if props.AutoSize != "" {
+			auto-size={ props.AutoSize }
+		}
+		if props.Sync != "" {
+			sync={ props.Sync }
+		}
+		if props.AutoSizeBoundary != "" {
+			autoSizeBoundary={ props.AutoSizeBoundary }
+		}
+		if props.AutoSizePadding != 0 {
+			auto-size-padding={ templ.Sprintf("%v", props.AutoSizePadding) }
+		}
+		if props.HoverBridge {
+			hover-bridge
+		}
+		if props.OnReposition != "" {
+			x-on:wa-reposition={ props.OnReposition }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Anchor != nil {
+			<div slot="anchor">
+				@props.Slots.Anchor
+			</div>
+		}
+		{ children... }
+	</wa-popup>
+}
+
+// PopupFunc renders with a builder function for inline configuration
+templ PopupFunc(fn func(*PopupBuilder)) {
+	{{ b := NewPopup(); fn(b) }}
+	@Popup(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/popup_templ.go

@@ -0,0 +1,783 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-popup
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Popup is a utility that lets you declaratively anchor "popup" containers to another element.
+//
+// Web Awesome component: <wa-popup>
+
+// PopupProps holds all properties for the wa-popup component
+type PopupProps struct {
+	// The element the popup will be anchored to. If the anchor lives outside of the popup, you can provide the anchor
+	Anchor string `attr:"anchor"`
+	// Activates the positioning logic and shows the popup. When this attribute is removed, the positioning logic is torn
+	Active bool `attr:"active"`
+	// The preferred placement of the popup. Note that the actual placement will vary as configured to keep the
+	// Valid values: "top", "top-start", "top-end", "bottom", "bottom-start", "bottom-end", "right", "right-start", "right-end", "left", "left-start", "left-end"
+	Placement string `attr:"placement"`
+	// The bounding box to use for flipping, shifting, and auto-sizing.
+	// Valid values: "viewport", "scroll"
+	Boundary string `attr:"boundary"`
+	// The distance in pixels from which to offset the panel away from its anchor.
+	Distance float64 `attr:"distance"`
+	// The distance in pixels from which to offset the panel along its anchor.
+	Skidding float64 `attr:"skidding"`
+	// Attaches an arrow to the popup. The arrow's size and color can be customized using the --arrow-size and
+	Arrow bool `attr:"arrow"`
+	// The placement of the arrow. The default is anchor, which will align the arrow as close to the center of the
+	// Valid values: "start", "end", "center", "anchor"
+	ArrowPlacement string `attr:"arrow-placement"`
+	// The amount of padding between the arrow and the edges of the popup. If the popup has a border-radius, for example,
+	ArrowPadding float64 `attr:"arrow-padding"`
+	// When set, placement of the popup will flip to the opposite site to keep it in view. You can use
+	Flip bool `attr:"flip"`
+	// If the preferred placement doesn't fit, popup will be tested in these fallback placements until one fits. Must be a
+	FlipFallbackPlacements string `attr:"flip-fallback-placements"`
+	// When neither the preferred placement nor the fallback placements fit, this value will be used to determine whether
+	// Valid values: "best-fit", "initial"
+	FlipFallbackStrategy string `attr:"flip-fallback-strategy"`
+	// The flip boundary describes clipping element(s) that overflow will be checked relative to when flipping. By
+	FlipBoundary string `attr:"flipBoundary"`
+	// The amount of padding, in pixels, to exceed before the flip behavior will occur.
+	FlipPadding float64 `attr:"flip-padding"`
+	// Moves the popup along the axis to keep it in view when clipped.
+	Shift bool `attr:"shift"`
+	// The shift boundary describes clipping element(s) that overflow will be checked relative to when shifting. By
+	ShiftBoundary string `attr:"shiftBoundary"`
+	// The amount of padding, in pixels, to exceed before the shift behavior will occur.
+	ShiftPadding float64 `attr:"shift-padding"`
+	// When set, this will cause the popup to automatically resize itself to prevent it from overflowing.
+	// Valid values: "horizontal", "vertical", "both"
+	AutoSize string `attr:"auto-size"`
+	// Syncs the popup's width or height to that of the anchor element.
+	// Valid values: "width", "height", "both"
+	Sync string `attr:"sync"`
+	// The auto-size boundary describes clipping element(s) that overflow will be checked relative to when resizing. By
+	AutoSizeBoundary string `attr:"autoSizeBoundary"`
+	// The amount of padding, in pixels, to exceed before the auto-size behavior will occur.
+	AutoSizePadding float64 `attr:"auto-size-padding"`
+	// When a gap exists between the anchor and the popup element, this option will add a "hover bridge" that fills the
+	HoverBridge bool `attr:"hover-bridge"`
+
+	// Events
+	// Emitted when the popup is repositioned. This event can fire a lot, so avoid putting expensive operations in your list...
+	OnReposition string `attr:"x-on:wa-reposition"`
+
+	// Slots contains named slot content
+	Slots PopupSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// PopupSlots holds named slot content for the component
+type PopupSlots struct {
+	// The element the popup will be anchored to. If the anchor lives outside of the popup, you can use the anchor attribute...
+	Anchor templ.Component
+}
+
+// PopupBuilder provides a fluent API for constructing PopupProps
+type PopupBuilder struct {
+	props PopupProps
+}
+
+// NewPopup creates a new builder for wa-popup
+func NewPopup() *PopupBuilder {
+	return &PopupBuilder{}
+}
+
+// Anchor sets the anchor attribute
+// The element the popup will be anchored to. If the anchor lives outside of the popup, you can provide the anchor
+func (b *PopupBuilder) Anchor(v string) *PopupBuilder {
+	b.props.Anchor = v
+	return b
+}
+
+// Active sets the active attribute
+// Activates the positioning logic and shows the popup. When this attribute is removed, the positioning logic is torn
+func (b *PopupBuilder) Active(v bool) *PopupBuilder {
+	b.props.Active = v
+	return b
+}
+
+// Placement sets the placement attribute
+// The preferred placement of the popup. Note that the actual placement will vary as configured to keep the
+func (b *PopupBuilder) Placement(v string) *PopupBuilder {
+	b.props.Placement = v
+	return b
+}
+
+// Boundary sets the boundary attribute
+// The bounding box to use for flipping, shifting, and auto-sizing.
+func (b *PopupBuilder) Boundary(v string) *PopupBuilder {
+	b.props.Boundary = v
+	return b
+}
+
+// Distance sets the distance attribute
+// The distance in pixels from which to offset the panel away from its anchor.
+func (b *PopupBuilder) Distance(v float64) *PopupBuilder {
+	b.props.Distance = v
+	return b
+}
+
+// Skidding sets the skidding attribute
+// The distance in pixels from which to offset the panel along its anchor.
+func (b *PopupBuilder) Skidding(v float64) *PopupBuilder {
+	b.props.Skidding = v
+	return b
+}
+
+// Arrow sets the arrow attribute
+// Attaches an arrow to the popup. The arrow's size and color can be customized using the --arrow-size and
+func (b *PopupBuilder) Arrow(v bool) *PopupBuilder {
+	b.props.Arrow = v
+	return b
+}
+
+// ArrowPlacement sets the arrow-placement attribute
+// The placement of the arrow. The default is anchor, which will align the arrow as close to the center of the
+func (b *PopupBuilder) ArrowPlacement(v string) *PopupBuilder {
+	b.props.ArrowPlacement = v
+	return b
+}
+
+// ArrowPadding sets the arrow-padding attribute
+// The amount of padding between the arrow and the edges of the popup. If the popup has a border-radius, for example,
+func (b *PopupBuilder) ArrowPadding(v float64) *PopupBuilder {
+	b.props.ArrowPadding = v
+	return b
+}
+
+// Flip sets the flip attribute
+// When set, placement of the popup will flip to the opposite site to keep it in view. You can use
+func (b *PopupBuilder) Flip(v bool) *PopupBuilder {
+	b.props.Flip = v
+	return b
+}
+
+// FlipFallbackPlacements sets the flip-fallback-placements attribute
+// If the preferred placement doesn't fit, popup will be tested in these fallback placements until one fits. Must be a
+func (b *PopupBuilder) FlipFallbackPlacements(v string) *PopupBuilder {
+	b.props.FlipFallbackPlacements = v
+	return b
+}
+
+// FlipFallbackStrategy sets the flip-fallback-strategy attribute
+// When neither the preferred placement nor the fallback placements fit, this value will be used to determine whether
+func (b *PopupBuilder) FlipFallbackStrategy(v string) *PopupBuilder {
+	b.props.FlipFallbackStrategy = v
+	return b
+}
+
+// FlipBoundary sets the flipBoundary attribute
+// The flip boundary describes clipping element(s) that overflow will be checked relative to when flipping. By
+func (b *PopupBuilder) FlipBoundary(v string) *PopupBuilder {
+	b.props.FlipBoundary = v
+	return b
+}
+
+// FlipPadding sets the flip-padding attribute
+// The amount of padding, in pixels, to exceed before the flip behavior will occur.
+func (b *PopupBuilder) FlipPadding(v float64) *PopupBuilder {
+	b.props.FlipPadding = v
+	return b
+}
+
+// Shift sets the shift attribute
+// Moves the popup along the axis to keep it in view when clipped.
+func (b *PopupBuilder) Shift(v bool) *PopupBuilder {
+	b.props.Shift = v
+	return b
+}
+
+// ShiftBoundary sets the shiftBoundary attribute
+// The shift boundary describes clipping element(s) that overflow will be checked relative to when shifting. By
+func (b *PopupBuilder) ShiftBoundary(v string) *PopupBuilder {
+	b.props.ShiftBoundary = v
+	return b
+}
+
+// ShiftPadding sets the shift-padding attribute
+// The amount of padding, in pixels, to exceed before the shift behavior will occur.
+func (b *PopupBuilder) ShiftPadding(v float64) *PopupBuilder {
+	b.props.ShiftPadding = v
+	return b
+}
+
+// AutoSize sets the auto-size attribute
+// When set, this will cause the popup to automatically resize itself to prevent it from overflowing.
+func (b *PopupBuilder) AutoSize(v string) *PopupBuilder {
+	b.props.AutoSize = v
+	return b
+}
+
+// Sync sets the sync attribute
+// Syncs the popup's width or height to that of the anchor element.
+func (b *PopupBuilder) Sync(v string) *PopupBuilder {
+	b.props.Sync = v
+	return b
+}
+
+// AutoSizeBoundary sets the autoSizeBoundary attribute
+// The auto-size boundary describes clipping element(s) that overflow will be checked relative to when resizing. By
+func (b *PopupBuilder) AutoSizeBoundary(v string) *PopupBuilder {
+	b.props.AutoSizeBoundary = v
+	return b
+}
+
+// AutoSizePadding sets the auto-size-padding attribute
+// The amount of padding, in pixels, to exceed before the auto-size behavior will occur.
+func (b *PopupBuilder) AutoSizePadding(v float64) *PopupBuilder {
+	b.props.AutoSizePadding = v
+	return b
+}
+
+// HoverBridge sets the hover-bridge attribute
+// When a gap exists between the anchor and the popup element, this option will add a "hover bridge" that fills the
+func (b *PopupBuilder) HoverBridge(v bool) *PopupBuilder {
+	b.props.HoverBridge = v
+	return b
+}
+
+// OnReposition sets the handler for wa-reposition event
+// Emitted when the popup is repositioned. This event can fire a lot, so avoid putting expensive operations in your list...
+func (b *PopupBuilder) OnReposition(handler string) *PopupBuilder {
+	b.props.OnReposition = handler
+	return b
+}
+
+// AnchorSlot sets the anchor slot content
+// The element the popup will be anchored to. If the anchor lives outside of the popup, you can use the anchor attribute...
+func (b *PopupBuilder) AnchorSlot(c templ.Component) *PopupBuilder {
+	b.props.Slots.Anchor = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *PopupBuilder) Attr(name, value string) *PopupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *PopupBuilder) Attrs(attrs templ.Attributes) *PopupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *PopupBuilder) Props() PopupProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *PopupBuilder) Build() PopupProps {
+	return b.props
+}
+
+// Popup renders the wa-popup component
+func Popup(props PopupProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-popup")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Anchor != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " anchor=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Anchor)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 296, Col: 24}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Active {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " active")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Placement != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " placement=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Placement)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 302, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Boundary != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, " boundary=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Boundary)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 305, Col: 28}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Distance != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " distance=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Distance))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 308, Col: 49}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Skidding != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " skidding=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Skidding))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 311, Col: 49}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Arrow {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " arrow")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.ArrowPlacement != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " arrow-placement=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.ArrowPlacement)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 317, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.ArrowPadding != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " arrow-padding=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.ArrowPadding))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 320, Col: 58}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Flip {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, " flip")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.FlipFallbackPlacements != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, " flip-fallback-placements=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.FlipFallbackPlacements)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 326, Col: 58}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.FlipFallbackStrategy != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, " flip-fallback-strategy=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(props.FlipFallbackStrategy)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 329, Col: 54}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.FlipBoundary != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, " flipBoundary=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var11 string
+			templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(props.FlipBoundary)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 332, Col: 36}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.FlipPadding != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, " flip-padding=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var12 string
+			templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.FlipPadding))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 335, Col: 56}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Shift {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, " shift")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.ShiftBoundary != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, " shiftBoundary=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var13 string
+			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(props.ShiftBoundary)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 341, Col: 38}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.ShiftPadding != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, " shift-padding=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var14 string
+			templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.ShiftPadding))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 344, Col: 58}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.AutoSize != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, " auto-size=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var15 string
+			templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(props.AutoSize)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 347, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Sync != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, " sync=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var16 string
+			templ_7745c5c3_Var16, templ_7745c5c3_Err = templ.JoinStringErrs(props.Sync)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 350, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var16))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.AutoSizeBoundary != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, " autoSizeBoundary=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var17 string
+			templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(props.AutoSizeBoundary)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 353, Col: 44}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.AutoSizePadding != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, " auto-size-padding=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var18 string
+			templ_7745c5c3_Var18, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.AutoSizePadding))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 356, Col: 65}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var18))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.HoverBridge {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 40, " hover-bridge")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnReposition != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 41, " x-on:wa-reposition=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var19 string
+			templ_7745c5c3_Var19, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnReposition)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/popup.templ`, Line: 362, Col: 42}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var19))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 42, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 43, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Anchor != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 44, "<div slot=\"anchor\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Anchor.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 45, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 46, "</wa-popup>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// PopupFunc renders with a builder function for inline configuration
+func PopupFunc(fn func(*PopupBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var20 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var20 == nil {
+			templ_7745c5c3_Var20 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewPopup()
+		fn(b)
+		templ_7745c5c3_Var21 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var20.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Popup(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var21), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/progress-bar.templ

@@ -0,0 +1,117 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-progress-bar
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Progress bars are used to show the status of an ongoing operation.
+//
+// Web Awesome component: <wa-progress-bar>
+
+// ProgressBarProps holds all properties for the wa-progress-bar component
+type ProgressBarProps struct {
+	// The current progress as a percentage, 0 to 100.
+	Value float64 `attr:"value"`
+	// When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.
+	Indeterminate bool `attr:"indeterminate"`
+	// A custom label for assistive devices.
+	Label string `attr:"label"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots ProgressBarSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ProgressBarBuilder provides a fluent API for constructing ProgressBarProps
+type ProgressBarBuilder struct {
+	props ProgressBarProps
+}
+
+// NewProgressBar creates a new builder for wa-progress-bar
+func NewProgressBar() *ProgressBarBuilder {
+	return &ProgressBarBuilder{}
+}
+
+// Value sets the value attribute
+// The current progress as a percentage, 0 to 100.
+func (b *ProgressBarBuilder) Value(v float64) *ProgressBarBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Indeterminate sets the indeterminate attribute
+// When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.
+func (b *ProgressBarBuilder) Indeterminate(v bool) *ProgressBarBuilder {
+	b.props.Indeterminate = v
+	return b
+}
+
+// Label sets the label attribute
+// A custom label for assistive devices.
+func (b *ProgressBarBuilder) Label(v string) *ProgressBarBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ProgressBarBuilder) Attr(name, value string) *ProgressBarBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ProgressBarBuilder) Attrs(attrs templ.Attributes) *ProgressBarBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ProgressBarBuilder) Props() ProgressBarProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ProgressBarBuilder) Build() ProgressBarProps {
+	return b.props
+}
+
+// ProgressBar renders the wa-progress-bar component
+templ ProgressBar(props ProgressBarProps) {
+	<wa-progress-bar
+		if props.Value != 0 {
+			value={ templ.Sprintf("%v", props.Value) }
+		}
+		if props.Indeterminate {
+			indeterminate
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-progress-bar>
+}
+
+// ProgressBarFunc renders with a builder function for inline configuration
+templ ProgressBarFunc(fn func(*ProgressBarBuilder)) {
+	{{ b := NewProgressBar(); fn(b) }}
+	@ProgressBar(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/progress-bar_templ.go

@@ -0,0 +1,242 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-progress-bar
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Progress bars are used to show the status of an ongoing operation.
+//
+// Web Awesome component: <wa-progress-bar>
+
+// ProgressBarProps holds all properties for the wa-progress-bar component
+type ProgressBarProps struct {
+	// The current progress as a percentage, 0 to 100.
+	Value float64 `attr:"value"`
+	// When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.
+	Indeterminate bool `attr:"indeterminate"`
+	// A custom label for assistive devices.
+	Label string `attr:"label"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots ProgressBarSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ProgressBarBuilder provides a fluent API for constructing ProgressBarProps
+type ProgressBarBuilder struct {
+	props ProgressBarProps
+}
+
+// NewProgressBar creates a new builder for wa-progress-bar
+func NewProgressBar() *ProgressBarBuilder {
+	return &ProgressBarBuilder{}
+}
+
+// Value sets the value attribute
+// The current progress as a percentage, 0 to 100.
+func (b *ProgressBarBuilder) Value(v float64) *ProgressBarBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Indeterminate sets the indeterminate attribute
+// When true, percentage is ignored, the label is hidden, and the progress bar is drawn in an indeterminate state.
+func (b *ProgressBarBuilder) Indeterminate(v bool) *ProgressBarBuilder {
+	b.props.Indeterminate = v
+	return b
+}
+
+// Label sets the label attribute
+// A custom label for assistive devices.
+func (b *ProgressBarBuilder) Label(v string) *ProgressBarBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ProgressBarBuilder) Attr(name, value string) *ProgressBarBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ProgressBarBuilder) Attrs(attrs templ.Attributes) *ProgressBarBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ProgressBarBuilder) Props() ProgressBarProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ProgressBarBuilder) Build() ProgressBarProps {
+	return b.props
+}
+
+// ProgressBar renders the wa-progress-bar component
+func ProgressBar(props ProgressBarProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-progress-bar")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Value != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Value))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/progress-bar.templ`, Line: 97, Col: 43}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Indeterminate {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " indeterminate")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/progress-bar.templ`, Line: 103, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, "</wa-progress-bar>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// ProgressBarFunc renders with a builder function for inline configuration
+func ProgressBarFunc(fn func(*ProgressBarBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var4 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var4 == nil {
+			templ_7745c5c3_Var4 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewProgressBar()
+		fn(b)
+		templ_7745c5c3_Var5 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var4.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = ProgressBar(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var5), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/progress-ring.templ

@@ -0,0 +1,105 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-progress-ring
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Progress rings are used to show the progress of a determinate operation in a circular fashion.
+//
+// Web Awesome component: <wa-progress-ring>
+
+// ProgressRingProps holds all properties for the wa-progress-ring component
+type ProgressRingProps struct {
+	// The current progress as a percentage, 0 to 100.
+	Value float64 `attr:"value"`
+	// A custom label for assistive devices.
+	Label string `attr:"label"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots ProgressRingSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ProgressRingBuilder provides a fluent API for constructing ProgressRingProps
+type ProgressRingBuilder struct {
+	props ProgressRingProps
+}
+
+// NewProgressRing creates a new builder for wa-progress-ring
+func NewProgressRing() *ProgressRingBuilder {
+	return &ProgressRingBuilder{}
+}
+
+// Value sets the value attribute
+// The current progress as a percentage, 0 to 100.
+func (b *ProgressRingBuilder) Value(v float64) *ProgressRingBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Label sets the label attribute
+// A custom label for assistive devices.
+func (b *ProgressRingBuilder) Label(v string) *ProgressRingBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ProgressRingBuilder) Attr(name, value string) *ProgressRingBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ProgressRingBuilder) Attrs(attrs templ.Attributes) *ProgressRingBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ProgressRingBuilder) Props() ProgressRingProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ProgressRingBuilder) Build() ProgressRingProps {
+	return b.props
+}
+
+// ProgressRing renders the wa-progress-ring component
+templ ProgressRing(props ProgressRingProps) {
+	<wa-progress-ring
+		if props.Value != 0 {
+			value={ templ.Sprintf("%v", props.Value) }
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-progress-ring>
+}
+
+// ProgressRingFunc renders with a builder function for inline configuration
+templ ProgressRingFunc(fn func(*ProgressRingBuilder)) {
+	{{ b := NewProgressRing(); fn(b) }}
+	@ProgressRing(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/progress-ring_templ.go

@@ -0,0 +1,227 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-progress-ring
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Progress rings are used to show the progress of a determinate operation in a circular fashion.
+//
+// Web Awesome component: <wa-progress-ring>
+
+// ProgressRingProps holds all properties for the wa-progress-ring component
+type ProgressRingProps struct {
+	// The current progress as a percentage, 0 to 100.
+	Value float64 `attr:"value"`
+	// A custom label for assistive devices.
+	Label string `attr:"label"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots ProgressRingSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ProgressRingBuilder provides a fluent API for constructing ProgressRingProps
+type ProgressRingBuilder struct {
+	props ProgressRingProps
+}
+
+// NewProgressRing creates a new builder for wa-progress-ring
+func NewProgressRing() *ProgressRingBuilder {
+	return &ProgressRingBuilder{}
+}
+
+// Value sets the value attribute
+// The current progress as a percentage, 0 to 100.
+func (b *ProgressRingBuilder) Value(v float64) *ProgressRingBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Label sets the label attribute
+// A custom label for assistive devices.
+func (b *ProgressRingBuilder) Label(v string) *ProgressRingBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ProgressRingBuilder) Attr(name, value string) *ProgressRingBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ProgressRingBuilder) Attrs(attrs templ.Attributes) *ProgressRingBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ProgressRingBuilder) Props() ProgressRingProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ProgressRingBuilder) Build() ProgressRingProps {
+	return b.props
+}
+
+// ProgressRing renders the wa-progress-ring component
+func ProgressRing(props ProgressRingProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-progress-ring")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Value != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Value))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/progress-ring.templ`, Line: 88, Col: 43}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/progress-ring.templ`, Line: 91, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</wa-progress-ring>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// ProgressRingFunc renders with a builder function for inline configuration
+func ProgressRingFunc(fn func(*ProgressRingBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var4 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var4 == nil {
+			templ_7745c5c3_Var4 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewProgressRing()
+		fn(b)
+		templ_7745c5c3_Var5 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var4.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = ProgressRing(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var5), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/qr-code.templ

@@ -0,0 +1,166 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-qr-code
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Generates a QR code and renders it using the Canvas API.
+//
+// Web Awesome component: <wa-qr-code>
+
+// QrCodeProps holds all properties for the wa-qr-code component
+type QrCodeProps struct {
+	// The QR code's value.
+	Value string `attr:"value"`
+	// The label for assistive devices to announce. If unspecified, the value will be used instead.
+	Label string `attr:"label"`
+	// The size of the QR code, in pixels.
+	Size float64 `attr:"size"`
+	// The fill color. This can be any valid CSS color, but not a CSS custom property.
+	Fill string `attr:"fill"`
+	// The background color. This can be any valid CSS color or transparent. It cannot be a CSS custom property.
+	Background string `attr:"background"`
+	// The edge radius of each module. Must be between 0 and 0.5.
+	Radius float64 `attr:"radius"`
+	// The level of error correction to use. Learn more
+	// Valid values: "L", "M", "Q", "H"
+	ErrorCorrection string `attr:"error-correction"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots QrCodeSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// QrCodeBuilder provides a fluent API for constructing QrCodeProps
+type QrCodeBuilder struct {
+	props QrCodeProps
+}
+
+// NewQrCode creates a new builder for wa-qr-code
+func NewQrCode() *QrCodeBuilder {
+	return &QrCodeBuilder{}
+}
+
+// Value sets the value attribute
+// The QR code's value.
+func (b *QrCodeBuilder) Value(v string) *QrCodeBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Label sets the label attribute
+// The label for assistive devices to announce. If unspecified, the value will be used instead.
+func (b *QrCodeBuilder) Label(v string) *QrCodeBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Size sets the size attribute
+// The size of the QR code, in pixels.
+func (b *QrCodeBuilder) Size(v float64) *QrCodeBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Fill sets the fill attribute
+// The fill color. This can be any valid CSS color, but not a CSS custom property.
+func (b *QrCodeBuilder) Fill(v string) *QrCodeBuilder {
+	b.props.Fill = v
+	return b
+}
+
+// Background sets the background attribute
+// The background color. This can be any valid CSS color or transparent. It cannot be a CSS custom property.
+func (b *QrCodeBuilder) Background(v string) *QrCodeBuilder {
+	b.props.Background = v
+	return b
+}
+
+// Radius sets the radius attribute
+// The edge radius of each module. Must be between 0 and 0.5.
+func (b *QrCodeBuilder) Radius(v float64) *QrCodeBuilder {
+	b.props.Radius = v
+	return b
+}
+
+// ErrorCorrection sets the error-correction attribute
+// The level of error correction to use. Learn more
+func (b *QrCodeBuilder) ErrorCorrection(v string) *QrCodeBuilder {
+	b.props.ErrorCorrection = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *QrCodeBuilder) Attr(name, value string) *QrCodeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *QrCodeBuilder) Attrs(attrs templ.Attributes) *QrCodeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *QrCodeBuilder) Props() QrCodeProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *QrCodeBuilder) Build() QrCodeProps {
+	return b.props
+}
+
+// QrCode renders the wa-qr-code component
+templ QrCode(props QrCodeProps) {
+	<wa-qr-code
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.Size != 0 {
+			size={ templ.Sprintf("%v", props.Size) }
+		}
+		if props.Fill != "" {
+			fill={ props.Fill }
+		}
+		if props.Background != "" {
+			background={ props.Background }
+		}
+		if props.Radius != 0 {
+			radius={ templ.Sprintf("%v", props.Radius) }
+		}
+		if props.ErrorCorrection != "" {
+			error-correction={ props.ErrorCorrection }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-qr-code>
+}
+
+// QrCodeFunc renders with a builder function for inline configuration
+templ QrCodeFunc(fn func(*QrCodeBuilder)) {
+	{{ b := NewQrCode(); fn(b) }}
+	@QrCode(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/qr-code_templ.go

@@ -0,0 +1,368 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-qr-code
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Generates a QR code and renders it using the Canvas API.
+//
+// Web Awesome component: <wa-qr-code>
+
+// QrCodeProps holds all properties for the wa-qr-code component
+type QrCodeProps struct {
+	// The QR code's value.
+	Value string `attr:"value"`
+	// The label for assistive devices to announce. If unspecified, the value will be used instead.
+	Label string `attr:"label"`
+	// The size of the QR code, in pixels.
+	Size float64 `attr:"size"`
+	// The fill color. This can be any valid CSS color, but not a CSS custom property.
+	Fill string `attr:"fill"`
+	// The background color. This can be any valid CSS color or transparent. It cannot be a CSS custom property.
+	Background string `attr:"background"`
+	// The edge radius of each module. Must be between 0 and 0.5.
+	Radius float64 `attr:"radius"`
+	// The level of error correction to use. Learn more
+	// Valid values: "L", "M", "Q", "H"
+	ErrorCorrection string `attr:"error-correction"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots QrCodeSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// QrCodeBuilder provides a fluent API for constructing QrCodeProps
+type QrCodeBuilder struct {
+	props QrCodeProps
+}
+
+// NewQrCode creates a new builder for wa-qr-code
+func NewQrCode() *QrCodeBuilder {
+	return &QrCodeBuilder{}
+}
+
+// Value sets the value attribute
+// The QR code's value.
+func (b *QrCodeBuilder) Value(v string) *QrCodeBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Label sets the label attribute
+// The label for assistive devices to announce. If unspecified, the value will be used instead.
+func (b *QrCodeBuilder) Label(v string) *QrCodeBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Size sets the size attribute
+// The size of the QR code, in pixels.
+func (b *QrCodeBuilder) Size(v float64) *QrCodeBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Fill sets the fill attribute
+// The fill color. This can be any valid CSS color, but not a CSS custom property.
+func (b *QrCodeBuilder) Fill(v string) *QrCodeBuilder {
+	b.props.Fill = v
+	return b
+}
+
+// Background sets the background attribute
+// The background color. This can be any valid CSS color or transparent. It cannot be a CSS custom property.
+func (b *QrCodeBuilder) Background(v string) *QrCodeBuilder {
+	b.props.Background = v
+	return b
+}
+
+// Radius sets the radius attribute
+// The edge radius of each module. Must be between 0 and 0.5.
+func (b *QrCodeBuilder) Radius(v float64) *QrCodeBuilder {
+	b.props.Radius = v
+	return b
+}
+
+// ErrorCorrection sets the error-correction attribute
+// The level of error correction to use. Learn more
+func (b *QrCodeBuilder) ErrorCorrection(v string) *QrCodeBuilder {
+	b.props.ErrorCorrection = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *QrCodeBuilder) Attr(name, value string) *QrCodeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *QrCodeBuilder) Attrs(attrs templ.Attributes) *QrCodeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *QrCodeBuilder) Props() QrCodeProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *QrCodeBuilder) Build() QrCodeProps {
+	return b.props
+}
+
+// QrCode renders the wa-qr-code component
+func QrCode(props QrCodeProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-qr-code")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/qr-code.templ`, Line: 134, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/qr-code.templ`, Line: 137, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Size != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " size=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Size))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/qr-code.templ`, Line: 140, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Fill != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " fill=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.Fill)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/qr-code.templ`, Line: 143, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Background != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " background=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.Background)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/qr-code.templ`, Line: 146, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Radius != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " radius=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Radius))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/qr-code.templ`, Line: 149, Col: 45}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.ErrorCorrection != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " error-correction=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.ErrorCorrection)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/qr-code.templ`, Line: 152, Col: 43}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "</wa-qr-code>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// QrCodeFunc renders with a builder function for inline configuration
+func QrCodeFunc(fn func(*QrCodeBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var9 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var9 == nil {
+			templ_7745c5c3_Var9 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewQrCode()
+		fn(b)
+		templ_7745c5c3_Var10 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var9.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = QrCode(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var10), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/radio-group.templ

@@ -0,0 +1,271 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-radio-group
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Radio groups are used to group multiple radios so they function as a single form control.
+//
+// Web Awesome component: <wa-radio-group>
+
+// RadioGroupProps holds all properties for the wa-radio-group component
+type RadioGroupProps struct {
+	// The radio group's label. Required for proper accessibility. If you need to display HTML, use the label slot
+	Label string `attr:"label"`
+	// The radio groups's hint. If you need to display HTML, use the hint slot instead.
+	Hint string `attr:"hint"`
+	// The name of the radio group, submitted as a name/value pair with form data.
+	Name string `attr:"name"`
+	// Disables the radio group and all child radios.
+	Disabled bool `attr:"disabled"`
+	// The orientation in which to show radio items.
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+	// The default value of the form control. Primarily used for resetting the form control.
+	Value string `attr:"value"`
+	// The radio group's size. This size will be applied to all child radios and radio buttons, except when explicitly overr...
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Ensures a child radio is checked before allowing the containing form to submit.
+	Required bool `attr:"required"`
+	// Used for SSR. if true, will show slotted label on initial render.
+	WithLabel bool `attr:"with-label"`
+	// Used for SSR. if true, will show slotted hint on initial render.
+	WithHint bool `attr:"with-hint"`
+
+	// Events
+	// Emitted when the radio group receives user input.
+	OnInput string `attr:"x-on:input"`
+	// Emitted when the radio group's selected value changes.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots RadioGroupSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// RadioGroupSlots holds named slot content for the component
+type RadioGroupSlots struct {
+	// The radio group's label. Required for proper accessibility. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// Text that describes how to use the radio group. Alternatively, you can use the hint attribute.
+	Hint templ.Component
+}
+
+// RadioGroupBuilder provides a fluent API for constructing RadioGroupProps
+type RadioGroupBuilder struct {
+	props RadioGroupProps
+}
+
+// NewRadioGroup creates a new builder for wa-radio-group
+func NewRadioGroup() *RadioGroupBuilder {
+	return &RadioGroupBuilder{}
+}
+
+// Label sets the label attribute
+// The radio group's label. Required for proper accessibility. If you need to display HTML, use the label slot
+func (b *RadioGroupBuilder) Label(v string) *RadioGroupBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Hint sets the hint attribute
+// The radio groups's hint. If you need to display HTML, use the hint slot instead.
+func (b *RadioGroupBuilder) Hint(v string) *RadioGroupBuilder {
+	b.props.Hint = v
+	return b
+}
+
+// Name sets the name attribute
+// The name of the radio group, submitted as a name/value pair with form data.
+func (b *RadioGroupBuilder) Name(v string) *RadioGroupBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the radio group and all child radios.
+func (b *RadioGroupBuilder) Disabled(v bool) *RadioGroupBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Orientation sets the orientation attribute
+// The orientation in which to show radio items.
+func (b *RadioGroupBuilder) Orientation(v string) *RadioGroupBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// Value sets the value attribute
+// The default value of the form control. Primarily used for resetting the form control.
+func (b *RadioGroupBuilder) Value(v string) *RadioGroupBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Size sets the size attribute
+// The radio group's size. This size will be applied to all child radios and radio buttons, except when explicitly overr...
+func (b *RadioGroupBuilder) Size(v string) *RadioGroupBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Required sets the required attribute
+// Ensures a child radio is checked before allowing the containing form to submit.
+func (b *RadioGroupBuilder) Required(v bool) *RadioGroupBuilder {
+	b.props.Required = v
+	return b
+}
+
+// WithLabel sets the with-label attribute
+// Used for SSR. if true, will show slotted label on initial render.
+func (b *RadioGroupBuilder) WithLabel(v bool) *RadioGroupBuilder {
+	b.props.WithLabel = v
+	return b
+}
+
+// WithHint sets the with-hint attribute
+// Used for SSR. if true, will show slotted hint on initial render.
+func (b *RadioGroupBuilder) WithHint(v bool) *RadioGroupBuilder {
+	b.props.WithHint = v
+	return b
+}
+
+// OnInput sets the handler for input event
+// Emitted when the radio group receives user input.
+func (b *RadioGroupBuilder) OnInput(handler string) *RadioGroupBuilder {
+	b.props.OnInput = handler
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the radio group's selected value changes.
+func (b *RadioGroupBuilder) OnChange(handler string) *RadioGroupBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *RadioGroupBuilder) OnInvalid(handler string) *RadioGroupBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The radio group's label. Required for proper accessibility. Alternatively, you can use the label attribute.
+func (b *RadioGroupBuilder) LabelSlot(c templ.Component) *RadioGroupBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// HintSlot sets the hint slot content
+// Text that describes how to use the radio group. Alternatively, you can use the hint attribute.
+func (b *RadioGroupBuilder) HintSlot(c templ.Component) *RadioGroupBuilder {
+	b.props.Slots.Hint = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *RadioGroupBuilder) Attr(name, value string) *RadioGroupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *RadioGroupBuilder) Attrs(attrs templ.Attributes) *RadioGroupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *RadioGroupBuilder) Props() RadioGroupProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *RadioGroupBuilder) Build() RadioGroupProps {
+	return b.props
+}
+
+// RadioGroup renders the wa-radio-group component
+templ RadioGroup(props RadioGroupProps) {
+	<wa-radio-group
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.Hint != "" {
+			hint={ props.Hint }
+		}
+		if props.Name != "" {
+			name={ props.Name }
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.Orientation != "" {
+			orientation={ props.Orientation }
+		}
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.Size != "" {
+			size={ props.Size }
+		}
+		if props.Required {
+			required
+		}
+		if props.WithLabel {
+			with-label
+		}
+		if props.WithHint {
+			with-hint
+		}
+		if props.OnInput != "" {
+			x-on:input={ props.OnInput }
+		}
+		if props.OnChange != "" {
+			x-on:change={ props.OnChange }
+		}
+		if props.OnInvalid != "" {
+			x-on:wa-invalid={ props.OnInvalid }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Label != nil {
+			<div slot="label">
+				@props.Slots.Label
+			</div>
+		}
+		if props.Slots.Hint != nil {
+			<div slot="hint">
+				@props.Slots.Hint
+			</div>
+		}
+		{ children... }
+	</wa-radio-group>
+}
+
+// RadioGroupFunc renders with a builder function for inline configuration
+templ RadioGroupFunc(fn func(*RadioGroupBuilder)) {
+	{{ b := NewRadioGroup(); fn(b) }}
+	@RadioGroup(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/radio-group_templ.go

@@ -0,0 +1,535 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-radio-group
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Radio groups are used to group multiple radios so they function as a single form control.
+//
+// Web Awesome component: <wa-radio-group>
+
+// RadioGroupProps holds all properties for the wa-radio-group component
+type RadioGroupProps struct {
+	// The radio group's label. Required for proper accessibility. If you need to display HTML, use the label slot
+	Label string `attr:"label"`
+	// The radio groups's hint. If you need to display HTML, use the hint slot instead.
+	Hint string `attr:"hint"`
+	// The name of the radio group, submitted as a name/value pair with form data.
+	Name string `attr:"name"`
+	// Disables the radio group and all child radios.
+	Disabled bool `attr:"disabled"`
+	// The orientation in which to show radio items.
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+	// The default value of the form control. Primarily used for resetting the form control.
+	Value string `attr:"value"`
+	// The radio group's size. This size will be applied to all child radios and radio buttons, except when explicitly overr...
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Ensures a child radio is checked before allowing the containing form to submit.
+	Required bool `attr:"required"`
+	// Used for SSR. if true, will show slotted label on initial render.
+	WithLabel bool `attr:"with-label"`
+	// Used for SSR. if true, will show slotted hint on initial render.
+	WithHint bool `attr:"with-hint"`
+
+	// Events
+	// Emitted when the radio group receives user input.
+	OnInput string `attr:"x-on:input"`
+	// Emitted when the radio group's selected value changes.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots RadioGroupSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// RadioGroupSlots holds named slot content for the component
+type RadioGroupSlots struct {
+	// The radio group's label. Required for proper accessibility. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// Text that describes how to use the radio group. Alternatively, you can use the hint attribute.
+	Hint templ.Component
+}
+
+// RadioGroupBuilder provides a fluent API for constructing RadioGroupProps
+type RadioGroupBuilder struct {
+	props RadioGroupProps
+}
+
+// NewRadioGroup creates a new builder for wa-radio-group
+func NewRadioGroup() *RadioGroupBuilder {
+	return &RadioGroupBuilder{}
+}
+
+// Label sets the label attribute
+// The radio group's label. Required for proper accessibility. If you need to display HTML, use the label slot
+func (b *RadioGroupBuilder) Label(v string) *RadioGroupBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Hint sets the hint attribute
+// The radio groups's hint. If you need to display HTML, use the hint slot instead.
+func (b *RadioGroupBuilder) Hint(v string) *RadioGroupBuilder {
+	b.props.Hint = v
+	return b
+}
+
+// Name sets the name attribute
+// The name of the radio group, submitted as a name/value pair with form data.
+func (b *RadioGroupBuilder) Name(v string) *RadioGroupBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the radio group and all child radios.
+func (b *RadioGroupBuilder) Disabled(v bool) *RadioGroupBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// Orientation sets the orientation attribute
+// The orientation in which to show radio items.
+func (b *RadioGroupBuilder) Orientation(v string) *RadioGroupBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// Value sets the value attribute
+// The default value of the form control. Primarily used for resetting the form control.
+func (b *RadioGroupBuilder) Value(v string) *RadioGroupBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Size sets the size attribute
+// The radio group's size. This size will be applied to all child radios and radio buttons, except when explicitly overr...
+func (b *RadioGroupBuilder) Size(v string) *RadioGroupBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Required sets the required attribute
+// Ensures a child radio is checked before allowing the containing form to submit.
+func (b *RadioGroupBuilder) Required(v bool) *RadioGroupBuilder {
+	b.props.Required = v
+	return b
+}
+
+// WithLabel sets the with-label attribute
+// Used for SSR. if true, will show slotted label on initial render.
+func (b *RadioGroupBuilder) WithLabel(v bool) *RadioGroupBuilder {
+	b.props.WithLabel = v
+	return b
+}
+
+// WithHint sets the with-hint attribute
+// Used for SSR. if true, will show slotted hint on initial render.
+func (b *RadioGroupBuilder) WithHint(v bool) *RadioGroupBuilder {
+	b.props.WithHint = v
+	return b
+}
+
+// OnInput sets the handler for input event
+// Emitted when the radio group receives user input.
+func (b *RadioGroupBuilder) OnInput(handler string) *RadioGroupBuilder {
+	b.props.OnInput = handler
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the radio group's selected value changes.
+func (b *RadioGroupBuilder) OnChange(handler string) *RadioGroupBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *RadioGroupBuilder) OnInvalid(handler string) *RadioGroupBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The radio group's label. Required for proper accessibility. Alternatively, you can use the label attribute.
+func (b *RadioGroupBuilder) LabelSlot(c templ.Component) *RadioGroupBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// HintSlot sets the hint slot content
+// Text that describes how to use the radio group. Alternatively, you can use the hint attribute.
+func (b *RadioGroupBuilder) HintSlot(c templ.Component) *RadioGroupBuilder {
+	b.props.Slots.Hint = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *RadioGroupBuilder) Attr(name, value string) *RadioGroupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *RadioGroupBuilder) Attrs(attrs templ.Attributes) *RadioGroupBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *RadioGroupBuilder) Props() RadioGroupProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *RadioGroupBuilder) Build() RadioGroupProps {
+	return b.props
+}
+
+// RadioGroup renders the wa-radio-group component
+func RadioGroup(props RadioGroupProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-radio-group")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio-group.templ`, Line: 211, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Hint != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " hint=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Hint)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio-group.templ`, Line: 214, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Name != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio-group.templ`, Line: 217, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Orientation != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " orientation=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.Orientation)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio-group.templ`, Line: 223, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio-group.templ`, Line: 226, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Size != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " size=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.Size)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio-group.templ`, Line: 229, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Required {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, " required")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithLabel {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " with-label")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithHint {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, " with-hint")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnInput != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, " x-on:input=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnInput)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio-group.templ`, Line: 241, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnChange != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, " x-on:change=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnChange)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio-group.templ`, Line: 244, Col: 31}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnInvalid != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, " x-on:wa-invalid=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnInvalid)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio-group.templ`, Line: 247, Col: 36}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Label != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, "<div slot=\"label\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Label.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Hint != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, "<div slot=\"hint\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Hint.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, "</wa-radio-group>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// RadioGroupFunc renders with a builder function for inline configuration
+func RadioGroupFunc(fn func(*RadioGroupBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var11 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var11 == nil {
+			templ_7745c5c3_Var11 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewRadioGroup()
+		fn(b)
+		templ_7745c5c3_Var12 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var11.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = RadioGroup(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var12), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/radio.templ

@@ -0,0 +1,155 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-radio
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Radios allow the user to select a single option from a group.
+//
+// Web Awesome component: <wa-radio>
+
+// RadioProps holds all properties for the wa-radio component
+type RadioProps struct {
+	// The radio's value. When selected, the radio group will receive this value.
+	Value string `attr:"value"`
+	// The radio's visual appearance.
+	// Valid values: "default", "button"
+	Appearance string `attr:"appearance"`
+	// The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Disables the radio.
+	Disabled bool `attr:"disabled"`
+
+	// Events
+	// Emitted when the control loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the control gains focus.
+	OnFocus string `attr:"x-on:focus"`
+
+	// Slots contains named slot content
+	Slots RadioSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// RadioBuilder provides a fluent API for constructing RadioProps
+type RadioBuilder struct {
+	props RadioProps
+}
+
+// NewRadio creates a new builder for wa-radio
+func NewRadio() *RadioBuilder {
+	return &RadioBuilder{}
+}
+
+// Value sets the value attribute
+// The radio's value. When selected, the radio group will receive this value.
+func (b *RadioBuilder) Value(v string) *RadioBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The radio's visual appearance.
+func (b *RadioBuilder) Appearance(v string) *RadioBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Size sets the size attribute
+// The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this
+func (b *RadioBuilder) Size(v string) *RadioBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the radio.
+func (b *RadioBuilder) Disabled(v bool) *RadioBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the control loses focus.
+func (b *RadioBuilder) OnBlur(handler string) *RadioBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the control gains focus.
+func (b *RadioBuilder) OnFocus(handler string) *RadioBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *RadioBuilder) Attr(name, value string) *RadioBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *RadioBuilder) Attrs(attrs templ.Attributes) *RadioBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *RadioBuilder) Props() RadioProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *RadioBuilder) Build() RadioProps {
+	return b.props
+}
+
+// Radio renders the wa-radio component
+templ Radio(props RadioProps) {
+	<wa-radio
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.Appearance != "" {
+			appearance={ props.Appearance }
+		}
+		if props.Size != "" {
+			size={ props.Size }
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.OnBlur != "" {
+			x-on:blur={ props.OnBlur }
+		}
+		if props.OnFocus != "" {
+			x-on:focus={ props.OnFocus }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-radio>
+}
+
+// RadioFunc renders with a builder function for inline configuration
+templ RadioFunc(fn func(*RadioBuilder)) {
+	{{ b := NewRadio(); fn(b) }}
+	@Radio(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/radio_templ.go

@@ -0,0 +1,328 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-radio
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Radios allow the user to select a single option from a group.
+//
+// Web Awesome component: <wa-radio>
+
+// RadioProps holds all properties for the wa-radio component
+type RadioProps struct {
+	// The radio's value. When selected, the radio group will receive this value.
+	Value string `attr:"value"`
+	// The radio's visual appearance.
+	// Valid values: "default", "button"
+	Appearance string `attr:"appearance"`
+	// The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Disables the radio.
+	Disabled bool `attr:"disabled"`
+
+	// Events
+	// Emitted when the control loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the control gains focus.
+	OnFocus string `attr:"x-on:focus"`
+
+	// Slots contains named slot content
+	Slots RadioSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// RadioBuilder provides a fluent API for constructing RadioProps
+type RadioBuilder struct {
+	props RadioProps
+}
+
+// NewRadio creates a new builder for wa-radio
+func NewRadio() *RadioBuilder {
+	return &RadioBuilder{}
+}
+
+// Value sets the value attribute
+// The radio's value. When selected, the radio group will receive this value.
+func (b *RadioBuilder) Value(v string) *RadioBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The radio's visual appearance.
+func (b *RadioBuilder) Appearance(v string) *RadioBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Size sets the size attribute
+// The radio's size. When used inside a radio group, the size will be determined by the radio group's size so this
+func (b *RadioBuilder) Size(v string) *RadioBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the radio.
+func (b *RadioBuilder) Disabled(v bool) *RadioBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the control loses focus.
+func (b *RadioBuilder) OnBlur(handler string) *RadioBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the control gains focus.
+func (b *RadioBuilder) OnFocus(handler string) *RadioBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *RadioBuilder) Attr(name, value string) *RadioBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *RadioBuilder) Attrs(attrs templ.Attributes) *RadioBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *RadioBuilder) Props() RadioProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *RadioBuilder) Build() RadioProps {
+	return b.props
+}
+
+// Radio renders the wa-radio component
+func Radio(props RadioProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-radio")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio.templ`, Line: 126, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Appearance != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " appearance=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Appearance)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio.templ`, Line: 129, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Size != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " size=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Size)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio.templ`, Line: 132, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnBlur != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, " x-on:blur=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnBlur)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio.templ`, Line: 138, Col: 27}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnFocus != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " x-on:focus=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnFocus)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/radio.templ`, Line: 141, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "</wa-radio>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// RadioFunc renders with a builder function for inline configuration
+func RadioFunc(fn func(*RadioBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var7 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var7 == nil {
+			templ_7745c5c3_Var7 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewRadio()
+		fn(b)
+		templ_7745c5c3_Var8 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var7.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Radio(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var8), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/rating.templ

@@ -0,0 +1,202 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-rating
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Ratings give users a way to quickly view and provide feedback.
+//
+// Web Awesome component: <wa-rating>
+
+// RatingProps holds all properties for the wa-rating component
+type RatingProps struct {
+	// A label that describes the rating to assistive devices.
+	Label string `attr:"label"`
+	// The current rating.
+	Value float64 `attr:"value"`
+	// The highest rating to show.
+	Max float64 `attr:"max"`
+	// The precision at which the rating will increase and decrease. For example, to allow half-star ratings, set this
+	Precision float64 `attr:"precision"`
+	// Makes the rating readonly.
+	Readonly bool `attr:"readonly"`
+	// Disables the rating.
+	Disabled bool `attr:"disabled"`
+	// A function that customizes the symbol to be rendered. The first and only argument is the rating's current value.
+	GetSymbol string `attr:"getSymbol"`
+	// The component's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+
+	// Events
+	// Emitted when the rating's value changes.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the user hovers over a value. The phase property indicates when hovering starts, moves to a new value, o...
+	OnHover string `attr:"x-on:wa-hover"`
+
+	// Slots contains named slot content
+	Slots RatingSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// RatingBuilder provides a fluent API for constructing RatingProps
+type RatingBuilder struct {
+	props RatingProps
+}
+
+// NewRating creates a new builder for wa-rating
+func NewRating() *RatingBuilder {
+	return &RatingBuilder{}
+}
+
+// Label sets the label attribute
+// A label that describes the rating to assistive devices.
+func (b *RatingBuilder) Label(v string) *RatingBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Value sets the value attribute
+// The current rating.
+func (b *RatingBuilder) Value(v float64) *RatingBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Max sets the max attribute
+// The highest rating to show.
+func (b *RatingBuilder) Max(v float64) *RatingBuilder {
+	b.props.Max = v
+	return b
+}
+
+// Precision sets the precision attribute
+// The precision at which the rating will increase and decrease. For example, to allow half-star ratings, set this
+func (b *RatingBuilder) Precision(v float64) *RatingBuilder {
+	b.props.Precision = v
+	return b
+}
+
+// Readonly sets the readonly attribute
+// Makes the rating readonly.
+func (b *RatingBuilder) Readonly(v bool) *RatingBuilder {
+	b.props.Readonly = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the rating.
+func (b *RatingBuilder) Disabled(v bool) *RatingBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// GetSymbol sets the getSymbol attribute
+// A function that customizes the symbol to be rendered. The first and only argument is the rating's current value.
+func (b *RatingBuilder) GetSymbol(v string) *RatingBuilder {
+	b.props.GetSymbol = v
+	return b
+}
+
+// Size sets the size attribute
+// The component's size.
+func (b *RatingBuilder) Size(v string) *RatingBuilder {
+	b.props.Size = v
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the rating's value changes.
+func (b *RatingBuilder) OnChange(handler string) *RatingBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnHover sets the handler for wa-hover event
+// Emitted when the user hovers over a value. The phase property indicates when hovering starts, moves to a new value, o...
+func (b *RatingBuilder) OnHover(handler string) *RatingBuilder {
+	b.props.OnHover = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *RatingBuilder) Attr(name, value string) *RatingBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *RatingBuilder) Attrs(attrs templ.Attributes) *RatingBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *RatingBuilder) Props() RatingProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *RatingBuilder) Build() RatingProps {
+	return b.props
+}
+
+// Rating renders the wa-rating component
+templ Rating(props RatingProps) {
+	<wa-rating
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.Value != 0 {
+			value={ templ.Sprintf("%v", props.Value) }
+		}
+		if props.Max != 0 {
+			max={ templ.Sprintf("%v", props.Max) }
+		}
+		if props.Precision != 0 {
+			precision={ templ.Sprintf("%v", props.Precision) }
+		}
+		if props.Readonly {
+			readonly
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.GetSymbol {
+			getSymbol
+		}
+		if props.Size != "" {
+			size={ props.Size }
+		}
+		if props.OnChange != "" {
+			x-on:change={ props.OnChange }
+		}
+		if props.OnHover != "" {
+			x-on:wa-hover={ props.OnHover }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-rating>
+}
+
+// RatingFunc renders with a builder function for inline configuration
+templ RatingFunc(fn func(*RatingBuilder)) {
+	{{ b := NewRating(); fn(b) }}
+	@Rating(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/rating_templ.go

@@ -0,0 +1,413 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-rating
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Ratings give users a way to quickly view and provide feedback.
+//
+// Web Awesome component: <wa-rating>
+
+// RatingProps holds all properties for the wa-rating component
+type RatingProps struct {
+	// A label that describes the rating to assistive devices.
+	Label string `attr:"label"`
+	// The current rating.
+	Value float64 `attr:"value"`
+	// The highest rating to show.
+	Max float64 `attr:"max"`
+	// The precision at which the rating will increase and decrease. For example, to allow half-star ratings, set this
+	Precision float64 `attr:"precision"`
+	// Makes the rating readonly.
+	Readonly bool `attr:"readonly"`
+	// Disables the rating.
+	Disabled bool `attr:"disabled"`
+	// A function that customizes the symbol to be rendered. The first and only argument is the rating's current value.
+	GetSymbol string `attr:"getSymbol"`
+	// The component's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+
+	// Events
+	// Emitted when the rating's value changes.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the user hovers over a value. The phase property indicates when hovering starts, moves to a new value, o...
+	OnHover string `attr:"x-on:wa-hover"`
+
+	// Slots contains named slot content
+	Slots RatingSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// RatingBuilder provides a fluent API for constructing RatingProps
+type RatingBuilder struct {
+	props RatingProps
+}
+
+// NewRating creates a new builder for wa-rating
+func NewRating() *RatingBuilder {
+	return &RatingBuilder{}
+}
+
+// Label sets the label attribute
+// A label that describes the rating to assistive devices.
+func (b *RatingBuilder) Label(v string) *RatingBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Value sets the value attribute
+// The current rating.
+func (b *RatingBuilder) Value(v float64) *RatingBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Max sets the max attribute
+// The highest rating to show.
+func (b *RatingBuilder) Max(v float64) *RatingBuilder {
+	b.props.Max = v
+	return b
+}
+
+// Precision sets the precision attribute
+// The precision at which the rating will increase and decrease. For example, to allow half-star ratings, set this
+func (b *RatingBuilder) Precision(v float64) *RatingBuilder {
+	b.props.Precision = v
+	return b
+}
+
+// Readonly sets the readonly attribute
+// Makes the rating readonly.
+func (b *RatingBuilder) Readonly(v bool) *RatingBuilder {
+	b.props.Readonly = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the rating.
+func (b *RatingBuilder) Disabled(v bool) *RatingBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// GetSymbol sets the getSymbol attribute
+// A function that customizes the symbol to be rendered. The first and only argument is the rating's current value.
+func (b *RatingBuilder) GetSymbol(v string) *RatingBuilder {
+	b.props.GetSymbol = v
+	return b
+}
+
+// Size sets the size attribute
+// The component's size.
+func (b *RatingBuilder) Size(v string) *RatingBuilder {
+	b.props.Size = v
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the rating's value changes.
+func (b *RatingBuilder) OnChange(handler string) *RatingBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnHover sets the handler for wa-hover event
+// Emitted when the user hovers over a value. The phase property indicates when hovering starts, moves to a new value, o...
+func (b *RatingBuilder) OnHover(handler string) *RatingBuilder {
+	b.props.OnHover = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *RatingBuilder) Attr(name, value string) *RatingBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *RatingBuilder) Attrs(attrs templ.Attributes) *RatingBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *RatingBuilder) Props() RatingProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *RatingBuilder) Build() RatingProps {
+	return b.props
+}
+
+// Rating renders the wa-rating component
+func Rating(props RatingProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-rating")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/rating.templ`, Line: 161, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Value != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Value))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/rating.templ`, Line: 164, Col: 43}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Max != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " max=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Max))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/rating.templ`, Line: 167, Col: 39}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Precision != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " precision=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.Precision))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/rating.templ`, Line: 170, Col: 51}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Readonly {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " readonly")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.GetSymbol {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, " getSymbol")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Size != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " size=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(props.Size)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/rating.templ`, Line: 182, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnChange != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, " x-on:change=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnChange)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/rating.templ`, Line: 185, Col: 31}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnHover != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, " x-on:wa-hover=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnHover)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/rating.templ`, Line: 188, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "</wa-rating>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// RatingFunc renders with a builder function for inline configuration
+func RatingFunc(fn func(*RatingBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var9 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var9 == nil {
+			templ_7745c5c3_Var9 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewRating()
+		fn(b)
+		templ_7745c5c3_Var10 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var9.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Rating(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var10), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/relative-time.templ

@@ -0,0 +1,131 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-relative-time
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Outputs a localized time phrase relative to the current date and time.
+//
+// Web Awesome component: <wa-relative-time>
+
+// RelativeTimeProps holds all properties for the wa-relative-time component
+type RelativeTimeProps struct {
+	// The date from which to calculate time from. If not set, the current date and time will be used. When passing a
+	Date string `attr:"date"`
+	// The formatting style to use.
+	// Valid values: "long", "short", "narrow"
+	Format string `attr:"format"`
+	// When auto, values such as "yesterday" and "tomorrow" will be shown when possible. When always, values such as
+	// Valid values: "always", "auto"
+	Numeric string `attr:"numeric"`
+	// Keep the displayed value up to date as time passes.
+	Sync bool `attr:"sync"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots RelativeTimeSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// RelativeTimeBuilder provides a fluent API for constructing RelativeTimeProps
+type RelativeTimeBuilder struct {
+	props RelativeTimeProps
+}
+
+// NewRelativeTime creates a new builder for wa-relative-time
+func NewRelativeTime() *RelativeTimeBuilder {
+	return &RelativeTimeBuilder{}
+}
+
+// Date sets the date attribute
+// The date from which to calculate time from. If not set, the current date and time will be used. When passing a
+func (b *RelativeTimeBuilder) Date(v string) *RelativeTimeBuilder {
+	b.props.Date = v
+	return b
+}
+
+// Format sets the format attribute
+// The formatting style to use.
+func (b *RelativeTimeBuilder) Format(v string) *RelativeTimeBuilder {
+	b.props.Format = v
+	return b
+}
+
+// Numeric sets the numeric attribute
+// When auto, values such as "yesterday" and "tomorrow" will be shown when possible. When always, values such as
+func (b *RelativeTimeBuilder) Numeric(v string) *RelativeTimeBuilder {
+	b.props.Numeric = v
+	return b
+}
+
+// Sync sets the sync attribute
+// Keep the displayed value up to date as time passes.
+func (b *RelativeTimeBuilder) Sync(v bool) *RelativeTimeBuilder {
+	b.props.Sync = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *RelativeTimeBuilder) Attr(name, value string) *RelativeTimeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *RelativeTimeBuilder) Attrs(attrs templ.Attributes) *RelativeTimeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *RelativeTimeBuilder) Props() RelativeTimeProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *RelativeTimeBuilder) Build() RelativeTimeProps {
+	return b.props
+}
+
+// RelativeTime renders the wa-relative-time component
+templ RelativeTime(props RelativeTimeProps) {
+	<wa-relative-time
+		if props.Date != "" {
+			date={ props.Date }
+		}
+		if props.Format != "" {
+			format={ props.Format }
+		}
+		if props.Numeric != "" {
+			numeric={ props.Numeric }
+		}
+		if props.Sync {
+			sync
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-relative-time>
+}
+
+// RelativeTimeFunc renders with a builder function for inline configuration
+templ RelativeTimeFunc(fn func(*RelativeTimeBuilder)) {
+	{{ b := NewRelativeTime(); fn(b) }}
+	@RelativeTime(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/relative-time_templ.go

@@ -0,0 +1,272 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-relative-time
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Outputs a localized time phrase relative to the current date and time.
+//
+// Web Awesome component: <wa-relative-time>
+
+// RelativeTimeProps holds all properties for the wa-relative-time component
+type RelativeTimeProps struct {
+	// The date from which to calculate time from. If not set, the current date and time will be used. When passing a
+	Date string `attr:"date"`
+	// The formatting style to use.
+	// Valid values: "long", "short", "narrow"
+	Format string `attr:"format"`
+	// When auto, values such as "yesterday" and "tomorrow" will be shown when possible. When always, values such as
+	// Valid values: "always", "auto"
+	Numeric string `attr:"numeric"`
+	// Keep the displayed value up to date as time passes.
+	Sync bool `attr:"sync"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots RelativeTimeSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// RelativeTimeBuilder provides a fluent API for constructing RelativeTimeProps
+type RelativeTimeBuilder struct {
+	props RelativeTimeProps
+}
+
+// NewRelativeTime creates a new builder for wa-relative-time
+func NewRelativeTime() *RelativeTimeBuilder {
+	return &RelativeTimeBuilder{}
+}
+
+// Date sets the date attribute
+// The date from which to calculate time from. If not set, the current date and time will be used. When passing a
+func (b *RelativeTimeBuilder) Date(v string) *RelativeTimeBuilder {
+	b.props.Date = v
+	return b
+}
+
+// Format sets the format attribute
+// The formatting style to use.
+func (b *RelativeTimeBuilder) Format(v string) *RelativeTimeBuilder {
+	b.props.Format = v
+	return b
+}
+
+// Numeric sets the numeric attribute
+// When auto, values such as "yesterday" and "tomorrow" will be shown when possible. When always, values such as
+func (b *RelativeTimeBuilder) Numeric(v string) *RelativeTimeBuilder {
+	b.props.Numeric = v
+	return b
+}
+
+// Sync sets the sync attribute
+// Keep the displayed value up to date as time passes.
+func (b *RelativeTimeBuilder) Sync(v bool) *RelativeTimeBuilder {
+	b.props.Sync = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *RelativeTimeBuilder) Attr(name, value string) *RelativeTimeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *RelativeTimeBuilder) Attrs(attrs templ.Attributes) *RelativeTimeBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *RelativeTimeBuilder) Props() RelativeTimeProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *RelativeTimeBuilder) Build() RelativeTimeProps {
+	return b.props
+}
+
+// RelativeTime renders the wa-relative-time component
+func RelativeTime(props RelativeTimeProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-relative-time")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Date != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " date=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Date)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/relative-time.templ`, Line: 108, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Format != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " format=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Format)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/relative-time.templ`, Line: 111, Col: 24}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Numeric != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " numeric=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Numeric)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/relative-time.templ`, Line: 114, Col: 26}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Sync {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " sync")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, "</wa-relative-time>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// RelativeTimeFunc renders with a builder function for inline configuration
+func RelativeTimeFunc(fn func(*RelativeTimeBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var5 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var5 == nil {
+			templ_7745c5c3_Var5 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewRelativeTime()
+		fn(b)
+		templ_7745c5c3_Var6 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var5.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = RelativeTime(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var6), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/resize-observer.templ

@@ -0,0 +1,105 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-resize-observer
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// The Resize Observer component offers a thin, declarative interface to the ResizeObserver API.
+//
+// Web Awesome component: <wa-resize-observer>
+
+// ResizeObserverProps holds all properties for the wa-resize-observer component
+type ResizeObserverProps struct {
+	// Disables the observer.
+	Disabled bool `attr:"disabled"`
+
+	// Events
+	// Emitted when the element is resized.
+	OnResize string `attr:"x-on:wa-resize"`
+
+	// Slots contains named slot content
+	Slots ResizeObserverSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ResizeObserverBuilder provides a fluent API for constructing ResizeObserverProps
+type ResizeObserverBuilder struct {
+	props ResizeObserverProps
+}
+
+// NewResizeObserver creates a new builder for wa-resize-observer
+func NewResizeObserver() *ResizeObserverBuilder {
+	return &ResizeObserverBuilder{}
+}
+
+// Disabled sets the disabled attribute
+// Disables the observer.
+func (b *ResizeObserverBuilder) Disabled(v bool) *ResizeObserverBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// OnResize sets the handler for wa-resize event
+// Emitted when the element is resized.
+func (b *ResizeObserverBuilder) OnResize(handler string) *ResizeObserverBuilder {
+	b.props.OnResize = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ResizeObserverBuilder) Attr(name, value string) *ResizeObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ResizeObserverBuilder) Attrs(attrs templ.Attributes) *ResizeObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ResizeObserverBuilder) Props() ResizeObserverProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ResizeObserverBuilder) Build() ResizeObserverProps {
+	return b.props
+}
+
+// ResizeObserver renders the wa-resize-observer component
+templ ResizeObserver(props ResizeObserverProps) {
+	<wa-resize-observer
+		if props.Disabled {
+			disabled
+		}
+		if props.OnResize != "" {
+			x-on:wa-resize={ props.OnResize }
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-resize-observer>
+}
+
+// ResizeObserverFunc renders with a builder function for inline configuration
+templ ResizeObserverFunc(fn func(*ResizeObserverBuilder)) {
+	{{ b := NewResizeObserver(); fn(b) }}
+	@ResizeObserver(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/resize-observer_templ.go

@@ -0,0 +1,214 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-resize-observer
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// The Resize Observer component offers a thin, declarative interface to the ResizeObserver API.
+//
+// Web Awesome component: <wa-resize-observer>
+
+// ResizeObserverProps holds all properties for the wa-resize-observer component
+type ResizeObserverProps struct {
+	// Disables the observer.
+	Disabled bool `attr:"disabled"`
+
+	// Events
+	// Emitted when the element is resized.
+	OnResize string `attr:"x-on:wa-resize"`
+
+	// Slots contains named slot content
+	Slots ResizeObserverSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ResizeObserverBuilder provides a fluent API for constructing ResizeObserverProps
+type ResizeObserverBuilder struct {
+	props ResizeObserverProps
+}
+
+// NewResizeObserver creates a new builder for wa-resize-observer
+func NewResizeObserver() *ResizeObserverBuilder {
+	return &ResizeObserverBuilder{}
+}
+
+// Disabled sets the disabled attribute
+// Disables the observer.
+func (b *ResizeObserverBuilder) Disabled(v bool) *ResizeObserverBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// OnResize sets the handler for wa-resize event
+// Emitted when the element is resized.
+func (b *ResizeObserverBuilder) OnResize(handler string) *ResizeObserverBuilder {
+	b.props.OnResize = handler
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ResizeObserverBuilder) Attr(name, value string) *ResizeObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ResizeObserverBuilder) Attrs(attrs templ.Attributes) *ResizeObserverBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ResizeObserverBuilder) Props() ResizeObserverProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ResizeObserverBuilder) Build() ResizeObserverProps {
+	return b.props
+}
+
+// ResizeObserver renders the wa-resize-observer component
+func ResizeObserver(props ResizeObserverProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-resize-observer")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnResize != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, " x-on:wa-resize=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnResize)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/resize-observer.templ`, Line: 91, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, "</wa-resize-observer>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// ResizeObserverFunc renders with a builder function for inline configuration
+func ResizeObserverFunc(fn func(*ResizeObserverBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var3 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var3 == nil {
+			templ_7745c5c3_Var3 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewResizeObserver()
+		fn(b)
+		templ_7745c5c3_Var4 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var3.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = ResizeObserver(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var4), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/scroller.templ

@@ -0,0 +1,118 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-scroller
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Scrollers create an accessible container while providing visual cues that help users identify and navigate
+//
+// Web Awesome component: <wa-scroller>
+
+// ScrollerProps holds all properties for the wa-scroller component
+type ScrollerProps struct {
+	// The scroller's orientation.
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+	// Removes the visible scrollbar.
+	WithoutScrollbar bool `attr:"without-scrollbar"`
+	// Removes the shadows.
+	WithoutShadow bool `attr:"without-shadow"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots ScrollerSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ScrollerBuilder provides a fluent API for constructing ScrollerProps
+type ScrollerBuilder struct {
+	props ScrollerProps
+}
+
+// NewScroller creates a new builder for wa-scroller
+func NewScroller() *ScrollerBuilder {
+	return &ScrollerBuilder{}
+}
+
+// Orientation sets the orientation attribute
+// The scroller's orientation.
+func (b *ScrollerBuilder) Orientation(v string) *ScrollerBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// WithoutScrollbar sets the without-scrollbar attribute
+// Removes the visible scrollbar.
+func (b *ScrollerBuilder) WithoutScrollbar(v bool) *ScrollerBuilder {
+	b.props.WithoutScrollbar = v
+	return b
+}
+
+// WithoutShadow sets the without-shadow attribute
+// Removes the shadows.
+func (b *ScrollerBuilder) WithoutShadow(v bool) *ScrollerBuilder {
+	b.props.WithoutShadow = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ScrollerBuilder) Attr(name, value string) *ScrollerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ScrollerBuilder) Attrs(attrs templ.Attributes) *ScrollerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ScrollerBuilder) Props() ScrollerProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ScrollerBuilder) Build() ScrollerProps {
+	return b.props
+}
+
+// Scroller renders the wa-scroller component
+templ Scroller(props ScrollerProps) {
+	<wa-scroller
+		if props.Orientation != "" {
+			orientation={ props.Orientation }
+		}
+		if props.WithoutScrollbar {
+			without-scrollbar
+		}
+		if props.WithoutShadow {
+			without-shadow
+		}
+		{ props.Attrs... }
+	>
+		{ children... }
+	</wa-scroller>
+}
+
+// ScrollerFunc renders with a builder function for inline configuration
+templ ScrollerFunc(fn func(*ScrollerBuilder)) {
+	{{ b := NewScroller(); fn(b) }}
+	@Scroller(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/scroller_templ.go

@@ -0,0 +1,230 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-scroller
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Scrollers create an accessible container while providing visual cues that help users identify and navigate
+//
+// Web Awesome component: <wa-scroller>
+
+// ScrollerProps holds all properties for the wa-scroller component
+type ScrollerProps struct {
+	// The scroller's orientation.
+	// Valid values: "horizontal", "vertical"
+	Orientation string `attr:"orientation"`
+	// Removes the visible scrollbar.
+	WithoutScrollbar bool `attr:"without-scrollbar"`
+	// Removes the shadows.
+	WithoutShadow bool `attr:"without-shadow"`
+
+	// Events
+
+	// Slots contains named slot content
+	Slots ScrollerSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// ScrollerBuilder provides a fluent API for constructing ScrollerProps
+type ScrollerBuilder struct {
+	props ScrollerProps
+}
+
+// NewScroller creates a new builder for wa-scroller
+func NewScroller() *ScrollerBuilder {
+	return &ScrollerBuilder{}
+}
+
+// Orientation sets the orientation attribute
+// The scroller's orientation.
+func (b *ScrollerBuilder) Orientation(v string) *ScrollerBuilder {
+	b.props.Orientation = v
+	return b
+}
+
+// WithoutScrollbar sets the without-scrollbar attribute
+// Removes the visible scrollbar.
+func (b *ScrollerBuilder) WithoutScrollbar(v bool) *ScrollerBuilder {
+	b.props.WithoutScrollbar = v
+	return b
+}
+
+// WithoutShadow sets the without-shadow attribute
+// Removes the shadows.
+func (b *ScrollerBuilder) WithoutShadow(v bool) *ScrollerBuilder {
+	b.props.WithoutShadow = v
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *ScrollerBuilder) Attr(name, value string) *ScrollerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *ScrollerBuilder) Attrs(attrs templ.Attributes) *ScrollerBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *ScrollerBuilder) Props() ScrollerProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *ScrollerBuilder) Build() ScrollerProps {
+	return b.props
+}
+
+// Scroller renders the wa-scroller component
+func Scroller(props ScrollerProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-scroller")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Orientation != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " orientation=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Orientation)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/scroller.templ`, Line: 98, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithoutScrollbar {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " without-scrollbar")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithoutShadow {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, " without-shadow")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "</wa-scroller>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// ScrollerFunc renders with a builder function for inline configuration
+func ScrollerFunc(fn func(*ScrollerBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var3 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var3 == nil {
+			templ_7745c5c3_Var3 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewScroller()
+		fn(b)
+		templ_7745c5c3_Var4 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var3.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Scroller(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var4), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate

pkg/wa/select.templ

@@ -0,0 +1,496 @@
+// Code generated by wa-generator. DO NOT EDIT.
+// Source: Web Awesome wa-select
+
+package wa
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Selects allow you to choose items from a menu of predefined options.
+//
+// Web Awesome component: <wa-select>
+
+// SelectProps holds all properties for the wa-select component
+type SelectProps struct {
+	// The name of the select, submitted as a name/value pair with form data.
+	Name string `attr:"name"`
+	// The select's value. This will be a string for single select or an array for multi-select.
+	Value string `attr:"value"`
+	// The select's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Placeholder text to show as a hint when the select is empty.
+	Placeholder string `attr:"placeholder"`
+	// Allows more than one option to be selected.
+	Multiple bool `attr:"multiple"`
+	// The maximum number of selected options to show when multiple is true. After the maximum, "+n" will be shown to
+	MaxOptionsVisible float64 `attr:"max-options-visible"`
+	// Disables the select control.
+	Disabled bool `attr:"disabled"`
+	// Adds a clear button when the select is not empty.
+	WithClear bool `attr:"with-clear"`
+	// Indicates whether or not the select is open. You can toggle this attribute to show and hide the menu, or you can
+	Open bool `attr:"open"`
+	// The select's visual appearance.
+	// Valid values: "filled", "outlined", "filled-outlined"
+	Appearance string `attr:"appearance"`
+	// Draws a pill-style select with rounded edges.
+	Pill bool `attr:"pill"`
+	// The select's label. If you need to display HTML, use the label slot instead.
+	Label string `attr:"label"`
+	// The preferred placement of the select's menu. Note that the actual placement may vary as needed to keep the listbox
+	// Valid values: "top", "bottom"
+	Placement string `attr:"placement"`
+	// The select's hint. If you need to display HTML, use the hint slot instead.
+	Hint string `attr:"hint"`
+	// Used for SSR purposes when a label is slotted in. Will show the label on first render.
+	WithLabel bool `attr:"with-label"`
+	// Used for SSR purposes when hint is slotted in. Will show the hint on first render.
+	WithHint bool `attr:"with-hint"`
+	// The select's required attribute.
+	Required bool `attr:"required"`
+
+	// Events
+	// Emitted when the control receives input.
+	OnInput string `attr:"x-on:input"`
+	// Emitted when the control's value changes.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the control gains focus.
+	OnFocus string `attr:"x-on:focus"`
+	// Emitted when the control loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the control's value is cleared.
+	OnClear string `attr:"x-on:wa-clear"`
+	// Emitted when the select's menu opens.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the select's menu opens and all animations are complete.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the select's menu closes.
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the select's menu closes and all animations are complete.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots SelectSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// SelectSlots holds named slot content for the component
+type SelectSlots struct {
+	// The input's label. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// An element, such as <wa-icon>, placed at the start of the combobox.
+	Start templ.Component
+	// An element, such as <wa-icon>, placed at the end of the combobox.
+	End templ.Component
+	// An icon to use in lieu of the default clear icon.
+	ClearIcon templ.Component
+	// The icon to show when the control is expanded and collapsed. Rotates on open and close.
+	ExpandIcon templ.Component
+	// Text that describes how to use the input. Alternatively, you can use the hint attribute.
+	Hint templ.Component
+}
+
+// SelectBuilder provides a fluent API for constructing SelectProps
+type SelectBuilder struct {
+	props SelectProps
+}
+
+// NewSelect creates a new builder for wa-select
+func NewSelect() *SelectBuilder {
+	return &SelectBuilder{}
+}
+
+// Name sets the name attribute
+// The name of the select, submitted as a name/value pair with form data.
+func (b *SelectBuilder) Name(v string) *SelectBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Value sets the value attribute
+// The select's value. This will be a string for single select or an array for multi-select.
+func (b *SelectBuilder) Value(v string) *SelectBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Size sets the size attribute
+// The select's size.
+func (b *SelectBuilder) Size(v string) *SelectBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Placeholder sets the placeholder attribute
+// Placeholder text to show as a hint when the select is empty.
+func (b *SelectBuilder) Placeholder(v string) *SelectBuilder {
+	b.props.Placeholder = v
+	return b
+}
+
+// Multiple sets the multiple attribute
+// Allows more than one option to be selected.
+func (b *SelectBuilder) Multiple(v bool) *SelectBuilder {
+	b.props.Multiple = v
+	return b
+}
+
+// MaxOptionsVisible sets the max-options-visible attribute
+// The maximum number of selected options to show when multiple is true. After the maximum, "+n" will be shown to
+func (b *SelectBuilder) MaxOptionsVisible(v float64) *SelectBuilder {
+	b.props.MaxOptionsVisible = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the select control.
+func (b *SelectBuilder) Disabled(v bool) *SelectBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// WithClear sets the with-clear attribute
+// Adds a clear button when the select is not empty.
+func (b *SelectBuilder) WithClear(v bool) *SelectBuilder {
+	b.props.WithClear = v
+	return b
+}
+
+// Open sets the open attribute
+// Indicates whether or not the select is open. You can toggle this attribute to show and hide the menu, or you can
+func (b *SelectBuilder) Open(v bool) *SelectBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The select's visual appearance.
+func (b *SelectBuilder) Appearance(v string) *SelectBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Pill sets the pill attribute
+// Draws a pill-style select with rounded edges.
+func (b *SelectBuilder) Pill(v bool) *SelectBuilder {
+	b.props.Pill = v
+	return b
+}
+
+// Label sets the label attribute
+// The select's label. If you need to display HTML, use the label slot instead.
+func (b *SelectBuilder) Label(v string) *SelectBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Placement sets the placement attribute
+// The preferred placement of the select's menu. Note that the actual placement may vary as needed to keep the listbox
+func (b *SelectBuilder) Placement(v string) *SelectBuilder {
+	b.props.Placement = v
+	return b
+}
+
+// Hint sets the hint attribute
+// The select's hint. If you need to display HTML, use the hint slot instead.
+func (b *SelectBuilder) Hint(v string) *SelectBuilder {
+	b.props.Hint = v
+	return b
+}
+
+// WithLabel sets the with-label attribute
+// Used for SSR purposes when a label is slotted in. Will show the label on first render.
+func (b *SelectBuilder) WithLabel(v bool) *SelectBuilder {
+	b.props.WithLabel = v
+	return b
+}
+
+// WithHint sets the with-hint attribute
+// Used for SSR purposes when hint is slotted in. Will show the hint on first render.
+func (b *SelectBuilder) WithHint(v bool) *SelectBuilder {
+	b.props.WithHint = v
+	return b
+}
+
+// Required sets the required attribute
+// The select's required attribute.
+func (b *SelectBuilder) Required(v bool) *SelectBuilder {
+	b.props.Required = v
+	return b
+}
+
+// OnInput sets the handler for input event
+// Emitted when the control receives input.
+func (b *SelectBuilder) OnInput(handler string) *SelectBuilder {
+	b.props.OnInput = handler
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the control's value changes.
+func (b *SelectBuilder) OnChange(handler string) *SelectBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the control gains focus.
+func (b *SelectBuilder) OnFocus(handler string) *SelectBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the control loses focus.
+func (b *SelectBuilder) OnBlur(handler string) *SelectBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnClear sets the handler for wa-clear event
+// Emitted when the control's value is cleared.
+func (b *SelectBuilder) OnClear(handler string) *SelectBuilder {
+	b.props.OnClear = handler
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the select's menu opens.
+func (b *SelectBuilder) OnShow(handler string) *SelectBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the select's menu opens and all animations are complete.
+func (b *SelectBuilder) OnAfterShow(handler string) *SelectBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the select's menu closes.
+func (b *SelectBuilder) OnHide(handler string) *SelectBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the select's menu closes and all animations are complete.
+func (b *SelectBuilder) OnAfterHide(handler string) *SelectBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *SelectBuilder) OnInvalid(handler string) *SelectBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The input's label. Alternatively, you can use the label attribute.
+func (b *SelectBuilder) LabelSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// StartSlot sets the start slot content
+// An element, such as <wa-icon>, placed at the start of the combobox.
+func (b *SelectBuilder) StartSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.Start = c
+	return b
+}
+
+// EndSlot sets the end slot content
+// An element, such as <wa-icon>, placed at the end of the combobox.
+func (b *SelectBuilder) EndSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.End = c
+	return b
+}
+
+// ClearIconSlot sets the clear-icon slot content
+// An icon to use in lieu of the default clear icon.
+func (b *SelectBuilder) ClearIconSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.ClearIcon = c
+	return b
+}
+
+// ExpandIconSlot sets the expand-icon slot content
+// The icon to show when the control is expanded and collapsed. Rotates on open and close.
+func (b *SelectBuilder) ExpandIconSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.ExpandIcon = c
+	return b
+}
+
+// HintSlot sets the hint slot content
+// Text that describes how to use the input. Alternatively, you can use the hint attribute.
+func (b *SelectBuilder) HintSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.Hint = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *SelectBuilder) Attr(name, value string) *SelectBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *SelectBuilder) Attrs(attrs templ.Attributes) *SelectBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *SelectBuilder) Props() SelectProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *SelectBuilder) Build() SelectProps {
+	return b.props
+}
+
+// Select renders the wa-select component
+templ Select(props SelectProps) {
+	<wa-select
+		if props.Name != "" {
+			name={ props.Name }
+		}
+		if props.Value != "" {
+			value={ props.Value }
+		}
+		if props.Size != "" {
+			size={ props.Size }
+		}
+		if props.Placeholder != "" {
+			placeholder={ props.Placeholder }
+		}
+		if props.Multiple {
+			multiple
+		}
+		if props.MaxOptionsVisible != 0 {
+			max-options-visible={ templ.Sprintf("%v", props.MaxOptionsVisible) }
+		}
+		if props.Disabled {
+			disabled
+		}
+		if props.WithClear {
+			with-clear
+		}
+		if props.Open {
+			open
+		}
+		if props.Appearance != "" {
+			appearance={ props.Appearance }
+		}
+		if props.Pill {
+			pill
+		}
+		if props.Label != "" {
+			label={ props.Label }
+		}
+		if props.Placement != "" {
+			placement={ props.Placement }
+		}
+		if props.Hint != "" {
+			hint={ props.Hint }
+		}
+		if props.WithLabel {
+			with-label
+		}
+		if props.WithHint {
+			with-hint
+		}
+		if props.Required {
+			required
+		}
+		if props.OnInput != "" {
+			x-on:input={ props.OnInput }
+		}
+		if props.OnChange != "" {
+			x-on:change={ props.OnChange }
+		}
+		if props.OnFocus != "" {
+			x-on:focus={ props.OnFocus }
+		}
+		if props.OnBlur != "" {
+			x-on:blur={ props.OnBlur }
+		}
+		if props.OnClear != "" {
+			x-on:wa-clear={ props.OnClear }
+		}
+		if props.OnShow != "" {
+			x-on:wa-show={ props.OnShow }
+		}
+		if props.OnAfterShow != "" {
+			x-on:wa-after-show={ props.OnAfterShow }
+		}
+		if props.OnHide != "" {
+			x-on:wa-hide={ props.OnHide }
+		}
+		if props.OnAfterHide != "" {
+			x-on:wa-after-hide={ props.OnAfterHide }
+		}
+		if props.OnInvalid != "" {
+			x-on:wa-invalid={ props.OnInvalid }
+		}
+		{ props.Attrs... }
+	>
+		if props.Slots.Label != nil {
+			<div slot="label">
+				@props.Slots.Label
+			</div>
+		}
+		if props.Slots.Start != nil {
+			<div slot="start">
+				@props.Slots.Start
+			</div>
+		}
+		if props.Slots.End != nil {
+			<div slot="end">
+				@props.Slots.End
+			</div>
+		}
+		if props.Slots.ClearIcon != nil {
+			<div slot="clear-icon">
+				@props.Slots.ClearIcon
+			</div>
+		}
+		if props.Slots.ExpandIcon != nil {
+			<div slot="expand-icon">
+				@props.Slots.ExpandIcon
+			</div>
+		}
+		if props.Slots.Hint != nil {
+			<div slot="hint">
+				@props.Slots.Hint
+			</div>
+		}
+		{ children... }
+	</wa-select>
+}
+
+// SelectFunc renders with a builder function for inline configuration
+templ SelectFunc(fn func(*SelectBuilder)) {
+	{{ b := NewSelect(); fn(b) }}
+	@Select(b.Props()) {
+		{ children... }
+	}
+}

pkg/wa/select_templ.go

@@ -0,0 +1,968 @@
+// Code generated by templ - DO NOT EDIT.
+
+// templ: version: v0.3.977
+// Code generated by wa-generator. DO NOT EDIT.
+
+// Source: Web Awesome wa-select
+
+package wa
+
+//lint:file-ignore SA4006 This context is only used if a nested component is present.
+
+import "github.com/a-h/templ"
+import templruntime "github.com/a-h/templ/runtime"
+
+import (
+	"github.com/a-h/templ"
+)
+
+// Selects allow you to choose items from a menu of predefined options.
+//
+// Web Awesome component: <wa-select>
+
+// SelectProps holds all properties for the wa-select component
+type SelectProps struct {
+	// The name of the select, submitted as a name/value pair with form data.
+	Name string `attr:"name"`
+	// The select's value. This will be a string for single select or an array for multi-select.
+	Value string `attr:"value"`
+	// The select's size.
+	// Valid values: "small", "medium", "large"
+	Size string `attr:"size"`
+	// Placeholder text to show as a hint when the select is empty.
+	Placeholder string `attr:"placeholder"`
+	// Allows more than one option to be selected.
+	Multiple bool `attr:"multiple"`
+	// The maximum number of selected options to show when multiple is true. After the maximum, "+n" will be shown to
+	MaxOptionsVisible float64 `attr:"max-options-visible"`
+	// Disables the select control.
+	Disabled bool `attr:"disabled"`
+	// Adds a clear button when the select is not empty.
+	WithClear bool `attr:"with-clear"`
+	// Indicates whether or not the select is open. You can toggle this attribute to show and hide the menu, or you can
+	Open bool `attr:"open"`
+	// The select's visual appearance.
+	// Valid values: "filled", "outlined", "filled-outlined"
+	Appearance string `attr:"appearance"`
+	// Draws a pill-style select with rounded edges.
+	Pill bool `attr:"pill"`
+	// The select's label. If you need to display HTML, use the label slot instead.
+	Label string `attr:"label"`
+	// The preferred placement of the select's menu. Note that the actual placement may vary as needed to keep the listbox
+	// Valid values: "top", "bottom"
+	Placement string `attr:"placement"`
+	// The select's hint. If you need to display HTML, use the hint slot instead.
+	Hint string `attr:"hint"`
+	// Used for SSR purposes when a label is slotted in. Will show the label on first render.
+	WithLabel bool `attr:"with-label"`
+	// Used for SSR purposes when hint is slotted in. Will show the hint on first render.
+	WithHint bool `attr:"with-hint"`
+	// The select's required attribute.
+	Required bool `attr:"required"`
+
+	// Events
+	// Emitted when the control receives input.
+	OnInput string `attr:"x-on:input"`
+	// Emitted when the control's value changes.
+	OnChange string `attr:"x-on:change"`
+	// Emitted when the control gains focus.
+	OnFocus string `attr:"x-on:focus"`
+	// Emitted when the control loses focus.
+	OnBlur string `attr:"x-on:blur"`
+	// Emitted when the control's value is cleared.
+	OnClear string `attr:"x-on:wa-clear"`
+	// Emitted when the select's menu opens.
+	OnShow string `attr:"x-on:wa-show"`
+	// Emitted after the select's menu opens and all animations are complete.
+	OnAfterShow string `attr:"x-on:wa-after-show"`
+	// Emitted when the select's menu closes.
+	OnHide string `attr:"x-on:wa-hide"`
+	// Emitted after the select's menu closes and all animations are complete.
+	OnAfterHide string `attr:"x-on:wa-after-hide"`
+	// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+	OnInvalid string `attr:"x-on:wa-invalid"`
+
+	// Slots contains named slot content
+	Slots SelectSlots
+
+	// Attrs contains additional HTML attributes
+	Attrs templ.Attributes
+}
+
+// SelectSlots holds named slot content for the component
+type SelectSlots struct {
+	// The input's label. Alternatively, you can use the label attribute.
+	Label templ.Component
+	// An element, such as <wa-icon>, placed at the start of the combobox.
+	Start templ.Component
+	// An element, such as <wa-icon>, placed at the end of the combobox.
+	End templ.Component
+	// An icon to use in lieu of the default clear icon.
+	ClearIcon templ.Component
+	// The icon to show when the control is expanded and collapsed. Rotates on open and close.
+	ExpandIcon templ.Component
+	// Text that describes how to use the input. Alternatively, you can use the hint attribute.
+	Hint templ.Component
+}
+
+// SelectBuilder provides a fluent API for constructing SelectProps
+type SelectBuilder struct {
+	props SelectProps
+}
+
+// NewSelect creates a new builder for wa-select
+func NewSelect() *SelectBuilder {
+	return &SelectBuilder{}
+}
+
+// Name sets the name attribute
+// The name of the select, submitted as a name/value pair with form data.
+func (b *SelectBuilder) Name(v string) *SelectBuilder {
+	b.props.Name = v
+	return b
+}
+
+// Value sets the value attribute
+// The select's value. This will be a string for single select or an array for multi-select.
+func (b *SelectBuilder) Value(v string) *SelectBuilder {
+	b.props.Value = v
+	return b
+}
+
+// Size sets the size attribute
+// The select's size.
+func (b *SelectBuilder) Size(v string) *SelectBuilder {
+	b.props.Size = v
+	return b
+}
+
+// Placeholder sets the placeholder attribute
+// Placeholder text to show as a hint when the select is empty.
+func (b *SelectBuilder) Placeholder(v string) *SelectBuilder {
+	b.props.Placeholder = v
+	return b
+}
+
+// Multiple sets the multiple attribute
+// Allows more than one option to be selected.
+func (b *SelectBuilder) Multiple(v bool) *SelectBuilder {
+	b.props.Multiple = v
+	return b
+}
+
+// MaxOptionsVisible sets the max-options-visible attribute
+// The maximum number of selected options to show when multiple is true. After the maximum, "+n" will be shown to
+func (b *SelectBuilder) MaxOptionsVisible(v float64) *SelectBuilder {
+	b.props.MaxOptionsVisible = v
+	return b
+}
+
+// Disabled sets the disabled attribute
+// Disables the select control.
+func (b *SelectBuilder) Disabled(v bool) *SelectBuilder {
+	b.props.Disabled = v
+	return b
+}
+
+// WithClear sets the with-clear attribute
+// Adds a clear button when the select is not empty.
+func (b *SelectBuilder) WithClear(v bool) *SelectBuilder {
+	b.props.WithClear = v
+	return b
+}
+
+// Open sets the open attribute
+// Indicates whether or not the select is open. You can toggle this attribute to show and hide the menu, or you can
+func (b *SelectBuilder) Open(v bool) *SelectBuilder {
+	b.props.Open = v
+	return b
+}
+
+// Appearance sets the appearance attribute
+// The select's visual appearance.
+func (b *SelectBuilder) Appearance(v string) *SelectBuilder {
+	b.props.Appearance = v
+	return b
+}
+
+// Pill sets the pill attribute
+// Draws a pill-style select with rounded edges.
+func (b *SelectBuilder) Pill(v bool) *SelectBuilder {
+	b.props.Pill = v
+	return b
+}
+
+// Label sets the label attribute
+// The select's label. If you need to display HTML, use the label slot instead.
+func (b *SelectBuilder) Label(v string) *SelectBuilder {
+	b.props.Label = v
+	return b
+}
+
+// Placement sets the placement attribute
+// The preferred placement of the select's menu. Note that the actual placement may vary as needed to keep the listbox
+func (b *SelectBuilder) Placement(v string) *SelectBuilder {
+	b.props.Placement = v
+	return b
+}
+
+// Hint sets the hint attribute
+// The select's hint. If you need to display HTML, use the hint slot instead.
+func (b *SelectBuilder) Hint(v string) *SelectBuilder {
+	b.props.Hint = v
+	return b
+}
+
+// WithLabel sets the with-label attribute
+// Used for SSR purposes when a label is slotted in. Will show the label on first render.
+func (b *SelectBuilder) WithLabel(v bool) *SelectBuilder {
+	b.props.WithLabel = v
+	return b
+}
+
+// WithHint sets the with-hint attribute
+// Used for SSR purposes when hint is slotted in. Will show the hint on first render.
+func (b *SelectBuilder) WithHint(v bool) *SelectBuilder {
+	b.props.WithHint = v
+	return b
+}
+
+// Required sets the required attribute
+// The select's required attribute.
+func (b *SelectBuilder) Required(v bool) *SelectBuilder {
+	b.props.Required = v
+	return b
+}
+
+// OnInput sets the handler for input event
+// Emitted when the control receives input.
+func (b *SelectBuilder) OnInput(handler string) *SelectBuilder {
+	b.props.OnInput = handler
+	return b
+}
+
+// OnChange sets the handler for change event
+// Emitted when the control's value changes.
+func (b *SelectBuilder) OnChange(handler string) *SelectBuilder {
+	b.props.OnChange = handler
+	return b
+}
+
+// OnFocus sets the handler for focus event
+// Emitted when the control gains focus.
+func (b *SelectBuilder) OnFocus(handler string) *SelectBuilder {
+	b.props.OnFocus = handler
+	return b
+}
+
+// OnBlur sets the handler for blur event
+// Emitted when the control loses focus.
+func (b *SelectBuilder) OnBlur(handler string) *SelectBuilder {
+	b.props.OnBlur = handler
+	return b
+}
+
+// OnClear sets the handler for wa-clear event
+// Emitted when the control's value is cleared.
+func (b *SelectBuilder) OnClear(handler string) *SelectBuilder {
+	b.props.OnClear = handler
+	return b
+}
+
+// OnShow sets the handler for wa-show event
+// Emitted when the select's menu opens.
+func (b *SelectBuilder) OnShow(handler string) *SelectBuilder {
+	b.props.OnShow = handler
+	return b
+}
+
+// OnAfterShow sets the handler for wa-after-show event
+// Emitted after the select's menu opens and all animations are complete.
+func (b *SelectBuilder) OnAfterShow(handler string) *SelectBuilder {
+	b.props.OnAfterShow = handler
+	return b
+}
+
+// OnHide sets the handler for wa-hide event
+// Emitted when the select's menu closes.
+func (b *SelectBuilder) OnHide(handler string) *SelectBuilder {
+	b.props.OnHide = handler
+	return b
+}
+
+// OnAfterHide sets the handler for wa-after-hide event
+// Emitted after the select's menu closes and all animations are complete.
+func (b *SelectBuilder) OnAfterHide(handler string) *SelectBuilder {
+	b.props.OnAfterHide = handler
+	return b
+}
+
+// OnInvalid sets the handler for wa-invalid event
+// Emitted when the form control has been checked for validity and its constraints aren't satisfied.
+func (b *SelectBuilder) OnInvalid(handler string) *SelectBuilder {
+	b.props.OnInvalid = handler
+	return b
+}
+
+// LabelSlot sets the label slot content
+// The input's label. Alternatively, you can use the label attribute.
+func (b *SelectBuilder) LabelSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.Label = c
+	return b
+}
+
+// StartSlot sets the start slot content
+// An element, such as <wa-icon>, placed at the start of the combobox.
+func (b *SelectBuilder) StartSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.Start = c
+	return b
+}
+
+// EndSlot sets the end slot content
+// An element, such as <wa-icon>, placed at the end of the combobox.
+func (b *SelectBuilder) EndSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.End = c
+	return b
+}
+
+// ClearIconSlot sets the clear-icon slot content
+// An icon to use in lieu of the default clear icon.
+func (b *SelectBuilder) ClearIconSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.ClearIcon = c
+	return b
+}
+
+// ExpandIconSlot sets the expand-icon slot content
+// The icon to show when the control is expanded and collapsed. Rotates on open and close.
+func (b *SelectBuilder) ExpandIconSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.ExpandIcon = c
+	return b
+}
+
+// HintSlot sets the hint slot content
+// Text that describes how to use the input. Alternatively, you can use the hint attribute.
+func (b *SelectBuilder) HintSlot(c templ.Component) *SelectBuilder {
+	b.props.Slots.Hint = c
+	return b
+}
+
+// Attr adds a custom HTML attribute
+func (b *SelectBuilder) Attr(name, value string) *SelectBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	b.props.Attrs[name] = value
+	return b
+}
+
+// Attrs merges multiple attributes
+func (b *SelectBuilder) Attrs(attrs templ.Attributes) *SelectBuilder {
+	if b.props.Attrs == nil {
+		b.props.Attrs = templ.Attributes{}
+	}
+	for k, v := range attrs {
+		b.props.Attrs[k] = v
+	}
+	return b
+}
+
+// Props returns the built properties
+func (b *SelectBuilder) Props() SelectProps {
+	return b.props
+}
+
+// Build returns the props (alias for Props for semantic clarity)
+func (b *SelectBuilder) Build() SelectProps {
+	return b.props
+}
+
+// Select renders the wa-select component
+func Select(props SelectProps) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var1 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var1 == nil {
+			templ_7745c5c3_Var1 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 1, "<wa-select")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Name != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 2, " name=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var2 string
+			templ_7745c5c3_Var2, templ_7745c5c3_Err = templ.JoinStringErrs(props.Name)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 374, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var2))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 3, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Value != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 4, " value=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var3 string
+			templ_7745c5c3_Var3, templ_7745c5c3_Err = templ.JoinStringErrs(props.Value)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 377, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var3))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 5, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Size != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 6, " size=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var4 string
+			templ_7745c5c3_Var4, templ_7745c5c3_Err = templ.JoinStringErrs(props.Size)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 380, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var4))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 7, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Placeholder != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 8, " placeholder=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var5 string
+			templ_7745c5c3_Var5, templ_7745c5c3_Err = templ.JoinStringErrs(props.Placeholder)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 383, Col: 34}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var5))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 9, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Multiple {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 10, " multiple")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.MaxOptionsVisible != 0 {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 11, " max-options-visible=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var6 string
+			templ_7745c5c3_Var6, templ_7745c5c3_Err = templ.JoinStringErrs(templ.Sprintf("%v", props.MaxOptionsVisible))
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 389, Col: 69}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var6))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 12, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Disabled {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 13, " disabled")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithClear {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 14, " with-clear")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Open {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 15, " open")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Appearance != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 16, " appearance=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var7 string
+			templ_7745c5c3_Var7, templ_7745c5c3_Err = templ.JoinStringErrs(props.Appearance)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 401, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var7))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 17, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Pill {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 18, " pill")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Label != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 19, " label=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var8 string
+			templ_7745c5c3_Var8, templ_7745c5c3_Err = templ.JoinStringErrs(props.Label)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 407, Col: 22}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var8))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 20, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Placement != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 21, " placement=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var9 string
+			templ_7745c5c3_Var9, templ_7745c5c3_Err = templ.JoinStringErrs(props.Placement)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 410, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var9))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 22, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Hint != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 23, " hint=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var10 string
+			templ_7745c5c3_Var10, templ_7745c5c3_Err = templ.JoinStringErrs(props.Hint)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 413, Col: 20}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var10))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 24, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithLabel {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 25, " with-label")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.WithHint {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 26, " with-hint")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Required {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 27, " required")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnInput != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 28, " x-on:input=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var11 string
+			templ_7745c5c3_Var11, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnInput)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 425, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var11))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 29, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnChange != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 30, " x-on:change=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var12 string
+			templ_7745c5c3_Var12, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnChange)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 428, Col: 31}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var12))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 31, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnFocus != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 32, " x-on:focus=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var13 string
+			templ_7745c5c3_Var13, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnFocus)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 431, Col: 29}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var13))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 33, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnBlur != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 34, " x-on:blur=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var14 string
+			templ_7745c5c3_Var14, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnBlur)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 434, Col: 27}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var14))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 35, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnClear != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 36, " x-on:wa-clear=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var15 string
+			templ_7745c5c3_Var15, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnClear)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 437, Col: 32}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var15))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 37, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 38, " x-on:wa-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var16 string
+			templ_7745c5c3_Var16, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 440, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var16))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 39, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterShow != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 40, " x-on:wa-after-show=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var17 string
+			templ_7745c5c3_Var17, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterShow)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 443, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var17))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 41, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 42, " x-on:wa-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var18 string
+			templ_7745c5c3_Var18, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 446, Col: 30}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var18))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 43, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnAfterHide != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 44, " x-on:wa-after-hide=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var19 string
+			templ_7745c5c3_Var19, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnAfterHide)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 449, Col: 41}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var19))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 45, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.OnInvalid != "" {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 46, " x-on:wa-invalid=\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			var templ_7745c5c3_Var20 string
+			templ_7745c5c3_Var20, templ_7745c5c3_Err = templ.JoinStringErrs(props.OnInvalid)
+			if templ_7745c5c3_Err != nil {
+				return templ.Error{Err: templ_7745c5c3_Err, FileName: `pkg/wa/select.templ`, Line: 452, Col: 36}
+			}
+			_, templ_7745c5c3_Err = templ_7745c5c3_Buffer.WriteString(templ.EscapeString(templ_7745c5c3_Var20))
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 47, "\"")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ.RenderAttributes(ctx, templ_7745c5c3_Buffer, props.Attrs)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 48, ">")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		if props.Slots.Label != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 49, "<div slot=\"label\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Label.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 50, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Start != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 51, "<div slot=\"start\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Start.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 52, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.End != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 53, "<div slot=\"end\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.End.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 54, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.ClearIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 55, "<div slot=\"clear-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.ClearIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 56, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.ExpandIcon != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 57, "<div slot=\"expand-icon\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.ExpandIcon.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 58, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		if props.Slots.Hint != nil {
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 59, "<div slot=\"hint\">")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = props.Slots.Hint.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 60, "</div>")
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+		}
+		templ_7745c5c3_Err = templ_7745c5c3_Var1.Render(ctx, templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		templ_7745c5c3_Err = templruntime.WriteString(templ_7745c5c3_Buffer, 61, "</wa-select>")
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+// SelectFunc renders with a builder function for inline configuration
+func SelectFunc(fn func(*SelectBuilder)) templ.Component {
+	return templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+		templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+		if templ_7745c5c3_CtxErr := ctx.Err(); templ_7745c5c3_CtxErr != nil {
+			return templ_7745c5c3_CtxErr
+		}
+		templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+		if !templ_7745c5c3_IsBuffer {
+			defer func() {
+				templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+				if templ_7745c5c3_Err == nil {
+					templ_7745c5c3_Err = templ_7745c5c3_BufErr
+				}
+			}()
+		}
+		ctx = templ.InitializeContext(ctx)
+		templ_7745c5c3_Var21 := templ.GetChildren(ctx)
+		if templ_7745c5c3_Var21 == nil {
+			templ_7745c5c3_Var21 = templ.NopComponent
+		}
+		ctx = templ.ClearChildren(ctx)
+		b := NewSelect()
+		fn(b)
+		templ_7745c5c3_Var22 := templruntime.GeneratedTemplate(func(templ_7745c5c3_Input templruntime.GeneratedComponentInput) (templ_7745c5c3_Err error) {
+			templ_7745c5c3_W, ctx := templ_7745c5c3_Input.Writer, templ_7745c5c3_Input.Context
+			templ_7745c5c3_Buffer, templ_7745c5c3_IsBuffer := templruntime.GetBuffer(templ_7745c5c3_W)
+			if !templ_7745c5c3_IsBuffer {
+				defer func() {
+					templ_7745c5c3_BufErr := templruntime.ReleaseBuffer(templ_7745c5c3_Buffer)
+					if templ_7745c5c3_Err == nil {
+						templ_7745c5c3_Err = templ_7745c5c3_BufErr
+					}
+				}()
+			}
+			ctx = templ.InitializeContext(ctx)
+			templ_7745c5c3_Err = templ_7745c5c3_Var21.Render(ctx, templ_7745c5c3_Buffer)
+			if templ_7745c5c3_Err != nil {
+				return templ_7745c5c3_Err
+			}
+			return nil
+		})
+		templ_7745c5c3_Err = Select(b.Props()).Render(templ.WithChildren(ctx, templ_7745c5c3_Var22), templ_7745c5c3_Buffer)
+		if templ_7745c5c3_Err != nil {
+			return templ_7745c5c3_Err
+		}
+		return nil
+	})
+}
+
+var _ = templruntime.GeneratedTemplate