stickyflow 0.0.0-stage → 0.2.0

package/dist/types-T7W2yTQF.d.cts

@@ -0,0 +1,116 @@
+import { u as SceneRole, v as ShaderParameter, g as RenderOptions } from './render-r1GYvjNm.cjs';
+
+type Unsubscribe = () => void;
+declare class Emitter<EventMap extends object> {
+    private handlers;
+    on<T extends keyof EventMap>(name: T, handler: (event: EventMap[T]) => void): Unsubscribe;
+    emit<T extends keyof EventMap>(name: T, event: EventMap[T]): void;
+    clear(): void;
+}
+
+interface ViewBox {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}
+interface SceneDiff {
+    added: string[];
+    removed: string[];
+    changed: string[];
+}
+
+interface OwnerRef {
+    role: SceneRole;
+    id: string;
+    kind?: string;
+    label?: string;
+}
+interface Modifiers {
+    shift: boolean;
+    ctrl: boolean;
+    meta: boolean;
+    alt: boolean;
+}
+
+interface OwnerPointerEvent {
+    diagramId: string;
+    owner: OwnerRef;
+    modifiers: Modifiers;
+}
+interface SelectionChangeEvent {
+    diagramId: string;
+    selection: OwnerRef[];
+}
+interface ViewerErrorEvent {
+    diagramId: string;
+    code: 'contract-mismatch' | 'render-failed' | 'no-svg';
+    message: string;
+}
+interface SceneDiffEvent {
+    diagramId: string;
+    added: string[];
+    removed: string[];
+    changed: string[];
+}
+interface ViewerEventMap {
+    ready: {
+        diagramId: string;
+    };
+    canvasObjectClick: OwnerPointerEvent;
+    linkClick: OwnerPointerEvent;
+    ownerHover: OwnerPointerEvent | {
+        diagramId: string;
+        owner: null;
+    };
+    selectionChange: SelectionChangeEvent;
+    sceneDiff: SceneDiffEvent;
+    error: ViewerErrorEvent;
+}
+type ViewerEventName = keyof ViewerEventMap;
+type ViewerEventHandler<T extends ViewerEventName> = (event: ViewerEventMap[T]) => void;
+
+type ViewerImageFormat = 'png' | 'jpeg';
+interface ViewerImageExportOptions {
+    format?: ViewerImageFormat;
+    scale?: number;
+    quality?: number;
+    backgroundColor?: string;
+}
+
+interface ViewerOptions {
+    container: HTMLElement;
+    source?: string;
+    svg?: string;
+    interactive?: boolean;
+    selectable?: boolean;
+    diagramId?: string;
+    renderOptions?: RenderOptions;
+}
+interface ViewerSource {
+    source?: string;
+    svg?: string;
+    renderOptions?: RenderOptions;
+    resetView?: boolean;
+    highlightChanges?: boolean | {
+        color?: string;
+    };
+}
+interface Viewer {
+    readonly svg: SVGSVGElement;
+    on<T extends ViewerEventName>(name: T, handler: ViewerEventHandler<T>): Unsubscribe;
+    getSelection(): OwnerRef[];
+    select(ids: string[]): void;
+    fit(): void;
+    getViewport(): ViewBox;
+    exportSvg(): string;
+    exportImage(options?: ViewerImageExportOptions): Promise<Blob>;
+    setShaderParameters(ownerId: string, parameters: Record<string, ShaderParameter>): boolean;
+    setWidgetValue(widgetId: string, value: string | number): boolean;
+    setPaused(paused: boolean): void;
+    clearOverrides(): void;
+    update(next: ViewerSource): void;
+    destroy(): void;
+}
+
+export { Emitter as E, type Modifiers as M, type OwnerRef as O, type SceneDiff as S, type Unsubscribe as U, type Viewer as V, type ViewerOptions as a, type OwnerPointerEvent as b, type SceneDiffEvent as c, type SelectionChangeEvent as d, type ViewBox as e, type ViewerErrorEvent as f, type ViewerEventHandler as g, type ViewerEventMap as h, type ViewerEventName as i, type ViewerImageExportOptions as j, type ViewerImageFormat as k, type ViewerSource as l };

package/dist/types-ndGA1kbl.d.ts

