## Summary
- Add Mastra and Iterable logos to the README traction section
- Fix all 10 company logos for GitHub SVG compatibility: convert `<text>` to path outlines, remove `xlink`/`<use>`/`<defs>`, strip near-1.0 opacity values, normalize viewBoxes
- Increase logo display height from 16px to 20px for better text readability
- Add `target="_blank"` to all logo links
## What changed
| File | Change |
|------|--------|
| `README.md` | **Updated.** Added Mastra (first) and Iterable logos, bumped all logo heights 16→20px, added `target="_blank"` to all 10 logo links |
| `.github/assets/logos/Mastra.svg` | **New.** Converted from source SVG, single-tone `#666`, viewBox cropped to content |
| `.github/assets/logos/Iterable.svg` | **New.** Multi-tone icon preserving depth hierarchy (`#666`/`#999`/`#aaa`), text converted to path outlines |
| `.github/assets/logos/Coreviz.svg` | **Rewritten.** Replaced `<text>` element (used `Fantasy` font) with Rajdhani Bold path outlines. SVGO optimized, viewBox cropped |
| `.github/assets/logos/Browser-Use.svg` | **Rewritten.** Replaced wrong-font text paths with Geist Sans Bold outlines generated via opentype.js. SVGO optimized |
| `.github/assets/logos/Athena-Intelligence.svg` | **Updated.** Inlined `<use xlink:href>` elements as `<path>`, removed `<defs>`. SVGO baked transform into coordinates, viewBox cropped |
| `.github/assets/logos/helicone.svg` | **Updated.** Removed 6 near-1.0 opacity attrs, normalized offset viewBox `(600 400 ...)` → `(0 0 ...)` via SVGO translate bake, viewBox cropped to content |
| `.github/assets/logos/LangChain.svg` | **Updated.** Removed no-op `clipPath`, empty `<defs>`, and unused `xmlns:xlink`. SVGO optimized |
| `.github/assets/logos/Inconvo.svg` | **Updated.** SVGO optimized |
| `.github/assets/logos/Stack.svg` | **Updated.** SVGO optimized |
| `.github/assets/logos/gram.svg` | **Updated.** SVGO optimized |
## GitHub SVG compatibility
GitHub's SVG sanitizer strips `<style>`, `<script>`, fonts, and can break `xlink` namespace references. All logos were hardened:
- **`<text>` → `<path>`**: GitHub can't render custom fonts, so text elements were converted to path outlines using opentype.js with the correct brand fonts (Rajdhani Bold for Coreviz, Geist Sans Bold for Browser Use)
- **`<use>`/xlink removed**: Athena Intelligence used `<defs>` + `<use xlink:href>` which GitHub can strip, leaving invisible elements. Inlined as direct `<path>` elements
- **Opacity flattened**: Helicone had opacity values of `.986`–`.994` (imperceptibly different from 1.0). Removed to simplify
- **ViewBox normalized**: Helicone's offset viewBox `(600 400 3030 700)` was normalized to `(0 0 ...)` by wrapping in a translate group and letting SVGO bake the coordinates
- **ViewBox cropped**: Removed dead space around content in Mastra, Coreviz, Iterable, Helicone, and Athena Intelligence to maximize rendered text size
<details>
<summary>Click to expand design decisions and rationale</summary>
### Text converted to path outlines, not kept as `<text>`
GitHub's SVG sanitizer strips all font references. The only reliable way to render text is as `<path>` outlines. We used opentype.js to load each brand's actual font (identified from their sites' CSS) and convert to paths.
### Multi-tone Iterable icon preserved with pre-blended hex values
Iterable's logo has white circle nodes, medium diamond intersections, and dark connecting lines. Instead of using `opacity` (which renders differently on light vs dark backgrounds), we pre-blended to fixed hex values: `#666` (dark), `#999` (medium), `#aaa` (light).
### Display height bumped from 16px to 20px
At 16px, several logos had text below 7px — particularly Athena Intelligence (~4.2px) and Helicone (~6.2px). Bumping to 20px (matching the SVGs' native height) gives a 25% size increase across the board, bringing all text to readable levels.
### ViewBox cropping instead of text rescaling
For logos where the icon defines the height (Coreviz, Iterable, Helicone, Athena), we cropped dead space from the viewBox rather than scaling text independently. This preserves the original logo proportions while maximizing the rendered size.
</details>
## Test plan
- [x] Opened all 10 SVGs individually in browser to verify rendering
- [x] Created HTML preview pages showing all logos inline at display size on both light and dark backgrounds
- [x] Verified bounding boxes via `getBBox()` to confirm viewBox crops don't clip content
- [x] Confirmed no remaining `xlink`, `<use>`, `<defs>`, `opacity`, or `<text>` elements across all logos
Add a new DevTools documentation page (docs/devtools.mdx) that
introduces the assistant-ui DevTools, shows a screenshot, and provides
a short setup walkthrough. The guide explains installation of the
@assistant-ui/react-devtools package, demonstrates how to mount the
DevToolsModal inside AssistantRuntimeProvider, and shows verification
steps with another screenshot.
Update docs meta (meta.json) to include the new "devtools" entry so the
page appears in the sidebar/navigation.
This adds developer-facing documentation to help debug assistant-ui
state and events without relying on console.log, improving onboarding
for contributors and integrators.
github-actions[bot]