@protobase/ui 0.45.11 → 0.45.13

package/dist/app/app.js

@@ -47,6 +47,7 @@ import { OrganizationPage } from "../organizations/organization-page.js";
 import { OrganizationsPage } from "../organizations/organizations-page.js";
 import { actingUser } from "../roles/acting-user.js";
 import { useActiveRole } from "../roles/use-active-role.js";
+import { startAddress } from "./start-address.js";
 import { ProjectLogo } from "./project-logo.js";
 import { PluginGate, usePluginsOff } from "../plugins/plugin-gate.js";
 import { PluginNotice } from "../plugins/plugin-notice.js";
@@ -59,7 +60,7 @@ import { NewVersionToast } from "./new-version/new-version-toast.js";
 import { RuntimeUpdateButton } from "./runtime/runtime-update.js";
 import { StaffBanner } from "./staff-banner.js";
 import { useNavRecent } from "./use-nav-recent.js";
-import { useCallback, useEffect, useState } from "react";
+import { useCallback, useEffect, useMemo, useState } from "react";
 import { viewOfList } from "@protobase/schema/internal";
 import { Fragment as Fragment$1, jsx, jsxs } from "react/jsx-runtime";
 import { connectRoute } from "@protobase/schema";
@@ -93,23 +94,13 @@ const Routes = ({ workspace, sidebarMode, assistant, runtime }) => {
 	});
 	useLiveUpdates(meta);
 	const groups = navFromMeta(meta, basePath, recent);
-	const firstPage = Object.keys(meta.pages)[0];
-	const firstResource = Object.keys(meta.resources)[0];
+	const start = useMemo(() => startAddress(meta), [meta]);
 	const page = address?.kind === "page" ? meta.pages[address.page] : void 0;
 	useEffect(() => {
-		if (path !== "/") return;
-		if (firstPage) go({
-			kind: "page",
-			page: firstPage
-		}, { replace: true });
-		else if (firstResource) go({
-			kind: "list",
-			resource: firstResource
-		}, { replace: true });
+		if (path === "/" && start) go(start, { replace: true });
 	}, [
 		path,
-		firstPage,
-		firstResource,
+		start,
 		go
 	]);
 	const resource = address?.kind === "page" ? void 0 : address?.resource;

package/dist/app/main.js

@@ -2,6 +2,7 @@ import { browserLocale } from "../locale/active-locale.js";
 import { nativeBridgeOf } from "./native-auth-fetch.js";
 import { uiFromModule } from "./pages/ui-from-module.js";
 import { App } from "./app.js";
+import { showKeyboardAccessoryBar } from "./native-keyboard.js";
 import { applyNativeViewport } from "./native-viewport.js";
 import { pageApiOrigin } from "./page-api-origin.js";
 import { StrictMode } from "react";
@@ -13,7 +14,10 @@ import "../styles.css";
 const root = document.getElementById("root");
 if (!root) throw new Error("index.html needs an element with id \"root\"");
 const nativeBridge = nativeBridgeOf(window);
