The vd3 Line Guide
vd3 is the Vue-3-only line of Vanduo, shipped as a small, standalone set of packages under the @vanduo-oss scope. There is no separate token / CSS / JS split to wire together — one component library, plus one optional canvas bundle, documented by this site.
Three repositories
| Repo | Package | What it is |
|---|---|---|
vd3 | @vanduo-oss/vd3 | The design system and Vue 3 component library. Ships its own DTCG design tokens, the full CSS tree (@vanduo-oss/vd3/css), and typed Vd* components + composables. Standalone — its sole peer dependency is vue >=3.3. |
vd3-cbun | @vanduo-oss/vd3-cbun | The canvas bundle: charts, flowchart, hex-grid, and music-player, each on its own subpath. Install it only when a page needs a canvas widget; it shares the same tokens and theme as vd3. |
vd3-docs | — (not published to npm) | This documentation site. It dogfoods both packages — every live demo on these pages renders the real shipped component. |
Design tokens generate the CSS, the CSS is themed by the same tokens, and the Vd* components and composables render against both — all inside @vanduo-oss/vd3. @vanduo-oss/vd3-cbun sits alongside it for the heavier canvas widgets.
Install
Start with the design system; add the canvas bundle only if you need it:
# The design system + components (tokens & CSS included)
pnpm add @vanduo-oss/vd3# Optional — the canvas widgets (charts / flowchart / hex-grid / music-player)
pnpm add @vanduo-oss/vd3-cbunThen import from the two packages:
// Components, composables, tokens and CSS all come from one package:
import { VdButton } from '@vanduo-oss/vd3';
import '@vanduo-oss/vd3/css';
// Canvas widgets come from the bundle's per-widget subpaths:
import { VdChart } from '@vanduo-oss/vd3-cbun/charts';
import { VdFlowchart } from '@vanduo-oss/vd3-cbun/flowchart';The earlier line was retired
vd3 is the only line under active development. vanduo v2 — the earlier dual-engine system, its four canvas add-ons, and the v2 documentation site — was retired on 2026-07-25.
Its npm packages stay published at their final versions and keep working, so nothing built on them breaks. New projects should start here; existing v2 apps can move across with the Migration guide.