json-canvas-viewer 3.4.3 → 4.1.0

package/dist/index.d.ts

@@ -0,0 +1,619 @@
+import { Container } from '@needle-di/core';
+import { Click, Drag, Lubricator, MultitouchPanZoom, Options as PointeractOptions, PointeractInterface, PreventDefault, WheelPanZoom } from 'pointeract';
+
+type Coordinates = {
+	x: number;
+	y: number;
+};
+type NodeBounds = {
+	minX: number;
+	minY: number;
+	maxX: number;
+	maxY: number;
+	width: number;
+	height: number;
+	centerX: number;
+	centerY: number;
+};
+type Box = {
+	top: number;
+	right: number;
+	bottom: number;
+	left: number;
+};
+type General = any;
+type GeneralArray = ReadonlyArray<General>;
+type GeneralObject = object;
+type GeneralConstructor = new (...args: General[]) => General;
+type UnionToIntersection<U> = (U extends General ? (k: U) => void : never) extends (k: infer I) => void ? I : never;
+type GeneralModuleInput = ReadonlyArray<GeneralConstructor> | ReadonlyArray<GeneralObject>;
+type ModuleInput<T extends GeneralConstructor> = ReadonlyArray<T> | ReadonlyArray<InstanceType<T>>;
+type Instances<T extends GeneralModuleInput> = T extends ReadonlyArray<GeneralConstructor> ? InstanceType<T[number]> : T[number];
+type Orchestratable<T extends GeneralModuleInput, K extends keyof Instances<T>> = UnionToIntersection<Instances<T>[K]>;
+export type Parser = (markdown: string) => string | Promise<string>;
+export interface JSONCanvasGroupNode extends JSONCanvasGenericNode {
+	type: "group";
+	label?: string;
+	background?: string;
+	backgroundStyle?: "cover" | "ratio" | "repeat";
+}
+export interface JSONCanvasFileNode extends JSONCanvasGenericNode {
+	type: "file";
+	file: string;
+	subpath?: string;
+}
+export interface JSONCanvasTextNode extends JSONCanvasGenericNode {
+	type: "text";
+	text: string;
+}
+export interface JSONCanvasLinkNode extends JSONCanvasGenericNode {
+	type: "link";
+	url: string;
+}
+export type JSONCanvasNode = JSONCanvasGroupNode | JSONCanvasFileNode | JSONCanvasTextNode | JSONCanvasLinkNode;
+export interface JSONCanvasEdge {
+	id: string;
+	fromNode: string;
+	toNode: string;
+	fromSide: "right" | "left" | "top" | "bottom";
+	toSide: "right" | "left" | "top" | "bottom";
+	toEnd?: "arrow" | "none";
+	label?: string;
+	styleAttributes?: Record<string, string>;
+	color?: string;
+}
+export interface JSONCanvas {
+	nodes?: Array<JSONCanvasNode>;
+	edges?: Array<JSONCanvasEdge>;
+}
+export interface JSONCanvasGenericNode {
+	id: string;
+	type: "group" | "file" | "text" | "link";
+	x: number;
+	y: number;
+	width: number;
+	height: number;
+	styleAttributes?: Record<string, string>;
+	color?: string;
+}
+declare const _default: {
+	round: typeof round;
+	resizeCanvasForDPR: typeof resizeCanvasForDPR;
+	applyStyles: typeof applyStyles;
+	drawRoundRect: typeof drawRoundRect;
+	getAnchorCoord: typeof getAnchorCoord;
+	makeHook: typeof makeHook;
+};
+declare function applyStyles(container: HTMLElement | ShadowRoot, styleString: string): void;
+declare function drawRoundRect(ctx: CanvasRenderingContext2D, x: number, y: number, width: number, height: number, radius: number): void;
+declare function getAnchorCoord(node: JSONCanvasNode, side: "top" | "bottom" | "left" | "right"): {
+	x: number;
+	y: number;
+};
+declare function resizeCanvasForDPR(canvas: HTMLCanvasElement, width: number, height: number): void;
+declare function round(roundedNum: number, digits: number): number;
+type MatchingFunc<Args extends GeneralArray> = (...args: Args) => void | Promise<void>;
+export type Hook<Args extends GeneralArray = [
+], Async extends boolean = false> = {
+	(...args: Args): Async extends true ? Promise<void> : void;
+	subs: Set<MatchingFunc<Args>>;
+	subscribe(callback: MatchingFunc<Args>): void;
+	unsubscribe(callback: MatchingFunc<Args>): void;
+};
+declare function makeHook<Args extends GeneralArray = [
+], Async extends boolean = false>(reverse?: boolean, async?: Async): Hook<Args, Async>;
+type Hook$1 = ReturnType<typeof _default.makeHook>;
+export type GeneralModuleCtor = typeof BaseModule<General, General>;
+export type GeneralModule = BaseModule<General, General>;
+type ModuleInputCtor = Array<GeneralModuleCtor>;
+type ModuleInput$1 = ModuleInput<GeneralModuleCtor>;
+type Options<M extends ModuleInput$1> = Orchestratable<M, "options">;
+type Augmentation<M extends ModuleInput$1> = Orchestratable<M, "_Augmentation">;
+export type BaseArgs = ConstructorParameters<GeneralModuleCtor>;
+export declare class BaseModule<O extends BaseOptions = BaseOptions, A extends GeneralObject = {}> {
+	protected container: Container;
+	protected augment: (aug: A) => void;
+	private static readonly _BaseModuleBrand;
+	_Augmentation: A;
+	onStart: Hook$1["subscribe"];
+	onRestart: Hook$1["subscribe"];
+	onDispose: Hook$1["subscribe"];
+	constructor(container: Container, options: GeneralObject, onStart: Hook$1, onDispose: Hook$1, onRestart: Hook$1, augment: (aug: A) => void);
+	options: O;
+}
+interface Augmentation$1 {
+	refresh: Controller["refresh"];
+	onRefresh: Controller["onRefresh"];
+	onResize: Controller["onResize"];
+}
+declare class Controller extends BaseModule<BaseOptions, Augmentation$1> {
+	private animationId;
+	private resizeAnimationId;
+	private DM;
+	private SM;
+	private resizeObserver;
+	private perFrame;
+	private lastResizeCenter;
+	onResize: Hook<[
+		number,
+		number
+	], false>;
+	onRefresh: Hook<[
+	], false>;
+	constructor(...args: BaseArgs);
+	private start;
+	private draw;
+	refresh: () => void;
+	private onResizeCallback;
+	private dispose;
+}
+interface Options$1 extends BaseOptions {
+	shadowed?: boolean;
+	canvas?: JSONCanvas;
+	attachmentDir?: string;
+	extraCSS?: string;
+	attachments?: Record<string, string>;
+	noAttachmentRelocation?: boolean;
+}
+interface Augmentation$2 {
+	resetView: DataManager["resetView"];
+	toggleFullscreen: DataManager["toggleFullscreen"];
+	onToggleFullscreen: DataManager["onToggleFullscreen"];
+}
+interface NodeItem {
+	ref: JSONCanvasNode;
+	box: Box;
+	fileName?: string;
+	onBeforeUnmount?: Hook;
+	onActive?: Hook;
+	onLoseActive?: Hook;
+}
+interface EdgeItem {
+	ref: JSONCanvasEdge;
+	box: Box;
+	controlPoints?: Array<number>;
+}
+type NodeMap = Record<string, NodeItem>;
+type EdgeMap = Record<string, EdgeItem>;
+declare class DataManager extends BaseModule<Options$1, Augmentation$2> {
+	onToggleFullscreen: Hook<[
+		"enter" | "exit"
+	], false>;
+	data: {
+		canvasData: Required<JSONCanvas>;
+		nodeMap: NodeMap;
+		edgeMap: EdgeMap;
+		canvasBaseDir: string;
+		nodeBounds: NodeBounds;
+		offsetX: number;
+		offsetY: number;
+		scale: number;
+		container: HTMLDivElement;
+	};
+	constructor(...args: BaseArgs);
+	private start;
+	private processBaseDir;
+	private getNodeBox;
+	private getEdgeBox;
+	private calculateNodeBounds;
+	toggleFullscreen: (option?: "enter" | "exit") => Promise<void>;
+	resetView: () => void;
+	middleViewer: () => {
+		x: number;
+		y: number;
+		width: number;
+		height: number;
+	};
+	private dispose;
+}
+type LoadedModules = [
+	Click,
+	Drag,
+	WheelPanZoom,
+	PreventDefault,
+	MultitouchPanZoom,
+	Lubricator
+];
+interface Options$2 extends BaseOptions {
+	pointeract?: PointeractOptions<LoadedModules>;
+}
+interface Augmentation$3 {
+	pan: InteractionHandler["pan"];
+	panToCoords: InteractionHandler["panToCoords"];
+	zoom: InteractionHandler["zoom"];
+	zoomToScale: InteractionHandler["zoomToScale"];
+}
+declare class InteractionHandler extends BaseModule<Options$2, Augmentation$3> {
+	pointeract: PointeractInterface<LoadedModules>;
+	private DM;
+	onClick: Hook<[
+		string | null
+	], false>;
+	constructor(...args: BaseArgs);
+	private start;
+	private startInteract;
+	private stopInteract;
+	private onPan;
+	private onZoom;
+	trueZoom: (_factor: number, origin: Coordinates) => void;
+	truePan: ({ x, y }: Coordinates) => void;
+	zoom: (_factor: number, origin: Coordinates) => void;
+	pan: ({ x, y }: Coordinates) => void;
+	zoomToScale: (newScale: number, origin: Coordinates) => void;
+	panToCoords: ({ x, y }: Coordinates) => void;
+	private C2C;
+	private onTrueClick;
+	private isUIControl;
+	private findNodeId;
+	private dispose;
+}
+interface Options$3 extends BaseOptions {
+	parser?: Parser;
+	nodeComponents?: Partial<ComponentDict>;
+}
+interface Augmentation$4 {
+	onNodeActive: OverlayManager["onNodeActive"];
+	onNodeLosesActive: OverlayManager["onNodeLosesActive"];
+}
+type NodeComponentHook<N extends JSONCanvasNode> = (container: HTMLDivElement, content: string, node: N, onBeforeUnmount: Hook, onActive: Hook, onLoseActive: Hook) => void | Promise<void>;
+type ComponentNodeMap = {
+	text: JSONCanvasTextNode;
+	markdown: JSONCanvasFileNode;
+	image: JSONCanvasFileNode;
+	audio: JSONCanvasFileNode;
+	video: JSONCanvasFileNode;
+	link: JSONCanvasLinkNode;
+};
+type ComponentDict = {
+	[K in keyof ComponentNodeMap]: NodeComponentHook<ComponentNodeMap[K]>;
+};
+declare class OverlayManager extends BaseModule<Options$3, Augmentation$4> {
+	private _overlaysLayer;
+	private overlays;
+	private selectedId;
+	private aborted;
+	private eventListeners;
+	private DM;
+	private SM;
+	private parse;
+	private componentDict;
+	private get overlaysLayer();
+	onInteractionStart: Hook<[
+	], false>;
+	onInteractionEnd: Hook<[
+	], false>;
+	onNodeActive: Hook<[
+		JSONCanvasNode
+	], false>;
+	onNodeLosesActive: Hook<[
+		JSONCanvasNode
+	], false>;
+	constructor(...args: BaseArgs);
+	private start;
+	private restart;
+	private renderOverlays;
+	private themeChanged;
+	private select;
+	private updateOverlays;
+	private createOverlay;
+	private constructOverlay;
+	private setOverlayColor;
+	private clearOverlays;
+	private dispose;
+}
+interface Options$4 extends BaseOptions {
+	zoomInOptimization?: boolean;
+}
+declare class Renderer extends BaseModule<Options$4> {
+	private _canvas;
+	private ctx;
+	private DM;
+	private SM;
+	private zoomInOptimize;
+	private get canvas();
+	constructor(...args: BaseArgs);
+	private optimizeDPR;
+	private redraw;
+	private trueRedraw;
+	private fakeRedraw;
+	private isInside;
+	private isOutside;
+	private getCurrentViewport;
+	private drawLabelBar;
+	private drawNodeBackground;
+	private drawGroup;
+	private drawFile;
+	private drawEdge;
+	private getControlPoints;
+	private drawGridDots;
+	private drawCurvedPath;
+	private drawArrowhead;
+	private dispose;
+}
+type Color = {
+	border: string;
+	background: string;
+	active: string;
+	text: string;
+	card: string;
+};
+type ColorOptions = {
+	[K in keyof (StyleManager["definedColors"]["light"] & StyleManager["namedColors"]["light"])]?: string;
+};
+interface Options$5 extends BaseOptions {
+	theme?: "dark" | "light";
+	colors?: {
+		light?: ColorOptions;
+		dark?: ColorOptions;
+	};
+}
+interface Augmentation$5 {
+	changeTheme: StyleManager["changeTheme"];
+	onChangeTheme: StyleManager["onChangeTheme"];
+}
+declare class StyleManager extends BaseModule<Options$5, Augmentation$5> {
+	theme: "dark" | "light";
+	onChangeTheme: Hook<[
+		"light" | "dark"
+	], false>;
+	definedColors: {
+		light: {
+			"0": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"1": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"2": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"3": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"4": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"5": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"6": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+		};
+		dark: {
+			"0": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"1": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"2": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"3": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"4": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"5": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+			"6": {
+				hue: number;
+				saturation: number;
+				lightness: number;
+			};
+		};
+	};
+	namedColors: {
+		light: {
+			dots: string;
+			text: string;
+			background: string;
+			"background-secondary": string;
+			shadow: string;
+			border: string;
+		};
+		dark: {
+			dots: string;
+			text: string;
+			background: string;
+			"background-secondary": string;
+			shadow: string;
+			border: string;
+		};
+	};
+	private colorCache;
+	constructor(...args: BaseArgs);
+	private hslProcessor;
+	private parseColor;
+	getColor: (colorIndex?: string) => Color;
+	getNamedColor: (name: keyof typeof StyleManager.namedColors.light) => string;
+	changeTheme: (theme?: "dark" | "light") => void;
+}
+export interface BaseOptions {
+	container: HTMLElement;
+	loading?: "normal" | "lazy" | "none";
+}
+declare const internalModules: (typeof DataManager | typeof StyleManager | typeof Controller | typeof OverlayManager | typeof InteractionHandler | typeof Renderer)[];
+type InternalModules = typeof internalModules;
+type AllOptions<M extends ModuleInput$1 = [
+]> = Options<M> & Options<InternalModules>;
+type AllAugmentation<M extends ModuleInput$1 = [
+]> = Augmentation<M> & Augmentation<InternalModules>;
+declare class JSONCanvasViewer<M extends ModuleInputCtor> {
+	private allModules;
+	private IO;
+	private started;
+	private disposed;
+	options: AllOptions<M>;
+	container: Container;
+	onDispose: Hook<[
+	], false>;
+	onStart: Hook<[
+	], false>;
+	onRestart: Hook<[
+	], false>;
+	constructor(options: AllOptions<M>, modules?: M);
+	private onVisibilityCheck;
+	private augment;
+	load: (options?: {
+		canvas?: JSONCanvas;
+		attachmentDir?: string;
+		attachments?: Record<string, string>;
+	}) => void;
+	dispose: () => void;
+}
+type JSONCanvasViewerType = new <M extends ModuleInputCtor = [
+]>(...args: ConstructorParameters<typeof JSONCanvasViewer<M>>) => JSONCanvasViewer<M> & AllAugmentation<M>;
+export type JSONCanvasViewerInterface<M extends ModuleInput$1 = [
+]> = JSONCanvasViewer<never> & AllAugmentation<M>;
+declare const _default$1: JSONCanvasViewerType;
+declare function _default$2(options: {
+	canvas: JSONCanvas;
+	attachments?: Record<string, string>;
+	attachmentDir?: string;
+	parser?: Parser;
+}): Promise<string>;
+interface Options$6 extends BaseOptions {
+	controlsCollapsed?: boolean;
+}
+interface Augmentation$6 {
+	toggleControlsCollapse: Controls["toggleCollapse"];
+}
+export declare class Controls extends BaseModule<Options$6, Augmentation$6> {
+	private _controlsPanel;
+	private _toggleCollapseBtn;
+	private _toggleFullscreenBtn;
+	private _zoomOutBtn;
+	private _zoomSlider;
+	private _zoomInBtn;
+	private _resetViewBtn;
+	private DM;
+	private IH;
+	private collapsed;
+	private get controlsPanel();
+	private get toggleCollapseBtn();
+	private get toggleFullscreenBtn();
+	private get zoomOutBtn();
+	private get zoomSlider();
+	private get zoomInBtn();
+	private get resetViewBtn();
+	constructor(...args: BaseArgs);
+	toggleCollapse: () => void;
+	private zoomIn;
+	private zoomOut;
+	private slide;
+	private updateFullscreenBtn;
+	private toggleFullscreen;
+	private updateSlider;
+	private scaleToSlider;
+	private dispose;
+}
+export declare class DebugPanel extends BaseModule {
+	private _debugPanel;
+	private DM;
+	private get debugPanel();
+	constructor(...args: BaseArgs);
+	private update;
+	private dispose;
+}
+interface Options$7 extends BaseOptions {
+	minimapCollapsed?: boolean;
+}
+interface Augmentation$7 {
+	toggleMinimapCollapse: Minimap["toggleCollapse"];
+}
+export declare class Minimap extends BaseModule<Options$7, Augmentation$7> {
+	private _minimapCtx;
+	private _viewportRectangle;
+	private _minimap;
+	private _minimapContainer;
+	private _toggleMinimapBtn;
+	private minimapCache;
+	private DM;
+	private SM;
+	private collapsed;
+	private get minimap();
+	private get minimapCtx();
+	private get viewportRectangle();
+	private get minimapContainer();
+	private get toggleMinimapBtn();
+	constructor(...args: BaseArgs);
+	toggleCollapse: () => void;
+	private start;
+	private drawMinimapNode;
+	private drawMinimapEdge;
+	private updateViewportRectangle;
+	private dispose;
+}
+interface Options$8 extends BaseOptions {
+	preventMistouchAtStart?: boolean;
+	mistouchPreventerBannerText?: string;
+}
+interface Augmentation$8 {
+	startMistouchPrevention: MistouchPreventer["startPrevention"];
+	endMistouchPrevention: MistouchPreventer["endPrevention"];
+}
+export declare class MistouchPreventer extends BaseModule<Options$8, Augmentation$8> {
+	private _preventionContainer;
+	private preventMt;
+	private DM;
+	private preventMistouch;
+	private get preventionContainer();
+	constructor(...args: BaseArgs);
+	private onPointerDown;
+	private onPointerMove;
+	private onPointerUp;
+	startPrevention: () => void;
+	endPrevention: () => void;
+	private dispose;
+}
+declare function _default$3(path: `${string}.canvas` | `${string}.json`): Promise<JSONCanvas>;
+declare function _default$4(markdown: string): Promise<string>;
+export declare const internal: {
+	Controller: typeof Controller;
+	DataManager: typeof DataManager;
+	InteractionHandler: typeof InteractionHandler;
+	OverlayManager: typeof OverlayManager;
+	Renderer: typeof Renderer;
+	StyleManager: typeof StyleManager;
+};
+
+export {
+	AllOptions as Options,
+	_default as canvasUtils,
+	_default$1 as JSONCanvasViewer,
+	_default$2 as renderToString,
+	_default$3 as fetchCanvas,
+	_default$4 as parser,
+};
+
+export {};

