@columenlabs/lumen-ui 0.1.203 → 0.1.205

package/dist/assistant/lumen-assistant.js

@@ -24,7 +24,8 @@ import { chatMarkdown, chatTurns, copyMarkdown, turnMarkdown } from './copy.js';
 import { composeAssistant, selectionRef, useComposeRequest, usePageSelection, useShownAssistantSources, } from './sources.js';
 import { useAssistantChat } from './use-assistant-chat.js';
 // The Markdown renderer (tables included) loads with the first answer (lazy-part.tsx).
-const ChatMarkdown = lazyPart(() => import('./chat-markdown.js').then((m) => m.default));
+// A tab whose build a deploy replaced shows the answer as plain text instead of reloading mid chat.
+const ChatMarkdown = lazyPart(() => import('./chat-markdown.js').then((m) => m.default), null, ({ children }) => _jsx("p", { className: "whitespace-pre-wrap", children: children }));
 /** The main model's context drawn full (tokens); the mark sits where the assistant compacts. */
 const CONTEXT_MAX = 200_000;
 const COMPACT_AT = 150_000;

package/dist/lazy-part.d.ts

@@ -3,6 +3,15 @@
  * first page never downloads what it doesn't draw. The import must be a dynamic `import()` with the
  * part's module, and every other import of that module elsewhere in the kit's static graph must be
  * type-only, or the bundler keeps it in the first file.
+ *
+ * Every lazy part also loads on its own once the tab is idle (8 s after load). A deploy replaces
+ * the hashed files, so a tab that first drew a part after one asked for a file that was gone and
+ * reloaded: the assistant's first answer reloaded the page mid chat (2026-11-04,
+ * `chat-markdown-*.js`). Loaded early, the part is in the tab's module map before any deploy.
  */
 import { type ComponentType, type ReactNode } from 'react';
-export declare function lazyPart<P extends object>(load: () => Promise<ComponentType<P>>, fallback?: ReactNode): ComponentType<P>;
+/** A dynamic import that failed to load (Chrome, Firefox, Safari wording), not a page's own bug. */
+export declare function isStaleBuildError(error: unknown): boolean;
+export declare function lazyPart<P extends object>(load: () => Promise<ComponentType<P>>, fallback?: ReactNode, 
+/** Drawn instead when a deploy removed the part's file, so the tab keeps working (no reload). */
+stale?: ComponentType<P>): ComponentType<P>;

package/dist/lazy-part.js

@@ -4,10 +4,59 @@ import { jsx as _jsx } from "react/jsx-runtime";
  * first page never downloads what it doesn't draw. The import must be a dynamic `import()` with the
  * part's module, and every other import of that module elsewhere in the kit's static graph must be
  * type-only, or the bundler keeps it in the first file.
+ *
+ * Every lazy part also loads on its own once the tab is idle (8 s after load). A deploy replaces
+ * the hashed files, so a tab that first drew a part after one asked for a file that was gone and
+ * reloaded: the assistant's first answer reloaded the page mid chat (2026-11-04,
+ * `chat-markdown-*.js`). Loaded early, the part is in the tab's module map before any deploy.
  */
 import { Suspense, lazy } from 'react';
