@floegence/floe-webapp-core 0.1.2 → 0.1.5
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.
|
@@ -0,0 +1,25 @@
|
|
|
1
|
+
export interface ResolveMobileTabActiveIdArgs {
|
|
2
|
+
/** Current active tab id from LayoutContext. */
|
|
3
|
+
activeId: string;
|
|
4
|
+
/** Whether the mobile sidebar overlay is currently open. */
|
|
5
|
+
mobileSidebarOpen: boolean;
|
|
6
|
+
/** Whether the active component is marked as fullScreen. */
|
|
7
|
+
activeIsFullScreen: boolean;
|
|
8
|
+
}
|
|
9
|
+
/**
|
|
10
|
+
* On mobile we support two UX modes:
|
|
11
|
+
* - Sidebar overlay mode (default): tabs toggle an overlay that renders the component as sidebar content.
|
|
12
|
+
* - FullScreen navigation mode: tabs switch the main page (no overlay).
|
|
13
|
+
*/
|
|
14
|
+
export declare function resolveMobileTabActiveId(args: ResolveMobileTabActiveIdArgs): string;
|
|
15
|
+
export interface ResolveMobileTabSelectArgs {
|
|
16
|
+
clickedId: string;
|
|
17
|
+
activeId: string;
|
|
18
|
+
mobileSidebarOpen: boolean;
|
|
19
|
+
clickedIsFullScreen: boolean;
|
|
20
|
+
}
|
|
21
|
+
export interface ResolveMobileTabSelectResult {
|
|
22
|
+
nextActiveId: string;
|
|
23
|
+
nextMobileSidebarOpen: boolean;
|
|
24
|
+
}
|
|
25
|
+
export declare function resolveMobileTabSelect(args: ResolveMobileTabSelectArgs): ResolveMobileTabSelectResult;
|
|
@@ -4,8 +4,9 @@ import type { LayoutContextValue } from './LayoutContext';
|
|
|
4
4
|
import type { CommandContextValue } from './CommandContext';
|
|
5
5
|
import type { NotificationContextValue } from './NotificationContext';
|
|
6
6
|
/**
|
|
7
|
-
* Component registration system for pluggable architecture
|
|
8
|
-
*
|
|
7
|
+
* Component registration system for pluggable architecture.
|
|
8
|
+
*
|
|
9
|
+
* Public docs: `docs/component-registry.md`
|
|
9
10
|
*/
|
|
10
11
|
export interface Logger {
|
|
11
12
|
debug: (...args: unknown[]) => void;
|
package/dist/index2.js
CHANGED
|
@@ -1,34 +1,35 @@
|
|
|
1
|
-
import { delegateEvents as z, template as f, insert as a, createComponent as n, Dynamic as
|
|
2
|
-
import { createSignal as
|
|
3
|
-
import { useLayout as
|
|
4
|
-
import { useResolvedFloeConfig as
|
|
1
|
+
import { delegateEvents as z, template as f, insert as a, createComponent as n, Dynamic as w, memo as h, effect as C, className as T, setStyleProperty as O } from "solid-js/web";
|
|
2
|
+
import { createSignal as F, createEffect as p, createMemo as $, For as x, Show as b } from "solid-js";
|
|
3
|
+
import { useLayout as R } from "./index41.js";
|
|
4
|
+
import { useResolvedFloeConfig as H } from "./index39.js";
|
|
5
5
|
import { useMediaQuery as P } from "./index47.js";
|
|
6
|
-
import { cn as
|
|
6
|
+
import { cn as A } from "./index53.js";
|
|
7
7
|
import { useComponentRegistry as W } from "./index44.js";
|
|
8
8
|
import { Sidebar as E } from "./index4.js";
|
|
9
9
|
import { TopBar as Q } from "./index5.js";
|
|
10
10
|
import { BottomBar as D } from "./index6.js";
|
|
11
11
|
import { MobileTabBar as L } from "./index7.js";
|
|
12
12
|
import { ActivityBar as N } from "./index3.js";
|
|
13
|
-
import { ResizeHandle as
|
|
14
|
-
|
|
15
|
-
|
|
16
|
-
|
|
13
|
+
import { ResizeHandle as _ } from "./index8.js";
|
|
14
|
+
import { resolveMobileTabActiveId as j, resolveMobileTabSelect as q } from "./index67.js";
|
|
15
|
+
var y = /* @__PURE__ */ f('<div class="flex items-center gap-2">'), G = /* @__PURE__ */ f('<div class="absolute inset-0 z-40 bg-background/80 backdrop-blur-sm cursor-pointer">'), J = /* @__PURE__ */ f('<div><div class="h-full overflow-auto overscroll-contain">'), K = /* @__PURE__ */ f('<div class="relative shrink-0 border-t border-border bg-terminal-background overflow-hidden">'), U = /* @__PURE__ */ f('<div><div class="flex-1 min-h-0 flex overflow-hidden relative"><div class="flex-1 min-w-0 flex flex-col overflow-hidden"><main class="flex-1 min-h-0 overflow-auto overscroll-contain">');
|
|
16
|
+
function ce(l) {
|
|
17
|
+
const r = R(), M = H(), c = P(M.config.layout.mobileQuery), [S, g] = F(!1), s = (() => {
|
|
17
18
|
try {
|
|
18
19
|
return W();
|
|
19
20
|
} catch {
|
|
20
21
|
return null;
|
|
21
22
|
}
|
|
22
23
|
})();
|
|
23
|
-
|
|
24
|
-
const e =
|
|
24
|
+
p(() => {
|
|
25
|
+
const e = c();
|
|
25
26
|
r.isMobile() !== e && r.setIsMobile(e);
|
|
26
|
-
}),
|
|
27
|
-
|
|
27
|
+
}), p(() => {
|
|
28
|
+
c() || g(!1);
|
|
28
29
|
});
|
|
29
|
-
const u = $(() =>
|
|
30
|
+
const u = $(() => l.activityItems ? l.activityItems : s ? s.sidebarItems().filter((e) => !!e.icon).filter((e) => {
|
|
30
31
|
var t;
|
|
31
|
-
return !(
|
|
32
|
+
return !(c() && ((t = e.sidebar) != null && t.hiddenOnMobile));
|
|
32
33
|
}).map((e) => {
|
|
33
34
|
var t;
|
|
34
35
|
return {
|
|
@@ -37,71 +38,85 @@ function ae(o) {
|
|
|
37
38
|
label: e.name,
|
|
38
39
|
badge: (t = e.sidebar) == null ? void 0 : t.badge
|
|
39
40
|
};
|
|
40
|
-
}) : []),
|
|
41
|
-
if (
|
|
42
|
-
if (!
|
|
43
|
-
const t =
|
|
41
|
+
}) : []), I = (e) => {
|
|
42
|
+
if (l.sidebarContent) return l.sidebarContent(e);
|
|
43
|
+
if (!s) return;
|
|
44
|
+
const t = s.getComponent(e);
|
|
44
45
|
if (t != null && t.sidebar && !t.sidebar.fullScreen)
|
|
45
|
-
return n(
|
|
46
|
+
return n(w, {
|
|
46
47
|
get component() {
|
|
47
48
|
return t.component;
|
|
48
49
|
}
|
|
49
50
|
});
|
|
50
|
-
},
|
|
51
|
+
}, v = $(() => {
|
|
51
52
|
var t;
|
|
52
|
-
if (!
|
|
53
|
-
const e =
|
|
53
|
+
if (!s) return !1;
|
|
54
|
+
const e = s.getComponent(r.sidebarActiveTab());
|
|
54
55
|
return ((t = e == null ? void 0 : e.sidebar) == null ? void 0 : t.fullScreen) ?? !1;
|
|
55
|
-
})
|
|
56
|
-
|
|
57
|
-
|
|
58
|
-
|
|
56
|
+
});
|
|
57
|
+
p(() => {
|
|
58
|
+
c() && v() && g(!1);
|
|
59
|
+
});
|
|
60
|
+
const B = $(() => {
|
|
61
|
+
if (l.bottomBarItems) return l.bottomBarItems;
|
|
62
|
+
if (!s) return;
|
|
63
|
+
const e = [...s.statusBarItems()].sort((o, i) => (o.order ?? 100) - (i.order ?? 100)), t = e.filter((o) => o.position === "left"), d = e.filter((o) => o.position === "right");
|
|
59
64
|
return [(() => {
|
|
60
|
-
var
|
|
61
|
-
return a(
|
|
65
|
+
var o = y();
|
|
66
|
+
return a(o, n(x, {
|
|
62
67
|
each: t,
|
|
63
|
-
children: (i) => n(
|
|
68
|
+
children: (i) => n(w, {
|
|
64
69
|
get component() {
|
|
65
70
|
return i.component;
|
|
66
71
|
}
|
|
67
72
|
})
|
|
68
|
-
})),
|
|
73
|
+
})), o;
|
|
69
74
|
})(), (() => {
|
|
70
|
-
var
|
|
71
|
-
return a(
|
|
72
|
-
each:
|
|
73
|
-
children: (i) => n(
|
|
75
|
+
var o = y();
|
|
76
|
+
return a(o, n(x, {
|
|
77
|
+
each: d,
|
|
78
|
+
children: (i) => n(w, {
|
|
74
79
|
get component() {
|
|
75
80
|
return i.component;
|
|
76
81
|
}
|
|
77
82
|
})
|
|
78
|
-
})),
|
|
83
|
+
})), o;
|
|
79
84
|
})()];
|
|
80
85
|
});
|
|
81
|
-
|
|
86
|
+
p(() => {
|
|
82
87
|
const e = u();
|
|
83
88
|
if (!e.length) return;
|
|
84
89
|
const t = r.sidebarActiveTab();
|
|
85
|
-
(!t || !e.some((
|
|
90
|
+
(!t || !e.some((d) => d.id === t)) && r.setSidebarActiveTab(e[0].id);
|
|
86
91
|
});
|
|
87
92
|
const k = (e) => {
|
|
88
|
-
|
|
93
|
+
var i, m;
|
|
94
|
+
const t = ((m = (i = s == null ? void 0 : s.getComponent(e)) == null ? void 0 : i.sidebar) == null ? void 0 : m.fullScreen) ?? !1, {
|
|
95
|
+
nextActiveId: d,
|
|
96
|
+
nextMobileSidebarOpen: o
|
|
97
|
+
} = q({
|
|
98
|
+
clickedId: e,
|
|
99
|
+
activeId: r.sidebarActiveTab(),
|
|
100
|
+
mobileSidebarOpen: S(),
|
|
101
|
+
clickedIsFullScreen: t
|
|
102
|
+
});
|
|
103
|
+
r.sidebarActiveTab() !== d && r.setSidebarActiveTab(d), g(o);
|
|
89
104
|
};
|
|
90
105
|
return (() => {
|
|
91
|
-
var e =
|
|
106
|
+
var e = U(), t = e.firstChild, d = t.firstChild, o = d.firstChild;
|
|
92
107
|
return a(e, n(Q, {
|
|
93
108
|
get logo() {
|
|
94
|
-
return
|
|
109
|
+
return l.logo;
|
|
95
110
|
},
|
|
96
111
|
get actions() {
|
|
97
|
-
return
|
|
112
|
+
return l.topBarActions;
|
|
98
113
|
}
|
|
99
|
-
}), t), a(t, n(
|
|
114
|
+
}), t), a(t, n(b, {
|
|
100
115
|
get when() {
|
|
101
|
-
return !
|
|
116
|
+
return !c();
|
|
102
117
|
},
|
|
103
118
|
get children() {
|
|
104
|
-
return [n(
|
|
119
|
+
return [n(b, {
|
|
105
120
|
get when() {
|
|
106
121
|
return u().length > 0;
|
|
107
122
|
},
|
|
@@ -111,7 +126,7 @@ function ae(o) {
|
|
|
111
126
|
return u();
|
|
112
127
|
},
|
|
113
128
|
get bottomItems() {
|
|
114
|
-
return
|
|
129
|
+
return l.activityBottomItems;
|
|
115
130
|
},
|
|
116
131
|
get activeId() {
|
|
117
132
|
return r.sidebarActiveTab();
|
|
@@ -127,9 +142,9 @@ function ae(o) {
|
|
|
127
142
|
}
|
|
128
143
|
});
|
|
129
144
|
}
|
|
130
|
-
}), n(
|
|
145
|
+
}), n(b, {
|
|
131
146
|
get when() {
|
|
132
|
-
return
|
|
147
|
+
return h(() => !r.sidebarCollapsed())() && !v();
|
|
133
148
|
},
|
|
134
149
|
get children() {
|
|
135
150
|
return n(E, {
|
|
@@ -137,56 +152,56 @@ function ae(o) {
|
|
|
137
152
|
return r.sidebarWidth();
|
|
138
153
|
},
|
|
139
154
|
get resizer() {
|
|
140
|
-
return n(
|
|
155
|
+
return n(_, {
|
|
141
156
|
direction: "horizontal",
|
|
142
157
|
onResize: (i) => r.setSidebarWidth(r.sidebarWidth() + i)
|
|
143
158
|
});
|
|
144
159
|
},
|
|
145
160
|
get children() {
|
|
146
|
-
return
|
|
161
|
+
return I(r.sidebarActiveTab());
|
|
147
162
|
}
|
|
148
163
|
});
|
|
149
164
|
}
|
|
150
165
|
})];
|
|
151
166
|
}
|
|
152
|
-
}),
|
|
167
|
+
}), d), a(t, n(b, {
|
|
153
168
|
get when() {
|
|
154
|
-
return
|
|
169
|
+
return h(() => !!(c() && S()))() && !v();
|
|
155
170
|
},
|
|
156
171
|
get children() {
|
|
157
172
|
return [(() => {
|
|
158
|
-
var i =
|
|
173
|
+
var i = G();
|
|
159
174
|
return i.$$click = () => g(!1), i;
|
|
160
175
|
})(), (() => {
|
|
161
|
-
var i =
|
|
162
|
-
return a(
|
|
176
|
+
var i = J(), m = i.firstChild;
|
|
177
|
+
return a(m, () => I(r.sidebarActiveTab())), C(() => T(i, A("absolute left-0 top-0 bottom-0 z-50 w-80 max-w-[85vw]", "bg-sidebar border-r border-sidebar-border", "shadow-xl", "animate-in slide-in-from-left duration-200"))), i;
|
|
163
178
|
})()];
|
|
164
179
|
}
|
|
165
|
-
}),
|
|
180
|
+
}), d), a(o, () => l.children), a(d, n(b, {
|
|
166
181
|
get when() {
|
|
167
|
-
return
|
|
182
|
+
return h(() => !!(!c() && r.terminalOpened()))() && l.terminalPanel;
|
|
168
183
|
},
|
|
169
184
|
get children() {
|
|
170
|
-
var i =
|
|
171
|
-
return a(i, n(
|
|
185
|
+
var i = K();
|
|
186
|
+
return a(i, n(_, {
|
|
172
187
|
direction: "vertical",
|
|
173
|
-
onResize: (
|
|
174
|
-
}), null), a(i, () =>
|
|
188
|
+
onResize: (m) => r.setTerminalHeight(r.terminalHeight() - m)
|
|
189
|
+
}), null), a(i, () => l.terminalPanel, null), C((m) => O(i, "height", `${r.terminalHeight()}px`)), i;
|
|
175
190
|
}
|
|
176
|
-
}), null), a(e, n(
|
|
191
|
+
}), null), a(e, n(b, {
|
|
177
192
|
get when() {
|
|
178
|
-
return !
|
|
193
|
+
return !c();
|
|
179
194
|
},
|
|
180
195
|
get children() {
|
|
181
196
|
return n(D, {
|
|
182
197
|
get children() {
|
|
183
|
-
return
|
|
198
|
+
return B();
|
|
184
199
|
}
|
|
185
200
|
});
|
|
186
201
|
}
|
|
187
|
-
}), null), a(e, n(
|
|
202
|
+
}), null), a(e, n(b, {
|
|
188
203
|
get when() {
|
|
189
|
-
return
|
|
204
|
+
return h(() => !!c())() && u().length > 0;
|
|
190
205
|
},
|
|
191
206
|
get children() {
|
|
192
207
|
return n(L, {
|
|
@@ -194,22 +209,26 @@ function ae(o) {
|
|
|
194
209
|
return u();
|
|
195
210
|
},
|
|
196
211
|
get activeId() {
|
|
197
|
-
return
|
|
212
|
+
return j({
|
|
213
|
+
activeId: r.sidebarActiveTab(),
|
|
214
|
+
mobileSidebarOpen: S(),
|
|
215
|
+
activeIsFullScreen: v()
|
|
216
|
+
});
|
|
198
217
|
},
|
|
199
218
|
onSelect: k
|
|
200
219
|
});
|
|
201
220
|
}
|
|
202
|
-
}), null),
|
|
221
|
+
}), null), C(() => T(e, A(
|
|
203
222
|
// Use dvh when supported to avoid mobile browser UI causing layout jumps.
|
|
204
223
|
"h-screen h-[100dvh] w-full flex flex-col overflow-hidden",
|
|
205
224
|
"bg-background text-foreground",
|
|
206
225
|
// Prevent overscroll on the shell container
|
|
207
226
|
"overscroll-none",
|
|
208
|
-
|
|
227
|
+
l.class
|
|
209
228
|
))), e;
|
|
210
229
|
})();
|
|
211
230
|
}
|
|
212
231
|
z(["click"]);
|
|
213
232
|
export {
|
|
214
|
-
|
|
233
|
+
ce as Shell
|
|
215
234
|
};
|
package/dist/index67.js
ADDED
|
@@ -0,0 +1,10 @@
|
|
|
1
|
+
function i(e) {
|
|
2
|
+
return e.activeIsFullScreen || e.mobileSidebarOpen ? e.activeId : "";
|
|
3
|
+
}
|
|
4
|
+
function t(e) {
|
|
5
|
+
return e.clickedIsFullScreen ? { nextActiveId: e.clickedId, nextMobileSidebarOpen: !1 } : e.clickedId === e.activeId && e.mobileSidebarOpen ? { nextActiveId: e.clickedId, nextMobileSidebarOpen: !1 } : { nextActiveId: e.clickedId, nextMobileSidebarOpen: !0 };
|
|
6
|
+
}
|
|
7
|
+
export {
|
|
8
|
+
i as resolveMobileTabActiveId,
|
|
9
|
+
t as resolveMobileTabSelect
|
|
10
|
+
};
|