package/dist/index.js

@@ -1,2 +1,2 @@
-import{J as e}from"./index-BPBGNZi4.js";export{e as JSONCanvasViewer};
+import{default as e}from"./kernel/index.js";import{default as r}from"./utilities/renderToString.js";import{BaseModule as a}from"./kernel/BaseModule.js";import{default as t}from"./modules/Controls/index.js";import{default as s}from"./modules/DebugPanel/index.js";import{default as o}from"./modules/Minimap/index.js";import{default as n}from"./modules/MistouchPreventer/index.js";import{default as i}from"./kernel/utilities.js";import{default as l}from"./utilities/fetchCanvas.js";import{default as m}from"./utilities/parser.js";import f from"./kernel/Controller.js";import d from"./kernel/DataManager.js";import u from"./kernel/InteractionHandler.js";import p from"./kernel/OverlayManager.js";import j from"./kernel/Renderer.js";import M from"./kernel/StyleManager.js";const g={Controller:f,DataManager:d,InteractionHandler:u,OverlayManager:p,Renderer:j,StyleManager:M};export{a as BaseModule,t as Controls,s as DebugPanel,e as JSONCanvasViewer,o as Minimap,n as MistouchPreventer,i as canvasUtils,l as fetchCanvas,g as internal,m as parser,r as renderToString};
 //# sourceMappingURL=index.js.map

