@grafloria/element 0.3.23 → 0.4.0
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/README.md +7 -7
- package/package.json +7 -9
- package/src/index.d.ts +16 -16
- package/src/index.js +58 -339
- package/src/lib/dashboard-kit/dashboard.d.ts +1 -1
- package/src/lib/dashboard-kit/dashboard.js +22 -26
- package/src/lib/dashboard-kit/grid-binder.d.ts +1 -1
- package/src/lib/dashboard-kit/grid-binder.js +62 -65
- package/src/lib/dashboard-kit/grid-mapping.js +14 -26
- package/src/lib/dashboard-kit/index.d.ts +5 -5
- package/src/lib/dashboard-kit/index.js +5 -30
- package/src/lib/dashboard-kit/styles.js +4 -8
- package/src/lib/dashboard-kit/widgets.d.ts +1 -1
- package/src/lib/dashboard-kit/widgets.js +16 -26
- package/src/lib/diagram-kit/card.d.ts +2 -2
- package/src/lib/diagram-kit/card.js +22 -32
- package/src/lib/diagram-kit/editing.js +15 -20
- package/src/lib/diagram-kit/er.d.ts +1 -1
- package/src/lib/diagram-kit/er.js +15 -18
- package/src/lib/diagram-kit/handles.d.ts +4 -4
- package/src/lib/diagram-kit/handles.js +16 -29
- package/src/lib/diagram-kit/index.d.ts +10 -10
- package/src/lib/diagram-kit/index.js +10 -50
- package/src/lib/diagram-kit/join-guidance.js +9 -18
- package/src/lib/diagram-kit/rows.js +1 -4
- package/src/lib/diagram-kit/styles.js +4 -8
- package/src/lib/diagram-kit/uml.js +10 -13
- package/src/lib/diagram-kit/update.d.ts +1 -1
- package/src/lib/diagram-kit/update.js +19 -26
- package/src/lib/grafloria-flow-element.js +19 -24
- package/src/lib/grafloria.d.ts +4 -4
- package/src/lib/grafloria.js +12 -17
- package/src/lib/load.d.ts +3 -3
- package/src/lib/load.js +19 -22
- package/src/lib/node-type-registry.js +6 -14
- package/src/lib/stencil-kit/builders.js +4 -10
- package/src/lib/stencil-kit/card-builders.js +14 -17
- package/src/lib/stencil-kit/index.d.ts +7 -7
- package/src/lib/stencil-kit/index.js +6 -16
- package/src/lib/stencil-kit/palette.js +14 -17
- package/src/lib/stencil-kit/shape-data.js +25 -28
- package/src/lib/stencil-kit/styles.js +1 -4
- package/esm/src/index.js +0 -295
- package/esm/src/lib/dashboard-kit/dashboard.js +0 -590
- package/esm/src/lib/dashboard-kit/grid-binder.js +0 -1633
- package/esm/src/lib/dashboard-kit/grid-mapping.js +0 -164
- package/esm/src/lib/dashboard-kit/index.js +0 -8
- package/esm/src/lib/dashboard-kit/styles.js +0 -205
- package/esm/src/lib/dashboard-kit/widgets.js +0 -379
- package/esm/src/lib/diagram-kit/card.js +0 -199
- package/esm/src/lib/diagram-kit/editing.js +0 -448
- package/esm/src/lib/diagram-kit/er.js +0 -160
- package/esm/src/lib/diagram-kit/handles.js +0 -312
- package/esm/src/lib/diagram-kit/index.js +0 -15
- package/esm/src/lib/diagram-kit/join-guidance.js +0 -322
- package/esm/src/lib/diagram-kit/rows.js +0 -144
- package/esm/src/lib/diagram-kit/styles.js +0 -118
- package/esm/src/lib/diagram-kit/uml.js +0 -135
- package/esm/src/lib/diagram-kit/update.js +0 -244
- package/esm/src/lib/grafloria-flow-element.js +0 -266
- package/esm/src/lib/grafloria.js +0 -69
- package/esm/src/lib/load.js +0 -252
- package/esm/src/lib/node-type-registry.js +0 -42
- package/esm/src/lib/stencil-kit/builders.js +0 -18
- package/esm/src/lib/stencil-kit/card-builders.js +0 -105
- package/esm/src/lib/stencil-kit/index.js +0 -9
- package/esm/src/lib/stencil-kit/palette.js +0 -427
- package/esm/src/lib/stencil-kit/shape-data.js +0 -537
- package/esm/src/lib/stencil-kit/styles.js +0 -126
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
/**
|
|
3
2
|
* Dashboard-kit pure math — Phase 2 of the dashboard-grid plan
|
|
4
3
|
* (`documentation/api-architecture/dashboard-grid-plan.html`).
|
|
@@ -21,20 +20,9 @@
|
|
|
21
20
|
* to hold them (never below the design height). Camera refit after
|
|
22
21
|
* growth is the page's concern (its existing `frameTab`).
|
|
23
22
|
*/
|
|
24
|
-
|
|
25
|
-
exports.rowHeightFor = rowHeightFor;
|
|
26
|
-
exports.boardHeightFor = boardHeightFor;
|
|
27
|
-
exports.columnUnitFor = columnUnitFor;
|
|
28
|
-
exports.spanWidthPx = spanWidthPx;
|
|
29
|
-
exports.cellToRect = cellToRect;
|
|
30
|
-
exports.pointToCell = pointToCell;
|
|
31
|
-
exports.sizeToSpan = sizeToSpan;
|
|
32
|
-
exports.gridItemFromCell = gridItemFromCell;
|
|
33
|
-
exports.cellFromGridItem = cellFromGridItem;
|
|
34
|
-
exports.buildCommitCommands = buildCommitCommands;
|
|
35
|
-
const engine_1 = require("@grafloria/engine");
|
|
23
|
+
import { MoveNodeCommand, ResizeNodeCommand, SetGridItemCommand, } from '@grafloria/engine';
|
|
36
24
|
/** Row height for a board currently `rows` rows tall (both modes). */
|
|
37
|
-
function rowHeightFor(g, rows) {
|
|
25
|
+
export function rowHeightFor(g, rows) {
|
|
38
26
|
if (g.sizing === 'grow')
|
|
39
27
|
return g.baseRowHeight;
|
|
40
28
|
const r = Math.max(1, rows);
|
|
@@ -42,7 +30,7 @@ function rowHeightFor(g, rows) {
|
|
|
42
30
|
return Math.max(g.minRowHeight, (g.designHeight - 2 * g.padding - (r - 1) * g.gap) / r);
|
|
43
31
|
}
|
|
44
32
|
/** The board frame height the mode implies for `rows` rows. */
|
|
45
|
-
function boardHeightFor(g, rows) {
|
|
33
|
+
export function boardHeightFor(g, rows) {
|
|
46
34
|
if (g.sizing === 'fit')
|
|
47
35
|
return g.designHeight;
|
|
48
36
|
const r = Math.max(0, rows);
|
|
@@ -50,11 +38,11 @@ function boardHeightFor(g, rows) {
|
|
|
50
38
|
return Math.max(g.designHeight, content);
|
|
51
39
|
}
|
|
52
40
|
/** Width of one column cell for a board `width` px wide. */
|
|
53
|
-
function columnUnitFor(g, width) {
|
|
41
|
+
export function columnUnitFor(g, width) {
|
|
54
42
|
return (width - 2 * g.padding - (g.columns - 1) * g.gap) / g.columns;
|
|
55
43
|
}
|
|
56
44
|
/** Width in px of a `w`-column span (the pitch identity used by both mappings). */
|
|
57
|
-
function spanWidthPx(w, g, frameWidth) {
|
|
45
|
+
export function spanWidthPx(w, g, frameWidth) {
|
|
58
46
|
const cu = columnUnitFor(g, frameWidth);
|
|
59
47
|
return w * cu + (w - 1) * g.gap;
|
|
60
48
|
}
|
|
@@ -66,7 +54,7 @@ function spanWidthPx(w, g, frameWidth) {
|
|
|
66
54
|
* distance from the left padding edge to the tile's LEFT edge would be. Only
|
|
67
55
|
* the x term changes — rows, heights and spans are direction-agnostic.
|
|
68
56
|
*/
|
|
69
|
-
function cellToRect(cell, frame, g, rows) {
|
|
57
|
+
export function cellToRect(cell, frame, g, rows) {
|
|
70
58
|
const cu = columnUnitFor(g, frame.width);
|
|
71
59
|
const rh = rowHeightFor(g, rows);
|
|
72
60
|
const width = cell.w * cu + (cell.w - 1) * g.gap;
|
|
@@ -91,7 +79,7 @@ function cellToRect(cell, frame, g, rows) {
|
|
|
91
79
|
* this wrong is the classic RTL drag bug — the tile lands a span away from
|
|
92
80
|
* the placeholder — so the e2e battery asserts drop-on-placeholder in RTL.
|
|
93
81
|
*/
|
|
94
|
-
function pointToCell(x, y, frame, g, rows, spanW = 1) {
|
|
82
|
+
export function pointToCell(x, y, frame, g, rows, spanW = 1) {
|
|
95
83
|
const cu = columnUnitFor(g, frame.width);
|
|
96
84
|
const rh = rowHeightFor(g, rows);
|
|
97
85
|
const right = x + spanWidthPx(spanW, g, frame.width);
|
|
@@ -106,7 +94,7 @@ function pointToCell(x, y, frame, g, rows, spanW = 1) {
|
|
|
106
94
|
* The integer span a fluid pixel size rounds to — the prototype's
|
|
107
95
|
* `round((W + margin) / cellPitch)`, floored at 1×1.
|
|
108
96
|
*/
|
|
109
|
-
function sizeToSpan(widthPx, heightPx, frame, g, rows) {
|
|
97
|
+
export function sizeToSpan(widthPx, heightPx, frame, g, rows) {
|
|
110
98
|
const cu = columnUnitFor(g, frame.width);
|
|
111
99
|
const rh = rowHeightFor(g, rows);
|
|
112
100
|
return {
|
|
@@ -123,7 +111,7 @@ function sizeToSpan(widthPx, heightPx, frame, g, rows) {
|
|
|
123
111
|
// already round-trips gridItem.
|
|
124
112
|
// ---------------------------------------------------------------------------
|
|
125
113
|
/** Engine cells → the GridItemConfig that persists them. */
|
|
126
|
-
function gridItemFromCell(cell) {
|
|
114
|
+
export function gridItemFromCell(cell) {
|
|
127
115
|
return {
|
|
128
116
|
columnStart: cell.x + 1,
|
|
129
117
|
columnEnd: cell.x + cell.w + 1,
|
|
@@ -136,7 +124,7 @@ function gridItemFromCell(cell) {
|
|
|
136
124
|
* placement (absent, or 'auto' lines). `fallback` fills spans a partial
|
|
137
125
|
* config omits — the first-adoption path uses metadata `columnSpan` there.
|
|
138
126
|
*/
|
|
139
|
-
function cellFromGridItem(gi, fallback) {
|
|
127
|
+
export function cellFromGridItem(gi, fallback) {
|
|
140
128
|
var _a, _b;
|
|
141
129
|
if (!gi)
|
|
142
130
|
return null;
|
|
@@ -153,22 +141,22 @@ function cellFromGridItem(gi, fallback) {
|
|
|
153
141
|
}
|
|
154
142
|
const cellsDiffer = (a, b) => a.x !== b.x || a.y !== b.y || a.w !== b.w || a.h !== b.h;
|
|
155
143
|
const EPS = 0.5;
|
|
156
|
-
function buildCommitCommands(deltas) {
|
|
144
|
+
export function buildCommitCommands(deltas) {
|
|
157
145
|
const commands = [];
|
|
158
146
|
for (const d of deltas) {
|
|
159
147
|
const cellChanged = cellsDiffer(d.cellBefore, d.cellAfter);
|
|
160
148
|
if (cellChanged && !d.isGroup) {
|
|
161
|
-
commands.push(new
|
|
149
|
+
commands.push(new SetGridItemCommand(d.id, gridItemFromCell(d.cellAfter)));
|
|
162
150
|
}
|
|
163
151
|
if (d.locked || d.isGroup)
|
|
164
152
|
continue;
|
|
165
153
|
if (Math.abs(d.posAfter.x - d.posBefore.x) > EPS ||
|
|
166
154
|
Math.abs(d.posAfter.y - d.posBefore.y) > EPS) {
|
|
167
|
-
commands.push(new
|
|
155
|
+
commands.push(new MoveNodeCommand(d.id, Object.assign({}, d.posAfter), Object.assign({}, d.posBefore), { mergeable: false }));
|
|
168
156
|
}
|
|
169
157
|
if (Math.abs(d.sizeAfter.width - d.sizeBefore.width) > EPS ||
|
|
170
158
|
Math.abs(d.sizeAfter.height - d.sizeBefore.height) > EPS) {
|
|
171
|
-
commands.push(new
|
|
159
|
+
commands.push(new ResizeNodeCommand(d.id, Object.assign({ depth: 0 }, d.sizeAfter), Object.assign({ depth: 0 }, d.sizeBefore)));
|
|
172
160
|
}
|
|
173
161
|
}
|
|
174
162
|
return commands;
|
|
@@ -1,5 +1,5 @@
|
|
|
1
|
-
export { bindDashboardGrid, type DashboardGridApi, type DashboardGridOptions, type DashboardGridHandle, type DashboardResponsiveOptions, } from './grid-binder';
|
|
2
|
-
export { rowHeightFor, boardHeightFor, columnUnitFor, cellToRect, pointToCell, sizeToSpan, spanWidthPx, gridItemFromCell, cellFromGridItem, buildCommitCommands, type CellRect, type WorldRect, type DashboardGridGeometry, type TileDelta, } from './grid-mapping';
|
|
3
|
-
export { ensureDashboardKitStyles, DASHBOARD_KIT_STYLE_ID } from './styles';
|
|
4
|
-
export { dashboard, type DashboardOptions, type DashboardSpec, type DashboardSnapshot, type DashboardHandle, type DashboardViewSpec, type DashboardWidgetSpec, type WidgetHandle, } from './dashboard';
|
|
5
|
-
export { defaultWidgetRenderer, renderKpiWidget, renderLineWidget, renderBarWidget, renderDonutWidget, renderFunnelWidget, renderTableWidget, BUILT_IN_WIDGET_KINDS, type WidgetRenderer, type KpiWidgetData, type LineWidgetData, type LineSeries, type BarWidgetData, type DonutWidgetData, type FunnelWidgetData, type TableWidgetData, } from './widgets';
|
|
1
|
+
export { bindDashboardGrid, type DashboardGridApi, type DashboardGridOptions, type DashboardGridHandle, type DashboardResponsiveOptions, } from './grid-binder.js';
|
|
2
|
+
export { rowHeightFor, boardHeightFor, columnUnitFor, cellToRect, pointToCell, sizeToSpan, spanWidthPx, gridItemFromCell, cellFromGridItem, buildCommitCommands, type CellRect, type WorldRect, type DashboardGridGeometry, type TileDelta, } from './grid-mapping.js';
|
|
3
|
+
export { ensureDashboardKitStyles, DASHBOARD_KIT_STYLE_ID } from './styles.js';
|
|
4
|
+
export { dashboard, type DashboardOptions, type DashboardSpec, type DashboardSnapshot, type DashboardHandle, type DashboardViewSpec, type DashboardWidgetSpec, type WidgetHandle, } from './dashboard.js';
|
|
5
|
+
export { defaultWidgetRenderer, renderKpiWidget, renderLineWidget, renderBarWidget, renderDonutWidget, renderFunnelWidget, renderTableWidget, BUILT_IN_WIDGET_KINDS, type WidgetRenderer, type KpiWidgetData, type LineWidgetData, type LineSeries, type BarWidgetData, type DonutWidgetData, type FunnelWidgetData, type TableWidgetData, } from './widgets.js';
|
|
@@ -1,33 +1,8 @@
|
|
|
1
|
-
|
|
2
|
-
|
|
3
|
-
|
|
4
|
-
var grid_binder_1 = require("./grid-binder");
|
|
5
|
-
Object.defineProperty(exports, "bindDashboardGrid", { enumerable: true, get: function () { return grid_binder_1.bindDashboardGrid; } });
|
|
6
|
-
var grid_mapping_1 = require("./grid-mapping");
|
|
7
|
-
Object.defineProperty(exports, "rowHeightFor", { enumerable: true, get: function () { return grid_mapping_1.rowHeightFor; } });
|
|
8
|
-
Object.defineProperty(exports, "boardHeightFor", { enumerable: true, get: function () { return grid_mapping_1.boardHeightFor; } });
|
|
9
|
-
Object.defineProperty(exports, "columnUnitFor", { enumerable: true, get: function () { return grid_mapping_1.columnUnitFor; } });
|
|
10
|
-
Object.defineProperty(exports, "cellToRect", { enumerable: true, get: function () { return grid_mapping_1.cellToRect; } });
|
|
11
|
-
Object.defineProperty(exports, "pointToCell", { enumerable: true, get: function () { return grid_mapping_1.pointToCell; } });
|
|
12
|
-
Object.defineProperty(exports, "sizeToSpan", { enumerable: true, get: function () { return grid_mapping_1.sizeToSpan; } });
|
|
13
|
-
Object.defineProperty(exports, "spanWidthPx", { enumerable: true, get: function () { return grid_mapping_1.spanWidthPx; } });
|
|
14
|
-
Object.defineProperty(exports, "gridItemFromCell", { enumerable: true, get: function () { return grid_mapping_1.gridItemFromCell; } });
|
|
15
|
-
Object.defineProperty(exports, "cellFromGridItem", { enumerable: true, get: function () { return grid_mapping_1.cellFromGridItem; } });
|
|
16
|
-
Object.defineProperty(exports, "buildCommitCommands", { enumerable: true, get: function () { return grid_mapping_1.buildCommitCommands; } });
|
|
17
|
-
var styles_1 = require("./styles");
|
|
18
|
-
Object.defineProperty(exports, "ensureDashboardKitStyles", { enumerable: true, get: function () { return styles_1.ensureDashboardKitStyles; } });
|
|
19
|
-
Object.defineProperty(exports, "DASHBOARD_KIT_STYLE_ID", { enumerable: true, get: function () { return styles_1.DASHBOARD_KIT_STYLE_ID; } });
|
|
1
|
+
export { bindDashboardGrid, } from './grid-binder.js';
|
|
2
|
+
export { rowHeightFor, boardHeightFor, columnUnitFor, cellToRect, pointToCell, sizeToSpan, spanWidthPx, gridItemFromCell, cellFromGridItem, buildCommitCommands, } from './grid-mapping.js';
|
|
3
|
+
export { ensureDashboardKitStyles, DASHBOARD_KIT_STYLE_ID } from './styles.js';
|
|
20
4
|
// The DATA-FIRST authoring API (the erDiagram/umlDiagram equivalent).
|
|
21
|
-
|
|
22
|
-
Object.defineProperty(exports, "dashboard", { enumerable: true, get: function () { return dashboard_1.dashboard; } });
|
|
5
|
+
export { dashboard, } from './dashboard.js';
|
|
23
6
|
// The built-in renderers behind `kind` — dashboard()'s default renderWidget.
|
|
24
|
-
|
|
25
|
-
Object.defineProperty(exports, "defaultWidgetRenderer", { enumerable: true, get: function () { return widgets_1.defaultWidgetRenderer; } });
|
|
26
|
-
Object.defineProperty(exports, "renderKpiWidget", { enumerable: true, get: function () { return widgets_1.renderKpiWidget; } });
|
|
27
|
-
Object.defineProperty(exports, "renderLineWidget", { enumerable: true, get: function () { return widgets_1.renderLineWidget; } });
|
|
28
|
-
Object.defineProperty(exports, "renderBarWidget", { enumerable: true, get: function () { return widgets_1.renderBarWidget; } });
|
|
29
|
-
Object.defineProperty(exports, "renderDonutWidget", { enumerable: true, get: function () { return widgets_1.renderDonutWidget; } });
|
|
30
|
-
Object.defineProperty(exports, "renderFunnelWidget", { enumerable: true, get: function () { return widgets_1.renderFunnelWidget; } });
|
|
31
|
-
Object.defineProperty(exports, "renderTableWidget", { enumerable: true, get: function () { return widgets_1.renderTableWidget; } });
|
|
32
|
-
Object.defineProperty(exports, "BUILT_IN_WIDGET_KINDS", { enumerable: true, get: function () { return widgets_1.BUILT_IN_WIDGET_KINDS; } });
|
|
7
|
+
export { defaultWidgetRenderer, renderKpiWidget, renderLineWidget, renderBarWidget, renderDonutWidget, renderFunnelWidget, renderTableWidget, BUILT_IN_WIDGET_KINDS, } from './widgets.js';
|
|
33
8
|
//# sourceMappingURL=index.js.map
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
/**
|
|
3
2
|
* Dashboard-kit stylesheet — injected once, on first `bindDashboardGrid`.
|
|
4
3
|
*
|
|
@@ -21,10 +20,7 @@
|
|
|
21
20
|
* injects it into each member host and re-injects if the host repaints
|
|
22
21
|
* (pages own their card innerHTML).
|
|
23
22
|
*/
|
|
24
|
-
|
|
25
|
-
exports.DASHBOARD_KIT_STYLE_ID = void 0;
|
|
26
|
-
exports.ensureDashboardKitStyles = ensureDashboardKitStyles;
|
|
27
|
-
exports.DASHBOARD_KIT_STYLE_ID = 'grafloria-dashboard-kit-styles';
|
|
23
|
+
export const DASHBOARD_KIT_STYLE_ID = 'grafloria-dashboard-kit-styles';
|
|
28
24
|
const CSS = `
|
|
29
25
|
/* ===== reflow glide (armed on the html layer for the whole gesture) ===== */
|
|
30
26
|
.grafloria-html-layer.axdb-glide > .grafloria-node-host {
|
|
@@ -198,11 +194,11 @@ const CSS = `
|
|
|
198
194
|
}
|
|
199
195
|
`;
|
|
200
196
|
/** Idempotently inject the kit stylesheet (safe to call per binder). */
|
|
201
|
-
function ensureDashboardKitStyles(doc = document) {
|
|
202
|
-
if (doc.getElementById(
|
|
197
|
+
export function ensureDashboardKitStyles(doc = document) {
|
|
198
|
+
if (doc.getElementById(DASHBOARD_KIT_STYLE_ID))
|
|
203
199
|
return;
|
|
204
200
|
const style = doc.createElement('style');
|
|
205
|
-
style.id =
|
|
201
|
+
style.id = DASHBOARD_KIT_STYLE_ID;
|
|
206
202
|
style.textContent = CSS;
|
|
207
203
|
doc.head.appendChild(style);
|
|
208
204
|
}
|
|
@@ -28,7 +28,7 @@
|
|
|
28
28
|
* (that is exactly what demos/dashboard/dashboard-builder.html does for its
|
|
29
29
|
* focus ring and pin marker).
|
|
30
30
|
*/
|
|
31
|
-
import type { DashboardWidgetSpec } from './dashboard';
|
|
31
|
+
import type { DashboardWidgetSpec } from './dashboard.js';
|
|
32
32
|
/** The signature every renderer here (and `renderWidget`) satisfies. */
|
|
33
33
|
export type WidgetRenderer = (widget: DashboardWidgetSpec, host: HTMLElement) => void;
|
|
34
34
|
/** `kind: 'kpi'` — one headline number, an optional change, an optional trend. */
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
/**
|
|
3
2
|
* BUILT-IN WIDGET RENDERERS — what `kind` means when you write no `renderWidget`.
|
|
4
3
|
*
|
|
@@ -29,11 +28,9 @@
|
|
|
29
28
|
* (that is exactly what demos/dashboard/dashboard-builder.html does for its
|
|
30
29
|
* focus ring and pin marker).
|
|
31
30
|
*/
|
|
32
|
-
|
|
33
|
-
exports.defaultWidgetRenderer = exports.renderTableWidget = exports.renderFunnelWidget = exports.renderDonutWidget = exports.renderBarWidget = exports.renderLineWidget = exports.renderKpiWidget = exports.BUILT_IN_WIDGET_KINDS = void 0;
|
|
34
|
-
const styles_1 = require("./styles");
|
|
31
|
+
import { ensureDashboardKitStyles } from './styles.js';
|
|
35
32
|
/** The kinds `defaultWidgetRenderer` knows; anything else gets the placeholder. */
|
|
36
|
-
|
|
33
|
+
export const BUILT_IN_WIDGET_KINDS = ['kpi', 'line', 'bar', 'donut', 'funnel', 'table'];
|
|
37
34
|
/**
|
|
38
35
|
* Categorical default palette — readable on both light and dark cards. Per-mark
|
|
39
36
|
* overrides win (`slices[].color`); everything else cycles this list.
|
|
@@ -67,7 +64,7 @@ function niceMax(v) {
|
|
|
67
64
|
function card(host, widget, title) {
|
|
68
65
|
var _a, _b;
|
|
69
66
|
const doc = (_a = host.ownerDocument) !== null && _a !== void 0 ? _a : document;
|
|
70
|
-
|
|
67
|
+
ensureDashboardKitStyles(doc);
|
|
71
68
|
host.innerHTML = '';
|
|
72
69
|
const root = doc.createElement('div');
|
|
73
70
|
root.className = `axdb-widget axdb-widget--${(_b = widget.kind) !== null && _b !== void 0 ? _b : 'widget'}`;
|
|
@@ -97,7 +94,7 @@ const legend = (items, column = false) => `<div class="axdb-lg${column ? ' axdb-
|
|
|
97
94
|
'</div>';
|
|
98
95
|
// -- kpi ----------------------------------------------------------------------
|
|
99
96
|
/** `{ label, value, delta?, spark? }` — headline number + change + sparkline. */
|
|
100
|
-
const renderKpiWidget = (widget, host) => {
|
|
97
|
+
export const renderKpiWidget = (widget, host) => {
|
|
101
98
|
var _a;
|
|
102
99
|
const d = data(widget);
|
|
103
100
|
const body = card(host, widget, titleOf(widget, d.label));
|
|
@@ -129,7 +126,6 @@ const renderKpiWidget = (widget, host) => {
|
|
|
129
126
|
body.classList.add('axdb-kpi');
|
|
130
127
|
body.innerHTML = html;
|
|
131
128
|
};
|
|
132
|
-
exports.renderKpiWidget = renderKpiWidget;
|
|
133
129
|
// -- line ---------------------------------------------------------------------
|
|
134
130
|
/** Accept both `number[]` and `{name, values}[]`, drop anything unusable. */
|
|
135
131
|
function normalizeSeries(raw) {
|
|
@@ -145,7 +141,7 @@ function normalizeSeries(raw) {
|
|
|
145
141
|
.filter((s) => s.values.length > 0);
|
|
146
142
|
}
|
|
147
143
|
/** `{ series, labels? }` — area under the first series, a line per series. */
|
|
148
|
-
const renderLineWidget = (widget, host) => {
|
|
144
|
+
export const renderLineWidget = (widget, host) => {
|
|
149
145
|
const d = data(widget);
|
|
150
146
|
const body = card(host, widget, titleOf(widget));
|
|
151
147
|
const series = normalizeSeries(d.series);
|
|
@@ -201,10 +197,9 @@ const renderLineWidget = (widget, host) => {
|
|
|
201
197
|
`aria-label="${esc(titleOf(widget))}">${grid}${ticks}${marks}</svg>` +
|
|
202
198
|
(named.length ? legend(series.map((s, i) => { var _a; return ({ label: String((_a = s.name) !== null && _a !== void 0 ? _a : ''), color: colorAt(i) }); })) : '');
|
|
203
199
|
};
|
|
204
|
-
exports.renderLineWidget = renderLineWidget;
|
|
205
200
|
// -- bar ----------------------------------------------------------------------
|
|
206
201
|
/** `{ bars: [{label, value}] }` — columns, value above, category below. */
|
|
207
|
-
const renderBarWidget = (widget, host) => {
|
|
202
|
+
export const renderBarWidget = (widget, host) => {
|
|
208
203
|
const d = data(widget);
|
|
209
204
|
const body = card(host, widget, titleOf(widget));
|
|
210
205
|
const bars = (Array.isArray(d.bars) ? d.bars : []).filter((b) => !!b);
|
|
@@ -246,7 +241,6 @@ const renderBarWidget = (widget, host) => {
|
|
|
246
241
|
`<svg viewBox="0 0 ${W} ${H}" preserveAspectRatio="xMidYMid meet" role="img" ` +
|
|
247
242
|
`aria-label="${esc(titleOf(widget))}">${grid}${marks}</svg>`;
|
|
248
243
|
};
|
|
249
|
-
exports.renderBarWidget = renderBarWidget;
|
|
250
244
|
// -- donut --------------------------------------------------------------------
|
|
251
245
|
/** One arc of the ring, as an SVG path command. */
|
|
252
246
|
function arcPath(cx, cy, r, a0, a1) {
|
|
@@ -256,7 +250,7 @@ function arcPath(cx, cy, r, a0, a1) {
|
|
|
256
250
|
return `M${x0.toFixed(2)},${y0.toFixed(2)} A${r},${r} 0 ${a1 - a0 > Math.PI ? 1 : 0} 1 ${x1.toFixed(2)},${y1.toFixed(2)}`;
|
|
257
251
|
}
|
|
258
252
|
/** `{ slices: [{label, value, color?}], centerLabel? }` — ring + legend. */
|
|
259
|
-
const renderDonutWidget = (widget, host) => {
|
|
253
|
+
export const renderDonutWidget = (widget, host) => {
|
|
260
254
|
var _a, _b;
|
|
261
255
|
const d = data(widget);
|
|
262
256
|
const body = card(host, widget, titleOf(widget));
|
|
@@ -298,10 +292,9 @@ const renderDonutWidget = (widget, host) => {
|
|
|
298
292
|
});
|
|
299
293
|
}), true);
|
|
300
294
|
};
|
|
301
|
-
exports.renderDonutWidget = renderDonutWidget;
|
|
302
295
|
// -- funnel -------------------------------------------------------------------
|
|
303
296
|
/** `{ stages: [{label, value}] }` — centred bars scaled against the first stage. */
|
|
304
|
-
const renderFunnelWidget = (widget, host) => {
|
|
297
|
+
export const renderFunnelWidget = (widget, host) => {
|
|
305
298
|
const d = data(widget);
|
|
306
299
|
const body = card(host, widget, titleOf(widget));
|
|
307
300
|
const stages = (Array.isArray(d.stages) ? d.stages : []).filter((s) => !!s);
|
|
@@ -329,10 +322,9 @@ const renderFunnelWidget = (widget, host) => {
|
|
|
329
322
|
`<svg viewBox="0 0 ${W} ${H}" preserveAspectRatio="xMidYMid meet" role="img" ` +
|
|
330
323
|
`aria-label="${esc(titleOf(widget))}">${marks}</svg>`;
|
|
331
324
|
};
|
|
332
|
-
exports.renderFunnelWidget = renderFunnelWidget;
|
|
333
325
|
// -- table --------------------------------------------------------------------
|
|
334
326
|
/** `{ columns, rows }` — plain rows; numeric cells right-align themselves. */
|
|
335
|
-
const renderTableWidget = (widget, host) => {
|
|
327
|
+
export const renderTableWidget = (widget, host) => {
|
|
336
328
|
const d = data(widget);
|
|
337
329
|
const body = card(host, widget, titleOf(widget));
|
|
338
330
|
const columns = Array.isArray(d.columns) ? d.columns : [];
|
|
@@ -353,15 +345,14 @@ const renderTableWidget = (widget, host) => {
|
|
|
353
345
|
body.classList.add('axdb-scroll');
|
|
354
346
|
body.innerHTML = `<table class="axdb-table">${head}<tbody>${tbody}</tbody></table>`;
|
|
355
347
|
};
|
|
356
|
-
exports.renderTableWidget = renderTableWidget;
|
|
357
348
|
// -- dispatch -----------------------------------------------------------------
|
|
358
349
|
const BY_KIND = {
|
|
359
|
-
kpi:
|
|
360
|
-
line:
|
|
361
|
-
bar:
|
|
362
|
-
donut:
|
|
363
|
-
funnel:
|
|
364
|
-
table:
|
|
350
|
+
kpi: renderKpiWidget,
|
|
351
|
+
line: renderLineWidget,
|
|
352
|
+
bar: renderBarWidget,
|
|
353
|
+
donut: renderDonutWidget,
|
|
354
|
+
funnel: renderFunnelWidget,
|
|
355
|
+
table: renderTableWidget,
|
|
365
356
|
};
|
|
366
357
|
/**
|
|
367
358
|
* Paint `widget` into `host` by its `kind` — `dashboard()`'s default
|
|
@@ -371,7 +362,7 @@ const BY_KIND = {
|
|
|
371
362
|
* board of not-yet-implemented widgets still lays out and is still testable.
|
|
372
363
|
* Never throws: bad data paints an empty state.
|
|
373
364
|
*/
|
|
374
|
-
const defaultWidgetRenderer = (widget, host) => {
|
|
365
|
+
export const defaultWidgetRenderer = (widget, host) => {
|
|
375
366
|
var _a;
|
|
376
367
|
const renderer = BY_KIND[(_a = widget === null || widget === void 0 ? void 0 : widget.kind) !== null && _a !== void 0 ? _a : ''];
|
|
377
368
|
if (renderer) {
|
|
@@ -385,5 +376,4 @@ const defaultWidgetRenderer = (widget, host) => {
|
|
|
385
376
|
}
|
|
386
377
|
card(host, widget !== null && widget !== void 0 ? widget : { id: '' }, titleOf(widget !== null && widget !== void 0 ? widget : { id: '' }));
|
|
387
378
|
};
|
|
388
|
-
exports.defaultWidgetRenderer = defaultWidgetRenderer;
|
|
389
379
|
//# sourceMappingURL=widgets.js.map
|
|
@@ -14,8 +14,8 @@
|
|
|
14
14
|
* port-reconciliation code count those, and the affordance is neither a column
|
|
15
15
|
* nor a member.
|
|
16
16
|
*/
|
|
17
|
-
import type { ErColumn, ErEntitySpec } from './er';
|
|
18
|
-
import type { UmlClassSpec } from './uml';
|
|
17
|
+
import type { ErColumn, ErEntitySpec } from './er.js';
|
|
18
|
+
import type { UmlClassSpec } from './uml.js';
|
|
19
19
|
/** Row height / header height of the entity card — sizing is derived from these. */
|
|
20
20
|
export declare const ER_ROW_H = 25;
|
|
21
21
|
export declare const ER_HEAD_H = 28;
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
/**
|
|
3
2
|
* Card building — the ONE source of truth for the ER/UML card HTML trees, the
|
|
4
3
|
* layout constants and the size math.
|
|
@@ -15,46 +14,37 @@
|
|
|
15
14
|
* port-reconciliation code count those, and the affordance is neither a column
|
|
16
15
|
* nor a member.
|
|
17
16
|
*/
|
|
18
|
-
Object.defineProperty(exports, "__esModule", { value: true });
|
|
19
|
-
exports.UML_PAD = exports.UML_STEREO_H = exports.UML_NAME_H = exports.UML_LINE_H = exports.ER_ADD_H = exports.ER_BORDER_SLACK = exports.ER_HEAD_H = exports.ER_ROW_H = void 0;
|
|
20
|
-
exports.erRowCenterY = erRowCenterY;
|
|
21
|
-
exports.rowIndexFromY = rowIndexFromY;
|
|
22
|
-
exports.entityCardContent = entityCardContent;
|
|
23
|
-
exports.entityAutoHeight = entityAutoHeight;
|
|
24
|
-
exports.classCardContent = classCardContent;
|
|
25
|
-
exports.classAutoHeight = classAutoHeight;
|
|
26
|
-
exports.matchColumns = matchColumns;
|
|
27
17
|
/** Row height / header height of the entity card — sizing is derived from these. */
|
|
28
|
-
|
|
29
|
-
|
|
18
|
+
export const ER_ROW_H = 25;
|
|
19
|
+
export const ER_HEAD_H = 28;
|
|
30
20
|
/**
|
|
31
21
|
* Auto-height slack: the html wrapper's padding (8px) + the card's 1px
|
|
32
22
|
* top/bottom borders + the head rendering slightly under ER_HEAD_H. Measured
|
|
33
23
|
* live — with less, an auto-sized card overflows a few px, and the wheel
|
|
34
24
|
* delegation would steal that much scroll on EVERY card.
|
|
35
25
|
*/
|
|
36
|
-
|
|
26
|
+
export const ER_BORDER_SLACK = 9;
|
|
37
27
|
/** The editable "add column" affordance row's height (excluded from row math). */
|
|
38
|
-
|
|
28
|
+
export const ER_ADD_H = 26;
|
|
39
29
|
/** UML compartment metrics (mirrors the pre-kit demos, measured live). */
|
|
40
|
-
|
|
41
|
-
|
|
42
|
-
|
|
43
|
-
|
|
30
|
+
export const UML_LINE_H = 19;
|
|
31
|
+
export const UML_NAME_H = 30;
|
|
32
|
+
export const UML_STEREO_H = 14;
|
|
33
|
+
export const UML_PAD = 8;
|
|
44
34
|
/** Node-local y of a row's centre (the +1 offsets past the card's top border). */
|
|
45
|
-
function erRowCenterY(rowIndex) {
|
|
46
|
-
return
|
|
35
|
+
export function erRowCenterY(rowIndex) {
|
|
36
|
+
return ER_HEAD_H + rowIndex * ER_ROW_H + ER_ROW_H / 2 + 1;
|
|
47
37
|
}
|
|
48
38
|
/** Inverse of {@link erRowCenterY}: which column row a pinned port sits on. */
|
|
49
|
-
function rowIndexFromY(y) {
|
|
50
|
-
return Math.round((y -
|
|
39
|
+
export function rowIndexFromY(y) {
|
|
40
|
+
return Math.round((y - ER_HEAD_H - ER_ROW_H / 2 - 1) / ER_ROW_H);
|
|
51
41
|
}
|
|
52
42
|
/**
|
|
53
43
|
* The `.axk-entity` content tree — the SAME tree er.ts ships and update.ts
|
|
54
44
|
* regenerates. `editable` adds the delete control per row and the trailing add
|
|
55
45
|
* affordance.
|
|
56
46
|
*/
|
|
57
|
-
function entityCardContent(entity, editable = false) {
|
|
47
|
+
export function entityCardContent(entity, editable = false) {
|
|
58
48
|
var _a;
|
|
59
49
|
const rows = entity.columns.map((c) => {
|
|
60
50
|
var _a;
|
|
@@ -86,16 +76,16 @@ function entityCardContent(entity, editable = false) {
|
|
|
86
76
|
return { tag: 'div', className: 'axk-entity', children };
|
|
87
77
|
}
|
|
88
78
|
/** Card height for an entity — explicit height wins, else derived from columns. */
|
|
89
|
-
function entityAutoHeight(entity, editable = false) {
|
|
79
|
+
export function entityAutoHeight(entity, editable = false) {
|
|
90
80
|
if (entity.height != null)
|
|
91
81
|
return entity.height;
|
|
92
|
-
return
|
|
82
|
+
return ER_HEAD_H + entity.columns.length * ER_ROW_H + ER_BORDER_SLACK + (editable ? ER_ADD_H : 0);
|
|
93
83
|
}
|
|
94
84
|
/**
|
|
95
85
|
* The `.axk-uml` content tree. `editable` adds a delete control per member and
|
|
96
86
|
* a trailing add affordance in each compartment.
|
|
97
87
|
*/
|
|
98
|
-
function classCardContent(cls, editable = false) {
|
|
88
|
+
export function classCardContent(cls, editable = false) {
|
|
99
89
|
var _a, _b, _c;
|
|
100
90
|
const attrs = (_a = cls.attributes) !== null && _a !== void 0 ? _a : [];
|
|
101
91
|
const methods = (_b = cls.methods) !== null && _b !== void 0 ? _b : [];
|
|
@@ -149,17 +139,17 @@ function classCardContent(cls, editable = false) {
|
|
|
149
139
|
};
|
|
150
140
|
}
|
|
151
141
|
/** Card height for a class — explicit height wins, else derived from members. */
|
|
152
|
-
function classAutoHeight(cls, editable = false) {
|
|
142
|
+
export function classAutoHeight(cls, editable = false) {
|
|
153
143
|
var _a, _b;
|
|
154
144
|
if (cls.height != null)
|
|
155
145
|
return cls.height;
|
|
156
146
|
const attrs = (_a = cls.attributes) !== null && _a !== void 0 ? _a : [];
|
|
157
147
|
const methods = (_b = cls.methods) !== null && _b !== void 0 ? _b : [];
|
|
158
148
|
const addRows = editable ? 2 : 0; // one "add" affordance per compartment
|
|
159
|
-
return (
|
|
160
|
-
(cls.stereotype ?
|
|
161
|
-
(attrs.length + methods.length + addRows) *
|
|
162
|
-
|
|
149
|
+
return (UML_NAME_H +
|
|
150
|
+
(cls.stereotype ? UML_STEREO_H : 0) +
|
|
151
|
+
(attrs.length + methods.length + addRows) * UML_LINE_H +
|
|
152
|
+
UML_PAD * 2 +
|
|
163
153
|
12);
|
|
164
154
|
}
|
|
165
155
|
/**
|
|
@@ -175,7 +165,7 @@ function classAutoHeight(cls, editable = false) {
|
|
|
175
165
|
* what a rename is (one old + one new in the same slot). Without pass 3 a
|
|
176
166
|
* rename reads as remove+add and the edge is severed.
|
|
177
167
|
*/
|
|
178
|
-
function matchColumns(oldCols, newCols) {
|
|
168
|
+
export function matchColumns(oldCols, newCols) {
|
|
179
169
|
const out = new Map();
|
|
180
170
|
const usedNew = new Set();
|
|
181
171
|
const matchedOld = new Set();
|
|
@@ -1,4 +1,3 @@
|
|
|
1
|
-
"use strict";
|
|
2
1
|
/**
|
|
3
2
|
* In-canvas editing chrome (P2 title rename + P4 column/member editing).
|
|
4
3
|
*
|
|
@@ -27,11 +26,7 @@
|
|
|
27
26
|
* row-selection handler and the binder's node/waypoint double-click never also
|
|
28
27
|
* fire for the same gesture.
|
|
29
28
|
*/
|
|
30
|
-
|
|
31
|
-
exports.ER_TYPE_SUGGESTIONS = void 0;
|
|
32
|
-
exports.dismissInlineEditor = dismissInlineEditor;
|
|
33
|
-
exports.bindCardEditing = bindCardEditing;
|
|
34
|
-
const update_1 = require("./update");
|
|
29
|
+
import { updateEntity, updateClass, addColumnAt, removeColumnAt, renameColumnAt } from './update.js';
|
|
35
30
|
const bindings = new WeakMap();
|
|
36
31
|
const ROW_SELECTOR = '.axk-row, .axk-member';
|
|
37
32
|
/** Resolve the node id + the clicked row's global index (among selectable rows). */
|
|
@@ -72,7 +67,7 @@ function umlSection(cls, rowIndex) {
|
|
|
72
67
|
*/
|
|
73
68
|
let activeEditor = null;
|
|
74
69
|
/** Dismiss any open inline editor WITHOUT committing. */
|
|
75
|
-
function dismissInlineEditor() {
|
|
70
|
+
export function dismissInlineEditor() {
|
|
76
71
|
const open = activeEditor;
|
|
77
72
|
activeEditor = null;
|
|
78
73
|
open === null || open === void 0 ? void 0 : open.cancel();
|
|
@@ -114,7 +109,7 @@ function dedupe(values) {
|
|
|
114
109
|
return [...new Set(values)];
|
|
115
110
|
}
|
|
116
111
|
/** SQL-ish column types offered when editing a type cell. */
|
|
117
|
-
|
|
112
|
+
export const ER_TYPE_SUGGESTIONS = [
|
|
118
113
|
'uuid', 'int', 'bigint', 'smallint', 'serial', 'decimal', 'numeric', 'real', 'double',
|
|
119
114
|
'varchar', 'text', 'char', 'boolean', 'date', 'time', 'timestamp', 'timestamptz',
|
|
120
115
|
'json', 'jsonb', 'bytea', 'enum',
|
|
@@ -266,12 +261,12 @@ function beginRename(api, target) {
|
|
|
266
261
|
// Title (ER header / UML name).
|
|
267
262
|
if (target.closest('.axk-entity-head')) {
|
|
268
263
|
const ent = kitEntity(api, nodeId);
|
|
269
|
-
openInlineEditor(api, target.closest('.axk-entity-head'), (_a = ent === null || ent === void 0 ? void 0 : ent.name) !== null && _a !== void 0 ? _a : nodeId, (name) => void
|
|
264
|
+
openInlineEditor(api, target.closest('.axk-entity-head'), (_a = ent === null || ent === void 0 ? void 0 : ent.name) !== null && _a !== void 0 ? _a : nodeId, (name) => void updateEntity(api, nodeId, { name }));
|
|
270
265
|
return;
|
|
271
266
|
}
|
|
272
267
|
if (target.closest('.axk-uml-name')) {
|
|
273
268
|
const cls = kitClass(api, nodeId);
|
|
274
|
-
openInlineEditor(api, target.closest('.axk-uml-name'), (_b = cls === null || cls === void 0 ? void 0 : cls.name) !== null && _b !== void 0 ? _b : nodeId, (name) => void
|
|
269
|
+
openInlineEditor(api, target.closest('.axk-uml-name'), (_b = cls === null || cls === void 0 ? void 0 : cls.name) !== null && _b !== void 0 ? _b : nodeId, (name) => void updateClass(api, nodeId, { name }));
|
|
275
270
|
return;
|
|
276
271
|
}
|
|
277
272
|
// ER column. Which CELL was double-clicked decides what gets edited and where
|
|
@@ -288,12 +283,12 @@ function beginRename(api, target) {
|
|
|
288
283
|
return;
|
|
289
284
|
openInlineEditor(api, typeEl, (_d = (_c = ent.columns[rowIndex]) === null || _c === void 0 ? void 0 : _c.type) !== null && _d !== void 0 ? _d : '', (type) => {
|
|
290
285
|
const columns = ent.columns.map((c, i) => (i === rowIndex ? Object.assign(Object.assign({}, c), { type }) : c));
|
|
291
|
-
void
|
|
286
|
+
void updateEntity(api, nodeId, { columns });
|
|
292
287
|
},
|
|
293
288
|
// Offer the types already used in THIS diagram first, then the standards —
|
|
294
289
|
// a schema is usually internally consistent, so what you just typed
|
|
295
290
|
// elsewhere is the likeliest next value.
|
|
296
|
-
dedupe([...ent.columns.map((c) => c.type).filter(Boolean), ...
|
|
291
|
+
dedupe([...ent.columns.map((c) => c.type).filter(Boolean), ...ER_TYPE_SUGGESTIONS]));
|
|
297
292
|
return;
|
|
298
293
|
}
|
|
299
294
|
const rowEl = target.closest('.axk-row');
|
|
@@ -302,7 +297,7 @@ function beginRename(api, target) {
|
|
|
302
297
|
const ent = kitEntity(api, nodeId);
|
|
303
298
|
if (!ent)
|
|
304
299
|
return;
|
|
305
|
-
openInlineEditor(api, colEl, (_h = (_g = ent.columns[rowIndex]) === null || _g === void 0 ? void 0 : _g.name) !== null && _h !== void 0 ? _h : '', (name) => void
|
|
300
|
+
openInlineEditor(api, colEl, (_h = (_g = ent.columns[rowIndex]) === null || _g === void 0 ? void 0 : _g.name) !== null && _h !== void 0 ? _h : '', (name) => void updateEntity(api, nodeId, { columns: renameColumnAt(ent.columns, rowIndex, name) }));
|
|
306
301
|
return;
|
|
307
302
|
}
|
|
308
303
|
// UML member rename.
|
|
@@ -315,7 +310,7 @@ function beginRename(api, target) {
|
|
|
315
310
|
const list = ((_j = cls[section]) !== null && _j !== void 0 ? _j : []).slice();
|
|
316
311
|
openInlineEditor(api, (_k = memberEl.querySelector('.axk-mtext')) !== null && _k !== void 0 ? _k : memberEl, (_l = list[local]) !== null && _l !== void 0 ? _l : '', (next) => {
|
|
317
312
|
list[local] = next;
|
|
318
|
-
void
|
|
313
|
+
void updateClass(api, nodeId, { [section]: list });
|
|
319
314
|
});
|
|
320
315
|
}
|
|
321
316
|
}
|
|
@@ -330,8 +325,8 @@ function handleAdd(api, target) {
|
|
|
330
325
|
const ent = kitEntity(api, loc.nodeId);
|
|
331
326
|
if (!ent)
|
|
332
327
|
return true;
|
|
333
|
-
const columns =
|
|
334
|
-
void
|
|
328
|
+
const columns = addColumnAt(ent.columns, { name: 'new_column', type: '' });
|
|
329
|
+
void updateEntity(api, loc.nodeId, { columns }).then(() => {
|
|
335
330
|
const newRow = api.container.querySelectorAll(`[data-node-id="${cssEscape(loc.nodeId)}"] .axk-row`)[columns.length - 1];
|
|
336
331
|
const col = newRow === null || newRow === void 0 ? void 0 : newRow.querySelector('.axk-col');
|
|
337
332
|
if (col)
|
|
@@ -350,7 +345,7 @@ function handleAdd(api, target) {
|
|
|
350
345
|
const comps = Array.from(loc.group.querySelectorAll('.axk-uml-comp'));
|
|
351
346
|
const section = comps.indexOf(addUml.closest('.axk-uml-comp')) === 0 ? 'attributes' : 'methods';
|
|
352
347
|
const list = [...((_a = cls[section]) !== null && _a !== void 0 ? _a : []), section === 'attributes' ? '+ field: type' : '+ method(): void'];
|
|
353
|
-
void
|
|
348
|
+
void updateClass(api, loc.nodeId, { [section]: list });
|
|
354
349
|
return true;
|
|
355
350
|
}
|
|
356
351
|
return false;
|
|
@@ -366,7 +361,7 @@ function handleDelete(api, target) {
|
|
|
366
361
|
return true;
|
|
367
362
|
const ent = kitEntity(api, loc.nodeId);
|
|
368
363
|
if (ent) {
|
|
369
|
-
void
|
|
364
|
+
void updateEntity(api, loc.nodeId, { columns: removeColumnAt(ent.columns, loc.rowIndex) });
|
|
370
365
|
return true;
|
|
371
366
|
}
|
|
372
367
|
const cls = kitClass(api, loc.nodeId);
|
|
@@ -374,7 +369,7 @@ function handleDelete(api, target) {
|
|
|
374
369
|
const { section, local } = umlSection(cls, loc.rowIndex);
|
|
375
370
|
const list = ((_a = cls[section]) !== null && _a !== void 0 ? _a : []).slice();
|
|
376
371
|
list.splice(local, 1);
|
|
377
|
-
void
|
|
372
|
+
void updateClass(api, loc.nodeId, { [section]: list });
|
|
378
373
|
}
|
|
379
374
|
return true;
|
|
380
375
|
}
|
|
@@ -385,7 +380,7 @@ function cssEscape(id) {
|
|
|
385
380
|
* Wire the editing gestures onto a kit container. Idempotent per container
|
|
386
381
|
* (a re-bind disposes the previous one), matching `bindRowInteractions`.
|
|
387
382
|
*/
|
|
388
|
-
function bindCardEditing(api) {
|
|
383
|
+
export function bindCardEditing(api) {
|
|
389
384
|
var _a;
|
|
390
385
|
const container = api.container;
|
|
391
386
|
(_a = bindings.get(container)) === null || _a === void 0 ? void 0 : _a.dispose();
|