WWU UI Kit — 0.9.1 sandbox

Visual smoke test for VB-extracted components (0.8.4 + 0.9.0 + 0.9.1). Render in any browser, scroll, click — every interaction below is wired to the kit.

Segmented control (0.9.0)

Default

Compact + icon variants

Output of segmented bind: visual

Status chip (0.9.0)

All semantic variants

Neutral Success Warning Danger Info

Aliases (semantic names you'd actually use)

Published Draft Pending Failed

Size variants

Small Default Large

Pulse animation

Syncing Reconnecting

Overflow menu (0.9.0) + Popover (0.8.4)

Right-anchored (default)

Left-anchored variant

Last action: none

Breadcrumb (0.9.0)

With slug chip

Compact variant

Code block (0.9.0)

Light + header + copy

CSS
.wwu-ui-btn {
  color: red;
  padding: 8px 12px;
}

Dark variant

JavaScript
function setPressed(btn, pressed) {
  btn.setAttribute('aria-pressed', pressed ? 'true' : 'false');
}
// 0.8.4: moved to wwuUIKit.aria.setPressed

Inline

Call apply_filters('wwu_amp_global_rules') in your code.

Tree row (0.9.0)

History row (0.9.0)

Save state (0.8.4)

Each state side-by-side

No changes Unsaved changes Saving… Saved just now Save failed

Live controller (cycles every 2s)

Badge --mono (0.9.1)

Inline values

1480 × 820 v0.9.1 a3f9c1 /landing-2026

Combined with color variants

a3f9c1 passed failed

Tabs --device (0.9.1)

Toolbar --3-zone (0.9.1)

Draft
Unsaved

Search with icon prefix (0.9.1)

Icon-only buttons (0.9.1)

All variants

Toggle state (aria-pressed)

Clipboard.copyWithFlash (0.8.4)

Click the buttons below. They flash .is-copied for 1.2s — no toast.