Skip to content

fix(dockview-vue): accept components via prop (resolves #1301)#1302

Open
mathuo wants to merge 2 commits into
masterfrom
fix/vue-components-prop-1301
Open

fix(dockview-vue): accept components via prop (resolves #1301)#1302
mathuo wants to merge 2 commits into
masterfrom
fix/vue-components-prop-1301

Conversation

@mathuo
Copy link
Copy Markdown
Owner

@mathuo mathuo commented May 23, 2026

Summary

  • Adds components and tabComponents map props to <DockviewVue>, and lets every singular slot prop (defaultTabComponent, watermarkComponent, *HeaderActionsComponent, tabGroupChipComponent, groupDragGhostComponent) accept a component object directly — matching the React (packages/dockview/src/dockview/dockview.tsx) and Angular (packages/dockview-angular/src/lib/dockview/types.ts) APIs.
  • Resolves The component must be globally registered in main.ts to find the component to render in the panel #1301: <script setup> users were forced to register every panel component globally via app.component(...) in main.ts, because findComponent only walked the instance-component tree and the app registry — neither of which <script setup> imports populate. Now <DockviewVue :components="{ Foo: MyFoo }" /> works without any global registration.
  • Fully additive — the existing Options-API local-registration and global app.component(...) paths still resolve as before.
  • defaultTabComponent as a component object uses a DEFAULT_VUE_TAB sentinel routed through createTabComponent, mirroring React's DEFAULT_REACT_TAB.
  • Also fixes the mistyped components: Record<string, string> on splitview/gridview/paneview types (now Record<string, VueComponent> and actually wired through useViewComponent).

Test plan

  • All 110 unit tests pass (78 baseline + 32 new) — yarn workspace dockview-vue run test --run
  • vue-tsc type check clean — yarn workspace dockview-vue run build:types
  • New tests cover: findComponent map-priority/fallthrough/error paths, resolveComponent all branches, <DockviewVue> with bare components prop (no global registration), tabComponents map, every singular slot prop accepting a component object, sentinel routing for defaultTabComponent, runtime map swap, equivalent coverage for splitview/gridview/paneview
  • Manual smoke in a <script setup> app to confirm the reporter's scenario (recommended before merge)
  • Docs preview build clean (packages/docs/docs/core/panels/register.mdx, packages/docs/docs/overview/quickstart.mdx rewritten to show the new <script setup> + :components pattern)

Fixes #1301

🤖 Generated with Claude Code

mathuo and others added 2 commits May 23, 2026 21:52
…r API

Adds `components` and `tabComponents` map props to <DockviewVue>, and lets
singular slot props (defaultTabComponent, watermarkComponent, *HeaderActions,
chip, ghost) take a component object directly. Resolves issue #1301 where
<script setup> users were forced to register every panel component globally
via app.component() because findComponent only walked the instance tree and
app registry. Fully additive — existing Options-API and global-registry
registration paths still work.

Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
@sonarqubecloud
Copy link
Copy Markdown

Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment

Labels

None yet

Projects

None yet

Development

Successfully merging this pull request may close these issues.

The component must be globally registered in main.ts to find the component to render in the panel

1 participant