@@ -0,0 +1,116 @@
+import { u as SceneRole, v as ShaderParameter, g as RenderOptions } from './render-r1GYvjNm.js';
+
+type Unsubscribe = () => void;
+declare class Emitter<EventMap extends object> {
+    private handlers;
+    on<T extends keyof EventMap>(name: T, handler: (event: EventMap[T]) => void): Unsubscribe;
+    emit<T extends keyof EventMap>(name: T, event: EventMap[T]): void;
+    clear(): void;
+}
+
+interface ViewBox {
+    x: number;
+    y: number;
+    w: number;
+    h: number;
+}
+interface SceneDiff {
+    added: string[];
+    removed: string[];
+    changed: string[];
+}
+
+interface OwnerRef {
+    role: SceneRole;
+    id: string;
+    kind?: string;
+    label?: string;
+}
+interface Modifiers {
+    shift: boolean;
+    ctrl: boolean;
+    meta: boolean;
+    alt: boolean;
+}
+
+interface OwnerPointerEvent {
+    diagramId: string;
+    owner: OwnerRef;
+    modifiers: Modifiers;
+}
+interface SelectionChangeEvent {
+    diagramId: string;
+    selection: OwnerRef[];
+}
+interface ViewerErrorEvent {
+    diagramId: string;
+    code: 'contract-mismatch' | 'render-failed' | 'no-svg';
+    message: string;
+}
+interface SceneDiffEvent {
+    diagramId: string;
+    added: string[];
+    removed: string[];
+    changed: string[];
+}
+interface ViewerEventMap {
+    ready: {
+        diagramId: string;
+    };
+    canvasObjectClick: OwnerPointerEvent;
+    linkClick: OwnerPointerEvent;
+    ownerHover: OwnerPointerEvent | {
+        diagramId: string;
+        owner: null;
+    };
+    selectionChange: SelectionChangeEvent;
+    sceneDiff: SceneDiffEvent;
+    error: ViewerErrorEvent;
+}
+type ViewerEventName = keyof ViewerEventMap;
+type ViewerEventHandler<T extends ViewerEventName> = (event: ViewerEventMap[T]) => void;
+
+type ViewerImageFormat = 'png' | 'jpeg';
+interface ViewerImageExportOptions {
+    format?: ViewerImageFormat;
+    scale?: number;
+    quality?: number;
+    backgroundColor?: string;
+}
+
+interface ViewerOptions {
+    container: HTMLElement;
+    source?: string;
+    svg?: string;
+    interactive?: boolean;
+    selectable?: boolean;
+    diagramId?: string;
+    renderOptions?: RenderOptions;
+}
+interface ViewerSource {
+    source?: string;
+    svg?: string;
+    renderOptions?: RenderOptions;
+    resetView?: boolean;
+    highlightChanges?: boolean | {
+        color?: string;
+    };
+}
+interface Viewer {
+    readonly svg: SVGSVGElement;
+    on<T extends ViewerEventName>(name: T, handler: ViewerEventHandler<T>): Unsubscribe;
+    getSelection(): OwnerRef[];
+    select(ids: string[]): void;
+    fit(): void;
+    getViewport(): ViewBox;
+    exportSvg(): string;
+    exportImage(options?: ViewerImageExportOptions): Promise<Blob>;
+    setShaderParameters(ownerId: string, parameters: Record<string, ShaderParameter>): boolean;
+    setWidgetValue(widgetId: string, value: string | number): boolean;
+    setPaused(paused: boolean): void;
+    clearOverrides(): void;
+    update(next: ViewerSource): void;
+    destroy(): void;
+}
+
+export { Emitter as E, type Modifiers as M, type OwnerRef as O, type SceneDiff as S, type Unsubscribe as U, type Viewer as V, type ViewerOptions as a, type OwnerPointerEvent as b, type SceneDiffEvent as c, type SelectionChangeEvent as d, type ViewBox as e, type ViewerErrorEvent as f, type ViewerEventHandler as g, type ViewerEventMap as h, type ViewerEventName as i, type ViewerImageExportOptions as j, type ViewerImageFormat as k, type ViewerSource as l };

package/dist/viewer/index.cjs

@@ -0,0 +1,31 @@
+'use strict';
+
+var chunkIIOJFR73_cjs = require('../chunk-IIOJFR73.cjs');
+require('../chunk-S5BVAAEF.cjs');
+require('../chunk-34PK7HEU.cjs');
+require('../chunk-YM3XFBI4.cjs');
+
+
+
+Object.defineProperty(exports, "SHADER_DEFAULTS", {
+  enumerable: true,
+  get: function () { return chunkIIOJFR73_cjs.SHADER_DEFAULTS; }
+});
+Object.defineProperty(exports, "connectInteraction", {
+  enumerable: true,
+  get: function () { return chunkIIOJFR73_cjs.connectInteraction; }
+});
+Object.defineProperty(exports, "createViewer", {
+  enumerable: true,
+  get: function () { return chunkIIOJFR73_cjs.createViewer; }
+});
+Object.defineProperty(exports, "registerShaderProgram", {
+  enumerable: true,
+  get: function () { return chunkIIOJFR73_cjs.registerShaderProgram; }
+});
+Object.defineProperty(exports, "shaderProgram", {
+  enumerable: true,
+  get: function () { return chunkIIOJFR73_cjs.shaderProgram; }
+});
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/viewer/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.cjs"}

