data-navigator 0.0.1 → 0.10.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 +2 -0
- package/dist/chunk-GP5LYFFJ.mjs +1 -0
- package/dist/chunk-JJEPMSK4.mjs +1 -0
- package/dist/chunk-KNRZ7RNY.mjs +1 -0
- package/dist/consts.js +1 -0
- package/dist/consts.mjs +1 -0
- package/dist/index.js +708 -0
- package/dist/index.mjs +584 -0
- package/dist/input.js +1 -0
- package/dist/input.mjs +1 -0
- package/dist/rendering.js +1 -0
- package/dist/rendering.mjs +1 -0
- package/dist/structure.js +1 -0
- package/dist/structure.mjs +1 -0
- package/dist/utilities.js +1 -0
- package/dist/utilities.mjs +1 -0
- package/package.json +48 -17
- package/.prettierignore +0 -21
- package/.prettierrc +0 -13
- package/index.js +0 -3
package/dist/index.mjs
ADDED
|
@@ -0,0 +1,584 @@
|
|
|
1
|
+
// src/consts.ts
|
|
2
|
+
var defaultKeyBindings = {
|
|
3
|
+
ArrowLeft: "left",
|
|
4
|
+
ArrowRight: "right",
|
|
5
|
+
ArrowUp: "up",
|
|
6
|
+
ArrowDown: "down",
|
|
7
|
+
Period: "forward",
|
|
8
|
+
Comma: "backward",
|
|
9
|
+
Escape: "parent",
|
|
10
|
+
Enter: "child"
|
|
11
|
+
};
|
|
12
|
+
var GenericFullNavigationRules = {
|
|
13
|
+
down: {
|
|
14
|
+
keyCode: "ArrowDown",
|
|
15
|
+
direction: "target"
|
|
16
|
+
},
|
|
17
|
+
left: {
|
|
18
|
+
keyCode: "ArrowLeft",
|
|
19
|
+
direction: "source"
|
|
20
|
+
},
|
|
21
|
+
right: {
|
|
22
|
+
keyCode: "ArrowRight",
|
|
23
|
+
direction: "target"
|
|
24
|
+
},
|
|
25
|
+
up: {
|
|
26
|
+
keyCode: "ArrowUp",
|
|
27
|
+
direction: "source"
|
|
28
|
+
},
|
|
29
|
+
backward: {
|
|
30
|
+
keyCode: "Comma",
|
|
31
|
+
direction: "source"
|
|
32
|
+
},
|
|
33
|
+
child: {
|
|
34
|
+
keyCode: "Enter",
|
|
35
|
+
direction: "target"
|
|
36
|
+
},
|
|
37
|
+
parent: {
|
|
38
|
+
keyCode: "Backspace",
|
|
39
|
+
direction: "source"
|
|
40
|
+
},
|
|
41
|
+
forward: {
|
|
42
|
+
keyCode: "Period",
|
|
43
|
+
direction: "target"
|
|
44
|
+
},
|
|
45
|
+
exit: {
|
|
46
|
+
keyCode: "Escape",
|
|
47
|
+
direction: "target"
|
|
48
|
+
}
|
|
49
|
+
};
|
|
50
|
+
var GenericLimitedNavigationRules = {
|
|
51
|
+
right: {
|
|
52
|
+
key: "ArrowRight",
|
|
53
|
+
direction: "target"
|
|
54
|
+
},
|
|
55
|
+
left: {
|
|
56
|
+
key: "ArrowLeft",
|
|
57
|
+
direction: "source"
|
|
58
|
+
},
|
|
59
|
+
down: {
|
|
60
|
+
key: "ArrowDown",
|
|
61
|
+
direction: "target"
|
|
62
|
+
},
|
|
63
|
+
up: {
|
|
64
|
+
key: "ArrowUp",
|
|
65
|
+
direction: "source"
|
|
66
|
+
},
|
|
67
|
+
child: {
|
|
68
|
+
key: "Enter",
|
|
69
|
+
direction: "target"
|
|
70
|
+
},
|
|
71
|
+
parent: {
|
|
72
|
+
key: "Backspace",
|
|
73
|
+
direction: "source"
|
|
74
|
+
},
|
|
75
|
+
exit: {
|
|
76
|
+
key: "Escape",
|
|
77
|
+
direction: "target"
|
|
78
|
+
},
|
|
79
|
+
undo: {
|
|
80
|
+
key: "Period",
|
|
81
|
+
direction: "target"
|
|
82
|
+
},
|
|
83
|
+
legend: {
|
|
84
|
+
key: "KeyL",
|
|
85
|
+
direction: "target"
|
|
86
|
+
}
|
|
87
|
+
};
|
|
88
|
+
var NodeElementDefaults = {
|
|
89
|
+
cssClass: "",
|
|
90
|
+
dimensions: {
|
|
91
|
+
x: 0,
|
|
92
|
+
y: 0,
|
|
93
|
+
width: 0,
|
|
94
|
+
height: 0,
|
|
95
|
+
path: ""
|
|
96
|
+
},
|
|
97
|
+
semantics: {
|
|
98
|
+
label: "",
|
|
99
|
+
elementType: "div",
|
|
100
|
+
role: "image",
|
|
101
|
+
attributes: void 0
|
|
102
|
+
},
|
|
103
|
+
parentSemantics: {
|
|
104
|
+
label: "",
|
|
105
|
+
elementType: "figure",
|
|
106
|
+
role: "figure",
|
|
107
|
+
attributes: void 0
|
|
108
|
+
},
|
|
109
|
+
existingElement: {
|
|
110
|
+
useForDimensions: false,
|
|
111
|
+
dimensions: void 0
|
|
112
|
+
}
|
|
113
|
+
};
|
|
114
|
+
|
|
115
|
+
// src/utilities.ts
|
|
116
|
+
var describeNode = (d, descriptionOptions) => {
|
|
117
|
+
const keys = Object.keys(d);
|
|
118
|
+
let description = "";
|
|
119
|
+
keys.forEach((key) => {
|
|
120
|
+
description += `${descriptionOptions && descriptionOptions.omitKeyNames ? "" : key + ": "}${d[key]}. `;
|
|
121
|
+
});
|
|
122
|
+
description += descriptionOptions && descriptionOptions.semanticLabel || "Data point.";
|
|
123
|
+
return description;
|
|
124
|
+
};
|
|
125
|
+
|
|
126
|
+
// src/structure.ts
|
|
127
|
+
var structure_default = (options) => {
|
|
128
|
+
if (options.dataType === "vega-lite" || options.dataType === "vl" || options.dataType === "Vega-Lite") {
|
|
129
|
+
return buildNodeStructureFromVegaLite(options);
|
|
130
|
+
} else {
|
|
131
|
+
console.warn(
|
|
132
|
+
"Apologies, we currently only have structure scaffolding for Vega-Lite, generic scaffolding coming soon!"
|
|
133
|
+
);
|
|
134
|
+
return;
|
|
135
|
+
}
|
|
136
|
+
};
|
|
137
|
+
var buildNodeStructureFromVegaLite = (options) => {
|
|
138
|
+
let navigationRules = GenericLimitedNavigationRules;
|
|
139
|
+
let nodes = {};
|
|
140
|
+
let edges = {};
|
|
141
|
+
let elementData = {};
|
|
142
|
+
let total = 0;
|
|
143
|
+
const includeGroup = options.groupInclusionCriteria ? options.groupInclusionCriteria : () => true;
|
|
144
|
+
const includeItem = options.itemInclusionCriteria ? options.itemInclusionCriteria : () => true;
|
|
145
|
+
const includeDataProperties = options.datumInclusionCriteria ? options.datumInclusionCriteria : () => true;
|
|
146
|
+
const offset = options.vegaLiteView._renderer._origin;
|
|
147
|
+
const groupParent = options.vegaLiteView._scenegraph.root.items[0].mark.items[0];
|
|
148
|
+
const idBuilder = (i2, level) => {
|
|
149
|
+
if (i2["data-navigator-id"]) {
|
|
150
|
+
return i2["data-navigator-id"];
|
|
151
|
+
}
|
|
152
|
+
const id = `dn-node-${level}-${total}`;
|
|
153
|
+
total++;
|
|
154
|
+
i2["data-navigator-id"] = id;
|
|
155
|
+
return id;
|
|
156
|
+
};
|
|
157
|
+
const edgeBuilder = (id) => {
|
|
158
|
+
const node = nodes[id];
|
|
159
|
+
const index = node.index;
|
|
160
|
+
const level = node.level;
|
|
161
|
+
const parent = node.parent;
|
|
162
|
+
const edgeList = [];
|
|
163
|
+
const previous = parent.items[index - 1];
|
|
164
|
+
if (previous) {
|
|
165
|
+
const previousId = idBuilder(previous, level);
|
|
166
|
+
if (nodes[previousId]) {
|
|
167
|
+
const previousEdge = `${previousId}-${node.id}`;
|
|
168
|
+
edgeList.push(previousEdge);
|
|
169
|
+
if (!edges[previousEdge]) {
|
|
170
|
+
edges[previousEdge] = {
|
|
171
|
+
source: previousId,
|
|
172
|
+
target: node.id,
|
|
173
|
+
navigationRules: ["left", "right"]
|
|
174
|
+
};
|
|
175
|
+
}
|
|
176
|
+
}
|
|
177
|
+
}
|
|
178
|
+
const next = parent.items[index + 1];
|
|
179
|
+
if (next) {
|
|
180
|
+
const nextId = idBuilder(next, level);
|
|
181
|
+
if (nodes[nextId]) {
|
|
182
|
+
const nextEdge = `${node.id}-${nextId}`;
|
|
183
|
+
edgeList.push(nextEdge);
|
|
184
|
+
if (!edges[nextEdge]) {
|
|
185
|
+
edges[nextEdge] = {
|
|
186
|
+
source: node.id,
|
|
187
|
+
target: nextId,
|
|
188
|
+
navigationRules: ["left", "right"]
|
|
189
|
+
};
|
|
190
|
+
}
|
|
191
|
+
}
|
|
192
|
+
}
|
|
193
|
+
if (level === "group" && parent.items[index].items) {
|
|
194
|
+
const g = parent.items[index].items[0].mark.items[0].items || parent.items[index].items;
|
|
195
|
+
const firstChild = g[0];
|
|
196
|
+
const firstChildId = idBuilder(firstChild, "item");
|
|
197
|
+
if (nodes[firstChildId]) {
|
|
198
|
+
const firstChildEdge = `${node.id}-${firstChildId}`;
|
|
199
|
+
edgeList.push(firstChildEdge);
|
|
200
|
+
if (!edges[firstChildEdge]) {
|
|
201
|
+
edges[firstChildEdge] = {
|
|
202
|
+
source: node.id,
|
|
203
|
+
target: firstChildId,
|
|
204
|
+
navigationRules: ["parent", "child"]
|
|
205
|
+
};
|
|
206
|
+
}
|
|
207
|
+
}
|
|
208
|
+
} else if (level === "item") {
|
|
209
|
+
const parentId = idBuilder(parent, "group");
|
|
210
|
+
if (nodes[parentId]) {
|
|
211
|
+
const parentEdge = `${parentId}-${node.id}`;
|
|
212
|
+
edgeList.push(parentEdge);
|
|
213
|
+
if (!edges[parentEdge]) {
|
|
214
|
+
edges[parentEdge] = {
|
|
215
|
+
source: parentId,
|
|
216
|
+
target: node.id,
|
|
217
|
+
navigationRules: ["parent", "child"]
|
|
218
|
+
};
|
|
219
|
+
}
|
|
220
|
+
}
|
|
221
|
+
}
|
|
222
|
+
if (options.exitFunction) {
|
|
223
|
+
edgeList.push("any-exit");
|
|
224
|
+
if (!edges["any-exit"]) {
|
|
225
|
+
edges["any-exit"] = {
|
|
226
|
+
source: options.getCurrent,
|
|
227
|
+
target: options.exitFunction,
|
|
228
|
+
navigationRules: ["exit"]
|
|
229
|
+
};
|
|
230
|
+
}
|
|
231
|
+
}
|
|
232
|
+
edgeList.push("any-undo");
|
|
233
|
+
if (!edges["any-undo"]) {
|
|
234
|
+
edges["any-undo"] = {
|
|
235
|
+
source: options.getCurrent,
|
|
236
|
+
target: options.getPrevious,
|
|
237
|
+
navigationRules: ["undo"]
|
|
238
|
+
};
|
|
239
|
+
}
|
|
240
|
+
return edgeList;
|
|
241
|
+
};
|
|
242
|
+
const nodeBuilder = (item, level, offset2, index, parent) => {
|
|
243
|
+
const id = idBuilder(item, level);
|
|
244
|
+
const renderId = "render-" + id;
|
|
245
|
+
const o = offset2 || [0, 0];
|
|
246
|
+
nodes[id] = {};
|
|
247
|
+
nodes[id].d = {};
|
|
248
|
+
nodes[id].id = id;
|
|
249
|
+
nodes[id].renderId = renderId;
|
|
250
|
+
nodes[id].index = index;
|
|
251
|
+
nodes[id].level = level;
|
|
252
|
+
nodes[id].parent = parent;
|
|
253
|
+
elementData[renderId] = {};
|
|
254
|
+
elementData[renderId].renderId = renderId;
|
|
255
|
+
elementData[renderId].dimensions = {};
|
|
256
|
+
elementData[renderId].dimensions.x = item.bounds.x1 + o[0];
|
|
257
|
+
elementData[renderId].dimensions.y = item.bounds.y1 + o[1];
|
|
258
|
+
elementData[renderId].dimensions.width = item.bounds.x2 - item.bounds.x1;
|
|
259
|
+
elementData[renderId].dimensions.height = item.bounds.y2 - item.bounds.y1;
|
|
260
|
+
elementData[renderId].cssClass = "dn-vega-lite-node";
|
|
261
|
+
if (item.datum) {
|
|
262
|
+
Object.keys(item.datum).forEach((key) => {
|
|
263
|
+
const value = item.datum[key];
|
|
264
|
+
if (includeDataProperties(key, value, item.datum, level, options.vegaLiteSpec)) {
|
|
265
|
+
nodes[id].d[options.keyRenamingHash && options.keyRenamingHash[key] ? options.keyRenamingHash[key] : key] = value;
|
|
266
|
+
}
|
|
267
|
+
});
|
|
268
|
+
}
|
|
269
|
+
elementData[renderId].semantics = {};
|
|
270
|
+
elementData[renderId].semantics.label = options.nodeDescriber ? options.nodeDescriber(nodes[id].d, item, level) : describeNode(nodes[id].d);
|
|
271
|
+
};
|
|
272
|
+
let i = 0;
|
|
273
|
+
const groups = groupParent.items;
|
|
274
|
+
groups.forEach((group) => {
|
|
275
|
+
if (includeGroup(group, i, options.vegaLiteSpec)) {
|
|
276
|
+
nodeBuilder(group, "group", offset, i, groupParent);
|
|
277
|
+
let j = 0;
|
|
278
|
+
const g = group.items[0].mark.items[0].items ? group.items[0].mark.items[0] : group;
|
|
279
|
+
g.items.forEach((item) => {
|
|
280
|
+
if (includeItem(item, j, group, options.vegaLiteSpec)) {
|
|
281
|
+
nodeBuilder(item, "item", offset, j, g);
|
|
282
|
+
}
|
|
283
|
+
j++;
|
|
284
|
+
});
|
|
285
|
+
}
|
|
286
|
+
i++;
|
|
287
|
+
});
|
|
288
|
+
Object.keys(nodes).forEach((n) => {
|
|
289
|
+
nodes[n].edges = edgeBuilder(n);
|
|
290
|
+
});
|
|
291
|
+
return {
|
|
292
|
+
nodes,
|
|
293
|
+
edges,
|
|
294
|
+
elementData,
|
|
295
|
+
navigationRules
|
|
296
|
+
};
|
|
297
|
+
};
|
|
298
|
+
|
|
299
|
+
// src/input.ts
|
|
300
|
+
var input_default = (options) => {
|
|
301
|
+
let inputHandler = {};
|
|
302
|
+
let keyBindings = defaultKeyBindings;
|
|
303
|
+
let directions = GenericFullNavigationRules;
|
|
304
|
+
inputHandler.moveTo = (id) => {
|
|
305
|
+
const target = options.structure.nodes[id];
|
|
306
|
+
if (target) {
|
|
307
|
+
return target;
|
|
308
|
+
}
|
|
309
|
+
return;
|
|
310
|
+
};
|
|
311
|
+
inputHandler.move = (currentFocus, direction) => {
|
|
312
|
+
if (currentFocus) {
|
|
313
|
+
const d = options.structure.nodes[currentFocus];
|
|
314
|
+
if (d.edges) {
|
|
315
|
+
let target = null;
|
|
316
|
+
let i = 0;
|
|
317
|
+
const navRule = directions[direction];
|
|
318
|
+
if (!navRule) {
|
|
319
|
+
return;
|
|
320
|
+
}
|
|
321
|
+
const findTarget = (rule, edge) => {
|
|
322
|
+
if (!(rule === direction)) {
|
|
323
|
+
return null;
|
|
324
|
+
}
|
|
325
|
+
let resolvedNodes = {
|
|
326
|
+
target: typeof edge.target === "string" ? edge.target : edge.target(d, currentFocus),
|
|
327
|
+
source: typeof edge.source === "string" ? edge.source : edge.source(d, currentFocus)
|
|
328
|
+
};
|
|
329
|
+
return !(resolvedNodes[navRule.direction] === currentFocus) ? resolvedNodes[navRule.direction] : null;
|
|
330
|
+
};
|
|
331
|
+
for (i = 0; i < d.edges.length; i++) {
|
|
332
|
+
const edge = options.structure.edges[d.edges[i]];
|
|
333
|
+
edge.navigationRules.forEach((rule) => {
|
|
334
|
+
if (!target) {
|
|
335
|
+
target = findTarget(rule, edge);
|
|
336
|
+
}
|
|
337
|
+
});
|
|
338
|
+
if (target) {
|
|
339
|
+
break;
|
|
340
|
+
}
|
|
341
|
+
}
|
|
342
|
+
if (target) {
|
|
343
|
+
return inputHandler.moveTo(target);
|
|
344
|
+
}
|
|
345
|
+
return void 0;
|
|
346
|
+
}
|
|
347
|
+
}
|
|
348
|
+
};
|
|
349
|
+
inputHandler.enter = () => {
|
|
350
|
+
if (options.entryPoint) {
|
|
351
|
+
return inputHandler.moveTo(options.entryPoint);
|
|
352
|
+
} else {
|
|
353
|
+
console.error("No entry point was specified in InputOptions, returning undefined");
|
|
354
|
+
return;
|
|
355
|
+
}
|
|
356
|
+
};
|
|
357
|
+
inputHandler.exit = () => {
|
|
358
|
+
if (options.exitPoint) {
|
|
359
|
+
return options.exitPoint;
|
|
360
|
+
} else {
|
|
361
|
+
console.error("No exit point was specified in InputOptions, returning undefined");
|
|
362
|
+
return;
|
|
363
|
+
}
|
|
364
|
+
};
|
|
365
|
+
inputHandler.keydownValidator = (e) => {
|
|
366
|
+
const direction = keyBindings[e.code];
|
|
367
|
+
if (direction) {
|
|
368
|
+
return direction;
|
|
369
|
+
}
|
|
370
|
+
};
|
|
371
|
+
inputHandler.focus = (renderId) => {
|
|
372
|
+
const node = document.getElementById(renderId);
|
|
373
|
+
if (node) {
|
|
374
|
+
node.focus();
|
|
375
|
+
}
|
|
376
|
+
};
|
|
377
|
+
inputHandler.setNavigationKeyBindings = (navKeyBindings) => {
|
|
378
|
+
if (!navKeyBindings) {
|
|
379
|
+
keyBindings = defaultKeyBindings;
|
|
380
|
+
directions = GenericFullNavigationRules;
|
|
381
|
+
} else {
|
|
382
|
+
keyBindings = {};
|
|
383
|
+
directions = navKeyBindings;
|
|
384
|
+
Object.keys(navKeyBindings).forEach((direction) => {
|
|
385
|
+
const navOption = navKeyBindings[direction];
|
|
386
|
+
keyBindings[navOption.key] = direction;
|
|
387
|
+
});
|
|
388
|
+
}
|
|
389
|
+
};
|
|
390
|
+
inputHandler.setNavigationKeyBindings(options.navigationRules);
|
|
391
|
+
return inputHandler;
|
|
392
|
+
};
|
|
393
|
+
|
|
394
|
+
// src/rendering.ts
|
|
395
|
+
var rendering_default = (options) => {
|
|
396
|
+
let renderer = {};
|
|
397
|
+
let initialized = false;
|
|
398
|
+
let defaults = {
|
|
399
|
+
cssClass: NodeElementDefaults.cssClass,
|
|
400
|
+
dimensions: { ...NodeElementDefaults.dimensions },
|
|
401
|
+
semantics: { ...NodeElementDefaults.semantics },
|
|
402
|
+
parentSemantics: { ...NodeElementDefaults.parentSemantics },
|
|
403
|
+
existingElement: { ...NodeElementDefaults.existingElement }
|
|
404
|
+
};
|
|
405
|
+
if (options.defaults) {
|
|
406
|
+
defaults.cssClass = options.defaults.cssClass || defaults.cssClass;
|
|
407
|
+
defaults.dimensions = options.defaults.dimensions ? { ...defaults.dimensions, ...options.defaults.dimensions } : defaults.dimensions;
|
|
408
|
+
defaults.semantics = options.defaults.semantics ? { ...defaults.semantics, ...options.defaults.semantics } : defaults.semantics;
|
|
409
|
+
defaults.parentSemantics = options.defaults.parentSemantics ? { ...defaults.parentSemantics, ...options.defaults.parentSemantics } : defaults.parentSemantics;
|
|
410
|
+
defaults.existingElement = options.defaults.existingElement ? { ...defaults.existingElement, ...options.defaults.existingElement } : defaults.existingElement;
|
|
411
|
+
}
|
|
412
|
+
renderer.initialize = () => {
|
|
413
|
+
if (initialized) {
|
|
414
|
+
console.error(
|
|
415
|
+
`The renderer wrapper has already been initialized successfully, RenderingOptions.suffixId is: ${options.suffixId}. No further action was taken.`
|
|
416
|
+
);
|
|
417
|
+
return;
|
|
418
|
+
}
|
|
419
|
+
if (options.root && document.getElementById(options.root.id)) {
|
|
420
|
+
renderer.root = document.getElementById(options.root.id);
|
|
421
|
+
} else {
|
|
422
|
+
console.error(
|
|
423
|
+
"No root element found, cannot build: RenderingOptions.root.id must reference an existing DOM element in order to render children."
|
|
424
|
+
);
|
|
425
|
+
return;
|
|
426
|
+
}
|
|
427
|
+
renderer.root.style.position = "relative";
|
|
428
|
+
renderer.root.classList.add("dn-root");
|
|
429
|
+
if (!options.suffixId) {
|
|
430
|
+
console.error("No suffix id found: options.suffixId must be specified.");
|
|
431
|
+
return;
|
|
432
|
+
}
|
|
433
|
+
renderer.wrapper = document.createElement("div");
|
|
434
|
+
renderer.wrapper.id = "dn-wrapper-" + options.suffixId;
|
|
435
|
+
renderer.wrapper.classList.add("dn-wrapper");
|
|
436
|
+
renderer.wrapper.style.width = options.root && options.root.width ? options.root.width : "100%";
|
|
437
|
+
if (options.root && options.root.height) {
|
|
438
|
+
renderer.wrapper.style.height = options.root.height;
|
|
439
|
+
}
|
|
440
|
+
if (options.entryButton && options.entryButton.include) {
|
|
441
|
+
renderer.entryButton = document.createElement("button");
|
|
442
|
+
renderer.entryButton.id = "dn-entry-button-" + options.suffixId;
|
|
443
|
+
renderer.entryButton.classList.add("dn-entry-button");
|
|
444
|
+
renderer.entryButton.innerText = `Enter navigation area`;
|
|
445
|
+
if (options.entryButton.callbacks && options.entryButton.callbacks.click) {
|
|
446
|
+
renderer.entryButton.addEventListener("click", options.entryButton.callbacks.click);
|
|
447
|
+
}
|
|
448
|
+
if (options.entryButton.callbacks && options.entryButton.callbacks.focus) {
|
|
449
|
+
renderer.entryButton.addEventListener("focus", options.entryButton.callbacks.focus);
|
|
450
|
+
}
|
|
451
|
+
renderer.wrapper.appendChild(renderer.entryButton);
|
|
452
|
+
}
|
|
453
|
+
renderer.root.appendChild(renderer.wrapper);
|
|
454
|
+
if (options.exitElement && options.exitElement.include) {
|
|
455
|
+
renderer.exitElement = document.createElement("div");
|
|
456
|
+
renderer.exitElement.id = "dn-exit-" + options.suffixId;
|
|
457
|
+
renderer.exitElement.classList.add("dn-exit-position");
|
|
458
|
+
renderer.exitElement.innerText = `End of data structure.`;
|
|
459
|
+
renderer.exitElement.setAttribute("aria-label", `End of data structure.`);
|
|
460
|
+
renderer.exitElement.setAttribute("role", "note");
|
|
461
|
+
renderer.exitElement.setAttribute("tabindex", "-1");
|
|
462
|
+
renderer.exitElement.style.display = "none";
|
|
463
|
+
renderer.exitElement.addEventListener("focus", (e) => {
|
|
464
|
+
renderer.exitElement.style.display = "block";
|
|
465
|
+
renderer.clearStructure();
|
|
466
|
+
if (options.exitElement.callbacks && options.exitElement.callbacks.focus) {
|
|
467
|
+
options.exitElement.callbacks.focus(e);
|
|
468
|
+
}
|
|
469
|
+
});
|
|
470
|
+
renderer.exitElement.addEventListener("blur", (e) => {
|
|
471
|
+
renderer.exitElement.style.display = "none";
|
|
472
|
+
if (options.exitElement.callbacks && options.exitElement.callbacks.blur) {
|
|
473
|
+
options.exitElement.callbacks.blur(e);
|
|
474
|
+
}
|
|
475
|
+
});
|
|
476
|
+
renderer.root.appendChild(renderer.exitElement);
|
|
477
|
+
}
|
|
478
|
+
initialized = true;
|
|
479
|
+
return renderer.root;
|
|
480
|
+
};
|
|
481
|
+
renderer.render = (nodeData) => {
|
|
482
|
+
const id = nodeData.renderId;
|
|
483
|
+
let d = options.elementData[id];
|
|
484
|
+
if (!d) {
|
|
485
|
+
console.warn(`Render data not found with renderId: ${id}. Failed to render.`);
|
|
486
|
+
return;
|
|
487
|
+
}
|
|
488
|
+
if (!initialized) {
|
|
489
|
+
console.error("render() was called before initialize(), renderer must be initialized first.");
|
|
490
|
+
return;
|
|
491
|
+
}
|
|
492
|
+
let useExisting = false;
|
|
493
|
+
let existingDimensions = {};
|
|
494
|
+
const resolveProp = (prop, subprop, checkExisting) => {
|
|
495
|
+
const p1 = d[prop] || defaults[prop];
|
|
496
|
+
const s1 = !(checkExisting && useExisting) ? p1[subprop] : existingDimensions[subprop];
|
|
497
|
+
const s2 = defaults[prop][subprop];
|
|
498
|
+
return typeof p1 === "function" ? p1(d, nodeData.datum) : typeof s1 === "function" ? s1(d, nodeData.datum) : s1 || s2 || (!subprop ? p1 : void 0);
|
|
499
|
+
};
|
|
500
|
+
useExisting = resolveProp("existingElement", "useForDimensions");
|
|
501
|
+
existingDimensions = resolveProp("existingElement", "dimensions");
|
|
502
|
+
const width = parseFloat(resolveProp("dimensions", "width", true) || 0);
|
|
503
|
+
const height = parseFloat(resolveProp("dimensions", "height", true) || 0);
|
|
504
|
+
const x = parseFloat(resolveProp("dimensions", "x", true) || 0);
|
|
505
|
+
const y = parseFloat(resolveProp("dimensions", "y", true) || 0);
|
|
506
|
+
const node = document.createElement(resolveProp("parentSemantics", "elementType"));
|
|
507
|
+
const wrapperAttrs = resolveProp("parentSemantics", "attributes");
|
|
508
|
+
if (typeof wrapperAttrs === "object") {
|
|
509
|
+
Object.keys(wrapperAttrs).forEach((wrapperAttr) => {
|
|
510
|
+
node.setAttribute(wrapperAttr, wrapperAttrs[wrapperAttr]);
|
|
511
|
+
});
|
|
512
|
+
}
|
|
513
|
+
node.setAttribute("role", resolveProp("parentSemantics", "role"));
|
|
514
|
+
node.id = id;
|
|
515
|
+
node.classList.add("dn-node");
|
|
516
|
+
node.classList.add(resolveProp("cssClass"));
|
|
517
|
+
node.style.width = width + "px";
|
|
518
|
+
node.style.height = height + "px";
|
|
519
|
+
node.style.left = x + "px";
|
|
520
|
+
node.style.top = y + "px";
|
|
521
|
+
node.setAttribute("tabindex", "-1");
|
|
522
|
+
const nodeText = document.createElement(resolveProp("semantics", "elementType"));
|
|
523
|
+
const attributes = resolveProp("semantics", "attributes");
|
|
524
|
+
if (typeof attributes === "object") {
|
|
525
|
+
Object.keys(attributes).forEach((attribute) => {
|
|
526
|
+
node.setAttribute(attribute, attributes[attribute]);
|
|
527
|
+
});
|
|
528
|
+
}
|
|
529
|
+
nodeText.setAttribute("role", resolveProp("semantics", "role"));
|
|
530
|
+
nodeText.classList.add("dn-node-text");
|
|
531
|
+
if (d.showText) {
|
|
532
|
+
nodeText.innerText = d.semantics.label;
|
|
533
|
+
}
|
|
534
|
+
const label = resolveProp("semantics", "label");
|
|
535
|
+
if (!label) {
|
|
536
|
+
console.error(
|
|
537
|
+
"Accessibility error: a label must be supplied to every rendered element using semantics.label."
|
|
538
|
+
);
|
|
539
|
+
}
|
|
540
|
+
nodeText.setAttribute("aria-label", label);
|
|
541
|
+
node.appendChild(nodeText);
|
|
542
|
+
const hasPath = resolveProp("dimensions", "path");
|
|
543
|
+
if (hasPath) {
|
|
544
|
+
const totalWidth = width + x + 10;
|
|
545
|
+
const totalHeight = height + y + 10;
|
|
546
|
+
const svg = document.createElementNS("http://www.w3.org/2000/svg", "svg");
|
|
547
|
+
svg.setAttribute("width", totalWidth + "");
|
|
548
|
+
svg.setAttribute("height", totalHeight + "");
|
|
549
|
+
svg.setAttribute("viewBox", `0 0 ${totalWidth} ${totalHeight}`);
|
|
550
|
+
svg.style.left = -x + "";
|
|
551
|
+
svg.style.top = -y + "";
|
|
552
|
+
svg.classList.add("dn-node-svg");
|
|
553
|
+
svg.setAttribute("role", "presentation");
|
|
554
|
+
svg.setAttribute("focusable", "false");
|
|
555
|
+
const path = document.createElementNS("http://www.w3.org/2000/svg", "path");
|
|
556
|
+
path.setAttribute("d", hasPath);
|
|
557
|
+
path.classList.add("dn-node-path");
|
|
558
|
+
svg.appendChild(path);
|
|
559
|
+
node.appendChild(svg);
|
|
560
|
+
}
|
|
561
|
+
renderer.wrapper.appendChild(node);
|
|
562
|
+
return node;
|
|
563
|
+
};
|
|
564
|
+
renderer.remove = (renderId) => {
|
|
565
|
+
const node = document.getElementById(renderId);
|
|
566
|
+
if (node) {
|
|
567
|
+
node.remove();
|
|
568
|
+
}
|
|
569
|
+
};
|
|
570
|
+
renderer.clearStructure = () => {
|
|
571
|
+
[...renderer.wrapper.children].forEach((child) => {
|
|
572
|
+
if (!(renderer.entryButton && renderer.entryButton === child)) {
|
|
573
|
+
renderer.remove(child.id);
|
|
574
|
+
}
|
|
575
|
+
});
|
|
576
|
+
};
|
|
577
|
+
return renderer;
|
|
578
|
+
};
|
|
579
|
+
|
|
580
|
+
// src/index.ts
|
|
581
|
+
var src_default = { structure: structure_default, input: input_default, rendering: rendering_default };
|
|
582
|
+
export {
|
|
583
|
+
src_default as default
|
|
584
|
+
};
|
package/dist/input.js
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
var e=Object.defineProperty;var r=Object.getOwnPropertyDescriptor;var t=Object.getOwnPropertyNames;var n=Object.prototype.hasOwnProperty;var o=function(r,t){for(var n in t)e(r,n,{get:t[n],enumerable:!0})},i=function(o,i,a,u){var c=true,f=false,d=undefined;if(i&&typeof i=="object"||typeof i=="function")try{var s=function(){var t=l.value;!n.call(o,t)&&t!==a&&e(o,t,{get:function(){return i[t]},enumerable:!(u=r(i,t))||u.enumerable})};for(var v=t(i)[Symbol.iterator](),l;!(c=(l=v.next()).done);c=true)s()}catch(e){f=true;d=e}finally{try{if(!c&&v.return!=null){v.return()}}finally{if(f){throw d}}}return o};var a=function(r){return i(e({},"__esModule",{value:!0}),r)};var u={};o(u,{default:function(){return d}});module.exports=a(u);var c={ArrowLeft:"left",ArrowRight:"right",ArrowUp:"up",ArrowDown:"down",Period:"forward",Comma:"backward",Escape:"parent",Enter:"child"},f={down:{keyCode:"ArrowDown",direction:"target"},left:{keyCode:"ArrowLeft",direction:"source"},right:{keyCode:"ArrowRight",direction:"target"},up:{keyCode:"ArrowUp",direction:"source"},backward:{keyCode:"Comma",direction:"source"},child:{keyCode:"Enter",direction:"target"},parent:{keyCode:"Backspace",direction:"source"},forward:{keyCode:"Period",direction:"target"},exit:{keyCode:"Escape",direction:"target"}};var d=function(e){var r={},t=c,n=f;return r.moveTo=function(r){var t=e.structure.nodes[r];if(t)return t},r.move=function(t,o){if(t){var i=e.structure.nodes[t];if(i.edges){var a=function(){var r=e.structure.edges[i.edges[c]];if(r.navigationRules.forEach(function(e){u||(u=d(e,r))}),u)return"break"};var u=null,c=0,f=n[o];if(!f)return;var d=function(e,r){if(e!==o)return null;var n={target:typeof r.target=="string"?r.target:r.target(i,t),source:typeof r.source=="string"?r.source:r.source(i,t)};return n[f.direction]!==t?n[f.direction]:null};for(c=0;c<i.edges.length;c++){var s=a();if(s==="break")break}return u?r.moveTo(u):void 0}}},r.enter=function(){if(e.entryPoint)return r.moveTo(e.entryPoint);console.error("No entry point was specified in InputOptions, returning undefined")},r.exit=function(){if(e.exitPoint)return e.exitPoint;console.error("No exit point was specified in InputOptions, returning undefined")},r.keydownValidator=function(e){var r=t[e.code];if(r)return r},r.focus=function(e){var r=document.getElementById(e);r&&r.focus()},r.setNavigationKeyBindings=function(e){e?(t={},n=e,Object.keys(e).forEach(function(r){var n=e[r];t[n.key]=r})):(t=c,n=f)},r.setNavigationKeyBindings(e.navigationRules),r};
|
package/dist/input.mjs
ADDED
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{a as c,b as g}from"./chunk-GP5LYFFJ.mjs";var m=r=>{let n={},u=c,a=g;return n.moveTo=e=>{let t=r.structure.nodes[e];if(t)return t},n.move=(e,t)=>{if(e){let o=r.structure.nodes[e];if(o.edges){let s=null,l=0,d=a[t];if(!d)return;let p=(f,i)=>{if(f!==t)return null;let y={target:typeof i.target=="string"?i.target:i.target(o,e),source:typeof i.source=="string"?i.source:i.source(o,e)};return y[d.direction]!==e?y[d.direction]:null};for(l=0;l<o.edges.length;l++){let f=r.structure.edges[o.edges[l]];if(f.navigationRules.forEach(i=>{s||(s=p(i,f))}),s)break}return s?n.moveTo(s):void 0}}},n.enter=()=>{if(r.entryPoint)return n.moveTo(r.entryPoint);console.error("No entry point was specified in InputOptions, returning undefined")},n.exit=()=>{if(r.exitPoint)return r.exitPoint;console.error("No exit point was specified in InputOptions, returning undefined")},n.keydownValidator=e=>{let t=u[e.code];if(t)return t},n.focus=e=>{let t=document.getElementById(e);t&&t.focus()},n.setNavigationKeyBindings=e=>{e?(u={},a=e,Object.keys(e).forEach(t=>{let o=e[t];u[o.key]=t})):(u=c,a=g)},n.setNavigationKeyBindings(r.navigationRules),n};export{m as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
function e(e,t){if(t==null||t>e.length)t=e.length;for(var n=0,r=new Array(t);n<t;n++)r[n]=e[n];return r}function t(t){if(Array.isArray(t))return e(t)}function n(e,t,n){if(t in e){Object.defineProperty(e,t,{value:n,enumerable:true,configurable:true,writable:true})}else{e[t]=n}return e}function r(e){if(typeof Symbol!=="undefined"&&e[Symbol.iterator]!=null||e["@@iterator"]!=null)return Array.from(e)}function i(){throw new TypeError("Invalid attempt to spread non-iterable instance.\\nIn order to be iterable, non-array objects must have a [Symbol.iterator]() method.")}function s(e){for(var t=1;t<arguments.length;t++){var r=arguments[t]!=null?arguments[t]:{};var i=Object.keys(r);if(typeof Object.getOwnPropertySymbols==="function"){i=i.concat(Object.getOwnPropertySymbols(r).filter(function(e){return Object.getOwnPropertyDescriptor(r,e).enumerable}))}i.forEach(function(t){n(e,t,r[t])})}return e}function a(e){return t(e)||r(e)||o(e)||i()}function o(t,n){if(!t)return;if(typeof t==="string")return e(t,n);var r=Object.prototype.toString.call(t).slice(8,-1);if(r==="Object"&&t.constructor)r=t.constructor.name;if(r==="Map"||r==="Set")return Array.from(r);if(r==="Arguments"||/^(?:Ui|I)nt(?:8|16|32)(?:Clamped)?Array$/.test(r))return e(t,n)}var l=Object.defineProperty;var c=Object.getOwnPropertyDescriptor;var u=Object.getOwnPropertyNames;var d=Object.prototype.hasOwnProperty;var m=function(e,t){for(var n in t)l(e,n,{get:t[n],enumerable:!0})},f=function(e,t,n,r){var i=true,s=false,a=undefined;if(t&&typeof t=="object"||typeof t=="function")try{var o=function(){var i=f.value;!d.call(e,i)&&i!==n&&l(e,i,{get:function(){return t[i]},enumerable:!(r=c(t,i))||r.enumerable})};for(var m=u(t)[Symbol.iterator](),f;!(i=(f=m.next()).done);i=true)o()}catch(e){s=true;a=e}finally{try{if(!i&&m.return!=null){m.return()}}finally{if(s){throw a}}}return e};var p=function(e){return f(l({},"__esModule",{value:!0}),e)};var b={};m(b,{default:function(){return x}});module.exports=p(b);var y={cssClass:"",dimensions:{x:0,y:0,width:0,height:0,path:""},semantics:{label:"",elementType:"div",role:"image",attributes:void 0},parentSemantics:{label:"",elementType:"figure",role:"figure",attributes:void 0},existingElement:{useForDimensions:!1,dimensions:void 0}};var x=function(e){var t={},n=!1,r={cssClass:y.cssClass,dimensions:s({},y.dimensions),semantics:s({},y.semantics),parentSemantics:s({},y.parentSemantics),existingElement:s({},y.existingElement)};return e.defaults&&(r.cssClass=e.defaults.cssClass||r.cssClass,r.dimensions=e.defaults.dimensions?s({},r.dimensions,e.defaults.dimensions):r.dimensions,r.semantics=e.defaults.semantics?s({},r.semantics,e.defaults.semantics):r.semantics,r.parentSemantics=e.defaults.parentSemantics?s({},r.parentSemantics,e.defaults.parentSemantics):r.parentSemantics,r.existingElement=e.defaults.existingElement?s({},r.existingElement,e.defaults.existingElement):r.existingElement),t.initialize=function(){if(n){console.error("The renderer wrapper has already been initialized successfully, RenderingOptions.suffixId is: ".concat(e.suffixId,". No further action was taken."));return}if(e.root&&document.getElementById(e.root.id))t.root=document.getElementById(e.root.id);else{console.error("No root element found, cannot build: RenderingOptions.root.id must reference an existing DOM element in order to render children.");return}if(t.root.style.position="relative",t.root.classList.add("dn-root"),!e.suffixId){console.error("No suffix id found: options.suffixId must be specified.");return}return t.wrapper=document.createElement("div"),t.wrapper.id="dn-wrapper-"+e.suffixId,t.wrapper.classList.add("dn-wrapper"),t.wrapper.style.width=e.root&&e.root.width?e.root.width:"100%",e.root&&e.root.height&&(t.wrapper.style.height=e.root.height),e.entryButton&&e.entryButton.include&&(t.entryButton=document.createElement("button"),t.entryButton.id="dn-entry-button-"+e.suffixId,t.entryButton.classList.add("dn-entry-button"),t.entryButton.innerText="Enter navigation area",e.entryButton.callbacks&&e.entryButton.callbacks.click&&t.entryButton.addEventListener("click",e.entryButton.callbacks.click),e.entryButton.callbacks&&e.entryButton.callbacks.focus&&t.entryButton.addEventListener("focus",e.entryButton.callbacks.focus),t.wrapper.appendChild(t.entryButton)),t.root.appendChild(t.wrapper),e.exitElement&&e.exitElement.include&&(t.exitElement=document.createElement("div"),t.exitElement.id="dn-exit-"+e.suffixId,t.exitElement.classList.add("dn-exit-position"),t.exitElement.innerText="End of data structure.",t.exitElement.setAttribute("aria-label","End of data structure."),t.exitElement.setAttribute("role","note"),t.exitElement.setAttribute("tabindex","-1"),t.exitElement.style.display="none",t.exitElement.addEventListener("focus",function(n){t.exitElement.style.display="block",t.clearStructure(),e.exitElement.callbacks&&e.exitElement.callbacks.focus&&e.exitElement.callbacks.focus(n)}),t.exitElement.addEventListener("blur",function(n){t.exitElement.style.display="none",e.exitElement.callbacks&&e.exitElement.callbacks.blur&&e.exitElement.callbacks.blur(n)}),t.root.appendChild(t.exitElement)),n=!0,t.root},t.render=function(i){var s=i.renderId,a=e.elementData[s];if(!a){console.warn("Render data not found with renderId: ".concat(s,". Failed to render."));return}if(!n){console.error("render() was called before initialize(), renderer must be initialized first.");return}var o=!1,l={},c=function(e,t,n){var s=a[e]||r[e],c=n&&o?l[t]:s[t],u=r[e][t];return typeof s=="function"?s(a,i.datum):typeof c=="function"?c(a,i.datum):c||u||(t?void 0:s)};o=c("existingElement","useForDimensions"),l=c("existingElement","dimensions");var u=parseFloat(c("dimensions","width",!0)||0),d=parseFloat(c("dimensions","height",!0)||0),m=parseFloat(c("dimensions","x",!0)||0),f=parseFloat(c("dimensions","y",!0)||0),p=document.createElement(c("parentSemantics","elementType")),b=c("parentSemantics","attributes");typeof b=="object"&&Object.keys(b).forEach(function(e){p.setAttribute(e,b[e])}),p.setAttribute("role",c("parentSemantics","role")),p.id=s,p.classList.add("dn-node"),p.classList.add(c("cssClass")),p.style.width=u+"px",p.style.height=d+"px",p.style.left=m+"px",p.style.top=f+"px",p.setAttribute("tabindex","-1");var y=document.createElement(c("semantics","elementType")),x=c("semantics","attributes");typeof x=="object"&&Object.keys(x).forEach(function(e){p.setAttribute(e,x[e])}),y.setAttribute("role",c("semantics","role")),y.classList.add("dn-node-text"),a.showText&&(y.innerText=a.semantics.label);var v=c("semantics","label");v||console.error("Accessibility error: a label must be supplied to every rendered element using semantics.label."),y.setAttribute("aria-label",v),p.appendChild(y);var h=c("dimensions","path");if(h){var E=u+m+10,g=d+f+10,w=document.createElementNS("http://www.w3.org/2000/svg","svg");w.setAttribute("width",E+""),w.setAttribute("height",g+""),w.setAttribute("viewBox","0 0 ".concat(E," ").concat(g)),w.style.left=-m+"",w.style.top=-f+"",w.classList.add("dn-node-svg"),w.setAttribute("role","presentation"),w.setAttribute("focusable","false");var A=document.createElementNS("http://www.w3.org/2000/svg","path");A.setAttribute("d",h),A.classList.add("dn-node-path"),w.appendChild(A),p.appendChild(w)}return t.wrapper.appendChild(p),p},t.remove=function(e){var t=document.getElementById(e);t&&t.remove()},t.clearStructure=function(){a(t.wrapper.children).forEach(function(e){t.entryButton&&t.entryButton===e||t.remove(e.id)})},t};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{d as m}from"./chunk-GP5LYFFJ.mjs";var L=t=>{let e={},x=!1,n={cssClass:m.cssClass,dimensions:{...m.dimensions},semantics:{...m.semantics},parentSemantics:{...m.parentSemantics},existingElement:{...m.existingElement}};return t.defaults&&(n.cssClass=t.defaults.cssClass||n.cssClass,n.dimensions=t.defaults.dimensions?{...n.dimensions,...t.defaults.dimensions}:n.dimensions,n.semantics=t.defaults.semantics?{...n.semantics,...t.defaults.semantics}:n.semantics,n.parentSemantics=t.defaults.parentSemantics?{...n.parentSemantics,...t.defaults.parentSemantics}:n.parentSemantics,n.existingElement=t.defaults.existingElement?{...n.existingElement,...t.defaults.existingElement}:n.existingElement),e.initialize=()=>{if(x){console.error(`The renderer wrapper has already been initialized successfully, RenderingOptions.suffixId is: ${t.suffixId}. No further action was taken.`);return}if(t.root&&document.getElementById(t.root.id))e.root=document.getElementById(t.root.id);else{console.error("No root element found, cannot build: RenderingOptions.root.id must reference an existing DOM element in order to render children.");return}if(e.root.style.position="relative",e.root.classList.add("dn-root"),!t.suffixId){console.error("No suffix id found: options.suffixId must be specified.");return}return e.wrapper=document.createElement("div"),e.wrapper.id="dn-wrapper-"+t.suffixId,e.wrapper.classList.add("dn-wrapper"),e.wrapper.style.width=t.root&&t.root.width?t.root.width:"100%",t.root&&t.root.height&&(e.wrapper.style.height=t.root.height),t.entryButton&&t.entryButton.include&&(e.entryButton=document.createElement("button"),e.entryButton.id="dn-entry-button-"+t.suffixId,e.entryButton.classList.add("dn-entry-button"),e.entryButton.innerText="Enter navigation area",t.entryButton.callbacks&&t.entryButton.callbacks.click&&e.entryButton.addEventListener("click",t.entryButton.callbacks.click),t.entryButton.callbacks&&t.entryButton.callbacks.focus&&e.entryButton.addEventListener("focus",t.entryButton.callbacks.focus),e.wrapper.appendChild(e.entryButton)),e.root.appendChild(e.wrapper),t.exitElement&&t.exitElement.include&&(e.exitElement=document.createElement("div"),e.exitElement.id="dn-exit-"+t.suffixId,e.exitElement.classList.add("dn-exit-position"),e.exitElement.innerText="End of data structure.",e.exitElement.setAttribute("aria-label","End of data structure."),e.exitElement.setAttribute("role","note"),e.exitElement.setAttribute("tabindex","-1"),e.exitElement.style.display="none",e.exitElement.addEventListener("focus",r=>{e.exitElement.style.display="block",e.clearStructure(),t.exitElement.callbacks&&t.exitElement.callbacks.focus&&t.exitElement.callbacks.focus(r)}),e.exitElement.addEventListener("blur",r=>{e.exitElement.style.display="none",t.exitElement.callbacks&&t.exitElement.callbacks.blur&&t.exitElement.callbacks.blur(r)}),e.root.appendChild(e.exitElement)),x=!0,e.root},e.render=r=>{let u=r.renderId,o=t.elementData[u];if(!o){console.warn(`Render data not found with renderId: ${u}. Failed to render.`);return}if(!x){console.error("render() was called before initialize(), renderer must be initialized first.");return}let g=!1,w={},s=(a,c,l)=>{let d=o[a]||n[a],p=l&&g?w[c]:d[c],S=n[a][c];return typeof d=="function"?d(o,r.datum):typeof p=="function"?p(o,r.datum):p||S||(c?void 0:d)};g=s("existingElement","useForDimensions"),w=s("existingElement","dimensions");let B=parseFloat(s("dimensions","width",!0)||0),k=parseFloat(s("dimensions","height",!0)||0),b=parseFloat(s("dimensions","x",!0)||0),y=parseFloat(s("dimensions","y",!0)||0),i=document.createElement(s("parentSemantics","elementType")),E=s("parentSemantics","attributes");typeof E=="object"&&Object.keys(E).forEach(a=>{i.setAttribute(a,E[a])}),i.setAttribute("role",s("parentSemantics","role")),i.id=u,i.classList.add("dn-node"),i.classList.add(s("cssClass")),i.style.width=B+"px",i.style.height=k+"px",i.style.left=b+"px",i.style.top=y+"px",i.setAttribute("tabindex","-1");let f=document.createElement(s("semantics","elementType")),h=s("semantics","attributes");typeof h=="object"&&Object.keys(h).forEach(a=>{i.setAttribute(a,h[a])}),f.setAttribute("role",s("semantics","role")),f.classList.add("dn-node-text"),o.showText&&(f.innerText=o.semantics.label);let v=s("semantics","label");v||console.error("Accessibility error: a label must be supplied to every rendered element using semantics.label."),f.setAttribute("aria-label",v),i.appendChild(f);let A=s("dimensions","path");if(A){let a=B+b+10,c=k+y+10,l=document.createElementNS("http://www.w3.org/2000/svg","svg");l.setAttribute("width",a+""),l.setAttribute("height",c+""),l.setAttribute("viewBox",`0 0 ${a} ${c}`),l.style.left=-b+"",l.style.top=-y+"",l.classList.add("dn-node-svg"),l.setAttribute("role","presentation"),l.setAttribute("focusable","false");let d=document.createElementNS("http://www.w3.org/2000/svg","path");d.setAttribute("d",A),d.classList.add("dn-node-path"),l.appendChild(d),i.appendChild(l)}return e.wrapper.appendChild(i),i},e.remove=r=>{let u=document.getElementById(r);u&&u.remove()},e.clearStructure=()=>{[...e.wrapper.children].forEach(r=>{e.entryButton&&e.entryButton===r||e.remove(r.id)})},e};export{L as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
var e=Object.defineProperty;var t=Object.getOwnPropertyDescriptor;var r=Object.getOwnPropertyNames;var n=Object.prototype.hasOwnProperty;var i=function(t,r){for(var n in r)e(t,n,{get:r[n],enumerable:!0})},a=function(i,a,o,u){var c=true,s=false,d=undefined;if(a&&typeof a=="object"||typeof a=="function")try{var g=function(){var r=f.value;!n.call(i,r)&&r!==o&&e(i,r,{get:function(){return a[r]},enumerable:!(u=t(a,r))||u.enumerable})};for(var l=r(a)[Symbol.iterator](),f;!(c=(f=l.next()).done);c=true)g()}catch(e){s=true;d=e}finally{try{if(!c&&l.return!=null){l.return()}}finally{if(s){throw d}}}return i};var o=function(t){return a(e({},"__esModule",{value:!0}),t)};var u={};i(u,{buildNodeStructure:function(){return l},buildNodeStructureFromVegaLite:function(){return g},default:function(){return d}});module.exports=o(u);var c={right:{key:"ArrowRight",direction:"target"},left:{key:"ArrowLeft",direction:"source"},down:{key:"ArrowDown",direction:"target"},up:{key:"ArrowUp",direction:"source"},child:{key:"Enter",direction:"target"},parent:{key:"Backspace",direction:"source"},exit:{key:"Escape",direction:"target"},undo:{key:"Period",direction:"target"},legend:{key:"KeyL",direction:"target"}};var s=function(e,t){var r=Object.keys(e),n="";return r.forEach(function(r){n+="".concat(t&&t.omitKeyNames?"":r+": ").concat(e[r],". ")}),n+=t&&t.semanticLabel||"Data point.",n};var d=function(e){if(e.dataType==="vega-lite"||e.dataType==="vl"||e.dataType==="Vega-Lite")return g(e);console.warn("Apologies, we currently only have structure scaffolding for Vega-Lite, generic scaffolding coming soon!")},g=function(e){var t=c,r={},n={},i={},a=0,o=e.groupInclusionCriteria?e.groupInclusionCriteria:function(){return!0},u=e.itemInclusionCriteria?e.itemInclusionCriteria:function(){return!0},d=e.datumInclusionCriteria?e.datumInclusionCriteria:function(){return!0},g=e.vegaLiteView._renderer._origin,l=e.vegaLiteView._scenegraph.root.items[0].mark.items[0],f=function(e,t){if(e["data-navigator-id"])return e["data-navigator-id"];var r="dn-node-".concat(t,"-").concat(a);return a++,e["data-navigator-id"]=r,r},m=function(t){var i=r[t],a=i.index,o=i.level,u=i.parent,c=[],s=u.items[a-1];if(s){var d=f(s,o);if(r[d]){var g="".concat(d,"-").concat(i.id);c.push(g),n[g]||(n[g]={source:d,target:i.id,navigationRules:["left","right"]})}}var l=u.items[a+1];if(l){var m=f(l,o);if(r[m]){var v="".concat(i.id,"-").concat(m);c.push(v),n[v]||(n[v]={source:i.id,target:m,navigationRules:["left","right"]})}}if(o==="group"&&u.items[a].items){var y=(u.items[a].items[0].mark.items[0].items||u.items[a].items)[0],p=f(y,"item");if(r[p]){var h="".concat(i.id,"-").concat(p);c.push(h),n[h]||(n[h]={source:i.id,target:p,navigationRules:["parent","child"]})}}else if(o==="item"){var b=f(u,"group");if(r[b]){var k="".concat(b,"-").concat(i.id);c.push(k),n[k]||(n[k]={source:b,target:i.id,navigationRules:["parent","child"]})}}return e.exitFunction&&(c.push("any-exit"),n["any-exit"]||(n["any-exit"]={source:e.getCurrent,target:e.exitFunction,navigationRules:["exit"]})),c.push("any-undo"),n["any-undo"]||(n["any-undo"]={source:e.getCurrent,target:e.getPrevious,navigationRules:["undo"]}),c},v=function(t,n,a,o,u){var c=f(t,n),g="render-"+c,l=a||[0,0];r[c]={},r[c].d={},r[c].id=c,r[c].renderId=g,r[c].index=o,r[c].level=n,r[c].parent=u,i[g]={},i[g].renderId=g,i[g].dimensions={},i[g].dimensions.x=t.bounds.x1+l[0],i[g].dimensions.y=t.bounds.y1+l[1],i[g].dimensions.width=t.bounds.x2-t.bounds.x1,i[g].dimensions.height=t.bounds.y2-t.bounds.y1,i[g].cssClass="dn-vega-lite-node",t.datum&&Object.keys(t.datum).forEach(function(i){var a=t.datum[i];d(i,a,t.datum,n,e.vegaLiteSpec)&&(r[c].d[e.keyRenamingHash&&e.keyRenamingHash[i]?e.keyRenamingHash[i]:i]=a)}),i[g].semantics={},i[g].semantics.label=e.nodeDescriber?e.nodeDescriber(r[c].d,t,n):s(r[c].d)},y=0;return l.items.forEach(function(t){if(o(t,y,e.vegaLiteSpec)){v(t,"group",g,y,l);var r=0,n=t.items[0].mark.items[0].items?t.items[0].mark.items[0]:t;n.items.forEach(function(i){u(i,r,t,e.vegaLiteSpec)&&v(i,"item",g,r,n),r++})}y++}),Object.keys(r).forEach(function(e){r[e].edges=m(e)}),{nodes:r,edges:n,elementData:i,navigationRules:t}},l=function(e){return{}};0&&(module.exports={buildNodeStructure:buildNodeStructure,buildNodeStructureFromVegaLite:buildNodeStructureFromVegaLite});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{a as R}from"./chunk-KNRZ7RNY.mjs";import{c as C}from"./chunk-GP5LYFFJ.mjs";var j=t=>{if(t.dataType==="vega-lite"||t.dataType==="vl"||t.dataType==="Vega-Lite")return w(t);console.warn("Apologies, we currently only have structure scaffolding for Vega-Lite, generic scaffolding coming soon!")},w=t=>{let L=C,r={},u={},o={},y=0,$=t.groupInclusionCriteria?t.groupInclusionCriteria:()=>!0,E=t.itemInclusionCriteria?t.itemInclusionCriteria:()=>!0,S=t.datumInclusionCriteria?t.datumInclusionCriteria:()=>!0,b=t.vegaLiteView._renderer._origin,I=t.vegaLiteView._scenegraph.root.items[0].mark.items[0],m=(e,i)=>{if(e["data-navigator-id"])return e["data-navigator-id"];let c=`dn-node-${i}-${y}`;return y++,e["data-navigator-id"]=c,c},k=e=>{let i=r[e],c=i.index,g=i.level,l=i.parent,n=[],d=l.items[c-1];if(d){let s=m(d,g);if(r[s]){let a=`${s}-${i.id}`;n.push(a),u[a]||(u[a]={source:s,target:i.id,navigationRules:["left","right"]})}}let f=l.items[c+1];if(f){let s=m(f,g);if(r[s]){let a=`${i.id}-${s}`;n.push(a),u[a]||(u[a]={source:i.id,target:s,navigationRules:["left","right"]})}}if(g==="group"&&l.items[c].items){let a=(l.items[c].items[0].mark.items[0].items||l.items[c].items)[0],v=m(a,"item");if(r[v]){let x=`${i.id}-${v}`;n.push(x),u[x]||(u[x]={source:i.id,target:v,navigationRules:["parent","child"]})}}else if(g==="item"){let s=m(l,"group");if(r[s]){let a=`${s}-${i.id}`;n.push(a),u[a]||(u[a]={source:s,target:i.id,navigationRules:["parent","child"]})}}return t.exitFunction&&(n.push("any-exit"),u["any-exit"]||(u["any-exit"]={source:t.getCurrent,target:t.exitFunction,navigationRules:["exit"]})),n.push("any-undo"),u["any-undo"]||(u["any-undo"]={source:t.getCurrent,target:t.getPrevious,navigationRules:["undo"]}),n},p=(e,i,c,g,l)=>{let n=m(e,i),d="render-"+n,f=c||[0,0];r[n]={},r[n].d={},r[n].id=n,r[n].renderId=d,r[n].index=g,r[n].level=i,r[n].parent=l,o[d]={},o[d].renderId=d,o[d].dimensions={},o[d].dimensions.x=e.bounds.x1+f[0],o[d].dimensions.y=e.bounds.y1+f[1],o[d].dimensions.width=e.bounds.x2-e.bounds.x1,o[d].dimensions.height=e.bounds.y2-e.bounds.y1,o[d].cssClass="dn-vega-lite-node",e.datum&&Object.keys(e.datum).forEach(s=>{let a=e.datum[s];S(s,a,e.datum,i,t.vegaLiteSpec)&&(r[n].d[t.keyRenamingHash&&t.keyRenamingHash[s]?t.keyRenamingHash[s]:s]=a)}),o[d].semantics={},o[d].semantics.label=t.nodeDescriber?t.nodeDescriber(r[n].d,e,i):R(r[n].d)},h=0;return I.items.forEach(e=>{if($(e,h,t.vegaLiteSpec)){p(e,"group",b,h,I);let i=0,c=e.items[0].mark.items[0].items?e.items[0].mark.items[0]:e;c.items.forEach(g=>{E(g,i,e,t.vegaLiteSpec)&&p(g,"item",b,i,c),i++})}h++}),Object.keys(r).forEach(e=>{r[e].edges=k(e)}),{nodes:r,edges:u,elementData:o,navigationRules:L}},B=t=>({});export{B as buildNodeStructure,w as buildNodeStructureFromVegaLite,j as default};
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
var e=Object.defineProperty;var r=Object.getOwnPropertyDescriptor;var t=Object.getOwnPropertyNames;var n=Object.prototype.hasOwnProperty;var o=function(r,t){for(var n in t)e(r,n,{get:t[n],enumerable:!0})},a=function(o,a,u,c){var i=true,f=false,l=undefined;if(a&&typeof a=="object"||typeof a=="function")try{var v=function(){var t=y.value;!n.call(o,t)&&t!==u&&e(o,t,{get:function(){return a[t]},enumerable:!(c=r(a,t))||c.enumerable})};for(var b=t(a)[Symbol.iterator](),y;!(i=(y=b.next()).done);i=true)v()}catch(e){f=true;l=e}finally{try{if(!i&&b.return!=null){b.return()}}finally{if(f){throw l}}}return o};var u=function(r){return a(e({},"__esModule",{value:!0}),r)};var c={};o(c,{describeNode:function(){return i}});module.exports=u(c);var i=function(e,r){var t=Object.keys(e),n="";return t.forEach(function(t){n+="".concat(r&&r.omitKeyNames?"":t+": ").concat(e[t],". ")}),n+=r&&r.semanticLabel||"Data point.",n};0&&(module.exports={describeNode:describeNode});
|
|
@@ -0,0 +1 @@
|
|
|
1
|
+
import{a}from"./chunk-KNRZ7RNY.mjs";export{a as describeNode};
|