@dpuse/dpuse-tool-d3-visualiser 0.0.18

package/dist/types/eslint.config.d.ts

@@ -0,0 +1,3 @@
+export default config;
+/** @type {import('eslint').Linter.Config[]} */
+declare const config: import("eslint").Linter.Config[];

package/dist/types/src/billboardJs.d.ts

@@ -0,0 +1,15 @@
+import { Chart } from 'billboard.js';
+export interface BarChartSeries {
+    name: string;
+    values: number[];
+}
+export interface BarChartData {
+    categories: string[];
+    series: BarChartSeries[];
+}
+export interface BillboardJSHandle {
+    chart: Chart;
+    destroy: () => void;
+    resize: () => void;
+}
+export declare function renderBillboardJS(data: BarChartData, renderTo: HTMLElement): BillboardJSHandle;

package/dist/types/src/erdDiagram.d.ts

@@ -0,0 +1,29 @@
+export type ErdDiagramNodeTypeId = 'child' | 'primary';
+export interface ErdDiagramNode {
+    id: string;
+    label: string;
+    typeId: ErdDiagramNodeTypeId;
+}
+export interface ErdDiagramEdge {
+    source: string;
+    target: string;
+}
+export interface ErdDiagramData {
+    edges: ErdDiagramEdge[];
+    nodes: ErdDiagramNode[];
+}
+export interface ErdDiagramOptions {
+    nodeColors?: Record<ErdDiagramNodeTypeId, {
+        fill: string;
+        stroke: string;
+    }>;
+    nodeHeight?: number;
+    nodeWidth?: number;
+    padding?: number;
+    selfEdgeSize?: number;
+}
+export interface ErdDiagramHandle {
+    resize: () => void;
+    svg: SVGSVGElement;
+}
+export declare function renderErdDiagram(data: ErdDiagramData, renderTo: HTMLElement, options?: ErdDiagramOptions): ErdDiagramHandle;

package/dist/types/src/index.d.ts

@@ -0,0 +1,33 @@
+import { Chart } from 'billboard.js';
+import { PresentationView } from '@dpuse/dpuse-shared/component/presentation';
+import { BarChartData } from './billboardJs';
+import { ObservablePlotChartTypeId } from './observablePlot';
+import { ErdDiagramData, ErdDiagramOptions } from './erdDiagram';
+import { NetworkDiagramData, NetworkDiagramOptions } from './networkDiagram';
+import { SankeyDiagramData, SankeyDiagramOptions } from './sankeyDiagram';
+import { TreeDiagramNode, TreeDiagramOptions } from './treeDiagram';
+export type { BarChartData, BarChartSeries } from './billboardJs';
+export type { ErdDiagramData, ErdDiagramEdge, ErdDiagramNode, ErdDiagramNodeTypeId, ErdDiagramOptions } from './erdDiagram';
+export type { NetworkDiagramData, NetworkDiagramLink, NetworkDiagramNode, NetworkDiagramOptions } from './networkDiagram';
+export type { ObservablePlotChartTypeId } from './observablePlot';
+export type { SankeyDiagramData, SankeyDiagramLink, SankeyDiagramNode, SankeyDiagramOptions } from './sankeyDiagram';
+export type { TreeDiagramNode, TreeDiagramNodeRoleId, TreeDiagramOptions } from './treeDiagram';
+export interface D3View extends PresentationView {
+    svg: SVGSVGElement;
+}
+export interface D3NetworkView extends D3View {
+    destroy: () => void;
+    triggerAutoLayout: () => void;
+}
+export interface D3BarChartView extends PresentationView {
+    chart: Chart;
+    destroy: () => void;
+}
+export declare class D3Tool {
+    renderBillboardJS(data: BarChartData, renderTo: HTMLElement, callback?: () => void): Promise<D3BarChartView>;
+    renderObservablePlot(typeId: ObservablePlotChartTypeId, data: BarChartData, renderTo: HTMLElement, callback?: () => void): Promise<D3View>;
+    renderErdDiagram(data: ErdDiagramData, renderTo: HTMLElement, options?: ErdDiagramOptions, callback?: () => void): Promise<D3View>;
+    renderNetworkDiagram(data: NetworkDiagramData, renderTo: HTMLElement, options?: NetworkDiagramOptions, callback?: () => void): Promise<D3NetworkView>;
+    renderSankeyDiagram(data: SankeyDiagramData, renderTo: HTMLElement, options?: SankeyDiagramOptions, callback?: () => void): Promise<D3View>;
+    renderTreeDiagram(data: TreeDiagramNode, renderTo: HTMLElement, options?: TreeDiagramOptions, callback?: () => void): Promise<D3View>;
+}

package/dist/types/src/networkDiagram.d.ts