package/dist/viewer/index.d.cts

@@ -0,0 +1,44 @@
+import { V as Viewer, a as ViewerOptions } from '../types-T7W2yTQF.cjs';
+export { M as Modifiers, b as OwnerPointerEvent, O as OwnerRef, S as SceneDiff, c as SceneDiffEvent, d as SelectionChangeEvent, U as Unsubscribe, e as ViewBox, f as ViewerErrorEvent, g as ViewerEventHandler, h as ViewerEventMap, i as ViewerEventName, j as ViewerImageExportOptions, k as ViewerImageFormat, l as ViewerSource } from '../types-T7W2yTQF.cjs';
+import { b as BindingRuntime } from '../runtimeTypes-DwLeD-em.cjs';
+import '../render-r1GYvjNm.cjs';
+
+interface InteractionOptions {
+    enabled?: () => boolean;
+    paused?: () => boolean;
+}
+declare function connectInteraction(viewer: Viewer, runtime: BindingRuntime, options?: InteractionOptions): () => void;
+
+declare const SHADER_DEFAULTS: {
+    readonly numbers: {
+        readonly intensity: 0.85;
+        readonly speed: 0.18;
+        readonly progress: -1;
+        readonly boost: 0;
+        readonly dent: -1;
+        readonly day: -1;
+        readonly light: 135;
+        readonly gloss: 0.15;
+        readonly depth: 0.4;
+        readonly rim: 0.2;
+    };
+    readonly colors: {
+        readonly color: readonly [0.08, 0.02, 0.22];
+        readonly accent: readonly [0.58, 0.31, 1];
+        readonly hot: readonly [1, 0.45, 0.82];
+    };
+};
+
+interface ShaderProgram {
+    name: string;
+    fragmentSource: string;
+    usesBackdrop?: boolean;
+    replacesBaseFill?: boolean;
+}
+
+declare function registerShaderProgram(program: ShaderProgram): () => void;
+declare function shaderProgram(name: string): ShaderProgram | undefined;
+
+declare function createViewer(options: ViewerOptions): Viewer;
+
+export { type InteractionOptions, SHADER_DEFAULTS, type ShaderProgram, Viewer, ViewerOptions, connectInteraction, createViewer, registerShaderProgram, shaderProgram };

package/dist/viewer/index.d.ts

@@ -0,0 +1,44 @@
+import { V as Viewer, a as ViewerOptions } from '../types-ndGA1kbl.js';
+export { M as Modifiers, b as OwnerPointerEvent, O as OwnerRef, S as SceneDiff, c as SceneDiffEvent, d as SelectionChangeEvent, U as Unsubscribe, e as ViewBox, f as ViewerErrorEvent, g as ViewerEventHandler, h as ViewerEventMap, i as ViewerEventName, j as ViewerImageExportOptions, k as ViewerImageFormat, l as ViewerSource } from '../types-ndGA1kbl.js';
+import { b as BindingRuntime } from '../runtimeTypes-ByiafBwg.js';
+import '../render-r1GYvjNm.js';
+
+interface InteractionOptions {
+    enabled?: () => boolean;
+    paused?: () => boolean;
+}
+declare function connectInteraction(viewer: Viewer, runtime: BindingRuntime, options?: InteractionOptions): () => void;
+
+declare const SHADER_DEFAULTS: {
+    readonly numbers: {
+        readonly intensity: 0.85;
+        readonly speed: 0.18;
+        readonly progress: -1;
+        readonly boost: 0;
+        readonly dent: -1;
+        readonly day: -1;
+        readonly light: 135;
+        readonly gloss: 0.15;
+        readonly depth: 0.4;
+        readonly rim: 0.2;
+    };
+    readonly colors: {
+        readonly color: readonly [0.08, 0.02, 0.22];
+        readonly accent: readonly [0.58, 0.31, 1];
+        readonly hot: readonly [1, 0.45, 0.82];
+    };
+};
+
+interface ShaderProgram {
+    name: string;
+    fragmentSource: string;
+    usesBackdrop?: boolean;
+    replacesBaseFill?: boolean;
+}
+
+declare function registerShaderProgram(program: ShaderProgram): () => void;
+declare function shaderProgram(name: string): ShaderProgram | undefined;
+
+declare function createViewer(options: ViewerOptions): Viewer;
+
+export { type InteractionOptions, SHADER_DEFAULTS, type ShaderProgram, Viewer, ViewerOptions, connectInteraction, createViewer, registerShaderProgram, shaderProgram };

package/dist/viewer/index.js

