[stmh]

What

App takes a new optional navbarEnd?: Snippet prop and forwards it to Navbar's existing end slot, which renders before the settings gear. It shows only when the navbar does. mountFlowDropApp takes the same option and passes it on, so a host that mounts through the function (and keeps its draft manager and host colour scheme) can use it too.

Why

A host that embeds the full App (flowdrop-rs's editor route) needs to put its own controls in the editor navbar, such as the user menu, so the editor and the host's admin UI share one toolbar instead of stacking two. Navbar already supports this; App just didn't pass it through.

Tests

• e2e: tests/e2e/editor-branding.spec.ts gains "Navbar end content". The /test/editor?navbarEnd=1 route passes a snippet, and the test asserts that it renders inside .flowdrop-navbar__end, and that nothing renders without it.
• unit: tests/unit/mount/navbarEnd.test.ts checks that mountFlowDropApp forwards the snippet.
• svelte-check: 0 errors, 0 warnings. Prettier is clean.

CHANGELOG: Unreleased / Added.

https://claude.ai/code/session_01XR2k7eeSeAKTuptqh4uyee

[stmh]

Rebased onto #61 (CI on Node 22), which fixes the ERR_PNPM_UNSUPPORTED_ENGINE failures this PR showed. The diff shrinks back to this PR's own commit once #61 merges.

https://claude.ai/code/session_01XR2k7eeSeAKTuptqh4uyee

[d34dman]

Released in @flowdrop/flowdrop 2.16.0 (tag 2.16.0), so I'm closing this PR. Your commit aaab760 landed on main before your rebase onto #61, which is why GitHub doesn't show it as merged. Thanks!

What shipped

• App takes navbarEnd?: Snippet exactly as in the PR. It renders in the navbar's end slot, before the settings gear, and only when the navbar is shown.

Different from the PR: mountFlowDropApp takes an element callback, not a snippet. A host that mounts through the function may not have Svelte snippets, so the option is now:

navbarEnd?: (target: HTMLElement) => void | (() => void)

// Svelte host
navbarEnd: (target) => {
  const c = mount(UserMenu, { target });
  return () => unmount(c);
}
// Plain JS host
navbarEnd: (target) => target.append(button)

• The library renders one empty host element (.flowdrop-navbar__host-end, display: contents, so it adds no box or gap) and calls your callback with it once the element is in the page. On the editor's first render the navbar is built before it is attached, so the call waits for that; if the navbar goes away first, the callback is never called.
• The function you return runs when the slot goes away. The callback can run again if the navbar is re-mounted.
• It runs untracked, so state your component reads doesn't re-render the navbar. If it throws, the error is logged and the editor carries on.
• mountFlowDropApp logs a warning if navbarEnd is given while showNavbar isn't true (the default is false).

For flowdrop-rs: the editor route mounts through mountFlowDropApp, so pass the callback form with showNavbar: true.

Tests: the e2e from the PR (editor-branding.spec.ts, "Navbar end content") plus tests/unit/mount/navbarEnd.svelte.test.ts, which runs the callback through the real Navbar. CHANGELOG 2.16.0