@@ -0,0 +1,22 @@
+export interface NetworkDiagramNode {
+    id: string;
+}
+export interface NetworkDiagramLink {
+    source: string;
+    target: string;
+}
+export interface NetworkDiagramData {
+    links: NetworkDiagramLink[];
+    nodes: NetworkDiagramNode[];
+}
+export interface NetworkDiagramOptions {
+    chargeStrength?: number;
+    linkDistance?: number;
+}
+export interface NetworkDiagramHandle {
+    destroy: () => void;
+    resize: () => void;
+    svg: SVGSVGElement;
+    triggerAutoLayout: () => void;
+}
+export declare function renderNetworkDiagram(data: NetworkDiagramData, renderTo: HTMLElement, options?: NetworkDiagramOptions): NetworkDiagramHandle;

package/dist/types/src/observablePlot.d.ts

@@ -0,0 +1,8 @@
+import { BarChartData } from './billboardJs';
+export type { BarChartData, BarChartSeries } from './billboardJs';
+export type ObservablePlotChartTypeId = 'bar';
+export interface ObservablePlotHandle {
+    resize: () => void;
+    svg: SVGSVGElement;
+}
+export declare function renderObservablePlot(typeId: ObservablePlotChartTypeId, data: BarChartData, renderTo: HTMLElement): ObservablePlotHandle;

package/dist/types/src/palette.d.ts

@@ -0,0 +1,15 @@
+export type ColorModeId = 'dark' | 'light';
+export declare const CATEGORICAL_PALETTE: readonly {
+    readonly dark: string;
+    readonly light: string;
+}[];
+export declare const INK: Readonly<Record<ColorModeId, {
+    readonly muted: string;
+    readonly primary: string;
+    readonly secondary: string;
+}>>;
+export declare const SURFACE: Readonly<Record<ColorModeId, {
+    readonly border: string;
+    readonly chart: string;
+}>>;
+export declare function categoricalColor(index: number, colorModeId: ColorModeId): string;

package/dist/types/src/sankeyDiagram.d.ts

@@ -0,0 +1,24 @@
+import { ColorModeId } from './palette';
+export interface SankeyDiagramNode {
+    id: string;
+    name: string;
+}
+export interface SankeyDiagramLink {
+    source: string;
+    target: string;
+    value: number;
+}
+export interface SankeyDiagramData {
+    links: SankeyDiagramLink[];
+    nodes: SankeyDiagramNode[];
+}
+export interface SankeyDiagramOptions {
+    colorModeId?: ColorModeId;
+    nodePadding?: number;
+    nodeWidth?: number;
+}
+export interface SankeyDiagramHandle {
+    resize: () => void;
+    svg: SVGSVGElement;
+}
+export declare function renderSankeyDiagram(data: SankeyDiagramData, renderTo: HTMLElement, options?: SankeyDiagramOptions): SankeyDiagramHandle;

package/dist/types/src/treeDiagram.d.ts

@@ -0,0 +1,22 @@
+export type TreeDiagramNodeRoleId = 'branch' | 'leaf' | 'root';
+export interface TreeDiagramNode {
+    children?: TreeDiagramNode[];
+    id: string;
+    label: string;
+}
+export interface TreeDiagramOptions {
+    levelGap?: number;
+    nodeColors?: Record<TreeDiagramNodeRoleId, {
+        fill: string;
+        stroke: string;
+    }>;
+    nodeHeight?: number;
+    nodeWidth?: number;
+    padding?: number;
+    siblingGap?: number;
+}
+export interface TreeDiagramHandle {
+    resize: () => void;
+    svg: SVGSVGElement;
+}
+export declare function renderTreeDiagram(data: TreeDiagramNode, renderTo: HTMLElement, options?: TreeDiagramOptions): TreeDiagramHandle;

package/dist/types/tests/billboardJs.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/tests/erdDiagram.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/tests/importIndex.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/tests/networkDiagram.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/tests/observablePlot.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/tests/sankeyDiagram.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/tests/treeDiagram.test.d.ts

@@ -0,0 +1 @@
+export {};

package/dist/types/vite.config.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vite').UserConfig;
+export default _default;

package/dist/types/vitest.config.d.ts

@@ -0,0 +1,2 @@
+declare const _default: import('vite').UserConfig;
+export default _default;

package/package.json

