@thebase/ui 1.1.3 → 1.1.5

package/docs/components/pwa.md

@@ -2,7 +2,7 @@
 
 Use `b-ui="pwa"` for a bottom-anchored install/permission prompt (an "Add to Home Screen" or "Allow notifications" sheet). Pwa is presentational only — it owns open/close state and focus/Escape handling, not the actual install or notification API calls. Wire your app's `beforeinstallprompt`/`Notification.requestPermission()` logic to the footer buttons you compose inside it.
 
-## Pure Owl component
+## Base component
 
 ```js
 import {
@@ -59,7 +59,7 @@ A launcher rendered outside the `Pwa` tree opens it through `PwaTrigger`, or by
 
 Render a second `Pwa` instance for a follow-up prompt (e.g. "Allow notifications" after install is dismissed) — each `Pwa` owns its own open state independently.
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 

package/docs/components/questionnaire.md

@@ -4,9 +4,9 @@ Use `b-ui="questionnaire"` for a CDN-ready questionnaire component.
 
 ## CDN install requirements
 
-Load the pinned BaseUI CSS and JavaScript files; no extra dependency is required for this component.
+Load the pinned the Base UI CSS and JavaScript files; no extra dependency is required for this component.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Questionnaire, QuestionnaireNext, QuestionnairePrevious, QuestionnaireStep } from "@thebase/ui";
@@ -83,7 +83,7 @@ import { Questionnaire, QuestionnaireNext, QuestionnairePrevious, QuestionnaireS
 | `QuestionnaireStep` | `index` | `Number` | required |
 | `QuestionnaireStep` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 
@@ -109,7 +109,7 @@ Interactive components emit documented `baseui:*` events from their root element
 
 ## CSS variables
 
-The component inherits BaseUI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
+The component inherits the Base UI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
 
 ## Accessibility behavior
 
@@ -121,7 +121,7 @@ See `examples/index.html` for a working CDN-style page.
 
 ## Browser support
 
-BaseUI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
+The Base UI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
 
 ## Test checklist
 

package/docs/components/radio-group.md

@@ -2,7 +2,7 @@
 
 Native radio input or label wrapper.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { RadioGroup, RadioGroupItem } from "@thebase/ui";
@@ -28,7 +28,7 @@ import { RadioGroup, RadioGroupItem } from "@thebase/ui";
 | `RadioGroupItem` | `disabled` | `Boolean` | optional |
 | `RadioGroupItem` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 

package/docs/components/resizable.md

@@ -4,9 +4,9 @@ Use `b-ui="resizable"` for a CDN-ready resizable component.
 
 ## CDN install requirements
 
-Load the pinned BaseUI CSS and JavaScript files; no extra dependency is required for this component.
+Load the pinned the Base UI CSS and JavaScript files; no extra dependency is required for this component.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Resizable } from "@thebase/ui";
@@ -39,7 +39,7 @@ import { Resizable } from "@thebase/ui";
 | `Resizable` | `onChange` | `Function` | optional |
 | `Resizable` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 
@@ -65,7 +65,7 @@ Interactive components emit documented `baseui:*` events from their root element
 
 ## CSS variables
 
-The component inherits BaseUI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
+The component inherits the Base UI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
 
 ## Accessibility behavior
 
@@ -77,7 +77,7 @@ See `examples/index.html` for a working CDN-style page.
 
 ## Browser support
 
-BaseUI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
+The Base UI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
 
 ## Test checklist
 

package/docs/components/scroll-area.md

@@ -4,9 +4,9 @@ Use `b-ui="scroll-area"` for a CDN-ready scroll area component.
 
 ## CDN install requirements
 
-Load the pinned BaseUI CSS and JavaScript files; no extra dependency is required for this component.
+Load the pinned the Base UI CSS and JavaScript files; no extra dependency is required for this component.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { ScrollArea } from "@thebase/ui";
@@ -43,7 +43,7 @@ import { ScrollArea } from "@thebase/ui";
 | --- | --- | --- | --- |
 | `ScrollArea` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 
@@ -69,7 +69,7 @@ Interactive components emit documented `baseui:*` events from their root element
 
 ## CSS variables
 
-The component inherits BaseUI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
+The component inherits the Base UI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
 
 ## Accessibility behavior
 
@@ -81,7 +81,7 @@ See `examples/index.html` for a working CDN-style page.
 
 ## Browser support
 
-BaseUI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
+The Base UI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
 
 ## Test checklist
 

package/docs/components/select.md

@@ -1,15 +1,15 @@
 # Select
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Select, SelectContent, SelectItem, SelectTrigger } from "@thebase/ui";
 ```
 
 ```base-ui
-<div style="max-width: 180px">
-  <Select value="'dark'">
-    <SelectTrigger>Theme</SelectTrigger>
+<div style="max-width: 240px">
+  <Select label="'Theme'" value="'dark'">
+    <SelectTrigger>Dark</SelectTrigger>
     <SelectContent>
       <SelectItem value="'light'">Light</SelectItem>
       <SelectItem value="'dark'">Dark</SelectItem>
@@ -24,12 +24,13 @@ import { Select, SelectContent, SelectItem, SelectTrigger } from "@thebase/ui";
 | `Select` | `value` | `String` | optional |
 | `Select` | `onChange` | `Function` | optional |
 | `Select` | `className` | `String` | optional |
+| `Select` | `label`, `labelBackground`, `supportingText`, `errorText`, `invalid` | `String` / `Boolean` | Material-style outlined field, same behaviour as [Input](/examples/blocks.html#/docs/components/input): the label floats onto the border, `errorText` replaces `supportingText`. Also inherited from a parent `Field`. |
 | `SelectContent` | `className` | `String` | optional |
 | `SelectItem` | `value` | `String` | required |
 | `SelectItem` | `className` | `String` | optional |
 | `SelectTrigger` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 

package/docs/components/separator.md

@@ -2,7 +2,7 @@
 
 Visual divider with separator semantics.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Separator } from "@thebase/ui";
@@ -30,7 +30,7 @@ import { Separator } from "@thebase/ui";
 | `Separator` | `orientation` | `String` | optional |
 | `Separator` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 

package/docs/components/sheet.md

@@ -2,7 +2,7 @@
 
 Use `b-ui="sheet"` for offcanvas panels.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHeader, SheetTitle, SheetTrigger } from "@thebase/ui";
@@ -38,7 +38,7 @@ import { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHe
 | `SheetTitle` | `className` | `String` | optional |
 | `SheetTrigger` | `className` | `String` | optional |
 
-`SheetContent` also accepts `side` (`"left"` or the default right), falling back to the `side` prop on the parent `Sheet` when unset. It is driven by a real `bootstrap.Offcanvas` instance bound to its own root, rendered as `.offcanvas.offcanvas-end` by default or `.offcanvas.offcanvas-start` for `side="left"`, permanently mounted rather than added/removed from the DOM. Escape, backdrop click, and the Tab focus trap are Bootstrap's own native Offcanvas behavior; focus-restore-to-trigger on close is kept by hand (not native to Offcanvas). `SheetClose` closes via `data-bs-dismiss="offcanvas"`. See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+`SheetContent` also accepts `side` (`"left"` or the default right), falling back to the `side` prop on the parent `Sheet` when unset. It is driven by a real `bootstrap.Offcanvas` instance bound to its own root, rendered as `.offcanvas.offcanvas-end` by default or `.offcanvas.offcanvas-start` for `side="left"`, permanently mounted rather than added/removed from the DOM. Escape, backdrop click, and the Tab focus trap are Bootstrap's own native Offcanvas behavior; focus-restore-to-trigger on close is kept by hand (not native to Offcanvas). `SheetClose` closes via `data-bs-dismiss="offcanvas"`. See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 
@@ -53,6 +53,6 @@ import { Sheet, SheetClose, SheetContent, SheetDescription, SheetFooter, SheetHe
 
 At mount, `[b-ui="sheet"]` itself becomes the `.offcanvas.offcanvas-end` element (`.offcanvas.offcanvas-start` when `b-att-side="left"`, `tabindex="-1"`) driven by a real `bootstrap.Offcanvas` instance (`backdrop: true, keyboard: true, scroll: false`); `[b-sheet-panel]` stays as a plain cosmetic content box inside it. `[b-sheet-close]` buttons get `data-bs-dismiss="offcanvas"` at mount time instead of a manual click handler.
 
-Events: `baseui:open`, `baseui:close` (BaseUI), plus the underlying `shown.bs.offcanvas`/`hidden.bs.offcanvas`.
+Events: `baseui:open`, `baseui:close` (the Base UI), plus the underlying `shown.bs.offcanvas`/`hidden.bs.offcanvas`.
 
 Options: `b-att-side="left"` moves the sheet panel to the left (`offcanvas-start` instead of `offcanvas-end`). The sheet closes on backdrop click, close button (`data-bs-dismiss="offcanvas"`), or Escape — all native `bootstrap.Offcanvas` behavior — and traps Tab focus while open, restoring focus to the trigger on close (kept by hand — not native to Offcanvas).

package/docs/components/shell.md

@@ -2,7 +2,7 @@
 
 Use `b-ui="shell"` for a collapsible app shell: a desktop-collapsible/mobile off-canvas sidebar next to a sticky header and scrollable content region.
 
-## Pure Owl component
+## Base component
 
 ```js
 import {
@@ -74,7 +74,7 @@ Four cross-cutting concerns are opt-in via props instead of baked into the layou
 | `ShellContent` | `className` | `String` | optional |
 | `ShellUserMenu` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 

package/docs/components/sidebar.md

@@ -2,7 +2,7 @@
 
 Use `b-ui="sidebar"` for app navigation panels. The component mirrors shadcn's composable Sidebar parts: header, content, footer, groups, menu rows, actions, nested submenus, rail, inset, and trigger.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Sidebar, SidebarContent, SidebarFooter, SidebarHeader, SidebarMenu, SidebarMenuButton, SidebarMenuItem } from "@thebase/ui";
@@ -234,7 +234,7 @@ Reusable nav-content primitives, extracted from the recurring group/item shapes
 | `SidebarMenuSubButton` | `href` | `String` | optional |
 | `SidebarMenuSubItem` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 

package/docs/components/skeleton.md

@@ -2,7 +2,7 @@
 
 Loading placeholder for content that is not ready yet.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Skeleton } from "@thebase/ui";