package/dist/index.js.map

@@ -1 +1 @@
-{"version":3,"file":"index.js","sources":[],"sourcesContent":[],"names":[],"mappings":""}
+{"version":3,"file":"index.js","sources":["../src/index.ts"],"sourcesContent":["export {\n\tdefault as JSONCanvasViewer,\n\ttype JSONCanvasViewerInterface,\n\ttype AllOptions as Options,\n} from '$';\nexport { default as renderToString } from '@/utilities/renderToString.ts';\nexport {\n\ttype GeneralModule,\n\ttype GeneralModuleCtor,\n\ttype BaseArgs,\n\tBaseModule,\n} from '$/BaseModule';\nexport type { BaseOptions } from '$';\nexport { default as Controls } from '@/modules/Controls';\nexport { default as DebugPanel } from '@/modules/DebugPanel';\nexport { default as Minimap } from '@/modules/Minimap';\nexport { default as MistouchPreventer } from '@/modules/MistouchPreventer';\nexport { default as canvasUtils, type Hook } from '$/utilities';\nexport { default as fetchCanvas } from '@/utilities/fetchCanvas';\nexport { default as parser } from '@/utilities/parser';\nexport type * from '@repo/shared';\n\nimport Controller from '$/Controller';\nimport DataManager from '$/DataManager';\nimport InteractionHandler from '$/InteractionHandler';\nimport OverlayManager from '$/OverlayManager';\nimport Renderer from '$/Renderer';\nimport StyleManager from '$/StyleManager';\nexport const internal = {\n\tController,\n\tDataManager,\n\tInteractionHandler,\n\tOverlayManager,\n\tRenderer,\n\tStyleManager,\n};\n\n// must import env.d.ts, otherwise dts bundler will throw at '*.scss?inline'\nimport './env.d.ts';\n"],"names":["internal","Controller","DataManager","InteractionHandler","OverlayManager","Renderer","StyleManager"],"mappings":"gwBA4BO,MAAMA,EAAW,CACvBC,aACAC,cACAC,qBACAC,iBACAC,WACAC"}