@@ -0,0 +1,97 @@
+{
+    "name": "@dpuse/dpuse-tool-d3-visualiser",
+    "version": "0.0.18",
+    "private": false,
+    "description": "A TypeScript wrapper for D3, Billboard.js, and Observable Plot that implements the Data Positioning chart-rendering interface, providing ERD (dagre), Sankey (d3-sankey), network (d3-force), tree (d3-hierarchy), and bar chart (billboard.js, Observable Plot) renderers.",
+    "license": "MIT",
+    "author": "Jonathan Terrell <terrell.jm@gmail.com>",
+    "type": "module",
+    "sideEffects": false,
+    "homepage": "https://www.dpuse.app",
+    "bugs": {
+        "url": "https://github.com/dpuse/dpuse-tool-d3-visualiser/issues"
+    },
+    "repository": {
+        "type": "git",
+        "url": "git+https://github.com/dpuse/dpuse-tool-d3-visualiser.git"
+    },
+    "module": "./dist/dpuse-tool-d3-visualiser.es.js",
+    "types": "./dist/types/src/index.d.ts",
+    "exports": {
+        ".": {
+            "import": "./dist/dpuse-tool-d3-visualiser.es.js",
+            "types": "./dist/types/src/index.d.ts"
+        }
+    },
+    "files": [
+        "dist"
+    ],
+    "engines": {
+        "node": ">=23.11",
+        "npm": ">=11"
+    },
+    "prettier": "@dpuse/dpuse-development/prettierrc",
+    "allowScripts": {
+        "esbuild@0.28.1": true,
+        "fsevents@2.3.3": true,
+        "sharp@0.34.5": true,
+        "unrs-resolver@1.12.2": true,
+        "workerd@1.20260730.1": true
+    },
+    "scripts": {
+        "audit": "node -e \"import('@dpuse/dpuse-development').then(m => m.auditDependencies())\"",
+        "build": "node -e \"import('@dpuse/dpuse-development').then(m => m.buildProject({ moduleLevel: true }))\" && npm run documentBundleSizes",
+        "check": "node -e \"import('@dpuse/dpuse-development').then(m => m.checkConfigFiles())\" && node -e \"import('@dpuse/dpuse-development').then(m => m.checkDependencies())\"",
+        "document": "npm run documentOpening && npm run documentUsage && npm run documentDependencies && npm run documentGovernance",
+        "documentBundleSizes": "node -e \"import('@dpuse/dpuse-development').then(m => m.documentBundleSizes({ moduleLevel: true }))\"",
+        "documentDependencies": "node -e \"import('@dpuse/dpuse-development').then(m => m.documentDependencies('BSD-3-Clause;ISC;MIT;Unlicense'))\"",
+        "documentGovernance": "node -e \"import('@dpuse/dpuse-development').then(m => m.documentGovernance())\"",
+        "documentOpening": "node -e \"import('@dpuse/dpuse-development').then(m => m.documentOpening())\"",
+        "documentUsage": "node -e \"import('@dpuse/dpuse-development').then(m => m.documentUsage())\"",
+        "format": "node -e \"import('@dpuse/dpuse-development').then(m => m.formatCode())\"",
+        "lint": "node -e \"import('@dpuse/dpuse-development').then(m => m.lintCode())\"",
+        "release": "op run --env-file=.env -- node -e \"import('@dpuse/dpuse-development').then(m => m.releaseProject())\"",
+        "sync": "node -e \"import('@dpuse/dpuse-development').then(m => m.syncProjectWithGitHub())\"",
+        "test": "node -e \"import('@dpuse/dpuse-development').then(m => m.testProject())\""
+    },
+    "dependencies": {
+        "@dagrejs/dagre": "^3.0.0",
+        "@dpuse/dpuse-shared": "^0.3.760",
+        "@observablehq/plot": "^0.6.17",
+        "billboard.js": "^4.0.3",
+        "d3-drag": "^3.0.0",
+        "d3-force": "^3.0.0",
+        "d3-hierarchy": "^3.1.2",
+        "d3-sankey": "^0.12.3",
+        "d3-selection": "^3.0.0",
+        "d3-shape": "^3.2.0",
+        "d3-zoom": "^3.0.0"
+    },
+    "devDependencies": {
+        "@dpuse/dpuse-development": "^0.3.703",
+        "@dpuse/eslint-config-dpuse": "^1.0.113",
+        "@types/d3-drag": "^3.0.7",
+        "@types/d3-force": "^3.0.10",
+        "@types/d3-hierarchy": "^3.1.7",
+        "@types/d3-sankey": "^0.12.5",
+        "@types/d3-selection": "^3.0.11",
+        "@types/d3-shape": "^3.1.8",
+        "@types/d3-zoom": "^3.0.8",
+        "@types/node": "^26.1.2",
+        "eslint": "^10.8.0",
+        "happy-dom": "^20.11.1",
+        "prettier": "^3.9.6",
+        "sonda": "^0.14.0",
+        "typescript": "^6.0.3",
+        "vite": "^8.2.0",
+        "vite-plugin-dts": "^5.0.3",
+        "vitest": "^4.1.10",
+        "wrangler": "^4.118.0"
+    },
+    "overrides": {
+        "d3-array": "^3.2.4",
+        "d3-path": "^3.1.0",
+        "d3-shape": "^3.2.0",
+        "internmap": "^2.0.3"
+    }
+}