@protobase/ui 0.45.7 → 0.45.9
This diff represents the content of publicly available package versions that have been released to one of the supported registries. The information contained in this diff is provided for informational purposes only and reflects changes between package versions as they appear in their respective public registries.
- package/dist/app/app.js +6 -17
- package/dist/app-shell/app-shell.js +2 -1
- package/dist/app-shell/bottom-bar.js +7 -4
- package/dist/app-shell/page-scroll.js +1 -1
- package/dist/app-shell/top-bar.js +6 -3
- package/dist/package.js +1 -1
- package/dist/shell/assets/{app-BF4QAS2n.js → app-CbiI-McH.js} +6 -6
- package/dist/shell/assets/index-Bq-Va32r.css +2 -0
- package/dist/shell/assets/{index-C6y-qez_.js → index-RmCEPvyI.js} +2 -2
- package/dist/shell/assets/{records-map-B8Qo2Ik0.js → records-map-DwGAxzg1.js} +2 -2
- package/dist/shell/assets/{shared-protobase-ui-CGlvWsld.js → shared-protobase-ui-5hTKWhkW.js} +2 -2
- package/dist/shell/index.html +4 -4
- package/dist/shell/protobase.shell.json +1 -1
- package/dist/shell/protobase.sw.js +2 -2
- package/dist/shell-source-maps/assets/app-CbiI-McH.js.map +1 -0
- package/dist/shell-source-maps/assets/{index-C6y-qez_.js.map → index-RmCEPvyI.js.map} +1 -1
- package/dist/shell-source-maps/assets/{records-map-B8Qo2Ik0.js.map → records-map-DwGAxzg1.js.map} +1 -1
- package/dist/shell-source-maps/assets/{shared-protobase-ui-CGlvWsld.js.map → shared-protobase-ui-5hTKWhkW.js.map} +1 -1
- package/package.json +4 -4
- package/dist/shell/assets/index-DGJkc-U0.css +0 -2
- package/dist/shell-source-maps/assets/app-BF4QAS2n.js.map +0 -1
package/dist/app/app.js
CHANGED
|
@@ -210,7 +210,8 @@ const Routes = ({ workspace, sidebarMode, assistant, runtime }) => {
|
|
|
210
210
|
resource: address.resource,
|
|
211
211
|
recordKey: address.key
|
|
212
212
|
}, `${address.resource}/${address.key}`) : /* @__PURE__ */ jsx(ListPage, { address }, navItemId(address.resource, address.list));
|
|
213
|
-
const
|
|
213
|
+
const pluginNotice = admin && pluginsOff.length > 0;
|
|
214
|
+
return /* @__PURE__ */ jsx(AppShell, {
|
|
214
215
|
pageScroll: true,
|
|
215
216
|
sidebarMode: sidebarMode ?? "text-small",
|
|
216
217
|
activeItem: place ?? "",
|
|
@@ -248,6 +249,10 @@ const Routes = ({ workspace, sidebarMode, assistant, runtime }) => {
|
|
|
248
249
|
} : void 0,
|
|
249
250
|
onNavigate: open,
|
|
250
251
|
sidebarNotice: /* @__PURE__ */ jsx(NewVersionBanner, {}),
|
|
252
|
+
banner: (staff || pluginNotice) && /* @__PURE__ */ jsxs(Fragment$1, { children: [staff && /* @__PURE__ */ jsx(StaffBanner, {
|
|
253
|
+
signIn: staff,
|
|
254
|
+
onStop: stopStaffSession
|
|
255
|
+
}), pluginNotice && /* @__PURE__ */ jsx(PluginNotice, { off: pluginsOff })] }),
|
|
251
256
|
search: search.available ? {
|
|
252
257
|
placeholder: search.placeholder,
|
|
253
258
|
text: search.text,
|
|
@@ -274,22 +279,6 @@ const Routes = ({ workspace, sidebarMode, assistant, runtime }) => {
|
|
|
274
279
|
}), assistantPanel] }),
|
|
275
280
|
children: content
|
|
276
281
|
});
|
|
277
|
-
const pluginNotice = admin && pluginsOff.length > 0;
|
|
278
|
-
if (!staff && !pluginNotice) return appShell;
|
|
279
|
-
return /* @__PURE__ */ jsxs("div", {
|
|
280
|
-
className: "flex h-full min-h-0 flex-col",
|
|
281
|
-
children: [
|
|
282
|
-
staff && /* @__PURE__ */ jsx(StaffBanner, {
|
|
283
|
-
signIn: staff,
|
|
284
|
-
onStop: stopStaffSession
|
|
285
|
-
}),
|
|
286
|
-
pluginNotice && /* @__PURE__ */ jsx(PluginNotice, { off: pluginsOff }),
|
|
287
|
-
/* @__PURE__ */ jsx("div", {
|
|
288
|
-
className: "min-h-0 flex-1",
|
|
289
|
-
children: appShell
|
|
290
|
-
})
|
|
291
|
-
]
|
|
292
|
-
});
|
|
293
282
|
};
|
|
294
283
|
const Authenticated = ({ baseUrl, client, sources, workspace, sidebarMode, ui, assistant, runtime }) => {
|
|
295
284
|
const { state, session, markSignedOut } = useAuth();
|
|
@@ -11,7 +11,7 @@ import { useEffect, useRef, useState } from "react";
|
|
|
11
11
|
import { jsx, jsxs } from "react/jsx-runtime";
|
|
12
12
|
//#region src/app-shell/app-shell.tsx
|
|
13
13
|
const drawerId = "app-drawer";
|
|
14
|
-
const AppShell = ({ sidebarMode, activeItem, breadcrumb, user, workspace, appName, appIcon, logo, actions, rightPanel, sidebarNotice, forceExpanded, profileMenuOpen, navGroups, userMenu, bottomBar, onNavigate, onSignOut, signIn, organizations, roles, theme, search, pageScroll: scrollsByDefault = false, className, children }) => {
|
|
14
|
+
const AppShell = ({ sidebarMode, activeItem, breadcrumb, user, workspace, appName, appIcon, logo, actions, rightPanel, sidebarNotice, banner, forceExpanded, profileMenuOpen, navGroups, userMenu, bottomBar, onNavigate, onSignOut, signIn, organizations, roles, theme, search, pageScroll: scrollsByDefault = false, className, children }) => {
|
|
15
15
|
const desktop = useIsDesktop();
|
|
16
16
|
const noticeShown = useSidebarNoticeShown(sidebarMode);
|
|
17
17
|
const [drawerOpen, setDrawerOpen] = useState(false);
|
|
@@ -73,6 +73,7 @@ const AppShell = ({ sidebarMode, activeItem, breadcrumb, user, workspace, appNam
|
|
|
73
73
|
menuControls: drawerId,
|
|
74
74
|
search
|
|
75
75
|
}),
|
|
76
|
+
banner,
|
|
76
77
|
/* @__PURE__ */ jsx("main", {
|
|
77
78
|
className: pageScroll ? "flex flex-1 flex-col" : "flex min-h-0 flex-1 flex-col",
|
|
78
79
|
children: /* @__PURE__ */ jsx(TopBarSlotContext.Provider, {
|
|
@@ -1,7 +1,7 @@
|
|
|
1
1
|
import { cn } from "../lib/cn.js";
|
|
2
2
|
import { text } from "./messages.js";
|
|
3
3
|
import { Ellipsis } from "lucide-react";
|
|
4
|
-
import { jsx, jsxs } from "react/jsx-runtime";
|
|
4
|
+
import { Fragment, jsx, jsxs } from "react/jsx-runtime";
|
|
5
5
|
//#region src/app-shell/bottom-bar.tsx
|
|
6
6
|
const inApp = (event) => event.button === 0 && !event.metaKey && !event.ctrlKey && !event.shiftKey && !event.altKey;
|
|
7
7
|
const tab = "flex min-h-[49px] min-w-0 flex-1 flex-col items-center justify-center gap-1 pb-1 pt-1.5 text-[10px] font-medium leading-none";
|
|
@@ -12,10 +12,13 @@ const tab = "flex min-h-[49px] min-w-0 flex-1 flex-col items-center justify-cent
|
|
|
12
12
|
*/
|
|
13
13
|
const BottomBar = ({ tabs, onNavigate, onMore, moreOpen, moreControls, sticky, ref }) => {
|
|
14
14
|
const moreCurrent = !tabs.some((item) => item.active);
|
|
15
|
-
return /* @__PURE__ */ jsxs("
|
|
15
|
+
return /* @__PURE__ */ jsxs(Fragment, { children: [sticky && /* @__PURE__ */ jsx("div", {
|
|
16
|
+
"aria-hidden": true,
|
|
17
|
+
className: "h-[var(--pb-sticky-bottom)] shrink-0 md:hidden"
|
|
18
|
+
}), /* @__PURE__ */ jsxs("nav", {
|
|
16
19
|
ref,
|
|
17
20
|
"aria-label": text("tabs"),
|
|
18
|
-
className: cn("flex shrink-0 border-t bg-background pb-[var(--pb-safe-bottom)] md:hidden", sticky && "
|
|
21
|
+
className: cn("flex shrink-0 border-t bg-background pb-[var(--pb-safe-bottom)] md:hidden", sticky && "fixed bottom-0 left-[var(--pb-safe-left)] right-[var(--pb-safe-right)] z-30"),
|
|
19
22
|
children: [tabs.map((item) => {
|
|
20
23
|
const Icon = item.icon;
|
|
21
24
|
return /* @__PURE__ */ jsxs("a", {
|
|
@@ -53,7 +56,7 @@ const BottomBar = ({ tabs, onNavigate, onMore, moreOpen, moreControls, sticky, r
|
|
|
53
56
|
"aria-hidden": true
|
|
54
57
|
}), text("more")]
|
|
55
58
|
})]
|
|
56
|
-
});
|
|
59
|
+
})] });
|
|
57
60
|
};
|
|
58
61
|
//#endregion
|
|
59
62
|
export { BottomBar };
|
|
@@ -4,7 +4,7 @@ import { createContext, useContext, useLayoutEffect } from "react";
|
|
|
4
4
|
const PageScrollContext = createContext(() => {});
|
|
5
5
|
/**
|
|
6
6
|
* While the calling page is shown and `on`, the document scrolls instead of a box of the screen's height: the top and
|
|
7
|
-
* bottom bars and the sidebar
|
|
7
|
+
* bottom bars and the sidebar stay in view, and the page grows with its content, so the browser's own scrolling applies
|
|
8
8
|
* throughout, scrolling to the top included, as tapping the status bar on an iPhone does. Sticky content in the page
|
|
9
9
|
* stays clear of the bars with `--pb-sticky-top` and `--pb-sticky-bottom`. Not `on`, the page fills the box instead,
|
|
10
10
|
* as a map does. Once the page is gone the shell's `pageScroll` applies again.
|
|
@@ -25,9 +25,9 @@ const TopBar = ({ breadcrumb, onNavigate, actions, onMenu, menuOpen, menuControl
|
|
|
25
25
|
window.addEventListener("keydown", onKey);
|
|
26
26
|
return () => window.removeEventListener("keydown", onKey);
|
|
27
27
|
}, [search]);
|
|
28
|
-
return /* @__PURE__ */ jsxs("header", {
|
|
28
|
+
return /* @__PURE__ */ jsxs(Fragment$1, { children: [/* @__PURE__ */ jsxs("header", {
|
|
29
29
|
ref,
|
|
30
|
-
className: cn(sticky ? "sticky top-0 z-30" : "relative", "flex h-[calc(3rem+var(--pb-safe-top))] shrink-0 items-center gap-1 border-b bg-background pl-4 pr-2 pt-[var(--pb-safe-top)] md:gap-4 md:px-5"),
|
|
30
|
+
className: cn(sticky ? "sticky top-0 z-30 max-md:fixed max-md:left-[var(--pb-safe-left)] max-md:right-[var(--pb-safe-right)]" : "relative", "flex h-[calc(3rem+var(--pb-safe-top))] shrink-0 items-center gap-1 border-b bg-background pl-4 pr-2 pt-[var(--pb-safe-top)] md:gap-4 md:px-5"),
|
|
31
31
|
children: [
|
|
32
32
|
onMenu && /* @__PURE__ */ jsx("button", {
|
|
33
33
|
type: "button",
|
|
@@ -99,7 +99,10 @@ const TopBar = ({ breadcrumb, onNavigate, actions, onMenu, menuOpen, menuControl
|
|
|
99
99
|
})]
|
|
100
100
|
})
|
|
101
101
|
]
|
|
102
|
-
})
|
|
102
|
+
}), sticky && /* @__PURE__ */ jsx("div", {
|
|
103
|
+
"aria-hidden": true,
|
|
104
|
+
className: "h-[var(--pb-sticky-top)] shrink-0 md:hidden"
|
|
105
|
+
})] });
|
|
103
106
|
};
|
|
104
107
|
//#endregion
|
|
105
108
|
export { TopBar, topBarButton };
|
package/dist/package.js
CHANGED