@protobase/ui 0.27.0 → 0.28.0

package/dist/app/app.js

@@ -201,6 +201,7 @@ const Routes = ({ workspace, sidebarMode, assistant, runtime }) => {
 		signIn: user ? void 0 : signIn.link(),
 		workspace: current?.organization?.name ?? workspace,
 		appName: meta.appName,
+		appIcon: meta.appIcon,
 		logo: ProjectLogo,
 		navGroups: groups,
 		bottomBar: bottomBarFromMeta(meta, basePath, place),

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

@@ -10,7 +10,7 @@ import { useEffect, useRef, useState } from "react";
 import { jsx, jsxs } from "react/jsx-runtime";
 //#region src/app-shell/app-shell.tsx
 const drawerId = "app-drawer";
-const AppShell = ({ sidebarMode, activeItem, breadcrumb, user, workspace, appName, logo, actions, rightPanel, forceExpanded, profileMenuOpen, navGroups, userMenu, bottomBar, onNavigate, onSignOut, signIn, organizations, roles, theme, search, pageScroll: scrollsByDefault = false, className, children }) => {
+const AppShell = ({ sidebarMode, activeItem, breadcrumb, user, workspace, appName, appIcon, logo, actions, rightPanel, forceExpanded, profileMenuOpen, navGroups, userMenu, bottomBar, onNavigate, onSignOut, signIn, organizations, roles, theme, search, pageScroll: scrollsByDefault = false, className, children }) => {
 	const desktop = useIsDesktop();
 	const [drawerOpen, setDrawerOpen] = useState(false);
 	useEffect(() => {
@@ -31,6 +31,7 @@ const AppShell = ({ sidebarMode, activeItem, breadcrumb, user, workspace, appNam
 		user,
 		workspace,
 		appName,
+		appIcon,
 		forceExpanded,
 		profileMenuOpen,
 		groups: navGroups,

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

@@ -4,12 +4,14 @@ export declare const LogoMark: ({ className }: {
   className?: string;
 }) => import("react").JSX.Element;
 /**
- * What the logo at the top of the sidebar gets: `compact` when the sidebar shows only icons, the workspace's name, and
- * the app's name, such as `Property Finder` (`PROTOBASE_APP_NAME` or `createAuth`'s `appName`).
+ * What the logo at the top of the sidebar gets: `compact` when the sidebar shows only icons, the workspace's name, the
+ * app's name, such as `Property Finder` (`PROTOBASE_APP_NAME` or `createAuth`'s `appName`), and the path of its own
+ * icon, its `protobase.favicon.svg`, when the project has one.
  */
 export type ShellLogoProps = {
   compact: boolean;
   workspace?: string;
   appName?: string;
+  appIcon?: string;
 };
 //#endregion

package/dist/app-shell/logo.js

@@ -31,16 +31,21 @@ const Wordmark = ({ className }) => /* @__PURE__ */ jsx("svg", {
 });
 const brandName = "Protobase";
 /**
-* The logo at the top of the sidebar: Protobase's mark, then the app's name, as the brand's wordmark when the app goes by
-* Protobase's name, with the workspace's name under it; the mark alone when compact.
+* The logo at the top of the sidebar: the app's own icon, else Protobase's mark, then the app's name, as the brand's
+* wordmark when the app goes by Protobase's name and has no icon of its own, with the workspace's name under it; the
+* icon alone when compact.
 */
-const Logo = ({ compact, workspace, appName }) => /* @__PURE__ */ jsxs("div", {
+const Logo = ({ compact, workspace, appName, appIcon }) => /* @__PURE__ */ jsxs("div", {
 	className: "flex items-center gap-2.5 overflow-hidden",
-	children: [/* @__PURE__ */ jsx(LogoMark, {}), !compact && /* @__PURE__ */ jsxs("div", {
+	children: [appIcon ? /* @__PURE__ */ jsx("img", {
+		src: appIcon,
+		alt: "",
+		className: "size-7 shrink-0 object-contain"
+	}) : /* @__PURE__ */ jsx(LogoMark, {}), !compact && /* @__PURE__ */ jsxs("div", {
 		className: "flex min-w-0 flex-col gap-0.5 leading-tight",
-		children: [appName && appName !== brandName ? /* @__PURE__ */ jsx("div", {
+		children: [appIcon || appName && appName !== brandName ? /* @__PURE__ */ jsx("div", {
 			className: "truncate text-sm font-semibold text-foreground",
-			children: appName
+			children: appName ?? brandName
 		}) : /* @__PURE__ */ jsx(Wordmark, { className: "self-start" }), workspace && /* @__PURE__ */ jsx("div", {
 			className: "truncate text-[11px] text-muted-foreground",
 			children: workspace

package/dist/app-shell/sidebar.js

@@ -11,7 +11,7 @@ import { SidebarGroup } from "./sidebar-group.js";
 import { LogIn } from "lucide-react";
 import { Fragment, jsx, jsxs } from "react/jsx-runtime";
 //#region src/app-shell/sidebar.tsx
-const Sidebar = ({ mode, activeItem, user, workspace, appName, forceExpanded, profileMenuOpen, groups = navGroups, userMenu, onNavigate, onSignOut, signIn, organizations, roles, theme, sticky, logo: SidebarLogo = Logo }) => {
+const Sidebar = ({ mode, activeItem, user, workspace, appName, appIcon, forceExpanded, profileMenuOpen, groups = navGroups, userMenu, onNavigate, onSignOut, signIn, organizations, roles, theme, sticky, logo: SidebarLogo = Logo }) => {
 	const expanding = mode === "icon-expand";
 	const expanded = expanding && forceExpanded;
 	const inline = isTextMode(mode) || expanding;
@@ -26,7 +26,8 @@ const Sidebar = ({ mode, activeItem, user, workspace, appName, forceExpanded, pr
 					children: /* @__PURE__ */ jsx(SidebarLogo, {
 						compact: !inline,
 						workspace,
-						appName
+						appName,
+						appIcon
 					})
 				}),
 				/* @__PURE__ */ jsx("div", {

package/dist/data/meta-data.d.ts

@@ -7,6 +7,8 @@ export type MetaData = {
   etag: string;
   /** The app's name, which ends the tab titles. */
   appName: string;
+  /** The path of the app's own icon, when the project has one, which the sidebar's logo draws. */
+  appIcon?: string;
   resources: Record<string, ResourceModel>;
   views: Record<string, ViewModel>;
   /** Composed pages by name. */

package/dist/data/use-meta.js

@@ -27,6 +27,7 @@ const useMeta = () => {
 			return {
 				etag: result.etag,
 				appName: result.meta.appName,
+				...result.meta.appIcon && { appIcon: result.meta.appIcon },
 				resources: Object.fromEntries(result.meta.resources.map((model) => [model.name, model])),
 				views: Object.fromEntries(result.meta.views.map((model) => [model.resource, model])),
 				pages: Object.fromEntries((result.meta.pages ?? []).map((model) => [model.name, model])),

package/dist/package.js

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