@adia-ai/mcp 0.8.37 → 0.8.39

package/factory/resources/pattern-index.md

@@ -0,0 +1,786 @@
+<!-- GENERATED by scripts/build/generate-factory-mcp-assets.mjs
+     from packages/plugins/adia-ui-factory/skills/pattern-catalog/references/pattern-index.md — the skill file is the
+     single source (ADR-0051 §3). Do not hand-edit; edit the source and run
+     `npm run build:factory-mcp-assets`. -->
+
+<!-- GENERATED in the source repo — never hand-edit here; a consumer install ships this
+     file pre-built. Authored layer: annotations.yaml (same directory). Stale against a
+     monorepo checkout? That is a framework-side bug — file it upstream. -->
+
+# Pre-assembled patterns & templates index
+
+168 reusable assembled surfaces: 47 patterns (composed component arrangements) and 121 template screens (full pages/flows). Search this file by category, keyword, or component tag BEFORE composing a surface from primitives. `source:` is the copyable markup; `docs:` is the live docs-site route (Gen-UI Feed is excluded — it demos gen-ui-wiring's runtime-generated pattern).
+
+## Patterns
+
+### agent-ops
+
+- **Agent Cost & Usage** (Patterns) — Surfaces an agent's own consumption — inline token/cost footer, detailed billing breakdown card, and rate-limit warning.
+  - keywords: token count, billing, spend, quota, rate limit
+  - components: `text-ui` `button-ui` `row-ui` `stat-ui` `tag-ui` `col-ui` `alert-ui` `card-ui` `description-list-ui` `grid-ui` `progress-ui`
+  - source: `/packages/web-components/patterns/agent-cost/agent-cost.examples.html` · demo: `/packages/web-components/patterns/agent-cost/agent-cost.html` · docs: `/site/patterns/agent-cost`
+- **Agent Memory** (Patterns) — Surfaces to audit and edit what an agent remembers — a memory list, a single-entry detail, and an add/revise editor.
+  - keywords: context, recall, saved facts, persistence, remember
+  - components: `button-ui` `tag-ui` `list-item-ui` `card-ui` `col-ui` `radio-ui` `text-ui` `field-ui` `code-ui` `description-list-ui` `list-ui` `row-ui`
+  - source: `/packages/web-components/patterns/agent-memory/agent-memory.examples.html` · demo: `/packages/web-components/patterns/agent-memory/agent-memory.html` · docs: `/site/patterns/agent-memory`
+- **Agent Prompt Library** (Patterns) — Saved-prompt store — a full library grid, a compact in-context recall picker, and the reusable prompt card shared by both.
+  - keywords: snippets, templates, slash menu, saved queries, presets
+  - components: `text-ui` `col-ui` `tag-ui` `card-ui` `row-ui` `button-ui` `icon-ui` `kbd-ui` `description-list-ui` `divider-ui` `grid-ui` `search-ui`
+  - source: `/packages/web-components/patterns/agent-prompt-library/agent-prompt-library.examples.html` · demo: `/packages/web-components/patterns/agent-prompt-library/agent-prompt-library.html` · docs: `/site/patterns/agent-prompt-library`
+- **Agent Tool Call** (Patterns) — The block an agent renders when it invokes a tool — running, success, error, and collapsed states over agent-artifact-ui.
+  - keywords: function invocation, tool use, api call, action block, trace
+  - components: `agent-artifact-ui` `code-ui` `col-ui` `text-ui` `button-ui` `alert-ui` `description-list-ui` `progress-ui` `row-ui`
+  - source: `/packages/web-components/patterns/agent-tool-call/agent-tool-call.examples.html` · demo: `/packages/web-components/patterns/agent-tool-call/agent-tool-call.html` · docs: `/site/patterns/agent-tool-call`
+
+### chat-ai
+
+- **Adia Chat** (Patterns) — LLM chat surface — header, streaming thread, composer, optional sidebar. Doc-hub — copy its "Canonical hierarchy" code sample, not the components list.
+  - keywords: conversation, messaging, assistant, llm interface, streaming thread
+  - components: `code-ui`
+  - source: `/packages/web-components/patterns/chat-shell/chat-shell.examples.html` · demo: `/packages/web-components/patterns/chat-shell/chat-shell.html` · docs: `/site/patterns/chat-shell`
+
+### collaboration
+
+- **Comments & Collaboration** (Patterns) — Comment threads with @-mentions and emoji reactions on any object — reach for it to let users discuss a doc, task, row, or design.
+  - keywords: threads, mentions, reactions, replies, discussion, annotations
+  - components: `button-ui` `text-ui` `row-ui` `col-ui` `avatar-ui` `tag-ui` `card-ui` `field-ui` `kbd-ui` `divider-ui` `icon-ui` `input-ui`
+  - source: `/packages/web-components/patterns/comments-and-collaboration/comments-and-collaboration.examples.html` · demo: `/packages/web-components/patterns/comments-and-collaboration/comments-and-collaboration.html` · docs: `/site/patterns/comments-and-collaboration`
+
+### data-table
+
+- **Audit Log** (Patterns) — Timestamped actor/action/resource rows for compliance and security review — a filterable, paginated table with severity-tagged verbs.
+  - keywords: activity history, compliance trail, security review, events, tracing
+  - components: `button-ui` `row-ui` `select-ui` `text-ui` `card-ui` `table-ui`
+  - source: `/packages/web-components/patterns/audit-log/audit-log.examples.html` · demo: `/packages/web-components/patterns/audit-log/audit-log.html` · docs: `/site/patterns/audit-log`
+- **Bulk Action Toolbar** (Patterns) — Contextual action bar that swaps the table toolbar when rows are selected — reach for it for batch archive/delete/export on a grid.
+  - keywords: multi-select, batch, selection, archive, contextual, delete
+  - components: `button-ui` `toolbar-group-ui` `code-ui` `divider-ui` `card-ui` `table-toolbar-ui` `table-ui` `text-ui` `toolbar-ui` `anchor-bar-ui`
+  - source: `/packages/web-components/patterns/bulk-action-toolbar/bulk-action-toolbar.examples.html` · demo: `/packages/web-components/patterns/bulk-action-toolbar/bulk-action-toolbar.html` · docs: `/site/patterns/bulk-action-toolbar`
+- **Data Tables — Inline Edit & Tree** (Patterns) — Spreadsheet-style inline-edit grid and hierarchical tree table — reach for it for bulk row correction or recursively nested data.
+  - keywords: spreadsheet, editable cells, hierarchy, expand collapse, nested rows, grid
+  - components: `input-ui` `text-ui` `tree-item-ui` `button-ui` `tag-ui` `card-ui` `table-ui` `row-ui` `tree-ui`
+  - source: `/packages/web-components/patterns/data-tables-inline-edit-and-tree/data-tables-inline-edit-and-tree.examples.html` · demo: `/packages/web-components/patterns/data-tables-inline-edit-and-tree/data-tables-inline-edit-and-tree.html` · docs: `/site/patterns/data-tables-inline-edit-and-tree`
+- **Filter Bar** (Patterns) — Row of removable facet chips above a table/list with an add-filter popover — reach for it when users stack multiple faceted filters.
+  - keywords: facet, chips, refine, narrow, segment, query
+  - components: `action-item-ui` `tag-ui` `button-ui` `segment-ui` `card-ui` `row-ui` `action-list-ui` `code-ui` `popover-ui` `search-ui` `segmented-ui` `table-ui`
+  - source: `/packages/web-components/patterns/filter-bar/filter-bar.examples.html` · demo: `/packages/web-components/patterns/filter-bar/filter-bar.html` · docs: `/site/patterns/filter-bar`
+
+### data-viz
+
+- **Chart in Card** (Patterns) — Embeds a chart inside a card so it reads as a dashboard tile — sparkline tile, full framed chart, or chart-plus-headline-stat.
+  - keywords: dashboard tile, kpi tile, sparkline, metric tile, graph
+  - components: `card-ui` `chart-ui` `text-ui` `stat-ui` `segment-ui` `button-ui` `chart-legend-ui` `code-ui` `col-ui` `grid-ui` `segmented-ui`
+  - source: `/packages/web-components/patterns/chart-in-card/chart-in-card.examples.html` · demo: `/packages/web-components/patterns/chart-in-card/chart-in-card.html` · docs: `/site/patterns/chart-in-card`
+- **Conversion Funnel** (Patterns) — Multi-step drop-off funnel built from labeled progress rows — reach for onboarding, checkout, activation, or paywall sequences.
+  - keywords: drop-off, activation, checkout steps, sign-up flow, progress rows
+  - components: `text-ui` `progress-row-ui` `col-ui` `badge-ui` `card-ui` `row-ui` `segment-ui` `button-ui` `segmented-ui`
+  - source: `/packages/web-components/patterns/conversion-funnel/conversion-funnel.examples.html` · demo: `/packages/web-components/patterns/conversion-funnel/conversion-funnel.html` · docs: `/site/patterns/conversion-funnel`
+- **Retention Cohort** (Patterns) — Retention cohort heatmap rendered as a table with color-bucketed badge cells — reach for it for retention/decay reporting.
+  - keywords: heatmap, churn, decay, weekly buckets, engagement grid
+  - components: `card-ui` `badge-ui` `table-ui` `text-ui` `stat-ui` `code-ui` `grid-ui` `row-ui`
+  - source: `/packages/web-components/patterns/retention-cohort/retention-cohort.examples.html` · demo: `/packages/web-components/patterns/retention-cohort/retention-cohort.html` · docs: `/site/patterns/retention-cohort`
+
+### forms-input
+
+- **Form System** (Patterns) — The form-participation system — UIFormElement/ElementInternals give custom elements native submit, validation, and reset.
+  - keywords: validation, inputs, fields, elementinternals, constraint
+  - components: `code-ui` `field-ui` `input-ui` `button-ui`
+  - source: `/packages/web-components/patterns/form-system/form-system.examples.html` · demo: `/packages/web-components/patterns/form-system/form-system.html` · docs: `/site/patterns/form-system`
+- **Export Flow** (Patterns) — Standalone export-request form — pick scope, format, and download-now vs email-when-ready delivery; reach for any 'Export…' affordance.
+  - keywords: download, csv, xlsx, delivery, async job, report
+  - components: `field-ui` `button-ui` `col-ui` `text-ui` `radio-ui` `select-ui` `card-ui` `alert-ui` `input-ui`
+  - source: `/packages/web-components/patterns/export-flow/export-flow.examples.html` · demo: `/packages/web-components/patterns/export-flow/export-flow.html` · docs: `/site/patterns/export-flow`
+- **Time-zone Selector** (Patterns) — Searchable IANA zone picker (region/city · UTC±N) from browser Intl data — reach for it for scheduling, log-display, or user prefs.
+  - keywords: iana, utc offset, dst, locale, scheduling, region picker
+  - components: `field-ui` `text-ui` `card-ui` `col-ui` `select-ui` `input-ui`
+  - source: `/packages/web-components/patterns/timezone-selector/timezone-selector.examples.html` · demo: `/packages/web-components/patterns/timezone-selector/timezone-selector.html` · docs: `/site/patterns/timezone-selector`
+- **Form Drawer** (Patterns) — Side drawer with a sticky action footer for create/edit forms — reach for it for '+ New X' flows that fit one screen of fields.
+  - keywords: side panel, create, edit, sticky footer, slide-in, new record
+  - components: `field-ui` `button-ui` `col-ui` `switch-ui` `input-ui` `check-ui` `drawer-ui` `range-ui` `textarea-ui` `select-ui` `code-ui`
+  - source: `/packages/web-components/patterns/form-drawer/form-drawer.examples.html` · demo: `/packages/web-components/patterns/form-drawer/form-drawer.html` · docs: `/site/patterns/form-drawer`
+- **Forms — Conditional & Autocomplete** (Patterns) — Forms that reveal fields from prior answers and resolve free-text addresses into structured fields — for branching or address input.
+  - keywords: reveal, dependent fields, address lookup, branching, dynamic, geocode
+  - components: `field-ui` `input-ui` `text-ui` `col-ui` `card-ui` `icon-ui` `row-ui` `select-ui` `grid-ui` `button-ui` `divider-ui`
+  - source: `/packages/web-components/patterns/forms-conditional-and-autocomplete/forms-conditional-and-autocomplete.examples.html` · demo: `/packages/web-components/patterns/forms-conditional-and-autocomplete/forms-conditional-and-autocomplete.html` · docs: `/site/patterns/forms-conditional-and-autocomplete`
+
+### marketing
+
+- **Marketing & Engagement** (Patterns) — Hero/CTA blocks, referral-invite flows, and achievement moments — reach for it for landing pages and growth/engagement surfaces.
+  - keywords: hero, cta, referral, invite, landing page, gamification
+  - components: `text-ui` `card-ui` `tag-ui` `col-ui` `button-ui` `stat-ui` `avatar-ui` `list-item-ui` `row-ui` `grid-ui` `field-ui` `input-ui`
+  - source: `/packages/web-components/patterns/marketing-engagement/marketing-engagement.examples.html` · demo: `/packages/web-components/patterns/marketing-engagement/marketing-engagement.html` · docs: `/site/patterns/marketing-engagement`
+
+### navigation
+
+- **Overview** (Patterns) — Decision-matrix hub indexing every AdiaUI pattern by builder intent — start here to route from 'I need to build X' to the right pattern.
+  - keywords: pattern index, decision matrix, catalog, directory, hub
+  - components: `code-ui`
+  - source: `/packages/web-components/patterns/overview/overview.examples.html` · demo: `/packages/web-components/patterns/overview/overview.html` · docs: `/site/patterns/overview`
+- **Admin Sidebar** (Patterns) — The admin left rail — workspace + user switchers over a nav tree, with grouped, divided, sub-nav, and sign-in variants.
+  - keywords: side rail, workspace switcher, account menu, left nav, rail
+  - components: `nav-item-ui` `admin-shell` `admin-sidebar` `adia-mark-ui` `admin-entity-item` `admin-topbar` `nav-ui` `section-ui` `admin-statusbar` `code-ui` `nav-group-ui` `select-ui`
+  - source: `/site/pages/patterns/admin-sidebar.html` · docs: `/site/patterns/admin-sidebar`
+- **App Nav** (Patterns) — Sidebar navigation tree — grouped collapsible items, dividers, section labels, badges, and popover flyouts when collapsed.
+  - keywords: menu tree, side rail, groups, flyout, collapsible menu
+  - components: `nav-item-ui` `nav-ui` `nav-group-ui` `code-ui`
+  - source: `/packages/web-components/patterns/app-nav/app-nav.examples.html` · demo: `/packages/web-components/patterns/app-nav/app-nav.html` · docs: `/site/patterns/app-nav`
+
+### notifications-status
+
+- **Changelog Feed** (Patterns) — In-app 'what's new' surface — per-release version/date headers with Added/Changed/Fixed sections, Keep-a-Changelog style.
+  - keywords: release notes, whats new, product updates, version history, announcements
+  - components: `text-ui` `col-ui` `row-ui` `divider-ui` `button-ui` `card-ui` `tag-ui`
+  - source: `/packages/web-components/patterns/changelog-feed/changelog-feed.examples.html` · demo: `/packages/web-components/patterns/changelog-feed/changelog-feed.html` · docs: `/site/patterns/changelog-feed`
+- **Notifications — Bell & Digest** (Patterns) — App-shell bell popover of unread items plus an email-digest preview — reach for it for the ambient alert glance and digest opt-in.
+  - keywords: unread, popover, activity feed, alerts, summary email, inbox
+  - components: `text-ui` `col-ui` `row-ui` `icon-ui` `avatar-ui` `card-ui` `button-ui` `empty-state-ui` `tag-ui`
+  - source: `/packages/web-components/patterns/notifications-bell-and-digest/notifications-bell-and-digest.examples.html` · demo: `/packages/web-components/patterns/notifications-bell-and-digest/notifications-bell-and-digest.html` · docs: `/site/patterns/notifications-bell-and-digest`
+- **System & App Banners** (Patterns) — Persistent strip banners above the app shell — offline/maintenance status, live updates, announcements — reach for top-of-app messaging.
+  - keywords: offline, maintenance, announcement, strip, degraded, promo
+  - components: `alert-ui` `button-ui` `text-ui`
+  - source: `/packages/web-components/patterns/system-banners/system-banners.examples.html` · demo: `/packages/web-components/patterns/system-banners/system-banners.html` · docs: `/site/patterns/system-banners`
+
+### overlays
+
+- **Alert Dialog** (Patterns) — Blocking destructive-confirmation modal (WAI alertdialog) — a simple one-click confirm and a high-consequence type-to-confirm gate.
+  - keywords: confirmation, destructive action, are you sure, delete guard, modal
+  - components: `button-ui` `modal-ui` `col-ui` `field-ui` `input-ui`
+  - source: `/packages/web-components/patterns/alert-dialog/alert-dialog.examples.html` · demo: `/packages/web-components/patterns/alert-dialog/alert-dialog.html` · docs: `/site/patterns/alert-dialog`
+- **Inline Dialog** (Patterns) — Anchored non-modal popover carrying a 1–3 field mini-form — reach for it for reversible in-context micro-decisions like rename or set-status.
+  - keywords: popover, anchored, non-modal, contextual, confirm, quick edit
+  - components: `button-ui` `field-ui` `input-ui` `card-ui` `popover-ui` `row-ui` `text-ui` `col-ui` `icon-ui` `select-ui` `tag-ui`
+  - source: `/packages/web-components/patterns/inline-dialog/inline-dialog.examples.html` · demo: `/packages/web-components/patterns/inline-dialog/inline-dialog.html` · docs: `/site/patterns/inline-dialog`
+- **Record Detail Drawer** (Patterns) — Side drawer showing a selected row's details over tabs — reach for it for list-detail workflows that must keep list scroll and filters.
+  - keywords: side panel, row inspector, peek, tabbed, contact, order
+  - components: `button-ui` `badge-ui` `col-ui` `text-ui` `timeline-item-ui` `row-ui` `tab-ui` `description-list-ui` `drawer-ui` `avatar-ui` `code-ui` `tabs-ui`
+  - source: `/packages/web-components/patterns/record-detail-drawer/record-detail-drawer.examples.html` · demo: `/packages/web-components/patterns/record-detail-drawer/record-detail-drawer.html` · docs: `/site/patterns/record-detail-drawer`
+
+### permissions-access
+
+- **Access Requests** (Patterns) — The request-access flow when a user lacks permission — access-denied CTA, the request form, and the pending-status follow-up.
+  - keywords: 403, permission denied, grant, restricted resource, gatekeeping
+  - components: `button-ui` `text-ui` `card-ui` `col-ui` `field-ui` `alert-ui` `input-ui` `select-ui` `tag-ui` `textarea-ui`
+  - source: `/packages/web-components/patterns/access-requests/access-requests.examples.html` · demo: `/packages/web-components/patterns/access-requests/access-requests.html` · docs: `/site/patterns/access-requests`
+- **Admin — Keys & Export** (Patterns) — API-key/webhook management plus GDPR/CCPA data export — secret-masking and destructive-action wiring for account admin.
+  - keywords: api tokens, webhooks, secrets, credentials, gdpr
+  - components: `button-ui` `icon-ui` `list-item-ui` `tag-ui` `text-ui` `row-ui` `card-ui` `col-ui` `field-ui` `list-ui` `alert-ui` `select-ui`
+  - source: `/packages/web-components/patterns/admin-keys-and-export/admin-keys-and-export.examples.html` · demo: `/packages/web-components/patterns/admin-keys-and-export/admin-keys-and-export.html` · docs: `/site/patterns/admin-keys-and-export`
+- **Permissions Matrix** (Patterns) — RBAC grid of capabilities × roles with checkbox cells plus a plain-language role summary — reach for it for configurable role authoring.
+  - keywords: rbac, roles, capabilities, grid, access control, entitlements
+  - components: `text-ui` `button-ui` `card-ui` `description-list-ui` `table-ui` `tag-ui`
+  - source: `/packages/web-components/patterns/permissions-matrix/permissions-matrix.examples.html` · demo: `/packages/web-components/patterns/permissions-matrix/permissions-matrix.html` · docs: `/site/patterns/permissions-matrix`
+- **Permissions Role Picker** (Patterns) — Role-assignment surface — a rich radio group for deliberate picks, a compact select for inline table edits — reach for it at invite/promote.
+  - keywords: rbac, assign, invite, radio group, access level, member
+  - components: `option-card-ui` `col-ui` `text-ui` `avatar-ui` `field-ui` `row-ui` `select-ui` `tag-ui`
+  - source: `/packages/web-components/patterns/permissions-role-picker/permissions-role-picker.examples.html` · demo: `/packages/web-components/patterns/permissions-role-picker/permissions-role-picker.html` · docs: `/site/patterns/permissions-role-picker`
+- **Permissions Sharing** (Patterns) — Share-a-resource surfaces: visibility scope picker, share link with expiry, add-people autocomplete — reach for it for a Share dialog.
+  - keywords: visibility, share link, expiry, invite people, scope, access
+  - components: `col-ui` `row-ui` `text-ui` `select-ui` `option-card-ui` `avatar-ui` `button-ui` `field-ui` `tag-ui` `card-ui` `description-list-ui` `input-ui`
+  - source: `/packages/web-components/patterns/permissions-sharing/permissions-sharing.examples.html` · demo: `/packages/web-components/patterns/permissions-sharing/permissions-sharing.html` · docs: `/site/patterns/permissions-sharing`
+- **Profile — Public & Verification** (Patterns) — Shareable public profile page plus a KYC identity-verification flow — reach for it for external bylines or regulated identity checks.
+  - keywords: kyc, identity, verified badge, byline, onboarding, account
+  - components: `text-ui` `col-ui` `button-ui` `card-ui` `alert-ui` `stepper-item-ui` `list-item-ui` `row-ui` `stat-ui` `tag-ui` `upload-ui` `avatar-ui`
+  - source: `/packages/web-components/patterns/profile-public-and-verification/profile-public-and-verification.examples.html` · demo: `/packages/web-components/patterns/profile-public-and-verification/profile-public-and-verification.html` · docs: `/site/patterns/profile-public-and-verification`
+
+### search-discovery
+
+- **Search & Discovery** (Patterns) — The surfaces around a search input — result lists, recent queries, saved views — reach for it to build out what shows below the box.
+  - keywords: results, recents, saved views, ranked list, typeahead, autocomplete
+  - components: `text-ui` `list-item-ui` `tag-ui` `row-ui` `col-ui` `button-ui` `list-ui` `card-ui` `icon-ui` `avatar-ui`
+  - source: `/packages/web-components/patterns/search-discovery/search-discovery.examples.html` · demo: `/packages/web-components/patterns/search-discovery/search-discovery.html` · docs: `/site/patterns/search-discovery`
+
+### shell-chrome
+
+- **Admin Shell** (Patterns) — Canonical admin/SaaS/dashboard app shell — sidebar, topbar, scrollable content, statusbar, command palette; reach for a full internal app.
+  - keywords: dashboard, saas, app frame, layout scaffold, workspace
+  - components: `nav-item-ui` `admin-topbar` `button-ui` `admin-entity-item` `admin-content` `admin-page` `admin-page-body` `admin-page-header` `admin-scroll` `admin-shell` `admin-sidebar` `admin-statusbar`
+  - source: `/packages/web-components/patterns/admin-shell/admin-shell.examples.html` · demo: `/packages/web-components/patterns/admin-shell/admin-shell.html` · docs: `/site/patterns/admin-shell`
+- **Admin Page Header** (Patterns) — The sticky page-title band inside admin-page — title, description, right-aligned page actions, and an optional tab row.
+  - keywords: title band, deck, subtitle, action row, sticky title
+  - components: `code-ui` `tab-ui` `admin-content` `admin-page` `admin-page-body` `admin-page-header` `admin-scroll` `admin-shell` `button-ui` `tag-ui` `tabs-ui`
+  - source: `/site/pages/patterns/admin-page-header.html` · docs: `/site/patterns/admin-page-header`
+- **Admin Content Topbar** (Patterns) — The app-chrome top band of the content column — sidebar toggle, breadcrumb trail, spacer, then a trailing actions cluster.
+  - keywords: app bar, breadcrumb bar, toolbar, header band, action cluster
+  - components: `button-ui` `admin-content` `admin-shell` `admin-topbar` `breadcrumb-ui` `code-ui` `tag-ui` `search-ui`
+  - source: `/site/pages/patterns/admin-content-topbar.html` · docs: `/site/patterns/admin-content-topbar`
+- **Admin Content Aside** (Patterns) — Content-attached rails — an in-content section subnav or a trailing inspector/changelog pane beside the page body.
+  - keywords: inspector rail, side panel, subnav, right rail, context pane
+  - components: `nav-item-ui` `code-ui` `tag-ui` `admin-content` `admin-page` `admin-page-body` `admin-page-header` `admin-scroll` `admin-shell` `admin-topbar` `breadcrumb-ui` `button-ui`
+  - source: `/site/pages/patterns/admin-content-aside.html` · docs: `/site/patterns/admin-content-aside`
+- **Adia Editor** (Patterns) — Design-tool/code-editor shell — toolbar, navigator, canvas, inspector, statusbar. Doc-hub — copy its canonical-hierarchy code sample, not the components list.
+  - keywords: canvas layout, ide, workspace panes, design tool, inspector
+  - components: `code-ui`
+  - source: `/packages/web-components/patterns/editor-shell/editor-shell.examples.html` · demo: `/packages/web-components/patterns/editor-shell/editor-shell.html` · docs: `/site/patterns/editor-shell`
+- **Responsive Shell Sidebar** (Patterns) — Leading + trailing sidebars that collapse to drawer-ui twins below a 900px viewport breakpoint — dual-mount with signal-shared state and auto-close on widening; reach for it when a shell's rails must survive narrow viewports.
+  - keywords: responsive sidebar, drawer collapse, breakpoint, dual-mount, mobile shell
+  - components: `list-item-ui` `list-ui` `button-ui` `code-ui` `drawer-ui` `pane-ui` `card-ui` `row-ui` `text-ui`
+  - source: `/packages/web-components/patterns/responsive-shell-sidebar/responsive-shell-sidebar.examples.html` · demo: `/packages/web-components/patterns/responsive-shell-sidebar/responsive-shell-sidebar.html` · docs: `/site/patterns/responsive-shell-sidebar`
+
+### tokens-theming
+
+- **Appearance Settings** (Patterns) — The theme/density/radius/color-scheme settings row — theme-panel for the quick path, hand-rolled primitives with persisted (not computed-style) state for a page-fitted path.
+  - keywords: appearance settings, theme panel, density slider, radius slider, color scheme, persisted state
+  - components: `code-ui` `alert-ui` `segment-ui` `slider-ui` `button-ui` `card-ui` `col-ui` `divider-ui` `field-ui` `row-ui` `segmented-ui`
+  - source: `/site/pages/patterns/appearance-settings.html` · docs: `/site/patterns/appearance-settings`
+- **Component Tokens** (Patterns) — The component CSS recipe — @scope isolation, --component-prop tokens, :where(:scope) defaults. Doc-hub, not a surface — read it, don't copy its components list.
+  - keywords: css scope, custom properties, theming, style isolation, overridable
+  - components: `code-ui`
+  - source: `/packages/web-components/patterns/component-tokens/component-tokens.examples.html` · demo: `/packages/web-components/patterns/component-tokens/component-tokens.html` · docs: `/site/patterns/component-tokens`
+
+### workflow
+
+- **Approvals** (Patterns) — Queue-plus-detail surface for items awaiting a human approve/reject gate — reach for it for expense, PR, or access-request review flows.
+  - keywords: sign-off, review queue, expense, access request, pending, gate
+  - components: `button-ui` `avatar-ui` `list-item-ui` `row-ui` `tag-ui` `card-ui` `text-ui` `col-ui` `description-list-ui` `list-ui`
+  - source: `/packages/web-components/patterns/approvals/approvals.examples.html` · demo: `/packages/web-components/patterns/approvals/approvals.html` · docs: `/site/patterns/approvals`
+- **Diff & Review** (Patterns) — Before/after viewer in code, prose, or field-delta form — reach for it to show what changed before an approve, merge, or rollback.
+  - keywords: comparison, before after, changeset, merge, side by side, delta
+  - components: `tag-ui` `row-ui` `card-ui` `code-ui` `text-ui` `button-ui` `description-list-ui` `grid-ui`
+  - source: `/packages/web-components/patterns/diff-review/diff-review.examples.html` · demo: `/packages/web-components/patterns/diff-review/diff-review.html` · docs: `/site/patterns/diff-review`
+- **Kanban Board** (Patterns) — Drag-to-reorder sortable list and multi-column status board — reach for it when item order or column membership is itself the state.
+  - keywords: drag drop, swimlanes, sprint, pipeline, sortable, reorder
+  - components: `text-ui` `card-ui` `row-ui` `tag-ui` `avatar-ui` `col-ui` `button-ui` `list-item-ui` `grid-ui` `list-ui`
+  - source: `/packages/web-components/patterns/kanban-board/kanban-board.examples.html` · demo: `/packages/web-components/patterns/kanban-board/kanban-board.html` · docs: `/site/patterns/kanban-board`
+- **Wizard Drawer** (Patterns) — Multi-step form in a drawer with a header stepper and Back/Next footer — reach for it for 3–5 step onboarding or guided setup flows.
+  - keywords: stepper, multi-step, onboarding, guided setup, progress, steps
+  - components: `field-ui` `button-ui` `col-ui` `stepper-item-ui` `input-ui` `textarea-ui` `alert-ui` `code-ui` `description-list-ui` `drawer-ui` `select-ui` `stepper-ui`
+  - source: `/packages/web-components/patterns/wizard-drawer/wizard-drawer.examples.html` · demo: `/packages/web-components/patterns/wizard-drawer/wizard-drawer.html` · docs: `/site/patterns/wizard-drawer`
+
+## Templates
+
+### agent-ops
+
+- **Agent Activity Feed** (Pattern Library) — Real-time agent activity feed with timestamped action stream, status pills, and relative-time markers — functions as a changelog feed showing a versioned history of agent actions, 
+  - keywords: changelog, feed, activity, timeline, version, release, update, history, what's, new
+  - components: `timeline-item-ui` `col-ui` `text-ui` `agent-artifact-ui` `card-ui` `icon-ui` `row-ui` `timeline-ui`
+  - source: `/catalog/ui-patterns/app/agent-activity-feed/agent-activity-feed.contents.html` · demo: `/catalog/ui-patterns/app/agent-activity-feed/agent-activity-feed.html` · docs: `/site/examples/patterns/agent-activity-feed`
+- **Agent Reasoning Collapsed** (Pattern Library) — Collapsible agent reasoning panel showing thought process + tool calls + interim results.
+  - keywords: agent, reasoning, thinking, thought-process, tool-calls, trace, transparency, interpretability
+  - components: `timeline-item-ui` `card-ui` `timeline-ui`
+  - source: `/catalog/ui-patterns/app/agent-reasoning-collapsed/agent-reasoning-collapsed.contents.html` · demo: `/catalog/ui-patterns/app/agent-reasoning-collapsed/agent-reasoning-collapsed.html` · docs: `/site/examples/patterns/agent-reasoning-collapsed`
+- **Chat Streaming Surface** (Pattern Library) — Chat conversation surface with user + assistant message bubbles + typing indicator + input row.
+  - keywords: chat, streaming, messages, bubbles, conversation, assistant, user, typing, indicator, input
+  - components: `card-ui` `avatar-ui` `col-ui` `row-ui` `chat-input-ui` `stream-ui` `text-ui`
+  - source: `/catalog/ui-patterns/app/chat-streaming-surface/chat-streaming-surface.contents.html` · demo: `/catalog/ui-patterns/app/chat-streaming-surface/chat-streaming-surface.html` · docs: `/site/examples/patterns/chat-streaming-surface`
+- **Loading Skeleton Placeholder** (Pattern Library) — Loading skeleton placeholder — animated skeleton-ui elements showing content placeholders while data loads. Avatar + text line skeletons in a list layout.
+  - keywords: loading, skeleton, placeholder, skeleton-ui, loading, state, shimmer, pulse, animation, content
+  - components: `skeleton-ui` `col-ui` `row-ui` `list-item-ui` `card-ui` `list-ui`
+  - source: `/catalog/ui-patterns/app/loading-skeleton-placeholder/loading-skeleton-placeholder.contents.html` · demo: `/catalog/ui-patterns/app/loading-skeleton-placeholder/loading-skeleton-placeholder.html` · docs: `/site/examples/patterns/loading-skeleton-placeholder`
+- **Agent Blocks** (Pattern Library) — AI assistant message bubble with streaming text indicator + assistant avatar + cited sources strip.
+  - keywords: ai, streaming, response, message, bubble, assistant, chat, llm, typing, tokens
+  - components: `text-ui` `tag-ui` `col-ui` `row-ui` `card-ui` `code-ui` `avatar-ui` `command-ui` `icon-ui`
+  - source: `/catalog/ui-patterns/v050-agent-blocks/v050-agent-blocks.contents.html` · demo: `/catalog/ui-patterns/v050-agent-blocks/v050-agent-blocks.html` · docs: `/site/examples/patterns/v050-agent-blocks`
+
+### app-overview
+
+- **Overview** (Overview) — Index page cataloguing full-page AdiaUI example compositions — reach for it as a docs gallery landing that lists the available demo screens.
+  - keywords: examples, gallery, index, landing, showcase
+  - source: `/apps/overview.examples.html` · demo: `/apps/overview.html` · docs: `/site/examples/overview`
+
+### auth-flow
+
+- **Sign In** (Authentication) — Email-entry sign-in card with social/SSO provider buttons — reach for it as the first login step before a password or one-time code is asked.
+  - keywords: login, authenticate, credentials, social-login, email-entry
+  - components: `button-ui` `col-ui` `text-ui` `adia-mark-ui` `card-ui` `divider-ui` `input-ui`
+  - source: `/apps/user-flow/app/auth/sign-in/sign-in.contents.html` · demo: `/apps/user-flow/app/auth/sign-in/sign-in.html` · docs: `/site/examples/auth/sign-in`
+- **Password** (Authentication) — Password-entry sign-in step for a known email — reach for it after the email step to collect the password, with magic-link/OTP fallbacks.
+  - keywords: login, credentials, signin, passphrase, remember-me
+  - components: `col-ui` `button-ui` `text-ui` `adia-mark-ui` `card-ui` `check-ui` `divider-ui` `input-ui` `row-ui`
+  - source: `/apps/user-flow/app/auth/sign-in/password/password.contents.html` · demo: `/apps/user-flow/app/auth/sign-in/password/password.html` · docs: `/site/examples/auth/sign-in/password`
+- **Magic Link Sent** (Authentication) — Passwordless check-your-email confirmation after a sign-in link is emailed — reach for it to confirm a one-time login link was sent.
+  - keywords: passwordless, check-email, confirmation, resend, inbox
+  - components: `col-ui` `text-ui` `alert-ui` `button-ui` `card-ui` `icon-ui`
+  - source: `/apps/user-flow/app/auth/sign-in/magic-link/sent/sent.contents.html` · demo: `/apps/user-flow/app/auth/sign-in/magic-link/sent/sent.html` · docs: `/site/examples/auth/sign-in/magic-link/sent`
+- **OTP Verify** (Authentication) — 6-digit one-time-code entry for passwordless sign-in or 2nd factor — reach for it when the user types a code sent by email or SMS.
+  - keywords: passcode, one-time-code, 2fa, sms-code, totp
+  - components: `text-ui` `col-ui` `adia-mark-ui` `card-ui` `otp-input-ui`
+  - source: `/apps/user-flow/app/auth/sign-in/otp/verify/verify.contents.html` · demo: `/apps/user-flow/app/auth/sign-in/otp/verify/verify.html` · docs: `/site/examples/auth/sign-in/otp/verify`
+- **MFA** (Authentication) — Two-factor challenge after the password succeeds — reach for it to collect the authenticator TOTP code as a second factor during sign-in.
+  - keywords: two-factor, 2fa, authenticator, totp, second-factor
+  - components: `col-ui` `text-ui` `button-ui` `adia-mark-ui` `card-ui` `divider-ui` `otp-input-ui`
+  - source: `/apps/user-flow/app/auth/sign-in/mfa/mfa.contents.html` · demo: `/apps/user-flow/app/auth/sign-in/mfa/mfa.html` · docs: `/site/examples/auth/sign-in/mfa`
+- **MFA Recovery** (Authentication) — Backup-code entry when the authenticator is unavailable — reach for it as the 2FA fallback to sign in with a saved recovery code.
+  - keywords: backup-code, 2fa-fallback, lost-device, authenticator, security-key
+  - components: `col-ui` `text-ui` `adia-mark-ui` `alert-ui` `button-ui` `card-ui` `input-ui`
+  - source: `/apps/user-flow/app/auth/sign-in/mfa/recovery/recovery.contents.html` · demo: `/apps/user-flow/app/auth/sign-in/mfa/recovery/recovery.html` · docs: `/site/examples/auth/sign-in/mfa/recovery`
+- **Sign Up** (Authentication) — New-account registration card: email plus social provider buttons — reach for it as the first step to create an account.
+  - keywords: register, create-account, registration, oauth, social-login
+  - components: `col-ui` `button-ui` `text-ui` `adia-mark-ui` `card-ui` `divider-ui` `input-ui`
+  - source: `/apps/user-flow/app/auth/sign-up/sign-up.contents.html` · demo: `/apps/user-flow/app/auth/sign-up/sign-up.html` · docs: `/site/examples/auth/sign-up`
+- **Verify** (Authentication) — Sign-up email verification — enter the 6-digit code sent to activate a new account, right after registering.
+  - keywords: confirm-email, activation, otp, code-entry, six-digit
+  - components: `col-ui` `text-ui` `adia-mark-ui` `alert-ui` `card-ui` `otp-input-ui`
+  - source: `/apps/user-flow/app/auth/sign-up/verify/verify.contents.html` · demo: `/apps/user-flow/app/auth/sign-up/verify/verify.html` · docs: `/site/examples/auth/sign-up/verify`
+- **MFA Setup** (Authentication) — Two-factor enrollment — scan the authenticator QR and confirm a TOTP code to enable 2FA during sign-up or from settings.
+  - keywords: two-factor, 2fa, enrollment, qr-code, totp
+  - components: `col-ui` `text-ui` `adia-mark-ui` `alert-ui` `button-ui` `card-ui` `icon-ui` `otp-input-ui`
+  - source: `/apps/user-flow/app/auth/sign-up/mfa-setup/mfa-setup.contents.html` · demo: `/apps/user-flow/app/auth/sign-up/mfa-setup/mfa-setup.html` · docs: `/site/examples/auth/sign-up/mfa-setup`
+- **SSO Only** (Authentication) — SSO-required notice when password sign-up is disabled for a domain — reach for it to route enterprise users to their identity provider.
+  - keywords: single-sign-on, enterprise, saml, identity-provider, okta
+  - components: `col-ui` `button-ui` `text-ui` `adia-mark-ui` `alert-ui` `card-ui`
+  - source: `/apps/user-flow/app/auth/sign-up/sso-only/sso-only.contents.html` · demo: `/apps/user-flow/app/auth/sign-up/sso-only/sso-only.html` · docs: `/site/examples/auth/sign-up/sso-only`
+- **Forgot Password** (Authentication) — Password-recovery start: enter your email to receive a reset link — reach for it as the first step of the forgot-password flow.
+  - keywords: reset, recovery, request-link, account-recovery, email-entry
+  - components: `col-ui` `text-ui` `adia-mark-ui` `button-ui` `card-ui` `input-ui`
+  - source: `/apps/user-flow/app/auth/forgot-password/forgot-password.contents.html` · demo: `/apps/user-flow/app/auth/forgot-password/forgot-password.html` · docs: `/site/examples/auth/forgot-password`
+- **Reset Link Sent** (Authentication) — Confirmation that a password-reset email went out — reach for it after the forgot-password step to say check your inbox.
+  - keywords: check-email, recovery, confirmation, inbox, resend
+  - components: `col-ui` `text-ui` `adia-mark-ui` `alert-ui` `button-ui` `card-ui`
+  - source: `/apps/user-flow/app/auth/forgot-password/sent/sent.contents.html` · demo: `/apps/user-flow/app/auth/forgot-password/sent/sent.html` · docs: `/site/examples/auth/forgot-password/sent`
+- **Reset Password** (Authentication) — New-password form with confirm field, reached via the reset link — the final step where the user chooses a new password.
+  - keywords: change-credentials, confirm, recovery, strength, choose-new
+  - components: `col-ui` `input-ui` `text-ui` `adia-mark-ui` `button-ui` `card-ui`
+  - source: `/apps/user-flow/app/auth/reset-password/reset-password.contents.html` · demo: `/apps/user-flow/app/auth/reset-password/reset-password.html` · docs: `/site/examples/auth/reset-password`
+- **Account Locked** (Authentication) — Locked-out notice after too many failed sign-ins — reach for it to explain the lockout and offer reset/backup-code/support options.
+  - keywords: lockout, failed-attempts, blocked, rate-limit, security
+  - components: `button-ui` `col-ui` `adia-mark-ui` `alert-ui` `card-ui` `text-ui`
+  - source: `/apps/user-flow/app/auth/account-locked/account-locked.contents.html` · demo: `/apps/user-flow/app/auth/account-locked/account-locked.html` · docs: `/site/examples/auth/account-locked`
+- **Link Expired** (Authentication) — Expired or used magic/reset link notice with a re-send email form — reach for it when a one-time link is no longer valid.
+  - keywords: invalid, stale, resend, one-time, request-new
+  - components: `col-ui` `adia-mark-ui` `alert-ui` `button-ui` `card-ui` `input-ui` `text-ui`
+  - source: `/apps/user-flow/app/auth/link-expired/link-expired.contents.html` · demo: `/apps/user-flow/app/auth/link-expired/link-expired.html` · docs: `/site/examples/auth/link-expired`
+- **Accept Invite** (Authentication) — Team-invite landing with inviter, workspace, and accept/decline — reach for it when a user opens an invitation to join a workspace.
+  - keywords: team, workspace, join, membership, decline
+  - components: `text-ui` `col-ui` `button-ui` `card-ui` `adia-mark-ui` `avatar-ui` `row-ui`
+  - source: `/apps/user-flow/app/auth/accept-invite/accept-invite.contents.html` · demo: `/apps/user-flow/app/auth/accept-invite/accept-invite.html` · docs: `/site/examples/auth/accept-invite`
+- **OAuth Callback** (Authentication) — OAuth/SSO interstitial loading state while the provider redirect completes — reach for it to hold the user during the sign-in handoff.
+  - keywords: loading, redirect, sso, interstitial, provider
+  - components: `col-ui` `button-ui` `alert-ui` `card-ui` `icon-ui` `text-ui`
+  - source: `/apps/user-flow/app/auth/oauth/callback/callback.contents.html` · demo: `/apps/user-flow/app/auth/oauth/callback/callback.html` · docs: `/site/examples/auth/oauth/callback`
+- **Email Change** (Authentication) — Confirm-new-email step for an address change — reach for it to have the user approve switching their sign-in email to a new address.
+  - keywords: update-address, confirm, new-address, verify, security
+  - components: `col-ui` `text-ui` `adia-mark-ui` `button-ui` `card-ui`
+  - source: `/apps/user-flow/app/auth/email-change/verify/verify.contents.html` · demo: `/apps/user-flow/app/auth/email-change/verify/verify.html` · docs: `/site/examples/auth/email-change/verify`
+- **Sign Out** (Authentication) — Signed-out confirmation after a session ends — reach for it as the post-logout landing offering sign-back-in or switch-account.
+  - keywords: logout, session-end, goodbye, log-off, post-logout
+  - components: `col-ui` `button-ui` `text-ui` `adia-mark-ui` `card-ui`
+  - source: `/apps/user-flow/app/auth/sign-out/sign-out.contents.html` · demo: `/apps/user-flow/app/auth/sign-out/sign-out.html` · docs: `/site/examples/auth/sign-out`
+- **Session Expired** (Authentication) — Session-timeout notice after inactivity with a sign-back-in prompt — reach for it to re-authenticate a user whose session lapsed.
+  - keywords: timeout, inactivity, re-login, re-authenticate, idle
+  - components: `col-ui` `button-ui` `adia-mark-ui` `alert-ui` `card-ui` `text-ui`
+  - source: `/apps/user-flow/app/auth/session-expired/session-expired.contents.html` · demo: `/apps/user-flow/app/auth/session-expired/session-expired.html` · docs: `/site/examples/auth/session-expired`
+- **Forbidden** (Authentication) — 403 access-denied page when an account lacks permission — reach for it for a no-access state offering switch-account or request-access.
+  - keywords: 403, access-denied, permission, no-access, unauthorized
+  - components: `button-ui` `col-ui` `adia-mark-ui` `alert-ui` `card-ui` `text-ui`
+  - source: `/apps/user-flow/app/auth/forbidden/forbidden.contents.html` · demo: `/apps/user-flow/app/auth/forbidden/forbidden.html` · docs: `/site/examples/auth/forbidden`
+- **Account Deleted** (Authentication) — Account-deletion confirmation with an undo window — reach for it after deletion to show the recovery deadline and recover-account action.
+  - keywords: removal, closed, undo, recover, grace-period
+  - components: `col-ui` `button-ui` `adia-mark-ui` `alert-ui` `card-ui` `text-ui`
+  - source: `/apps/user-flow/app/auth/account-deleted/account-deleted.contents.html` · demo: `/apps/user-flow/app/auth/account-deleted/account-deleted.html` · docs: `/site/examples/auth/account-deleted`
+
+### collaboration
+
+- **Avatar Group Overflow** (Pattern Library) — Avatar stack showing first 4 members with a +N overflow indicator for additional members. Used for team rosters, collaborators, attendees.
+  - keywords: avatar, group, stack, overflow, members, team, roster, collaborators, attendees, count
+  - components: `avatar-ui` `text-ui` `avatar-group-ui` `card-ui`
+  - source: `/catalog/ui-patterns/app/avatar-group-overflow/avatar-group-overflow.contents.html` · demo: `/catalog/ui-patterns/app/avatar-group-overflow/avatar-group-overflow.html` · docs: `/site/examples/patterns/avatar-group-overflow`
+
+### dashboard
+
+- **Admin Dashboard** (Dashboards) — Tabbed SaaS analytics dashboard (KPI grid, activity chart, transactions table) — reach for it as the app's home monitoring surface.
+  - keywords: analytics, kpi, metrics, saas, home
+  - components: `text-ui` `row-ui` `col-ui` `card-ui` `button-ui` `list-item-ui` `badge-ui` `avatar-ui` `field-ui` `grid-ui` `icon-ui` `stat-ui`
+  - source: `/apps/saas/app/admin-dashboard/admin-dashboard.contents.html` · demo: `/apps/saas/app/admin-dashboard/admin-dashboard.html` · docs: `/site/examples/admin-dashboard`
+
+### data-table
+
+- **Api Key Table** (Pattern Library) — API keys management table with key name, prefix, created date, last used, and revoke button.
+  - keywords: api, key, management, table, generate, revoke, token, secret, credential, access
+  - components: `col-def` `button-ui` `card-ui` `table-ui`
+  - source: `/catalog/ui-patterns/app/api-key-table/api-key-table.contents.html` · demo: `/catalog/ui-patterns/app/api-key-table/api-key-table.html` · docs: `/site/examples/patterns/api-key-table`
+- **Permission Matrix Table** (Pattern Library) — Permission matrix with roles as columns and resources as rows with checkboxes. Color-coded role badges with checkbox state per permission.
+  - keywords: permission, matrix, roles, columns, resources, rows, checkboxes, access, control, viewer
+  - components: `col-ui` `check-ui` `text-ui` `grid-ui` `card-ui` `divider-ui`
+  - source: `/catalog/ui-patterns/app/permission-matrix-table/permission-matrix-table.contents.html` · demo: `/catalog/ui-patterns/app/permission-matrix-table/permission-matrix-table.html` · docs: `/site/examples/patterns/permission-matrix-table`
+
+### data-viz
+
+- **Conversion Funnel 6step** (Pattern Library) — Conversion funnel with 6 stages, stage labels, counts, and drop-off conversion percentages.
+  - keywords: funnel, conversion, analytics, stages, metrics, drop-off, rate, marketing
+  - components: `progress-row-ui` `text-ui` `col-ui` `card-ui` `row-ui`
+  - source: `/catalog/ui-patterns/app/conversion-funnel-6step/conversion-funnel-6step.contents.html` · demo: `/catalog/ui-patterns/app/conversion-funnel-6step/conversion-funnel-6step.html` · docs: `/site/examples/patterns/conversion-funnel-6step`
+- **Email Inbox List** (Pattern Library) — Email inbox list — scrollable list of email rows with sender avatar, subject, preview snippet, timestamp, and unread badge indicator. List-item-ui rows with dividers.
+  - keywords: email, inbox, list, message, unread, sender, subject, preview, timestamp, avatar
+  - components: `text-ui` `row-ui` `col-ui` `avatar-ui` `list-item-ui` `badge-ui` `button-ui` `card-ui` `list-ui`
+  - source: `/catalog/ui-patterns/app/email-inbox-list/email-inbox-list.contents.html` · demo: `/catalog/ui-patterns/app/email-inbox-list/email-inbox-list.html` · docs: `/site/examples/patterns/email-inbox-list`
+- **Import Mapping** (Pattern Library) — Multi-step CSV/file import flow — upload, field mapping (source columns ↔ target fields), preview, import. Shows the field-mapping step prominently since it's the part most often m
+  - keywords: import, csv, upload, mapping, fields, columns, bulk, data, migration
+  - components: `text-ui` `col-ui` `icon-ui` `grid-ui` `list-item-ui` `select-ui` `button-ui` `avatar-ui` `card-ui` `row-ui` `alert-ui` `badge-ui`
+  - source: `/catalog/ui-patterns/app/import-mapping/import-mapping.contents.html` · demo: `/catalog/ui-patterns/app/import-mapping/import-mapping.html` · docs: `/site/examples/patterns/import-mapping`
+- **Invoice Line Items** (Pattern Library) — Invoice table with line items, quantities, unit prices, and total row. Card with invoice header, item rows, subtotal, tax, and total due.
+  - keywords: invoice, table, line, items, quantities, totals, billing, amount, price, quantity
+  - components: `text-ui` `col-ui` `row-ui` `divider-ui` `badge-ui` `card-ui` `grid-ui`
+  - source: `/catalog/ui-patterns/app/invoice-line-items/invoice-line-items.contents.html` · demo: `/catalog/ui-patterns/app/invoice-line-items/invoice-line-items.html` · docs: `/site/examples/patterns/invoice-line-items`
+- **Order Tracking Timeline** (Pattern Library) — Order tracking timeline — 5-step order progress from placed to delivered using timeline-ui + timeline-item-ui. Each step shows status (completed/active/idle) with label and time
+  - keywords: order, tracking, timeline, step, progress, shipped, delivered, status, timeline-ui, timeline-item-ui
+  - components: `timeline-item-ui` `card-ui` `timeline-ui`
+  - source: `/catalog/ui-patterns/app/order-tracking-timeline/order-tracking-timeline.contents.html` · demo: `/catalog/ui-patterns/app/order-tracking-timeline/order-tracking-timeline.html` · docs: `/site/examples/patterns/order-tracking-timeline`
+- **Product Card Buy** (Pattern Library) — Product card with image, price, and buy button — card showing product photo, name, price, brief description, and add-to-cart + save actions. E-commerce product listing pattern.
+  - keywords: app, store, listing, product-listing, card, app-store, product, card, image, price
+  - components: `text-ui` `row-ui` `badge-ui` `button-ui` `col-ui` `card-ui` `image-ui` `rating-ui`
+  - source: `/catalog/ui-patterns/app/product-card-buy/product-card-buy.contents.html` · demo: `/catalog/ui-patterns/app/product-card-buy/product-card-buy.html` · docs: `/site/examples/patterns/product-card-buy`
+- **Social Media Post Card** (Pattern Library) — Social media post card — feed item with avatar, user name, handle, timestamp, post text, optional photo, and engagement actions (likes, comments, share).
+  - keywords: social, media, post, card, feed, avatar, user, name, timestamp, like
+  - components: `text-ui` `button-ui` `avatar-ui` `card-ui` `col-ui` `image-ui` `row-ui`
+  - source: `/catalog/ui-patterns/app/social-media-post-card/social-media-post-card.contents.html` · demo: `/catalog/ui-patterns/app/social-media-post-card/social-media-post-card.html` · docs: `/site/examples/patterns/social-media-post-card`
+- **Sortable Search Table** (Pattern Library) — Data table with sortable columns, search filter, and pagination — table-ui with col-def children declaring Name, Email, Status (badge), and date columns. Full interactive data tabl
+  - keywords: data, table, sortable, columns, search, pagination, table-ui, col-def, sortable, search
+  - components: `col-def` `button-ui` `card-ui` `table-ui` `text-ui`
+  - source: `/catalog/ui-patterns/app/sortable-search-table/sortable-search-table.contents.html` · demo: `/catalog/ui-patterns/app/sortable-search-table/sortable-search-table.html` · docs: `/site/examples/patterns/sortable-search-table`
+- **User Profile Card** (Pattern Library) — User profile card with avatar, name, role, and action buttons (message, view profile).
+  - keywords: profile, card, user, avatar, name, role, action, buttons, team-member, display
+  - components: `row-ui` `icon-ui` `badge-ui` `button-ui` `text-ui` `avatar-ui` `card-ui` `col-ui`
+  - source: `/catalog/ui-patterns/app/user-profile-card/user-profile-card.contents.html` · demo: `/catalog/ui-patterns/app/user-profile-card/user-profile-card.html` · docs: `/site/examples/patterns/user-profile-card`
+- **Users Table Badge** (Pattern Library) — Users table showing role and status columns populated with badge-ui variants — accent for Admin, info for Editor, muted for Viewer, success/warning/muted for Online/Away/Offline st
+  - keywords: badge, variant, accent, info, success, warning, danger, muted, badge-ui, status
+  - components: `col-def` `card-ui` `table-ui`
+  - source: `/catalog/ui-patterns/app/users-table-badge/users-table-badge.contents.html` · demo: `/catalog/ui-patterns/app/users-table-badge/users-table-badge.html` · docs: `/site/examples/patterns/users-table-badge`
+- **Data Blocks** (Pattern Library) — Real-time metrics dashboard with live counter cards, streaming line chart, error-rate progress, and last-updated timestamp.
+  - keywords: real-time, metrics, live, dashboard, streaming, counters, charts, websocket, telemetry, monitoring
+  - components: `text-ui` `col-ui` `row-ui` `card-ui` `button-ui` `icon-ui` `progress-ui` `col-def` `badge-ui` `chart-ui` `description-list-ui` `grid-ui`
+  - source: `/catalog/ui-patterns/v050-data-blocks/v050-data-blocks.contents.html` · demo: `/catalog/ui-patterns/v050-data-blocks/v050-data-blocks.html` · docs: `/site/examples/patterns/v050-data-blocks`
+- **Chart With Filter Pills** (Pattern Library) — Chart card with time-range pill selector in the header — segmented switch between day/week/month/year + chart body + footer caption.
+  - keywords: chart, filter, pills, time-range, segmented, period, selector, analytics, dashboard, card
+  - components: `segment-ui` `text-ui` `card-ui` `chart-ui` `col-ui` `row-ui` `segmented-ui`
+  - source: `/catalog/ui-patterns/app/chart-with-filter-pills/chart-with-filter-pills.contents.html` · demo: `/catalog/ui-patterns/app/chart-with-filter-pills/chart-with-filter-pills.html` · docs: `/site/examples/patterns/chart-with-filter-pills`
+- **Calendar Month View** (Pattern Library) — Inline month-view calendar grid with weekday headers, day cells, and month navigation. Built on calendar-grid-ui (substrate primitive); calendar-picker-ui adds a popover trigger for form participation.
+  - keywords: calendar, date, picker, month, navigation, calendar-grid-ui, month-view, weekday, day, grid
+  - components: `calendar-grid-ui` `card-ui`
+  - source: `/catalog/ui-patterns/app/calendar-month-view/calendar-month-view.contents.html` · demo: `/catalog/ui-patterns/app/calendar-month-view/calendar-month-view.html` · docs: `/site/examples/patterns/calendar-month-view`
+- **Responsive KPI Grid** (Pattern Library) — Responsive KPI stat-card grid — 1 column on mobile, 2 on tablet (sm+), 4 on desktop (lg+) using @bp notation.
+  - keywords: responsive, kpi, stat, grid, mobile, tablet, desktop, breakpoint, columns, adaptive
+  - components: `card-ui` `stat-ui` `grid-ui`
+  - source: `/catalog/ui-patterns/app/responsive-kpi-grid/responsive-kpi-grid.contents.html` · demo: `/catalog/ui-patterns/app/responsive-kpi-grid/responsive-kpi-grid.html` · docs: `/site/examples/patterns/responsive-kpi-grid`
+
+### forms-input
+
+- **Filter Popover Form** (Pattern Library) — Form fragment in a popover — checkbox group, radio pair, and a name input behind a summary trigger button. The primitive composition behind the form-popover-ui module; use the module unless you need to customize this recipe.
+  - keywords: filter, popover, form, checkbox, radio, input, anchored, panel, options, select-options
+  - components: `check-ui` `divider-ui` `radio-ui` `button-ui` `col-ui` `input-ui` `popover-ui` `text-ui`
+  - source: `/catalog/ui-patterns/app/filter-popover-form/filter-popover-form.contents.html` · demo: `/catalog/ui-patterns/app/filter-popover-form/filter-popover-form.html` · docs: `/site/examples/patterns/filter-popover-form`
+- **Newsletter Subscription** (Pattern Library) — Newsletter subscription form — email input with subscribe button. Compact signup card with headline, email input-ui, subscribe button, and a privacy reassurance note.
+  - keywords: newsletter, subscription, form, email, subscribe, signup, subscribe-button, input-ui, email-input, form
+  - components: `text-ui` `row-ui` `col-ui` `icon-ui` `button-ui` `card-ui` `input-ui`
+  - source: `/catalog/ui-patterns/app/newsletter-subscription/newsletter-subscription.contents.html` · demo: `/catalog/ui-patterns/app/newsletter-subscription/newsletter-subscription.html` · docs: `/site/examples/patterns/newsletter-subscription`
+- **Onboarding Checklist** (Pattern Library) — User onboarding checklist — step-by-step setup checklist for new users. Tracks completion of profile, team invite, integration, workflow, and tour steps.
+  - keywords: onboarding, checklist, user, setup, steps, progress, todo, complete, activate, setup-checklist
+  - components: `text-ui` `button-ui` `check-ui` `list-item-ui` `card-ui` `list-ui` `progress-ui`
+  - source: `/catalog/ui-patterns/app/onboarding-checklist/onboarding-checklist.contents.html` · demo: `/catalog/ui-patterns/app/onboarding-checklist/onboarding-checklist.html` · docs: `/site/examples/patterns/onboarding-checklist`
+- **Survey Rating Form** (Pattern Library) — Survey form with star rating scales — three rating-ui questions (overall satisfaction, ease of use, likelihood to recommend) plus a textarea for open feedback.
+  - keywords: survey, form, rating, scale, star, rating-ui, satisfaction, score, feedback, question
+  - components: `field-ui` `rating-ui` `button-ui` `card-ui` `col-ui` `row-ui` `textarea-ui`
+  - source: `/catalog/ui-patterns/app/survey-rating-form/survey-rating-form.contents.html` · demo: `/catalog/ui-patterns/app/survey-rating-form/survey-rating-form.html` · docs: `/site/examples/patterns/survey-rating-form`
+- **Form Blocks** (Pattern Library) — File upload form with drag and drop zone and file list. Upload-ui with browse fallback, file-type hints, and max-size note.
+  - keywords: file, upload, drag-and-drop, dnd, browse, attachments, form-input, drop, zone, file-list
+  - components: `field-ui` `button-ui` `col-ui` `text-ui` `input-ui` `row-ui` `card-ui` `tag-ui` `radio-ui` `calendar-picker-ui` `check-ui` `grid-ui`
+  - source: `/catalog/ui-patterns/v050-form-blocks/v050-form-blocks.contents.html` · demo: `/catalog/ui-patterns/v050-form-blocks/v050-form-blocks.html` · docs: `/site/examples/patterns/v050-form-blocks`
+- **Accordion Settings** (Pattern Library) — Settings panel organized as accordion — expandable sections (profile / notifications / privacy / advanced) each containing form controls.
+  - keywords: accordion, settings, collapsible, expandable, sections, preferences, profile, notifications, privacy
+  - components: `field-ui` `accordion-item-ui` `toggle-ui` `col-ui` `input-ui` `accordion-ui`
+  - source: `/catalog/ui-patterns/app/accordion-settings/accordion-settings.contents.html` · demo: `/catalog/ui-patterns/app/accordion-settings/accordion-settings.html` · docs: `/site/examples/patterns/accordion-settings`
+- **Image Upload Preview** (Pattern Library) — Image upload with preview thumbnail, file metadata, and replace/remove actions.
+  - keywords: image, upload, preview, avatar, profile-picture, file-input, drag-drop, replace, remove
+  - components: `button-ui` `col-ui` `row-ui` `text-ui` `avatar-ui` `field-ui`
+  - source: `/catalog/ui-patterns/app/image-upload-preview/image-upload-preview.contents.html` · demo: `/catalog/ui-patterns/app/image-upload-preview/image-upload-preview.html` · docs: `/site/examples/patterns/image-upload-preview`
+- **Color Picker Swatches** (Pattern Library) — Color picker with OKLCH input + preset swatch palette. Click a swatch to apply; manual input edits the picker.
+  - keywords: color, picker, swatch, palette, oklch, hex, preset, accent, token, chooser
+  - components: `swatch-ui` `text-ui` `col-ui` `card-ui` `color-picker-ui` `row-ui`
+  - source: `/catalog/ui-patterns/app/color-picker-swatches/color-picker-swatches.contents.html` · demo: `/catalog/ui-patterns/app/color-picker-swatches/color-picker-swatches.html` · docs: `/site/examples/patterns/color-picker-swatches`
+- **Slider Range Controls** (Pattern Library) — Range slider with min/max numeric inputs flanking the slider track. Allows direct value entry or drag-to-set.
+  - keywords: slider, range, min, max, input, numeric, value, control, bound, dual-handle
+  - components: `field-ui` `input-ui` `card-ui` `col-ui` `range-ui` `row-ui` `text-ui`
+  - source: `/catalog/ui-patterns/app/slider-range-controls/slider-range-controls.contents.html` · demo: `/catalog/ui-patterns/app/slider-range-controls/slider-range-controls.html` · docs: `/site/examples/patterns/slider-range-controls`
+- **Divider Text Label** (Pattern Library) — Horizontal divider with a centered text label between two horizontal-rule segments. Common section-separator pattern in long forms or feeds.
+  - keywords: divider, separator, rule, line, label, text, section, break, or, middle
+  - components: `divider-ui` `text-ui` `button-ui` `col-ui` `row-ui`
+  - source: `/catalog/ui-patterns/app/divider-text-label/divider-text-label.contents.html` · demo: `/catalog/ui-patterns/app/divider-text-label/divider-text-label.html` · docs: `/site/examples/patterns/divider-text-label`
+- **Select Multiple Preselected** (Pattern Library) — Multi-select field with declaratively pre-selected options via &lt;option selected&gt;. All selected options are captured on init (FB-46 fix); comma-joined value string used for multi-select.
+  - keywords: select, multiple, pre-selected, option, selected, form, field, multi-value, picker, init
+  - components: `field-ui` `select-ui`
+  - source: `/catalog/ui-patterns/app/select-multiple-preselected/select-multiple-preselected.contents.html` · demo: `/catalog/ui-patterns/app/select-multiple-preselected/select-multiple-preselected.html` · docs: `/site/examples/patterns/select-multiple-preselected`
+
+### marketing
+
+- **Feature Grid Icons** (Pattern Library) — Feature grid with 6 cells each containing an icon, bold title, and one-line description. Marketing feature showcase layout.
+  - keywords: feature, grid, icons, icon-ui, grid, marketing, features, highlights, benefits, showcase
+  - components: `col-ui` `text-ui` `icon-ui` `grid-ui`
+  - source: `/catalog/ui-patterns/app/feature-grid-icons/feature-grid-icons.contents.html` · demo: `/catalog/ui-patterns/app/feature-grid-icons/feature-grid-icons.html` · docs: `/site/examples/patterns/feature-grid-icons`
+- **Marketing Hero Cta** (Pattern Library) — Marketing hero section with centered heading, supporting lede, and two CTA buttons (primary + outline).
+  - keywords: hero, cta, marketing, landing-page, heading, lede, call-to-action, buttons
+  - components: `button-ui` `col-ui` `text-ui` `row-ui`
+  - source: `/catalog/ui-patterns/app/marketing-hero-cta/marketing-hero-cta.contents.html` · demo: `/catalog/ui-patterns/app/marketing-hero-cta/marketing-hero-cta.html` · docs: `/site/examples/patterns/marketing-hero-cta`
+- **Testimonials Avatar Cards** (Pattern Library) — Testimonials with avatar cards — three customer testimonials in a grid, each with an avatar, name, role, and quote. Social proof pattern for marketing pages.
+  - keywords: testimonials, testimonial, avatar, cards, quote, review, social, proof, customer, feedback
+  - components: `text-ui` `col-ui` `avatar-ui` `card-ui` `rating-ui` `grid-ui`
+  - source: `/catalog/ui-patterns/app/testimonials-avatar-cards/testimonials-avatar-cards.contents.html` · demo: `/catalog/ui-patterns/app/testimonials-avatar-cards/testimonials-avatar-cards.html` · docs: `/site/examples/patterns/testimonials-avatar-cards`
+- **Marketing Blocks** (Pattern Library) — Two-column hero — left side heading + lede + CTA buttons; right side product image or media.
+  - keywords: hero, split-hero, two-column, landing-page, heading, lede, media, product-image, cta
+  - components: `text-ui` `col-ui` `link-ui` `row-ui` `accordion-item-ui` `grid-ui` `avatar-ui` `button-ui` `card-ui` `icon-ui` `accordion-ui` `divider-ui`
+  - source: `/catalog/ui-patterns/v050-marketing-blocks/v050-marketing-blocks.contents.html` · demo: `/catalog/ui-patterns/v050-marketing-blocks/v050-marketing-blocks.html` · docs: `/site/examples/patterns/v050-marketing-blocks`
+- **Image Carousel** (Pattern Library) — Horizontal image carousel — current slide + peek of next/prev + dot indicators + autoplay-pause control.
+  - keywords: carousel, slider, swiper, image-gallery, slides, photos, hero, rotator, paginated
+  - components: `image-ui` `text-ui` `card-ui` `swiper-ui` `tag-ui`
+  - source: `/catalog/ui-patterns/app/image-carousel/image-carousel.contents.html` · demo: `/catalog/ui-patterns/app/image-carousel/image-carousel.html` · docs: `/site/examples/patterns/image-carousel`
+- **Video Player Controls** (Pattern Library) — Video player with poster image, transport controls (play, scrub, volume, fullscreen), and elapsed/total time display.
+  - keywords: video, player, playback, play, pause, scrub, progress, volume, fullscreen, media
+  - components: `button-ui` `card-ui` `col-ui` `image-ui` `progress-ui` `row-ui` `text-ui`
+  - source: `/catalog/ui-patterns/app/video-player-controls/video-player-controls.contents.html` · demo: `/catalog/ui-patterns/app/video-player-controls/video-player-controls.html` · docs: `/site/examples/patterns/video-player-controls`
+
+### navigation
+
+- **Command Palette** (Pattern Library) — Command palette with search input, recent commands, and keyboard shortcut hints.
+  - keywords: command, palette, search, input, recent, commands, keyboard, shortcut, hints, cmdk
+  - components: `row-ui` `text-ui` `badge-ui` `icon-ui` `col-ui` `card-ui` `divider-ui` `input-ui`
+  - source: `/catalog/ui-patterns/app/command-palette/command-palette.contents.html` · demo: `/catalog/ui-patterns/app/command-palette/command-palette.html` · docs: `/site/examples/patterns/command-palette`
+- **Tabs With Panels** (Pattern Library) — Tabs component with N panels — each tab reveals its corresponding panel content area.
+  - keywords: tabs, panels, navigation, switch, sections, views, content-areas, tab-strip
+  - components: `text-ui` `card-ui` `tab-ui` `col-ui` `grid-ui` `tabs-ui`
+  - source: `/catalog/ui-patterns/app/tabs-with-panels/tabs-with-panels.contents.html` · demo: `/catalog/ui-patterns/app/tabs-with-panels/tabs-with-panels.html` · docs: `/site/examples/patterns/tabs-with-panels`
+- **Nav Blocks** (Pattern Library) — Breadcrumb navigation trail using link-ui and icon-ui separators to show the hierarchical path to the current page, enabling users to navigate back up the hierarchy.
+  - keywords: breadcrumb, navigation, path, hierarchy, link, separator, breadcrumb-ui, trail, link-ui, icon-ui
+  - components: `button-ui` `tooltip-ui` `nav-item-ui` `col-ui` `divider-ui` `row-ui` `admin-sidebar` `breadcrumb-ui` `nav-group-ui` `nav-ui` `text-ui`
+  - source: `/catalog/ui-patterns/v050-nav-blocks/v050-nav-blocks.contents.html` · demo: `/catalog/ui-patterns/v050-nav-blocks/v050-nav-blocks.html` · docs: `/site/examples/patterns/v050-nav-blocks`
+- **Pagination Controls** (Pattern Library) — Pagination controls — prev/next buttons + page-number tiles + ellipsis collapse for long ranges + total-pages indicator.
+  - keywords: pagination, paginate, page, navigate, prev, next, jump, list, browse, pages
+  - components: `card-ui` `pagination-ui` `row-ui` `text-ui`
+  - source: `/catalog/ui-patterns/app/pagination-controls/pagination-controls.contents.html` · demo: `/catalog/ui-patterns/app/pagination-controls/pagination-controls.html` · docs: `/site/examples/patterns/pagination-controls`
+
+### notifications-status
+
+- **Alert Banner** (Pattern Library) — Dismissible alert banner — icon + message + action button + close X. For cookie consent, system warnings, important notices.
+  - keywords: alert, banner, notice, warning, notification, dismissible, cookie-consent, system-message, info
+  - components: `alert-ui` `button-ui`
+  - source: `/catalog/ui-patterns/app/alert-banner/alert-banner.contents.html` · demo: `/catalog/ui-patterns/app/alert-banner/alert-banner.html` · docs: `/site/examples/patterns/alert-banner`
+- **Alert Banner Stack** (Pattern Library) — Stacked persistent alert banners — success, warning, and error variants with inline dismiss/retry actions.
+  - keywords: alert, banner, stack, success, warning, error, danger, variants, dismiss, retry, persistent
+  - components: `alert-ui` `button-ui` `col-ui`
+  - source: `/catalog/ui-patterns/app/alert-banner-stack/alert-banner-stack.contents.html` · demo: `/catalog/ui-patterns/app/alert-banner-stack/alert-banner-stack.html` · docs: `/site/examples/patterns/alert-banner-stack`
+
+### onboarding-flow
+
+- **Profile** (Authentication) — First-run profile setup: collect full name and display name/handle — reach for it after account creation to personalize a new account.
+  - keywords: onboarding, display-name, avatar, personalize, first-run
+  - components: `col-ui` `input-ui` `text-ui` `adia-mark-ui` `button-ui` `card-ui`
+  - source: `/apps/user-flow/app/auth/sign-up/profile/profile.contents.html` · demo: `/apps/user-flow/app/auth/sign-up/profile/profile.html` · docs: `/site/examples/auth/sign-up/profile`
+- **Welcome** (Onboarding) — Welcome splash greeting the new user with a start CTA; reach for it as the opening screen of a product onboarding flow.
+  - keywords: intro, greeting, start, splash, get-started
+  - components: `text-ui` `icon-ui` `adia-mark-ui` `button-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/onboarding/welcome/welcome.contents.html` · demo: `/apps/user-flow/app/onboarding/welcome/welcome.html` · docs: `/site/examples/onboarding/welcome`
+- **Mode** (Onboarding) — 'How will you use it' onboarding step — pick a usage mode/persona via cards; reach for it as the mode/persona-selection step of onboarding.
+  - keywords: usage, persona, workflow, choice, path
+  - components: `option-card-ui` `text-ui` `adia-mark-ui` `button-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/onboarding/mode/mode.contents.html` · demo: `/apps/user-flow/app/onboarding/mode/mode.html` · docs: `/site/examples/onboarding/mode`
+- **Connect Source** (Onboarding) — 'Connect your first source' onboarding step — link an initial data source; reach for it as the first-connection step of product onboarding.
+  - keywords: integration, link, data, provider, first
+  - components: `option-card-ui` `text-ui` `adia-mark-ui` `alert-ui` `button-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/onboarding/connect-source/connect-source.contents.html` · demo: `/apps/user-flow/app/onboarding/connect-source/connect-source.html` · docs: `/site/examples/onboarding/connect-source`
+- **Import Data** (Onboarding) — 'Bring your data' onboarding step — upload or import records after connecting a source; reach for it as the data-import step of onboarding.
+  - keywords: upload, migrate, csv, records, load
+  - components: `option-card-ui` `text-ui` `adia-mark-ui` `button-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/onboarding/import-data/import-data.contents.html` · demo: `/apps/user-flow/app/onboarding/import-data/import-data.html` · docs: `/site/examples/onboarding/import-data`
+- **First Action** (Onboarding) — 'Your first dashboard' onboarding step — guides one core action; reach for it as the activation/aha-moment step of product onboarding.
+  - keywords: activation, aha, guide, task, milestone
+  - components: `text-ui` `button-ui` `adia-mark-ui` `field-ui` `input-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/onboarding/first-action/first-action.contents.html` · demo: `/apps/user-flow/app/onboarding/first-action/first-action.html` · docs: `/site/examples/onboarding/first-action`
+- **Review** (Onboarding) — 'Review your setup' onboarding step — summary of choices before finishing; reach for it as the pre-completion review step of onboarding.
+  - keywords: summary, confirm, recap, verify, overview
+  - components: `text-ui` `button-ui` `field-ui` `option-card-ui` `col-ui` `avatar-ui` `drawer-ui` `grid-ui` `select-ui` `switch-ui` `divider-ui` `input-ui`
+  - source: `/apps/user-flow/app/onboarding/review/review.contents.html` · demo: `/apps/user-flow/app/onboarding/review/review.html` · docs: `/site/examples/onboarding/review`
+- **Notifications** (Onboarding) — Notification-preferences onboarding step — toggles for email and push channels; reach for it as the alert opt-in step of product onboarding.
+  - keywords: preferences, alerts, email, push, opt-in
+  - components: `option-card-ui` `text-ui` `adia-mark-ui` `button-ui` `col-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/onboarding/notification-prefs/notification-prefs.contents.html` · demo: `/apps/user-flow/app/onboarding/notification-prefs/notification-prefs.html` · docs: `/site/examples/onboarding/notification-prefs`
+- **Mobile App** (Onboarding) — 'Get the mobile app' onboarding step — QR and app-store links to install the companion app; reach for it as the mobile-install promo step.
+  - keywords: download, ios, android, qr, install
+  - components: `text-ui` `button-ui` `adia-mark-ui` `field-ui` `icon-ui` `input-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/onboarding/mobile-app/mobile-app.contents.html` · demo: `/apps/user-flow/app/onboarding/mobile-app/mobile-app.html` · docs: `/site/examples/onboarding/mobile-app`
+- **Browser Extension** (Onboarding) — 'Browser extension' onboarding step — prompts installing the browser add-on; reach for it as the extension-install promo step of onboarding.
+  - keywords: chrome, addon, plugin, install, toolbar
+  - components: `text-ui` `icon-ui` `button-ui` `kbd-ui` `adia-mark-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/onboarding/browser-extension/browser-extension.contents.html` · demo: `/apps/user-flow/app/onboarding/browser-extension/browser-extension.html` · docs: `/site/examples/onboarding/browser-extension`
+- **Complete** (Onboarding) — 'All set' final onboarding screen — completion card launching the user into the product; reach for it as the terminal screen of onboarding.
+  - keywords: done, finished, all-set, ready, launch
+  - components: `timeline-item-ui` `kbd-ui` `text-ui` `adia-mark-ui` `alert-ui` `button-ui` `step-progress-ui` `timeline-ui`
+  - source: `/apps/user-flow/app/onboarding/complete/complete.contents.html` · demo: `/apps/user-flow/app/onboarding/complete/complete.html` · docs: `/site/examples/onboarding/complete`
+
+### overlays
+
+- **Card Grid Images** (Pattern Library) — Image gallery grid with lightbox overlay — responsive 3-column grid of image cards with cover photo, title, and description.
+  - keywords: image, gallery, grid, lightbox, overlay, card-grid, image-ui, media, photo, gallery-grid
+  - components: `text-ui` `card-ui` `col-ui` `image-ui` `grid-ui`
+  - source: `/catalog/ui-patterns/app/card-grid-images/card-grid-images.contents.html` · demo: `/catalog/ui-patterns/app/card-grid-images/card-grid-images.html` · docs: `/site/examples/patterns/card-grid-images`
+- **Destructive Confirm Modal** (Pattern Library) — Destructive-action modal dialog with a confirmation form — resource-name input field, cancel and delete action buttons, warning icon, and irreversible-action prose.
+  - keywords: modal, dialog, form, confirm, modal-ui, button-ui, destructive, confirm, input, action
+  - components: `button-ui` `text-ui` `avatar-ui` `col-ui` `field-ui` `input-ui` `modal-ui` `row-ui`
+  - source: `/catalog/ui-patterns/app/destructive-confirm-modal/destructive-confirm-modal.contents.html` · demo: `/catalog/ui-patterns/app/destructive-confirm-modal/destructive-confirm-modal.html` · docs: `/site/examples/patterns/destructive-confirm-modal`
+- **Content Blocks** (Pattern Library) — Masonry image gallery — variable-height tiles in a column-flow grid with hover overlays.
+  - keywords: masonry, gallery, images, photos, grid, variable-height, pinterest, tiles, overlays, lightbox
+  - components: `text-ui` `col-ui` `card-ui` `avatar-ui` `image-ui` `row-ui` `progress-ui` `col-def` `grid-ui` `timeline-item-ui` `avatar-group-ui` `badge-ui`
+  - source: `/catalog/ui-patterns/v050-content-blocks/v050-content-blocks.contents.html` · demo: `/catalog/ui-patterns/v050-content-blocks/v050-content-blocks.html` · docs: `/site/examples/patterns/v050-content-blocks`
+- **Popover With Content** (Pattern Library) — Popover anchored to a trigger button, containing a small content panel with a heading + body text + close affordance.
+  - keywords: popover, popup, overlay, anchor, trigger, content, tooltip, floating, panel, hint
+  - components: `text-ui` `col-ui` `button-ui` `card-ui` `popover-ui`
+  - source: `/catalog/ui-patterns/app/popover-with-content/popover-with-content.contents.html` · demo: `/catalog/ui-patterns/app/popover-with-content/popover-with-content.html` · docs: `/site/examples/patterns/popover-with-content`
+
+### registration-flow
+
+- **Workspace** (Registration) — Name-your-workspace signup step — one name field with step progress; reach for it as the workspace-creation step of a registration wizard.
+  - keywords: signup, organization, create, tenant, name
+  - components: `field-ui` `input-ui` `text-ui` `adia-mark-ui` `button-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/registration/workspace/workspace.contents.html` · demo: `/apps/user-flow/app/registration/workspace/workspace.html` · docs: `/site/examples/registration/workspace`
+- **Profile** (Registration) — Tell-us-about-you signup step — avatar upload plus name fields; reach for it as the personal-details step of a registration wizard.
+  - keywords: signup, avatar, name, personal, about-you
+  - components: `field-ui` `text-ui` `input-ui` `adia-mark-ui` `avatar-ui` `button-ui` `col-ui` `row-ui` `step-progress-ui` `upload-ui`
+  - source: `/apps/user-flow/app/registration/profile/profile.contents.html` · demo: `/apps/user-flow/app/registration/profile/profile.html` · docs: `/site/examples/registration/profile`
+- **Use case** (Registration) — 'What brings you here?' signup step — option-card picker plus free-text; reach for it as the goal/intent-selection step of a signup wizard.
+  - keywords: purpose, goal, intent, reason, segmentation
+  - components: `option-card-ui` `text-ui` `adia-mark-ui` `button-ui` `col-ui` `step-progress-ui` `textarea-ui`
+  - source: `/apps/user-flow/app/registration/use-case/use-case.contents.html` · demo: `/apps/user-flow/app/registration/use-case/use-case.html` · docs: `/site/examples/registration/use-case`
+- **Team size** (Registration) — Team-size picker signup step — segmented control plus headcount select; reach for it as the company-size segmentation step of signup.
+  - keywords: headcount, company, employees, seats, scale
+  - components: `avatar-ui` `segment-ui` `field-ui` `adia-mark-ui` `button-ui` `row-ui` `segmented-ui` `select-ui` `step-progress-ui` `text-ui`
+  - source: `/apps/user-flow/app/registration/team-size/team-size.contents.html` · demo: `/apps/user-flow/app/registration/team-size/team-size.html` · docs: `/site/examples/registration/team-size`
+- **Invite** (Registration) — Invite-teammates signup step — email input, role select, pending-invite cards; reach for it as the seat-invitation step of signup.
+  - keywords: teammates, email, seats, colleagues, members
+  - components: `field-ui` `button-ui` `input-ui` `select-ui` `text-ui` `adia-mark-ui` `alert-ui` `avatar-ui` `card-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/registration/invite/invite.contents.html` · demo: `/apps/user-flow/app/registration/invite/invite.html` · docs: `/site/examples/registration/invite`
+- **Integrations** (Registration) — 'Connect your stack' signup step — grid of toggleable integration cards; reach for it as the optional tool-connection step during signup.
+  - keywords: connect, apps, stack, tools, services
+  - components: `text-ui` `card-ui` `icon-ui` `switch-ui` `adia-mark-ui` `button-ui` `grid-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/registration/integrations/integrations.contents.html` · demo: `/apps/user-flow/app/registration/integrations/integrations.html` · docs: `/site/examples/registration/integrations`
+- **Import** (Registration) — 'Bring your data' signup step — source select plus file upload with format tags; reach for it as the data-import step during registration.
+  - keywords: data, upload, migrate, csv, source
+  - components: `tag-ui` `button-ui` `field-ui` `text-ui` `adia-mark-ui` `alert-ui` `col-ui` `row-ui` `select-ui` `step-progress-ui` `upload-ui`
+  - source: `/apps/user-flow/app/registration/import/import.contents.html` · demo: `/apps/user-flow/app/registration/import/import.html` · docs: `/site/examples/registration/import`
+- **Plan** (Registration) — Choose-a-plan signup step — option-card pricing tiers with badges; reach for it as the plan-selection step of a signup or upgrade wizard.
+  - keywords: pricing, tier, subscription, package, select
+  - components: `text-ui` `row-ui` `col-ui` `option-card-ui` `badge-ui` `icon-ui` `adia-mark-ui` `button-ui` `step-progress-ui` `textarea-ui`
+  - source: `/apps/user-flow/app/registration/plan/plan.contents.html` · demo: `/apps/user-flow/app/registration/plan/plan.html` · docs: `/site/examples/registration/plan`
+- **Billing** (Registration) — Billing-details signup step — card and payment fields with step progress; reach for it as the payment-capture step of registration checkout.
+  - keywords: payment, card, credit-card, checkout, pay
+  - components: `input-ui` `field-ui` `row-ui` `text-ui` `icon-ui` `adia-mark-ui` `button-ui` `col-ui` `divider-ui` `select-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/registration/billing/billing.contents.html` · demo: `/apps/user-flow/app/registration/billing/billing.html` · docs: `/site/examples/registration/billing`
+- **Confirmation** (Registration) — 'You're all set' signup confirmation — success card summarizing the new account; reach for it as a completion screen of a signup wizard.
+  - keywords: success, done, complete, welcome, finished
+  - components: `text-ui` `button-ui` `avatar-ui` `card-ui` `adia-mark-ui` `col-ui` `icon-ui` `row-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/registration/confirmation/confirmation.contents.html` · demo: `/apps/user-flow/app/registration/confirmation/confirmation.html` · docs: `/site/examples/registration/confirmation`
+- **Legal** (Registration) — Legal & tax-details signup step — entity fields, country select, consent checks; reach for it as the compliance step of a signup wizard.
+  - keywords: tax, terms, consent, compliance, vat
+  - components: `field-ui` `input-ui` `select-ui` `text-ui` `adia-mark-ui` `button-ui` `check-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/registration/legal/legal.contents.html` · demo: `/apps/user-flow/app/registration/legal/legal.html` · docs: `/site/examples/registration/legal`
+- **Address** (Registration) — Business-address signup step — street/city/country fields; reach for it as the address-capture step of registration or checkout.
+  - keywords: location, street, city, country, mailing
+  - components: `field-ui` `input-ui` `text-ui` `row-ui` `select-ui` `check-ui` `adia-mark-ui` `alert-ui` `button-ui` `divider-ui` `step-progress-ui` `textarea-ui`
+  - source: `/apps/user-flow/app/registration/address/address.contents.html` · demo: `/apps/user-flow/app/registration/address/address.html` · docs: `/site/examples/registration/address`
+- **Brand scrape** (Registration) — 'Pull your brand' signup step — URL input that fetches logo/colors into preview cards; reach for it as the auto-brand-import step of signup.
+  - keywords: logo, colors, website, url, theme
+  - components: `text-ui` `button-ui` `row-ui` `avatar-ui` `badge-ui` `card-ui` `icon-ui` `adia-mark-ui` `check-ui` `col-ui` `field-ui` `input-ui`
+  - source: `/apps/user-flow/app/registration/brand-scrape/brand-scrape.contents.html` · demo: `/apps/user-flow/app/registration/brand-scrape/brand-scrape.html` · docs: `/site/examples/registration/brand-scrape`
+- **Support** (Registration) — Customer-support setup signup step — configure help channels and contacts; reach for it as an optional support-setup step of registration.
+  - keywords: help, contact, channels, desk, service
+  - components: `text-ui` `card-ui` `icon-ui` `switch-ui` `field-ui` `segment-ui` `input-ui` `adia-mark-ui` `alert-ui` `button-ui` `check-ui` `col-ui`
+  - source: `/apps/user-flow/app/registration/support/support.contents.html` · demo: `/apps/user-flow/app/registration/support/support.html` · docs: `/site/examples/registration/support`
+- **Departments** (Registration) — 'Set up your departments' signup step — add and name org departments; reach for it as the org-structure step of a multi-team registration.
+  - keywords: teams, org, divisions, groups, units
+  - components: `check-ui` `text-ui` `button-ui` `row-ui` `tag-ui` `adia-mark-ui` `alert-ui` `col-ui` `divider-ui` `field-ui` `grid-ui` `input-ui`
+  - source: `/apps/user-flow/app/registration/departments/departments.contents.html` · demo: `/apps/user-flow/app/registration/departments/departments.html` · docs: `/site/examples/registration/departments`
+- **Org review** (Registration) — 'Review your org chart' signup step — org-structure summary before finishing; reach for it as the org-confirmation step of registration.
+  - keywords: organization, chart, structure, summary, hierarchy
+  - components: `text-ui` `button-ui` `row-ui` `avatar-ui` `badge-ui` `card-ui` `list-item-ui` `field-ui` `segment-ui` `icon-ui` `input-ui` `select-ui`
+  - source: `/apps/user-flow/app/registration/org-review/org-review.contents.html` · demo: `/apps/user-flow/app/registration/org-review/org-review.html` · docs: `/site/examples/registration/org-review`
+- **Personal** (Registration) — 'Round out your profile' signup step — extra personal-detail fields; reach for it as a profile-completion step of a registration wizard.
+  - keywords: profile, details, bio, about, complete
+  - components: `field-ui` `input-ui` `text-ui` `segment-ui` `select-ui` `divider-ui` `adia-mark-ui` `button-ui` `check-ui` `col-ui` `segmented-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/registration/personal/personal.contents.html` · demo: `/apps/user-flow/app/registration/personal/personal.html` · docs: `/site/examples/registration/personal`
+- **Done** (Registration) — 'You're fully set up' final registration screen — completion card with next-action CTA; reach for it as a signup flow's terminal screen.
+  - keywords: complete, finished, success, ready, all-set
+  - components: `card-ui` `text-ui` `stat-ui` `button-ui` `avatar-ui` `adia-mark-ui` `col-ui` `divider-ui` `icon-ui` `step-progress-ui`
+  - source: `/apps/user-flow/app/registration/done/done.contents.html` · demo: `/apps/user-flow/app/registration/done/done.html` · docs: `/site/examples/registration/done`
+
+### settings-page
+
+- **General** (Settings) — Workspace general-settings page — name, defaults, appearance, notifications, danger zone; reach for it as the primary settings surface.
+  - keywords: workspace, preferences, configuration, account, defaults
+  - components: `divider-ui` `switch-ui` `field-ui` `check-ui` `button-ui` `card-ui` `stat-ui` `text-ui` `col-ui` `grid-ui` `input-ui` `theme-panel`
+  - source: `/apps/saas/app/settings-page/settings-page.contents.html` · demo: `/apps/saas/app/settings-page/settings-page.html` · docs: `/site/examples/settings-page`
+- **Billing** (Settings) — Billing settings sub-page — trial countdown, plan card with monthly/annual toggle, usage quotas; reach for it as the plan-and-usage tab.
+  - keywords: subscription, plan, invoice, usage, quota
+  - components: `text-ui` `field-ui` `button-ui` `icon-ui` `input-ui` `row-ui` `card-ui` `col-ui` `divider-ui` `list-item-ui` `avatar-ui` `badge-ui`
+  - source: `/apps/saas/app/billing/billing.contents.html` · demo: `/apps/saas/app/billing/billing.html` · docs: `/site/examples/billing`
+- **Members** (Settings) — Members settings sub-page — invite-by-email form plus an active roster table with roles; reach for it as the workspace people-management tab.
+  - keywords: team, invite, roster, roles, seats
+  - components: `field-ui` `text-ui` `button-ui` `check-ui` `col-ui` `card-ui` `divider-ui` `avatar-ui` `badge-ui` `grid-ui` `input-ui` `row-ui`
+  - source: `/apps/saas/app/members/members.contents.html` · demo: `/apps/saas/app/members/members.html` · docs: `/site/examples/members`
+- **Integrations** (Settings) — Connected-apps settings sub-page — grid of third-party cards with per-app configure drawers; reach for it as the app-connections settings tab.
+  - keywords: apps, connections, oauth, third-party, services
+  - components: `field-ui` `text-ui` `button-ui` `col-ui` `divider-ui` `input-ui` `switch-ui` `check-ui` `row-ui` `card-ui` `avatar-ui` `badge-ui`
+  - source: `/apps/saas/app/integrations/integrations.contents.html` · demo: `/apps/saas/app/integrations/integrations.html` · docs: `/site/examples/integrations`
+- **Profile & Security** (Settings) — Profile-and-security settings sub-page — name/avatar fields, password change, 2FA setup, sessions; reach for it as the account-security tab.
+  - keywords: account, password, 2fa, sessions, authentication
+  - components: `text-ui` `button-ui` `field-ui` `col-ui` `avatar-ui` `input-ui` `divider-ui` `row-ui` `card-ui` `code-ui` `icon-ui` `alert-ui`
+  - source: `/apps/saas/app/profile-security/profile-security.contents.html` · demo: `/apps/saas/app/profile-security/profile-security.html` · docs: `/site/examples/profile-security`
+
+### system-status
+
+- **404 — Not Found** (System) — 404 not-found error page — centered card with a message and a back-home CTA; reach for it as the missing-page or broken-link error surface.
+  - keywords: error, missing, broken-link, lost, dead-end
+  - components: `col-ui` `button-ui` `text-ui` `adia-mark-ui` `alert-ui` `card-ui`
+  - source: `/apps/errors/app/404/404.contents.html` · demo: `/apps/errors/app/404/404.html` · docs: `/site/examples/errors/404`
+- **500 — Server Error** (System) — 500 server-error page — centered card explaining an internal failure with a retry CTA; reach for it as the generic server-fault surface.
+  - keywords: crash, failure, fault, retry, internal
+  - components: `button-ui` `col-ui` `text-ui` `adia-mark-ui` `alert-ui` `card-ui`
+  - source: `/apps/errors/app/500/500.contents.html` · demo: `/apps/errors/app/500/500.html` · docs: `/site/examples/errors/500`
+- **Maintenance** (System) — Down-for-maintenance page — centered card announcing planned downtime with an ETA; reach for it as the scheduled-outage holding surface.
+  - keywords: downtime, outage, offline, scheduled, unavailable
+  - components: `col-ui` `button-ui` `text-ui` `adia-mark-ui` `alert-ui` `card-ui`
+  - source: `/apps/errors/app/maintenance/maintenance.contents.html` · demo: `/apps/errors/app/maintenance/maintenance.html` · docs: `/site/examples/errors/maintenance`
+
+### trait-composition
+
+- **Checkout success — 6-trait composed flow** (Trait compositions) — Checkout→success flow stitched from six independent traits — reach for it as the canonical place-order → success product moment.
+  - keywords: place-order, payment, celebration, animation, ecommerce
+  - components: `list-item-ui` `text-ui` `field-ui` `switch-ui` `col-ui` `row-ui` `button-ui` `input-ui` `list-ui` `stat-ui` `card-ui` `code-ui`
+  - source: `/playgrounds/composed-flow/app/composed-flow.contents.html` · demo: `/playgrounds/composed-flow/app/composed-flow.html` · docs: `/site/examples/composed-flow`
+
+### workflow
+
+- **Editor Code Pane** (Pattern Library) — Code editor pane with file-tabs header, line-numbered code surface, and status bar footer.
+  - keywords: editor, code, pane, tabs, ide, line-numbers, syntax-highlighting, monaco, codemirror
+  - components: `code-ui` `row-ui` `tab-ui` `text-ui` `button-ui` `tabs-ui`
+  - source: `/catalog/ui-patterns/app/editor-code-pane/editor-code-pane.contents.html` · demo: `/catalog/ui-patterns/app/editor-code-pane/editor-code-pane.html` · docs: `/site/examples/patterns/editor-code-pane`
+- **Editor Preview Pane** (Pattern Library) — Preview pane rendering the editor's output with toolbar (refresh, viewport, share) and live content area.
+  - keywords: preview, render, editor, pane, output, live-preview, iframe, aside, content, preview-pane
+  - components: `button-ui` `text-ui` `row-ui` `col-ui`
+  - source: `/catalog/ui-patterns/app/editor-preview-pane/editor-preview-pane.contents.html` · demo: `/catalog/ui-patterns/app/editor-preview-pane/editor-preview-pane.html` · docs: `/site/examples/patterns/editor-preview-pane`
+- **Kanban Board 3col** (Pattern Library) — Kanban board with todo, in progress, and done columns. Task cards with title, assignee avatar, priority badge, and label tag.
+  - keywords: kanban, board, todo, in-progress, done, columns, tasks, project-management, cards, assignee
+  - components: `text-ui` `row-ui` `badge-ui` `card-ui` `col-ui` `avatar-ui` `tag-ui` `grid-ui`
+  - source: `/catalog/ui-patterns/app/kanban-board-3col/kanban-board-3col.contents.html` · demo: `/catalog/ui-patterns/app/kanban-board-3col/kanban-board-3col.html` · docs: `/site/examples/patterns/kanban-board-3col`
+- **Payment Method Form** (Pattern Library) — Payment method form — credit card number, expiry, CVC, billing address fields with save/cancel actions. Inline card form (drawer-less variant for gallery + inline-form contexts).
+  - keywords: payment, method, credit, card, billing, form, update, save, cvc, cvv
+  - components: `field-ui` `input-ui` `button-ui` `grid-ui` `row-ui` `alert-ui` `avatar-ui` `card-ui` `col-ui` `divider-ui` `select-ui` `text-ui`
+  - source: `/catalog/ui-patterns/app/payment-method-form/payment-method-form.contents.html` · demo: `/catalog/ui-patterns/app/payment-method-form/payment-method-form.html` · docs: `/site/examples/patterns/payment-method-form`
+- **Settings Appearance** (Pattern Library) — Appearance settings section — theme picker, density + radius sliders, color-scheme toggle.
+  - keywords: settings, appearance, theme, density, radius, color-scheme, dark-mode, preferences, ui-controls
+  - components: `card-ui` `theme-panel`
+  - source: `/catalog/ui-patterns/app/settings-appearance/settings-appearance.contents.html` · demo: `/catalog/ui-patterns/app/settings-appearance/settings-appearance.html` · docs: `/site/examples/patterns/settings-appearance`
+- **Settings Notifications** (Pattern Library) — Notification preferences panel with per-channel enable/disable toggles for email and push — weekly digest, mentions, product updates, direct messages, and team alerts.
+  - keywords: notification, preferences, notification-preferences, panel, settings, per-channel, email, push, sms, channel
+  - components: `text-ui` `row-ui` `switch-ui` `col-ui` `card-ui` `divider-ui`
+  - source: `/catalog/ui-patterns/app/settings-notifications/settings-notifications.contents.html` · demo: `/catalog/ui-patterns/app/settings-notifications/settings-notifications.html` · docs: `/site/examples/patterns/settings-notifications`
+- **Split Pane Editor** (Pattern Library) — Split-pane editor layout — a resizable code pane on the left (Run / Save actions, monospace editing surface) beside a live preview pane on the right, sharing one drag seam.
+  - keywords: split-pane, split, pane, two-column, editor, preview, code, side-by-side, workspace, resizable
+  - components: `button-ui` `pane-ui` `row-ui` `text-ui` `textarea-ui`
+  - source: `/catalog/ui-patterns/app/split-pane-editor/split-pane-editor.contents.html` · demo: `/catalog/ui-patterns/app/split-pane-editor/split-pane-editor.html` · docs: `/site/examples/patterns/split-pane-editor`
+- **Tooltip Hover** (Pattern Library) — Tooltip on hover — icon buttons with tooltip-ui showing contextual hints on mouse-over. Pattern for toolbar icons with hover tooltips.
+  - keywords: tooltip, hover, tooltip-ui, mouse-over, hover-hint, popover, label, hint, trigger, button-ui
+  - components: `button-ui` `tooltip-ui` `divider-ui` `row-ui` `col-ui`
+  - source: `/catalog/ui-patterns/app/tooltip-hover/tooltip-hover.contents.html` · demo: `/catalog/ui-patterns/app/tooltip-hover/tooltip-hover.html` · docs: `/site/examples/patterns/tooltip-hover`
+- **Empty State CTA** (Pattern Library) — Empty state with illustration, bold headline, description, and primary call-to-action button — shown when a list/view has no content yet.
+  - keywords: empty, state, illustration, bold, headline, description, primary, call-to-action, button, no-results
+  - components: `empty-state-ui` `button-ui` `col-ui`
+  - source: `/catalog/ui-patterns/app/empty-state/empty-state.contents.html` · demo: `/catalog/ui-patterns/app/empty-state/empty-state.html` · docs: `/site/examples/patterns/empty-state`
+- **Keyboard Shortcut Display** (Pattern Library) — Keyboard shortcut reference grid — each row is a key combo + description.
+  - keywords: keyboard, shortcuts, kbd, hotkeys, cheatsheet, reference, help, cmd, ctrl, quick-keys
+  - components: `row-ui` `kbd-ui` `text-ui` `card-ui` `col-ui`
+  - source: `/catalog/ui-patterns/app/keyboard-shortcut-display/keyboard-shortcut-display.contents.html` · demo: `/catalog/ui-patterns/app/keyboard-shortcut-display/keyboard-shortcut-display.html` · docs: `/site/examples/patterns/keyboard-shortcut-display`