@columenlabs/lumen-ui 0.1.104 → 0.1.106

package/dist/details-table.js

@@ -4,7 +4,10 @@ import { Table, TableBody, TableCell, TableFooter, TableHead, TableHeader, Table
 export function DetailsTable({ head, rows, foot, selected, onSelect }) {
     const marked = head.findIndex((h) => h.grow);
     const grow = marked >= 0 ? marked : head.length - 1;
-    const cell = (i) => cn(head[i]?.right && 'num text-right', i !== grow && 'w-px', head[i]?.hideOnPhone && 'max-md:hidden');
+    const cell = (i) => cn(head[i]?.right && 'num text-right', i !== grow && 'w-px', 
+    // A marked `grow` column (a name) takes the spare width and no more: a long name ends in an
+    // ellipsis instead of pushing the other columns out of the card.
+    i === marked && 'w-full max-w-0 truncate [&>*]:max-w-full', head[i]?.hideOnPhone && 'max-md:hidden');
     return (_jsx("div", { className: "-mx-1 overflow-x-auto overflow-y-hidden rounded-md border", children: _jsxs(Table, { children: [_jsx(TableHeader, { children: _jsx(TableRow, { children: head.map((h, i) => (_jsx(TableHead, { className: cn(h.right && 'text-right', i !== grow && 'w-px', h.hideOnPhone && 'max-md:hidden'), children: h.label }, h.label))) }) }), _jsx(TableBody, { children: rows.map((r) => (_jsx(TableRow, { "data-state": r.key === selected ? 'selected' : undefined, "aria-current": r.key === selected || undefined, tabIndex: onSelect ? 0 : undefined, className: cn(onSelect &&
                             'cursor-pointer focus-visible:outline-2 focus-visible:-outline-offset-2 focus-visible:outline-ring'), onClick: onSelect && (() => onSelect(r.key)), onKeyDown: onSelect &&
                             ((e) => {

package/dist/tile.js

@@ -15,8 +15,10 @@ export function TileSpark({ values, color = 'var(--chart-1)', className, }) {
         // Inline size: a parent's `[&_svg]:size-4` (toggle items, buttons) must not shrink it.
         style: { width: '100%', height: '1.5rem' }, className: cn('overflow-visible', className), children: [_jsx("polygon", { points: `0,24 ${pts.join(' ')} 100,24`, fill: color, fillOpacity: 0.15 }), _jsx("polyline", { points: pts.join(' '), fill: "none", stroke: color, strokeWidth: 1.5, strokeLinejoin: "round", vectorEffect: "non-scaling-stroke" })] }));
 }
+/** A value with no digit in it ("Workers Paid", "Healthy") is a word, not a number. */
+const isWord = (v) => typeof v === 'string' && !/\d/.test(v);
 function TileBody({ label, value, caption, lines, valueClassName, spark, sparkColor, }) {
-    return (_jsxs(_Fragment, { children: [_jsx("span", { className: "w-full truncate text-xs text-muted-foreground", children: label }), _jsx("span", { className: cn('num truncate text-xl leading-7 font-semibold', valueClassName), children: value }), caption ? (_jsx("span", { className: "num line-clamp-2 text-xs text-muted-foreground", children: caption })) : null, lines?.map((l, i) => (_jsx("span", { className: "num line-clamp-2 text-xs text-muted-foreground", children: l }, i))), spark ? _jsx(TileSpark, { values: spark, color: sparkColor, className: "mt-1 self-stretch" }) : null] }));
+    return (_jsxs(_Fragment, { children: [_jsx("span", { className: "w-full truncate text-xs text-muted-foreground", children: label }), _jsx("span", { className: cn(!isWord(value) && 'num', 'truncate text-xl leading-7 font-semibold', valueClassName), children: value }), caption ? (_jsx("span", { className: "line-clamp-2 text-xs text-muted-foreground tabular-nums", children: caption })) : null, lines?.map((l, i) => (_jsx("span", { className: "num line-clamp-2 text-xs text-muted-foreground", children: l }, i))), spark ? _jsx(TileSpark, { values: spark, color: sparkColor, className: "mt-1 self-stretch" }) : null] }));
 }
 export function Tile({ label, value, caption, lines, className, valueClassName, spark, sparkColor, }) {
     return (_jsx(Card, { size: "sm", className: cn('min-w-0 flex-1 basis-2/5 gap-0.5 px-3 lg:basis-auto', TILE_WIDTH, className), children: _jsx(TileBody, { label: label, value: value, caption: caption, lines: lines, valueClassName: valueClassName, spark: spark, sparkColor: sparkColor }) }));

package/dist/ui/sidebar.js

@@ -82,7 +82,7 @@ function Sidebar({ side = 'left', variant = 'sidebar', collapsible = 'offcanvas'
         return (_jsx("div", { "data-slot": "sidebar", className: cn('flex h-full w-(--sidebar-width) flex-col bg-sidebar text-sidebar-foreground', className), ...props, children: children }));
     }
     if (isMobile) {
-        return (_jsxs(_Fragment, { children: [!openMobile && _jsx("div", { hidden: true, children: children }), _jsx(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: _jsxs(SheetContent, { dir: dir, "data-sidebar": "sidebar", "data-slot": "sidebar", "data-mobile": "true", className: "w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground [&>button]:hidden", style: {
+        return (_jsxs(_Fragment, { children: [!openMobile && _jsx("div", { hidden: true, children: children }), _jsx(Sheet, { open: openMobile, onOpenChange: setOpenMobile, ...props, children: _jsxs(SheetContent, { dir: dir, "data-sidebar": "sidebar", "data-slot": "sidebar", "data-mobile": "true", className: "w-(--sidebar-width) bg-sidebar p-0 text-sidebar-foreground [&_[data-sidebar=header]]:pr-11", style: {
                             '--sidebar-width': SIDEBAR_WIDTH_MOBILE,
                         }, side: side, children: [_jsxs(SheetHeader, { className: "sr-only", children: [_jsx(SheetTitle, { children: "Sidebar" }), _jsx(SheetDescription, { children: "Displays the mobile sidebar." })] }), _jsx("div", { className: "flex h-full w-full flex-col", children: children })] }) })] }));
     }

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@columenlabs/lumen-ui",
-  "version": "0.1.104",
+  "version": "0.1.106",
   "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.104",
+    "@columenlabs/lumen-ui-types": "0.1.106",
     "@dnd-kit/core": "6.3.1",
     "@dnd-kit/sortable": "10.0.0",
     "@dnd-kit/utilities": "3.2.2",