@columenlabs/lumen-ui 0.1.194 → 0.1.195

package/dist/joins.d.ts

@@ -1,5 +1,5 @@
 import { type JoinKey, type SourceState } from '@columenlabs/lumen-ui-types/domains';
-import { type FrameChoice, type FrameColumn, type FrameData, type FrameEditInput, type FrameMeta, type YourColumn } from '@columenlabs/lumen-ui-types/frames';
+import { type FrameChoice, type FrameColumn, type FrameData, type FrameEditInput, type FrameMeta, type FrameScript, type YourColumn } from '@columenlabs/lumen-ui-types/frames';
 import { type CustomViewConfig } from '@columenlabs/lumen-ui-types/views';
 import { type ReactNode } from 'react';
 import { type ConnectedDomain } from './connections.js';
@@ -88,6 +88,12 @@ export declare const frameGroupId: typeof recipeId;
 export declare function useDraftFrames<T>(domain: ViewDomain<T>, ids: readonly string[]): ViewDomain<T>;
 /** The person's linked frames (recipes) a card can attach, for Edit widget's + Data. */
 export declare function useFrameChoices(enabled: boolean): import("@tanstack/react-query").UseQueryResult<FrameChoice[], Error>;
+/** Makes a frame from one of the product's recipes (+ Data's app recipes), or reuses the one that
+ * already runs it, and lists it with the person's frames. */
+export declare function useMakeFrame(): import("@tanstack/react-query").UseMutationResult<FrameChoice, Error, {
+    name: string;
+    recipe: FrameScript;
+}, unknown>;
 /** A row of plain cells, as a link to a catalog domain or a recipe reads it. */
 type CellRow = Record<string, ViewCellValue>;
 interface PlainColumn {

package/dist/joins.js

@@ -375,6 +375,20 @@ export function useFrameChoices(enabled) {
         staleTime: 30_000,
     });
 }
