@mkbabb/glass-ui 10.1.1 → 10.1.3
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/MIGRATION.md +45 -0
- package/dist/{command-CTQCaHVA.js → command-CatrAsrl.js} +1 -1
- package/dist/command.js +1 -1
- package/dist/components/dock/DockControl.vue.d.ts +3 -0
- package/dist/components/dock/DockTrigger.vue.d.ts +5 -5
- package/dist/components/dock/composables/dockMorphMeasure.d.ts +44 -7
- package/dist/components/dock/composables/useDockMorph.d.ts +9 -0
- package/dist/components/dock/composables/useDockRun.d.ts +5 -0
- package/dist/components/dock/constants.d.ts +10 -0
- package/dist/components/dock/styles/controls/triggers.css +1 -1
- package/dist/components/dock/styles/index.css +1 -1
- package/dist/components/dock/styles/layers.css +1 -1
- package/dist/components/dock/styles/shape.css +1 -1
- package/dist/components/dock/styles/shell.css +1 -1
- package/dist/dock.js +815 -519
- package/dist/easing.js +3 -3
- package/dist/glass-ui.js +6 -6
- package/dist/labeled-field.js +1 -1
- package/dist/{menu-DN29N6KR.js → menu-DaYAZiVW.js} +1 -1
- package/dist/menu.js +1 -1
- package/dist/{participation-Cs_UX_Dc.js → participation-B7UFdgXB.js} +11 -11
- package/dist/{popover-CJpvT2E6.js → popover-BdpoE4Ar.js} +1 -1
- package/dist/popover.js +1 -1
- package/dist/{select-5QMeUAU6.js → select-BiF0FCZf.js} +1 -1
- package/dist/select.js +1 -1
- package/dist/{slider-D1zkobtO.js → slider-5uoY-cLG.js} +1 -1
- package/dist/slider.js +1 -1
- package/dist/{tabs-C0PYq3Tb.js → tabs-C5sC0fBE.js} +1 -1
- package/dist/tabs.js +1 -1
- package/dist/{tooltip-D7j6TsE4.js → tooltip-CZVubnJf.js} +1 -1
- package/dist/tooltip.js +1 -1
- package/package.json +1 -1
package/dist/dock.js
CHANGED
|
@@ -6,44 +6,44 @@ import { n as i } from "./springPresets-Cbe0Voqg.js";
|
|
|
6
6
|
import { t as a } from "./useLiquidPress-h1scrPtP.js";
|
|
7
7
|
import { t as o } from "./useMotionAxis-D-rtIhca.js";
|
|
8
8
|
import { n as s, t as c } from "./createContext-BhkE9mLH.js";
|
|
9
|
-
import { a as l, c as u, d, i as
|
|
10
|
-
import { t as
|
|
11
|
-
import { n as
|
|
12
|
-
import { t as
|
|
13
|
-
import { t as
|
|
14
|
-
import { t as
|
|
15
|
-
import { t as
|
|
16
|
-
import { t as
|
|
17
|
-
import { n as
|
|
18
|
-
import { n as
|
|
19
|
-
import { Fragment as
|
|
20
|
-
import { PopoverTrigger as
|
|
21
|
-
import { ChevronDown as
|
|
22
|
-
import { SpringProgress as
|
|
23
|
-
import { useMediaQuery as
|
|
9
|
+
import { a as l, c as u, d, f, i as p, l as m, n as h, o as g, r as _, s as v, u as y } from "./participation-B7UFdgXB.js";
|
|
10
|
+
import { t as b } from "./useResizeObserver-CdUlm2QZ.js";
|
|
11
|
+
import { n as x } from "./useResolveTokenColor-B2FfJnd9.js";
|
|
12
|
+
import { t as S } from "./useIntersectionPause-CzKR3EyP.js";
|
|
13
|
+
import { t as C } from "./focus-Duf7EpUu.js";
|
|
14
|
+
import { t as w } from "./DropdownMenuTrigger-CKRnhDSQ.js";
|
|
15
|
+
import { t as T } from "./useSelectionGroup-zsEwitF6.js";
|
|
16
|
+
import { t as E } from "./useDragMorph-B363RUbF.js";
|
|
17
|
+
import { n as D } from "./useDockCtaReceive-BSSgD6mu.js";
|
|
18
|
+
import { n as O, t as k } from "./useScrollChrome-BJbWV32F.js";
|
|
19
|
+
import { Fragment as ee, computed as A, createBlock as j, createCommentVNode as M, createElementBlock as N, createElementVNode as P, createVNode as F, defineComponent as I, h as te, mergeModels as L, mergeProps as R, nextTick as z, normalizeClass as B, normalizeStyle as ne, onBeforeUnmount as V, onMounted as H, onScopeDispose as U, onUnmounted as re, openBlock as W, readonly as G, ref as K, renderList as ie, renderSlot as q, resolveDynamicComponent as ae, toDisplayString as oe, unref as J, useId as se, useModel as ce, useTemplateRef as Y, watch as X, withCtx as Z, withDirectives as Q, withModifiers as le } from "vue";
|
|
20
|
+
import { PopoverTrigger as ue, Primitive as de, SelectIcon as fe, SelectTrigger as pe } from "reka-ui";
|
|
21
|
+
import { ChevronDown as me, Pause as he, Play as ge } from "@lucide/vue";
|
|
22
|
+
import { SpringProgress as _e } from "@mkbabb/keyframes.js";
|
|
23
|
+
import { useMediaQuery as ve } from "@vueuse/core";
|
|
24
24
|
//#region src/components/_shared/overlay/isTeleportedTarget.ts
|
|
25
|
-
function
|
|
25
|
+
function ye(e, t) {
|
|
26
26
|
if (!(e instanceof Element)) return !1;
|
|
27
27
|
let n = e.closest("[data-glass-dock-portal]");
|
|
28
28
|
return n ? !t || n.getAttribute("data-glass-dock-owner") === t : !1;
|
|
29
29
|
}
|
|
30
30
|
//#endregion
|
|
31
31
|
//#region src/composables/glass/backdropSampleMath.ts
|
|
32
|
-
function
|
|
32
|
+
function be(e) {
|
|
33
33
|
let t = e / 255;
|
|
34
34
|
return t <= .03928 ? t / 12.92 : ((t + .055) / 1.055) ** 2.4;
|
|
35
35
|
}
|
|
36
|
-
function
|
|
37
|
-
return .2126 *
|
|
36
|
+
function xe(e, t, n) {
|
|
37
|
+
return .2126 * be(e) + .7152 * be(t) + .0722 * be(n);
|
|
38
38
|
}
|
|
39
|
-
function
|
|
39
|
+
function Se(e, t, n, r, i) {
|
|
40
40
|
return [
|
|
41
41
|
e * r + i[0] * (1 - r),
|
|
42
42
|
t * r + i[1] * (1 - r),
|
|
43
43
|
n * r + i[2] * (1 - r)
|
|
44
44
|
];
|
|
45
45
|
}
|
|
46
|
-
function
|
|
46
|
+
function Ce(e) {
|
|
47
47
|
let t = e.match(/rgba?\(\s*([\d.]+)[,\s]+([\d.]+)[,\s]+([\d.]+)(?:[,\s/]+([\d.]+))?/i);
|
|
48
48
|
return t ? [
|
|
49
49
|
Number(t[1]),
|
|
@@ -52,31 +52,31 @@ function be(e) {
|
|
|
52
52
|
t[4] === void 0 ? 1 : Number(t[4])
|
|
53
53
|
] : null;
|
|
54
54
|
}
|
|
55
|
-
function
|
|
55
|
+
function we(e) {
|
|
56
56
|
return typeof HTMLCanvasElement < "u" && e instanceof HTMLCanvasElement;
|
|
57
57
|
}
|
|
58
|
-
var
|
|
59
|
-
function
|
|
58
|
+
var Te = "[data-glass-field-canvas] canvas, canvas[data-glass-field-canvas]";
|
|
59
|
+
function Ee(e) {
|
|
60
60
|
if (!e) {
|
|
61
61
|
if (typeof document < "u") {
|
|
62
|
-
let e = document.querySelector(
|
|
63
|
-
if (
|
|
62
|
+
let e = document.querySelector(Te);
|
|
63
|
+
if (we(e)) return e;
|
|
64
64
|
}
|
|
65
65
|
return null;
|
|
66
66
|
}
|
|
67
|
-
if (
|
|
67
|
+
if (we(e)) return e;
|
|
68
68
|
if (typeof e == "function") {
|
|
69
69
|
let t = e();
|
|
70
|
-
return
|
|
70
|
+
return we(t) ? t : null;
|
|
71
71
|
}
|
|
72
72
|
if (typeof e == "string" && typeof document < "u") {
|
|
73
73
|
let t = document.querySelector(e);
|
|
74
|
-
return
|
|
74
|
+
return we(t) ? t : null;
|
|
75
75
|
}
|
|
76
76
|
return null;
|
|
77
77
|
}
|
|
78
|
-
function
|
|
79
|
-
let n =
|
|
78
|
+
function De(e, t) {
|
|
79
|
+
let n = Ce(e);
|
|
80
80
|
if (n) return n;
|
|
81
81
|
if (!t) return null;
|
|
82
82
|
try {
|
|
@@ -92,7 +92,7 @@ function we(e, t) {
|
|
|
92
92
|
return null;
|
|
93
93
|
}
|
|
94
94
|
}
|
|
95
|
-
function
|
|
95
|
+
function Oe(e, t, n, r) {
|
|
96
96
|
if (!t || t.width === 0 || t.height === 0 || !n) return null;
|
|
97
97
|
let i = e.getBoundingClientRect(), a = t.getBoundingClientRect();
|
|
98
98
|
if (a.width === 0 || a.height === 0) return null;
|
|
@@ -102,60 +102,60 @@ function Te(e, t, n, r) {
|
|
|
102
102
|
n.clearRect(0, 0, 32, 32), n.drawImage(t, c, l, u, d, 0, 0, 32, 32);
|
|
103
103
|
let e = n.getImageData(0, 0, 32, 32).data, i = 0, a = 0, o = 0;
|
|
104
104
|
for (let t = 0; t < e.length; t += 4) {
|
|
105
|
-
let n = e[t + 3] / 255, [s, c, l] =
|
|
106
|
-
i +=
|
|
105
|
+
let n = e[t + 3] / 255, [s, c, l] = Se(e[t], e[t + 1], e[t + 2], n, r);
|
|
106
|
+
i += xe(s, c, l), a += n, o++;
|
|
107
107
|
}
|
|
108
108
|
return o === 0 || a / o < .02 ? null : { luma: i / o };
|
|
109
109
|
} catch {
|
|
110
110
|
return null;
|
|
111
111
|
}
|
|
112
112
|
}
|
|
113
|
-
function
|
|
113
|
+
function ke(e, t) {
|
|
114
114
|
let n = e.getBoundingClientRect(), r = n.left + n.width / 2, i = n.top + n.height / 2, a = document.elementsFromPoint(r, i);
|
|
115
115
|
for (let n of a) {
|
|
116
116
|
if (!(n instanceof HTMLElement) || n === e || e.contains(n)) continue;
|
|
117
|
-
let r = getComputedStyle(n).backgroundColor, i =
|
|
117
|
+
let r = getComputedStyle(n).backgroundColor, i = De(x(r, e), t);
|
|
118
118
|
if (i && !(i[3] < .5)) return i;
|
|
119
119
|
}
|
|
120
|
-
return
|
|
120
|
+
return De(x(getComputedStyle(document.body).backgroundColor, e), t);
|
|
121
121
|
}
|
|
122
|
-
var
|
|
122
|
+
var Ae = [
|
|
123
123
|
255,
|
|
124
124
|
255,
|
|
125
125
|
255
|
|
126
126
|
];
|
|
127
|
-
function
|
|
128
|
-
let n =
|
|
127
|
+
function je(e, t) {
|
|
128
|
+
let n = ke(e, t);
|
|
129
129
|
return n && n[3] >= .5 ? [
|
|
130
130
|
n[0],
|
|
131
131
|
n[1],
|
|
132
132
|
n[2]
|
|
133
|
-
] : [...
|
|
133
|
+
] : [...Ae];
|
|
134
134
|
}
|
|
135
|
-
function
|
|
136
|
-
let n =
|
|
137
|
-
return n ?
|
|
135
|
+
function Me(e, t) {
|
|
136
|
+
let n = ke(e, t);
|
|
137
|
+
return n ? Ne(n) : null;
|
|
138
138
|
}
|
|
139
|
-
function
|
|
140
|
-
return { luma:
|
|
139
|
+
function Ne(e) {
|
|
140
|
+
return { luma: xe(e[0], e[1], e[2]) };
|
|
141
141
|
}
|
|
142
142
|
//#endregion
|
|
143
143
|
//#region src/composables/glass/useGlassBackdropLuminance.ts
|
|
144
|
-
var
|
|
145
|
-
function
|
|
144
|
+
var Pe = "data-glass-backdrop-shared";
|
|
145
|
+
function Fe(e, n = {}) {
|
|
146
146
|
let { lightThreshold: r = .6, minSampleIntervalMs: i = 250, writeBucket: a = !0 } = n, o = Math.max(250, i), s = n.shared === !0;
|
|
147
147
|
function c(e) {
|
|
148
|
-
return !s && e.closest(`[${
|
|
148
|
+
return !s && e.closest(`[${Pe}]`) !== null;
|
|
149
149
|
}
|
|
150
|
-
let l =
|
|
150
|
+
let l = K(null), u = K(null), d = K({
|
|
151
151
|
state: "pending",
|
|
152
152
|
mode: n.live === !0 ? "live" : "static",
|
|
153
153
|
source: n.live === !0 ? "canvas" : "elements"
|
|
154
154
|
});
|
|
155
155
|
if (typeof window > "u") return {
|
|
156
|
-
luma:
|
|
157
|
-
bucket:
|
|
158
|
-
sample:
|
|
156
|
+
luma: G(l),
|
|
157
|
+
bucket: G(u),
|
|
158
|
+
sample: G(d),
|
|
159
159
|
sampleNow: () => {},
|
|
160
160
|
dispose: () => {}
|
|
161
161
|
};
|
|
@@ -164,7 +164,7 @@ function Me(e, n = {}) {
|
|
|
164
164
|
return p || (p = document.createElement("canvas"), p.width = 32, p.height = 32), m ||= p.getContext("2d", { willReadFrequently: !0 }), m;
|
|
165
165
|
}
|
|
166
166
|
function g() {
|
|
167
|
-
return n.live === void 0 ? e.value?.dataset.glassSample === "live" || n.backgroundCanvas != null ||
|
|
167
|
+
return n.live === void 0 ? e.value?.dataset.glassSample === "live" || n.backgroundCanvas != null || Ee(void 0) !== null : n.live;
|
|
168
168
|
}
|
|
169
169
|
function _(e) {
|
|
170
170
|
let t = e.getBoundingClientRect();
|
|
@@ -188,7 +188,7 @@ function Me(e, n = {}) {
|
|
|
188
188
|
targetRect: _(t)
|
|
189
189
|
}, t.style.setProperty("--glass-backdrop-luma", o.toFixed(3)), t.setAttribute("data-backdrop-sampled", ""), t.setAttribute("data-backdrop-sample-state", "sampled"), t.setAttribute("data-backdrop-sample-source", n === "live" ? "canvas" : "elements"), t.removeAttribute("data-backdrop-sample-reason"), t.style.setProperty("--glass-backdrop-sampled", "1"), a && t.style.setProperty("--glass-backdrop", s);
|
|
190
190
|
}
|
|
191
|
-
function
|
|
191
|
+
function y(e, t, n, r) {
|
|
192
192
|
l.value = null, u.value = null, d.value = {
|
|
193
193
|
state: "unavailable",
|
|
194
194
|
mode: t,
|
|
@@ -198,27 +198,27 @@ function Me(e, n = {}) {
|
|
|
198
198
|
targetRect: _(e)
|
|
199
199
|
}, e.style.removeProperty("--glass-backdrop-luma"), e.style.removeProperty("--glass-backdrop-sampled"), a && e.style.removeProperty("--glass-backdrop"), e.removeAttribute("data-backdrop-sampled"), e.setAttribute("data-backdrop-sample-state", "unavailable"), e.setAttribute("data-backdrop-sample-source", t === "live" ? "canvas" : "elements"), e.setAttribute("data-backdrop-sample-reason", n);
|
|
200
200
|
}
|
|
201
|
-
let
|
|
201
|
+
let x = 0;
|
|
202
202
|
function C() {
|
|
203
203
|
let t = e.value;
|
|
204
204
|
if (!t || c(t)) return;
|
|
205
|
-
let r = h(), i = g() ? "live" : "static", a = i === "live" ?
|
|
206
|
-
o ? v(o, t, i, s) :
|
|
205
|
+
let r = h(), i = g() ? "live" : "static", a = i === "live" ? Ee(n.backgroundCanvas) : null, o = i === "live" ? Oe(t, a, r, je(t, r)) : Me(t, r), s = Date.now();
|
|
206
|
+
o ? v(o, t, i, s) : y(t, i, i === "live" && !a ? "source-unavailable" : "sample-unavailable", s), x = typeof performance < "u" ? performance.now() : s;
|
|
207
207
|
}
|
|
208
|
-
let w =
|
|
209
|
-
f.value || e -
|
|
208
|
+
let w = O(({ now: e }) => {
|
|
209
|
+
f.value || e - x < o || C();
|
|
210
210
|
}, {
|
|
211
211
|
immediate: !1,
|
|
212
212
|
pauseWhenHidden: !0,
|
|
213
213
|
respectReducedMotion: !0
|
|
214
|
-
}), T =
|
|
214
|
+
}), T = S(() => e.value, {
|
|
215
215
|
pause: () => w.pause(),
|
|
216
216
|
resume: () => {
|
|
217
217
|
let t = e.value;
|
|
218
218
|
t && c(t) || g() && !f.value && w.resume();
|
|
219
219
|
}
|
|
220
|
-
}, { rootMargin: "200px" }), E =
|
|
221
|
-
function
|
|
220
|
+
}, { rootMargin: "200px" }), E = b(e, () => C());
|
|
221
|
+
function D() {
|
|
222
222
|
let t = e.value;
|
|
223
223
|
if (t && c(t)) {
|
|
224
224
|
w.stop();
|
|
@@ -226,142 +226,196 @@ function Me(e, n = {}) {
|
|
|
226
226
|
}
|
|
227
227
|
f.value ? (w.stop(), C()) : g() && w.start();
|
|
228
228
|
}
|
|
229
|
-
let k =
|
|
229
|
+
let k = X(f, D, { flush: "sync" }), ee = X(() => e.value, (e) => {
|
|
230
230
|
if (e) {
|
|
231
|
-
if (s) e.setAttribute(
|
|
231
|
+
if (s) e.setAttribute(Pe, "");
|
|
232
232
|
else if (c(e)) return;
|
|
233
|
-
C(),
|
|
233
|
+
C(), D();
|
|
234
234
|
}
|
|
235
235
|
}, {
|
|
236
236
|
immediate: !0,
|
|
237
237
|
flush: "post"
|
|
238
238
|
});
|
|
239
|
-
function
|
|
240
|
-
|
|
239
|
+
function A() {
|
|
240
|
+
ee(), k(), w.dispose(), T.dispose(), E.stop(), p = null, m = null;
|
|
241
241
|
}
|
|
242
|
-
return
|
|
243
|
-
luma:
|
|
244
|
-
bucket:
|
|
245
|
-
sample:
|
|
242
|
+
return U(A), {
|
|
243
|
+
luma: G(l),
|
|
244
|
+
bucket: G(u),
|
|
245
|
+
sample: G(d),
|
|
246
246
|
sampleNow: C,
|
|
247
|
-
dispose:
|
|
247
|
+
dispose: A
|
|
248
248
|
};
|
|
249
249
|
}
|
|
250
250
|
//#endregion
|
|
251
251
|
//#region src/components/dock/composables/useDockState.ts
|
|
252
|
-
function
|
|
253
|
-
let { collapseDelay: t = u, rootEl: n, alwaysExpanded: r = !1, initialExpanded: i = !1, isTransitioning: a, dockId: o, onStateChange: s } = e, c = () => typeof r == "boolean" ? r : r.value, l = () => c(), d =
|
|
252
|
+
function Ie(e) {
|
|
253
|
+
let { collapseDelay: t = u, rootEl: n, alwaysExpanded: r = !1, initialExpanded: i = !1, isTransitioning: a, dockId: o, onStateChange: s } = e, c = () => typeof r == "boolean" ? r : r.value, l = () => c(), d = K(c() ? "pinned" : i ? "hover" : "collapsed"), f = A(() => d.value !== "collapsed"), p = A(() => d.value === "pinned"), m = null, h = K(0), g = K(0), _ = A(() => h.value > 0), v = A(() => g.value > 0), y = null, b = null, x = !1, S = null;
|
|
254
254
|
function C() {
|
|
255
255
|
S &&= (clearTimeout(S), null);
|
|
256
256
|
}
|
|
257
|
-
let w =
|
|
258
|
-
function
|
|
259
|
-
|
|
257
|
+
let w = null, T = null, E = null, D = () => w === "down" || w === "compat";
|
|
258
|
+
function O() {
|
|
259
|
+
if (!w) return;
|
|
260
|
+
w = null, E &&= (clearTimeout(E), null);
|
|
261
|
+
for (let [e, t] of j) window.removeEventListener(e, t, !0);
|
|
262
|
+
let e = T;
|
|
263
|
+
T = null, e && !l() && d.value === "collapsed" && (F(), d.value = "hover", P());
|
|
264
|
+
}
|
|
265
|
+
function k() {
|
|
266
|
+
E ??= setTimeout(O, 0);
|
|
267
|
+
}
|
|
268
|
+
function ee() {
|
|
269
|
+
T = null, O();
|
|
270
|
+
}
|
|
271
|
+
let j = [
|
|
272
|
+
["click", () => O()],
|
|
273
|
+
["pointercancel", () => O()],
|
|
274
|
+
["dragstart", () => O()],
|
|
275
|
+
["contextmenu", () => O()],
|
|
276
|
+
["pointerup", (e) => {
|
|
277
|
+
w === "down" && (e.pointerType === "touch" ? w = "tap" : k());
|
|
278
|
+
}],
|
|
279
|
+
["mousedown", () => {
|
|
280
|
+
w === "tap" && (w = "compat");
|
|
281
|
+
}],
|
|
282
|
+
["mouseup", () => {
|
|
283
|
+
w === "compat" && k();
|
|
284
|
+
}],
|
|
285
|
+
["pointerdown", (e) => {
|
|
286
|
+
(w === "tap" || e.isPrimary) && ee();
|
|
287
|
+
}]
|
|
288
|
+
];
|
|
289
|
+
function M() {
|
|
290
|
+
w && ee(), w = "down";
|
|
291
|
+
for (let [e, t] of j) window.addEventListener(e, t, !0);
|
|
292
|
+
}
|
|
293
|
+
X(n, (e, t, n) => {
|
|
294
|
+
e && (e.addEventListener("pointerdown", M, !0), n(() => e.removeEventListener("pointerdown", M, !0)));
|
|
295
|
+
}, {
|
|
296
|
+
immediate: !0,
|
|
297
|
+
flush: "sync"
|
|
298
|
+
});
|
|
299
|
+
let N = d.value;
|
|
300
|
+
function P() {
|
|
301
|
+
c() && (d.value = "pinned"), s && N !== d.value && s(d.value, N), N = d.value;
|
|
260
302
|
}
|
|
261
|
-
function
|
|
303
|
+
function F() {
|
|
262
304
|
m &&= (clearTimeout(m), null);
|
|
263
305
|
}
|
|
264
|
-
function
|
|
306
|
+
function I() {
|
|
265
307
|
b !== null && (cancelAnimationFrame(b), b = null);
|
|
266
308
|
}
|
|
267
|
-
function
|
|
268
|
-
|
|
309
|
+
function te() {
|
|
310
|
+
I(), y?.();
|
|
269
311
|
}
|
|
270
|
-
function
|
|
271
|
-
l() || h.value > 0 || (
|
|
272
|
-
d.value = "collapsed",
|
|
312
|
+
function L() {
|
|
313
|
+
l() || h.value > 0 || (F(), m = setTimeout(() => {
|
|
314
|
+
d.value = "collapsed", P();
|
|
273
315
|
}, t));
|
|
274
316
|
}
|
|
275
|
-
function
|
|
317
|
+
function R() {
|
|
276
318
|
if (c()) {
|
|
277
|
-
d.value = "pinned",
|
|
319
|
+
d.value = "pinned", P();
|
|
278
320
|
return;
|
|
279
321
|
}
|
|
280
|
-
x ||= (x = !0,
|
|
322
|
+
x ||= (x = !0, F(), C(), d.value = "collapsed", P(), !1);
|
|
281
323
|
}
|
|
282
|
-
function
|
|
324
|
+
function z() {
|
|
283
325
|
if (c()) {
|
|
284
|
-
d.value = "pinned",
|
|
326
|
+
d.value = "pinned", P();
|
|
285
327
|
return;
|
|
286
328
|
}
|
|
287
|
-
|
|
288
|
-
}
|
|
289
|
-
function
|
|
290
|
-
l() || (
|
|
291
|
-
S = null, !l() && d.value === "collapsed"
|
|
329
|
+
F(), C(), d.value = "hover", P();
|
|
330
|
+
}
|
|
331
|
+
function B() {
|
|
332
|
+
l() || (F(), d.value === "collapsed" && (C(), S = setTimeout(() => {
|
|
333
|
+
if (S = null, !l() && d.value === "collapsed") {
|
|
334
|
+
if (D()) {
|
|
335
|
+
T ??= "hover";
|
|
336
|
+
return;
|
|
337
|
+
}
|
|
338
|
+
d.value = "hover", P();
|
|
339
|
+
}
|
|
292
340
|
}, 60)));
|
|
293
341
|
}
|
|
294
|
-
function
|
|
295
|
-
if (!l() && (C(), d.value === "hover")) {
|
|
342
|
+
function ne(e) {
|
|
343
|
+
if (!l() && (C(), T === "hover" && (T = null), d.value === "hover")) {
|
|
296
344
|
if (h.value > 0) return;
|
|
297
345
|
if (e) {
|
|
298
346
|
let t = n.value;
|
|
299
|
-
if (t && e.relatedTarget instanceof Node && t.contains(e.relatedTarget) ||
|
|
347
|
+
if (t && e.relatedTarget instanceof Node && t.contains(e.relatedTarget) || ye(e.relatedTarget, o)) return;
|
|
300
348
|
}
|
|
301
|
-
|
|
349
|
+
L();
|
|
302
350
|
}
|
|
303
351
|
}
|
|
304
|
-
function
|
|
305
|
-
l()
|
|
352
|
+
function V() {
|
|
353
|
+
if (!l() && (F(), d.value === "collapsed")) {
|
|
354
|
+
if (D()) {
|
|
355
|
+
T = "focus";
|
|
356
|
+
return;
|
|
357
|
+
}
|
|
358
|
+
d.value = "hover", P();
|
|
359
|
+
}
|
|
306
360
|
}
|
|
307
|
-
function
|
|
308
|
-
if (l()
|
|
309
|
-
let t = e.currentTarget;
|
|
310
|
-
|
|
361
|
+
function H(e) {
|
|
362
|
+
if (l()) return;
|
|
363
|
+
let t = e.currentTarget, n = !!e.relatedTarget && t.contains(e.relatedTarget) || ye(e.relatedTarget, o);
|
|
364
|
+
!n && T === "focus" && (T = null), d.value === "hover" && (h.value > 0 || n || L());
|
|
311
365
|
}
|
|
312
|
-
function
|
|
313
|
-
l() || (
|
|
366
|
+
function U() {
|
|
367
|
+
l() || (F(), C(), d.value = "pinned", P());
|
|
314
368
|
}
|
|
315
|
-
function
|
|
316
|
-
h.value++, e === "grasp" && g.value++,
|
|
369
|
+
function W(e = "morph") {
|
|
370
|
+
h.value++, e === "grasp" && g.value++, F();
|
|
317
371
|
}
|
|
318
|
-
function
|
|
319
|
-
e === "grasp" && (g.value = Math.max(0, g.value - 1)), h.value = Math.max(0, h.value - 1), h.value === 0 && d.value === "hover" && (
|
|
320
|
-
h.value === 0 && d.value === "hover" &&
|
|
372
|
+
function G(e = "morph") {
|
|
373
|
+
e === "grasp" && (g.value = Math.max(0, g.value - 1)), h.value = Math.max(0, h.value - 1), h.value === 0 && d.value === "hover" && (F(), m = setTimeout(() => {
|
|
374
|
+
h.value === 0 && d.value === "hover" && L();
|
|
321
375
|
}, Math.min(t, 800)));
|
|
322
376
|
}
|
|
323
|
-
function
|
|
377
|
+
function ie(e) {
|
|
324
378
|
if (l() || h.value > 0 || a?.value) return;
|
|
325
379
|
let t = n.value;
|
|
326
|
-
!t || t.contains(e.target) ||
|
|
380
|
+
!t || t.contains(e.target) || ye(e.target, o) || R();
|
|
327
381
|
}
|
|
328
|
-
return
|
|
382
|
+
return X(f, (e) => {
|
|
329
383
|
if (e) {
|
|
330
384
|
if (typeof document > "u") return;
|
|
331
|
-
|
|
332
|
-
b = null, f.value && (document.addEventListener("pointerdown",
|
|
333
|
-
document.removeEventListener("pointerdown",
|
|
385
|
+
te(), b = requestAnimationFrame(() => {
|
|
386
|
+
b = null, f.value && (document.addEventListener("pointerdown", ie, !0), y = () => {
|
|
387
|
+
document.removeEventListener("pointerdown", ie, !0), y = null;
|
|
334
388
|
});
|
|
335
389
|
});
|
|
336
|
-
} else
|
|
337
|
-
}, { immediate: !0 }), typeof r == "boolean" ? r && (d.value = "pinned",
|
|
390
|
+
} else te();
|
|
391
|
+
}, { immediate: !0 }), typeof r == "boolean" ? r && (d.value = "pinned", P()) : X(r, (e) => {
|
|
338
392
|
if (e) {
|
|
339
|
-
|
|
393
|
+
F(), d.value = "pinned", P();
|
|
340
394
|
return;
|
|
341
395
|
}
|
|
342
|
-
d.value = "collapsed",
|
|
343
|
-
}),
|
|
344
|
-
|
|
396
|
+
d.value = "collapsed", P();
|
|
397
|
+
}), re(() => {
|
|
398
|
+
F(), C(), te(), ee();
|
|
345
399
|
}), {
|
|
346
400
|
state: d,
|
|
347
401
|
expanded: f,
|
|
348
402
|
isPinned: p,
|
|
349
403
|
isHeld: _,
|
|
350
404
|
graspHeld: v,
|
|
351
|
-
onMouseEnter:
|
|
352
|
-
onMouseLeave:
|
|
353
|
-
onFocusIn:
|
|
354
|
-
onFocusOut:
|
|
355
|
-
onClickCollapsed:
|
|
356
|
-
keepOpen:
|
|
357
|
-
release:
|
|
358
|
-
expand:
|
|
359
|
-
collapse:
|
|
405
|
+
onMouseEnter: B,
|
|
406
|
+
onMouseLeave: ne,
|
|
407
|
+
onFocusIn: V,
|
|
408
|
+
onFocusOut: H,
|
|
409
|
+
onClickCollapsed: U,
|
|
410
|
+
keepOpen: W,
|
|
411
|
+
release: G,
|
|
412
|
+
expand: z,
|
|
413
|
+
collapse: R
|
|
360
414
|
};
|
|
361
415
|
}
|
|
362
416
|
//#endregion
|
|
363
417
|
//#region src/components/dock/composables/useDockSpring.ts
|
|
364
|
-
function
|
|
418
|
+
function Le(e) {
|
|
365
419
|
let t = null, n = () => t !== null && !t.settled;
|
|
366
420
|
function i() {
|
|
367
421
|
t &&= (t.dispose(), null);
|
|
@@ -369,7 +423,7 @@ function Pe(e) {
|
|
|
369
423
|
function a(a, o, s) {
|
|
370
424
|
let c = n() ? t.velocity * (s.inheritVelocityScale ?? 1) : 0;
|
|
371
425
|
i();
|
|
372
|
-
let l = new
|
|
426
|
+
let l = new _e({
|
|
373
427
|
response: e.response * r(),
|
|
374
428
|
dampingFraction: e.dampingFraction,
|
|
375
429
|
initial: a,
|
|
@@ -396,98 +450,269 @@ function Pe(e) {
|
|
|
396
450
|
}
|
|
397
451
|
//#endregion
|
|
398
452
|
//#region src/components/dock/composables/useDockMorph.ts
|
|
399
|
-
function
|
|
400
|
-
let { rootEl: t, outerActiveLayer: n } = e,
|
|
401
|
-
response:
|
|
402
|
-
dampingFraction:
|
|
403
|
-
}),
|
|
404
|
-
function
|
|
453
|
+
function Re(e) {
|
|
454
|
+
let { rootEl: t, outerActiveLayer: n, geometry: r } = e, i = K(n.value), a = K(null), o = Le({
|
|
455
|
+
response: d.response,
|
|
456
|
+
dampingFraction: d.dampingFraction
|
|
457
|
+
}), s = ve("(prefers-reduced-motion: reduce)");
|
|
458
|
+
function c() {
|
|
405
459
|
return t.value;
|
|
406
460
|
}
|
|
407
|
-
function
|
|
408
|
-
|
|
409
|
-
let t =
|
|
410
|
-
t && (t.removeAttribute("data-morphing"), t.style.removeProperty("--dock-morph-t")), e.onMorphActiveChange?.(!1),
|
|
461
|
+
function l() {
|
|
462
|
+
a.value = null;
|
|
463
|
+
let t = c();
|
|
464
|
+
t && (t.removeAttribute("data-morphing"), t.style.removeProperty("--dock-morph-t"), r.release()), e.onMorphActiveChange?.(!1), o.dispose();
|
|
411
465
|
}
|
|
412
|
-
|
|
413
|
-
e &&
|
|
466
|
+
X(s, (e) => {
|
|
467
|
+
e && c()?.hasAttribute("data-morphing") && l();
|
|
414
468
|
});
|
|
415
|
-
function
|
|
416
|
-
let t =
|
|
469
|
+
function u() {
|
|
470
|
+
let t = c();
|
|
417
471
|
if (!t) return;
|
|
418
472
|
e.onMorphActiveChange?.(!0), t.setAttribute("data-morphing", "");
|
|
419
|
-
let n = Number.parseFloat(t.style.getPropertyValue("--dock-morph-t")),
|
|
420
|
-
t.style.setProperty("--dock-morph-t", `${
|
|
421
|
-
inheritVelocityScale:
|
|
473
|
+
let n = Number.parseFloat(t.style.getPropertyValue("--dock-morph-t")), i = o.live && !Number.isNaN(n), a = i ? 1 - n : 0;
|
|
474
|
+
t.style.setProperty("--dock-morph-t", `${a}`), r.anchor(), o.playTo(a, 1, {
|
|
475
|
+
inheritVelocityScale: i ? -1 : 1,
|
|
422
476
|
onFrame: (e) => {
|
|
423
|
-
|
|
477
|
+
c()?.style.setProperty("--dock-morph-t", `${e}`);
|
|
424
478
|
},
|
|
425
|
-
onSettle:
|
|
479
|
+
onSettle: l
|
|
426
480
|
});
|
|
427
481
|
}
|
|
428
|
-
let
|
|
429
|
-
|
|
430
|
-
|
|
431
|
-
|
|
432
|
-
|
|
433
|
-
|
|
434
|
-
|
|
435
|
-
i.value = t, l();
|
|
436
|
-
});
|
|
437
|
-
return ee(() => {
|
|
438
|
-
u(), a.dispose();
|
|
482
|
+
let f = X(n, (e, t) => {
|
|
483
|
+
e !== t && (c() && r.first(), i.value = e, a.value = c() ? t : null);
|
|
484
|
+
}), p = X(n, (e, t) => {
|
|
485
|
+
e === t || !c() || (r.measure(), u());
|
|
486
|
+
}, { flush: "post" });
|
|
487
|
+
return re(() => {
|
|
488
|
+
f(), p(), o.dispose();
|
|
439
489
|
}), {
|
|
440
|
-
outerCurrentLayer:
|
|
441
|
-
outerLeavingLayer:
|
|
490
|
+
outerCurrentLayer: G(i),
|
|
491
|
+
outerLeavingLayer: G(a)
|
|
442
492
|
};
|
|
443
493
|
}
|
|
444
494
|
//#endregion
|
|
445
495
|
//#region src/components/dock/composables/dockMorphMeasure.ts
|
|
446
|
-
function
|
|
496
|
+
function $(e, t) {
|
|
447
497
|
return t === "vertical" ? e.offsetHeight : e.offsetWidth;
|
|
448
498
|
}
|
|
449
|
-
function
|
|
450
|
-
let
|
|
451
|
-
|
|
452
|
-
|
|
453
|
-
|
|
454
|
-
|
|
455
|
-
|
|
456
|
-
|
|
457
|
-
|
|
458
|
-
|
|
499
|
+
function ze(e, t) {
|
|
500
|
+
let n = e.map(([e, t]) => [
|
|
501
|
+
e,
|
|
502
|
+
t,
|
|
503
|
+
e.style.getPropertyValue(t),
|
|
504
|
+
e.style.getPropertyPriority(t)
|
|
505
|
+
]);
|
|
506
|
+
for (let [t, n, r] of e) t.style.setProperty(n, r, n.startsWith("--") ? "" : "important");
|
|
507
|
+
try {
|
|
508
|
+
return t();
|
|
509
|
+
} finally {
|
|
510
|
+
for (let [e, t, r, i] of n.reverse()) r ? e.style.setProperty(t, r, i) : e.style.removeProperty(t);
|
|
459
511
|
}
|
|
512
|
+
}
|
|
513
|
+
function Be(e, t) {
|
|
514
|
+
let n = e.scrollLeft, r = e.scrollTop;
|
|
515
|
+
try {
|
|
516
|
+
return t();
|
|
517
|
+
} finally {
|
|
518
|
+
(e.scrollLeft !== n || e.scrollTop !== r) && e.scrollTo({
|
|
519
|
+
left: n,
|
|
520
|
+
top: r,
|
|
521
|
+
behavior: "instant"
|
|
522
|
+
});
|
|
523
|
+
}
|
|
524
|
+
}
|
|
525
|
+
function Ve(e, t, n, r, i) {
|
|
526
|
+
let a = r === "vertical" ? "margin-block-end" : "margin-inline-end";
|
|
527
|
+
return ze([
|
|
528
|
+
[
|
|
529
|
+
e,
|
|
530
|
+
"--dock-expanded-px",
|
|
531
|
+
"initial"
|
|
532
|
+
],
|
|
533
|
+
[
|
|
534
|
+
t,
|
|
535
|
+
"position",
|
|
536
|
+
"relative"
|
|
537
|
+
],
|
|
538
|
+
[
|
|
539
|
+
t,
|
|
540
|
+
"inset",
|
|
541
|
+
"auto"
|
|
542
|
+
],
|
|
543
|
+
[
|
|
544
|
+
n,
|
|
545
|
+
"position",
|
|
546
|
+
"absolute"
|
|
547
|
+
]
|
|
548
|
+
], () => {
|
|
549
|
+
let n = $(e, r);
|
|
550
|
+
if (i === null) return n;
|
|
551
|
+
let o = i - (n - $(t, r));
|
|
552
|
+
if (Math.abs(o) < .5) return n;
|
|
553
|
+
let s = Number.parseFloat(getComputedStyle(t).getPropertyValue(a)) || 0;
|
|
554
|
+
return ze([[
|
|
555
|
+
t,
|
|
556
|
+
a,
|
|
557
|
+
`${s + o}px`
|
|
558
|
+
]], () => $(e, r));
|
|
559
|
+
});
|
|
560
|
+
}
|
|
561
|
+
function He(e, t) {
|
|
562
|
+
let n = e.getBoundingClientRect();
|
|
563
|
+
return t === "vertical" ? {
|
|
564
|
+
start: n.top,
|
|
565
|
+
size: n.height
|
|
566
|
+
} : {
|
|
567
|
+
start: n.left,
|
|
568
|
+
size: n.width
|
|
569
|
+
};
|
|
570
|
+
}
|
|
571
|
+
var Ue = "--dock-morph-origin", We = "--dock-pane-shift";
|
|
572
|
+
function Ge(e) {
|
|
573
|
+
let { rootEl: t, contentEl: n, expandedEl: r, collapsedEl: i, axis: a } = e, o = null, s = null, c = null, l = null, u = null, d = !1;
|
|
460
574
|
function f() {
|
|
461
|
-
|
|
462
|
-
|
|
463
|
-
|
|
464
|
-
|
|
465
|
-
|
|
466
|
-
|
|
467
|
-
|
|
468
|
-
|
|
469
|
-
|
|
470
|
-
|
|
471
|
-
|
|
575
|
+
let e = t.value, o = r.value, s = i.value;
|
|
576
|
+
if (!e || !n.value || !o || !s) return;
|
|
577
|
+
let d = a.value, f = o.classList.contains("is-active");
|
|
578
|
+
if (!e.hasAttribute("data-morphing")) {
|
|
579
|
+
let t = $(e, d) - $(f ? o : s, d);
|
|
580
|
+
f ? c = t : l = t;
|
|
581
|
+
}
|
|
582
|
+
let p = Be(o, () => Ve(e, o, s, d, c));
|
|
583
|
+
f || (u = Be(o, () => Ve(e, s, o, d, l))), !(p <= 0) && (u !== null && u > 0 && e.style.setProperty("--dock-collapsed-px", `${u}px`), e.style.setProperty("--dock-expanded-px", `${Math.max(p, u ?? 0)}px`));
|
|
584
|
+
}
|
|
585
|
+
function p() {
|
|
586
|
+
if (!o) return;
|
|
587
|
+
o.disconnect();
|
|
588
|
+
let e = [r.value, i.value], a = t.value;
|
|
589
|
+
for (let t of [
|
|
590
|
+
a,
|
|
591
|
+
a?.parentElement,
|
|
592
|
+
n.value,
|
|
593
|
+
...e
|
|
594
|
+
]) t && o.observe(t);
|
|
595
|
+
for (let t of e) for (let e of t?.children ?? []) o.observe(e);
|
|
596
|
+
}
|
|
597
|
+
function m() {
|
|
598
|
+
if (o?.disconnect(), o = null, s?.disconnect(), s = null, t.value) {
|
|
599
|
+
if (typeof ResizeObserver < "u" && (o = new ResizeObserver(() => f()), p()), typeof MutationObserver < "u") {
|
|
600
|
+
s = new MutationObserver(() => {
|
|
601
|
+
p(), f();
|
|
602
|
+
});
|
|
603
|
+
for (let e of [r.value, i.value]) e && s.observe(e, {
|
|
604
|
+
childList: !0,
|
|
605
|
+
subtree: !0,
|
|
606
|
+
characterData: !0
|
|
607
|
+
});
|
|
472
608
|
}
|
|
473
|
-
|
|
609
|
+
f();
|
|
474
610
|
}
|
|
475
611
|
}
|
|
476
|
-
|
|
612
|
+
X([
|
|
477
613
|
t,
|
|
478
614
|
n,
|
|
479
615
|
r,
|
|
480
616
|
i,
|
|
481
617
|
a
|
|
482
|
-
],
|
|
483
|
-
let
|
|
484
|
-
|
|
485
|
-
|
|
618
|
+
], m, { immediate: !0 });
|
|
619
|
+
let h = () => f();
|
|
620
|
+
typeof window < "u" && window.addEventListener("resize", h);
|
|
621
|
+
let g = typeof document < "u" ? document.fonts : void 0;
|
|
622
|
+
g && g.ready.then(() => !d && f()), U(() => {
|
|
623
|
+
d = !0, o?.disconnect(), o = null, s?.disconnect(), s = null, typeof window < "u" && window.removeEventListener("resize", h);
|
|
486
624
|
});
|
|
625
|
+
let _ = null;
|
|
626
|
+
function v(e) {
|
|
627
|
+
return [...e.querySelectorAll(":scope > .dock-controls > .dock-persistent")];
|
|
628
|
+
}
|
|
629
|
+
function y() {
|
|
630
|
+
return [r.value, i.value].filter((e) => !!e);
|
|
631
|
+
}
|
|
632
|
+
function b() {
|
|
633
|
+
let e = t.value;
|
|
634
|
+
if (!e) return;
|
|
635
|
+
let n = a.value;
|
|
636
|
+
_ = new Map([
|
|
637
|
+
e,
|
|
638
|
+
...v(e),
|
|
639
|
+
...y()
|
|
640
|
+
].map((e) => [e, He(e, n)]));
|
|
641
|
+
}
|
|
642
|
+
function x() {
|
|
643
|
+
let e = t.value;
|
|
644
|
+
if (e) {
|
|
645
|
+
for (let t of [
|
|
646
|
+
e,
|
|
647
|
+
...v(e),
|
|
648
|
+
n.value
|
|
649
|
+
]) t?.style.removeProperty(Ue);
|
|
650
|
+
for (let e of y()) e.style.removeProperty(We);
|
|
651
|
+
}
|
|
652
|
+
}
|
|
653
|
+
function S() {
|
|
654
|
+
let e = t.value, i = n.value, o = _;
|
|
655
|
+
if (_ = null, x(), !e || !i || !o || !o.get(e)) return;
|
|
656
|
+
let s = a.value, c = v(e), l = He(e, s), u = [
|
|
657
|
+
e,
|
|
658
|
+
...c,
|
|
659
|
+
i
|
|
660
|
+
].map((e) => [
|
|
661
|
+
e,
|
|
662
|
+
"scale",
|
|
663
|
+
"none"
|
|
664
|
+
]), d = () => new Map([
|
|
665
|
+
e,
|
|
666
|
+
...c,
|
|
667
|
+
i,
|
|
668
|
+
...y()
|
|
669
|
+
].map((e) => [e, He(e, s)])), f = ze(u, d), p = f.get(e), m = $(e, s), h = p.size / m;
|
|
670
|
+
if (!(h > 0)) return;
|
|
671
|
+
let g = (e) => Math.abs(1 - e) < 1e-4, b = l.size / p.size, S = !r.value?.classList.contains("is-active") || g(b) ? ze([
|
|
672
|
+
...u,
|
|
673
|
+
[
|
|
674
|
+
e,
|
|
675
|
+
"--dock-expanded-px",
|
|
676
|
+
"initial"
|
|
677
|
+
],
|
|
678
|
+
[
|
|
679
|
+
e,
|
|
680
|
+
"--dock-morph-t",
|
|
681
|
+
"1"
|
|
682
|
+
]
|
|
683
|
+
], d) : null, C = o;
|
|
684
|
+
if (S && g(b) && (C = S, b = S.get(e).size / p.size), !Number.isFinite(b)) return;
|
|
685
|
+
let w = (e) => (e - p.start) / h, T = (e, t) => g(b) ? null : (e - t) / (1 - b), E = (e) => w(e.start + e.size / 2), D = T(w(C.get(e).start), 0) ?? m / 2, O = (e, t) => `${e / t * 100}%`;
|
|
686
|
+
e.style.setProperty(Ue, O(D, m));
|
|
687
|
+
for (let e of c) {
|
|
688
|
+
let t = C.get(e), n = f.get(e), r = $(e, s);
|
|
689
|
+
if (!t || !(r > 0)) continue;
|
|
690
|
+
let i = T(E(t), E(n));
|
|
691
|
+
e.style.setProperty(Ue, O((i === null ? D : D - i) - w(n.start), r));
|
|
692
|
+
}
|
|
693
|
+
let k = $(i, s);
|
|
694
|
+
k > 0 && i.style.setProperty(Ue, O(D - w(f.get(i).start), k));
|
|
695
|
+
for (let t of y()) {
|
|
696
|
+
let n = t.classList.contains("is-leaving"), r = n ? o.get(t) : S?.get(t), i = $(t, s);
|
|
697
|
+
if (!r || !(i > 0)) continue;
|
|
698
|
+
let a = n ? f.get(t) : ze([[
|
|
699
|
+
e,
|
|
700
|
+
"--dock-morph-t",
|
|
701
|
+
"1"
|
|
702
|
+
]], () => He(t, s));
|
|
703
|
+
a && t.style.setProperty(We, O((r.start - a.start) / h, i));
|
|
704
|
+
}
|
|
705
|
+
}
|
|
706
|
+
return {
|
|
707
|
+
measure: f,
|
|
708
|
+
first: b,
|
|
709
|
+
anchor: S,
|
|
710
|
+
release: x
|
|
711
|
+
};
|
|
487
712
|
}
|
|
488
713
|
//#endregion
|
|
489
714
|
//#region src/components/dock/composables/useDockShellProps.ts
|
|
490
|
-
function
|
|
715
|
+
function Ke(e) {
|
|
491
716
|
let t = A(() => e.shape ?? "pill"), n = A(() => e.orientation ?? "horizontal"), r = A(() => e.collapse === !1);
|
|
492
717
|
return {
|
|
493
718
|
startCollapsed: A(() => !r.value && (e.collapse ?? "closed") === "closed"),
|
|
@@ -499,8 +724,8 @@ function Re(e) {
|
|
|
499
724
|
}
|
|
500
725
|
//#endregion
|
|
501
726
|
//#region src/components/dock/composables/useDockClickIntegrity.ts
|
|
502
|
-
function
|
|
503
|
-
let { rootEl: t, visualExpanded: n } = e, r = null, i = !1, a = 0, o = null, s =
|
|
727
|
+
function qe(e) {
|
|
728
|
+
let { rootEl: t, visualExpanded: n } = e, r = null, i = !1, a = 0, o = null, s = K(null), c = null, l = [];
|
|
504
729
|
function u() {
|
|
505
730
|
c?.removeAttribute("data-dock-press-origin"), c = null;
|
|
506
731
|
for (let { element: e, wasInert: t } of l.splice(0)) e.toggleAttribute("inert", t);
|
|
@@ -543,7 +768,7 @@ function ze(e) {
|
|
|
543
768
|
function _(e) {
|
|
544
769
|
u(), r = e.target, i = g();
|
|
545
770
|
}
|
|
546
|
-
|
|
771
|
+
X(n, (e, t) => {
|
|
547
772
|
t && !e && r && d(r);
|
|
548
773
|
});
|
|
549
774
|
function v() {
|
|
@@ -570,106 +795,121 @@ function ze(e) {
|
|
|
570
795
|
}
|
|
571
796
|
e.stopPropagation(), e.preventDefault(), r = null;
|
|
572
797
|
}
|
|
573
|
-
return
|
|
798
|
+
return V(() => {
|
|
574
799
|
f(), u();
|
|
575
800
|
}), {
|
|
576
801
|
onPointerDownCapture: _,
|
|
577
802
|
onPointerCancelCapture: v,
|
|
578
803
|
onClickCapture: b,
|
|
579
804
|
markExpandFlip: p,
|
|
580
|
-
pressKeepaliveLayer:
|
|
805
|
+
pressKeepaliveLayer: G(s)
|
|
581
806
|
};
|
|
582
807
|
}
|
|
583
808
|
//#endregion
|
|
584
809
|
//#region src/components/dock/composables/useDockRun.ts
|
|
585
|
-
function
|
|
810
|
+
function Je(e, t) {
|
|
586
811
|
let n = getComputedStyle(e).getPropertyValue(t).trim(), r = Number.parseFloat(n);
|
|
587
812
|
return Number.isFinite(r) ? r : 0;
|
|
588
813
|
}
|
|
589
|
-
function
|
|
814
|
+
function Ye(e) {
|
|
590
815
|
return Array.from(e.children).filter((e) => e instanceof HTMLElement);
|
|
591
816
|
}
|
|
592
|
-
function
|
|
817
|
+
function Xe(e) {
|
|
593
818
|
return e.findIndex((e) => {
|
|
594
819
|
let t = (e.matches("[aria-current]") ? e : e.querySelector("[aria-current]"))?.getAttribute("aria-current");
|
|
595
820
|
return t != null && t !== "false";
|
|
596
821
|
});
|
|
597
822
|
}
|
|
598
|
-
|
|
599
|
-
|
|
600
|
-
return (e.matches(S) || e.hasAttribute("tabindex")) && !e.querySelector(Ue);
|
|
823
|
+
function Ze(e) {
|
|
824
|
+
return e.hasAttribute(y);
|
|
601
825
|
}
|
|
602
|
-
function
|
|
603
|
-
return
|
|
826
|
+
function Qe(e) {
|
|
827
|
+
return Ye(e).filter(Ze);
|
|
604
828
|
}
|
|
605
|
-
|
|
606
|
-
|
|
607
|
-
|
|
608
|
-
|
|
829
|
+
var $e = ".dock-separator", et = "select[aria-hidden=\"true\"][tabindex=\"-1\"]";
|
|
830
|
+
function tt(e) {
|
|
831
|
+
let t = Ye(e).filter((e) => !e.matches($e) && !e.matches(et));
|
|
832
|
+
return t.length > 0 && t.every(Ze);
|
|
833
|
+
}
|
|
834
|
+
function nt(e) {
|
|
835
|
+
let { runEl: t, statusEl: n, orientation: r } = e, i = K(!1), a = Le({
|
|
836
|
+
response: d.response,
|
|
837
|
+
dampingFraction: d.dampingFraction
|
|
609
838
|
});
|
|
610
|
-
function
|
|
839
|
+
function o() {
|
|
611
840
|
return r.value === "vertical";
|
|
612
841
|
}
|
|
613
|
-
function
|
|
614
|
-
return
|
|
842
|
+
function s(e) {
|
|
843
|
+
return o() ? e.scrollTop : e.scrollLeft;
|
|
615
844
|
}
|
|
616
|
-
function
|
|
617
|
-
|
|
845
|
+
function c(e, t) {
|
|
846
|
+
o() ? e.scrollTop = t : e.scrollLeft = t;
|
|
618
847
|
}
|
|
619
|
-
function
|
|
620
|
-
return
|
|
621
|
-
}
|
|
622
|
-
function l(e, t) {
|
|
623
|
-
let n = Ve(e), r = n.indexOf(t);
|
|
624
|
-
if (r < 0) return o(e);
|
|
625
|
-
let i = Be(e, "--dock-pitch");
|
|
626
|
-
if (i <= 0) return o(e);
|
|
627
|
-
let a = Math.max(1, Be(e, "--dock-open-pitches")), s = He(n), l = s >= 0 && s < r ? (a - 1) * i : 0, u = r * i + l - i / 2;
|
|
628
|
-
return Math.min(Math.max(u, 0), c(e));
|
|
848
|
+
function l(e) {
|
|
849
|
+
return o() ? e.scrollHeight - e.clientHeight : e.scrollWidth - e.clientWidth;
|
|
629
850
|
}
|
|
630
851
|
function u(e, t) {
|
|
852
|
+
let n = Ye(e), r = n.indexOf(t);
|
|
853
|
+
if (r < 0) return s(e);
|
|
854
|
+
let i = Je(e, "--dock-pitch");
|
|
855
|
+
if (i <= 0) return s(e);
|
|
856
|
+
let a = Math.max(1, Je(e, "--dock-open-pitches")), o = Xe(n), c = o >= 0 && o < r ? (a - 1) * i : 0, u = r * i + c - i / 2;
|
|
857
|
+
return Math.min(Math.max(u, 0), l(e));
|
|
858
|
+
}
|
|
859
|
+
function f(e, t) {
|
|
631
860
|
let n = e.getBoundingClientRect(), r = t.getBoundingClientRect();
|
|
632
|
-
return
|
|
861
|
+
return o() ? r.top < n.top - 1 || r.bottom > n.bottom + 1 : r.left < n.left - 1 || r.right > n.right + 1;
|
|
633
862
|
}
|
|
634
|
-
function
|
|
863
|
+
function p(e) {
|
|
635
864
|
let t = n.value;
|
|
636
865
|
if (!t) return;
|
|
637
|
-
let r =
|
|
866
|
+
let r = Ze(e) ? e : e.querySelector(C) ?? e, i = r.getAttribute("aria-label") ?? r.getAttribute("title") ?? r.textContent?.trim();
|
|
638
867
|
i && (t.textContent = i);
|
|
639
868
|
}
|
|
640
|
-
function
|
|
869
|
+
function m(e) {
|
|
641
870
|
let n = t.value;
|
|
642
|
-
if (!n || (
|
|
643
|
-
let r =
|
|
644
|
-
Math.abs(
|
|
871
|
+
if (!n || (p(e), !f(n, e))) return;
|
|
872
|
+
let r = s(n), i = u(n, e);
|
|
873
|
+
Math.abs(i - r) < 1 || a.playTo(0, 1, { onFrame: (e) => {
|
|
645
874
|
let n = t.value;
|
|
646
|
-
n &&
|
|
875
|
+
n && c(n, r + (i - r) * e);
|
|
647
876
|
} });
|
|
648
877
|
}
|
|
649
|
-
|
|
878
|
+
let h = /* @__PURE__ */ new WeakMap();
|
|
879
|
+
function g(e, t) {
|
|
880
|
+
h.has(e) || h.set(e, e.getAttribute("tabindex")), e.tabIndex = t;
|
|
881
|
+
}
|
|
882
|
+
function _(e) {
|
|
883
|
+
if (!h.has(e)) return;
|
|
884
|
+
let t = h.get(e) ?? null;
|
|
885
|
+
h.delete(e), t === null ? e.removeAttribute("tabindex") : e.setAttribute("tabindex", t);
|
|
886
|
+
}
|
|
887
|
+
function v() {
|
|
650
888
|
let e = t.value;
|
|
651
889
|
if (!e) return;
|
|
652
|
-
|
|
890
|
+
i.value = tt(e);
|
|
891
|
+
for (let t of Ye(e)) Ze(t) || _(t);
|
|
892
|
+
let n = Qe(e);
|
|
653
893
|
if (n.length === 0) return;
|
|
654
|
-
let r =
|
|
894
|
+
let r = Xe(n), a = n.findIndex((e) => e.contains(document.activeElement)), o = a >= 0 ? a : r >= 0 ? r : 0;
|
|
655
895
|
n.forEach((e, t) => {
|
|
656
|
-
e
|
|
896
|
+
g(e, t === o ? 0 : -1);
|
|
657
897
|
});
|
|
658
898
|
}
|
|
659
|
-
function
|
|
899
|
+
function b(e, t) {
|
|
660
900
|
let n = e[t];
|
|
661
|
-
n && (
|
|
901
|
+
n && (m(n), g(n, 0), n.focus({ preventScroll: !0 }), v());
|
|
662
902
|
}
|
|
663
|
-
function
|
|
903
|
+
function x(e) {
|
|
664
904
|
let n = t.value;
|
|
665
905
|
if (!n) return;
|
|
666
|
-
let r =
|
|
906
|
+
let r = Qe(n);
|
|
667
907
|
if (r.length === 0) return;
|
|
668
908
|
let i = r.findIndex((t) => t.contains(e.target));
|
|
669
909
|
if (i < 0) return;
|
|
670
|
-
let [
|
|
910
|
+
let [a, s] = o() ? ["ArrowUp", "ArrowDown"] : ["ArrowLeft", "ArrowRight"], c;
|
|
671
911
|
switch (e.key) {
|
|
672
|
-
case
|
|
912
|
+
case a:
|
|
673
913
|
c = i - 1;
|
|
674
914
|
break;
|
|
675
915
|
case s:
|
|
@@ -683,41 +923,55 @@ function Ke(e) {
|
|
|
683
923
|
break;
|
|
684
924
|
default: return;
|
|
685
925
|
}
|
|
686
|
-
c < 0 || c >= r.length || (e.preventDefault(),
|
|
926
|
+
c < 0 || c >= r.length || (e.preventDefault(), b(r, c));
|
|
687
927
|
}
|
|
688
|
-
function
|
|
928
|
+
function S(e) {
|
|
689
929
|
let n = t.value;
|
|
690
930
|
if (!n) return;
|
|
691
|
-
let r =
|
|
692
|
-
r &&
|
|
931
|
+
let r = Ye(n).find((t) => t.contains(e.target));
|
|
932
|
+
r && m(r);
|
|
693
933
|
}
|
|
694
|
-
let
|
|
695
|
-
|
|
934
|
+
let w = null;
|
|
935
|
+
function T(e, t) {
|
|
936
|
+
if (t.type !== "attributes" || t.attributeName === "aria-current" || t.attributeName === "data-glass-dock-seat") return !0;
|
|
937
|
+
let n = t.target;
|
|
938
|
+
return n.parentElement === e && !Ze(n);
|
|
939
|
+
}
|
|
940
|
+
return H(() => {
|
|
696
941
|
let e = t.value;
|
|
697
|
-
e && (e.addEventListener("keydown",
|
|
942
|
+
e && (e.addEventListener("keydown", x), e.addEventListener("click", S, { capture: !0 }), e.addEventListener("focusin", S, { capture: !0 }), v(), w = new MutationObserver((t) => {
|
|
943
|
+
t.some((t) => T(e, t)) && v();
|
|
944
|
+
}), w.observe(e, {
|
|
698
945
|
childList: !0,
|
|
699
946
|
subtree: !0,
|
|
700
947
|
attributes: !0,
|
|
701
|
-
attributeFilter: [
|
|
948
|
+
attributeFilter: [
|
|
949
|
+
"aria-current",
|
|
950
|
+
y,
|
|
951
|
+
"aria-hidden",
|
|
952
|
+
"tabindex"
|
|
953
|
+
]
|
|
702
954
|
}));
|
|
703
|
-
}),
|
|
955
|
+
}), re(() => {
|
|
704
956
|
let e = t.value;
|
|
705
|
-
e?.removeEventListener("keydown",
|
|
706
|
-
}),
|
|
707
|
-
reach:
|
|
708
|
-
syncRoving:
|
|
957
|
+
e?.removeEventListener("keydown", x), e?.removeEventListener("click", S, { capture: !0 }), e?.removeEventListener("focusin", S, { capture: !0 }), w?.disconnect(), a.dispose();
|
|
958
|
+
}), X(r, () => v()), {
|
|
959
|
+
reach: m,
|
|
960
|
+
syncRoving: v,
|
|
961
|
+
toolbar: i
|
|
709
962
|
};
|
|
710
963
|
}
|
|
711
964
|
//#endregion
|
|
712
965
|
//#region src/components/dock/GlassDock.vue?vue&type=script&setup=true&lang.ts
|
|
713
|
-
var
|
|
966
|
+
var rt = ["data-backdrop-mode", "data-held"], it = ["data-held"], at = { class: "dock-controls" }, ot = {
|
|
714
967
|
key: 0,
|
|
715
968
|
class: "dock-persistent"
|
|
716
|
-
},
|
|
969
|
+
}, st = [
|
|
717
970
|
"id",
|
|
971
|
+
"role",
|
|
718
972
|
"aria-orientation",
|
|
719
973
|
"inert"
|
|
720
|
-
],
|
|
974
|
+
], ct = [
|
|
721
975
|
"id",
|
|
722
976
|
"inert",
|
|
723
977
|
"role",
|
|
@@ -725,13 +979,13 @@ var qe = ["data-backdrop-mode", "data-held"], Je = ["data-held"], Ye = { class:
|
|
|
725
979
|
"aria-label",
|
|
726
980
|
"aria-expanded",
|
|
727
981
|
"aria-controls"
|
|
728
|
-
],
|
|
982
|
+
], lt = {
|
|
729
983
|
key: 0,
|
|
730
984
|
class: "dock-search-field"
|
|
731
|
-
},
|
|
985
|
+
}, ut = {
|
|
732
986
|
key: 1,
|
|
733
987
|
class: "dock-persistent dock-persistent-end"
|
|
734
|
-
},
|
|
988
|
+
}, dt = /* @__PURE__ */ I({
|
|
735
989
|
inheritAttrs: !1,
|
|
736
990
|
__name: "GlassDock",
|
|
737
991
|
props: {
|
|
@@ -746,123 +1000,123 @@ var qe = ["data-backdrop-mode", "data-held"], Je = ["data-held"], Ye = { class:
|
|
|
746
1000
|
backgroundCanvas: {}
|
|
747
1001
|
},
|
|
748
1002
|
setup(e, { expose: t }) {
|
|
749
|
-
let n = e, { startCollapsed: r, shape: i, orientation: a, alwaysExpanded: o, fitContent: s } =
|
|
750
|
-
|
|
751
|
-
runEl: p,
|
|
1003
|
+
let n = e, { startCollapsed: r, shape: i, orientation: a, alwaysExpanded: o, fitContent: s } = Ke(n), c = Y("dockEl"), u = Y("layersEl"), d = Y("fullEl"), m = Y("summaryEl"), h = Y("statusEl"), { toolbar: g } = nt({
|
|
1004
|
+
runEl: d,
|
|
752
1005
|
statusEl: h,
|
|
753
1006
|
orientation: a
|
|
754
|
-
})
|
|
1007
|
+
});
|
|
1008
|
+
n.backdropMode === "live" && Fe(c, { backgroundCanvas: () => {
|
|
755
1009
|
let e = n.backgroundCanvas;
|
|
756
1010
|
return typeof e == "function" ? e() : e instanceof HTMLCanvasElement ? e : null;
|
|
757
1011
|
} });
|
|
758
|
-
let
|
|
1012
|
+
let _ = K(!1), v = `glass-dock-${se()}`, { expanded: y, isPinned: b, isHeld: x, graspHeld: S, onMouseEnter: w, onMouseLeave: T, onFocusIn: E, onFocusOut: D, onClickCollapsed: O, keepOpen: k, release: j, expand: I, collapse: te } = Ie({
|
|
759
1013
|
rootEl: c,
|
|
760
1014
|
alwaysExpanded: o,
|
|
761
1015
|
initialExpanded: !r.value,
|
|
762
|
-
isTransitioning:
|
|
763
|
-
dockId:
|
|
764
|
-
}),
|
|
1016
|
+
isTransitioning: _,
|
|
1017
|
+
dockId: v
|
|
1018
|
+
}), L = A(() => o.value || y.value);
|
|
765
1019
|
l({
|
|
766
|
-
id:
|
|
1020
|
+
id: v,
|
|
767
1021
|
orientation: a,
|
|
768
|
-
keepOpen:
|
|
1022
|
+
keepOpen: k,
|
|
769
1023
|
release: j,
|
|
770
|
-
held:
|
|
771
|
-
expanded:
|
|
772
|
-
})
|
|
1024
|
+
held: S,
|
|
1025
|
+
expanded: L
|
|
1026
|
+
});
|
|
1027
|
+
let ne = Ge({
|
|
773
1028
|
rootEl: c,
|
|
774
1029
|
contentEl: u,
|
|
775
|
-
expandedEl:
|
|
1030
|
+
expandedEl: d,
|
|
776
1031
|
collapsedEl: m,
|
|
777
|
-
axis: a
|
|
778
|
-
|
|
779
|
-
});
|
|
780
|
-
let { outerCurrentLayer: H, outerLeavingLayer: U } = Fe({
|
|
1032
|
+
axis: a
|
|
1033
|
+
}), { outerCurrentLayer: V, outerLeavingLayer: H } = Re({
|
|
781
1034
|
rootEl: c,
|
|
782
|
-
outerActiveLayer: A(() =>
|
|
1035
|
+
outerActiveLayer: A(() => L.value ? "full" : "summary"),
|
|
783
1036
|
onMorphActiveChange: (e) => {
|
|
784
|
-
|
|
785
|
-
}
|
|
786
|
-
|
|
787
|
-
|
|
788
|
-
|
|
1037
|
+
_.value = e;
|
|
1038
|
+
},
|
|
1039
|
+
geometry: ne
|
|
1040
|
+
}), U = A(() => V.value === "summary");
|
|
1041
|
+
async function re(e) {
|
|
1042
|
+
!U.value || !["Enter", " "].includes(e.key) || (e.preventDefault(), O(), await z(), (d.value?.querySelector(C) ?? d.value)?.focus({ preventScroll: !0 }));
|
|
789
1043
|
}
|
|
790
|
-
function
|
|
1044
|
+
function G(e) {
|
|
791
1045
|
if (e.key !== "Escape") return;
|
|
792
|
-
let t = e.target?.closest?.(
|
|
793
|
-
t &&
|
|
1046
|
+
let t = e.target?.closest?.(f);
|
|
1047
|
+
t && d.value?.contains(t) || te();
|
|
794
1048
|
}
|
|
795
|
-
|
|
1049
|
+
X(L, async (e, t) => {
|
|
796
1050
|
if (!t || e) return;
|
|
797
1051
|
let n = document.activeElement;
|
|
798
|
-
if (!(n &&
|
|
1052
|
+
if (!(n && d.value?.contains(n) || n?.closest("[data-glass-dock-face]")?.getAttribute("data-glass-dock-owner") === v)) return;
|
|
799
1053
|
await z();
|
|
800
1054
|
let r = m.value;
|
|
801
1055
|
r && !r.hasAttribute("inert") && r.focus({ preventScroll: !0 });
|
|
802
1056
|
});
|
|
803
|
-
let { onPointerDownCapture:
|
|
1057
|
+
let { onPointerDownCapture: ie, onPointerCancelCapture: ae, onClickCapture: oe, markExpandFlip: ce, pressKeepaliveLayer: Q } = qe({
|
|
804
1058
|
rootEl: c,
|
|
805
|
-
visualExpanded:
|
|
1059
|
+
visualExpanded: L
|
|
806
1060
|
});
|
|
807
|
-
|
|
808
|
-
e &&
|
|
1061
|
+
X(L, (e) => {
|
|
1062
|
+
e && ce();
|
|
809
1063
|
});
|
|
810
|
-
let
|
|
811
|
-
|
|
812
|
-
e && (
|
|
1064
|
+
let ue = K(!1);
|
|
1065
|
+
X(S, (e) => {
|
|
1066
|
+
e && (ue.value = !0);
|
|
813
1067
|
});
|
|
814
|
-
function
|
|
815
|
-
e.propertyName === "opacity" && !
|
|
1068
|
+
function de(e) {
|
|
1069
|
+
e.propertyName === "opacity" && !S.value && (ue.value = !1);
|
|
816
1070
|
}
|
|
817
1071
|
return t({
|
|
818
|
-
expanded:
|
|
819
|
-
isPinned:
|
|
820
|
-
isHeld:
|
|
821
|
-
graspHeld:
|
|
822
|
-
isTransitioning:
|
|
1072
|
+
expanded: y,
|
|
1073
|
+
isPinned: b,
|
|
1074
|
+
isHeld: x,
|
|
1075
|
+
graspHeld: S,
|
|
1076
|
+
isTransitioning: _,
|
|
823
1077
|
expand: I,
|
|
824
|
-
collapse:
|
|
825
|
-
keepOpen:
|
|
1078
|
+
collapse: te,
|
|
1079
|
+
keepOpen: k,
|
|
826
1080
|
release: j
|
|
827
|
-
}), (e, t) => (
|
|
1081
|
+
}), (e, t) => (W(), N("div", R({
|
|
828
1082
|
ref_key: "dockEl",
|
|
829
1083
|
ref: c
|
|
830
1084
|
}, e.$attrs, {
|
|
831
1085
|
class: ["glass-dock", [
|
|
832
|
-
|
|
833
|
-
`shape-${
|
|
1086
|
+
J(a),
|
|
1087
|
+
`shape-${J(i)}`,
|
|
834
1088
|
{
|
|
835
|
-
expanded:
|
|
836
|
-
collapsed: !
|
|
837
|
-
pinned:
|
|
838
|
-
"fit-content":
|
|
839
|
-
"always-expanded":
|
|
1089
|
+
expanded: L.value,
|
|
1090
|
+
collapsed: !L.value,
|
|
1091
|
+
pinned: J(b),
|
|
1092
|
+
"fit-content": J(s),
|
|
1093
|
+
"always-expanded": J(o)
|
|
840
1094
|
}
|
|
841
1095
|
]],
|
|
842
1096
|
"data-backdrop-mode": n.backdropMode,
|
|
843
|
-
"data-held":
|
|
844
|
-
onMouseenter: t[2] ||= (...e) =>
|
|
845
|
-
onMouseleave: t[3] ||= (e) =>
|
|
846
|
-
onFocusin: t[4] ||= (...e) =>
|
|
847
|
-
onFocusout: t[5] ||= (...e) =>
|
|
848
|
-
onPointerdownCapture: t[6] ||= (...e) =>
|
|
849
|
-
onPointercancelCapture: t[7] ||= (...e) =>
|
|
850
|
-
onClickCapture: t[8] ||= (...e) =>
|
|
1097
|
+
"data-held": J(S) || void 0,
|
|
1098
|
+
onMouseenter: t[2] ||= (...e) => J(w) && J(w)(...e),
|
|
1099
|
+
onMouseleave: t[3] ||= (e) => J(T)(e),
|
|
1100
|
+
onFocusin: t[4] ||= (...e) => J(E) && J(E)(...e),
|
|
1101
|
+
onFocusout: t[5] ||= (...e) => J(D) && J(D)(...e),
|
|
1102
|
+
onPointerdownCapture: t[6] ||= (...e) => J(ie) && J(ie)(...e),
|
|
1103
|
+
onPointercancelCapture: t[7] ||= (...e) => J(ae) && J(ae)(...e),
|
|
1104
|
+
onClickCapture: t[8] ||= (...e) => J(oe) && J(oe)(...e)
|
|
851
1105
|
}), [
|
|
852
1106
|
P("div", {
|
|
853
1107
|
class: "dock-plate",
|
|
854
1108
|
"aria-hidden": "true",
|
|
855
|
-
"data-held":
|
|
856
|
-
}, [
|
|
1109
|
+
"data-held": J(S) || void 0
|
|
1110
|
+
}, [ue.value ? (W(), N(ee, { key: 0 }, [t[9] ||= P("span", {
|
|
857
1111
|
class: "glass-grasp-carrier",
|
|
858
1112
|
"data-grasp": "rest"
|
|
859
1113
|
}, null, -1), P("span", {
|
|
860
1114
|
class: "glass-grasp-carrier",
|
|
861
1115
|
"data-grasp": "grasp",
|
|
862
|
-
onTransitionend:
|
|
863
|
-
}, null, 32)], 64)) : M("", !0)], 8,
|
|
864
|
-
P("div",
|
|
865
|
-
e.$slots.persistent ? (
|
|
1116
|
+
onTransitionend: de
|
|
1117
|
+
}, null, 32)], 64)) : M("", !0)], 8, it),
|
|
1118
|
+
P("div", at, [
|
|
1119
|
+
e.$slots.persistent ? (W(), N("div", ot, [q(e.$slots, "persistent")])) : M("", !0),
|
|
866
1120
|
P("div", {
|
|
867
1121
|
ref_key: "layersEl",
|
|
868
1122
|
ref: u,
|
|
@@ -870,43 +1124,43 @@ var qe = ["data-backdrop-mode", "data-held"], Je = ["data-held"], Ye = { class:
|
|
|
870
1124
|
}, [
|
|
871
1125
|
P("div", {
|
|
872
1126
|
ref_key: "fullEl",
|
|
873
|
-
ref:
|
|
874
|
-
id: `${
|
|
875
|
-
role: "toolbar",
|
|
876
|
-
"aria-orientation":
|
|
1127
|
+
ref: d,
|
|
1128
|
+
id: `${v}-full`,
|
|
1129
|
+
role: J(g) ? "toolbar" : void 0,
|
|
1130
|
+
"aria-orientation": J(g) ? J(a) : void 0,
|
|
877
1131
|
class: B(["dock-layer dock-layer--full dock-run", {
|
|
878
|
-
"is-active":
|
|
879
|
-
"is-leaving":
|
|
880
|
-
"is-press-keepalive":
|
|
1132
|
+
"is-active": J(V) === "full",
|
|
1133
|
+
"is-leaving": J(H) === "full" || J(Q) === "full" && J(V) !== "full",
|
|
1134
|
+
"is-press-keepalive": J(Q) === "full"
|
|
881
1135
|
}]),
|
|
882
|
-
inert:
|
|
1136
|
+
inert: J(V) !== "full" && J(Q) !== "full" || void 0,
|
|
883
1137
|
tabindex: "-1",
|
|
884
|
-
onKeydown:
|
|
885
|
-
}, [F(
|
|
886
|
-
default:
|
|
1138
|
+
onKeydown: G
|
|
1139
|
+
}, [F(J(p), null, {
|
|
1140
|
+
default: Z(() => [q(e.$slots, "default")]),
|
|
887
1141
|
_: 3
|
|
888
|
-
})], 42,
|
|
1142
|
+
})], 42, st),
|
|
889
1143
|
P("div", {
|
|
890
1144
|
ref_key: "summaryEl",
|
|
891
1145
|
ref: m,
|
|
892
|
-
id: `${
|
|
1146
|
+
id: `${v}-summary`,
|
|
893
1147
|
class: B(["dock-layer dock-layer--summary", {
|
|
894
|
-
"is-active":
|
|
895
|
-
"is-leaving":
|
|
1148
|
+
"is-active": J(V) === "summary",
|
|
1149
|
+
"is-leaving": J(H) === "summary"
|
|
896
1150
|
}]),
|
|
897
|
-
inert:
|
|
898
|
-
role:
|
|
899
|
-
tabindex:
|
|
900
|
-
"aria-label":
|
|
901
|
-
"aria-expanded":
|
|
902
|
-
"aria-controls":
|
|
903
|
-
onFocusin: t[0] ||=
|
|
904
|
-
onKeydown:
|
|
905
|
-
onClick: t[1] ||= (...e) =>
|
|
906
|
-
}, [
|
|
907
|
-
e.$slots.search ? (
|
|
1151
|
+
inert: J(V) !== "summary" || void 0,
|
|
1152
|
+
role: U.value ? "button" : void 0,
|
|
1153
|
+
tabindex: U.value ? 0 : void 0,
|
|
1154
|
+
"aria-label": U.value ? "Expand dock" : void 0,
|
|
1155
|
+
"aria-expanded": U.value ? "false" : void 0,
|
|
1156
|
+
"aria-controls": U.value ? `${v}-full` : void 0,
|
|
1157
|
+
onFocusin: t[0] ||= le(() => {}, ["stop"]),
|
|
1158
|
+
onKeydown: re,
|
|
1159
|
+
onClick: t[1] ||= (...e) => J(O) && J(O)(...e)
|
|
1160
|
+
}, [q(e.$slots, "collapsed")], 42, ct),
|
|
1161
|
+
e.$slots.search ? (W(), N("div", lt, [q(e.$slots, "search")])) : M("", !0)
|
|
908
1162
|
], 512),
|
|
909
|
-
e.$slots["persistent-end"] ? (
|
|
1163
|
+
e.$slots["persistent-end"] ? (W(), N("div", ut, [q(e.$slots, "persistent-end")])) : M("", !0)
|
|
910
1164
|
]),
|
|
911
1165
|
P("div", {
|
|
912
1166
|
ref_key: "statusEl",
|
|
@@ -915,47 +1169,47 @@ var qe = ["data-backdrop-mode", "data-held"], Je = ["data-held"], Ye = { class:
|
|
|
915
1169
|
role: "status",
|
|
916
1170
|
"aria-live": "polite"
|
|
917
1171
|
}, null, 512)
|
|
918
|
-
], 16,
|
|
1172
|
+
], 16, rt));
|
|
919
1173
|
}
|
|
920
|
-
}),
|
|
921
|
-
function
|
|
922
|
-
|
|
1174
|
+
}), ft = c("glass-ui:dock-switcher-tablist"), { KEY: pt } = ft;
|
|
1175
|
+
function mt(e) {
|
|
1176
|
+
ft.provide(e);
|
|
923
1177
|
}
|
|
924
|
-
var
|
|
925
|
-
function
|
|
926
|
-
|
|
1178
|
+
var ht = ft.use, gt = s(m, "[glass-ui:dock] <DockLayer> must be used inside <DockCrossfade> (or <DockLayerGroup>)"), { KEY: _t } = gt;
|
|
1179
|
+
function vt(e) {
|
|
1180
|
+
gt.provide(e);
|
|
927
1181
|
}
|
|
928
|
-
var
|
|
1182
|
+
var yt = gt.use, bt = /* @__PURE__ */ I({
|
|
929
1183
|
__name: "DockCrossfade",
|
|
930
1184
|
props: {
|
|
931
1185
|
active: {},
|
|
932
1186
|
reserve: { default: "block" }
|
|
933
1187
|
},
|
|
934
1188
|
setup(e, { expose: t }) {
|
|
935
|
-
let n = e, r =
|
|
1189
|
+
let n = e, r = K(null), i = K(/* @__PURE__ */ new Map()), a = A(() => [...i.value.values()].map(({ id: e, label: t, icon: n }) => ({
|
|
936
1190
|
id: e,
|
|
937
1191
|
label: t,
|
|
938
1192
|
icon: n
|
|
939
1193
|
})));
|
|
940
1194
|
function o(e) {
|
|
941
1195
|
let t = new Map(i.value);
|
|
942
|
-
t.set(e.id, e), i.value = t,
|
|
1196
|
+
t.set(e.id, e), i.value = t, p();
|
|
943
1197
|
}
|
|
944
1198
|
function s(e) {
|
|
945
1199
|
if (!i.value.has(e)) return;
|
|
946
1200
|
let t = new Map(i.value);
|
|
947
|
-
t.delete(e), i.value = t,
|
|
1201
|
+
t.delete(e), i.value = t, p();
|
|
948
1202
|
}
|
|
949
|
-
let c = A(() => n.active), l =
|
|
950
|
-
|
|
1203
|
+
let c = A(() => n.active), l = K(null);
|
|
1204
|
+
vt({
|
|
951
1205
|
register: o,
|
|
952
1206
|
unregister: s,
|
|
953
1207
|
activeId: c,
|
|
954
1208
|
leavingId: l,
|
|
955
1209
|
faces: a
|
|
956
1210
|
});
|
|
957
|
-
let u =
|
|
958
|
-
function
|
|
1211
|
+
let u = K(0), f = A(() => n.reserve === "inline" ? "min-inline-size" : "min-block-size");
|
|
1212
|
+
function p() {
|
|
959
1213
|
let e = 0;
|
|
960
1214
|
for (let { el: t } of i.value.values()) {
|
|
961
1215
|
let r = n.reserve === "inline" ? t.scrollWidth : t.scrollHeight;
|
|
@@ -963,77 +1217,77 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
963
1217
|
}
|
|
964
1218
|
e > u.value && (u.value = e);
|
|
965
1219
|
}
|
|
966
|
-
let
|
|
967
|
-
[
|
|
1220
|
+
let m = A(() => u.value > 0 ? {
|
|
1221
|
+
[f.value]: `${u.value}px`,
|
|
968
1222
|
"--dock-crossfade-peak": `${u.value}px`
|
|
969
1223
|
} : void 0);
|
|
970
|
-
|
|
971
|
-
let
|
|
972
|
-
response:
|
|
973
|
-
dampingFraction:
|
|
1224
|
+
b(r, () => p());
|
|
1225
|
+
let h = Le({
|
|
1226
|
+
response: d.response,
|
|
1227
|
+
dampingFraction: d.dampingFraction
|
|
974
1228
|
});
|
|
975
|
-
function
|
|
1229
|
+
function g(e) {
|
|
976
1230
|
return e ? i.value.get(e)?.el : void 0;
|
|
977
1231
|
}
|
|
978
|
-
function
|
|
979
|
-
|
|
1232
|
+
function _(e, t) {
|
|
1233
|
+
g(e)?.style.setProperty("--dock-t", `${t}`);
|
|
980
1234
|
}
|
|
981
|
-
function
|
|
982
|
-
|
|
1235
|
+
function v(e) {
|
|
1236
|
+
g(e)?.style.removeProperty("--dock-t");
|
|
983
1237
|
}
|
|
984
|
-
function
|
|
1238
|
+
function y(e) {
|
|
985
1239
|
return e < 0 ? 0 : e > 1 ? 1 : e;
|
|
986
1240
|
}
|
|
987
|
-
let x =
|
|
988
|
-
|
|
989
|
-
e && (
|
|
1241
|
+
let x = ve("(prefers-reduced-motion: reduce)"), S = null, C = 1;
|
|
1242
|
+
X(x, (e) => {
|
|
1243
|
+
e && (h.dispose(), S?.());
|
|
990
1244
|
});
|
|
991
1245
|
async function w(e, t) {
|
|
992
1246
|
if (typeof document > "u") return;
|
|
993
|
-
let n =
|
|
994
|
-
!n || !r || !n.contains(r) || (await z(), (
|
|
1247
|
+
let n = g(e), r = document.activeElement;
|
|
1248
|
+
!n || !r || !n.contains(r) || (await z(), (g(t) ?? document.body).focus?.());
|
|
995
1249
|
}
|
|
996
|
-
return
|
|
1250
|
+
return X(c, (e, t) => {
|
|
997
1251
|
if (e === t) return;
|
|
998
|
-
|
|
999
|
-
let n =
|
|
1252
|
+
p();
|
|
1253
|
+
let n = g(e), i = g(t);
|
|
1000
1254
|
if (!n || !i) {
|
|
1001
|
-
l.value = null,
|
|
1255
|
+
l.value = null, v(e), C = 1;
|
|
1002
1256
|
return;
|
|
1003
1257
|
}
|
|
1004
|
-
let a = l.value, o = Number.parseFloat(n.style.getPropertyValue("--dock-t")), s = Number.parseFloat(i.style.getPropertyValue("--dock-t")), c = a === e && Number.isFinite(o) ? 1 -
|
|
1005
|
-
a && a !== e && a !== t &&
|
|
1258
|
+
let a = l.value, o = Number.parseFloat(n.style.getPropertyValue("--dock-t")), s = Number.parseFloat(i.style.getPropertyValue("--dock-t")), c = a === e && Number.isFinite(o) ? 1 - y(o) : 0, u = Number.isFinite(s) ? y(s) : 1;
|
|
1259
|
+
a && a !== e && a !== t && v(a), l.value = t, _(e, c), _(t, 1 - u), w(t, e), r.value?.setAttribute("data-crossfading", "");
|
|
1006
1260
|
let d = () => {
|
|
1007
|
-
|
|
1261
|
+
v(e), v(t), r.value?.removeAttribute("data-crossfading"), l.value = null, C = 1, S === d && (S = null);
|
|
1008
1262
|
};
|
|
1009
1263
|
if (S = d, x.value) {
|
|
1010
1264
|
d();
|
|
1011
1265
|
return;
|
|
1012
1266
|
}
|
|
1013
|
-
let
|
|
1014
|
-
C = 1 - c,
|
|
1015
|
-
inheritVelocityScale:
|
|
1267
|
+
let f = u > .001 ? -C / u : 0;
|
|
1268
|
+
C = 1 - c, h.playTo(0, 1, {
|
|
1269
|
+
inheritVelocityScale: f,
|
|
1016
1270
|
onFrame: (n) => {
|
|
1017
|
-
|
|
1271
|
+
_(e, y(c + (1 - c) * n)), _(t, y(1 - u * (1 - n)));
|
|
1018
1272
|
},
|
|
1019
1273
|
onSettle: d
|
|
1020
1274
|
});
|
|
1021
|
-
}),
|
|
1022
|
-
|
|
1023
|
-
}), t({ faces: a }), (e, t) => (
|
|
1275
|
+
}), V(() => {
|
|
1276
|
+
h.dispose(), S = null;
|
|
1277
|
+
}), t({ faces: a }), (e, t) => (W(), N("div", {
|
|
1024
1278
|
ref_key: "rootEl",
|
|
1025
1279
|
ref: r,
|
|
1026
1280
|
class: "dock-crossfade",
|
|
1027
|
-
style:
|
|
1028
|
-
}, [
|
|
1281
|
+
style: ne(m.value)
|
|
1282
|
+
}, [q(e.$slots, "default")], 4));
|
|
1029
1283
|
}
|
|
1030
|
-
}),
|
|
1284
|
+
}), xt = ["data-motion"], St = ["aria-orientation"], Ct = [
|
|
1031
1285
|
"id",
|
|
1032
1286
|
"tabindex",
|
|
1033
1287
|
"aria-controls",
|
|
1034
1288
|
"aria-label",
|
|
1035
1289
|
"onClick"
|
|
1036
|
-
],
|
|
1290
|
+
], wt = { key: 1 }, Tt = { key: 2 }, Et = /* @__PURE__ */ I({
|
|
1037
1291
|
__name: "DockLayerGroup",
|
|
1038
1292
|
props: /*@__PURE__*/ L({
|
|
1039
1293
|
orientation: {},
|
|
@@ -1049,7 +1303,7 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1049
1303
|
}),
|
|
1050
1304
|
emits: ["update:active"],
|
|
1051
1305
|
setup(e) {
|
|
1052
|
-
let t = e, n = o(() => t.motion), r =
|
|
1306
|
+
let t = e, n = o(() => t.motion), r = ce(e, "active"), i = v(), a = A(() => t.orientation ?? i?.orientation.value ?? "horizontal"), s = Y("crossfade"), c = A(() => s.value?.faces ?? []), l = A(() => a.value === "vertical" ? "horizontal" : "vertical"), u = A(() => l.value === "vertical"), d = K(null), f = K(null), p = K([]), m = T({
|
|
1053
1307
|
options: A(() => c.value.map((e) => ({ value: e.id }))),
|
|
1054
1308
|
model: r,
|
|
1055
1309
|
mode: "single",
|
|
@@ -1058,8 +1312,8 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1058
1312
|
containerRef: d,
|
|
1059
1313
|
indicatorRef: f,
|
|
1060
1314
|
buttonRefs: p
|
|
1061
|
-
}), g = A(() => t.showSwitcher && c.value.length > 1),
|
|
1062
|
-
|
|
1315
|
+
}), g = A(() => t.showSwitcher && c.value.length > 1), _ = se(), y = (e) => e.replace(/[^a-zA-Z0-9_-]/g, ""), b = (e) => `dock-tab-${_}-${y(e)}`, x = (e) => `dock-panel-${_}-${y(e)}`;
|
|
1316
|
+
mt({
|
|
1063
1317
|
isTablist: g,
|
|
1064
1318
|
tabId: b,
|
|
1065
1319
|
panelId: x
|
|
@@ -1077,7 +1331,7 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1077
1331
|
};
|
|
1078
1332
|
});
|
|
1079
1333
|
}
|
|
1080
|
-
let
|
|
1334
|
+
let w = E({
|
|
1081
1335
|
handle: d,
|
|
1082
1336
|
surface: f,
|
|
1083
1337
|
axis: () => S.value,
|
|
@@ -1086,41 +1340,41 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1086
1340
|
n.armed.value && r.value !== e && (r.value = e);
|
|
1087
1341
|
}
|
|
1088
1342
|
});
|
|
1089
|
-
|
|
1343
|
+
X(() => [
|
|
1090
1344
|
c.value.length,
|
|
1091
1345
|
l.value,
|
|
1092
1346
|
n.armed.value
|
|
1093
1347
|
], () => {
|
|
1094
|
-
n.armed.value && z(() =>
|
|
1095
|
-
}),
|
|
1096
|
-
n.armed.value && z(() =>
|
|
1348
|
+
n.armed.value && z(() => w.refresh());
|
|
1349
|
+
}), H(() => {
|
|
1350
|
+
n.armed.value && z(() => w.refresh());
|
|
1097
1351
|
});
|
|
1098
1352
|
function D(e) {
|
|
1099
1353
|
return typeof e == "object" && !!e || typeof e == "function";
|
|
1100
1354
|
}
|
|
1101
|
-
let O =
|
|
1102
|
-
function
|
|
1355
|
+
let O = h(() => i);
|
|
1356
|
+
function k() {
|
|
1103
1357
|
O.acquire();
|
|
1104
1358
|
}
|
|
1105
|
-
function
|
|
1359
|
+
function I(e) {
|
|
1106
1360
|
let t = e.relatedTarget, n = e.currentTarget;
|
|
1107
1361
|
t && n?.contains(t) || O.release();
|
|
1108
1362
|
}
|
|
1109
|
-
return (t, i) => (
|
|
1363
|
+
return (t, i) => (W(), N("div", {
|
|
1110
1364
|
class: B(["dock-layer-group", [a.value, `switcher-${e.switcherPosition}`]]),
|
|
1111
|
-
"data-motion":
|
|
1112
|
-
style:
|
|
1113
|
-
}, [g.value ? (
|
|
1365
|
+
"data-motion": J(n).dataMotion.value,
|
|
1366
|
+
style: ne(J(n).hostStyle.value)
|
|
1367
|
+
}, [g.value ? (W(), N("div", {
|
|
1114
1368
|
key: 0,
|
|
1115
1369
|
ref_key: "switcherListEl",
|
|
1116
1370
|
ref: d,
|
|
1117
1371
|
role: "tablist",
|
|
1118
|
-
class: B(["dock-layer-switcher", [e.switcherPosition,
|
|
1372
|
+
class: B(["dock-layer-switcher", [e.switcherPosition, J(n).armed.value && "glass-drag-grabbable"]]),
|
|
1119
1373
|
"aria-orientation": l.value,
|
|
1120
|
-
onKeydown: i[0] ||= (...e) =>
|
|
1121
|
-
onFocusin:
|
|
1122
|
-
onFocusout:
|
|
1123
|
-
}, [(
|
|
1374
|
+
onKeydown: i[0] ||= (...e) => J(m).onKeydown && J(m).onKeydown(...e),
|
|
1375
|
+
onFocusin: k,
|
|
1376
|
+
onFocusout: I
|
|
1377
|
+
}, [(W(!0), N(ee, null, ie(c.value, (e, t) => (W(), N("button", R({
|
|
1124
1378
|
key: e.id,
|
|
1125
1379
|
ref_for: !0,
|
|
1126
1380
|
ref: (e) => {
|
|
@@ -1129,37 +1383,37 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1129
1383
|
type: "button",
|
|
1130
1384
|
class: "dock-layer-tab",
|
|
1131
1385
|
id: b(e.id),
|
|
1132
|
-
tabindex:
|
|
1133
|
-
}, { ref_for: !0 },
|
|
1386
|
+
tabindex: J(m).rovingTabindex(t)
|
|
1387
|
+
}, { ref_for: !0 }, J(m).itemAttrs(e.id), {
|
|
1134
1388
|
"aria-controls": x(e.id),
|
|
1135
1389
|
"aria-label": e.label ?? e.id,
|
|
1136
|
-
onClick: (n) =>
|
|
1137
|
-
}), [D(e.icon) ? (
|
|
1390
|
+
onClick: (n) => J(m).select(e.id, t)
|
|
1391
|
+
}), [D(e.icon) ? (W(), j(ae(e.icon), {
|
|
1138
1392
|
key: 0,
|
|
1139
1393
|
class: "size-4"
|
|
1140
|
-
})) : typeof e.icon == "string" ? (
|
|
1394
|
+
})) : typeof e.icon == "string" ? (W(), N("span", wt, oe(e.icon), 1)) : (W(), N("span", Tt, oe((e.label ?? e.id).charAt(0)), 1))], 16, Ct))), 128)), P("div", {
|
|
1141
1395
|
ref_key: "switcherIndicatorEl",
|
|
1142
1396
|
ref: f,
|
|
1143
|
-
class: B(["dock-layer-tab-indicator",
|
|
1144
|
-
style:
|
|
1397
|
+
class: B(["dock-layer-tab-indicator", J(n).armed.value && J(w).dragging.value && "glass-drag-lift"]),
|
|
1398
|
+
style: ne(J(m).singleSliderStyle.value),
|
|
1145
1399
|
"aria-hidden": "true"
|
|
1146
|
-
}, null, 6)], 42,
|
|
1400
|
+
}, null, 6)], 42, St)) : M("", !0), F(bt, {
|
|
1147
1401
|
ref_key: "crossfade",
|
|
1148
1402
|
ref: s,
|
|
1149
1403
|
active: r.value
|
|
1150
1404
|
}, {
|
|
1151
|
-
default:
|
|
1405
|
+
default: Z(() => [q(t.$slots, "default")]),
|
|
1152
1406
|
_: 3
|
|
1153
|
-
}, 8, ["active"])], 14,
|
|
1407
|
+
}, 8, ["active"])], 14, xt));
|
|
1154
1408
|
}
|
|
1155
|
-
}),
|
|
1409
|
+
}), Dt = [
|
|
1156
1410
|
"role",
|
|
1157
1411
|
"id",
|
|
1158
1412
|
"aria-labelledby",
|
|
1159
1413
|
"inert",
|
|
1160
1414
|
"aria-hidden",
|
|
1161
1415
|
"tabindex"
|
|
1162
|
-
],
|
|
1416
|
+
], Ot = { class: "dock-face-content" }, kt = /* @__PURE__ */ I({
|
|
1163
1417
|
__name: "DockLayer",
|
|
1164
1418
|
props: {
|
|
1165
1419
|
id: {},
|
|
@@ -1167,15 +1421,15 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1167
1421
|
icon: {}
|
|
1168
1422
|
},
|
|
1169
1423
|
setup(e) {
|
|
1170
|
-
let t = e, n =
|
|
1171
|
-
|
|
1424
|
+
let t = e, n = yt(), r = Y("hostEl");
|
|
1425
|
+
H(() => {
|
|
1172
1426
|
r.value && n.register({
|
|
1173
1427
|
id: t.id,
|
|
1174
1428
|
label: t.label,
|
|
1175
1429
|
icon: t.icon,
|
|
1176
1430
|
el: r.value
|
|
1177
1431
|
});
|
|
1178
|
-
}),
|
|
1432
|
+
}), X(() => [
|
|
1179
1433
|
t.id,
|
|
1180
1434
|
t.label,
|
|
1181
1435
|
t.icon
|
|
@@ -1186,9 +1440,9 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1186
1440
|
icon: t.icon,
|
|
1187
1441
|
el: r.value
|
|
1188
1442
|
});
|
|
1189
|
-
}),
|
|
1190
|
-
let i = A(() => n.activeId.value === t.id), a = A(() => n.leavingId.value === t.id), o =
|
|
1191
|
-
return (e, t) => (
|
|
1443
|
+
}), V(() => n.unregister(t.id));
|
|
1444
|
+
let i = A(() => n.activeId.value === t.id), a = A(() => n.leavingId.value === t.id), o = ht(), s = A(() => o?.isTablist.value ?? !1), c = A(() => s.value ? o.panelId(t.id) : void 0), l = A(() => s.value ? o.tabId(t.id) : void 0);
|
|
1445
|
+
return (e, t) => (W(), N("div", {
|
|
1192
1446
|
ref_key: "hostEl",
|
|
1193
1447
|
ref: r,
|
|
1194
1448
|
class: B(["dock-face", {
|
|
@@ -1201,9 +1455,9 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1201
1455
|
inert: !i.value || void 0,
|
|
1202
1456
|
"aria-hidden": !i.value || void 0,
|
|
1203
1457
|
tabindex: i.value ? -1 : void 0
|
|
1204
|
-
}, [P("div",
|
|
1458
|
+
}, [P("div", Ot, [q(e.$slots, "default")])], 10, Dt));
|
|
1205
1459
|
}
|
|
1206
|
-
}),
|
|
1460
|
+
}), At = /* @__PURE__ */ I({
|
|
1207
1461
|
__name: "DockControl",
|
|
1208
1462
|
props: {
|
|
1209
1463
|
shape: { default: "icon" },
|
|
@@ -1235,6 +1489,7 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1235
1489
|
},
|
|
1236
1490
|
setup(t) {
|
|
1237
1491
|
let r = t, o = A(() => r.shape === "tab"), s = A(() => o.value ? e("dock-tab-button glass-specular-track", r.class) : e("dock-icon-button glass-specular-track glass-capsule-hover", { "glass-capsule": r.active }, { "dock-icon-button--compact": r.compact }, r.class)), c = A(() => ({
|
|
1492
|
+
[y]: "",
|
|
1238
1493
|
...r.active === void 0 ? {} : {
|
|
1239
1494
|
"aria-pressed": String(r.active),
|
|
1240
1495
|
...r.active ? { "data-active": "" } : {}
|
|
@@ -1252,7 +1507,7 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1252
1507
|
function p(e) {
|
|
1253
1508
|
r.disabled && (e.preventDefault(), e.stopImmediatePropagation());
|
|
1254
1509
|
}
|
|
1255
|
-
return (e, r) =>
|
|
1510
|
+
return (e, r) => Q((W(), j(J(de), R({
|
|
1256
1511
|
as: t.as,
|
|
1257
1512
|
"as-child": t.asChild
|
|
1258
1513
|
}, {
|
|
@@ -1261,18 +1516,18 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1261
1516
|
}, {
|
|
1262
1517
|
class: s.value,
|
|
1263
1518
|
style: f.value,
|
|
1264
|
-
"data-press-armed": !o.value &&
|
|
1265
|
-
onPointerdown:
|
|
1266
|
-
onPointerup:
|
|
1267
|
-
onPointercancel:
|
|
1268
|
-
onPointerleave:
|
|
1269
|
-
onPointerenter:
|
|
1270
|
-
onKeydown:
|
|
1271
|
-
onKeyup:
|
|
1272
|
-
onBlur:
|
|
1519
|
+
"data-press-armed": !o.value && J(d).armed ? "" : void 0,
|
|
1520
|
+
onPointerdown: J(d).handlers.onPointerdown,
|
|
1521
|
+
onPointerup: J(d).handlers.onPointerup,
|
|
1522
|
+
onPointercancel: J(d).handlers.onPointercancel,
|
|
1523
|
+
onPointerleave: J(d).handlers.onPointerleave,
|
|
1524
|
+
onPointerenter: J(d).handlers.onPointerenter,
|
|
1525
|
+
onKeydown: J(d).handlers.onKeydown,
|
|
1526
|
+
onKeyup: J(d).handlers.onKeyup,
|
|
1527
|
+
onBlur: J(d).handlers.onBlur,
|
|
1273
1528
|
onClickCapture: p
|
|
1274
1529
|
}), {
|
|
1275
|
-
default:
|
|
1530
|
+
default: Z(() => [q(e.$slots, "default")]),
|
|
1276
1531
|
_: 3
|
|
1277
1532
|
}, 16, [
|
|
1278
1533
|
"as",
|
|
@@ -1288,9 +1543,9 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1288
1543
|
"onKeydown",
|
|
1289
1544
|
"onKeyup",
|
|
1290
1545
|
"onBlur"
|
|
1291
|
-
])), [[
|
|
1546
|
+
])), [[J(n)]]);
|
|
1292
1547
|
}
|
|
1293
|
-
}),
|
|
1548
|
+
}), jt = /* @__PURE__ */ I({
|
|
1294
1549
|
inheritAttrs: !1,
|
|
1295
1550
|
__name: "DockTrigger",
|
|
1296
1551
|
props: {
|
|
@@ -1304,28 +1559,69 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1304
1559
|
] }
|
|
1305
1560
|
},
|
|
1306
1561
|
setup(t) {
|
|
1307
|
-
let r = t, i =
|
|
1308
|
-
|
|
1309
|
-
|
|
1310
|
-
|
|
1311
|
-
|
|
1312
|
-
|
|
1313
|
-
|
|
1562
|
+
let r = t, i = { [y]: "" };
|
|
1563
|
+
function a(e) {
|
|
1564
|
+
e.preventDefault(), e.stopImmediatePropagation();
|
|
1565
|
+
}
|
|
1566
|
+
let o = (e, { attrs: t, slots: n }) => {
|
|
1567
|
+
let { disabled: r, ...i } = t, o = r != null && r !== !1;
|
|
1568
|
+
return te("button", {
|
|
1569
|
+
...i,
|
|
1570
|
+
type: i.type ?? "button",
|
|
1571
|
+
...o ? {
|
|
1572
|
+
"aria-disabled": "true",
|
|
1573
|
+
onClickCapture: a
|
|
1574
|
+
} : {}
|
|
1575
|
+
}, n.default?.());
|
|
1576
|
+
};
|
|
1577
|
+
o.inheritAttrs = !1;
|
|
1578
|
+
let s = A(() => e("dock-trigger", r.for === "select" && "dock-select-trigger", r.for !== "select" && "dock-dropdown-trigger", r.class));
|
|
1579
|
+
return (e, t) => r.for === "select" ? Q((W(), j(J(pe), R({ key: 0 }, {
|
|
1580
|
+
...e.$attrs,
|
|
1581
|
+
...i
|
|
1582
|
+
}, {
|
|
1583
|
+
"as-child": "",
|
|
1584
|
+
class: s.value
|
|
1585
|
+
}), {
|
|
1586
|
+
default: Z(() => [F(o, null, {
|
|
1587
|
+
default: Z(() => [q(e.$slots, "default"), F(J(fe), { "as-child": "" }, {
|
|
1588
|
+
default: Z(() => [q(e.$slots, "icon", {}, () => [F(J(me), {
|
|
1589
|
+
class: "dock-select-trigger__chevron",
|
|
1590
|
+
"aria-hidden": "true"
|
|
1591
|
+
})])]),
|
|
1592
|
+
_: 3
|
|
1593
|
+
})]),
|
|
1314
1594
|
_: 3
|
|
1315
1595
|
})]),
|
|
1316
1596
|
_: 3
|
|
1317
|
-
}, 16, ["class"])), [[
|
|
1597
|
+
}, 16, ["class"])), [[J(n)]]) : r.for === "dropdown" ? Q((W(), j(w, R({ key: 1 }, {
|
|
1598
|
+
...e.$attrs,
|
|
1599
|
+
...i
|
|
1600
|
+
}, {
|
|
1601
|
+
"as-child": "",
|
|
1318
1602
|
action: "pointerdown",
|
|
1319
|
-
class:
|
|
1603
|
+
class: s.value
|
|
1320
1604
|
}), {
|
|
1321
|
-
default:
|
|
1605
|
+
default: Z(() => [F(o, null, {
|
|
1606
|
+
default: Z(() => [q(e.$slots, "default")]),
|
|
1607
|
+
_: 3
|
|
1608
|
+
})]),
|
|
1322
1609
|
_: 3
|
|
1323
|
-
}, 16, ["class"])), [[
|
|
1324
|
-
|
|
1610
|
+
}, 16, ["class"])), [[J(n)]]) : Q((W(), j(J(ue), R({ key: 2 }, {
|
|
1611
|
+
...e.$attrs,
|
|
1612
|
+
...i
|
|
1613
|
+
}, {
|
|
1614
|
+
"as-child": "",
|
|
1615
|
+
class: s.value
|
|
1616
|
+
}), {
|
|
1617
|
+
default: Z(() => [F(o, null, {
|
|
1618
|
+
default: Z(() => [q(e.$slots, "default")]),
|
|
1619
|
+
_: 3
|
|
1620
|
+
})]),
|
|
1325
1621
|
_: 3
|
|
1326
|
-
}, 16, ["class"])), [[
|
|
1622
|
+
}, 16, ["class"])), [[J(n)]]);
|
|
1327
1623
|
}
|
|
1328
|
-
}),
|
|
1624
|
+
}), Mt = /* @__PURE__ */ I({
|
|
1329
1625
|
__name: "DockBackgroundToggle",
|
|
1330
1626
|
props: {
|
|
1331
1627
|
paused: {
|
|
@@ -1341,18 +1637,18 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1341
1637
|
function a() {
|
|
1342
1638
|
r("update:paused", !n.paused);
|
|
1343
1639
|
}
|
|
1344
|
-
return (t, n) => (
|
|
1640
|
+
return (t, n) => (W(), j(At, {
|
|
1345
1641
|
type: "button",
|
|
1346
1642
|
active: e.paused,
|
|
1347
1643
|
"aria-pressed": e.paused,
|
|
1348
1644
|
"aria-label": i.value,
|
|
1349
1645
|
onClick: a
|
|
1350
1646
|
}, {
|
|
1351
|
-
default:
|
|
1647
|
+
default: Z(() => [e.paused ? (W(), j(J(ge), {
|
|
1352
1648
|
key: 0,
|
|
1353
1649
|
size: 18,
|
|
1354
1650
|
"aria-hidden": "true"
|
|
1355
|
-
})) : (
|
|
1651
|
+
})) : (W(), j(J(he), {
|
|
1356
1652
|
key: 1,
|
|
1357
1653
|
size: 18,
|
|
1358
1654
|
"aria-hidden": "true"
|
|
@@ -1364,30 +1660,30 @@ var lt = ot.use, ut = /* @__PURE__ */ I({
|
|
|
1364
1660
|
"aria-label"
|
|
1365
1661
|
]));
|
|
1366
1662
|
}
|
|
1367
|
-
}),
|
|
1663
|
+
}), Nt = [
|
|
1368
1664
|
"data-orientation",
|
|
1369
1665
|
"data-dock-hairline",
|
|
1370
1666
|
"aria-orientation"
|
|
1371
|
-
],
|
|
1667
|
+
], Pt = /* @__PURE__ */ I({
|
|
1372
1668
|
__name: "DockSeparator",
|
|
1373
1669
|
props: { anchor: {
|
|
1374
1670
|
type: Boolean,
|
|
1375
1671
|
default: !1
|
|
1376
1672
|
} },
|
|
1377
1673
|
setup(e) {
|
|
1378
|
-
let t =
|
|
1379
|
-
return (t, n) => (
|
|
1674
|
+
let t = v(), n = A(() => t?.orientation.value ?? "horizontal"), r = A(() => n.value), i = A(() => n.value === "vertical" ? "horizontal" : "vertical");
|
|
1675
|
+
return (t, n) => (W(), N("div", {
|
|
1380
1676
|
class: B(["dock-separator", { "dock-hairline": e.anchor }]),
|
|
1381
1677
|
role: "separator",
|
|
1382
1678
|
"data-orientation": r.value,
|
|
1383
1679
|
"data-dock-hairline": e.anchor || void 0,
|
|
1384
1680
|
"aria-orientation": i.value
|
|
1385
|
-
}, null, 10,
|
|
1681
|
+
}, null, 10, Nt));
|
|
1386
1682
|
}
|
|
1387
1683
|
});
|
|
1388
1684
|
//#endregion
|
|
1389
1685
|
//#region src/composables/search/match.ts
|
|
1390
|
-
function
|
|
1686
|
+
function Ft(e, t) {
|
|
1391
1687
|
let n = e.length, r = t.length;
|
|
1392
1688
|
if (n === 0) return {
|
|
1393
1689
|
score: 0,
|
|
@@ -1411,11 +1707,11 @@ function Tt(e, t) {
|
|
|
1411
1707
|
matches: i
|
|
1412
1708
|
});
|
|
1413
1709
|
}
|
|
1414
|
-
function
|
|
1710
|
+
function It(e, t) {
|
|
1415
1711
|
if (!t) return null;
|
|
1416
1712
|
let n = 0, r = [];
|
|
1417
1713
|
for (let i of e) {
|
|
1418
|
-
let e =
|
|
1714
|
+
let e = Ft(i, t);
|
|
1419
1715
|
if (!e) return null;
|
|
1420
1716
|
n += e.score;
|
|
1421
1717
|
for (let t of e.matches) r.push(t);
|
|
@@ -1425,7 +1721,7 @@ function Et(e, t) {
|
|
|
1425
1721
|
matches: r
|
|
1426
1722
|
};
|
|
1427
1723
|
}
|
|
1428
|
-
function
|
|
1724
|
+
function Lt(e, t) {
|
|
1429
1725
|
let n = null, r = [], i = [
|
|
1430
1726
|
[t._lc.label, 12],
|
|
1431
1727
|
[t._lc.type, 10],
|
|
@@ -1433,7 +1729,7 @@ function Dt(e, t) {
|
|
|
1433
1729
|
];
|
|
1434
1730
|
for (let [a, o] of i) {
|
|
1435
1731
|
if (!a) continue;
|
|
1436
|
-
let i =
|
|
1732
|
+
let i = It(e, a);
|
|
1437
1733
|
if (!i) continue;
|
|
1438
1734
|
let s = i.score * o;
|
|
1439
1735
|
(n === null || s > n) && (n = s, r = a === t._lc.label ? i.matches : []);
|
|
@@ -1443,7 +1739,7 @@ function Dt(e, t) {
|
|
|
1443
1739
|
matches: r
|
|
1444
1740
|
};
|
|
1445
1741
|
}
|
|
1446
|
-
function
|
|
1742
|
+
function Rt(e) {
|
|
1447
1743
|
return e.map((e) => ({
|
|
1448
1744
|
item: e,
|
|
1449
1745
|
_lc: {
|
|
@@ -1453,15 +1749,15 @@ function Ot(e) {
|
|
|
1453
1749
|
}
|
|
1454
1750
|
}));
|
|
1455
1751
|
}
|
|
1456
|
-
var
|
|
1457
|
-
function
|
|
1458
|
-
let t =
|
|
1459
|
-
return t || (t = /* @__PURE__ */ new Map(),
|
|
1752
|
+
var zt = /* @__PURE__ */ new WeakMap();
|
|
1753
|
+
function Bt(e) {
|
|
1754
|
+
let t = zt.get(e);
|
|
1755
|
+
return t || (t = /* @__PURE__ */ new Map(), zt.set(e, t)), t;
|
|
1460
1756
|
}
|
|
1461
|
-
function
|
|
1757
|
+
function Vt(e, t, n = 30) {
|
|
1462
1758
|
let r = t.toLowerCase().trim();
|
|
1463
1759
|
if (!r) return [];
|
|
1464
|
-
let i =
|
|
1760
|
+
let i = Bt(e), a = i.get(r);
|
|
1465
1761
|
if (a) return a.slice(0, n);
|
|
1466
1762
|
i.size > 200 && i.clear();
|
|
1467
1763
|
let o = r.split(/\s+/).filter(Boolean);
|
|
@@ -1480,7 +1776,7 @@ function jt(e, t, n = 30) {
|
|
|
1480
1776
|
}
|
|
1481
1777
|
let c = [];
|
|
1482
1778
|
for (let e of s) {
|
|
1483
|
-
let t =
|
|
1779
|
+
let t = Lt(o, e);
|
|
1484
1780
|
t && c.push({
|
|
1485
1781
|
item: e.item,
|
|
1486
1782
|
score: t.score,
|
|
@@ -1489,21 +1785,21 @@ function jt(e, t, n = 30) {
|
|
|
1489
1785
|
}
|
|
1490
1786
|
return c.sort((e, t) => t.score - e.score), i.set(r, c), c.slice(0, n);
|
|
1491
1787
|
}
|
|
1492
|
-
function
|
|
1788
|
+
function Ht(e) {
|
|
1493
1789
|
if (e) {
|
|
1494
|
-
|
|
1790
|
+
zt.delete(e);
|
|
1495
1791
|
return;
|
|
1496
1792
|
}
|
|
1497
|
-
|
|
1793
|
+
zt = /* @__PURE__ */ new WeakMap();
|
|
1498
1794
|
}
|
|
1499
1795
|
//#endregion
|
|
1500
1796
|
//#region src/composables/search/useFuzzySearch.ts
|
|
1501
|
-
function
|
|
1502
|
-
let t = typeof e.items == "function" ? e.items : () => e.items, n = e.debounceMs ?? 120, r = e.maxResults ?? 30, i =
|
|
1797
|
+
function Ut(e) {
|
|
1798
|
+
let t = typeof e.items == "function" ? e.items : () => e.items, n = e.debounceMs ?? 120, r = e.maxResults ?? 30, i = K(""), a = K(!1), o = K(!1), s = K(0), c = K(""), l = A(() => t()), u = A(() => Rt(l.value)), d;
|
|
1503
1799
|
function f(e = d) {
|
|
1504
1800
|
e !== void 0 && (clearTimeout(e), d === e && (d = void 0));
|
|
1505
1801
|
}
|
|
1506
|
-
|
|
1802
|
+
X(i, (e, t, r) => {
|
|
1507
1803
|
if (f(), !e || n <= 0) {
|
|
1508
1804
|
c.value = e;
|
|
1509
1805
|
return;
|
|
@@ -1512,18 +1808,18 @@ function Nt(e) {
|
|
|
1512
1808
|
d === i && (c.value = e, d = void 0);
|
|
1513
1809
|
}, n);
|
|
1514
1810
|
d = i, r(() => f(i));
|
|
1515
|
-
}),
|
|
1811
|
+
}), X(l, () => {
|
|
1516
1812
|
f(), c.value = i.value, s.value = 0;
|
|
1517
1813
|
}, { deep: !0 });
|
|
1518
|
-
let p = A(() =>
|
|
1519
|
-
|
|
1814
|
+
let p = A(() => Vt(u.value, c.value, r));
|
|
1815
|
+
X(p, () => {
|
|
1520
1816
|
s.value = 0;
|
|
1521
1817
|
});
|
|
1522
1818
|
function m(t) {
|
|
1523
1819
|
e.onSelect?.(t), h();
|
|
1524
1820
|
}
|
|
1525
1821
|
function h() {
|
|
1526
|
-
a.value = !1, o.value = !1, f(), i.value = "", c.value = "", s.value = 0,
|
|
1822
|
+
a.value = !1, o.value = !1, f(), i.value = "", c.value = "", s.value = 0, Ht(u.value);
|
|
1527
1823
|
}
|
|
1528
1824
|
function g() {
|
|
1529
1825
|
a.value = !0;
|
|
@@ -1547,8 +1843,8 @@ function Nt(e) {
|
|
|
1547
1843
|
break;
|
|
1548
1844
|
}
|
|
1549
1845
|
}
|
|
1550
|
-
return
|
|
1551
|
-
f(),
|
|
1846
|
+
return U(() => {
|
|
1847
|
+
f(), Ht(u.value);
|
|
1552
1848
|
}, !0), {
|
|
1553
1849
|
query: i,
|
|
1554
1850
|
results: p,
|
|
@@ -1564,13 +1860,13 @@ function Nt(e) {
|
|
|
1564
1860
|
}
|
|
1565
1861
|
//#endregion
|
|
1566
1862
|
//#region src/components/dock/composables/useDockSearch.ts
|
|
1567
|
-
function
|
|
1568
|
-
let { dockState: t } = e, n = e.debounceMs ?? 120, r = e.maxResults ?? 30, i =
|
|
1863
|
+
function Wt(e) {
|
|
1864
|
+
let { dockState: t } = e, n = e.debounceMs ?? 120, r = e.maxResults ?? 30, i = K([]), a = null, o = e.items ? e.items : () => i.value;
|
|
1569
1865
|
function s(t) {
|
|
1570
1866
|
let n = t.item.id;
|
|
1571
1867
|
e.ensureTargetWindow?.(n), e.scrollTo?.(n), e.onResultSelect?.(t);
|
|
1572
1868
|
}
|
|
1573
|
-
let c =
|
|
1869
|
+
let c = Ut({
|
|
1574
1870
|
items: o,
|
|
1575
1871
|
debounceMs: n,
|
|
1576
1872
|
maxResults: r,
|
|
@@ -1578,7 +1874,7 @@ function Pt(e) {
|
|
|
1578
1874
|
});
|
|
1579
1875
|
if (e.onSearch) {
|
|
1580
1876
|
let t = e.onSearch;
|
|
1581
|
-
|
|
1877
|
+
X(() => c.query.value, (e) => {
|
|
1582
1878
|
if (a?.abort(), !e) {
|
|
1583
1879
|
i.value = [];
|
|
1584
1880
|
return;
|
|
@@ -1603,28 +1899,28 @@ function Pt(e) {
|
|
|
1603
1899
|
let e = l.value;
|
|
1604
1900
|
e && (c.query.value = c.query.value + e);
|
|
1605
1901
|
}
|
|
1606
|
-
let d =
|
|
1902
|
+
let d = h(() => t), f = d.isHeld;
|
|
1607
1903
|
function p() {
|
|
1608
1904
|
f.value || (t.expand(), d.acquire(), c.open());
|
|
1609
1905
|
}
|
|
1610
|
-
function
|
|
1906
|
+
function m() {
|
|
1611
1907
|
f.value && (c.close(), d.release());
|
|
1612
1908
|
}
|
|
1613
1909
|
let g = null;
|
|
1614
|
-
return e.collapseOnScroll && e.scrollContainer && (g =
|
|
1910
|
+
return e.collapseOnScroll && e.scrollContainer && (g = k(e.scrollContainer, {
|
|
1615
1911
|
collapseOnScroll: !0,
|
|
1616
1912
|
chromeRef: e.chromeRef
|
|
1617
|
-
})),
|
|
1913
|
+
})), U(() => {
|
|
1618
1914
|
a?.abort(), a = null;
|
|
1619
1915
|
}), {
|
|
1620
1916
|
fuzzy: c,
|
|
1621
1917
|
autocompleteText: l,
|
|
1622
1918
|
scrollChrome: g,
|
|
1623
1919
|
armSearch: p,
|
|
1624
|
-
disarmSearch:
|
|
1920
|
+
disarmSearch: m,
|
|
1625
1921
|
acceptAutocomplete: u,
|
|
1626
1922
|
isSearchArmed: f
|
|
1627
1923
|
};
|
|
1628
1924
|
}
|
|
1629
1925
|
//#endregion
|
|
1630
|
-
export {
|
|
1926
|
+
export { _ as DOCK_CONTEXT_KEY, Mt as DockBackgroundToggle, At as DockControl, bt as DockCrossfade, kt as DockLayer, Et as DockLayerGroup, Pt as DockSeparator, jt as DockTrigger, dt as GlassDock, l as provideDockContext, g as useDockContext, D as useDockCtaReceive, Wt as useDockSearch, v as useOptionalDockContext };
|