HTML installation, artifacts, and exports

Package

The official package is @relation-graph/html:

npm install @relation-graph/html@3.1.2

The retired Web Component packages are no longer built or published. relation-graph-html is currently a reserved name, not a published package.

Distribution files

File	Purpose
relation-graph.mjs	ESM for browsers and bundlers
relation-graph.umd.js	Direct <script> entry exposing global RelationGraph
relation-graph.js	CommonJS entry
style.css	Complete graph and official UI styles
types/	TypeScript declarations
docs/	Complete manual shipped in the npm package

JavaScript does not inject CSS. Load style.css for UMD, ESM, and npm usage.

Core exports

import {
  createRelationGraph,
  RelationGraphCore,
  RGLayouts,
  RGUtils,
  version
} from '@relation-graph/html';

• createRelationGraph(host, config) creates and mounts an instance.
• RelationGraphCore supports advanced core substitution or extension.
• RGLayouts exposes the built-in Base, Tree, Center, Circle, Fixed, Force, and Folder layout classes.
• RGUtils exposes node, line, option, math, and analysis helpers.
• version reports the core version.

All public data types, enums, and core API types are exported too.

HTML-specific exports

import {
  trustedHTML,
  toolbar,
  miniView,
  editing,
  registerConnectTarget,
  defineRelationGraphElement
} from '@relation-graph/html';

Export	Purpose
trustedHTML()	Explicitly allow renderer text to be parsed as HTML
toolbar()	Create the official toolbar plugin
miniView()	Create the MiniView plugin
editing()	Create the editing controller plugin
registerConnectTarget()	Register a regular DOM/SVG element as a line target
defineRelationGraphElement()	Explicitly register the optional single light-DOM element

TypeScript

import type {
  RGHtmlConfig,
  RGHtmlInstance,
  RGHtmlPlugin,
  RGHtmlRenderers,
  RGOptions,
  RGJsonData,
  RGListeners
} from '@relation-graph/html';

RGHtmlInstance combines the core RelationGraphInstance API with whenReady, destroy(), setRenderers(), setLayers(), use(), subscribe(), and getLayerElement().

Runtime requirements

• A browser DOM is required; SSR and hydration are not supported.
• The host must be a connected HTMLElement with computable width and height.
• The browser must support ES2020, SVG, Canvas 2D, ResizeObserver, and CustomEvent.
• A host can contain only one live instance at a time.

Next: HTML configuration and layouts.