@floegence/floe-webapp-core 0.36.17 → 0.36.19
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/dist/components/ui/InfiniteCanvas.d.ts +17 -0
- package/dist/components/ui/InfiniteCanvas.js +38 -38
- package/dist/components/ui/index.d.ts +1 -1
- package/dist/components/ui/localInteractionSurface.d.ts +2 -0
- package/dist/components/ui/localInteractionSurface.js +51 -26
- package/dist/components/workbench/WorkbenchCanvas.d.ts +5 -1
- package/dist/components/workbench/WorkbenchCanvas.js +79 -40
- package/dist/components/workbench/WorkbenchCanvasField.d.ts +5 -1
- package/dist/components/workbench/WorkbenchCanvasField.js +82 -63
- package/dist/components/workbench/WorkbenchSurface.d.ts +13 -1
- package/dist/components/workbench/WorkbenchSurface.js +222 -130
- package/dist/components/workbench/WorkbenchWidget.d.ts +5 -1
- package/dist/components/workbench/WorkbenchWidget.js +155 -123
- package/dist/components/workbench/types.d.ts +66 -0
- package/dist/components/workbench/workbenchInteractionAdapter.d.ts +39 -0
- package/dist/components/workbench/workbenchInteractionAdapter.js +103 -0
- package/dist/full.js +463 -462
- package/dist/ui.js +102 -101
- package/package.json +1 -1
|
@@ -1,35 +1,62 @@
|
|
|
1
|
-
import { spread as
|
|
2
|
-
import {
|
|
3
|
-
import { startHotInteraction as
|
|
4
|
-
import { X as
|
|
5
|
-
import { CANVAS_WHEEL_INTERACTIVE_ATTR as
|
|
6
|
-
import { startPointerSession as
|
|
7
|
-
import { createWorkbenchWidgetSurfaceMetrics as
|
|
8
|
-
|
|
9
|
-
|
|
10
|
-
|
|
11
|
-
|
|
12
|
-
|
|
13
|
-
|
|
14
|
-
|
|
1
|
+
import { spread as F, mergeProps as nt, insert as l, createComponent as c, memo as at, template as B, use as rt, delegateEvents as dt } from "solid-js/web";
|
|
2
|
+
import { createMemo as u, createSignal as W, onCleanup as lt, untrack as f } from "solid-js";
|
|
3
|
+
import { startHotInteraction as ct } from "../../utils/hotInteraction.js";
|
|
4
|
+
import { X as j, Minus as O, Maximize as N, GripVertical as st } from "../icons/index.js";
|
|
5
|
+
import { CANVAS_WHEEL_INTERACTIVE_ATTR as wt, WORKBENCH_WIDGET_SHELL_ATTR as gt, shouldActivateWorkbenchWidgetLocalTarget as ht } from "../ui/localInteractionSurface.js";
|
|
6
|
+
import { startPointerSession as q } from "../ui/pointerSession.js";
|
|
7
|
+
import { createWorkbenchWidgetSurfaceMetrics as ut } from "./workbenchHelpers.js";
|
|
8
|
+
import { resolveWorkbenchInteractionAdapter as ft } from "./workbenchInteractionAdapter.js";
|
|
9
|
+
var _t = /* @__PURE__ */ B('<article class=workbench-widget><header class=workbench-widget__header><span class=workbench-widget__traffic role=group aria-label="Window controls"><button type=button class="workbench-widget__traffic-dot workbench-widget__traffic-dot--close"aria-label="Close widget"title="Close widget"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__traffic-dot workbench-widget__traffic-dot--min"aria-label="Minimize widget to overview"title="Minimize widget to overview"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__traffic-dot workbench-widget__traffic-dot--max"aria-label="Zoom widget to fit viewport"title="Zoom widget to fit viewport"data-floe-canvas-interactive=true></button></span><span class=workbench-widget__badge aria-hidden=true></span><button type=button class=workbench-widget__drag aria-label="Drag widget"data-floe-canvas-interactive=true></button><div class=workbench-widget__title-area><span class=workbench-widget__title-dot aria-hidden=true></span><span class=workbench-widget__title></span></div><span class=workbench-widget__window-controls role=group aria-label="Window controls"><button type=button class="workbench-widget__window-control workbench-widget__window-control--min"aria-label="Minimize widget to overview"title="Minimize widget to overview"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__window-control workbench-widget__window-control--max"aria-label="Zoom widget to fit viewport"title="Zoom widget to fit viewport"data-floe-canvas-interactive=true></button><button type=button class="workbench-widget__window-control workbench-widget__window-control--close"aria-label="Remove widget"title="Remove widget"data-floe-canvas-interactive=true></button></span></header><div class=workbench-widget__body data-floe-canvas-interactive=true>'), bt = /* @__PURE__ */ B('<div class=workbench-widget__resize aria-label="Resize widget"data-floe-canvas-interactive=true><svg class=workbench-widget__resize-glyph viewBox="0 0 12 12"aria-hidden=true><path d="M12 0 L0 12"></path><path d="M12 4 L4 12"></path><path d="M12 8 L8 12">');
|
|
10
|
+
const mt = 220, vt = 160;
|
|
11
|
+
function Wt(t) {
|
|
12
|
+
const s = u(() => ft(t.interactionAdapter)), [m, y] = W(null), [v, x] = W(null), [V, Z] = W();
|
|
13
|
+
let _, b, h;
|
|
14
|
+
const p = (e, i) => {
|
|
15
|
+
const r = ct({
|
|
16
|
+
kind: e,
|
|
17
|
+
cursor: i
|
|
18
|
+
});
|
|
19
|
+
let d = !1;
|
|
20
|
+
return f(() => t.onLayoutInteractionStart?.()), () => {
|
|
21
|
+
d || (d = !0, r(), f(() => t.onLayoutInteractionEnd?.()));
|
|
22
|
+
};
|
|
23
|
+
};
|
|
24
|
+
lt(() => {
|
|
25
|
+
_?.stop({
|
|
15
26
|
reason: "manual_stop",
|
|
16
27
|
commit: !1
|
|
17
|
-
}),
|
|
28
|
+
}), _ = void 0, b?.stop({
|
|
18
29
|
reason: "manual_stop",
|
|
19
30
|
commit: !1
|
|
20
|
-
}),
|
|
31
|
+
}), b = void 0, f(m)?.stopInteraction(), f(v)?.stopInteraction();
|
|
21
32
|
});
|
|
22
|
-
const
|
|
33
|
+
const z = () => m() !== null, R = () => v() !== null, T = (e) => s().resolveWidgetEventOwnership({
|
|
23
34
|
target: e,
|
|
24
|
-
widgetRoot:
|
|
25
|
-
interactiveSelector:
|
|
26
|
-
panSurfaceSelector:
|
|
27
|
-
}),
|
|
28
|
-
e.button
|
|
29
|
-
|
|
35
|
+
widgetRoot: h ?? null,
|
|
36
|
+
interactiveSelector: s().interactiveSelector,
|
|
37
|
+
panSurfaceSelector: s().panSurfaceSelector
|
|
38
|
+
}), G = (e) => {
|
|
39
|
+
if (e.button !== 0) return;
|
|
40
|
+
t.onSelect(t.widgetId), t.onCommitFront(t.widgetId);
|
|
41
|
+
const i = T(e.target);
|
|
42
|
+
if (i === "widget_shell") {
|
|
43
|
+
h?.focus({
|
|
44
|
+
preventScroll: !0
|
|
45
|
+
});
|
|
46
|
+
return;
|
|
47
|
+
}
|
|
48
|
+
i === "widget_local" && ht({
|
|
49
|
+
target: e.target,
|
|
50
|
+
widgetRoot: h ?? null,
|
|
51
|
+
interactiveSelector: s().interactiveSelector,
|
|
52
|
+
panSurfaceSelector: s().panSurfaceSelector
|
|
53
|
+
}) && Z((r) => ({
|
|
54
|
+
seq: (r?.seq ?? 0) + 1,
|
|
55
|
+
source: "local_pointer",
|
|
56
|
+
pointerType: e.pointerType || void 0
|
|
30
57
|
}));
|
|
31
|
-
},
|
|
32
|
-
const e =
|
|
58
|
+
}, $ = u(() => {
|
|
59
|
+
const e = m();
|
|
33
60
|
return e ? {
|
|
34
61
|
x: e.worldX,
|
|
35
62
|
y: e.worldY
|
|
@@ -37,8 +64,8 @@ function xt(t) {
|
|
|
37
64
|
x: t.x,
|
|
38
65
|
y: t.y
|
|
39
66
|
};
|
|
40
|
-
}),
|
|
41
|
-
const e =
|
|
67
|
+
}), S = u(() => {
|
|
68
|
+
const e = v();
|
|
42
69
|
return e ? {
|
|
43
70
|
width: e.width,
|
|
44
71
|
height: e.height
|
|
@@ -46,34 +73,34 @@ function xt(t) {
|
|
|
46
73
|
width: t.width,
|
|
47
74
|
height: t.height
|
|
48
75
|
};
|
|
49
|
-
}),
|
|
76
|
+
}), X = u(() => {
|
|
50
77
|
if (!(t.layoutMode !== "projected_surface" || !t.projectedViewport))
|
|
51
|
-
return
|
|
78
|
+
return ut({
|
|
52
79
|
widgetId: t.widgetId,
|
|
53
|
-
worldX:
|
|
54
|
-
worldY:
|
|
55
|
-
worldWidth:
|
|
56
|
-
worldHeight:
|
|
80
|
+
worldX: $().x,
|
|
81
|
+
worldY: $().y,
|
|
82
|
+
worldWidth: S().width,
|
|
83
|
+
worldHeight: S().height,
|
|
57
84
|
viewport: t.projectedViewport,
|
|
58
85
|
ready: t.surfaceReady ?? !0
|
|
59
86
|
});
|
|
60
|
-
}),
|
|
87
|
+
}), K = u(() => {
|
|
61
88
|
const e = t.itemSnapshot().z_index, i = Number.isFinite(e) ? Math.max(1, Math.min(99, Math.round(e))) : 1;
|
|
62
89
|
return String(i).padStart(2, "0");
|
|
63
|
-
}),
|
|
90
|
+
}), Y = (e) => {
|
|
64
91
|
e.preventDefault(), e.stopPropagation(), t.onRequestOverview(t.itemSnapshot());
|
|
65
|
-
}, T = (e) => {
|
|
66
|
-
e.preventDefault(), e.stopPropagation(), t.onRequestFit(t.itemSnapshot());
|
|
67
92
|
}, D = (e) => {
|
|
93
|
+
e.preventDefault(), e.stopPropagation(), t.onRequestFit(t.itemSnapshot());
|
|
94
|
+
}, P = (e) => {
|
|
68
95
|
e.preventDefault(), e.stopPropagation(), t.onRequestDelete(t.widgetId);
|
|
69
|
-
},
|
|
96
|
+
}, J = u(() => {
|
|
70
97
|
const e = {
|
|
71
|
-
width: `${
|
|
72
|
-
height: `${
|
|
73
|
-
"z-index":
|
|
98
|
+
width: `${S().width}px`,
|
|
99
|
+
height: `${S().height}px`,
|
|
100
|
+
"z-index": z() || R() || t.optimisticFront ? `${t.topRenderLayer + 1}` : `${t.renderLayer}`
|
|
74
101
|
};
|
|
75
102
|
if (t.layoutMode === "projected_surface") {
|
|
76
|
-
const i =
|
|
103
|
+
const i = X()?.rect;
|
|
77
104
|
return {
|
|
78
105
|
...e,
|
|
79
106
|
left: `${i?.screenX ?? 0}px`,
|
|
@@ -83,32 +110,29 @@ function xt(t) {
|
|
|
83
110
|
}
|
|
84
111
|
return {
|
|
85
112
|
...e,
|
|
86
|
-
transform: `translate(${
|
|
113
|
+
transform: `translate(${$().x}px, ${$().y}px)`
|
|
87
114
|
};
|
|
88
|
-
}),
|
|
89
|
-
const i =
|
|
115
|
+
}), Q = (e) => {
|
|
116
|
+
const i = f(m);
|
|
90
117
|
if (!i) return;
|
|
91
|
-
const
|
|
118
|
+
const r = {
|
|
92
119
|
x: i.worldX,
|
|
93
120
|
y: i.worldY
|
|
94
|
-
},
|
|
121
|
+
}, d = {
|
|
95
122
|
x: i.startWorldX,
|
|
96
123
|
y: i.startWorldY
|
|
97
|
-
}, a = e && (Math.abs(
|
|
98
|
-
t.onCommitFront(t.widgetId), a && t.onCommitMove(t.widgetId,
|
|
99
|
-
},
|
|
124
|
+
}, a = e && (Math.abs(r.x - d.x) > 1 || Math.abs(r.y - d.y) > 1);
|
|
125
|
+
t.onCommitFront(t.widgetId), a && t.onCommitMove(t.widgetId, r), i.stopInteraction(), y(null), _ = void 0;
|
|
126
|
+
}, E = (e) => {
|
|
100
127
|
if (e.button !== 0 || t.locked) return;
|
|
101
|
-
e.preventDefault(), e.stopPropagation(),
|
|
128
|
+
e.preventDefault(), e.stopPropagation(), _?.stop({
|
|
102
129
|
reason: "manual_stop",
|
|
103
130
|
commit: !1
|
|
104
|
-
}), t.onSelect(t.widgetId),
|
|
131
|
+
}), t.onSelect(t.widgetId), h?.focus({
|
|
105
132
|
preventScroll: !0
|
|
106
133
|
}), t.onStartOptimisticFront(t.widgetId);
|
|
107
|
-
const i =
|
|
108
|
-
|
|
109
|
-
cursor: "grabbing"
|
|
110
|
-
}), d = Math.max(t.viewportScale, 1e-3);
|
|
111
|
-
I({
|
|
134
|
+
const i = p("drag", "grabbing"), r = Math.max(t.viewportScale, 1e-3);
|
|
135
|
+
y({
|
|
112
136
|
pointerId: e.pointerId,
|
|
113
137
|
startClientX: e.clientX,
|
|
114
138
|
startClientY: e.clientY,
|
|
@@ -117,47 +141,44 @@ function xt(t) {
|
|
|
117
141
|
worldX: t.x,
|
|
118
142
|
worldY: t.y,
|
|
119
143
|
moved: !1,
|
|
120
|
-
scale:
|
|
144
|
+
scale: r,
|
|
121
145
|
stopInteraction: i
|
|
122
146
|
});
|
|
123
|
-
const
|
|
124
|
-
|
|
125
|
-
if (!
|
|
126
|
-
const
|
|
147
|
+
const d = (a) => {
|
|
148
|
+
y((o) => {
|
|
149
|
+
if (!o || o.pointerId !== a.pointerId) return o;
|
|
150
|
+
const g = o.startWorldX + (a.clientX - o.startClientX) / o.scale, w = o.startWorldY + (a.clientY - o.startClientY) / o.scale;
|
|
127
151
|
return {
|
|
128
|
-
...
|
|
129
|
-
worldX:
|
|
130
|
-
worldY:
|
|
131
|
-
moved:
|
|
152
|
+
...o,
|
|
153
|
+
worldX: g,
|
|
154
|
+
worldY: w,
|
|
155
|
+
moved: o.moved || Math.abs(g - o.startWorldX) > 2 || Math.abs(w - o.startWorldY) > 2
|
|
132
156
|
};
|
|
133
157
|
});
|
|
134
158
|
};
|
|
135
|
-
|
|
159
|
+
_ = q({
|
|
136
160
|
pointerEvent: e,
|
|
137
161
|
captureEl: e.currentTarget,
|
|
138
|
-
onMove:
|
|
162
|
+
onMove: d,
|
|
139
163
|
onEnd: ({
|
|
140
164
|
commit: a
|
|
141
|
-
}) =>
|
|
165
|
+
}) => Q(a)
|
|
142
166
|
});
|
|
143
|
-
},
|
|
144
|
-
const i =
|
|
167
|
+
}, U = (e) => {
|
|
168
|
+
const i = f(v);
|
|
145
169
|
if (!i) return;
|
|
146
|
-
const
|
|
170
|
+
const r = {
|
|
147
171
|
width: i.width,
|
|
148
172
|
height: i.height
|
|
149
|
-
},
|
|
150
|
-
e &&
|
|
151
|
-
},
|
|
173
|
+
}, d = Math.abs(i.width - i.startWidth) > 1 || Math.abs(i.height - i.startHeight) > 1;
|
|
174
|
+
e && d && t.onCommitResize(t.widgetId, r), i.stopInteraction(), x(null), b = void 0;
|
|
175
|
+
}, tt = (e) => {
|
|
152
176
|
if (e.button !== 0 || t.locked) return;
|
|
153
|
-
e.preventDefault(), e.stopPropagation(),
|
|
177
|
+
e.preventDefault(), e.stopPropagation(), b?.stop({
|
|
154
178
|
reason: "manual_stop",
|
|
155
179
|
commit: !1
|
|
156
180
|
}), t.onStartOptimisticFront(t.widgetId);
|
|
157
|
-
const i =
|
|
158
|
-
kind: "drag",
|
|
159
|
-
cursor: "nwse-resize"
|
|
160
|
-
}), d = Math.max(t.viewportScale, 1e-3);
|
|
181
|
+
const i = p("resize", "nwse-resize"), r = Math.max(t.viewportScale, 1e-3);
|
|
161
182
|
x({
|
|
162
183
|
pointerId: e.pointerId,
|
|
163
184
|
startClientX: e.clientX,
|
|
@@ -166,45 +187,53 @@ function xt(t) {
|
|
|
166
187
|
startHeight: t.height,
|
|
167
188
|
width: t.width,
|
|
168
189
|
height: t.height,
|
|
169
|
-
scale:
|
|
190
|
+
scale: r,
|
|
170
191
|
stopInteraction: i
|
|
171
192
|
});
|
|
172
|
-
const
|
|
173
|
-
x((
|
|
174
|
-
if (!
|
|
175
|
-
const
|
|
193
|
+
const d = (a) => {
|
|
194
|
+
x((o) => {
|
|
195
|
+
if (!o || o.pointerId !== a.pointerId) return o;
|
|
196
|
+
const g = Math.max(mt, o.startWidth + (a.clientX - o.startClientX) / o.scale), w = Math.max(vt, o.startHeight + (a.clientY - o.startClientY) / o.scale);
|
|
176
197
|
return {
|
|
177
|
-
...
|
|
178
|
-
width:
|
|
179
|
-
height:
|
|
198
|
+
...o,
|
|
199
|
+
width: g,
|
|
200
|
+
height: w
|
|
180
201
|
};
|
|
181
202
|
});
|
|
182
203
|
};
|
|
183
|
-
|
|
204
|
+
b = q({
|
|
184
205
|
pointerEvent: e,
|
|
185
206
|
captureEl: e.currentTarget,
|
|
186
|
-
onMove:
|
|
207
|
+
onMove: d,
|
|
187
208
|
onEnd: ({
|
|
188
209
|
commit: a
|
|
189
|
-
}) =>
|
|
210
|
+
}) => U(a)
|
|
190
211
|
});
|
|
191
212
|
};
|
|
192
213
|
return (() => {
|
|
193
|
-
var e =
|
|
194
|
-
return typeof
|
|
214
|
+
var e = _t(), i = e.firstChild, r = i.firstChild, d = r.firstChild, a = d.nextSibling, o = a.nextSibling, g = r.nextSibling, w = g.nextSibling, M = w.nextSibling, et = M.firstChild, A = et.nextSibling, it = M.nextSibling, k = it.firstChild, I = k.nextSibling, C = I.nextSibling, ot = i.nextSibling, L = h;
|
|
215
|
+
return typeof L == "function" ? rt(L, e) : h = e, F(e, nt({
|
|
195
216
|
get classList() {
|
|
196
217
|
return {
|
|
197
218
|
"is-selected": t.selected,
|
|
198
|
-
"is-dragging":
|
|
199
|
-
"is-resizing":
|
|
219
|
+
"is-dragging": z(),
|
|
220
|
+
"is-resizing": R(),
|
|
200
221
|
"is-filtered-out": t.filtered,
|
|
201
222
|
"is-projected-surface": t.layoutMode === "projected_surface",
|
|
202
223
|
"is-locked": t.locked
|
|
203
224
|
};
|
|
204
|
-
}
|
|
225
|
+
}
|
|
226
|
+
}, () => ({
|
|
227
|
+
[s().dialogSurfaceHostAttr]: "true"
|
|
228
|
+
}), {
|
|
205
229
|
get "data-floe-workbench-widget-id"() {
|
|
206
230
|
return t.widgetId;
|
|
207
|
-
}
|
|
231
|
+
}
|
|
232
|
+
}, () => ({
|
|
233
|
+
[s().widgetRootAttr]: "true"
|
|
234
|
+
}), () => ({
|
|
235
|
+
[s().widgetIdAttr]: t.widgetId
|
|
236
|
+
}), {
|
|
208
237
|
get "data-workbench-widget-type"() {
|
|
209
238
|
return t.widgetType;
|
|
210
239
|
},
|
|
@@ -212,49 +241,49 @@ function xt(t) {
|
|
|
212
241
|
return t.layoutMode ?? "canvas_scaled";
|
|
213
242
|
}
|
|
214
243
|
}, () => ({
|
|
215
|
-
[
|
|
244
|
+
[wt]: t.selected ? "true" : void 0
|
|
216
245
|
}), {
|
|
217
246
|
tabIndex: 0,
|
|
218
|
-
onPointerDown:
|
|
247
|
+
onPointerDown: G,
|
|
219
248
|
onFocus: () => {
|
|
220
249
|
t.onSelect(t.widgetId);
|
|
221
250
|
},
|
|
222
|
-
onContextMenu: (
|
|
223
|
-
|
|
251
|
+
onContextMenu: (n) => {
|
|
252
|
+
T(n.target) === "widget_shell" && (n.preventDefault(), n.stopPropagation(), t.onContextMenu(n, t.itemSnapshot()));
|
|
224
253
|
},
|
|
225
254
|
get style() {
|
|
226
|
-
return
|
|
255
|
+
return J();
|
|
227
256
|
}
|
|
228
|
-
}), !1, !0), i.$$pointerdown =
|
|
229
|
-
[
|
|
230
|
-
}, !1, !0),
|
|
257
|
+
}), !1, !0), i.$$pointerdown = E, F(i, {
|
|
258
|
+
[gt]: "true"
|
|
259
|
+
}, !1, !0), d.$$click = P, d.$$pointerdown = (n) => n.stopPropagation(), l(d, c(j, {
|
|
231
260
|
class: "workbench-widget__traffic-icon",
|
|
232
261
|
"aria-hidden": "true"
|
|
233
|
-
})), a.$$click =
|
|
262
|
+
})), a.$$click = Y, a.$$pointerdown = (n) => n.stopPropagation(), l(a, c(O, {
|
|
234
263
|
class: "workbench-widget__traffic-icon",
|
|
235
264
|
"aria-hidden": "true"
|
|
236
|
-
})),
|
|
265
|
+
})), o.$$click = D, o.$$pointerdown = (n) => n.stopPropagation(), l(o, c(N, {
|
|
237
266
|
class: "workbench-widget__traffic-icon",
|
|
238
267
|
"aria-hidden": "true"
|
|
239
|
-
})), l(
|
|
268
|
+
})), l(g, K), w.$$pointerdown = E, l(w, c(st, {
|
|
240
269
|
class: "w-3.5 h-3.5"
|
|
241
270
|
})), l(M, () => {
|
|
242
|
-
const
|
|
243
|
-
return c(
|
|
271
|
+
const n = t.definition.icon;
|
|
272
|
+
return c(n, {
|
|
244
273
|
class: "w-3.5 h-3.5"
|
|
245
274
|
});
|
|
246
|
-
},
|
|
275
|
+
}, A), l(A, () => t.widgetTitle), k.$$click = Y, k.$$pointerdown = (n) => n.stopPropagation(), l(k, c(O, {
|
|
247
276
|
class: "workbench-widget__window-control-icon",
|
|
248
277
|
"aria-hidden": "true"
|
|
249
|
-
})),
|
|
278
|
+
})), I.$$click = D, I.$$pointerdown = (n) => n.stopPropagation(), l(I, c(N, {
|
|
250
279
|
class: "workbench-widget__window-control-icon",
|
|
251
280
|
"aria-hidden": "true"
|
|
252
|
-
})),
|
|
281
|
+
})), C.$$click = P, C.$$pointerdown = (n) => n.stopPropagation(), l(C, c(j, {
|
|
253
282
|
class: "workbench-widget__window-control-icon",
|
|
254
283
|
"aria-hidden": "true"
|
|
255
|
-
})), l(
|
|
256
|
-
const
|
|
257
|
-
return c(
|
|
284
|
+
})), l(ot, () => {
|
|
285
|
+
const n = t.definition.body;
|
|
286
|
+
return c(n, {
|
|
258
287
|
get widgetId() {
|
|
259
288
|
return t.widgetId;
|
|
260
289
|
},
|
|
@@ -265,19 +294,22 @@ function xt(t) {
|
|
|
265
294
|
return t.widgetType;
|
|
266
295
|
},
|
|
267
296
|
get surfaceMetrics() {
|
|
268
|
-
return
|
|
297
|
+
return X();
|
|
298
|
+
},
|
|
299
|
+
get activation() {
|
|
300
|
+
return V();
|
|
269
301
|
}
|
|
270
302
|
});
|
|
271
303
|
}), l(e, (() => {
|
|
272
|
-
var
|
|
273
|
-
return () =>
|
|
274
|
-
var
|
|
275
|
-
return
|
|
304
|
+
var n = at(() => !!t.locked);
|
|
305
|
+
return () => n() ? null : (() => {
|
|
306
|
+
var H = bt();
|
|
307
|
+
return H.$$pointerdown = tt, H;
|
|
276
308
|
})();
|
|
277
309
|
})(), null), e;
|
|
278
310
|
})();
|
|
279
311
|
}
|
|
280
|
-
|
|
312
|
+
dt(["pointerdown", "click"]);
|
|
281
313
|
export {
|
|
282
|
-
|
|
314
|
+
Wt as WorkbenchWidget
|
|
283
315
|
};
|
|
@@ -1,9 +1,68 @@
|
|
|
1
1
|
import type { Component } from 'solid-js';
|
|
2
2
|
import type { WorkbenchThemeId } from './workbenchThemes';
|
|
3
|
+
import type { SurfaceInteractionTargetRole, SurfaceWheelLocalReason, WorkbenchWidgetEventOwnership } from '../ui/localInteractionSurface';
|
|
3
4
|
export type BuiltinWorkbenchWidgetType = 'terminal' | 'file-browser' | 'system-monitor' | 'log-viewer' | 'code-editor';
|
|
4
5
|
export type WorkbenchWidgetType = BuiltinWorkbenchWidgetType | (string & {});
|
|
5
6
|
export declare const WORKBENCH_WIDGET_TYPES: readonly WorkbenchWidgetType[];
|
|
6
7
|
export type WorkbenchWidgetRenderMode = 'canvas_scaled' | 'projected_surface';
|
|
8
|
+
export type WorkbenchCanvasOwnerReason = 'initial' | 'background_pointer' | 'background_focus' | (string & {});
|
|
9
|
+
export type WorkbenchWidgetOwnerReason = 'pointer' | 'focus' | 'activation' | (string & {});
|
|
10
|
+
export type WorkbenchInputOwner = {
|
|
11
|
+
kind: 'canvas';
|
|
12
|
+
reason: WorkbenchCanvasOwnerReason;
|
|
13
|
+
} | {
|
|
14
|
+
kind: 'widget';
|
|
15
|
+
widgetId: string;
|
|
16
|
+
reason: WorkbenchWidgetOwnerReason;
|
|
17
|
+
};
|
|
18
|
+
export type WorkbenchWheelLocalReason = SurfaceWheelLocalReason | 'selected_widget' | (string & {});
|
|
19
|
+
export type WorkbenchWheelRoutingDecision = {
|
|
20
|
+
kind: 'canvas_zoom';
|
|
21
|
+
} | {
|
|
22
|
+
kind: 'local_surface';
|
|
23
|
+
reason: WorkbenchWheelLocalReason;
|
|
24
|
+
} | {
|
|
25
|
+
kind: 'ignore';
|
|
26
|
+
reason: 'pan_zoom_disabled' | (string & {});
|
|
27
|
+
};
|
|
28
|
+
export interface WorkbenchInteractionAdapter {
|
|
29
|
+
surfaceRootAttr?: string;
|
|
30
|
+
widgetRootAttr?: string;
|
|
31
|
+
widgetIdAttr?: string;
|
|
32
|
+
dialogSurfaceHostAttr?: string;
|
|
33
|
+
interactiveSelector?: string;
|
|
34
|
+
panSurfaceSelector?: string;
|
|
35
|
+
wheelInteractiveSelector?: string;
|
|
36
|
+
createInitialInputOwner?: () => WorkbenchInputOwner;
|
|
37
|
+
createCanvasInputOwner?: (reason: WorkbenchCanvasOwnerReason) => WorkbenchInputOwner;
|
|
38
|
+
createWidgetInputOwner?: (widgetId: string, reason: WorkbenchWidgetOwnerReason) => WorkbenchInputOwner;
|
|
39
|
+
findWidgetRoot?: (target: EventTarget | null) => HTMLElement | null;
|
|
40
|
+
readWidgetId?: (element: Element | null) => string | null;
|
|
41
|
+
focusWidgetElement?: (root: ParentNode | null | undefined, widgetId: string) => boolean;
|
|
42
|
+
resolveSurfaceTargetRole?: (args: {
|
|
43
|
+
target: EventTarget | null;
|
|
44
|
+
interactiveSelector: string;
|
|
45
|
+
panSurfaceSelector: string;
|
|
46
|
+
}) => SurfaceInteractionTargetRole;
|
|
47
|
+
resolveWidgetEventOwnership?: (args: {
|
|
48
|
+
target: EventTarget | null;
|
|
49
|
+
widgetRoot: Element | EventTarget | null;
|
|
50
|
+
interactiveSelector: string;
|
|
51
|
+
panSurfaceSelector: string;
|
|
52
|
+
}) => WorkbenchWidgetEventOwnership;
|
|
53
|
+
resolveWheelRouting?: (args: {
|
|
54
|
+
target: EventTarget | null;
|
|
55
|
+
disablePanZoom: boolean;
|
|
56
|
+
selectedWidgetId: string | null;
|
|
57
|
+
wheelInteractiveSelector: string;
|
|
58
|
+
}) => WorkbenchWheelRoutingDecision;
|
|
59
|
+
shouldBypassGlobalHotkeys?: (args: {
|
|
60
|
+
root: HTMLElement | null | undefined;
|
|
61
|
+
target: EventTarget | null;
|
|
62
|
+
owner: WorkbenchInputOwner;
|
|
63
|
+
interactiveSelector: string;
|
|
64
|
+
}) => boolean;
|
|
65
|
+
}
|
|
7
66
|
export interface WorkbenchProjectedRect {
|
|
8
67
|
widgetId: string;
|
|
9
68
|
worldX: number;
|
|
@@ -20,11 +79,18 @@ export interface WorkbenchWidgetSurfaceMetrics {
|
|
|
20
79
|
ready: boolean;
|
|
21
80
|
rect: WorkbenchProjectedRect;
|
|
22
81
|
}
|
|
82
|
+
export type WorkbenchWidgetBodyActivationSource = 'local_pointer';
|
|
83
|
+
export interface WorkbenchWidgetBodyActivation {
|
|
84
|
+
seq: number;
|
|
85
|
+
source: WorkbenchWidgetBodyActivationSource;
|
|
86
|
+
pointerType?: string;
|
|
87
|
+
}
|
|
23
88
|
export interface WorkbenchWidgetBodyProps<TWidgetType extends string = WorkbenchWidgetType> {
|
|
24
89
|
widgetId: string;
|
|
25
90
|
title: string;
|
|
26
91
|
type: TWidgetType;
|
|
27
92
|
surfaceMetrics?: WorkbenchWidgetSurfaceMetrics;
|
|
93
|
+
activation?: WorkbenchWidgetBodyActivation;
|
|
28
94
|
}
|
|
29
95
|
export interface WorkbenchWidgetDefinition<TWidgetType extends string = WorkbenchWidgetType> {
|
|
30
96
|
type: TWidgetType;
|
|
@@ -0,0 +1,39 @@
|
|
|
1
|
+
import type { WorkbenchCanvasOwnerReason, WorkbenchInputOwner, WorkbenchInteractionAdapter, WorkbenchWidgetOwnerReason } from './types';
|
|
2
|
+
export declare const DEFAULT_WORKBENCH_SURFACE_ROOT_ATTR = "data-floe-workbench-surface-root";
|
|
3
|
+
export declare const DEFAULT_WORKBENCH_WIDGET_ROOT_ATTR = "data-floe-workbench-widget-root";
|
|
4
|
+
export declare const DEFAULT_WORKBENCH_WIDGET_ID_ATTR = "data-floe-workbench-widget-id";
|
|
5
|
+
export declare const DEFAULT_WORKBENCH_DIALOG_SURFACE_HOST_ATTR = "data-floe-dialog-surface-host";
|
|
6
|
+
export interface ResolvedWorkbenchInteractionAdapter extends WorkbenchInteractionAdapter {
|
|
7
|
+
surfaceRootAttr: string;
|
|
8
|
+
widgetRootAttr: string;
|
|
9
|
+
widgetIdAttr: string;
|
|
10
|
+
dialogSurfaceHostAttr: string;
|
|
11
|
+
interactiveSelector: string;
|
|
12
|
+
panSurfaceSelector: string;
|
|
13
|
+
wheelInteractiveSelector: string;
|
|
14
|
+
createInitialInputOwner: () => WorkbenchInputOwner;
|
|
15
|
+
createCanvasInputOwner: (reason: WorkbenchCanvasOwnerReason) => WorkbenchInputOwner;
|
|
16
|
+
createWidgetInputOwner: (widgetId: string, reason: WorkbenchWidgetOwnerReason) => WorkbenchInputOwner;
|
|
17
|
+
findWidgetRoot: (target: EventTarget | null) => HTMLElement | null;
|
|
18
|
+
readWidgetId: (element: Element | null) => string | null;
|
|
19
|
+
focusWidgetElement: (root: ParentNode | null | undefined, widgetId: string) => boolean;
|
|
20
|
+
resolveSurfaceTargetRole: NonNullable<WorkbenchInteractionAdapter['resolveSurfaceTargetRole']>;
|
|
21
|
+
resolveWidgetEventOwnership: NonNullable<WorkbenchInteractionAdapter['resolveWidgetEventOwnership']>;
|
|
22
|
+
resolveWheelRouting: NonNullable<WorkbenchInteractionAdapter['resolveWheelRouting']>;
|
|
23
|
+
shouldBypassGlobalHotkeys: NonNullable<WorkbenchInteractionAdapter['shouldBypassGlobalHotkeys']>;
|
|
24
|
+
}
|
|
25
|
+
export declare function readWorkbenchWidgetId(element: Element | null, widgetIdAttr?: string): string | null;
|
|
26
|
+
export declare function findWorkbenchWidgetRoot(target: EventTarget | null, widgetRootAttr?: string): HTMLElement | null;
|
|
27
|
+
export declare function findWorkbenchWidgetElement(args: {
|
|
28
|
+
root: ParentNode | null | undefined;
|
|
29
|
+
widgetId: string;
|
|
30
|
+
widgetRootAttr?: string;
|
|
31
|
+
readWidgetId?: (element: Element | null) => string | null;
|
|
32
|
+
}): HTMLElement | null;
|
|
33
|
+
export declare function focusWorkbenchWidgetElement(args: {
|
|
34
|
+
root: ParentNode | null | undefined;
|
|
35
|
+
widgetId: string;
|
|
36
|
+
widgetRootAttr?: string;
|
|
37
|
+
readWidgetId?: (element: Element | null) => string | null;
|
|
38
|
+
}): boolean;
|
|
39
|
+
export declare function resolveWorkbenchInteractionAdapter(adapter?: WorkbenchInteractionAdapter): ResolvedWorkbenchInteractionAdapter;
|