@columenlabs/lumen-ui 0.1.144 → 0.1.146

package/dist/app-switcher.d.ts

@@ -11,6 +11,9 @@ export interface LumenApp {
     icon?: NavIcon;
     /** An image of its mark (another site's favicon). */
     iconUrl?: string;
+    /** Its `icon` or `iconUrl` is a whole app tile (its own coloured square, like a favicon): the
+     * switcher draws it at the box's full size instead of a small glyph inside the box. */
+    tile?: boolean;
     href: string;
     /** The heading it sits under; apps with none lead the menu under `menuLabel`. */
     group?: string;
@@ -33,6 +36,8 @@ export interface SuiteApp {
     url: string;
     icon?: string;
     iconUrl?: string;
+    /** The icon is a whole app tile (LumenApp `tile`). */
+    tile?: boolean;
     group?: string;
 }
 /** What a suite list address answers. */

package/dist/app-switcher.js

@@ -42,7 +42,7 @@ export function LumenAppSwitcher({ current, apps, product, menuLabel = 'Apps', }
         else
             groups.unshift({ label, apps: [a] });
     }
-    return (_jsx(SidebarMenu, { children: _jsx(SidebarMenuItem, { children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(SidebarMenuButton, { size: "lg", tooltip: current.name, className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground", children: [_jsx("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: _jsx(AppMark, { app: current, className: "size-4" }) }), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: current.label ?? current.name }), product && (_jsx("span", { className: "truncate text-xs text-muted-foreground", children: product }))] }), _jsx(ChevronsUpDownIcon, { className: "ml-auto" })] }) }), _jsx(DropdownMenuContent, { className: "min-w-56 max-w-96 rounded-lg", align: "start", side: isMobile ? 'bottom' : 'right', sideOffset: 4, children: groups.map((g, i) => (_jsxs(Fragment, { children: [i > 0 && _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuLabel, { className: "text-xs text-muted-foreground", children: g.label }), g.apps.map((a) => (_jsx(DropdownMenuItem, { asChild: true, className: cn('gap-2 p-2', a.id === current.id && 'bg-muted'), children: _jsxs("a", { href: a.href, "aria-current": a.id === current.id ? 'page' : undefined, children: [_jsx("div", { className: "flex size-6 shrink-0 items-center justify-center rounded-md border", children: _jsx(AppMark, { app: a, className: "size-3.5 shrink-0" }) }), _jsx("span", { className: cn('truncate', a.external && 'shrink-0'), children: a.label ?? a.name }), a.external && (_jsxs(_Fragment, { children: [_jsx("span", { className: "ml-auto min-w-0 truncate text-xs text-muted-foreground", children: hostOf(a.href) }), _jsx(ArrowUpRightIcon, { className: "size-3.5 shrink-0 text-muted-foreground" })] }))] }) }, a.id)))] }, g.label))) })] }) }) }));
+    return (_jsx(SidebarMenu, { children: _jsx(SidebarMenuItem, { children: _jsxs(DropdownMenu, { children: [_jsx(DropdownMenuTrigger, { asChild: true, children: _jsxs(SidebarMenuButton, { size: "lg", tooltip: current.name, className: "data-[state=open]:bg-sidebar-accent data-[state=open]:text-sidebar-accent-foreground", children: [current.tile ? (_jsx(AppMark, { app: current, className: "aspect-square size-8 shrink-0 rounded-lg" })) : (_jsx("div", { className: "flex aspect-square size-8 items-center justify-center rounded-lg bg-sidebar-primary text-sidebar-primary-foreground", children: _jsx(AppMark, { app: current, className: "size-4" }) })), _jsxs("div", { className: "grid flex-1 text-left text-sm leading-tight", children: [_jsx("span", { className: "truncate font-semibold", children: current.label ?? current.name }), product && (_jsx("span", { className: "truncate text-xs text-muted-foreground", children: product }))] }), _jsx(ChevronsUpDownIcon, { className: "ml-auto" })] }) }), _jsx(DropdownMenuContent, { className: "min-w-56 max-w-96 rounded-lg", align: "start", side: isMobile ? 'bottom' : 'right', sideOffset: 4, children: groups.map((g, i) => (_jsxs(Fragment, { children: [i > 0 && _jsx(DropdownMenuSeparator, {}), _jsx(DropdownMenuLabel, { className: "text-xs text-muted-foreground", children: g.label }), g.apps.map((a) => (_jsx(DropdownMenuItem, { asChild: true, className: cn('gap-2 p-2', a.id === current.id && 'bg-muted'), children: _jsxs("a", { href: a.href, "aria-current": a.id === current.id ? 'page' : undefined, children: [a.tile ? (_jsx(AppMark, { app: a, className: "size-6 shrink-0 rounded-md" })) : (_jsx("div", { className: "flex size-6 shrink-0 items-center justify-center rounded-md border", children: _jsx(AppMark, { app: a, className: "size-3.5 shrink-0" }) })), _jsx("span", { className: cn('truncate', a.external && 'shrink-0'), children: a.label ?? a.name }), a.external && (_jsxs(_Fragment, { children: [_jsx("span", { className: "ml-auto min-w-0 truncate text-xs text-muted-foreground", children: hostOf(a.href) }), _jsx(ArrowUpRightIcon, { className: "size-3.5 shrink-0 text-muted-foreground" })] }))] }) }, a.id)))] }, g.label))) })] }) }) }));
 }
 /** How far `url` matches this page: its host, then the longest path it starts. */
 const matchLength = (url, here) => {
@@ -67,6 +67,7 @@ export function suiteApps(list, here) {
         href: a.url,
         icon: a.icon ? lucideIcon(a.icon) : undefined,
         iconUrl: a.iconUrl,
+        tile: a.tile,
         group: a.group,
         external: hostOf(a.url) !== here.host,
     }));

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@columenlabs/lumen-ui",
-  "version": "0.1.144",
+  "version": "0.1.146",
   "description": "Lumen: shared React components (frame, views, widgets, charts, drawers).",
   "license": "MIT",
   "type": "module",
@@ -49,7 +49,7 @@
     "@codemirror/lang-javascript": "6.2.5",
     "@codemirror/lang-json": "6.0.2",
     "@codemirror/lang-sql": "6.10.0",
-    "@columenlabs/lumen-ui-types": "0.1.144",
+    "@columenlabs/lumen-ui-types": "0.1.146",
     "@dnd-kit/core": "6.3.1",
     "@dnd-kit/sortable": "10.0.0",
     "@dnd-kit/utilities": "3.2.2",