@@ -0,0 +1,6 @@
+export { SHADER_DEFAULTS, connectInteraction, createViewer, registerShaderProgram, shaderProgram } from '../chunk-N6WVHOUQ.js';
+import '../chunk-KFJIFHXG.js';
+import '../chunk-6LQJUAD4.js';
+import '../chunk-6JKNT2YC.js';
+//# sourceMappingURL=index.js.map
+//# sourceMappingURL=index.js.map

package/dist/viewer/index.js.map

@@ -0,0 +1 @@
+{"version":3,"sources":[],"names":[],"mappings":"","file":"index.js"}

package/dist/web-component/index.cjs

@@ -0,0 +1,144 @@
+'use strict';
+
+var chunkIIOJFR73_cjs = require('../chunk-IIOJFR73.cjs');
+var chunkS5BVAAEF_cjs = require('../chunk-S5BVAAEF.cjs');
+require('../chunk-34PK7HEU.cjs');
+require('../chunk-YM3XFBI4.cjs');
+
+// src/runtime/webComponent/config.ts
+var OBSERVED_ATTRS = ["source", "interactive", "padding", "diagram-id"];
+var boolAttr = (value) => value !== null && value !== "false";
+function readConfig(getAttribute) {
+  const paddingRaw = getAttribute("padding");
+  const padding = paddingRaw != null && paddingRaw !== "" && Number.isFinite(Number(paddingRaw)) ? Number(paddingRaw) : void 0;
+  return {
+    source: getAttribute("source"),
+    interactive: boolAttr(getAttribute("interactive")),
+    padding,
+    diagramId: getAttribute("diagram-id") ?? void 0
+  };
+}
+
+// src/runtime/webComponent/shadowView.ts
+var SHADOW_STYLE = `
+  :host { display: block; position: relative; }
+  .sf-container { width: 100%; height: 100%; }
+  svg { display: block; max-width: 100%; }
+  .sf-error { color: #b91c1c; font: 13px/1.4 system-ui, sans-serif; padding: 8px; white-space: pre-wrap; }
+  [data-sf-role="entity"], [data-sf-role="link"] { cursor: pointer; }
+  [data-sf-selected] { stroke: #2563eb !important; stroke-width: 4 !important; }
+`;
+function createShadowContainer(root) {
+  const style = document.createElement("style");
+  style.textContent = SHADOW_STYLE;
+  const container = document.createElement("div");
+  container.className = "sf-container";
+  root.append(style, container);
+  return container;
+}
+function showRenderError(container, error) {
+  const box = document.createElement("div");
+  box.className = "sf-error";
+  box.textContent = `stickyflow: ${error.message ?? error}`;
+  container.replaceChildren(box);
+}
+function mountInteractiveDiagram(container, source, config) {
+  return chunkIIOJFR73_cjs.createViewer({
+    container,
+    source,
+    interactive: true,
+    diagramId: config.diagramId,
+    renderOptions: { padding: config.padding }
+  });
+}
+function mountStaticDiagram(container, source, config) {
+  container.innerHTML = chunkS5BVAAEF_cjs.render(source, { padding: config.padding }).svg;
+}
+function mountShadowDiagram(root, config) {
+  const container = createShadowContainer(root);
+  if (config.source === null) {
+    return { viewer: null, rendered: false };
+  }
+  try {
+    const viewer = config.interactive ? mountInteractiveDiagram(container, config.source, config) : null;
+    if (!config.interactive) {
+      mountStaticDiagram(container, config.source, config);
+    }
+    return { viewer, rendered: true };
+  } catch (error) {
+    showRenderError(container, error);
+    return { viewer: null, rendered: false };
+  }
+}
+
+// src/runtime/webComponent/element.ts
+var ElementBase = typeof HTMLElement === "undefined" ? class {
+} : HTMLElement;
+var StickyflowDiagram = class extends ElementBase {
+  static get observedAttributes() {
+    return [...OBSERVED_ATTRS];
+  }
+  root;
+  view = null;
+  sourceProp = null;
+  constructor() {
+    super();
+    this.root = this.attachShadow({ mode: "open" });
+  }
+  connectedCallback() {
+    this.rerender();
+  }
+  disconnectedCallback() {
+    this.teardown();
+  }
+  attributeChangedCallback() {
+    if (this.isConnected) {
+      this.rerender();
+    }
+  }
+  set source(value) {
+    this.sourceProp = value;
+    if (this.isConnected) {
+      this.rerender();
+    }
+  }
+  get source() {
+    return this.sourceProp ?? this.getAttribute("source");
+  }
+  get viewer() {
+    return this.view;
+  }
+  config() {
+    const config = readConfig((name) => this.getAttribute(name));
+    return { ...config, source: this.sourceProp ?? config.source };
+  }
+  teardown() {
+    this.view?.destroy();
+    this.view = null;
+    this.root.replaceChildren();
+  }
+  rerender() {
+    this.teardown();
+    const config = this.config();
+    const mount = mountShadowDiagram(this.root, config);
+    this.view = mount.viewer;
+    if (mount.rendered) {
+      this.dispatchEvent(new CustomEvent("sf-render", { detail: { interactive: config.interactive } }));
+    }
+  }
+};
+
+// src/runtime/webComponent/index.ts
+function defineStickyflowDiagram(tagName = "stickyflow-diagram") {
+  if (typeof customElements === "undefined") {
+    return;
+  }
+  if (!customElements.get(tagName)) {
+    customElements.define(tagName, StickyflowDiagram);
+  }
+}
+
+exports.StickyflowDiagram = StickyflowDiagram;
+exports.defineStickyflowDiagram = defineStickyflowDiagram;
+//# sourceMappingURL=index.cjs.map
+//# sourceMappingURL=index.cjs.map