-if (nativeBridge) applyNativeViewport(document);
+if (nativeBridge) {
+	applyNativeViewport(document);
+	showKeyboardAccessoryBar(nativeBridge);
+}
 createRoot(root).render(/* @__PURE__ */ jsx(StrictMode, { children: /* @__PURE__ */ jsx(App, {
 	baseUrl: `${pageApiOrigin() ?? ""}/api/v1`,
 	ui: uiFromModule(projectUi),

package/dist/app/native-auth-fetch.d.ts

@@ -3,6 +3,7 @@
 export type NativeBridge = {
   isNativePlatform(): boolean;
   getPlatform(): string;
+  isPluginAvailable(name: string): boolean;
   nativePromise(plugin: string, method: string, options: object): Promise<unknown>;
 };
 //#endregion

package/dist/app/native-keyboard.js

@@ -0,0 +1,12 @@
+//#region src/app/native-keyboard.ts
+/**
+* Gives the iOS app's keyboard back the bar above it, with the arrows to the previous and next field and Done, which
+* Capacitor's keyboard plugin hides when it loads and has no setting for. A binary built before it had the plugin,
+* and Android, which has no such bar, are left as they are.
+*/
+const showKeyboardAccessoryBar = async (bridge) => {
+	if (bridge.getPlatform() !== "ios" || !bridge.isPluginAvailable("Keyboard")) return;
+	await bridge.nativePromise("Keyboard", "setAccessoryBarVisible", { isVisible: true });
+};
+//#endregion
+export { showKeyboardAccessoryBar };

package/dist/app/start-address.js

@@ -0,0 +1,33 @@
+import { navFromMeta } from "./nav-from-meta.js";
+//#region src/app/start-address.ts
+/**
+* Where the app opens at `/`: the first sidebar entry the caller sees that opens what it names; with none, the first
+* page, else the first resource's list.
+*/
+const startAddress = (meta) => {
+	const first = navFromMeta(meta).flatMap((group) => group.items).find((item) => !item.problem);
+	if (first && meta.pages[first.id]) return {
+		kind: "page",
+		page: first.id
+	};
+	if (first) {
+		const [resource, list] = first.id.split("/");
+		return {
+			kind: "list",
+			resource,
+			...list !== void 0 && { list }
+		};
+	}
+	const firstPage = Object.keys(meta.pages)[0];
+	if (firstPage) return {
+		kind: "page",
+		page: firstPage
+	};
+	const firstResource = Object.keys(meta.resources)[0];
+	return firstResource ? {
+		kind: "list",
+		resource: firstResource
+	} : void 0;
+};
+//#endregion
+export { startAddress };

package/dist/auth/auth-layout.d.ts

@@ -7,6 +7,9 @@ export type AuthLayoutProps = {
   size?: 'sm' | 'md';
   children: ReactNode;
 };
-/** The frame of the sign-in and first-run pages and of public forms: logo, title and a card. */
+/**
+ * The frame of the sign-in and first-run pages and of public forms: logo, title and a card. On a page as short as a
+ * phone's above its keyboard the logo and most of the margins go, so the card still shows whole above the keyboard.
+ */
 export declare const AuthLayout: ({ title, description, size, children }: AuthLayoutProps) => import("react").JSX.Element;
 //#endregion

package/dist/auth/auth-layout.js

@@ -2,17 +2,20 @@ import { cn } from "../lib/cn.js";
 import { LogoMark } from "../app-shell/logo.js";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/auth/auth-layout.tsx
-/** The frame of the sign-in and first-run pages and of public forms: logo, title and a card. */
+/**
+* The frame of the sign-in and first-run pages and of public forms: logo, title and a card. On a page as short as a
+* phone's above its keyboard the logo and most of the margins go, so the card still shows whole above the keyboard.
+*/
 const AuthLayout = ({ title, description, size = "sm", children }) => /* @__PURE__ */ jsx("div", {
-	className: "flex min-h-full w-full items-center justify-center bg-surface px-4 pb-[calc(2.5rem+var(--pb-safe-bottom))] pt-[calc(2.5rem+var(--pb-safe-top))]",
+	className: "flex min-h-full w-full items-center justify-center bg-surface px-4 pb-[calc(2.5rem+var(--pb-safe-bottom))] pt-[calc(2.5rem+var(--pb-safe-top))] short:pb-[calc(1rem+var(--pb-safe-bottom))] short:pt-[calc(1rem+var(--pb-safe-top))]",
 	children: /* @__PURE__ */ jsxs("div", {
 		className: cn("w-full", size === "sm" ? "max-w-sm" : "max-w-lg"),
 		children: [/* @__PURE__ */ jsxs("div", {
-			className: "mb-6 flex flex-col items-center text-center",
+			className: "mb-6 flex flex-col items-center text-center short:mb-4",
 			children: [
-				/* @__PURE__ */ jsx(LogoMark, { className: "size-10" }),
+				/* @__PURE__ */ jsx(LogoMark, { className: "size-10 short:hidden" }),
 				/* @__PURE__ */ jsx("h1", {
-					className: "mt-4 text-xl font-semibold tracking-tight",
+					className: "mt-4 text-xl font-semibold tracking-tight short:mt-0",
 					children: title
 				}),
 				description && /* @__PURE__ */ jsx("p", {

package/dist/package.js

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