- CompactFacilityConnection gets an optional segmentShape ('tunnel' |
'bridge'); omitted keeps the narrow centre strip
- Tunnel: 30% rounded section with a white outline and a dot on each end
- Bridge: 30% square section with white end lines and a square mark at
each end
@hm-design/center-graphic
React 19 CENTER graphics. Published entrypoints contain ESM JavaScript, TypeScript declarations, component CSS and embedded SVG assets.
import { CenterTitle, TunnelFacility } from "@hm-design/center-graphic"
import { CenterTitleReferenceDemo } from "@hm-design/center-graphic/reference"
Both JavaScript entrypoints automatically import the component stylesheet. Use a bundler that handles CSS imports. The stylesheet is also available explicitly as @hm-design/center-graphic/style.css.
Vite processes SVG imports and import.meta.glob during the repository build. Published JavaScript and declarations do not require Vite or vite/client. React and React DOM are peers and are not bundled. This package does not depend on @hm-design/ui.
From the HMDesignSystem repository, run npm run build -w @hm-design/center-graphic. npm pack runs this build automatically. Only dist/, this README and the package manifest are packed; raw source assets and Storybook files are excluded.