package/dist/kernel/BaseModule.js

@@ -0,0 +1,2 @@
+class s{constructor(s,t,o,i,n,r){this.container=s,this.augment=r,this.options=t,this.onStart=o.subscribe,this.onDispose=i.subscribe,this.onRestart=n.subscribe}onStart;onRestart;onDispose;options}export{s as BaseModule};
+//# sourceMappingURL=BaseModule.js.map

package/dist/kernel/BaseModule.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"BaseModule.js","sources":["../../src/kernel/BaseModule.ts"],"sourcesContent":["import type { BaseOptions } from '$';\nimport type { General, GeneralObject, ModuleInput as MI, Orchestratable } from '$/types';\nimport type utilities from '$/utilities';\nimport type { Container } from '@needle-di/core';\n\ntype Hook = ReturnType<typeof utilities.makeHook>;\n\nexport type GeneralModuleCtor = typeof BaseModule<General, General>;\nexport type GeneralModule = BaseModule<General, General>;\n\nexport type ModuleInputCtor = Array<GeneralModuleCtor>;\nexport type ModuleInput = MI<GeneralModuleCtor>;\nexport type Options<M extends ModuleInput> = Orchestratable<M, 'options'>;\nexport type Augmentation<M extends ModuleInput> = Orchestratable<M, '_Augmentation'>;\n\nexport type BaseArgs = ConstructorParameters<GeneralModuleCtor>;\n\nexport class BaseModule<O extends BaseOptions = BaseOptions, A extends GeneralObject = {}> {\n\t// https://github.com/timocov/dts-bundle-generator/issues/360\n\tdeclare private static readonly _BaseModuleBrand: unique symbol; // Nominal marker\n\tdeclare _Augmentation: A;\n\tonStart: Hook['subscribe'];\n\tonRestart: Hook['subscribe'];\n\tonDispose: Hook['subscribe'];\n\tconstructor(\n\t\tprotected container: Container,\n\t\toptions: GeneralObject,\n\t\tonStart: Hook,\n\t\tonDispose: Hook,\n\t\tonRestart: Hook,\n\t\tprotected augment: (aug: A) => void,\n\t) {\n\t\tthis.options = options as O;\n\t\tthis.onStart = onStart.subscribe;\n\t\tthis.onDispose = onDispose.subscribe;\n\t\tthis.onRestart = onRestart.subscribe;\n\t}\n\toptions: O;\n}\n"],"names":["BaseModule","constructor","container","options","onStart","onDispose","onRestart","augment","this","subscribe"],"mappings":"AAiBO,MAAMA,EAOZ,WAAAC,CACWC,EACVC,EACAC,EACAC,EACAC,EACUC,GALAC,KAAAN,UAAAA,EAKAM,KAAAD,QAAAA,EAEVC,KAAKL,QAAUA,EACfK,KAAKJ,QAAUA,EAAQK,UACvBD,KAAKH,UAAYA,EAAUI,UAC3BD,KAAKF,UAAYA,EAAUG,SAC5B,CAfAL,QACAE,UACAD,UAcAF"}

