@grafloria/element 0.3.19 → 0.3.21

package/{src/libs/element → esm}/src/lib/diagram-kit/handles.js

@@ -1,17 +1,10 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.UmlClass = exports.UmlMemberList = exports.ErTable = exports.ErColumnList = exports.ErField = exports.CardHandle = void 0;
-exports.erTable = erTable;
-exports.umlClass = umlClass;
-exports.erTables = erTables;
-exports.umlClasses = umlClasses;
-const tslib_1 = require("tslib");
-const update_1 = require("./update");
+import { __awaiter } from "tslib";
+import { updateEntity, updateClass } from './update';
 const deep = (v) => JSON.parse(JSON.stringify(v));
 // ---------------------------------------------------------------------------
 // Base
 // ---------------------------------------------------------------------------
-class CardHandle {
+export class CardHandle {
     constructor(api, id) {
         this.api = api;
         this.id = id;
@@ -44,14 +37,14 @@ class CardHandle {
         (_c = (_b = this.api).renderNow) === null || _c === void 0 ? void 0 : _c.call(_b);
     }
     undo() {
-        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        return __awaiter(this, void 0, void 0, function* () {
             var _a, _b, _c, _d, _e;
             yield ((_c = (_b = (_a = this.api).getEngine) === null || _b === void 0 ? void 0 : _b.call(_a)) === null || _c === void 0 ? void 0 : _c.undo());
             (_e = (_d = this.api).renderNow) === null || _e === void 0 ? void 0 : _e.call(_d);
         });
     }
     redo() {
-        return tslib_1.__awaiter(this, void 0, void 0, function* () {
+        return __awaiter(this, void 0, void 0, function* () {
             var _a, _b, _c, _d, _e;
             yield ((_c = (_b = (_a = this.api).getEngine) === null || _b === void 0 ? void 0 : _b.call(_a)) === null || _c === void 0 ? void 0 : _c.redo());
             (_e = (_d = this.api).renderNow) === null || _e === void 0 ? void 0 : _e.call(_d);
@@ -81,12 +74,11 @@ class CardHandle {
         return () => this.api.container.removeEventListener('axk:row-select', handler);
     }
 }
-exports.CardHandle = CardHandle;
 // ---------------------------------------------------------------------------
 // ER
 // ---------------------------------------------------------------------------
 /** A column of an {@link ErTable} — itself just (table, name): stateless. */
-class ErField {
+export class ErField {
     constructor(table, columnName) {
         this.table = table;
         this.columnName = columnName;
@@ -130,9 +122,8 @@ class ErField {
         return this.table.columns.removeAt(this.index);
     }
 }
-exports.ErField = ErField;
 /** The columns collection of an {@link ErTable}. Iterable of {@link ErField}. */
-class ErColumnList {
+export class ErColumnList {
     constructor(table) {
         this.table = table;
     }
@@ -180,8 +171,7 @@ class ErColumnList {
         return this.table.update({ columns: next });
     }
 }
-exports.ErColumnList = ErColumnList;
-class ErTable extends CardHandle {
+export class ErTable extends CardHandle {
     constructor() {
         super(...arguments);
         this.columns = new ErColumnList(this);
@@ -206,15 +196,14 @@ class ErTable extends CardHandle {
     }
     /** The raw delta path — everything above funnels through here. */
     update(delta) {
-        return (0, update_1.updateEntity)(this.api, this.id, delta);
+        return updateEntity(this.api, this.id, delta);
     }
 }
-exports.ErTable = ErTable;
 // ---------------------------------------------------------------------------
 // UML
 // ---------------------------------------------------------------------------
 /** attributes / methods of a {@link UmlClass} (members are plain strings). */
-class UmlMemberList {
+export class UmlMemberList {
     constructor(cls, kind) {
         this.cls = cls;
         this.kind = kind;
@@ -242,8 +231,7 @@ class UmlMemberList {
         return this.cls.update({ [this.kind]: this.list().map((m, i) => (i === index ? member : m)) });
     }
 }
-exports.UmlMemberList = UmlMemberList;
-class UmlClass extends CardHandle {
+export class UmlClass extends CardHandle {
     constructor() {
         super(...arguments);
         this.attributes = new UmlMemberList(this, 'attributes');
@@ -280,10 +268,9 @@ class UmlClass extends CardHandle {
         return this.update({ stereotype });
     }
     update(delta) {
-        return (0, update_1.updateClass)(this.api, this.id, delta);
+        return updateClass(this.api, this.id, delta);
     }
 }
-exports.UmlClass = UmlClass;
 // ---------------------------------------------------------------------------
 // Factories
 // ---------------------------------------------------------------------------
@@ -297,17 +284,17 @@ function requireKit(api, id, key, what) {
     }
 }
 /** Typed handle for a kit ER table. Throws for unknown ids / non-kit nodes. */
-function erTable(api, id) {
+export function erTable(api, id) {
     requireKit(api, id, 'kitEntity', 'erTable');
     return new ErTable(api, id);
 }
 /** Typed handle for a kit UML class. Throws for unknown ids / non-kit nodes. */
-function umlClass(api, id) {
+export function umlClass(api, id) {
     requireKit(api, id, 'kitClass', 'umlClass');
     return new UmlClass(api, id);
 }
 /** Every kit ER table in the diagram, as handles. */
-function erTables(api) {
+export function erTables(api) {
     var _a, _b;
     const model = api.getModel();
     return ((_b = (_a = model.getNodes) === null || _a === void 0 ? void 0 : _a.call(model)) !== null && _b !== void 0 ? _b : [])
@@ -315,7 +302,7 @@ function erTables(api) {
         .map((n) => new ErTable(api, n.id));
 }
 /** Every kit UML class in the diagram, as handles. */
-function umlClasses(api) {
+export function umlClasses(api) {
     var _a, _b;
     const model = api.getModel();
     return ((_b = (_a = model.getNodes) === null || _a === void 0 ? void 0 : _a.call(model)) !== null && _b !== void 0 ? _b : [])

package/esm/src/lib/diagram-kit/index.js

@@ -0,0 +1,15 @@
+export { erDiagram, erRowCenterY, ER_ROW_H, ER_HEAD_H, } from './er';
+export { umlDiagram, } from './uml';
+export { ensureDiagramKitStyles, DIAGRAM_KIT_STYLE_ID } from './styles';
+export { bindRowInteractions } from './rows';
+export { updateEntity, updateClass, addColumnAt, removeColumnAt, renameColumnAt, } from './update';
+export { bindCardEditing } from './editing';
+export { matchColumns, rowIndexFromY } from './card';
+// The card CONTENT builders — shared with the stencil palette so a dropped
+// "Entity"/"Class" is the identical card erDiagram()/umlDiagram() produce.
+export { entityCardContent, entityAutoHeight, classCardContent, classAutoHeight } from './card';
+// Live join guidance — score every other table's columns against a connection
+// drag's source column and tint the kit rows by fit (the query-builder story).
+export { scoreMatch, matchTier, assignTiers, singularize, bindJoinGuidance, ensureJoinGuidanceStyles, JOIN_GUIDANCE_STYLE_ID, } from './join-guidance';
+export { erTable, umlClass, erTables, umlClasses, CardHandle, ErTable, ErField, ErColumnList, UmlClass, UmlMemberList, } from './handles';
+//# sourceMappingURL=index.js.map

package/{src/libs/element → esm}/src/lib/diagram-kit/join-guidance.js

@@ -1,4 +1,3 @@
-"use strict";
 /**
  * Join guidance — live "which column should I join to?" scoring + tinting for
  * kit table cards, the feature a visual query builder is actually about.
@@ -33,16 +32,8 @@
  * ARE re-patched every frame, so a class added to the SVG element would be
  * wiped mid-drag, while a stylesheet wins the cascade and survives.
  */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.JOIN_GUIDANCE_STYLE_ID = void 0;
-exports.singularize = singularize;
-exports.scoreMatch = scoreMatch;
-exports.matchTier = matchTier;
-exports.assignTiers = assignTiers;
-exports.ensureJoinGuidanceStyles = ensureJoinGuidanceStyles;
-exports.bindJoinGuidance = bindJoinGuidance;
 /** Naive English singular — enough for schema names (orders, categories, statuses). */
-function singularize(word) {
+export function singularize(word) {
     const w = word.toLowerCase();
     if (w.endsWith('ies') && w.length > 3)
         return w.slice(0, -3) + 'y';
@@ -61,7 +52,7 @@ function conventionMatch(a, b) {
  * Score a candidate join between two columns. Pure; the exact production
  * logic. Higher is better; 0 means "no reason to join these".
  */
-function scoreMatch(a, b) {
+export function scoreMatch(a, b) {
     if (!a || !b || a.table === b.table)
         return 0;
     const an = a.column.name.toLowerCase();
@@ -82,7 +73,7 @@ function scoreMatch(a, b) {
     return 0;
 }
 /** Per-score tier (rank-free half; `assignTiers` promotes the single best to `top`). */
-function matchTier(score) {
+export function matchTier(score) {
     if (score >= 2)
         return 'good';
     if (score >= 1)
@@ -93,7 +84,7 @@ function matchTier(score) {
  * Tier every candidate score at once: the FIRST candidate holding the maximum
  * score is `top` when that maximum is >= 2 — exactly one gold row per drag.
  */
-function assignTiers(scores) {
+export function assignTiers(scores) {
     const max = scores.reduce((m, s) => (s > m ? s : m), 0);
     let topIndex = -1;
     if (max >= 2)
@@ -111,7 +102,7 @@ const TIER_CLASS = {
 };
 const CHIP_CLASS = 'axk-match-chip';
 const PORT_STYLE_ID = 'grafloria-join-guidance-ports';
-exports.JOIN_GUIDANCE_STYLE_ID = 'grafloria-join-guidance-styles';
+export const JOIN_GUIDANCE_STYLE_ID = 'grafloria-join-guidance-styles';
 /** The tier tints — the production palette, verbatim. */
 const GUIDANCE_CSS = `
 .axk-row.axk-match-top { background: #fffbeb;
@@ -126,13 +117,13 @@ const GUIDANCE_CSS = `
   margin-left: 4px; flex: 0 0 auto; letter-spacing: .3px; }
 `;
 /** Inject the guidance tint stylesheet once. Safe to call repeatedly / in SSR. */
-function ensureJoinGuidanceStyles(doc = typeof document !== 'undefined' ? document : undefined) {
+export function ensureJoinGuidanceStyles(doc = typeof document !== 'undefined' ? document : undefined) {
     if (!doc)
         return;
-    if (doc.getElementById(exports.JOIN_GUIDANCE_STYLE_ID))
+    if (doc.getElementById(JOIN_GUIDANCE_STYLE_ID))
         return;
     const style = doc.createElement('style');
-    style.id = exports.JOIN_GUIDANCE_STYLE_ID;
+    style.id = JOIN_GUIDANCE_STYLE_ID;
     style.textContent = GUIDANCE_CSS;
     doc.head.appendChild(style);
 }
@@ -157,7 +148,7 @@ function defaultPortCss(tier, selector) {
  * the matching port glyphs glow via a generated stylesheet. Everything clears
  * when the drag ends, however it ends.
  */
-function bindJoinGuidance(api, options = {}) {
+export function bindJoinGuidance(api, options = {}) {
     var _a, _b, _c, _d, _e;
     ensureJoinGuidanceStyles(api.container.ownerDocument);
     const chipText = (_a = options.chipText) !== null && _a !== void 0 ? _a : '★ BEST';

package/{src/libs/element → esm}/src/lib/diagram-kit/rows.js

@@ -1,4 +1,3 @@
-"use strict";
 /**
  * Row interactions — "select a column / field" on kit cards (P1 of the
  * ER/UML editing track).
@@ -24,8 +23,6 @@
  * kit stored in node metadata (`kitEntity` / `kitClass`), falling back to the
  * row's text.
  */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.bindRowInteractions = bindRowInteractions;
 const ROW_SELECTOR = '.axk-row, .axk-member';
 const SELECTED_CLASS = 'axk-row-selected';
 /** One binding per container — rebinding disposes the previous one. */
@@ -65,7 +62,7 @@ function countFirstCompartment(rowEl) {
     const firstComp = card === null || card === void 0 ? void 0 : card.querySelector('.axk-uml-comp');
     return firstComp ? firstComp.querySelectorAll('.axk-member').length : Number.MAX_SAFE_INTEGER;
 }
-function bindRowInteractions(api) {
+export function bindRowInteractions(api) {
     var _a;
     const container = api.container;
     (_a = bindings.get(container)) === null || _a === void 0 ? void 0 : _a.dispose();

package/{src/lib/diagram-kit/styles.ts → esm/src/lib/diagram-kit/styles.js}

@@ -13,9 +13,7 @@
  *    OUTSIDE the node) reads as a second floating box around a bordered card —
  *    the kit hides it and rings the card itself instead.
  */
-
 export const DIAGRAM_KIT_STYLE_ID = 'grafloria-diagram-kit-styles';
-
 const CSS = `
 /* ===== ER entity (table) cards ===== */
 .axk-entity { font: 12px/1.5 system-ui, sans-serif; border: 1px solid #64748b;
@@ -106,13 +104,15 @@ g.node-group[data-selected="true"]:has(.axk-uml) rect.diagram-node {
   .axk-member { color: #e2e8f0; }
 }
 `;
-
 /** Inject the kit stylesheet once. Safe to call repeatedly and in SSR. */
-export function ensureDiagramKitStyles(doc: Document | undefined = typeof document !== 'undefined' ? document : undefined): void {
-  if (!doc) return;
-  if (doc.getElementById(DIAGRAM_KIT_STYLE_ID)) return;
-  const style = doc.createElement('style');
-  style.id = DIAGRAM_KIT_STYLE_ID;
-  style.textContent = CSS;
-  doc.head.appendChild(style);
+export function ensureDiagramKitStyles(doc = typeof document !== 'undefined' ? document : undefined) {
+    if (!doc)
+        return;
+    if (doc.getElementById(DIAGRAM_KIT_STYLE_ID))
+        return;
+    const style = doc.createElement('style');
+    style.id = DIAGRAM_KIT_STYLE_ID;
+    style.textContent = CSS;
+    doc.head.appendChild(style);
 }
+//# sourceMappingURL=styles.js.map

package/{src/libs/element → esm}/src/lib/diagram-kit/uml.js

@@ -1,6 +1,3 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.umlDiagram = umlDiagram;
 /**
  * UML class-diagram kit — typed builders for the full relationship vocabulary.
  *
@@ -25,10 +22,10 @@ exports.umlDiagram = umlDiagram;
  * spec.finalize(api); // attaches multiplicity chips (needs the live model)
  * ```
  */
-const styles_1 = require("./styles");
-const rows_1 = require("./rows");
-const card_1 = require("./card");
-const editing_1 = require("./editing");
+import { ensureDiagramKitStyles } from './styles';
+import { bindRowInteractions } from './rows';
+import { classCardContent, classAutoHeight } from './card';
+import { bindCardEditing } from './editing';
 const DEFAULT_WIDTH = 200;
 const STROKE = '#475569';
 const DASH = '6,4';
@@ -68,19 +65,19 @@ const chip = (text, slot) => ({
  * after render() — multiplicity chips are positioned labels, which only the
  * live model's `link.addLabel` can express.
  */
-function umlDiagram(options) {
+export function umlDiagram(options) {
     var _a;
-    (0, styles_1.ensureDiagramKitStyles)();
+    ensureDiagramKitStyles();
     const editable = options.editable === true;
     const nodes = options.classes.map((cls, i) => {
         var _a, _b;
         return {
             id: cls.id,
             position: (_a = cls.position) !== null && _a !== void 0 ? _a : { x: 80 + (i % 3) * 320, y: 60 + Math.floor(i / 3) * 260 },
-            size: { width: (_b = cls.width) !== null && _b !== void 0 ? _b : DEFAULT_WIDTH, height: (0, card_1.classAutoHeight)(cls, editable) },
+            size: { width: (_b = cls.width) !== null && _b !== void 0 ? _b : DEFAULT_WIDTH, height: classAutoHeight(cls, editable) },
             // interactive: members are real DOM targets (hover, row selection, inline
             // editing); node drag/select stay geometric in the binder.
-            metadata: Object.assign({ html: { content: (0, card_1.classCardContent)(cls, editable), interactive: true }, kitClass: cls, kitEditable: editable }, (options.rowSelection === false ? { kitRowSelection: false } : {})),
+            metadata: Object.assign({ html: { content: classCardContent(cls, editable), interactive: true }, kitClass: cls, kitEditable: editable }, (options.rowSelection === false ? { kitRowSelection: false } : {})),
             shape: { type: 'rect', fill: 'none', stroke: 'none' },
             style: { fill: 'transparent', stroke: 'transparent', strokeWidth: 0 },
         };
@@ -107,10 +104,10 @@ function umlDiagram(options) {
             // bindRowInteractions disposes any prior binding for the container, so it
             // is safe to run twice.
             if (a === null || a === void 0 ? void 0 : a.container)
-                (0, rows_1.bindRowInteractions)(a);
+                bindRowInteractions(a);
         }
         if (editable && (a0 === null || a0 === void 0 ? void 0 : a0.container))
-            (0, editing_1.bindCardEditing)(a0);
+            bindCardEditing(a0);
         if (api && typeof api === 'object') {
             if (finalized.has(api))
                 return;

package/{src/libs/element → esm}/src/lib/diagram-kit/update.js

@@ -1,4 +1,3 @@
-"use strict";
 /**
  * Live editing — `updateEntity` / `updateClass` mutate a rendered kit card in
  * place (P3, the foundation the in-canvas editing chrome is built on).
@@ -28,21 +27,15 @@
  * intended extension point — every basic command does it). When no engine is
  * present the edit still applies, just non-undoably.
  */
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.updateEntity = updateEntity;
-exports.updateClass = updateClass;
-exports.addColumnAt = addColumnAt;
-exports.removeColumnAt = removeColumnAt;
-exports.renameColumnAt = renameColumnAt;
-const tslib_1 = require("tslib");
-const engine_1 = require("@grafloria/engine");
-const card_1 = require("./card");
+import { __awaiter } from "tslib";
+import { Command, PortModel, LinkModel } from '@grafloria/engine';
+import { entityCardContent, entityAutoHeight, classCardContent, classAutoHeight, erRowCenterY, rowIndexFromY, matchColumns, } from './card';
 /**
  * The single undoable edit. Captures the card's whole before-state on first
  * execute and restores it on undo, so an edit — however many rows and edges it
  * touched — is one Ctrl+Z.
  */
-class UpdateCardCommand extends engine_1.Command {
+class UpdateCardCommand extends Command {
     constructor(nodeId, kind, build) {
         super(kind === 'er' ? 'Edit table' : 'Edit class');
         this.nodeId = nodeId;
@@ -74,12 +67,12 @@ class UpdateCardCommand extends engine_1.Command {
         if (this.kind === 'er') {
             const oldCols = ((_c = oldKit['columns']) !== null && _c !== void 0 ? _c : []);
             const newCols = ((_d = result.newKit['columns']) !== null && _d !== void 0 ? _d : []);
-            const map = (0, card_1.matchColumns)(oldCols, newCols);
+            const map = matchColumns(oldCols, newCols);
             for (const port of [...node.getPorts()]) {
                 const args = (_e = port.layout) === null || _e === void 0 ? void 0 : _e.args;
                 if (((_f = port.layout) === null || _f === void 0 ? void 0 : _f.strategy) !== 'absolute' || !args || args.units !== 'px' || args.y == null)
                     continue;
-                const oldIdx = (0, card_1.rowIndexFromY)(args.y);
+                const oldIdx = rowIndexFromY(args.y);
                 if (oldIdx < 0 || oldIdx >= oldCols.length)
                     continue; // not a row-pinned field port
                 const newIdx = map.get(oldIdx);
@@ -97,7 +90,7 @@ class UpdateCardCommand extends engine_1.Command {
                 else {
                     // Move the port to its column's NEW row; keep the ±dy spread. x tracks
                     // the (possibly changed) width by side, so a widened table stays pinned.
-                    args.y = (0, card_1.erRowCenterY)(newIdx);
+                    args.y = erRowCenterY(newIdx);
                     const side = (_g = port.alignment) === null || _g === void 0 ? void 0 : _g.side;
                     args.x = side === 'left' ? 0 : side === 'right' ? newWidth : newWidth / 2;
                     // A nested-arg mutation is not tracked — nudge the port so the model
@@ -132,12 +125,12 @@ class UpdateCardCommand extends engine_1.Command {
                 live.setOffset(Object.assign({}, ((_a = sp['offset']) !== null && _a !== void 0 ? _a : { x: 0, y: 0 })));
             }
             else {
-                node.addPort(engine_1.PortModel.fromJSON(sp));
+                node.addPort(PortModel.fromJSON(sp));
             }
         }
         for (const sl of this.before.links) {
             if (!model.getLink(sl['id']))
-                model.addLink(engine_1.LinkModel.fromJSON(sl));
+                model.addLink(LinkModel.fromJSON(sl));
         }
     }
     canExecute(context) {
@@ -150,7 +143,7 @@ class UpdateCardCommand extends engine_1.Command {
 }
 /** Route a build through the engine's command stack (one undo step) or apply it directly. */
 function runUpdate(api, nodeId, kind, build) {
-    return tslib_1.__awaiter(this, void 0, void 0, function* () {
+    return __awaiter(this, void 0, void 0, function* () {
         var _a, _b, _c, _d, _e;
         const model = (_a = api.getModel) === null || _a === void 0 ? void 0 : _a.call(api);
         const node = (_b = model === null || model === void 0 ? void 0 : model.getNode) === null || _b === void 0 ? void 0 : _b.call(model, nodeId);
@@ -177,7 +170,7 @@ const isEditable = (node) => (node === null || node === void 0 ? void 0 : node.g
  *
  * @returns whether the node existed and the edit was applied.
  */
-function updateEntity(api, entityId, delta) {
+export function updateEntity(api, entityId, delta) {
     var _a, _b, _c;
     const editable = isEditable((_c = (_b = (_a = api.getModel) === null || _a === void 0 ? void 0 : _a.call(api)) === null || _b === void 0 ? void 0 : _b.getNode) === null || _c === void 0 ? void 0 : _c.call(_b, entityId));
     const build = (oldKit) => {
@@ -192,8 +185,8 @@ function updateEntity(api, entityId, delta) {
             newEntity.columns = delta.columns;
         return {
             newKit: newEntity,
-            content: (0, card_1.entityCardContent)(newEntity, editable),
-            height: (0, card_1.entityAutoHeight)(newEntity, editable),
+            content: entityCardContent(newEntity, editable),
+            height: entityAutoHeight(newEntity, editable),
             width: newEntity.width,
         };
     };
@@ -203,7 +196,7 @@ function updateEntity(api, entityId, delta) {
  * Edit a rendered UML class in place. `delta` may change the name, stereotype,
  * abstract flag, attributes, methods, and width/height. One undoable step.
  */
-function updateClass(api, classId, delta) {
+export function updateClass(api, classId, delta) {
     var _a, _b, _c;
     const editable = isEditable((_c = (_b = (_a = api.getModel) === null || _a === void 0 ? void 0 : _a.call(api)) === null || _b === void 0 ? void 0 : _b.getNode) === null || _c === void 0 ? void 0 : _c.call(_b, classId));
     const build = (oldKit) => {
@@ -224,8 +217,8 @@ function updateClass(api, classId, delta) {
             newClass.methods = delta.methods;
         return {
             newKit: newClass,
-            content: (0, card_1.classCardContent)(newClass, editable),
-            height: (0, card_1.classAutoHeight)(newClass, editable),
+            content: classCardContent(newClass, editable),
+            height: classAutoHeight(newClass, editable),
             width: newClass.width,
         };
     };
@@ -233,19 +226,19 @@ function updateClass(api, classId, delta) {
 }
 // -- small column helpers, for the editing chrome and embedders --------------
 /** Append a column (immutably) — returns the new column array. */
-function addColumnAt(columns, column, at = columns.length) {
+export function addColumnAt(columns, column, at = columns.length) {
     const next = columns.slice();
     next.splice(Math.max(0, Math.min(at, next.length)), 0, column);
     return next;
 }
 /** Remove the column at `index` — returns the new column array. */
-function removeColumnAt(columns, index) {
+export function removeColumnAt(columns, index) {
     const next = columns.slice();
     next.splice(index, 1);
     return next;
 }
 /** Rename the column at `index` — returns a new array with a NEW object there. */
-function renameColumnAt(columns, index, name) {
+export function renameColumnAt(columns, index, name) {
     return columns.map((c, i) => (i === index ? Object.assign(Object.assign({}, c), { name }) : c));
 }
 //# sourceMappingURL=update.js.map

package/{src/libs/element → esm}/src/lib/grafloria-flow-element.js

@@ -1,9 +1,5 @@
-"use strict";
-Object.defineProperty(exports, "__esModule", { value: true });
-exports.GrafloriaFlowElement = exports.GRAFLORIA_EVENTS = void 0;
-exports.defineGrafloriaFlow = defineGrafloriaFlow;
-const renderer_1 = require("@grafloria/renderer");
-const node_type_registry_1 = require("./node-type-registry");
+import { createDiagram, DARK_THEME, LIGHT_THEME } from '@grafloria/renderer';
+import { getNodeType, renderFromTemplate } from './node-type-registry';
 /**
  * `<grafloria-flow>` — the universal embed.
  *
@@ -36,11 +32,11 @@ const node_type_registry_1 = require("./node-type-registry");
  * Everything it does is delegation. There is no diagram logic in this file.
  */
 const THEMES = {
-    light: renderer_1.LIGHT_THEME,
-    dark: renderer_1.DARK_THEME,
+    light: LIGHT_THEME,
+    dark: DARK_THEME,
 };
 /** Events emitted on the element. All bubble and cross shadow boundaries. */
-exports.GRAFLORIA_EVENTS = {
+export const GRAFLORIA_EVENTS = {
     ready: 'grafloria-ready',
     nodesChange: 'grafloria-nodes-change',
     edgesChange: 'grafloria-edges-change',
@@ -66,7 +62,7 @@ const HTMLElementBase = typeof HTMLElement !== 'undefined'
     ? HTMLElement
     : class {
     };
-class GrafloriaFlowElement extends HTMLElementBase {
+export class GrafloriaFlowElement extends HTMLElementBase {
     constructor() {
         super(...arguments);
         this.instance = null;
@@ -126,7 +122,7 @@ class GrafloriaFlowElement extends HTMLElementBase {
         this.appendChild(this.canvas);
         if (!this.style.display)
             this.style.display = 'block';
-        this.instance = (0, renderer_1.createDiagram)(this.canvas, this.buildOptions());
+        this.instance = createDiagram(this.canvas, this.buildOptions());
         this.wireEvents(this.instance);
     }
     disconnectedCallback() {
@@ -199,14 +195,14 @@ class GrafloriaFlowElement extends HTMLElementBase {
      * (`Grafloria.registerNodeType`), or a slotted `<template data-node-type="…">`.
      */
     renderCustomNode(node, element) {
-        const renderer = (0, node_type_registry_1.getNodeType)(node.type);
+        const renderer = getNodeType(node.type);
         if (renderer) {
             renderer(node, element);
             return;
         }
         const template = this.querySelector(`template[data-node-type="${cssEscape(node.type)}"]`);
         if (template) {
-            (0, node_type_registry_1.renderFromTemplate)(template, node, element);
+            renderFromTemplate(template, node, element);
             return;
         }
         // Nothing registered: leave the host empty rather than throwing inside a
@@ -214,7 +210,7 @@ class GrafloriaFlowElement extends HTMLElementBase {
     }
     resolveTheme() {
         var _a, _b;
-        return (_b = THEMES[(_a = this.getAttribute('theme')) !== null && _a !== void 0 ? _a : 'light']) !== null && _b !== void 0 ? _b : renderer_1.LIGHT_THEME;
+        return (_b = THEMES[(_a = this.getAttribute('theme')) !== null && _a !== void 0 ? _a : 'light']) !== null && _b !== void 0 ? _b : LIGHT_THEME;
     }
     readAttributeModel() {
         if (this._nodes.length === 0 && this.hasAttribute('nodes')) {
@@ -229,17 +225,16 @@ class GrafloriaFlowElement extends HTMLElementBase {
         const forward = (type, detail) => {
             this.dispatchEvent(new CustomEvent(type, { detail, bubbles: true, composed: true }));
         };
-        instance.on('ready', () => forward(exports.GRAFLORIA_EVENTS.ready, { diagram: instance }));
-        instance.on('nodes:change', (payload) => forward(exports.GRAFLORIA_EVENTS.nodesChange, payload));
-        instance.on('edges:change', (payload) => forward(exports.GRAFLORIA_EVENTS.edgesChange, payload));
-        instance.on('selection:change', (payload) => forward(exports.GRAFLORIA_EVENTS.selectionChange, payload));
-        instance.on('connect', (payload) => forward(exports.GRAFLORIA_EVENTS.connect, payload));
-        instance.on('node:click', (payload) => forward(exports.GRAFLORIA_EVENTS.nodeClick, payload));
-        instance.on('edge:click', (payload) => forward(exports.GRAFLORIA_EVENTS.edgeClick, payload));
-        instance.on('viewport:change', (payload) => forward(exports.GRAFLORIA_EVENTS.viewportChange, payload));
+        instance.on('ready', () => forward(GRAFLORIA_EVENTS.ready, { diagram: instance }));
+        instance.on('nodes:change', (payload) => forward(GRAFLORIA_EVENTS.nodesChange, payload));
+        instance.on('edges:change', (payload) => forward(GRAFLORIA_EVENTS.edgesChange, payload));
+        instance.on('selection:change', (payload) => forward(GRAFLORIA_EVENTS.selectionChange, payload));
+        instance.on('connect', (payload) => forward(GRAFLORIA_EVENTS.connect, payload));
+        instance.on('node:click', (payload) => forward(GRAFLORIA_EVENTS.nodeClick, payload));
+        instance.on('edge:click', (payload) => forward(GRAFLORIA_EVENTS.edgeClick, payload));
+        instance.on('viewport:change', (payload) => forward(GRAFLORIA_EVENTS.viewportChange, payload));
     }
 }
-exports.GrafloriaFlowElement = GrafloriaFlowElement;
 /** JSON attribute → value. A malformed attribute must not take the page down. */
 function parseJsonAttribute(raw, fallback) {
     if (!raw)
@@ -261,7 +256,7 @@ function cssEscape(value) {
  * `customElements` does not exist) — which is what lets a bundle be imported
  * from an SSR entry point without a `typeof window` dance at every call site.
  */
-function defineGrafloriaFlow(tagName = 'grafloria-flow') {
+export function defineGrafloriaFlow(tagName = 'grafloria-flow') {
     if (typeof customElements === 'undefined')
         return;
     if (customElements.get(tagName))