@protobase/ui 0.12.20 → 0.12.21

package/dist/app-shell/app-shell.d.ts

@@ -2,4 +2,5 @@ import "./bottom-bar.js";
 import "./nav.js";
 import "./profile-menu.js";
 import "./global-search.js";
+import "./breadcrumb.js";
 import { ReactNode } from "react";

package/dist/app-shell/back-target.js

@@ -0,0 +1,12 @@
+//#region src/app-shell/back-target.ts
+/** Where the mobile back button goes: the crumb just before the current page, when it has a page of its own. */
+const backTarget = (parts) => {
+	const previous = parts.at(-2);
+	if (typeof previous !== "object" || !previous.href || previous.loading) return void 0;
+	return {
+		label: previous.label,
+		href: previous.href
+	};
+};
+//#endregion
+export { backTarget };

package/dist/app-shell/breadcrumb.d.ts

@@ -0,0 +1 @@
+import "react";

package/dist/app-shell/breadcrumb.js

@@ -3,6 +3,7 @@ import { Skeleton } from "../primitives/skeleton.js";
 import { ChevronRight } from "lucide-react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/app-shell/breadcrumb.tsx
+/** A plain left click, which the app follows itself; others open a new tab. */
 const inApp = (event) => event.button === 0 && !event.metaKey && !event.ctrlKey && !event.shiftKey && !event.altKey;
 /** The trail of where you are; the last crumb, the current page, shows on phones too. */
 const Breadcrumb = ({ parts, onNavigate }) => /* @__PURE__ */ jsx("nav", {
@@ -41,4 +42,4 @@ const Breadcrumb = ({ parts, onNavigate }) => /* @__PURE__ */ jsx("nav", {
 	})
 });
 //#endregion
-export { Breadcrumb };
+export { Breadcrumb, inApp };

package/dist/app-shell/index.d.ts

@@ -3,6 +3,7 @@ import "./nav.js";
 import "./profile-menu.js";
 import { SidebarMode, sidebarModes } from "./sidebar-mode.js";
 import "./global-search.js";
+import "./breadcrumb.js";
 import "./app-shell.js";
 import "./page-header.js";
 import "./sidebar.js";

package/dist/app-shell/top-bar.js

@@ -1,13 +1,15 @@
 import { cn } from "../lib/cn.js";
-import { Breadcrumb } from "./breadcrumb.js";
+import { backTarget } from "./back-target.js";
+import { Breadcrumb, inApp } from "./breadcrumb.js";
 import { GlobalSearch } from "./global-search.js";
 import { useEffect, useRef, useState } from "react";
-import { Menu, Search, X } from "lucide-react";
+import { ChevronLeft, Menu, Search, X } from "lucide-react";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 //#region src/app-shell/top-bar.tsx
 const iconButton = "inline-flex size-11 shrink-0 items-center justify-center rounded-md text-muted-foreground hover:bg-muted md:hidden";
 const TopBar = ({ breadcrumb, onNavigate, actions, onMenu, menuOpen, menuControls, search }) => {
 	const [searchOpen, setSearchOpen] = useState(false);
+	const back = backTarget(breadcrumb);
 	const desktopSearch = useRef(null);
 	useEffect(() => {
 		if (!search) return;
@@ -33,6 +35,17 @@ const TopBar = ({ breadcrumb, onNavigate, actions, onMenu, menuOpen, menuControl
 				className: cn(iconButton, "-ml-0.5"),
 				children: /* @__PURE__ */ jsx(Menu, { className: "size-5" })
 			}),
+			back && /* @__PURE__ */ jsx("a", {
+				href: back.href,
+				"aria-label": `Back to ${back.label}`,
+				onClick: (event) => {
+					if (!onNavigate || !inApp(event)) return;
+					event.preventDefault();
+					onNavigate(back.href);
+				},
+				className: cn(iconButton, !onMenu && "-ml-0.5"),
+				children: /* @__PURE__ */ jsx(ChevronLeft, { className: "size-5" })
+			}),
 			/* @__PURE__ */ jsx(Breadcrumb, {
 				parts: breadcrumb,
 				onNavigate

package/dist/package.js

@@ -1,5 +1,5 @@
 //#region package.json
-var version = "0.12.20";
+var version = "0.12.21";
 var protobase = { "pluginApi": 1 };
 //#endregion
 export { protobase, version };