@@ -29,7 +29,7 @@ import { Skeleton } from "@thebase/ui";
 | `Skeleton` | `shape` | `String` | optional |
 | `Skeleton` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 

package/docs/components/slider.md

@@ -1,6 +1,6 @@
 # Slider
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Slider } from "@thebase/ui";
@@ -22,7 +22,7 @@ import { Slider } from "@thebase/ui";
 | `Slider` | `className` | `String` | optional |
 | `Slider` | `onChange` | `Function` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 

package/docs/components/spinner.md

@@ -2,7 +2,7 @@
 
 Inline loading indicator using Bootstrap spinner classes.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Spinner } from "@thebase/ui";
@@ -24,7 +24,7 @@ import { Spinner } from "@thebase/ui";
 | `Spinner` | `label` | `String` | optional |
 | `Spinner` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 
@@ -35,4 +35,4 @@ See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for
 
 Options: `b-att-type="border|grow"`, `b-att-label`.
 
-Accessibility: BaseUI adds `role="status"` and hidden loading text.
+Accessibility: The Base UI adds `role="status"` and hidden loading text.

package/docs/components/switch.md

@@ -2,7 +2,7 @@
 
 Checkbox-backed switch control using `role="switch"`.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Switch } from "@thebase/ui";
@@ -21,7 +21,7 @@ import { Switch } from "@thebase/ui";
 | `Switch` | `className` | `String` | optional |
 | `Switch` | `onChange` | `Function` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 

