Anchor docs search and Ask AI in the toolbar

[wailingwombat]

Summary

• Anchors Kapa search and Ask AI in the docs header so the assistant is discoverable (PROD-4936). Header buttons use Kapa’s own .docs-search-trigger / .docs-ai-trigger classes; the existing widget script still owns the modal.
• Keeps the reading column stable across markdown and REST API pages: shared CSS grid, grey side nav, design-system breadcrumbs, and a Safari-safe table of contents.
• REST API: design-system Input2 for the endpoint filter (no clear button), and the desktop sidebar now appears in the mobile hamburger (Docs menu still switches back to the docs tree).
• Compact Search / Ask AI icon buttons expose textValue so they have accessible names.
• Kapa uses the centered default modal, dark theme, and Plural tokens. The floating launcher stays hidden.
• Console docs chrome only (js/documentation). No Console app, design-system, or pluralsh/documentation repo changes.

Test plan

• Open docs locally (yarn workspace @pluralsh/documentation dev) and confirm Search + Ask AI sit in the header
• Click Search and Ask AI; confirm ⌘K opens search
• Check a regular docs page with a TOC and one without (homepage / short page)
• Check a REST API page: layout, breadcrumbs, filter
• Safari: “On this page” links render when headings exist
• Narrow viewport: icon buttons instead of the full search bar
• Mobile REST: hamburger shows the endpoint list; Docs menu switches to the docs tree; selecting an endpoint closes the overlay

Plural Flow: docs
Plural Preview: docs

[linear]

PROD-4936

[soffi-ai]

Soffi AI Summary

This PR overhauls the Plural documentation site's chrome (js/documentation) to anchor Kapa AI search and Ask AI directly in the toolbar, and to stabilize the page layout across markdown docs and the REST API reference. The motivation was to make the AI assistant more discoverable (PROD-4936) and to fix layout inconsistencies across page types on both desktop and mobile.

Key changes:

• Kapa AI integration: Search and Ask AI buttons are now permanent fixtures in the docs header, using Kapa's own .docs-search-trigger / .docs-ai-trigger CSS classes to open the modal — the floating launcher is hidden and the custom helper is removed.
• Stable reading layout: A shared CSS grid (PageGrid) with a grey side nav and design-system breadcrumbs is used consistently across both markdown and REST API pages, so the reading column no longer shifts between page types.
• REST API UX improvements: The endpoint filter switches to the design-system Input2 component (without a clear button), and the desktop sidebar is now surfaced inside the mobile hamburger menu. The REST overlay is also prevented from covering the Docs menu control, and selecting an endpoint closes the mobile overlay automatically.
• Accessibility: Compact Search and Ask AI icon buttons now expose textValue for accessible names.
• No changes to the Console app, the design-system package, or the pluralsh/documentation repo.

Changes

Kapa AI search anchored in docs toolbar

• Adds permanent Search and Ask AI buttons to the docs header, using Kapa's .docs-search-trigger / .docs-ai-trigger classes so the assistant is always discoverable rather than hidden behind a floating launcher. (930a416)
• Replaces the custom Kapa helper with direct use of Kapa's header selector classes, so the header buttons drive the modal without bespoke glue code. (d0932df)
• Adds accessible textValue to compact Search and Ask AI icon buttons, and removes the non-standard clear control from the REST filter input. (6c27d6d)

Stable docs page layout with shared breadcrumbs

• Replaces the docs-only breadcrumb trail with the Console design-system Breadcrumbs component, unifying navigation chrome across all page types. (5eb6a0c)
• Gives breadcrumb wrapper elements full column width so they stretch correctly inside the shared CSS grid. (920135a)

REST API sidebar and filter improvements

• Replaces the custom filter input on the REST API reference with the design-system Input2 component, removing the non-standard clear button. (2d425f3)
• Surfaces the REST API endpoint sidebar inside the mobile hamburger menu so users can navigate endpoints without leaving the mobile overlay. (0ace58b)
• Fixes z-index / stacking so the REST overlay does not cover the Docs menu switcher control. (4d44aea)
• Keeps the mobile menu open when the user switches from the REST sidebar back to the docs tree, preventing an unexpected close. (402bfe8)
• Closes the mobile menu automatically when the user selects a REST endpoint, so the content area is immediately visible. (adf979d)
• Removes the redundant API menu switcher from the mobile docs tree view to simplify the navigation hierarchy. (b991d2f)

Docs Prettier formatting fixes

• Applies Prettier formatting to lint-failing documentation source files, with no functional changes. (4a097f7)

---

Updated: 2026-09-10 20:19 UTC

Deploy in Soffi

[greptile-apps]

Confidence Score: 5/5

The PR appears safe to merge, with both previous accessibility findings fully addressed and no new actionable issues identified.

Summary

• Adds accessible desktop and compact search/AI toolbar controls.
• Configures Kapa’s centered dark-themed modal while hiding its floating launcher.
• Introduces shared responsive page-grid and navigation styling.
• Adds REST navigation context for the mobile endpoint menu.
• Replaces the REST endpoint filter with the design-system input.

_{Reviews (2) · Last reviewed commit: "Name compact search buttons and drop the..."}

[wailingwombat]

@greptile

[plural-copilot]

✅ Deploy preview for docs-pr-4303 is ready!

Name	Details
⚡ Service	docs-pr-4303 (5 / 5 ready)
☁️ Cluster	plural (eks)
Commit sha	93f5c0b
Plural URL	https://console.mgmt.plural.sh/cd/clusters/446acdef-8524-425a-a49f-5336a...
🔍 Logs URL	https://console.mgmt.plural.sh/cd/clusters/446acdef-8524-425a-a49f-5336a...
🌊 Flow URL	https://console.mgmt.plural.sh/flows/08a17af1-8578-449e-9ae1-28ccd97eafc...
Preview Link	Preview

---

You can learn more about preview environments and Plural Flows here