+/** Makes a frame from one of the product's recipes (+ Data's app recipes), or reuses the one that
+ * already runs it, and lists it with the person's frames. */
+export function useMakeFrame() {
+    const api = useAssistant()?.api ?? null;
+    const qc = useQueryClient();
+    return useMutation({
+        mutationFn: (r) => json(`${api}/frames`, {
+            method: 'POST',
+            headers: { 'content-type': 'application/json', accept: 'application/json' },
+            body: JSON.stringify(r),
+        }),
+        onSuccess: () => void qc.invalidateQueries({ queryKey: [...WORKSPACES_KEY, api, 'frames'] }),
+    });
+}
 const titled = (k) => (k.charAt(0).toUpperCase() + k.slice(1)).replace(/_/g, ' ');
 /** Plain rows as a domain: a field per column, and the keys (symbol, account) a column carries. */
 export function rowsDomain(id, columns, keys) {

package/dist/lumen-widget.js

@@ -1,4 +1,5 @@
 import { Fragment as _Fragment, jsx as _jsx, jsxs as _jsxs } from "react/jsx-runtime";
+import { FRAME_LINK } from '@columenlabs/lumen-ui-types/catalog';
 import { OUTLOOK_INDEXES } from '@columenlabs/lumen-ui-types/market';
 // LumenSavedWidget (as blocks; renamed): a page (LumenLayout) is an ordered list of cards, each a third, half, two thirds or the full width.
 // A card is the view (LumenView) or a widget. Chart and top-N widgets read every row of the view
@@ -39,7 +40,7 @@ import { Table, TableBody, TableCell, TableHead, TableHeader, TableRow } from '.
 import { Tabs, TabsContent, TabsList, TabsTrigger } from './ui/tabs.js';
 import { Tooltip, TooltipContent, TooltipTrigger } from './ui/tooltip.js';
 import { computedOf } from './view-model.js';
-import { PAGE_SOURCE, useWidgetDataOptions } from './widget-data.js';
+import { MAKE_RECIPE, PAGE_SOURCE, useMakeRecipe, useWidgetDataOptions } from './widget-data.js';
 import { COMPACT, MINUS } from './widget-values.js';
 // Loaded when it first shows (lazy-part.tsx).
 const MarketWidget = lazyPart(() => import('./market/market-widget.js').then((m) => m.MarketWidget), _jsx(Skeleton, { className: "h-full min-h-40 w-full" }));
@@ -394,6 +395,14 @@ export function AddWidgetDialog({ open, onOpenChange, domain, cards, onAdd, onBu
     useEffect(() => setData(PAGE_SOURCE), [open]);
     const pageLabel = `${name} (this page)`;
     const dataOptions = useWidgetDataOptions(open, pageLabel);
+    // A product recipe not made yet pulls its rows once, then is the widget's data.
+    const maker = useMakeRecipe();
+    const pickData = (v) => v.startsWith(MAKE_RECIPE)
+        ? void maker.run(v).then((f) => {
+            if (f)
+                setData(`${FRAME_LINK}${f.id}`);
+        })
+        : setData(v);
     const own = data !== PAGE_SOURCE;
     const ids = useMemo(() => (own ? [data] : []), [own, data]);
     const read = useDomainReads(ids, ids)[data];
@@ -404,7 +413,7 @@ export function AddWidgetDialog({ open, onOpenChange, domain, cards, onAdd, onBu
     const hasRow = !own && cards.some(isRowCard);
     const full = cards.length >= 12;
     const offered = useOffered(shapeDomain);
-    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-2xl", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: "Add widget" }), _jsxs(DialogDescription, { children: ["Pick its data, then its shape", full ? '. A page holds 12 cards at most.' : '.'] })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "add-widget-data", className: "text-xs font-medium text-muted-foreground", children: "Data" }), _jsx(LumenSelector, { id: "add-widget-data", icon: DatabaseIcon, label: "Widget data", search: true, value: data, options: dataOptions, onChange: setData }), own && read?.state !== 'ok' && (_jsx("p", { className: cn('text-xs', read?.state === 'loading' || !read ? 'text-muted-foreground' : 'text-destructive'), children: read?.state === 'loading' || !read
+    return (_jsx(Dialog, { open: open, onOpenChange: onOpenChange, children: _jsxs(DialogContent, { className: "sm:max-w-2xl", children: [_jsxs(DialogHeader, { children: [_jsx(DialogTitle, { children: "Add widget" }), _jsxs(DialogDescription, { children: ["Pick its data, then its shape", full ? '. A page holds 12 cards at most.' : '.'] })] }), _jsxs("div", { className: "flex flex-col gap-1.5", children: [_jsx(Label, { htmlFor: "add-widget-data", className: "text-xs font-medium text-muted-foreground", children: "Data" }), _jsx(LumenSelector, { id: "add-widget-data", icon: DatabaseIcon, label: "Widget data", search: true, value: data, options: dataOptions, onChange: pickData }), own && read?.state !== 'ok' && (_jsx("p", { className: cn('text-xs', read?.state === 'loading' || !read ? 'text-muted-foreground' : 'text-destructive'), children: read?.state === 'loading' || !read
                                 ? 'Reading its fields…'
                                 : (read.detail ?? 'Its rows could not be read.') }))] }), _jsxs(Tabs, { defaultValue: catalog.length ? 'prebuilt' : 'own', children: [_jsxs(TabsList, { children: [!own && (_jsxs(TabsTrigger, { value: "prebuilt", children: [_jsx(PackageIcon, {}), "Pre-built"] })), _jsxs(TabsTrigger, { value: "own", children: [_jsx(WrenchIcon, {}), "Build your own"] })] }), _jsx(TabsContent, { value: "prebuilt", className: dialogBody, children: catalog.length ? (_jsx("div", { className: "grid grid-cols-1 gap-2 sm:grid-cols-2", children: catalog.map((it) => {
                                     const added = cards.some((b) => b.id === it.widget.id);

package/dist/view-editor.js

@@ -46,7 +46,7 @@ import { AGG_LABELS, FORMAT_LABELS, FormatChip, FormulaForm, MAX_FORMULAS, field
 import { shapeIcon } from './view-icons.js';
 import { FORMULAS_GROUP, canFilter, chipsOf, formulaBlanks, formulasOf, groupOf, hiddenOf, subgroupLabel, subgroupOf, subgroupsOf, summaryCash, takesFormulas, tilesOf, totalAggOf, withViewFields, } from './view-model.js';
 import { WidgetControlsEditor } from './widget-controls.js';
-import { PAGE_SOURCE, useWidgetDataOptions } from './widget-data.js';
+import { MAKE_RECIPE, PAGE_SOURCE, recipeOptions, useMakeRecipe, useWidgetDataOptions, } from './widget-data.js';
 import { EditorRow as Row, WidgetFields, WidgetSettings, hasWidgetSettings, readsRows, slotKeys, widgetSlots, } from './widget-settings.js';
 import { widgetThumb } from './widget-thumbs.js';
 /** The field's own group and Total rows: a formula over the rolled-up inputs, or a share. */
@@ -246,6 +246,13 @@ export function ViewEditDialog({ open, onOpenChange, domain: pageDomain, config,
     const byKey = (f) => !!f.key && !!base.keys?.[f.key];
     const recipes = (choices.data ?? []).filter((f) => !frameIds.includes(f.id) && !connections.some((c) => c.to === `${FRAME_LINK}${f.id}`));
     const addRecipe = (f) => (byKey(f) ? addFrame(f) : link(`${FRAME_LINK}${f.id}`, []));
+    // The product's recipes not made yet, by app: picking one pulls its rows once, then links them.
+    const maker = useMakeRecipe();
+    const templates = recipeOptions(maker.recipes, choices.data ?? []);
+    const makeRecipe = (v) => void maker.run(v).then((f) => {
+        if (f)
+            addRecipe(f);
+    });
     const addFrame = (f) => setDraft({
         ...draft,
         frames: [...frameIds, f.id],
@@ -625,7 +632,12 @@ export function ViewEditDialog({ open, onOpenChange, domain: pageDomain, config,
                 label: mainLabel,
                 empty: source === '',
                 options: mainOptions,
-                onPick: pickMain,
+                onPick: (to) => to.startsWith(MAKE_RECIPE)
+                    ? void maker.run(to).then((f) => {
+                        if (f)
+                            pickMain(`${FRAME_LINK}${f.id}`);
+                    })
+                    : pickMain(to),
                 onDrop: dropMain,
                 onClear: clearAll,
                 onMakeMain: makeMain,
@@ -635,7 +647,7 @@ export function ViewEditDialog({ open, onOpenChange, domain: pageDomain, config,
             fieldsOf: (to) => allRead[to]?.domain.fields ?? [],
             onOf: (to) => connections.find((c) => c.to === to)?.on ?? [],
             set: setPairs,
-        }, deskLabel: app?.label ?? null, recipes: recipes, recipeNote: choices.isError ? `Recipes did not load: ${choices.error.message}` : null, onAddRecipe: addRecipe, recipeByKey: byKey, onRemoveRecipe: card ? dropRecipe : removeFrame, onNewRecipe: askRecipe })) : (_jsx("p", { className: "px-1.5 text-sm text-muted-foreground", children: widget?.kind === 'chart' && (widget.style === 'price' || widget.style === 'market')
+        }, deskLabel: app?.label ?? null, recipes: recipes, recipeNote: choices.isError ? `Recipes did not load: ${choices.error.message}` : null, onAddRecipe: addRecipe, templates: templates, onMakeRecipe: makeRecipe, making: maker.pending, recipeByKey: byKey, onRemoveRecipe: card ? dropRecipe : removeFrame, onNewRecipe: askRecipe })) : (_jsx("p", { className: "px-1.5 text-sm text-muted-foreground", children: widget?.kind === 'chart' && (widget.style === 'price' || widget.style === 'market')
             ? 'This chart reads its symbols, not fields.'
             : 'This widget takes no fields.' }));
     const treeHint = widget ? (slot && (_jsxs("div", { className: "flex flex-col gap-2 px-1.5 pb-2", children: [slots.length > 1 && (_jsx(ToggleGroup, { type: "single", variant: "outline", size: "sm", spacing: 0, className: "justify-self-start", "aria-label": "Fill", value: slot.id, onValueChange: (v) => v && setSlotId(v), children: slots.map((s) => (_jsx(ToggleGroupItem, { value: s.id, className: "px-2.5", children: s.label }, s.id))) })), _jsx("p", { className: "text-xs text-muted-foreground", children: slot.max === 1
@@ -718,7 +730,7 @@ function LinkPairs({ label, on, cardFields, fields, onChange, }) {
     const row = (p, i) => (_jsxs("div", { className: "flex min-w-0 items-center gap-1", children: [_jsx(LumenSelector, { label: "This card's field", size: "sm", className: "min-w-0 flex-1", placeholder: "This card", search: true, value: p.from || null, options: mine, onChange: (v) => put({ ...p, from: v }, i) }), _jsx("span", { className: "text-xs text-muted-foreground", children: "=" }), _jsx(LumenSelector, { label: `${label}'s field`, size: "sm", className: "min-w-0 flex-1", placeholder: theirs.length ? label : 'Loading…', search: true, disabled: !theirs.length, value: p.to || null, options: theirs, onChange: (v) => put({ ...p, to: v }, i) }), i !== null && (_jsx(IconButton, { icon: XIcon, size: "icon-xs", label: "Remove this pair", onClick: () => onChange(on.filter((_, j) => j !== i)) }))] }, i ?? 'new'));
     return (_jsxs("div", { className: "flex flex-col gap-1 px-1 py-1", children: [on.map((p, i) => row(p, i)), open && row(open, null), !open && on.length < MAX_PAIRS && (_jsxs(Button, { size: "xs", variant: "ghost", className: "self-start text-primary", onClick: () => setPart({ from: '', to: '' }), children: [_jsx(PlusIcon, {}), "Field pair"] }))] }));
 }
-function FieldTree({ domain, draft, picked, onPick, why, formulaProblems, onEditFormula, onRemoveFormula, onAddFormula, deskDomains = [], onLink, onUnlink, deskLabel, recipes = [], recipeNote, onAddRecipe, recipeByKey = () => false, onRemoveRecipe, onNewRecipe, linkPairs, main, }) {
+function FieldTree({ domain, draft, picked, onPick, why, formulaProblems, onEditFormula, onRemoveFormula, onAddFormula, deskDomains = [], onLink, onUnlink, deskLabel, recipes = [], recipeNote, onAddRecipe, templates = [], onMakeRecipe, making = false, recipeByKey = () => false, onRemoveRecipe, onNewRecipe, linkPairs, main, }) {
     const assistantName = useAssistantName();
     const [query, setQuery] = useState('');
     // New recipe's box, open while not null.
@@ -753,6 +765,9 @@ function FieldTree({ domain, draft, picked, onPick, why, formulaProblems, onEdit
                     : {}),
             }))
             : []),
+        ...(onMakeRecipe
+            ? templates.map((o) => (making ? { ...o, disabled: 'Pulling rows…' } : o))
+            : []),
         ...(onNewRecipe
             ? [
                 {
@@ -768,6 +783,8 @@ function FieldTree({ domain, draft, picked, onPick, why, formulaProblems, onEdit
     const addData = (v) => {
         if (v === 'new')
             setWish('');
+        else if (v.startsWith(MAKE_RECIPE))
+            onMakeRecipe?.(v);
         else if (v.startsWith('link:')) {
             const d = deskDomains.find((x) => `link:${x.id}` === v);
             if (d && !d.why)

package/dist/widget-data.d.ts

@@ -1,4 +1,19 @@
+import type { FrameChoice } from '@columenlabs/lumen-ui-types/frames';
 import type { LumenOption } from './lumen-selector.js';
+import { type WorkspaceRecipe } from './workspaces-config.js';
 /** The page's own rows, as a data option's value. */
 export declare const PAGE_SOURCE = "_page";
+/** A product recipe not made yet, as a data option's value: picking it runs it once. */
+export declare const MAKE_RECIPE = "make:";
+/**
+ * The product's recipes (WorkspacesProvider `recipes`) the person has no frame of yet, as options
+ * grouped by the app they read. A recipe already made shows once, as the person's recipe.
+ */
+export declare function recipeOptions(recipes: readonly WorkspaceRecipe[], made: readonly FrameChoice[]): LumenOption[];
+/** Turns a picked product recipe into its frame (made once, then reused). */
+export declare function useMakeRecipe(): {
+    run: (value: string) => Promise<FrameChoice | null>;
+    pending: boolean;
+    recipes: WorkspaceRecipe[];
+};
 export declare function useWidgetDataOptions(enabled: boolean, pageLabel: string): LumenOption[];

package/dist/widget-data.js

@@ -1,14 +1,55 @@
 // The data a widget can take as its main data: this page's rows, the app's live domains with a
-// reader, and the person's recipes. Add widget's first step and Edit widget ▸ Data both pick from it.
+// reader, the person's recipes, and the product's recipes not yet made (by app). Add widget's
+// first step and Edit widget ▸ Data both pick from it.
 import { CATALOG, FRAME_LINK, catalogKeys, readableDomain, } from '@columenlabs/lumen-ui-types/catalog';
 import { DatabaseIcon, SparklesIcon, TableIcon } from 'lucide-react';
-import { asOf, useFrameChoices } from './joins.js';
+import { asOf, useFrameChoices, useMakeFrame } from './joins.js';
+import { lumenToast } from './lumen-toast.js';
 import { useApp } from './shell.js';
+import { useWorkspacesConfig } from './workspaces-config.js';
 /** The page's own rows, as a data option's value. */
 export const PAGE_SOURCE = '_page';
+/** A product recipe not made yet, as a data option's value: picking it runs it once. */
+export const MAKE_RECIPE = 'make:';
+/**
+ * The product's recipes (WorkspacesProvider `recipes`) the person has no frame of yet, as options
+ * grouped by the app they read. A recipe already made shows once, as the person's recipe.
+ */
+export function recipeOptions(recipes, made) {
+    const names = new Set(made.map((f) => f.name));
+    return recipes
+        .filter((r) => !names.has(r.label))
+        .map((r) => ({
+        value: `${MAKE_RECIPE}${r.id}`,
+        label: r.label,
+        group: r.group ?? 'Recipes',
+        ...(r.description ? { detail: r.description } : {}),
+        icon: r.icon ?? SparklesIcon,
+        keywords: [r.group ?? '', r.description ?? ''],
+    }));
+}
+/** Turns a picked product recipe into its frame (made once, then reused). */
+export function useMakeRecipe() {
+    const { recipes = [] } = useWorkspacesConfig();
+    const make = useMakeFrame();
+    const run = async (value) => {
+        const r = recipes.find((x) => `${MAKE_RECIPE}${x.id}` === value);
+        if (!r)
+            return null;
+        try {
+            return await make.mutateAsync({ name: r.label, recipe: r.recipe });
+        }
+        catch (e) {
+            lumenToast.error(`Couldn’t pull ${r.label}: ${e.message}`);
+            return null;
+        }
+    };
+    return { run, pending: make.isPending, recipes };
+}
 export function useWidgetDataOptions(enabled, pageLabel) {
     const app = useApp();
     const choices = useFrameChoices(enabled);
+    const { recipes = [] } = useWorkspacesConfig();
     return [
         { value: PAGE_SOURCE, label: pageLabel, group: 'This page', icon: TableIcon },
         ...Object.entries(CATALOG)
@@ -28,5 +69,6 @@ export function useWidgetDataOptions(enabled, pageLabel) {
             detail: asOf(f.at),
             icon: SparklesIcon,
         })),
+        ...recipeOptions(recipes, choices.data ?? []),
     ];
 }

package/dist/workspaces-config.d.ts

@@ -0,0 +1,46 @@
+import type { FrameScript } from '@columenlabs/lumen-ui-types/frames';
+import type { CustomViewConfig } from '@columenlabs/lumen-ui-types/views';
+import { type ComponentType } from 'react';
+type Icon = ComponentType<{
+    className?: string;
+}>;
+/** An app a workspace can belong to (the product's apps). */
+export interface WorkspaceApp {
+    id: string;
+    label: string;
+    /** Its address; a workspace there is at `${href}workspaces/<id>`. */
+    href: string;
+    icon?: Icon;
+}
+/** What the product tells its workspaces; every field may be left out by a one-app product. */
+export interface WorkspacesConfig {
+    /** The apps a workspace may move to that this person can open, this one included. */
+    apps?: WorkspaceApp[];
+    /** What the product calls an app: e.g. `desk`. */
+    appNoun?: string;
+    /** Which app draws a tab over a domain; one it does not say is this app's. */
+    domainApp?: (domain: string) => string | undefined;
+    /** A domain tab's starting layout. */
+    defaultConfig?: (domain: string) => CustomViewConfig | null;
+    /** The empty workspace's example ask, on an app: `put my holdings with their earnings dates in`. */
+    example?: (app: string) => string;
+    /** Recipes a person picks to start a tab by hand (+ in the tab bar); none hides the +. */
+    recipes?: WorkspaceRecipe[];
+}
+/** A saved data pull a person can start a tab from: one call to one of the product's read tools. */
+export interface WorkspaceRecipe {
+    id: string;
+    /** The tab's name and the picker's row: `Jobs scoring 70+`. */
+    label: string;
+    /** When to pick it, under the label. */
+    description?: string;
+    /** The picker's section: the app the rows come from. */
+    group?: string;
+    icon?: Icon;
+    recipe: FrameScript;
+}
+/** The product's apps and domains for its workspaces. */
+export declare const WorkspacesProvider: import("react").Provider<WorkspacesConfig>;
+/** The product's workspace config; empty outside a WorkspacesProvider. */
+export declare const useWorkspacesConfig: () => WorkspacesConfig;
+export {};

package/dist/workspaces-config.js

@@ -0,0 +1,6 @@
+import { createContext, useContext } from 'react';
+const ConfigCtx = createContext({});
+/** The product's apps and domains for its workspaces. */
+export const WorkspacesProvider = ConfigCtx.Provider;
+/** The product's workspace config; empty outside a WorkspacesProvider. */
+export const useWorkspacesConfig = () => useContext(ConfigCtx);

package/dist/workspaces.d.ts

@@ -1,47 +1,8 @@
-import { type FrameScript } from '@columenlabs/lumen-ui-types/frames';
 import { type CustomViewConfig } from '@columenlabs/lumen-ui-types/views';
-import { type ComponentType, type ReactNode } from 'react';
+import { type ReactNode } from 'react';
 import { type Crumb } from './page.js';
-type Icon = ComponentType<{
-    className?: string;
-}>;
-/** An app a workspace can belong to (the product's apps). */
-export interface WorkspaceApp {
-    id: string;
-    label: string;
-    /** Its address; a workspace there is at `${href}workspaces/<id>`. */
-    href: string;
-    icon?: Icon;
-}
-/** What the product tells its workspaces; every field may be left out by a one-app product. */
-export interface WorkspacesConfig {
-    /** The apps a workspace may move to that this person can open, this one included. */
-    apps?: WorkspaceApp[];
-    /** What the product calls an app: e.g. `desk`. */
-    appNoun?: string;
-    /** Which app draws a tab over a domain; one it does not say is this app's. */
-    domainApp?: (domain: string) => string | undefined;
-    /** A domain tab's starting layout. */
-    defaultConfig?: (domain: string) => CustomViewConfig | null;
-    /** The empty workspace's example ask, on an app: `put my holdings with their earnings dates in`. */
-    example?: (app: string) => string;
-    /** Recipes a person picks to start a tab by hand (+ in the tab bar); none hides the +. */
-    recipes?: WorkspaceRecipe[];
-}
-/** A saved data pull a person can start a tab from: one call to one of the product's read tools. */
-export interface WorkspaceRecipe {
-    id: string;
-    /** The tab's name and the picker's row: `Jobs scoring 70+`. */
-    label: string;
-    /** When to pick it, under the label. */
-    description?: string;
-    /** The picker's section: the app the rows come from. */
-    group?: string;
-    icon?: Icon;
-    recipe: FrameScript;
-}
-/** The product's apps and domains for its workspaces. */
-export declare const WorkspacesProvider: import("react").Provider<WorkspacesConfig>;
+export { WorkspacesProvider } from './workspaces-config.js';
+export type { WorkspaceApp, WorkspaceRecipe, WorkspacesConfig } from './workspaces-config.js';
 /**
  * Workspaces in the sidebar: one item per workspace, newest first; `+` starts an empty one, the
  * trash icon deletes one (its frames stay until no tab shows them). Hidden where the app has no
@@ -69,4 +30,3 @@ export interface WorkspaceDraftProps {
 export declare function WorkspacePage({ draft }: {
     draft?: (p: WorkspaceDraftProps) => ReactNode;
 }): import("react").JSX.Element;
-export {};

package/dist/workspaces.js

@@ -5,7 +5,7 @@ import { workspacePath, } from '@columenlabs/lumen-ui-types/workspaces';
 import { useMutation, useQuery, useQueryClient } from '@tanstack/react-query';
 import { useNavigate, useParams, useSearch } from '@tanstack/react-router';
 import { ArrowRightLeftIcon, CalendarIcon, ExternalLinkIcon, HashIcon, LayersIcon, PencilIcon, PlusIcon, RefreshCwIcon, SparklesIcon, TableIcon, TextCursorInputIcon, Trash2Icon, TypeIcon, } from 'lucide-react';
-import { createContext, useContext, useEffect, useMemo, useState, } from 'react';
+import { useEffect, useMemo, useState } from 'react';
 import { apiJson } from './api-fetch.js';
 import { useAssistant, useAssistantName, useAssistantPending } from './assistant-context.js';
 import { useAssistantWorkspace } from './assistant-screen.js';
@@ -38,9 +38,8 @@ import { Dialog, DialogContent, DialogDescription, DialogFooter, DialogHeader, D
 import { Input } from './ui/input.js';
 import { iconOf } from './view-icons.js';
 import { WORKSPACES_KEY, frameKey, workspacesListQuery } from './workspace-keys.js';
-const ConfigCtx = createContext({});
-/** The product's apps and domains for its workspaces. */
-export const WorkspacesProvider = ConfigCtx.Provider;
+import { useWorkspacesConfig, } from './workspaces-config.js';
+export { WorkspacesProvider } from './workspaces-config.js';
 const json = (url, init) => apiJson(url, init, 'workspaces');
 const workspaceQuery = (api, id) => ({
     queryKey: [...WORKSPACES_KEY, api, 'ws', id],
@@ -146,7 +145,7 @@ function WorkspaceBody({ api, w, tab, draft, }) {
     });
     // Move to app: the workspace leaves this app's sidebar for another's.
     const here = useShell().app;
-    const config = useContext(ConfigCtx);
+    const config = useWorkspacesConfig();
     const assistant = useAssistantName();
     const noun = config.appNoun ?? 'app';
     const appOf = (id) => config.apps?.find((a) => a.id === id);

package/package.json

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