package/dist/web-component/index.cjs.map

@@ -0,0 +1 @@
+{"version":3,"sources":["../../src/runtime/webComponent/config.ts","../../src/runtime/webComponent/shadowView.ts","../../src/runtime/webComponent/element.ts","../../src/runtime/webComponent/index.ts"],"names":["createViewer","render"],"mappings":";;;;;;;;AAOO,IAAM,cAAA,GAAiB,CAAC,QAAA,EAAU,aAAA,EAAe,WAAW,YAAY,CAAA;AAE/E,IAAM,QAAA,GAAW,CAAC,KAAA,KAAkC,KAAA,KAAU,QAAQ,KAAA,KAAU,OAAA;AAEzE,SAAS,WAAW,YAAA,EAA8D;AACvF,EAAA,MAAM,UAAA,GAAa,aAAa,SAAS,CAAA;AACzC,EAAA,MAAM,OAAA,GACJ,UAAA,IAAc,IAAA,IAAQ,UAAA,KAAe,EAAA,IAAM,MAAA,CAAO,QAAA,CAAS,MAAA,CAAO,UAAU,CAAC,CAAA,GAAI,MAAA,CAAO,UAAU,CAAA,GAAI,MAAA;AACxG,EAAA,OAAO;AAAA,IACL,MAAA,EAAQ,aAAa,QAAQ,CAAA;AAAA,IAC7B,WAAA,EAAa,QAAA,CAAS,YAAA,CAAa,aAAa,CAAC,CAAA;AAAA,IACjD,OAAA;AAAA,IACA,SAAA,EAAW,YAAA,CAAa,YAAY,CAAA,IAAK;AAAA,GAC3C;AACF;;;ACjBA,IAAM,YAAA,GAAe;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA;AAAA,CAAA;AAcrB,SAAS,sBAAsB,IAAA,EAAkC;AAC/D,EAAA,MAAM,KAAA,GAAQ,QAAA,CAAS,aAAA,CAAc,OAAO,CAAA;AAC5C,EAAA,KAAA,CAAM,WAAA,GAAc,YAAA;AACpB,EAAA,MAAM,SAAA,GAAY,QAAA,CAAS,aAAA,CAAc,KAAK,CAAA;AAC9C,EAAA,SAAA,CAAU,SAAA,GAAY,cAAA;AACtB,EAAA,IAAA,CAAK,MAAA,CAAO,OAAO,SAAS,CAAA;AAC5B,EAAA,OAAO,SAAA;AACT;AAEA,SAAS,eAAA,CAAgB,WAA2B,KAAA,EAAsB;AACxE,EAAA,MAAM,GAAA,GAAM,QAAA,CAAS,aAAA,CAAc,KAAK,CAAA;AACxC,EAAA,GAAA,CAAI,SAAA,GAAY,UAAA;AAChB,EAAA,GAAA,CAAI,WAAA,GAAc,CAAA,YAAA,EAAgB,KAAA,CAAgB,OAAA,IAAW,KAAK,CAAA,CAAA;AAClE,EAAA,SAAA,CAAU,gBAAgB,GAAG,CAAA;AAC/B;AAEA,SAAS,uBAAA,CAAwB,SAAA,EAA2B,MAAA,EAAgB,MAAA,EAA+B;AACzG,EAAA,OAAOA,8BAAA,CAAa;AAAA,IAClB,SAAA;AAAA,IACA,MAAA;AAAA,IACA,WAAA,EAAa,IAAA;AAAA,IACb,WAAW,MAAA,CAAO,SAAA;AAAA,IAClB,aAAA,EAAe,EAAE,OAAA,EAAS,MAAA,CAAO,OAAA;AAAQ,GAC1C,CAAA;AACH;AAEA,SAAS,kBAAA,CAAmB,SAAA,EAA2B,MAAA,EAAgB,MAAA,EAA6B;AAClG,EAAA,SAAA,CAAU,SAAA,GAAYC,yBAAO,MAAA,EAAQ,EAAE,SAAS,MAAA,CAAO,OAAA,EAAS,CAAA,CAAE,GAAA;AACpE;AAEO,SAAS,kBAAA,CAAmB,MAAkB,MAAA,EAA2C;AAC9F,EAAA,MAAM,SAAA,GAAY,sBAAsB,IAAI,CAAA;AAC5C,EAAA,IAAI,MAAA,CAAO,WAAW,IAAA,EAAM;AAC1B,IAAA,OAAO,EAAE,MAAA,EAAQ,IAAA,EAAM,QAAA,EAAU,KAAA,EAAM;AAAA,EACzC;AAEA,EAAA,IAAI;AACF,IAAA,MAAM,MAAA,GAAS,OAAO,WAAA,GAAc,uBAAA,CAAwB,WAAW,MAAA,CAAO,MAAA,EAAQ,MAAM,CAAA,GAAI,IAAA;AAChG,IAAA,IAAI,CAAC,OAAO,WAAA,EAAa;AACvB,MAAA,kBAAA,CAAmB,SAAA,EAAW,MAAA,CAAO,MAAA,EAAQ,MAAM,CAAA;AAAA,IACrD;AACA,IAAA,OAAO,EAAE,MAAA,EAAQ,QAAA,EAAU,IAAA,EAAK;AAAA,EAClC,SAAS,KAAA,EAAO;AACd,IAAA,eAAA,CAAgB,WAAW,KAAK,CAAA;AAChC,IAAA,OAAO,EAAE,MAAA,EAAQ,IAAA,EAAM,QAAA,EAAU,KAAA,EAAM;AAAA,EACzC;AACF;;;AC5DA,IAAM,WAAA,GACJ,OAAO,WAAA,KAAgB,WAAA,GAAe,MAAM;AAAC,CAAA,GAAsC,WAAA;AAE9E,IAAM,iBAAA,GAAN,cAAgC,WAAA,CAAY;AAAA,EACjD,WAAW,kBAAA,GAA+B;AACxC,IAAA,OAAO,CAAC,GAAG,cAAc,CAAA;AAAA,EAC3B;AAAA,EAEiB,IAAA;AAAA,EACT,IAAA,GAAsB,IAAA;AAAA,EACtB,UAAA,GAA4B,IAAA;AAAA,EAEpC,WAAA,GAAc;AACZ,IAAA,KAAA,EAAM;AACN,IAAA,IAAA,CAAK,OAAO,IAAA,CAAK,YAAA,CAAa,EAAE,IAAA,EAAM,QAAQ,CAAA;AAAA,EAChD;AAAA,EAEA,iBAAA,GAA0B;AACxB,IAAA,IAAA,CAAK,QAAA,EAAS;AAAA,EAChB;AAAA,EAEA,oBAAA,GAA6B;AAC3B,IAAA,IAAA,CAAK,QAAA,EAAS;AAAA,EAChB;AAAA,EAEA,wBAAA,GAAiC;AAC/B,IAAA,IAAI,KAAK,WAAA,EAAa;AACpB,MAAA,IAAA,CAAK,QAAA,EAAS;AAAA,IAChB;AAAA,EACF;AAAA,EAEA,IAAI,OAAO,KAAA,EAAsB;AAC/B,IAAA,IAAA,CAAK,UAAA,GAAa,KAAA;AAClB,IAAA,IAAI,KAAK,WAAA,EAAa;AACpB,MAAA,IAAA,CAAK,QAAA,EAAS;AAAA,IAChB;AAAA,EACF;AAAA,EAEA,IAAI,MAAA,GAAwB;AAC1B,IAAA,OAAO,IAAA,CAAK,UAAA,IAAc,IAAA,CAAK,YAAA,CAAa,QAAQ,CAAA;AAAA,EACtD;AAAA,EAEA,IAAI,MAAA,GAAwB;AAC1B,IAAA,OAAO,IAAA,CAAK,IAAA;AAAA,EACd;AAAA,EAEQ,MAAA,GAAwB;AAC9B,IAAA,MAAM,SAAS,UAAA,CAAW,CAAA,IAAA,KAAQ,IAAA,CAAK,YAAA,CAAa,IAAI,CAAC,CAAA;AACzD,IAAA,OAAO,EAAE,GAAG,MAAA,EAAQ,QAAQ,IAAA,CAAK,UAAA,IAAc,OAAO,MAAA,EAAO;AAAA,EAC/D;AAAA,EAEQ,QAAA,GAAiB;AACvB,IAAA,IAAA,CAAK,MAAM,OAAA,EAAQ;AACnB,IAAA,IAAA,CAAK,IAAA,GAAO,IAAA;AACZ,IAAA,IAAA,CAAK,KAAK,eAAA,EAAgB;AAAA,EAC5B;AAAA,EAEQ,QAAA,GAAiB;AACvB,IAAA,IAAA,CAAK,QAAA,EAAS;AACd,IAAA,MAAM,MAAA,GAAS,KAAK,MAAA,EAAO;AAC3B,IAAA,MAAM,KAAA,GAAQ,kBAAA,CAAmB,IAAA,CAAK,IAAA,EAAM,MAAM,CAAA;AAClD,IAAA,IAAA,CAAK,OAAO,KAAA,CAAM,MAAA;AAClB,IAAA,IAAI,MAAM,QAAA,EAAU;AAClB,MAAA,IAAA,CAAK,aAAA,CAAc,IAAI,WAAA,CAAY,WAAA,EAAa,EAAE,MAAA,EAAQ,EAAE,WAAA,EAAa,MAAA,CAAO,WAAA,EAAY,EAAG,CAAC,CAAA;AAAA,IAClG;AAAA,EACF;AACF;;;ACjEO,SAAS,uBAAA,CAAwB,UAAU,oBAAA,EAA4B;AAC5E,EAAA,IAAI,OAAO,mBAAmB,WAAA,EAAa;AACzC,IAAA;AAAA,EACF;AACA,EAAA,IAAI,CAAC,cAAA,CAAe,GAAA,CAAI,OAAO,CAAA,EAAG;AAChC,IAAA,cAAA,CAAe,MAAA,CAAO,SAAS,iBAAiB,CAAA;AAAA,EAClD;AACF","file":"index.cjs","sourcesContent":["export interface DiagramConfig {\n  source: string | null;\n  interactive: boolean;\n  padding?: number;\n  diagramId?: string;\n}\n\nexport const OBSERVED_ATTRS = ['source', 'interactive', 'padding', 'diagram-id'] as const;\n\nconst boolAttr = (value: string | null): boolean => value !== null && value !== 'false';\n\nexport function readConfig(getAttribute: (name: string) => string | null): DiagramConfig {\n  const paddingRaw = getAttribute('padding');\n  const padding =\n    paddingRaw != null && paddingRaw !== '' && Number.isFinite(Number(paddingRaw)) ? Number(paddingRaw) : undefined;\n  return {\n    source: getAttribute('source'),\n    interactive: boolAttr(getAttribute('interactive')),\n    padding,\n    diagramId: getAttribute('diagram-id') ?? undefined,\n  };\n}\n","import { render } from '../../render';\nimport { createViewer, type Viewer } from '../viewer';\nimport type { DiagramConfig } from './config';\n\nconst SHADOW_STYLE = `\n  :host { display: block; position: relative; }\n  .sf-container { width: 100%; height: 100%; }\n  svg { display: block; max-width: 100%; }\n  .sf-error { color: #b91c1c; font: 13px/1.4 system-ui, sans-serif; padding: 8px; white-space: pre-wrap; }\n  [data-sf-role=\"entity\"], [data-sf-role=\"link\"] { cursor: pointer; }\n  [data-sf-selected] { stroke: #2563eb !important; stroke-width: 4 !important; }\n`;\n\nexport interface ShadowDiagramMount {\n  viewer: Viewer | null;\n  rendered: boolean;\n}\n\nfunction createShadowContainer(root: ShadowRoot): HTMLDivElement {\n  const style = document.createElement('style');\n  style.textContent = SHADOW_STYLE;\n  const container = document.createElement('div');\n  container.className = 'sf-container';\n  root.append(style, container);\n  return container;\n}\n\nfunction showRenderError(container: HTMLDivElement, error: unknown): void {\n  const box = document.createElement('div');\n  box.className = 'sf-error';\n  box.textContent = `stickyflow: ${(error as Error).message ?? error}`;\n  container.replaceChildren(box);\n}\n\nfunction mountInteractiveDiagram(container: HTMLDivElement, source: string, config: DiagramConfig): Viewer {\n  return createViewer({\n    container,\n    source,\n    interactive: true,\n    diagramId: config.diagramId,\n    renderOptions: { padding: config.padding },\n  });\n}\n\nfunction mountStaticDiagram(container: HTMLDivElement, source: string, config: DiagramConfig): void {\n  container.innerHTML = render(source, { padding: config.padding }).svg;\n}\n\nexport function mountShadowDiagram(root: ShadowRoot, config: DiagramConfig): ShadowDiagramMount {\n  const container = createShadowContainer(root);\n  if (config.source === null) {\n    return { viewer: null, rendered: false };\n  }\n\n  try {\n    const viewer = config.interactive ? mountInteractiveDiagram(container, config.source, config) : null;\n    if (!config.interactive) {\n      mountStaticDiagram(container, config.source, config);\n    }\n    return { viewer, rendered: true };\n  } catch (error) {\n    showRenderError(container, error);\n    return { viewer: null, rendered: false };\n  }\n}\n","import type { Viewer } from '../viewer';\nimport { type DiagramConfig, OBSERVED_ATTRS, readConfig } from './config';\nimport { mountShadowDiagram } from './shadowView';\n\nconst ElementBase: typeof HTMLElement =\n  typeof HTMLElement === 'undefined' ? (class {} as unknown as typeof HTMLElement) : HTMLElement;\n\nexport class StickyflowDiagram extends ElementBase {\n  static get observedAttributes(): string[] {\n    return [...OBSERVED_ATTRS];\n  }\n\n  private readonly root: ShadowRoot;\n  private view: Viewer | null = null;\n  private sourceProp: string | null = null;\n\n  constructor() {\n    super();\n    this.root = this.attachShadow({ mode: 'open' });\n  }\n\n  connectedCallback(): void {\n    this.rerender();\n  }\n\n  disconnectedCallback(): void {\n    this.teardown();\n  }\n\n  attributeChangedCallback(): void {\n    if (this.isConnected) {\n      this.rerender();\n    }\n  }\n\n  set source(value: string | null) {\n    this.sourceProp = value;\n    if (this.isConnected) {\n      this.rerender();\n    }\n  }\n\n  get source(): string | null {\n    return this.sourceProp ?? this.getAttribute('source');\n  }\n\n  get viewer(): Viewer | null {\n    return this.view;\n  }\n\n  private config(): DiagramConfig {\n    const config = readConfig(name => this.getAttribute(name));\n    return { ...config, source: this.sourceProp ?? config.source };\n  }\n\n  private teardown(): void {\n    this.view?.destroy();\n    this.view = null;\n    this.root.replaceChildren();\n  }\n\n  private rerender(): void {\n    this.teardown();\n    const config = this.config();\n    const mount = mountShadowDiagram(this.root, config);\n    this.view = mount.viewer;\n    if (mount.rendered) {\n      this.dispatchEvent(new CustomEvent('sf-render', { detail: { interactive: config.interactive } }));\n    }\n  }\n}\n","export type { DiagramConfig } from './config';\nexport { StickyflowDiagram } from './element';\n\nimport { StickyflowDiagram } from './element';\n\nexport function defineStickyflowDiagram(tagName = 'stickyflow-diagram'): void {\n  if (typeof customElements === 'undefined') {\n    return;\n  }\n  if (!customElements.get(tagName)) {\n    customElements.define(tagName, StickyflowDiagram);\n  }\n}\n"]}