-export function lazyPart(load, fallback = null) {
-    const Part = lazy(() => load().then((c) => ({ default: c })));
+/** A dynamic import that failed to load (Chrome, Firefox, Safari wording), not a page's own bug. */
+export function isStaleBuildError(error) {
+    const message = error instanceof Error ? error.message : '';
+    return (message.startsWith('Failed to fetch dynamically imported module') ||
+        message.startsWith('error loading dynamically imported module') ||
+        message.startsWith('Importing a module script failed') ||
+        message.includes('Unable to preload CSS') ||
+        // Safari, when a missing file comes back as a page instead of a script.
+        message.includes('is not a valid JavaScript MIME type'));
+}
+/** How long after load the lazy parts start loading: the first page's own work comes first. */
+const PRELOAD_AFTER_MS = 8_000;
+const loaders = new Set();
+let scheduled = false;
+function schedulePreload() {
+    if (scheduled || typeof window === 'undefined')
+        return;
+    scheduled = true;
+    const run = () => {
+        for (const load of loaders)
+            load().catch(() => { });
+    };
+    const idle = () => setTimeout(() => 'requestIdleCallback' in window ? window.requestIdleCallback(run) : setTimeout(run, 1000), PRELOAD_AFTER_MS);
+    if (document.readyState === 'complete')
+        idle();
+    else
+        window.addEventListener('load', idle, { once: true });
+}
+export function lazyPart(load, fallback = null, 
+/** Drawn instead when a deploy removed the part's file, so the tab keeps working (no reload). */
+stale) {
+    let pending = null;
+    const once = () => {
+        pending ??= load().catch((error) => {
+            pending = null;
+            throw error;
+        });
+        return pending;
+    };
+    loaders.add(once);
+    schedulePreload();
+    const Part = lazy(() => once().then((c) => ({ default: c }), (error) => {
+        if (stale && isStaleBuildError(error))
+            return { default: stale };
+        throw error;
+    }));
     function LazyPart(props) {
         return (_jsx(Suspense, { fallback: fallback, children: _jsx(Part, { ...props }) }));
     }

package/dist/lumen-view.js

@@ -499,11 +499,13 @@ const colPropsOf = (units) => (f, ...more) => ({
  * theme.css), so one long name never pushes the other columns off screen; `false` lifts it.
  */
 const capOf = (f, i) => f.maxWidth === false ? undefined : (f.maxWidth ?? (i === 0 ? 'var(--lead-col-max)' : undefined));
-/** Holds a cell to its column's cap on one line: text past it ends in an ellipsis. */
-function CappedCell({ max, title, children, }) {
+/** Holds a cell to its column's cap on one line: text past it ends in an ellipsis. `end` keeps a
+ *  right-aligned column's value on its right edge (the wrapper is a flex row, which `text-right`
+ *  alone does not move), so a capped or resized column keeps one edge. */
+function CappedCell({ max, end, title, children, }) {
     if (!max)
         return children;
-    return (_jsx("div", { className: "flex min-w-0 *:min-w-0 *:max-w-full *:truncate", style: { maxWidth: max }, title: title, children: children }));
+    return (_jsx("div", { className: cn('flex min-w-0 *:min-w-0 *:max-w-full *:truncate', end && 'justify-end'), style: { maxWidth: max }, title: title, children: children }));
 }
 /** The flat or grouped table: sortable headers, a Total row, group rows that collapse. */
 // Sorting, and paging of flat tables (the page is LumenView's, set right of the row count).
@@ -534,11 +536,6 @@ function LumenTableRows({ domain, columns = domain.fields, rows, groupBy = null,
     const resizing = resizable && !isMobile && !fit;
     const colWidths = useColumnWidths(resizing ? (widthsKey ?? '') || undefined : undefined);
     const widthOf = (f) => resizing && f ? colWidths.widths[f.key] : undefined;
-    // A dragged width caps the column's cells in its place (the cell's own padding taken off).
-    const capFor = (f, i) => {
-        const w = widthOf(f);
-        return w ? `calc(${w}px - 2 * var(--cell-x))` : capOf(f, i);
-    };
     const [sorting, setSorting] = useState(() => sortingOf(sort, columns, serverSorts));
     // A saved sort patched while the table is open (the assistant's card move) applies at once.
     const savedSort = JSON.stringify(sort ?? null);
@@ -554,11 +551,18 @@ function LumenTableRows({ domain, columns = domain.fields, rows, groupBy = null,
         pageIndex: paging ? page.index : 0,
         pageSize: paging ? page.size : Math.max(rows.length, 1),
     };
-    // Groups whose state differs from where they start: open, or past OPEN_ALL rows only the first.
     // Columns a UnitValue has drawn in (`UnitColumns`): their cells share the numbers' edge.
     const [units, setUnits] = useState(() => new Set());
     const markUnits = useCallback((key) => setUnits((s) => (s.has(key) ? s : new Set(s).add(key))), []);
     const colProps = colPropsOf(units);
+    // A dragged width caps the column's cells in its place (the cell's own padding taken off).
+    const capFor = (f, i) => {
+        const w = widthOf(f);
+        // A units column's right padding also holds the unit slot (theme.css `[data-units]`).
+        const pad = units.has(f.key) ? '2 * var(--cell-x) - var(--unit-slot)' : '2 * var(--cell-x)';
+        return w ? `calc(${w}px - ${pad})` : capOf(f, i);
+    };
+    // Groups whose state differs from where they start: open, or past OPEN_ALL rows only the first.
     const [flipped, setFlipped] = useState(new Set());
     const [more, setMore] = useState(new Map());
     // Under a sub-group's `flat` grouping each row names itself by its sub-group key instead of
@@ -683,7 +687,7 @@ function LumenTableRows({ domain, columns = domain.fields, rows, groupBy = null,
             const field = now[i] ?? f;
             const chip = chips.some((c) => c.key === field.key);
             const v = computed.value(field, row.original);
-            return (_jsx(CappedCell, { max: capFor(field, i), title: !field.render && typeof v === 'string' ? v : undefined, children: i === 0 && inline.length ? (_jsx(FirstCell, { value: cellOf(field, row.original, chip), chips: inline.flatMap((x) => {
+            return (_jsx(CappedCell, { max: capFor(field, i), end: (field.format ?? 'text') !== 'text', title: !field.render && typeof v === 'string' ? v : undefined, children: i === 0 && inline.length ? (_jsx(FirstCell, { value: cellOf(field, row.original, chip), chips: inline.flatMap((x) => {
                         const v = computed.value(x, row.original);
                         if (!x.edit && (v === null || v === ''))
                             return [];

package/dist/route-error.d.ts

@@ -1,6 +1,5 @@
 import { type ErrorComponentProps } from '@tanstack/react-router';
-/** A dynamic import that failed to load (Chrome, Firefox, Safari wording), not a page's own bug. */
-export declare function isStaleBuildError(error: unknown): boolean;
+export { isStaleBuildError } from './lazy-part.js';
 /**
  * Reloads onto the new build unless it already did in the last 10 s (a file that is truly missing
  * then shows its error instead of reloading forever); says whether a reload is under way.
@@ -39,4 +38,3 @@ export declare function ErrorPage({ error, onRetry, what, }: {
  * tried once more on its own, then shown with Try again and Reload. Each one is logged.
  */
 export declare function RouteError({ error, reset }: ErrorComponentProps): import("react").JSX.Element;
-export {};

package/dist/route-error.js

@@ -17,6 +17,7 @@ import { ChevronRight, RefreshCw, RotateCcw, TriangleAlert } from 'lucide-react'
 import { useEffect, useState } from 'react';
 import { toast } from 'sonner';
 import { fetchWithin } from './fetch-within.js';
+import { isStaleBuildError } from './lazy-part.js';
 import { reportClientError } from './telemetry.js';
 import { Button } from './ui/button.js';
 import { Collapsible, CollapsibleContent, CollapsibleTrigger } from './ui/collapsible.js';
@@ -24,16 +25,7 @@ import { Empty, EmptyContent, EmptyDescription, EmptyHeader, EmptyMedia, EmptyTi
 import { Spinner } from './ui/spinner.js';
 const KEY = 'lumen_new_build_reload';
 const GAP_MS = 10_000;
-/** A dynamic import that failed to load (Chrome, Firefox, Safari wording), not a page's own bug. */
-export function isStaleBuildError(error) {
-    const message = error instanceof Error ? error.message : '';
-    return (message.startsWith('Failed to fetch dynamically imported module') ||
-        message.startsWith('error loading dynamically imported module') ||
-        message.startsWith('Importing a module script failed') ||
-        message.includes('Unable to preload CSS') ||
-        // Safari, when a missing file comes back as a page instead of a script.
-        message.includes('is not a valid JavaScript MIME type'));
-}
+export { isStaleBuildError } from './lazy-part.js';
 /** A reload this tab has already started; anything failing meanwhile waits for it. */
 let reloadStarted = false;
 /** Whether this tab has not reloaded for a new build in the last 10 s. */

package/dist/theme.css

@@ -433,6 +433,9 @@
 }
 [data-units] [data-slot="unit-value"] {
   position: relative;
+  /* A resized column wraps its cells in a truncating box; the unit hangs outside the value's box,
+     so it must not be clipped with it. */
+  overflow: visible;
 }
 [data-units] [data-slot="unit-value-unit"] {
   position: absolute;

package/package.json

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