Rewrote all the docs - more noob friendly now.

Co-authored-by: Copilot <copilot@github.com>

docs/Components/Textarea.md

@@ -1,37 +1,23 @@
 # Textarea
 
-A styled multi-line text input with optional label, description, default value, and HTMX attributes.
+A styled multi-line text input. Use it when you need more than a single line of text — comments, descriptions, notes, bio fields, or message composition.
 
 ---
 
-## HTML structure
+## Quick example
 
-```
-div.flex.flex-col.gap-1.5
-  label[for={id}].text-sm.font-medium        ← omitted when label is empty
-    {label}
-  textarea[id, name, placeholder, rows, class, $$HxAttrs$$]
-    {defaultValue}
-  p.text-sm.text-muted-foreground            ← omitted when description is empty
-    {description}
+```csharp
+new Textarea(
+    id:          "comment",
+    name:        "comment",
+    placeholder: "Write a comment…",
+    label:       "Comment",
+    rows:        5)
 ```
 
 ---
 
-## CSS mechanics
-
-| Class | Effect |
-|---|---|
-| `flex min-h-[80px] w-full rounded-md border border-input bg-background` | Full-width field with minimum height |
-| `px-3 py-2 text-sm` | Inner padding and text size |
-| `focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring` | Keyboard focus ring |
-| `disabled:cursor-not-allowed disabled:opacity-50` | Disabled state |
-| `placeholder:text-muted-foreground` | Muted placeholder text |
-| `resize-y` | Allows vertical resize only |
-
----
-
-## Constructor signature
+## All the options
 
 ```csharp
 public Textarea(
@@ -46,45 +32,37 @@ public Textarea(
     int    rows         = 3)
 ```
 
-| Parameter | Description |
+| Parameter | What it does |
 |---|---|
-| `id` | Element id and label `for` target |
-| `name` | Form field name |
-| `placeholder` | Placeholder text |
-| `label` | Optional visible label |
-| `description` | Optional helper text below the field |
-| `defaultValue` | Pre-filled content of the textarea |
-| `extraClasses` | Additional Tailwind classes on the textarea |
-| `hxAttrs` | Verbatim HTMX / data attributes |
-| `rows` | Number of visible rows (default: 3) |
+| `id` | The element id. Also used by the `<label for="...">`. |
+| `name` | Form field name. |
+| `placeholder` | Greyed-out hint inside the field when it is empty. |
+| `label` | Visible text label above the field. |
+| `description` | Small hint below the field (e.g. character limits). |
+| `defaultValue` | Pre-filled content. |
+| `extraClasses` | Additional Tailwind classes on the `<textarea>`. |
+| `hxAttrs` | Extra HTML attributes appended verbatim. |
+| `rows` | How many lines tall the field is initially. Default is 3. |
 
 ---
 
-## Usage examples
+## Real-world examples
 
-### Comment field
-
-```csharp
-new Textarea(
-    id:          "comment",
-    name:        "comment",
-    placeholder: "Write a comment…",
-    label:       "Comment",
-    rows:        5)
-```
-
-### Bio field with default value
+### Bio field (editing an existing value)
 
 ```csharp
 new Textarea(
     id:           "bio",
     name:         "bio",
     label:        "Bio",
-    description:  "Tell us about yourself (max 280 characters)",
-    defaultValue: user.Bio ?? "")
+    description:  "Max 280 characters",
+    defaultValue: System.Web.HttpUtility.HtmlEncode(user.Bio ?? ""),
+    rows:         4)
 ```
 
-### Auto-expand with HTMX
+### Auto-growing field (expands as the user types)
+
+Pass a small `oninput` handler through `hxAttrs`:
 
 ```csharp
 new Textarea(
@@ -95,9 +73,19 @@ new Textarea(
     hxAttrs: """oninput="this.style.height=''; this.style.height=this.scrollHeight+'px'"""")
 ```
 
-### Auto-save on input
+### Reading on the server
 
 ```csharp
+public record Command(
+    [property: FromForm] string Bio
+);
+```
+
+---
+
+## How it works
+
+Textarea renders a standard HTML `<textarea>` element. The `defaultValue` is placed between the opening and closing tags (not in `value` like an `<input>`). Always HTML-encode any user-supplied `defaultValue` before passing it in.
 new Textarea(
     id:      "draft",
     name:    "content",