package/dist/kernel/Controller.js

@@ -0,0 +1,2 @@
+import{BaseModule as e}from"./BaseModule.js";import s from"./DataManager.js";import t from"./StyleManager.js";import i from"./utilities.js";class a extends e{animationId=null;resizeAnimationId=null;DM;SM;resizeObserver;perFrame={lastScale:1,lastOffsets:{x:0,y:0}};lastResizeCenter={x:null,y:null};onResize=i.makeHook();onRefresh=i.makeHook();constructor(...e){super(...e),this.DM=this.container.get(s),this.SM=this.container.get(t),this.resizeObserver=new ResizeObserver(this.onResizeCallback),this.SM.onChangeTheme.subscribe(this.refresh),this.augment({refresh:this.refresh,onRefresh:this.onRefresh,onResize:this.onResize}),this.onStart(this.start),this.onRestart(this.refresh),this.onDispose(this.dispose)}start=()=>{this.resizeObserver.observe(this.DM.data.container),this.animationId=requestAnimationFrame(this.draw)};draw=()=>{this.perFrame.lastScale===this.DM.data.scale&&this.perFrame.lastOffsets.x===this.DM.data.offsetX&&this.perFrame.lastOffsets.y===this.DM.data.offsetY||this.refresh(),this.animationId=requestAnimationFrame(this.draw)};refresh=()=>{this.perFrame={lastScale:this.DM.data.scale,lastOffsets:{x:this.DM.data.offsetX,y:this.DM.data.offsetY}},this.onRefresh()};onResizeCallback=()=>{this.resizeAnimationId=requestAnimationFrame(()=>{const e=this.DM.middleViewer();this.lastResizeCenter.x&&this.lastResizeCenter.y&&(this.DM.data.offsetX=this.DM.data.offsetX+e.x-this.lastResizeCenter.x,this.DM.data.offsetY=this.DM.data.offsetY+e.y-this.lastResizeCenter.y),this.lastResizeCenter.x=e.x,this.lastResizeCenter.y=e.y,this.onResize(e.width,e.height),this.refresh()})};dispose=()=>{this.animationId&&cancelAnimationFrame(this.animationId),this.resizeAnimationId&&cancelAnimationFrame(this.resizeAnimationId),this.resizeObserver.disconnect()}}export{a as default};
+//# sourceMappingURL=Controller.js.map