package/docs/components/table.md

@@ -2,7 +2,7 @@
 
 Native table styling for static or server-rendered data.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Table } from "@thebase/ui";
@@ -50,7 +50,7 @@ import { Table } from "@thebase/ui";
 | `Table` | `hover` | `Boolean` | optional |
 | `Table` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 

package/docs/components/tabs.md

@@ -6,7 +6,7 @@ as a segmented pill control on a muted background by default, or a transparent u
 background — a bordered/padded look is opt-in via `className` on `TabsContainer` (or the
 consumer's own wrapper), not baked into every panel.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Tabs, TabContent, TabsContainer, TabsList, TabTrigger } from "@thebase/ui";
@@ -57,10 +57,10 @@ The `"line"` variant swaps the segmented pill for a transparent, underline-drive
 
 ArrowLeft/ArrowRight (or ArrowUp/ArrowDown when vertical) move focus and selection between
 `TabTrigger`s, same as the static API — each trigger's own live `bootstrap.Tab` instance handles
-this natively. See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how
+this natively. See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how
 to load `@base/owl` and `dist/baseui.templates.xml`.
 
-Each `TabTrigger` (`b-tab` button / pure Owl `TabTrigger`'s own root) is driven by a live `bootstrap.Tab` instance: it always carries `role="tab"` plus a `data-bs-target="#<id>"` pointing at its linked pane, and Bootstrap itself manages the pane's `tab-pane fade`/`show`/`active` classes and the trigger's `active`/`aria-selected`/`tabindex` across switches — don't rely on node removal to detect the active panel; every `TabContent`/`b-panel` stays mounted permanently (`role="tabpanel"`, `tab-pane fade` + `show active` on the initially active one).
+Each `TabTrigger` (`b-tab` button / pure Base `TabTrigger`'s own root) is driven by a live `bootstrap.Tab` instance: it always carries `role="tab"` plus a `data-bs-target="#<id>"` pointing at its linked pane, and Bootstrap itself manages the pane's `tab-pane fade`/`show`/`active` classes and the trigger's `active`/`aria-selected`/`tabindex` across switches — don't rely on node removal to detect the active panel; every `TabContent`/`b-panel` stays mounted permanently (`role="tabpanel"`, `tab-pane fade` + `show active` on the initially active one).
 
 ## Static component
 
@@ -74,7 +74,7 @@ Each `TabTrigger` (`b-tab` button / pure Owl `TabTrigger`'s own root) is driven
 ```
 
 Add `b-att-variant="line"` on the `[b-ui="tabs"]` host for the transparent underline look instead
-of the default segmented pill. `orientation` is a pure-Owl-only prop — the static markup lays
+of the default segmented pill. `orientation` is a pure Base-only prop — the static markup lays
 `[b-tab]`/`[b-panel]` flat as siblings with no `TabsList`/`TabsContainer`-equivalent grouping
 wrapper to flip into a row/column pair.
 

package/docs/components/text-editor.md

@@ -1,6 +1,6 @@
 # Text Editor
 
-Use `b-ui="text-editor"` (or the pure Owl `TextEditor` component) for WYSIWYG rich-text editing backed by [Milkdown](https://milkdown.dev/) (ProseMirror + a Markdown-aware schema, via `@milkdown/kit`). The editor runtime is lazy-loaded from `dist/runtime/milkdown/milkdown-text-editor.js`, so the default BaseUI bundle stays small until an editor is actually mounted. `content`/`onChange` still deal in HTML — Milkdown's document is converted to/from HTML at the boundary, so nothing in this contract changes even though the engine now understands Markdown natively (e.g. typing a leading `#`, `**bold**`, or `1.` auto-formats as you type).
+Use `b-ui="text-editor"` (or the pure Base `TextEditor` component) for WYSIWYG rich-text editing backed by [Milkdown](https://milkdown.dev/) (ProseMirror + a Markdown-aware schema, via `@milkdown/kit`). The editor runtime is lazy-loaded from `dist/runtime/milkdown/milkdown-text-editor.js`, so the default the Base UI bundle stays small until an editor is actually mounted. `content`/`onChange` still deal in HTML — Milkdown's document is converted to/from HTML at the boundary, so nothing in this contract changes even though the engine now understands Markdown natively (e.g. typing a leading `#`, `**bold**`, or `1.` auto-formats as you type).
 
 Collaborative mode (`collaborative` / `b-att-collaborative`) is optional and off by default; toggle it per editor without changing anything else. It runs on Yjs + `@milkdown/plugin-collab` over one of two providers, picked with `provider` / `b-att-provider`:
 
@@ -9,7 +9,7 @@ Collaborative mode (`collaborative` / `b-att-collaborative`) is optional and off
 
 Collaboration actually turns on when `collaborative` is explicitly truthy, **or** when both `provider` and `url` are supplied — so pointing an editor at a websocket backend (`provider="'websocket'"` + a `url`) is enough on its own, without also setting `collaborative="true"`. If `collaborative` is `false`/unset and `provider`+`url` aren't both present, the editor stays single-user.
 
-## Pure Owl Component
+## Base Component
 
 ```js
 import { TextEditor } from "@base/component";

package/docs/components/textarea.md

@@ -1,8 +1,8 @@
 # Textarea
 
-Native multiline text input with BaseUI and Bootstrap styling.
+Native multiline text input with Base UI and Bootstrap styling.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Textarea } from "@thebase/ui";
@@ -10,25 +10,20 @@ import { Textarea } from "@thebase/ui";
 
 ```base-ui
 <div class="d-flex flex-column gap-4" style="max-width: 28rem; width: 100%">
-  <Textarea placeholder="'Type your message here.'"/>
+  <Textarea label="'Message'"/>
 
-  <div class="d-grid gap-3">
-    <Label htmlFor="'message'">Your message</Label>
-    <Textarea placeholder="'Type your message here.'" id="'message'"/>
-  </div>
+  <Textarea label="'Your message'" placeholder="'Type your message here.'" id="'message'"/>
 
-  <div class="d-grid gap-3">
-    <Label htmlFor="'message-2'">Your Message</Label>
-    <Textarea placeholder="'Type your message here.'" id="'message-2'"/>
-    <Typography variant="'small'" className="'text-muted'">Your message will be copied to the support team.</Typography>
-  </div>
+  <Textarea label="'Your message'" supportingText="'Your message will be copied to the support team.'" maxLength="200"/>
+
+  <Textarea label="'Your message'" errorText="'Message is required'"/>
 
   <div class="d-grid gap-2">
-    <Textarea placeholder="'Type your message here.'"/>
+    <Textarea label="'Feedback'"/>
     <Button>Send message</Button>
   </div>
 
-  <Textarea placeholder="'Type your message here.'" disabled="true"/>
+  <Textarea label="'Disabled'" placeholder="'Type your message here.'" disabled="true"/>
 </div>
 ```
 
@@ -44,8 +39,9 @@ import { Textarea } from "@thebase/ui";
 | `Textarea` | `id` | `String` | optional, e.g. for `Label`'s `for` |
 | `Textarea` | `onInput` | `Function` | optional |
 | `Textarea` | `onChange` | `Function` | optional |
+| `Textarea` | `label`, `supportingText`, `errorText`, `maxLength`, `invalid`, `placeholder` | `String` / `Boolean` | Material-style outlined field, same behaviour as [Input](/examples/blocks.html#/docs/components/input): the label floats onto the border, `errorText` replaces `supportingText`. Also inherited from a parent `Field`. |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 

package/docs/components/theme-button.md

@@ -4,9 +4,9 @@ Use `b-ui="theme-button"` for an icon-only light/dark theme toggle.
 
 ## CDN install requirements
 
-Load BaseUI CSS and the BaseUI JavaScript bundle (`baseui.min.js`). The component uses the built-in Lucide icon renderer and the `@base/theme` helper bundled with BaseUI.
+Load the Base UI CSS and the Base UI JavaScript bundle (`baseui.min.js`). The component uses the built-in Lucide icon renderer and the `@base/theme` helper bundled with Base UI.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { ThemeButton } from "@thebase/ui";
@@ -24,7 +24,7 @@ import { ThemeButton } from "@thebase/ui";
 | `ThemeButton` | `className` | `String` | optional |
 | `ThemeButton` | `onChange` | `Function` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 
@@ -62,7 +62,7 @@ See the example page headers for working `b-ui="theme-button"` navigation usage.
 
 ## Browser support
 
-BaseUI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
+The Base UI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
 
 ## Test checklist
 

package/docs/components/toast.md

@@ -2,7 +2,7 @@
 
 Use `b-ui="toast"` for transient status messages.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Toast } from "@thebase/ui";
@@ -35,7 +35,7 @@ The toast stays hidden until `open`/`state` becomes truthy (never shows on mount
 | `Toast` | `onOpenChange` | `Function` | optional |
 | `Toast` | `action` slot | — | optional — e.g. a `<Button/>`, rendered grouped next to the close button (`<t t-set-slot="action">...</t>`) |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 
@@ -85,4 +85,4 @@ Set `b-att-position` to `top-left`, `top-right`, `bottom-left`, or `bottom-right
 </div>
 ```
 
-The pure Owl `Toast` component takes the same values via its `position` prop.
+The pure Base `Toast` component takes the same values via its `position` prop.

package/docs/components/toggle-group.md

@@ -4,9 +4,9 @@ Use `b-ui="toggle-group"` for a CDN-ready toggle group component.
 
 ## CDN install requirements
 
-Load the pinned BaseUI CSS and JavaScript files; no extra dependency is required for this component.
+Load the pinned the Base UI CSS and JavaScript files; no extra dependency is required for this component.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { ToggleGroup, ToggleGroupItem } from "@thebase/ui";
@@ -36,7 +36,7 @@ import { ToggleGroup, ToggleGroupItem } from "@thebase/ui";
 | `ToggleGroupItem` | `value` | `String` | required |
 | `ToggleGroupItem` | `className` | `String` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 
@@ -62,7 +62,7 @@ Interactive components emit documented `baseui:*` events from their root element
 
 ## CSS variables
 
-The component inherits BaseUI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
+The component inherits the Base UI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
 
 ## Accessibility behavior
 
@@ -74,7 +74,7 @@ See `examples/index.html` for a working CDN-style page.
 
 ## Browser support
 
-BaseUI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
+The Base UI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
 
 ## Test checklist
 

package/docs/components/toggle.md

@@ -4,9 +4,9 @@ Use `b-ui="toggle"` for a CDN-ready toggle component.
 
 ## CDN install requirements
 
-Load the pinned BaseUI CSS and JavaScript files; no extra dependency is required for this component.
+Load the pinned the Base UI CSS and JavaScript files; no extra dependency is required for this component.
 
-## Pure Owl component
+## Base component
 
 ```js
 import { Toggle } from "@thebase/ui";
@@ -37,7 +37,7 @@ import { Toggle } from "@thebase/ui";
 | `Toggle` | `className` | `String` | optional |
 | `Toggle` | `onChange` | `Function` | optional |
 
-See [Pure Owl Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
+See [Base Components](/examples/blocks.html#/docs/guide/owl-components) for how to load `@base/owl` and `dist/baseui.templates.xml`.
 
 ## Static component
 
@@ -63,7 +63,7 @@ Interactive components emit documented `baseui:*` events from their root element
 
 ## CSS variables
 
-The component inherits BaseUI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
+The component inherits the Base UI semantic tokens such as `--b-surface`, `--b-border`, `--b-primary`, and `--b-radius`.
 
 ## Accessibility behavior
 
@@ -75,7 +75,7 @@ See `examples/index.html` for a working CDN-style page.
 
 ## Browser support
 
-BaseUI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
+The Base UI targets modern evergreen browsers that support ES modules, CSS variables, and Bootstrap 5.3.
 
 ## Test checklist