feat(viewer): add a toolbar extension API to the embeddable viewer - #19
Open
ericgozzi wants to merge 3 commits into
Open
feat(viewer): add a toolbar extension API to the embeddable viewer#19ericgozzi wants to merge 3 commits into
ericgozzi wants to merge 3 commits into
Conversation
ericgozzi
marked this pull request as ready for review
August 19, 2026 13:15
Lets consumers add their own toolbar tools via createViewer({ toolbarTools })
instead of forking the app shell: a ToolDefinition list of Vue components
rendered after the built-in tool groups, a narrow useViewerMessaging()
composable for talking to a backend, and a new /ui subpath exporting the
stable subset of the internal component kit (Button, Kbd, KbdGroup,
Tooltip*) to build them with. Documented in docs/extending-the-viewer.md and
demonstrated in examples/embedded_custom_tool.html.
Also fixes `prepare` so a git-dependency install (e.g.
github:compas-dev/compas_threejs_ts#<branch>) actually builds dist-lib
before use, via a small cross-platform script - the previous inline
`cmd1 || true && cmd2` no-ops the build under cmd.exe on Windows, since its
&&/|| chaining doesn't group the way POSIX shells do.
Extends the toolbar extension API from the previous commit with per-panel
placement and styling, so a consumer can fully restyle/relayout without
forking the app shell:
- toolbarPlacement / openbarPlacement / objectActionsPlacement options
("corner" | "docked-top" / "docked-left"), each defaulting to today's
floating-corner behavior. Docked-top toolbar and object-actions bars share
a height via --docked-bar-height, derived from the new --docked-bar-padding
so consumers only need to tune one value.
- --toolbar-background/--toolbar-border-color and their object-actions
equivalents, so those two panels' look is independently overridable
instead of only through the shared .theme class (which still covers
Openbar and box-shadow/backdrop-filter for all three).
- --section-title-background/-shadow/-blur, replacing the FUNCTIONS/METADATA
headers' hardcoded glass bezel.
- Toolbar's root selector picked up a `div.` prefix, matching its sibling
components: without it, its specificity exactly ties a consumer's
`:root .theme { border: ... }`-style override and loses on source order.
Verified end-to-end against timber_model_viewer's frontend-src, including a
real minified-build bug in Vite's CSS minifier (silently drops an unprefixed
backdrop-filter declared alongside its -webkit- pair).
scripts/prepare.mjs inherited the vite build's stdout, which broke CI's test:package step: some npm versions still run `prepare` during `npm pack --ignore-scripts --json` (the flag reliably skips it in newer npm, but not consistently across versions - CI's Node 22 setup installs an older bundled npm than this repo's pinned packageManager). When that happens, the build's stdout interleaves with npm pack's own --json output and JSON.parse fails downstream in scripts/test-package.mjs. prepare.mjs now captures the build's output instead of inheriting it, only surfacing it (on stderr, never stdout) if the build actually fails - verified both paths directly. Also fixes a real, separate bug in test-package.mjs while I was in there: its spawnSync calls for npm.cmd needed shell: true on Windows (Node can't exec a .cmd shim without going through a shell), so the script has never actually run to completion locally on Windows until now.
ericgozzi
force-pushed
the
feature/viewer-extension-api
branch
from
August 19, 2026 13:15
f3e5c3c to
c516317
Compare
This file contains hidden or bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment
1 participant
Add this suggestion to a batch that can be applied as a single commit.This suggestion is invalid because no changes were made to the code.Suggestions cannot be applied while the pull request is closed.Suggestions cannot be applied while viewing a subset of changes.Only one suggestion per line can be applied in a batch.Add this suggestion to a batch that can be applied as a single commit.Applying suggestions on deleted lines is not supported.You must change the existing code in this line in order to create a valid suggestion.Outdated suggestions cannot be applied.This suggestion has been applied or marked resolved.Suggestions cannot be applied from pending reviews.Suggestions cannot be applied on multi-line comments.Suggestions cannot be applied while the pull request is queued to merge.Suggestion cannot be applied right now. Please check back later.
Lets consumers add their own toolbar tools via createViewer({ toolbarTools }) instead of forking the app shell: a ToolDefinition list of Vue components rendered after the built-in tool groups, a narrow useViewerMessaging() composable for talking to a backend, and a new /ui subpath exporting the stable subset of the internal component kit (Button, Kbd, KbdGroup, Tooltip*) to build them with. Documented in docs/extending-the-viewer.md and demonstrated in examples/embedded_custom_tool.html.
Also fixes
prepareso a git-dependency install (e.g. github:compas-dev/compas_threejs_ts#) actually builds dist-lib before use, via a small cross-platform script - the previous inlinecmd1 || true && cmd2no-ops the build under cmd.exe on Windows, since its &&/|| chaining doesn't group the way POSIX shells do.The title must be a conventional commit:
fix:,feat:,feat!:for a breaking change, or one ofbuild:chore:ci:docs:perf:refactor:style:test:. Release Please buildsCHANGELOG.mdand the next version number from it. Apply theno changeloglabel to skip. Running
npm installenables acommit-msghook that checksyour commits as you make them.
Checklist
npm run checkis green (formatting, lint, types, unit tests, both builds).npm run test:browserandnpm run test:packagepass.