package/dist/web-component/index.d.cts

@@ -0,0 +1,31 @@
+import { V as Viewer } from '../types-T7W2yTQF.cjs';
+import '../render-r1GYvjNm.cjs';
+
+interface DiagramConfig {
+    source: string | null;
+    interactive: boolean;
+    padding?: number;
+    diagramId?: string;
+}
+
+declare const ElementBase: typeof HTMLElement;
+declare class StickyflowDiagram extends ElementBase {
+    static get observedAttributes(): string[];
+    private readonly root;
+    private view;
+    private sourceProp;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(): void;
+    set source(value: string | null);
+    get source(): string | null;
+    get viewer(): Viewer | null;
+    private config;
+    private teardown;
+    private rerender;
+}
+
+declare function defineStickyflowDiagram(tagName?: string): void;
+
+export { type DiagramConfig, StickyflowDiagram, defineStickyflowDiagram };

package/dist/web-component/index.d.ts

@@ -0,0 +1,31 @@
+import { V as Viewer } from '../types-ndGA1kbl.js';
+import '../render-r1GYvjNm.js';
+
+interface DiagramConfig {
+    source: string | null;
+    interactive: boolean;
+    padding?: number;
+    diagramId?: string;
+}
+
+declare const ElementBase: typeof HTMLElement;
+declare class StickyflowDiagram extends ElementBase {
+    static get observedAttributes(): string[];
+    private readonly root;
+    private view;
+    private sourceProp;
+    constructor();
+    connectedCallback(): void;
+    disconnectedCallback(): void;
+    attributeChangedCallback(): void;
+    set source(value: string | null);
+    get source(): string | null;
+    get viewer(): Viewer | null;
+    private config;
+    private teardown;
+    private rerender;
+}
+
+declare function defineStickyflowDiagram(tagName?: string): void;
+
+export { type DiagramConfig, StickyflowDiagram, defineStickyflowDiagram };