@floegence/floe-webapp-core 0.52.11 → 0.52.12
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/FloatingWindow.d.ts +11 -0
- package/dist/components/ui/FloatingWindow.js +318 -279
- package/dist/components/ui/SurfaceFloatingPanel.d.ts +4 -0
- package/dist/components/ui/SurfaceFloatingPanel.js +169 -80
- package/dist/components/ui/dialogSurfaceScope.js +74 -71
- package/dist/components/ui/pointerSession.d.ts +4 -0
- package/dist/components/ui/pointerSession.js +23 -15
- package/dist/components/ui/surfaceFloatingPanelGeometry.d.ts +1 -1
- package/dist/components/ui/surfaceFloatingPanelGeometry.js +36 -36
- package/package.json +1 -1
|
@@ -1,59 +1,81 @@
|
|
|
1
|
-
import { createComponent as
|
|
2
|
-
import {
|
|
3
|
-
import { cn as
|
|
4
|
-
import { useLayout as
|
|
5
|
-
import { Button as
|
|
6
|
-
import { Restore as
|
|
7
|
-
import { startHotInteraction as
|
|
8
|
-
import { startPointerSession as
|
|
9
|
-
import { resolveFloatingWindowViewport as
|
|
10
|
-
import { createFloatingPresence as
|
|
11
|
-
import { LOCAL_INTERACTION_SURFACE_ATTR as
|
|
12
|
-
import {
|
|
13
|
-
|
|
14
|
-
|
|
15
|
-
|
|
1
|
+
import { createComponent as l, Portal as Ve, spread as pe, mergeProps as $e, memo as J, insert as c, effect as f, setAttribute as Ge, addEventListener as y, className as w, template as s, use as _e, delegateEvents as Je } from "solid-js/web";
|
|
2
|
+
import { createSignal as g, createUniqueId as Ze, onCleanup as C, onMount as Ke, createEffect as P, Show as x, batch as Ie, untrack as Qe } from "solid-js";
|
|
3
|
+
import { cn as D } from "../../utils/cn.js";
|
|
4
|
+
import { useLayout as et } from "../../context/LayoutContext.js";
|
|
5
|
+
import { Button as Se } from "./Button.js";
|
|
6
|
+
import { Restore as tt, Maximize as nt, X as it } from "../icons/index.js";
|
|
7
|
+
import { startHotInteraction as ot } from "../../utils/hotInteraction.js";
|
|
8
|
+
import { startPointerSession as rt } from "./pointerSession.js";
|
|
9
|
+
import { resolveFloatingWindowViewport as Z, normalizeFloatingWindowRect as lt, resolveFloatingWindowRect as at } from "./floatingWindowGeometry.js";
|
|
10
|
+
import { createFloatingPresence as st } from "./floatingPresence.js";
|
|
11
|
+
import { LOCAL_INTERACTION_SURFACE_ATTR as Pe } from "./localInteractionSurface.js";
|
|
12
|
+
import { readSurfaceSafeArea as dt, resolveFloatingBoundary as ut } from "./surfaceFloatingBoundary.js";
|
|
13
|
+
import { SURFACE_PORTAL_LAYER_ATTR as ct, resolveSurfacePortalHost as ft, SURFACE_FLOATING_LAYER_ATTR as ht } from "./dialogSurfaceScope.js";
|
|
14
|
+
var wt = /* @__PURE__ */ s("<span hidden>"), gt = /* @__PURE__ */ s('<h2 class="text-xs leading-none font-medium truncate select-none">'), mt = /* @__PURE__ */ s('<div data-floe-floating-window-header-actions=true class="flex shrink-0 cursor-default items-center gap-1"><span aria-hidden=true class="mx-2 h-4 w-px shrink-0 bg-border">'), vt = /* @__PURE__ */ s('<div data-floe-floating-window-footer=true class="flex items-center justify-end gap-2 p-3 border-t border-border">'), yt = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=n style=touch-action:none>"), xt = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=s style=touch-action:none>"), bt = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=e style=touch-action:none>"), zt = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=w style=touch-action:none>"), pt = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=ne style=touch-action:none>"), $t = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=nw style=touch-action:none>"), _t = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=se style=touch-action:none>"), It = /* @__PURE__ */ s("<div data-floe-floating-window-resize-handle=sw style=touch-action:none>"), St = /* @__PURE__ */ s('<div data-floe-geometry-surface=floating-window><div data-floe-dialog-surface-host=true><div data-floe-floating-window-titlebar=true style=touch-action:none><div class="flex-1 min-w-0 px-2"></div><div class="flex h-full shrink-0 items-stretch"></div></div><div data-floe-floating-window-content=true class="flex-1 overflow-auto p-3">');
|
|
15
|
+
function Ot(n) {
|
|
16
|
+
const K = () => n.resizable ?? !0, Q = () => n.draggable ?? !0, ee = () => n.minSize ?? {
|
|
16
17
|
width: 200,
|
|
17
18
|
height: 150
|
|
18
|
-
},
|
|
19
|
+
}, te = () => n.maxSize ?? {
|
|
19
20
|
width: 1 / 0,
|
|
20
21
|
height: 1 / 0
|
|
21
|
-
}
|
|
22
|
+
};
|
|
23
|
+
let O;
|
|
24
|
+
const Re = dt(), [F, ne] = g({}), [Ae, ie] = g(1 / 0), [H, oe] = g(!0), h = () => !!(n.compactBelow && Ae() < n.compactBelow), $ = () => ({
|
|
25
|
+
top: (F().top ?? 0) + (n.viewportInsets?.top ?? 0),
|
|
26
|
+
right: (F().right ?? 0) + (n.viewportInsets?.right ?? 0),
|
|
27
|
+
bottom: (F().bottom ?? 0) + (n.viewportInsets?.bottom ?? 0),
|
|
28
|
+
left: (F().left ?? 0) + (n.viewportInsets?.left ?? 0)
|
|
29
|
+
}), Ee = () => n.zIndex ?? 100, Ce = Ze(), Fe = et(), L = () => Fe.isMobile(), re = 16, le = () => `floating-window-${Ce}-title`, [N, Le] = g(n.defaultPosition ?? {
|
|
22
30
|
x: 0,
|
|
23
31
|
y: 0
|
|
24
|
-
}), [
|
|
32
|
+
}), [Y, ke] = g(n.defaultSize ?? {
|
|
25
33
|
width: 400,
|
|
26
34
|
height: 300
|
|
27
|
-
}), [u,
|
|
28
|
-
open: () =>
|
|
35
|
+
}), [u, Me] = g(!1), [k, ae] = g(!1), [M, se] = g(!1), [Te, q] = g(!1), _ = st({
|
|
36
|
+
open: () => n.open,
|
|
29
37
|
exitDurationMs: 120
|
|
30
|
-
})
|
|
31
|
-
let
|
|
38
|
+
});
|
|
39
|
+
let de = {
|
|
32
40
|
x: 0,
|
|
33
41
|
y: 0
|
|
34
|
-
},
|
|
42
|
+
}, ue = {
|
|
35
43
|
x: 0,
|
|
36
44
|
y: 0,
|
|
37
45
|
width: 0,
|
|
38
46
|
height: 0
|
|
39
|
-
},
|
|
47
|
+
}, ce = {
|
|
40
48
|
x: 0,
|
|
41
49
|
y: 0
|
|
42
|
-
},
|
|
50
|
+
}, fe = {
|
|
43
51
|
x: 0,
|
|
44
52
|
y: 0,
|
|
45
53
|
width: 0,
|
|
46
54
|
height: 0
|
|
47
|
-
},
|
|
55
|
+
}, he = "se", a, d = null, T, b = null, R = {
|
|
48
56
|
x: 0,
|
|
49
57
|
y: 0
|
|
50
|
-
},
|
|
51
|
-
x:
|
|
52
|
-
y:
|
|
53
|
-
width:
|
|
54
|
-
height:
|
|
55
|
-
}
|
|
56
|
-
|
|
58
|
+
}, I = null, W = null, X = !1, z = {
|
|
59
|
+
x: n.defaultPosition?.x ?? 0,
|
|
60
|
+
y: n.defaultPosition?.y ?? 0,
|
|
61
|
+
width: n.defaultSize?.width ?? 400,
|
|
62
|
+
height: n.defaultSize?.height ?? 300
|
|
63
|
+
}, A = {
|
|
64
|
+
...z
|
|
65
|
+
}, p;
|
|
66
|
+
const we = (e) => {
|
|
67
|
+
A = {
|
|
68
|
+
...e
|
|
69
|
+
};
|
|
70
|
+
const t = Z({
|
|
71
|
+
width: window.innerWidth,
|
|
72
|
+
height: window.innerHeight
|
|
73
|
+
}, $());
|
|
74
|
+
p = {
|
|
75
|
+
x: t.width > e.width ? (e.x - t.x) / (t.width - e.width) : p?.x ?? 0.5,
|
|
76
|
+
y: t.height > e.height ? (e.y - t.y) / (t.height - e.height) : p?.y ?? 0.5
|
|
77
|
+
};
|
|
78
|
+
}, We = {
|
|
57
79
|
n: "ns-resize",
|
|
58
80
|
s: "ns-resize",
|
|
59
81
|
e: "ew-resize",
|
|
@@ -62,255 +84,253 @@ function St(i) {
|
|
|
62
84
|
nw: "nwse-resize",
|
|
63
85
|
se: "nwse-resize",
|
|
64
86
|
sw: "nesw-resize"
|
|
65
|
-
},
|
|
87
|
+
}, U = (e, t) => {
|
|
66
88
|
if (!e) {
|
|
67
|
-
|
|
89
|
+
W?.(), W = null;
|
|
68
90
|
return;
|
|
69
91
|
}
|
|
70
|
-
|
|
71
|
-
kind:
|
|
92
|
+
W?.(), W = ot({
|
|
93
|
+
kind: b === "resize" ? "resize" : "drag",
|
|
72
94
|
cursor: t,
|
|
73
95
|
lockUserSelect: !0
|
|
74
96
|
});
|
|
75
|
-
},
|
|
76
|
-
|
|
77
|
-
},
|
|
78
|
-
const e =
|
|
97
|
+
}, ge = (e) => {
|
|
98
|
+
z = e, a && (a.style.transform = `translate3d(${e.x}px, ${e.y}px, 0)`, a.style.width = `${e.width}px`, a.style.height = `${e.height}px`);
|
|
99
|
+
}, Be = () => {
|
|
100
|
+
const e = N(), t = Y();
|
|
79
101
|
return {
|
|
80
102
|
x: e.x,
|
|
81
103
|
y: e.y,
|
|
82
104
|
width: t.width,
|
|
83
105
|
height: t.height
|
|
84
106
|
};
|
|
85
|
-
},
|
|
86
|
-
|
|
107
|
+
}, j = (e) => {
|
|
108
|
+
z = e, Le((t) => t.x === e.x && t.y === e.y ? t : {
|
|
87
109
|
x: e.x,
|
|
88
110
|
y: e.y
|
|
89
|
-
}),
|
|
111
|
+
}), ke((t) => t.width === e.width && t.height === e.height ? t : {
|
|
90
112
|
width: e.width,
|
|
91
113
|
height: e.height
|
|
92
114
|
});
|
|
93
|
-
},
|
|
115
|
+
}, De = () => {
|
|
94
116
|
try {
|
|
95
|
-
|
|
117
|
+
a?.focus({
|
|
96
118
|
preventScroll: !0
|
|
97
119
|
});
|
|
98
120
|
} catch {
|
|
99
121
|
}
|
|
100
|
-
},
|
|
122
|
+
}, Oe = (e) => {
|
|
101
123
|
const t = e instanceof Element ? e : null;
|
|
102
124
|
return t ? t.closest('button, input, select, textarea, a, [role="button"], [tabindex]:not([tabindex="-1"])') === null : !0;
|
|
103
|
-
},
|
|
104
|
-
const
|
|
105
|
-
return !!(
|
|
106
|
-
},
|
|
107
|
-
if (!
|
|
108
|
-
const e =
|
|
125
|
+
}, V = (e) => !!a && e instanceof Node && a.contains(e), He = (e) => {
|
|
126
|
+
const o = (e instanceof Element ? e : null)?.closest('[role="menu"]')?.closest(`[${ht}="true"]`);
|
|
127
|
+
return !!(o && a?.contains(o));
|
|
128
|
+
}, Ne = () => {
|
|
129
|
+
if (!a) return null;
|
|
130
|
+
const e = a.getBoundingClientRect();
|
|
109
131
|
return {
|
|
110
132
|
x: e.left,
|
|
111
133
|
y: e.top,
|
|
112
134
|
width: e.width,
|
|
113
135
|
height: e.height
|
|
114
136
|
};
|
|
115
|
-
},
|
|
116
|
-
|
|
117
|
-
mode:
|
|
118
|
-
pointer:
|
|
119
|
-
dragStartPos:
|
|
120
|
-
dragStartRect:
|
|
121
|
-
resizeStartPos:
|
|
122
|
-
resizeStartRect:
|
|
123
|
-
resizeHandle:
|
|
124
|
-
minSize:
|
|
125
|
-
maxSize:
|
|
137
|
+
}, me = () => {
|
|
138
|
+
n.open && (d === null || b === null || typeof window > "u" || ge(at({
|
|
139
|
+
mode: b,
|
|
140
|
+
pointer: R,
|
|
141
|
+
dragStartPos: de,
|
|
142
|
+
dragStartRect: ue,
|
|
143
|
+
resizeStartPos: ce,
|
|
144
|
+
resizeStartRect: fe,
|
|
145
|
+
resizeHandle: he,
|
|
146
|
+
minSize: ee(),
|
|
147
|
+
maxSize: te(),
|
|
126
148
|
viewport: {
|
|
127
149
|
width: window.innerWidth,
|
|
128
150
|
height: window.innerHeight
|
|
129
151
|
},
|
|
130
|
-
viewportInsets:
|
|
131
|
-
mobile:
|
|
132
|
-
mobilePadding:
|
|
152
|
+
viewportInsets: $(),
|
|
153
|
+
mobile: L(),
|
|
154
|
+
mobilePadding: re
|
|
133
155
|
})));
|
|
134
|
-
},
|
|
156
|
+
}, E = (e) => {
|
|
135
157
|
if (typeof window > "u") return;
|
|
136
158
|
const t = {
|
|
137
159
|
width: window.innerWidth,
|
|
138
160
|
height: window.innerHeight
|
|
139
161
|
};
|
|
140
|
-
if (u()) {
|
|
141
|
-
|
|
162
|
+
if (u() || h()) {
|
|
163
|
+
j(Z(t, $()));
|
|
142
164
|
return;
|
|
143
165
|
}
|
|
144
|
-
|
|
145
|
-
rect:
|
|
146
|
-
minSize:
|
|
147
|
-
maxSize:
|
|
166
|
+
let r = lt({
|
|
167
|
+
rect: A,
|
|
168
|
+
minSize: ee(),
|
|
169
|
+
maxSize: te(),
|
|
148
170
|
viewport: t,
|
|
149
|
-
viewportInsets:
|
|
150
|
-
mobile:
|
|
151
|
-
mobilePadding:
|
|
171
|
+
viewportInsets: $(),
|
|
172
|
+
mobile: n.boundary === void 0 && L(),
|
|
173
|
+
mobilePadding: re,
|
|
152
174
|
center: e?.center ?? !1
|
|
153
|
-
})
|
|
154
|
-
|
|
155
|
-
|
|
156
|
-
|
|
157
|
-
|
|
158
|
-
|
|
159
|
-
|
|
160
|
-
|
|
161
|
-
|
|
175
|
+
});
|
|
176
|
+
if (n.boundary !== void 0 && p && !e?.center) {
|
|
177
|
+
const o = Z(t, $());
|
|
178
|
+
r = {
|
|
179
|
+
...r,
|
|
180
|
+
x: o.x + p.x * Math.max(0, o.width - r.width),
|
|
181
|
+
y: o.y + p.y * Math.max(0, o.height - r.height)
|
|
182
|
+
};
|
|
183
|
+
}
|
|
184
|
+
if (j(r), !p) {
|
|
185
|
+
const o = {
|
|
186
|
+
width: A.width,
|
|
187
|
+
height: A.height
|
|
188
|
+
};
|
|
189
|
+
we(r), Object.assign(A, o);
|
|
190
|
+
}
|
|
191
|
+
}, ve = (e) => {
|
|
192
|
+
I !== null && typeof cancelAnimationFrame < "u" && (cancelAnimationFrame(I), I = null), e && me();
|
|
193
|
+
const t = e ? Ne() ?? z : null;
|
|
194
|
+
Ie(() => {
|
|
195
|
+
t && (j(t), we(t)), d = null, b = null, ae(!1), se(!1);
|
|
196
|
+
}), U(!1, ""), T = void 0;
|
|
197
|
+
}, G = (e = !1) => {
|
|
198
|
+
T ? T.stop({
|
|
162
199
|
commit: e
|
|
163
|
-
}) :
|
|
200
|
+
}) : ve(e);
|
|
164
201
|
};
|
|
165
|
-
|
|
166
|
-
|
|
167
|
-
|
|
202
|
+
C(() => G(!1)), Ke(() => {
|
|
203
|
+
let e = 0;
|
|
204
|
+
const t = () => {
|
|
205
|
+
if (n.boundary !== void 0) {
|
|
206
|
+
const o = ut(ft({
|
|
207
|
+
owner: O
|
|
208
|
+
}), n.boundary, Re), S = o ? {
|
|
209
|
+
top: o.top,
|
|
210
|
+
left: o.left,
|
|
211
|
+
right: window.innerWidth - o.right,
|
|
212
|
+
bottom: window.innerHeight - o.bottom
|
|
213
|
+
} : {};
|
|
214
|
+
Ie(() => {
|
|
215
|
+
oe(!!(o && o.width > 16 && o.height > 16)), ie(o?.width ?? 0), ne((B) => JSON.stringify(B) === JSON.stringify(S) ? B : S);
|
|
216
|
+
});
|
|
217
|
+
} else
|
|
218
|
+
oe(!0), ie(window.innerWidth), ne((o) => Object.keys(o).length ? {} : o);
|
|
219
|
+
e = requestAnimationFrame(t);
|
|
220
|
+
};
|
|
221
|
+
t(), C(() => cancelAnimationFrame(e)), n.open || E({
|
|
222
|
+
center: !n.defaultPosition
|
|
168
223
|
});
|
|
169
|
-
const
|
|
170
|
-
|
|
224
|
+
const r = () => {
|
|
225
|
+
d === null && E({
|
|
171
226
|
center: !1
|
|
172
227
|
});
|
|
173
228
|
};
|
|
174
|
-
window.addEventListener("resize",
|
|
175
|
-
}),
|
|
176
|
-
if (!
|
|
177
|
-
|
|
178
|
-
const e = !
|
|
179
|
-
|
|
229
|
+
window.addEventListener("resize", r), C(() => window.removeEventListener("resize", r));
|
|
230
|
+
}), P(() => {
|
|
231
|
+
if (!n.open) return;
|
|
232
|
+
L();
|
|
233
|
+
const e = !X && !n.defaultPosition, t = () => {
|
|
234
|
+
E({
|
|
180
235
|
center: e
|
|
181
|
-
}),
|
|
236
|
+
}), X = !0;
|
|
182
237
|
};
|
|
183
238
|
if (typeof requestAnimationFrame > "u") {
|
|
184
239
|
t();
|
|
185
240
|
return;
|
|
186
241
|
}
|
|
187
242
|
requestAnimationFrame(t);
|
|
188
|
-
}),
|
|
189
|
-
!
|
|
243
|
+
}), P(() => {
|
|
244
|
+
$(), h(), !(!n.open || !X || d !== null) && Qe(() => E({
|
|
190
245
|
center: !1
|
|
191
|
-
}))
|
|
192
|
-
}),
|
|
193
|
-
if (!
|
|
246
|
+
}));
|
|
247
|
+
}), P(() => {
|
|
248
|
+
if (!n.open) return;
|
|
194
249
|
const e = (t) => {
|
|
195
250
|
if (t.key !== "Escape") return;
|
|
196
|
-
const
|
|
197
|
-
!
|
|
251
|
+
const r = typeof document < "u" ? document.activeElement : null;
|
|
252
|
+
!V(t.target) && !V(r) || He(t.target) || (t.preventDefault(), typeof t.stopImmediatePropagation == "function" ? t.stopImmediatePropagation() : t.stopPropagation(), n.onOpenChange(!1));
|
|
198
253
|
};
|
|
199
|
-
document.addEventListener("keydown", e, !0),
|
|
200
|
-
}),
|
|
201
|
-
if (!
|
|
202
|
-
|
|
254
|
+
document.addEventListener("keydown", e, !0), C(() => document.removeEventListener("keydown", e, !0));
|
|
255
|
+
}), P(() => {
|
|
256
|
+
if (!n.open) {
|
|
257
|
+
q(!1), G(!1);
|
|
203
258
|
return;
|
|
204
259
|
}
|
|
205
|
-
|
|
206
|
-
}),
|
|
207
|
-
if (!
|
|
208
|
-
const e = (
|
|
209
|
-
|
|
210
|
-
}, t = (
|
|
211
|
-
e(
|
|
212
|
-
},
|
|
213
|
-
e(
|
|
260
|
+
q(!0);
|
|
261
|
+
}), P(() => {
|
|
262
|
+
if (!n.open) return;
|
|
263
|
+
const e = (o) => {
|
|
264
|
+
q(V(o));
|
|
265
|
+
}, t = (o) => {
|
|
266
|
+
e(o.target);
|
|
267
|
+
}, r = (o) => {
|
|
268
|
+
e(o.target);
|
|
214
269
|
};
|
|
215
|
-
document.addEventListener("pointerdown", t), document.addEventListener("focusin",
|
|
216
|
-
document.removeEventListener("pointerdown", t), document.removeEventListener("focusin",
|
|
270
|
+
document.addEventListener("pointerdown", t), document.addEventListener("focusin", r), C(() => {
|
|
271
|
+
document.removeEventListener("pointerdown", t), document.removeEventListener("focusin", r);
|
|
217
272
|
});
|
|
218
|
-
}),
|
|
219
|
-
if (!
|
|
220
|
-
const e =
|
|
221
|
-
|
|
273
|
+
}), P(() => {
|
|
274
|
+
if (!n.open) return;
|
|
275
|
+
const e = Be();
|
|
276
|
+
d === null ? ge(e) : z = e;
|
|
222
277
|
});
|
|
223
|
-
const
|
|
224
|
-
!
|
|
278
|
+
const Ye = (e) => {
|
|
279
|
+
!Q() || u() || h() || d !== null || e.pointerType === "mouse" && e.button !== 0 || e.target?.closest('button, input, select, textarea, a, [role="button"], [data-floe-floating-window-header-actions]') || (e.preventDefault(), d = e.pointerId, b = "drag", ae(!0), de = {
|
|
225
280
|
x: e.clientX,
|
|
226
281
|
y: e.clientY
|
|
227
|
-
},
|
|
228
|
-
...
|
|
229
|
-
},
|
|
282
|
+
}, ue = {
|
|
283
|
+
...z
|
|
284
|
+
}, R = {
|
|
230
285
|
x: e.clientX,
|
|
231
286
|
y: e.clientY
|
|
232
|
-
},
|
|
233
|
-
},
|
|
234
|
-
!
|
|
287
|
+
}, U(!0, "grabbing"), xe(e));
|
|
288
|
+
}, m = (e) => (t) => {
|
|
289
|
+
!K() || u() || h() || d !== null || t.pointerType === "mouse" && t.button !== 0 || (t.preventDefault(), t.stopPropagation(), d = t.pointerId, b = "resize", se(!0), he = e, ce = {
|
|
235
290
|
x: t.clientX,
|
|
236
291
|
y: t.clientY
|
|
237
|
-
},
|
|
238
|
-
...
|
|
239
|
-
},
|
|
292
|
+
}, fe = {
|
|
293
|
+
...z
|
|
294
|
+
}, R = {
|
|
240
295
|
x: t.clientX,
|
|
241
296
|
y: t.clientY
|
|
242
|
-
},
|
|
243
|
-
},
|
|
244
|
-
|
|
245
|
-
},
|
|
246
|
-
if (!(
|
|
297
|
+
}, U(!0, We[e]), xe(t));
|
|
298
|
+
}, ye = () => {
|
|
299
|
+
I = null, me();
|
|
300
|
+
}, qe = (e) => {
|
|
301
|
+
if (!(d === null || e.pointerId !== d) && b !== null && (R = {
|
|
247
302
|
x: e.clientX,
|
|
248
303
|
y: e.clientY
|
|
249
|
-
},
|
|
304
|
+
}, I === null)) {
|
|
250
305
|
if (typeof requestAnimationFrame > "u") {
|
|
251
|
-
|
|
306
|
+
ye();
|
|
252
307
|
return;
|
|
253
308
|
}
|
|
254
|
-
|
|
309
|
+
I = requestAnimationFrame(ye);
|
|
255
310
|
}
|
|
256
|
-
},
|
|
257
|
-
|
|
311
|
+
}, xe = (e) => {
|
|
312
|
+
T = rt({
|
|
258
313
|
pointerEvent: e,
|
|
259
|
-
captureEl:
|
|
260
|
-
onMove:
|
|
314
|
+
captureEl: a,
|
|
315
|
+
onMove: qe,
|
|
261
316
|
onEnd: ({
|
|
262
317
|
commit: t,
|
|
263
|
-
reason:
|
|
264
|
-
snapshot:
|
|
318
|
+
reason: r,
|
|
319
|
+
snapshot: o
|
|
265
320
|
}) => {
|
|
266
|
-
|
|
267
|
-
x:
|
|
268
|
-
y:
|
|
269
|
-
},
|
|
321
|
+
R = {
|
|
322
|
+
x: o.latestClientX,
|
|
323
|
+
y: o.latestClientY
|
|
324
|
+
}, ve(t || r === "pointer_cancel");
|
|
270
325
|
}
|
|
271
326
|
});
|
|
272
|
-
},
|
|
273
|
-
|
|
274
|
-
|
|
275
|
-
|
|
276
|
-
|
|
277
|
-
|
|
278
|
-
|
|
279
|
-
width: t.size.width,
|
|
280
|
-
height: t.size.height
|
|
281
|
-
},
|
|
282
|
-
minSize: M(),
|
|
283
|
-
maxSize: T(),
|
|
284
|
-
viewport: {
|
|
285
|
-
width: window.innerWidth,
|
|
286
|
-
height: window.innerHeight
|
|
287
|
-
},
|
|
288
|
-
viewportInsets: z(),
|
|
289
|
-
mobile: _(),
|
|
290
|
-
mobilePadding: D,
|
|
291
|
-
center: !1
|
|
292
|
-
})), Z(!1);
|
|
293
|
-
return;
|
|
294
|
-
}
|
|
295
|
-
const e = X();
|
|
296
|
-
Se({
|
|
297
|
-
position: {
|
|
298
|
-
x: e.x,
|
|
299
|
-
y: e.y
|
|
300
|
-
},
|
|
301
|
-
size: {
|
|
302
|
-
width: e.width,
|
|
303
|
-
height: e.height
|
|
304
|
-
}
|
|
305
|
-
}), P(ge({
|
|
306
|
-
width: window.innerWidth,
|
|
307
|
-
height: window.innerHeight
|
|
308
|
-
}, z())), Z(!0);
|
|
309
|
-
}, Le = (e) => {
|
|
310
|
-
e.target?.closest("button, [data-floe-floating-window-header-actions]") || de();
|
|
311
|
-
}, ke = (e) => {
|
|
312
|
-
Re(e.target) && Pe();
|
|
313
|
-
}, g = (e) => k("absolute z-10", {
|
|
327
|
+
}, be = () => {
|
|
328
|
+
d !== null && G(!0), !h() && (Me(!u()), E());
|
|
329
|
+
}, Xe = (e) => {
|
|
330
|
+
e.target?.closest("button, [data-floe-floating-window-header-actions]") || be();
|
|
331
|
+
}, Ue = (e) => {
|
|
332
|
+
Oe(e.target) && De();
|
|
333
|
+
}, v = (e) => D("absolute z-10", {
|
|
314
334
|
n: "cursor-ns-resize top-0 left-2 right-2 h-1",
|
|
315
335
|
s: "cursor-ns-resize bottom-0 left-2 right-2 h-1",
|
|
316
336
|
e: "cursor-ew-resize right-0 top-2 bottom-2 w-1",
|
|
@@ -320,58 +340,68 @@ function St(i) {
|
|
|
320
340
|
se: "cursor-nwse-resize bottom-0 right-0 w-2 h-2",
|
|
321
341
|
sw: "cursor-nesw-resize bottom-0 left-0 w-2 h-2"
|
|
322
342
|
}[e]);
|
|
323
|
-
return
|
|
343
|
+
return [(() => {
|
|
344
|
+
var e = wt(), t = O;
|
|
345
|
+
return typeof t == "function" ? _e(t, e) : O = e, e;
|
|
346
|
+
})(), l(x, {
|
|
324
347
|
get when() {
|
|
325
|
-
return
|
|
348
|
+
return _.mounted();
|
|
326
349
|
},
|
|
327
350
|
get children() {
|
|
328
|
-
return
|
|
351
|
+
return l(Ve, {
|
|
329
352
|
get children() {
|
|
330
|
-
var e =
|
|
331
|
-
return typeof
|
|
353
|
+
var e = St(), t = e.firstChild, r = t.firstChild, o = r.firstChild, S = o.nextSibling, B = r.nextSibling, ze = a;
|
|
354
|
+
return typeof ze == "function" ? _e(ze, e) : a = e, pe(e, $e({
|
|
332
355
|
get "data-floating-presence"() {
|
|
333
|
-
return
|
|
356
|
+
return _.state();
|
|
334
357
|
},
|
|
335
358
|
get "aria-hidden"() {
|
|
336
|
-
return
|
|
359
|
+
return _.exiting() || !H() ? "true" : void 0;
|
|
360
|
+
},
|
|
361
|
+
get inert() {
|
|
362
|
+
return _.exiting() || !H();
|
|
363
|
+
},
|
|
364
|
+
get "data-floe-floating-window-compact"() {
|
|
365
|
+
return h() ? "true" : void 0;
|
|
337
366
|
}
|
|
338
367
|
}, {
|
|
339
|
-
[
|
|
368
|
+
[Pe]: "true"
|
|
340
369
|
}, {
|
|
341
370
|
get class() {
|
|
342
|
-
return
|
|
371
|
+
return D("fixed left-0 top-0 z-[100] flex flex-col", (k() || M()) && "select-none", _.exiting() && "pointer-events-none");
|
|
343
372
|
},
|
|
344
373
|
get style() {
|
|
345
374
|
return {
|
|
346
|
-
|
|
347
|
-
|
|
348
|
-
|
|
349
|
-
|
|
350
|
-
"
|
|
375
|
+
visibility: H() ? void 0 : "hidden",
|
|
376
|
+
width: `${Y().width}px`,
|
|
377
|
+
height: `${Y().height}px`,
|
|
378
|
+
transform: `translate3d(${N().x}px, ${N().y}px, 0)`,
|
|
379
|
+
"z-index": Ee(),
|
|
380
|
+
"will-change": k() ? "transform" : M() ? "transform, width, height" : void 0
|
|
351
381
|
};
|
|
352
382
|
},
|
|
353
383
|
role: "dialog",
|
|
354
384
|
get "aria-labelledby"() {
|
|
355
|
-
return
|
|
385
|
+
return J(() => !!n.title)() ? le() : void 0;
|
|
356
386
|
},
|
|
357
387
|
tabIndex: -1,
|
|
358
|
-
onPointerDown:
|
|
359
|
-
}), !1, !0),
|
|
360
|
-
[
|
|
388
|
+
onPointerDown: Ue
|
|
389
|
+
}), !1, !0), pe(t, $e({
|
|
390
|
+
[ct]: "true"
|
|
361
391
|
}, {
|
|
362
392
|
"data-floe-floating-window-surface": "true",
|
|
363
393
|
"data-floe-surface": "floating",
|
|
364
394
|
get "data-floe-surface-interacting"() {
|
|
365
|
-
return
|
|
395
|
+
return k() || M() ? "true" : void 0;
|
|
366
396
|
},
|
|
367
397
|
get "data-floe-floating-window-state"() {
|
|
368
|
-
return
|
|
398
|
+
return Te() ? "active" : "inactive";
|
|
369
399
|
}
|
|
370
400
|
}, {
|
|
371
|
-
[
|
|
401
|
+
[Pe]: "true"
|
|
372
402
|
}, {
|
|
373
403
|
get class() {
|
|
374
|
-
return
|
|
404
|
+
return D("relative flex h-full w-full flex-col overflow-hidden", "text-card-foreground rounded-md", "border", "floe-floating-presence floe-floating-window-motion", (k() || M()) && "floe-floating-presence--suspended", u() && "rounded-none", n.class);
|
|
375
405
|
},
|
|
376
406
|
get style() {
|
|
377
407
|
return {
|
|
@@ -379,119 +409,128 @@ function St(i) {
|
|
|
379
409
|
};
|
|
380
410
|
},
|
|
381
411
|
get "data-floating-presence"() {
|
|
382
|
-
return
|
|
412
|
+
return _.state();
|
|
383
413
|
}
|
|
384
|
-
}), !1, !0),
|
|
414
|
+
}), !1, !0), r.$$dblclick = Xe, r.$$pointerdown = Ye, c(o, l(x, {
|
|
385
415
|
get when() {
|
|
386
|
-
return
|
|
416
|
+
return n.title;
|
|
387
417
|
},
|
|
388
418
|
get children() {
|
|
389
|
-
var
|
|
390
|
-
return c(
|
|
419
|
+
var i = gt();
|
|
420
|
+
return c(i, () => n.title), f(() => Ge(i, "id", le())), i;
|
|
391
421
|
}
|
|
392
|
-
})), c(
|
|
422
|
+
})), c(r, l(x, {
|
|
393
423
|
get when() {
|
|
394
|
-
return
|
|
424
|
+
return n.headerActions;
|
|
395
425
|
},
|
|
396
426
|
get children() {
|
|
397
|
-
var
|
|
398
|
-
return c(
|
|
427
|
+
var i = mt(), je = i.firstChild;
|
|
428
|
+
return c(i, () => n.headerActions, je), i;
|
|
399
429
|
}
|
|
400
|
-
}),
|
|
401
|
-
|
|
402
|
-
|
|
403
|
-
"data-floe-floating-window-control": "maximize",
|
|
404
|
-
class: "h-full w-9 shrink-0 rounded-none border-0 px-0 active:scale-100",
|
|
405
|
-
onClick: (n) => {
|
|
406
|
-
n.stopPropagation(), de();
|
|
407
|
-
},
|
|
408
|
-
get "aria-label"() {
|
|
409
|
-
return u() ? "Restore" : "Maximize";
|
|
430
|
+
}), S), c(S, l(x, {
|
|
431
|
+
get when() {
|
|
432
|
+
return !h();
|
|
410
433
|
},
|
|
411
434
|
get children() {
|
|
412
|
-
return
|
|
413
|
-
|
|
414
|
-
|
|
435
|
+
return l(Se, {
|
|
436
|
+
variant: "ghost",
|
|
437
|
+
size: "icon",
|
|
438
|
+
"data-floe-floating-window-control": "maximize",
|
|
439
|
+
class: "h-full w-9 shrink-0 rounded-none border-0 px-0 active:scale-100",
|
|
440
|
+
onClick: (i) => {
|
|
441
|
+
i.stopPropagation(), be();
|
|
415
442
|
},
|
|
416
|
-
get
|
|
417
|
-
return
|
|
418
|
-
class: "w-3 h-3"
|
|
419
|
-
});
|
|
443
|
+
get "aria-label"() {
|
|
444
|
+
return J(() => !!u())() ? n.labels?.restore ?? "Restore" : n.labels?.maximize ?? "Maximize";
|
|
420
445
|
},
|
|
421
446
|
get children() {
|
|
422
|
-
return
|
|
423
|
-
|
|
447
|
+
return l(x, {
|
|
448
|
+
get when() {
|
|
449
|
+
return u();
|
|
450
|
+
},
|
|
451
|
+
get fallback() {
|
|
452
|
+
return l(nt, {
|
|
453
|
+
class: "w-3 h-3"
|
|
454
|
+
});
|
|
455
|
+
},
|
|
456
|
+
get children() {
|
|
457
|
+
return l(tt, {
|
|
458
|
+
class: "w-3 h-3"
|
|
459
|
+
});
|
|
460
|
+
}
|
|
424
461
|
});
|
|
425
462
|
}
|
|
426
463
|
});
|
|
427
464
|
}
|
|
428
|
-
}), null), c(
|
|
465
|
+
}), null), c(S, l(Se, {
|
|
429
466
|
variant: "ghost-destructive",
|
|
430
467
|
size: "icon",
|
|
431
468
|
"data-floe-floating-window-control": "close",
|
|
432
469
|
class: "h-full w-10 shrink-0 rounded-none border-0 px-0 active:scale-100",
|
|
433
|
-
onClick: (
|
|
434
|
-
|
|
470
|
+
onClick: (i) => {
|
|
471
|
+
i.stopPropagation(), n.onOpenChange(!1);
|
|
472
|
+
},
|
|
473
|
+
get "aria-label"() {
|
|
474
|
+
return n.labels?.close ?? "Close";
|
|
435
475
|
},
|
|
436
|
-
"aria-label": "Close",
|
|
437
476
|
get children() {
|
|
438
|
-
return
|
|
477
|
+
return l(it, {
|
|
439
478
|
class: "w-3.5 h-3.5"
|
|
440
479
|
});
|
|
441
480
|
}
|
|
442
|
-
}), null), c(
|
|
481
|
+
}), null), c(B, () => n.children), c(t, l(x, {
|
|
443
482
|
get when() {
|
|
444
|
-
return
|
|
483
|
+
return n.footer;
|
|
445
484
|
},
|
|
446
485
|
get children() {
|
|
447
|
-
var
|
|
448
|
-
return c(
|
|
486
|
+
var i = vt();
|
|
487
|
+
return c(i, () => n.footer), i;
|
|
449
488
|
}
|
|
450
|
-
}), null), c(t,
|
|
489
|
+
}), null), c(t, l(x, {
|
|
451
490
|
get when() {
|
|
452
|
-
return
|
|
491
|
+
return J(() => !!(K() && !u()))() && !h();
|
|
453
492
|
},
|
|
454
493
|
get children() {
|
|
455
494
|
return [(() => {
|
|
456
|
-
var
|
|
457
|
-
return
|
|
495
|
+
var i = yt();
|
|
496
|
+
return y(i, "pointerdown", m("n"), !0), f(() => w(i, v("n"))), i;
|
|
458
497
|
})(), (() => {
|
|
459
|
-
var
|
|
460
|
-
return
|
|
461
|
-
})(),
|
|
498
|
+
var i = xt();
|
|
499
|
+
return y(i, "pointerdown", m("s"), !0), f(() => w(i, v("s"))), i;
|
|
500
|
+
})(), l(x, {
|
|
462
501
|
get when() {
|
|
463
|
-
return !
|
|
502
|
+
return !L();
|
|
464
503
|
},
|
|
465
504
|
get children() {
|
|
466
505
|
return [(() => {
|
|
467
|
-
var
|
|
468
|
-
return
|
|
506
|
+
var i = bt();
|
|
507
|
+
return y(i, "pointerdown", m("e"), !0), f(() => w(i, v("e"))), i;
|
|
469
508
|
})(), (() => {
|
|
470
|
-
var
|
|
471
|
-
return
|
|
509
|
+
var i = zt();
|
|
510
|
+
return y(i, "pointerdown", m("w"), !0), f(() => w(i, v("w"))), i;
|
|
472
511
|
})(), (() => {
|
|
473
|
-
var
|
|
474
|
-
return
|
|
512
|
+
var i = pt();
|
|
513
|
+
return y(i, "pointerdown", m("ne"), !0), f(() => w(i, v("ne"))), i;
|
|
475
514
|
})(), (() => {
|
|
476
|
-
var
|
|
477
|
-
return
|
|
515
|
+
var i = $t();
|
|
516
|
+
return y(i, "pointerdown", m("nw"), !0), f(() => w(i, v("nw"))), i;
|
|
478
517
|
})(), (() => {
|
|
479
|
-
var
|
|
480
|
-
return
|
|
518
|
+
var i = _t();
|
|
519
|
+
return y(i, "pointerdown", m("se"), !0), f(() => w(i, v("se"))), i;
|
|
481
520
|
})(), (() => {
|
|
482
|
-
var
|
|
483
|
-
return
|
|
521
|
+
var i = It();
|
|
522
|
+
return y(i, "pointerdown", m("sw"), !0), f(() => w(i, v("sw"))), i;
|
|
484
523
|
})()];
|
|
485
524
|
}
|
|
486
525
|
})];
|
|
487
526
|
}
|
|
488
|
-
}), null), f(() =>
|
|
527
|
+
}), null), f(() => w(r, D("flex shrink-0 items-center justify-between h-8", "border-b", u() ? "rounded-none" : "rounded-t-md", Q() && !u() && !h() && "cursor-move"))), e;
|
|
489
528
|
}
|
|
490
529
|
});
|
|
491
530
|
}
|
|
492
|
-
});
|
|
531
|
+
})];
|
|
493
532
|
}
|
|
494
|
-
|
|
533
|
+
Je(["pointerdown", "dblclick"]);
|
|
495
534
|
export {
|
|
496
|
-
|
|
535
|
+
Ot as FloatingWindow
|
|
497
536
|
};
|