package/dist/kernel/Controller.js.map

@@ -0,0 +1 @@
+{"version":3,"file":"Controller.js","sources":["../../src/kernel/Controller.ts"],"sourcesContent":["import type { BaseOptions } from '$';\nimport { type BaseArgs, BaseModule } from '$/BaseModule';\nimport DataManager from '$/DataManager';\nimport StyleManager from '$/StyleManager';\nimport utilities from '$/utilities';\n\ninterface Augmentation {\n\trefresh: Controller['refresh'];\n\tonRefresh: Controller['onRefresh'];\n\tonResize: Controller['onResize'];\n}\n\nexport default class Controller extends BaseModule<BaseOptions, Augmentation> {\n\tprivate animationId: null | number = null;\n\tprivate resizeAnimationId: null | number = null;\n\tprivate DM: DataManager;\n\tprivate SM: StyleManager;\n\tprivate resizeObserver: ResizeObserver;\n\tprivate perFrame: {\n\t\tlastScale: number;\n\t\tlastOffsets: { x: number; y: number };\n\t} = {\n\t\tlastScale: 1,\n\t\tlastOffsets: { x: 0, y: 0 },\n\t};\n\tprivate lastResizeCenter: {\n\t\tx: null | number;\n\t\ty: null | number;\n\t} = {\n\t\tx: null,\n\t\ty: null,\n\t};\n\n\tonResize = utilities.makeHook<[number, number]>();\n\tonRefresh = utilities.makeHook();\n\n\tconstructor(...args: BaseArgs) {\n\t\tsuper(...args);\n\t\tthis.DM = this.container.get(DataManager);\n\t\tthis.SM = this.container.get(StyleManager);\n\t\tthis.resizeObserver = new ResizeObserver(this.onResizeCallback);\n\t\tthis.SM.onChangeTheme.subscribe(this.refresh);\n\t\tthis.augment({\n\t\t\trefresh: this.refresh,\n\t\t\tonRefresh: this.onRefresh,\n\t\t\tonResize: this.onResize,\n\t\t});\n\t\tthis.onStart(this.start);\n\t\tthis.onRestart(this.refresh);\n\t\tthis.onDispose(this.dispose);\n\t}\n\n\tprivate start = () => {\n\t\tthis.resizeObserver.observe(this.DM.data.container);\n\t\tthis.animationId = requestAnimationFrame(this.draw);\n\t};\n\n\tprivate draw = () => {\n\t\tif (\n\t\t\tthis.perFrame.lastScale !== this.DM.data.scale ||\n\t\t\tthis.perFrame.lastOffsets.x !== this.DM.data.offsetX ||\n\t\t\tthis.perFrame.lastOffsets.y !== this.DM.data.offsetY\n\t\t)\n\t\t\tthis.refresh();\n\t\tthis.animationId = requestAnimationFrame(this.draw);\n\t};\n\n\trefresh = () => {\n\t\tthis.perFrame = {\n\t\t\tlastScale: this.DM.data.scale,\n\t\t\tlastOffsets: { x: this.DM.data.offsetX, y: this.DM.data.offsetY },\n\t\t};\n\t\tthis.onRefresh();\n\t};\n\n\tprivate onResizeCallback = () => {\n\t\tthis.resizeAnimationId = requestAnimationFrame(() => {\n\t\t\tconst center = this.DM.middleViewer();\n\t\t\tif (this.lastResizeCenter.x && this.lastResizeCenter.y) {\n\t\t\t\tthis.DM.data.offsetX = this.DM.data.offsetX + center.x - this.lastResizeCenter.x;\n\t\t\t\tthis.DM.data.offsetY = this.DM.data.offsetY + center.y - this.lastResizeCenter.y;\n\t\t\t}\n\t\t\tthis.lastResizeCenter.x = center.x;\n\t\t\tthis.lastResizeCenter.y = center.y;\n\t\t\tthis.onResize(center.width, center.height);\n\t\t\tthis.refresh();\n\t\t});\n\t};\n\n\tprivate dispose = () => {\n\t\tif (this.animationId) cancelAnimationFrame(this.animationId);\n\t\tif (this.resizeAnimationId) cancelAnimationFrame(this.resizeAnimationId);\n\t\tthis.resizeObserver.disconnect();\n\t};\n}\n"],"names":["Controller","BaseModule","animationId","resizeAnimationId","DM","SM","resizeObserver","perFrame","lastScale","lastOffsets","x","y","lastResizeCenter","onResize","utilities","makeHook","onRefresh","constructor","args","super","this","container","get","DataManager","StyleManager","ResizeObserver","onResizeCallback","onChangeTheme","subscribe","refresh","augment","onStart","start","onRestart","onDispose","dispose","observe","data","requestAnimationFrame","draw","scale","offsetX","offsetY","center","middleViewer","width","height","cancelAnimationFrame","disconnect"],"mappings":"4IAYA,MAAqBA,UAAmBC,EAC/BC,YAA6B,KAC7BC,kBAAmC,KACnCC,GACAC,GACAC,eACAC,SAGJ,CACHC,UAAW,EACXC,YAAa,CAAEC,EAAG,EAAGC,EAAG,IAEjBC,iBAGJ,CACHF,EAAG,KACHC,EAAG,MAGJE,SAAWC,EAAUC,WACrBC,UAAYF,EAAUC,WAEtB,WAAAE,IAAeC,GACdC,SAASD,GACTE,KAAKhB,GAAKgB,KAAKC,UAAUC,IAAIC,GAC7BH,KAAKf,GAAKe,KAAKC,UAAUC,IAAIE,GAC7BJ,KAAKd,eAAiB,IAAImB,eAAeL,KAAKM,kBAC9CN,KAAKf,GAAGsB,cAAcC,UAAUR,KAAKS,SACrCT,KAAKU,QAAQ,CACZD,QAAST,KAAKS,QACdb,UAAWI,KAAKJ,UAChBH,SAAUO,KAAKP,WAEhBO,KAAKW,QAAQX,KAAKY,OAClBZ,KAAKa,UAAUb,KAAKS,SACpBT,KAAKc,UAAUd,KAAKe,QACrB,CAEQH,MAAQ,KACfZ,KAAKd,eAAe8B,QAAQhB,KAAKhB,GAAGiC,KAAKhB,WACzCD,KAAKlB,YAAcoC,sBAAsBlB,KAAKmB,OAGvCA,KAAO,KAEbnB,KAAKb,SAASC,YAAcY,KAAKhB,GAAGiC,KAAKG,OACzCpB,KAAKb,SAASE,YAAYC,IAAMU,KAAKhB,GAAGiC,KAAKI,SAC7CrB,KAAKb,SAASE,YAAYE,IAAMS,KAAKhB,GAAGiC,KAAKK,SAE7CtB,KAAKS,UACNT,KAAKlB,YAAcoC,sBAAsBlB,KAAKmB,OAG/CV,QAAU,KACTT,KAAKb,SAAW,CACfC,UAAWY,KAAKhB,GAAGiC,KAAKG,MACxB/B,YAAa,CAAEC,EAAGU,KAAKhB,GAAGiC,KAAKI,QAAS9B,EAAGS,KAAKhB,GAAGiC,KAAKK,UAEzDtB,KAAKJ,aAGEU,iBAAmB,KAC1BN,KAAKjB,kBAAoBmC,sBAAsB,KAC9C,MAAMK,EAASvB,KAAKhB,GAAGwC,eACnBxB,KAAKR,iBAAiBF,GAAKU,KAAKR,iBAAiBD,IACpDS,KAAKhB,GAAGiC,KAAKI,QAAUrB,KAAKhB,GAAGiC,KAAKI,QAAUE,EAAOjC,EAAIU,KAAKR,iBAAiBF,EAC/EU,KAAKhB,GAAGiC,KAAKK,QAAUtB,KAAKhB,GAAGiC,KAAKK,QAAUC,EAAOhC,EAAIS,KAAKR,iBAAiBD,GAEhFS,KAAKR,iBAAiBF,EAAIiC,EAAOjC,EACjCU,KAAKR,iBAAiBD,EAAIgC,EAAOhC,EACjCS,KAAKP,SAAS8B,EAAOE,MAAOF,EAAOG,QACnC1B,KAAKS,aAICM,QAAU,KACbf,KAAKlB,aAAa6C,qBAAqB3B,KAAKlB,aAC5CkB,KAAKjB,mBAAmB4C,qBAAqB3B,KAAKjB,mBACtDiB,KAAKd,eAAe0C"}

