@floegence/floe-webapp-core 0.78.1 → 0.78.2
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.
|
@@ -1,21 +1,21 @@
|
|
|
1
|
-
import { createComponent as
|
|
2
|
-
import { createUniqueId as
|
|
3
|
-
import { useOverlayMask as
|
|
4
|
-
import { createFloatingPresence as
|
|
5
|
-
import { cn as
|
|
6
|
-
import { deferAfterPaint as
|
|
7
|
-
import { X as
|
|
8
|
-
var
|
|
9
|
-
function
|
|
10
|
-
const
|
|
1
|
+
import { createComponent as g, use as T, setAttribute as a, insert as f, effect as S, memo as j, className as M, template as h, delegateEvents as q } from "solid-js/web";
|
|
2
|
+
import { createUniqueId as A, createEffect as _, onCleanup as E, createMemo as F, Show as B, untrack as K } from "solid-js";
|
|
3
|
+
import { useOverlayMask as O } from "../../hooks/useOverlayMask.js";
|
|
4
|
+
import { createFloatingPresence as z } from "../ui/floatingPresence.js";
|
|
5
|
+
import { cn as D } from "../../utils/cn.js";
|
|
6
|
+
import { deferAfterPaint as L } from "../../utils/defer.js";
|
|
7
|
+
import { X as R } from "../icons/index.js";
|
|
8
|
+
var U = /* @__PURE__ */ h('<header class="flex shrink-0 items-center gap-2 border-b px-4 py-2"><h2 class="min-w-0 flex-1 text-base font-semibold"></h2><button type=button data-floe-autofocus class="flex h-11 w-11 shrink-0 items-center justify-center rounded-md hover:bg-muted focus-visible:outline-none focus-visible:ring-2 focus-visible:ring-ring">'), W = /* @__PURE__ */ h('<div data-floe-mobile-navigation-overlay class="absolute inset-0 z-50 overflow-hidden p-2"><div class="absolute inset-0 floe-floating-presence floe-floating-backdrop floe-bottom-drawer-backdrop"data-floe-mobile-navigation-backdrop></div><div class="relative pointer-events-none flex h-full min-h-0 items-end justify-center"><div role=dialog tabindex=-1 data-floe-mobile-navigation-panel data-floe-surface=floating data-floe-surface-portal-layer=true style="max-height:min(680px, 86%);border-radius:24px"><div>'), X = /* @__PURE__ */ h("<h2 class=sr-only>");
|
|
9
|
+
function p(t) {
|
|
10
|
+
const v = `mobile-navigation-${A()}`, r = z({
|
|
11
11
|
open: () => t.open,
|
|
12
12
|
exitDurationMs: 180
|
|
13
13
|
});
|
|
14
14
|
let i, d = null;
|
|
15
|
-
const
|
|
15
|
+
const m = () => {
|
|
16
16
|
d = t.trigger ?? null, t.onOpenChange(!1);
|
|
17
17
|
};
|
|
18
|
-
|
|
18
|
+
_(() => {
|
|
19
19
|
const n = r.mounted();
|
|
20
20
|
if (t.onPresenceChange?.(n), !n && d) {
|
|
21
21
|
const l = d;
|
|
@@ -23,21 +23,28 @@ function Z(t) {
|
|
|
23
23
|
preventScroll: !0
|
|
24
24
|
});
|
|
25
25
|
}
|
|
26
|
-
}),
|
|
27
|
-
|
|
28
|
-
|
|
29
|
-
|
|
30
|
-
|
|
31
|
-
|
|
26
|
+
}), E(() => t.onPresenceChange?.(!1));
|
|
27
|
+
const I = F(() => t.open ? t.id : null);
|
|
28
|
+
_(() => {
|
|
29
|
+
const n = I();
|
|
30
|
+
if (n === null) return;
|
|
31
|
+
d = null;
|
|
32
|
+
let l = !0;
|
|
33
|
+
E(() => {
|
|
34
|
+
l = !1;
|
|
35
|
+
}), L(() => K(() => {
|
|
36
|
+
if (!l || !t.open || t.id !== n || !i?.isConnected) return;
|
|
37
|
+
const u = i.ownerDocument.activeElement;
|
|
38
|
+
u && i.contains(u) || (i.querySelector("[data-floe-autofocus]") ?? i).focus({
|
|
32
39
|
preventScroll: !0
|
|
33
40
|
});
|
|
34
|
-
}))
|
|
35
|
-
}),
|
|
41
|
+
}));
|
|
42
|
+
}), O({
|
|
36
43
|
open: r.mounted,
|
|
37
44
|
root: () => i,
|
|
38
45
|
focusRoots: () => [i, t.navigation()].filter((n) => !!n),
|
|
39
46
|
containsTarget: (n) => n instanceof Node && !!(i?.contains(n) || t.navigation()?.contains(n)),
|
|
40
|
-
onClose:
|
|
47
|
+
onClose: m,
|
|
41
48
|
lockBodyScroll: !1,
|
|
42
49
|
trapFocus: !0,
|
|
43
50
|
blockWheel: "outside",
|
|
@@ -46,36 +53,36 @@ function Z(t) {
|
|
|
46
53
|
autoFocus: !1,
|
|
47
54
|
restoreFocus: !1
|
|
48
55
|
});
|
|
49
|
-
const
|
|
50
|
-
return
|
|
56
|
+
const N = F(() => t.children);
|
|
57
|
+
return g(B, {
|
|
51
58
|
get when() {
|
|
52
59
|
return r.mounted();
|
|
53
60
|
},
|
|
54
61
|
get children() {
|
|
55
|
-
var n =
|
|
62
|
+
var n = W(), l = n.firstChild, u = l.nextSibling, o = u.firstChild, b = o.firstChild;
|
|
56
63
|
l.$$click = () => {
|
|
57
|
-
t.open &&
|
|
64
|
+
t.open && m();
|
|
58
65
|
}, o.$$keydown = (e) => t.onKeyDown?.(e);
|
|
59
|
-
var
|
|
60
|
-
return typeof
|
|
66
|
+
var x = i;
|
|
67
|
+
return typeof x == "function" ? T(x, o) : i = o, a(o, "aria-labelledby", v), f(o, g(B, {
|
|
61
68
|
get when() {
|
|
62
69
|
return t.header === void 0;
|
|
63
70
|
},
|
|
64
71
|
get fallback() {
|
|
65
72
|
return [(() => {
|
|
66
|
-
var e =
|
|
67
|
-
return a(e, "id",
|
|
68
|
-
})(),
|
|
73
|
+
var e = X();
|
|
74
|
+
return a(e, "id", v), f(e, () => t.title), e;
|
|
75
|
+
})(), j(() => t.header)];
|
|
69
76
|
},
|
|
70
77
|
get children() {
|
|
71
|
-
var e =
|
|
72
|
-
return a(s, "id",
|
|
78
|
+
var e = U(), s = e.firstChild, c = s.nextSibling;
|
|
79
|
+
return a(s, "id", v), f(s, () => t.title), c.$$click = m, f(c, g(R, {
|
|
73
80
|
class: "h-5 w-5"
|
|
74
81
|
})), S(() => a(c, "aria-label", t.closeLabel ?? "Close")), e;
|
|
75
82
|
}
|
|
76
|
-
}),
|
|
77
|
-
var s = r.state(), c = r.state(),
|
|
78
|
-
return s !== e.e && a(n, "data-floating-presence", e.e = s), c !== e.t && a(l, "data-floating-presence", e.t = c),
|
|
83
|
+
}), b), f(b, N), S((e) => {
|
|
84
|
+
var s = r.state(), c = r.state(), y = t.id, w = r.state(), k = r.exiting(), C = r.exiting() ? "true" : void 0, $ = D("pointer-events-auto relative flex min-h-0 w-full max-w-[640px] flex-col border border-border bg-card text-card-foreground shadow-xl floe-floating-presence floe-bottom-drawer-panel", t.class), P = D("flex min-h-0 flex-col overflow-auto overscroll-contain", t.contentClass);
|
|
85
|
+
return s !== e.e && a(n, "data-floating-presence", e.e = s), c !== e.t && a(l, "data-floating-presence", e.t = c), y !== e.a && a(o, "id", e.a = y), w !== e.o && a(o, "data-floating-presence", e.o = w), k !== e.i && (o.inert = e.i = k), C !== e.n && a(o, "aria-hidden", e.n = C), $ !== e.s && M(o, e.s = $), P !== e.h && M(b, e.h = P), e;
|
|
79
86
|
}, {
|
|
80
87
|
e: void 0,
|
|
81
88
|
t: void 0,
|
|
@@ -89,7 +96,7 @@ function Z(t) {
|
|
|
89
96
|
}
|
|
90
97
|
});
|
|
91
98
|
}
|
|
92
|
-
|
|
99
|
+
q(["click", "keydown"]);
|
|
93
100
|
export {
|
|
94
|
-
|
|
101
|
+
p as MobileNavigationPanel
|
|
95
102
|
};
|