package/dist/kernel/DataManager.js

@@ -0,0 +1,2 @@
+import{BaseModule as t}from"./BaseModule.js";import e from"./styles.scss.js";import s from"./utilities.js";class a extends t{onToggleFullscreen=s.makeHook();data={canvasData:{nodes:[],edges:[]},nodeMap:{},edgeMap:{},canvasBaseDir:"./",nodeBounds:{maxX:0,maxY:0,minX:0,minY:0,width:0,height:0,centerX:0,centerY:0},offsetX:0,offsetY:0,scale:1,container:document.createElement("div")};constructor(...t){super(...t);const a=this.options.container;for(;a.firstElementChild;)a.firstElementChild.remove();a.innerHTML="";const i=this.options.shadowed?a.attachShadow({mode:"open"}):a;s.applyStyles(i,e+this.options.extraCSS),this.data.container.classList.add("JSON-Canvas-Viewer"),i.appendChild(this.data.container),this.augment({resetView:this.resetView,toggleFullscreen:this.toggleFullscreen,onToggleFullscreen:this.onToggleFullscreen}),this.onStart(this.start),this.onRestart(this.start),this.onDispose(this.dispose)}start=()=>{const t=Object.assign({nodes:[],edges:[]},this.options.canvas);Object.assign(this.data,{canvasData:t,nodeMap:{},edgeMap:{},canvasBaseDir:this.processBaseDir(this.options.attachmentDir),nodeBounds:this.calculateNodeBounds(t),offsetX:0,offsetY:0,scale:1}),this.data.canvasData.nodes.forEach(t=>{const e={ref:t,box:this.getNodeBox(t)};if(this.data.nodeMap[t.id]=e,"file"===t.type){const s=t.file.split("/").pop()??"";if(e.fileName=s,!t.file.startsWith("http://")&&!t.file.startsWith("https://")){const e=this.options.attachments?.[s];e?t.file=e:this.options.noAttachmentRelocation||(t.file=this.data.canvasBaseDir+s)}}}),this.data.canvasData.edges.forEach(t=>{this.data.edgeMap[t.id]={ref:t,box:this.getEdgeBox(t)}}),this.resetView()};processBaseDir=t=>{if(!t)return"./";const e=t?.slice(-1);return"/"===e?t:`${t}/`};getNodeBox=t=>({left:t.x,top:"file"===t.type||"group"===t.type?t.y-40:t.y,right:t.width+t.x,bottom:t.y+t.height});getEdgeBox=t=>{const e=this.data.nodeMap,a=e[t.fromNode].ref,i=e[t.toNode].ref,o=s.getAnchorCoord(a,t.fromSide),n=s.getAnchorCoord(i,t.toSide),h=Math.min(o.x,n.x),r=Math.min(o.y,n.y),c=Math.max(o.x,n.x),d=Math.max(o.y,n.y),l=c-h,f=d-r,m=Math.min(l,f),g=0===m?1:m,p=Math.max(l,f),u=10*Math.log2(p/g);return{left:h-u,top:r-u,right:c+u,bottom:d+u}};calculateNodeBounds(t){let e=1/0,s=1/0,a=-1/0,i=-1/0;t.nodes.forEach(t=>{e=Math.min(e,t.x),s=Math.min(s,t.y),a=Math.max(a,t.x+t.width),i=Math.max(i,t.y+t.height)});const o=a-e,n=i-s;return{minX:e,minY:s,maxX:a,maxY:i,width:o,height:n,centerX:e+o/2,centerY:s+n/2}}toggleFullscreen=async t=>{document.fullscreenElement||t&&"enter"!==t?!document.fullscreenElement||t&&"exit"!==t||(await document.exitFullscreen(),this.onToggleFullscreen("exit")):(await this.data.container.requestFullscreen(),this.onToggleFullscreen("enter"))};resetView=()=>{const t=this.data.nodeBounds,e=this.data.container;if(!t||!e)return;const s=t.width+200,a=t.height+200,i=e.clientWidth,o=e.clientHeight,n=i/s,h=o/a,r=Math.round(1e3*Math.min(n,h))/1e3,c={scale:r,offsetX:i/2-t.centerX*r,offsetY:o/2-t.centerY*r};this.data.offsetX=c.offsetX,this.data.offsetY=c.offsetY,this.data.scale=c.scale};middleViewer=()=>{const t=this.data.container;return{x:t.clientWidth/2,y:t.clientHeight/2,width:t.clientWidth,height:t.clientHeight}};dispose=()=>{this.data.container.remove()}}export{a as default};
+//# sourceMappingURL=DataManager.js.map